npm - igniteui-webcomponents - Versions diffs - 7.1.2 → 7.2.0 - Mend

igniteui-webcomponents 7.1.2 → 7.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (187) hide show

package/components/common/mixins/forms/associated.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"associated.js","sourceRoot":"","sources":["../../../../../src/components/common/mixins/forms/associated.ts"],"names":[],"mappings":"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","sourcesContent":["import type { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { addInternalsController } from '../../controllers/internals.js';\nimport { addSafeEventListener, isFunction, isString } from '../../util.js';\nimport type { Validator } from '../../validators.js';\nimport type { Constructor } from '../constructor.js';\nimport type { FormValue } from './form-value.js';\nimport {\n type FormAssociatedCheckboxElementInterface,\n type FormAssociatedElementInterface,\n type FormRestoreMode,\n type FormValueType,\n InternalInvalidEvent,\n InternalResetEvent,\n} from './types.js';\n\nconst INVALID_STATE = 'ig-invalid';\n\nconst eventOptions = {\n bubbles: false,\n composed: false,\n};\n\nfunction emitFormInvalidEvent(host: LitElement): void {\n host.dispatchEvent(new CustomEvent(InternalInvalidEvent, eventOptions));\n}\n\nfunction emitFormResetEvent(host: LitElement): void {\n host.dispatchEvent(new CustomEvent(InternalResetEvent, eventOptions));\n}\n\nfunction BaseFormAssociated<T extends Constructor<LitElement>>(base: T) {\n class BaseFormAssociatedElement extends base {\n public static readonly formAssociated = true;\n\n //#region Internal state and properties\n\n private readonly __internals = addInternalsController(this);\n protected readonly _formValue!: FormValue<unknown>;\n\n private _isFormSubmit = false;\n private _isInternalValidation = false;\n private _touched = false;\n private _isExternalInvalid = false;\n\n private get _hasUserInteraction(): boolean {\n return this._touched \|\| this._isFormSubmit;\n }\n\n private get _shouldApplyStyles(): boolean {\n if (this._isExternalInvalid) {\n return true;\n }\n\n return (\n this._invalid && this._hasUserInteraction && !this._isInternalValidation\n );\n }\n\n protected _disabled = false;\n protected _invalid = false;\n protected _pristine = true;\n\n protected get __validators(): Validator[] {\n return [];\n }\n\n //#endregion\n\n //#region Public properties and attributes\n\n /*\n The name attribute of the control.\n * @attr\n /\n @property({ reflect: true })\n public name!: string;\n\n /\n The disabled state of the component.\n * @attr\n * @default false\n /\n @property({ type: Boolean, reflect: true })\n public set disabled(value: boolean) {\n this._disabled = value;\n this.toggleAttribute('disabled', Boolean(this._disabled));\n }\n\n public get disabled(): boolean {\n return this._disabled;\n }\n\n /\n Sets the control into invalid state (visual state only).\n * @attr\n * @default false\n /\n @property({ type: Boolean })\n public set invalid(value: boolean) {\n this._isExternalInvalid = value;\n this._setInvalidStyles();\n }\n\n public get invalid(): boolean {\n return this._isExternalInvalid \|\| this._shouldApplyStyles;\n }\n\n /* Returns the HTMLFormElement associated with this element. /\n public get form(): HTMLFormElement \| null {\n return this.__internals.form;\n }\n\n /\n Returns a ValidityState object which represents the different validity states\n * the element can be in, with respect to constraint validation.\n /\n public get validity(): ValidityState {\n return this.__internals.validity;\n }\n\n /* A string containing the validation message of this element. /\n public get validationMessage(): string {\n return this.__internals.validationMessage;\n }\n\n /\n A boolean value which returns true if the element is a submittable element\n * that is a candidate for constraint validation.\n /\n public get willValidate(): boolean {\n return this.__internals.willValidate;\n }\n //#endregion\n\n //#region Life-cycle hooks\n\n constructor(...args: any[]) {\n super(args);\n addSafeEventListener(this, 'invalid', this._handleInvalid);\n }\n\n /* @internal /\n public override connectedCallback(): void {\n super.connectedCallback();\n this._pristine = true;\n this._touched = false;\n this._validate();\n }\n\n //#endregion\n\n //#region Form value and validation states\n\n private async _handleInvalid(event: Event): Promise<void> {\n event.preventDefault();\n this._invalid = true;\n\n if (this._isInternalValidation) {\n this._isInternalValidation = false;\n } else {\n this._isFormSubmit = true;\n emitFormInvalidEvent(this);\n }\n\n this._setInvalidStyles();\n this.requestUpdate();\n\n if (this._isFormSubmit) {\n await this.updateComplete;\n this._isFormSubmit = false;\n }\n }\n\n private _setInvalidStyles(): void {\n this.__internals.setState(INVALID_STATE, this._shouldApplyStyles);\n }\n\n private __runValidators() {\n const validity: ValidityStateFlags = {};\n let message = '';\n let validationFailed = false;\n\n for (const validator of this.__validators) {\n const isValid = validator.isValid(this);\n\n validity[validator.key] = !isValid;\n\n if (!isValid) {\n validationFailed = true;\n message = isFunction(validator.message)\n ? validator.message(this)\n : validator.message;\n }\n }\n\n this._invalid = validationFailed;\n\n return { validity, message };\n }\n\n /\n Executes the component validators and updates the internal validity state.\n /\n protected _validate(userMessage?: string): void {\n let { validity, message } = this.__runValidators();\n const hasCustomError = this.validity.customError;\n\n // valueMissing has precedence over the other validators aside from customError\n if (validity.valueMissing) {\n validity = {\n valueMissing: true,\n customError: hasCustomError,\n };\n }\n\n if (hasCustomError && userMessage === undefined) {\n // Internal validation cycle after the user has called setCustomValidity()\n // with some message. Keep the customError flag and the passed in message.\n validity.customError = true;\n message = this.validationMessage;\n } else if (hasCustomError && userMessage === '') {\n // setCustomValidity with an empty message.\n validity.customError = false;\n } else if (userMessage && userMessage !== '') {\n // setCustomValidity with a message.\n validity.customError = true;\n message = userMessage;\n }\n\n this.__internals.setValidity(validity, message);\n this._isInternalValidation = true;\n this._invalid = !this.__internals.checkValidity();\n }\n\n protected _handleBlur(): void {\n this._setTouchedState();\n this._validate();\n }\n\n protected _setTouchedState(): void {\n if (!this._touched) {\n this._touched = true;\n }\n }\n\n protected _setDefaultValue(current: string \| null): void {\n this._formValue.defaultValue = current;\n }\n\n protected _restoreDefaultValue(): void {\n const value = this._formValue.value;\n this._formValue.setValueAndFormState(this._formValue.defaultValue);\n this.requestUpdate('value', value);\n }\n\n protected _setFormValue(value: FormValueType, state?: FormValueType): void {\n this._pristine = false;\n this.__internals.setFormValue(value, state);\n this._validate();\n this._setInvalidStyles();\n }\n\n //#region Form associated callback hooks\n\n protected formAssociatedCallback(_form: HTMLFormElement): void {}\n\n protected formDisabledCallback(state: boolean): void {\n this._disabled = state;\n this.requestUpdate();\n }\n\n protected formResetCallback(): void {\n this._restoreDefaultValue();\n this._pristine = true;\n this._touched = false;\n this._invalid = false;\n this._setInvalidStyles();\n emitFormResetEvent(this);\n }\n\n / c8 ignore next 4 /\n protected formStateRestoreCallback(\n _state: FormValueType,\n _mode: FormRestoreMode\n ): void {}\n\n //#endregion\n\n //#region Public API\n\n /* Checks for validity of the control and shows the browser message if it invalid. /\n public reportValidity(): boolean {\n const state = this.__internals.reportValidity();\n this._invalid = !state;\n return state;\n }\n\n /* Checks for validity of the control and emits the invalid event if it invalid. /\n public checkValidity(): boolean {\n this._isInternalValidation = true;\n const state = this.__internals.checkValidity();\n this._invalid = !state;\n return state;\n }\n\n /\n Sets a custom validation message for the control.\n * As long as `message` is not empty, the control is considered invalid.\n /\n public setCustomValidity(message: string): void {\n this._validate(message);\n this._isInternalValidation = message === '';\n this._setInvalidStyles();\n this.requestUpdate();\n }\n\n //#endregion\n }\n return BaseFormAssociatedElement as Constructor<BaseFormAssociatedElement> &\n T;\n}\n\n/\n Mixes the passed in class and turns it into a form associated custom element.\n /\nexport function FormAssociatedMixin<T extends Constructor<LitElement>>(\n base: T\n) {\n class FormAssociatedElement extends BaseFormAssociated(base) {\n / blazorCSSuppress /\n @property({ attribute: false })\n public set defaultValue(value: unknown) {\n this._formValue.defaultValue = value;\n\n if (this._pristine && 'value' in this) {\n this.value = this.defaultValue;\n this._pristine = true;\n this._validate();\n }\n }\n\n public get defaultValue(): unknown {\n return this._formValue.defaultValue;\n }\n\n public override attributeChangedCallback(\n name: string,\n prev: string \| null,\n current: string \| null\n ): void {\n super.attributeChangedCallback(name, prev, current);\n if (name === 'value') {\n this._setDefaultValue(current);\n }\n }\n }\n\n return FormAssociatedElement as unknown as Constructor<FormAssociatedElementInterface> &\n T;\n}\n\n/\n Mixes the passed in class and turns it into a form associated custom element.\n /\nexport function FormAssociatedCheckboxMixin<T extends Constructor<LitElement>>(\n base: T\n) {\n class FormAssociatedCheckboxElement extends BaseFormAssociated(base) {\n / blazorCSSuppress */\n @property({ attribute: false })\n public set defaultChecked(value: boolean) {\n this._formValue.defaultValue = value;\n\n if (this._pristine && 'checked' in this) {\n this.checked = this.defaultChecked;\n this._pristine = true;\n this._validate();\n }\n }\n\n public get defaultChecked(): boolean {\n return this._formValue.defaultValue as boolean;\n }\n\n public override attributeChangedCallback(\n name: string,\n prev: string \| null,\n current: string \| null\n ): void {\n super.attributeChangedCallback(name, prev, current);\n if (name === 'checked') {\n this._setDefaultValue(isString(current) ? 'true' : null);\n }\n }\n }\n\n return FormAssociatedCheckboxElement as unknown as Constructor<FormAssociatedCheckboxElementInterface> &\n T;\n}\n"]}
1	+ {"version":3,"file":"associated.js","sourceRoot":"","sources":["../../../../../src/components/common/mixins/forms/associated.ts"],"names":[],"mappings":"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","sourcesContent":["import type { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { addInternalsController } from '../../controllers/internals.js';\nimport { enterKey } from '../../controllers/key-bindings.js';\nimport { addSafeEventListener, isFunction, isString } from '../../util.js';\nimport type { Validator } from '../../validators.js';\nimport type { Constructor } from '../constructor.js';\nimport type { FormValue } from './form-value.js';\nimport {\n type FormAssociatedCheckboxElementInterface,\n type FormAssociatedElementInterface,\n type FormRestoreMode,\n type FormValueType,\n InternalInvalidEvent,\n InternalResetEvent,\n} from './types.js';\n\nconst INVALID_STATE = 'ig-invalid';\n\nconst eventOptions = {\n bubbles: false,\n composed: false,\n};\n\nfunction emitFormInvalidEvent(host: LitElement): void {\n host.dispatchEvent(new CustomEvent(InternalInvalidEvent, eventOptions));\n}\n\nfunction emitFormResetEvent(host: LitElement): void {\n host.dispatchEvent(new CustomEvent(InternalResetEvent, eventOptions));\n}\n\nfunction BaseFormAssociated<T extends Constructor<LitElement>>(base: T) {\n class BaseFormAssociatedElement extends base {\n public static readonly formAssociated = true;\n\n //#region Internal state and properties\n\n private readonly __internals = addInternalsController(this);\n protected readonly _formValue!: FormValue<unknown>;\n\n private _isFormSubmit = false;\n private _isInternalValidation = false;\n private _touched = false;\n private _isExternalInvalid = false;\n\n private get _hasUserInteraction(): boolean {\n return this._touched \|\| this._isFormSubmit;\n }\n\n private get _shouldApplyStyles(): boolean {\n if (this._isExternalInvalid) {\n return true;\n }\n\n return (\n this._invalid && this._hasUserInteraction && !this._isInternalValidation\n );\n }\n\n protected _disabled = false;\n protected _invalid = false;\n protected _pristine = true;\n\n protected get __validators(): Validator[] {\n return [];\n }\n\n //#endregion\n\n //#region Public properties and attributes\n\n /*\n The name attribute of the control.\n * @attr\n /\n @property({ reflect: true })\n public name!: string;\n\n /\n The disabled state of the component.\n * @attr\n * @default false\n /\n @property({ type: Boolean, reflect: true })\n public set disabled(value: boolean) {\n this._disabled = value;\n this.toggleAttribute('disabled', Boolean(this._disabled));\n }\n\n public get disabled(): boolean {\n return this._disabled;\n }\n\n /\n Sets the control into invalid state (visual state only).\n * @attr\n * @default false\n /\n @property({ type: Boolean })\n public set invalid(value: boolean) {\n this._isExternalInvalid = value;\n this._setInvalidStyles();\n }\n\n public get invalid(): boolean {\n return this._isExternalInvalid \|\| this._shouldApplyStyles;\n }\n\n /* Returns the HTMLFormElement associated with this element. /\n public get form(): HTMLFormElement \| null {\n return this.__internals.form;\n }\n\n /\n Returns a ValidityState object which represents the different validity states\n * the element can be in, with respect to constraint validation.\n /\n public get validity(): ValidityState {\n return this.__internals.validity;\n }\n\n /* A string containing the validation message of this element. /\n public get validationMessage(): string {\n return this.__internals.validationMessage;\n }\n\n /\n A boolean value which returns true if the element is a submittable element\n * that is a candidate for constraint validation.\n /\n public get willValidate(): boolean {\n return this.__internals.willValidate;\n }\n //#endregion\n\n //#region Life-cycle hooks\n\n constructor(...args: any[]) {\n super(args);\n addSafeEventListener(this, 'invalid', this._handleInvalid);\n }\n\n /* @internal /\n public override connectedCallback(): void {\n super.connectedCallback();\n this._pristine = true;\n this._touched = false;\n this._validate();\n }\n\n //#endregion\n\n //#region Enter key submission handling\n\n protected _handleEnterKeydown(event: KeyboardEvent): void {\n if (event.key !== enterKey) return;\n if (event.repeat) return;\n\n const canSubmit =\n this.form && (this.form.noValidate \|\| this.checkValidity());\n\n if (canSubmit) {\n this.form?.requestSubmit();\n }\n }\n\n //#endregion\n\n //#region Form value and validation states\n\n private async _handleInvalid(event: Event): Promise<void> {\n event.preventDefault();\n this._invalid = true;\n\n if (this._isInternalValidation) {\n this._isInternalValidation = false;\n } else {\n this._isFormSubmit = true;\n emitFormInvalidEvent(this);\n }\n\n this._setInvalidStyles();\n this.requestUpdate();\n\n if (this._isFormSubmit) {\n await this.updateComplete;\n this._isFormSubmit = false;\n }\n }\n\n private _setInvalidStyles(): void {\n this.__internals.setState(INVALID_STATE, this._shouldApplyStyles);\n }\n\n private __runValidators() {\n const validity: ValidityStateFlags = {};\n let message = '';\n let validationFailed = false;\n\n for (const validator of this.__validators) {\n const isValid = validator.isValid(this);\n\n validity[validator.key] = !isValid;\n\n if (!isValid) {\n validationFailed = true;\n message = isFunction(validator.message)\n ? validator.message(this)\n : validator.message;\n }\n }\n\n this._invalid = validationFailed;\n\n return { validity, message };\n }\n\n /\n Executes the component validators and updates the internal validity state.\n /\n protected _validate(userMessage?: string): void {\n let { validity, message } = this.__runValidators();\n const hasCustomError = this.validity.customError;\n\n // valueMissing has precedence over the other validators aside from customError\n if (validity.valueMissing) {\n validity = {\n valueMissing: true,\n customError: hasCustomError,\n };\n }\n\n if (hasCustomError && userMessage === undefined) {\n // Internal validation cycle after the user has called setCustomValidity()\n // with some message. Keep the customError flag and the passed in message.\n validity.customError = true;\n message = this.validationMessage;\n } else if (hasCustomError && userMessage === '') {\n // setCustomValidity with an empty message.\n validity.customError = false;\n } else if (userMessage && userMessage !== '') {\n // setCustomValidity with a message.\n validity.customError = true;\n message = userMessage;\n }\n\n this.__internals.setValidity(validity, message);\n this._isInternalValidation = true;\n this._invalid = !this.__internals.checkValidity();\n }\n\n protected _handleBlur(): void {\n this._setTouchedState();\n this._validate();\n }\n\n protected _setTouchedState(): void {\n if (!this._touched) {\n this._touched = true;\n }\n }\n\n protected _setDefaultValue(current: string \| null): void {\n this._formValue.defaultValue = current;\n }\n\n protected _restoreDefaultValue(): void {\n const value = this._formValue.value;\n this._formValue.setValueAndFormState(this._formValue.defaultValue);\n this.requestUpdate('value', value);\n }\n\n protected _setFormValue(value: FormValueType, state?: FormValueType): void {\n this._pristine = false;\n this.__internals.setFormValue(value, state);\n this._validate();\n this._setInvalidStyles();\n }\n\n //#region Form associated callback hooks\n\n protected formAssociatedCallback(_form: HTMLFormElement): void {}\n\n protected formDisabledCallback(state: boolean): void {\n this._disabled = state;\n this.requestUpdate();\n }\n\n protected formResetCallback(): void {\n this._restoreDefaultValue();\n this._pristine = true;\n this._touched = false;\n this._invalid = false;\n this._setInvalidStyles();\n emitFormResetEvent(this);\n }\n\n / c8 ignore next 4 /\n protected formStateRestoreCallback(\n _state: FormValueType,\n _mode: FormRestoreMode\n ): void {}\n\n //#endregion\n\n //#region Public API\n\n /* Checks for validity of the control and shows the browser message if it invalid. /\n public reportValidity(): boolean {\n const state = this.__internals.reportValidity();\n this._invalid = !state;\n return state;\n }\n\n /* Checks for validity of the control and emits the invalid event if it invalid. /\n public checkValidity(): boolean {\n this._isInternalValidation = true;\n const state = this.__internals.checkValidity();\n this._invalid = !state;\n return state;\n }\n\n /\n Sets a custom validation message for the control.\n * As long as `message` is not empty, the control is considered invalid.\n /\n public setCustomValidity(message: string): void {\n this._validate(message);\n this._isInternalValidation = message === '';\n this._setInvalidStyles();\n this.requestUpdate();\n }\n\n //#endregion\n }\n return BaseFormAssociatedElement as Constructor<BaseFormAssociatedElement> &\n T;\n}\n\n/\n Mixes the passed in class and turns it into a form associated custom element.\n /\nexport function FormAssociatedMixin<T extends Constructor<LitElement>>(\n base: T\n) {\n class FormAssociatedElement extends BaseFormAssociated(base) {\n / blazorCSSuppress /\n @property({ attribute: false })\n public set defaultValue(value: unknown) {\n this._formValue.defaultValue = value;\n\n if (this._pristine && 'value' in this) {\n this.value = this.defaultValue;\n this._pristine = true;\n this._validate();\n }\n }\n\n public get defaultValue(): unknown {\n return this._formValue.defaultValue;\n }\n\n public override attributeChangedCallback(\n name: string,\n prev: string \| null,\n current: string \| null\n ): void {\n super.attributeChangedCallback(name, prev, current);\n if (name === 'value') {\n this._setDefaultValue(current);\n }\n }\n }\n\n return FormAssociatedElement as unknown as Constructor<FormAssociatedElementInterface> &\n T;\n}\n\n/\n Mixes the passed in class and turns it into a form associated custom element.\n /\nexport function FormAssociatedCheckboxMixin<T extends Constructor<LitElement>>(\n base: T\n) {\n class FormAssociatedCheckboxElement extends BaseFormAssociated(base) {\n / blazorCSSuppress */\n @property({ attribute: false })\n public set defaultChecked(value: boolean) {\n this._formValue.defaultValue = value;\n\n if (this._pristine && 'checked' in this) {\n this.checked = this.defaultChecked;\n this._pristine = true;\n this._validate();\n }\n }\n\n public get defaultChecked(): boolean {\n return this._formValue.defaultValue as boolean;\n }\n\n public override attributeChangedCallback(\n name: string,\n prev: string \| null,\n current: string \| null\n ): void {\n super.attributeChangedCallback(name, prev, current);\n if (name === 'checked') {\n this._setDefaultValue(isString(current) ? 'true' : null);\n }\n }\n }\n\n return FormAssociatedCheckboxElement as unknown as Constructor<FormAssociatedCheckboxElementInterface> &\n T;\n}\n"]}

