docs(readme): update to reflect new plugin setup

docs/plugin-development.md

@@ -37,12 +37,10 @@ Now in the new plugin folder, create a file called `package.json` with the follo
       "clean": "rm -rf dist"
     },
     "dependencies": {
-
+        // plugin specific dependencies
     },
     "devDependencies": {
-      "@types/node": "^20.14.9",
-      "ts-node": "^10.9.2",
-      "typescript": "^4.9.5"
+        // plugin specific dev dependencies
     }
 }
 ```
@@ -52,26 +50,13 @@ In the new plugin folder, create a `tsconfig.json` file with the following conte
 ```json
 {
     "extends": "../../../tsconfig.json",
-    "compilerOptions": {
-      "outDir": "dist",
-      "rootDir": "src",
-      "lib": ["ESNext", "DOM"],
-      "module": "ESNext",
-      "target": "ESNext",
-      "moduleResolution": "node",
-      "esModuleInterop": true,
-      "declaration": true,
-      "sourceMap": true, 
-      "strict": true,
-      "types": ["node"]
-    },
-    "include": ["src/**/*"]
+    "include": ["src"]
 }
 ```
 
 ### Create the Source Files
 
-In the new plugin folder, create a `src` folder and add an `index.ts` and `pluginClass.ts` file with the following content:
+In the new plugin folder, create a `src` folder and add an `index.ts` and `PluginClass.ts` file with the following content:
 
 `index.ts`
 
@@ -82,7 +67,7 @@ export { default as PluginClass } from './PluginClass';
 `PluginClass.ts`
 
 ```typescript
-import { Plugin } from '@productled/core';
+import type { Plugin } from '@productled/core';
 
 export class PluginClass implements Plugin {
     private key: string = "plugin-name";
@@ -91,10 +76,8 @@ export class PluginClass implements Plugin {
         return this.key;
     }
 
-    create(element: HTMLElement, conf: any, theme: Theme): void {
-        if (element) {
-            // Apply the plugin effect on the specified HTML element
-        }
+    initialize(hooks: Hook[], theme: Theme): void {
+        // Initialize plugin effects based on configruations
     }
 
     removeAll(): void {
@@ -103,23 +86,20 @@ export class PluginClass implements Plugin {
 }
 ```
 
-### The `create` Method
+### The `initialize` Method
 
 ```typescript
-create(element: HTMLElement, conf: any, theme: Theme): void {
-    if (element) {
-        // Apply the plugin effect on the specified HTML element
-    }
+initialize(hooks: Hook[], theme: Theme): void {
+    // Initialize plugin effects based on configruations
 }
 ```
 
-The `create` method takes three parameters: `element`, `conf`, and `theme`. Here's what each parameter represents:
+The `initialize` method takes two parameters: `hooks`, and `theme`. Here's what each parameter represents:
 
-- **`element`** is of type `HTMLElement`. It represents the HTML element on which the plugin will create the effect.
-- **`conf`** is of type `any`. It represents the configuration object that contains properties specified in the `productled-config.json` file. These properties will be used to customize the effect created by the plugin.
+- **`hooks`** is of type `Hook[]`. It represents the configuration objects that contains properties specified in the `productled-config.json` file. These properties will be used to customize the effect created by the plugin.
 - **`theme`** is of type `Theme`. It represents the theme object that will be used to style the effect created by the plugin.
 
-In summary, the `create` method is responsible for creating an effect on a specified HTML element. It uses the provided configuration and theme to customize the spotlight's appearance and behavior.
+In summary, the `initilaize` method is responsible for creating effects for a specific plugin on a specific route. It uses the provided configurations and theme to customize the spotlight's appearance and behavior.
 
 ### The `removeAll` Method
 

packages/samples/react-sample/README.md

@@ -4,9 +4,16 @@ This project was bootstrapped with [Create React App](https://github.com/faceboo
 
 ## Available Scripts
 
-In the project directory, you can run:
+In the root directory, you can run:
+
+### `npm run build --workspaces'`
+
+Then switch to the sample directory:
+
+### `cd .\packages\samples\react-sample`
+
+Start the showcase app:
 
-### `npm run build --workspace='@productled/spotlight'`
 ### `npm start`
 
 Runs the app in the development mode.\