11461313333

Committed 22 Oct 2024 01:31PM UTC coverage: 98.267% (-0.04%) from 98.309%

Build # 11461313333

Build Type

Pull #1352

github

Committed by

web-flow

Commit Message

Merge e14da4a63 into a1a7423cc

Pull Request Pull Request #1352: Refactor Tab component

Run Details

3834 of 4035 branches covered (95.02%)

Branch coverage included in aggregate %.

368 of 370 new or added lines in 4 files covered. (99.46%)

15 existing lines in 1 file now uncovered.

24397 of 24694 relevant lines covered (98.8%)

454.16 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

92.41

/src/components/common/util.ts

export interface PartNameInfo {
  readonly [name: string]: string | boolean | number;
}

export const partNameMap = (partNameInfo: PartNameInfo) => {
  return Object.keys(partNameInfo)
    .filter((key) => partNameInfo[key])
    .join(' ');
};

export function noop() {}

export const asPercent = (part: number, whole: number) => (part / whole) * 100;

export const clamp = (number: number, min: number, max: number) =>
  Math.max(min, Math.min(number, max));

export function numberInRangeInclusive(
  value: number,
  min: number,
  max: number
) {
  return value >= min && value <= max;
}

export function sameObject(a: object, b: object) {
  return JSON.stringify(a) === JSON.stringify(b);
}

/**
 *
 * Returns an element's offset relative to its parent. Similar to element.offsetTop and element.offsetLeft, except the
 * parent doesn't have to be positioned relative or absolute.
 *
 * Work around for the following issues in Chromium based browsers:
 *
 * https://bugs.chromium.org/p/chromium/issues/detail?id=1330819
 * https://bugs.chromium.org/p/chromium/issues/detail?id=1334556
 *
 */
export function getOffset(element: HTMLElement, parent: HTMLElement) {
  const { top, left, bottom, right } = element.getBoundingClientRect();
  const {
    top: pTop,
    left: pLeft,
    bottom: pBottom,
    right: pRight,
  } = parent.getBoundingClientRect();

  return {
    top: Math.round(top - pTop),
    left: Math.round(left - pLeft),
    right: Math.round(right - pRight),
    bottom: Math.round(bottom - pBottom),
  };
}

export function createCounter() {
  let i = 0;
  return () => {
    i++;
    return i;
  };
}

/**
 * Returns whether an element has a Left-to-Right directionality.
 */
export function isLTR(element: HTMLElement) {
  return element.matches(':dir(ltr)');
}

/**
 * Builds a string from format specifiers and replacement parameters.
 * Will coerce non-string parameters to their string representations.
 *
 * @example
 * ```typescript
 * formatString('{0} says "{1}".', 'John', 'Hello'); // 'John says "Hello".'
 * formatString('{1} is greater than {0}', 0, 1); // '1 is greater than 0'
 * ```
 */
export function formatString(template: string, ...params: unknown[]): string {
  const length = params.length;

  return template.replace(/{(\d+)}/g, (match: string, index: number) =>
    index >= length ? match : `${params[index]}`
  );
}

/**
 * Parse the passed `value` as a number or return the `fallback` if it can't be done.
 *
 * @example
 * ```typescript
 * asNumber('5'); // 5
 * asNumber('3.14'); // 3.14
 * asNumber('five'); // 0
 * asNUmber('five', 5); // 5
 * ```
 */
export function asNumber(value: unknown, fallback = 0) {
  const parsed = Number.parseFloat(value as string);
  return Number.isNaN(parsed) ? fallback : parsed;
}

/**
 * Returns the value wrapped between the min and max bounds.
 *
 * If the value is greater than max, returns the min and vice-versa.
 * If the value is between the bounds, it is returned unchanged.
 *
 * @example
 * ```typescript
 * wrap(1, 4, 2); // 2
 * wrap(1, 4, 5); // 1
 * wrap(1, 4, -1); // 4
 * ```
 */
export function wrap(min: number, max: number, value: number) {
  if (value < min) {
    return max;
  }
  if (value > max) {
    return min;
  }

  return value;
}

export function isDefined<T = unknown>(value: T) {
  return value !== undefined;
}

