@ncino/web-components 8.0.0-preview.3 → 8.0.0-preview.30

package/dist/types/components/headline-card/gator/headline-card.gator.d.ts

@@ -7,13 +7,16 @@ export declare class NgcHeadlineCard extends NjcHeadlineCard {
     firstUpdated(): void;
     updated(): void;
     render(): import('lit').TemplateResult<1>;
+    get classes(): {
+        'gator-headline-card': boolean;
+        'gator-headline-card_vertical': boolean;
+        'gator-card_elevated': boolean;
+        'gator-card_outlined': boolean;
+    };
     get illustrationMarkup(): import('lit').TemplateResult<1>;
     get cardContentClass(): "gator-headline-card-content_vertical" | "gator-headline-card-content";
     get justifyCenterClass(): "" | "gator-headline-card-justify-content-center";
     get backgroundMarkup(): import('lit').TemplateResult<1> | null;
-    get elevatedClass(): "" | "gator-card_elevated";
-    get outlinedClass(): "" | "gator-card_outlined";
-    get orientationClass(): "" | "gator-headline-card_vertical";
     get getBackgroundClass(): "gator-headline-card-background-circle_vertical" | "gator-headline-card-background-circle";
     get shouldBeVertical(): boolean;
 }

package/dist/types/components/icon/gator/templates/brain.d.ts

@@ -0,0 +1 @@
+export declare const Brain: import('lit').TemplateResult;

package/dist/types/components/icon/gator/templates/document-ai.d.ts

@@ -0,0 +1 @@
+export declare const DocumentAi: import('lit').TemplateResult;

package/dist/types/components/icon/gator/templates/index.d.ts

@@ -15,6 +15,7 @@ export * from './bell';
 export * from './binoculars';
 export * from './book';
 export * from './box';
+export * from './brain';
 export * from './cake';
 export * from './calculator';
 export * from './calendar';
@@ -80,6 +81,7 @@ export * from './dashboard';
 export * from './delete';
 export * from './dna';
 export * from './document-add';
+export * from './document-ai';
 export * from './document-check';
 export * from './document-e-sign';
 export * from './document-image';
@@ -420,9 +422,17 @@ export * from './monitor';
 export * from './move-doc';
 export * from './move';
 export * from './music';
+export * from './number-0';
 export * from './number-1';
+export * from './number-10';
 export * from './number-2';
 export * from './number-3';
+export * from './number-4';
+export * from './number-5';
+export * from './number-6';
+export * from './number-7';
+export * from './number-8';
+export * from './number-9';
 export * from './overflow-menu';
 export * from './paper-airplane';
 export * from './paperclip';
@@ -464,6 +474,7 @@ export * from './radio';
 export * from './receipt';
 export * from './restricted-filled';
 export * from './restricted';
+export * from './robot';
 export * from './sandals';
 export * from './save';
 export * from './screen';

package/dist/types/components/icon/gator/templates/number-0.d.ts

@@ -0,0 +1 @@
+export declare const Number0: import('lit').TemplateResult;

package/dist/types/components/icon/gator/templates/number-10.d.ts

@@ -0,0 +1 @@
+export declare const Number10: import('lit').TemplateResult;

package/dist/types/components/icon/gator/templates/number-4.d.ts

@@ -0,0 +1 @@
+export declare const Number4: import('lit').TemplateResult;

package/dist/types/components/icon/gator/templates/number-5.d.ts

@@ -0,0 +1 @@
+export declare const Number5: import('lit').TemplateResult;

package/dist/types/components/icon/gator/templates/number-6.d.ts

@@ -0,0 +1 @@
+export declare const Number6: import('lit').TemplateResult;

package/dist/types/components/icon/gator/templates/number-7.d.ts

@@ -0,0 +1 @@
+export declare const Number7: import('lit').TemplateResult;

package/dist/types/components/icon/gator/templates/number-8.d.ts

@@ -0,0 +1 @@
+export declare const Number8: import('lit').TemplateResult;