package/components/common/mixins/forms/form-transformers.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import type { DateRangeValue } from '../../../date-range-picker/date-range-picker.js';
+import type { DateRangeValue } from '../../../types.js';
 import type { FormValueType, IgcFormControl } from './types.js';
 export type FormValueTransformers<T> = {
     setValue: (value: T) => T;

package/components/common/mixins/forms/form-transformers.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-transformers.js","sourceRoot":"","sources":["../../../../../src/components/common/mixins/forms/form-transformers.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n convertToDate,\n convertToDateRange,\n getDateFormValue,\n} from '../../../calendar/helpers.js';\nimport type { DateRangeValue } from '../../../~~date-range-picker/date-range-picker~~.js';\nimport { asNumber } from '../../util.js';\nimport type { FormValueType, IgcFormControl } from './types.js';\n\nexport type FormValueTransformers<T> = {\n setValue: (value: T) => T;\n getValue: (value: T) => T;\n setDefaultValue: (value: T) => T;\n getDefaultValue: (value: T) => T;\n setFormValue: (value: T, host: IgcFormControl) => FormValueType;\n};\n\nexport type FormValueConfig<T> = {\n initialValue: T;\n initialDefaultValue?: T;\n transformers?: Partial<FormValueTransformers<T>>;\n};\n\n// Transformers\n\nexport const FormValueDefaultTransformers: FormValueTransformers<string> = {\n setValue: (value) => value \|\| '',\n getValue: (value) => value,\n setDefaultValue: (value) => value \|\| '',\n getDefaultValue: (value) => value,\n setFormValue: (value, _) => value \|\| null,\n};\n\nexport const FormValueBooleanTransformers: Partial<\n FormValueTransformers<boolean>\n> = {\n setValue: Boolean,\n setDefaultValue: Boolean,\n setFormValue: (checked, host) =>\n checked && 'value' in host ? (host.value as string) \|\| 'on' : null,\n};\n\nexport const FormValueNumberTransformers: Partial<\n FormValueTransformers<number>\n> = {\n setValue: asNumber,\n setDefaultValue: asNumber,\n setFormValue: (value) => value.toString(),\n};\n\nexport const FormValueDateTimeTransformers: Partial<\n FormValueTransformers<Date \| null>\n> = {\n setValue: convertToDate,\n setDefaultValue: convertToDate,\n setFormValue: getDateFormValue,\n};\n\nexport const FormValueDateRangeTransformers: Partial<\n FormValueTransformers<DateRangeValue \| null>\n> = {\n setValue: convertToDateRange,\n setDefaultValue: convertToDateRange,\n setFormValue: (value, host) => {\n if (!host.name) {\n return null;\n }\n const start = value?.start?.toISOString();\n const end = value?.end?.toISOString();\n\n const formData = new FormData();\n\n if (start) {\n formData.append(`${host.name}-start`, start);\n }\n if (end) {\n formData.append(`${host.name}-end`, end);\n }\n\n return formData;\n },\n};\n\n/* blazorSuppress */\nexport const FormValueFileListTransformers: FormValueTransformers<FileList \| null> =\n {\n setValue: (value) => value \|\| null,\n getValue: (value) => value,\n setDefaultValue: (value) => value \|\| null,\n getDefaultValue: (value) => value,\n setFormValue: (files, host) => {\n if (!(host.name && files)) {\n return null;\n }\n\n const formData = new FormData();\n for (const file of files) {\n formData.append(host.name, file);\n }\n\n return formData;\n },\n };\n\nexport const FormValueSelectTransformers: Partial<\n FormValueTransformers<string \| undefined>\n> = {\n setValue: (value) => value \|\| undefined,\n setDefaultValue: (value) => value \|\| undefined,\n};\n"]}
1	+ {"version":3,"file":"form-transformers.js","sourceRoot":"","sources":["../../../../../src/components/common/mixins/forms/form-transformers.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n convertToDate,\n convertToDateRange,\n getDateFormValue,\n} from '../../../calendar/helpers.js';\nimport type { DateRangeValue } from '../../../types.js';\nimport { asNumber } from '../../util.js';\nimport type { FormValueType, IgcFormControl } from './types.js';\n\nexport type FormValueTransformers<T> = {\n setValue: (value: T) => T;\n getValue: (value: T) => T;\n setDefaultValue: (value: T) => T;\n getDefaultValue: (value: T) => T;\n setFormValue: (value: T, host: IgcFormControl) => FormValueType;\n};\n\nexport type FormValueConfig<T> = {\n initialValue: T;\n initialDefaultValue?: T;\n transformers?: Partial<FormValueTransformers<T>>;\n};\n\n// Transformers\n\nexport const FormValueDefaultTransformers: FormValueTransformers<string> = {\n setValue: (value) => value \|\| '',\n getValue: (value) => value,\n setDefaultValue: (value) => value \|\| '',\n getDefaultValue: (value) => value,\n setFormValue: (value, _) => value \|\| null,\n};\n\nexport const FormValueBooleanTransformers: Partial<\n FormValueTransformers<boolean>\n> = {\n setValue: Boolean,\n setDefaultValue: Boolean,\n setFormValue: (checked, host) =>\n checked && 'value' in host ? (host.value as string) \|\| 'on' : null,\n};\n\nexport const FormValueNumberTransformers: Partial<\n FormValueTransformers<number>\n> = {\n setValue: asNumber,\n setDefaultValue: asNumber,\n setFormValue: (value) => value.toString(),\n};\n\nexport const FormValueDateTimeTransformers: Partial<\n FormValueTransformers<Date \| null>\n> = {\n setValue: convertToDate,\n setDefaultValue: convertToDate,\n setFormValue: getDateFormValue,\n};\n\nexport const FormValueDateRangeTransformers: Partial<\n FormValueTransformers<DateRangeValue \| null>\n> = {\n setValue: convertToDateRange,\n setDefaultValue: convertToDateRange,\n setFormValue: (value, host) => {\n if (!host.name) {\n return null;\n }\n const start = value?.start?.toISOString();\n const end = value?.end?.toISOString();\n\n const formData = new FormData();\n\n if (start) {\n formData.append(`${host.name}-start`, start);\n }\n if (end) {\n formData.append(`${host.name}-end`, end);\n }\n\n return formData;\n },\n};\n\n/* blazorSuppress */\nexport const FormValueFileListTransformers: FormValueTransformers<FileList \| null> =\n {\n setValue: (value) => value \|\| null,\n getValue: (value) => value,\n setDefaultValue: (value) => value \|\| null,\n getDefaultValue: (value) => value,\n setFormValue: (files, host) => {\n if (!(host.name && files)) {\n return null;\n }\n\n const formData = new FormData();\n for (const file of files) {\n formData.append(host.name, file);\n }\n\n return formData;\n },\n };\n\nexport const FormValueSelectTransformers: Partial<\n FormValueTransformers<string \| undefined>\n> = {\n setValue: (value) => value \|\| undefined,\n setDefaultValue: (value) => value \|\| undefined,\n};\n"]}

