igniteui-webcomponents 4.9.0 → 4.11.0

package/components/common/mixins/option.d.ts

@@ -1,6 +1,9 @@
 import { LitElement } from 'lit';
 export declare abstract class IgcBaseOptionLikeComponent extends LitElement {
     protected _internals: ElementInternals;
+    protected _active: boolean;
+    protected _disabled: boolean;
+    protected _selected: boolean;
     protected _value: string;
     protected _content: Array<Element>;
     protected get _contentSlotText(): string;
@@ -8,27 +11,28 @@ export declare abstract class IgcBaseOptionLikeComponent extends LitElement {
      * Whether the item is active.
      * @attr
      */
-    active: boolean;
+    set active(value: boolean);
+    get active(): boolean;
     /**
      * Whether the item is disabled.
      * @attr
      */
-    disabled: boolean;
+    set disabled(value: boolean);
+    get disabled(): boolean;
     /**
      * Whether the item is selected.
      * @attr
      */
-    selected: boolean;
+    set selected(value: boolean);
+    get selected(): boolean;
     /**
      * The current value of the item.
      * If not specified, the element's text content is used.
      *
      * @attr
      */
-    get value(): string;
     set value(value: string);
-    protected disabledChange(): void;
-    protected selectedChange(): void;
+    get value(): string;
     constructor();
     connectedCallback(): void;
     protected render(): import("lit-html").TemplateResult<1>;

package/components/common/mixins/option.js

@@ -6,31 +6,42 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { LitElement, html } from 'lit';
 import { property, queryAssignedNodes } from 'lit/decorators.js';
-import { watch } from '../decorators/watch.js';
 export class IgcBaseOptionLikeComponent extends LitElement {
     get _contentSlotText() {
         return this._content.map((node) => node.textContent).join('');
     }
-    get value() {
-        return this._value ? this._value : this._contentSlotText;
+    set active(value) {
+        this._active = Boolean(value);
     }
-    set value(value) {
-        const old = this._value;
-        this._value = value;
-        this.requestUpdate('value', old);
+    get active() {
+        return this._active;
     }
-    disabledChange() {
-        this._internals.ariaDisabled = `${this.disabled}`;
+    set disabled(value) {
+        this._disabled = Boolean(value);
+        this._internals.ariaDisabled = `${this._disabled}`;
     }
-    selectedChange() {
-        this._internals.ariaSelected = `${this.selected}`;
+    get disabled() {
+        return this._disabled;
+    }
+    set selected(value) {
+        this._selected = Boolean(value);
+        this._internals.ariaSelected = `${this._selected}`;
         this.active = this.selected;
     }
+    get selected() {
+        return this._selected;
+    }
+    set value(value) {
+        this._value = value;
+    }
+    get value() {
+        return this._value ? this._value : this._contentSlotText;
+    }
     constructor() {
         super();
-        this.active = false;
-        this.disabled = false;
-        this.selected = false;
+        this._active = false;
+        this._disabled = false;
+        this._selected = false;
         this._internals = this.attachInternals();
         this._internals.role = 'option';
     }
@@ -57,20 +68,14 @@ __decorate([
 ], IgcBaseOptionLikeComponent.prototype, "_content", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
-], IgcBaseOptionLikeComponent.prototype, "active", void 0);
+], IgcBaseOptionLikeComponent.prototype, "active", null);
 __decorate([
     property({ type: Boolean, reflect: true })
-], IgcBaseOptionLikeComponent.prototype, "disabled", void 0);
+], IgcBaseOptionLikeComponent.prototype, "disabled", null);
 __decorate([
     property({ type: Boolean, reflect: true })
-], IgcBaseOptionLikeComponent.prototype, "selected", void 0);
+], IgcBaseOptionLikeComponent.prototype, "selected", null);
 __decorate([
     property()
 ], IgcBaseOptionLikeComponent.prototype, "value", null);
-__decorate([
-    watch('disabled')
-], IgcBaseOptionLikeComponent.prototype, "disabledChange", null);
-__decorate([
-    watch('selected')
-], IgcBaseOptionLikeComponent.prototype, "selectedChange", null);
 //# sourceMappingURL=option.js.map

package/components/common/mixins/option.js.map