export function* iterNodes<T = Node>(
  root: Node,
  whatToShow?: keyof typeof NodeFilter,
  filter?: (node: T) => boolean
): Generator<T> {
  if (!isDefined(globalThis.document)) {
    return;
  }

  const iter = globalThis.document.createTreeWalker(
    root,
    NodeFilter[whatToShow ?? 'SHOW_ALL']
  );

  let node = iter.nextNode() as T;

  while (node) {
    if (filter) {
      if (filter(node)) {
        yield node;
      }
    } else {
      yield node;
    }

    node = iter.nextNode() as T;
  }
}

export function getElementByIdFromRoot(root: HTMLElement, id: string) {
  return (root.getRootNode() as Document | ShadowRoot).getElementById(id);
}

export function isElement(node: unknown): node is Element {
  return node instanceof Node && node.nodeType === Node.ELEMENT_NODE;
}

export function getElementsFromEventPath<T extends Element>(event: Event) {
  return event.composedPath().filter((item) => isElement(item)) as T[];
}

export function findElementFromEventPath<T extends Element>(
  predicate: string | ((element: Element) => boolean),
  event: Event
) {
  const func = isString(predicate)
    ? (e: Element) => e.matches(predicate)
    : (e: Element) => predicate(e);

  return getElementsFromEventPath(event).find(func) as T | undefined;
}

export function groupBy<T>(array: T[], key: keyof T | ((item: T) => any)) {
  const result: Record<string, T[]> = {};
  const _get = isFunction(key) ? key : (item: T) => item[key];

  for (const item of array) {
    const category = _get(item);
    const group = result[category];

    if (Array.isArray(group)) {
      group.push(item);
    } else {
      result[category] = [item];
    }
  }

  return result;
}

export function first<T>(arr: T[]) {
  return arr.at(0) as T;
}

export function last<T>(arr: T[]) {
  return arr.at(-1) as T;
}

export function modulo(n: number, d: number) {
  return ((n % d) + d) % d;
}

/**
 * Creates an array of `n` elements from a given iterator.
 *
 */
export function take<T>(iterable: IterableIterator<T>, n: number) {
  const result: T[] = [];
  let i = 0;
  let current = iterable.next();

  while (i < n && !current.done) {
    result.push(current.value);
    current = iterable.next();
    i++;
  }

  return result;
}

/**
 * Splits an array into chunks of length `size` and returns a generator
 * yielding each chunk.
 * The last chunk may contain less than `size` elements.
 *
 * @example
 * ```typescript
 * const arr = [0,1,2,3,4,5,6,7,8,9];
 *
 * Array.from(chunk(arr, 2)) // [[0, 1], [2, 3], [4, 5], [6, 7], [8, 9]]
 * Array.from(chunk(arr, 3)) // [[0, 1, 2], [3, 4, 5], [6, 7, 8], [9]]
 * Array.from(chunk([], 3)) // []
 * Array.from(chunk(arr, -3)) // Error
 * ```
 */
export function* chunk<T>(arr: T[], size: number) {
  if (size < 1) {
    throw new Error('size must be an integer >= 1');
  }
  for (let i = 0; i < arr.length; i += size) {
    yield arr.slice(i, i + size);
  }
}

export function splitToWords(text: string) {
  const input = text.replaceAll(/[^a-zA-Z0-9\s-_]/g, '');
  if (/[\s-_]+/.test(input)) return input.split(/[\s-_]+/);
  return input.split(/(?=[A-Z])+/);
}

export function toKebabCase(text: string): string {
  const input = text.trim();
  return splitToWords(input).join('-').toLocaleLowerCase();
}

export function isFunction(value: unknown): value is CallableFunction {
  return typeof value === 'function';
}

export function isString(value: unknown): value is string {
  return typeof value === 'string';
}

/**
 * Returns whether a given collection has at least one member.
 */
export function isEmpty<T, U extends string>(
  x: ArrayLike<T> | Set<T> | Map<U, T>
): boolean {
  return 'length' in x ? x.length < 1 : x.size < 1;
}

export function scrollIntoView(
  element?: HTMLElement,
  config?: ScrollIntoViewOptions
): void {
  if (!element) {
    return;
  }

  element.scrollIntoView(
    Object.assign(
      {
        behavior: 'auto',
        block: 'nearest',
        inline: 'nearest',
      },
      config
    )
  );
}