package/components/common/mixins/forms/types.d.ts CHANGED Viewed

@@ -42,6 +42,11 @@ declare class BaseFormAssociatedElement {
      * that is a candidate for constraint validation.
      */
     get willValidate(): boolean;
+    /**
+     * Default implementation for handling the `Enter` key press on the component.
+     * Checks if the component is inside a form and if so, submits it.
+     */
+    protected _handleEnterKeydown(event: KeyboardEvent): void;
     /**
      * Sets the **touched** state of the component and invokes {@link BaseFormAssociatedElement._validate | `_validate()`} method.
      *

package/components/common/mixins/forms/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../src/components/common/mixins/forms/types.ts"],"names":[],"mappings":"~~AAiLA~~,MAAM,CAAC,MAAM,oBAAoB,GAAG,2BAA2B,CAAC;AAChE,MAAM,CAAC,MAAM,kBAAkB,GAAG,yBAAyB,CAAC","sourcesContent":["import type { LitElement } from 'lit';\nimport type { ElementInternalsController } from '../../controllers/internals.js';\nimport type { Validator } from '../../validators.js';\n\nexport type FormRestoreMode = 'autocomplete' \| 'restore';\nexport type FormValueType = string \| File \| FormData \| null;\nexport type IgcFormControl = LitElement &\n (FormAssociatedElementInterface \| FormAssociatedCheckboxElementInterface);\n\ndeclare class BaseFormAssociatedElement {\n public static readonly formAssociated: boolean;\n\n //#region Properties\n\n private readonly __internals: ElementInternalsController;\n protected readonly _formValue: unknown;\n\n protected _pristine: boolean;\n protected _disabled: boolean;\n protected _invalid: boolean;\n\n protected get __validators(): Validator[];\n\n /*\n The disabled state of the component.\n * @attr\n * @default false\n /\n public disabled: boolean;\n\n /\n Sets the control into invalid state (visual state only).\n * @attr\n * @default false\n /\n public invalid: boolean;\n\n /\n The name attribute of the control.\n * @attr\n /\n public name: string;\n\n /* Returns the HTMLFormElement associated with this element. /\n public get form(): HTMLFormElement \| null;\n\n /\n Returns a ValidityState object which represents the different validity states\n * the element can be in, with respect to constraint validation.\n /\n public get validity(): ValidityState;\n\n /* A string containing the validation message of this element. /\n public get validationMessage(): string;\n\n /\n A boolean value which returns true if the element is a submittable element\n * that is a candidate for constraint validation.\n /\n public get willValidate(): boolean;\n\n //#endregion\n\n //#region Methods\n\n /\n Sets the touched state of the component and invokes {@link BaseFormAssociatedElement._validate \| `_validate()`} method.\n \n As the naming of the method suggests, this should be invoked either on blur or focusout, depending\n * on the DOM structure and how focus state is managed by the component.\n /\n protected _handleBlur(): void;\n\n /\n Sets the touched state of the component and DOES NOT invoke {@link BaseFormAssociatedElement._validate \| `_validate()`} method.\n \n This should be called whenever a user interaction triggers a response, usually an event, from the component in\n * regards to its value.\n /\n protected _setTouchedState(): void;\n\n /\n Sets the default value of the component.\n * Called in `attributeChangedCallback`(i.e. when the `value` attribute of the control is set).\n /\n protected _setDefaultValue(current: string \| null): void;\n\n /\n Called when the associated parent form is reset.\n /\n protected _restoreDefaultValue(): void;\n\n /\n Executes the component validators and updates the internal validity state.\n /\n protected _validate(message?: string): void;\n\n /\n Sets the component's submission value and state.\n /\n protected _setFormValue(value: FormValueType, state?: FormValueType): void;\n\n /\n Called by the browser when it associates/disassociates the component with/from a given form element.\n * Receives the form element as a parameter.\n \n @remarks\n * This is not implemented currently.\n /\n protected formAssociatedCallback(form: HTMLFormElement): void;\n\n /\n Called whenever the component or a parent `fieldset` elements are disabled.\n * Receives the current disabled state.\n /\n protected formDisabledCallback(state: boolean): void;\n\n /\n Called when the form is reset.\n * Resets the component value/checked state to the default one, internal state and validation.\n \n @remarks\n * The default implementation calls {@link BaseFormAssociatedElement._restoreDefaultValue \| `_restoreDefaultValue`}.\n * If additional customization is needed, it is better to override that method instead of this callback.\n /\n protected formResetCallback(): void;\n\n /\n Called when the browser attempts to automatically fill out the component.\n \n @remarks\n * This is not implemented currently.\n /\n protected formStateRestoreCallback(\n state: FormValueType,\n mode: FormRestoreMode\n ): void;\n\n /* Checks for validity of the control and emits the invalid event if it invalid. /\n public checkValidity(): boolean;\n\n /* Checks for validity of the control and shows the browser message if it invalid. /\n public reportValidity(): boolean;\n\n /\n Sets a custom validation message for the control.\n * As long as `message` is not empty, the control is considered invalid.\n /\n public setCustomValidity(message: string): void;\n\n //#endregion\n}\n\nexport declare class FormAssociatedElementInterface extends BaseFormAssociatedElement {\n /* The initial value of the component. /\n public set defaultValue(value: unknown);\n public get defaultValue(): unknown;\n}\n\nexport declare class FormAssociatedCheckboxElementInterface extends BaseFormAssociatedElement {\n /* The initial checked state of the component. /\n public set defaultChecked(value: boolean);\n public get defaultChecked(): boolean;\n}\n\nexport declare class FormRequiredInterface {\n protected _required: boolean;\n\n /\n When set, makes the component a required field for validation.\n * @attr\n * @default false\n */\n public set required(value: boolean);\n public get required(): boolean;\n}\n\nexport const InternalInvalidEvent = 'igc-form-internal-invalid';\nexport const InternalResetEvent = 'igc-form-internal-reset';\n"]}
1	+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../src/components/common/mixins/forms/types.ts"],"names":[],"mappings":"AAuLA,MAAM,CAAC,MAAM,oBAAoB,GAAG,2BAA2B,CAAC;AAChE,MAAM,CAAC,MAAM,kBAAkB,GAAG,yBAAyB,CAAC","sourcesContent":["import type { LitElement } from 'lit';\nimport type { ElementInternalsController } from '../../controllers/internals.js';\nimport type { Validator } from '../../validators.js';\n\nexport type FormRestoreMode = 'autocomplete' \| 'restore';\nexport type FormValueType = string \| File \| FormData \| null;\nexport type IgcFormControl = LitElement &\n (FormAssociatedElementInterface \| FormAssociatedCheckboxElementInterface);\n\ndeclare class BaseFormAssociatedElement {\n public static readonly formAssociated: boolean;\n\n //#region Properties\n\n private readonly __internals: ElementInternalsController;\n protected readonly _formValue: unknown;\n\n protected _pristine: boolean;\n protected _disabled: boolean;\n protected _invalid: boolean;\n\n protected get __validators(): Validator[];\n\n /*\n The disabled state of the component.\n * @attr\n * @default false\n /\n public disabled: boolean;\n\n /\n Sets the control into invalid state (visual state only).\n * @attr\n * @default false\n /\n public invalid: boolean;\n\n /\n The name attribute of the control.\n * @attr\n /\n public name: string;\n\n /* Returns the HTMLFormElement associated with this element. /\n public get form(): HTMLFormElement \| null;\n\n /\n Returns a ValidityState object which represents the different validity states\n * the element can be in, with respect to constraint validation.\n /\n public get validity(): ValidityState;\n\n /* A string containing the validation message of this element. /\n public get validationMessage(): string;\n\n /\n A boolean value which returns true if the element is a submittable element\n * that is a candidate for constraint validation.\n /\n public get willValidate(): boolean;\n\n //#endregion\n\n //#region Methods\n\n /\n Default implementation for handling the `Enter` key press on the component.\n * Checks if the component is inside a form and if so, submits it.\n /\n protected _handleEnterKeydown(event: KeyboardEvent): void;\n\n /\n Sets the touched state of the component and invokes {@link BaseFormAssociatedElement._validate \| `_validate()`} method.\n \n As the naming of the method suggests, this should be invoked either on blur or focusout, depending\n * on the DOM structure and how focus state is managed by the component.\n /\n protected _handleBlur(): void;\n\n /\n Sets the touched state of the component and DOES NOT invoke {@link BaseFormAssociatedElement._validate \| `_validate()`} method.\n \n This should be called whenever a user interaction triggers a response, usually an event, from the component in\n * regards to its value.\n /\n protected _setTouchedState(): void;\n\n /\n Sets the default value of the component.\n * Called in `attributeChangedCallback`(i.e. when the `value` attribute of the control is set).\n /\n protected _setDefaultValue(current: string \| null): void;\n\n /\n Called when the associated parent form is reset.\n /\n protected _restoreDefaultValue(): void;\n\n /\n Executes the component validators and updates the internal validity state.\n /\n protected _validate(message?: string): void;\n\n /\n Sets the component's submission value and state.\n /\n protected _setFormValue(value: FormValueType, state?: FormValueType): void;\n\n /\n Called by the browser when it associates/disassociates the component with/from a given form element.\n * Receives the form element as a parameter.\n \n @remarks\n * This is not implemented currently.\n /\n protected formAssociatedCallback(form: HTMLFormElement): void;\n\n /\n Called whenever the component or a parent `fieldset` elements are disabled.\n * Receives the current disabled state.\n /\n protected formDisabledCallback(state: boolean): void;\n\n /\n Called when the form is reset.\n * Resets the component value/checked state to the default one, internal state and validation.\n \n @remarks\n * The default implementation calls {@link BaseFormAssociatedElement._restoreDefaultValue \| `_restoreDefaultValue`}.\n * If additional customization is needed, it is better to override that method instead of this callback.\n /\n protected formResetCallback(): void;\n\n /\n Called when the browser attempts to automatically fill out the component.\n \n @remarks\n * This is not implemented currently.\n /\n protected formStateRestoreCallback(\n state: FormValueType,\n mode: FormRestoreMode\n ): void;\n\n /* Checks for validity of the control and emits the invalid event if it invalid. /\n public checkValidity(): boolean;\n\n /* Checks for validity of the control and shows the browser message if it invalid. /\n public reportValidity(): boolean;\n\n /\n Sets a custom validation message for the control.\n * As long as `message` is not empty, the control is considered invalid.\n /\n public setCustomValidity(message: string): void;\n\n //#endregion\n}\n\nexport declare class FormAssociatedElementInterface extends BaseFormAssociatedElement {\n /* The initial value of the component. /\n public set defaultValue(value: unknown);\n public get defaultValue(): unknown;\n}\n\nexport declare class FormAssociatedCheckboxElementInterface extends BaseFormAssociatedElement {\n /* The initial checked state of the component. /\n public set defaultChecked(value: boolean);\n public get defaultChecked(): boolean;\n}\n\nexport declare class FormRequiredInterface {\n protected _required: boolean;\n\n /\n When set, makes the component a required field for validation.\n * @attr\n * @default false\n */\n public set required(value: boolean);\n public get required(): boolean;\n}\n\nexport const InternalInvalidEvent = 'igc-form-internal-invalid';\nexport const InternalResetEvent = 'igc-form-internal-reset';\n"]}

package/components/common/mixins/mask-behavior.d.ts ADDED Viewed

@@ -0,0 +1,73 @@
+import type { LitElement } from 'lit';
+import type { MaskParser } from '../../mask-input/mask-parser.js';
+import type { RangeTextSelectMode, SelectionRangeDirection } from '../../types.js';
+import type { AbstractConstructor } from './constructor.js';
+export type MaskSelection = {
+    start: number;
+    end: number;
+};
+/**
+ * Public + protected interface contributed by {@link MaskBehaviorMixin}.
+ * Declared as a `declare class` so consumers can see protected members through
+ * the cast return type (mirrors the pattern used by the form-associated mixins).
+ */
+export declare class MaskBehaviorElementInterface {
+    protected readonly _input?: HTMLInputElement;
+    protected readonly _parser: MaskParser;
+    /** Reflects the current parser state into the host's public value. */
+    protected _syncValueFromMask(): void;
+    /** Delegates Enter-key handling to the form-associated base. */
+    protected _handleEnterKeydown(event: KeyboardEvent): void;
+    protected _maskSelection: MaskSelection;
+    protected _compositionStart: number;
+    protected _focused: boolean;
+    protected _maskedValue: string;
+    protected get _inputSelection(): MaskSelection;
+    protected get _isEmptyMask(): boolean;
+    /**
+     * Makes the control a readonly field.
+     * @attr readonly
+     * @default false
+     */
+    readOnly: boolean;
+    /**
+     * The mask pattern of the component.
+     * @attr
+     */
+    get mask(): string;
+    set mask(value: string);
+    /**
+     * The prompt symbol to use for unfilled parts of the mask pattern.
+     * @attr
+     * @default '_'
+     */
+    get prompt(): string;
+    set prompt(value: string);
+    protected _handleInput(event: InputEvent): Promise<void>;
+    protected _updateInput(text: string, range: MaskSelection): Promise<void>;
+    protected _emitInputEvent(): void;
+    protected _setMaskSelection(event: Event): void;
+    protected _handleCompositionStart(): void;
+    protected _handleCompositionEnd(event: CompositionEvent): void;
+    protected _handleClick(): void;
+    /** Sets the text selection range of the control. */
+    setSelectionRange(start?: number, end?: number, direction?: SelectionRangeDirection): void;
+    /** Replaces the selected text in the control and re-applies the mask. */
+    setRangeText(replacement: string, start?: number, end?: number, selectMode?: RangeTextSelectMode): void;
+}
+/**
+ * Adds masked-input behavior (parser-driven editing, selection tracking,
+ * composition handling, range text replacement) to a LitElement-derived class.
+ *
+ * The host class is expected to provide:
+ * - `_input`            – the native `<input>` element (typically via `@query('input')`).
+ * - `_parser`           – a {@link MaskParser} (or subclass) instance.
+ * - `_setTouchedState`  – from `FormAssociatedMixin`.
+ * - `emitEvent`         – from `EventEmitterMixin`.
+ * - `select`            – from the host base.
+ *
+ * The host class must implement `_syncValueFromMask` to bridge the masked
+ * text back into its public `value`. It is called by the default
+ * `_updateInput` implementation and by `setRangeText`.
+ */
+export declare function MaskBehaviorMixin<T extends AbstractConstructor<LitElement>>(superClass: T): AbstractConstructor<MaskBehaviorElementInterface> & T;

package/components/common/mixins/mask-behavior.js ADDED Viewed

@@ -0,0 +1,159 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { property, state } from 'lit/decorators.js';
+export function MaskBehaviorMixin(superClass) {
+    class MaskBehaviorElement extends superClass {
+        constructor() {
+            super(...arguments);
+            this._maskSelection = { start: 0, end: 0 };
+            this._compositionStart = 0;
+            this._focused = false;
+            this._maskedValue = '';
+            this.readOnly = false;
+        }
+        get _inputSelection() {
+            return {
+                start: this._input?.selectionStart || 0,
+                end: this._input?.selectionEnd || 0,
+            };
+        }
+        get _isEmptyMask() {
+            return this._maskedValue === this._parser.emptyMask;
+        }
+        set mask(value) {
+            this._parser.mask = value;
+        }
+        get mask() {
+            return this._parser.mask;
+        }
+        set prompt(value) {
+            this._parser.prompt = value;
+        }
+        get prompt() {
+            return this._parser.prompt;
+        }
+        async _handleInput({ inputType, isComposing, }) {
+            const value = this._input?.value ?? '';
+            const { start, end } = this._maskSelection;
+            const deletePosition = this._parser.getNextNonLiteralPosition(end) + 1;
+            this._setTouchedState();
+            switch (inputType) {
+                case 'deleteContentForward':
+                    this._updateInput('', { start, end: deletePosition });
+                    await this.updateComplete;
+                    return this._input?.setSelectionRange(deletePosition, deletePosition);
+                case 'deleteContentBackward':
+                    if (isComposing)
+                        return;
+                    return this._updateInput('', {
+                        start: this._parser.getPreviousNonLiteralPosition(this._inputSelection.start + 1),
+                        end,
+                    });
+                case 'deleteByCut':
+                    return this._updateInput('', this._maskSelection);
+                case 'insertText':
+                    return this._updateInput(value.substring(start, this._inputSelection.end), this._maskSelection);
+                case 'insertFromPaste':
+                    return this._updateInput(value.substring(start, this._inputSelection.end), {
+                        start,
+                        end: this._inputSelection.start,
+                    });
+                case 'insertFromDrop':
+                    return this._updateInput(value.substring(this._inputSelection.start, this._inputSelection.end), { ...this._inputSelection });
+                case undefined:
+                case '':
+                    return this._updateInput(this._parser.parse(value.substring(start, this._inputSelection.end)), {
+                        start,
+                        end: this._inputSelection.end,
+                    });
+            }
+        }
+        async _updateInput(text, range) {
+            const { value, end } = this._parser.replace(this._maskedValue, text, range.start, range.end);
+            this._maskedValue = value;
+            this._syncValueFromMask();
+            this.requestUpdate();
+            if (range.start !== this._parser.mask.length) {
+                this._emitInputEvent();
+            }
+            await this.updateComplete;
+            this._input?.setSelectionRange(end, end);
+        }
+        _emitInputEvent() {
+            this._setTouchedState();
+            this.emitEvent('igcInput', { detail: this._maskedValue });
+        }
+        _setMaskSelection(event) {
+            this._maskSelection = this._inputSelection;
+            if (event instanceof KeyboardEvent) {
+                this._handleEnterKeydown(event);
+            }
+        }
+        _handleCompositionStart() {
+            this._compositionStart = this._inputSelection.start;
+        }
+        _handleCompositionEnd({ data }) {
+            this._updateInput(data, {
+                start: this._compositionStart,
+                end: this._inputSelection.end,
+            });
+        }
+        _handleClick() {
+            const { selectionStart: start, selectionEnd: end } = this._input ?? {
+                selectionStart: 0,
+                selectionEnd: 0,
+            };
+            if (start === end && start === this._maskedValue.length) {
+                this.select();
+            }
+        }
+        setSelectionRange(start, end, direction = 'none') {
+            this._input?.setSelectionRange(start ?? null, end ?? null, direction);
+            this._maskSelection = { start: start ?? 0, end: end ?? 0 };
+        }
+        setRangeText(replacement, start, end, selectMode) {
+            const current = this._inputSelection;
+            const _start = start ?? current.start;
+            const _end = end ?? current.end;
+            const result = this._parser.replace(this._maskedValue || this._parser.emptyMask, replacement, _start, _end);
+            this._maskedValue = this._parser.apply(this._parser.parse(result.value));
+            this._syncValueFromMask();
+            this.updateComplete.then(() => {
+                switch (selectMode) {
+                    case 'select':
+                        this.setSelectionRange(_start, _end);
+                        break;
+                    case 'start':
+                        this.setSelectionRange(_start, _start);
+                        break;
+                    case 'end':
+                        this.setSelectionRange(_end, _end);
+                        break;
+                    default:
+                        this.setSelectionRange(current.start, current.end);
+                }
+            });
+        }
+    }
+    __decorate([
+        state()
+    ], MaskBehaviorElement.prototype, "_focused", void 0);
+    __decorate([
+        state()
+    ], MaskBehaviorElement.prototype, "_maskedValue", void 0);
+    __decorate([
+        property({ type: Boolean, reflect: true })
+    ], MaskBehaviorElement.prototype, "readOnly", void 0);
+    __decorate([
+        property()
+    ], MaskBehaviorElement.prototype, "mask", null);
+    __decorate([
+        property()
+    ], MaskBehaviorElement.prototype, "prompt", null);
+    return MaskBehaviorElement;
+}
+//# sourceMappingURL=mask-behavior.js.map

package/components/common/mixins/mask-behavior.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"mask-behavior.js","sourceRoot":"","sources":["../../../../src/components/common/mixins/mask-behavior.ts"],"names":[],"mappings":"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","sourcesContent":["import type { LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport type { MaskParser } from '../../mask-input/mask-parser.js';\nimport type {\n RangeTextSelectMode,\n SelectionRangeDirection,\n} from '../../types.js';\nimport type { AbstractConstructor } from './constructor.js';\n\nexport type MaskSelection = {\n start: number;\n end: number;\n};\n\n/**\n * Public + protected interface contributed by {@link MaskBehaviorMixin}.\n * Declared as a `declare class` so consumers can see protected members through\n * the cast return type (mirrors the pattern used by the form-associated mixins).\n */\nexport declare class MaskBehaviorElementInterface {\n //#region Required from host\n\n protected readonly _input?: HTMLInputElement;\n protected readonly _parser: MaskParser;\n\n /** Reflects the current parser state into the host's public value. */\n protected _syncValueFromMask(): void;\n\n /** Delegates Enter-key handling to the form-associated base. */\n protected _handleEnterKeydown(event: KeyboardEvent): void;\n\n //#endregion\n\n //#region Internal state\n\n protected _maskSelection: MaskSelection;\n protected _compositionStart: number;\n protected _focused: boolean;\n protected _maskedValue: string;\n\n protected get _inputSelection(): MaskSelection;\n protected get _isEmptyMask(): boolean;\n\n //#endregion\n\n //#region Public attributes and properties\n\n /**\n * Makes the control a readonly field.\n * @attr readonly\n * @default false\n */\n public readOnly: boolean;\n\n /**\n * The mask pattern of the component.\n * @attr\n */\n public get mask(): string;\n public set mask(value: string);\n\n /**\n * The prompt symbol to use for unfilled parts of the mask pattern.\n * @attr\n * @default '_'\n */\n public get prompt(): string;\n public set prompt(value: string);\n\n //#endregion\n\n //#region Event handlers\n\n protected _handleInput(event: InputEvent): Promise<void>;\n protected _updateInput(text: string, range: MaskSelection): Promise<void>;\n protected _emitInputEvent(): void;\n protected _setMaskSelection(event: Event): void;\n protected _handleCompositionStart(): void;\n protected _handleCompositionEnd(event: CompositionEvent): void;\n protected _handleClick(): void;\n\n //#endregion\n\n //#region Public methods\n\n /** Sets the text selection range of the control. */\n public setSelectionRange(\n start?: number,\n end?: number,\n direction?: SelectionRangeDirection\n ): void;\n\n /** Replaces the selected text in the control and re-applies the mask. */\n public setRangeText(\n replacement: string,\n start?: number,\n end?: number,\n selectMode?: RangeTextSelectMode\n ): void;\n\n //#endregion\n}\n\n/**\n * Adds masked-input behavior (parser-driven editing, selection tracking,\n * composition handling, range text replacement) to a LitElement-derived class.\n *\n * The host class is expected to provide:\n * - `_input` – the native `<input>` element (typically via `@query('input')`).\n * - `_parser` – a {@link MaskParser} (or subclass) instance.\n * - `_setTouchedState` – from `FormAssociatedMixin`.\n * - `emitEvent` – from `EventEmitterMixin`.\n * - `select` – from the host base.\n *\n * The host class must implement `_syncValueFromMask` to bridge the masked\n * text back into its public `value`. It is called by the default\n * `_updateInput` implementation and by `setRangeText`.\n */\nexport function MaskBehaviorMixin<T extends AbstractConstructor<LitElement>>(\n superClass: T\n): AbstractConstructor<MaskBehaviorElementInterface> & T {\n abstract class MaskBehaviorElement extends superClass {\n //#region Required from host\n\n protected abstract readonly _input?: HTMLInputElement;\n protected abstract readonly _parser: MaskParser;\n protected abstract _setTouchedState(): void;\n public abstract select(): void;\n public abstract emitEvent(name: string, init?: CustomEventInit): boolean;\n\n protected abstract _syncValueFromMask(): void;\n protected abstract _handleEnterKeydown(event: KeyboardEvent): void;\n\n //#endregion\n\n //#region Internal state\n\n protected _maskSelection: MaskSelection = { start: 0, end: 0 };\n protected _compositionStart = 0;\n\n @state()\n protected _focused = false;\n\n @state()\n protected _maskedValue = '';\n\n protected get _inputSelection(): MaskSelection {\n return {\n start: this._input?.selectionStart || 0,\n end: this._input?.selectionEnd || 0,\n };\n }\n\n /** Indicates whether the current mask value is empty. */\n protected get _isEmptyMask(): boolean {\n return this._maskedValue === this._parser.emptyMask;\n }\n\n //#endregion\n\n //#region Public attributes and properties\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 mask pattern of the component.\n *\n * @attr\n */\n @property()\n public set mask(value: string) {\n this._parser.mask = value;\n }\n\n public get mask(): string {\n return this._parser.mask;\n }\n\n /**\n * The prompt symbol to use for unfilled parts of the mask pattern.\n *\n * @attr\n * @default '_'\n */\n @property()\n public set prompt(value: string) {\n this._parser.prompt = value;\n }\n\n public get prompt(): string {\n return this._parser.prompt;\n }\n\n //#endregion\n\n //#region Event handlers\n\n protected async _handleInput({\n inputType,\n isComposing,\n }: InputEvent): Promise<void> {\n const value = this._input?.value ?? '';\n const { start, end } = this._maskSelection;\n const deletePosition = this._parser.getNextNonLiteralPosition(end) + 1;\n this._setTouchedState();\n\n switch (inputType) {\n case 'deleteContentForward':\n this._updateInput('', { start, end: deletePosition });\n await this.updateComplete;\n return this._input?.setSelectionRange(deletePosition, deletePosition);\n\n case 'deleteContentBackward':\n if (isComposing) return;\n return this._updateInput('', {\n start: this._parser.getPreviousNonLiteralPosition(\n this._inputSelection.start + 1\n ),\n end,\n });\n\n case 'deleteByCut':\n return this._updateInput('', this._maskSelection);\n\n case 'insertText':\n return this._updateInput(\n value.substring(start, this._inputSelection.end),\n this._maskSelection\n );\n\n case 'insertFromPaste':\n return this._updateInput(\n value.substring(start, this._inputSelection.end),\n {\n start,\n end: this._inputSelection.start,\n }\n );\n\n case 'insertFromDrop':\n return this._updateInput(\n value.substring(\n this._inputSelection.start,\n this._inputSelection.end\n ),\n { ...this._inputSelection }\n );\n\n // Potential browser auto-fill behavior\n case undefined:\n case '':\n return this._updateInput(\n this._parser.parse(\n value.substring(start, this._inputSelection.end)\n ),\n {\n start,\n end: this._inputSelection.end,\n }\n );\n }\n }\n\n /**\n * Default mask-update routine. Re-applies the parser, syncs the leaf's\n * value via {@link MaskBehaviorElementInterface._syncValueFromMask} and\n * emits an input event when the edit is not at the trailing mask boundary.\n *\n * Leaves with bespoke commit semantics (e.g. `igc-mask-input`) override this.\n */\n protected async _updateInput(\n text: string,\n range: MaskSelection\n ): Promise<void> {\n const { value, end } = this._parser.replace(\n this._maskedValue,\n text,\n range.start,\n range.end\n );\n\n this._maskedValue = value;\n this._syncValueFromMask();\n this.requestUpdate();\n\n if (range.start !== this._parser.mask.length) {\n this._emitInputEvent();\n }\n\n await this.updateComplete;\n this._input?.setSelectionRange(end, end);\n }\n\n /**\n * Emits an `igcInput` event with the current masked value as detail.\n * Override to emit a different payload (e.g. the parsed value).\n */\n protected _emitInputEvent(): void {\n this._setTouchedState();\n this.emitEvent('igcInput', { detail: this._maskedValue });\n }\n\n protected _setMaskSelection(event: Event): void {\n this._maskSelection = this._inputSelection;\n if (event instanceof KeyboardEvent) {\n this._handleEnterKeydown(event);\n }\n }\n\n protected _handleCompositionStart(): void {\n this._compositionStart = this._inputSelection.start;\n }\n\n protected _handleCompositionEnd({ data }: CompositionEvent): void {\n this._updateInput(data, {\n start: this._compositionStart,\n end: this._inputSelection.end,\n });\n }\n\n protected _handleClick(): void {\n const { selectionStart: start, selectionEnd: end } = this._input ?? {\n selectionStart: 0,\n selectionEnd: 0,\n };\n\n // Clicking at the end of the input field will select the entire mask\n if (start === end && start === this._maskedValue.length) {\n this.select();\n }\n }\n\n //#endregion\n\n //#region Public methods\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 this._maskSelection = { start: start ?? 0, end: end ?? 0 };\n }\n\n /* blazorSuppress */\n /** Replaces the selected text in the control and re-applies the mask */\n public setRangeText(\n replacement: string,\n start?: number,\n end?: number,\n selectMode?: RangeTextSelectMode\n ): void {\n const current = this._inputSelection;\n const _start = start ?? current.start;\n const _end = end ?? current.end;\n\n const result = this._parser.replace(\n this._maskedValue || this._parser.emptyMask,\n replacement,\n _start,\n _end\n );\n this._maskedValue = this._parser.apply(this._parser.parse(result.value));\n this._syncValueFromMask();\n\n this.updateComplete.then(() => {\n switch (selectMode) {\n case 'select':\n this.setSelectionRange(_start, _end);\n break;\n case 'start':\n this.setSelectionRange(_start, _start);\n break;\n case 'end':\n this.setSelectionRange(_end, _end);\n break;\n default:\n this.setSelectionRange(current.start, current.end);\n }\n });\n }\n\n //#endregion\n }\n\n return MaskBehaviorElement as unknown as AbstractConstructor<MaskBehaviorElementInterface> &\n T;\n}\n"]}

