igniteui-webcomponents 6.4.0-alpha.0 → 6.4.0-alpha.1

package/components/combo/controllers/navigation.js

@@ -1,198 +1,176 @@
-const START_INDEX = -1;
-var DIRECTION;
-(function (DIRECTION) {
-    DIRECTION[DIRECTION["Up"] = -1] = "Up";
-    DIRECTION[DIRECTION["Down"] = 1] = "Down";
-})(DIRECTION || (DIRECTION = {}));
-export class NavigationController {
+import { addKeybindings, altKey, arrowDown, arrowUp, endKey, enterKey, escapeKey, homeKey, shiftKey, spaceBar, tabKey, } from '../../common/controllers/key-bindings.js';
+export class ComboNavigationController {
+    get active() {
+        return this._active;
+    }
+    set active(value) {
+        this._active = value;
+        this.combo.requestUpdate();
+    }
     get input() {
-        return this.host.singleSelect ? this.host._input : this.host._searchInput;
+        return this._config.input.value;
     }
-    get dataState() {
-        return this.state.dataState;
+    get searchInput() {
+        return this._config.search.value;
     }
-    show() {
-        this.host._show(true);
+    get list() {
+        return this._config.list.value;
     }
-    hide() {
-        this.host._hide(true);
+    get _firstItem() {
+        return this.state.dataState.findIndex((rec) => !rec.header);
     }
-    toggleSelect(index) {
-        this.host.toggleSelect(index);
+    get _lastItem() {
+        return this.state.dataState.length - 1;
     }
-    select(index) {
-        this.host.selectByIndex(index);
+    async _hide() {
+        return await this.combo._hide(true);
     }
-    get currentItem() {
-        const item = this.active;
-        return item === START_INDEX ? START_INDEX : item;
+    async _show() {
+        return await this.combo._show(true);
     }
-    get firstItem() {
-        return this.dataState.findIndex((i) => i.header !== true);
+    _toggleSelection(index) {
+        this.combo.toggleSelect(index);
     }
-    get lastItem() {
-        return this.dataState.length - 1;
+    _select(index) {
+        this.combo.selectByIndex(index);
     }
-    scrollToActive(container, behavior = 'auto') {
-        container.element(this.active)?.scrollIntoView({
+    _scrollToActive(behavior) {
+        this.list.element(this.active)?.scrollIntoView({
             block: 'center',
-            behavior,
+            behavior: behavior ?? 'auto',
         });
-        container.requestUpdate();
+        this.list.requestUpdate();
     }
-    get active() {
-        return this._active;
-    }
-    set active(node) {
-        this._active = node;
-        this.host.requestUpdate();
-    }
-    constructor(host, state) {
-        this.host = host;
-        this.state = state;
-        this.hostHandlers = new Map(Object.entries({
-            Escape: this.escape,
-        }));
-        this.mainInputHandlers = new Map(Object.entries({
-            Escape: this.escape,
-            ArrowUp: this.hide,
-            ArrowDown: this.mainInputArrowDown,
-            Tab: this.tab,
-            Enter: this.enter,
-        }));
-        this.searchInputHandlers = new Map(Object.entries({
-            Escape: this.escape,
-            ArrowUp: this.escape,
-            ArrowDown: this.inputArrowDown,
-            Tab: this.inputArrowDown,
-        }));
-        this.listHandlers = new Map(Object.entries({
-            ArrowDown: this.arrowDown,
-            ArrowUp: this.arrowUp,
-            ' ': this.space,
-            Enter: this.enter,
-            Escape: this.escape,
-            Tab: this.tab,
-            Home: this.home,
-            End: this.end,
-        }));
-        this._active = START_INDEX;
-        this.host.addController(this);
-    }
-    home(container) {
-        this.active = this.firstItem;
-        this.scrollToActive(container, 'smooth');
-    }
-    end(container) {
-        this.active = this.lastItem;
-        this.scrollToActive(container, 'smooth');
-    }
-    space() {
-        if (this.active === START_INDEX) {
-            return;
+    _getNearestItem(start, delta) {
+        let index = start;
+        const items = this.state.dataState;
+        while (items[index + delta]?.header) {
+            index += delta;
         }
-        const item = this.dataState[this.active];
-        if (!item.header) {
-            this.toggleSelect(this.active);
+        index += delta;
+        return index >= 0 && index < items.length ? index : -1;
+    }
+    _getNextItem(delta) {
+        const next = this._getNearestItem(this._active, delta);
+        if (next === -1 && this.active === this._firstItem) {
+            this.searchInput.checkVisibility()
+                ? this.searchInput.focus()
+                : this._onEscape();
         }
+        this.active = next;
     }
-    escape() {
-        this.hide();
-        this.host.focus();
-    }
-    enter() {
-        if (this.active === START_INDEX) {
-            return;
-        }
-        const item = this.dataState[this.active];
-        if (!item.header && this.host.singleSelect) {
-            this.select(this.active);
-        }
-        this.hide();
-        requestAnimationFrame(() => this.input.select());
-        this.host.focus();
-    }
-    inputArrowDown(container) {
-        container.focus();
-        this.arrowDown(container);
-    }
-    async mainInputArrowDown(container) {
-        this.show();
-        await container.updateComplete;
-        if (this.host.singleSelect) {
-            container.focus();
-            this.arrowDown(container);
-        }
-    }
-    tab() {
-        this.hide();
-        this.host.blur();
-    }
-    arrowDown(container) {
-        this.getNextItem(DIRECTION.Down);
-        this.scrollToActive(container);
-    }
-    arrowUp(container) {
-        this.getNextItem(DIRECTION.Up);
-        this.scrollToActive(container);
-    }
-    getNextItem(direction) {
-        const next = this.getNearestItem(this.currentItem, direction);
-        if (next === -1) {
-            if (this.active === this.firstItem) {
+    constructor(combo, state, config) {
+        this.combo = combo;
+        this.state = state;
+        this._active = -1;
+        this._onSpace = () => {
+            if (this._active === -1) {
+                return;
+            }
+            const item = this.state.dataState[this._active];
+            if (!item.header) {
+                this._toggleSelection(this._active);
+            }
+        };
+        this._onEnter = async () => {
+            if (this._active === -1) {
+                return;
+            }
+            const item = this.state.dataState[this._active];
+            if (!item.header && this.combo.singleSelect) {
+                this._select(this.active);
+            }
+            if (await this._hide()) {
+                this.input.select();
+                this.combo.focus();
+            }
+        };
+        this._onTab = async ({ shiftKey }) => {
+            if (this.combo.open) {
+                if (shiftKey) {
+                    this.combo.focus();
+                }
+                await this._hide();
+            }
+        };
+        this._onEscape = async () => {
+            if (!this.combo.open) {
+                this.combo.clearSelection();
+            }
+            if (await this._hide()) {
                 this.input.focus();
-                this.active = START_INDEX;
             }
-            return;
-        }
-        this.active = next;
-    }
-    getNearestItem(startIndex, direction) {
-        let index = startIndex;
-        const items = this.dataState;
-        while (items[index + direction]?.header) {
-            index += direction;
-        }
-        index += direction;
-        if (index >= 0 && index < items.length) {
-            return index;
-        }
-        return -1;
+        };
+        this._onMainInputArrowDown = async () => {
+            if (!this.combo.open && !(await this._show())) {
+                return;
+            }
+            if (this.combo.singleSelect) {
+                this._onSearchArrowDown();
+            }
+        };
+        this._onSearchArrowDown = () => {
+            this.list.focus();
+            this._onArrowDown();
+        };
+        this._onHome = () => {
+            this.active = this._firstItem;
+            this._scrollToActive();
+        };
+        this._onEnd = () => {
+            this.active = this._lastItem;
+            this._scrollToActive();
+        };
+        this._onArrowUp = () => {
+            this._getNextItem(-1);
+            this._scrollToActive();
+        };
+        this._onArrowDown = () => {
+            this._getNextItem(1);
+            this._scrollToActive();
+        };
+        this.combo.addController(this);
+        this._config = config;
+        const bindingDefaults = {
+            triggers: ['keydownRepeat'],
+        };
+        const skip = () => this.combo.disabled;
+        addKeybindings(this.combo, { skip, bindingDefaults })
+            .set(tabKey, this._onTab, { preventDefault: false })
+            .set([shiftKey, tabKey], this._onTab, {
+            preventDefault: false,
+        })
+            .set(escapeKey, this._onEscape);
+        addKeybindings(this.combo, {
+            skip,
+            ref: this._config.input,
+            bindingDefaults,
+        })
+            .set(arrowUp, async () => await this._hide())
+            .set([altKey, arrowDown], this._onMainInputArrowDown)
+            .set(arrowDown, this._onMainInputArrowDown)
+            .set(enterKey, this._onEnter);
+        addKeybindings(this.combo, {
+            skip,
+            ref: this._config.search,
+            bindingDefaults,
+        })
+            .set(arrowUp, this._onEscape)
+            .set(arrowDown, this._onSearchArrowDown);
+        addKeybindings(this.combo, {
+            skip,
+            ref: this._config.list,
+            bindingDefaults,
+        })
+            .set(arrowUp, this._onArrowUp)
+            .set(arrowDown, this._onArrowDown)
+            .set(homeKey, this._onHome)
+            .set(endKey, this._onEnd)
+            .set(spaceBar, this._onSpace)
+            .set(enterKey, this._onEnter);
     }
-    hostConnected() { }
     hostDisconnected() {
-        this.active = START_INDEX;
-    }
-    navigateTo(item, container) {
-        this.active = this.dataState.indexOf(item);
-        this.scrollToActive(container, 'smooth');
-    }
-    navigateHost(event) {
-        if (this.hostHandlers.has(event.key)) {
-            event.preventDefault();
-            this.hostHandlers.get(event.key).call(this);
-        }
-    }
-    navigateMainInput(event, container) {
-        event.stopPropagation();
-        if (this.mainInputHandlers.has(event.key)) {
-            event.preventDefault();
-            this.mainInputHandlers.get(event.key).call(this, container);
-        }
-    }
-    navigateSearchInput(event, container) {
-        event.stopPropagation();
-        if (this.searchInputHandlers.has(event.key)) {
-            event.preventDefault();
-            this.searchInputHandlers.get(event.key).call(this, container);
-        }
-    }
-    navigateList(event, container) {
-        event.stopPropagation();
-        if (this.listHandlers.has(event.key)) {
-            event.preventDefault();
-            this.listHandlers.get(event.key).call(this, container);
-        }
+        this._active = -1;
     }
 }
 //# sourceMappingURL=navigation.js.map

package/components/combo/controllers/navigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation.js","sourceRoot":"","sources":["../../../../src/components/combo/controllers/navigation.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\n\nimport type IgcComboListComponent from '../combo-list.js';\nimport type { ComboHost, ComboRecord } from '../types.js';\nimport type { DataController } from './data.js';\n\nconst START_INDEX: Readonly<number> = -1;\n\nenum DIRECTION {\n  Up = -1,\n  Down = 1,\n}\n\nexport class NavigationController<T extends object>\n  implements ReactiveController\n{\n  protected hostHandlers = new Map(\n    Object.entries({\n      Escape: this.escape,\n    })\n  );\n\n  protected mainInputHandlers = new Map(\n    Object.entries({\n      Escape: this.escape,\n      ArrowUp: this.hide,\n      ArrowDown: this.mainInputArrowDown,\n      Tab: this.tab,\n      Enter: this.enter,\n    })\n  );\n\n  protected searchInputHandlers = new Map(\n    Object.entries({\n      Escape: this.escape,\n      ArrowUp: this.escape,\n      ArrowDown: this.inputArrowDown,\n      Tab: this.inputArrowDown,\n    })\n  );\n\n  protected listHandlers = new Map(\n    Object.entries({\n      ArrowDown: this.arrowDown,\n      ArrowUp: this.arrowUp,\n      ' ': this.space,\n      Enter: this.enter,\n      Escape: this.escape,\n      Tab: this.tab,\n      Home: this.home,\n      End: this.end,\n    })\n  );\n\n  protected _active = START_INDEX;\n\n  public get input() {\n    // @ts-expect-error protected access\n    return this.host.singleSelect ? this.host._input : this.host._searchInput;\n  }\n\n  public get dataState() {\n    return this.state.dataState;\n  }\n\n  public show() {\n    // @ts-expect-error protected access\n    this.host._show(true);\n  }\n\n  public hide() {\n    // @ts-expect-error protected access\n    this.host._hide(true);\n  }\n\n  public toggleSelect(index: number) {\n    // @ts-expect-error protected access\n    this.host.toggleSelect(index);\n  }\n\n  public select(index: number) {\n    // @ts-expect-error protected access\n    this.host.selectByIndex(index);\n  }\n\n  protected get currentItem() {\n    const item = this.active;\n    return item === START_INDEX ? START_INDEX : item;\n  }\n\n  protected get firstItem() {\n    return this.dataState.findIndex((i: ComboRecord<T>) => i.header !== true);\n  }\n\n  protected get lastItem() {\n    return this.dataState.length - 1;\n  }\n\n  protected scrollToActive(\n    container: IgcComboListComponent,\n    behavior: ScrollBehavior = 'auto'\n  ) {\n    container.element(this.active)?.scrollIntoView({\n      block: 'center',\n      behavior,\n    });\n\n    container.requestUpdate();\n  }\n\n  public get active() {\n    return this._active;\n  }\n\n  public set active(node: number) {\n    this._active = node;\n    this.host.requestUpdate();\n  }\n\n  constructor(\n    protected host: ComboHost<T>,\n    protected state: DataController<T>\n  ) {\n    this.host.addController(this);\n  }\n\n  protected home(container: IgcComboListComponent) {\n    this.active = this.firstItem;\n    this.scrollToActive(container, 'smooth');\n  }\n\n  protected end(container: IgcComboListComponent) {\n    this.active = this.lastItem;\n    this.scrollToActive(container, 'smooth');\n  }\n\n  protected space() {\n    if (this.active === START_INDEX) {\n      return;\n    }\n\n    const item = this.dataState[this.active];\n\n    if (!item.header) {\n      this.toggleSelect(this.active);\n    }\n  }\n\n  protected escape() {\n    this.hide();\n    this.host.focus();\n  }\n\n  protected enter() {\n    if (this.active === START_INDEX) {\n      return;\n    }\n\n    const item = this.dataState[this.active];\n\n    if (!item.header && this.host.singleSelect) {\n      this.select(this.active);\n    }\n\n    this.hide();\n    requestAnimationFrame(() => this.input.select());\n    this.host.focus();\n  }\n\n  protected inputArrowDown(container: IgcComboListComponent) {\n    container.focus();\n    this.arrowDown(container);\n  }\n\n  protected async mainInputArrowDown(container: IgcComboListComponent) {\n    this.show();\n    await container.updateComplete;\n\n    if (this.host.singleSelect) {\n      container.focus();\n      this.arrowDown(container);\n    }\n  }\n\n  protected tab() {\n    this.hide();\n    this.host.blur();\n  }\n\n  protected arrowDown(container: IgcComboListComponent) {\n    this.getNextItem(DIRECTION.Down);\n    this.scrollToActive(container);\n  }\n\n  protected arrowUp(container: IgcComboListComponent) {\n    this.getNextItem(DIRECTION.Up);\n    this.scrollToActive(container);\n  }\n\n  protected getNextItem(direction: DIRECTION) {\n    const next = this.getNearestItem(this.currentItem, direction);\n\n    if (next === -1) {\n      if (this.active === this.firstItem) {\n        this.input.focus();\n        this.active = START_INDEX;\n      }\n      return;\n    }\n\n    this.active = next;\n  }\n\n  protected getNearestItem(startIndex: number, direction: number) {\n    let index = startIndex;\n    const items = this.dataState;\n\n    while (items[index + direction]?.header) {\n      index += direction;\n    }\n\n    index += direction;\n\n    if (index >= 0 && index < items.length) {\n      return index;\n    }\n    return -1;\n  }\n\n  public hostConnected() {}\n\n  public hostDisconnected() {\n    this.active = START_INDEX;\n  }\n\n  public navigateTo(item: T, container: IgcComboListComponent) {\n    this.active = this.dataState.indexOf(item as ComboRecord<T>);\n    this.scrollToActive(container, 'smooth');\n  }\n\n  public navigateHost(event: KeyboardEvent) {\n    if (this.hostHandlers.has(event.key)) {\n      event.preventDefault();\n      this.hostHandlers.get(event.key)!.call(this);\n    }\n  }\n\n  public navigateMainInput(\n    event: KeyboardEvent,\n    container: IgcComboListComponent\n  ) {\n    event.stopPropagation();\n\n    if (this.mainInputHandlers.has(event.key)) {\n      event.preventDefault();\n      this.mainInputHandlers.get(event.key)!.call(this, container);\n    }\n  }\n\n  public navigateSearchInput(\n    event: KeyboardEvent,\n    container: IgcComboListComponent\n  ) {\n    event.stopPropagation();\n\n    if (this.searchInputHandlers.has(event.key)) {\n      event.preventDefault();\n      this.searchInputHandlers.get(event.key)!.call(this, container);\n    }\n  }\n\n  public navigateList(event: KeyboardEvent, container: IgcComboListComponent) {\n    event.stopPropagation();\n\n    if (this.listHandlers.has(event.key)) {\n      event.preventDefault();\n      this.listHandlers.get(event.key)!.call(this, container);\n    }\n  }\n}\n"]}
+{"version":3,"file":"navigation.js","sourceRoot":"","sources":["../../../../src/components/combo/controllers/navigation.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport type { Ref } from 'lit/directives/ref.js';\nimport {\n  addKeybindings,\n  altKey,\n  arrowDown,\n  arrowUp,\n  endKey,\n  enterKey,\n  escapeKey,\n  homeKey,\n  type KeyBindingOptions,\n  shiftKey,\n  spaceBar,\n  tabKey,\n} from '../../common/controllers/key-bindings.js';\nimport type IgcInputComponent from '../../input/input.js';\nimport type IgcComboListComponent from '../combo-list.js';\nimport type { ComboHost } from '../types.js';\nimport type { DataController } from './data.js';\n\ntype ComboNavigationConfig = {\n  /** The primary input of the combo component. */\n  input: Ref<IgcInputComponent>;\n  /** The search input of the combo component. */\n  search: Ref<IgcInputComponent>;\n  /** The combo virtualized dropdown list. */\n  list: Ref<IgcComboListComponent>;\n};\n\nexport class ComboNavigationController<T extends object> {\n  private _active = -1;\n  private _config: ComboNavigationConfig;\n\n  public get active(): number {\n    return this._active;\n  }\n\n  public set active(value: number) {\n    this._active = value;\n    this.combo.requestUpdate();\n  }\n\n  public get input(): IgcInputComponent {\n    return this._config.input.value!;\n  }\n\n  public get searchInput(): IgcInputComponent {\n    return this._config.search.value!;\n  }\n\n  public get list(): IgcComboListComponent {\n    return this._config.list.value!;\n  }\n\n  protected get _firstItem(): number {\n    return this.state.dataState.findIndex((rec) => !rec.header);\n  }\n\n  protected get _lastItem(): number {\n    return this.state.dataState.length - 1;\n  }\n\n  protected async _hide(): Promise<boolean> {\n    // @ts-expect-error: protected access\n    return await this.combo._hide(true);\n  }\n\n  protected async _show(): Promise<boolean> {\n    // @ts-expect-error: protected access\n    return await this.combo._show(true);\n  }\n\n  protected _toggleSelection(index: number): void {\n    // @ts-expect-error protected access\n    this.combo.toggleSelect(index);\n  }\n\n  protected _select(index: number): void {\n    // @ts-expect-error: protected access\n    this.combo.selectByIndex(index);\n  }\n\n  private _onSpace = (): void => {\n    if (this._active === -1) {\n      return;\n    }\n\n    const item = this.state.dataState[this._active];\n    if (!item.header) {\n      this._toggleSelection(this._active);\n    }\n  };\n\n  private _onEnter = async (): Promise<void> => {\n    if (this._active === -1) {\n      return;\n    }\n\n    const item = this.state.dataState[this._active];\n\n    if (!item.header && this.combo.singleSelect) {\n      this._select(this.active);\n    }\n\n    if (await this._hide()) {\n      this.input.select();\n      this.combo.focus();\n    }\n  };\n\n  private _onTab = async ({ shiftKey }: KeyboardEvent): Promise<void> => {\n    if (this.combo.open) {\n      if (shiftKey) {\n        // Move focus to the main input of the combo\n        // before the Shift+Tab behavior kicks in.\n        this.combo.focus();\n      }\n      await this._hide();\n    }\n  };\n\n  private _onEscape = async (): Promise<void> => {\n    if (!this.combo.open) {\n      this.combo.clearSelection();\n    }\n\n    if (await this._hide()) {\n      this.input.focus();\n    }\n  };\n\n  private _onMainInputArrowDown = async (): Promise<void> => {\n    if (!this.combo.open && !(await this._show())) {\n      return;\n    }\n\n    if (this.combo.singleSelect) {\n      this._onSearchArrowDown();\n    }\n  };\n\n  private _onSearchArrowDown = (): void => {\n    this.list.focus();\n    this._onArrowDown();\n  };\n\n  private _onHome = (): void => {\n    this.active = this._firstItem;\n    this._scrollToActive();\n  };\n\n  private _onEnd = (): void => {\n    this.active = this._lastItem;\n    this._scrollToActive();\n  };\n\n  private _onArrowUp = (): void => {\n    this._getNextItem(-1);\n    this._scrollToActive();\n  };\n\n  private _onArrowDown = (): void => {\n    this._getNextItem(1);\n    this._scrollToActive();\n  };\n\n  private _scrollToActive(behavior?: ScrollBehavior): void {\n    this.list.element(this.active)?.scrollIntoView({\n      block: 'center',\n      behavior: behavior ?? 'auto',\n    });\n\n    this.list.requestUpdate();\n  }\n\n  private _getNearestItem(start: number, delta: -1 | 1): number {\n    let index = start;\n    const items = this.state.dataState;\n\n    while (items[index + delta]?.header) {\n      index += delta;\n    }\n\n    index += delta;\n\n    return index >= 0 && index < items.length ? index : -1;\n  }\n\n  private _getNextItem(delta: -1 | 1): void {\n    const next = this._getNearestItem(this._active, delta);\n\n    if (next === -1 && this.active === this._firstItem) {\n      this.searchInput.checkVisibility() // Non single-select or disable-filtering combo configuration\n        ? this.searchInput.focus() // Delegate to search input handlers\n        : this._onEscape(); // Close dropdown and move focus back to main input\n    }\n\n    this.active = next;\n  }\n\n  constructor(\n    protected combo: ComboHost<T>,\n    protected state: DataController<T>,\n    config: ComboNavigationConfig\n  ) {\n    this.combo.addController(this as ReactiveController);\n    this._config = config;\n\n    const bindingDefaults = {\n      triggers: ['keydownRepeat'],\n    } as KeyBindingOptions;\n\n    const skip = (): boolean => this.combo.disabled;\n\n    // Combo\n    addKeybindings(this.combo, { skip, bindingDefaults })\n      .set(tabKey, this._onTab, { preventDefault: false })\n      .set([shiftKey, tabKey], this._onTab, {\n        preventDefault: false,\n      })\n      .set(escapeKey, this._onEscape);\n\n    // Main input\n    addKeybindings(this.combo, {\n      skip,\n      ref: this._config.input,\n      bindingDefaults,\n    })\n      .set(arrowUp, async () => await this._hide())\n      .set([altKey, arrowDown], this._onMainInputArrowDown)\n      .set(arrowDown, this._onMainInputArrowDown)\n      .set(enterKey, this._onEnter);\n\n    // Search input\n    addKeybindings(this.combo, {\n      skip,\n      ref: this._config.search,\n      bindingDefaults,\n    })\n      .set(arrowUp, this._onEscape)\n      .set(arrowDown, this._onSearchArrowDown);\n\n    // List\n    addKeybindings(this.combo, {\n      skip,\n      ref: this._config.list,\n      bindingDefaults,\n    })\n      .set(arrowUp, this._onArrowUp)\n      .set(arrowDown, this._onArrowDown)\n      .set(homeKey, this._onHome)\n      .set(endKey, this._onEnd)\n      .set(spaceBar, this._onSpace)\n      .set(enterKey, this._onEnter);\n  }\n\n  public hostDisconnected(): void {\n    this._active = -1;\n  }\n}\n"]}

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

@@ -151,6 +151,10 @@ export default class IgcDateRangePickerComponent extends IgcDateRangePickerCompo
     private readonly _endSuffixes;
     private readonly _actions;
     private readonly _headerDateSlotItems;
+    /**
+     * The value of the picker
+     * @attr
+     */
     set value(value: DateRangeValue | string | null | undefined);
     get value(): DateRangeValue | null;
     /**