@divkitframework/divkit 3.0.0

package/package.json

@@ -0,0 +1,126 @@
+{
+    "name": "@divkitframework/divkit",
+    "version": "3.0.0",
+    "description": "DivKit for the web",
+    "keywords": [
+        "server-driven-ui",
+        "ssr",
+        "web",
+        "divkit",
+        "renderer"
+    ],
+    "author": "",
+    "homepage": "https://github.com/divkit/divkit",
+    "repository": "github:divkit/divkit",
+    "license": "Apache-2.0",
+    "files": [
+        "dist/*",
+        "typings/*",
+        "client/*",
+        "client-hydratable/*",
+        "client-devtool/*",
+        "server/*"
+    ],
+    "sideEffects": [
+        "dist/client.css"
+    ],
+    "main": "./dist/server.js",
+    "module": "./dist/esm/server.mjs",
+    "types": "./typings/server.d.ts",
+    "exports": {
+        ".": {
+            "types": "./typings/server.d.ts",
+            "require": "./dist/server.js",
+            "import": "./dist/esm/server.mjs"
+        },
+        "./client": {
+            "types": "./typings/client.d.ts",
+            "require": "./dist/client.js",
+            "import": "./dist/esm/client.mjs"
+        },
+        "./client-hydratable": {
+            "types": "./typings/client-hydratable.d.ts",
+            "require": "./dist/client-hydratable.js",
+            "import": "./dist/esm/client-hydratable.mjs"
+        },
+        "./client-devtool": {
+            "types": "./typings/client-devtool.d.ts",
+            "require": "./dist/client-devtool.js",
+            "import": "./dist/esm/client-devtool.mjs"
+        },
+        "./server": {
+            "types": "./typings/server.d.ts",
+            "require": "./dist/server.js",
+            "import": "./dist/esm/server.mjs"
+        },
+        "./dist/": "./dist/",
+        "./typings/": "./typings/",
+        "./client/": "./client/",
+        "./client-hydratable/": "./client-hydratable/",
+        "./client-devtool/": "./client-devtool/",
+        "./server/": "./server/"
+    },
+    "scripts": {
+        "test:unit": "jest",
+        "test:hermione": "cd ci && ./node_modules/.bin/hermione",
+        "test:hermione:gui": "cd ci && ./node_modules/.bin/hermione gui",
+        "test:hermione:update": "cd ci && ./node_modules/.bin/hermione --update-refs",
+        "check:ts": "tsc --noEmit",
+        "check:eslint": "eslint --quiet .",
+        "check:svelte": "svelte-check --threshold error",
+        "build": "npx webpack-cli",
+        "build:watch": "npm run build:peggy && webpack serve --config webpack-dev.config.js",
+        "build:peggy": "peggy src/expressions/expressions.peggy --allowed-start-rules start,JsonStringContents --format es",
+        "build:dev-prod": "npm run build:peggy && NODE_ENV=production webpack-cli --config webpack-dev.config.js",
+        "build:prod": "npm run build:peggy && rm -rf dist/ && NODE_ENV=production npx webpack-cli --progress"
+    },
+    "browserslist": {
+        "production": [
+            "chrome >= 58",
+            "safari >= 11",
+            "firefox >= 67"
+        ],
+        "ssr": [
+            "node >= 8"
+        ],
+        "development": [
+            "last 1 chrome version",
+            "last 1 firefox version",
+            "last 1 safari version"
+        ]
+    },
+    "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",
+        "chai": "4.3.6",
+        "css-loader": "6.7.1",
+        "css-minimizer-webpack-plugin": "4.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-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",
+        "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"
+    }
+}

package/server/package.json

@@ -0,0 +1,6 @@
+{
+    "internal": true,
+    "main": "../dist/server.js",
+    "module": "../dist/esm/server.mjs",
+    "types": "../typings/server.d.ts"
+}

package/typings/client-devtool.d.ts

