@ncino/web-components 13.9.1 → 13.9.2

package/dist/components/tooltip/gator/tooltip.gator.js

@@ -1,7 +1,8 @@
-import{NjcTooltip as f}from"../tooltip.js";import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as a}from"../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/lit-html.js";import{LitElement as m}from"../../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";import{ref as u}from"../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/ref.js";import{customElement as c}from"../../../utils/decorators/custom-element-decorator.js";import h from"../../../packages/web-components/src/components/tooltip/gator/tooltip.gator.scss.js";import g from"../../../packages/web-components/src/components/tooltip/tooltip.scss.js";import b from"../../../packages/styles/dist/tokens/primitive.tokens.css.js";import d from"../../../packages/styles/dist/tokens/semantic.tokens.css.js";import{autoUpdate as _,computePosition as v}from"../../../node_modules/.pnpm/@floating-ui_dom@1.7.5/node_modules/@floating-ui/dom/dist/floating-ui.dom.js";import{unsafeCSS as i}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var O=Object.getOwnPropertyDescriptor,y=(t,o,r,l)=>{for(var e=l>1?void 0:l?O(o,r):o,n=t.length-1,p;n>=0;n--)(p=t[n])&&(e=p(e)||e);return e};let s=class extends f{render(){return a`
-            <div ${u(this._tooltipRef)} class="gator-tooltip ${this.nubbinPositionClass}" role="tooltip" id="${this.tooltipId}">
+import{NjcTooltip as c}from"../tooltip.js";import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as d}from"../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/lit-html.js";import{LitElement as f}from"../../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";import{ref as m}from"../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/ref.js";import{customElement as h}from"../../../utils/decorators/custom-element-decorator.js";import a from"../../../packages/web-components/src/components/tooltip/gator/tooltip.gator.scss.js";import u from"../../../packages/web-components/src/components/tooltip/tooltip.scss.js";import b from"../../../packages/styles/dist/tokens/primitive.tokens.css.js";import g from"../../../packages/styles/dist/tokens/semantic.tokens.css.js";import{autoUpdate as y,computePosition as P}from"../../../node_modules/.pnpm/@floating-ui_dom@1.7.5/node_modules/@floating-ui/dom/dist/floating-ui.dom.js";import{unsafeCSS as p}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var _=Object.getOwnPropertyDescriptor,v=(t,i,e,r)=>{for(var s=r>1?void 0:r?_(i,e):i,n=t.length-1,l;n>=0;n--)(l=t[n])&&(s=l(s)||s);return s};let o=class extends c{constructor(){super(...arguments),this._portaledPopup=null}render(){return d`
+            <div ${m(this._tooltipRef)} class="gator-tooltip ${this.nubbinPositionClass}" role="tooltip" id="${this.tooltipId}">
                 <div class="gator-tooltip-body">
                     <slot></slot>
                 </div>
             </div>
-        `}get xPositionOffset(){return this.placement.includes("left")?-12+this.xOffset:this.placement.includes("right")?12+this.xOffset:0}get yPositionOffset(){return this.placement.includes("top")?-12+this.yOffset:this.placement.includes("bottom")?12+this.yOffset:0}get nubbinPositionClass(){switch(this.placement){case"top":return"gator-tooltip-nubbin_bottom";case"right":return"gator-tooltip-nubbin_left";case"bottom":return"gator-tooltip-nubbin_top";case"left":return"gator-tooltip-nubbin_right"}return""}assignPosition(){const t=this.referenceElement;!this._tooltipRef||!this._tooltipRef.value||!t||(this._cleanup=_(t,this._tooltipRef.value,async()=>{if(!this._tooltipRef||!this._tooltipRef.value||!t)return;const{x:o,y:r}=await v(t,this._tooltipRef.value,{placement:this.placement});Object.assign(this._tooltipRef.value.style,{left:`${o+this.xPositionOffset}px`,top:`${r+this.yPositionOffset}px`})}))}};s.shadowRootOptions={...m.shadowRootOptions,delegatesFocus:!0,mode:"open"};s.styles=[i(h),i(g),i(b),i(d)];s=y([c("ngc-tooltip")],s);export{s as NgcTooltip};
+        `}get xPositionOffset(){return this.placement.includes("left")?-12+this.xOffset:this.placement.includes("right")?12+this.xOffset:0}get yPositionOffset(){return this.placement.includes("top")?-12+this.yOffset:this.placement.includes("bottom")?12+this.yOffset:0}get nubbinPositionClass(){switch(this.placement){case"top":return"gator-tooltip-nubbin_bottom";case"right":return"gator-tooltip-nubbin_left";case"bottom":return"gator-tooltip-nubbin_top";case"left":return"gator-tooltip-nubbin_right"}return""}getActivePopup(){return this._portaledPopup??this._tooltipRef.value??null}preparePopupForShow(){const t=this._tooltipRef.value;if(!t)return;if(!o.portalStylesInjected){const e=document.createElement("style");e.setAttribute("data-ngc-tooltip-portal",""),e.textContent=`${a}
+${u}`,document.head.appendChild(e),o.portalStylesInjected=!0}t.parentElement!==document.body&&document.body.appendChild(t),this._portaledPopup=t,t.style.width="max-content",t.querySelector(".gator-tooltip-body")?.replaceChildren(...Array.from(this.childNodes).map(e=>e.cloneNode(!0)))}cleanupPopupAfterHide(){this._cleanup&&(this._cleanup(),this._cleanup=void 0);const t=this._portaledPopup;t?.parentElement===document.body&&this.renderRoot.appendChild(t),this._portaledPopup=null}disconnectedCallback(){this._portaledPopup?.remove(),this._portaledPopup=null,super.disconnectedCallback()}assignPosition(){const t=this.referenceElement,i=this.getActivePopup();!t||!i||(this._cleanup?.(),this._cleanup=y(t,i,async()=>{const e=this.referenceElement,r=this.getActivePopup();if(!e||!r)return;const{x:s,y:n}=await P(e,r,{placement:this.placement,strategy:"fixed"});Object.assign(r.style,{position:"fixed",left:`${s+this.xPositionOffset}px`,top:`${n+this.yPositionOffset}px`,right:"auto",bottom:"auto"})}))}};o.portalStylesInjected=!1;o.shadowRootOptions={...f.shadowRootOptions,delegatesFocus:!0,mode:"open"};o.styles=[p(a),p(u),p(b),p(g)];o=v([h("ngc-tooltip")],o);export{o as NgcTooltip};