1	export interface PartNameInfo {	58✔
2	readonly [name: string]: string \| boolean \| number;	58✔
3	}	58✔
4		58✔
5	export const partNameMap = (partNameInfo: PartNameInfo) => {	58✔
6	return Object.keys(partNameInfo)	42,052✔
7	.filter((key) => partNameInfo[key])	42,052✔
8	.join(' ');	42,052✔
9	};	42,052✔
10		58✔
11	export function noop() {}	58✔
12		58✔
13	export const asPercent = (part: number, whole: number) => (part / whole) * 100;	58✔
14		58✔
15	export const clamp = (number: number, min: number, max: number) =>	58✔
16	Math.max(min, Math.min(number, max));	58✔
17		58✔
18	export function numberInRangeInclusive(	58✔
19	value: number,	4✔
20	min: number,	4✔
21	max: number	4✔
22	) {	4✔
23	return value >= min && value <= max;	4!
24	}	4✔
25		58✔
26	export function sameObject(a: object, b: object) {	58✔
27	return JSON.stringify(a) === JSON.stringify(b);	621✔
28	}	621✔
29		58✔
30	/**	58✔
31	*	58✔
32	* Returns an element's offset relative to its parent. Similar to element.offsetTop and element.offsetLeft, except the	58✔
33	* parent doesn't have to be positioned relative or absolute.	58✔
34	*	58✔
35	* Work around for the following issues in Chromium based browsers:	58✔
36	*	58✔
37	* https://bugs.chromium.org/p/chromium/issues/detail?id=1330819	58✔
38	* https://bugs.chromium.org/p/chromium/issues/detail?id=1334556	58✔
39	*	58✔
40	*/	58✔
41	export function getOffset(element: HTMLElement, parent: HTMLElement) {	58✔
UNCOV 42	const { top, left, bottom, right } = element.getBoundingClientRect();	×
UNCOV 43	const {	×
UNCOV 44	top: pTop,	×
UNCOV 45	left: pLeft,	×
UNCOV 46	bottom: pBottom,	×
UNCOV 47	right: pRight,	×
UNCOV 48	} = parent.getBoundingClientRect();	×
UNCOV 49		×
UNCOV 50	return {	×
UNCOV 51	top: Math.round(top - pTop),	×
UNCOV 52	left: Math.round(left - pLeft),	×
UNCOV 53	right: Math.round(right - pRight),	×
UNCOV 54	bottom: Math.round(bottom - pBottom),	×
UNCOV 55	};	×
UNCOV 56	}	×
57		58✔
58	export function createCounter() {	58✔
59	let i = 0;	133✔
60	return () => {	133✔
61	i++;	2,028✔
62	return i;	2,028✔
63	};	133✔
64	}	133✔
65		58✔
66	/**	58✔
67	* Returns whether an element has a Left-to-Right directionality.	58✔
68	*/	58✔
69	export function isLTR(element: HTMLElement) {	58✔
70	return element.matches(':dir(ltr)');	2,901✔
71	}	2,901✔
72		58✔
73	/**	58✔
74	* Builds a string from format specifiers and replacement parameters.	58✔
75	* Will coerce non-string parameters to their string representations.	58✔
76	*	58✔
77	* @example	58✔
78	* ```typescript	58✔
79	* formatString('{0} says "{1}".', 'John', 'Hello'); // 'John says "Hello".'	58✔
80	* formatString('{1} is greater than {0}', 0, 1); // '1 is greater than 0'	58✔
81	* ```	58✔
82	*/	58✔
83	export function formatString(template: string, ...params: unknown[]): string {	58✔
84	const length = params.length;	601✔
85		601✔
86	return template.replace(/{(\d+)}/g, (match: string, index: number) =>	601✔
87	index >= length ? match : `${params[index]}`	874✔
88	);	601✔
89	}	601✔
90		58✔
91	/**	58✔
92	* Parse the passed `value` as a number or return the `fallback` if it can't be done.	58✔
93	*	58✔
94	* @example	58✔
95	* ```typescript	58✔
96	* asNumber('5'); // 5	58✔
97	* asNumber('3.14'); // 3.14	58✔
98	* asNumber('five'); // 0	58✔
99	* asNUmber('five', 5); // 5	58✔
100	* ```	58✔
101	*/	58✔
102	export function asNumber(value: unknown, fallback = 0) {	58✔
103	const parsed = Number.parseFloat(value as string);	302✔
104	return Number.isNaN(parsed) ? fallback : parsed;	302✔
105	}	302✔
106		58✔
107	/**	58✔
108	* Returns the value wrapped between the min and max bounds.	58✔
109	*	58✔
110	* If the value is greater than max, returns the min and vice-versa.	58✔
111	* If the value is between the bounds, it is returned unchanged.	58✔
112	*	58✔
113	* @example	58✔
114	* ```typescript	58✔
115	* wrap(1, 4, 2); // 2	58✔
116	* wrap(1, 4, 5); // 1	58✔
117	* wrap(1, 4, -1); // 4	58✔
118	* ```	58✔
119	*/	58✔
120	export function wrap(min: number, max: number, value: number) {	58✔
121	if (value < min) {	37✔
122	return max;	11✔
123	}	11✔
124	if (value > max) {	37✔
125	return min;	3✔
126	}	3✔
127		23✔
128	return value;	23✔
129	}	23✔
130		58✔
131	export function isDefined<T = unknown>(value: T) {	58✔
132	return value !== undefined;	1,400✔
133	}	1,400✔
134		58✔
135	export function* iterNodes<T = Node>(	58✔
136	root: Node,	1,054✔
137	whatToShow?: keyof typeof NodeFilter,	1,054✔
138	filter?: (node: T) => boolean	1,054✔
139	): Generator<T> {	1,054✔
140	if (!isDefined(globalThis.document)) {	1,054!
141	return;	×
142	}	×
143		1,054✔
144	const iter = globalThis.document.createTreeWalker(	1,054✔
145	root,	1,054✔
146	NodeFilter[whatToShow ?? 'SHOW_ALL']	1,054!
147	);	1,054✔
148		1,054✔
149	let node = iter.nextNode() as T;	1,054✔
150		1,054✔
151	while (node) {	1,054✔
152	if (filter) {	10,810✔
153	if (filter(node)) {	10,810✔
154	yield node;	4,254✔
155	}	4,254✔
156	} else {	10,810!
157	yield node;	×
158	}	×
159		10,810✔
160	node = iter.nextNode() as T;	10,810✔
161	}	10,810✔
162	}	1,054✔
163		58✔
164	export function getElementByIdFromRoot(root: HTMLElement, id: string) {	58✔
165	return (root.getRootNode() as Document \| ShadowRoot).getElementById(id);	100✔
166	}	100✔
167		58✔
168	export function isElement(node: unknown): node is Element {	58✔
169	return node instanceof Node && node.nodeType === Node.ELEMENT_NODE;	11,317✔
170	}	11,317✔
171		58✔
172	export function getElementsFromEventPath<T extends Element>(event: Event) {	58✔
173	return event.composedPath().filter((item) => isElement(item)) as T[];	1,143✔
174	}	1,143✔
175		58✔
176	export function findElementFromEventPath<T extends Element>(	58✔
177	predicate: string \| ((element: Element) => boolean),	1,143✔
178	event: Event	1,143✔
179	) {	1,143✔
180	const func = isString(predicate)	1,143✔
181	? (e: Element) => e.matches(predicate)	1,143✔
182	: (e: Element) => predicate(e);	1,143✔
183		1,143✔
184	return getElementsFromEventPath(event).find(func) as T \| undefined;	1,143✔
185	}	1,143✔
186		58✔
187	export function groupBy<T>(array: T[], key: keyof T \| ((item: T) => any)) {	58✔
188	const result: Record<string, T[]> = {};	300✔
189	const _get = isFunction(key) ? key : (item: T) => item[key];	300!
190		300✔
191	for (const item of array) {	300✔
192	const category = _get(item);	1,748✔
193	const group = result[category];	1,748✔
194		1,748✔
195	if (Array.isArray(group)) {	1,748✔
196	group.push(item);	1,156✔
197	} else {	1,748✔
198	result[category] = [item];	592✔
199	}	592✔
200	}	1,748✔
201		300✔
202	return result;	300✔
203	}	300✔
204		58✔
205	export function first<T>(arr: T[]) {	58✔
206	return arr.at(0) as T;	11,480✔
207	}	11,480✔
208		58✔
209	export function last<T>(arr: T[]) {	58✔
210	return arr.at(-1) as T;	9,607✔
211	}	9,607✔
212		58✔
213	export function modulo(n: number, d: number) {	58✔
214	return ((n % d) + d) % d;	976✔
215	}	976✔
216		58✔
217	/**	58✔
218	* Creates an array of `n` elements from a given iterator.	58✔
219	*	58✔
220	*/	58✔
221	export function take<T>(iterable: IterableIterator<T>, n: number) {	58✔
222	const result: T[] = [];	405✔
223	let i = 0;	405✔
224	let current = iterable.next();	405✔
225		405✔
226	while (i < n && !current.done) {	405✔
227	result.push(current.value);	2,835✔
228	current = iterable.next();	2,835✔
229	i++;	2,835✔
230	}	2,835✔
231		405✔
232	return result;	405✔
233	}	405✔
234		58✔
235	/**	58✔
236	* Splits an array into chunks of length `size` and returns a generator	58✔
237	* yielding each chunk.	58✔
238	* The last chunk may contain less than `size` elements.	58✔
239	*	58✔
240	* @example	58✔
241	* ```typescript	58✔
242	* const arr = [0,1,2,3,4,5,6,7,8,9];	58✔
243	*	58✔
244	* Array.from(chunk(arr, 2)) // [[0, 1], [2, 3], [4, 5], [6, 7], [8, 9]]	58✔
245	* Array.from(chunk(arr, 3)) // [[0, 1, 2], [3, 4, 5], [6, 7, 8], [9]]	58✔
246	* Array.from(chunk([], 3)) // []	58✔
247	* Array.from(chunk(arr, -3)) // Error	58✔
248	* ```	58✔
249	*/	58✔
250	export function* chunk<T>(arr: T[], size: number) {	58✔
251	if (size < 1) {	481!
252	throw new Error('size must be an integer >= 1');	×
253	}	×
254	for (let i = 0; i < arr.length; i += size) {	481✔
255	yield arr.slice(i, i + size);	2,771✔
256	}	2,771✔
257	}	481✔
258		58✔
259	export function splitToWords(text: string) {	58✔
260	const input = text.replaceAll(/[^a-zA-Z0-9\s-_]/g, '');	3,994✔
261	if (/[\s-_]+/.test(input)) return input.split(/[\s-_]+/);	3,994!
262	return input.split(/(?=[A-Z])+/);	3,994✔
263	}	3,994✔
264		58✔
265	export function toKebabCase(text: string): string {	58✔
266	const input = text.trim();	3,994✔
267	return splitToWords(input).join('-').toLocaleLowerCase();	3,994✔
268	}	3,994✔
269		58✔
270	export function isFunction(value: unknown): value is CallableFunction {	58✔
271	return typeof value === 'function';	530✔
272	}	530✔
273		58✔
274	export function isString(value: unknown): value is string {	58✔
275	return typeof value === 'string';	1,292✔
276	}	1,292✔
277		58✔
278	/**	58✔
279	* Returns whether a given collection has at least one member.	58✔
280	*/	58✔
281	export function isEmpty<T, U extends string>(	58✔
282	x: ArrayLike<T> \| Set<T> \| Map<U, T>	16,660✔
283	): boolean {	16,660✔
284	return 'length' in x ? x.length < 1 : x.size < 1;	16,660✔
285	}	16,660✔
286		58✔
287	export function scrollIntoView(	58✔
288	element?: HTMLElement,	146✔
289	config?: ScrollIntoViewOptions	146✔
290	): void {	146✔
291	if (!element) {	146✔
292	return;	1✔
293	}	1✔
294		145✔
295	element.scrollIntoView(	145✔
296	Object.assign(	145✔
297	{	145✔
298	behavior: 'auto',	145✔
299	block: 'nearest',	145✔
300	inline: 'nearest',	145✔
301	},	145✔
302	config	145✔
303	)	145✔
304	);	145✔
305	}	145✔

IgniteUI / igniteui-webcomponents / 11461313333

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous