@ncino/web-components 1.3.0-preview.1 → 2.0.0-preview.2
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/assets/index-chunk5.js +1 -1
- package/dist/components/button/slds/button.slds.js +2 -2
- package/dist/components/input/base/input-base.js +1 -1
- package/dist/components/input/gator/input-label/input-label.gator.js +3 -2
- package/dist/components/input/gator/input-text/input-text.gator.js +23 -13
- package/dist/components/input/index.js +1 -1
- package/dist/components/input/slds/input-text/input-text.slds.js +1 -1
- package/dist/components/tooltip/gator/tooltip.gator.js +4 -10
- package/dist/components/tooltip/index.js +1 -1
- package/dist/components/tooltip/slds/tooltip.slds.js +2 -2
- package/dist/components/tooltip/tooltip.js +1 -1
- package/dist/index.slds.js +1 -1
- package/dist/types/components/button/slds/button.slds.d.ts +6 -0
- package/dist/types/components/input/base/input-base.d.ts +10 -4
- package/dist/types/components/input/gator/help-text/help-text.gator.d.ts +1 -1
- package/dist/types/components/input/gator/input-label/input-label.gator.d.ts +4 -0
- package/dist/types/components/input/gator/input-text/input-text.gator.d.ts +10 -4
- package/dist/types/components/tooltip/gator/tooltip.gator.d.ts +8 -5
- package/dist/types/components/tooltip/tooltip.d.ts +2 -2
- package/package.json +1 -1
- package/web-types.json +74 -12
|
@@ -1 +1 @@
|
|
|
1
|
-
const r=':host,:root{--color-background-primary: var(--color-blue-10, #F3F5F7);--color-stroke-brand: var(--color-blue-30, #11395B);--color-stroke-brand-secondary: var(--color-blue-20, #C3CDD6);--color-stroke-primary: var(--color-neutral-50, #6D6D6D);--color-stroke-secondary: var(--color-neutral-40, #BFBFBF);--color-stroke-success: var(--color-green-20);--color-stroke-warning: var(--color-orange-20);--color-stroke-error-weak: var(--color-red-20);--color-stroke-error-strong: var(--color-red-30);--color-stroke-tertiary: var(--color-neutral-30, #E5E5E5);--color-stroke-button: var(--color-neutral-70);--color-stroke-interactive: var(--color-neutral-70);--color-text-primary-base: var(--color-neutral-70, #1F1F1F);--color-text-secondary: var(--color-neutral-50, #6D6D6D);--color-text-brand: var(--color-blue-30, #11395B);--color-text-placeholder: var(--color-neutral-50, #6D6D6D);--color-text-error: var(--color-red-40, #AA330E);--color-text-disabled: var(--color-neutral-50, #6D6D6D);--color-text-inverse: var(--color-neutral-0, #FFFFFF);--color-surface-primary: var(--color-neutral-0, #FFFFFF);--color-surface-brand: var(--color-blue-10, #F3F5F7);--color-surface-brand-secondary: var(--color-blue-20, #C3CDD6);--color-surface-secondary: var(--color-neutral-10);--color-surface-error: var(--color-red-10);--color-surface-success: var(--color-green-10);--color-surface-warning: var(--color-orange-10);--color-surface-badge: var(--color-red-30);--color-surface-hover: var(--color-neutral-10, #F7F7F7);--color-surface-loading: var(--color-neutral-30);--color-surface-interactive-primary: var(--color-blue-40, #0E304D);--color-surface-interactive-primary-hover: var(--color-blue-50, #0A2033);--color-surface-interactive-primary-pressed: var(--color-blue-50, #0A2033);--color-icon-error: var(--color-red-30);--color-icon-success: var(--color-green-30);--color-icon-warning: var(--color-orange-30);--color-icon-disabled: var(--color-neutral-40, #BFBFBF);--color-icon-brand: var(--color-blue-30);--color-primary-03-base: var(--color-neutral-70, #1F1F1F);--color-primary-01-placeholder: var(--color-neutral-50, #6D6D6D);--color-underline-primary: var(--color-neutral-40, #BFBFBF);--color-button-pressed: var(--color-neutral-60, #404040);--color-button-disabled: var(--color-neutral-40, #BFBFBF);--color-focus-gap: var(--color-neutral-0, #FFFFFF);--color-focus-border: var(--color-blue-30, #11395B);--primary-01-placeholder: var(--color-neutral-50, #6D6D6D);--text-color-secondary: var(--color-neutral-50, #6D6D6D);--size-stroke-1: 1px;--text-size-body-1: 1.0625rem;--text-size-body-2: .9375rem;--text-size-caption: .8125rem;--text-size-subtitle-1: 1.0625rem;--text-size-h1: 2.5rem;--text-size-h5: 1.25rem;--text-size-button-small: .8125rem;--text-size-button-large: 1.0625rem;--text-line-height-subtitle-1: 1.5rem;--text-line-height-body-1: 1.5rem;--text-line-height-body-2: 1.375rem;--text-line-height-h1: 3.125rem;--text-line-height-h5: 1.875rem;--text-family-sans-serif: "Open Sans", sans-serif;--spacing-2: .5rem;--spacing-5: 1.5rem;--spacing-padding-margin-16: 1rem;--spacing-padding-margin-4: .25rem;--spacing-gap-4: .25rem;--spacing-gap-8: .5rem;--spacing-gap-12: .75rem;--spacing-gap-16: 1rem;--size-icon-default: 1.5rem;--text-line-height-subtitle: 1.5rem}';export{r as s};
|
|
1
|
+
const r=':host,:root{--color-background-primary: var(--color-blue-10, #F3F5F7);--color-stroke-brand: var(--color-blue-30, #11395B);--color-stroke-brand-secondary: var(--color-blue-20, #C3CDD6);--color-stroke-primary: var(--color-neutral-50, #6D6D6D);--color-stroke-secondary: var(--color-neutral-40, #BFBFBF);--color-stroke-success: var(--color-green-20);--color-stroke-warning: var(--color-orange-20);--color-stroke-error-weak: var(--color-red-20);--color-stroke-error-strong: var(--color-red-30);--color-stroke-tertiary: var(--color-neutral-30, #E5E5E5);--color-stroke-button: var(--color-neutral-70);--color-stroke-interactive: var(--color-neutral-70);--color-text-primary-base: var(--color-neutral-70, #1F1F1F);--color-text-secondary: var(--color-neutral-50, #6D6D6D);--color-text-brand: var(--color-blue-30, #11395B);--color-text-placeholder: var(--color-neutral-50, #6D6D6D);--color-text-error: var(--color-red-40, #AA330E);--color-text-disabled: var(--color-neutral-50, #6D6D6D);--color-text-inverse: var(--color-neutral-0, #FFFFFF);--color-surface-primary: var(--color-neutral-0, #FFFFFF);--color-surface-brand: var(--color-blue-10, #F3F5F7);--color-surface-brand-secondary: var(--color-blue-20, #C3CDD6);--color-surface-secondary: var(--color-neutral-10);--color-surface-error: var(--color-red-10);--color-surface-success: var(--color-green-10);--color-surface-warning: var(--color-orange-10);--color-surface-badge: var(--color-red-30);--color-surface-hover: var(--color-neutral-10, #F7F7F7);--color-surface-loading: var(--color-neutral-30);--color-surface-interactive-primary: var(--color-blue-40, #0E304D);--color-surface-interactive-primary-hover: var(--color-blue-50, #0A2033);--color-surface-interactive-primary-pressed: var(--color-blue-50, #0A2033);--color-icon-error: var(--color-red-30);--color-icon-success: var(--color-green-30);--color-icon-warning: var(--color-orange-30);--color-icon-disabled: var(--color-neutral-40, #BFBFBF);--color-icon-brand: var(--color-blue-30);--color-primary-03-base: var(--color-neutral-70, #1F1F1F);--color-primary-01-placeholder: var(--color-neutral-50, #6D6D6D);--color-underline-primary: var(--color-neutral-40, #BFBFBF);--color-button-pressed: var(--color-neutral-60, #404040);--color-button-disabled: var(--color-neutral-40, #BFBFBF);--color-focus-gap: var(--color-neutral-0, #FFFFFF);--color-focus-border: var(--color-blue-30, #11395B);--primary-01-placeholder: var(--color-neutral-50, #6D6D6D);--text-color-secondary: var(--color-neutral-50, #6D6D6D);--size-stroke-1: 1px;--radius-sm: .125rem;--text-size-body-1: 1.0625rem;--text-size-body-2: .9375rem;--text-size-caption: .8125rem;--text-size-subtitle-1: 1.0625rem;--text-size-h1: 2.5rem;--text-size-h5: 1.25rem;--text-size-button-small: .8125rem;--text-size-button-large: 1.0625rem;--text-line-height-subtitle-1: 1.5rem;--text-line-height-body-1: 1.5rem;--text-line-height-body-2: 1.375rem;--text-line-height-h1: 3.125rem;--text-line-height-h5: 1.875rem;--text-family-sans-serif: "Open Sans", sans-serif;--spacing-2: .5rem;--spacing-5: 1.5rem;--spacing-padding-margin-16: 1rem;--spacing-padding-margin-8: .5rem;--spacing-padding-margin-4: .25rem;--spacing-gap-4: .25rem;--spacing-gap-8: .5rem;--spacing-gap-12: .75rem;--spacing-gap-16: 1rem;--size-icon-default: 1.5rem;--text-line-height-subtitle: 1.5rem}';export{r as s};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import{N as a}from"../button.js";import{a as
|
|
1
|
+
import{N as a}from"../button.js";import{a as u,x as p}from"../../../assets/index-chunk2.js";import{s as m}from"../../../assets/index-chunk6.js";import{t as f}from"../../../assets/index-chunk3.js";import"../../../assets/index-chunk.js";import"../../../utils/components/testable-lit-element/testable-lit-element.js";import"../../../utils/mixins/attribute-deletion.js";var _=Object.defineProperty,c=Object.getOwnPropertyDescriptor,h=(i,s,e,r)=>{for(var t=r>1?void 0:r?c(s,e):s,n=i.length-1,l;n>=0;n--)(l=i[n])&&(t=(r?l(s,e,t):l(t))||t);return r&&t&&_(s,e,t),t};let o=class extends a{get _themeClass(){return this.variant?`slds-button_${this.variant}`:null}render(){return p`
|
|
2
2
|
<button class="slds-button ${this._themeClass}">
|
|
3
3
|
<slot>! Missing Text !</slot>
|
|
4
4
|
</button>
|
|
5
|
-
`}};
|
|
5
|
+
`}};o.styles=[u(m)];o.shadowRootOptions={...a.shadowRootOptions,delegatesFocus:!0};o=h([f("nsc-button")],o);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{n as t}from"../../../assets/index-chunk.js";import{T as n}from"../../../utils/components/testable-lit-element/testable-lit-element.js";import"../../../assets/index-chunk2.js";var d=Object.defineProperty,e=(p,s,a,h)=>{for(var o=void 0,i=p.length-1,l;i>=0;i--)(l=p[i])&&(o=l(s,a,o)||o);return o&&d(s,a,o),o};class r extends n{constructor(){super(...arguments),this.id="",this.required=!1,this.disabled=!1,this.label="",this.placeholder="",this.errorText="",this.helpText="",this.type="text",this.startIcon="",this.endIcon=""}}e([t()],r.prototype,"id");e([t({type:Boolean})],r.prototype,"required");e([t({type:Boolean})],r.prototype,"disabled");e([t()],r.prototype,"label");e([t()],r.prototype,"placeholder");e([t()],r.prototype,"value");e([t({attribute:"error-text"})],r.prototype,"errorText");e([t({attribute:"help-text"})],r.prototype,"helpText");e([t()],r.prototype,"type");e([t({attribute:"start-icon"})],r.prototype,"startIcon");e([t({attribute:"end-icon"})],r.prototype,"endIcon");export{r as I};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import{a as o,r as
|
|
1
|
+
import{a as o,r as b,x as g}from"../../../../assets/index-chunk2.js";import{t as m}from"../../../../assets/index-chunk3.js";import{n as f}from"../../../../assets/index-chunk.js";import{p as u}from"../../../../assets/index-chunk4.js";import{s as c}from"../../../../assets/index-chunk5.js";const v=".gator-label{font-family:var(--gator-input-label-font-family);font-weight:var(--gator-input-label-font-weight, 400);color:var(--gator-input-label-color, var(--color-neutral-50, #6D6D6D));font-size:var(--gator-input-label-font-size, var(--text-size-body-1, 1.0625rem));line-height:var(--gator-input-label-line-height, var(--text-line-height-body-1, 1.5rem))}.gator-label_required{font-size:var(--text-size-subtitle-1, 1.0625rem);margin-right:var(--spacing-padding-margin-8, .5rem);color:var(--color-text-error, #AA330E);font-weight:700}",h=':host{--gator-input-label-color: var(--color-text-primary-base, #1F1F1F);--gator-input-label-font-family: var(--text-family-sans-serif, "Open Sans", sans-serif);--gator-input-label-font-weight: 400;--gator-input-label-font-size: 1.0625rem;--gator-input-label-line-height: 1.5rem}';var y=Object.defineProperty,d=Object.getOwnPropertyDescriptor,s=(p,e,l,a)=>{for(var r=a>1?void 0:a?d(e,l):e,i=p.length-1,n;i>=0;i--)(n=p[i])&&(r=(a?n(e,l,r):n(r))||r);return a&&r&&y(e,l,r),r};let t=class extends b{constructor(){super(...arguments),this.for="",this.required=!1}render(){return g`
|
|
2
2
|
<label class="gator-label" for=${this.for}>
|
|
3
|
+
${this.required?g`<span class="gator-label_required">*</span>`:null}
|
|
3
4
|
<slot></slot>
|
|
4
5
|
</label>
|
|
5
|
-
`}};
|
|
6
|
+
`}};t.styles=[o(v),o(h),o(c),o(u)];s([f({type:String})],t.prototype,"for",2);s([f({type:Boolean})],t.prototype,"required",2);t=s([m("ngc-input-label")],t);
|
|
@@ -1,35 +1,45 @@
|
|
|
1
|
-
import{a as n,x as
|
|
1
|
+
import{a as n,x as r}from"../../../../assets/index-chunk2.js";import"../input-label/input-label.gator.js";import"../help-text/help-text.gator.js";import"../../../icon/gator/icon.gator.js";import"../../../icon/gator/templates/arrow-left.js";import"../../../icon/gator/templates/arrow-right.js";import"../../../icon/gator/templates/balloons.js";import"../../../icon/gator/templates/check-circle.js";import"../../../icon/gator/templates/check.js";import"../../../icon/gator/templates/checkbox.js";import"../../../icon/gator/templates/checkbox-selected.js";import"../../../icon/gator/templates/chevron-down.js";import"../../../icon/gator/templates/chevron-right.js";import"../../../icon/gator/templates/chevron-up.js";import"../../../icon/gator/templates/exit.js";import"../../../icon/gator/templates/exit-circle.js";import"../../../icon/gator/templates/eye-crossed.js";import"../../../icon/gator/templates/info.js";import"../../../icon/gator/templates/link.js";import"../../../icon/gator/templates/overflow-menu.js";import"../../../icon/gator/templates/picture.js";import"../../../icon/gator/templates/radio.js";import"../../../icon/gator/templates/radio-selected.js";import"../../../icon/gator/templates/restricted.js";import"../../../icon/gator/templates/warning.js";import{s as h}from"../../../../assets/index-chunk5.js";import{p as m}from"../../../../assets/index-chunk4.js";import{t as g}from"../../../../assets/index-chunk3.js";import{n as f}from"../../../../assets/index-chunk.js";import{I as v}from"../../base/input-base.js";import{e as u,n as c}from"../../../../assets/index-chunk7.js";import"../../../icon/icon-registry.js";import"../../../../utils/components/testable-lit-element/testable-lit-element.js";import"../../../../assets/index-chunk8.js";const x="input,textarea{border:none}input:focus,textarea:focus{outline:none}.gator-input-has-focus{outline:2px solid var(--ngc-input-border-color-focused, #1F1F1F)!important;border:1px solid transparent!important}.gator-form-element{display:block;margin-bottom:1rem}.gator-form-element-control{padding:var(--ngc-input-padding);display:flex;flex-direction:column}.gator-input{display:flex;width:100%;height:100%;font-size:var(--ngc-input-font-size, 1.0625rem)}.gator-form-element-control{margin:.5rem 0;border:1px solid var(--ngc-input-border-color, #BFBFBF);border-radius:var(--ngc-input-border-radius, 2px);flex:1}.gator-form-element-control:hover{border:1px solid var(--ngc-input-border-color-hovered, #1F1F1F);outline:none}.gator-has-error{border-color:var(--ngc-input-error-border)!important}.gator-form-element-control-icon-right{display:flex;align-items:center}.gator-input-container{max-width:var(--ngc-input-max-width, 200px);display:flex;align-items:center;position:relative}.gator-input-start,.gator-input-end{display:flex;align-items:center}.gator-input-start{margin-right:.5rem}",b=":root,:host{--ngc-input-error-border: var(--color-error, #D0021B);--ngc-input-border-color: var(--color-grey-40, #BFBFBF);--ngc-input-border-color-focused: var(--color-stroke-brand, #1F1F1F);--ngc-input-border-color-hovered: var(--color-stroke-interactive, #0052CC);--ngc-input-min-width: 200px;--ngc-input-padding: var(--spacing-3, .75rem) var(--spacing-4, 1rem);--ngc-input-border-radius: var(--radius-sm, .125rem);--ngc-input-max-width: 100%;--ngc-input-font-size: 17px}";var $=Object.defineProperty,I=Object.getOwnPropertyDescriptor,d=(t,i,a,o)=>{for(var e=o>1?void 0:o?I(i,a):i,p=t.length-1,l;p>=0;p--)(l=t[p])&&(e=(o?l(i,a,e):l(e))||e);return o&&e&&$(i,a,e),e};let s=class extends v{constructor(){super(...arguments),this._inputRef=u(),this._controlRef=u(),this.for=""}render(){return r`
|
|
2
2
|
<div class="gator-form-element">
|
|
3
3
|
${this.label?this.labelMarkup:null}
|
|
4
|
-
<div class="gator-form-element-control">
|
|
4
|
+
<div ${c(this._controlRef)} class="gator-form-element-control ${this.errorClass}">
|
|
5
5
|
<div class="gator-input-container">
|
|
6
|
+
${this.shouldHaveStartMarkup?r`
|
|
7
|
+
<div class="gator-input-start">
|
|
8
|
+
${this.startIconMarkup}
|
|
9
|
+
</div>`:null}
|
|
6
10
|
<input
|
|
7
|
-
${
|
|
11
|
+
${c(this._inputRef)}
|
|
8
12
|
type="${this.type}"
|
|
9
13
|
.id="${this.id}"
|
|
10
14
|
.placeholder="${this.placeholder}"
|
|
11
15
|
.required="${this.required}"
|
|
12
16
|
.disabled="${this.disabled}"
|
|
13
|
-
class="gator-input
|
|
17
|
+
class="gator-input"
|
|
14
18
|
aria-invalid="${this.isAriaInvalid}"
|
|
19
|
+
aria-required="${this.required}"
|
|
15
20
|
.value="${this.value}"
|
|
16
21
|
@input="${this.handleChange}"
|
|
22
|
+
@focusin="${this.handleInputFocusIn}"
|
|
23
|
+
@focusout="${this.handleInputFocusOut}"
|
|
17
24
|
/>
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
25
|
+
${this.shouldHaveEndMarkup?r`
|
|
26
|
+
<div class="gator-input-end">
|
|
27
|
+
${this.passwordVisibilityMarkup}
|
|
28
|
+
${this.endIconMarkup}
|
|
29
|
+
</div>`:null}
|
|
22
30
|
</div>
|
|
23
31
|
</div>
|
|
24
32
|
|
|
25
|
-
${this.
|
|
33
|
+
${this.bottomText}
|
|
26
34
|
</div>
|
|
27
|
-
`}
|
|
35
|
+
`}get shouldHaveStartMarkup(){return this.startIcon}get shouldHaveEndMarkup(){return this.endIcon||this.type==="password"}get startIconMarkup(){return this.startIcon?r`<ngc-icon .name="${this.startIcon}"></ngc-icon>`:null}get endIconMarkup(){return this.endIcon?r`
|
|
36
|
+
<ngc-icon .name="${this.endIcon}"></ngc-icon>`:null}get labelMarkup(){return r`
|
|
28
37
|
<ngc-input-label
|
|
29
38
|
.for="${this.id}"
|
|
30
39
|
.required="${this.required}"
|
|
31
40
|
>
|
|
32
41
|
${this.label}
|
|
33
|
-
</ngc-input-label>`}get isAriaInvalid(){return this.errorText?"true":"false"}get errorClass(){return this.errorText?"gator-has-error":""}get
|
|
34
|
-
<ngc-help-text icon
|
|
35
|
-
|
|
42
|
+
</ngc-input-label>`}get isAriaInvalid(){return this.errorText?"true":"false"}get errorClass(){return this.errorText?"gator-has-error":""}get bottomText(){return this.errorText||this.helpText?r`
|
|
43
|
+
<ngc-help-text ?icon="${this.errorText}" ?error="${this.errorText}">
|
|
44
|
+
${this.errorText||this.helpText}
|
|
45
|
+
</ngc-help-text>`:null}get passwordVisibilityMarkup(){return this.endIconMarkup||this.type!=="password"?null:r`<ngc-icon name="eye-crossed" @click="${this.togglePasswordVisibility}"></ngc-icon>`}handleChange(t){const i=t.target;this.value=i.value}togglePasswordVisibility(){const t=this._inputRef.value;t&&(t.type=t.type==="password"?"text":"password")}handleInputFocusIn(){var t;(t=this._controlRef.value)==null||t.classList.add("gator-input-has-focus")}handleInputFocusOut(){var t;(t=this._controlRef.value)==null||t.classList.remove("gator-input-has-focus")}};s.styles=[n(x),n(h),n(m),n(b)];d([f()],s.prototype,"for",2);s=d([g("ngc-input-text")],s);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import"./gator/input-label/input-label.gator.js";import"./gator/help-text/help-text.gator.js";import"./gator/input-text/input-text.gator.js";import"./slds/input-text/input-text.slds.js";import"./slds/input-error/input-error.slds.js";import"./slds/input-label/input-label.slds.js";import"../../assets/index-chunk2.js";import"../../assets/index-chunk3.js";import"../../assets/index-chunk.js";import"../../assets/index-chunk4.js";import"../../assets/index-chunk5.js";import"../icon/gator/icon.gator.js";import"../icon/gator/templates/arrow-left.js";import"../icon/icon-registry.js";import"../icon/gator/templates/arrow-right.js";import"../icon/gator/templates/balloons.js";import"../icon/gator/templates/check-circle.js";import"../icon/gator/templates/check.js";import"../icon/gator/templates/checkbox.js";import"../icon/gator/templates/checkbox-selected.js";import"../icon/gator/templates/chevron-down.js";import"../icon/gator/templates/chevron-right.js";import"../icon/gator/templates/chevron-up.js";import"../icon/gator/templates/exit.js";import"../icon/gator/templates/exit-circle.js";import"../icon/gator/templates/eye-crossed.js";import"../icon/gator/templates/info.js";import"../icon/gator/templates/link.js";import"../icon/gator/templates/overflow-menu.js";import"../icon/gator/templates/picture.js";import"../icon/gator/templates/radio.js";import"../icon/gator/templates/radio-selected.js";import"../icon/gator/templates/restricted.js";import"../icon/gator/templates/warning.js";import"./base/input-base.js";import"../../assets/index-chunk7.js";import"../../assets/index-chunk8.js";import"../../assets/index-chunk6.js";
|
|
1
|
+
import"./gator/input-label/input-label.gator.js";import"./gator/help-text/help-text.gator.js";import"./gator/input-text/input-text.gator.js";import"./slds/input-text/input-text.slds.js";import"./slds/input-error/input-error.slds.js";import"./slds/input-label/input-label.slds.js";import"../../assets/index-chunk2.js";import"../../assets/index-chunk3.js";import"../../assets/index-chunk.js";import"../../assets/index-chunk4.js";import"../../assets/index-chunk5.js";import"../icon/gator/icon.gator.js";import"../icon/gator/templates/arrow-left.js";import"../icon/icon-registry.js";import"../icon/gator/templates/arrow-right.js";import"../icon/gator/templates/balloons.js";import"../icon/gator/templates/check-circle.js";import"../icon/gator/templates/check.js";import"../icon/gator/templates/checkbox.js";import"../icon/gator/templates/checkbox-selected.js";import"../icon/gator/templates/chevron-down.js";import"../icon/gator/templates/chevron-right.js";import"../icon/gator/templates/chevron-up.js";import"../icon/gator/templates/exit.js";import"../icon/gator/templates/exit-circle.js";import"../icon/gator/templates/eye-crossed.js";import"../icon/gator/templates/info.js";import"../icon/gator/templates/link.js";import"../icon/gator/templates/overflow-menu.js";import"../icon/gator/templates/picture.js";import"../icon/gator/templates/radio.js";import"../icon/gator/templates/radio-selected.js";import"../icon/gator/templates/restricted.js";import"../icon/gator/templates/warning.js";import"./base/input-base.js";import"../../utils/components/testable-lit-element/testable-lit-element.js";import"../../assets/index-chunk7.js";import"../../assets/index-chunk8.js";import"../../assets/index-chunk6.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as p,x as o}from"../../../../assets/index-chunk2.js";import"../input-label/input-label.slds.js";import"../input-error/input-error.slds.js";import{s as h}from"../../../../assets/index-chunk6.js";import{t as d}from"../../../../assets/index-chunk3.js";import{n as c}from"../../../../assets/index-chunk.js";import{I as m}from"../../base/input-base.js";var v=Object.defineProperty,f=Object.getOwnPropertyDescriptor,u=(t,e,l,s)=>{for(var r=s>1?void 0:s?f(e,l):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(r=(s?n(e,l,r):n(r))||r);return s&&r&&v(e,l,r),r};let i=class extends m{constructor(){super(...arguments),this.for=""}render(){return o`
|
|
1
|
+
import{a as p,x as o}from"../../../../assets/index-chunk2.js";import"../input-label/input-label.slds.js";import"../input-error/input-error.slds.js";import{s as h}from"../../../../assets/index-chunk6.js";import{t as d}from"../../../../assets/index-chunk3.js";import{n as c}from"../../../../assets/index-chunk.js";import{I as m}from"../../base/input-base.js";import"../../../../utils/components/testable-lit-element/testable-lit-element.js";var v=Object.defineProperty,f=Object.getOwnPropertyDescriptor,u=(t,e,l,s)=>{for(var r=s>1?void 0:s?f(e,l):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(r=(s?n(e,l,r):n(r))||r);return s&&r&&v(e,l,r),r};let i=class extends m{constructor(){super(...arguments),this.for=""}render(){return o`
|
|
2
2
|
<div class="slds-form-element ${this.hasErrorClass}">
|
|
3
3
|
${this.label?this.labelMarkup:null}
|
|
4
4
|
<div class="slds-form-element__control">
|
|
@@ -1,13 +1,7 @@
|
|
|
1
|
-
import{N as p}from"../tooltip.js";import{x as
|
|
2
|
-
<
|
|
3
|
-
<style>${m}</style>
|
|
4
|
-
<style>${g}</style>
|
|
5
|
-
<style>${b}</style>
|
|
6
|
-
<style>${y}</style>
|
|
7
|
-
|
|
8
|
-
<div ${c(this._tooltipRef)} class="gator-tooltip ${this.nubbinPositionClass}" role="tooltip" id="${this.tooltipId}">
|
|
1
|
+
import{N as p}from"../tooltip.js";import{r as c,a as i,x as f}from"../../../assets/index-chunk2.js";import{n as m}from"../../../assets/index-chunk7.js";import{t as u}from"../../../assets/index-chunk3.js";import{a as g,t as b,c as h}from"../../../assets/index-chunk14.js";import{p as d}from"../../../assets/index-chunk4.js";import{s as _}from"../../../assets/index-chunk5.js";import"../../../assets/index-chunk.js";import"../../../consts/key-constants.js";import"../../../utils/string-utils.js";import"../../../utils/components/testable-lit-element/testable-lit-element.js";import"../../../utils/datatestid-utils.js";import"../../../assets/index-chunk8.js";const v='.gator-tooltip{background-color:var(--ngc-tooltip-background-color);border-radius:.1875rem;padding:var(--spacing-3, .5rem) var(--spacing-4, 1rem);color:var(--ngc-tooltip-color, #fff)}.gator-tooltip-body{display:flex;align-items:center}.gator-tooltip-nubbin_bottom:before{position:absolute;width:1rem;height:1rem;transform:rotate(45deg);content:"";background-color:inherit;left:50%;bottom:-.5rem;margin-left:-.5rem;border-radius:100% 0 3px}.gator-tooltip-nubbin_top:before{position:absolute;width:1rem;height:1rem;transform:rotate(45deg);content:"";background-color:inherit;left:50%;top:-.5rem;margin-left:-.5rem;border-radius:3px 0 100%}.gator-tooltip-nubbin_left:before{position:absolute;width:1rem;height:1rem;transform:rotate(45deg);content:"";background-color:inherit;left:-.5rem;top:50%;margin-top:-.5rem;border-radius:0 100% 0 3px}.gator-tooltip-nubbin_right:before{position:absolute;width:1rem;height:1rem;transform:rotate(45deg);content:"";background-color:inherit;right:-.5rem;top:50%;margin-top:-.5rem;border-radius:0 3px 0 100%}',y=":host,:root{--ngc-tooltip-background-color: var(--color-neutral-70, #1F1F1F);--ngc-tooltip-color: var(--color-grey-10, #FFF) }";var O=Object.defineProperty,x=Object.getOwnPropertyDescriptor,P=(t,e,r,s)=>{for(var o=s>1?void 0:s?x(e,r):e,l=t.length-1,a;l>=0;l--)(a=t[l])&&(o=(s?a(e,r,o):a(o))||o);return s&&o&&O(e,r,o),o};let n=class extends p{render(){return f`
|
|
2
|
+
<div ${m(this._tooltipRef)} class="gator-tooltip ${this.nubbinPositionClass}" role="tooltip" id="${this.tooltipId}">
|
|
9
3
|
<div class="gator-tooltip-body">
|
|
10
|
-
|
|
4
|
+
<slot></slot>
|
|
11
5
|
</div>
|
|
12
6
|
</div>
|
|
13
|
-
`}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""}
|
|
7
|
+
`}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=document.querySelector(`#${this.referenceId}`);!this._tooltipRef||!this._tooltipRef.value||!t||(this._cleanup=g(t,this._tooltipRef.value,async()=>{if(!this._tooltipRef||!this._tooltipRef.value||!t)return;const{x:e,y:r}=await h(t,this._tooltipRef.value,{placement:this.placement});Object.assign(this._tooltipRef.value.style,{left:`${e+this.xPositionOffset}px`,top:`${r+this.yPositionOffset}px`})}))}};n.shadowRootOptions={...c.shadowRootOptions,delegatesFocus:!0,mode:"open"};n.styles=[i(v),i(b),i(d),i(_),i(y)];n=P([u("ngc-tooltip")],n);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import"./gator/tooltip.gator.js";import"./slds/tooltip.slds.js";import"./tooltip.js";import"../../assets/index-
|
|
1
|
+
import"./gator/tooltip.gator.js";import"./slds/tooltip.slds.js";import"./tooltip.js";import"../../assets/index-chunk.js";import"../../assets/index-chunk2.js";import"../../assets/index-chunk7.js";import"../../assets/index-chunk8.js";import"../../consts/key-constants.js";import"../../utils/string-utils.js";import"../../utils/components/testable-lit-element/testable-lit-element.js";import"../../utils/datatestid-utils.js";import"../../assets/index-chunk3.js";import"../../assets/index-chunk14.js";import"../../assets/index-chunk4.js";import"../../assets/index-chunk5.js";import"../../assets/index-chunk6.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import{N as a}from"../tooltip.js";import{a as p,x as u}from"../../../assets/index-chunk2.js";import{n as f}from"../../../assets/index-chunk7.js";import{t as c}from"../../../assets/index-chunk3.js";import{s as
|
|
1
|
+
import{N as a}from"../tooltip.js";import{a as p,x as u}from"../../../assets/index-chunk2.js";import{n as f}from"../../../assets/index-chunk7.js";import{t as c}from"../../../assets/index-chunk3.js";import{s as m}from"../../../assets/index-chunk6.js";import{a as b,t as d,c as h}from"../../../assets/index-chunk14.js";import"../../../assets/index-chunk.js";import"../../../consts/key-constants.js";import"../../../utils/string-utils.js";import"../../../utils/components/testable-lit-element/testable-lit-element.js";import"../../../utils/datatestid-utils.js";import"../../../assets/index-chunk8.js";var _=Object.defineProperty,v=Object.getOwnPropertyDescriptor,P=(t,s,o,i)=>{for(var e=i>1?void 0:i?v(s,o):s,r=t.length-1,n;r>=0;r--)(n=t[r])&&(e=(i?n(s,o,e):n(e))||e);return i&&e&&_(s,o,e),e};let l=class extends a{render(){return u`
|
|
2
2
|
<div data-id="tooltip" ${f(this._tooltipRef)} class="slds-popover slds-popover_tooltip ${this.nubbinPositionClass}" role="tooltip">
|
|
3
3
|
<div class="slds-popover__body">
|
|
4
4
|
<slot></slot>
|
|
5
5
|
</div>
|
|
6
6
|
</div>
|
|
7
|
-
`}get xPositionOffset(){return this.placement.includes("left")?-12:this.placement.includes("right")?12:0}get yPositionOffset(){return this.placement.includes("top")?-12:this.placement.includes("bottom")?12:0}get nubbinPositionClass(){switch(this.placement){case"top":return"slds-nubbin_bottom";case"top-start":return"slds-nubbin_bottom-left";case"top-end":return"slds-nubbin_bottom-right";case"right":return"slds-nubbin_left";case"right-start":return"slds-nubbin_left-bottom";case"right-end":return"slds-nubbin_left-top";case"bottom":return"slds-nubbin_top";case"bottom-start":return"slds-nubbin_top-left";case"bottom-end":return"slds-nubbin_top-right"}return""}assignPosition(){const t=document.querySelector(`#${this.referenceId}`);!this._tooltipRef||!this._tooltipRef.value||!t||(this._cleanup=
|
|
7
|
+
`}get xPositionOffset(){return this.placement.includes("left")?-12:this.placement.includes("right")?12:0}get yPositionOffset(){return this.placement.includes("top")?-12:this.placement.includes("bottom")?12:0}get nubbinPositionClass(){switch(this.placement){case"top":return"slds-nubbin_bottom";case"top-start":return"slds-nubbin_bottom-left";case"top-end":return"slds-nubbin_bottom-right";case"right":return"slds-nubbin_left";case"right-start":return"slds-nubbin_left-bottom";case"right-end":return"slds-nubbin_left-top";case"bottom":return"slds-nubbin_top";case"bottom-start":return"slds-nubbin_top-left";case"bottom-end":return"slds-nubbin_top-right"}return""}assignPosition(){const t=document.querySelector(`#${this.referenceId}`);!this._tooltipRef||!this._tooltipRef.value||!t||(this._cleanup=b(t,this._tooltipRef.value,async()=>{if(!this._tooltipRef||!this._tooltipRef.value||!t)return;const{x:s,y:o}=await h(t,this._tooltipRef.value,{placement:this.placement});Object.assign(this._tooltipRef.value.style,{left:`${s+this.xPositionOffset}px`,top:`${o+this.yPositionOffset}px`})}))}};l.styles=[p(m),p(d)];l=P([c("nsc-tooltip")],l);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{n as l}from"../../assets/index-chunk.js";import{e as c}from"../../assets/index-chunk7.js";import{K as m}from"../../consts/key-constants.js";import{g as _}from"../../utils/string-utils.js";import{T as v}from"../../utils/components/testable-lit-element/testable-lit-element.js";import{h as u}from"../../utils/datatestid-utils.js";import"../../assets/index-chunk2.js";import"../../assets/index-chunk8.js";var y=Object.defineProperty,p=(h,e,t,i)=>{for(var o=void 0,s=h.length-1,n;s>=0;s--)(n=h[s])&&(o=n(e,t,o)||o);return o&&y(e,t,o),o};class f extends v{constructor(){super(...arguments),this.referenceId="",this.placement="top-end",this.xOffset=0,this.yOffset=0,this._tooltipRef=c(),this._forceOpen=!1,this._mousedInsideTooltip=!1,this.tooltipId=_()}firstUpdated(){if(this._tooltipRef.value&&(this._tooltipRef.value.style.visibility="hidden",this._tooltipRef.value.style.opacity="0"),!this.referenceId)return;const e=document.querySelector(`#${this.referenceId}`),t=this._tooltipRef.value;e&&t&&(u(e,this.dataTestid,"trigger"),u(t,this.dataTestid,"tooltip"),e.setAttribute("aria-describedby",t.id||""),e.addEventListener("click",()=>this.toggleTooltip()),e.addEventListener("mouseenter",()=>this.showTooltip()),e.addEventListener("mouseleave",i=>this._handleMouseLeave(i,e,t)),e.addEventListener("focusin",()=>this.showTooltip()),e.addEventListener("focusout",()=>this.hideTooltip()),t.addEventListener("mouseenter",()=>this.showTooltip()),t.addEventListener("mouseleave",i=>{if(this._mousedInsideTooltip){this.hideTooltip();return}this._handleMouseLeave(i,e,t)}),document.addEventListener("keydown",i=>{i.key===m.ESCAPE&&(this._forceOpen=!1,this.hideTooltip())}))}_handleMouseLeave(e,t,i){const o=t.getBoundingClientRect(),s=i.getBoundingClientRect(),n=this._isMouseInside(e,o,-5),r=this._isMouseInside(e,s,25);!n&&!r&&this.hideTooltip(),r&&(this._mousedInsideTooltip=!0)}_isMouseInside(e,t,i=0){const{left:o,right:s,top:n,bottom:r}=t,a=e.clientX,d=e.clientY;return a>=o-i&&a<=s+i&&d>=n-i&&d<=r+i}toggleTooltip(){this._forceOpen=!this._forceOpen,this._forceOpen?this.showTooltip():this.hideTooltip()}disconnectedCallback(){this._cleanup&&this._cleanup()}showTooltip(){this.assignPosition(),this._tooltipRef.value&&(this._tooltipRef.value.style.visibility="visible",this._tooltipRef.value.style.opacity="1")}hideTooltip(){this._forceOpen||this._tooltipRef.value&&(this._tooltipRef.value.style.visibility="hidden",this._tooltipRef.value.style.opacity="0")}assignPosition(){}}p([l({attribute:"reference-id"})],f.prototype,"referenceId");p([l()],f.prototype,"placement");p([l({type:Number,attribute:"x-offset"})],f.prototype,"xOffset");p([l({type:Number,attribute:"y-offset"})],f.prototype,"yOffset");export{f as N};
|
package/dist/index.slds.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import"./components/badge/slds/badge.slds.js";import"./components/badge/gator/badge.gator.js";import"./components/button/slds/button.slds.js";import"./components/button/gator/button.gator.js";import"./components/combobox/base/combobox.slds.js";import"./components/combobox/base/combobox.js";import"./components/combobox/combobox-item/combobox-item.slds.js";import"./components/combobox/combobox-item/combobox-item.js";import"./components/icon/slds/icon.slds.js";import"./components/icon/gator/icon.gator.js";import"./components/input-rich-text/input-rich-text.slds.js";import"./components/menu/base/slds/menu.slds.js";import"./components/menu/base/gator/menu.gator.js";import"./components/menu/menu-divider/menu-divider.slds.js";import"./components/menu/menu-item/slds/menu-item.slds.js";import"./components/menu/menu-item/gator/menu-item.gator.js";import"./components/menu/menu-submenu/menu-submenu.slds.js";import"./components/pill/pill.js";import"./components/scoped-notification/scoped-notification.slds.js";import"./components/tooltip/gator/tooltip.gator.js";import"./components/tooltip/slds/tooltip.slds.js";import"./assets/index-chunk2.js";import"./assets/index-chunk6.js";import"./assets/index-chunk3.js";import"./assets/index-chunk.js";import"./components/badge/badge.js";import"./utils/string-utils.js";import"./utils/components/testable-lit-element/testable-lit-element.js";import"./assets/index-chunk4.js";import"./assets/index-chunk5.js";import"./components/button/button.js";import"./utils/mixins/attribute-deletion.js";import"./components/loading-spinner/gator/loading-spinner.gator.js";import"./components/loading-spinner/loading-spinner.js";import"./assets/index-chunk9.js";import"./assets/index-chunk12.js";import"./components/input/slds/input-label/input-label.slds.js";import"./components/input/slds/input-error/input-error.slds.js";import"./consts/key-constants.js";import"./assets/index-chunk7.js";import"./assets/index-chunk8.js";import"./utils/datatestid-utils.js";import"./components/icon/icon.js";import"./components/icon/gator/templates/arrow-left.js";import"./components/icon/icon-registry.js";import"./components/icon/gator/templates/arrow-right.js";import"./components/icon/gator/templates/balloons.js";import"./components/icon/gator/templates/check-circle.js";import"./components/icon/gator/templates/check.js";import"./components/icon/gator/templates/checkbox.js";import"./components/icon/gator/templates/checkbox-selected.js";import"./components/icon/gator/templates/chevron-down.js";import"./components/icon/gator/templates/chevron-right.js";import"./components/icon/gator/templates/chevron-up.js";import"./components/icon/gator/templates/exit.js";import"./components/icon/gator/templates/exit-circle.js";import"./components/icon/gator/templates/eye-crossed.js";import"./components/icon/gator/templates/info.js";import"./components/icon/gator/templates/link.js";import"./components/icon/gator/templates/overflow-menu.js";import"./components/icon/gator/templates/picture.js";import"./components/icon/gator/templates/radio.js";import"./components/icon/gator/templates/radio-selected.js";import"./components/icon/gator/templates/restricted.js";import"./components/icon/gator/templates/warning.js";import"./components/input-rich-text/ckeditor-config.js";import"./components/input-rich-text/input-rich-text.js";import"./components/menu/base/menu.js";import"./assets/index-chunk13.js";import"./components/menu/menu-divider/menu-divider.js";import"./components/menu/menu-item/menu-item.js";import"./components/menu/menu-submenu/menu-submenu.js";import"./components/scoped-notification/scoped-notification.js";import"./components/tooltip/tooltip.js";import"./assets/index-chunk14.js";
|
|
1
|
+
import"./components/badge/slds/badge.slds.js";import"./components/badge/gator/badge.gator.js";import"./components/button/slds/button.slds.js";import"./components/button/gator/button.gator.js";import"./components/combobox/base/combobox.slds.js";import"./components/combobox/base/combobox.js";import"./components/combobox/combobox-item/combobox-item.slds.js";import"./components/combobox/combobox-item/combobox-item.js";import"./components/icon/slds/icon.slds.js";import"./components/icon/gator/icon.gator.js";import"./components/input-rich-text/input-rich-text.slds.js";import"./components/menu/base/slds/menu.slds.js";import"./components/menu/base/gator/menu.gator.js";import"./components/menu/menu-divider/menu-divider.slds.js";import"./components/menu/menu-item/slds/menu-item.slds.js";import"./components/menu/menu-item/gator/menu-item.gator.js";import"./components/menu/menu-submenu/menu-submenu.slds.js";import"./components/pill/pill.js";import"./components/scoped-notification/scoped-notification.slds.js";import"./components/tooltip/gator/tooltip.gator.js";import"./components/tooltip/slds/tooltip.slds.js";import"./assets/index-chunk2.js";import"./assets/index-chunk6.js";import"./assets/index-chunk3.js";import"./assets/index-chunk.js";import"./components/badge/badge.js";import"./utils/string-utils.js";import"./utils/components/testable-lit-element/testable-lit-element.js";import"./assets/index-chunk4.js";import"./assets/index-chunk5.js";import"./components/button/button.js";import"./utils/mixins/attribute-deletion.js";import"./components/loading-spinner/gator/loading-spinner.gator.js";import"./components/loading-spinner/loading-spinner.js";import"./assets/index-chunk9.js";import"./assets/index-chunk12.js";import"./components/input/slds/input-label/input-label.slds.js";import"./components/input/slds/input-error/input-error.slds.js";import"./consts/key-constants.js";import"./assets/index-chunk7.js";import"./assets/index-chunk8.js";import"./utils/datatestid-utils.js";import"./components/icon/icon.js";import"./components/icon/gator/templates/arrow-left.js";import"./components/icon/icon-registry.js";import"./components/icon/gator/templates/arrow-right.js";import"./components/icon/gator/templates/balloons.js";import"./components/icon/gator/templates/check-circle.js";import"./components/icon/gator/templates/check.js";import"./components/icon/gator/templates/checkbox.js";import"./components/icon/gator/templates/checkbox-selected.js";import"./components/icon/gator/templates/chevron-down.js";import"./components/icon/gator/templates/chevron-right.js";import"./components/icon/gator/templates/chevron-up.js";import"./components/icon/gator/templates/exit.js";import"./components/icon/gator/templates/exit-circle.js";import"./components/icon/gator/templates/eye-crossed.js";import"./components/icon/gator/templates/info.js";import"./components/icon/gator/templates/link.js";import"./components/icon/gator/templates/overflow-menu.js";import"./components/icon/gator/templates/picture.js";import"./components/icon/gator/templates/radio.js";import"./components/icon/gator/templates/radio-selected.js";import"./components/icon/gator/templates/restricted.js";import"./components/icon/gator/templates/warning.js";import"./components/input-rich-text/ckeditor-config.js";import"./components/input-rich-text/input-rich-text.js";import"./components/menu/base/menu.js";import"./assets/index-chunk13.js";import"./components/menu/menu-divider/menu-divider.js";import"./components/menu/menu-item/menu-item.js";import"./components/menu/menu-submenu/menu-submenu.js";import"./components/scoped-notification/scoped-notification.js";import"./components/tooltip/tooltip.js";import"./assets/index-chunk14.js";
|
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
import { NjcButton } from '../button.ts';
|
|
2
2
|
export declare class NjcButtonSlds extends NjcButton {
|
|
3
3
|
static styles: import('lit').CSSResult[];
|
|
4
|
+
static shadowRootOptions: {
|
|
5
|
+
delegatesFocus: boolean;
|
|
6
|
+
mode: ShadowRootMode;
|
|
7
|
+
serializable?: boolean;
|
|
8
|
+
slotAssignment?: SlotAssignmentMode;
|
|
9
|
+
};
|
|
4
10
|
private get _themeClass();
|
|
5
11
|
render(): import('lit').TemplateResult<1>;
|
|
6
12
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export declare class InputBase extends
|
|
1
|
+
import { TestableLitElement } from '../../../utils/components/testable-lit-element/testable-lit-element.ts';
|
|
2
|
+
export declare class InputBase extends TestableLitElement {
|
|
3
3
|
id: string;
|
|
4
4
|
required: boolean;
|
|
5
5
|
disabled: boolean;
|
|
@@ -7,14 +7,20 @@ export declare class InputBase extends LitElement {
|
|
|
7
7
|
placeholder: string;
|
|
8
8
|
value: string | number | undefined | null;
|
|
9
9
|
errorText: string;
|
|
10
|
+
helpText: string;
|
|
10
11
|
/**
|
|
11
12
|
* @property {string} type - The type of the input element.
|
|
12
13
|
* @type {string}
|
|
13
14
|
*/
|
|
14
15
|
type: string;
|
|
15
16
|
/**
|
|
16
|
-
* @property {string}
|
|
17
|
+
* @property {string} startIcon - The icon to display on the right side of the input.
|
|
17
18
|
* @type {string}
|
|
18
19
|
*/
|
|
19
|
-
|
|
20
|
+
startIcon: string;
|
|
21
|
+
/**
|
|
22
|
+
* @property {string} endIcon - The icon to display on the right side of the input.
|
|
23
|
+
* @type {string}
|
|
24
|
+
*/
|
|
25
|
+
endIcon: string;
|
|
20
26
|
}
|
|
@@ -6,7 +6,7 @@ export declare class NgcHelpText extends LitElement {
|
|
|
6
6
|
*/
|
|
7
7
|
id: string;
|
|
8
8
|
/**
|
|
9
|
-
* @property {boolean} icon - Defines if the help text inline message should render the
|
|
9
|
+
* @property {boolean} icon - Defines if the help text inline message should render the preceding icon.
|
|
10
10
|
*/
|
|
11
11
|
icon: boolean;
|
|
12
12
|
/**
|
|
@@ -5,6 +5,10 @@ export declare class NgcInputLabel extends LitElement {
|
|
|
5
5
|
* @property {string} for - The id of the input element the label is for.
|
|
6
6
|
*/
|
|
7
7
|
for: string;
|
|
8
|
+
/**
|
|
9
|
+
* @property {boolean} required - Whether the label is required.
|
|
10
|
+
*/
|
|
11
|
+
required: boolean;
|
|
8
12
|
render(): import('lit').TemplateResult<1>;
|
|
9
13
|
}
|
|
10
14
|
declare global {
|
|
@@ -3,16 +3,22 @@ import { Ref } from 'lit/directives/ref.js';
|
|
|
3
3
|
export declare class NgcInputText extends InputBase {
|
|
4
4
|
static styles: import('lit').CSSResult[];
|
|
5
5
|
_inputRef: Ref<HTMLInputElement>;
|
|
6
|
+
_controlRef: Ref<HTMLDivElement>;
|
|
6
7
|
for: string;
|
|
7
8
|
render(): import('lit').TemplateResult<1>;
|
|
8
|
-
|
|
9
|
+
get shouldHaveStartMarkup(): string;
|
|
10
|
+
get shouldHaveEndMarkup(): string | boolean;
|
|
11
|
+
get startIconMarkup(): import('lit').TemplateResult<1> | null;
|
|
12
|
+
get endIconMarkup(): import('lit').TemplateResult<1> | null;
|
|
9
13
|
get labelMarkup(): import('lit').TemplateResult<1>;
|
|
10
14
|
get isAriaInvalid(): "true" | "false";
|
|
11
15
|
get errorClass(): "" | "gator-has-error";
|
|
12
|
-
get
|
|
13
|
-
get
|
|
14
|
-
|
|
16
|
+
get bottomText(): import('lit').TemplateResult<1> | null;
|
|
17
|
+
get passwordVisibilityMarkup(): import('lit').TemplateResult<1> | null;
|
|
18
|
+
handleChange(e: Event): void;
|
|
15
19
|
togglePasswordVisibility(): void;
|
|
20
|
+
handleInputFocusIn(): void;
|
|
21
|
+
handleInputFocusOut(): void;
|
|
16
22
|
}
|
|
17
23
|
declare global {
|
|
18
24
|
interface HTMLElementTagNameMap {
|
|
@@ -1,12 +1,15 @@
|
|
|
1
1
|
import { NjcTooltip } from '../tooltip.ts';
|
|
2
|
-
import { TemplateResult } from 'lit';
|
|
3
2
|
export declare class NgcTooltip extends NjcTooltip {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
3
|
+
static shadowRootOptions: {
|
|
4
|
+
delegatesFocus: boolean;
|
|
5
|
+
mode: ShadowRootMode;
|
|
6
|
+
serializable?: boolean;
|
|
7
|
+
slotAssignment?: SlotAssignmentMode;
|
|
8
|
+
};
|
|
9
|
+
static styles: import('lit').CSSResult[];
|
|
10
|
+
render(): import('lit').TemplateResult<1>;
|
|
7
11
|
get xPositionOffset(): number;
|
|
8
12
|
get yPositionOffset(): number;
|
|
9
13
|
get nubbinPositionClass(): "" | "gator-tooltip-nubbin_bottom" | "gator-tooltip-nubbin_left" | "gator-tooltip-nubbin_top" | "gator-tooltip-nubbin_right";
|
|
10
|
-
get tooltipContent(): "" | TemplateResult;
|
|
11
14
|
assignPosition(): void;
|
|
12
15
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Placement } from '@floating-ui/dom';
|
|
2
|
-
import { LitElement } from 'lit';
|
|
3
2
|
import { Ref } from 'lit/directives/ref.js';
|
|
4
|
-
|
|
3
|
+
import { TestableLitElement } from '../../utils/components/testable-lit-element/testable-lit-element.ts';
|
|
4
|
+
export declare class NjcTooltip extends TestableLitElement {
|
|
5
5
|
referenceId: string;
|
|
6
6
|
placement: Placement;
|
|
7
7
|
xOffset: number;
|
package/package.json
CHANGED
package/web-types.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
|
|
3
3
|
"name": "@ncino/web-components",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "2.0.0-preview.1",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
@@ -747,11 +747,18 @@
|
|
|
747
747
|
"description": "\n---\n",
|
|
748
748
|
"doc-url": "",
|
|
749
749
|
"attributes": [
|
|
750
|
-
{ "name": "for", "value": { "type": "string", "default": "''" } }
|
|
750
|
+
{ "name": "for", "value": { "type": "string", "default": "''" } },
|
|
751
|
+
{
|
|
752
|
+
"name": "required",
|
|
753
|
+
"value": { "type": "boolean", "default": "false" }
|
|
754
|
+
}
|
|
751
755
|
],
|
|
752
756
|
"events": [],
|
|
753
757
|
"js": {
|
|
754
|
-
"properties": [
|
|
758
|
+
"properties": [
|
|
759
|
+
{ "name": "for", "type": "string" },
|
|
760
|
+
{ "name": "required", "type": "boolean" }
|
|
761
|
+
],
|
|
755
762
|
"events": []
|
|
756
763
|
}
|
|
757
764
|
},
|
|
@@ -1511,25 +1518,41 @@
|
|
|
1511
1518
|
"name": "error-text",
|
|
1512
1519
|
"value": { "type": "string", "default": "''" }
|
|
1513
1520
|
},
|
|
1521
|
+
{
|
|
1522
|
+
"name": "help-text",
|
|
1523
|
+
"value": { "type": "string", "default": "''" }
|
|
1524
|
+
},
|
|
1514
1525
|
{
|
|
1515
1526
|
"name": "type",
|
|
1516
1527
|
"value": { "type": "string", "default": "'text'" }
|
|
1517
1528
|
},
|
|
1518
1529
|
{
|
|
1519
|
-
"name": "icon
|
|
1530
|
+
"name": "start-icon",
|
|
1520
1531
|
"value": { "type": "string", "default": "''" }
|
|
1532
|
+
},
|
|
1533
|
+
{
|
|
1534
|
+
"name": "end-icon",
|
|
1535
|
+
"value": { "type": "string", "default": "''" }
|
|
1536
|
+
},
|
|
1537
|
+
{
|
|
1538
|
+
"name": "data-testid",
|
|
1539
|
+
"value": { "type": "string | undefined", "default": "undefined" }
|
|
1521
1540
|
}
|
|
1522
1541
|
],
|
|
1523
1542
|
"events": [],
|
|
1524
1543
|
"js": {
|
|
1525
1544
|
"properties": [
|
|
1526
1545
|
{ "name": "_inputRef", "type": "Ref<HTMLInputElement>" },
|
|
1546
|
+
{ "name": "_controlRef", "type": "Ref<HTMLDivElement>" },
|
|
1527
1547
|
{ "name": "for", "type": "string" },
|
|
1548
|
+
{ "name": "shouldHaveStartMarkup" },
|
|
1549
|
+
{ "name": "shouldHaveEndMarkup" },
|
|
1550
|
+
{ "name": "startIconMarkup" },
|
|
1551
|
+
{ "name": "endIconMarkup" },
|
|
1528
1552
|
{ "name": "labelMarkup" },
|
|
1529
1553
|
{ "name": "isAriaInvalid" },
|
|
1530
1554
|
{ "name": "errorClass" },
|
|
1531
|
-
{ "name": "
|
|
1532
|
-
{ "name": "iconRightMarkup" },
|
|
1555
|
+
{ "name": "bottomText" },
|
|
1533
1556
|
{ "name": "passwordVisibilityMarkup" },
|
|
1534
1557
|
{ "name": "id", "type": "string" },
|
|
1535
1558
|
{ "name": "required", "type": "boolean" },
|
|
@@ -1538,8 +1561,14 @@
|
|
|
1538
1561
|
{ "name": "placeholder", "type": "string" },
|
|
1539
1562
|
{ "name": "value", "type": "string | number | undefined | null" },
|
|
1540
1563
|
{ "name": "errorText", "type": "string" },
|
|
1564
|
+
{ "name": "helpText", "type": "string" },
|
|
1541
1565
|
{ "name": "type", "type": "string" },
|
|
1542
|
-
{ "name": "
|
|
1566
|
+
{ "name": "startIcon", "type": "string" },
|
|
1567
|
+
{ "name": "endIcon", "type": "string" },
|
|
1568
|
+
{ "name": "dataTestid", "type": "string | undefined" },
|
|
1569
|
+
{ "name": "labelDataTestid" },
|
|
1570
|
+
{ "name": "helpTextDataTestid" },
|
|
1571
|
+
{ "name": "errorMessageDataTestid" }
|
|
1543
1572
|
],
|
|
1544
1573
|
"events": []
|
|
1545
1574
|
}
|
|
@@ -1615,13 +1644,25 @@
|
|
|
1615
1644
|
"name": "error-text",
|
|
1616
1645
|
"value": { "type": "string", "default": "''" }
|
|
1617
1646
|
},
|
|
1647
|
+
{
|
|
1648
|
+
"name": "help-text",
|
|
1649
|
+
"value": { "type": "string", "default": "''" }
|
|
1650
|
+
},
|
|
1618
1651
|
{
|
|
1619
1652
|
"name": "type",
|
|
1620
1653
|
"value": { "type": "string", "default": "'text'" }
|
|
1621
1654
|
},
|
|
1622
1655
|
{
|
|
1623
|
-
"name": "icon
|
|
1656
|
+
"name": "start-icon",
|
|
1657
|
+
"value": { "type": "string", "default": "''" }
|
|
1658
|
+
},
|
|
1659
|
+
{
|
|
1660
|
+
"name": "end-icon",
|
|
1624
1661
|
"value": { "type": "string", "default": "''" }
|
|
1662
|
+
},
|
|
1663
|
+
{
|
|
1664
|
+
"name": "data-testid",
|
|
1665
|
+
"value": { "type": "string | undefined", "default": "undefined" }
|
|
1625
1666
|
}
|
|
1626
1667
|
],
|
|
1627
1668
|
"events": [],
|
|
@@ -1638,8 +1679,14 @@
|
|
|
1638
1679
|
{ "name": "placeholder", "type": "string" },
|
|
1639
1680
|
{ "name": "value", "type": "string | number | undefined | null" },
|
|
1640
1681
|
{ "name": "errorText", "type": "string" },
|
|
1682
|
+
{ "name": "helpText", "type": "string" },
|
|
1641
1683
|
{ "name": "type", "type": "string" },
|
|
1642
|
-
{ "name": "
|
|
1684
|
+
{ "name": "startIcon", "type": "string" },
|
|
1685
|
+
{ "name": "endIcon", "type": "string" },
|
|
1686
|
+
{ "name": "dataTestid", "type": "string | undefined" },
|
|
1687
|
+
{ "name": "labelDataTestid" },
|
|
1688
|
+
{ "name": "helpTextDataTestid" },
|
|
1689
|
+
{ "name": "errorMessageDataTestid" }
|
|
1643
1690
|
],
|
|
1644
1691
|
"events": []
|
|
1645
1692
|
}
|
|
@@ -2275,6 +2322,10 @@
|
|
|
2275
2322
|
{
|
|
2276
2323
|
"name": "y-offset",
|
|
2277
2324
|
"value": { "type": "number", "default": "0" }
|
|
2325
|
+
},
|
|
2326
|
+
{
|
|
2327
|
+
"name": "data-testid",
|
|
2328
|
+
"value": { "type": "string | undefined", "default": "undefined" }
|
|
2278
2329
|
}
|
|
2279
2330
|
],
|
|
2280
2331
|
"events": [],
|
|
@@ -2283,14 +2334,17 @@
|
|
|
2283
2334
|
{ "name": "xPositionOffset" },
|
|
2284
2335
|
{ "name": "yPositionOffset" },
|
|
2285
2336
|
{ "name": "nubbinPositionClass" },
|
|
2286
|
-
{ "name": "tooltipContent" },
|
|
2287
2337
|
{ "name": "referenceId", "type": "string" },
|
|
2288
2338
|
{ "name": "placement", "type": "Placement" },
|
|
2289
2339
|
{ "name": "xOffset", "type": "number" },
|
|
2290
2340
|
{ "name": "yOffset", "type": "number" },
|
|
2291
2341
|
{ "name": "_tooltipRef", "type": "Ref<HTMLElement>" },
|
|
2292
2342
|
{ "name": "_cleanup", "type": "(() => void) | undefined" },
|
|
2293
|
-
{ "name": "tooltipId" }
|
|
2343
|
+
{ "name": "tooltipId" },
|
|
2344
|
+
{ "name": "dataTestid", "type": "string | undefined" },
|
|
2345
|
+
{ "name": "labelDataTestid" },
|
|
2346
|
+
{ "name": "helpTextDataTestid" },
|
|
2347
|
+
{ "name": "errorMessageDataTestid" }
|
|
2294
2348
|
],
|
|
2295
2349
|
"events": []
|
|
2296
2350
|
}
|
|
@@ -2315,6 +2369,10 @@
|
|
|
2315
2369
|
{
|
|
2316
2370
|
"name": "y-offset",
|
|
2317
2371
|
"value": { "type": "number", "default": "0" }
|
|
2372
|
+
},
|
|
2373
|
+
{
|
|
2374
|
+
"name": "data-testid",
|
|
2375
|
+
"value": { "type": "string | undefined", "default": "undefined" }
|
|
2318
2376
|
}
|
|
2319
2377
|
],
|
|
2320
2378
|
"events": [],
|
|
@@ -2329,7 +2387,11 @@
|
|
|
2329
2387
|
{ "name": "yOffset", "type": "number" },
|
|
2330
2388
|
{ "name": "_tooltipRef", "type": "Ref<HTMLElement>" },
|
|
2331
2389
|
{ "name": "_cleanup", "type": "(() => void) | undefined" },
|
|
2332
|
-
{ "name": "tooltipId" }
|
|
2390
|
+
{ "name": "tooltipId" },
|
|
2391
|
+
{ "name": "dataTestid", "type": "string | undefined" },
|
|
2392
|
+
{ "name": "labelDataTestid" },
|
|
2393
|
+
{ "name": "helpTextDataTestid" },
|
|
2394
|
+
{ "name": "errorMessageDataTestid" }
|
|
2333
2395
|
],
|
|
2334
2396
|
"events": []
|
|
2335
2397
|
}
|