package/dist/components/tooltip/tooltip.js

@@ -1 +1 @@
-import{property as o}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{createRef as c}from"../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/ref.js";import{KEY_CONSTANTS as f}from"../../consts/key-constants.js";import{generateRandomId as u}from"../../utils/string-utils.js";import{TestableLitElement as p}from"../../utils/components/testable-lit-element/testable-lit-element.js";import{handleDataTestid as h}from"../../utils/datatestid-utils.js";import{getFirstFocusableElement as _}from"../../utils/accessibility-utils.js";var m=Object.defineProperty,n=(a,e,t,s)=>{for(var i=void 0,r=a.length-1,d;r>=0;r--)(d=a[r])&&(i=d(e,t,i)||i);return i&&m(e,t,i),i};const v=100;class l extends p{constructor(){super(...arguments),this.referenceId="",this.placement="top-end",this.xOffset=0,this.yOffset=0,this.isLabel=!1,this._tooltipRef=c(),this._forceOpen=!1,this._initialized=!1,this._boundReferenceElement=null,this.elementListeners=new WeakMap,this.tooltipId=u()}firstUpdated(){this.hideTooltip(),this._tryInitialize()}updated(e){super.updated(e),(e.has("referenceId")||e.has("isLabel"))&&this._teardown(),this._initialized||this._tryInitialize()}get referenceElement(){if(!this.referenceId)return null;let e=this.parentElement?.querySelector(`#${this.referenceId}`);return e||(e=document.getElementById(this.referenceId)),e||(e=document.querySelector(`[data-id="${this.referenceId}"]`)?.shadowRoot?.querySelector(`#${this.referenceId}`)),e||(e=this.getRootNode().querySelector?.(`#${this.referenceId}`)),!e&&this.previousElementSibling&&this.previousElementSibling.id===this.referenceId&&(e=this.previousElementSibling),e}_tryInitialize(){if(this._initialized||!this.referenceId)return;const e=this.referenceElement,t=this._tooltipRef.value;!e||!t||(h(e,this.dataTestid,"trigger"),h(t,this.dataTestid,"tooltip"),this._updateAriaAssociation(e,!0),this._addInteractionEvents(e,t),this._initialized=!0,this._boundReferenceElement=e)}_teardown(){if(!this._initialized)return;this._clearScheduledHide();const e=this._boundReferenceElement,t=this._tooltipRef.value;e&&(this._updateAriaAssociation(e,!1),this.removeAllTrackedEventListeners(e)),t&&this.removeAllTrackedEventListeners(t),this.removeAllTrackedEventListeners(document),this._initialized=!1,this._boundReferenceElement=null}_getAriaTargetElement(e){return e.shadowRoot?.delegatesFocus?_(e):e}_updateAriaAssociation(e,t){const s=this._getAriaTargetElement(e);if(!s)return;if(this.isLabel){const r=s.ariaLabelledByElements??[];s.ariaLabelledByElements=t?[...r,this]:r.filter(d=>d!==this);return}const i=s.ariaDescribedByElements??[];s.ariaDescribedByElements=t?[...i,this]:i.filter(r=>r!==this)}_addInteractionEvents(e,t){const s=()=>{this._clearScheduledHide(),this.showTooltip()};this.addTrackedEventListener(e,"mouseenter",s),this.addTrackedEventListener(e,"mouseleave",()=>this._scheduleHide()),this.addTrackedEventListener(e,"focusin",()=>this.showTooltip()),this.addTrackedEventListener(e,"focusout",()=>this.hideTooltip()),this.addTrackedEventListener(t,"mouseenter",s),this.addTrackedEventListener(t,"mouseleave",()=>this._scheduleHide()),this.addTrackedEventListener(document,"keydown",i=>{i instanceof KeyboardEvent&&i.key===f.ESCAPE&&(this._forceOpen=!1,this.hideTooltip())})}_scheduleHide(){this._clearScheduledHide(),this._hideTimeoutId=setTimeout(()=>this.hideTooltip(),v)}_clearScheduledHide(){this._hideTimeoutId!==void 0&&(clearTimeout(this._hideTimeoutId),this._hideTimeoutId=void 0)}addTrackedEventListener(e,t,s,i={}){this.elementListeners.has(e)||this.elementListeners.set(e,[]),this.elementListeners.get(e).push({eventType:t,listener:s,options:i}),e.addEventListener(t,s,i)}removeAllTrackedEventListeners(e){if(!this.elementListeners.has(e))return;const t=this.elementListeners.get(e);for(const{eventType:s,listener:i,options:r}of t)e.removeEventListener(s,i,r);this.elementListeners.delete(e)}toggleTooltip(){this._forceOpen=!this._forceOpen,this._forceOpen?this.showTooltip():this.hideTooltip()}disconnectedCallback(){this._teardown(),this._cleanup&&this._cleanup(),super.disconnectedCallback()}showTooltip(){this.assignPosition(),this._tooltipRef.value&&(this._tooltipRef.value.style.visibility="visible",this._tooltipRef.value.style.opacity="1")}hideTooltip(){this._forceOpen||(this._clearScheduledHide(),this._tooltipRef.value&&(this._tooltipRef.value.style.visibility="hidden",this._tooltipRef.value.style.opacity="0"))}assignPosition(){}}n([o({attribute:"reference-id"})],l.prototype,"referenceId");n([o()],l.prototype,"placement");n([o({type:Number,attribute:"x-offset"})],l.prototype,"xOffset");n([o({type:Number,attribute:"y-offset"})],l.prototype,"yOffset");n([o({type:Boolean,attribute:"is-label"})],l.prototype,"isLabel");export{l as NjcTooltip};
+import{property as n}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{createRef as c}from"../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/ref.js";import{KEY_CONSTANTS as u}from"../../consts/key-constants.js";import{generateRandomId as f}from"../../utils/string-utils.js";import{TestableLitElement as p}from"../../utils/components/testable-lit-element/testable-lit-element.js";import{handleDataTestid as h}from"../../utils/datatestid-utils.js";import{getFirstFocusableElement as _}from"../../utils/accessibility-utils.js";var v=Object.defineProperty,o=(l,e,t,i)=>{for(var s=void 0,r=l.length-1,a;r>=0;r--)(a=l[r])&&(s=a(e,t,s)||s);return s&&v(e,t,s),s};const m=100;class d extends p{constructor(){super(...arguments),this.referenceId="",this.placement="top-end",this.xOffset=0,this.yOffset=0,this.isLabel=!1,this._tooltipRef=c(),this._forceOpen=!1,this._initialized=!1,this._boundReferenceElement=null,this.elementListeners=new WeakMap,this.tooltipId=f()}firstUpdated(){this.hideTooltip(),this._tryInitialize(),this._observeReferenceAvailability()}updated(e){super.updated(e),(e.has("referenceId")||e.has("isLabel"))&&(this._disconnectReferenceObserver(),this._teardown()),this._initialized||(this._tryInitialize(),this._observeReferenceAvailability())}get referenceElement(){if(!this.referenceId)return null;const e=this.previousElementSibling;if(e?.id===this.referenceId)return e;const t=`[id="${CSS.escape(this.referenceId)}"]`;let i=this.parentElement?.querySelector(t);return i||(i=document.getElementById(this.referenceId)),i||(i=document.querySelector(`[data-id="${CSS.escape(this.referenceId)}"]`)?.shadowRoot?.querySelector(t)),i||(i=this.getRootNode().querySelector?.(t)),i}_observeReferenceAvailability(){if(this._initialized||!this.referenceId||this._initObserver)return;const e=this.parentElement??document.body;this._initObserver=new MutationObserver(()=>{if(this._initialized){this._disconnectReferenceObserver();return}this._tryInitialize()}),this._initObserver.observe(e,{attributes:!0,attributeFilter:["id"],childList:!0,subtree:!0})}_disconnectReferenceObserver(){this._initObserver?.disconnect(),this._initObserver=void 0}_tryInitialize(){if(this._initialized||!this.referenceId)return;const e=this.referenceElement,t=this._tooltipRef.value;!e||!t||(h(e,this.dataTestid,"trigger"),h(t,this.dataTestid,"tooltip"),this._updateAriaAssociation(e,!0),this._addInteractionEvents(e,t),this._initialized=!0,this._boundReferenceElement=e,this._disconnectReferenceObserver())}_teardown(){if(!this._initialized)return;this._clearScheduledHide();const e=this._boundReferenceElement,t=this._tooltipRef.value;e&&(this._updateAriaAssociation(e,!1),this.removeAllTrackedEventListeners(e)),t&&this.removeAllTrackedEventListeners(t),this.removeAllTrackedEventListeners(document),this._initialized=!1,this._boundReferenceElement=null}_getAriaTargetElement(e){return e.shadowRoot?.delegatesFocus?_(e):e}_updateAriaAssociation(e,t){const i=this._getAriaTargetElement(e);if(!i)return;if(this.isLabel){const r=i.ariaLabelledByElements??[];i.ariaLabelledByElements=t?[...r,this]:r.filter(a=>a!==this);return}const s=i.ariaDescribedByElements??[];i.ariaDescribedByElements=t?[...s,this]:s.filter(r=>r!==this)}_addInteractionEvents(e,t){const i=()=>{this._clearScheduledHide(),this.showTooltip()};this.addTrackedEventListener(e,"mouseenter",i),this.addTrackedEventListener(e,"mouseleave",()=>this._scheduleHide()),this.addTrackedEventListener(e,"focusin",()=>this.showTooltip()),this.addTrackedEventListener(e,"focusout",()=>this.hideTooltip()),this.addTrackedEventListener(t,"mouseenter",i),this.addTrackedEventListener(t,"mouseleave",()=>this._scheduleHide()),this.addTrackedEventListener(document,"keydown",s=>{s instanceof KeyboardEvent&&s.key===u.ESCAPE&&(this._forceOpen=!1,this.hideTooltip())})}_scheduleHide(){this._clearScheduledHide(),this._hideTimeoutId=setTimeout(()=>this.hideTooltip(),m)}_clearScheduledHide(){this._hideTimeoutId!==void 0&&(clearTimeout(this._hideTimeoutId),this._hideTimeoutId=void 0)}addTrackedEventListener(e,t,i,s={}){this.elementListeners.has(e)||this.elementListeners.set(e,[]),this.elementListeners.get(e).push({eventType:t,listener:i,options:s}),e.addEventListener(t,i,s)}removeAllTrackedEventListeners(e){if(!this.elementListeners.has(e))return;const t=this.elementListeners.get(e);for(const{eventType:i,listener:s,options:r}of t)e.removeEventListener(i,s,r);this.elementListeners.delete(e)}toggleTooltip(){this._forceOpen=!this._forceOpen,this._forceOpen?this.showTooltip():this.hideTooltip()}disconnectedCallback(){this._disconnectReferenceObserver(),this._teardown(),this._cleanup&&this._cleanup(),super.disconnectedCallback()}getActivePopup(){return this._tooltipRef.value??null}preparePopupForShow(){}cleanupPopupAfterHide(){}showTooltip(){this.preparePopupForShow(),this.assignPosition();const e=this.getActivePopup();e&&(e.style.visibility="visible",e.style.opacity="1")}hideTooltip(){if(this._forceOpen)return;this._clearScheduledHide();const e=this.getActivePopup();e&&(e.style.visibility="hidden",e.style.opacity="0"),this.cleanupPopupAfterHide()}assignPosition(){}}o([n({attribute:"reference-id"})],d.prototype,"referenceId");o([n()],d.prototype,"placement");o([n({type:Number,attribute:"x-offset"})],d.prototype,"xOffset");o([n({type:Number,attribute:"y-offset"})],d.prototype,"yOffset");o([n({type:Boolean,attribute:"is-label"})],d.prototype,"isLabel");export{d as NjcTooltip};

