@ncino/web-components 13.8.1 → 13.9.1
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.
- package/dist/components/tooltip/tooltip.js +1 -1
- package/dist/packages/web-components/src/components/text-link/gator/text-link.gator.scss.js +1 -1
- package/dist/types/components/tooltip/tooltip.d.ts +16 -4
- package/dist/types/utils/vitest-utils.d.ts +2 -0
- package/dist/utils/storybook-utils.js +1 -1
- package/dist/utils/vitest-utils.js +1 -1
- package/package.json +3 -3
- package/web-types.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{property as
|
|
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};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const o='.gator-text-link{max-width:100%;overflow-wrap:anywhere;display:inline-flex;align-items:center;font-family:var(--ngc-text-link-font-family, var(--font-family-body)),"Open Sans",sans-serif;font-size:var(--ngc-text-link-font-size, var(--font-size-body-2, .9375rem));font-weight:var(--font-weight-regular, 400);line-height:var(--ngc-text-link-line-height, var(--line-height-body-2, 1.375rem));text-decoration:underline;text-decoration-style:var(--ngc-text-link-underline-style, solid);text-decoration-color:var(--ngc-text-link-underline-color, var(--color-underline-primary));text-decoration-thickness:var(--ngc-text-link-underline-size, 1px);text-underline-offset:var(--ngc-text-link-underline-offset, 3px);color:var(--ngc-text-link-color, var(--color-text-brand, #103656))}.gator-text-link ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color, var(--color-icon-brand, #103656));margin-left:.13rem}.gator-text-link:hover:not(.gator-text-link_disabled){color:var(--ngc-text-link-color--hover, var(--color-feedback-brand-secondary));text-decoration-color:var(--ngc-text-link-underline-color--hover, var(--color-underline-brand-secondary))}.gator-text-link:hover:not(.gator-text-link_disabled) ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color--hover, var(--color-icon-brand-secondary))}.gator-text-link:focus-visible{outline:var(--ngc-text-link-outline--focus, 2px solid var(--color-border-neutral, #1F1F1F));outline-offset:2px;color:var(--ngc-text-link-color--focus, var(--color-text-brand, #103656));text-decoration-color:var(--ngc-text-link-underline-color--focus, var(--color-underline-primary))}.gator-text-link:focus-visible ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color--focus, var(--color-icon-brand, #103656))}.gator-text-link:active:not(.gator-text-link_disabled){color:var(--ngc-text-link-color--pressed, var(--color-feedback-brand-tertiary));text-decoration-color:var(--ngc-text-link-underline-color--pressed, var(--color-underline-brand-tertiary))}.gator-text-link:active:not(.gator-text-link_disabled) ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color--pressed, var(--color-icon-brand-tertiary))}.gator-text-link-subtle{color:var(--ngc-text-link-color, var(--color-text-secondary, #6D6D6D));text-decoration-color:var(--ngc-text-link-underline-color, var(--color-underline-primary))}.gator-text-link-subtle ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color, var(--color-icon-secondary, #6D6D6D))}.gator-text-link-subtle:focus-visible{outline:var(--ngc-text-link-outline--focus, 2px solid var(--color-border-neutral, #1F1F1F));outline-offset:2px;color:var(--ngc-text-link-color--focus, var(--color-text-secondary, #6D6D6D));text-decoration-color:var(--ngc-text-link-underline-color--focus, var(--color-underline-primary))}.gator-text-link-subtle:focus-visible ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color--focus, var(--color-icon-brand))}.gator-text-link_disabled{color:var(--ngc-text-link-color--disabled, var(--color-text-disabled));text-decoration-color:var(--ngc-text-link-underline-color--disabled, var(--color-text-disabled));cursor:not-allowed}.gator-text-link_disabled ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color--disabled, var(--color-icon-disabled))}';export{o as default};
|
|
1
|
+
const o='.gator-text-link{max-width:100%;overflow-wrap:anywhere;display:inline-flex;align-items:center;cursor:pointer;font-family:var(--ngc-text-link-font-family, var(--font-family-body)),"Open Sans",sans-serif;font-size:var(--ngc-text-link-font-size, var(--font-size-body-2, .9375rem));font-weight:var(--font-weight-regular, 400);line-height:var(--ngc-text-link-line-height, var(--line-height-body-2, 1.375rem));text-decoration:underline;text-decoration-style:var(--ngc-text-link-underline-style, solid);text-decoration-color:var(--ngc-text-link-underline-color, var(--color-underline-primary));text-decoration-thickness:var(--ngc-text-link-underline-size, 1px);text-underline-offset:var(--ngc-text-link-underline-offset, 3px);color:var(--ngc-text-link-color, var(--color-text-brand, #103656))}.gator-text-link ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color, var(--color-icon-brand, #103656));margin-left:.13rem}.gator-text-link:hover:not(.gator-text-link_disabled){color:var(--ngc-text-link-color--hover, var(--color-feedback-brand-secondary));text-decoration-color:var(--ngc-text-link-underline-color--hover, var(--color-underline-brand-secondary))}.gator-text-link:hover:not(.gator-text-link_disabled) ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color--hover, var(--color-icon-brand-secondary))}.gator-text-link:focus-visible{outline:var(--ngc-text-link-outline--focus, 2px solid var(--color-border-neutral, #1F1F1F));outline-offset:2px;color:var(--ngc-text-link-color--focus, var(--color-text-brand, #103656));text-decoration-color:var(--ngc-text-link-underline-color--focus, var(--color-underline-primary))}.gator-text-link:focus-visible ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color--focus, var(--color-icon-brand, #103656))}.gator-text-link:active:not(.gator-text-link_disabled){color:var(--ngc-text-link-color--pressed, var(--color-feedback-brand-tertiary));text-decoration-color:var(--ngc-text-link-underline-color--pressed, var(--color-underline-brand-tertiary))}.gator-text-link:active:not(.gator-text-link_disabled) ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color--pressed, var(--color-icon-brand-tertiary))}.gator-text-link-subtle{color:var(--ngc-text-link-color, var(--color-text-secondary, #6D6D6D));text-decoration-color:var(--ngc-text-link-underline-color, var(--color-underline-primary))}.gator-text-link-subtle ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color, var(--color-icon-secondary, #6D6D6D))}.gator-text-link-subtle:focus-visible{outline:var(--ngc-text-link-outline--focus, 2px solid var(--color-border-neutral, #1F1F1F));outline-offset:2px;color:var(--ngc-text-link-color--focus, var(--color-text-secondary, #6D6D6D));text-decoration-color:var(--ngc-text-link-underline-color--focus, var(--color-underline-primary))}.gator-text-link-subtle:focus-visible ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color--focus, var(--color-icon-brand))}.gator-text-link_disabled{color:var(--ngc-text-link-color--disabled, var(--color-text-disabled));text-decoration-color:var(--ngc-text-link-underline-color--disabled, var(--color-text-disabled));cursor:not-allowed}.gator-text-link_disabled ngc-icon{--ngc-icon-color: var(--ngc-text-link-icon-color--disabled, var(--color-icon-disabled))}';export{o as default};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Placement } from '@floating-ui/dom';
|
|
2
|
+
import { PropertyValues } from 'lit';
|
|
2
3
|
import { Ref } from 'lit/directives/ref.js';
|
|
3
4
|
import { TestableLitElement } from '../../utils/components/testable-lit-element/testable-lit-element.ts';
|
|
4
5
|
export declare class NjcTooltip extends TestableLitElement {
|
|
@@ -10,12 +11,23 @@ export declare class NjcTooltip extends TestableLitElement {
|
|
|
10
11
|
_tooltipRef: Ref<HTMLElement>;
|
|
11
12
|
_cleanup: (() => void) | undefined;
|
|
12
13
|
private _forceOpen;
|
|
13
|
-
private
|
|
14
|
+
private _hideTimeoutId;
|
|
15
|
+
private _initialized;
|
|
16
|
+
private _boundReferenceElement;
|
|
17
|
+
private elementListeners;
|
|
14
18
|
tooltipId: string;
|
|
15
19
|
firstUpdated(): void;
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
20
|
+
updated(changedProperties: PropertyValues): void;
|
|
21
|
+
get referenceElement(): HTMLElement | null;
|
|
22
|
+
private _tryInitialize;
|
|
23
|
+
private _teardown;
|
|
24
|
+
private _getAriaTargetElement;
|
|
25
|
+
private _updateAriaAssociation;
|
|
26
|
+
private _addInteractionEvents;
|
|
27
|
+
private _scheduleHide;
|
|
28
|
+
private _clearScheduledHide;
|
|
29
|
+
addTrackedEventListener(element: HTMLElement | Document, eventType: string, listener: EventListener, options?: AddEventListenerOptions): void;
|
|
30
|
+
removeAllTrackedEventListeners(element: HTMLElement | Document): void;
|
|
19
31
|
toggleTooltip(): void;
|
|
20
32
|
disconnectedCallback(): void;
|
|
21
33
|
showTooltip(): void;
|
|
@@ -13,6 +13,8 @@ export declare function getNamedSlotTextContent(element: HTMLElement | null, nam
|
|
|
13
13
|
export declare function getSlottedElements(element: HTMLElement | null, elementFilter?: string | null): Element[] | undefined;
|
|
14
14
|
export declare function getNamedSlottedElements(element: HTMLElement | null, name: string): Element[] | undefined;
|
|
15
15
|
export declare function flushPromises(time?: number): Promise<unknown>;
|
|
16
|
+
/** Wait past tooltip hover-dismiss delay (100ms) for visibility assertions. */
|
|
17
|
+
export declare function waitForTooltipHide(): Promise<unknown>;
|
|
16
18
|
/**
|
|
17
19
|
* For components whose Lit `title` is heading text (not the HTML tooltip): the host must
|
|
18
20
|
* not keep a `title` attribute, while `HTMLElement#title` reflects the Lit property value.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{camelToKebab as s}from"./string-utils.js";const a=new Set(["defaultSlot"]);function i(t){return t.replace(/&/g,"&").replace(/"/g,""").replace(/</g,"<")}function f(t,e){const n=new RegExp(`<${e}\\b`,"g");return[...t.matchAll(n)].length}function l(t){const e=Object.entries(t).sort(([o],[r])=>o==="dataTestid"?-1:r==="dataTestid"?1:o.localeCompare(r)),n=[];for(const[o,r]of e){if(a.has(o)||r==null||r===!1)continue;if(o==="dataTestid"){n.push(`data-testid="${i(String(r))}"`);continue}const u=s(o);if(typeof r=="boolean"&&r){n.push(u);continue}typeof r!="boolean"&&n.push(`${u}="${i(String(r))}"`)}return n.length?` ${n.join(" ")}`:""}function c(t,e){const n=l(e),o=typeof e.defaultSlot=="string"?i(e.defaultSlot):"";return`<${t}${n}>${o}</${t}>`}function $(t,e,n){if(!e)return t;const o=f(t,e);if(o>1)return c(e,n);if(o===0)return t;const r=l(n);return r.trim()?t.replace(new RegExp(`<${e}\\b
|
|
1
|
+
import{camelToKebab as s}from"./string-utils.js";const a=new Set(["defaultSlot"]);function i(t){return t.replace(/&/g,"&").replace(/"/g,""").replace(/</g,"<")}function f(t,e){const n=new RegExp(`<${e}\\b`,"g");return[...t.matchAll(n)].length}function l(t){const e=Object.entries(t).sort(([o],[r])=>o==="dataTestid"?-1:r==="dataTestid"?1:o.localeCompare(r)),n=[];for(const[o,r]of e){if(a.has(o)||r==null||r===!1)continue;if(o==="dataTestid"){n.push(`data-testid="${i(String(r))}"`);continue}const u=s(o);if(typeof r=="boolean"&&r){n.push(u);continue}typeof r!="boolean"&&n.push(`${u}="${i(String(r))}"`)}return n.length?` ${n.join(" ")}`:""}function c(t,e){const n=l(e),o=typeof e.defaultSlot=="string"?i(e.defaultSlot):"";return`<${t}${n}>${o}</${t}>`}function $(t,e,n){if(!e)return t;const o=f(t,e);if(o>1)return c(e,n);if(o===0)return t;const r=l(n);return r.trim()?t.replace(new RegExp(`<${e}\\b[^>]*>`),`<${e}${r}>`):t}function b(t){const e=[];if(!t)return e;for(let n=1;n<=t;n++)e.push({label:`Option ${n}`,value:`${n}`});return e}export{c as buildMinimalComponentSnippet,$ as convertArgsForStorybookCodeExample,b as generateOptions};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{g as r}from"../node_modules/.pnpm/vitest@4.1.1_@types_node@25.5.0_@vitest_browser-playwright@4.1.1_@vitest_ui@4.1.0_jsdom_6987228cf79758f3d05c697357fc8c5a/node_modules/vitest/dist/chunks/test.CBQUpOM3.js";async function
|
|
1
|
+
import{g as r}from"../node_modules/.pnpm/vitest@4.1.1_@types_node@25.5.0_@vitest_browser-playwright@4.1.1_@vitest_ui@4.1.0_jsdom_6987228cf79758f3d05c697357fc8c5a/node_modules/vitest/dist/chunks/test.CBQUpOM3.js";async function a(t){document.body.innerHTML=t,await new Promise(e=>setTimeout(e,0))}function i(t){return document.body.querySelector(t)}function c(t,e){return t?.querySelector(e)}function d(t,e){return t?.querySelectorAll(e)}function m(t){return document.body.querySelectorAll(t)}function f(t,e){return t?.shadowRoot?.querySelectorAll(e)}function g(t,e){return t?.shadowRoot?.querySelector(e)}function E(t,e){return t?.shadowRoot?.querySelector(`[data-testid="${e}"]`)}function S(t,e){return t?.shadowRoot?.querySelector(e)}function y(t,e){return t?.shadowRoot?.querySelectorAll(e)}function h(t){const e=t?.shadowRoot?.querySelectorAll("slot"),n=Array.from(e).find(l=>l.name==="")?.assignedNodes({flatten:!0}).filter(l=>l.textContent?.trim()!=="");return n&&n.length>0?n[0].textContent:null}function w(t,e){const o=t?.shadowRoot?.querySelector(`slot[name="${e}"]`);return(o?.assignedNodes().length?o?.assignedNodes({flatten:!0})[0]:o?.assignedElements({flatten:!0})[0])?.textContent}function R(t,e=null){let n=t?.shadowRoot?.querySelector("slot")?.assignedElements({flatten:!0});return e&&(n=n?.filter(l=>l.tagName.toLowerCase()===e)),n}function T(t,e){return t?.shadowRoot?.querySelector(`slot[name=${e}]`)?.assignedElements({flatten:!0})}function s(t=0){return new Promise(e=>setTimeout(e,t))}function q(){return s(150)}function x(t,e){r(t).toBeTruthy();const o=t;r(o.getAttribute("title")).toBeNull(),r(o.title).toBe(e)}function N(t){const e=/<!--\?lit\$[^\$]*\$-->/g;return t.replace(e,"").replace(/\s+/g," ").trim()}export{a as addTestableElement,N as cleanInnerHTML,x as expectLitHeadingTitle,s as flushPromises,i as getElement,c as getElementInsideElement,m as getElements,d as getElementsInsideElement,w as getNamedSlotTextContent,T as getNamedSlottedElements,S as getShadowRootElement,E as getShadowRootElementByDataTestId,y as getShadowRootElements,g as getShadowRootHTMLElement,f as getShadowRootHTMLElements,h as getSlotTextContent,R as getSlottedElements,q as waitForTooltipHide};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ncino/web-components",
|
|
3
3
|
"author": "nCino",
|
|
4
|
-
"version": "13.
|
|
4
|
+
"version": "13.9.1",
|
|
5
5
|
"license": "(c) Copyright 2023 nCino, Inc., all rights reserved",
|
|
6
6
|
"publishConfig": {
|
|
7
7
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -100,10 +100,10 @@
|
|
|
100
100
|
"vite-plugin-static-copy": "^3.3.0",
|
|
101
101
|
"vitest": "^4.1.0",
|
|
102
102
|
"yaml-eslint-parser": "^2.0.0",
|
|
103
|
-
"@ncino/styles": "13.
|
|
103
|
+
"@ncino/styles": "13.9.1"
|
|
104
104
|
},
|
|
105
105
|
"peerDependencies": {
|
|
106
|
-
"@ncino/styles": "13.
|
|
106
|
+
"@ncino/styles": "13.9.1"
|
|
107
107
|
},
|
|
108
108
|
"bugs": {
|
|
109
109
|
"url": "https://github.com/ncino/force-sdk-web-components/issues"
|
package/web-types.json
CHANGED