package/components/common/templates/input-shell.d.ts ADDED Viewed

@@ -0,0 +1,24 @@
+import { nothing, type TemplateResult } from 'lit';
+import type { IgcFormControl } from '../mixins/forms/types.js';
+/** Returns a unique id for native input elements rendered by input components. */
+export declare function nextInputId(): string;
+export interface InputShellOptions {
+    /** Active theme name. The `material` theme uses the notch layout. */
+    theme: string;
+    /** The label text. Empty string skips label rendering. */
+    label: string;
+    /** The id of the input element used by the label `for` attribute. */
+    labelId: string;
+    /** Resolved part-name map for the container element. */
+    containerParts: Record<string, boolean>;
+    /** Renders the native `<input>` element. */
+    renderInput: () => TemplateResult;
+    /** Optional renderer for components that need extra parts inside the container (e.g. file-input). */
+    renderFileParts?: () => TemplateResult | typeof nothing;
+}
+/**
+ * Renders the shared input chrome (label, prefix, suffix, validator container)
+ * around a leaf-provided input template, switching layouts between the
+ * material notch and the standard flow.
+ */
+export declare function renderInputShell(host: IgcFormControl, { containerParts, renderFileParts, renderInput, theme, label, labelId, }: InputShellOptions): TemplateResult;