package/dist/packages/web-components/src/components/modal/gator/modal.gator.scss.js

@@ -1 +1 @@
-const a=".gator-modal-dialog{border:none;padding:0;background:transparent;inset:0;display:grid;place-items:center}.gator-modal-dialog::backdrop{background-color:var(--color-overlay-secondary)}.gator-modal{--ngc-card-position: static;--ngc-card-top: auto;--ngc-card-left: auto;--ngc-card-max-width: none;--ngc-card-transform: none}.gator-modal-wrapper{display:flex;flex-direction:column;max-height:90vh;overflow-y:var(--ngc-modal-overflow-y, auto)}.gator-modal-header{flex-shrink:0;display:flex;flex-direction:row;justify-content:space-between;align-items:center;background:var(--color-surface-secondary)}.gator-modal-header .gator-modal-close-button{--ngc-icon-button-hover-box-shadow: none}.gator-modal-content{flex-grow:1;padding:var(--spacing-10) var(--spacing-10) var(--spacing-11) var(--spacing-10);overflow-y:var(--ngc-modal-overflow-y, auto)}.gator-modal-content ngc-skeleton-loader:first-child{--ngc-skeleton-loader-margin: 0 0 var(--spacing-5) 0}.gator-modal-footer{flex-shrink:0;display:flex;padding:var(--spacing-10)}.gator-modal-warning{display:flex;flex-direction:row;align-items:center}.gator-modal-warning ngc-icon{--ngc-icon-color: var(--color-text-error);--ngc-icon-margin: 0 var(--spacing-5) 0 0}.gator-modal-warning ngc-input-label{--ngc-input-label-color: var(--color-text-error);--ngc-input-label-font-size: var(--font-size-body-2);--ngc-input-label-line-height: var(--line-height-body-2)}.gator-modal-action-buttons{display:flex;gap:var(--spacing-5)}.gator-modal ngc-card-header{width:100%}.gator-modal--small{--ngc-card-width: var(--ngc-modal-width, 375px);--ngc-card-border-radius: var(--border-radius-medium)}.gator-modal--small .gator-modal-header{border-radius:var(--border-radius-medium) var(--border-radius-medium) 0 0}.gator-modal--small .gator-modal-content{padding:var(--spacing-8) var(--spacing-8) 56px var(--spacing-8)}.gator-modal--small .gator-modal-footer{flex-direction:column-reverse;align-items:center;padding:var(--spacing-8)}.gator-modal--small .gator-modal-warning{margin-top:var(--spacing-10)}.gator-modal--small .gator-modal-action-buttons{flex-direction:column-reverse;width:100%}.gator-modal--small .gator-modal-action-buttons ngc-button{--ngc-button-width: 100% }.gator-modal--standard{--ngc-card-width: var(--ngc-modal-width, 600px)}.gator-modal--standard .gator-modal-header{--ngc-card-header-padding: var(--spacing-10);border-radius:var(--border-radius-x-large) var(--border-radius-x-large) 0 0}.gator-modal--standard .gator-modal-footer{flex-direction:row}.gator-modal--standard .gator-modal-warning{margin-right:auto}.gator-modal--standard .gator-modal-action-buttons{margin-left:auto}.gator-modal--standard .gator-modal-action-buttons ngc-skeleton-loader:first-child{--ngc-skeleton-loader-margin: 0 var(--spacing-5) 0 0}.gator-modal--fullscreen{--ngc-card-border-radius: var(--border-radius-no-radius)}.gator-modal--fullscreen .gator-modal-wrapper{height:100vh;width:100vw;max-height:100vh}.gator-modal--fullscreen .gator-modal-header{--ngc-card-header-padding: var(--spacing-10);padding-left:48px}.gator-modal--fullscreen .gator-modal-header ngc-card-header{justify-content:center;--ngc-text-detail-content-alignment: center}.gator-modal--fullscreen .gator-modal-content{background:var(--color-surface-secondary)}.gator-modal--fullscreen .gator-modal-footer{flex-direction:column-reverse;justify-content:center;align-items:center;border-top:1px solid var(--color-border-tertiary)}.gator-modal--fullscreen .gator-modal-warning{margin-top:var(--spacing-5)}.gator-dialog--fullscreen{max-height:100%;max-width:100%;margin:0}";export{a as default};
+const a=".gator-modal-dialog{border:none;padding:0;background:transparent;inset:0;display:grid;place-items:center;overflow:hidden}.gator-modal-dialog::backdrop{background-color:var(--color-overlay-secondary)}.gator-modal{--ngc-card-position: static;--ngc-card-top: auto;--ngc-card-left: auto;--ngc-card-max-width: none;--ngc-card-transform: none}.gator-modal-wrapper{display:flex;flex-direction:column;max-height:90vh;min-height:0;overflow-y:hidden}.gator-modal-header{flex-shrink:0;display:flex;flex-direction:row;justify-content:space-between;align-items:center;background:var(--color-surface-secondary)}.gator-modal-header .gator-modal-close-button{--ngc-icon-button-hover-box-shadow: none}.gator-modal-content{flex-grow:1;min-height:0;padding:var(--spacing-10) var(--spacing-10) var(--spacing-11) var(--spacing-10);overflow-y:var(--ngc-modal-overflow-y, auto)}.gator-modal-content ngc-skeleton-loader:first-child{--ngc-skeleton-loader-margin: 0 0 var(--spacing-5) 0}.gator-modal-footer{flex-shrink:0;display:flex;padding:var(--spacing-10)}.gator-modal-warning{display:flex;flex-direction:row;align-items:center}.gator-modal-warning ngc-icon{--ngc-icon-color: var(--color-text-error);--ngc-icon-margin: 0 var(--spacing-5) 0 0}.gator-modal-warning ngc-input-label{--ngc-input-label-color: var(--color-text-error);--ngc-input-label-font-size: var(--font-size-body-2);--ngc-input-label-line-height: var(--line-height-body-2)}.gator-modal-action-buttons{display:flex;gap:var(--spacing-5)}.gator-modal ngc-card-header{width:100%}.gator-modal--small{--ngc-card-width: var(--ngc-modal-width, 375px);--ngc-card-border-radius: var(--border-radius-medium)}.gator-modal--small .gator-modal-header{border-radius:var(--border-radius-medium) var(--border-radius-medium) 0 0}.gator-modal--small .gator-modal-content{padding:var(--spacing-8) var(--spacing-8) 56px var(--spacing-8)}.gator-modal--small .gator-modal-footer{flex-direction:column-reverse;align-items:center;padding:var(--spacing-8)}.gator-modal--small .gator-modal-warning{margin-top:var(--spacing-10)}.gator-modal--small .gator-modal-action-buttons{flex-direction:column-reverse;width:100%}.gator-modal--small .gator-modal-action-buttons ngc-button{--ngc-button-width: 100% }.gator-modal--standard{--ngc-card-width: var(--ngc-modal-width, 600px)}.gator-modal--standard .gator-modal-header{--ngc-card-header-padding: var(--spacing-10);border-radius:var(--border-radius-x-large) var(--border-radius-x-large) 0 0}.gator-modal--standard .gator-modal-footer{flex-direction:row}.gator-modal--standard .gator-modal-warning{margin-right:auto}.gator-modal--standard .gator-modal-action-buttons{margin-left:auto}.gator-modal--standard .gator-modal-action-buttons ngc-skeleton-loader:first-child{--ngc-skeleton-loader-margin: 0 var(--spacing-5) 0 0}.gator-modal--fullscreen{--ngc-card-border-radius: var(--border-radius-no-radius)}.gator-modal--fullscreen .gator-modal-wrapper{height:100vh;width:100vw;max-height:100vh}.gator-modal--fullscreen .gator-modal-header{--ngc-card-header-padding: var(--spacing-10);padding-left:48px}.gator-modal--fullscreen .gator-modal-header ngc-card-header{justify-content:center;--ngc-text-detail-content-alignment: center}.gator-modal--fullscreen .gator-modal-content{background:var(--color-surface-secondary)}.gator-modal--fullscreen .gator-modal-footer{flex-direction:column-reverse;justify-content:center;align-items:center;border-top:1px solid var(--color-border-tertiary)}.gator-modal--fullscreen .gator-modal-warning{margin-top:var(--spacing-5)}.gator-dialog--fullscreen{max-height:100%;max-width:100%;margin:0}";export{a as default};