@@ -1 +1 @@
-{"version":3,"file":"option.js","sourceRoot":"","sources":["../../../../src/components/common/mixins/option.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAEjE,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAE/C,MAAM,OAAgB,0BAA2B,SAAQ,UAAU;IAOjE,IAAc,gBAAgB;QAC5B,OAAO,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAChE,CAAC;IA8BD,IAAW,KAAK;QACd,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,gBAAgB,CAAC;IAC3D,CAAC;IAED,IAAW,KAAK,CAAC,KAAa;QAC5B,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,CAAC;QACxB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;IACnC,CAAC;IAGS,cAAc;QACtB,IAAI,CAAC,UAAU,CAAC,YAAY,GAAG,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;IACpD,CAAC;IAGS,cAAc;QACtB,IAAI,CAAC,UAAU,CAAC,YAAY,GAAG,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;QAClD,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC;IAC9B,CAAC;IAED;QACE,KAAK,EAAE,CAAC;QA7CH,WAAM,GAAG,KAAK,CAAC;QAOf,aAAQ,GAAG,KAAK,CAAC;QAOjB,aAAQ,GAAG,KAAK,CAAC;QAgCtB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QACzC,IAAI,CAAC,UAAU,CAAC,IAAI,GAAG,QAAQ,CAAC;IAClC,CAAC;IAEe,iBAAiB;QAG/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC;IACvB,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;;;;;;KAUV,CAAC;IACJ,CAAC;CACF;AAjFW;IADT,kBAAkB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4DACF;AAW7B;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0DACrB;AAOf;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4DACnB;AAOjB;IADN,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4DACnB;AASxB;IADC,QAAQ,EAAE;uDAGV;AASS;IADT,KAAK,CAAC,UAAU,CAAC;gEAGjB;AAGS;IADT,KAAK,CAAC,UAAU,CAAC;gEAIjB","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property, queryAssignedNodes } from 'lit/decorators.js';\n\nimport { watch } from '../decorators/watch.js';\n\nexport abstract class IgcBaseOptionLikeComponent extends LitElement {\n  protected _internals: ElementInternals;\n  protected _value!: string;\n\n  @queryAssignedNodes({ flatten: true })\n  protected _content!: Array<Element>;\n\n  protected get _contentSlotText() {\n    return this._content.map((node) => node.textContent).join('');\n  }\n\n  /**\n   * Whether the item is active.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public active = false;\n\n  /**\n   * Whether the item is disabled.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public disabled = false;\n\n  /**\n   * Whether the item is selected.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public selected = false;\n\n  /**\n   * The current value of the item.\n   * If not specified, the element's text content is used.\n   *\n   * @attr\n   */\n  @property()\n  public get value(): string {\n    return this._value ? this._value : this._contentSlotText;\n  }\n\n  public set value(value: string) {\n    const old = this._value;\n    this._value = value;\n    this.requestUpdate('value', old);\n  }\n\n  @watch('disabled')\n  protected disabledChange() {\n    this._internals.ariaDisabled = `${this.disabled}`;\n  }\n\n  @watch('selected')\n  protected selectedChange() {\n    this._internals.ariaSelected = `${this.selected}`;\n    this.active = this.selected;\n  }\n\n  constructor() {\n    super();\n    this._internals = this.attachInternals();\n    this._internals.role = 'option';\n  }\n\n  public override connectedCallback(): void {\n    // R.K. Workaround for Axe accessibility unit tests.\n    // I guess it does not support ElementInternals ARIAMixin state yet\n    super.connectedCallback();\n    this.role = 'option';\n  }\n\n  protected override render() {\n    return html`\n      <section part=\"prefix\">\n        <slot name=\"prefix\"></slot>\n      </section>\n      <section part=\"content\">\n        <slot></slot>\n      </section>\n      <section part=\"suffix\">\n        <slot name=\"suffix\"></slot>\n      </section>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"option.js","sourceRoot":"","sources":["../../../../src/components/common/mixins/option.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAEjE,MAAM,OAAgB,0BAA2B,SAAQ,UAAU;IAWjE,IAAc,gBAAgB;QAC5B,OAAO,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAChE,CAAC;IAOD,IAAW,MAAM,CAAC,KAAc;QAC9B,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IAChC,CAAC;IAED,IAAW,MAAM;QACf,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;IAOD,IAAW,QAAQ,CAAC,KAAc;QAChC,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;QAChC,IAAI,CAAC,UAAU,CAAC,YAAY,GAAG,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;IACrD,CAAC;IAED,IAAW,QAAQ;QACjB,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IAOD,IAAW,QAAQ,CAAC,KAAc;QAChC,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;QAChC,IAAI,CAAC,UAAU,CAAC,YAAY,GAAG,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;QACnD,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC;IAC9B,CAAC;IAED,IAAW,QAAQ;QACjB,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IASD,IAAW,KAAK,CAAC,KAAa;QAC5B,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;IACtB,CAAC;IAED,IAAW,KAAK;QACd,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,gBAAgB,CAAC;IAC3D,CAAC;IAED;QACE,KAAK,EAAE,CAAC;QAtEA,YAAO,GAAG,KAAK,CAAC;QAChB,cAAS,GAAG,KAAK,CAAC;QAClB,cAAS,GAAG,KAAK,CAAC;QAqE1B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QACzC,IAAI,CAAC,UAAU,CAAC,IAAI,GAAG,QAAQ,CAAC;IAClC,CAAC;IAEe,iBAAiB;QAG/B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC;IACvB,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;;;;;;KAUV,CAAC;IACJ,CAAC;CACF;AAzFW;IADT,kBAAkB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4DACF;AAWpC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wDAG1C;AAWD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0DAI1C;AAWD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0DAK1C;AAaD;IADC,QAAQ,EAAE;uDAGV","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property, queryAssignedNodes } from 'lit/decorators.js';\n\nexport abstract class IgcBaseOptionLikeComponent extends LitElement {\n  protected _internals: ElementInternals;\n\n  protected _active = false;\n  protected _disabled = false;\n  protected _selected = false;\n  protected _value!: string;\n\n  @queryAssignedNodes({ flatten: true })\n  protected _content!: Array<Element>;\n\n  protected get _contentSlotText() {\n    return this._content.map((node) => node.textContent).join('');\n  }\n\n  /**\n   * Whether the item is active.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public set active(value: boolean) {\n    this._active = Boolean(value);\n  }\n\n  public get active() {\n    return this._active;\n  }\n\n  /**\n   * Whether the item is disabled.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public set disabled(value: boolean) {\n    this._disabled = Boolean(value);\n    this._internals.ariaDisabled = `${this._disabled}`;\n  }\n\n  public get disabled() {\n    return this._disabled;\n  }\n\n  /**\n   * Whether the item is selected.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true })\n  public set selected(value: boolean) {\n    this._selected = Boolean(value);\n    this._internals.ariaSelected = `${this._selected}`;\n    this.active = this.selected;\n  }\n\n  public get selected() {\n    return this._selected;\n  }\n\n  /**\n   * The current value of the item.\n   * If not specified, the element's text content is used.\n   *\n   * @attr\n   */\n  @property()\n  public set value(value: string) {\n    this._value = value;\n  }\n\n  public get value(): string {\n    return this._value ? this._value : this._contentSlotText;\n  }\n\n  constructor() {\n    super();\n    this._internals = this.attachInternals();\n    this._internals.role = 'option';\n  }\n\n  public override connectedCallback(): void {\n    // R.K. Workaround for Axe accessibility unit tests.\n    // I guess it does not support ElementInternals ARIAMixin state yet\n    super.connectedCallback();\n    this.role = 'option';\n  }\n\n  protected override render() {\n    return html`\n      <section part=\"prefix\">\n        <slot name=\"prefix\"></slot>\n      </section>\n      <section part=\"content\">\n        <slot></slot>\n      </section>\n      <section part=\"suffix\">\n        <slot name=\"suffix\"></slot>\n      </section>\n    `;\n  }\n}\n"]}

package/components/common/mixins/sizable.d.ts

@@ -1,5 +1,5 @@
 import type { LitElement } from 'lit';
-import type { Constructor } from './constructor';
+import type { Constructor } from './constructor.js';
 export declare class SizableInterface {
     /**
      * Determines the size of the component.

package/components/common/mixins/sizable.js.map

@@ -1 +1 @@
-{"version":3,"file":"sizable.js","sourceRoot":"","sources":["../../../../src/components/common/mixins/sizable.ts"],"names":[],"mappings":";;;;;;AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAc/C,MAAM,CAAC,MAAM,YAAY,GAAG,CAC1B,UAAa,EACb,EAAE;IACF,MAAM,cAAe,SAAQ,UAAU;QAAvC;;YASS,SAAI,GAAiC,OAAO,CAAC;QAStD,CAAC;QANW,UAAU;YAClB,IAAI,CAAC,KAAK,CAAC,WAAW,CACpB,kBAAkB,EAClB,gCAAgC,IAAI,CAAC,IAAI,IAAI,CAC9C,CAAC;QACJ,CAAC;KACF;IATQ;QADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gDACwB;IAG1C;QADT,KAAK,CAAC,MAAM,CAAC;oDAMb;IAEH,OAAO,cAAmD,CAAC;AAC7D,CAAC,CAAC","sourcesContent":["import type { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\n\nimport { watch } from '../decorators/watch.js';\nimport type { Constructor } from './constructor';\n\nexport declare class SizableInterface {\n  /**\n   * Determines the size of the component.\n   * @attr\n   * @type {\"small\" | \"medium\" | \"large\"}\n   *\n   * @deprecated since v4.5.0. Use the `--ig-size` CSS custom property instead.\n   */\n  public size: 'small' | 'medium' | 'large';\n}\n\nexport const SizableMixin = <T extends Constructor<LitElement>>(\n  superClass: T\n) => {\n  class SizableElement extends superClass {\n    /**\n     * Determines the size of the component.\n     * @attr\n     * @type {\"small\" | \"medium\" | \"large\"}\n     *\n     * @deprecated since v4.5.0. Use the `--ig-size` CSS custom property instead.\n     */\n    @property({ reflect: true })\n    public size: 'small' | 'medium' | 'large' = 'large';\n\n    @watch('size')\n    protected updateSize() {\n      this.style.setProperty(\n        '--component-size',\n        `var(--ig-size, var(--ig-size-${this.size}))`\n      );\n    }\n  }\n  return SizableElement as Constructor<SizableInterface> & T;\n};\n"]}
+{"version":3,"file":"sizable.js","sourceRoot":"","sources":["../../../../src/components/common/mixins/sizable.ts"],"names":[],"mappings":";;;;;;AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAc/C,MAAM,CAAC,MAAM,YAAY,GAAG,CAC1B,UAAa,EACb,EAAE;IACF,MAAM,cAAe,SAAQ,UAAU;QAAvC;;YASS,SAAI,GAAiC,OAAO,CAAC;QAStD,CAAC;QANW,UAAU;YAClB,IAAI,CAAC,KAAK,CAAC,WAAW,CACpB,kBAAkB,EAClB,gCAAgC,IAAI,CAAC,IAAI,IAAI,CAC9C,CAAC;QACJ,CAAC;KACF;IATQ;QADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gDACwB;IAG1C;QADT,KAAK,CAAC,MAAM,CAAC;oDAMb;IAEH,OAAO,cAAmD,CAAC;AAC7D,CAAC,CAAC","sourcesContent":["import type { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\n\nimport { watch } from '../decorators/watch.js';\nimport type { Constructor } from './constructor.js';\n\nexport declare class SizableInterface {\n  /**\n   * Determines the size of the component.\n   * @attr\n   * @type {\"small\" | \"medium\" | \"large\"}\n   *\n   * @deprecated since v4.5.0. Use the `--ig-size` CSS custom property instead.\n   */\n  public size: 'small' | 'medium' | 'large';\n}\n\nexport const SizableMixin = <T extends Constructor<LitElement>>(\n  superClass: T\n) => {\n  class SizableElement extends superClass {\n    /**\n     * Determines the size of the component.\n     * @attr\n     * @type {\"small\" | \"medium\" | \"large\"}\n     *\n     * @deprecated since v4.5.0. Use the `--ig-size` CSS custom property instead.\n     */\n    @property({ reflect: true })\n    public size: 'small' | 'medium' | 'large' = 'large';\n\n    @watch('size')\n    protected updateSize() {\n      this.style.setProperty(\n        '--component-size',\n        `var(--ig-size, var(--ig-size-${this.size}))`\n      );\n    }\n  }\n  return SizableElement as Constructor<SizableInterface> & T;\n};\n"]}

package/components/common/util.d.ts

@@ -2,6 +2,7 @@ export interface PartNameInfo {
     readonly [name: string]: string | boolean | number;
 }
 export declare const partNameMap: (partNameInfo: PartNameInfo) => string;
+export declare function noop(): void;
 export declare const asPercent: (part: number, whole: number) => number;
 export declare const clamp: (number: number, min: number, max: number) => number;
 /**
@@ -22,6 +23,9 @@ export declare function getOffset(element: HTMLElement, parent: HTMLElement): {
     bottom: number;
 };
 export declare function createCounter(): () => number;
+/**
+ * Returns whether an element has a Left-to-Right directionality.
+ */
 export declare function isLTR(element: HTMLElement): boolean;
 /**
  * Builds a string from format specifiers and replacement parameters.
@@ -60,7 +64,7 @@ export declare function asNumber(value: unknown, fallback?: number): number;
  * ```
  */
 export declare function wrap(min: number, max: number, value: number): number;
-export declare function isDefined<T = unknown>(value: T): boolean;
+export declare function isDefined<T = unknown>(value: T): value is T & ({} | null);
 export declare function iterNodes<T = Node>(root: Node, whatToShow?: keyof typeof NodeFilter, filter?: (node: T) => boolean): Generator<T>;
 export declare function getElementByIdFromRoot(root: HTMLElement, id: string): HTMLElement | null;
 export declare function isElement(node: unknown): node is Element;

package/components/common/util.js

@@ -3,6 +3,7 @@ export const partNameMap = (partNameInfo) => {
         .filter((key) => partNameInfo[key])
         .join(' ');
 };
+export function noop() { }
 export const asPercent = (part, whole) => (part / whole) * 100;
 export const clamp = (number, min, max) => Math.max(min, Math.min(number, max));
 export function getOffset(element, parent) {
@@ -23,7 +24,7 @@ export function createCounter() {
     };
 }
 export function isLTR(element) {
-    return getComputedStyle(element).getPropertyValue('direction') === 'ltr';
+    return element.matches(':dir(ltr)');
 }
 export function formatString(template, ...params) {
     const length = params.length;

package/components/common/util.js.map

@@ -1 +1 @@
-{"version":3,"file":"util.js","sourceRoot":"","sources":["../../../src/components/common/util.ts"],"names":[],"mappings":"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","sourcesContent":["export interface PartNameInfo {\n  readonly [name: string]: string | boolean | number;\n}\n\nexport const partNameMap = (partNameInfo: PartNameInfo) => {\n  return Object.keys(partNameInfo)\n    .filter((key) => partNameInfo[key])\n    .join(' ');\n};\n\nexport const asPercent = (part: number, whole: number) => (part / whole) * 100;\n\nexport const clamp = (number: number, min: number, max: number) =>\n  Math.max(min, Math.min(number, max));\n\n/**\n *\n * Returns an element's offset relative to its parent. Similar to element.offsetTop and element.offsetLeft, except the\n * parent doesn't have to be positioned relative or absolute.\n *\n * Work around for the following issues in Chromium based browsers:\n *\n * https://bugs.chromium.org/p/chromium/issues/detail?id=1330819\n * https://bugs.chromium.org/p/chromium/issues/detail?id=1334556\n *\n */\nexport function getOffset(element: HTMLElement, parent: HTMLElement) {\n  const { top, left, bottom, right } = element.getBoundingClientRect();\n  const {\n    top: pTop,\n    left: pLeft,\n    bottom: pBottom,\n    right: pRight,\n  } = parent.getBoundingClientRect();\n\n  return {\n    top: Math.round(top - pTop),\n    left: Math.round(left - pLeft),\n    right: Math.round(right - pRight),\n    bottom: Math.round(bottom - pBottom),\n  };\n}\n\nexport function createCounter() {\n  let i = 0;\n  return () => {\n    i++;\n    return i;\n  };\n}\n\nexport function isLTR(element: HTMLElement) {\n  return getComputedStyle(element).getPropertyValue('direction') === 'ltr';\n}\n\n/**\n * Builds a string from format specifiers and replacement parameters.\n * Will coerce non-string parameters to their string representations.\n *\n * @example\n * ```typescript\n * formatString('{0} says \"{1}\".', 'John', 'Hello'); // 'John says \"Hello\".'\n * formatString('{1} is greater than {0}', 0, 1); // '1 is greater than 0'\n * ```\n */\nexport function formatString(template: string, ...params: unknown[]): string {\n  const length = params.length;\n\n  return template.replace(/{(\\d+)}/g, (match: string, index: number) =>\n    index >= length ? match : `${params[index]}`\n  );\n}\n\n/**\n * Parse the passed `value` as a number or return the `fallback` if it can't be done.\n *\n * @example\n * ```typescript\n * asNumber('5'); // 5\n * asNumber('3.14'); // 3.14\n * asNumber('five'); // 0\n * asNUmber('five', 5); // 5\n * ```\n */\nexport function asNumber(value: unknown, fallback = 0) {\n  const parsed = Number.parseFloat(value as string);\n  return Number.isNaN(parsed) ? fallback : parsed;\n}\n\n/**\n * Returns the value wrapped between the min and max bounds.\n *\n * If the value is greater than max, returns the min and vice-versa.\n * If the value is between the bounds, it is returned unchanged.\n *\n * @example\n * ```typescript\n * wrap(1, 4, 2); // 2\n * wrap(1, 4, 5); // 1\n * wrap(1, 4, -1); // 4\n * ```\n */\nexport function wrap(min: number, max: number, value: number) {\n  if (value < min) {\n    return max;\n  }\n  if (value > max) {\n    return min;\n  }\n\n  return value;\n}\n\nexport function isDefined<T = unknown>(value: T) {\n  return value !== undefined;\n}\n\nexport function* iterNodes<T = Node>(\n  root: Node,\n  whatToShow?: keyof typeof NodeFilter,\n  filter?: (node: T) => boolean\n): Generator<T> {\n  if (!isDefined(globalThis.document)) {\n    return;\n  }\n\n  const iter = globalThis.document.createTreeWalker(\n    root,\n    NodeFilter[whatToShow ?? 'SHOW_ALL']\n  );\n\n  let node = iter.nextNode() as T;\n\n  while (node) {\n    if (filter) {\n      if (filter(node)) {\n        yield node;\n      }\n    } else {\n      yield node;\n    }\n\n    node = iter.nextNode() as T;\n  }\n}\n\nexport function getElementByIdFromRoot(root: HTMLElement, id: string) {\n  return (root.getRootNode() as Document | ShadowRoot).getElementById(id);\n}\n\nexport function isElement(node: unknown): node is Element {\n  return node instanceof Node && node.nodeType === Node.ELEMENT_NODE;\n}\n\nexport function getElementsFromEventPath<T extends Element>(event: Event) {\n  return event.composedPath().filter((item) => isElement(item)) as T[];\n}\n\nexport function findElementFromEventPath<T extends Element>(\n  predicate: string | ((element: Element) => boolean),\n  event: Event\n) {\n  const func =\n    typeof predicate === 'string'\n      ? (e: Element) => e.matches(predicate)\n      : (e: Element) => predicate(e);\n\n  return getElementsFromEventPath(event).find(func) as T | undefined;\n}\n\nexport function groupBy<T>(array: T[], key: keyof T | ((item: T) => any)) {\n  const result: Record<string, T[]> = {};\n  const _get = typeof key === 'function' ? key : (item: T) => item[key];\n\n  for (const item of array) {\n    const category = _get(item);\n    const group = result[category];\n\n    if (Array.isArray(group)) {\n      group.push(item);\n    } else {\n      result[category] = [item];\n    }\n  }\n\n  return result;\n}\n"]}
+{"version":3,"file":"util.js","sourceRoot":"","sources":["../../../src/components/common/util.ts"],"names":[],"mappings":"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","sourcesContent":["export interface PartNameInfo {\n  readonly [name: string]: string | boolean | number;\n}\n\nexport const partNameMap = (partNameInfo: PartNameInfo) => {\n  return Object.keys(partNameInfo)\n    .filter((key) => partNameInfo[key])\n    .join(' ');\n};\n\nexport function noop() {}\n\nexport const asPercent = (part: number, whole: number) => (part / whole) * 100;\n\nexport const clamp = (number: number, min: number, max: number) =>\n  Math.max(min, Math.min(number, max));\n\n/**\n *\n * Returns an element's offset relative to its parent. Similar to element.offsetTop and element.offsetLeft, except the\n * parent doesn't have to be positioned relative or absolute.\n *\n * Work around for the following issues in Chromium based browsers:\n *\n * https://bugs.chromium.org/p/chromium/issues/detail?id=1330819\n * https://bugs.chromium.org/p/chromium/issues/detail?id=1334556\n *\n */\nexport function getOffset(element: HTMLElement, parent: HTMLElement) {\n  const { top, left, bottom, right } = element.getBoundingClientRect();\n  const {\n    top: pTop,\n    left: pLeft,\n    bottom: pBottom,\n    right: pRight,\n  } = parent.getBoundingClientRect();\n\n  return {\n    top: Math.round(top - pTop),\n    left: Math.round(left - pLeft),\n    right: Math.round(right - pRight),\n    bottom: Math.round(bottom - pBottom),\n  };\n}\n\nexport function createCounter() {\n  let i = 0;\n  return () => {\n    i++;\n    return i;\n  };\n}\n\n/**\n * Returns whether an element has a Left-to-Right directionality.\n */\nexport function isLTR(element: HTMLElement) {\n  return element.matches(':dir(ltr)');\n}\n\n/**\n * Builds a string from format specifiers and replacement parameters.\n * Will coerce non-string parameters to their string representations.\n *\n * @example\n * ```typescript\n * formatString('{0} says \"{1}\".', 'John', 'Hello'); // 'John says \"Hello\".'\n * formatString('{1} is greater than {0}', 0, 1); // '1 is greater than 0'\n * ```\n */\nexport function formatString(template: string, ...params: unknown[]): string {\n  const length = params.length;\n\n  return template.replace(/{(\\d+)}/g, (match: string, index: number) =>\n    index >= length ? match : `${params[index]}`\n  );\n}\n\n/**\n * Parse the passed `value` as a number or return the `fallback` if it can't be done.\n *\n * @example\n * ```typescript\n * asNumber('5'); // 5\n * asNumber('3.14'); // 3.14\n * asNumber('five'); // 0\n * asNUmber('five', 5); // 5\n * ```\n */\nexport function asNumber(value: unknown, fallback = 0) {\n  const parsed = Number.parseFloat(value as string);\n  return Number.isNaN(parsed) ? fallback : parsed;\n}\n\n/**\n * Returns the value wrapped between the min and max bounds.\n *\n * If the value is greater than max, returns the min and vice-versa.\n * If the value is between the bounds, it is returned unchanged.\n *\n * @example\n * ```typescript\n * wrap(1, 4, 2); // 2\n * wrap(1, 4, 5); // 1\n * wrap(1, 4, -1); // 4\n * ```\n */\nexport function wrap(min: number, max: number, value: number) {\n  if (value < min) {\n    return max;\n  }\n  if (value > max) {\n    return min;\n  }\n\n  return value;\n}\n\nexport function isDefined<T = unknown>(value: T) {\n  return value !== undefined;\n}\n\nexport function* iterNodes<T = Node>(\n  root: Node,\n  whatToShow?: keyof typeof NodeFilter,\n  filter?: (node: T) => boolean\n): Generator<T> {\n  if (!isDefined(globalThis.document)) {\n    return;\n  }\n\n  const iter = globalThis.document.createTreeWalker(\n    root,\n    NodeFilter[whatToShow ?? 'SHOW_ALL']\n  );\n\n  let node = iter.nextNode() as T;\n\n  while (node) {\n    if (filter) {\n      if (filter(node)) {\n        yield node;\n      }\n    } else {\n      yield node;\n    }\n\n    node = iter.nextNode() as T;\n  }\n}\n\nexport function getElementByIdFromRoot(root: HTMLElement, id: string) {\n  return (root.getRootNode() as Document | ShadowRoot).getElementById(id);\n}\n\nexport function isElement(node: unknown): node is Element {\n  return node instanceof Node && node.nodeType === Node.ELEMENT_NODE;\n}\n\nexport function getElementsFromEventPath<T extends Element>(event: Event) {\n  return event.composedPath().filter((item) => isElement(item)) as T[];\n}\n\nexport function findElementFromEventPath<T extends Element>(\n  predicate: string | ((element: Element) => boolean),\n  event: Event\n) {\n  const func =\n    typeof predicate === 'string'\n      ? (e: Element) => e.matches(predicate)\n      : (e: Element) => predicate(e);\n\n  return getElementsFromEventPath(event).find(func) as T | undefined;\n}\n\nexport function groupBy<T>(array: T[], key: keyof T | ((item: T) => any)) {\n  const result: Record<string, T[]> = {};\n  const _get = typeof key === 'function' ? key : (item: T) => item[key];\n\n  for (const item of array) {\n    const category = _get(item);\n    const group = result[category];\n\n    if (Array.isArray(group)) {\n      group.push(item);\n    } else {\n      result[category] = [item];\n    }\n  }\n\n  return result;\n}\n"]}

package/components/common/validators.d.ts

@@ -7,7 +7,7 @@ export interface Validator<T = any> {
 }
 export declare const requiredValidator: Validator<{
     required: boolean;
-    value?: string;
+    value?: unknown;
 }>;
 export declare const requiredNumberValidator: Validator<{
     required: boolean;
@@ -48,4 +48,12 @@ export declare const emailValidator: Validator<{
 export declare const urlValidator: Validator<{
     value: string;
 }>;
+export declare const minDateValidator: Validator<{
+    value?: Date | null;
+    min?: Date | null;
+}>;
+export declare const maxDateValidator: Validator<{
+    value?: Date | null;
+    max?: Date | null;
+}>;
 export {};

package/components/common/validators.js

@@ -1,5 +1,7 @@
+import { DateTimeUtil } from '../date-time-input/date-util.js';
 import validatorMessages from './localization/validation-en.js';
 import { asNumber, formatString, isDefined } from './util.js';
+const emailRegex = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
 export const requiredValidator = {
     key: 'valueMissing',
     message: validatorMessages.required,
@@ -51,7 +53,6 @@ export const stepValidator = {
         ? (asNumber(value) - asNumber(min)) % asNumber(step, 1) === 0
         : true,
 };
-const emailRegex = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
 export const emailValidator = {
     key: 'typeMismatch',
     message: validatorMessages.email,
@@ -62,4 +63,18 @@ export const urlValidator = {
     message: validatorMessages.url,
     isValid: ({ value }) => URL.canParse(value),
 };
+export const minDateValidator = {
+    key: 'rangeUnderflow',
+    message: ({ min }) => formatString(validatorMessages.min, min),
+    isValid: ({ value, min }) => min
+        ? !DateTimeUtil.lessThanMinValue(value ?? new Date(), min, false, true)
+        : true,
+};
+export const maxDateValidator = {
+    key: 'rangeOverflow',
+    message: ({ max }) => formatString(validatorMessages.max, max),
+    isValid: ({ value, max }) => max
+        ? !DateTimeUtil.greaterThanMaxValue(value ?? new Date(), max, false, true)
+        : true,
+};
 //# sourceMappingURL=validators.js.map

package/components/common/validators.js.map

@@ -1 +1 @@
-{"version":3,"file":"validators.js","sourceRoot":"","sources":["../../../src/components/common/validators.ts"],"names":[],"mappings":"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","sourcesContent":["import validatorMessages from './localization/validation-en.js';\nimport { asNumber, formatString, isDefined } from './util.js';\n\ntype ValidatorHandler<T> = (host: T) => boolean;\ntype ValidatorMessageFormat<T> = (host: T) => string;\n\nexport interface Validator<T = any> {\n  key: keyof ValidityStateFlags;\n  message: string | ValidatorMessageFormat<T>;\n  isValid: ValidatorHandler<T>;\n}\n\nexport const requiredValidator: Validator<{\n  required: boolean;\n  value?: string;\n}> = {\n  key: 'valueMissing',\n  message: validatorMessages.required,\n  isValid: ({ required, value }) => (required ? !!value : true),\n};\n\nexport const requiredNumberValidator: Validator<{\n  required: boolean;\n  value?: number | string;\n}> = {\n  key: 'valueMissing',\n  message: validatorMessages.required,\n  isValid: ({ required, value }) => (required ? isDefined(value) : true),\n};\n\nexport const requiredBooleanValidator: Validator<{\n  required: boolean;\n  checked: boolean;\n}> = {\n  key: 'valueMissing',\n  message: validatorMessages.required,\n  isValid: ({ required, checked }) => (required ? checked : true),\n};\n\nexport const minLengthValidator: Validator<{\n  minLength: number;\n  value: string;\n}> = {\n  key: 'tooShort',\n  message: ({ minLength }) =>\n    formatString(validatorMessages.minLength, minLength),\n  isValid: ({ minLength, value }) =>\n    minLength ? value.length >= minLength : true,\n};\n\nexport const maxLengthValidator: Validator<{\n  maxLength: number;\n  value: string;\n}> = {\n  key: 'tooLong',\n  message: ({ maxLength }) =>\n    formatString(validatorMessages.maxLength, maxLength),\n  isValid: ({ maxLength, value }) =>\n    maxLength ? value.length <= maxLength : true,\n};\n\nexport const patternValidator: Validator<{ pattern: string; value: string }> = {\n  key: 'patternMismatch',\n  message: validatorMessages.pattern,\n  isValid: ({ pattern, value }) =>\n    pattern ? new RegExp(pattern, 'u').test(value) : true,\n};\n\nexport const minValidator: Validator<{\n  min: number | string;\n  value: number | string;\n}> = {\n  key: 'rangeUnderflow',\n  message: ({ min }) => formatString(validatorMessages.min, min),\n  isValid: ({ min, value }) =>\n    isDefined(min)\n      ? isDefined(value) && asNumber(value) >= asNumber(min)\n      : true,\n};\n\nexport const maxValidator: Validator<{\n  max: number | string;\n  value: number | string;\n}> = {\n  key: 'rangeOverflow',\n  message: ({ max }) => formatString(validatorMessages.max, max),\n  isValid: ({ max, value }) =>\n    isDefined(max)\n      ? isDefined(value) && asNumber(value) <= asNumber(max)\n      : true,\n};\n\nexport const stepValidator: Validator<{\n  min: number | string;\n  step: number | string;\n  value: number | string;\n}> = {\n  key: 'stepMismatch',\n  message: 'Value does not conform to step constraint',\n  isValid: ({ min, step, value }) =>\n    isDefined(step)\n      ? (asNumber(value) - asNumber(min)) % asNumber(step, 1) === 0\n      : true,\n};\n\nconst emailRegex =\n  /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;\n\nexport const emailValidator: Validator<{ value: string }> = {\n  key: 'typeMismatch',\n  message: validatorMessages.email,\n  isValid: ({ value }) => emailRegex.test(value),\n};\n\nexport const urlValidator: Validator<{ value: string }> = {\n  key: 'typeMismatch',\n  message: validatorMessages.url,\n  isValid: ({ value }) => URL.canParse(value),\n};\n"]}
+{"version":3,"file":"validators.js","sourceRoot":"","sources":["../../../src/components/common/validators.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,OAAO,iBAAiB,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAW9D,MAAM,UAAU,GACd,sIAAsI,CAAC;AAEzI,MAAM,CAAC,MAAM,iBAAiB,GAGzB;IACH,GAAG,EAAE,cAAc;IACnB,OAAO,EAAE,iBAAiB,CAAC,QAAQ;IACnC,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;CAC9D,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAG/B;IACH,GAAG,EAAE,cAAc;IACnB,OAAO,EAAE,iBAAiB,CAAC,QAAQ;IACnC,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;CACvE,CAAC;AAEF,MAAM,CAAC,MAAM,wBAAwB,GAGhC;IACH,GAAG,EAAE,cAAc;IACnB,OAAO,EAAE,iBAAiB,CAAC,QAAQ;IACnC,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC;CAChE,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAG1B;IACH,GAAG,EAAE,UAAU;IACf,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CACzB,YAAY,CAAC,iBAAiB,CAAC,SAAS,EAAE,SAAS,CAAC;IACtD,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE,CAChC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,IAAI,SAAS,CAAC,CAAC,CAAC,IAAI;CAC/C,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAG1B;IACH,GAAG,EAAE,SAAS;IACd,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CACzB,YAAY,CAAC,iBAAiB,CAAC,SAAS,EAAE,SAAS,CAAC;IACtD,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE,CAChC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,IAAI,SAAS,CAAC,CAAC,CAAC,IAAI;CAC/C,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAkD;IAC7E,GAAG,EAAE,iBAAiB;IACtB,OAAO,EAAE,iBAAiB,CAAC,OAAO;IAClC,OAAO,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE,CAC9B,OAAO,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;CACxD,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAGpB;IACH,GAAG,EAAE,gBAAgB;IACrB,OAAO,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,YAAY,CAAC,iBAAiB,CAAC,GAAG,EAAE,GAAG,CAAC;IAC9D,OAAO,EAAE,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,CAC1B,SAAS,CAAC,GAAG,CAAC;QACZ,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,QAAQ,CAAC,KAAK,CAAC,IAAI,QAAQ,CAAC,GAAG,CAAC;QACtD,CAAC,CAAC,IAAI;CACX,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAGpB;IACH,GAAG,EAAE,eAAe;IACpB,OAAO,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,YAAY,CAAC,iBAAiB,CAAC,GAAG,EAAE,GAAG,CAAC;IAC9D,OAAO,EAAE,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,CAC1B,SAAS,CAAC,GAAG,CAAC;QACZ,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,QAAQ,CAAC,KAAK,CAAC,IAAI,QAAQ,CAAC,GAAG,CAAC;QACtD,CAAC,CAAC,IAAI;CACX,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAIrB;IACH,GAAG,EAAE,cAAc;IACnB,OAAO,EAAE,2CAA2C;IACpD,OAAO,EAAE,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,CAChC,SAAS,CAAC,IAAI,CAAC;QACb,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC,KAAK,CAAC;QAC7D,CAAC,CAAC,IAAI;CACX,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAiC;IAC1D,GAAG,EAAE,cAAc;IACnB,OAAO,EAAE,iBAAiB,CAAC,KAAK;IAChC,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC;CAC/C,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAiC;IACxD,GAAG,EAAE,cAAc;IACnB,OAAO,EAAE,iBAAiB,CAAC,GAAG;IAC9B,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC;CAC5C,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAGxB;IACH,GAAG,EAAE,gBAAgB;IACrB,OAAO,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,YAAY,CAAC,iBAAiB,CAAC,GAAG,EAAE,GAAG,CAAC;IAC9D,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,EAAE,CAC1B,GAAG;QACD,CAAC,CAAC,CAAC,YAAY,CAAC,gBAAgB,CAAC,KAAK,IAAI,IAAI,IAAI,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC;QACvE,CAAC,CAAC,IAAI;CACX,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAGxB;IACH,GAAG,EAAE,eAAe;IACpB,OAAO,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,YAAY,CAAC,iBAAiB,CAAC,GAAG,EAAE,GAAG,CAAC;IAC9D,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,EAAE,CAC1B,GAAG;QACD,CAAC,CAAC,CAAC,YAAY,CAAC,mBAAmB,CAAC,KAAK,IAAI,IAAI,IAAI,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC;QAC1E,CAAC,CAAC,IAAI;CACX,CAAC","sourcesContent":["import { DateTimeUtil } from '../date-time-input/date-util.js';\nimport validatorMessages from './localization/validation-en.js';\nimport { asNumber, formatString, isDefined } from './util.js';\n\ntype ValidatorHandler<T> = (host: T) => boolean;\ntype ValidatorMessageFormat<T> = (host: T) => string;\n\nexport interface Validator<T = any> {\n  key: keyof ValidityStateFlags;\n  message: string | ValidatorMessageFormat<T>;\n  isValid: ValidatorHandler<T>;\n}\n\nconst emailRegex =\n  /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;\n\nexport const requiredValidator: Validator<{\n  required: boolean;\n  value?: unknown;\n}> = {\n  key: 'valueMissing',\n  message: validatorMessages.required,\n  isValid: ({ required, value }) => (required ? !!value : true),\n};\n\nexport const requiredNumberValidator: Validator<{\n  required: boolean;\n  value?: number | string;\n}> = {\n  key: 'valueMissing',\n  message: validatorMessages.required,\n  isValid: ({ required, value }) => (required ? isDefined(value) : true),\n};\n\nexport const requiredBooleanValidator: Validator<{\n  required: boolean;\n  checked: boolean;\n}> = {\n  key: 'valueMissing',\n  message: validatorMessages.required,\n  isValid: ({ required, checked }) => (required ? checked : true),\n};\n\nexport const minLengthValidator: Validator<{\n  minLength: number;\n  value: string;\n}> = {\n  key: 'tooShort',\n  message: ({ minLength }) =>\n    formatString(validatorMessages.minLength, minLength),\n  isValid: ({ minLength, value }) =>\n    minLength ? value.length >= minLength : true,\n};\n\nexport const maxLengthValidator: Validator<{\n  maxLength: number;\n  value: string;\n}> = {\n  key: 'tooLong',\n  message: ({ maxLength }) =>\n    formatString(validatorMessages.maxLength, maxLength),\n  isValid: ({ maxLength, value }) =>\n    maxLength ? value.length <= maxLength : true,\n};\n\nexport const patternValidator: Validator<{ pattern: string; value: string }> = {\n  key: 'patternMismatch',\n  message: validatorMessages.pattern,\n  isValid: ({ pattern, value }) =>\n    pattern ? new RegExp(pattern, 'u').test(value) : true,\n};\n\nexport const minValidator: Validator<{\n  min: number | string;\n  value: number | string;\n}> = {\n  key: 'rangeUnderflow',\n  message: ({ min }) => formatString(validatorMessages.min, min),\n  isValid: ({ min, value }) =>\n    isDefined(min)\n      ? isDefined(value) && asNumber(value) >= asNumber(min)\n      : true,\n};\n\nexport const maxValidator: Validator<{\n  max: number | string;\n  value: number | string;\n}> = {\n  key: 'rangeOverflow',\n  message: ({ max }) => formatString(validatorMessages.max, max),\n  isValid: ({ max, value }) =>\n    isDefined(max)\n      ? isDefined(value) && asNumber(value) <= asNumber(max)\n      : true,\n};\n\nexport const stepValidator: Validator<{\n  min: number | string;\n  step: number | string;\n  value: number | string;\n}> = {\n  key: 'stepMismatch',\n  message: 'Value does not conform to step constraint',\n  isValid: ({ min, step, value }) =>\n    isDefined(step)\n      ? (asNumber(value) - asNumber(min)) % asNumber(step, 1) === 0\n      : true,\n};\n\nexport const emailValidator: Validator<{ value: string }> = {\n  key: 'typeMismatch',\n  message: validatorMessages.email,\n  isValid: ({ value }) => emailRegex.test(value),\n};\n\nexport const urlValidator: Validator<{ value: string }> = {\n  key: 'typeMismatch',\n  message: validatorMessages.url,\n  isValid: ({ value }) => URL.canParse(value),\n};\n\nexport const minDateValidator: Validator<{\n  value?: Date | null;\n  min?: Date | null;\n}> = {\n  key: 'rangeUnderflow',\n  message: ({ min }) => formatString(validatorMessages.min, min),\n  isValid: ({ value, min }) =>\n    min\n      ? !DateTimeUtil.lessThanMinValue(value ?? new Date(), min, false, true)\n      : true,\n};\n\nexport const maxDateValidator: Validator<{\n  value?: Date | null;\n  max?: Date | null;\n}> = {\n  key: 'rangeOverflow',\n  message: ({ max }) => formatString(validatorMessages.max, max),\n  isValid: ({ value, max }) =>\n    max\n      ? !DateTimeUtil.greaterThanMaxValue(value ?? new Date(), max, false, true)\n      : true,\n};\n"]}

package/components/date-picker/date-picker.d.ts

@@ -0,0 +1,279 @@
+import { themeSymbol } from '../../theming/theming-decorator.js';
+import { type DateRangeDescriptor } from '../calendar/common/calendar.model.js';
+import { type IgcCalendarResourceStrings } from '../common/i18n/calendar.resources.js';
+import { IgcBaseComboBoxLikeComponent } from '../common/mixins/combo-box.js';
+import type { AbstractConstructor } from '../common/mixins/constructor.js';
+import { type Validator } from '../common/validators.js';
+import type { DatePart } from '../date-time-input/date-util.js';
+export interface IgcDatepickerEventMap {
+    igcOpening: CustomEvent<void>;
+    igcOpened: CustomEvent<void>;
+    igcClosing: CustomEvent<void>;
+    igcClosed: CustomEvent<void>;
+    igcChange: CustomEvent<Date>;
+    igcInput: CustomEvent<Date>;
+}
+declare const IgcDatePickerComponent_base: import("../common/mixins/constructor.js").Constructor<import("../common/mixins/form-associated-required.js").FormRequiredInterface & import("../common/mixins/form-associated.js").FormAssociatedElementInterface> & import("../common/mixins/constructor.js").Constructor<import("../common/mixins/event-emitter.js").EventEmitterInterface<IgcDatepickerEventMap>> & AbstractConstructor<IgcBaseComboBoxLikeComponent>;
+/**
+ * igc-date-picker is a feature rich component used for entering a date through manual text input or
+ * choosing date values from a calendar dialog that pops up.
+ *
+ * @element igc-date-picker
+ *
+ * @slot prefix - Renders content before the input.
+ * @slot suffix - Renders content after the input.
+ * @slot helper-text - Renders content below the input.
+ * @slot title - Renders content in the calendar title.
+ * @slot clear-icon - Renders a clear icon template.
+ * @slot calendar-icon - Renders the icon/content for the calendar picker.
+ * @slot calendar-icon-open - Renders the icon/content for the picker in open state.
+ * @slot actions - Renders content in the action part of the picker in open state.
+ *
+ * @fires igcOpening - Emitted just before the calendar dropdown is shown.
+ * @fires igcOpened - Emitted after the calendar dropdown is shown.
+ * @fires igcClosing - Emitted just before the calendar dropdown is hidden.
+ * @fires igcClosed - Emitted after the calendar dropdown is hidden.
+ * @fires igcChange - Emitted when the user modifies and commits the elements's value.
+ * @fires igcInput - Emitted when when the user types in the element.
+ *
+ * @csspart label - The label wrapper that renders content above the target input.
+ * @csspart container - The main wrapper that holds all main input elements.
+ * @csspart input - The native input element.
+ * @csspart prefix - The prefix wrapper.
+ * @csspart suffix - The suffix wrapper.
+ * @csspart calendar-icon - The calendar icon wrapper for closed state.
+ * @csspart calendar-icon-open - The calendar icon wrapper for opened state.
+ * @csspart clear-icon - The clear icon wrapper.
+ * @csspart actions - The actions wrapper.
+ * @csspart helper-text - The helper-text wrapper that renders content below the target input.
+ * @csspart header - The calendar header element.
+ * @csspart header-title - The calendar header title element.
+ * @csspart header-date - The calendar header date element.
+ * @csspart calendar-content - The calendar content element which contains the views and navigation elements.
+ * @csspart navigation - The calendar navigation container element.
+ * @csspart months-navigation - The calendar months navigation button element.
+ * @csspart years-navigation - The calendar years navigation button element.
+ * @csspart years-range - The calendar years range element.
+ * @csspart navigation-buttons - The calendar navigation buttons container.
+ * @csspart navigation-button - The calendar previous/next navigation button.
+ * @csspart days-view-container - The calendar days view container element.
+ * @csspart days-view - The calendar days view element.
+ * @csspart months-view - The calendar months view element.
+ * @csspart years-view - The calendar years view element.
+ * @csspart days-row - The calendar days row element.
+ * @csspart calendar-label - The calendar week header label element.
+ * @csspart week-number - The calendar week number element.
+ * @csspart week-number-inner - The calendar week number inner element.
+ * @csspart date - The calendar date element.
+ * @csspart date-inner - The calendar date inner element.
+ * @csspart first - The calendar first selected date element in range selection.
+ * @csspart last - The calendar last selected date element in range selection.
+ * @csspart inactive - The calendar inactive date element.
+ * @csspart hidden - The calendar hidden date element.
+ * @csspart weekend - The calendar weekend date element.
+ * @csspart range - The calendar range selected element.
+ * @csspart special - The calendar special date element.
+ * @csspart disabled - The calendar disabled date element.
+ * @csspart single - The calendar single selected date element.
+ * @csspart preview - The calendar range selection preview date element.
+ * @csspart month - The calendar month element.
+ * @csspart month-inner - The calendar month inner element.
+ * @csspart year - The calendar year element.
+ * @csspart year-inner - The calendar year inner element.
+ * @csspart selected - The calendar selected state for element(s). Applies to date, month and year elements.
+ * @csspart current - The calendar current state for element(s). Applies to date, month and year elements.
+ */
+export default class IgcDatePickerComponent extends IgcDatePickerComponent_base {
+    static readonly tagName = "igc-date-picker";
+    static styles: import("lit").CSSResult[];
+    protected static shadowRootOptions: {
+        delegatesFocus: boolean;
+        mode: ShadowRootMode;
+        serializable?: boolean;
+        slotAssignment?: SlotAssignmentMode;
+    };
+    private static readonly increment;
+    protected inputId: string;
+    private readonly [themeSymbol];
+    protected validators: Validator<this>[];
+    static register(): void;
+    private _value?;
+    private _activeDate?;
+    private _min?;
+    private _max?;
+    private _disabledDates?;
+    private _dateConstraints?;
+    private _displayFormat?;
+    private _inputFormat?;
+    private _rootClickController;
+    private get isDropDown();
+    private get isMaterialTheme();
+    private _input;
+    private _calendar;
+    private prefixes;
+    private suffixes;
+    private actions;
+    private helperText;
+    /**
+     * Sets the state of the datepicker dropdown.
+     * @attr
+     */
+    open: boolean;
+    /**
+     * The label of the datepicker.
+     * @attr label
+     */
+    label: string;
+    /**
+     * Determines whether the calendar is opened in a dropdown or a modal dialog
+     * @attr mode
+     */
+    mode: 'dropdown' | 'dialog';
+    /**
+     * Whether to allow typing in the input.
+     * @attr non-editable
+     */
+    nonEditable: boolean;
+    /**
+     * Makes the control a readonly field.
+     * @attr readonly
+     */
+    readOnly: boolean;
+    /**
+     * The value of the picker
+     * @attr
+     */
+    set value(value: Date | null);
+    get value(): Date | null;
+    /**
+     * Gets/Sets the date which is shown in the calendar picker and is highlighted.
+     * By default it is the current date.
+     */
+    set activeDate(value: Date);
+    get activeDate(): Date;
+    /**
+     * The minimum value required for the date picker to remain valid.
+     * @attr
+     */
+    set min(value: Date);
+    get min(): Date;
+    /**
+     * The maximum value required for the date picker to remain valid.
+     * @attr
+     */
+    set max(value: Date);
+    get max(): Date;
+    /** The orientation of the calendar header.
+     * @attr header-orientation
+     */
+    headerOrientation: 'vertical' | 'horizontal';
+    /** The orientation of the multiple months displayed in the calendar's days view.
+     *  @attr
+     */
+    orientation: 'vertical' | 'horizontal';
+    /** Determines whether the calendar hides its header.
+     * @attr hide-header
+     */
+    hideHeader: boolean;
+    /**
+     * Controls the visibility of the dates that do not belong to the current month.
+     * @attr hide-outside-days
+     */
+    hideOutsideDays: boolean;
+    /** Gets/sets disabled dates. */
+    set disabledDates(dates: DateRangeDescriptor[]);
+    get disabledDates(): DateRangeDescriptor[];
+    /** Gets/sets special dates. */
+    specialDates: DateRangeDescriptor[];
+    /**
+     * Whether the control will have outlined appearance.
+     * @attr
+     */
+    outlined: boolean;
+    /**
+     * The placeholder attribute of the control.
+     * @attr
+     */
+    placeholder: string;
+    /**
+     * The number of months displayed in the calendar.
+     * @attr visible-months
+     */
+    visibleMonths: number;
+    /**
+     * Whether to show the number of the week in the calendar.
+     * @attr show-week-numbers
+     */
+    showWeekNumbers: boolean;
+    /**
+     * Format to display the value in when not editing.
+     * Defaults to the input format if not set.
+     * @attr display-format
+     */
+    set displayFormat(value: string);
+    get displayFormat(): string;
+    /**
+     * The date format to apply on the input.
+     * Defaults to the current locale Intl.DateTimeFormat
+     * @attr input-format
+     */
+    set inputFormat(value: string);
+    get inputFormat(): string;
+    /**
+     * The locale settings used to display the value.
+     * @attr
+     */
+    locale: string;
+    /** The prompt symbol to use for unfilled parts of the mask.
+     *  @attr
+     */
+    prompt: string;
+    /** The resource strings of the calendar. */
+    resourceStrings: IgcCalendarResourceStrings;
+    protected openChange(): void;
+    /** Sets the start day of the week for the calendar. */
+    weekStart: 'sunday' | 'monday' | 'tuesday' | 'wednesday' | 'thursday' | 'friday' | 'saturday';
+    constructor();
+    connectedCallback(): void;
+    protected createRenderRoot(): HTMLElement | DocumentFragment;
+    /** Clears the input part of the component of any user input */
+    clear(): void;
+    /** Increments the passed in date part */
+    stepUp(datePart?: DatePart, delta?: number): void;
+    /** Decrements the passed in date part */
+    stepDown(datePart?: DatePart, delta?: number): void;
+    /** Selects the text in the input of the component */
+    select(): void;
+    /** Sets the text selection range in the input of the component */
+    setSelectionRange(start: number, end: number, direction?: 'none' | 'backward' | 'forward'): void;
+    setRangeText(replacement: string, start: number, end: number, mode?: 'select' | 'start' | 'end' | 'preserve'): void;
+    protected onEscapeKey(): Promise<void>;
+    protected handleFocusIn(): void;
+    protected handleFocusOut({ relatedTarget }: FocusEvent): void;
+    protected handlerCalendarIconSlotPointerDown(event: PointerEvent): void;
+    protected handleInputClick(event: Event): void;
+    protected handleAnchorClick(): Promise<void>;
+    private _shouldCloseCalendarDropdown;
+    protected handleInputChangeEvent(event: CustomEvent<Date>): void;
+    protected handleCalendarChangeEvent(event: CustomEvent<Date>): Promise<void>;
+    protected handleInputEvent(event: CustomEvent<Date>): void;
+    protected handleClosing(): void;
+    protected handleDialogClosing(event: Event): void;
+    protected handleDialogClosed(event: Event): void;
+    private setDateConstraints;
+    private renderClearIcon;
+    private renderCalendarIcon;
+    private renderCalendar;
+    protected renderActions(): import("lit-html").TemplateResult<1>;
+    protected renderPicker(id: string): import("lit-html").TemplateResult<1>;
+    private renderLabel;
+    private renderHelperText;
+    protected renderInput(id: string): import("lit-html").TemplateResult<1>;
+    protected render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'igc-date-picker': IgcDatePickerComponent;
+    }
+}
+export {};