Missing API exports, unify event arguments naming

rkaraivanov · web-flow · commit 750ffcfc23b7 · 2025-04-10T11:59:09.000+03:00
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -8,8 +8,17 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 ### Added
 - New File Input Component(`igc-file-input`)
 
+### Deprecated
+Some event argument types have been renamed for consistency:
+- `CheckboxChangeEventArgs` deprecated, use `IgcCheckboxChangeEventArgs` instead.
+- `RadioChangeEventArgs` deprecated, use `IgcRadioChangeEventArgs` instead.
+- `IgcRangeSliderValue` deprecated, use `IgcRangeSliderValueEventArgs` instead.
+- `IgcActiveStepChangingArgs` deprecated, use `IgcActiveStepChangingEventArgs` instead.
+- `IgcActiveStepChangedArgs` deprecated, use `IgcActiveStepChangedEventArgs` instead.
+
 ### Fixed
 - Setting validation properties on a pristine non-dirty form associated element does not apply invalid styles [#1632](https://github.com/IgniteUI/igniteui-webcomponents/issues/1632)
+- Exposed `IgcCalendarResourceStrings`, `PopoverPlacement` (Dropdown and Select) and `IgcTreeSelectionEventArgs` from the public API
 
 ## [5.3.0] - 2025-03-13
 ### Added
diff --git a/src/components/checkbox/checkbox-base.ts b/src/components/checkbox/checkbox-base.ts
@@ -14,13 +14,16 @@ import {
 import { isEmpty } from '../common/util.js';
 import { checkBoxValidators } from './validators.js';
 
-export interface CheckboxChangeEventArgs {
+export interface IgcCheckboxChangeEventArgs {
   checked: boolean;
   value?: string;
 }
 
+/** @deprecated use IgcCheckboxChangeEventArgs instead */
+export type CheckboxChangeEventArgs = IgcCheckboxChangeEventArgs;
+
 export interface IgcCheckboxComponentEventMap {
-  igcChange: CustomEvent<CheckboxChangeEventArgs>;
+  igcChange: CustomEvent<IgcCheckboxChangeEventArgs>;
   // For analyzer meta only:
   /* skipWCPrefix */
   focus: FocusEvent;
diff --git a/src/components/common/util.ts b/src/components/common/util.ts
@@ -334,3 +334,8 @@ export function roundByDPR(value: number): number {
   const dpr = globalThis.devicePixelRatio || 1;
   return Math.round(value * dpr) / dpr;
 }
+
+/** Required utility type for specific props */
+export type RequiredProps<T, K extends keyof T> = T & {
+  [P in K]-?: T[P];
+};
diff --git a/src/components/dropdown/dropdown.ts b/src/components/dropdown/dropdown.ts
@@ -34,7 +34,9 @@ import {
   getElementByIdFromRoot,
   isString,
 } from '../common/util.js';
-import IgcPopoverComponent, { type IgcPlacement } from '../popover/popover.js';
+import IgcPopoverComponent, {
+  type PopoverPlacement,
+} from '../popover/popover.js';
 import IgcDropdownGroupComponent from './dropdown-group.js';
 import IgcDropdownHeaderComponent from './dropdown-header.js';
 import IgcDropdownItemComponent from './dropdown-item.js';
@@ -123,7 +125,7 @@ export default class IgcDropdownComponent extends EventEmitterMixin<
    * @attr
    */
   @property()
-  public placement: IgcPlacement = 'bottom-start';
+  public placement: PopoverPlacement = 'bottom-start';
 
   /**
    * Determines the behavior of the component during scrolling of the parent container.
diff --git a/src/components/popover/popover.ts b/src/components/popover/popover.ts
@@ -24,7 +24,7 @@ import { styles } from './themes/light/popover.base.css.js';
 /**
  * Describes the preferred placement of a toggle component.
  */
-export type IgcPlacement =
+export type PopoverPlacement =
   | 'top'
   | 'top-start'
   | 'top-end'
@@ -95,7 +95,7 @@ export default class IgcPopoverComponent extends LitElement {
    * Where to place the floating element relative to the parent anchor element.
    */
   @property()
-  public placement: IgcPlacement = 'bottom-start';
+  public placement: PopoverPlacement = 'bottom-start';
 
   /**
    * When enabled the floating element will match the width of its parent anchor element.
diff --git a/src/components/radio/radio.ts b/src/components/radio/radio.ts
@@ -39,13 +39,16 @@ import { all } from './themes/themes.js';
 import { getGroup } from './utils.js';
 import { radioValidators } from './validators.js';
 
-export interface RadioChangeEventArgs {
+export interface IgcRadioChangeEventArgs {
   checked: boolean;
   value?: string;
 }
 
+/** @deprecated use IgcRadioChangeEventArgs instead */
+export type RadioChangeEventArgs = IgcRadioChangeEventArgs;
+
 export interface IgcRadioComponentEventMap {
-  igcChange: CustomEvent<RadioChangeEventArgs>;
+  igcChange: CustomEvent<IgcRadioChangeEventArgs>;
   // For analyzer meta only:
   /* skipWCPrefix */
   focus: FocusEvent;
diff --git a/src/components/select/select.ts b/src/components/select/select.ts
@@ -49,7 +49,9 @@ import {
 } from '../common/util.js';
 import IgcIconComponent from '../icon/icon.js';
 import IgcInputComponent from '../input/input.js';
-import IgcPopoverComponent, { type IgcPlacement } from '../popover/popover.js';
+import IgcPopoverComponent, {
+  type PopoverPlacement,
+} from '../popover/popover.js';
 import IgcValidationContainerComponent from '../validation-container/validation-container.js';
 import IgcSelectGroupComponent from './select-group.js';
 import IgcSelectHeaderComponent from './select-header.js';
@@ -225,7 +227,7 @@ export default class IgcSelectComponent extends FormAssociatedRequiredMixin(
    * @attr
    */
   @property()
-  public placement: IgcPlacement = 'bottom-start';
+  public placement: PopoverPlacement = 'bottom-start';
 
   /**
    * Determines the behavior of the component during scrolling of the parent container.
diff --git a/src/components/slider/range-slider.ts b/src/components/slider/range-slider.ts
@@ -11,20 +11,23 @@ import { IgcSliderBaseComponent } from './slider-base.js';
 import IgcSliderLabelComponent from './slider-label.js';
 
 /* blazorSuppress */
-export interface IgcRangeSliderValue {
+export interface IgcRangeSliderValueEventArgs {
   lower: number;
   upper: number;
 }
 
+/** @deprecated use IgcRangeSliderValueEventArgs instead */
+export type IgcRangeSliderValue = IgcRangeSliderValueEventArgs;
+
 export interface IgcRangeSliderComponentEventMap {
   /**
    * Emitted when a value is changed via thumb drag or keyboard interaction.
    */
-  igcInput: CustomEvent<IgcRangeSliderValue>;
+  igcInput: CustomEvent<IgcRangeSliderValueEventArgs>;
   /**
    * Emitted when a value change is committed on a thumb drag end or keyboard interaction.
    */
-  igcChange: CustomEvent<IgcRangeSliderValue>;
+  igcChange: CustomEvent<IgcRangeSliderValueEventArgs>;
 }
 
 /**
diff --git a/src/components/stepper/stepper.common.ts b/src/components/stepper/stepper.common.ts
@@ -1,13 +1,18 @@
-export interface IgcActiveStepChangingArgs {
+export interface IgcActiveStepChangingEventArgs {
   oldIndex: number;
   newIndex: number;
 }
 
-export interface IgcActiveStepChangedArgs {
+export interface IgcActiveStepChangedEventArgs {
   index: number;
 }
 
+/** @deprecated use IgcActiveStepChangingEventArgs instead */
+export type IgcActiveStepChangingArgs = IgcActiveStepChangingEventArgs;
+/** @deprecated use IgcActiveStepChangedEventArgs instead */
+export type IgcActiveStepChangedArgs = IgcActiveStepChangedEventArgs;
+
 export interface IgcStepperComponentEventMap {
-  igcActiveStepChanging: CustomEvent<IgcActiveStepChangingArgs>;
-  igcActiveStepChanged: CustomEvent<IgcActiveStepChangedArgs>;
+  igcActiveStepChanging: CustomEvent<IgcActiveStepChangingEventArgs>;
+  igcActiveStepChanged: CustomEvent<IgcActiveStepChangedEventArgs>;
 }
diff --git a/src/components/tree/tree-navigation.spec.ts b/src/components/tree/tree-navigation.spec.ts
@@ -4,7 +4,7 @@ import { spy } from 'sinon';
 import { defineComponents } from '../../index.js';
 import IgcTreeItemComponent from './tree-item.js';
 import { SLOTS, TreeTestFunctions, navigationTree } from './tree-utils.spec.js';
-import type { IgcSelectionEventArgs } from './tree.common.js';
+import type { TreeSelectionEventInit } from './tree.common.js';
 import IgcTreeComponent from './tree.js';
 import type { IgcTreeNavigationService } from './tree.navigation.js';
 
@@ -437,7 +437,7 @@ describe('Tree Navigation', () => {
     expect(topLevelItems[0].active).to.be.true;
     expect(topLevelItems[0].selected).to.be.true;
 
-    let args: IgcSelectionEventArgs = {
+    let args: TreeSelectionEventInit = {
       detail: {
         newSelection: [topLevelItems[0]],
       },
@@ -510,7 +510,7 @@ describe('Tree Navigation', () => {
     expect(treeNavService.activeItem).to.equal(topLevelItems[1]);
     expect(treeNavService.focusedItem).to.equal(topLevelItems[1]);
 
-    const args: IgcSelectionEventArgs = {
+    const args: TreeSelectionEventInit = {
       detail: {
         newSelection: [topLevelItems[1]],
       },
@@ -543,7 +543,7 @@ describe('Tree Navigation', () => {
     expect(treeNavService.activeItem).to.equal(topLevelItems[0]);
     expect(treeNavService.focusedItem).to.equal(topLevelItems[0]);
 
-    let args: IgcSelectionEventArgs = {
+    let args: TreeSelectionEventInit = {
       detail: {
         newSelection: [topLevelItems[0]],
       },
diff --git a/src/components/tree/tree-selection.spec.ts b/src/components/tree/tree-selection.spec.ts
@@ -10,7 +10,7 @@ import {
   selectedItemsTree,
   simpleTree,
 } from './tree-utils.spec.js';
-import type { IgcSelectionEventArgs } from './tree.common.js';
+import type { TreeSelectionEventInit } from './tree.common.js';
 import IgcTreeComponent from './tree.js';
 import type { IgcTreeSelectionService } from './tree.selection.js';
 
@@ -218,7 +218,7 @@ describe('Tree Selection', () => {
       initialSelection.shift();
 
       // Should emit igcSelection event w/ correct args when an item is deselected
-      let args: IgcSelectionEventArgs = {
+      let args: TreeSelectionEventInit = {
         detail: {
           newSelection: initialSelection,
         },
@@ -268,7 +268,7 @@ describe('Tree Selection', () => {
       expect(cb.checked).to.be.false;
       expect(cb.indeterminate).to.be.false;
 
-      const args: IgcSelectionEventArgs = {
+      const args: TreeSelectionEventInit = {
         detail: {
           newSelection: [...initialSelection, item12],
         },
@@ -300,7 +300,7 @@ describe('Tree Selection', () => {
         topLevelItems[1].getChildren()[1],
       ];
 
-      let args: IgcSelectionEventArgs = {
+      let args: TreeSelectionEventInit = {
         detail: {
           newSelection: [topLevelItems[0]],
         },
@@ -362,7 +362,7 @@ describe('Tree Selection', () => {
       tree.deselect();
       await elementUpdated(tree);
 
-      const args: IgcSelectionEventArgs = {
+      const args: TreeSelectionEventInit = {
         detail: {
           newSelection: [topLevelItems[2]],
         },
@@ -707,7 +707,7 @@ describe('Tree Selection', () => {
       expect(cb.checked).to.be.false;
       expect(cb.indeterminate).to.be.false;
 
-      const args: IgcSelectionEventArgs = {
+      const args: TreeSelectionEventInit = {
         detail: {
           newSelection: [...initialSelection, item211],
         },
diff --git a/src/components/tree/tree.common.ts b/src/components/tree/tree.common.ts
@@ -1,19 +1,20 @@
+import type { RequiredProps } from '../common/util.js';
 import type IgcTreeItemComponent from './tree-item.js';
 
 export interface IgcTreeComponentEventMap {
   /* alternateName: selectionChanged */
-  igcSelection: CustomEvent<TreeSelectionChange>;
+  igcSelection: CustomEvent<IgcTreeSelectionEventArgs>;
   igcItemExpanding: CustomEvent<IgcTreeItemComponent>;
   igcItemExpanded: CustomEvent<IgcTreeItemComponent>;
   igcItemCollapsing: CustomEvent<IgcTreeItemComponent>;
   igcItemCollapsed: CustomEvent<IgcTreeItemComponent>;
   igcActiveItem: CustomEvent<IgcTreeItemComponent>;
 }
-export interface IgcSelectionEventArgs {
-  detail: TreeSelectionChange;
-  cancelable: boolean;
-}
+export type TreeSelectionEventInit = RequiredProps<
+  CustomEventInit<IgcTreeSelectionEventArgs>,
+  'detail' | 'cancelable'
+>;
 
-export interface TreeSelectionChange {
+export interface IgcTreeSelectionEventArgs {
   newSelection: IgcTreeItemComponent[];
 }
diff --git a/src/components/tree/tree.selection.ts b/src/components/tree/tree.selection.ts
@@ -1,6 +1,6 @@
 import { isEmpty } from '../common/util.js';
 import type IgcTreeItemComponent from './tree-item.js';
-import type { IgcSelectionEventArgs } from './tree.common.js';
+import type { TreeSelectionEventInit } from './tree.common.js';
 import type IgcTreeComponent from './tree.js';
 
 /* blazorSuppress */
@@ -113,7 +113,7 @@ export class IgcTreeSelectionService {
       return;
     }
 
-    const args: IgcSelectionEventArgs = {
+    const args: TreeSelectionEventInit = {
       detail: {
         newSelection,
       },
@@ -182,7 +182,7 @@ export class IgcTreeSelectionService {
 
     this.calculateItemsNewSelectionState(currSelection, added, removed);
 
-    const args: IgcSelectionEventArgs = {
+    const args: TreeSelectionEventInit = {
       detail: {
         newSelection: Array.from(this.itemsToBeSelected),
       },
diff --git a/src/index.ts b/src/index.ts
@@ -83,7 +83,10 @@ export {
 export { configureTheme } from './theming/config.js';
 
 // localization objects
-export { IgcCalendarResourceStringEN } from './components/common/i18n/calendar.resources.js';
+export {
+  IgcCalendarResourceStringEN,
+  type IgcCalendarResourceStrings,
+} from './components/common/i18n/calendar.resources.js';
 
 // Event maps
 export type { IgcBannerComponentEventMap } from './components/banner/banner.js';
@@ -128,21 +131,31 @@ export type {
   WeekDays,
 } from './components/calendar/types.js';
 export { DateRangeType } from './components/calendar/types.js';
-export type { CheckboxChangeEventArgs } from './components/checkbox/checkbox-base.js';
+export type { IgcCheckboxChangeEventArgs } from './components/checkbox/checkbox-base.js';
 export { DatePart } from './components/date-time-input/date-util.js';
 export type { DatePartDeltas } from './components/date-time-input/date-util.js';
-export type { RadioChangeEventArgs } from './components/radio/radio.js';
-export type { IgcRangeSliderValue } from './components/slider/range-slider.js';
+export type { PopoverPlacement } from './components/popover/popover.js';
+export type { IgcRadioChangeEventArgs } from './components/radio/radio.js';
+export type { IgcRangeSliderValueEventArgs } from './components/slider/range-slider.js';
 export type {
-  IgcActiveStepChangingArgs,
-  IgcActiveStepChangedArgs,
+  IgcActiveStepChangingEventArgs,
+  IgcActiveStepChangedEventArgs,
 } from './components/stepper/stepper.common.js';
+export type { IgcTreeSelectionEventArgs } from './components/tree/tree.common.js';
 export type {
   ComboItemTemplate,
   ComboTemplateProps,
   FilteringOptions,
   GroupingDirection,
-  GroupingOptions,
   IgcComboChangeEventArgs,
 } from './components/combo/types.js';
 export type { IconMeta } from './components/icon/registry/types.js';
+
+// deprecated types
+export type { CheckboxChangeEventArgs } from './components/checkbox/checkbox-base.js';
+export type { RadioChangeEventArgs } from './components/radio/radio.js';
+export type { IgcRangeSliderValue } from './components/slider/range-slider.js';
+export type {
+  IgcActiveStepChangingArgs,
+  IgcActiveStepChangedArgs,
+} from './components/stepper/stepper.common.js';

Original file line number	Diff line number	Diff line change
`@@ -334,3 +334,8 @@ export function roundByDPR(value: number): number {`
`334`	`334`	`const dpr = globalThis.devicePixelRatio \|\| 1;`
`335`	`335`	`return Math.round(value * dpr) / dpr;`
`336`	`336`	`}`
	`337`	`+`
	`338`	`+/** Required utility type for specific props */`
	`339`	`+export type RequiredProps<T, K extends keyof T> = T & {`
	`340`	`+ [P in K]-?: T[P];`
	`341`	`+};`