package/dist/packages/web-components/src/components/tooltip/tooltip.scss.js

@@ -1 +1 @@
-const t="div[role=tooltip]{position:absolute;width:max-content;top:0;left:0;z-index:9999;visibility:hidden;opacity:0;transition:opacity .2s}#floating{position:absolute;width:max-content;top:0;left:0;z-index:9999}";export{t as default};
+const t="div[role=tooltip]{position:fixed;width:max-content;top:0;left:0;z-index:9999;visibility:hidden;opacity:0;transition:opacity .2s}#floating{position:absolute;width:max-content;top:0;left:0;z-index:9999}";export{t as default};

package/dist/types/components/tooltip/gator/tooltip.gator.d.ts

@@ -1,5 +1,7 @@
 import { NjcTooltip } from '../tooltip.ts';
 export declare class NgcTooltip extends NjcTooltip {
+    private static portalStylesInjected;
+    private _portaledPopup;
     static shadowRootOptions: {
         delegatesFocus: boolean;
         mode: ShadowRootMode;
@@ -13,5 +15,9 @@ export declare class NgcTooltip extends NjcTooltip {
     get xPositionOffset(): number;
     get yPositionOffset(): number;
     get nubbinPositionClass(): "" | "gator-tooltip-nubbin_bottom" | "gator-tooltip-nubbin_left" | "gator-tooltip-nubbin_top" | "gator-tooltip-nubbin_right";
+    protected getActivePopup(): HTMLElement | null;
+    protected preparePopupForShow(): void;
+    protected cleanupPopupAfterHide(): void;
+    disconnectedCallback(): void;
     assignPosition(): void;
 }

package/dist/types/components/tooltip/tooltip.d.ts

@@ -12,6 +12,7 @@ export declare class NjcTooltip extends TestableLitElement {
     _cleanup: (() => void) | undefined;
     private _forceOpen;
     private _hideTimeoutId;
+    private _initObserver;
     private _initialized;
     private _boundReferenceElement;
     private elementListeners;
@@ -19,6 +20,8 @@ export declare class NjcTooltip extends TestableLitElement {
     firstUpdated(): void;
     updated(changedProperties: PropertyValues): void;
     get referenceElement(): HTMLElement | null;
+    private _observeReferenceAvailability;
+    private _disconnectReferenceObserver;
     private _tryInitialize;
     private _teardown;
     private _getAriaTargetElement;
@@ -30,6 +33,12 @@ export declare class NjcTooltip extends TestableLitElement {
     removeAllTrackedEventListeners(element: HTMLElement | Document): void;
     toggleTooltip(): void;
     disconnectedCallback(): void;
+    /** Popup element used for positioning and visibility. Gator overrides when portaling. */
+    protected getActivePopup(): HTMLElement | null;
+    /** Called before positioning when the popup is shown. */
+    protected preparePopupForShow(): void;
+    /** Called after the popup is hidden. */
+    protected cleanupPopupAfterHide(): void;
     showTooltip(): void;
     hideTooltip(): void;
     /**

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ncino/web-components",
   "author": "nCino",
-  "version": "13.9.1",
+  "version": "13.9.2",
   "license": "(c) Copyright 2023 nCino, Inc., all rights reserved",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -100,10 +100,10 @@
     "vite-plugin-static-copy": "^3.3.0",
     "vitest": "^4.1.0",
     "yaml-eslint-parser": "^2.0.0",
-    "@ncino/styles": "13.9.1"
+    "@ncino/styles": "13.9.2"
   },
   "peerDependencies": {
-    "@ncino/styles": "13.9.1"
+    "@ncino/styles": "13.9.2"
   },
   "bugs": {
     "url": "https://github.com/ncino/force-sdk-web-components/issues"

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@ncino/web-components",
-  "version": "13.9.0",
+  "version": "13.9.1",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -1995,7 +1995,7 @@
         },
         {
           "name": "ngc-tooltip",
-          "description": "\n---\n\n\n### **Methods:**\n - **assignPosition()** - Override this function to use floating UI autoUpdate and computePosition",
+          "description": "\n---\n\n\n### **Methods:**\n \n\n\n- **assignPosition()** - Override this function to use floating UI autoUpdate and computePosition",
           "doc-url": "",
           "attributes": [
             {
@@ -7553,7 +7553,7 @@
         },
         {
           "name": "nsc-tooltip",
-          "description": "\n---\n\n\n### **Methods:**\n - **assignPosition()** - Override this function to use floating UI autoUpdate and computePosition",
+          "description": "\n---\n\n\n### **Methods:**\n - **assignPosition()** - Override this function to use floating UI autoUpdate and computePosition\n\n\n",
           "doc-url": "",
           "attributes": [
             {