package/components/common/templates/input-shell.js ADDED Viewed

@@ -0,0 +1,43 @@
+import { html, nothing } from 'lit';
+import IgcValidationContainerComponent from '../../validation-container/validation-container.js';
+import { partMap } from '../part-map.js';
+let _nextInputId = 1;
+export function nextInputId() {
+    return `input-${_nextInputId++}`;
+}
+function renderLabel(forId, label) {
+    return label
+        ? html `<label part="label" for=${forId}>${label}</label>`
+        : nothing;
+}
+function renderPrefix() {
+    return html `<div part="prefix"><slot name="prefix"></slot></div>`;
+}
+function renderSuffix() {
+    return html `<div part="suffix"><slot name="suffix"></slot></div>`;
+}
+export function renderInputShell(host, { containerParts, renderFileParts, renderInput, theme, label, labelId, }) {
+    const validator = IgcValidationContainerComponent.create(host);
+    const input = renderInput.call(host);
+    const fileParts = renderFileParts?.call(host) ?? nothing;
+    if (theme === 'material') {
+        return html `
+      <div part=${partMap({ ...containerParts, labelled: !!label })}>
+        <div part="start">${renderPrefix()}</div>
+        ${input}${fileParts}
+        <div part="notch">${renderLabel(labelId, label)}</div>
+        <div part="filler"></div>
+        <div part="end">${renderSuffix()}</div>
+      </div>
+      ${validator}
+    `;
+    }
+    return html `
+    ${renderLabel(labelId, label)}
+    <div part=${partMap(containerParts)}>
+      ${renderPrefix()}${fileParts}${input}${renderSuffix()}
+    </div>
+    ${validator}
+  `;
+}
+//# sourceMappingURL=input-shell.js.map

