@ncino/web-components 8.0.0-preview.5 → 8.0.0-preview.7
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-group/checkbox-group.gator.js +10 -3
- package/dist/components/input/base/input-base.gator.js +2 -1
- package/dist/components/input/base/input-base.js +1 -1
- package/dist/components/input/gator/input-label/input-label.gator.js +5 -4
- package/dist/components/input/gator/input-search/input-search.gator.js +1 -0
- package/dist/components/radio-group/radio-group.gator.js +11 -3
- package/dist/components/selection-box-group/selection-box-group.gator.js +8 -2
- package/dist/components/tabs/gator/tabset/tabset.gator.js +3 -3
- package/dist/packages/web-components/src/components/input/gator/input-label/input-label.gator.scss.js +1 -1
- package/dist/types/components/input/base/input-base.d.ts +11 -1
- package/dist/types/components/input/gator/input-label/input-label.gator.d.ts +5 -1
- package/dist/types/components/tabs/gator/tabset/tabset.gator.d.ts +2 -1
- package/dist/types/utils/components/gradient-background.d.ts +5 -0
- package/dist/types/utils/storybook-args.d.ts +28 -0
- package/dist/utils/components/gradient-background.js +33 -0
- package/dist/utils/components/slot-placeholder/slot-placeholder.js +4 -3
- package/dist/utils/storybook-args.js +1 -1
- package/package.json +1 -1
- package/web-types.json +194 -1
|
@@ -1,6 +1,13 @@
|
|
|
1
|
-
import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as l}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import"../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as h}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as d}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{generateRandomId as p,getElementId as u}from"../../utils/string-utils.js";import m from"../../packages/web-components/src/components/checkbox-group/checkbox-group.gator.scss.js";import"../checkbox/checkbox.gator.js";import"../input/gator/input-label/input-label.gator.js";import"../input/gator/help-text/help-text.gator.js";import{handleDataTestid as g}from"../../utils/datatestid-utils.js";import{ifDefined as b}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.js";import{NgcInputText as f}from"../input/gator/input-text/input-text.gator.js";import{createRef as x,ref as v}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/ref.js";import{unsafeCSS as y}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var $=Object.defineProperty,E=Object.getOwnPropertyDescriptor,
|
|
1
|
+
import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as l}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import"../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as h}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as d}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{generateRandomId as p,getElementId as u}from"../../utils/string-utils.js";import m from"../../packages/web-components/src/components/checkbox-group/checkbox-group.gator.scss.js";import"../checkbox/checkbox.gator.js";import"../input/gator/input-label/input-label.gator.js";import"../input/gator/help-text/help-text.gator.js";import{handleDataTestid as g}from"../../utils/datatestid-utils.js";import{ifDefined as b}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.js";import{NgcInputText as f}from"../input/gator/input-text/input-text.gator.js";import{createRef as x,ref as v}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/ref.js";import{unsafeCSS as y}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var $=Object.defineProperty,E=Object.getOwnPropertyDescriptor,R=Object.getPrototypeOf,_=Reflect.get,c=(e,t,o,r)=>{for(var s=r>1?void 0:r?E(t,o):t,a=e.length-1,n;a>=0;a--)(n=e[a])&&(s=(r?n(t,o,s):n(s))||s);return r&&s&&$(t,o,s),s},k=(e,t,o)=>_(R(e),o,t);let i=class extends f{constructor(){super(...arguments),this.options=[],this._randomId=p(),this.groupRef=x()}render(){const e=this.elementId;return l`
|
|
2
2
|
<div class="gator-checkbox-group-container" ${v(this.groupRef)} role="group">
|
|
3
|
-
${this.label?l
|
|
3
|
+
${this.label?l`
|
|
4
|
+
<ngc-input-label
|
|
5
|
+
id="${e}-label"
|
|
6
|
+
?required="${this.required&&!this.hideRequired}"
|
|
7
|
+
?optional="${this.optional}"
|
|
8
|
+
data-testid=${b(this.labelDataTestid)}>
|
|
9
|
+
${this.label}
|
|
10
|
+
</ngc-input-label>`:null}
|
|
4
11
|
<div id="${e}-group"
|
|
5
12
|
role="group"
|
|
6
13
|
class="gator-checkbox-group"
|
|
@@ -20,4 +27,4 @@ import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/re
|
|
|
20
27
|
>
|
|
21
28
|
</ngc-checkbox>
|
|
22
29
|
`)}
|
|
23
|
-
`}handleCheckboxSelectionChange(e){const t=e;e.stopImmediatePropagation();const o=new Set(this.value?.split(";"));t.detail.selected?o.add(t.detail.value):o.delete(t.detail.value),this.value=Array.from(o).join(";"),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:this.value}))}get checkboxElements(){if(this.options.length>0)return this.shadowRoot?.querySelectorAll("ngc-checkbox");const e=this.shadowRoot?.querySelector("slot")?.assignedElements();return e&&e.length===1&&e[0]instanceof HTMLSlotElement?e[0].assignedElements():e}updated(){const e=new Set(this.value?.split(";")),t=this.checkboxElements;t&&t.length>0&&t.forEach((o,r)=>{const s=o;s.selected=e.has(s.value),s.disabled=this.disabled,s.errorText=this.errorText,s.grouped=!0,g(s,this.dataTestid,`checkbox-${r}`)}),requestAnimationFrame(()=>{const o=this.shadowRoot?.querySelector("ngc-input-label"),r=this.shadowRoot?.querySelectorAll("ngc-help-text");o&&this.groupRef.value&&(this.groupRef.value.ariaLabelledByElements=[o]),r&&this.groupRef.value&&(this.groupRef.value.ariaDescribedByElements=Array.from(r))})}};i.styles=[...
|
|
30
|
+
`}handleCheckboxSelectionChange(e){const t=e;e.stopImmediatePropagation();const o=new Set(this.value?.split(";"));t.detail.selected?o.add(t.detail.value):o.delete(t.detail.value),this.value=Array.from(o).join(";"),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:this.value}))}get checkboxElements(){if(this.options.length>0)return this.shadowRoot?.querySelectorAll("ngc-checkbox");const e=this.shadowRoot?.querySelector("slot")?.assignedElements();return e&&e.length===1&&e[0]instanceof HTMLSlotElement?e[0].assignedElements():e}updated(){const e=new Set(this.value?.split(";")),t=this.checkboxElements;t&&t.length>0&&t.forEach((o,r)=>{const s=o;s.selected=e.has(s.value),s.disabled=this.disabled,s.errorText=this.errorText,s.grouped=!0,g(s,this.dataTestid,`checkbox-${r}`)}),requestAnimationFrame(()=>{const o=this.shadowRoot?.querySelector("ngc-input-label"),r=this.shadowRoot?.querySelectorAll("ngc-help-text");o&&this.groupRef.value&&(this.groupRef.value.ariaLabelledByElements=[o]),r&&this.groupRef.value&&(this.groupRef.value.ariaDescribedByElements=Array.from(r))})}};i.styles=[...k(i,i,"styles"),y(m)];c([d({type:Array})],i.prototype,"options",2);i=c([h("ngc-checkbox-group")],i);export{i as NgcCheckboxGroup};
|
|
@@ -6,9 +6,10 @@ import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit
|
|
|
6
6
|
<ngc-icon .name="${this.endIcon}"></ngc-icon>`:null}get labelMarkup(){return o`
|
|
7
7
|
<ngc-input-label
|
|
8
8
|
id="${this.labelId}"
|
|
9
|
-
?required="${this.required}"
|
|
9
|
+
?required="${this.required&&!this.hideRequired}"
|
|
10
10
|
?disabled="${this.disabled}"
|
|
11
11
|
?skeleton="${this.skeleton}"
|
|
12
|
+
?optional="${this.optional&&!this.required}"
|
|
12
13
|
>
|
|
13
14
|
${this.label}
|
|
14
15
|
</ngc-input-label>`}get labelId(){return`${this.id}-label`}get ariaLabelledbyValue(){return this.iconAsLabel?this.startIconId:this.label?this.labelId:""}get helpTextMarkup(){return this.helpText?o`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{property as e}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{TestableLitElement as h}from"../../../utils/components/testable-lit-element/testable-lit-element.js";var y=Object.defineProperty,o=(p,i,s,d)=>{for(var r=void 0,a=p.length-1,n;a>=0;a--)(n=p[a])&&(r=n(i,s,r)||r);return r&&y(i,s,r),r};const l=class l extends h{constructor(){super(),this.form=null,this.id="",this.required=!1,this.disabled=!1,this.readonly=!1,this.label="",this.ariaDescription=null,this.ariaLabelledByElements=null,this.placeholder="",this.errorText="",this.helpText="",this.type="text",this.startIcon="",this.endIcon="",this.minLength=void 0,this.maxLength=void 0,this.iconAsLabel=!1,this.skeleton=!1,this.internals=this.attachInternals()}formAssociatedCallback(i){this.form=i}};l.formAssociated=!0;let t=l;o([e()],t.prototype,"id");o([e({type:Boolean})],t.prototype,"required");o([e({type:Boolean})],t.prototype,"disabled");o([e({type:Boolean})],t.prototype,"readonly");o([e()],t.prototype,"label");o([e({attribute:"aria-description"})],t.prototype,"ariaDescription");o([e({type:Array,attribute:"aria-labelled-by-elements"})],t.prototype,"ariaLabelledByElements");o([e()],t.prototype,"placeholder");o([e()],t.prototype,"value");o([e({attribute:"error-text"})],t.prototype,"errorText");o([e({attribute:"help-text"})],t.prototype,"helpText");o([e()],t.prototype,"type");o([e({attribute:"start-icon"})],t.prototype,"startIcon");o([e({attribute:"end-icon"})],t.prototype,"endIcon");o([e({attribute:"min-length"})],t.prototype,"minLength");o([e({attribute:"max-length"})],t.prototype,"maxLength");o([e({type:Boolean,attribute:"icon-as-label"})],t.prototype,"iconAsLabel");o([e({type:Boolean})],t.prototype,"skeleton");export{t as InputBase};
|
|
1
|
+
import{property as e}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{TestableLitElement as h}from"../../../utils/components/testable-lit-element/testable-lit-element.js";var y=Object.defineProperty,o=(p,i,s,d)=>{for(var r=void 0,a=p.length-1,n;a>=0;a--)(n=p[a])&&(r=n(i,s,r)||r);return r&&y(i,s,r),r};const l=class l extends h{constructor(){super(),this.form=null,this.id="",this.required=!1,this.hideRequired=!1,this.optional=!1,this.disabled=!1,this.readonly=!1,this.label="",this.ariaDescription=null,this.ariaLabelledByElements=null,this.placeholder="",this.errorText="",this.helpText="",this.type="text",this.startIcon="",this.endIcon="",this.minLength=void 0,this.maxLength=void 0,this.iconAsLabel=!1,this.skeleton=!1,this.internals=this.attachInternals()}formAssociatedCallback(i){this.form=i}};l.formAssociated=!0;let t=l;o([e()],t.prototype,"id");o([e({type:Boolean})],t.prototype,"required");o([e({type:Boolean,attribute:"hide-required"})],t.prototype,"hideRequired");o([e({type:Boolean})],t.prototype,"optional");o([e({type:Boolean})],t.prototype,"disabled");o([e({type:Boolean})],t.prototype,"readonly");o([e()],t.prototype,"label");o([e({attribute:"aria-description"})],t.prototype,"ariaDescription");o([e({type:Array,attribute:"aria-labelled-by-elements"})],t.prototype,"ariaLabelledByElements");o([e()],t.prototype,"placeholder");o([e()],t.prototype,"value");o([e({attribute:"error-text"})],t.prototype,"errorText");o([e({attribute:"help-text"})],t.prototype,"helpText");o([e()],t.prototype,"type");o([e({attribute:"start-icon"})],t.prototype,"startIcon");o([e({attribute:"end-icon"})],t.prototype,"endIcon");o([e({attribute:"min-length"})],t.prototype,"minLength");o([e({attribute:"max-length"})],t.prototype,"maxLength");o([e({type:Boolean,attribute:"icon-as-label"})],t.prototype,"iconAsLabel");o([e({type:Boolean})],t.prototype,"skeleton");export{t as InputBase};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as
|
|
2
|
-
<div class=${
|
|
1
|
+
import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as l,nothing as f}from"../../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import{LitElement as b}from"../../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as u}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as i}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import c from"../../../../packages/web-components/src/components/input/gator/input-label/input-label.gator.scss.js";import g from"../../../../packages/web-components/src/tokens/primitive.tokens.scss.js";import y from"../../../../packages/web-components/src/tokens/semantic.tokens.scss.js";import{classMap as _}from"../../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";import{NgcComponent as v}from"../../../../utils/components/ngc-component.js";import{msg as h}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/install.js";import"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/runtime.js";import{unsafeCSS as d}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var O=Object.defineProperty,L=Object.getOwnPropertyDescriptor,o=(r,s,p,a)=>{for(var t=a>1?void 0:a?L(s,p):s,n=r.length-1,m;n>=0;n--)(m=r[n])&&(t=(a?m(s,p,t):m(t))||t);return a&&t&&O(s,p,t),t};let e=class extends v{constructor(){super(...arguments),this.required=!1,this.optional=!1,this.disabled=!1,this.hideLabel=!1}render(){const r={"gator-label":!0,"gator-label_disabled":this.disabled,"gator-label_hidden":this.hideLabel};return this.skeleton?l`<ngc-skeleton-loader width="136" height="24" radius="999"></ngc-skeleton-loader>`:l`
|
|
2
|
+
<div class=${_(r)}>
|
|
3
3
|
<slot></slot>
|
|
4
|
-
${this.required?
|
|
5
|
-
|
|
4
|
+
${this.required?l`<span class="gator-label_required" aria-hidden="true">(${h("Required")})</span>`:this.optional?l`<span class="gator-label_optional">(${h("Optional")})</span>`:f}
|
|
5
|
+
<slot name="end"></slot>
|
|
6
|
+
</div>`}};e.shadowRootOptions={...b.shadowRootOptions,mode:"open"};e.styles=[d(c),d(y),d(g)];o([i({type:Boolean})],e.prototype,"required",2);o([i({type:Boolean})],e.prototype,"optional",2);o([i({type:Boolean})],e.prototype,"disabled",2);o([i({type:Boolean,attribute:"hide-label"})],e.prototype,"hideLabel",2);e=o([u("ngc-input-label")],e);export{e as NgcInputLabel};
|
|
@@ -9,6 +9,7 @@ import{customElement as f}from"../../../../node_modules/.pnpm/@lit_reactive-elem
|
|
|
9
9
|
placeholder="${this.placeholder}"
|
|
10
10
|
value="${this.value}"
|
|
11
11
|
?required="${this.required}"
|
|
12
|
+
?optional="${this.optional}"
|
|
12
13
|
?disabled="${this.disabled}"
|
|
13
14
|
help-text="${this.helpText}"
|
|
14
15
|
error-text="${this.errorText}"
|
|
@@ -1,6 +1,14 @@
|
|
|
1
|
-
import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as n}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import"../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as u}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as c}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{ifDefined as f}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.js";import{createRef as g,ref as b}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/ref.js";import{generateRandomId as v,getElementId as y}from"../../utils/string-utils.js";import{handleDataTestid as $}from"../../utils/datatestid-utils.js";import{KEY_CONSTANTS as d}from"../../consts/key-constants.js";import{NgcInputBase as x}from"../input/base/input-base.gator.js";import{NgcInputText as
|
|
1
|
+
import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as n}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import"../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as u}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as c}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{ifDefined as f}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.js";import{createRef as g,ref as b}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/ref.js";import{generateRandomId as v,getElementId as y}from"../../utils/string-utils.js";import{handleDataTestid as $}from"../../utils/datatestid-utils.js";import{KEY_CONSTANTS as d}from"../../consts/key-constants.js";import{NgcInputBase as x}from"../input/base/input-base.gator.js";import{NgcInputText as R}from"../input/gator/input-text/input-text.gator.js";import"../radio/radio.gator.js";import T from"../../packages/web-components/src/tokens/primitive-new.tokens.scss.js";import E from"../../packages/web-components/src/tokens/semantic-new.tokens.scss.js";import I from"../../packages/web-components/src/components/radio-group/radio-group.gator.scss.js";import{unsafeCSS as m}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var S=Object.defineProperty,_=Object.getOwnPropertyDescriptor,O=Object.getPrototypeOf,w=Reflect.get,p=(e,t,s,o)=>{for(var r=o>1?void 0:o?_(t,s):t,l=e.length-1,i;l>=0;l--)(i=e[l])&&(r=(o?i(t,s,r):i(r))||r);return o&&r&&S(t,s,r),r},A=(e,t,s)=>w(O(e),s,t);let a=class extends R{constructor(){super(...arguments),this.options=[],this._randomId=v(),this.groupRef=g()}render(){return n`
|
|
2
2
|
<div class="gator-radio-group-container" ${b(this.groupRef)} role="group">
|
|
3
|
-
${this.label?n
|
|
3
|
+
${this.label?n`
|
|
4
|
+
<ngc-input-label
|
|
5
|
+
id="${this.elementId}-label"
|
|
6
|
+
?required="${this.required&&!this.hideRequired}"
|
|
7
|
+
?optional="${this.optional}"
|
|
8
|
+
data-testid=${f(this.labelDataTestid)}
|
|
9
|
+
?skeleton=${this.skeleton}>
|
|
10
|
+
${this.label}
|
|
11
|
+
</ngc-input-label>`:null}
|
|
4
12
|
<div id="${this.elementId}-group"
|
|
5
13
|
role="radiogroup"
|
|
6
14
|
class="gator-radio-group"
|
|
@@ -23,4 +31,4 @@ import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/re
|
|
|
23
31
|
error-text=${this.errorText}
|
|
24
32
|
></ngc-radio>
|
|
25
33
|
`)}
|
|
26
|
-
`}get radioElements(){if(this.options.length>0)return this.shadowRoot?.querySelectorAll("ngc-radio");const e=this.shadowRoot?.querySelector("slot")?.assignedElements();return e&&e.length===1&&e[0]instanceof HTMLSlotElement?e[0].assignedElements():e}get describedBy(){const e=[];return this.errorText&&e.push(`${this.elementId}-error`),this.helpText&&e.push(`${this.elementId}-help`),e.join(" ")}handleRadioSelectionChange(e){const t=e;t.stopImmediatePropagation(),this.value=t.detail.value??t.detail,this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:this.value}))}handleRadioKeydown(e){const t=this.radioElements;if(t){const s=Array.from(t).findIndex(
|
|
34
|
+
`}get radioElements(){if(this.options.length>0)return this.shadowRoot?.querySelectorAll("ngc-radio");const e=this.shadowRoot?.querySelector("slot")?.assignedElements();return e&&e.length===1&&e[0]instanceof HTMLSlotElement?e[0].assignedElements():e}get describedBy(){const e=[];return this.errorText&&e.push(`${this.elementId}-error`),this.helpText&&e.push(`${this.elementId}-help`),e.join(" ")}handleRadioSelectionChange(e){const t=e;t.stopImmediatePropagation(),this.value=t.detail.value??t.detail,this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:this.value}))}handleRadioKeydown(e){const t=this.radioElements;if(t){const s=Array.from(t).findIndex(i=>i.selected),o=e.key===d.RIGHT||e.key===d.DOWN,r=e.key===d.LEFT||e.key===d.UP,l=e.key===d.SPACE;if(o||r||l){e.preventDefault();let i=s===-1?0:s;o?i=(i+1)%t.length:r?i=(i-1+t.length)%t.length:l&&s===-1&&(i=0);const h=t[i];h&&(h.focus(),h.click())}}}updated(){this.radioElements?.forEach((e,t)=>{e.selected=this.value===e.value,e.disabled=this.disabled,e.errorText=this.errorText,e.grouped=!0,e.radioTabindex=this.getItemTabindex(t),e.skeleton=this.skeleton,$(e,this.dataTestid,`radio-${t}`)}),requestAnimationFrame(()=>{const e=this.shadowRoot?.querySelector("ngc-input-label"),t=this.shadowRoot?.querySelectorAll("ngc-help-text");e&&this.groupRef.value&&(this.groupRef.value.ariaLabelledByElements=[e]),t&&this.groupRef.value&&(this.groupRef.value.ariaDescribedByElements=Array.from(t))})}getItemTabindex(e){return e===0&&!this.value?0:-1}};a.styles=[...A(a,a,"styles").filter(x.primitiveAndSemanticStyleFilter),m(T),m(E),m(I)];p([c({type:Array})],a.prototype,"options",2);a=p([u("ngc-radio-group")],a);export{a as NgcRadioGroup};
|
|
@@ -1,7 +1,10 @@
|
|
|
1
|
-
import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as o}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import"../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as
|
|
1
|
+
import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as o}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import"../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as u}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as d}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import c from"../../packages/web-components/src/components/selection-box-group/selection-box-group.gator.scss.js";import"../selection-box/selection-box.gator.js";import"../radio-group/radio-group.gator.js";import"../checkbox-group/checkbox-group.gator.js";import{ifDefined as p}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.js";import{NgcInputText as g}from"../input/gator/input-text/input-text.gator.js";import{unsafeCSS as m}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var x=Object.defineProperty,b=Object.getOwnPropertyDescriptor,$=Object.getPrototypeOf,v=Reflect.get,h=(e,t,i,l)=>{for(var r=l>1?void 0:l?b(t,i):t,a=e.length-1,n;a>=0;a--)(n=e[a])&&(r=(l?n(t,i,r):n(r))||r);return l&&r&&x(t,i,r),r},f=(e,t,i)=>v($(e),i,t);let s=class extends g{constructor(){super(...arguments),this.options=[],this.type="single-select"}render(){return o`${this.isSingleSelect?this.radioGroupMarkup:this.checkboxGroupMarkup}`}get radioGroupMarkup(){return o`
|
|
2
2
|
<ngc-radio-group
|
|
3
3
|
id=${this.id}
|
|
4
4
|
value=${p(this.value)}
|
|
5
|
+
?required=${this.required}
|
|
6
|
+
?hide-required=${this.hideRequired}
|
|
7
|
+
?optional=${this.optional}
|
|
5
8
|
.disabled=${this.disabled}
|
|
6
9
|
.label=${this.label}
|
|
7
10
|
help-text=${this.helpText}
|
|
@@ -14,6 +17,9 @@ import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/re
|
|
|
14
17
|
<ngc-checkbox-group
|
|
15
18
|
id=${this.id}
|
|
16
19
|
value=${p(this.value)}
|
|
20
|
+
?required=${this.required}
|
|
21
|
+
?hide-required=${this.hideRequired}
|
|
22
|
+
?optional=${this.optional}
|
|
17
23
|
.disabled=${this.disabled}
|
|
18
24
|
.label=${this.label}
|
|
19
25
|
help-text=${this.helpText}
|
|
@@ -32,4 +38,4 @@ import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/re
|
|
|
32
38
|
box-tabindex=${this.getItemTabindex(t)}
|
|
33
39
|
error-text=${this.errorText}
|
|
34
40
|
type=${this.selectionBoxType}>
|
|
35
|
-
</ngc-selection-box>`)}get optionElements(){return this.options.length>0?this.shadowRoot?.querySelectorAll("ngc-selection-box"):this.shadowRoot?.querySelector("slot")?.assignedElements()}isItemSelected(e){return this.value?this.isSingleSelect?this.value===e:this.value?.split(";").includes(e):!1}handleChange(e){const t=e;t.stopImmediatePropagation(),this.value=t.detail,this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:this.value}))}updated(){this.optionElements?.forEach((e,t)=>{const
|
|
41
|
+
</ngc-selection-box>`)}get optionElements(){return this.options.length>0?this.shadowRoot?.querySelectorAll("ngc-selection-box"):this.shadowRoot?.querySelector("slot")?.assignedElements()}isItemSelected(e){return this.value?this.isSingleSelect?this.value===e:this.value?.split(";").includes(e):!1}handleChange(e){const t=e;t.stopImmediatePropagation(),this.value=t.detail,this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:this.value}))}updated(){this.optionElements?.forEach((e,t)=>{const i=e;i.boxTabindex=this.getItemTabindex(t),i.type=this.selectionBoxType,i.disabled=this.disabled,i.selected=this.isItemSelected(i.getAttribute("value")??""),i.hasError=!!this.errorText})}getItemTabindex(e){return this.isSingleSelect?e===0&&!this.value?0:-1:0}};s.styles=[...f(s,s,"styles"),m(c)];h([d({type:Array})],s.prototype,"options",2);h([d({type:String})],s.prototype,"type",2);s=h([u("ngc-selection-box-group")],s);export{s as NgcSelectionBoxGroup};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as d}from"../../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import"../../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as p}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as n}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import"../tab/tab.gator.js";import{KEY_CONSTANTS as o}from"../../../../consts/key-constants.js";import{createRef as u,ref as v}from"../../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/ref.js";import{TestableLitElement as
|
|
1
|
+
import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{nothing as f,html as d}from"../../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import"../../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as p}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as n}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import"../tab/tab.gator.js";import{KEY_CONSTANTS as o}from"../../../../consts/key-constants.js";import{createRef as u,ref as v}from"../../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/ref.js";import{TestableLitElement as m}from"../../../../utils/components/testable-lit-element/testable-lit-element.js";import T from"../../../../packages/web-components/src/components/tabs/gator/tabs.gator.scss.js";import g from"../../../../packages/web-components/src/components/tabs/gator/tabs.gator.tokens.scss.js";import $ from"../../../../packages/web-components/src/tokens/semantic.tokens.scss.js";import y from"../../../../packages/web-components/src/tokens/primitive.tokens.scss.js";import{ifDefined as I}from"../../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.js";import{unsafeCSS as l}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var A=Object.defineProperty,x=Object.getOwnPropertyDescriptor,r=(t,e,i,b)=>{for(var a=b>1?void 0:b?x(e,i):e,h=t.length-1,c;h>=0;h--)(c=t[h])&&(a=(b?c(e,i,a):c(a))||a);return b&&a&&A(e,i,a),a};let s=class extends m{constructor(){super(...arguments),this.tabsetAriaLabelledByElements=[],this.tabsetAriaLabel=void 0,this.size="medium",this.activeTabIndex=0,this._contentRef=u(),this._tablistRef=u()}updated(t){super.updated(t),t.has("tabsetAriaLabelledByElements")&&this._tablistRef.value&&(this._tablistRef.value.ariaLabelledByElements=this.tabsetAriaLabelledByElements)}render(){if(!this.tabs){const t=Array.from(this.querySelectorAll("ngc-tab"));if(t.length===0)return f;this.tabs=t}return d`
|
|
2
2
|
<div class="gator-tabset">
|
|
3
|
-
<div ${v(this._tablistRef)} role="tablist" class="gator-tabset-header" aria-label=${
|
|
3
|
+
<div ${v(this._tablistRef)} role="tablist" class="gator-tabset-header" aria-label=${I(this.tabsetAriaLabel)}>
|
|
4
4
|
${this.tabs.map((t,e)=>d`
|
|
5
5
|
<div class="${this.tabSpacerClass} gator-tab"
|
|
6
6
|
id="gator-tab-${e+1}"
|
|
@@ -34,4 +34,4 @@ import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@
|
|
|
34
34
|
${this.tabs[this.activeTabIndex]}
|
|
35
35
|
</div>
|
|
36
36
|
</div>
|
|
37
|
-
`}get tabSizeClass(){return this.size?`gator-tab-button-${this.size}`:""}get tabContainerSizeClass(){return this.size?`gator-tab-container-${this.size}`:""}get tabSpacerClass(){return this.size!="large"?"":"gator-tabset-spacer"}getButtonTabIndex(t){return t===this.activeTabIndex?"0":"-1"}handleTabKeydown(t){if(!this.tabs)return;let e=this.shadowRoot?.querySelectorAll(".gator-tabset-header [role=tab]");if(t.key===o.RIGHT){if(this.activeTabIndex===this.tabs.length-1){this.focusFirstTab(),t.preventDefault();return}this.setActiveTab(this.activeTabIndex+1),e[this.activeTabIndex].focus()}else if(t.key===o.LEFT){if(this.activeTabIndex===0){this.focusLastTab(),t.preventDefault();return}this.setActiveTab(this.activeTabIndex-1),e[this.activeTabIndex].focus(),t.preventDefault()}else t.key===o.HOME?(this.focusFirstTab(),t.preventDefault()):t.key===o.END&&(this.focusLastTab(),t.preventDefault())}focusFirstTab(){let t=this.shadowRoot?.querySelectorAll(".gator-tabset-header [role=tab]");this.setActiveTab(0),t[this.activeTabIndex].focus()}focusLastTab(){if(!this.tabs)return;let t=this.shadowRoot?.querySelectorAll(".gator-tabset-header [role=tab]");this.setActiveTab(this.tabs.length-1),t[this.activeTabIndex].focus()}setActiveTab(t){this.activeTabIndex!==t&&(this.activeTabIndex=t,this.dispatchEvent(new CustomEvent("select",{detail:{index:t,tab:this.tabs?this.tabs[t]:null},bubbles:!0,composed:!0})))}};s.styles=[l(
|
|
37
|
+
`}get tabSizeClass(){return this.size?`gator-tab-button-${this.size}`:""}get tabContainerSizeClass(){return this.size?`gator-tab-container-${this.size}`:""}get tabSpacerClass(){return this.size!="large"?"":"gator-tabset-spacer"}getButtonTabIndex(t){return t===this.activeTabIndex?"0":"-1"}handleTabKeydown(t){if(!this.tabs)return;let e=this.shadowRoot?.querySelectorAll(".gator-tabset-header [role=tab]");if(t.key===o.RIGHT){if(this.activeTabIndex===this.tabs.length-1){this.focusFirstTab(),t.preventDefault();return}this.setActiveTab(this.activeTabIndex+1),e[this.activeTabIndex].focus()}else if(t.key===o.LEFT){if(this.activeTabIndex===0){this.focusLastTab(),t.preventDefault();return}this.setActiveTab(this.activeTabIndex-1),e[this.activeTabIndex].focus(),t.preventDefault()}else t.key===o.HOME?(this.focusFirstTab(),t.preventDefault()):t.key===o.END&&(this.focusLastTab(),t.preventDefault())}focusFirstTab(){let t=this.shadowRoot?.querySelectorAll(".gator-tabset-header [role=tab]");this.setActiveTab(0),t[this.activeTabIndex].focus()}focusLastTab(){if(!this.tabs)return;let t=this.shadowRoot?.querySelectorAll(".gator-tabset-header [role=tab]");this.setActiveTab(this.tabs.length-1),t[this.activeTabIndex].focus()}setActiveTab(t){this.activeTabIndex!==t&&(this.activeTabIndex=t,this.dispatchEvent(new CustomEvent("select",{detail:{index:t,tab:this.tabs?this.tabs[t]:null},bubbles:!0,composed:!0})))}};s.styles=[l(T),l(g),l($),l(y)];r([n({type:String,attribute:"tabset-aria-labelled-by-elements"})],s.prototype,"tabsetAriaLabelledByElements",2);r([n({type:String,attribute:"tabset-aria-label"})],s.prototype,"tabsetAriaLabel",2);r([n({type:String})],s.prototype,"size",2);r([n({type:Number,attribute:"active-tab-index"})],s.prototype,"activeTabIndex",2);s=r([p("ngc-tabset")],s);export{s as NgcTabset};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const
|
|
1
|
+
const a='.gator-label{display:inline-flex;align-items:center;gap:var(--spacing-padding-margin-8, .5rem);font-family:var(--ngc-input-label-font-family, var(--text-family-body, "Open Sans")),sans-serif;font-weight:var(--ngc-input-label-font-weight, 400);color:var(--ngc-input-label-color, var(--color-text-primary-base, #1F1F1F));font-size:var(--ngc-input-label-font-size, var(--text-size-body-1, 1.0625rem));line-height:var(--ngc-input-label-line-height, var(--text-line-height-body-1, 1.5rem))}.gator-label_required,.gator-label_optional{color:var(--primary-01-placeholder, var(--color-grey-50, #6D6D6D))}.gator-label_disabled{color:var(--text-color-disabled, #808080)}.gator-label_hidden{display:none}';export{a as default};
|
|
@@ -11,10 +11,20 @@ export declare class InputBase extends TestableLitElement {
|
|
|
11
11
|
*/
|
|
12
12
|
id: string;
|
|
13
13
|
/**
|
|
14
|
-
@property required - Whether the input is required
|
|
14
|
+
@property required - Whether the input is required. By default, displays the required indicator in the label if a label is provided. If you do not want the required indicator to display, use the hideRequired property.
|
|
15
15
|
@type boolean
|
|
16
16
|
*/
|
|
17
17
|
required: boolean;
|
|
18
|
+
/**
|
|
19
|
+
@property hideRequired - Whether to hide the required indicator in the label. This would be used if the optional property is being used to distinguish between required and optional fields instead of the required text.
|
|
20
|
+
@type boolean
|
|
21
|
+
*/
|
|
22
|
+
hideRequired: boolean;
|
|
23
|
+
/**
|
|
24
|
+
@property optional - Whether the input should be marked as optional
|
|
25
|
+
@type boolean
|
|
26
|
+
*/
|
|
27
|
+
optional: boolean;
|
|
18
28
|
/**
|
|
19
29
|
@property disabled - Whether the input is disabled
|
|
20
30
|
@type boolean
|
|
@@ -10,9 +10,13 @@ export declare class NgcInputLabel extends NgcComponent {
|
|
|
10
10
|
};
|
|
11
11
|
static styles: import('lit').CSSResult[];
|
|
12
12
|
/**
|
|
13
|
-
* @property {boolean} required - Whether the label is required.
|
|
13
|
+
* @property {boolean} required - Whether the label is marked as required.
|
|
14
14
|
*/
|
|
15
15
|
required: boolean;
|
|
16
|
+
/**
|
|
17
|
+
* @property {boolean} optional - Whether the label is marked as optional.
|
|
18
|
+
*/
|
|
19
|
+
optional: boolean;
|
|
16
20
|
/**
|
|
17
21
|
* @property {boolean} disabled - Whether the label is disabled.
|
|
18
22
|
*/
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { nothing } from 'lit';
|
|
1
2
|
import { NgcTab } from '../tab/tab.gator.ts';
|
|
2
3
|
import { Ref } from 'lit/directives/ref.js';
|
|
3
4
|
import { TestableLitElement } from '../../../../utils/components/testable-lit-element/testable-lit-element.ts';
|
|
@@ -23,7 +24,7 @@ export declare class NgcTabset extends TestableLitElement {
|
|
|
23
24
|
_contentRef: Ref<HTMLDivElement>;
|
|
24
25
|
_tablistRef: Ref<HTMLDivElement>;
|
|
25
26
|
updated(changedProperties: Map<string | number | symbol, unknown>): void;
|
|
26
|
-
render(): import('lit').TemplateResult<1
|
|
27
|
+
render(): import('lit').TemplateResult<1> | typeof nothing;
|
|
27
28
|
get tabSizeClass(): string;
|
|
28
29
|
get tabContainerSizeClass(): string;
|
|
29
30
|
get tabSpacerClass(): "" | "gator-tabset-spacer";
|
|
@@ -67,6 +67,34 @@ export declare const INPUT_BASE_ARGS: {
|
|
|
67
67
|
summary: string;
|
|
68
68
|
};
|
|
69
69
|
};
|
|
70
|
+
control: {
|
|
71
|
+
type: string;
|
|
72
|
+
};
|
|
73
|
+
};
|
|
74
|
+
hideRequired: {
|
|
75
|
+
name: string;
|
|
76
|
+
description: string;
|
|
77
|
+
control: {
|
|
78
|
+
type: string;
|
|
79
|
+
};
|
|
80
|
+
table: {
|
|
81
|
+
category: string;
|
|
82
|
+
defaultValue: {
|
|
83
|
+
summary: string;
|
|
84
|
+
};
|
|
85
|
+
};
|
|
86
|
+
};
|
|
87
|
+
optional: {
|
|
88
|
+
description: string;
|
|
89
|
+
control: {
|
|
90
|
+
type: string;
|
|
91
|
+
};
|
|
92
|
+
table: {
|
|
93
|
+
category: string;
|
|
94
|
+
defaultValue: {
|
|
95
|
+
summary: string;
|
|
96
|
+
};
|
|
97
|
+
};
|
|
70
98
|
};
|
|
71
99
|
disabled: {
|
|
72
100
|
description: string;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as s}from"../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import{LitElement as m}from"../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as l}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/custom-element.js";import{css as c}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var p=Object.getOwnPropertyDescriptor,g=(a,i,d,o)=>{for(var r=o>1?void 0:o?p(i,d):i,e=a.length-1,n;e>=0;e--)(n=a[e])&&(r=n(r)||r);return r};let t=class extends m{render(){return s`
|
|
2
|
+
<div class="top-area"></div>
|
|
3
|
+
<div class="body-area"></div>
|
|
4
|
+
|
|
5
|
+
<div class="content-area">
|
|
6
|
+
<slot></slot>
|
|
7
|
+
</div>
|
|
8
|
+
`}};t.styles=[c`
|
|
9
|
+
.top-area {
|
|
10
|
+
z-index: 1;
|
|
11
|
+
height: 300px;
|
|
12
|
+
background: linear-gradient(90deg, #11395B 0.68%, rgba(17, 57, 91, 0.50) 51.8%, #11395B 100%);
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.body-area {
|
|
16
|
+
height: 100px;
|
|
17
|
+
z-index: 2;
|
|
18
|
+
margin-top: -100px;
|
|
19
|
+
border-radius: 5rem 5rem 0 0;
|
|
20
|
+
background: #FFF;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.content-area {
|
|
24
|
+
border-radius: 1rem;
|
|
25
|
+
background: #FFF;
|
|
26
|
+
margin: -200px auto 100px auto;
|
|
27
|
+
width: 35rem;
|
|
28
|
+
min-width: 18.75rem;
|
|
29
|
+
max-width: 37.4375rem;
|
|
30
|
+
flex-direction: column;
|
|
31
|
+
align-items: flex-start;
|
|
32
|
+
}
|
|
33
|
+
`];t=g([l("gradient-background")],t);export{t as GradientBackground};
|
|
@@ -1,9 +1,10 @@
|
|
|
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 i}from"../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import{LitElement as d}from"../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as n}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/custom-element.js";import{property as c}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{css as f}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var v=Object.defineProperty,u=Object.getOwnPropertyDescriptor,p=(m,t,s,r)=>{for(var e=r>1?void 0:r?u(t,s):t,l=m.length-1,a;l>=0;l--)(a=m[l])&&(e=(r?a(t,s,e):a(e))||e);return r&&e&&v(t,s,e),e};let o=class extends d{constructor(){super(...arguments),this.slotName=""}render(){return i`
|
|
2
2
|
<div class="slot-placeholder">
|
|
3
3
|
${this.namedSlotMarkup}
|
|
4
4
|
</div>
|
|
5
|
-
`}get namedSlotMarkup(){return this.slotName?
|
|
5
|
+
`}get namedSlotMarkup(){return this.slotName?i`<div>Slot Name: ${this.slotName}</div>`:i`<div>Default slot</div>`}};o.styles=[f`
|
|
6
6
|
.slot-placeholder {
|
|
7
|
+
display: var(--slot-placeholder-display, block);
|
|
7
8
|
background: #D8C3F3;
|
|
8
9
|
border: 1px dashed #9747FF;
|
|
9
10
|
border-radius: 0.5rem;
|
|
@@ -13,4 +14,4 @@ import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit
|
|
|
13
14
|
color: #6F1FC3;
|
|
14
15
|
text-align: center;
|
|
15
16
|
}
|
|
16
|
-
`];p([
|
|
17
|
+
`];p([c({attribute:"slot-name"})],o.prototype,"slotName",2);o=p([n("slot-placeholder")],o);export{o as SlotPlaceholder};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const n={errorText:{name:"error-text",description:"Custom error message to be displayed. This value overrides any native or internal error messaging. If this is set, the component will be styled in an error state.",table:{category:"Base Input",defaultValue:{summary:""}}},helpText:{name:"help-text",description:"Custom help text to be displayed inline below the component.",table:{category:"Base Input",defaultValue:{summary:""}}},placeholder:{description:"Placeholder text to be displayed in the input.",table:{category:"Base Input",defaultValue:{summary:""}}},value:{description:"Value of the component.",table:{category:"Base Input",defaultValue:{summary:"undefined"}}},label:{description:"Visible label for the component. This is the gold standard, best practice way to label an input for built in accessibility support. If this is not set, you must set the ariaLabelledByElements property for correct programmatic association between your custom label and the input element.",table:{category:"Base Input",defaultValue:{summary:""}}},ariaLabelledByElements:{name:"aria-labelled-by-elements",description:"Used to programmatically associate a custom label to the input. This should only be used when you are using a custom label outside of the ngc input component due to limitations of the shadow dom. Accepts a list of elements. For more information on ARIA element reflection, see [here](https://wicg.github.io/aom/aria-reflection-explainer.html).",type:{summary:"Element[]"},table:{category:"Base Input",defaultValue:{summary:""}}},required:{description:"Whether the component is required.",table:{category:"Base Input",defaultValue:{summary:"false"}}},disabled:{description:"Whether the component is disabled.",table:{category:"Base Input",defaultValue:{summary:"false"}}},readonly:{description:"Whether the component is readonly.",table:{category:"Base Input",defaultValue:{summary:"false"}}},id:{description:"Unique ID for the component. Required for accessibility.",table:{category:"Base Input",defaultValue:{summary:""}}},minLength:{name:"min-length",description:"The minimum length of the input value. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/minlength).",control:"number",table:{category:"Base Input",defaultValue:{summary:""}}},maxLength:{name:"max-length",description:"The maximum length of the input value. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/maxlength).",control:"number",table:{category:"Base Input",defaultValue:{summary:""}}}},i={pattern:{description:"The pattern attribute to be passed to the input. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/pattern).",control:"text",table:{defaultValue:{summary:"undefined"}}}},r={min:{description:"The min attribute defines the minimum value that is acceptable and valid for the input containing the attribute. If the value of the element is less than this, the element fails validation. This value must be less than or equal to the value of the max attribute. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/min).",control:"string"},max:{description:"The max attribute defines the maximum value that is acceptable and valid for the input containing the attribute. If the value of the element is greater than this, the element fails validation. This value must be greater than or equal to the value of the min attribute. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/max).",control:"string"},step:{description:"The step attribute to be passed to the input for number inputs. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/step).",control:"number",table:{defaultValue:{summary:"1"}}}},l={ariaDescription:{name:"aria-description",description:"The aria-description attribute for the component."}},s={skeleton:{description:"Whether the component should be rendered in a skeleton/loading state.",control:{type:"boolean"},table:{defaultValue:{summary:"false"}}}},u={startIcon:{name:"start-icon",description:"Icon to be displayed at the start of the component. Should be a valid icon name from the [icon library](?path=/story/components-icon--gator-icon-list).",control:{type:"text"},table:{category:"Optional Icon(s)"}}},m={endIcon:{name:"end-icon",description:"Icon to be displayed at the end of the component. Should be a valid icon name from the [icon library](?path=/story/components-icon--gator-icon-list).",control:{type:"text"},table:{category:"Optional Icon(s)"}}},
|
|
1
|
+
const n={errorText:{name:"error-text",description:"Custom error message to be displayed. This value overrides any native or internal error messaging. If this is set, the component will be styled in an error state.",table:{category:"Base Input",defaultValue:{summary:""}}},helpText:{name:"help-text",description:"Custom help text to be displayed inline below the component.",table:{category:"Base Input",defaultValue:{summary:""}}},placeholder:{description:"Placeholder text to be displayed in the input.",table:{category:"Base Input",defaultValue:{summary:""}}},value:{description:"Value of the component.",table:{category:"Base Input",defaultValue:{summary:"undefined"}}},label:{description:"Visible label for the component. This is the gold standard, best practice way to label an input for built in accessibility support. If this is not set, you must set the ariaLabelledByElements property for correct programmatic association between your custom label and the input element.",table:{category:"Base Input",defaultValue:{summary:""}}},ariaLabelledByElements:{name:"aria-labelled-by-elements",description:"Used to programmatically associate a custom label to the input. This should only be used when you are using a custom label outside of the ngc input component due to limitations of the shadow dom. Accepts a list of elements. For more information on ARIA element reflection, see [here](https://wicg.github.io/aom/aria-reflection-explainer.html).",type:{summary:"Element[]"},table:{category:"Base Input",defaultValue:{summary:""}}},required:{description:"Whether the component is required.",table:{category:"Base Input",defaultValue:{summary:"false"}},control:{type:"boolean"}},hideRequired:{name:"hide-required",description:"Whether the visible required indicator should be hidden from the label when the component is required. This is useful for cases where majority of the fields are required so only the optional fields need to be marked (with the `optional` property).",control:{type:"boolean"},table:{category:"Base Input",defaultValue:{summary:"false"}}},optional:{description:"Whether the component should be marked as optional.",control:{type:"boolean"},table:{category:"Base Input",defaultValue:{summary:"false"}}},disabled:{description:"Whether the component is disabled.",table:{category:"Base Input",defaultValue:{summary:"false"}}},readonly:{description:"Whether the component is readonly.",table:{category:"Base Input",defaultValue:{summary:"false"}}},id:{description:"Unique ID for the component. Required for accessibility.",table:{category:"Base Input",defaultValue:{summary:""}}},minLength:{name:"min-length",description:"The minimum length of the input value. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/minlength).",control:"number",table:{category:"Base Input",defaultValue:{summary:""}}},maxLength:{name:"max-length",description:"The maximum length of the input value. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/maxlength).",control:"number",table:{category:"Base Input",defaultValue:{summary:""}}}},i={pattern:{description:"The pattern attribute to be passed to the input. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/pattern).",control:"text",table:{defaultValue:{summary:"undefined"}}}},r={min:{description:"The min attribute defines the minimum value that is acceptable and valid for the input containing the attribute. If the value of the element is less than this, the element fails validation. This value must be less than or equal to the value of the max attribute. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/min).",control:"string"},max:{description:"The max attribute defines the maximum value that is acceptable and valid for the input containing the attribute. If the value of the element is greater than this, the element fails validation. This value must be greater than or equal to the value of the min attribute. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/max).",control:"string"},step:{description:"The step attribute to be passed to the input for number inputs. See more information [here](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/step).",control:"number",table:{defaultValue:{summary:"1"}}}},l={ariaDescription:{name:"aria-description",description:"The aria-description attribute for the component."}},s={skeleton:{description:"Whether the component should be rendered in a skeleton/loading state.",control:{type:"boolean"},table:{defaultValue:{summary:"false"}}}},u={startIcon:{name:"start-icon",description:"Icon to be displayed at the start of the component. Should be a valid icon name from the [icon library](?path=/story/components-icon--gator-icon-list).",control:{type:"text"},table:{category:"Optional Icon(s)"}}},m={endIcon:{name:"end-icon",description:"Icon to be displayed at the end of the component. Should be a valid icon name from the [icon library](?path=/story/components-icon--gator-icon-list).",control:{type:"text"},table:{category:"Optional Icon(s)"}}},d=(t,a)=>{let e,o={};for(e in t)t.hasOwnProperty(e)&&!a.includes(e)&&(o[e]=t[e]);return o},c=(t,a)=>{let e,o={};for(e in t)t.hasOwnProperty(e)&&a.includes(e)&&(o[e]=t[e]);return o};export{m as END_ICON_ARG,l as INPUT_A11Y_ARGS,n as INPUT_BASE_ARGS,r as INPUT_NUMERIC_ARGS,i as INPUT_TEXT_ARGS,s as SKELETON_ARG,u as START_ICON_ARG,d as argsExclude,c as argsOnly};
|
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": "8.0.0-preview.
|
|
4
|
+
"version": "8.0.0-preview.6",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
@@ -795,6 +795,10 @@
|
|
|
795
795
|
"name": "required",
|
|
796
796
|
"value": { "type": "boolean", "default": "false" }
|
|
797
797
|
},
|
|
798
|
+
{
|
|
799
|
+
"name": "optional",
|
|
800
|
+
"value": { "type": "boolean", "default": "false" }
|
|
801
|
+
},
|
|
798
802
|
{
|
|
799
803
|
"name": "disabled",
|
|
800
804
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -821,6 +825,7 @@
|
|
|
821
825
|
"js": {
|
|
822
826
|
"properties": [
|
|
823
827
|
{ "name": "required", "type": "boolean" },
|
|
828
|
+
{ "name": "optional", "type": "boolean" },
|
|
824
829
|
{ "name": "disabled", "type": "boolean" },
|
|
825
830
|
{ "name": "hideLabel", "type": "boolean" },
|
|
826
831
|
{
|
|
@@ -884,6 +889,14 @@
|
|
|
884
889
|
"name": "required",
|
|
885
890
|
"value": { "type": "boolean", "default": "false" }
|
|
886
891
|
},
|
|
892
|
+
{
|
|
893
|
+
"name": "hide-required",
|
|
894
|
+
"value": { "type": "boolean", "default": "false" }
|
|
895
|
+
},
|
|
896
|
+
{
|
|
897
|
+
"name": "optional",
|
|
898
|
+
"value": { "type": "boolean", "default": "false" }
|
|
899
|
+
},
|
|
887
900
|
{
|
|
888
901
|
"name": "disabled",
|
|
889
902
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -988,6 +1001,8 @@
|
|
|
988
1001
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
989
1002
|
{ "name": "id", "type": "string" },
|
|
990
1003
|
{ "name": "required", "type": "boolean" },
|
|
1004
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
1005
|
+
{ "name": "optional", "type": "boolean" },
|
|
991
1006
|
{ "name": "disabled", "type": "boolean" },
|
|
992
1007
|
{ "name": "readonly", "type": "boolean" },
|
|
993
1008
|
{ "name": "label", "type": "string" },
|
|
@@ -1049,6 +1064,14 @@
|
|
|
1049
1064
|
"name": "required",
|
|
1050
1065
|
"value": { "type": "boolean", "default": "false" }
|
|
1051
1066
|
},
|
|
1067
|
+
{
|
|
1068
|
+
"name": "hide-required",
|
|
1069
|
+
"value": { "type": "boolean", "default": "false" }
|
|
1070
|
+
},
|
|
1071
|
+
{
|
|
1072
|
+
"name": "optional",
|
|
1073
|
+
"value": { "type": "boolean", "default": "false" }
|
|
1074
|
+
},
|
|
1052
1075
|
{
|
|
1053
1076
|
"name": "disabled",
|
|
1054
1077
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -1160,6 +1183,8 @@
|
|
|
1160
1183
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
1161
1184
|
{ "name": "id", "type": "string" },
|
|
1162
1185
|
{ "name": "required", "type": "boolean" },
|
|
1186
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
1187
|
+
{ "name": "optional", "type": "boolean" },
|
|
1163
1188
|
{ "name": "disabled", "type": "boolean" },
|
|
1164
1189
|
{ "name": "readonly", "type": "boolean" },
|
|
1165
1190
|
{ "name": "label", "type": "string" },
|
|
@@ -1209,6 +1234,14 @@
|
|
|
1209
1234
|
"name": "required",
|
|
1210
1235
|
"value": { "type": "boolean", "default": "false" }
|
|
1211
1236
|
},
|
|
1237
|
+
{
|
|
1238
|
+
"name": "hide-required",
|
|
1239
|
+
"value": { "type": "boolean", "default": "false" }
|
|
1240
|
+
},
|
|
1241
|
+
{
|
|
1242
|
+
"name": "optional",
|
|
1243
|
+
"value": { "type": "boolean", "default": "false" }
|
|
1244
|
+
},
|
|
1212
1245
|
{
|
|
1213
1246
|
"name": "disabled",
|
|
1214
1247
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -1319,6 +1352,8 @@
|
|
|
1319
1352
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
1320
1353
|
{ "name": "id", "type": "string" },
|
|
1321
1354
|
{ "name": "required", "type": "boolean" },
|
|
1355
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
1356
|
+
{ "name": "optional", "type": "boolean" },
|
|
1322
1357
|
{ "name": "disabled", "type": "boolean" },
|
|
1323
1358
|
{ "name": "readonly", "type": "boolean" },
|
|
1324
1359
|
{ "name": "label", "type": "string" },
|
|
@@ -1371,6 +1406,14 @@
|
|
|
1371
1406
|
"name": "required",
|
|
1372
1407
|
"value": { "type": "boolean", "default": "false" }
|
|
1373
1408
|
},
|
|
1409
|
+
{
|
|
1410
|
+
"name": "hide-required",
|
|
1411
|
+
"value": { "type": "boolean", "default": "false" }
|
|
1412
|
+
},
|
|
1413
|
+
{
|
|
1414
|
+
"name": "optional",
|
|
1415
|
+
"value": { "type": "boolean", "default": "false" }
|
|
1416
|
+
},
|
|
1374
1417
|
{
|
|
1375
1418
|
"name": "disabled",
|
|
1376
1419
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -1480,6 +1523,8 @@
|
|
|
1480
1523
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
1481
1524
|
{ "name": "id", "type": "string" },
|
|
1482
1525
|
{ "name": "required", "type": "boolean" },
|
|
1526
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
1527
|
+
{ "name": "optional", "type": "boolean" },
|
|
1483
1528
|
{ "name": "disabled", "type": "boolean" },
|
|
1484
1529
|
{ "name": "readonly", "type": "boolean" },
|
|
1485
1530
|
{ "name": "label", "type": "string" },
|
|
@@ -2356,6 +2401,14 @@
|
|
|
2356
2401
|
"name": "required",
|
|
2357
2402
|
"value": { "type": "boolean", "default": "false" }
|
|
2358
2403
|
},
|
|
2404
|
+
{
|
|
2405
|
+
"name": "hide-required",
|
|
2406
|
+
"value": { "type": "boolean", "default": "false" }
|
|
2407
|
+
},
|
|
2408
|
+
{
|
|
2409
|
+
"name": "optional",
|
|
2410
|
+
"value": { "type": "boolean", "default": "false" }
|
|
2411
|
+
},
|
|
2359
2412
|
{
|
|
2360
2413
|
"name": "disabled",
|
|
2361
2414
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -2466,6 +2519,8 @@
|
|
|
2466
2519
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
2467
2520
|
{ "name": "id", "type": "string" },
|
|
2468
2521
|
{ "name": "required", "type": "boolean" },
|
|
2522
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
2523
|
+
{ "name": "optional", "type": "boolean" },
|
|
2469
2524
|
{ "name": "disabled", "type": "boolean" },
|
|
2470
2525
|
{ "name": "readonly", "type": "boolean" },
|
|
2471
2526
|
{ "name": "label", "type": "string" },
|
|
@@ -2518,6 +2573,14 @@
|
|
|
2518
2573
|
"name": "required",
|
|
2519
2574
|
"value": { "type": "boolean", "default": "false" }
|
|
2520
2575
|
},
|
|
2576
|
+
{
|
|
2577
|
+
"name": "hide-required",
|
|
2578
|
+
"value": { "type": "boolean", "default": "false" }
|
|
2579
|
+
},
|
|
2580
|
+
{
|
|
2581
|
+
"name": "optional",
|
|
2582
|
+
"value": { "type": "boolean", "default": "false" }
|
|
2583
|
+
},
|
|
2521
2584
|
{
|
|
2522
2585
|
"name": "disabled",
|
|
2523
2586
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -2628,6 +2691,8 @@
|
|
|
2628
2691
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
2629
2692
|
{ "name": "id", "type": "string" },
|
|
2630
2693
|
{ "name": "required", "type": "boolean" },
|
|
2694
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
2695
|
+
{ "name": "optional", "type": "boolean" },
|
|
2631
2696
|
{ "name": "disabled", "type": "boolean" },
|
|
2632
2697
|
{ "name": "readonly", "type": "boolean" },
|
|
2633
2698
|
{ "name": "label", "type": "string" },
|
|
@@ -3705,6 +3770,14 @@
|
|
|
3705
3770
|
"name": "required",
|
|
3706
3771
|
"value": { "type": "boolean", "default": "false" }
|
|
3707
3772
|
},
|
|
3773
|
+
{
|
|
3774
|
+
"name": "hide-required",
|
|
3775
|
+
"value": { "type": "boolean", "default": "false" }
|
|
3776
|
+
},
|
|
3777
|
+
{
|
|
3778
|
+
"name": "optional",
|
|
3779
|
+
"value": { "type": "boolean", "default": "false" }
|
|
3780
|
+
},
|
|
3708
3781
|
{
|
|
3709
3782
|
"name": "disabled",
|
|
3710
3783
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -3813,6 +3886,8 @@
|
|
|
3813
3886
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
3814
3887
|
{ "name": "id", "type": "string" },
|
|
3815
3888
|
{ "name": "required", "type": "boolean" },
|
|
3889
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
3890
|
+
{ "name": "optional", "type": "boolean" },
|
|
3816
3891
|
{ "name": "disabled", "type": "boolean" },
|
|
3817
3892
|
{ "name": "readonly", "type": "boolean" },
|
|
3818
3893
|
{ "name": "label", "type": "string" },
|
|
@@ -4058,6 +4133,14 @@
|
|
|
4058
4133
|
"name": "required",
|
|
4059
4134
|
"value": { "type": "boolean", "default": "false" }
|
|
4060
4135
|
},
|
|
4136
|
+
{
|
|
4137
|
+
"name": "hide-required",
|
|
4138
|
+
"value": { "type": "boolean", "default": "false" }
|
|
4139
|
+
},
|
|
4140
|
+
{
|
|
4141
|
+
"name": "optional",
|
|
4142
|
+
"value": { "type": "boolean", "default": "false" }
|
|
4143
|
+
},
|
|
4061
4144
|
{
|
|
4062
4145
|
"name": "disabled",
|
|
4063
4146
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -4189,6 +4272,8 @@
|
|
|
4189
4272
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
4190
4273
|
{ "name": "id", "type": "string" },
|
|
4191
4274
|
{ "name": "required", "type": "boolean" },
|
|
4275
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
4276
|
+
{ "name": "optional", "type": "boolean" },
|
|
4192
4277
|
{ "name": "disabled", "type": "boolean" },
|
|
4193
4278
|
{ "name": "readonly", "type": "boolean" },
|
|
4194
4279
|
{ "name": "label", "type": "string" },
|
|
@@ -4242,6 +4327,14 @@
|
|
|
4242
4327
|
"name": "required",
|
|
4243
4328
|
"value": { "type": "boolean", "default": "false" }
|
|
4244
4329
|
},
|
|
4330
|
+
{
|
|
4331
|
+
"name": "hide-required",
|
|
4332
|
+
"value": { "type": "boolean", "default": "false" }
|
|
4333
|
+
},
|
|
4334
|
+
{
|
|
4335
|
+
"name": "optional",
|
|
4336
|
+
"value": { "type": "boolean", "default": "false" }
|
|
4337
|
+
},
|
|
4245
4338
|
{
|
|
4246
4339
|
"name": "disabled",
|
|
4247
4340
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -4351,6 +4444,8 @@
|
|
|
4351
4444
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
4352
4445
|
{ "name": "id", "type": "string" },
|
|
4353
4446
|
{ "name": "required", "type": "boolean" },
|
|
4447
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
4448
|
+
{ "name": "optional", "type": "boolean" },
|
|
4354
4449
|
{ "name": "disabled", "type": "boolean" },
|
|
4355
4450
|
{ "name": "readonly", "type": "boolean" },
|
|
4356
4451
|
{ "name": "label", "type": "string" },
|
|
@@ -4421,6 +4516,14 @@
|
|
|
4421
4516
|
"name": "required",
|
|
4422
4517
|
"value": { "type": "boolean", "default": "false" }
|
|
4423
4518
|
},
|
|
4519
|
+
{
|
|
4520
|
+
"name": "hide-required",
|
|
4521
|
+
"value": { "type": "boolean", "default": "false" }
|
|
4522
|
+
},
|
|
4523
|
+
{
|
|
4524
|
+
"name": "optional",
|
|
4525
|
+
"value": { "type": "boolean", "default": "false" }
|
|
4526
|
+
},
|
|
4424
4527
|
{
|
|
4425
4528
|
"name": "disabled",
|
|
4426
4529
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -4536,6 +4639,8 @@
|
|
|
4536
4639
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
4537
4640
|
{ "name": "id", "type": "string" },
|
|
4538
4641
|
{ "name": "required", "type": "boolean" },
|
|
4642
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
4643
|
+
{ "name": "optional", "type": "boolean" },
|
|
4539
4644
|
{ "name": "disabled", "type": "boolean" },
|
|
4540
4645
|
{ "name": "readonly", "type": "boolean" },
|
|
4541
4646
|
{ "name": "label", "type": "string" },
|
|
@@ -4580,6 +4685,14 @@
|
|
|
4580
4685
|
"name": "required",
|
|
4581
4686
|
"value": { "type": "boolean", "default": "false" }
|
|
4582
4687
|
},
|
|
4688
|
+
{
|
|
4689
|
+
"name": "hide-required",
|
|
4690
|
+
"value": { "type": "boolean", "default": "false" }
|
|
4691
|
+
},
|
|
4692
|
+
{
|
|
4693
|
+
"name": "optional",
|
|
4694
|
+
"value": { "type": "boolean", "default": "false" }
|
|
4695
|
+
},
|
|
4583
4696
|
{
|
|
4584
4697
|
"name": "disabled",
|
|
4585
4698
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -4684,6 +4797,8 @@
|
|
|
4684
4797
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
4685
4798
|
{ "name": "id", "type": "string" },
|
|
4686
4799
|
{ "name": "required", "type": "boolean" },
|
|
4800
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
4801
|
+
{ "name": "optional", "type": "boolean" },
|
|
4687
4802
|
{ "name": "disabled", "type": "boolean" },
|
|
4688
4803
|
{ "name": "readonly", "type": "boolean" },
|
|
4689
4804
|
{ "name": "label", "type": "string" },
|
|
@@ -4762,6 +4877,14 @@
|
|
|
4762
4877
|
"name": "required",
|
|
4763
4878
|
"value": { "type": "boolean", "default": "false" }
|
|
4764
4879
|
},
|
|
4880
|
+
{
|
|
4881
|
+
"name": "hide-required",
|
|
4882
|
+
"value": { "type": "boolean", "default": "false" }
|
|
4883
|
+
},
|
|
4884
|
+
{
|
|
4885
|
+
"name": "optional",
|
|
4886
|
+
"value": { "type": "boolean", "default": "false" }
|
|
4887
|
+
},
|
|
4765
4888
|
{
|
|
4766
4889
|
"name": "disabled",
|
|
4767
4890
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -4900,6 +5023,8 @@
|
|
|
4900
5023
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
4901
5024
|
{ "name": "id", "type": "string" },
|
|
4902
5025
|
{ "name": "required", "type": "boolean" },
|
|
5026
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
5027
|
+
{ "name": "optional", "type": "boolean" },
|
|
4903
5028
|
{ "name": "disabled", "type": "boolean" },
|
|
4904
5029
|
{ "name": "readonly", "type": "boolean" },
|
|
4905
5030
|
{ "name": "label", "type": "string" },
|
|
@@ -4940,6 +5065,14 @@
|
|
|
4940
5065
|
"name": "required",
|
|
4941
5066
|
"value": { "type": "boolean", "default": "false" }
|
|
4942
5067
|
},
|
|
5068
|
+
{
|
|
5069
|
+
"name": "hide-required",
|
|
5070
|
+
"value": { "type": "boolean", "default": "false" }
|
|
5071
|
+
},
|
|
5072
|
+
{
|
|
5073
|
+
"name": "optional",
|
|
5074
|
+
"value": { "type": "boolean", "default": "false" }
|
|
5075
|
+
},
|
|
4943
5076
|
{
|
|
4944
5077
|
"name": "disabled",
|
|
4945
5078
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -5040,6 +5173,8 @@
|
|
|
5040
5173
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
5041
5174
|
{ "name": "id", "type": "string" },
|
|
5042
5175
|
{ "name": "required", "type": "boolean" },
|
|
5176
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
5177
|
+
{ "name": "optional", "type": "boolean" },
|
|
5043
5178
|
{ "name": "disabled", "type": "boolean" },
|
|
5044
5179
|
{ "name": "readonly", "type": "boolean" },
|
|
5045
5180
|
{ "name": "label", "type": "string" },
|
|
@@ -5172,6 +5307,14 @@
|
|
|
5172
5307
|
"name": "required",
|
|
5173
5308
|
"value": { "type": "boolean", "default": "false" }
|
|
5174
5309
|
},
|
|
5310
|
+
{
|
|
5311
|
+
"name": "hide-required",
|
|
5312
|
+
"value": { "type": "boolean", "default": "false" }
|
|
5313
|
+
},
|
|
5314
|
+
{
|
|
5315
|
+
"name": "optional",
|
|
5316
|
+
"value": { "type": "boolean", "default": "false" }
|
|
5317
|
+
},
|
|
5175
5318
|
{
|
|
5176
5319
|
"name": "disabled",
|
|
5177
5320
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -5282,6 +5425,8 @@
|
|
|
5282
5425
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
5283
5426
|
{ "name": "id", "type": "string" },
|
|
5284
5427
|
{ "name": "required", "type": "boolean" },
|
|
5428
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
5429
|
+
{ "name": "optional", "type": "boolean" },
|
|
5285
5430
|
{ "name": "disabled", "type": "boolean" },
|
|
5286
5431
|
{ "name": "readonly", "type": "boolean" },
|
|
5287
5432
|
{ "name": "label", "type": "string" },
|
|
@@ -5329,6 +5474,14 @@
|
|
|
5329
5474
|
"name": "required",
|
|
5330
5475
|
"value": { "type": "boolean", "default": "false" }
|
|
5331
5476
|
},
|
|
5477
|
+
{
|
|
5478
|
+
"name": "hide-required",
|
|
5479
|
+
"value": { "type": "boolean", "default": "false" }
|
|
5480
|
+
},
|
|
5481
|
+
{
|
|
5482
|
+
"name": "optional",
|
|
5483
|
+
"value": { "type": "boolean", "default": "false" }
|
|
5484
|
+
},
|
|
5332
5485
|
{
|
|
5333
5486
|
"name": "disabled",
|
|
5334
5487
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -5432,6 +5585,8 @@
|
|
|
5432
5585
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
5433
5586
|
{ "name": "id", "type": "string" },
|
|
5434
5587
|
{ "name": "required", "type": "boolean" },
|
|
5588
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
5589
|
+
{ "name": "optional", "type": "boolean" },
|
|
5435
5590
|
{ "name": "disabled", "type": "boolean" },
|
|
5436
5591
|
{ "name": "readonly", "type": "boolean" },
|
|
5437
5592
|
{ "name": "label", "type": "string" },
|
|
@@ -5547,6 +5702,14 @@
|
|
|
5547
5702
|
"name": "required",
|
|
5548
5703
|
"value": { "type": "boolean", "default": "false" }
|
|
5549
5704
|
},
|
|
5705
|
+
{
|
|
5706
|
+
"name": "hide-required",
|
|
5707
|
+
"value": { "type": "boolean", "default": "false" }
|
|
5708
|
+
},
|
|
5709
|
+
{
|
|
5710
|
+
"name": "optional",
|
|
5711
|
+
"value": { "type": "boolean", "default": "false" }
|
|
5712
|
+
},
|
|
5550
5713
|
{
|
|
5551
5714
|
"name": "disabled",
|
|
5552
5715
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -5655,6 +5818,8 @@
|
|
|
5655
5818
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
5656
5819
|
{ "name": "id", "type": "string" },
|
|
5657
5820
|
{ "name": "required", "type": "boolean" },
|
|
5821
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
5822
|
+
{ "name": "optional", "type": "boolean" },
|
|
5658
5823
|
{ "name": "disabled", "type": "boolean" },
|
|
5659
5824
|
{ "name": "readonly", "type": "boolean" },
|
|
5660
5825
|
{ "name": "label", "type": "string" },
|
|
@@ -6428,6 +6593,14 @@
|
|
|
6428
6593
|
"name": "required",
|
|
6429
6594
|
"value": { "type": "boolean", "default": "false" }
|
|
6430
6595
|
},
|
|
6596
|
+
{
|
|
6597
|
+
"name": "hide-required",
|
|
6598
|
+
"value": { "type": "boolean", "default": "false" }
|
|
6599
|
+
},
|
|
6600
|
+
{
|
|
6601
|
+
"name": "optional",
|
|
6602
|
+
"value": { "type": "boolean", "default": "false" }
|
|
6603
|
+
},
|
|
6431
6604
|
{
|
|
6432
6605
|
"name": "disabled",
|
|
6433
6606
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -6543,6 +6716,8 @@
|
|
|
6543
6716
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
6544
6717
|
{ "name": "id", "type": "string" },
|
|
6545
6718
|
{ "name": "required", "type": "boolean" },
|
|
6719
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
6720
|
+
{ "name": "optional", "type": "boolean" },
|
|
6546
6721
|
{ "name": "disabled", "type": "boolean" },
|
|
6547
6722
|
{ "name": "readonly", "type": "boolean" },
|
|
6548
6723
|
{ "name": "label", "type": "string" },
|
|
@@ -7356,6 +7531,14 @@
|
|
|
7356
7531
|
"name": "required",
|
|
7357
7532
|
"value": { "type": "boolean", "default": "false" }
|
|
7358
7533
|
},
|
|
7534
|
+
{
|
|
7535
|
+
"name": "hide-required",
|
|
7536
|
+
"value": { "type": "boolean", "default": "false" }
|
|
7537
|
+
},
|
|
7538
|
+
{
|
|
7539
|
+
"name": "optional",
|
|
7540
|
+
"value": { "type": "boolean", "default": "false" }
|
|
7541
|
+
},
|
|
7359
7542
|
{
|
|
7360
7543
|
"name": "disabled",
|
|
7361
7544
|
"value": { "type": "boolean", "default": "false" }
|
|
@@ -7436,6 +7619,8 @@
|
|
|
7436
7619
|
{ "name": "form", "type": "HTMLFormElement | null" },
|
|
7437
7620
|
{ "name": "id", "type": "string" },
|
|
7438
7621
|
{ "name": "required", "type": "boolean" },
|
|
7622
|
+
{ "name": "hideRequired", "type": "boolean" },
|
|
7623
|
+
{ "name": "optional", "type": "boolean" },
|
|
7439
7624
|
{ "name": "disabled", "type": "boolean" },
|
|
7440
7625
|
{ "name": "readonly", "type": "boolean" },
|
|
7441
7626
|
{ "name": "label", "type": "string" },
|
|
@@ -7488,6 +7673,14 @@
|
|
|
7488
7673
|
"events": [{ "name": "remove", "type": "CustomEvent" }]
|
|
7489
7674
|
}
|
|
7490
7675
|
},
|
|
7676
|
+
{
|
|
7677
|
+
"name": "gradient-background",
|
|
7678
|
+
"description": "\n---\n",
|
|
7679
|
+
"doc-url": "",
|
|
7680
|
+
"attributes": [],
|
|
7681
|
+
"events": [],
|
|
7682
|
+
"js": { "properties": [], "events": [] }
|
|
7683
|
+
},
|
|
7491
7684
|
{
|
|
7492
7685
|
"name": "ngc-illustration-list",
|
|
7493
7686
|
"description": "An element that renders all of the illustrations in the illustration registry.\nThis component is not distributed as part of the library, but is useful for\ndevelopment and testing.\n---\n",
|