@@ -0,0 +1,87 @@
+import type {
+    DivJson,
+    StatCallback,
+    ErrorCallback,
+    DivkitInstance,
+    Platform,
+    ComponentCallback,
+    CustomActionCallback,
+    Theme
+} from './common';
+import type { GlobalVariablesController, Variable } from './variables';
+
+export function render(opts: {
+    target: HTMLElement;
+    json: DivJson;
+    id: string;
+    hydrate?: boolean;
+    globalVariablesController?: GlobalVariablesController;
+    onStat?: StatCallback;
+    onCustomAction?: CustomActionCallback;
+    onError?: ErrorCallback;
+    onComponent?: ComponentCallback;
+    platform?: Platform;
+    /** EXPERIMENTAL SUPPORT */
+    theme?: Theme;
+}): DivkitInstance;
+
+export { createVariable, createGlobalVariablesController } from './variables';
+
+export interface EvalValueBase {
+    type: string;
+    value: unknown;
+}
+
+export interface StringValue extends EvalValueBase {
+    type: 'string';
+    value: string;
+}
+
+export interface UrlValue extends EvalValueBase {
+    type: 'url';
+    value: string;
+}
+
+export interface ColorValue extends EvalValueBase {
+    type: 'color';
+    value: string;
+}
+
+export interface NumberValue extends EvalValueBase {
+    type: 'number';
+    value: number;
+}
+
+export interface IntegerValue extends EvalValueBase {
+    type: 'integer';
+    value: number;
+}
+
+export interface BooleanValue extends EvalValueBase {
+    type: 'boolean';
+    value: number;
+}
+
+export interface DatetimeValue extends EvalValueBase {
+    type: 'datetime';
+    value: Date;
+}
+
+export type EvalValue = StringValue | UrlValue | ColorValue | NumberValue | IntegerValue |
+    BooleanValue | DatetimeValue;
+
+export interface EvalError {
+    type: 'error';
+    value: string;
+}
+
+export type EvalResult = EvalValue | EvalError;
+
+export function evalExpression(expr: string, opts?: {
+    variables?: Map<string, Variable>;
+    type?: 'exact' | 'json';
+}): EvalResult;
+
+export function valToString(val: EvalValue): string;
+
+export function functionNames(): string[];

package/typings/client-hydratable.d.ts

@@ -0,0 +1,26 @@
+import type {
+    DivJson,
+    StatCallback,
+    ErrorCallback,
+    DivkitInstance,
+    Platform,
+    CustomActionCallback,
+    Theme
+} from './common';
+import type { GlobalVariablesController } from './variables';
+
+export function render(opts: {
+    target: HTMLElement;
+    json: DivJson;
+    id: string;
+    hydrate?: boolean;
+    globalVariablesController?: GlobalVariablesController;
+    onStat?: StatCallback;
+    onCustomAction?: CustomActionCallback;
+    onError?: ErrorCallback;
+    platform?: Platform;
+    /** EXPERIMENTAL SUPPORT */
+    theme?: Theme;
+}): DivkitInstance;
+
+export { createVariable, createGlobalVariablesController } from './variables';

package/typings/client.d.ts

@@ -0,0 +1,25 @@
+import type {
+    DivJson,
+    StatCallback,
+    ErrorCallback,
+    DivkitInstance,
+    Platform,
+    CustomActionCallback,
+    Theme
+} from './common';
+import type { GlobalVariablesController } from './variables';
+
+export function render(opts: {
+    target: HTMLElement;
+    json: DivJson;
+    id: string;
+    globalVariablesController?: GlobalVariablesController;
+    onStat?: StatCallback;
+    onCustomAction?: CustomActionCallback;
+    onError?: ErrorCallback;
+    platform?: Platform;
+    /** EXPERIMENTAL SUPPORT */
+    theme?: Theme;
+}): DivkitInstance;
+
+export { createVariable, createGlobalVariablesController } from './variables';

package/typings/common.d.ts