package/components/common/templates/input-shell.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"input-shell.js","sourceRoot":"","sources":["../../../../src/components/common/templates/input-shell.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AACzD,OAAO,+BAA+B,MAAM,oDAAoD,CAAC;AAEjG,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,IAAI,YAAY,GAAG,CAAC,CAAC;AAGrB,MAAM,UAAU,WAAW;IACzB,OAAO,SAAS,YAAY,EAAE,EAAE,CAAC;AACnC,CAAC;AAiBD,SAAS,WAAW,CAAC,KAAa,EAAE,KAAa;IAC/C,OAAO,KAAK;QACV,CAAC,CAAC,IAAI,CAAA,2BAA2B,KAAK,IAAI,KAAK,UAAU;QACzD,CAAC,CAAC,OAAO,CAAC;AACd,CAAC;AAED,SAAS,YAAY;IACnB,OAAO,IAAI,CAAA,sDAAsD,CAAC;AACpE,CAAC;AAED,SAAS,YAAY;IACnB,OAAO,IAAI,CAAA,sDAAsD,CAAC;AACpE,CAAC;AAOD,MAAM,UAAU,gBAAgB,CAC9B,IAAoB,EACpB,EACE,cAAc,EACd,eAAe,EACf,WAAW,EACX,KAAK,EACL,KAAK,EACL,OAAO,GACW;IAEpB,MAAM,SAAS,GAAG,+BAA+B,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAC/D,MAAM,KAAK,GAAG,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACrC,MAAM,SAAS,GAAG,eAAe,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC;IAEzD,IAAI,KAAK,KAAK,UAAU,EAAE,CAAC;QACzB,OAAO,IAAI,CAAA;kBACG,OAAO,CAAC,EAAE,GAAG,cAAc,EAAE,QAAQ,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC;4BACvC,YAAY,EAAE;UAChC,KAAK,GAAG,SAAS;4BACC,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC;;0BAE7B,YAAY,EAAE;;QAEhC,SAAS;KACZ,CAAC;IACJ,CAAC;IAED,OAAO,IAAI,CAAA;MACP,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC;gBACjB,OAAO,CAAC,cAAc,CAAC;QAC/B,YAAY,EAAE,GAAG,SAAS,GAAG,KAAK,GAAG,YAAY,EAAE;;MAErD,SAAS;GACZ,CAAC;AACJ,CAAC","sourcesContent":["import { html, nothing, type TemplateResult } from 'lit';\nimport IgcValidationContainerComponent from '../../validation-container/validation-container.js';\nimport type { IgcFormControl } from '../mixins/forms/types.js';\nimport { partMap } from '../part-map.js';\n\nlet _nextInputId = 1;\n\n/** Returns a unique id for native input elements rendered by input components. */\nexport function nextInputId(): string {\n return `input-${_nextInputId++}`;\n}\n\nexport interface InputShellOptions {\n /** Active theme name. The `material` theme uses the notch layout. */\n theme: string;\n /** The label text. Empty string skips label rendering. */\n label: string;\n /** The id of the input element used by the label `for` attribute. */\n labelId: string;\n /** Resolved part-name map for the container element. */\n containerParts: Record<string, boolean>;\n /** Renders the native `<input>` element. */\n renderInput: () => TemplateResult;\n /** Optional renderer for components that need extra parts inside the container (e.g. file-input). */\n renderFileParts?: () => TemplateResult | typeof nothing;\n}\n\nfunction renderLabel(forId: string, label: string) {\n return label\n ? html`<label part=\"label\" for=${forId}>${label}</label>`\n : nothing;\n}\n\nfunction renderPrefix() {\n return html`<div part=\"prefix\"><slot name=\"prefix\"></slot></div>`;\n}\n\nfunction renderSuffix() {\n return html`<div part=\"suffix\"><slot name=\"suffix\"></slot></div>`;\n}\n\n/**\n * Renders the shared input chrome (label, prefix, suffix, validator container)\n * around a leaf-provided input template, switching layouts between the\n * material notch and the standard flow.\n */\nexport function renderInputShell(\n host: IgcFormControl,\n {\n containerParts,\n renderFileParts,\n renderInput,\n theme,\n label,\n labelId,\n }: InputShellOptions\n): TemplateResult {\n const validator = IgcValidationContainerComponent.create(host);\n const input = renderInput.call(host);\n const fileParts = renderFileParts?.call(host) ?? nothing;\n\n if (theme === 'material') {\n return html`\n <div part=${partMap({ ...containerParts, labelled: !!label })}>\n <div part=\"start\">${renderPrefix()}</div>\n ${input}${fileParts}\n <div part=\"notch\">${renderLabel(labelId, label)}</div>\n <div part=\"filler\"></div>\n <div part=\"end\">${renderSuffix()}</div>\n </div>\n ${validator}\n `;\n }\n\n return html`\n ${renderLabel(labelId, label)}\n <div part=${partMap(containerParts)}>\n ${renderPrefix()}${fileParts}${input}${renderSuffix()}\n </div>\n ${validator}\n `;\n}\n"]}

