igniteui-webcomponents 7.3.0-beta.1 → 7.3.1

package/internals/utils/events.d.ts

@@ -19,6 +19,8 @@ export declare function getElementFromPath<K extends keyof HTMLElementTagNameMap
 export declare function getElementFromPath<T extends Element>(predicate: string | ((element: Element) => boolean), event: Event): T | undefined;
 /** Reusable event listener that just stops the propagation of the event. */
 export declare function stopPropagation(event: Event): void;
+/** Reusable event listener that just prevents the default action of the event. */
+export declare function preventDefault(event: Event): void;
 /**
  * Returns whether focus has moved outside of the given host element for
  * a `focusout`/`blur` event, that is the element gaining focus is not

package/internals/utils/events.js

@@ -10,6 +10,9 @@ export function getElementFromPath(predicate, event) {
 export function stopPropagation(event) {
     event.stopPropagation();
 }
+export function preventDefault(event) {
+    event.preventDefault();
+}
 export function focusLeftHost(host, event) {
     return !host.contains(event.relatedTarget);
 }

package/internals/utils/events.js.map

@@ -1 +1 @@
-{"version":3,"file":"events.js","sourceRoot":"","sources":["../../../src/internals/utils/events.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,EAAE,qBAAqB,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AA2B7D,MAAM,UAAU,kBAAkB,CAChC,SAAmD,EACnD,KAAY;IAEZ,MAAM,IAAI,GAAG,QAAQ,CAAC,SAAS,CAAC;QAC9B,CAAC,CAAC,CAAC,CAAU,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC;QACtC,CAAC,CAAC,CAAC,CAAU,EAAE,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;IAEjC,OAAO,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,CAAC,IAAI,CAC7C,CAAC,IAAI,EAAE,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CACjB,CAAC;AAC3B,CAAC;AAGD,MAAM,UAAU,eAAe,CAAC,KAAY;IAC1C,KAAK,CAAC,eAAe,EAAE,CAAC;AAC1B,CAAC;AAOD,MAAM,UAAU,aAAa,CAAC,IAAa,EAAE,KAAiB;IAC5D,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,aAA4B,CAAC,CAAC;AAC5D,CAAC;AAMD,MAAM,UAAU,oBAAoB,CAClC,OAAgB,EAChB,KAAa,EACb,QAA4C,EAC5C,OAA2C;IAE3C,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,QAAQ,CAAC,CAAC;IACtC,MAAM,OAAO,GAAG,CAAC,GAAU,EAAE,EAAE;QAC7B,MAAM,OAAO,GAAG,OAAO,CAAC,KAAK,EAAE,CAAC;QAEhC,IAAI,CAAC,OAAO,EAAE,CAAC;YAEb,OAAO,CAAC,mBAAmB,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;YACrD,OAAO;QACT,CAAC;QAED,OAAO,qBAAqB,CAAC,OAAO,CAAC;YACnC,CAAC,CAAC,OAAO,CAAC,WAAW,CAAC,GAAG,CAAC;YAC1B,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;IACnB,CAAC,CAAC;IAEF,OAAO,CAAC,gBAAgB,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;AACpD,CAAC;AAWD,MAAM,UAAU,oBAAoB,CAGlC,MAAmB,EACnB,SAAY,EACZ,OAA2C,EAC3C,OAA2C;IAE3C,IAAI,QAAQ,EAAE,CAAC;QACb,OAAO;IACT,CAAC;IAED,MAAM,YAAY,GAAG,CAAC,KAAY,EAAE,EAAE,CACpC,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,KAAuB,CAAC,CAAC;IAEhD,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,YAAY,EAAE,OAAO,CAAC,CAAC;AAC5D,CAAC","sourcesContent":["import { isServer } from 'lit';\nimport { isElement } from './dom.js';\nimport { isEventListenerObject, isString } from './types.js';\n\n/**\n * Finds the first element in the event's composed path that matches the provided predicate, which can be either a string selector or a function.\n *\n * @param predicate - A string representing a CSS selector or a function that takes an Element and returns a boolean indicating a match.\n * @param event - The event whose composed path will be searched for the matching element.\n * @returns The first Element that matches the predicate, or undefined if no match is found.\n *\n * @example\n * ```typescript\n * // Using a string selector\n * const button = getElementFromPath('button', event);\n * ```\n * ```typescript\n * // Using a predicate function\n * const customElement = getElementFromPath((el) => el.tagName === 'MY-ELEMENT', event);\n * ```\n */\nexport function getElementFromPath<K extends keyof HTMLElementTagNameMap>(\n  predicate: K,\n  event: Event\n): HTMLElementTagNameMap[K] | undefined;\nexport function getElementFromPath<T extends Element>(\n  predicate: string | ((element: Element) => boolean),\n  event: Event\n): T | undefined;\nexport function getElementFromPath(\n  predicate: string | ((element: Element) => boolean),\n  event: Event\n) {\n  const func = isString(predicate)\n    ? (e: Element) => e.matches(predicate)\n    : (e: Element) => predicate(e);\n\n  return Iterator.from(event.composedPath()).find(\n    (item) => isElement(item) && func(item)\n  ) as Element | undefined;\n}\n\n/** Reusable event listener that just stops the propagation of the event. */\nexport function stopPropagation(event: Event): void {\n  event.stopPropagation();\n}\n\n/**\n * Returns whether focus has moved outside of the given host element for\n * a `focusout`/`blur` event, that is the element gaining focus is not\n * a descendant of the host.\n */\nexport function focusLeftHost(host: Element, event: FocusEvent): boolean {\n  return !host.contains(event.relatedTarget as Node | null);\n}\n\n/**\n * Adds an event listener that holds only a weak reference to the passed\n * `listener`, thus not preventing it from being garbage collected.\n */\nexport function addWeakEventListener(\n  element: Element,\n  event: string,\n  listener: EventListenerOrEventListenerObject,\n  options?: AddEventListenerOptions | boolean\n): void {\n  const weakRef = new WeakRef(listener);\n  const wrapped = (evt: Event) => {\n    const handler = weakRef.deref();\n\n    if (!handler) {\n      // The listener has been garbage collected - detach the wrapper as well\n      element.removeEventListener(event, wrapped, options);\n      return;\n    }\n\n    return isEventListenerObject(handler)\n      ? handler.handleEvent(evt)\n      : handler(evt);\n  };\n\n  element.addEventListener(event, wrapped, options);\n}\n\ntype EventTypeOf<T extends keyof HTMLElementEventMap | keyof WindowEventMap> =\n  (HTMLElementEventMap & WindowEventMap)[T];\n\n/**\n * Safely adds an event listener to an HTMLElement, automatically handling\n * server-side rendering environments by doing nothing if `isServer` is true.\n * This function also correctly binds the `handler`'s `this` context to the `target` element\n * and ensures proper event type inference.\n */\nexport function addSafeEventListener<\n  E extends keyof HTMLElementEventMap | keyof WindowEventMap,\n>(\n  target: HTMLElement,\n  eventName: E,\n  handler: (event: EventTypeOf<E>) => unknown,\n  options?: boolean | AddEventListenerOptions\n): void {\n  if (isServer) {\n    return;\n  }\n\n  const boundHandler = (event: Event) =>\n    handler.call(target, event as EventTypeOf<E>);\n\n  target.addEventListener(eventName, boundHandler, options);\n}\n"]}
+{"version":3,"file":"events.js","sourceRoot":"","sources":["../../../src/internals/utils/events.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,EAAE,qBAAqB,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AA2B7D,MAAM,UAAU,kBAAkB,CAChC,SAAmD,EACnD,KAAY;IAEZ,MAAM,IAAI,GAAG,QAAQ,CAAC,SAAS,CAAC;QAC9B,CAAC,CAAC,CAAC,CAAU,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC;QACtC,CAAC,CAAC,CAAC,CAAU,EAAE,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;IAEjC,OAAO,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,CAAC,IAAI,CAC7C,CAAC,IAAI,EAAE,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CACjB,CAAC;AAC3B,CAAC;AAGD,MAAM,UAAU,eAAe,CAAC,KAAY;IAC1C,KAAK,CAAC,eAAe,EAAE,CAAC;AAC1B,CAAC;AAGD,MAAM,UAAU,cAAc,CAAC,KAAY;IACzC,KAAK,CAAC,cAAc,EAAE,CAAC;AACzB,CAAC;AAOD,MAAM,UAAU,aAAa,CAAC,IAAa,EAAE,KAAiB;IAC5D,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,aAA4B,CAAC,CAAC;AAC5D,CAAC;AAMD,MAAM,UAAU,oBAAoB,CAClC,OAAgB,EAChB,KAAa,EACb,QAA4C,EAC5C,OAA2C;IAE3C,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,QAAQ,CAAC,CAAC;IACtC,MAAM,OAAO,GAAG,CAAC,GAAU,EAAE,EAAE;QAC7B,MAAM,OAAO,GAAG,OAAO,CAAC,KAAK,EAAE,CAAC;QAEhC,IAAI,CAAC,OAAO,EAAE,CAAC;YAEb,OAAO,CAAC,mBAAmB,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;YACrD,OAAO;QACT,CAAC;QAED,OAAO,qBAAqB,CAAC,OAAO,CAAC;YACnC,CAAC,CAAC,OAAO,CAAC,WAAW,CAAC,GAAG,CAAC;YAC1B,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;IACnB,CAAC,CAAC;IAEF,OAAO,CAAC,gBAAgB,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;AACpD,CAAC;AAWD,MAAM,UAAU,oBAAoB,CAGlC,MAAmB,EACnB,SAAY,EACZ,OAA2C,EAC3C,OAA2C;IAE3C,IAAI,QAAQ,EAAE,CAAC;QACb,OAAO;IACT,CAAC;IAED,MAAM,YAAY,GAAG,CAAC,KAAY,EAAE,EAAE,CACpC,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,KAAuB,CAAC,CAAC;IAEhD,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,YAAY,EAAE,OAAO,CAAC,CAAC;AAC5D,CAAC","sourcesContent":["import { isServer } from 'lit';\nimport { isElement } from './dom.js';\nimport { isEventListenerObject, isString } from './types.js';\n\n/**\n * Finds the first element in the event's composed path that matches the provided predicate, which can be either a string selector or a function.\n *\n * @param predicate - A string representing a CSS selector or a function that takes an Element and returns a boolean indicating a match.\n * @param event - The event whose composed path will be searched for the matching element.\n * @returns The first Element that matches the predicate, or undefined if no match is found.\n *\n * @example\n * ```typescript\n * // Using a string selector\n * const button = getElementFromPath('button', event);\n * ```\n * ```typescript\n * // Using a predicate function\n * const customElement = getElementFromPath((el) => el.tagName === 'MY-ELEMENT', event);\n * ```\n */\nexport function getElementFromPath<K extends keyof HTMLElementTagNameMap>(\n  predicate: K,\n  event: Event\n): HTMLElementTagNameMap[K] | undefined;\nexport function getElementFromPath<T extends Element>(\n  predicate: string | ((element: Element) => boolean),\n  event: Event\n): T | undefined;\nexport function getElementFromPath(\n  predicate: string | ((element: Element) => boolean),\n  event: Event\n) {\n  const func = isString(predicate)\n    ? (e: Element) => e.matches(predicate)\n    : (e: Element) => predicate(e);\n\n  return Iterator.from(event.composedPath()).find(\n    (item) => isElement(item) && func(item)\n  ) as Element | undefined;\n}\n\n/** Reusable event listener that just stops the propagation of the event. */\nexport function stopPropagation(event: Event): void {\n  event.stopPropagation();\n}\n\n/** Reusable event listener that just prevents the default action of the event. */\nexport function preventDefault(event: Event): void {\n  event.preventDefault();\n}\n\n/**\n * Returns whether focus has moved outside of the given host element for\n * a `focusout`/`blur` event, that is the element gaining focus is not\n * a descendant of the host.\n */\nexport function focusLeftHost(host: Element, event: FocusEvent): boolean {\n  return !host.contains(event.relatedTarget as Node | null);\n}\n\n/**\n * Adds an event listener that holds only a weak reference to the passed\n * `listener`, thus not preventing it from being garbage collected.\n */\nexport function addWeakEventListener(\n  element: Element,\n  event: string,\n  listener: EventListenerOrEventListenerObject,\n  options?: AddEventListenerOptions | boolean\n): void {\n  const weakRef = new WeakRef(listener);\n  const wrapped = (evt: Event) => {\n    const handler = weakRef.deref();\n\n    if (!handler) {\n      // The listener has been garbage collected - detach the wrapper as well\n      element.removeEventListener(event, wrapped, options);\n      return;\n    }\n\n    return isEventListenerObject(handler)\n      ? handler.handleEvent(evt)\n      : handler(evt);\n  };\n\n  element.addEventListener(event, wrapped, options);\n}\n\ntype EventTypeOf<T extends keyof HTMLElementEventMap | keyof WindowEventMap> =\n  (HTMLElementEventMap & WindowEventMap)[T];\n\n/**\n * Safely adds an event listener to an HTMLElement, automatically handling\n * server-side rendering environments by doing nothing if `isServer` is true.\n * This function also correctly binds the `handler`'s `this` context to the `target` element\n * and ensures proper event type inference.\n */\nexport function addSafeEventListener<\n  E extends keyof HTMLElementEventMap | keyof WindowEventMap,\n>(\n  target: HTMLElement,\n  eventName: E,\n  handler: (event: EventTypeOf<E>) => unknown,\n  options?: boolean | AddEventListenerOptions\n): void {\n  if (isServer) {\n    return;\n  }\n\n  const boundHandler = (event: Event) =>\n    handler.call(target, event as EventTypeOf<E>);\n\n  target.addEventListener(eventName, boundHandler, options);\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "igniteui-webcomponents",
-  "version": "7.3.0-beta.1",
+  "version": "7.3.1",
   "description": "Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.",
   "author": "Infragistics",
   "license": "MIT",
@@ -51,6 +51,8 @@
     "chat",
     "checkbox",
     "chip",
+    "color picker",
+    "color input",
     "combo",
     "date input",
     "date picker",

package/skills/README.md

@@ -15,6 +15,7 @@ Skills are structured instructions that help AI agents understand and execute co
 | [igniteui-wc-customize-component-theme](./igniteui-wc-customize-component-theme/SKILL.md)   | Customize styling using CSS custom properties, parts, and theming system           | Applying custom brand colors/styles   |
 | [igniteui-wc-generate-from-image-design](./igniteui-wc-generate-from-image-design/SKILL.md) | Implement a view from a screenshot or mockup using Ignite UI Web Components        | Converting a design image into UI     |
 | [igniteui-wc-optimize-bundle-size](./igniteui-wc-optimize-bundle-size/SKILL.md)             | Reduce bundle size by importing only needed components and lazy loading            | Optimizing production performance     |
+| [igniteui-wc-migrate-grid-lite-to-premium](./igniteui-wc-migrate-grid-lite-to-premium/SKILL.md) | Migrate from Grid Lite to the premium Data Grid                                 | Adopting enterprise grid features     |
 
 ## How to Use