igniteui-webcomponents 7.2.4 → 7.3.0-beta.1

package/components/icon/registry/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/icon/registry/types.ts"],"names":[],"mappings":"AA0BA,MAAM,CAAN,IAAY,UAIX;AAJD,WAAY,UAAU;IACpB,qDAAa,CAAA;IACb,2DAAgB,CAAA;IAChB,yEAAuB,CAAA;AACzB,CAAC,EAJW,UAAU,KAAV,UAAU,QAIrB","sourcesContent":["import type { Theme } from '../../../theming/types.js';\nimport type { DefaultMap } from './default-map.js';\n\n// Exported internal types\n\nexport type IconsCollection<T> = DefaultMap<string, Map<string, T>>;\n\nexport type IconCallback = (name: string, collection: string) => void;\nexport type IconThemeKey = Theme | 'default';\n\nexport type SvgIcon = {\n  svg: string;\n  title?: string;\n};\n\nexport type IconReference = {\n  alias: IconMeta;\n  target: Map<IconThemeKey, IconMeta>;\n};\n\nexport type IconReferencePair = {\n  alias: IconMeta;\n  target: IconMeta;\n  overwrite: boolean;\n};\n\nexport enum ActionType {\n  SyncState = 0,\n  RegisterIcon = 1,\n  UpdateIconReference = 2,\n}\n\n/** @ignore */\nexport interface BroadcastIconsChangeMessage {\n  actionType: ActionType;\n  collections?: Map<string, Map<string, SvgIcon>>;\n  references?: Map<string, Map<string, IconMeta>>;\n  origin?: string;\n}\n\n// Exported public types\n\nexport interface IconMeta {\n  name: string;\n  collection: string;\n  external?: boolean;\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/icon/registry/types.ts"],"names":[],"mappings":"AAsBA,MAAM,CAAN,IAAY,UAIX;AAJD,WAAY,UAAU;IACpB,qDAAa,CAAA;IACb,2DAAgB,CAAA;IAChB,yEAAuB,CAAA;AACzB,CAAC,EAJW,UAAU,KAAV,UAAU,QAIrB","sourcesContent":["import type { Theme } from '#theming/types.js';\n\n// Exported internal types\n\n/** Icons or references organized by collection, then by name. */\nexport type IconsCollection<V> = Map<string, Map<string, V>>;\n\n/** Notified when the icon registry changes. Subscribers re-resolve their own state. */\nexport type IconCallback = () => void;\nexport type IconThemeKey = Theme | 'default';\n\nexport type SvgIcon = {\n  svg: string;\n  title?: string;\n};\n\nexport type IconReferencePair = {\n  alias: IconMeta;\n  target: IconMeta;\n  overwrite: boolean;\n};\n\nexport enum ActionType {\n  SyncState = 0,\n  RegisterIcon = 1,\n  UpdateIconReference = 2,\n}\n\n/** @hidden */\nexport interface BroadcastIconsChangeMessage {\n  actionType: ActionType;\n  collections?: IconsCollection<SvgIcon>;\n  references?: IconsCollection<IconMeta>;\n  origin?: string;\n}\n\n// Exported public types\n\n/** Identifies a registered icon by its name and the collection it belongs to. */\nexport interface IconMeta {\n  /** The name identifier of the icon in the collection. */\n  name: string;\n  /** The name of the collection the icon is registered in. */\n  collection: string;\n  /** @internal Internal use only. */\n  external?: boolean;\n}\n\n/**\n * Options for registering an SVG icon.\n *\n * @remarks\n * Can be passed as the third argument to `registerIcon` or `registerIconFromText`\n * in place of a plain collection string, giving you control over both the\n * target collection and SVG metadata stripping in a single, named-parameter call.\n *\n * @example:\n * ```typescript\n * registerIconFromText('home', svg, { collection: 'my-collection', stripMeta: true });\n * ```\n */\nexport interface RegisterIconOptions {\n  /**\n   * The collection to register the icon in.\n   * @default 'default'\n   */\n  collection?: string;\n\n  /**\n   * Whether to strip SVG meta elements (`<title>` and `<desc>`) from the icon\n   * before storing it.\n   *\n   * @remarks\n   * SVG `<title>` elements cause the browser to display a native tooltip when\n   * the user hovers over the icon - an undesirable side-effect when using icon\n   * packs such as `@igniteui/material-icons-extended` that embed accessible\n   * metadata inside every icon.\n   *\n   * When `stripMeta` is `true`:\n   * - The `<title>` and `<desc>` child elements are removed from the stored SVG.\n   * - Any `aria-labelledby` / `aria-describedby` references on the root\n   *   `<svg>` element that pointed to the stripped elements' IDs are cleaned up\n   *   so the resulting markup contains no dangling ARIA references.\n   * - The **title text** is still captured and stored as `SvgIcon.title`, which\n   *   the icon component continues to expose as its host `aria-label`.\n   *   Accessibility is therefore preserved at the component level while the\n   *   browser tooltip is suppressed at the SVG level.\n   *\n   * @default false\n   */\n  stripMeta?: boolean;\n}\n"]}

package/components/icon/themes/icon.base.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;align-items:center;justify-content:center}igc-icon,svg{width:1em;height:1em}:host([mirrored]){transform:scaleX(-1)}`;
+export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;align-items:center;justify-content:center}svg{width:1em;height:1em}:host([mirrored]){transform:scaleX(-1)}`;
 //# sourceMappingURL=icon.base.css.js.map

package/components/icon/themes/icon.base.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon.base.css.js","sourceRoot":"","sources":["../../../../src/components/icon/themes/icon.base.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,ulCAAulC,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;align-items:center;justify-content:center}igc-icon,svg{width:1em;height:1em}:host([mirrored]){transform:scaleX(-1)}`;\n  "]}
+{"version":3,"file":"icon.base.css.js","sourceRoot":"","sources":["../../../../src/components/icon/themes/icon.base.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,8kCAA8kC,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{display:inline-flex;align-items:center;justify-content:center}svg{width:1em;height:1em}:host([mirrored]){transform:scaleX(-1)}`;\n  "]}

package/components/icon/themes/shared/icon.common.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host{--component-size: var(--ig-size, var(--default-size));color:var(--color)}svg{fill:currentcolor}igc-icon,svg{font-size:var(--size)}`;
+export const styles = css `:host{--component-size: var(--ig-size, var(--default-size));color:var(--color)}svg{fill:currentcolor;font-size:var(--size)}`;
 //# sourceMappingURL=icon.common.css.js.map

package/components/icon/themes/shared/icon.common.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon.common.css.js","sourceRoot":"","sources":["../../../../../src/components/icon/themes/shared/icon.common.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,0IAA0I,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--component-size: var(--ig-size, var(--default-size));color:var(--color)}svg{fill:currentcolor}igc-icon,svg{font-size:var(--size)}`;\n  "]}
+{"version":3,"file":"icon.common.css.js","sourceRoot":"","sources":["../../../../../src/components/icon/themes/shared/icon.common.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,6HAA6H,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--component-size: var(--ig-size, var(--default-size));color:var(--color)}svg{fill:currentcolor;font-size:var(--size)}`;\n  "]}

package/components/icon/themes/themes.d.ts

@@ -1,2 +1,2 @@
-import type { Themes } from '../../../theming/types.js';
+import type { Themes } from '#theming/types.js';
 export declare const all: Themes;

package/components/icon/themes/themes.js.map