package/components/common/templates/masked-input.d.ts ADDED Viewed

@@ -0,0 +1,39 @@
+import { type TemplateResult } from 'lit';
+export interface MaskedInputOptions {
+    /** Optional id for the native input element. */
+    id?: string;
+    /** Resolved part-name map applied to the input. */
+    partNames: Record<string, boolean>;
+    /** The form-associated name attribute. */
+    name?: string;
+    /** Current value to render through `live()`. */
+    value: string;
+    /** Pre-resolved placeholder text. Caller decides empty-string semantics. */
+    placeholder: string;
+    readOnly: boolean;
+    disabled: boolean;
+    autofocus?: boolean;
+    inputMode?: string;
+    /** When provided, sets the `tabindex` attribute. */
+    tabindex?: number;
+    /** When provided, sets the `aria-describedby` attribute. */
+    ariaDescribedBy?: string;
+    onInput: (event: InputEvent) => void;
+    onFocus: (event: FocusEvent) => void;
+    onBlur: (event: FocusEvent) => void;
+    onClick: () => void;
+    /** Wired to `keydown`, `cut`, and `dragstart` to capture the current selection. */
+    onSetMaskSelection: (event: Event) => void;
+    onCompositionStart: () => void;
+    onCompositionEnd: (event: CompositionEvent) => void;
+    onChange?: () => void;
+    onWheel?: (event: WheelEvent) => void;
+    onDragEnter?: () => void;
+    onDragLeave?: () => void;
+}
+/**
+ * Renders the native `<input>` element shared by mask-driven components
+ * (`igc-mask-input`, `igc-date-time-input`, `igc-date-range-input`).
+ * Centralizes mask event wiring so leaves only describe their extras.
+ */
+export declare function renderMaskedNativeInput(opts: MaskedInputOptions): TemplateResult;

