@ncino/web-components 15.0.0 → 15.1.0
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/button/button.js +1 -1
- package/dist/components/button/gator/button.gator.js +23 -10
- package/dist/components/button-card/button-card.js +1 -1
- package/dist/components/button-card/gator/button-card.gator.js +37 -20
- package/dist/packages/web-components/src/components/button/gator/button.gator.scss.js +1 -1
- package/dist/packages/web-components/src/components/button-card/gator/button-card.gator.scss.js +1 -1
- package/dist/types/components/button/button.d.ts +14 -0
- package/dist/types/components/button/gator/button.gator.d.ts +10 -0
- package/dist/types/components/button-card/button-card.d.ts +15 -0
- package/dist/types/components/button-card/gator/button-card.gator.d.ts +12 -0
- package/package.json +3 -3
- package/web-types.json +36 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{property as t}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{TestableLitElement as s}from"../../utils/components/testable-lit-element/testable-lit-element.js";import{AttributeDeletionMixin as
|
|
1
|
+
import{property as t}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{TestableLitElement as s}from"../../utils/components/testable-lit-element/testable-lit-element.js";import{AttributeDeletionMixin as y}from"../../utils/mixins/attribute-deletion.js";var d=Object.defineProperty,e=(i,p,l,b)=>{for(var a=void 0,o=i.length-1,n;o>=0;o--)(n=i[o])&&(a=n(p,l,a)||a);return a&&d(p,l,a),a};class r extends y(s){constructor(){super(...arguments),this.variant="primary",this.size="medium",this.ariaLabel="",this.loadingAriaLabel="Loading",this.disabled=!1,this.loading=!1,this.skeleton=!1,this.href="",this.target=""}}e([t()],r.prototype,"variant");e([t()],r.prototype,"size");e([t({type:String,attribute:"aria-label"})],r.prototype,"ariaLabel");e([t({type:String,attribute:"loading-aria-label"})],r.prototype,"loadingAriaLabel");e([t({type:Boolean})],r.prototype,"disabled");e([t({type:Boolean})],r.prototype,"loading");e([t({type:Boolean})],r.prototype,"skeleton");e([t({type:String})],r.prototype,"href");e([t({type:String})],r.prototype,"target");export{r as NjcButton};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as
|
|
1
|
+
import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as r,nothing as d}from"../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/lit-html.js";import"../../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";import{property as g}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{customElement as b}from"../../../utils/decorators/custom-element-decorator.js";import{ifDefined as o}from"../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/if-defined.js";import{NjcButton as p}from"../button.js";import m from"../../../packages/web-components/src/components/button/gator/button.gator.scss.js";import f from"../../../packages/styles/dist/tokens/primitive.tokens.css.js";import k from"../../../packages/styles/dist/tokens/semantic.tokens.css.js";import"../../loading-spinner/gator/loading-spinner.gator.js";import"../../icon/gator/icon.gator.js";import"../../icon/gator/templates/index.js";import{unsafeCSS as c}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var $=Object.defineProperty,v=Object.getOwnPropertyDescriptor,l=(t,e,a,i)=>{for(var s=i>1?void 0:i?v(e,a):e,u=t.length-1,h;u>=0;u--)(h=t[u])&&(s=(i?h(e,a,s):h(s))||s);return i&&s&&$(e,a,s),s};let n=class extends p{constructor(){super(...arguments),this.type="submit"}render(){return this.skeleton?this.skeletonMarkup:this.isLinkMode?this.anchorMarkup:this.buttonMarkup}get isLinkMode(){return!!this.href&&!this.disabled&&!this.loading}get buttonMarkup(){return r`
|
|
2
2
|
<button
|
|
3
3
|
aria-label=${this.buttonAriaLabel}
|
|
4
|
-
data-testid=${
|
|
4
|
+
data-testid=${o(this.dataTestid?`${this.dataTestid}-button`:void 0)}
|
|
5
5
|
class="gator-button ${this.variantClass} ${this.sizeClass} ${this.loadingClass}"
|
|
6
6
|
.disabled="${this.disabled}"
|
|
7
7
|
aria-disabled="${this.disabled||this.loading}"
|
|
@@ -9,13 +9,26 @@ import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit
|
|
|
9
9
|
type="${this.type}"
|
|
10
10
|
>
|
|
11
11
|
${this.loading?this.loadingMarkup:null}
|
|
12
|
-
|
|
13
|
-
<slot name="start-icon">${this.startIconMarkup}</slot>
|
|
14
|
-
<span class="gator-button-text"><slot></slot></span>
|
|
15
|
-
<slot name="end-icon">${this.endIconMarkup}</slot>
|
|
16
|
-
</div>
|
|
12
|
+
${this.buttonContentMarkup}
|
|
17
13
|
</button>
|
|
18
|
-
`}get
|
|
14
|
+
`}get anchorMarkup(){return r`
|
|
15
|
+
<a
|
|
16
|
+
aria-label=${this.buttonAriaLabel}
|
|
17
|
+
data-testid=${o(this.dataTestid?`${this.dataTestid}-button`:void 0)}
|
|
18
|
+
class="gator-button ${this.variantClass} ${this.sizeClass}"
|
|
19
|
+
href=${o(this.href||void 0)}
|
|
20
|
+
target=${o(this.target||void 0)}
|
|
21
|
+
@click="${this.handleAnchorClick}"
|
|
22
|
+
>
|
|
23
|
+
${this.buttonContentMarkup}
|
|
24
|
+
</a>
|
|
25
|
+
`}get buttonContentMarkup(){return r`
|
|
26
|
+
<div class="gator-button-content">
|
|
27
|
+
<slot name="start-icon">${this.startIconMarkup}</slot>
|
|
28
|
+
<span class="gator-button-text"><slot></slot></span>
|
|
29
|
+
<slot name="end-icon">${this.endIconMarkup}</slot>
|
|
30
|
+
</div>
|
|
31
|
+
`}get startIconMarkup(){return this.startIcon?r`<ngc-icon name="${this.startIcon}"></ngc-icon>`:d}get endIconMarkup(){return this.endIcon?r`<ngc-icon name="${this.endIcon}"></ngc-icon>`:d}get buttonAriaLabel(){return this.loading?this.loadingAriaLabel:this.dataset.ariaLabel?this.dataset.ariaLabel:this.ariaLabel?this.ariaLabel:d}get variantClass(){return this.variant?`gator-button_${this.variant}`:null}get sizeClass(){return this.size?`gator-button_${this.size}`:null}get loadingClass(){return this.loading?"gator-button_loading":null}get skeletonMarkup(){let t,e;const a=this.variant==="base";switch(this.size){case"small":t=a?44:67,e=28;break;case"medium":t=a?50:81,e=36;break;case"xlarge":t=a?57:137,e=56;break;default:t=a?57:98,e=48;break}const i=getComputedStyle(this);return i.getPropertyValue("--ngc-button-width")&&(t=Number(i.getPropertyValue("--ngc-button-width").trim())),i.getPropertyValue("--ngc-button-height")&&(e=Number(i.getPropertyValue("--ngc-button-height").trim())),r`
|
|
19
32
|
<ngc-skeleton-loader
|
|
20
33
|
class="gator-button gator-button-skeleton"
|
|
21
34
|
width="${t}"
|
|
@@ -23,8 +36,8 @@ import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit
|
|
|
23
36
|
radius="2"
|
|
24
37
|
@click="${this.handleClick}"
|
|
25
38
|
></ngc-skeleton-loader>
|
|
26
|
-
`}get loadingMarkup(){let t;switch(this.size){case"large":case"xlarge":t="large";break;default:t="medium";break}return
|
|
39
|
+
`}get loadingMarkup(){let t;switch(this.size){case"large":case"xlarge":t="large";break;default:t="medium";break}return r`
|
|
27
40
|
<div class="gator-button-loader">
|
|
28
41
|
<ngc-loading-spinner .size="${t}"></ngc-loading-spinner>
|
|
29
42
|
</div>
|
|
30
|
-
`}handleClick(t){if(t.preventDefault(),t.stopPropagation(),!(this.disabled||this.loading||this.skeleton)){if(this.type==="submit"){const e=this.closest("form");e&&(e.reportValidity(),e.checkValidity()&&e.requestSubmit())}this.dispatchEvent(new CustomEvent("click",{bubbles:!0,composed:!0}))}}};
|
|
43
|
+
`}handleClick(t){if(t.preventDefault(),t.stopPropagation(),!(this.disabled||this.loading||this.skeleton)){if(this.type==="submit"){const e=this.closest("form");e&&(e.reportValidity(),e.checkValidity()&&e.requestSubmit())}this.dispatchEvent(new CustomEvent("click",{bubbles:!0,composed:!0}))}}handleAnchorClick(t){(this.disabled||this.loading||this.skeleton)&&(t.preventDefault(),t.stopPropagation())}};n.shadowRootOptions={...p.shadowRootOptions,delegatesFocus:!0};n.styles=[c(m),c(f),c(k)];l([g({type:String,attribute:"start-icon"})],n.prototype,"startIcon",2);l([g({type:String,attribute:"end-icon"})],n.prototype,"endIcon",2);l([g({attribute:"type"})],n.prototype,"type",2);n=l([b("ngc-button")],n);export{n as NgcButton};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{NjcCard as
|
|
1
|
+
import{NjcCard as n}from"../card/card.js";import{property as e}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";var c=Object.defineProperty,r=(o,i,s,f)=>{for(var t=void 0,a=o.length-1,l;a>=0;a--)(l=o[a])&&(t=l(i,s,t)||t);return t&&c(i,s,t),t};class p extends n{constructor(){super(...arguments),this.chipLabel="",this.selected=!1,this.href="",this.target=""}}r([e({attribute:"chip-label",type:String})],p.prototype,"chipLabel");r([e({type:Boolean,reflect:!0})],p.prototype,"selected");r([e({type:String})],p.prototype,"href");r([e({type:String})],p.prototype,"target");export{p as NjcButtonCard};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{NjcButtonCard as u}from"../button-card.js";import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as
|
|
1
|
+
import{NjcButtonCard as u}from"../button-card.js";import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as r}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{property as f}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{state as b}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";import{customElement as g}from"../../../utils/decorators/custom-element-decorator.js";import{ifDefined as a}from"../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/if-defined.js";import{classMap as k}from"../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/class-map.js";import{KEY_CONSTANTS as p}from"../../../consts/key-constants.js";import $ from"../../../packages/web-components/src/components/button-card/gator/button-card.gator.scss.js";import y from"../../../packages/styles/dist/tokens/primitive.tokens.css.js";import C from"../../../packages/styles/dist/tokens/semantic.tokens.css.js";import"../../chip/gator/chip.gator.js";import"../../card/gator/base/card.gator.js";import"../../card/gator/header/card-header.gator.js";import"../../card/gator/content/card-content.gator.js";import"../../card/gator/footer/card-footer.gator.js";import"../../text-detail/gator/text-detail.gator.js";import{unsafeCSS as c}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var v=Object.defineProperty,_=Object.getOwnPropertyDescriptor,h=(t,i,d,e)=>{for(var s=e>1?void 0:e?_(i,d):i,l=t.length-1,n;l>=0;l--)(n=t[l])&&(s=(e?n(i,d,s):n(s))||s);return e&&s&&v(i,d,s),s};let o=class extends u{constructor(){super(...arguments),this.chipType=null,this._showDefault=null,this._selectedInLinkModeWarned=!1}firstUpdated(t){super.firstUpdated(t),this._checkSlotContent()}updated(t){super.updated(t),this.isLinkMode&&this.selected&&!this._selectedInLinkModeWarned&&(this._selectedInLinkModeWarned=!0,console.warn("ngc-button-card: `selected` (aria-pressed) is ignored in link mode (when `href` is set). The selected/toggle state applies to button mode only."))}get isLinkMode(){return!!this.href&&!this.disabled}render(){return this.isLinkMode?this.linkMarkup:this.buttonMarkup}get buttonMarkup(){return r`
|
|
2
2
|
<ngc-card
|
|
3
3
|
tabindex="${this.disabled?"-1":"0"}"
|
|
4
4
|
role="button"
|
|
@@ -8,30 +8,47 @@ import{NjcButtonCard as u}from"../button-card.js";import"../../../node_modules/.
|
|
|
8
8
|
@click=${this.handleClick}
|
|
9
9
|
@keydown=${this.handleKeydown}
|
|
10
10
|
?disabled="${this.disabled}"
|
|
11
|
-
class="${
|
|
11
|
+
class="${k(this.cardClasses)}"
|
|
12
12
|
>
|
|
13
|
-
${this.
|
|
14
|
-
|
|
15
|
-
${this._showDefault===!0?a`
|
|
16
|
-
<div class="gator-button-card-container ${this.disabledClass}">
|
|
17
|
-
<ngc-text-detail
|
|
18
|
-
.title=${this.title}
|
|
19
|
-
.subtitle=${this.subtitle}
|
|
20
|
-
data-testid=${n(this.dataTestid)}-text-detail
|
|
21
|
-
>
|
|
22
|
-
<slot name="start" slot="prepend"></slot>
|
|
23
|
-
<slot name="end" slot="append"></slot>
|
|
24
|
-
</ngc-text-detail>
|
|
25
|
-
</div>
|
|
26
|
-
`:a`<slot></slot>`}
|
|
13
|
+
${this.cardBodyMarkup}
|
|
27
14
|
</ngc-card>
|
|
28
|
-
`}
|
|
15
|
+
`}get linkMarkup(){return r`
|
|
16
|
+
<a
|
|
17
|
+
class="gator-button-card-link"
|
|
18
|
+
href=${a(this.href||void 0)}
|
|
19
|
+
target=${a(this.target||void 0)}
|
|
20
|
+
data-testid=${a(this.dataTestid?`${this.dataTestid}-button-card-link`:void 0)}
|
|
21
|
+
@click=${this.handleAnchorClick}
|
|
22
|
+
>
|
|
23
|
+
<ngc-card
|
|
24
|
+
?elevated="${this.elevated}"
|
|
25
|
+
?outlined="${this.outlined}"
|
|
26
|
+
>
|
|
27
|
+
${this.cardBodyMarkup}
|
|
28
|
+
</ngc-card>
|
|
29
|
+
</a>
|
|
30
|
+
`}get cardBodyMarkup(){return r`
|
|
31
|
+
${this.cardLabelMarkup}
|
|
32
|
+
|
|
33
|
+
${this._showDefault===!0?r`
|
|
34
|
+
<div class="gator-button-card-container ${this.disabledClass}">
|
|
35
|
+
<ngc-text-detail
|
|
36
|
+
.title=${this.title}
|
|
37
|
+
.subtitle=${this.subtitle}
|
|
38
|
+
data-testid=${a(this.dataTestid)}-text-detail
|
|
39
|
+
>
|
|
40
|
+
<slot name="start" slot="prepend"></slot>
|
|
41
|
+
<slot name="end" slot="append"></slot>
|
|
42
|
+
</ngc-text-detail>
|
|
43
|
+
</div>
|
|
44
|
+
`:r`<slot></slot>`}
|
|
45
|
+
`}_checkSlotContent(){const t=this.shadowRoot?.querySelector("slot:not([name])");if(t){const d=t.assignedNodes({flatten:!0}).some(e=>e.nodeType===Node.ELEMENT_NODE?!0:e.nodeType===Node.TEXT_NODE?(e.textContent?.trim().length??0)>0:!1);this._showDefault=!d}}get cardClasses(){return{selected:this.selected}}get cardLabelMarkup(){return this.chipLabel?r`
|
|
29
46
|
<ngc-chip
|
|
30
47
|
?disabled="${this.disabled}"
|
|
31
48
|
class="gator-button-card-chip-label"
|
|
32
|
-
data-testid=${
|
|
33
|
-
type="${
|
|
49
|
+
data-testid=${a(this.dataTestid)}-chip
|
|
50
|
+
type="${a(this.chipType||void 0)}"
|
|
34
51
|
readonly
|
|
35
52
|
>
|
|
36
53
|
${this.chipLabel}
|
|
37
|
-
</ngc-chip>`:null}get disabledClass(){return this.disabled?"gator-button-card_disabled":""}handleClick(t){t.preventDefault(),t.stopImmediatePropagation(),!this.disabled&&this.dispatchEvent(new CustomEvent("click",{bubbles:!0}))}click(){this.handleClick(new CustomEvent("click",{bubbles:!0}))}handleKeydown(t){[
|
|
54
|
+
</ngc-chip>`:null}get disabledClass(){return this.disabled?"gator-button-card_disabled":""}handleClick(t){t.preventDefault(),t.stopImmediatePropagation(),!this.disabled&&this.dispatchEvent(new CustomEvent("click",{bubbles:!0}))}click(){if(this.isLinkMode){this.shadowRoot?.querySelector("a")?.click();return}this.handleClick(new CustomEvent("click",{bubbles:!0}))}handleKeydown(t){[p.ENTER,p.SPACE].includes(t.key)&&this.handleClick(t)}handleAnchorClick(t){this.disabled&&(t.preventDefault(),t.stopImmediatePropagation())}};o.shadowRootOptions={...m.shadowRootOptions,delegatesFocus:!0};o.styles=[c($),c(y),c(C)];h([f({type:String,attribute:"chip-type"})],o.prototype,"chipType",2);h([b()],o.prototype,"_showDefault",2);o=h([g("ngc-button-card")],o);export{o as NgcButtonCard};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const o='.gator-button{--box-shadow-default: 0 5px 10px 0px var(--shadow-color-5), 0 7px 14px 0px var(--shadow-color-8), 0 3px 6px 0px var(--shadow-color-4);display:inline-flex;align-items:center;justify-content:center;border-style:none;cursor:pointer;font-family:var(--font-family-body, "Open Sans"),sans-serif;font-weight:var(--ngc-button-font-weight, var(--font-weight-semi-bold, 600));margin:var(--ngc-button-margin, auto);width:var(--ngc-button-width, auto);position:var(--ngc-button-position, relative);border-radius:var(--ngc-button-border-radius, var(--border-radius-x-small, 2px));gap:.5rem}.gator-button ngc-icon{--ngc-icon-color: var(--ngc-button-icon-color, var(--color-icon-inverse, #FFFFFF))}.gator-button:focus-visible{outline:var(--ngc-button-focus-outline, 2px solid var(--ngc-button-focus-outline-color, var(--color-border-neutral, #1F1F1F)));outline-offset:2px}.gator-button:disabled{cursor:not-allowed}.gator-button.gator-button_loading{cursor:not-allowed}.gator-button-loader{display:flex;align-items:center;justify-content:center;position:absolute}.gator-button-loader+.gator-button-text{visibility:hidden}.gator-button-skeleton{background-color:var(--color-surface-loading, #DBDBDB);cursor:default}.gator-button-content{display:flex;align-items:center;justify-content:center;gap:.5rem}.gator-button_loading .gator-button-content{visibility:hidden}.gator-button_small{font-size:var(--ngc-button-font-size, var(--font-size-body-3, .8125rem));line-height:var(--ngc-button-line-height, var(--line-height-body-3, 1.125rem));padding:var(--ngc-button-padding, 0 .75rem);min-width:var(--ngc-button-min-width, 3.5rem);height:var(--ngc-button-height, 1.75rem)}.gator-button_medium{font-size:var(--ngc-button-font-size, var(--font-size-body-2, .9375rem));line-height:var(--ngc-button-line-height, var(--line-height-body-2, 1.375rem));padding:var(--ngc-button-padding, 0 1rem);min-width:var(--ngc-button-min-width, 4rem);height:var(--ngc-button-height, 2.25rem)}.gator-button_large{font-size:var(--ngc-button-font-size, var(--font-size-body-1, 1.0625rem));line-height:var(--ngc-button-line-height, var(--line-height-body-1, 1.5rem));padding:var(--ngc-button-padding, 0 1rem);min-width:var(--ngc-button-min-width, 6rem);height:var(--ngc-button-height, 3rem)}.gator-button_xlarge{font-size:var(--ngc-button-font-size, var(--font-size-body-1, 1.0625rem));line-height:var(--ngc-button-line-height, var(--line-height-body-1, 1.5rem));padding:var(--ngc-button-padding, 0 2.5rem);min-width:var(--ngc-button-min-width, 7.5rem);height:var(--ngc-button-height, 3.5rem)}.gator-button_primary{background-color:var(--ngc-button-background-color, var(--color-feedback-brand, #103656));color:var(--ngc-button-color, var(--color-text-inverse, #FFFFFF))}.gator-button_primary:not([disabled]):not(.gator-button_loading):hover{background-color:var(--ngc-button-hover-background-color, var(--color-feedback-brand-secondary, #0D2B45));color:var(--ngc-button-hover-color, var(--color-text-inverse, #FFFFFF));box-shadow:var(--ngc-button-hover-box-shadow, var(--shadow-2-card-raised, var(--box-shadow-default)))}.gator-button_primary:not([disabled]):not(.gator-button_loading):active{background-color:var(--ngc-button-pressed-background-color, var(--color-feedback-brand-tertiary, #061622));color:var(--ngc-button-pressed-color, var(--color-text-inverse, #FFFFFF));box-shadow:none}.gator-button_primary:disabled{background-color:var(--ngc-button-disabled-background-color, var(--color-surface-disabled, #E5E5E5));color:var(--ngc-button-disabled-color, var(--color-text-disabled, #BFBFBF))}.gator-button_primary.gator-button_loading{background-color:var(--ngc-button-loading-background-color, var(--color-feedback-brand-tertiary, #061622))}.gator-button_secondary{background-color:var(--ngc-button-background-color, transparent);color:var(--ngc-button-color, var(--color-text-brand, #103656))}.gator-button_secondary:before{content:"";position:absolute;inset:0;border-radius:var(--ngc-button-border-radius, var(--border-radius-x-small, 2px));border-width:1px;border-color:var(--ngc-button-border-color, var(--color-border-brand, #103656));border-style:solid}.gator-button_secondary ngc-icon{--ngc-icon-color: var(--ngc-button-icon-color, var(--color-icon-brand, #103656))}.gator-button_secondary:not([disabled]):not(.gator-button_loading):hover{background-color:var(--ngc-button-hover-background-color, var(--color-surface-secondary, #F7F7F7));box-shadow:var(--ngc-button-hover-box-shadow, var(--shadow-2-card-raised, var(--box-shadow-default)))}.gator-button_secondary:not([disabled]):not(.gator-button_loading):active{background-color:var(--ngc-button-pressed-background-color, var(--color-surface-secondary, #F7F7F7));box-shadow:none}.gator-button_secondary:disabled{color:var(--ngc-button-disabled-color, var(--color-text-disabled, #BFBFBF));cursor:not-allowed}.gator-button_secondary:disabled ngc-icon{--ngc-icon-color: var(--color-icon-disabled)}.gator-button_secondary:disabled:before{border-color:var(--ngc-button-border-color, var(--color-border-secondary, #BFBFBF))}.gator-button_secondary.gator-button_loading{background-color:var(--ngc-button-loading-background-color, var(--color-surface-secondary, #F7F7F7))}.gator-button_secondary.gator-button_loading:before{border-color:var(--ngc-button-border-color, var(--color-border-secondary, #BFBFBF))}.gator-button_destructive{background-color:var(--ngc-button-background-color, var(--color-feedback-error, #D44011));color:var(--ngc-button-color, var(--color-text-inverse, #FFFFFF))}.gator-button_destructive:not([disabled]):not(.gator-button_loading):hover{box-shadow:var(--ngc-button-hover-box-shadow, var(--shadow-2-card-raised, var(--box-shadow-default)));background-color:var(--ngc-button-hover-background-color, var(--color-feedback-error-secondary, #AA330E))}.gator-button_destructive:not([disabled]):not(.gator-button_loading):active{background-color:var(--ngc-button-pressed-background-color, var(--color-feedback-error-secondary, #AA330E));box-shadow:none}.gator-button_destructive:disabled{background-color:var(--ngc-button-disabled-background-color, var(--color-surface-disabled, #E5E5E5));color:var(--ngc-button-disabled-color, var(--color-text-disabled, #BFBFBF))}.gator-button_destructive.gator-button_loading{background-color:var(--ngc-button-loading-background-color, var(--color-feedback-error-tertiary, #9E2500))}.gator-button_base{background-color:var(--ngc-button-background-color, transparent);color:var(--ngc-button-color, var(--color-text-brand, #103656));padding:3px 0}.gator-button_base ngc-icon{--ngc-icon-color: var(--ngc-button-icon-color, var(--color-icon-brand, #103656))}.gator-button_base .gator-button-text{border-bottom:1px solid var(--color-underline-primary, #BFBFBF)}.gator-button_base.gator-button_small{min-width:2.75rem}.gator-button_base.gator-button_medium{min-width:3.125rem}.gator-button_base.gator-button_large,.gator-button_base.gator-button_xlarge{min-width:3.5625rem}.gator-button_base:not([disabled]):not(.gator-button_loading):hover .gator-button-text{box-shadow:var(--ngc-button-hover-box-shadow, none);color:var(--ngc-button-hover-color, var(--color-text-brand, #103656));border-bottom:1px solid var(--color-underline-brand, #103656)}.gator-button_base:not([disabled]):not(.gator-button_loading):active .gator-button-text{color:var(--ngc-button-pressed-color, var(--color-text-brand, #103656));border-bottom:1px solid var(--color-underline-brand, #103656)}.gator-button_base:disabled{color:var(--ngc-button-color, var(--color-text-disabled, #BFBFBF))}.gator-button_base:disabled .gator-button-text{border-bottom:1px solid var(--color-text-disabled, #BFBFBF)}';export{o as default};
|
|
1
|
+
const o='.gator-button{--box-shadow-default: 0 5px 10px 0px var(--shadow-color-5), 0 7px 14px 0px var(--shadow-color-8), 0 3px 6px 0px var(--shadow-color-4);display:inline-flex;align-items:center;justify-content:center;border-style:none;cursor:pointer;text-decoration:none;font-family:var(--font-family-body, "Open Sans"),sans-serif;font-weight:var(--ngc-button-font-weight, var(--font-weight-semi-bold, 600));margin:var(--ngc-button-margin, auto);width:var(--ngc-button-width, auto);position:var(--ngc-button-position, relative);border-radius:var(--ngc-button-border-radius, var(--border-radius-x-small, 2px));gap:.5rem}.gator-button ngc-icon{--ngc-icon-color: var(--ngc-button-icon-color, var(--color-icon-inverse, #FFFFFF))}.gator-button:focus-visible{outline:var(--ngc-button-focus-outline, 2px solid var(--ngc-button-focus-outline-color, var(--color-border-neutral, #1F1F1F)));outline-offset:2px}.gator-button:disabled{cursor:not-allowed}.gator-button.gator-button_loading{cursor:not-allowed}.gator-button-loader{display:flex;align-items:center;justify-content:center;position:absolute}.gator-button-loader+.gator-button-text{visibility:hidden}.gator-button-skeleton{background-color:var(--color-surface-loading, #DBDBDB);cursor:default}.gator-button-content{display:flex;align-items:center;justify-content:center;gap:.5rem}.gator-button_loading .gator-button-content{visibility:hidden}.gator-button_small{font-size:var(--ngc-button-font-size, var(--font-size-body-3, .8125rem));line-height:var(--ngc-button-line-height, var(--line-height-body-3, 1.125rem));padding:var(--ngc-button-padding, 0 .75rem);min-width:var(--ngc-button-min-width, 3.5rem);height:var(--ngc-button-height, 1.75rem)}.gator-button_medium{font-size:var(--ngc-button-font-size, var(--font-size-body-2, .9375rem));line-height:var(--ngc-button-line-height, var(--line-height-body-2, 1.375rem));padding:var(--ngc-button-padding, 0 1rem);min-width:var(--ngc-button-min-width, 4rem);height:var(--ngc-button-height, 2.25rem)}.gator-button_large{font-size:var(--ngc-button-font-size, var(--font-size-body-1, 1.0625rem));line-height:var(--ngc-button-line-height, var(--line-height-body-1, 1.5rem));padding:var(--ngc-button-padding, 0 1rem);min-width:var(--ngc-button-min-width, 6rem);height:var(--ngc-button-height, 3rem)}.gator-button_xlarge{font-size:var(--ngc-button-font-size, var(--font-size-body-1, 1.0625rem));line-height:var(--ngc-button-line-height, var(--line-height-body-1, 1.5rem));padding:var(--ngc-button-padding, 0 2.5rem);min-width:var(--ngc-button-min-width, 7.5rem);height:var(--ngc-button-height, 3.5rem)}.gator-button_primary{background-color:var(--ngc-button-background-color, var(--color-feedback-brand, #103656));color:var(--ngc-button-color, var(--color-text-inverse, #FFFFFF))}.gator-button_primary:not([disabled]):not(.gator-button_loading):hover{background-color:var(--ngc-button-hover-background-color, var(--color-feedback-brand-secondary, #0D2B45));color:var(--ngc-button-hover-color, var(--color-text-inverse, #FFFFFF));box-shadow:var(--ngc-button-hover-box-shadow, var(--shadow-2-card-raised, var(--box-shadow-default)))}.gator-button_primary:not([disabled]):not(.gator-button_loading):active{background-color:var(--ngc-button-pressed-background-color, var(--color-feedback-brand-tertiary, #061622));color:var(--ngc-button-pressed-color, var(--color-text-inverse, #FFFFFF));box-shadow:none}.gator-button_primary:disabled{background-color:var(--ngc-button-disabled-background-color, var(--color-surface-disabled, #E5E5E5));color:var(--ngc-button-disabled-color, var(--color-text-disabled, #BFBFBF))}.gator-button_primary.gator-button_loading{background-color:var(--ngc-button-loading-background-color, var(--color-feedback-brand-tertiary, #061622))}.gator-button_secondary{background-color:var(--ngc-button-background-color, transparent);color:var(--ngc-button-color, var(--color-text-brand, #103656))}.gator-button_secondary:before{content:"";position:absolute;inset:0;border-radius:var(--ngc-button-border-radius, var(--border-radius-x-small, 2px));border-width:1px;border-color:var(--ngc-button-border-color, var(--color-border-brand, #103656));border-style:solid}.gator-button_secondary ngc-icon{--ngc-icon-color: var(--ngc-button-icon-color, var(--color-icon-brand, #103656))}.gator-button_secondary:not([disabled]):not(.gator-button_loading):hover{background-color:var(--ngc-button-hover-background-color, var(--color-surface-secondary, #F7F7F7));box-shadow:var(--ngc-button-hover-box-shadow, var(--shadow-2-card-raised, var(--box-shadow-default)))}.gator-button_secondary:not([disabled]):not(.gator-button_loading):active{background-color:var(--ngc-button-pressed-background-color, var(--color-surface-secondary, #F7F7F7));box-shadow:none}.gator-button_secondary:disabled{color:var(--ngc-button-disabled-color, var(--color-text-disabled, #BFBFBF));cursor:not-allowed}.gator-button_secondary:disabled ngc-icon{--ngc-icon-color: var(--color-icon-disabled)}.gator-button_secondary:disabled:before{border-color:var(--ngc-button-border-color, var(--color-border-secondary, #BFBFBF))}.gator-button_secondary.gator-button_loading{background-color:var(--ngc-button-loading-background-color, var(--color-surface-secondary, #F7F7F7))}.gator-button_secondary.gator-button_loading:before{border-color:var(--ngc-button-border-color, var(--color-border-secondary, #BFBFBF))}.gator-button_destructive{background-color:var(--ngc-button-background-color, var(--color-feedback-error, #D44011));color:var(--ngc-button-color, var(--color-text-inverse, #FFFFFF))}.gator-button_destructive:not([disabled]):not(.gator-button_loading):hover{box-shadow:var(--ngc-button-hover-box-shadow, var(--shadow-2-card-raised, var(--box-shadow-default)));background-color:var(--ngc-button-hover-background-color, var(--color-feedback-error-secondary, #AA330E))}.gator-button_destructive:not([disabled]):not(.gator-button_loading):active{background-color:var(--ngc-button-pressed-background-color, var(--color-feedback-error-secondary, #AA330E));box-shadow:none}.gator-button_destructive:disabled{background-color:var(--ngc-button-disabled-background-color, var(--color-surface-disabled, #E5E5E5));color:var(--ngc-button-disabled-color, var(--color-text-disabled, #BFBFBF))}.gator-button_destructive.gator-button_loading{background-color:var(--ngc-button-loading-background-color, var(--color-feedback-error-tertiary, #9E2500))}.gator-button_base{background-color:var(--ngc-button-background-color, transparent);color:var(--ngc-button-color, var(--color-text-brand, #103656));padding:3px 0}.gator-button_base ngc-icon{--ngc-icon-color: var(--ngc-button-icon-color, var(--color-icon-brand, #103656))}.gator-button_base .gator-button-text{border-bottom:1px solid var(--color-underline-primary, #BFBFBF)}.gator-button_base.gator-button_small{min-width:2.75rem}.gator-button_base.gator-button_medium{min-width:3.125rem}.gator-button_base.gator-button_large,.gator-button_base.gator-button_xlarge{min-width:3.5625rem}.gator-button_base:not([disabled]):not(.gator-button_loading):hover .gator-button-text{box-shadow:var(--ngc-button-hover-box-shadow, none);color:var(--ngc-button-hover-color, var(--color-text-brand, #103656));border-bottom:1px solid var(--color-underline-brand, #103656)}.gator-button_base:not([disabled]):not(.gator-button_loading):active .gator-button-text{color:var(--ngc-button-pressed-color, var(--color-text-brand, #103656));border-bottom:1px solid var(--color-underline-brand, #103656)}.gator-button_base:disabled{color:var(--ngc-button-color, var(--color-text-disabled, #BFBFBF))}.gator-button_base:disabled .gator-button-text{border-bottom:1px solid var(--color-text-disabled, #BFBFBF)}';export{o as default};
|
package/dist/packages/web-components/src/components/button-card/gator/button-card.gator.scss.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const t=":host{max-width:var(--ngc-button-card-width, 21rem)}ngc-card{--ngc-card-display: var(--ngc-button-card-display, flex);--ngc-card-max-width: var(--ngc-button-card-width, 21rem);--ngc-card-padding: var(--spacing-8);cursor:pointer}ngc-card:hover{--ngc-card-box-shadow: var(--shadow-4-modal)}ngc-card:active{--ngc-card-background-color: var(--ngc-button-card-pressed-background-color, var(--color-surface-brand, #F0F5FA))}ngc-card[outline]:active{--ngc-card-outline: 1px solid var(--ngc-button-card-pressed-outline-color, var(--color-border-brand-tertiary, #BDCDDC))}ngc-card.selected{--ngc-card-outline: 1px solid var(--ngc-button-card-selected-outline-color, var(--color-stroke-brand, #11395B))}ngc-card[disabled]:hover,ngc-card[disabled]:active,ngc-card[disabled].selected{--ngc-card-box-shadow: unset;--ngc-card-background-color: unset;--ngc-card-outline: unset;--ngc-card-border: unset;cursor:not-allowed}ngc-card:focus-visible{--ngc-card-outline: 2px solid var(--ngc-button-card-focused-outline-color, var(--color-border-neutral, #1F1F1F))}ngc-chip{--ngc-chip-font-size: var(--font-size-body-3, .8125rem);--ngc-chip-line-height: var(--line-height-body-2, 1.125rem)}ngc-text-detail{width:100%;--ngc-text-detail-title-color: var(--color-text-primary, #1F1F1F);--ngc-text-detail-title-font-size: var(--font-size-sibtitle-1, 1.0625rem);--ngc-text-detail-title-font-weight: var(--font-weight-bold, 700);--ngc-text-detail-title-line-height: var(--line-height-sibtitle-1, 1.5rem);--ngc-text-detail-subtitle-color: var(--color-text-secondary, #6D6D6D);--ngc-text-detail-subtitle-line-height: var(--line-height-body-2, 1.375rem);--ngc-text-detail-subtitle-font-size: var(--font-size-body-2, .9375rem)}.gator-button-card-chip-label{position:absolute;top:0;left:var(--spacing-8);transform:translateY(-50%);--ngc-chip-cursor: pointer}.gator-button-card-container{display:inline-flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%}.gator-button-card_disabled ngc-text-detail{--ngc-text-detail-title-color: var(--color-text-disabled, #6D6D6D);--ngc-text-detail-subtitle-color: var(--color-text-disabled, #6D6D6D)}";export{t as default};
|
|
1
|
+
const t=":host{max-width:var(--ngc-button-card-width, 21rem)}ngc-card{--ngc-card-display: var(--ngc-button-card-display, flex);--ngc-card-max-width: var(--ngc-button-card-width, 21rem);--ngc-card-padding: var(--spacing-8);cursor:pointer}ngc-card:hover{--ngc-card-box-shadow: var(--shadow-4-modal)}ngc-card:active{--ngc-card-background-color: var(--ngc-button-card-pressed-background-color, var(--color-surface-brand, #F0F5FA))}ngc-card[outline]:active{--ngc-card-outline: 1px solid var(--ngc-button-card-pressed-outline-color, var(--color-border-brand-tertiary, #BDCDDC))}ngc-card.selected{--ngc-card-outline: 1px solid var(--ngc-button-card-selected-outline-color, var(--color-stroke-brand, #11395B))}ngc-card[disabled]:hover,ngc-card[disabled]:active,ngc-card[disabled].selected{--ngc-card-box-shadow: unset;--ngc-card-background-color: unset;--ngc-card-outline: unset;--ngc-card-border: unset;cursor:not-allowed}ngc-card:focus-visible{--ngc-card-outline: 2px solid var(--ngc-button-card-focused-outline-color, var(--color-border-neutral, #1F1F1F))}ngc-chip{--ngc-chip-font-size: var(--font-size-body-3, .8125rem);--ngc-chip-line-height: var(--line-height-body-2, 1.125rem)}ngc-text-detail{width:100%;--ngc-text-detail-title-color: var(--color-text-primary, #1F1F1F);--ngc-text-detail-title-font-size: var(--font-size-sibtitle-1, 1.0625rem);--ngc-text-detail-title-font-weight: var(--font-weight-bold, 700);--ngc-text-detail-title-line-height: var(--line-height-sibtitle-1, 1.5rem);--ngc-text-detail-subtitle-color: var(--color-text-secondary, #6D6D6D);--ngc-text-detail-subtitle-line-height: var(--line-height-body-2, 1.375rem);--ngc-text-detail-subtitle-font-size: var(--font-size-body-2, .9375rem)}.gator-button-card-link{display:block;text-decoration:none;color:inherit;cursor:pointer;outline:none;border-radius:var(--ngc-card-border-radius, var(--border-radius-x-large, 1rem))}.gator-button-card-link:focus-visible{--ngc-card-outline: 2px solid var(--ngc-button-card-focused-outline-color, var(--color-border-neutral, #1F1F1F))}.gator-button-card-chip-label{position:absolute;top:0;left:var(--spacing-8);transform:translateY(-50%);--ngc-chip-cursor: pointer}.gator-button-card-container{display:inline-flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%}.gator-button-card_disabled ngc-text-detail{--ngc-text-detail-title-color: var(--color-text-disabled, #6D6D6D);--ngc-text-detail-subtitle-color: var(--color-text-disabled, #6D6D6D)}";export{t as default};
|
|
@@ -38,5 +38,19 @@ export declare class NjcButton extends NjcButton_base {
|
|
|
38
38
|
@type {boolean}
|
|
39
39
|
**/
|
|
40
40
|
skeleton: boolean;
|
|
41
|
+
/**
|
|
42
|
+
@property href - When set, the button renders as a real navigable anchor (`<a>`) styled as the
|
|
43
|
+
button, giving native open-in-new-tab, modifier/middle-click, copy-link and the link
|
|
44
|
+
screen-reader role without an outer `<a>` wrapper. When empty, standard `<button>` semantics are
|
|
45
|
+
kept. Ignored while `disabled` or `loading`. For inline text links prefer `ngc-text-link`.
|
|
46
|
+
@type {string}
|
|
47
|
+
**/
|
|
48
|
+
href: string;
|
|
49
|
+
/**
|
|
50
|
+
@property target - The browsing context for the link when `href` is set (e.g. `_blank`,
|
|
51
|
+
`_self`). Has no effect without `href`.
|
|
52
|
+
@type {string}
|
|
53
|
+
**/
|
|
54
|
+
target: string;
|
|
41
55
|
}
|
|
42
56
|
export {};
|
|
@@ -17,6 +17,15 @@ export declare class NgcButton extends NjcButton {
|
|
|
17
17
|
endIcon: string | undefined;
|
|
18
18
|
type: 'submit' | 'button' | 'reset';
|
|
19
19
|
render(): import('lit').TemplateResult<1>;
|
|
20
|
+
/**
|
|
21
|
+
* Link mode is active only when an `href` is provided and the button is neither disabled nor
|
|
22
|
+
* loading. Disabled/loading intentionally fall back to `<button>` so a link can never navigate
|
|
23
|
+
* while in those states.
|
|
24
|
+
*/
|
|
25
|
+
get isLinkMode(): boolean;
|
|
26
|
+
get buttonMarkup(): import('lit').TemplateResult<1>;
|
|
27
|
+
get anchorMarkup(): import('lit').TemplateResult<1>;
|
|
28
|
+
get buttonContentMarkup(): import('lit').TemplateResult<1>;
|
|
20
29
|
get startIconMarkup(): import('lit').TemplateResult<1> | typeof nothing;
|
|
21
30
|
get endIconMarkup(): import('lit').TemplateResult<1> | typeof nothing;
|
|
22
31
|
get buttonAriaLabel(): string | typeof nothing;
|
|
@@ -26,6 +35,7 @@ export declare class NgcButton extends NjcButton {
|
|
|
26
35
|
get skeletonMarkup(): import('lit').TemplateResult<1>;
|
|
27
36
|
get loadingMarkup(): import('lit').TemplateResult<1>;
|
|
28
37
|
handleClick(event: Event): void;
|
|
38
|
+
handleAnchorClick(event: Event): void;
|
|
29
39
|
}
|
|
30
40
|
declare global {
|
|
31
41
|
interface HTMLElementTagNameMap {
|
|
@@ -10,4 +10,19 @@ export declare class NjcButtonCard extends NjcCard {
|
|
|
10
10
|
* @property {boolean} selected
|
|
11
11
|
*/
|
|
12
12
|
selected: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* @description When set, the button card renders as a real navigable anchor (`<a>`) wrapping the
|
|
15
|
+
* card, providing native open-in-new-tab, modifier/middle-click, copy-link and the link
|
|
16
|
+
* screen-reader role without an outer `<a>` wrapper. When empty, the card keeps its
|
|
17
|
+
* `role="button"` toggle semantics. `selected`/`aria-pressed` apply to button mode only and are
|
|
18
|
+
* ignored in link mode.
|
|
19
|
+
* @property {string} href
|
|
20
|
+
*/
|
|
21
|
+
href: string;
|
|
22
|
+
/**
|
|
23
|
+
* @description The browsing context for the link when `href` is set (e.g. `_blank`, `_self`).
|
|
24
|
+
* Has no effect without `href`.
|
|
25
|
+
* @property {string} target
|
|
26
|
+
*/
|
|
27
|
+
target: string;
|
|
13
28
|
}
|
|
@@ -17,8 +17,19 @@ export declare class NgcButtonCard extends NjcButtonCard {
|
|
|
17
17
|
*/
|
|
18
18
|
chipType: NJC_CHIP_TYPES;
|
|
19
19
|
private _showDefault;
|
|
20
|
+
private _selectedInLinkModeWarned;
|
|
20
21
|
firstUpdated(_changedProperties: PropertyValues): void;
|
|
22
|
+
updated(_changedProperties: PropertyValues): void;
|
|
23
|
+
/**
|
|
24
|
+
* Link mode is active only when an `href` is provided and the card is not disabled. As with
|
|
25
|
+
* `ngc-button`, a disabled card falls back to button-mode markup so a link can never navigate
|
|
26
|
+
* while disabled.
|
|
27
|
+
*/
|
|
28
|
+
get isLinkMode(): boolean;
|
|
21
29
|
render(): import('lit').TemplateResult<1>;
|
|
30
|
+
get buttonMarkup(): import('lit').TemplateResult<1>;
|
|
31
|
+
get linkMarkup(): import('lit').TemplateResult<1>;
|
|
32
|
+
get cardBodyMarkup(): import('lit').TemplateResult<1>;
|
|
22
33
|
private _checkSlotContent;
|
|
23
34
|
get cardClasses(): {
|
|
24
35
|
selected: boolean;
|
|
@@ -28,4 +39,5 @@ export declare class NgcButtonCard extends NjcButtonCard {
|
|
|
28
39
|
handleClick(event: Event): void;
|
|
29
40
|
click(): void;
|
|
30
41
|
handleKeydown(event: KeyboardEvent): void;
|
|
42
|
+
handleAnchorClick(event: Event): void;
|
|
31
43
|
}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ncino/web-components",
|
|
3
3
|
"author": "nCino",
|
|
4
|
-
"version": "15.
|
|
4
|
+
"version": "15.1.0",
|
|
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": "15.
|
|
103
|
+
"@ncino/styles": "15.1.0"
|
|
104
104
|
},
|
|
105
105
|
"peerDependencies": {
|
|
106
|
-
"@ncino/styles": "15.
|
|
106
|
+
"@ncino/styles": "15.1.0"
|
|
107
107
|
},
|
|
108
108
|
"bugs": {
|
|
109
109
|
"url": "https://github.com/ncino/force-sdk-web-components/issues"
|
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": "15.0.0",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
@@ -1734,6 +1734,11 @@
|
|
|
1734
1734
|
"name": "skeleton",
|
|
1735
1735
|
"value": { "type": "boolean", "default": "false" }
|
|
1736
1736
|
},
|
|
1737
|
+
{ "name": "href", "value": { "type": "string", "default": "''" } },
|
|
1738
|
+
{
|
|
1739
|
+
"name": "target",
|
|
1740
|
+
"value": { "type": "string", "default": "''" }
|
|
1741
|
+
},
|
|
1737
1742
|
{
|
|
1738
1743
|
"name": "data-testid",
|
|
1739
1744
|
"value": { "type": "string | undefined", "default": "undefined" }
|
|
@@ -1760,6 +1765,8 @@
|
|
|
1760
1765
|
{ "name": "disabled", "type": "boolean" },
|
|
1761
1766
|
{ "name": "loading", "type": "boolean" },
|
|
1762
1767
|
{ "name": "skeleton", "type": "boolean" },
|
|
1768
|
+
{ "name": "href", "type": "string" },
|
|
1769
|
+
{ "name": "target", "type": "string" },
|
|
1763
1770
|
{ "name": "dataTestid", "type": "string | undefined" },
|
|
1764
1771
|
{ "name": "labelDataTestid" },
|
|
1765
1772
|
{ "name": "helpTextDataTestid" },
|
|
@@ -1874,6 +1881,11 @@
|
|
|
1874
1881
|
"name": "skeleton",
|
|
1875
1882
|
"value": { "type": "boolean", "default": "false" }
|
|
1876
1883
|
},
|
|
1884
|
+
{ "name": "href", "value": { "type": "string", "default": "''" } },
|
|
1885
|
+
{
|
|
1886
|
+
"name": "target",
|
|
1887
|
+
"value": { "type": "string", "default": "''" }
|
|
1888
|
+
},
|
|
1877
1889
|
{
|
|
1878
1890
|
"name": "data-testid",
|
|
1879
1891
|
"value": { "type": "string | undefined", "default": "undefined" }
|
|
@@ -1888,6 +1900,13 @@
|
|
|
1888
1900
|
{ "name": "startIcon", "type": "string | undefined" },
|
|
1889
1901
|
{ "name": "endIcon", "type": "string | undefined" },
|
|
1890
1902
|
{ "name": "type", "type": "'submit' | 'button' | 'reset'" },
|
|
1903
|
+
{
|
|
1904
|
+
"name": "isLinkMode",
|
|
1905
|
+
"description": "Link mode is active only when an `href` is provided and the button is neither disabled nor\nloading. Disabled/loading intentionally fall back to `<button>` so a link can never navigate\nwhile in those states."
|
|
1906
|
+
},
|
|
1907
|
+
{ "name": "buttonMarkup" },
|
|
1908
|
+
{ "name": "anchorMarkup" },
|
|
1909
|
+
{ "name": "buttonContentMarkup" },
|
|
1891
1910
|
{ "name": "startIconMarkup" },
|
|
1892
1911
|
{ "name": "endIconMarkup" },
|
|
1893
1912
|
{ "name": "buttonAriaLabel" },
|
|
@@ -1914,6 +1933,8 @@
|
|
|
1914
1933
|
{ "name": "disabled", "type": "boolean" },
|
|
1915
1934
|
{ "name": "loading", "type": "boolean" },
|
|
1916
1935
|
{ "name": "skeleton", "type": "boolean" },
|
|
1936
|
+
{ "name": "href", "type": "string" },
|
|
1937
|
+
{ "name": "target", "type": "string" },
|
|
1917
1938
|
{ "name": "dataTestid", "type": "string | undefined" },
|
|
1918
1939
|
{ "name": "labelDataTestid" },
|
|
1919
1940
|
{ "name": "helpTextDataTestid" },
|
|
@@ -1942,6 +1963,11 @@
|
|
|
1942
1963
|
"name": "selected",
|
|
1943
1964
|
"value": { "type": "boolean", "default": "false" }
|
|
1944
1965
|
},
|
|
1966
|
+
{ "name": "href", "value": { "type": "string", "default": "''" } },
|
|
1967
|
+
{
|
|
1968
|
+
"name": "target",
|
|
1969
|
+
"value": { "type": "string", "default": "''" }
|
|
1970
|
+
},
|
|
1945
1971
|
{
|
|
1946
1972
|
"name": "subtitle",
|
|
1947
1973
|
"value": { "type": "string", "default": "''" }
|
|
@@ -1974,11 +2000,20 @@
|
|
|
1974
2000
|
"name": "chipType",
|
|
1975
2001
|
"type": " | 'success' | 'warning' | 'error' | 'info' | 'ai'"
|
|
1976
2002
|
},
|
|
2003
|
+
{
|
|
2004
|
+
"name": "isLinkMode",
|
|
2005
|
+
"description": "Link mode is active only when an `href` is provided and the card is not disabled. As with\n`ngc-button`, a disabled card falls back to button-mode markup so a link can never navigate\nwhile disabled."
|
|
2006
|
+
},
|
|
2007
|
+
{ "name": "buttonMarkup" },
|
|
2008
|
+
{ "name": "linkMarkup" },
|
|
2009
|
+
{ "name": "cardBodyMarkup" },
|
|
1977
2010
|
{ "name": "cardClasses" },
|
|
1978
2011
|
{ "name": "cardLabelMarkup" },
|
|
1979
2012
|
{ "name": "disabledClass" },
|
|
1980
2013
|
{ "name": "chipLabel", "type": "string" },
|
|
1981
2014
|
{ "name": "selected", "type": "boolean" },
|
|
2015
|
+
{ "name": "href", "type": "string" },
|
|
2016
|
+
{ "name": "target", "type": "string" },
|
|
1982
2017
|
{ "name": "title", "type": "string" },
|
|
1983
2018
|
{ "name": "subtitle", "type": "string" },
|
|
1984
2019
|
{ "name": "elevated", "type": "boolean" },
|