@design-edito/tools 0.5.2 → 0.5.4

package/TODO.md

@@ -1,269 +0,0 @@
-# To do
-
-# -
-
-Après le dev :
-- envoyer le code à GPT + Claude, leur demander:
-  1/ s'ils comprennent le fichier, on veut juste s'assurer qu'on est raccord avec lui à ce stade
-  2/ en gardant en tête de garder le périmètre fonctionnel intact, sans chercher à faire plus ce qu'il y a actuellement, de relever les nommages ou formes de code qui pourraient être améliorées pour que le fichier soit prêt à intégrer une librairie de composants solide, durable dans le temps et facile à maintenir. Préciser qu'il faut respecter les règles de standardjs pour le lint
-- essayer de build, régler les erreurs du linter
-- après ça, fournir à GPT/Claude un exemple de fichier test d'un autre composant, Drawer par ex, + le code actuel de Subtitles, et lui demander de garder le style/approche fourni, et générer les tests pertinents pour le composant Subtitles (utiliser srtFileContents et pas src, ça va être une galère). Lui rappeler que les tests sont évalués par nodejs, donc pas trop se reposer sur des choses qui se passent dans un browser. Pas trop besoin de checker le contenu du fichier de test, moi je prends ce qu'il me donne, je lance le test et espère que ça passe tout, si ça passe pas tu peux lui donner le contenu de l'erreur et voir si il arrive à régler le truc tout seul, si ça veut vraiment pas, commente l'intégralité du test qui bloque, tant pis.
-- ensuite une fois que c'est bon, fournir à GPT/Claude un exemple de JSDOC issu d'un autre composant, Gallery par ex, + le code actuel de Subtitles, et lui demander de générer le JSDOC pour tous les exported members de Subtitles (Props et Subtitles à priori). Juste le JSDOC, pas répéter le code, parfois en générant tout il glisse des erreurs en répétant le code.
-- re build, lint et corrections éventuelles des erreurs du linter
-- pull add commit push 🎉
-
-
-# Composants
-
-## Composant Vidéo
-
-/components/Video
-
-
-### D'abord, on va reprendre new-app/src/components/VideoPlayer/MutedVideo.tsx
-Ce composant permet un workaround d'une petite bizzarerie de react avec l'attribut muted.
-Ça va être notre composant vidéo de base, pour ne pas manipuler directement l'élément html vidéo.
-
-### Ensuite, un composant tout simple :
-
-// "on" evt listeners
-// "state/props"
-// "int/obs triggers"
-// disclaimer
-// subs
-
-- une vidéo :
-```tsx
-type SourceData = {
-  src?: string
-  type?: string
-}
-type TrackData = {
-  src?: string
-  kind?: 'subtitles' | 'captions' | 'descriptions' | 'chapters' | 'metadata'
-  srclang?: string
-  label?: string
-  default?: boolean
-}
-type Props = {
-  sources?: string | string[] | SourceData[] // liste des éléments <source> dans la vidéo (ignore si pas src dans SourceData)
-  tracks?: string | string[] | TrackData[] // liste des éléments <tracks> dans la vidéo (ignore si pas src dans TrackData)
-  children?: JSX.Element // react children habituel, vient se coller sous les <source> et <tracks>
-} & VideoHTMLAttributes<HTMLVideoElement>
-
-const {
-  sources,
-  tracks,
-  children,
-  ...intrinsicVideoAttributes
-} = props
-```
-- un bouton play
-  - sur lm-video :
-  - data-play-on
-  - lm-video--play-on
-- un bouton pause
-  - sur lm-video :
-  - data-play-off
-  - lm-video--play-off
-- un span "temps écoulé"
-  - sur lm-video :
-  - data-elapsed-time-percent (0-1)
-  - data-elapsed-time-ms
-  - data-elapsed-time-readable ((hh:)mm:ss)
-- un span "temps total"
-  - sur lm-video :
-  - data-total-time-ms
-  - data-total-time-readable
-- une div cliquable en guise de timeline (pas de curseur)
-- un bouton sound on
-  - sur lm-video:
-  - data-sound-on
-  - lm-video--sound-on
-- un bouton sound off
-  - sur lm-video:
-  - data-sound-off
-  - lm-video--sound-off
-- un input range (0 - 100, step=1) pour piloter le son
-  - sur lm-video:
-  - data-sound-volume-percent (0-1) (ne se met pas à 0 si sound off, c'est deux données séparées)
-  - data-sound-volume-readable (0-100)
-- un span "volume (0-100)"
-- un bouton full screen
-  - sur lm-video:
-  - data-fullscreen-on / data-full-screen-off
-  - lm-video--fullscreen-on / lm-video--fullscreen-off
-- un bouton download
-- un input range playback-speed (0.25-4 step=0.25)
-  - sur lm-video:
-  - data-playback-speed (.25-4)
-- un span "playback speed (.25-4)"
-
-### Suite [WIP]
-
-[ ] Click sur timeline ne semble pas marcher ?
-[ ] 
-
-- Gérer la partie "controlled behavior" tout d'un coup
-[ ] Idée : quand la vidéo est en mode controlled, 
-
-
-
-
-
-
-## Composant Subtitles
-
-lm-tools/src/components/Subtitles/index.tsx
-
-```tsx
-<Subtitles
-  src='srt.file.url'
-  srtFileContent='Contenu srt brut, si présent la prop src est ignorée.'
-  subsGroups={[3, 4, 5]}
-  timecodeMs={10000}>
-</Subtitles>
-```
-
-```html
-<div class="lm-subtitles">
-  <!-- Groupe passé (donc que sub prev dedans) -->
-  <div
-    class="lm-subtitles__group lm-subtitles__group--prev"
-    data-start-sub-pos="0"
-    data-end-sub-pos="1">
-    <span class="lm-subtitles__sub lm-subtitles__sub--prev" data-sub-pos="0">
-      Some sub
-    </span>
-  </div>
-  <!-- Groupe courant (mix de sub prev, curr et next) -->
-  <div
-    class="lm-subtitles__group lm-subtitles__group--curr"
-    data-start-timecode="00:02:16,612"
-    data-end-timecode="00:02:16,612"
-    data-start-time-ms="34754382"
-    data-end-time-ms="34754382"
-    data-start-sub-pos="0"
-    data-end-sub-pos="1">
-    <span
-      class="lm-subtitles__sub lm-subtitles__sub--curr"
-      data-start-timecode="00:02:16,612"
-      data-end-timecode="00:02:16,612"
-      data-start-time-ms="34754382"
-      data-end-time-ms="34754382">
-      Some sub
-    </span>
-  </div>
-  <!-- Groupe à venir -->
-  <div
-    class="lm-subtitles__group lm-subtitles__group--prev"
-    data-start-timecode="00:02:16,612"
-    data-end-timecode="00:02:16,612"
-    data-start-time-ms="34754382"
-    data-end-time-ms="34754382"
-    data-start-sub-pos="0"
-    data-end-sub-pos="1">
-    <span
-      class="lm-subtitles__sub lm-subtitles__sub--prev"
-      data-start-timecode="00:02:16,612"
-      data-end-timecode="00:02:16,612"
-      data-start-time-ms="34754382"
-      data-end-time-ms="34754382">
-      Some sub
-    </span>
-  </div>
-</div>
-```
-
-
-
-
-# CLI Utils
-
-
-## Get diff from commit hash
-
-```ts
-export type GetDiffOptions = {
-  cwd?: string
-}
-
-// Pas certain de Array<string> mais c'est peut-être suffisant,
-// l'idée c'est d'avoir une liste descriptive des changements successifs sur un fichier (genre le contenu brut de git diff)
-export type Diff = Record<string, Array<string>>
-
-// Ou pas async si pas nécessaire
-export async function getDiffFrom (
-  commitHash: string,
-  options: GetDiffOptions = {}
-): Promise<Diff> {
-  const { cwd } = options
-  return {}
-}
-```
-
-## Generate commit message from diff
-
-```ts
-export type GenerateDiffDescriptionOptions = {
-  customPromptOrSomething?: string // juste une idée comme ça, sais pas si c'est pertinent
-  // Ptet c'est là qu'il faut dire "je veux plutôt un changelog, ou plutôt un message de commit"
-}
-
-export async function generateDiffDescription (
-  diff: Diff,
-  options: GenerateDiffDescriptionOptions = {}): Promise<string> {
-  return ''
-}
-```
-
-
-
-
-# Tests & JSDOC
-
-- [ ] Tests manquants (garder la forme describe('funcName') { it('does something') {} })
-  - [ ] agnostic/html/hyper-json -> nécessaire mais trop compliqué/long
-  - [ ] agnostic/html/placeholders -> pas nécessaire
-  - [ ] agnostic/misc/logs/make-text-block -> Manque JSDOC aussi
-  - [ ] agnostic/strings/char-codes
-  - [ ] agnostic/strings/matches
-  - [ ] agnostic/strings/parse-table
-  - [ ] agnostic/strings/to-alphanum
-  - [ ] agnostic/strings/trim
-  - [ ] agnostic/time/dates/format-date
-  - [ ] agnostic/time/duration
-  - [ ] agnostic/time/timeout
-  - [ ] agnostic/time/transitions
-  - [ ] agnostic/time/wait
-  - [ ] node/@aws-s3 - oui mais comment (valable aussi pour gcs, ftps & sftp) ?
-  - [ ] node/@design-edito - vide
-  - [ ] node/@express/@multer
-  - [ ] node/@google-cloud
-  - [ ] node/cloud-storage
-  - [ ] node/encryption
-  - [ ] node/files
-  - [ ] node/ftps
-  - [ ] node/images
-  - [ ] node/process
-  - [ ] node/sftp
-
-  - Pas utile
-  - [ ] agnostic/css/bem -> DEPRECATED
-  - [ ] agnostic/css/styles-set -> DEPRECATED
-  - [ ] agnostic/errors/register -> pas nécessaire
-  - [ ] agnostic/html/sanitization/html -> DEPRECATED
-  - [ ] agnostic/misc/assert -> DEPRECATED
-  - [ ] agnostic/misc/logs/logger -> presque DEPRECATED
-  - [ ] agnostic/misc/logs/styles -> pas nécessaire tout de suite
-  - [ ] agnostic/strings/normalize-indent -> pas nécessaire tout de suite, fonction à repenser
-  - [ ] agnostic/strings/replace-all -> DEPRECATED
-
-
-
-# Misc
-
-- [ ] Repenser agnostic/optim/throttle-debounce ?
-- [ ] Repenser agnostic/strings/normalize-indent ?
-- [ ] Get rid of namespaces in hyper-json ?
-- [ ] agnostic/misc/logs/styles, se repencher dessus, viser à substituer totalement chalk (styles génériques, bold, red, bgBlue, etc...) + continuer à exporter des "styles nommés" comme actuellement

package/components/BeforeAfter/utils.d.ts

@@ -1,4 +0,0 @@
-export declare function getRelativePointerCoordinates(event: PointerEvent, element: HTMLDivElement | null): {
-    x: number;
-    y: number;
-};

package/components/BeforeAfter/utils.js

@@ -1,9 +0,0 @@
-export function getRelativePointerCoordinates(event, element) {
-    if (element === null) {
-        return { x: 0, y: 0 };
-    }
-    const rect = element.getBoundingClientRect();
-    const x = event.clientX - rect.left;
-    const y = event.clientY - rect.top;
-    return { x, y };
-}

package/components/Input/index.controlled.d.ts

@@ -1,42 +0,0 @@
-import { type FunctionComponent, type InputHTMLAttributes, type ReactNode } from 'react';
-import type { WithClassName } from '../utils/types.js';
-/**
- * Props for the {@link ControlledInput} component.
- *
- * Extends all native {@link InputHTMLAttributes} and {@link WithClassName}
- * with optional label and error content.
- *
- * @property label - Content rendered as an associated `<label>`. When omitted, no label is rendered.
- * @property error - Content rendered as an error message below the input. When omitted, no error is rendered.
- * @property className - Additional class name(s) applied to the root element.
- */
-export type Props = InputHTMLAttributes<HTMLInputElement> & WithClassName<{
-    label?: ReactNode;
-    error?: ReactNode;
-}>;
-/**
- * Controlled input field component.
- *
- * Renders a native `<input>` element with optional label and error feedback.
- * The input value is entirely driven by the provided `value` prop and all
- * native input attributes are forwarded to the underlying element.
- *
- * A stable auto-generated `id` is created on mount and used to associate the
- * rendered label through the `htmlFor` attribute.
- *
- * ### CSS elements
- * - `label`
- * - `error`
- *
- * @param props - Component properties.
- * @see {@link Props}
- *
- * @returns A labelled controlled input with optional error feedback.
- *
- * @remarks
- * - The component does not manage its own value state.
- * - Consumers are responsible for updating `value` in response to `onChange`.
- * - Additional `className` values are merged with the component public class name
- *   and applied to the underlying `<input>` element.
- */
-export declare const ControlledInput: FunctionComponent<Props>;

package/components/Input/index.controlled.js

@@ -1,54 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import { clss } from '../../agnostic/css/clss/index.js';
-import { isNotFalsy } from '../../agnostic/booleans/is-falsy/index.js';
-import { randomHash } from '../../agnostic/random/uuid/index.js';
-import { input as publicClassName } from '../public-classnames.js';
-import { mergeClassNames } from '../utils/index.js';
-import cssModule from './styles.module.css';
-/**
- * Controlled input field component.
- *
- * Renders a native `<input>` element with optional label and error feedback.
- * The input value is entirely driven by the provided `value` prop and all
- * native input attributes are forwarded to the underlying element.
- *
- * A stable auto-generated `id` is created on mount and used to associate the
- * rendered label through the `htmlFor` attribute.
- *
- * ### CSS elements
- * - `label`
- * - `error`
- *
- * @param props - Component properties.
- * @see {@link Props}
- *
- * @returns A labelled controlled input with optional error feedback.
- *
- * @remarks
- * - The component does not manage its own value state.
- * - Consumers are responsible for updating `value` in response to `onChange`.
- * - Additional `className` values are merged with the component public class name
- *   and applied to the underlying `<input>` element.
- */
-export const ControlledInput = ({ label, error, value, className, ...rest }) => {
-    const [id] = useState(`_${randomHash(12)}`);
-    const c = clss(publicClassName, { cssModule });
-    const rootClss = mergeClassNames(c(null), className);
-    return _jsxs(_Fragment, { children: [isNotFalsy(label) && _jsx("label", { className: c('label'), htmlFor: id, children: label }), _jsx("input", { ...rest, id: id, className: rootClss, value: value ?? '', onChange: e => {
-                    const { target } = e;
-                    rest.onChange?.(e);
-                    if (value === undefined)
-                        return;
-                    if (typeof value === 'number') {
-                        target.value = `${value}`;
-                    }
-                    else if (typeof value === 'string') {
-                        target.value = value;
-                    }
-                    else {
-                        // value is readonly string[]
-                        // not supported for <input>; ignore or normalize if needed
-                    }
-                } }), isNotFalsy(error) && _jsx("span", { className: c('error'), children: error })] });
-};

package/components/Select/index.controlled.d.ts

@@ -1,43 +0,0 @@
-import { type FunctionComponent, type SelectHTMLAttributes, type ReactNode, type PropsWithChildren } from 'react';
-import type { WithClassName } from '../utils/types.js';
-/**
- * Props for the {@link ControlledSelect} component.
- *
- * Extends all native {@link SelectHTMLAttributes} and {@link WithClassName}
- * with optional label, error content, and option children.
- *
- * @property label - Content rendered as an associated `<label>`. When omitted, no label is rendered.
- * @property error - Content rendered as an error message below the select. When omitted, no error is rendered.
- * @property className - Additional class name(s) applied to the select element.
- * @property children - `<option>` or `<optgroup>` elements rendered inside the select.
- */
-export type Props = SelectHTMLAttributes<HTMLSelectElement> & PropsWithChildren<WithClassName<{
-    label?: ReactNode;
-    error?: ReactNode;
-}>>;
-/**
- * Controlled select field component.
- *
- * Renders a native `<select>` element with optional label and error feedback.
- * The selected value is entirely driven by the provided `value` prop and all
- * native select attributes are forwarded to the underlying element.
- *
- * A stable auto-generated `id` is created on mount and used to associate the
- * rendered label through the `htmlFor` attribute.
- *
- * ### CSS elements
- * - `label`
- * - `error`
- *
- * @param props - Component properties.
- * @see {@link Props}
- *
- * @returns A labelled controlled select with optional error feedback.
- *
- * @remarks
- * - The component does not manage its own selection state.
- * - Consumers are responsible for updating `value` in response to `onChange`.
- * - Additional `className` values are merged with the component public class name
- *   and applied to the underlying `<select>` element.
- */
-export declare const ControlledSelect: FunctionComponent<Props>;

package/components/Select/index.controlled.js

@@ -1,54 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import { clss } from '../../agnostic/css/clss/index.js';
-import { isNotFalsy } from '../../agnostic/booleans/is-falsy/index.js';
-import { randomHash } from '../../agnostic/random/uuid/index.js';
-import { select as publicClassName } from '../public-classnames.js';
-import { mergeClassNames } from '../utils/index.js';
-import cssModule from './styles.module.css';
-/**
- * Controlled select field component.
- *
- * Renders a native `<select>` element with optional label and error feedback.
- * The selected value is entirely driven by the provided `value` prop and all
- * native select attributes are forwarded to the underlying element.
- *
- * A stable auto-generated `id` is created on mount and used to associate the
- * rendered label through the `htmlFor` attribute.
- *
- * ### CSS elements
- * - `label`
- * - `error`
- *
- * @param props - Component properties.
- * @see {@link Props}
- *
- * @returns A labelled controlled select with optional error feedback.
- *
- * @remarks
- * - The component does not manage its own selection state.
- * - Consumers are responsible for updating `value` in response to `onChange`.
- * - Additional `className` values are merged with the component public class name
- *   and applied to the underlying `<select>` element.
- */
-export const ControlledSelect = ({ label, error, value, className, children, ...rest }) => {
-    const [id] = useState(`_${randomHash(12)}`);
-    const c = clss(publicClassName, { cssModule });
-    const rootClss = mergeClassNames(c(null), className);
-    return _jsxs(_Fragment, { children: [isNotFalsy(label) && _jsx("label", { className: c('label'), htmlFor: id, children: label }), _jsx("select", { ...rest, className: rootClss, id: id, value: value, onChange: e => {
-                    const { target } = e;
-                    rest.onChange?.(e);
-                    if (value === undefined)
-                        return;
-                    if (typeof value === 'number') {
-                        target.value = `${value}`;
-                    }
-                    else if (typeof value === 'string') {
-                        target.value = value;
-                    }
-                    else {
-                        // value is readonly string[]
-                        // not supported for <select>; ignore or normalize if needed
-                    }
-                }, children: children }), isNotFalsy(error) && _jsx("span", { className: c('error'), children: error })] });
-};

package/components/Subtitles/types.d.ts

@@ -1,24 +0,0 @@
-/**
- * A single parsed subtitle entry from an SRT file.
- *
- * @property id - Sequential subtitle number.
- * @property start - Start time in milliseconds.
- * @property end - End time in milliseconds.
- * @property content - Subtitle text content.
- */
-export type ParsedSub = {
-    id: number;
-    start?: number;
-    end?: number;
-    content?: string;
-};
-/**
- * The inclusive ID boundaries of a subtitle group.
- *
- * @property startId - ID of the first subtitle in the group.
- * @property endId - ID of the last subtitle in the group.
- */
-export type SubGroupBoundaries = {
-    startId: number;
-    endId: number;
-};

package/components/Subtitles/utils.d.ts

@@ -1,32 +0,0 @@
-import type { ParsedSub, SubGroupBoundaries } from './types.js';
-/**
- * Converts an SRT timecode (hh:mm:ss,ms) to milliseconds.
- *
- * @param timecode - Timecode string (e.g. '00:01:23,456').
- * @returns The time in milliseconds.
- */
-export declare const getTimecodeToMs: (timecode: string) => number;
-/**
- * Parses a raw SRT subtitle text into a list of {@link ParsedSub} objects.
- *
- * @param rawSubs - Raw subtitle content in SRT format.
- * @returns Array of parsed subtitle entries.
- */
-export declare const parseSubs: (rawSubs: string) => ParsedSub[];
-/**
- * Computes subtitle groups with their boundaries (startId, endId).
- *
- * @param subsGroups - Array of group-end subtitle IDs.
- * @param highestSubId - Highest subtitle ID in the track.
- * @returns Array of {@link SubGroupBoundaries}.
- */
-export declare const computeSubGroupsWithBoundaries: (subsGroups: number[] | undefined, highestSubId: number) => SubGroupBoundaries[];
-/**
- * Returns the current subtitle group based on the last preceding subtitle ID and playback state.
- *
- * @param subsGroupsWithBoundaries - Array of groups with their boundaries.
- * @param lastPrevSubId - ID of the last subtitle that has already passed.
- * @param isEnded - Whether playback has ended.
- * @returns The current group, or `undefined` if none matches.
- */
-export declare const getCurrentGroup: (subsGroupsWithBoundaries: SubGroupBoundaries[], lastPrevSubId: number | undefined, isEnded: boolean | undefined) => SubGroupBoundaries | undefined;

package/components/Subtitles/utils.js

@@ -1,107 +0,0 @@
-/**
- * Converts an SRT timecode (hh:mm:ss,ms) to milliseconds.
- *
- * @param timecode - Timecode string (e.g. '00:01:23,456').
- * @returns The time in milliseconds.
- */
-export const getTimecodeToMs = (timecode) => {
-    const [hours = '0', minutes = '0', secondsAndMs = '0,0'] = timecode.split(':');
-    const [seconds = '0', milliseconds = '0'] = secondsAndMs.split(',');
-    let result = parseInt(hours) * 60 * 60 * 1000;
-    result += parseInt(minutes) * 60 * 1000;
-    result += parseInt(seconds) * 1000;
-    result += parseInt(milliseconds);
-    return result;
-};
-/**
- * Parses a raw SRT subtitle text into a list of {@link ParsedSub} objects.
- *
- * @param rawSubs - Raw subtitle content in SRT format.
- * @returns Array of parsed subtitle entries.
- */
-export const parseSubs = (rawSubs) => {
-    const numberRegex = /^\d+$/v;
-    const timecodeRegex = /^[0-9]+:[0-9]+:[0-9]+,[0-9]+\s*-->\s*[0-9]+:[0-9]+:[0-9]+,[0-9]+$/v;
-    const parsedSubs = [];
-    rawSubs.split('\n').forEach(line => {
-        if (line.trim() === '')
-            return;
-        const lastParsedSub = parsedSubs[parsedSubs.length - 1];
-        const matchId = line.match(numberRegex);
-        const matchTimecode = line.match(timecodeRegex);
-        // id
-        if (matchId !== null) {
-            if (lastParsedSub === undefined
-                || lastParsedSub.content !== undefined) {
-                const parsedSub = { id: parseInt(line) };
-                parsedSubs.push(parsedSub);
-                return;
-            }
-        }
-        // timecode
-        if (matchTimecode !== null) {
-            if (lastParsedSub?.id !== undefined) {
-                const [rawStart = '', rawEnd = ''] = line.split('-->');
-                const startTime = rawStart.trim();
-                const endTime = rawEnd.trim();
-                lastParsedSub.start = getTimecodeToMs(startTime);
-                lastParsedSub.end = getTimecodeToMs(endTime);
-                return;
-            }
-        }
-        // content
-        if (lastParsedSub?.id !== undefined
-            && lastParsedSub.start !== undefined
-            && lastParsedSub.end !== undefined) {
-            if (lastParsedSub.content !== undefined) {
-                lastParsedSub.content += `\n${line}`;
-                return;
-            }
-            lastParsedSub.content = line;
-        }
-    });
-    return parsedSubs;
-};
-/**
- * Computes subtitle groups with their boundaries (startId, endId).
- *
- * @param subsGroups - Array of group-end subtitle IDs.
- * @param highestSubId - Highest subtitle ID in the track.
- * @returns Array of {@link SubGroupBoundaries}.
- */
-export const computeSubGroupsWithBoundaries = (subsGroups, highestSubId) => {
-    const fallback = [{ startId: 1, endId: highestSubId }];
-    if (subsGroups === undefined || subsGroups.length === 0)
-        return fallback;
-    const emptySubGroupBoundaries = [];
-    return subsGroups.reduce((acc, curr, currIndex) => {
-        const lastInAcc = acc[acc.length - 1];
-        const startId = lastInAcc === undefined ? 1 : lastInAcc.endId + 1;
-        const endId = curr;
-        if (currIndex === subsGroups.length - 1
-            && endId !== highestSubId) {
-            return [
-                ...acc,
-                { startId, endId },
-                { startId: endId + 1, endId: highestSubId }
-            ];
-        }
-        return [...acc, { startId, endId }];
-    }, emptySubGroupBoundaries);
-};
-/**
- * Returns the current subtitle group based on the last preceding subtitle ID and playback state.
- *
- * @param subsGroupsWithBoundaries - Array of groups with their boundaries.
- * @param lastPrevSubId - ID of the last subtitle that has already passed.
- * @param isEnded - Whether playback has ended.
- * @returns The current group, or `undefined` if none matches.
- */
-export const getCurrentGroup = (subsGroupsWithBoundaries, lastPrevSubId, isEnded) => {
-    const previousGroups = subsGroupsWithBoundaries.filter(group => group.startId <= (lastPrevSubId ?? 0));
-    if (previousGroups.length === 0)
-        return isEnded === true
-            ? subsGroupsWithBoundaries[subsGroupsWithBoundaries.length - 1]
-            : subsGroupsWithBoundaries[0];
-    return previousGroups[previousGroups.length - 1];
-};