@ncino/web-components 13.11.1 → 13.12.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/checkbox/checkbox.gator.js +16 -14
- package/dist/components/display-card/display-card.js +1 -1
- package/dist/components/display-card/gator/display-card.gator.js +7 -6
- package/dist/packages/web-components/src/components/checkbox/checkbox.gator.scss.js +1 -1
- package/dist/types/components/display-card/display-card.d.ts +5 -0
- package/package.json +3 -3
- package/web-types.json +6 -1
|
@@ -1,19 +1,21 @@
|
|
|
1
|
-
import{property as o}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{customElement as c}from"../../utils/decorators/custom-element-decorator.js";import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as d,nothing as u}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{ref as m}from"../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/ref.js";import{generateRandomId as b,getElementId as f}from"../../utils/string-utils.js";import{ifDefined as p}from"../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/if-defined.js";import{NgcInputText as v}from"../input/gator/input-text/input-text.gator.js";import g from"../../packages/web-components/src/components/checkbox/checkbox.gator.scss.js";import{unsafeCSS as x}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var y=Object.defineProperty,$=Object.getOwnPropertyDescriptor,
|
|
1
|
+
import{property as o}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{customElement as c}from"../../utils/decorators/custom-element-decorator.js";import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as d,nothing as u}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{ref as m}from"../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/ref.js";import{generateRandomId as b,getElementId as f}from"../../utils/string-utils.js";import{ifDefined as p}from"../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/if-defined.js";import{NgcInputText as v}from"../input/gator/input-text/input-text.gator.js";import g from"../../packages/web-components/src/components/checkbox/checkbox.gator.scss.js";import{unsafeCSS as x}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var y=Object.defineProperty,$=Object.getOwnPropertyDescriptor,k=Object.getPrototypeOf,_=Reflect.get,s=(e,r,a,l)=>{for(var i=l>1?void 0:l?$(r,a):r,h=e.length-1,n;h>=0;h--)(n=e[h])&&(i=(l?n(r,a,i):n(i))||i);return l&&i&&y(r,a,i),i},T=(e,r,a)=>_(k(e),a,r);let t=class extends v{constructor(){super(...arguments),this.titleText="",this.selected=!1,this.indeterminate=!1,this.hideLabel=!1,this.grouped=!1,this._randomId=b()}updated(e){super.updated(e),e.has("indeterminate")&&this.inputRef.value&&(this.inputRef.value.indeterminate=this.indeterminate),e.has("errorText")&&this.inputRef.value&&this.inputRef.value.setCustomValidity(this.errorText?"true":"")}render(){const e=this.elementId;return d`
|
|
2
2
|
<div class="gator-form-element">
|
|
3
3
|
<div id="${e}-checkbox" class="gator-checkbox">
|
|
4
|
-
<div class="gator-checkbox-input-
|
|
5
|
-
<input
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
4
|
+
<div class="gator-checkbox-input-align">
|
|
5
|
+
<div class="gator-checkbox-input-wrapper">
|
|
6
|
+
<input
|
|
7
|
+
${m(this.inputRef)}
|
|
8
|
+
id="${e}"
|
|
9
|
+
class="gator-checkbox-input"
|
|
10
|
+
type="checkbox"
|
|
11
|
+
.checked="${this.selected}"
|
|
12
|
+
?disabled="${this.disabled}"
|
|
13
|
+
aria-labelledby="${p(this.hideLabel?void 0:`${e}-checkbox`)}"
|
|
14
|
+
aria-describedby=${this.ariaDescribedby}
|
|
15
|
+
@change="${this.handleChange}"
|
|
16
|
+
aria-label=${p(this.hideLabel?this.titleText:void 0)}
|
|
17
|
+
/>
|
|
18
|
+
</div>
|
|
17
19
|
</div>
|
|
18
20
|
${this.hideLabel?null:d`
|
|
19
21
|
<label
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{NjcCard as
|
|
1
|
+
import{NjcCard as l}from"../card/card.js";import{property as o}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";var u=Object.defineProperty,i=(e,a,p,f)=>{for(var t=void 0,r=e.length-1,s;r>=0;r--)(s=e[r])&&(t=s(a,p,t)||t);return t&&u(a,p,t),t};class n extends l{constructor(){super(...arguments),this.actionButtonText="",this.hideFooter=!1,this.invertTitle=!1}}i([o({type:String,attribute:"action-button-text"})],n.prototype,"actionButtonText");i([o({type:Boolean,attribute:"hide-footer"})],n.prototype,"hideFooter");i([o({attribute:"invert-title",type:Boolean})],n.prototype,"invertTitle");export{n as NjcDisplayCard};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import{NjcDisplayCard as h}from"../display-card.js";import"../../card/gator/header/card-header.gator.js";import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as t,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 p from"../../../packages/web-components/src/components/card/gator/base/card.gator.scss.js";import u from"../../../packages/web-components/src/components/display-card/gator/display-card.gator.scss.js";import m from"../../../packages/styles/dist/tokens/primitive.tokens.css.js";import f from"../../../packages/styles/dist/tokens/semantic.tokens.css.js";import{customElement as k}from"../../../utils/decorators/custom-element-decorator.js";import"../../icon/gator/icon.gator.js";import"../../icon/gator/templates/index.js";import"../../button/gator/button.gator.js";import{ifDefined as
|
|
2
|
-
<ngc-card class="${
|
|
1
|
+
import{NjcDisplayCard as h}from"../display-card.js";import"../../card/gator/header/card-header.gator.js";import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as t,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 p from"../../../packages/web-components/src/components/card/gator/base/card.gator.scss.js";import u from"../../../packages/web-components/src/components/display-card/gator/display-card.gator.scss.js";import m from"../../../packages/styles/dist/tokens/primitive.tokens.css.js";import f from"../../../packages/styles/dist/tokens/semantic.tokens.css.js";import{customElement as k}from"../../../utils/decorators/custom-element-decorator.js";import"../../icon/gator/icon.gator.js";import"../../icon/gator/templates/index.js";import"../../button/gator/button.gator.js";import{ifDefined as i}from"../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/if-defined.js";import{classMap as $}from"../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/class-map.js";import{unsafeCSS as n}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var b=Object.getOwnPropertyDescriptor,v=(e,r,g,c)=>{for(var o=c>1?void 0:c?b(r,g):r,s=e.length-1,l;s>=0;s--)(l=e[s])&&(o=l(o)||o);return o};let a=class extends h{render(){return t`
|
|
2
|
+
<ngc-card class="${$(this.classes)}">
|
|
3
3
|
${this.headerMarkup}
|
|
4
4
|
${this.contentMarkup}
|
|
5
5
|
${this.footerMarkup}
|
|
@@ -8,10 +8,11 @@ import{NjcDisplayCard as h}from"../display-card.js";import"../../card/gator/head
|
|
|
8
8
|
<ngc-card-header>
|
|
9
9
|
<ngc-text-detail
|
|
10
10
|
size="large"
|
|
11
|
-
.title=${
|
|
12
|
-
.subtitle=${
|
|
11
|
+
.title=${i(this.title)}
|
|
12
|
+
.subtitle=${i(this.subtitle)}
|
|
13
13
|
?skeleton=${this.skeleton}
|
|
14
14
|
.dataTestid=${this.dataTestid}
|
|
15
|
+
.invertTitle=${this.invertTitle}
|
|
15
16
|
>
|
|
16
17
|
<slot name="top-right" slot="append"></slot>
|
|
17
18
|
</ngc-text-detail>
|
|
@@ -34,7 +35,7 @@ import{NjcDisplayCard as h}from"../display-card.js";import"../../card/gator/head
|
|
|
34
35
|
`,r=t`
|
|
35
36
|
<ngc-button
|
|
36
37
|
variant="base"
|
|
37
|
-
data-testid=${
|
|
38
|
+
data-testid=${i(this.dataTestid)}-action-button
|
|
38
39
|
@click="${this.handleActionClick}"
|
|
39
40
|
>
|
|
40
41
|
${this.actionButtonText}
|
|
@@ -46,4 +47,4 @@ import{NjcDisplayCard as h}from"../display-card.js";import"../../card/gator/head
|
|
|
46
47
|
${this.skeleton?e:r}
|
|
47
48
|
</div>
|
|
48
49
|
</ngc-card-footer>
|
|
49
|
-
`}handleActionClick(){this.dispatchEvent(new CustomEvent("action-click",{bubbles:!0}))}};
|
|
50
|
+
`}handleActionClick(){this.dispatchEvent(new CustomEvent("action-click",{bubbles:!0}))}};a.styles=[n(u),n(m),n(p),n(f)];a=v([k("ngc-display-card")],a);export{a as NgcDisplayCard};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const r='.gator-checkbox{display:flex;width:fit-content;flex-direction:row;align-items:
|
|
1
|
+
const r='.gator-checkbox{display:flex;width:fit-content;flex-direction:row;align-items:flex-start;gap:.5rem;margin:var(--ngc-checkbox-margin-y, .5rem) 0;padding:.2rem;cursor:pointer}.gator-checkbox:has(input:disabled){cursor:not-allowed}.gator-checkbox-title{font-family:var(--font-family-body, "Open Sans"),sans-serif;color:var(--ngc-checkbox-title-color-default, var(--color-text-primary, #1F1F1F));font-size:var(--ngc-checkbox-title-font-size, var(--font-size-body-1, 1.0625rem));line-height:var(--ngc-checkbox-title-line-height, var(--line-height-body-1, 1.5rem));cursor:pointer}.gator-checkbox:has(input:disabled) .gator-checkbox-title{cursor:not-allowed}.gator-checkbox-input-wrapper:has(:focus-visible){box-shadow:0 0 0 2px var(--color-surface-primary-white, #FFF),0 0 0 4px var(--ngc-checkbox-color-focus-indicator, var(--color-border-focus, #1F1F1F))}.gator-checkbox-input-wrapper:has(:focus-visible) input:focus-visible{outline:none}input{margin:0;border-radius:var(--border-radius-small, .25rem);accent-color:var(--ngc-checkbox-color-selected, var(--color-feedback-brand, #103656));cursor:pointer}input:disabled{cursor:not-allowed}.gator-checkbox-input-align{display:flex;align-items:center;min-height:var(--ngc-checkbox-title-line-height, var(--line-height-body-1, 1.5rem))}.gator-checkbox-input-wrapper{display:flex;align-items:center;border-radius:2px;outline:1px solid transparent;outline-offset:-1px;transform:scale(1.4)}.gator-checkbox-input-wrapper:has(input:invalid:not(:checked,:indeterminate,:disabled)){outline-color:var(--ngc-checkbox-color-error, var(--color-feedback-error, #D44011))}.gator-checkbox-input-wrapper:has(input:invalid:not(:checked,:indeterminate,:disabled)):hover{outline-color:var(--ngc-checkbox-color-error-hover, var(--color-feedback-error, #D44011));background:var(--color-surface-error, #FAEBE7)}.gator-checkbox-input-wrapper:has(input:not(:checked,:indeterminate,:disabled)){outline-color:var(--ngc-checkbox-color-border-unselected, var(--color-border-primary, #6D6D6D));background:var(--color-surface-primary, #FFFFFF)}.gator-checkbox-input-wrapper:has(input:not(:checked,:indeterminate,:disabled)):hover{outline-color:var(--ngc-checkbox-color-border-hover, var(--color-feedback-brand-secondary, #0D2B45));background:var(--color-surface-brand-secondary, #DAE7F1)}input:not(:checked,:indeterminate,:disabled){opacity:0}input:checked,input:indeterminate,input:disabled{opacity:1}input:invalid{accent-color:var(--ngc-checkbox-color-error, var(--color-feedback-error, #D44011))}';export{r as default};
|
|
@@ -8,4 +8,9 @@ export declare class NjcDisplayCard extends NjcCard {
|
|
|
8
8
|
* @property {boolean} hideFooter - Whether to hide the footer.
|
|
9
9
|
*/
|
|
10
10
|
hideFooter: boolean;
|
|
11
|
+
/**
|
|
12
|
+
* @description If true, the title and content positions will be inverted
|
|
13
|
+
* @property {boolean} invertTitle
|
|
14
|
+
*/
|
|
15
|
+
invertTitle: boolean;
|
|
11
16
|
}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ncino/web-components",
|
|
3
3
|
"author": "nCino",
|
|
4
|
-
"version": "13.
|
|
4
|
+
"version": "13.12.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": "13.
|
|
103
|
+
"@ncino/styles": "13.12.0"
|
|
104
104
|
},
|
|
105
105
|
"peerDependencies": {
|
|
106
|
-
"@ncino/styles": "13.
|
|
106
|
+
"@ncino/styles": "13.12.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": "13.11.
|
|
4
|
+
"version": "13.11.2",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
@@ -2879,6 +2879,10 @@
|
|
|
2879
2879
|
"name": "hide-footer",
|
|
2880
2880
|
"value": { "type": "boolean", "default": "false" }
|
|
2881
2881
|
},
|
|
2882
|
+
{
|
|
2883
|
+
"name": "invert-title",
|
|
2884
|
+
"value": { "type": "boolean", "default": "false" }
|
|
2885
|
+
},
|
|
2882
2886
|
{
|
|
2883
2887
|
"name": "subtitle",
|
|
2884
2888
|
"value": { "type": "string", "default": "''" }
|
|
@@ -2913,6 +2917,7 @@
|
|
|
2913
2917
|
{ "name": "footerMarkup" },
|
|
2914
2918
|
{ "name": "actionButtonText", "type": "string" },
|
|
2915
2919
|
{ "name": "hideFooter", "type": "boolean" },
|
|
2920
|
+
{ "name": "invertTitle", "type": "boolean" },
|
|
2916
2921
|
{ "name": "title", "type": "string" },
|
|
2917
2922
|
{ "name": "subtitle", "type": "string" },
|
|
2918
2923
|
{ "name": "elevated", "type": "boolean" },
|