@@ -0,0 +1,141 @@
+export type BooleanInt = 0 | 1;
+
+export type TemplateContext = Record<string, unknown>;
+
+export interface DivBase {
+    type: string;
+    [key: string]: unknown;
+}
+
+export interface DivJsonState {
+    state_id: number;
+    div: DivBase;
+}
+
+export interface DivStrVariable {
+    type: 'string';
+    name: string;
+    value: string;
+}
+
+export interface DivIntVariable {
+    type: 'integer';
+    name: string;
+    value: number;
+}
+
+export interface DivNumberVariable {
+    type: 'number';
+    name: string;
+    value: number;
+}
+
+export interface DivBooleanVariable {
+    type: 'boolean';
+    name: string;
+    value: BooleanInt;
+}
+
+export interface DivColorVariable {
+    type: 'color';
+    name: string;
+    value: string;
+}
+
+export interface DivUrlVariable {
+    type: 'url';
+    name: string;
+    value: string;
+}
+
+export type DivVariable = DivStrVariable | DivIntVariable | DivNumberVariable |
+    DivBooleanVariable | DivColorVariable | DivUrlVariable;
+
+export interface VariableTrigger {
+    mode: 'on_condition' | 'on_variable';
+    condition: BooleanInt | string;
+    actions: Action[];
+}
+
+export interface PaletteColor {
+    name: string;
+    color: string;
+}
+
+export type PaletteList = PaletteColor[];
+
+export interface Palette {
+    light: PaletteList;
+    dark: PaletteList;
+}
+
+export interface DivJson {
+    templates?: Record<string, unknown>;
+    card: {
+        log_id: string;
+        states: DivJsonState[];
+        variables?: DivVariable[];
+        variable_triggers?: VariableTrigger[];
+    }
+    /** EXPERIMENTAL SUPPORT */
+    palette?: Palette;
+}
+
+export interface Action {
+    log_id: string;
+    url?: string;
+    payload?: Record<string, unknown>;
+    log_url?: string;
+    target?: string;
+}
+
+export interface VisibilityAction {
+    log_id: string;
+    url?: string;
+    referer?: string;
+    payload?: Record<string, string>;
+    visibility_percentage?: number;
+    visibility_duration?: number;
+    // download_callbacks
+    log_limit?: number;
+}
+
+export type StatCallback = (details: {
+    type: string;
+    action: Action | VisibilityAction;
+}) => void;
+
+export type CustomActionCallback = (action: Action & { url: string }) => void;
+
+export type ComponentCallback = (details: {
+    type: 'mount';
+    node: HTMLElement;
+    json: DivBase;
+    origJson: DivBase | undefined;
+    templateContext: TemplateContext;
+} | {
+    type: 'destroy';
+    node: HTMLElement;
+}) => void;
+
+export interface WrappedError extends Error {
+    level: 'error' | 'warn';
+    additional?: Record<string, unknown>;
+}
+
+export type ErrorCallback = (details: {
+    error: WrappedError;
+}) => void;
+
+export interface DivkitInstance {
+    $destroy(): void;
+    execAction(action: Action | VisibilityAction): void;
+    /** @deprecated */
+    getVariable(name: string): string | number | undefined;
+    /** @deprecated */
+    setVariable(name: string, value: string | number): void;
+}
+
+export type Platform = 'desktop' | 'touch' | 'auto';
+
+export type Theme = 'system' | 'light' | 'dark';

package/typings/server.d.ts

@@ -0,0 +1,8 @@
+import type { DivJson, ErrorCallback, Platform } from './common';
+
+export function render(opts: {
+    json: DivJson;
+    id: string;
+    onError?: ErrorCallback;
+    platform?: Platform;
+}): string;

package/typings/variables.d.ts

@@ -0,0 +1,34 @@
+/* eslint-disable @typescript-eslint/no-empty-interface */
+
+import type { Subscriber, Unsubscriber } from 'svelte/store';
+
+export interface Variable<T = any> {
+    getName(): string;
+    subscribe(cb: Subscriber<T>): Unsubscriber;
+    set(val: string): void;
+    setValue(value: T): void;
+    setValue(value: T): void;
+    getValue(): T;
+    getType(): string;
+}
+
+export interface StringVariable extends Variable<string> {}
+export interface NumberVariable extends Variable<number> {}
+export interface IntegerVariable extends Variable<number> {}
+export interface BooleanVariable extends Variable<number> {}
+export interface ColorVariable extends Variable<string> {}
+export interface UrlVariable extends Variable<string> {}
+
+export type AnyVariable = StringVariable | NumberVariable | IntegerVariable |
+    BooleanVariable | ColorVariable | UrlVariable;
+
+export type VariableType = 'string' | 'number' | 'integer' | 'boolean' | 'color' | 'url';
+
+export interface GlobalVariablesController {
+    setVariable(variable: AnyVariable): void;
+    getVariable(variableName: string): AnyVariable | undefined;
+}
+
+export function createVariable(variableName: string, type: VariableType, value: unknown): AnyVariable;
+
+export function createGlobalVariablesController(): GlobalVariablesController;