@tixyel/streamelements 7.6.8 → 7.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -2468,7 +2468,55 @@ declare class ElementHelper {
2468
2468
  */
2469
2469
  skipWhitespaceIndex?: boolean;
2470
2470
  }): string;
2471
+ /**
2472
+ * Retrieves CSS variables defined in the stylesheets of the document for a given selector, with optional filtering and helper variable exclusion.
2473
+ * @param selector - The CSS selector to search for (default is ':root' to target global variables).
2474
+ * @param filter - A function to filter the retrieved CSS variables. It receives each variable as a [key, value] pair, along with its index and the full array of variables. Should return true to include the variable in the results.
2475
+ * @param options - Optional settings for retrieving CSS variables, including filterHelpers to exclude common helper variables (those ending with -min, -max, or -step).
2476
+ * @returns - An array of [key, value] pairs representing the CSS variables that match the selector and filter criteria.
2477
+ * @example
2478
+ * ```javascript
2479
+ * // Retrieve all CSS variables defined under :root
2480
+ * const variables = getElementCSSVariables();
2481
+ * console.log(variables);
2482
+ * // Retrieve CSS variables defined under a specific selector, e.g., .my-class
2483
+ * const classVariables = getElementCSSVariables('.my-class');
2484
+ * console.log(classVariables);
2485
+ * // Retrieve CSS variables with a custom filter, e.g., only variables that include 'color' in their name
2486
+ * const colorVariables = getElementCSSVariables(':root', ([key]) => key.includes('color'));
2487
+ * console.log(colorVariables);
2488
+ */
2489
+ getElementCSSVariables(selector?: string, filter?: ([k, v]: [string, string], i: number, array: [string, string][]) => boolean, options?: {
2490
+ filterHelpers?: boolean;
2491
+ }): [string, string][];
2492
+ /**
2493
+ * Applies CSS styles to an HTML or SVG element, supporting both standard and custom properties, as well as '!important' values.
2494
+ * @param element - The target HTML or SVG element to which the styles will be applied.
2495
+ * @param styles - An object containing CSS property-value pairs. Property names can be in camelCase or kebab-case, and values can include '!important'.
2496
+ * @example
2497
+ * ```javascript
2498
+ * CSS(document.getElementById('myElement'), {
2499
+ * backgroundColor: 'red',
2500
+ * '--custom-var': '10px',
2501
+ * color: 'blue !important',
2502
+ * });
2503
+ * ```
2504
+ */
2505
+ CSS(element: HTMLElement | SVGElement, styles: Partial<Record<keyof CSSStyleProperties | `--${string}`, CSSValue>>): void;
2506
+ /**
2507
+ * Escapes special HTML characters in a string to prevent XSS attacks and ensure safe rendering in HTML contexts.
2508
+ * @param value - The input string that may contain special HTML characters such as &, <, >, ", and '.
2509
+ * @returns A new string with special HTML characters replaced by their corresponding HTML entities.
2510
+ * @example
2511
+ * ```javascript
2512
+ * const unsafeString = '<script>alert("XSS")</script>';
2513
+ * const safeString = escapeHtml(unsafeString);
2514
+ * console.log(safeString); // Output: '&lt;script&gt;alert(&quot;XSS&quot;)&lt;/script&gt;'
2515
+ * ```
2516
+ */
2517
+ escapeHtml(value: string): string;
2471
2518
  }
2519
+ type CSSValue = string | number | null | undefined;
2472
2520
 
