@divkitframework/divkit 24.2.0 → 24.4.0-patched-6cf96a434f902166380b2bb2c1e4eb41acabf148

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@divkitframework/divkit",
-    "version": "24.2.0",
+    "version": "24.4.0-patched-6cf96a434f902166380b2bb2c1e4eb41acabf148",
     "description": "DivKit for the web",
     "keywords": [
         "server-driven-ui",
@@ -91,39 +91,40 @@
         ]
     },
     "devDependencies": {
-        "@babel/core": "7.18.10",
-        "@babel/preset-env": "7.18.10",
-        "@babel/preset-typescript": "7.18.6",
-        "@types/jest": "28.1.6",
-        "@typescript-eslint/eslint-plugin": "5.32.0",
-        "@typescript-eslint/parser": "5.32.0",
-        "autoprefixer": "10.4.8",
-        "babel-loader": "8.2.5",
-        "babel-preset-jest": "28.0.0",
-        "chai": "4.3.6",
-        "css-loader": "6.7.1",
-        "css-minimizer-webpack-plugin": "4.0.0",
+        "@babel/core": "7.21.4",
+        "@babel/preset-env": "7.21.4",
+        "@babel/preset-typescript": "7.21.4",
+        "@types/jest": "29.5.1",
+        "@typescript-eslint/eslint-plugin": "5.59.1",
+        "@typescript-eslint/parser": "5.59.1",
+        "autoprefixer": "10.4.14",
+        "babel-loader": "9.1.2",
+        "babel-preset-jest": "29.5.0",
+        "chai": "4.3.7",
+        "css-loader": "6.7.3",
+        "css-minimizer-webpack-plugin": "5.0.0",
         "eslint": "7.32.0",
         "eslint-plugin-ascii": "1.0.0",
         "eslint-plugin-import": "2.26.0",
         "eslint-plugin-mocha": "10.1.0",
         "eslint-plugin-svelte3": "3.4.1",
-        "html-webpack-plugin": "5.5.0",
-        "jest": "28.1.3",
-        "jest-environment-jsdom": "28.0.0",
-        "jest-html-reporter": "3.6.0",
-        "mini-css-extract-plugin": "2.6.1",
-        "peggy": "2.0.1",
-        "postcss": "8.4.14",
-        "postcss-loader": "7.0.1",
-        "svelte": "3.49.0",
+        "html-webpack-plugin": "5.5.1",
+        "jest": "29.5.0",
+        "jest-environment-jsdom": "29.5.0",
+        "jest-html-reporter": "3.8.0",
+        "lottie-web": "5.11.0",
+        "mini-css-extract-plugin": "2.7.5",
+        "peggy": "3.0.2",
+        "postcss": "8.4.23",
+        "postcss-loader": "7.2.4",
+        "svelte": "3.58.0",
         "svelte-as-markup-preprocessor": "0.3.0",
-        "svelte-check": "2.8.0",
-        "svelte-loader": "3.1.3",
-        "svelte-preprocess": "4.10.7",
-        "typescript": "4.7.4",
-        "webpack": "5.74.0",
-        "webpack-cli": "4.10.0",
-        "webpack-dev-server": "4.9.3"
+        "svelte-check": "3.2.0",
+        "svelte-loader": "3.1.7",
+        "svelte-preprocess": "5.0.3",
+        "typescript": "5.0.4",
+        "webpack": "5.80.0",
+        "webpack-cli": "5.0.2",
+        "webpack-dev-server": "4.13.3"
     }
 }

package/typings/client-devtool.d.ts

@@ -7,7 +7,8 @@ import type {
     ComponentCallback,
     CustomActionCallback,
     Theme,
-    Customization
+    Customization,
+    DivExtensionClass
 } from './common';
 import type { GlobalVariablesController, Variable } from './variables';
 import type { WrappedError } from './common';
@@ -30,12 +31,18 @@ export function render(opts: {
     platform?: Platform;
     customization?: Customization;
     builtinProtocols?: string[];
+    extensions?: Map<string, DivExtensionClass>;
     /** EXPERIMENTAL SUPPORT */
     theme?: Theme;
 }): DivkitDebugInstance;
 
 export { createVariable, createGlobalVariablesController } from './variables';
 