@@ -1 +1 @@
-{"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../src/components/icon/themes/themes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAI1B,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,8BAA8B,CAAC;AACvE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAErE,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,8BAA8B,CAAC;AACvE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAE9D,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAE/D,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,SAAS,EAAE,GAAG,CAAA;MACV,SAAS,IAAI,cAAc;GAC9B;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,aAAa;GAChB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,WAAW;GACxB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,WAAW;GACxB;CACF,CAAC;AAEF,MAAM,IAAI,GAAG;IACX,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,SAAS,EAAE,GAAG,CAAA;MACV,SAAS,IAAI,aAAa;GAC7B;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,YAAY;GACf;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,UAAU;GACvB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,UAAU;GACvB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,GAAG,GAAW,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nimport type { Themes } from '../../../theming/types.js';\n// Dark Overrides\nimport { styles as bootstrapDark } from './dark/icon.bootstrap.css.js';\nimport { styles as fluentDark } from './dark/icon.fluent.css.js';\nimport { styles as indigoDark } from './dark/icon.indigo.css.js';\nimport { styles as materialDark } from './dark/icon.material.css.js';\n// Light Overrides\nimport { styles as bootstrapLight } from './light/icon.bootstrap.css.js';\nimport { styles as fluentLight } from './light/icon.fluent.css.js';\nimport { styles as indigoLight } from './light/icon.indigo.css.js';\nimport { styles as materialLight } from './light/icon.material.css.js';\nimport { styles as shared } from './light/icon.shared.css.js';\n// Shared Styles\nimport { styles as bootstrap } from './shared/icon.bootstrap.css.js';\nimport { styles as fluent } from './shared/icon.fluent.css.js';\nimport { styles as indigo } from './shared/icon.indigo.css.js';\n\nconst light = {\n  shared: css`\n    ${shared}\n  `,\n  bootstrap: css`\n    ${bootstrap} ${bootstrapLight}\n  `,\n  material: css`\n    ${materialLight}\n  `,\n  fluent: css`\n    ${fluent} ${fluentLight}\n  `,\n  indigo: css`\n    ${indigo} ${indigoLight}\n  `,\n};\n\nconst dark = {\n  shared: css`\n    ${shared}\n  `,\n  bootstrap: css`\n    ${bootstrap} ${bootstrapDark}\n  `,\n  material: css`\n    ${materialDark}\n  `,\n  fluent: css`\n    ${fluent} ${fluentDark}\n  `,\n  indigo: css`\n    ${indigo} ${indigoDark}\n  `,\n};\n\nexport const all: Themes = { light, dark };\n"]}
+{"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../src/components/icon/themes/themes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAI1B,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,8BAA8B,CAAC;AACvE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAErE,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,8BAA8B,CAAC;AACvE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAE9D,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,gCAAgC,CAAC;AACrE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAE/D,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,SAAS,EAAE,GAAG,CAAA;MACV,SAAS,IAAI,cAAc;GAC9B;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,aAAa;GAChB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,WAAW;GACxB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,WAAW;GACxB;CACF,CAAC;AAEF,MAAM,IAAI,GAAG;IACX,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,SAAS,EAAE,GAAG,CAAA;MACV,SAAS,IAAI,aAAa;GAC7B;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,YAAY;GACf;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,UAAU;GACvB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM,IAAI,UAAU;GACvB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,GAAG,GAAW,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nimport type { Themes } from '#theming/types.js';\n// Dark Overrides\nimport { styles as bootstrapDark } from './dark/icon.bootstrap.css.js';\nimport { styles as fluentDark } from './dark/icon.fluent.css.js';\nimport { styles as indigoDark } from './dark/icon.indigo.css.js';\nimport { styles as materialDark } from './dark/icon.material.css.js';\n// Light Overrides\nimport { styles as bootstrapLight } from './light/icon.bootstrap.css.js';\nimport { styles as fluentLight } from './light/icon.fluent.css.js';\nimport { styles as indigoLight } from './light/icon.indigo.css.js';\nimport { styles as materialLight } from './light/icon.material.css.js';\nimport { styles as shared } from './light/icon.shared.css.js';\n// Shared Styles\nimport { styles as bootstrap } from './shared/icon.bootstrap.css.js';\nimport { styles as fluent } from './shared/icon.fluent.css.js';\nimport { styles as indigo } from './shared/icon.indigo.css.js';\n\nconst light = {\n  shared: css`\n    ${shared}\n  `,\n  bootstrap: css`\n    ${bootstrap} ${bootstrapLight}\n  `,\n  material: css`\n    ${materialLight}\n  `,\n  fluent: css`\n    ${fluent} ${fluentLight}\n  `,\n  indigo: css`\n    ${indigo} ${indigoLight}\n  `,\n};\n\nconst dark = {\n  shared: css`\n    ${shared}\n  `,\n  bootstrap: css`\n    ${bootstrap} ${bootstrapDark}\n  `,\n  material: css`\n    ${materialDark}\n  `,\n  fluent: css`\n    ${fluent} ${fluentDark}\n  `,\n  indigo: css`\n    ${indigo} ${indigoDark}\n  `,\n};\n\nexport const all: Themes = { light, dark };\n"]}

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

@@ -1,35 +1,25 @@
 import { LitElement, nothing, type TemplateResult } from 'lit';
-import type { ThemingController } from '../../theming/theming-controller.js';
-import type { SlotController } from '../common/controllers/slot.js';
-import type { Constructor } from '../common/mixins/constructor.js';
+import type { SlotController } from '#internals/controllers/slot.js';
+import type { Constructor } from '#internals/mixins/constructor.js';
+import type { ThemingController } from '#theming/theming-controller.js';
 export interface IgcInputComponentEventMap {
     igcInput: CustomEvent<string>;
     igcChange: CustomEvent<string>;
     focus: FocusEvent;
     blur: FocusEvent;
 }
