Update liveobjects example to use latest LiveObjects changes from ably-js

Local ably-js-liveobjects build is based on the next PR [1]

[1] ably/ably-js#1985

Author: VeskeR

examples/ably-2.5.0-liveobjects.tgz

@@ -12,14 +12,14 @@ LiveCounters are implemented using [Ably LiveObjects](https://ably.com/docs/live
 
 Use the following methods to interact with a LiveCounter in your application:
 
-* [`liveObjects.getRoot()`](https://ably.com/docs/liveobjects) - retrieves the root object that serves as the starting point for storing and organizing LiveObjects state.
-* [`liveObjects.createCounter()`](https://ably.com/docs/liveobjects) - creates a new LiveCounter instance.
+* [`objects.getRoot()`](https://ably.com/docs/liveobjects) - retrieves the root object that serves as the starting point for storing and organizing objects on a channel.
+* [`objects.createCounter()`](https://ably.com/docs/liveobjects) - creates a new LiveCounter instance.
 * [`liveCounter.value()`](https://ably.com/docs/liveobjects/livecounter) - returns the current value of a counter.
 * [`liveCounter.increment()`](https://ably.com/docs/liveobjects/livecounter) - sends the operation message to the Ably system to increase the counter value.
 * [`liveCounter.decrement()`](https://ably.com/docs/liveobjects/livecounter) - sends the operation message to the Ably system to decrease the counter value.
 * [`liveCounter.subscribe()`](https://ably.com/docs/liveobjects/livecounter) - subscribes to LiveCounter updates by registering a listener.
 
-Find out more about [LiveCounters](https://ably.com/docs/liveobjects/livecounter).
+Find out more about [LiveCounter](https://ably.com/docs/liveobjects/livecounter).
 
 ## Getting started
 

examples/liveobjects-live-counter/javascript/README.md

@@ -2,7 +2,7 @@ import { LiveCounter } from 'ably';
 import { Color } from './script';
 
 declare global {
-  export interface LiveObjectsTypes {
+  export interface ObjectsTypes {
     root: {
       [Color.red]: LiveCounter;
       [Color.green]: LiveCounter;

examples/liveobjects-live-counter/javascript/src/ably.config.d.ts

@@ -1,5 +1,5 @@
 import { DefaultRoot, LiveCounter, LiveMap, Realtime } from 'ably';
-import LiveObjects from 'ably/liveobjects';
+import Objects from 'ably/objects';
 import { nanoid } from 'nanoid';
 import './styles.css';
 
@@ -13,12 +13,12 @@ const client = new Realtime({
   clientId: nanoid(),
   key: import.meta.env.VITE_PUBLIC_ABLY_KEY as string,
   environment: 'sandbox',
-  plugins: { LiveObjects },
+  plugins: { Objects },
 });
 
 const urlParams = new URLSearchParams(window.location.search);
 
-const channelName = urlParams.get('name') || 'liveobjects-live-counter';
+const channelName = urlParams.get('name') || 'objects-live-counter';
 const channel = client.channels.get(channelName, { modes: ['STATE_PUBLISH', 'STATE_SUBSCRIBE'] });
 
 const colorCountDivs: Record<Color, HTMLElement> = {
@@ -31,8 +31,8 @@ const countersReset = document.getElementById('reset');
 async function main() {
   await channel.attach();
 
-  const liveObjects = channel.liveObjects;
-  const root = await liveObjects.getRoot();
+  const objects = channel.objects;
+  const root = await objects.getRoot();
 
   await initCounters(root);
   addEventListenersToButtons(root);
@@ -62,7 +62,7 @@ async function initCounters(root: LiveMap<DefaultRoot>) {
         return;
       }
 
-      await root.set(color, await channel.liveObjects.createCounter());
+      await root.set(color, await channel.objects.createCounter());
     }),
   );
 }
@@ -83,7 +83,7 @@ function addEventListenersToButtons(root: LiveMap<DefaultRoot>) {
   });
 
   countersReset.addEventListener('click', () => {
-    Object.values(Color).forEach(async (color) => root.set(color, await channel.liveObjects.createCounter()));
+    Object.values(Color).forEach(async (color) => root.set(color, await channel.objects.createCounter()));
   });
 }
 

examples/liveobjects-live-counter/javascript/src/script.ts

@@ -2,7 +2,7 @@
 
 Enable clients to update and synchronize key/value data across in an application in realtime.
 
-LiveMap provides a simple way to manage shared key/value state in realtime applications. It allows you to store primitive values and other Live Objects, enabling a composable state.
+LiveMap provides a simple way to manage shared key/value state in realtime applications. It allows you to store primitive values and other objects, enabling a composable state.
 
 LiveMaps can be used to store both predefined and dynamic datasets that need to be updated in realtime. They are ideal for scenarios such as collaborative task management, live leaderboards, multiplayer game state, shared settings, or live dashboards.
 
@@ -12,14 +12,14 @@ LiveMaps are implemented using [Ably LiveObjects](https://ably.com/docs/liveobje
 
 Use the following methods to interact with a LiveMap in your application:
 
-* [`liveObjects.getRoot()`](https://ably.com/docs/liveobjects) - retrieves the root object that serves as the starting point for storing and organizing LiveObjects state.
-* [`liveObjects.createMap()`](https://ably.com/docs/liveobjects) - creates a new LiveMap instance.
+* [`objects.getRoot()`](https://ably.com/docs/liveobjects) - retrieves the root object that serves as the starting point for storing and organizing objects on a channel.
+* [`objects.createMap()`](https://ably.com/docs/liveobjects) - creates a new LiveMap instance.
 * [`liveMap.get(key)`](https://ably.com/docs/liveobjects/livemap) - returns the current value associated with a given key in the map.
 * [`liveMap.set(key, value)`](https://ably.com/docs/liveobjects/livemap) - sends the operation message to the Ably system to assign a value to a key in the map.
 * [`liveMap.remove(key)`](https://ably.com/docs/liveobjects/livemap) - sends the operation message to the Ably system to remove a key from the map.
 * [`liveMap.subscribe()`](https://ably.com/docs/liveobjects/livemap) - subscribes to LiveMap updates by registering a listener.
 
-Find out more about [LiveMaps](https://ably.com/docs/liveobjects/livemap).
+Find out more about [LiveMap](https://ably.com/docs/liveobjects/livemap).
 
 ## Getting started
 

examples/liveobjects-live-map/javascript/README.md

@@ -3,7 +3,7 @@ import { LiveMap } from 'ably';
 export type Tasks = LiveMap<{ [key: string]: string }>;
 
 declare global {
-  export interface LiveObjectsTypes {
+  export interface ObjectsTypes {
     root: {
       tasks: Tasks;
     };

examples/liveobjects-live-map/javascript/src/ably.config.d.ts

@@ -1,5 +1,5 @@
 import { DefaultRoot, LiveMap, Realtime } from 'ably';
-import LiveObjects from 'ably/liveobjects';
+import Objects from 'ably/objects';
 import { nanoid } from 'nanoid';
 import { Tasks } from './ably.config';
 import './styles.css';
@@ -8,13 +8,13 @@ const client = new Realtime({
   clientId: nanoid(),
   key: import.meta.env.VITE_PUBLIC_ABLY_KEY as string,
   environment: 'sandbox',
-  plugins: { LiveObjects },
+  plugins: { Objects },
 });
 
 const urlParams = new URLSearchParams(window.location.search);
 
-const channelName = urlParams.get('name') || 'liveobjects-live-map';
-const channel = client.channels.get(channelName, { modes: ['STATE_PUBLISH', 'STATE_SUBSCRIBE'] });
+const channelName = urlParams.get('name') || 'objects-live-map';
+const channel = client.channels.get(channelName, { modes: ['OBJECT_PUBLISH', 'OBJECT_SUBSCRIBE'] });
 
 const taskInput = document.getElementById('task-input') as HTMLInputElement;
 const addTaskButton = document.getElementById('add-task');
@@ -24,8 +24,8 @@ const removeAllTasksDiv = document.getElementById('remove-tasks');
 async function main() {
   await channel.attach();
 
-  const liveObjects = channel.liveObjects;
-  const root = await liveObjects.getRoot();
+  const objects = channel.objects;
+  const root = await objects.getRoot();
 
   await initTasks(root);
   addEventListenersToButtons(root);
@@ -45,7 +45,7 @@ async function initTasks(root: LiveMap<DefaultRoot>) {
     return;
   }
 
-  await root.set('tasks', await channel.liveObjects.createMap());
+  await root.set('tasks', await channel.objects.createMap());
 }
 
 function subscribeToTasksUpdates(tasks: Tasks) {
@@ -122,7 +122,7 @@ function addEventListenersToButtons(root: LiveMap<DefaultRoot>) {
   });
 
   removeAllTasksDiv.addEventListener('click', async () => {
-    await root.set('tasks', await channel.liveObjects.createMap());
+    await root.set('tasks', await channel.objects.createMap());
   });
 }
 

examples/liveobjects-live-map/javascript/src/script.ts

@@ -944,18 +944,7 @@
 
 "ably@file:./ably-2.5.0-liveobjects.tgz":
   version "2.5.0"
-  resolved "file:./ably-2.5.0-liveobjects.tgz#58d547974185dd396842d6f4cbc67e1ac90b8100"
-  dependencies:
-    "@ably/msgpack-js" "^0.4.0"
-    deep-equal "^2.2.3"
-    fastestsmallesttextencoderdecoder "^1.0.22"
-    got "^11.8.5"
-    ulid "^2.3.0"
-    ws "^8.17.1"
-
-"ably@file:./liveobjects-live-counter/javascript/ably-2.5.0-liveobjects.tgz":
-  version "2.5.0"
-  resolved "file:./liveobjects-live-counter/javascript/ably-2.5.0-liveobjects.tgz#4638e4ee033acfe1dba7d4227ab8c0df08dfb81e"
+  resolved "file:./ably-2.5.0-liveobjects.tgz#4638e4ee033acfe1dba7d4227ab8c0df08dfb81e"
   dependencies:
     "@ably/msgpack-js" "^0.4.0"
     deep-equal "^2.2.3"
@@ -3962,8 +3951,16 @@ streamsearch@^1.1.0:
   resolved "https://registry.yarnpkg.com/streamsearch/-/streamsearch-1.1.0.tgz#404dd1e2247ca94af554e841a8ef0eaa238da764"
   integrity sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==
 
-"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0:
-  name string-width-cjs
+"string-width-cjs@npm:string-width@^4.2.0":
+  version "4.2.3"
+  resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
+  integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
+  dependencies:
+    emoji-regex "^8.0.0"
+    is-fullwidth-code-point "^3.0.0"
+    strip-ansi "^6.0.1"
+
+string-width@^4.1.0:
   version "4.2.3"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
   integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@@ -4049,8 +4046,14 @@ string.prototype.trimstart@^1.0.8:
     define-properties "^1.2.1"
     es-object-atoms "^1.0.0"
 
-"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1:
-  name strip-ansi-cjs
+"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
+  integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
+  dependencies:
+    ansi-regex "^5.0.1"
+
+strip-ansi@^6.0.0, strip-ansi@^6.0.1:
   version "6.0.1"
   resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
   integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
@@ -4111,7 +4114,7 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-4.0.14.tgz#531548524eb422fb8b89a24ebdf267c6726a09c6"
   integrity sha512-92YT2dpt671tFiHH/e1ok9D987N9fHD5VWoly1CdPD/Cd1HMglvZwP3nx2yTj2lbXDAHt8QssZkxTLCCTNL+xw==
 
-tailwindcss@^3.4.1, tailwindcss@^3.4.13:
+tailwindcss@^3.4.1:
   version "3.4.17"
   resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.4.17.tgz#ae8406c0f96696a631c790768ff319d46d5e5a63"
   integrity sha512-w33E2aCvSDP0tW9RZuNXadXlkHXqFzSkQew/aIa2i/Sj8fThxwovwlXHSPXTbAHwEIhBFXAedUhP2tueAKP8Og==
@@ -4294,11 +4297,6 @@ typescript@^5:
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.7.3.tgz#919b44a7dbb8583a9b856d162be24a54bf80073e"
   integrity sha512-84MVSjMEHP+FQRPy3pX9sTVV/INIex71s9TL2Gm5FG/WG1SqXeKyZ0k7/blY/4FdOzI12CBy1vGc4og/eus0fw==
 
-typescript@^5.6.3:
-  version "5.8.2"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.8.2.tgz#8170b3702f74b79db2e5a96207c15e65807999e4"
-  integrity sha512-aJn6wq13/afZp/jT9QZmwEjDqqvSGp1VT5GVg+f/t6/oVyrgXM6BY1h9BRh/O5p3PlUPAe+WuiEZOmb/49RqoQ==
-
 uikit@^3.7.0:
   version "3.23.1"
   resolved "https://registry.yarnpkg.com/uikit/-/uikit-3.23.1.tgz#38c2d8b5e2ab5d2e5433ba3831320192c7c0ee5e"