item_builder index variable

9da1d77c2d1fc4bdd776371f0ed039c0374f2e99

.mapping.json

@@ -13566,6 +13566,8 @@
   "client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/horizontal-orientation-with-wrap-content-constrained-children/firefoxMobile/horizontal-orientation-with-wrap-content-constrained-children.png":"divkit/public/client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/horizontal-orientation-with-wrap-content-constrained-children/firefoxMobile/horizontal-orientation-with-wrap-content-constrained-children.png",
   "client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/horizontal-orientation/chromeMobile/horizontal-orientation.png":"divkit/public/client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/horizontal-orientation/chromeMobile/horizontal-orientation.png",
   "client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/horizontal-orientation/firefoxMobile/horizontal-orientation.png":"divkit/public/client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/horizontal-orientation/firefoxMobile/horizontal-orientation.png",
+  "client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/item_builder/index/chromeMobile/index.png":"divkit/public/client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/item_builder/index/chromeMobile/index.png",
+  "client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/item_builder/index/firefoxMobile/index.png":"divkit/public/client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/item_builder/index/firefoxMobile/index.png",
   "client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/item_builder/item-builder/chromeMobile/item-builder.png":"divkit/public/client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/item_builder/item-builder/chromeMobile/item-builder.png",
   "client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/item_builder/item-builder/firefoxMobile/item-builder.png":"divkit/public/client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/item_builder/item-builder/firefoxMobile/item-builder.png",
   "client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/item_builder/nested-builders/chromeMobile/nested-builders.png":"divkit/public/client/web/divkit/tests/hermione/screens/crossplatform/components/div-container/item_builder/nested-builders/chromeMobile/nested-builders.png",

client/web/divkit/src/components/Root.svelte

@@ -295,12 +295,19 @@
         return prepared.applyVars(vars, keepComplex);
     }
 
-    function preparePrototypeVariables(name: string, data: Record<string, unknown>): Map<string, Variable> {
+    function preparePrototypeVariables(
+        name: string,
+        data: Record<string, unknown>,
+        index: number
+    ): Map<string, Variable> {
         const map = new Map<string, Variable>();
 
         const dict = createConstVariable(name, 'dict', data);
         map.set(name, dict);
 
+        const indexVar = createConstVariable('index', 'integer', index);
+        map.set('index', indexVar);
+
         return map;
     }
 

client/web/divkit/src/components/container/Container.svelte

@@ -127,11 +127,11 @@
             const builder = componentContext.json.item_builder;
             newItems = [];
 
-            $jsonItemBuilderData.forEach(it => {
+            $jsonItemBuilderData.forEach((it, index) => {
                 if (it === null || typeof it !== 'object') {
                     return;
                 }
-                const additionalVars = rootCtx.preparePrototypeVariables(builder.data_element_name || 'it', it as Record<string, unknown>);
+                const additionalVars = rootCtx.preparePrototypeVariables(builder.data_element_name || 'it', it as Record<string, unknown>, index);
 
                 let div: MaybeMissing<DivBaseData> | undefined;
                 for (let i = 0; i < builder.prototypes.length; ++i) {

client/web/divkit/src/context/root.ts

@@ -47,7 +47,7 @@ export interface RootCtxValue {
     unregisterFocusable(id: string): void;
     addSvgFilter(color: string, mode: TintMode): string;
     removeSvgFilter(color: string | undefined, mode: TintMode): void;
-    preparePrototypeVariables(name: string, data: Record<string, unknown>): Map<string, Variable>;
+    preparePrototypeVariables(name: string, data: Record<string, unknown>, index: number): Map<string, Variable>;
     getStore<T>(id: string): Writable<T>;
     getCustomization<K extends keyof Customization>(prop: K): Customization[K] | undefined;
     getBuiltinProtocols(): Set<string>;

test_data/snapshot_test_data/div-container/item_builder/index.json

@@ -1,7 +1,8 @@
 {
   "description": "Container with item_builder using index value.",
   "platforms": [
-    "ios"
+    "ios",
+    "web"
   ],
   "card": {
     "log_id": "test_card",