package/dist/types/components/icon/gator/templates/number-9.d.ts

@@ -0,0 +1 @@
+export declare const Number9: import('lit').TemplateResult;

package/dist/types/components/icon/gator/templates/robot.d.ts

@@ -0,0 +1 @@
+export declare const Robot: import('lit').TemplateResult;

package/dist/types/components/input/base/input-base.d.ts

@@ -11,10 +11,20 @@ export declare class InputBase extends TestableLitElement {
     */
     id: string;
     /**
-        @property required - Whether the input is required
+        @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.
         @type boolean
      */
     required: boolean;
+    /**
+        @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.
+        @type boolean
+     */
+    hideRequired: boolean;
+    /**
+        @property optional - Whether the input should be marked as optional
+        @type boolean
+     */
+    optional: boolean;
     /**
         @property disabled - Whether the input is disabled
         @type boolean
@@ -48,7 +58,7 @@ export declare class InputBase extends TestableLitElement {
         @property value - The value of the rendered input
         @type string | number | undefined | null
      */
-    value: string | number | undefined | null | File | File[] | Date;
+    value: string | number | boolean | undefined | null | File | File[] | Date;
     /**
        @property errorText - The error text of the rendered input.
        @type string

package/dist/types/components/input/base/input-base.gator.d.ts

@@ -1,7 +1,11 @@
+import { CSSResult } from 'lit';
 import { InputBase } from './input-base.ts';
 import { Ref } from 'lit/directives/ref.js';
 export declare class NgcInputBase extends InputBase {
-    static styles: import('lit').CSSResult[];
+    protected static primitiveStyles: CSSResult;
+    protected static semanticStyles: CSSResult;
+    protected static primitiveAndSemanticStyleFilter: (style: CSSResult) => boolean;
+    static styles: CSSResult[];
     controlRef: Ref<HTMLDivElement>;
     protected _startIconAsText: string | undefined;
     protected _ariaDescribedBy: string | undefined;

package/dist/types/components/input/gator/dropdown/input-dropdown.gator.d.ts

@@ -103,7 +103,7 @@ export declare class NgcInputDropdown extends NgcInputBase {
     private setupResizeObserver;
     removeSelection(value: string): void;
     get fauxInputMarkup(): import('lit').TemplateResult<1>;
-    get displayedValue(): string | number | File | File[] | Date;
+    get displayedValue(): string | number | true | File | File[] | Date;
     get showPlaceholder(): boolean | "";
     get listboxMarkup(): import('lit').TemplateResult<1>;
     get selectAllIcon(): "checkbox-indeterminate" | "checkbox-selected" | "checkbox";

package/dist/types/components/input/gator/input-label/input-label.gator.d.ts

@@ -10,9 +10,13 @@ export declare class NgcInputLabel extends NgcComponent {
     };
     static styles: import('lit').CSSResult[];
     /**
-     * @property {boolean} required - Whether the label is required.
+     * @property {boolean} required - Whether the label is marked as required.
      */
     required: boolean;
+    /**
+     * @property {boolean} optional - Whether the label is marked as optional.
+     */
+    optional: boolean;
     /**
      * @property {boolean} disabled - Whether the label is disabled.
      */

package/dist/types/components/list/gator/list/list.gator.d.ts

@@ -53,13 +53,14 @@ export declare class NgcList extends NgcComponent {
     fauxFocus: boolean;
     hideCheckmarks: boolean;
     ariaLabel: string | null;
+    role: 'list' | 'listbox' | 'group' | null;
     _selectedListItem: string | null;
     _activeIndex: number;
     _totalListItems: number;
     private _listItemsWithEventListeners;
     updated(changedProperties: Map<string, unknown>): void;
     render(): import('lit').TemplateResult<1>;
-    get listRole(): string;
+    get listRole(): 'listbox' | 'list' | 'group';
     handleSlotChanged(): void;
     updateSlottedItems(): void;
     setFalseFocusToValue(value: string | number | File | File[] | Date): NgcListItem | undefined;

package/dist/types/components/list/gator/list-item/list-item.gator.d.ts

@@ -76,6 +76,8 @@ export declare class NgcListItem extends NgcComponent {
      * @property {string} tabIndex The tab index of the list item
      */
     tabindex: number | undefined;
+    ariaExpanded: string | null;
+    ariaCurrent: string | null;
     falseFocusing: boolean;
     listItemRef: Ref<HTMLLIElement>;
     connectedCallback(): void;
@@ -96,13 +98,15 @@ export declare class NgcListItem extends NgcComponent {
     get leftIconContent(): import('lit').TemplateResult<1> | null;
     get endMarkup(): import('lit').TemplateResult<1> | null;
     click(): void;
-    handleListItemClicked(): void;
+    handleListItemClicked(e?: Event, interactionType?: 'click' | 'keyboard'): void;
     private handleItemKeyUp;
     selectItem(): void;
     falseFocus(): void;
     removeFalseFocus(): void;
     setAriaSelected(): void;
+    setAriaExpanded(): void;
     setRole(): void;
+    setAriaCurrent(): void;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/types/components/progress-ring/gator/progress-ring.gator.d.ts

@@ -20,6 +20,14 @@ export declare class NgcProgressRing extends TestableLitElement {
      * @property {string} variant - The variant of the progress ring.
      */
     variant: '' | 'ai' | 'success' | 'warning' | 'error';
+    /**
+     * @property {boolean} hideText - Whether to hide the progress ring text.
+     */
+    hideText: boolean;
+    /**
+     * @property {boolean} hideIcon - Whether to hide the variant progress ring icon that renders when `hide-text` is true.
+     */
+    hideIcon: boolean;
     static styles: import('lit').CSSResult[];
     get computedDiameter(): number;
     get clampedValue(): number;

package/dist/types/components/progress-stepper/stepper-item/stepper-item.gator.d.ts

@@ -0,0 +1,27 @@
+import { PropertyValues } from 'lit';
+import { NgcComponent } from '../../../utils/components/ngc-component';
+export declare class NgcStepperItem extends NgcComponent {
+    variant: 'incomplete' | 'current' | 'success' | 'warning' | 'error' | 'ai';
+    vertical: boolean;
+    disabled: boolean;
+    skeleton: boolean;
+    active: boolean;
+    stepTitle: string | undefined;
+    stepSubtitle: string | undefined;
+    iconName: string | undefined;
+    static styles: import('lit').CSSResult[];
+    _orientation: string;
+    protected updated(_changedProperties: PropertyValues): void;
+    render(): import('lit').TemplateResult<1>;
+    get labelMarkup(): import('lit').TemplateResult<1>;
+    get titleTabIndex(): 0 | undefined;
+    get skeletonMarkup(): import('lit').TemplateResult<1>;
+    get classes(): {
+        [x: string]: boolean;
+        'gator-stepper-item': boolean;
+        'gator-stepper-item_disabled': boolean;
+        'gator-stepper-item_skeleton': boolean;
+        'gator-stepper-item_active': boolean;
+    };
+    get icon(): string;
+}

package/dist/types/components/radio-group/radio-group.gator.d.ts

@@ -1,6 +1,6 @@
-import { NgcRadio } from '../radio/radio.gator';
-import { NgcInputText } from '../input/gator/input-text/input-text.gator.ts';
 import { Ref } from 'lit/directives/ref.js';
+import { NgcInputText } from '../input/gator/input-text/input-text.gator.ts';
+import { NgcRadio } from '../radio/radio.gator';
 /**
  * @slot - The radios within the group
  */

package/dist/types/components/switch/gator/switch.gator.d.ts

@@ -15,6 +15,7 @@ export declare class NgcSwitch extends NjcSwitch {
     handleInputKeydown(event: KeyboardEvent): void;
     handleInputClick(event: Event): void;
     handleClick(): void;
+    handleMouseDown(event: MouseEvent): void;
     private _toggleSwitch;
     private _getLabelMarkup;
     private _getInputId;

package/dist/types/components/tabs/gator/tabset/tabset.gator.d.ts

@@ -1,3 +1,4 @@
+import { nothing } from 'lit';
 import { NgcTab } from '../tab/tab.gator.ts';
 import { Ref } from 'lit/directives/ref.js';
 import { TestableLitElement } from '../../../../utils/components/testable-lit-element/testable-lit-element.ts';
@@ -23,7 +24,7 @@ export declare class NgcTabset extends TestableLitElement {
     _contentRef: Ref<HTMLDivElement>;
     _tablistRef: Ref<HTMLDivElement>;
     updated(changedProperties: Map<string | number | symbol, unknown>): void;
-    render(): import('lit').TemplateResult<1>;
+    render(): import('lit').TemplateResult<1> | typeof nothing;
     get tabSizeClass(): string;
     get tabContainerSizeClass(): string;
     get tabSpacerClass(): "" | "gator-tabset-spacer";

package/dist/types/utils/components/gradient-background.d.ts

@@ -0,0 +1,5 @@
+import { LitElement } from 'lit';
+export declare class GradientBackground extends LitElement {
+    static styles: import('lit').CSSResult[];
+    render(): import('lit').TemplateResult<1>;
+}

package/dist/types/utils/components/ngc-component.d.ts

@@ -1,6 +1,10 @@
+import { CSSResult } from 'lit';
 import { TestableLitElement } from './testable-lit-element/testable-lit-element.ts';
 declare const NgcComponent_base: typeof TestableLitElement;
 export declare class NgcComponent extends NgcComponent_base {
+    protected static primitiveStyles: CSSResult;
+    protected static semanticStyles: CSSResult;
+    protected static primitiveAndSemanticStyleFilter: (style: CSSResult) => boolean;
     /**
      * A boolean property that determines whether ARIA-related attributes
      * (e.g., `aria-label`, `aria-labelledby`, `role`, etc.) are managed
@@ -17,6 +21,6 @@ export declare class NgcComponent extends NgcComponent_base {
      * @type {boolean}
      */
     skeleton: boolean;
-    static styles: import('lit').CSSResult[];
+    static styles: CSSResult[];
 }
 export {};

package/dist/types/utils/components/slot-placeholder/slot-placeholder.d.ts

@@ -1,7 +1,9 @@
 import { LitElement } from 'lit';
 export declare class SlotPlaceholder extends LitElement {
     slotName: string;
+    small: boolean;
     static styles: import('lit').CSSResult[];
     render(): import('lit').TemplateResult<1>;
     get namedSlotMarkup(): import('lit').TemplateResult<1>;
+    get smallSlotMarkup(): import('lit').TemplateResult<1>;
 }

package/dist/types/utils/mixins/attribute-deletion.d.ts

@@ -1,14 +1,5 @@
 import { LitElement } from 'lit';
 type Constructor<T = {}> = new (...args: any[]) => T;
-/**
- * A mixin that extends a LitElement-based class to handle the deletion and restoration
- * of specific attributes (e.g., ARIA attributes) from the host element. This is useful
- * for managing accessibility-related attributes dynamically based on the component's state.
- *
- * @template T - The base class to extend, typically a LitElement.
- * @param superClass - The base class to extend.
- * @returns A class that extends the base class with attribute deletion functionality.
- */
 export declare const AttributeDeletionMixin: <T extends Constructor<LitElement>>(superClass: T) => T;
 /**
  * Determines whether a given attribute should be removed from the host element.

package/dist/types/utils/storybook-args.d.ts

@@ -67,6 +67,34 @@ export declare const INPUT_BASE_ARGS: {
                 summary: string;
             };
         };
+        control: {
+            type: string;
+        };
+    };
+    hideRequired: {
+        name: string;
+        description: string;
+        control: {
+            type: string;
+        };
+        table: {
+            category: string;
+            defaultValue: {
+                summary: string;
+            };
+        };
+    };
+    optional: {
+        description: string;
+        control: {
+            type: string;
+        };
+        table: {
+            category: string;
+            defaultValue: {
+                summary: string;
+            };
+        };
     };
     disabled: {
         description: string;

package/dist/utils/components/gradient-background.js

@@ -0,0 +1,33 @@
+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`
+			<div class="top-area"></div>
+			<div class="body-area"></div>
+
+			<div class="content-area">
+				<slot></slot>
+			</div>
+		`}};t.styles=[c`
+			.top-area {
+				z-index: 1;
+				height: 300px;
+				background: linear-gradient(90deg, #11395B 0.68%, rgba(17, 57, 91, 0.50) 51.8%, #11395B 100%);
+			}
+
+			.body-area {
+				height: 100px;
+				z-index: 2;
+				margin-top: -100px;
+				border-radius: 5rem 5rem 0 0;
+				background: #FFF;
+			}
+
+			.content-area {
+				border-radius: 1rem;
+				background: #FFF;
+				margin: -200px auto 100px auto;
+				width: 35rem;
+				min-width: 18.75rem;
+				max-width: 37.4375rem;
+				flex-direction: column;
+				align-items: flex-start;
+			}
+		`];t=g([l("gradient-background")],t);export{t as GradientBackground};

package/dist/utils/components/ngc-component.js

@@ -1 +1 @@
-import n from"../../packages/web-components/src/tokens/primitive.tokens.scss.js";import u from"../../packages/web-components/src/tokens/semantic.tokens.scss.js";import y from"../../packages/web-components/src/styles/_gator-utils.scss.js";import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import"../../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{TestableLitElement as d}from"./testable-lit-element/testable-lit-element.js";import{AttributeDeletionMixin as v}from"../mixins/attribute-deletion.js";import{property as l}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{unsafeCSS as o}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var A=Object.defineProperty,f=(s,p,m,h)=>{for(var t=void 0,r=s.length-1,a;r>=0;r--)(a=s[r])&&(t=a(p,m,t)||t);return t&&A(p,m,t),t};const i=class i extends v(d){constructor(){super(...arguments),this.delegatesARIA=!0,this.skeleton=!1}};i.styles=[o(n),o(u),o(y)];let e=i;f([l({type:Boolean})],e.prototype,"delegatesARIA");f([l({type:Boolean})],e.prototype,"skeleton");export{e as NgcComponent};
+import l from"../../packages/web-components/src/tokens/primitive.tokens.scss.js";import n from"../../packages/web-components/src/tokens/semantic.tokens.scss.js";import c from"../../packages/web-components/src/styles/_gator-utils.scss.js";import S from"../../packages/web-components/public/styles/gator/gator-global-styles.css.js";import"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import"../../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{TestableLitElement as u}from"./testable-lit-element/testable-lit-element.js";import{AttributeDeletionMixin as v}from"../mixins/attribute-deletion.js";import{property as f}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{unsafeCSS as i}from"../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var d=Object.defineProperty,y=(m,r,p,h)=>{for(var e=void 0,s=m.length-1,a;s>=0;s--)(a=m[s])&&(e=a(r,p,e)||e);return e&&d(r,p,e),e},t;const o=(t=class extends v(u){constructor(){super(...arguments),this.delegatesARIA=!0,this.skeleton=!1}},t.primitiveStyles=i(l),t.semanticStyles=i(n),t.primitiveAndSemanticStyleFilter=r=>r!==t.primitiveStyles&&r!==t.semanticStyles,t.styles=[i(l),i(n),i(c),i(S)],t);y([f({type:Boolean})],o.prototype,"delegatesARIA");y([f({type:Boolean})],o.prototype,"skeleton");let C=o;export{C as NgcComponent};

package/dist/utils/components/slot-placeholder/slot-placeholder.js

@@ -1,16 +1,26 @@
-import"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as m}from"../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";import{LitElement as n}from"../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as d}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/custom-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{css as c}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var u=Object.defineProperty,v=Object.getOwnPropertyDescriptor,p=(i,t,s,r)=>{for(var e=r>1?void 0:r?v(t,s):t,a=i.length-1,l;a>=0;a--)(l=i[a])&&(e=(r?l(t,s,e):l(e))||e);return r&&e&&u(t,s,e),e};let o=class extends n{constructor(){super(...arguments),this.slotName=""}render(){return m`
-            <div class="slot-placeholder">
-                ${this.namedSlotMarkup}
+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{LitElement as n}from"../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";import{customElement as c}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{css as h}from"../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var u=Object.defineProperty,f=Object.getOwnPropertyDescriptor,m=(p,l,s,r)=>{for(var t=r>1?void 0:r?f(l,s):l,a=p.length-1,i;a>=0;a--)(i=p[a])&&(t=(r?i(l,s,t):i(t))||t);return r&&t&&u(l,s,t),t};let e=class extends n{constructor(){super(...arguments),this.slotName="",this.small=!1}render(){return o`
+            <div class="slot-placeholder slot-placeholder-${this.small?"small":"default"}">
+                ${this.small?this.smallSlotMarkup:this.namedSlotMarkup}
             </div>
-        `}get namedSlotMarkup(){return this.slotName?m`<div>Slot Name: ${this.slotName}</div>`:m`<div>Default slot</div>`}};o.styles=[c`
+        `}get namedSlotMarkup(){return this.slotName?o`<div>Slot Name: ${this.slotName}</div>`:o`<div><slot>Default slot</slot></div>`}get smallSlotMarkup(){return o`<ngc-icon name="picture"></ngc-icon>`}};e.styles=[h`
             .slot-placeholder {
+                display: var(--slot-placeholder-display, block);
                 background: #D8C3F3;
                 border: 1px dashed #9747FF;
                 border-radius: 0.5rem;
-                padding: 1rem;
                 font-family: var(--text-family-body, 'Open Sans', sans-serif);
                 font-size: var(--text-size-body-2, 0.9375rem);
                 color: #6F1FC3;
                 text-align: center;
+                box-sizing: border-box;
+                height: 100%;
+            }
+
+            .slot-placeholder-default {
+                padding: 1rem;
+            }
+
+            .slot-placeholder-small {
+                padding: 0;
             }
-        `];p([f({attribute:"slot-name"})],o.prototype,"slotName",2);o=p([d("slot-placeholder")],o);export{o as SlotPlaceholder};
+        `];m([d({attribute:"slot-name"})],e.prototype,"slotName",2);m([d({type:Boolean,attribute:"small"})],e.prototype,"small",2);e=m([c("slot-placeholder")],e);export{e as SlotPlaceholder};

package/dist/utils/mixins/attribute-deletion.js

@@ -1 +1 @@
-const b=s=>{class i extends s{constructor(){super(...arguments),this.attributesRemovedFromHost=new Map}attributeChangedCallback(t,e,r){if(!this.shouldApplyAttributeDeletion||!a(t)){super.attributeChangedCallback(t,e,r);return}this.removeAttributesFromHost(t,e,r)}get shouldApplyAttributeDeletion(){return this.delegatesARIA??!1}updated(t){super.updated(t),t.has("delegatesARIA")&&(this.delegatesARIA||this.restoreAttributesToHost())}removeAttributesFromHost(t,e,r){this.attributesRemovedFromHost.has(t)||this.attributesRemovedFromHost.set(t,e),this.removeAttribute(t);const o=u(t);r===null?delete this.dataset[o]:this.dataset[o]=r,this.requestUpdate(o,e)}restoreAttributesToHost(){this.attributesRemovedFromHost.forEach((t,e)=>{t!==null&&this.setAttribute(e,t)}),this.attributesRemovedFromHost.clear()}}return i};function a(s){return["aria-label","aria-labelledby","title","id","role","aria-haspopup"].includes(s)}function u(s){return s.replace(/-\w/g,i=>i[1].toUpperCase())}export{b as AttributeDeletionMixin,a as isAttributeToRemove};
+const a=["aria-label","aria-labelledby","title","id","role","aria-haspopup","aria-expanded","aria-current"],d=r=>{class i extends r{constructor(){super(...arguments),this.attributesRemovedFromHost=new Map}attributeChangedCallback(t,e,s){if(!this.shouldApplyAttributeDeletion||!u(t)){super.attributeChangedCallback(t,e,s);return}this.removeAttributesFromHost(t,e,s)}get shouldApplyAttributeDeletion(){return this.delegatesARIA??!1}updated(t){super.updated(t),t.has("delegatesARIA")&&(this.delegatesARIA||this.restoreAttributesToHost())}removeAttributesFromHost(t,e,s){this.attributesRemovedFromHost.has(t)||this.attributesRemovedFromHost.set(t,e),this.removeAttribute(t);const o=l(t);s===null?delete this.dataset[o]:this.dataset[o]=s,this.requestUpdate(o,e)}restoreAttributesToHost(){this.attributesRemovedFromHost.forEach((t,e)=>{t!==null&&this.setAttribute(e,t)}),this.attributesRemovedFromHost.clear()}}return i};function u(r){return a.includes(r)}function l(r){return r.replace(/-\w/g,i=>i[1].toUpperCase())}export{d as AttributeDeletionMixin,u as isAttributeToRemove};

package/dist/utils/storybook-args.js

@@ -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)"}}},c=(t,o)=>{let e,a={};for(e in t)t.hasOwnProperty(e)&&!o.includes(e)&&(a[e]=t[e]);return a},d=(t,o)=>{let e,a={};for(e in t)t.hasOwnProperty(e)&&o.includes(e)&&(a[e]=t[e]);return a};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,c as argsExclude,d as argsOnly};
+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/dist/utils/vitest-a11y-utils.js

@@ -1 +1 @@
-import{page as s}from"../node_modules/.pnpm/@vitest_browser@3.2.4_msw@2.7.3_@types_node@24.3.1_typescript@5.9.2__playwright@1.55.0__87f0b62113e4cf466e19137faba4c80e/node_modules/@vitest/browser/context.js";import n from"../_virtual/axe.js";import{a as o}from"../node_modules/.pnpm/vitest@3.2.4_@types_debug@4.1.12_@types_node@24.3.1_@vitest_browser@3.2.4_@vitest_ui@3._1b07986b91643c89c81b0014d2711937/node_modules/vitest/dist/chunks/vi.bdSIJ99Y.js";const d="Supercalifragilisticexpialidocious".repeat(10);async function a(t){return(await n.run(t)).violations}async function p(t){const e=await a(t);o(e,`Expected no axe core violations, but got ${e.length}: ${JSON.stringify(e)}`).toHaveLength(0)}function x(){return s.viewport(320,256)}function h(t){let e;if(t.scrollWidth!==0?e=t:t.shadowRoot?e=t.shadowRoot.firstElementChild:e=t.firstElementChild,e){const r=e.scrollWidth>e.clientWidth;return o(r).toBe(!1)}return o(!0).toBe(!1)}function g(t,e,r){let i=t.querySelector(":focus-visible");if(i||(i=t.shadowRoot?.querySelector(":focus-visible")),i){const l=getComputedStyle(i).getPropertyValue(e);return o(l).toContain(r)}return o(!0).toBe(!1)}export{g as expectComponentFocusStyle,h as expectComponentNotToHaveHorizontalScrollbar,p as expectNoAxeViolations,x as resizeWindowForReflowTest,a as runAxeAndGetViolations,d as superLongStringForReflowTest};
+import{page as s}from"../node_modules/.pnpm/@vitest_browser@3.2.4_msw@2.7.3_@types_node@24.6.2_typescript@5.9.2__playwright@1.55.0__e423b5c96de6c1c8a0306954de1e5183/node_modules/@vitest/browser/context.js";import n from"../_virtual/axe.js";import{a as o}from"../node_modules/.pnpm/vitest@3.2.4_@types_debug@4.1.12_@types_node@24.6.2_@vitest_browser@3.2.4_@vitest_ui@3._a2d9a3453db9fe314f49e01db7c034c4/node_modules/vitest/dist/chunks/vi.bdSIJ99Y.js";const d="Supercalifragilisticexpialidocious".repeat(10);async function a(t){return(await n.run(t)).violations}async function p(t){const e=await a(t);o(e,`Expected no axe core violations, but got ${e.length}: ${JSON.stringify(e)}`).toHaveLength(0)}function x(){return s.viewport(320,256)}function h(t){let e;if(t.scrollWidth!==0?e=t:t.shadowRoot?e=t.shadowRoot.firstElementChild:e=t.firstElementChild,e){const r=e.scrollWidth>e.clientWidth;return o(r).toBe(!1)}return o(!0).toBe(!1)}function g(t,e,r){let i=t.querySelector(":focus-visible");if(i||(i=t.shadowRoot?.querySelector(":focus-visible")),i){const l=getComputedStyle(i).getPropertyValue(e);return o(l).toContain(r)}return o(!0).toBe(!1)}export{g as expectComponentFocusStyle,h as expectComponentNotToHaveHorizontalScrollbar,p as expectNoAxeViolations,x as resizeWindowForReflowTest,a as runAxeAndGetViolations,d as superLongStringForReflowTest};

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@ncino/web-components",
     "author": "nCino",
-    "version": "8.0.0-preview.3",
+    "version": "8.0.0-preview.30",
     "license": "(c) Copyright 2023 nCino, Inc., all rights reserved",
     "publishConfig": {
         "registry": "https://registry.npmjs.org/"
@@ -67,6 +67,7 @@
         "dependencies:update:minor": "pnpm dlx npm-check-updates -u --target minor",
         "figma-connect-single": "node scripts/figma-connect-single.js",
         "lint": "eslint .",
+        "lint:fix": "eslint . --fix",
         "localize:extract": "lit-localize extract",
         "localize:build": "lit-localize build",
         "preview": "vite preview",
@@ -99,31 +100,31 @@
         "@storybook/addon-docs": "^9.1.5",
         "@storybook/addon-links": "^9.1.5",
         "@storybook/web-components-vite": "^9.1.5",
-        "@types/react": "^19.1.12",
-        "@typescript-eslint/parser": "^8.43.0",
+        "@types/react": "^19.2.0",
+        "@typescript-eslint/parser": "^8.45.0",
         "@vitest/browser": "^3.2.4",
         "@vitest/coverage-v8": "^3.2.4",
         "@vitest/ui": "3.2.4",
         "axe-core": "^4.10.3",
         "cem-plugin-expanded-types": "^1.4.0",
-        "chromatic": "^13.1.4",
+        "chromatic": "^13.3.0",
         "conventional-changelog-conventionalcommits": "^9.1.0",
         "custom-element-jet-brains-integration": "^1.7.0",
         "custom-elements-manifest": "^2.1.0",
-        "eslint": "^9.35.0",
+        "eslint": "^9.37.0",
         "eslint-config-standard": "^17.1.0",
         "eslint-plugin-import": "^2.32.0",
         "eslint-plugin-json": "^4.0.1",
-        "eslint-plugin-n": "^17.22.0",
+        "eslint-plugin-n": "^17.23.1",
         "eslint-plugin-promise": "^7.2.1",
         "eslint-plugin-storybook": "^9.1.5",
-        "eslint-plugin-yml": "1.18.0",
+        "eslint-plugin-yml": "1.19.0",
         "glob": "^11.0.3",
         "jsdom": "26.1.0",
         "playwright": "1.55.0",
         "postcss": "^8.5.6",
         "rimraf": "^6.0.1",
-        "sass": "1.92.1",
+        "sass": "1.93.2",
         "storybook": "^9.1.5",
         "storybook-addon-code-editor": "^5.0.0",
         "storybook-design-token": "^4.1.0",