Add LiveObjects Typings docs

Author: VeskeR

content/liveobjects/typing.textile

@@ -0,0 +1,87 @@
+---
+title: Typing
+meta_description: "Type objects on a channel for type safety and code autocompletion."
+product: liveobjects
+languages:
+  - javascript
+---
+
+blang[javascript].
+
+  If you are using TypeScript in your project, you can leverage LiveObjects' built-in TypeScript support to ensure type safety and enable autocompletion when working with objects on a channel.
+
+  h2(#global). Global ObjectsTypes interface
+
+  You can type objects on all your channels by defining a global @ObjectsTypes@ interface. If you only want to type the root object for a specific channel, see the "Typing channel.objects.getRoot()":#getroot section below.
+
+  Define the @ObjectsTypes@ interface in a type declaration file. You can create a file named @ably.config.d.ts@ in the root of your application:
+
+blang[javascript].
+
+  ```[javascript]
+  // file: ably.config.d.ts
+  import { LiveCounter, LiveMap } from 'ably';
+
+  // Define dedicated types and export them for reuse in your application
+  export type MyCustomRoot = {
+    reactions: LiveMap<{
+      hearts: LiveCounter;
+      likes: LiveCounter;
+    }>;
+  };
+
+  declare global {
+    export interface ObjectsTypes {
+      root: MyCustomRoot;
+    }
+  }
+  ```
+
+blang[javascript].
+
+  This enables TypeScript to infer the correct types when accessing and mutating LiveObjects:
+
+blang[javascript].
+
+  ```[javascript]
+  // LiveMap<{ reactions: LiveMap<{ hearts: LiveCounter; likes: LiveCounter }> }>
+  const root = await channel.objects.getRoot();
+
+  // LiveMap<{ hearts: LiveCounter; likes: LiveCounter }>
+  const reactions = root.get('reactions');
+
+  // LiveCounter
+  const likes = reactions.get('likes');
+
+  reactions.set('hearts', 1); // Error: Argument of type 'number' is not assignable to parameter of type 'LiveCounter'.ts(2345)
+  ```
+
+blang[javascript].
+
+  h2(#getroot). Typing channel.objects.getRoot()
+
+  You can pass a type parameter directly to the @channel.objects.getRoot<T>()@ method call to type the root object for a channel explicitly:
+
+blang[javascript].
+
+  ```[javascript]
+  // Define types for different root objects
+  type ReactionsRoot = {
+    hearts: LiveCounter;
+    likes: LiveCounter;
+  };
+
+  type PollsRoot = {
+    currentPoll: LiveMap;
+  };
+
+  // LiveMap<{ hearts: LiveCounter; likes: LiveCounter }>
+  const reactionsRoot = await reactionsChannel.objects.getRoot<ReactionsRoot>();
+
+  // LiveMap<{ currentPoll: LiveMap }>
+  const pollsRoot = await pollsChannel.objects.getRoot<PollsRoot>();
+  ```
+
+blang[javascript].
+
+  Typing @channel.objects.getRoot<T>()@ is particularly useful when your application uses multiple channels, each with a different objects structure.