package/components/common/templates/masked-input.js ADDED Viewed

@@ -0,0 +1,37 @@
+import { html } from 'lit';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import { live } from 'lit/directives/live.js';
+import { partMap } from '../part-map.js';
+import { bindIf } from '../util.js';
+export function renderMaskedNativeInput(opts) {
+    return html `
+    <input
+      id=${ifDefined(opts.id)}
+      type="text"
+      part=${partMap(opts.partNames)}
+      name=${ifDefined(opts.name)}
+      .value=${live(opts.value)}
+      .placeholder=${opts.placeholder}
+      ?readonly=${opts.readOnly}
+      ?disabled=${opts.disabled}
+      ?autofocus=${opts.autofocus}
+      inputmode=${ifDefined(opts.inputMode)}
+      tabindex=${bindIf(opts.tabindex !== undefined, opts.tabindex)}
+      aria-describedby=${bindIf(!!opts.ariaDescribedBy, opts.ariaDescribedBy)}
+      @input=${opts.onInput}
+      @focus=${opts.onFocus}
+      @blur=${opts.onBlur}
+      @click=${opts.onClick}
+      @keydown=${opts.onSetMaskSelection}
+      @cut=${opts.onSetMaskSelection}
+      @dragstart=${opts.onSetMaskSelection}
+      @compositionstart=${opts.onCompositionStart}
+      @compositionend=${opts.onCompositionEnd}
+      @change=${opts.onChange}
+      @wheel=${opts.onWheel}
+      @dragenter=${opts.onDragEnter}
+      @dragleave=${opts.onDragLeave}
+    />
+  `;
+}
+//# sourceMappingURL=masked-input.js.map

package/components/common/templates/masked-input.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"masked-input.js","sourceRoot":"","sources":["../../../../src/components/common/templates/masked-input.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAuB,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AA4CpC,MAAM,UAAU,uBAAuB,CACrC,IAAwB;IAExB,OAAO,IAAI,CAAA;;WAEF,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC;;aAEhB,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC;aACvB,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;eAClB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;qBACV,IAAI,CAAC,WAAW;kBACnB,IAAI,CAAC,QAAQ;kBACb,IAAI,CAAC,QAAQ;mBACZ,IAAI,CAAC,SAAS;kBACf,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC;iBAC1B,MAAM,CAAC,IAAI,CAAC,QAAQ,KAAK,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC;yBAC1C,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,eAAe,CAAC;eAC9D,IAAI,CAAC,OAAO;eACZ,IAAI,CAAC,OAAO;cACb,IAAI,CAAC,MAAM;eACV,IAAI,CAAC,OAAO;iBACV,IAAI,CAAC,kBAAkB;aAC3B,IAAI,CAAC,kBAAkB;mBACjB,IAAI,CAAC,kBAAkB;0BAChB,IAAI,CAAC,kBAAkB;wBACzB,IAAI,CAAC,gBAAgB;gBAC7B,IAAI,CAAC,QAAQ;eACd,IAAI,CAAC,OAAO;mBACR,IAAI,CAAC,WAAW;mBAChB,IAAI,CAAC,WAAW;;GAEhC,CAAC;AACJ,CAAC","sourcesContent":["import { html, type TemplateResult } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { partMap } from '../part-map.js';\nimport { bindIf } from '../util.js';\n\nexport interface MaskedInputOptions {\n /** Optional id for the native input element. */\n id?: string;\n /** Resolved part-name map applied to the input. */\n partNames: Record<string, boolean>;\n /** The form-associated name attribute. */\n name?: string;\n /** Current value to render through `live()`. */\n value: string;\n /** Pre-resolved placeholder text. Caller decides empty-string semantics. */\n placeholder: string;\n readOnly: boolean;\n disabled: boolean;\n autofocus?: boolean;\n inputMode?: string;\n /** When provided, sets the `tabindex` attribute. */\n tabindex?: number;\n /** When provided, sets the `aria-describedby` attribute. */\n ariaDescribedBy?: string;\n\n // Required mask handlers\n onInput: (event: InputEvent) => void;\n onFocus: (event: FocusEvent) => void;\n onBlur: (event: FocusEvent) => void;\n onClick: () => void;\n /** Wired to `keydown`, `cut`, and `dragstart` to capture the current selection. */\n onSetMaskSelection: (event: Event) => void;\n onCompositionStart: () => void;\n onCompositionEnd: (event: CompositionEvent) => void;\n\n // Optional handlers\n onChange?: () => void;\n onWheel?: (event: WheelEvent) => void;\n onDragEnter?: () => void;\n onDragLeave?: () => void;\n}\n\n/**\n * Renders the native `<input>` element shared by mask-driven components\n * (`igc-mask-input`, `igc-date-time-input`, `igc-date-range-input`).\n * Centralizes mask event wiring so leaves only describe their extras.\n */\nexport function renderMaskedNativeInput(\n opts: MaskedInputOptions\n): TemplateResult {\n return html`\n <input\n id=${ifDefined(opts.id)}\n type=\"text\"\n part=${partMap(opts.partNames)}\n name=${ifDefined(opts.name)}\n .value=${live(opts.value)}\n .placeholder=${opts.placeholder}\n ?readonly=${opts.readOnly}\n ?disabled=${opts.disabled}\n ?autofocus=${opts.autofocus}\n inputmode=${ifDefined(opts.inputMode)}\n tabindex=${bindIf(opts.tabindex !== undefined, opts.tabindex)}\n aria-describedby=${bindIf(!!opts.ariaDescribedBy, opts.ariaDescribedBy)}\n @input=${opts.onInput}\n @focus=${opts.onFocus}\n @blur=${opts.onBlur}\n @click=${opts.onClick}\n @keydown=${opts.onSetMaskSelection}\n @cut=${opts.onSetMaskSelection}\n @dragstart=${opts.onSetMaskSelection}\n @compositionstart=${opts.onCompositionStart}\n @compositionend=${opts.onCompositionEnd}\n @change=${opts.onChange}\n @wheel=${opts.onWheel}\n @dragenter=${opts.onDragEnter}\n @dragleave=${opts.onDragLeave}\n />\n `;\n}\n"]}