diff --git a/e2e/package.json b/e2e/package.json index c7c27e5c7..167f78028 100644 --- a/e2e/package.json +++ b/e2e/package.json @@ -19,7 +19,7 @@ "@types/puppeteer": "^7.0.4", "jest-image-snapshot": "^6.4.0", "jest-puppeteer": "^10.0.1", - "puppeteer": "^22.9.0", + "puppeteer": "^22.10.0", "stucumber": "^0.19.0" } } diff --git a/package-lock.json b/package-lock.json index 3f0ad31b2..a7c002457 100644 --- a/package-lock.json +++ b/package-lock.json @@ -24,7 +24,7 @@ "@semantic-release/changelog": "^6.0.3", "@semantic-release/commit-analyzer": "^12.0.0", "@semantic-release/git": "^10.0.1", - "@semantic-release/github": "^10.0.4", + "@semantic-release/github": "^10.0.5", "@semantic-release/npm": "^12.0.1", "@semantic-release/release-notes-generator": "^13.0.0", "@types/jest": "^29.5.12", @@ -45,14 +45,14 @@ "jest-environment-jsdom": "^29.7.0", "kleur": "^4.1.5", "less": "^4.2.0", - "lint-staged": "^15.2.2", + "lint-staged": "^15.2.5", "postcss": "^8.4.38", "postcss-less": "^6.0.0", "prettier": "^3.2.5", "rimraf": "^5.0.7", "semantic-release": "^23.1.1", "smoothscroll-polyfill": "^0.4.4", - "stylelint": "^16.5.0", + "stylelint": "^16.6.0", "stylelint-prettier": "^5.0.0", "ts-jest": "^29.1.3", "typescript": "5.4.5" @@ -68,7 +68,7 @@ "@types/puppeteer": "^7.0.4", "jest-image-snapshot": "^6.4.0", "jest-puppeteer": "^10.0.1", - "puppeteer": "^22.9.0", + "puppeteer": "^22.10.0", "stucumber": "^0.19.0" } }, @@ -2921,9 +2921,9 @@ } }, "node_modules/@semantic-release/github": { - "version": "10.0.4", - "resolved": "https://registry.npmjs.org/@semantic-release/github/-/github-10.0.4.tgz", - "integrity": "sha512-eHCfW3jlzax5OKd5nTovlvoCdg+b9YBa31M2JGT1KmzmJR3TIalu2ahVU+V/xATVeOx+S8fbCiPnBBgMlzH5Vw==", + "version": "10.0.5", + "resolved": "https://registry.npmjs.org/@semantic-release/github/-/github-10.0.5.tgz", + "integrity": "sha512-hmuCDkfru/Uc9+ZBNOSremAupu6BCslvOVDiG0wYcL8TQodCycp6uvwDyeym1H0M4l3ob9c0s0xMBiZjjXQ2yA==", "dev": true, "dependencies": { "@octokit/core": "^6.0.0", @@ -4844,9 +4844,9 @@ "optional": true }, "node_modules/bare-path": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/bare-path/-/bare-path-2.1.2.tgz", - "integrity": "sha512-o7KSt4prEphWUHa3QUwCxUI00R86VdjiuxmJK0iNVDHYPGo+HsDaVCnqCmPbf/MiW1ok8F4p3m8RTHlWk8K2ig==", + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/bare-path/-/bare-path-2.1.3.tgz", + "integrity": "sha512-lh/eITfU8hrj9Ru5quUp0Io1kJWIk1bTjzo7JH1P5dWmQ2EL4hFUlfI8FonAhSlgIfhn63p84CDY/x+PisgcXA==", "optional": true, "dependencies": { "bare-os": "^2.1.0" @@ -12487,9 +12487,9 @@ } }, "node_modules/known-css-properties": { - "version": "0.30.0", - "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.30.0.tgz", - "integrity": "sha512-VSWXYUnsPu9+WYKkfmJyLKtIvaRJi1kXUqVmBACORXZQxT5oZDsoZ2vQP+bQFDnWtpI/4eq3MLoRMjI2fnLzTQ==", + "version": "0.31.0", + "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.31.0.tgz", + "integrity": "sha512-sBPIUGTNF0czz0mwGGUoKKJC8Q7On1GPbCSFPfyEsfHb2DyBG0Y4QtV+EVWpINSaiGKZblDNuF5AezxSgOhesQ==", "dev": true }, "node_modules/lcid": { @@ -12634,21 +12634,21 @@ } }, "node_modules/lint-staged": { - "version": "15.2.4", - "resolved": "https://registry.npmjs.org/lint-staged/-/lint-staged-15.2.4.tgz", - "integrity": "sha512-3F9KRQIS2fVDGtCkBp4Bx0jswjX7zUcKx6OF0ZeY1prksUyKPRIIUqZhIUYAstJfvj6i48VFs4dwVIbCYwvTYQ==", - "dev": true, - "dependencies": { - "chalk": "5.3.0", - "commander": "12.1.0", - "debug": "4.3.4", - "execa": "8.0.1", - "lilconfig": "3.1.1", - "listr2": "8.2.1", - "micromatch": "4.0.6", - "pidtree": "0.6.0", - "string-argv": "0.3.2", - "yaml": "2.4.2" + "version": "15.2.5", + "resolved": "https://registry.npmjs.org/lint-staged/-/lint-staged-15.2.5.tgz", + "integrity": "sha512-j+DfX7W9YUvdzEZl3Rk47FhDF6xwDBV5wwsCPw6BwWZVPYJemusQmvb9bRsW23Sqsaa+vRloAWogbK4BUuU2zA==", + "dev": true, + "dependencies": { + "chalk": "~5.3.0", + "commander": "~12.1.0", + "debug": "~4.3.4", + "execa": "~8.0.1", + "lilconfig": "~3.1.1", + "listr2": "~8.2.1", + "micromatch": "~4.0.7", + "pidtree": "~0.6.0", + "string-argv": "~0.3.2", + "yaml": "~2.4.2" }, "bin": { "lint-staged": "bin/lint-staged.js" @@ -13467,28 +13467,17 @@ } }, "node_modules/micromatch": { - "version": "4.0.6", - "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.6.tgz", - "integrity": "sha512-Y4Ypn3oujJYxJcMacVgcs92wofTHxp9FzfDpQON4msDefoC0lb3ETvQLOdLcbhSwU1bz8HrL/1sygfBIHudrkQ==", + "version": "4.0.7", + "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz", + "integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==", "dependencies": { "braces": "^3.0.3", - "picomatch": "^4.0.2" + "picomatch": "^2.3.1" }, "engines": { "node": ">=8.6" } }, - "node_modules/micromatch/node_modules/picomatch": { - "version": "4.0.2", - "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz", - "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==", - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/jonschlinkert" - } - }, "node_modules/mime": { "version": "4.0.3", "resolved": "https://registry.npmjs.org/mime/-/mime-4.0.3.tgz", @@ -17418,9 +17407,9 @@ } }, "node_modules/postcss-selector-parser": { - "version": "6.0.16", - "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.16.tgz", - "integrity": "sha512-A0RVJrX+IUkVZbW3ClroRWurercFhieevHB38sr2+l9eUClMqome3LmEmnhlNy+5Mr2EYN6B2Kaw9wYdd+VHiw==", + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.0.tgz", + "integrity": "sha512-UMz42UD0UY0EApS0ZL9o1XnLhSTtvvvLe5Dc2H2O56fvRZi+KulDyf5ctDhhtYJBGKStV2FL1fy6253cmLgqVQ==", "dev": true, "dependencies": { "cssesc": "^3.0.0", @@ -17806,15 +17795,15 @@ } }, "node_modules/puppeteer": { - "version": "22.9.0", - "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-22.9.0.tgz", - "integrity": "sha512-yNux2cm6Sfik4lNLNjJ25Cdn9spJRbMXxl1YZtVZCEhEeej1sFlCvZ/Cr64LhgyJOuvz3iq2uk+RLFpQpGwrjw==", + "version": "22.10.0", + "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-22.10.0.tgz", + "integrity": "sha512-ZOkZd6a6t0BdKcWb0wAYHWQqCfdlN1PPnXOmg/XNrbo6gJhYWFX4qCNb6ahSn8TpAqBqLCoD4Q010F7GwOM7mA==", "hasInstallScript": true, "dependencies": { "@puppeteer/browsers": "2.2.3", "cosmiconfig": "9.0.0", "devtools-protocol": "0.0.1286932", - "puppeteer-core": "22.9.0" + "puppeteer-core": "22.10.0" }, "bin": { "puppeteer": "lib/esm/puppeteer/node/cli.js" @@ -17824,9 +17813,9 @@ } }, "node_modules/puppeteer-core": { - "version": "22.9.0", - "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-22.9.0.tgz", - "integrity": "sha512-Q2SYVZ1SIE7jCd/Pp+1/mNLFtdJfGvAF+CqOTDG8HcCNCiBvoXfopXfOfMHQ/FueXhGfJW/I6DartWv6QzpNGg==", + "version": "22.10.0", + "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-22.10.0.tgz", + "integrity": "sha512-I54J4Vy4I07UHsgB1QSmuFoF7KNQjJWcvFBPhtY+ezMdBfwgGDr8dzYrJa11aPgP9kxIUHjhktcMmmfJkOAtTw==", "dependencies": { "@puppeteer/browsers": "2.2.3", "chromium-bidi": "0.5.19", @@ -19577,16 +19566,26 @@ } }, "node_modules/stylelint": { - "version": "16.5.0", - "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.5.0.tgz", - "integrity": "sha512-IlCBtVrG+qTy3v+tZTk50W8BIomjY/RUuzdrDqdnlCYwVuzXtPbiGfxYqtyYAyOMcb+195zRsuHn6tgfPmFfbw==", + "version": "16.6.0", + "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-16.6.0.tgz", + "integrity": "sha512-vjWYlDEgOS3Z/IcXagQwi8PFJyPro1DxBYOnTML1PAqnrYUHs8owleGStv20sgt0OhW8r9zZm6MK7IT2+l2B6A==", "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/stylelint" + }, + { + "type": "github", + "url": "https://github.com/sponsors/stylelint" + } + ], "dependencies": { - "@csstools/css-parser-algorithms": "^2.6.1", - "@csstools/css-tokenizer": "^2.2.4", - "@csstools/media-query-list-parser": "^2.1.9", - "@csstools/selector-specificity": "^3.0.3", - "@dual-bundle/import-meta-resolve": "^4.0.0", + "@csstools/css-parser-algorithms": "^2.6.3", + "@csstools/css-tokenizer": "^2.3.1", + "@csstools/media-query-list-parser": "^2.1.11", + "@csstools/selector-specificity": "^3.1.1", + "@dual-bundle/import-meta-resolve": "^4.1.0", "balanced-match": "^2.0.0", "colord": "^2.9.3", "cosmiconfig": "^9.0.0", @@ -19603,16 +19602,16 @@ "ignore": "^5.3.1", "imurmurhash": "^0.1.4", "is-plain-object": "^5.0.0", - "known-css-properties": "^0.30.0", + "known-css-properties": "^0.31.0", "mathml-tag-names": "^2.1.3", "meow": "^13.2.0", "micromatch": "^4.0.5", "normalize-path": "^3.0.0", - "picocolors": "^1.0.0", + "picocolors": "^1.0.1", "postcss": "^8.4.38", "postcss-resolve-nested-selector": "^0.1.1", "postcss-safe-parser": "^7.0.0", - "postcss-selector-parser": "^6.0.16", + "postcss-selector-parser": "^6.1.0", "postcss-value-parser": "^4.2.0", "resolve-from": "^5.0.0", "string-width": "^4.2.3", @@ -19627,10 +19626,6 @@ }, "engines": { "node": ">=18.12.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/stylelint" } }, "node_modules/stylelint-prettier": { diff --git a/package.json b/package.json index 5f1c35cf3..d53f258c8 100644 --- a/package.json +++ b/package.json @@ -96,7 +96,7 @@ "@semantic-release/changelog": "^6.0.3", "@semantic-release/commit-analyzer": "^12.0.0", "@semantic-release/git": "^10.0.1", - "@semantic-release/github": "^10.0.4", + "@semantic-release/github": "^10.0.5", "@semantic-release/npm": "^12.0.1", "@semantic-release/release-notes-generator": "^13.0.0", "@types/jest": "^29.5.12", @@ -117,14 +117,14 @@ "jest-environment-jsdom": "^29.7.0", "kleur": "^4.1.5", "less": "^4.2.0", - "lint-staged": "^15.2.2", + "lint-staged": "^15.2.5", "postcss": "^8.4.38", "postcss-less": "^6.0.0", "prettier": "^3.2.5", "rimraf": "^5.0.7", "semantic-release": "^23.1.1", "smoothscroll-polyfill": "^0.4.4", - "stylelint": "^16.5.0", + "stylelint": "^16.6.0", "stylelint-prettier": "^5.0.0", "ts-jest": "^29.1.3", "typescript": "5.4.5" diff --git a/src/modules/esl-media/core/esl-media-iobserver.ts b/src/modules/esl-media/core/esl-media-iobserver.ts index e4f78a424..f24de4ddc 100644 --- a/src/modules/esl-media/core/esl-media-iobserver.ts +++ b/src/modules/esl-media/core/esl-media-iobserver.ts @@ -1,6 +1,6 @@ import type {ESLMedia} from './esl-media'; -const RATIO_TO_PLAY = 0.75; // TODO: customizable, at least global +const RATIO_TO_PLAY = 0.5; // TODO: customizable, at least global const RATIO_TO_STOP = 0.20; // TODO: customizable, at least global const RATIO_TO_ACTIVATE = 0.05; diff --git a/src/modules/esl-media/core/esl-media.shape.ts b/src/modules/esl-media/core/esl-media.shape.ts index 0dbcfc095..ecfea52f5 100644 --- a/src/modules/esl-media/core/esl-media.shape.ts +++ b/src/modules/esl-media/core/esl-media.shape.ts @@ -46,6 +46,8 @@ export type ESLMediaTagShape = ({ 'preload'?: 'none' | 'metadata' | 'auto' | ''; /** Allow play media inline */ 'playsinline'?: boolean; + /** Allows to start viewing a resource from a specific time offset */ + 'start-time'?: number; /** Optional BC provider player id */ 'data-player-id'?: string; diff --git a/src/modules/esl-media/core/esl-media.ts b/src/modules/esl-media/core/esl-media.ts index c6a93e0ed..d9de1a2b3 100644 --- a/src/modules/esl-media/core/esl-media.ts +++ b/src/modules/esl-media/core/esl-media.ts @@ -46,7 +46,8 @@ export class ESLMedia extends ESLBaseElement { 'muted', 'loop', 'controls', - 'lazy' + 'lazy', + 'start-time' ]; /** Event to dispatch on ready state */ @@ -180,6 +181,7 @@ export class ESLMedia extends ESLBaseElement { case 'media-id': case 'media-src': case 'media-type': + case 'start-time': this.deferredReinitialize(); break; case 'lazy': diff --git a/src/modules/esl-panel-group/README.md b/src/modules/esl-panel-group/README.md index 9b4d00b8d..7c6c8e6e8 100644 --- a/src/modules/esl-panel-group/README.md +++ b/src/modules/esl-panel-group/README.md @@ -34,6 +34,7 @@ ESLPanelGroup.register(); - `has-opened` - readonly attribute that indicates whether the panel group has opened panels - `current-mode` - readonly attribute that indicates the currently applied rendering mode of the panel group +- `animating` - a marker of animation process running ### Events diff --git a/src/modules/esl-panel-group/core/esl-panel-group.ts b/src/modules/esl-panel-group/core/esl-panel-group.ts index a95a76903..64fa02fed 100644 --- a/src/modules/esl-panel-group/core/esl-panel-group.ts +++ b/src/modules/esl-panel-group/core/esl-panel-group.ts @@ -72,6 +72,9 @@ export class ESLPanelGroup extends ESLBaseElement { /** Readonly attribute that indicates whether the panel group has opened panels */ @boolAttr({readonly: true}) public hasOpened: boolean; + /** Active while animation in progress */ + @boolAttr({readonly: true}) public animating: boolean; + /** Height of previous active panel */ protected _previousHeight: number = 0; @@ -268,6 +271,7 @@ export class ESLPanelGroup extends ESLBaseElement { /** Pre-processing animation action */ protected beforeAnimate(): void { + this.$$attr('animating', true); CSSClassUtils.add(this, this.animationClass); } @@ -275,6 +279,7 @@ export class ESLPanelGroup extends ESLBaseElement { protected afterAnimate(silent?: boolean): void { this.style.removeProperty('height'); CSSClassUtils.remove(this, this.animationClass); + this.$$attr('animating', false); if (silent) return; this.$$fire(this.AFTER_ANIMATE_EVENT, {bubbles: false}); diff --git a/src/modules/esl-panel/core/esl-panel.ts b/src/modules/esl-panel/core/esl-panel.ts index cc759f4c9..26b5003b0 100644 --- a/src/modules/esl-panel/core/esl-panel.ts +++ b/src/modules/esl-panel/core/esl-panel.ts @@ -90,7 +90,7 @@ export class ESLPanel extends ESLToggleable { /** Handles post animation process to initiate after animate step */ protected postAnimate(capturedBy?: ESLPanelGroup | null): void { - if (capturedBy) { + if (capturedBy && capturedBy.animating) { capturedBy.$$on({ event: capturedBy.AFTER_ANIMATE_EVENT, once: true