+export {
+    SizeProvider,
+    lottieExtensionBuilder
+} from './extensions';
+
 export interface EvalValueBase {
     type: string;
     value: unknown;

package/typings/client-hydratable.d.ts

@@ -6,7 +6,8 @@ import type {
     Platform,
     CustomActionCallback,
     Theme,
-    Customization
+    Customization,
+    DivExtensionClass
 } from './common';
 import type { GlobalVariablesController } from './variables';
 
@@ -23,8 +24,14 @@ export function render(opts: {
     platform?: Platform;
     customization?: Customization;
     builtinProtocols?: string[];
+    extensions?: Map<string, DivExtensionClass>;
     /** EXPERIMENTAL SUPPORT */
     theme?: Theme;
 }): DivkitInstance;
 
 export { createVariable, createGlobalVariablesController } from './variables';
+
+export {
+    SizeProvider,
+    lottieExtensionBuilder
+} from './extensions';

package/typings/client.d.ts

@@ -6,7 +6,8 @@ import type {
     Platform,
     CustomActionCallback,
     Theme,
-    Customization
+    Customization,
+    DivExtensionClass
 } from './common';
 import type { GlobalVariablesController } from './variables';
 
@@ -22,8 +23,14 @@ export function render(opts: {
     platform?: Platform;
     customization?: Customization;
     builtinProtocols?: string[];
+    extensions?: Map<string, DivExtensionClass>;
     /** EXPERIMENTAL SUPPORT */
     theme?: Theme;
 }): DivkitInstance;
 
 export { createVariable, createGlobalVariablesController } from './variables';
+
+export {
+    SizeProvider,
+    lottieExtensionBuilder
+} from './extensions';

package/typings/common.d.ts

@@ -1,3 +1,5 @@
+import type { Variable } from './variables';
+
 export type BooleanInt = 0 | 1 | false | true;
 
 export type TemplateContext = Record<string, unknown>;
@@ -151,3 +153,19 @@ export interface Customization {
     galleryLeftClass?: string;
     galleryRightClass?: string;
 }
+
+export interface DivExtensionContext {
+    variables: Map<string, Variable>;
+    logError(error: WrappedError): void;
+}
+
+export interface DivExtensionClass {
+    new(params: object): DivExtension;
+    prototype: DivExtension;
+}
+
+export interface DivExtension {
+    mountView?(node: HTMLElement, context: DivExtensionContext): void;
+
+    unmountView?(node: HTMLElement, context: DivExtensionContext): void;
+}

package/typings/extensions.d.ts

@@ -0,0 +1,40 @@
+import type { DivExtension } from './common';
+
+export class SizeProvider implements DivExtension {}
+
+declare class Lottie implements DivExtension {}
+
+interface Params {
+    lottie_url?: string;
+    lottie_json?: object;
+    repeat_count?: number;
+    repeat_mode?: 'restart' | 'reverse';
+}
+
+interface AnimationItem {
+    totalFrames: number;
+
+    addEventListener(type: string, cb: () => void): void;
+    destroy(): void;
+    stop(): void;
+    setDirection(direction: number): void;
+    goToAndPlay(value: number, isFrame?: boolean): void;
+}
+
+interface LoadAnimationParamsWidthPath {
+    container: HTMLElement;
+    path: string;
+    renderer: 'svg' | 'html' | 'canvas';
+    loop: boolean | number | undefined;
+}
+
+interface LoadAnimationParamsWidthData {
+    container: HTMLElement;
+    animationData: any;
+    renderer: 'svg' | 'html' | 'canvas';
+    loop: boolean | number | undefined;
+}
+
+type LoadAnimation = (opts: LoadAnimationParamsWidthPath | LoadAnimationParamsWidthData) => AnimationItem;
+
+export function lottieExtensionBuilder(loadAnimation: LoadAnimation): typeof Lottie;