-declare const IgcInputBaseComponent_base: Constructor<import("../common/mixins/forms/types.js").FormRequiredInterface & import("../common/mixins/forms/types.js").FormAssociatedElementInterface> & Constructor<import("../common/mixins/event-emitter.js").EventEmitterInterface<IgcInputComponentEventMap>> & Constructor<LitElement>;
+declare const IgcInputBaseComponent_base: Constructor<import("../../internals/mixins/forms/types.js").FormRequiredInterface & import("../../internals/mixins/forms/types.js").FormAssociatedElementInterface> & Constructor<import("#internals/mixins/event-emitter.js").EventEmitterInterface<IgcInputComponentEventMap>> & Constructor<LitElement>;
 export declare abstract class IgcInputBaseComponent extends IgcInputBaseComponent_base {
     protected abstract readonly _themes: ThemingController;
     protected abstract readonly _slots: SlotController<any>;
     protected readonly _inputId: string;
     protected readonly _input?: HTMLInputElement;
     /**
-     * Externally supplied label elements forwarded by a composite host (e.g. `igc-select`)
-     * so that the host's associated labels reach the inner native input. When set, these take
-     * precedence over the component's own `ElementInternals` labels.
-     *
-     * @hidden @internal
-     */
-    _labelElements: ReadonlyArray<Element> | null;
-    /**
-     * Resolves the label elements applied to the native input as `aria-labelledby` targets,
-     * preferring forwarded labels over the component's own `ElementInternals` labels.
-     *
-     * @hidden @internal
+     * Receives ARIA semantics projected by a composite host (e.g. `igc-select`)
+     * onto the inner native input. See {@link addAriaTarget}.
      */
-    protected get _resolvedLabelElements(): ReadonlyArray<Element> | null;
-    /** The value attribute of the control. */
+    protected readonly _ariaTarget: import("#internals/controllers/aria-projection.js").AriaTargetController;
+    /** The value of the control. */
     abstract value: string;
     /**
      * Whether the control will have outlined appearance.
@@ -39,7 +29,7 @@ export declare abstract class IgcInputBaseComponent extends IgcInputBaseComponen
      */
     outlined: boolean;
     /**
-     * The placeholder attribute of the control.
+     * The placeholder text of the control.
      * @attr
      */
     placeholder: string;
@@ -52,12 +42,7 @@ export declare abstract class IgcInputBaseComponent extends IgcInputBaseComponen
      * Resolves the part names for the container based on the current state.
      * Used to apply conditional styling via CSS parts.
      */
-    protected _resolvePartNames(base: string): {
-        [x: string]: boolean;
-        prefixed: boolean;
-        suffixed: boolean;
-        filled: boolean;
-    };
+    protected _resolvePartNames(base: string): Record<string, boolean>;
     /** Selects all the text inside the input. */
     select(): void;
     /** Sets focus on the control. */

package/components/input/input-base.js

@@ -5,34 +5,28 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { LitElement, nothing } from 'lit';
-import { property, query, state } from 'lit/decorators.js';
+import { property, query } from 'lit/decorators.js';
 import { cache } from 'lit/directives/cache.js';
-import { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';
-import { shadowOptions } from '../common/decorators/shadow-options.js';
-import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
-import { FormAssociatedRequiredMixin } from '../common/mixins/forms/associated-required.js';
-import { nextInputId, renderInputShell, } from '../common/templates/input-shell.js';
+import { addAriaTarget } from '#internals/controllers/aria-projection.js';
+import { blazorDeepImport } from '#internals/decorators/blazorDeepImport.js';
+import { shadowOptions } from '#internals/decorators/shadow-options.js';
+import { EventEmitterMixin } from '#internals/mixins/event-emitter.js';
+import { FormAssociatedRequiredMixin } from '#internals/mixins/forms/associated-required.js';
+import { nextInputId, renderInputShell, resolveInputPartNames, } from '#internals/templates/input-shell.js';
 let IgcInputBaseComponent = class IgcInputBaseComponent extends FormAssociatedRequiredMixin(EventEmitterMixin(LitElement)) {
     constructor() {
         super(...arguments);
         this._inputId = nextInputId();
-        this._labelElements = null;
+        this._ariaTarget = addAriaTarget(this, {
+            labels: () => this._internals.labels,
+            description: () => this._slots.hasAssignedElements('helper-text')
+                ? this.renderRoot.querySelector('#helper-text')
+                : null,
+        });
         this.outlined = false;
     }
-    get _resolvedLabelElements() {
-        return this._labelElements ?? this._internals.labels;
-    }
     _resolvePartNames(base) {
-        return {
-            [base]: true,
-            prefixed: this._slots.hasAssignedElements('prefix', {
-                selector: '[slot="prefix"]:not([hidden])',
-            }),
-            suffixed: this._slots.hasAssignedElements('suffix', {
-                selector: '[slot="suffix"]:not([hidden])',
-            }),
-            filled: !!this.value,
-        };
+        return resolveInputPartNames(this._slots, base, !!this.value);
     }
     select() {
         this._input?.select();
@@ -60,9 +54,6 @@ let IgcInputBaseComponent = class IgcInputBaseComponent extends FormAssociatedRe
 __decorate([
     query('input')
 ], IgcInputBaseComponent.prototype, "_input", void 0);
-__decorate([
-    state()
-], IgcInputBaseComponent.prototype, "_labelElements", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], IgcInputBaseComponent.prototype, "outlined", void 0);

package/components/input/input-base.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-base.js","sourceRoot":"","sources":["../../../src/components/input/input-base.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAGhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,aAAa,EAAE,MAAM,wCAAwC,CAAC;AAEvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,2BAA2B,EAAE,MAAM,+CAA+C,CAAC;AAC5F,OAAO,EACL,WAAW,EACX,gBAAgB,GACjB,MAAM,oCAAoC,CAAC;AAkBrC,IAAe,qBAAqB,GAApC,MAAe,qBAAsB,SAAQ,2BAA2B,CAC7E,iBAAiB,CACf,UAAU,CACX,CACF;IAJM;;QAQc,aAAQ,GAAG,WAAW,EAAE,CAAC;QAarC,mBAAc,GAAkC,IAAI,CAAC;QAuBrD,aAAQ,GAAG,KAAK,CAAC;IAoE1B,CAAC;IAnFC,IAAc,sBAAsB;QAClC,OAAO,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC;IACvD,CAAC;IAiCS,iBAAiB,CAAC,IAAY;QACtC,OAAO;YACL,CAAC,IAAI,CAAC,EAAE,IAAI;YACZ,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE;gBAClD,QAAQ,EAAE,+BAA+B;aAC1C,CAAC;YACF,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE;gBAClD,QAAQ,EAAE,+BAA+B;aAC1C,CAAC;YACF,MAAM,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK;SACrB,CAAC;IACJ,CAAC;IAGM,MAAM;QACX,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC;IACxB,CAAC;IAIe,KAAK,CAAC,OAAsB;QAC1C,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC;IAIe,IAAI;QAClB,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC;IACtB,CAAC;IAIS,gBAAgB;QACxB,OAAO,OAAO,CAAC;IACjB,CAAC;IAEkB,MAAM;QACvB,OAAO,KAAK,CACV,gBAAgB,CAAC,IAAI,EAAE;YACrB,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,KAAK;YACzB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,OAAO,EAAE,IAAI,CAAC,QAAQ;YACtB,cAAc,EAAE,IAAI,CAAC,iBAAiB,CAAC,WAAW,CAAC;YACnD,WAAW,EAAE,IAAI,CAAC,YAAY;YAC9B,eAAe,EAAE,IAAI,CAAC,gBAAgB;SACvC,CAAC,CACH,CAAC;IACJ,CAAC;CACF,CAAA;AArGoB;IADlB,KAAK,CAAC,OAAO,CAAC;qDAC8B;AAUtC;IADN,KAAK,EAAE;6DACoD;AAuBrD;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDACnB;AAOjB;IADN,QAAQ,EAAE;0DACiB;AAOrB;IADN,QAAQ,EAAE;oDACW;AA1DF,qBAAqB;IAF1C,gBAAgB;IAChB,aAAa,CAAC,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC;GAClB,qBAAqB,CAgH1C","sourcesContent":["import { LitElement, nothing, type TemplateResult } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport type { ThemingController } from '../../theming/theming-controller.js';\nimport type { SlotController } from '../common/controllers/slot.js';\nimport { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';\nimport { shadowOptions } from '../common/decorators/shadow-options.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { FormAssociatedRequiredMixin } from '../common/mixins/forms/associated-required.js';\nimport {\n  nextInputId,\n  renderInputShell,\n} from '../common/templates/input-shell.js';\n\nexport interface IgcInputComponentEventMap {\n  /* alternateName: inputOcurred */\n  igcInput: CustomEvent<string>;\n  /* blazorSuppress */\n  igcChange: CustomEvent<string>;\n  // For analyzer meta only:\n  /* skipWCPrefix */\n  focus: FocusEvent;\n  /* skipWCPrefix */\n  blur: FocusEvent;\n}\n\n/* blazorIndirectRender */\n/* blazorSupportsVisualChildren */\n@blazorDeepImport\n@shadowOptions({ delegatesFocus: true })\nexport abstract class IgcInputBaseComponent extends FormAssociatedRequiredMixin(\n  EventEmitterMixin<IgcInputComponentEventMap, Constructor<LitElement>>(\n    LitElement\n  )\n) {\n  protected abstract readonly _themes: ThemingController;\n  protected abstract readonly _slots: SlotController<any>;\n\n  protected readonly _inputId = nextInputId();\n\n  @query('input')\n  protected readonly _input?: HTMLInputElement;\n\n  /**\n   * Externally supplied label elements forwarded by a composite host (e.g. `igc-select`)\n   * so that the host's associated labels reach the inner native input. When set, these take\n   * precedence over the component's own `ElementInternals` labels.\n   *\n   * @hidden @internal\n   */\n  @state()\n  public _labelElements: ReadonlyArray<Element> | null = null;\n\n  /**\n   * Resolves the label elements applied to the native input as `aria-labelledby` targets,\n   * preferring forwarded labels over the component's own `ElementInternals` labels.\n   *\n   * @hidden @internal\n   */\n  protected get _resolvedLabelElements(): ReadonlyArray<Element> | null {\n    return this._labelElements ?? this._internals.labels;\n  }\n\n  /* blazorSuppress */\n  /** The value attribute of the control. */\n  public abstract value: string;\n\n  /**\n   * Whether the control will have outlined appearance.\n   *\n   * @attr\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public outlined = false;\n\n  /**\n   * The placeholder attribute of the control.\n   * @attr\n   */\n  @property()\n  public placeholder!: string;\n\n  /**\n   * The label for the control.\n   * @attr\n   */\n  @property()\n  public label!: string;\n\n  /**\n   * Resolves the part names for the container based on the current state.\n   * Used to apply conditional styling via CSS parts.\n   */\n  protected _resolvePartNames(base: string) {\n    return {\n      [base]: true,\n      prefixed: this._slots.hasAssignedElements('prefix', {\n        selector: '[slot=\"prefix\"]:not([hidden])',\n      }),\n      suffixed: this._slots.hasAssignedElements('suffix', {\n        selector: '[slot=\"suffix\"]:not([hidden])',\n      }),\n      filled: !!this.value,\n    };\n  }\n\n  /** Selects all the text inside the input. */\n  public select(): void {\n    this._input?.select();\n  }\n\n  /* alternateName: focusComponent */\n  /** Sets focus on the control. */\n  public override focus(options?: FocusOptions): void {\n    this._input?.focus(options);\n  }\n\n  /* alternateName: blurComponent */\n  /** Removes focus from the control. */\n  public override blur(): void {\n    this._input?.blur();\n  }\n\n  protected abstract _renderInput(): TemplateResult;\n\n  protected _renderFileParts(): TemplateResult | typeof nothing {\n    return nothing;\n  }\n\n  protected override render() {\n    return cache(\n      renderInputShell(this, {\n        theme: this._themes.theme,\n        label: this.label,\n        labelId: this._inputId,\n        containerParts: this._resolvePartNames('container'),\n        renderInput: this._renderInput,\n        renderFileParts: this._renderFileParts,\n      })\n    );\n  }\n}\n"]}
+{"version":3,"file":"input-base.js","sourceRoot":"","sources":["../../../src/components/input/input-base.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,2CAA2C,CAAC;AAE1E,OAAO,EAAE,gBAAgB,EAAE,MAAM,2CAA2C,CAAC;AAC7E,OAAO,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AAExE,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,2BAA2B,EAAE,MAAM,gDAAgD,CAAC;AAC7F,OAAO,EACL,WAAW,EACX,gBAAgB,EAChB,qBAAqB,GACtB,MAAM,qCAAqC,CAAC;AAoBtC,IAAe,qBAAqB,GAApC,MAAe,qBAAsB,SAAQ,2BAA2B,CAC7E,iBAAiB,CACf,UAAU,CACX,CACF;IAJM;;QAQc,aAAQ,GAAG,WAAW,EAAE,CAAC;QASzB,gBAAW,GAAG,aAAa,CAAC,IAAI,EAAE;YACnD,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,MAAM;YACpC,WAAW,EAAE,GAAG,EAAE,CAChB,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,aAAa,CAAC;gBAC5C,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,cAAc,CAAC;gBAC/C,CAAC,CAAC,IAAI;SACX,CAAC,CAAC;QAaI,aAAQ,GAAG,KAAK,CAAC;IA2D1B,CAAC;IAvCW,iBAAiB,CAAC,IAAY;QACtC,OAAO,qBAAqB,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAChE,CAAC;IAGM,MAAM;QACX,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC;IACxB,CAAC;IAIe,KAAK,CAAC,OAAsB;QAC1C,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC;IAIe,IAAI;QAClB,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC;IACtB,CAAC;IAIS,gBAAgB;QACxB,OAAO,OAAO,CAAC;IACjB,CAAC;IAEkB,MAAM;QACvB,OAAO,KAAK,CACV,gBAAgB,CAAC,IAAI,EAAE;YACrB,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,KAAK;YACzB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,OAAO,EAAE,IAAI,CAAC,QAAQ;YACtB,cAAc,EAAE,IAAI,CAAC,iBAAiB,CAAC,WAAW,CAAC;YACnD,WAAW,EAAE,IAAI,CAAC,YAAY;YAC9B,eAAe,EAAE,IAAI,CAAC,gBAAgB;SACvC,CAAC,CACH,CAAC;IACJ,CAAC;CACF,CAAA;AApFoB;IADlB,KAAK,CAAC,OAAO,CAAC;qDAC8B;AAyBtC;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDACnB;AAOjB;IADN,QAAQ,EAAE;0DACiB;AAOrB;IADN,QAAQ,EAAE;oDACW;AAlDF,qBAAqB;IAF1C,gBAAgB;IAChB,aAAa,CAAC,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC;GAClB,qBAAqB,CA+F1C","sourcesContent":["import { LitElement, nothing, type TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport { addAriaTarget } from '#internals/controllers/aria-projection.js';\nimport type { SlotController } from '#internals/controllers/slot.js';\nimport { blazorDeepImport } from '#internals/decorators/blazorDeepImport.js';\nimport { shadowOptions } from '#internals/decorators/shadow-options.js';\nimport type { Constructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { FormAssociatedRequiredMixin } from '#internals/mixins/forms/associated-required.js';\nimport {\n  nextInputId,\n  renderInputShell,\n  resolveInputPartNames,\n} from '#internals/templates/input-shell.js';\nimport type { ThemingController } from '#theming/theming-controller.js';\n\nexport interface IgcInputComponentEventMap {\n  /* alternateName: inputOcurred */\n  igcInput: CustomEvent<string>;\n  /* blazorSuppress */\n  igcChange: CustomEvent<string>;\n  // For analyzer meta only:\n  /* skipWCPrefix */\n  focus: FocusEvent;\n  /* skipWCPrefix */\n  blur: FocusEvent;\n}\n\n/* blazorIndirectRender */\n/* blazorSupportsVisualChildren */\n/* omitModule */\n@blazorDeepImport\n@shadowOptions({ delegatesFocus: true })\nexport abstract class IgcInputBaseComponent extends FormAssociatedRequiredMixin(\n  EventEmitterMixin<IgcInputComponentEventMap, Constructor<LitElement>>(\n    LitElement\n  )\n) {\n  protected abstract readonly _themes: ThemingController;\n  protected abstract readonly _slots: SlotController<any>;\n\n  protected readonly _inputId = nextInputId();\n\n  @query('input')\n  protected readonly _input?: HTMLInputElement;\n\n  /**\n   * Receives ARIA semantics projected by a composite host (e.g. `igc-select`)\n   * onto the inner native input. See {@link addAriaTarget}.\n   */\n  protected readonly _ariaTarget = addAriaTarget(this, {\n    labels: () => this._internals.labels,\n    description: () =>\n      this._slots.hasAssignedElements('helper-text')\n        ? this.renderRoot.querySelector('#helper-text')\n        : null,\n  });\n\n  /* blazorSuppress */\n  /** The value of the control. */\n  public abstract value: string;\n\n  /**\n   * Whether the control will have outlined appearance.\n   *\n   * @attr\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public outlined = false;\n\n  /**\n   * The placeholder text of the control.\n   * @attr\n   */\n  @property()\n  public placeholder!: string;\n\n  /**\n   * The label for the control.\n   * @attr\n   */\n  @property()\n  public label!: string;\n\n  /**\n   * Resolves the part names for the container based on the current state.\n   * Used to apply conditional styling via CSS parts.\n   */\n  protected _resolvePartNames(base: string) {\n    return resolveInputPartNames(this._slots, base, !!this.value);\n  }\n\n  /** Selects all the text inside the input. */\n  public select(): void {\n    this._input?.select();\n  }\n\n  /* alternateName: focusComponent */\n  /** Sets focus on the control. */\n  public override focus(options?: FocusOptions): void {\n    this._input?.focus(options);\n  }\n\n  /* alternateName: blurComponent */\n  /** Removes focus from the control. */\n  public override blur(): void {\n    this._input?.blur();\n  }\n\n  protected abstract _renderInput(): TemplateResult;\n\n  protected _renderFileParts(): TemplateResult | typeof nothing {\n    return nothing;\n  }\n\n  protected override render() {\n    return cache(\n      renderInputShell(this, {\n        theme: this._themes.theme,\n        label: this.label,\n        labelId: this._inputId,\n        containerParts: this._resolvePartNames('container'),\n        renderInput: this._renderInput,\n        renderFileParts: this._renderFileParts,\n      })\n    );\n  }\n}\n"]}

package/components/input/input.d.ts

@@ -1,6 +1,9 @@
 import type { InputType, RangeTextSelectMode, SelectionRangeDirection } from '../types.js';
 import { IgcInputBaseComponent } from './input-base.js';
 /**
+ * A highly customizable single-line text field for entering and editing data,
+ * with support for prefix/suffix content, helper text, form integration, and built-in validation.
+ *
  * @element igc-input
  *
  * @slot prefix - Renders content before the input.
@@ -30,17 +33,13 @@ import { IgcInputBaseComponent } from './input-base.js';
 export default class IgcInputComponent extends IgcInputBaseComponent {
     static readonly tagName = "igc-input";
     static styles: import("lit").CSSResult[];
+    /** Shared config for the constraint properties - a change revalidates. */
+    private static readonly _revalidate;
     static register(): void;
-    protected readonly _themes: import("../../theming/theming-controller.js").ThemingController;
-    protected readonly _slots: import("../common/controllers/slot.js").SlotController<"invalid" | "prefix" | "[default]" | "helper-text" | "suffix" | "value-missing" | "custom-error" | "too-long" | "too-short" | "type-mismatch" | "pattern-mismatch" | "range-overflow" | "range-underflow" | "step-mismatch">;
-    protected readonly _formValue: import("../common/mixins/forms/form-value.js").FormValue<string>;
-    protected get __validators(): import("../common/validators.js").Validator<IgcInputComponent>[];
-    private _min?;
-    private _max?;
-    private _minLength?;
-    private _maxLength?;
-    private _pattern?;
-    private _step?;
+    protected readonly _themes: import("#theming/theming-controller.js").ThemingController;
+    protected readonly _slots: import("#internals/controllers/slot.js").SlotController<"invalid" | "prefix" | "helper-text" | "[default]" | "suffix" | "value-missing" | "too-long" | "too-short" | "custom-error" | "range-overflow" | "range-underflow" | "type-mismatch" | "pattern-mismatch" | "step-mismatch">;
+    protected readonly _formValue: import("#internals/mixins/forms/form-value.js").FormValue<string>;
+    protected get __validators(): import("../../internals/validators.js").Validator<IgcInputComponent>[];
     /**
      * The value of the control.
      * @attr
@@ -48,7 +47,7 @@ export default class IgcInputComponent extends IgcInputBaseComponent {
     set value(value: string);
     get value(): string;
     /**
-     * The type attribute of the control.
+     * The type of the control.
      * @attr
      */
     type: InputType;
@@ -60,54 +59,48 @@ export default class IgcInputComponent extends IgcInputBaseComponent {
      */
     readOnly: boolean;
     /**
-     * The input mode attribute of the control.
+     * A hint to the browser for which virtual keyboard layout to display.
      * See [relevant MDN article](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode)
      * @attr inputmode
      */
     inputMode: string;
     /**
-     * The pattern attribute of the control.
+     * The regular expression the value is validated against.
      * @attr
      */
-    set pattern(value: string | undefined);
-    get pattern(): string | undefined;
+    pattern?: string;
     /**
      * The minimum string length required by the control.
      * @attr minlength
      */
-    set minLength(value: number | undefined);
-    get minLength(): number | undefined;
+    minLength?: number;
     /**
      * The maximum string length of the control.
      * @attr maxlength
      */
-    set maxLength(value: number | undefined);
-    get maxLength(): number | undefined;
+    maxLength?: number;
     /**
-     * The min attribute of the control.
+     * The minimum value the control accepts.
      * @attr
      */
-    set min(value: number | undefined);
-    get min(): number | undefined;
+    min?: number;
     /**
-     * The max attribute of the control.
+     * The maximum value the control accepts.
      * @attr
      */
-    set max(value: number | undefined);
-    get max(): number | undefined;
+    max?: number;
     /**
-     * The step attribute of the control.
+     * The granularity the value must adhere to.
      * @attr
      */
-    set step(value: number | undefined);
-    get step(): number | undefined;
+    step?: number;
     /**
-     * The autofocus attribute of the control.
+     * Whether the control should receive focus automatically.
      * @attr
      */
     autofocus: boolean;
     /**
-     * The autocomplete attribute of the control.
+     * A hint for the browser on how to autofill the control.
      * @attr
      */
     autocomplete: string;

package/components/input/input.js

@@ -8,12 +8,14 @@ import { html } from 'lit';
 import { property } from 'lit/decorators.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { live } from 'lit/directives/live.js';
-import { addThemingController } from '../../theming/theming-controller.js';
-import { addSlotController, setSlots } from '../common/controllers/slot.js';
-import { registerComponent } from '../common/definitions/register.js';
-import { createFormValueState } from '../common/mixins/forms/form-value.js';
-import { partMap } from '../common/part-map.js';
-import { bindIf } from '../common/util.js';
+import { ariaBindings } from '#internals/controllers/aria-projection.js';
+import { addSlotController, setSlots } from '#internals/controllers/slot.js';
+import { coercedProperty, } from '#internals/decorators/coerced-property.js';
+import { registerComponent } from '#internals/definitions/register.js';
+import { createFormValueState } from '#internals/mixins/forms/form-value.js';
+import { partMap } from '#internals/part-map.js';
+import { bindIf } from '#internals/utils/lit.js';
+import { addThemingController } from '#theming/theming-controller.js';
 import IgcValidationContainerComponent from '../validation-container/validation-container.js';
 import { IgcInputBaseComponent } from './input-base.js';
 import { styles } from './themes/input.base.css.js';
@@ -33,10 +35,19 @@ export default class IgcInputComponent extends IgcInputBaseComponent {
         });
         this.type = 'text';
         this.readOnly = false;
+        this.pattern = undefined;
+        this.minLength = undefined;
+        this.maxLength = undefined;
+        this.min = undefined;
+        this.max = undefined;
+        this.step = undefined;
         this.validateOnly = false;
     }
     static { this.tagName = 'igc-input'; }
     static { this.styles = [styles, shared]; }
+    static { this._revalidate = {
+        onChange: ({ host }) => host._validate(),
+    }; }
     static register() {
         registerComponent(IgcInputComponent, IgcValidationContainerComponent);
     }
@@ -49,48 +60,6 @@ export default class IgcInputComponent extends IgcInputBaseComponent {
     get value() {
         return this._formValue.value;
     }
-    set pattern(value) {
-        this._pattern = value;
-        this._validate();
-    }
-    get pattern() {
-        return this._pattern;
-    }
-    set minLength(value) {
-        this._minLength = value;
-        this._validate();
-    }
-    get minLength() {
-        return this._minLength;
-    }
-    set maxLength(value) {
-        this._maxLength = value;
-        this._validate();
-    }
-    get maxLength() {
-        return this._maxLength;
-    }
-    set min(value) {
-        this._min = value;
-        this._validate();
-    }
-    get min() {
-        return this._min;
-    }
-    set max(value) {
-        this._max = value;
-        this._validate();
-    }
-    get max() {
-        return this._max;
-    }
-    set step(value) {
-        this._step = value;
-        this._validate();
-    }
-    get step() {
-        return this._step;
-    }
     setRangeText(replacement, start, end, selectMode = 'preserve') {
         this._input?.setRangeText(replacement, start, end, selectMode);
         this.value = this._input?.value ?? '';
@@ -107,20 +76,16 @@ export default class IgcInputComponent extends IgcInputBaseComponent {
         this.value = this._input?.value ?? '';
     }
     _handleInput() {
-        this._setTouchedState();
-        this.value = this._input?.value ?? '';
-        this.emitEvent('igcInput', { detail: this.value });
+        this._commitValue(this._input?.value ?? '', 'igcInput');
     }
     _handleChange() {
-        this._setTouchedState();
-        this.value = this._input?.value ?? '';
-        this.emitEvent('igcChange', { detail: this.value });
+        this._commitValue(this._input?.value ?? '', 'igcChange');
     }
     _renderInput() {
         const hasNegativeTabIndex = this.getAttribute('tabindex') === '-1';
-        const hasHelperText = this._slots.hasAssignedElements('helper-text');
         return html `
       <input
+        ${ariaBindings(this._ariaTarget.resolveBindings())}
         id=${this._inputId}
         part=${partMap(this._resolvePartNames('input'))}
         name=${ifDefined(this.name)}
@@ -140,8 +105,6 @@ export default class IgcInputComponent extends IgcInputBaseComponent {
         minlength=${ifDefined(this.minLength)}
         maxlength=${bindIf(!this.validateOnly, this.maxLength)}
         step=${ifDefined(this.step)}
-        .ariaLabelledByElements=${this._resolvedLabelElements}
-        aria-describedby=${bindIf(hasHelperText, 'helper-text')}
         @keydown=${this._handleEnterKeydown}
         @change=${this._handleChange}
         @input=${this._handleInput}
@@ -163,23 +126,29 @@ __decorate([
     property({ attribute: 'inputmode' })
 ], IgcInputComponent.prototype, "inputMode", void 0);
 __decorate([
-    property()
-], IgcInputComponent.prototype, "pattern", null);
+    property(),
+    coercedProperty(IgcInputComponent._revalidate)
+], IgcInputComponent.prototype, "pattern", void 0);
 __decorate([
-    property({ type: Number, attribute: 'minlength' })
-], IgcInputComponent.prototype, "minLength", null);
+    property({ type: Number, attribute: 'minlength' }),
+    coercedProperty(IgcInputComponent._revalidate)
+], IgcInputComponent.prototype, "minLength", void 0);
 __decorate([
-    property({ type: Number, attribute: 'maxlength' })
-], IgcInputComponent.prototype, "maxLength", null);
+    property({ type: Number, attribute: 'maxlength' }),
+    coercedProperty(IgcInputComponent._revalidate)
+], IgcInputComponent.prototype, "maxLength", void 0);
 __decorate([
-    property({ type: Number })
-], IgcInputComponent.prototype, "min", null);
+    property({ type: Number }),
+    coercedProperty(IgcInputComponent._revalidate)
+], IgcInputComponent.prototype, "min", void 0);
 __decorate([
-    property({ type: Number })
-], IgcInputComponent.prototype, "max", null);
+    property({ type: Number }),
+    coercedProperty(IgcInputComponent._revalidate)
+], IgcInputComponent.prototype, "max", void 0);
 __decorate([
-    property({ type: Number })
-], IgcInputComponent.prototype, "step", null);
+    property({ type: Number }),
+    coercedProperty(IgcInputComponent._revalidate)
+], IgcInputComponent.prototype, "step", void 0);
 __decorate([
     property({ type: Boolean })
 ], IgcInputComponent.prototype, "autofocus", void 0);

package/components/input/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.js","sourceRoot":"","sources":["../../../src/components/input/input.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport { addSlotController, setSlots } from '../common/controllers/slot.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { createFormValueState } from '../common/mixins/forms/form-value.js';\nimport { partMap } from '../common/part-map.js';\nimport { bindIf } from '../common/util.js';\nimport type {\n  InputType,\n  RangeTextSelectMode,\n  SelectionRangeDirection,\n} from '../types.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\nimport { IgcInputBaseComponent } from './input-base.js';\nimport { styles } from './themes/input.base.css.js';\nimport { styles as shared } from './themes/shared/input.common.css.js';\nimport { all } from './themes/themes.js';\nimport { numberValidators, stringValidators } from './validators.js';\n\nconst Slots = setSlots(\n  'prefix',\n  'suffix',\n  'helper-text',\n  'value-missing',\n  'type-mismatch',\n  'pattern-mismatch',\n  'too-long',\n  'too-short',\n  'range-overflow',\n  'range-underflow',\n  'step-mismatch',\n  'custom-error',\n  'invalid'\n);\n\n/**\n * @element igc-input\n *\n * @slot prefix - Renders content before the input.\n * @slot suffix - Renders content after input.\n * @slot helper-text - Renders content below the input.\n * @slot value-missing - Renders content when the required validation fails.\n * @slot type-mismatch - Renders content when the a type url/email input pattern validation fails.\n * @slot pattern-mismatch - Renders content when the pattern validation fails.\n * @slot too-long - Renders content when the maxlength validation fails.\n * @slot too-short - Renders content when the minlength validation fails.\n * @slot range-overflow - Renders content when the max validation fails.\n * @slot range-underflow - Renders content when the min validation fails.\n * @slot step-mismatch - Renders content when the step validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n *\n * @fires igcInput - Emitted when the control input receives user input.\n * @fires igcChange - Emitted when the control's checked state changes.\n *\n * @csspart container - The main wrapper that holds all main input elements.\n * @csspart input - The native input element.\n * @csspart label - The native label element.\n * @csspart prefix - The prefix wrapper.\n * @csspart suffix - The suffix wrapper.\n * @csspart helper-text - The helper text wrapper.\n */\nexport default class IgcInputComponent extends IgcInputBaseComponent {\n  public static readonly tagName = 'igc-input';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcInputComponent, IgcValidationContainerComponent);\n  }\n\n  protected override readonly _themes = addThemingController(this, all);\n\n  protected override readonly _slots = addSlotController(this, {\n    slots: Slots,\n  });\n\n  protected override readonly _formValue = createFormValueState(this, {\n    initialValue: '',\n  });\n\n  protected override get __validators() {\n    return this.type !== 'number' ? stringValidators : numberValidators;\n  }\n\n  private _min?: number;\n  private _max?: number;\n  private _minLength?: number;\n  private _maxLength?: number;\n  private _pattern?: string;\n  private _step?: number;\n\n  /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n  /**\n   * The value of the control.\n   * @attr\n   */\n  @property()\n  public set value(value: string) {\n    this._formValue.setValueAndFormState(value);\n  }\n\n  public get value(): string {\n    return this._formValue.value;\n  }\n\n  /* alternateName: displayType */\n  /**\n   * The type attribute of the control.\n   * @attr\n   */\n  @property({ reflect: true })\n  public type: InputType = 'text';\n\n  /**\n   * Makes the control a readonly field.\n   *\n   * @attr readonly\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public readOnly = false;\n\n  /**\n   * The input mode attribute of the control.\n   * See [relevant MDN article](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode)\n   * @attr inputmode\n   */\n  @property({ attribute: 'inputmode' })\n  public override inputMode!: string;\n\n  /**\n   * The pattern attribute of the control.\n   * @attr\n   */\n  @property()\n  public set pattern(value: string | undefined) {\n    this._pattern = value;\n    this._validate();\n  }\n\n  public get pattern(): string | undefined {\n    return this._pattern;\n  }\n\n  /**\n   * The minimum string length required by the control.\n   * @attr minlength\n   */\n  @property({ type: Number, attribute: 'minlength' })\n  public set minLength(value: number | undefined) {\n    this._minLength = value;\n    this._validate();\n  }\n\n  public get minLength(): number | undefined {\n    return this._minLength;\n  }\n\n  /**\n   * The maximum string length of the control.\n   * @attr maxlength\n   */\n  @property({ type: Number, attribute: 'maxlength' })\n  public set maxLength(value: number | undefined) {\n    this._maxLength = value;\n    this._validate();\n  }\n\n  public get maxLength(): number | undefined {\n    return this._maxLength;\n  }\n\n  /**\n   * The min attribute of the control.\n   * @attr\n   */\n  @property({ type: Number })\n  public set min(value: number | undefined) {\n    this._min = value;\n    this._validate();\n  }\n\n  public get min(): number | undefined {\n    return this._min;\n  }\n\n  /**\n   * The max attribute of the control.\n   * @attr\n   */\n  @property({ type: Number })\n  public set max(value: number | undefined) {\n    this._max = value;\n    this._validate();\n  }\n\n  public get max(): number | undefined {\n    return this._max;\n  }\n\n  /**\n   * The step attribute of the control.\n   * @attr\n   */\n  @property({ type: Number })\n  public set step(value: number | undefined) {\n    this._step = value;\n    this._validate();\n  }\n\n  public get step(): number | undefined {\n    return this._step;\n  }\n\n  /**\n   * The autofocus attribute of the control.\n   * @attr\n   */\n  @property({ type: Boolean })\n  public override autofocus!: boolean;\n\n  /**\n   * The autocomplete attribute of the control.\n   * @attr\n   */\n  @property()\n  public autocomplete!: string;\n\n  /**\n   * Enables validation rules to be evaluated without restricting user input. This applies to the `maxLength` property for\n   * string-type inputs or allows spin buttons to exceed the predefined `min/max` limits for number-type inputs.\n   *\n   * @attr validate-only\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'validate-only' })\n  public validateOnly = false;\n\n  /* blazorSuppress */\n  /** Replaces the selected text in the input. */\n  public setRangeText(\n    replacement: string,\n    start?: number,\n    end?: number,\n    selectMode: RangeTextSelectMode = 'preserve'\n  ): void {\n    this._input?.setRangeText(replacement, start!, end!, selectMode);\n    this.value = this._input?.value ?? '';\n  }\n\n  /* blazorSuppress */\n  /** Sets the text selection range of the control */\n  public setSelectionRange(\n    start?: number,\n    end?: number,\n    direction: SelectionRangeDirection = 'none'\n  ): void {\n    this._input?.setSelectionRange(start ?? null, end ?? null, direction);\n  }\n\n  /** Increments the numeric value of the input by one or more steps. */\n  public stepUp(n?: number): void {\n    this._input?.stepUp(n);\n    this.value = this._input?.value ?? '';\n  }\n\n  /** Decrements the numeric value of the input by one or more steps. */\n  public stepDown(n?: number): void {\n    this._input?.stepDown(n);\n    this.value = this._input?.value ?? '';\n  }\n\n  private _handleInput(): void {\n    this._setTouchedState();\n    this.value = this._input?.value ?? '';\n    this.emitEvent('igcInput', { detail: this.value });\n  }\n\n  private _handleChange(): void {\n    this._setTouchedState();\n    this.value = this._input?.value ?? '';\n    this.emitEvent('igcChange', { detail: this.value });\n  }\n\n  protected _renderInput() {\n    const hasNegativeTabIndex = this.getAttribute('tabindex') === '-1';\n    const hasHelperText = this._slots.hasAssignedElements('helper-text');\n\n    return html`\n      <input\n        id=${this._inputId}\n        part=${partMap(this._resolvePartNames('input'))}\n        name=${ifDefined(this.name)}\n        type=${ifDefined(this.type)}\n        pattern=${ifDefined(this.pattern)}\n        placeholder=${ifDefined(this.placeholder)}\n        .value=${live(this.value)}\n        ?readonly=${this.readOnly}\n        ?disabled=${this.disabled}\n        ?required=${this.required}\n        ?autofocus=${this.autofocus}\n        tabindex=${bindIf(hasNegativeTabIndex, -1)}\n        autocomplete=${ifDefined(this.autocomplete as any)}\n        inputmode=${ifDefined(this.inputMode)}\n        min=${bindIf(!this.validateOnly, this.min)}\n        max=${bindIf(!this.validateOnly, this.max)}\n        minlength=${ifDefined(this.minLength)}\n        maxlength=${bindIf(!this.validateOnly, this.maxLength)}\n        step=${ifDefined(this.step)}\n        .ariaLabelledByElements=${this._resolvedLabelElements}\n        aria-describedby=${bindIf(hasHelperText, 'helper-text')}\n        @keydown=${this._handleEnterKeydown}\n        @change=${this._handleChange}\n        @input=${this._handleInput}\n        @blur=${this._handleBlur}\n      />\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-input': IgcInputComponent;\n  }\n}\n"]}
+{"version":3,"file":"input.js","sourceRoot":"","sources":["../../../src/components/input/input.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { ariaBindings } from '#internals/controllers/aria-projection.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport {\n  coercedProperty,\n  type CoercedPropertyConfig,\n} from '#internals/decorators/coerced-property.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { createFormValueState } from '#internals/mixins/forms/form-value.js';\nimport { partMap } from '#internals/part-map.js';\nimport { bindIf } from '#internals/utils/lit.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport type {\n  InputType,\n  RangeTextSelectMode,\n  SelectionRangeDirection,\n} from '../types.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\nimport { IgcInputBaseComponent } from './input-base.js';\nimport { styles } from './themes/input.base.css.js';\nimport { styles as shared } from './themes/shared/input.common.css.js';\nimport { all } from './themes/themes.js';\nimport { numberValidators, stringValidators } from './validators.js';\n\nconst Slots = setSlots(\n  'prefix',\n  'suffix',\n  'helper-text',\n  'value-missing',\n  'type-mismatch',\n  'pattern-mismatch',\n  'too-long',\n  'too-short',\n  'range-overflow',\n  'range-underflow',\n  'step-mismatch',\n  'custom-error',\n  'invalid'\n);\n\n/**\n * A highly customizable single-line text field for entering and editing data,\n * with support for prefix/suffix content, helper text, form integration, and built-in validation.\n *\n * @element igc-input\n *\n * @slot prefix - Renders content before the input.\n * @slot suffix - Renders content after input.\n * @slot helper-text - Renders content below the input.\n * @slot value-missing - Renders content when the required validation fails.\n * @slot type-mismatch - Renders content when the a type url/email input pattern validation fails.\n * @slot pattern-mismatch - Renders content when the pattern validation fails.\n * @slot too-long - Renders content when the maxlength validation fails.\n * @slot too-short - Renders content when the minlength validation fails.\n * @slot range-overflow - Renders content when the max validation fails.\n * @slot range-underflow - Renders content when the min validation fails.\n * @slot step-mismatch - Renders content when the step validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n *\n * @fires igcInput - Emitted when the control input receives user input.\n * @fires igcChange - Emitted when the control's checked state changes.\n *\n * @csspart container - The main wrapper that holds all main input elements.\n * @csspart input - The native input element.\n * @csspart label - The native label element.\n * @csspart prefix - The prefix wrapper.\n * @csspart suffix - The suffix wrapper.\n * @csspart helper-text - The helper text wrapper.\n */\nexport default class IgcInputComponent extends IgcInputBaseComponent {\n  public static readonly tagName = 'igc-input';\n  public static styles = [styles, shared];\n\n  /** Shared config for the constraint properties - a change revalidates. */\n  private static readonly _revalidate: CoercedPropertyConfig<\n    unknown,\n    IgcInputComponent\n  > = {\n    onChange: ({ host }) => host._validate(),\n  };\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcInputComponent, IgcValidationContainerComponent);\n  }\n\n  protected override readonly _themes = addThemingController(this, all);\n\n  protected override readonly _slots = addSlotController(this, {\n    slots: Slots,\n  });\n\n  protected override readonly _formValue = createFormValueState(this, {\n    initialValue: '',\n  });\n\n  protected override get __validators() {\n    return this.type !== 'number' ? stringValidators : numberValidators;\n  }\n\n  /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n  /**\n   * The value of the control.\n   * @attr\n   */\n  @property()\n  public set value(value: string) {\n    this._formValue.setValueAndFormState(value);\n  }\n\n  public get value(): string {\n    return this._formValue.value;\n  }\n\n  /* alternateName: displayType */\n  /**\n   * The type of the control.\n   * @attr\n   */\n  @property({ reflect: true })\n  public type: InputType = 'text';\n\n  /**\n   * Makes the control a readonly field.\n   *\n   * @attr readonly\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public readOnly = false;\n\n  /**\n   * A hint to the browser for which virtual keyboard layout to display.\n   * See [relevant MDN article](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode)\n   * @attr inputmode\n   */\n  @property({ attribute: 'inputmode' })\n  public override inputMode!: string;\n\n  /**\n   * The regular expression the value is validated against.\n   * @attr\n   */\n  @property()\n  @coercedProperty(IgcInputComponent._revalidate)\n  public pattern?: string = undefined;\n\n  /**\n   * The minimum string length required by the control.\n   * @attr minlength\n   */\n  @property({ type: Number, attribute: 'minlength' })\n  @coercedProperty(IgcInputComponent._revalidate)\n  public minLength?: number = undefined;\n\n  /**\n   * The maximum string length of the control.\n   * @attr maxlength\n   */\n  @property({ type: Number, attribute: 'maxlength' })\n  @coercedProperty(IgcInputComponent._revalidate)\n  public maxLength?: number = undefined;\n\n  /**\n   * The minimum value the control accepts.\n   * @attr\n   */\n  @property({ type: Number })\n  @coercedProperty(IgcInputComponent._revalidate)\n  public min?: number = undefined;\n\n  /**\n   * The maximum value the control accepts.\n   * @attr\n   */\n  @property({ type: Number })\n  @coercedProperty(IgcInputComponent._revalidate)\n  public max?: number = undefined;\n\n  /**\n   * The granularity the value must adhere to.\n   * @attr\n   */\n  @property({ type: Number })\n  @coercedProperty(IgcInputComponent._revalidate)\n  public step?: number = undefined;\n\n  /**\n   * Whether the control should receive focus automatically.\n   * @attr\n   */\n  @property({ type: Boolean })\n  public override autofocus!: boolean;\n\n  /**\n   * A hint for the browser on how to autofill the control.\n   * @attr\n   */\n  @property()\n  public autocomplete!: string;\n\n  /**\n   * Enables validation rules to be evaluated without restricting user input. This applies to the `maxLength` property for\n   * string-type inputs or allows spin buttons to exceed the predefined `min/max` limits for number-type inputs.\n   *\n   * @attr validate-only\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'validate-only' })\n  public validateOnly = false;\n\n  /* blazorSuppress */\n  /** Replaces the selected text in the input. */\n  public setRangeText(\n    replacement: string,\n    start?: number,\n    end?: number,\n    selectMode: RangeTextSelectMode = 'preserve'\n  ): void {\n    this._input?.setRangeText(replacement, start!, end!, selectMode);\n    this.value = this._input?.value ?? '';\n  }\n\n  /* blazorSuppress */\n  /** Sets the text selection range of the control */\n  public setSelectionRange(\n    start?: number,\n    end?: number,\n    direction: SelectionRangeDirection = 'none'\n  ): void {\n    this._input?.setSelectionRange(start ?? null, end ?? null, direction);\n  }\n\n  /** Increments the numeric value of the input by one or more steps. */\n  public stepUp(n?: number): void {\n    this._input?.stepUp(n);\n    this.value = this._input?.value ?? '';\n  }\n\n  /** Decrements the numeric value of the input by one or more steps. */\n  public stepDown(n?: number): void {\n    this._input?.stepDown(n);\n    this.value = this._input?.value ?? '';\n  }\n\n  private _handleInput(): void {\n    this._commitValue(this._input?.value ?? '', 'igcInput');\n  }\n\n  private _handleChange(): void {\n    this._commitValue(this._input?.value ?? '', 'igcChange');\n  }\n\n  protected _renderInput() {\n    const hasNegativeTabIndex = this.getAttribute('tabindex') === '-1';\n\n    return html`\n      <input\n        ${ariaBindings(this._ariaTarget.resolveBindings())}\n        id=${this._inputId}\n        part=${partMap(this._resolvePartNames('input'))}\n        name=${ifDefined(this.name)}\n        type=${ifDefined(this.type)}\n        pattern=${ifDefined(this.pattern)}\n        placeholder=${ifDefined(this.placeholder)}\n        .value=${live(this.value)}\n        ?readonly=${this.readOnly}\n        ?disabled=${this.disabled}\n        ?required=${this.required}\n        ?autofocus=${this.autofocus}\n        tabindex=${bindIf(hasNegativeTabIndex, -1)}\n        autocomplete=${ifDefined(this.autocomplete as any)}\n        inputmode=${ifDefined(this.inputMode)}\n        min=${bindIf(!this.validateOnly, this.min)}\n        max=${bindIf(!this.validateOnly, this.max)}\n        minlength=${ifDefined(this.minLength)}\n        maxlength=${bindIf(!this.validateOnly, this.maxLength)}\n        step=${ifDefined(this.step)}\n        @keydown=${this._handleEnterKeydown}\n        @change=${this._handleChange}\n        @input=${this._handleInput}\n        @blur=${this._handleBlur}\n      />\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-input': IgcInputComponent;\n  }\n}\n"]}

package/components/input/themes/input.base.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}[part~=suffixed] [part=suffix],[part~=prefixed] [part=prefix]{display:flex;align-items:center}:host{position:relative;display:block;font-family:var(--ig-font-family);outline-style:none}:host ::part(helper-text){font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);display:-webkit-inline-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}:host slot[name=value-missing]{display:-webkit-inline-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}::slotted(igc-icon){--component-size: var(--input-size) !important}[part=label]{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}[part~=input]{width:100%;border:none;outline-style:none;font-family:var(--ig-font-family);z-index:1}[part~=input]:is(:-webkit-autofill,:-webkit-autofill){-webkit-transition-property:background-color,color !important;transition-property:background-color,color !important;transition-delay:99999s !important}[part~=input]:is(:-webkit-autofill,:autofill){-webkit-transition-property:background-color,color !important;transition-property:background-color,color !important;transition-delay:99999s !important}[part^=container]{position:relative;display:grid}[part=prefix],[part=suffix]{display:none;overflow:hidden}:host([required]) [part=label]::after{content:"*"}:host([disabled]){pointer-events:none}`;
+export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}[part~=suffixed] [part=suffix],[part~=prefixed] [part=prefix]{display:flex;align-items:center}:host{position:relative;display:block;font-family:var(--ig-font-family);outline-style:none}:host ::part(helper-text){font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);display:-webkit-inline-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}:host slot[name=value-missing]{display:-webkit-inline-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}::slotted(igc-icon){--component-size: var(--input-size) !important}[part=label]{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}[part~=input]{width:100%;border:none;outline-style:none;font-family:var(--ig-font-family);z-index:1}[part~=input]:is(:-webkit-autofill,:-webkit-autofill){-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:var(--input-text-color, currentcolor)}[part~=input]:is(:-webkit-autofill,:autofill){-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:var(--input-text-color, currentcolor)}[part^=container]{position:relative;display:grid}[part=prefix],[part=suffix]{display:none;overflow:hidden}:host([required]) [part=label]::after{content:"*"}:host([disabled]){pointer-events:none}`;
 //# sourceMappingURL=input.base.css.js.map