2473
2521
  declare class ObjectHelper {
2474
2522
  /**
@@ -3061,7 +3109,7 @@ declare class UtilsHelper {
3061
3109
  userId: string;
3062
3110
  name: string;
3063
3111
  broadcasterId?: string;
3064
- }, session: StreamElements.Session.Data, checkWithAPI?: boolean): Promise<3 | 1 | 2>;
3112
+ }, session: StreamElements.Session.Data, checkWithAPI?: boolean): Promise<1 | 2 | 3>;
3065
3113
  /**
3066
3114
  * Identifies a user based on the received event and session data, returning their ID, name, role, badges, and top status.
3067
3115
  * @param receivedEvent - The event received from the provider (Twitch or YouTube) containing user information.
@@ -3400,6 +3448,105 @@ declare class AnimateHelper {
3400
3448
  sequence(animations: AnimResult[], delayFrames?: number | number[]): AnimResult;
3401
3449
  }
3402
3450
 
3451
+ declare class SEHelper {
3452
+ /**
3453
+ * Assign StreamElements custom field schemas from a given data object, with optional prefixing and grouping
3454
+ * @param data - Object containing StreamElements custom field schemas to assign
3455
+ * @param prefix - Optional string to prefix each field key with
3456
+ * @param assign - Optional object to assign the resulting field schemas to (defaults to a new object)
3457
+ * @param group - Optional string to group the fields under (will use existing group if not provided)
3458
+ * @returns - Object containing the assigned StreamElements custom field schemas
3459
+ * @example
3460
+ * ```javascript
3461
+ * const data = {
3462
+ * 'field1': { type: 'text', label: 'Field 1', value: 'Value 1' },
3463
+ * 'field2': { type: 'colorpicker', label: 'Field 2', value: '#ff0000' },
3464
+ * 'field3': { type: 'number', label: 'Field 3', value: 10, min: 0, max: 100, step: 1 },
3465
+ * }
3466
+ *
3467
+ * const fields = assignFields(data, 'prefix-', {}, 'Group 1');
3468
+ *
3469
+ * console.log(fields);
3470
+ * // Output:
3471
+ * // {
3472
+ * // 'prefix-field1': { type: 'text', label: 'Field 1', value: 'Value 1', group: 'Group 1' },
3473
+ * // 'prefix-field2': { type: 'colorpicker', label: 'Field 2', value: '#ff0000', group: 'Group 1' },
3474
+ * // 'prefix-field3': { type: 'number', label: 'Field 3', value: 10, min: 0, max: 100, step: 1, group: 'Group 1' },
3475
+ * // }
3476
+ * ```
3477
+ */
3478
+ assignFields(data: Record<string, StreamElements.CustomField.Schema>, prefix?: string, assign?: Record<string, StreamElements.CustomField.Schema>, group?: string): Record<string, StreamElements.CustomField.Schema> | undefined;
3479
+ /**
3480
+ * Check for errors in StreamElements custom fields and throw an error if any are found
3481
+ * @param fields - Object containing StreamElements custom field schemas to check for errors
3482
+ * @throws Will throw an error if any custom field has a label that includes 'undefined', if a non-hidden/button field has an undefined value, or if a hidden/button field has an undefined label
3483
+ * @example
3484
+ * ```javascript
3485
+ * const fields = {
3486
+ * 'field1': { type: 'text', label: 'Field 1', value: 'Value 1' },
3487
+ * 'field2': { type: 'colorpicker', label: 'Field 2', value: '#ff0000' },
3488
+ * 'field3': { type: 'hidden', label: 'Hidden Field' },
3489
+ * 'field4': { type: 'button', label: 'Button Field' },
3490
+ * 'field5': { type: 'text', label: 'Undefined Value Field' },
3491
+ * }
3492
+ *
3493
+ * checkFieldErrors(fields);
3494
+ *
3495
+ * // Output:
3496
+ * // Error: StreamElements custom fields have errors: field5 (Undefined Value Field)
3497
+ * ```
3498
+ */
3499
+ checkFieldErrors(fields: Record<string, StreamElements.CustomField.Schema>): void;
3500
+ /**
3501
+ * Transform CSS variables into StreamElements custom fields
3502
+ * @param data - Array of CSS variable entries (name and value)
3503
+ * @param method - Whether to determine field type based on variable name or value
3504
+ * @param replace - Function to modify the field label based on the variable name
3505
+ * @param subgroup - Function to determine subgrouping of fields based on variable name and value
3506
+ * @returns - Object containing StreamElements custom field schemas
3507
+ * @example
3508
+ * ```javascript
3509
+ * const cssVariables = [
3510
+ * ['--primary-gradient-color', '#ff0000'],
3511
+ * ['--secondary-gradient-color', '#00ff00'],
3512
+ * ];
3513
+ * const fields = transformCSSIntoFields(
3514
+ * cssVariables,
3515
+ * 'name',
3516
+ * (x) => x.replace('gradient', '').trim(),
3517
+ * (key, value) => {
3518
+ * if (key.includes('gradient')) return 'Gradients';
3519
+ * return null;
3520
+ * }
3521
+ * );
3522
+ *
3523
+ * console.log(fields);
3524
+ *
3525
+ * /* Output:
3526
+ * {
3527
+ * '/Gradients': {
3528
+ * type: 'hidden',
3529
+ * label: 'Gradients',
3530
+ * },
3531
+ * '--primary-gradient-color': {
3532
+ * type: 'colorpicker',
3533
+ * label: 'Primary color',
3534
+ * value: '#ff0000',
3535
+ * },
3536
+ * '--secondary-gradient-color': {
3537
+ * type: 'colorpicker',
3538
+ * label: 'Secondary color',
3539
+ * value: '#00ff00',
3540
+ * },
3541
+ * }
3542
+ * ```
3543
+ */
3544
+ transformCSSIntoFields(data: [string, string][], method?: 'name' | 'value', replace?: (name: string) => string, subgroup?: (key: string, value: string) => string | null): Record<string, StreamElements.CustomField.Schema>;
3545
+ splitFieldLabel(keyPrefix: string, text: string, maxLabelLength?: number): {
3546
+ [k: string]: StreamElements.CustomField.Schema;
3547
+ };
3548
+ }
3549
+
3403
3550
  declare namespace Helper {
3404
3551
  const animate: AnimateHelper;
3405
3552
  const number: NumberHelper;
@@ -3413,6 +3560,7 @@ declare namespace Helper {
3413
3560
  const random: RandomHelper;
3414
3561
  const fn: FunctionHelper;
3415
3562
  const utils: UtilsHelper;
3563
+ const streamelements: SEHelper;
3416
3564
  }
3417
3565
 
3418
3566
  declare class Emulator {