add hook

Author: alisonjlai

src/react/hooks.ts

@@ -8,6 +8,7 @@ import {
   WorkbookElementData,
   WorkbookSelection,
   WorkbookVariable,
+  PluginStyle,
 } from '../types';
 import { deepEqual } from '../utils/deepEqual';
 
@@ -246,3 +247,15 @@ export function useActionEffect(configId: string, effect: () => void) {
     return client.config.registerEffect(configId, effectRef.current);
   }, [client, configId, effect]);
 }
+
+/**
+ * React hook for accessing plugin style properties
+ * @returns {PluginStyle} Style properties
+ */
+export function usePluginStyle(): PluginStyle {
+  const client = useConfig();
+
+  return {
+    backgroundColor: client?.backgroundColor,
+  };
+}

src/types.ts

@@ -2,6 +2,13 @@ export type ScalarType = 'boolean' | 'datetime' | 'number' | 'integer' | 'text';
 export type PrimitiveType = ScalarType | 'variant' | 'link';
 export type ValueType = PrimitiveType | 'error';
 
+/**
+ * Style properties that can be configured through the plugin format panel
+ */
+export interface PluginStyle {
+  backgroundColor?: string;
+}
+
 /**
  * All mutable workbook control variable types
  */