npm - cogsbox-state - Versions diffs - 0.5.475-canary.4 → 0.5.475-canary.8 - Mend

cogsbox-state 0.5.475-canary.4 → 0.5.475-canary.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (11) hide show

package/dist/Components.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Components.jsx","sources":["../src/Components.tsx"],"sourcesContent":["import {\r\n FormElementParams,\r\n StateObject,\r\n UpdateTypeDetail,\r\n type FormOptsType,\r\n} from './CogsState';\r\nimport { pluginStore } from './pluginStore';\r\nimport {\r\n createMetadataContext,\r\n createScopedMetadataContext,\r\n toDeconstructedMethods,\r\n} from './plugins';\r\nimport React, {\r\n memo,\r\n RefObject,\r\n useCallback,\r\n useEffect,\r\n useLayoutEffect,\r\n useRef,\r\n useState,\r\n useMemo,\r\n} from 'react';\r\nimport { getGlobalStore, ValidationError, ValidationSeverity } from './store';\r\nimport { useInView } from 'react-intersection-observer';\r\nimport { v4 as uuidv4 } from 'uuid';\r\nimport { isDeepEqual } from './utility';\r\nimport { runValidation } from './validation';\r\n\r\nconst {\r\n getInitialOptions,\r\n\r\n getShadowMetadata,\r\n setShadowMetadata,\r\n getShadowValue,\r\n\r\n registerComponent,\r\n unregisterComponent,\r\n\r\n notifyPathSubscribers,\r\n subscribeToPath,\r\n} = getGlobalStore.getState();\r\nconst { stateHandlers, notifyFormUpdate } = pluginStore.getState();\r\n\r\nexport type ValidationWrapperProps = {\r\n formOpts?: FormOptsType;\r\n path: string[];\r\n stateKey: string;\r\n children: React.ReactNode;\r\n};\r\n\r\nexport function ValidationWrapper({\r\n formOpts,\r\n path,\r\n stateKey,\r\n children,\r\n}: ValidationWrapperProps) {\r\n const { getInitialOptions, getShadowMetadata, getShadowValue } =\r\n getGlobalStore.getState();\r\n const thisStateOpts = getInitialOptions(stateKey!);\r\n\r\n const shadowMeta = getShadowMetadata(stateKey!, path);\r\n const validationState = shadowMeta?.validation;\r\n\r\n const status = validationState?.status \|\| 'NOT_VALIDATED';\r\n\r\n const errors = (validationState?.errors \|\| []).map((err) => ({\r\n ...err,\r\n path: path,\r\n })) as ValidationError[];\r\n const errorMessages = errors\r\n .filter((err) => err.severity === 'error')\r\n .map((err) => err.message);\r\n const warningMessages = errors\r\n .filter((err) => err.severity === 'warning')\r\n .map((err) => err.message);\r\n\r\n // Use first error, or first warning if no errors\r\n const message = errorMessages[0] \|\| warningMessages[0];\r\n const primarySeverity: ValidationSeverity =\r\n errorMessages.length > 0\r\n ? 'error'\r\n : warningMessages.length > 0\r\n ? 'warning'\r\n : undefined;\r\n const { registeredPlugins } = pluginStore.getState();\r\n const pluginsApi: any = {};\r\n\r\n // We iterate over ALL registered plugins in the app.\r\n registeredPlugins.forEach((plugin) => {\r\n // A plugin is considered \"active\" for this state key if its name\r\n // exists as a key in the options (e.g., options.syncPlugin exists).\r\n if (thisStateOpts && thisStateOpts.hasOwnProperty(plugin.name)) {\r\n const pluginName = plugin.name;\r\n\r\n // Now we can safely build the API for this active plugin.\r\n const hookData = pluginStore\r\n .getState()\r\n .getHookResult(stateKey, pluginName);\r\n\r\n const scopedMetadata = createScopedMetadataContext(\r\n stateKey,\r\n pluginName,\r\n path\r\n );\r\n\r\n pluginsApi[pluginName] = {\r\n hookData,\r\n getFieldMetaData: scopedMetadata.getFieldMetaData,\r\n setFieldMetaData: scopedMetadata.setFieldMetaData,\r\n };\r\n }\r\n });\r\n return (\r\n <>\r\n {thisStateOpts?.formElements?.validation &&\r\n !formOpts?.validation?.disable ? (\r\n thisStateOpts.formElements!.validation!({\r\n children: (\r\n <React.Fragment key={path.toString()}>{children}</React.Fragment>\r\n ),\r\n status, // Now passes the new ValidationStatus type\r\n message: formOpts?.validation?.hideMessage\r\n ? ''\r\n : formOpts?.validation?.message \|\| message \|\| '',\r\n severity: primarySeverity,\r\n hasErrors: errorMessages.length > 0,\r\n hasWarnings: warningMessages.length > 0,\r\n allErrors: errors,\r\n path: path,\r\n getData: () => getShadowValue(stateKey!, path),\r\n plugins: pluginsApi,\r\n })\r\n ) : (\r\n <React.Fragment key={path.toString()}>{children}</React.Fragment>\r\n )}\r\n </>\r\n );\r\n}\r\nexport const MemoizedCogsItemWrapper = memo(\r\n ListItemWrapper,\r\n (prevProps, nextProps) => {\r\n // Re-render if any of these change:\r\n return (\r\n prevProps.itemPath.join('.') === nextProps.itemPath.join('.') &&\r\n prevProps.stateKey === nextProps.stateKey &&\r\n prevProps.itemComponentId === nextProps.itemComponentId &&\r\n prevProps.localIndex === nextProps.localIndex\r\n );\r\n }\r\n);\r\nexport function ListItemWrapper({\r\n stateKey,\r\n itemComponentId,\r\n itemPath,\r\n localIndex,\r\n arraySetter,\r\n rebuildStateShape,\r\n renderFn,\r\n}: {\r\n stateKey: string;\r\n itemComponentId: string;\r\n itemPath: string[];\r\n localIndex: number;\r\n arraySetter: any;\r\n\r\n rebuildStateShape: (options: {\r\n currentState: any;\r\n path: string[];\r\n componentId: string;\r\n meta?: any;\r\n }) => any;\r\n renderFn: (\r\n setter: any,\r\n index: number,\r\n\r\n arraySetter: any\r\n ) => React.ReactNode;\r\n}) {\r\n const [, forceUpdate] = useState({});\r\n const { ref: inViewRef, inView } = useInView();\r\n const elementRef = useRef<HTMLDivElement \| null>(null);\r\n\r\n const imagesLoaded = useImageLoaded(elementRef);\r\n const hasReportedInitialHeight = useRef(false);\r\n const fullKey = [stateKey, ...itemPath].join('.');\r\n useRegisterComponent(stateKey, itemComponentId, forceUpdate);\r\n\r\n const setRefs = useCallback(\r\n (element: HTMLDivElement \| null) => {\r\n elementRef.current = element;\r\n inViewRef(element); // This is the ref from useInView\r\n },\r\n [inViewRef]\r\n );\r\n\r\n useEffect(() => {\r\n const unsubscribe = subscribeToPath(fullKey, (e) => {\r\n forceUpdate({});\r\n });\r\n return () => unsubscribe();\r\n }, [fullKey]);\r\n useEffect(() => {\r\n if (!inView \|\| !imagesLoaded \|\| hasReportedInitialHeight.current) {\r\n return;\r\n }\r\n\r\n const element = elementRef.current;\r\n if (element && element.offsetHeight > 0) {\r\n hasReportedInitialHeight.current = true;\r\n const newHeight = element.offsetHeight;\r\n\r\n setShadowMetadata(stateKey, itemPath, {\r\n virtualizer: {\r\n itemHeight: newHeight,\r\n domRef: element,\r\n },\r\n });\r\n\r\n const arrayPath = itemPath.slice(0, -1);\r\n const arrayPathKey = [stateKey, ...arrayPath].join('.');\r\n notifyPathSubscribers(arrayPathKey, {\r\n type: 'ITEMHEIGHT',\r\n itemKey: itemPath.join('.'),\r\n\r\n ref: elementRef.current,\r\n });\r\n }\r\n }, [inView, imagesLoaded, stateKey, itemPath]);\r\n\r\n const itemValue = getShadowValue(stateKey, itemPath);\r\n\r\n if (itemValue === undefined) {\r\n return null;\r\n }\r\n\r\n const itemSetter = rebuildStateShape({\r\n currentState: itemValue,\r\n path: itemPath,\r\n componentId: itemComponentId,\r\n });\r\n const children = renderFn(itemSetter, localIndex, arraySetter);\r\n\r\n return <div ref={setRefs}>{children}</div>;\r\n}\r\n\r\nexport function FormElementWrapper({\r\n stateKey,\r\n path,\r\n rebuildStateShape,\r\n renderFn,\r\n formOpts,\r\n setState,\r\n}: {\r\n stateKey: string;\r\n path: string[];\r\n rebuildStateShape: (options: {\r\n path: string[];\r\n componentId: string;\r\n meta?: any;\r\n }) => any;\r\n renderFn: (params: FormElementParams<any>) => React.ReactNode;\r\n formOpts?: FormOptsType;\r\n setState: any;\r\n}) {\r\n const componentId = useRef(uuidv4()).current;\r\n\r\n const [, forceUpdate] = useState({});\r\n const formElementRef = useRef<any>(null);\r\n const stateKeyPathKey = [stateKey, ...path].join('.');\r\n useRegisterComponent(stateKey, componentId, forceUpdate);\r\n // Get the shadow node to access typeInfo and schema\r\n const shadowNode = getGlobalStore.getState().getShadowNode(stateKey, path);\r\n const typeInfo = shadowNode?._meta?.typeInfo;\r\n\r\n const globalStateValue = getShadowValue(stateKey, path);\r\n const [localValue, setLocalValue] = useState<any>(globalStateValue);\r\n const isCurrentlyDebouncing = useRef(false);\r\n const debounceTimeoutRef = useRef<NodeJS.Timeout \| null>(null);\r\n\r\n useEffect(() => {\r\n if (\r\n !isCurrentlyDebouncing.current &&\r\n !isDeepEqual(globalStateValue, localValue)\r\n ) {\r\n setLocalValue(globalStateValue);\r\n }\r\n }, [globalStateValue]);\r\n\r\n useEffect(() => {\r\n const { getShadowMetadata, setShadowMetadata } = getGlobalStore.getState();\r\n\r\n // Initialize clientActivityState if needed\r\n const currentMeta = getShadowMetadata(stateKey, path) \|\| {};\r\n if (!currentMeta.clientActivityState) {\r\n currentMeta.clientActivityState = { elements: new Map() };\r\n }\r\n\r\n // Detect element type from the ref\r\n const detectElementType = () => {\r\n const el = formElementRef.current;\r\n if (!el) return 'input';\r\n const tagName = el.tagName.toLowerCase();\r\n if (tagName === 'textarea') return 'textarea';\r\n if (tagName === 'select') return 'select';\r\n if (tagName === 'input') {\r\n const type = (el as HTMLInputElement).type;\r\n if (type === 'checkbox') return 'checkbox';\r\n if (type === 'radio') return 'radio';\r\n if (type === 'range') return 'range';\r\n if (type === 'file') return 'file';\r\n }\r\n return 'input';\r\n };\r\n\r\n // Add this element to the Map\r\n currentMeta.clientActivityState.elements.set(componentId, {\r\n domRef: formElementRef,\r\n elementType: detectElementType(),\r\n inputType: formElementRef.current?.type,\r\n mountedAt: Date.now(),\r\n });\r\n\r\n setShadowMetadata(stateKey, path, currentMeta);\r\n\r\n // Subscribe to path updates\r\n const unsubscribe = getGlobalStore\r\n .getState()\r\n .subscribeToPath(stateKeyPathKey, (newValue) => {\r\n if (!isCurrentlyDebouncing.current && localValue !== newValue) {\r\n forceUpdate({});\r\n }\r\n });\r\n\r\n // Cleanup\r\n return () => {\r\n unsubscribe();\r\n\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n isCurrentlyDebouncing.current = false;\r\n }\r\n\r\n // Remove element from Map\r\n const meta = getGlobalStore.getState().getShadowMetadata(stateKey, path);\r\n if (meta?.clientActivityState?.elements) {\r\n meta.clientActivityState.elements.delete(componentId);\r\n setShadowMetadata(stateKey, path, meta);\r\n }\r\n };\r\n }, []);\r\n\r\n const debouncedUpdate = useCallback(\r\n (newValue: any) => {\r\n // Type conversion logic (keep existing)\r\n if (typeInfo) {\r\n if (typeInfo.type === 'number' && typeof newValue === 'string') {\r\n newValue =\r\n newValue === ''\r\n ? typeInfo.nullable\r\n ? null\r\n : (typeInfo.default ?? 0)\r\n : Number(newValue);\r\n } else if (\r\n typeInfo.type === 'boolean' &&\r\n typeof newValue === 'string'\r\n ) {\r\n newValue = newValue === 'true' \|\| newValue === '1';\r\n } else if (typeInfo.type === 'date' && typeof newValue === 'string') {\r\n newValue = new Date(newValue);\r\n }\r\n } else {\r\n const currentType = typeof globalStateValue;\r\n if (currentType === 'number' && typeof newValue === 'string') {\r\n newValue = newValue === '' ? 0 : Number(newValue);\r\n }\r\n }\r\n\r\n setLocalValue(newValue);\r\n\r\n // Update input activity details\r\n const { getShadowMetadata, setShadowMetadata } =\r\n getGlobalStore.getState();\r\n const meta = getShadowMetadata(stateKey, path);\r\n if (meta?.clientActivityState?.elements?.has(componentId)) {\r\n const element = meta.clientActivityState.elements.get(componentId);\r\n if (element && element.currentActivity?.type === 'focus') {\r\n element!.currentActivity.details = {\r\n ...element!.currentActivity.details,\r\n value: newValue,\r\n previousValue:\r\n element!.currentActivity.details?.value \|\| globalStateValue,\r\n inputLength:\r\n typeof newValue === 'string' ? newValue.length : undefined,\r\n keystrokeCount:\r\n (element!.currentActivity.details?.keystrokeCount \|\| 0) + 1,\r\n };\r\n setShadowMetadata(stateKey, path, meta);\r\n }\r\n }\r\n const element = meta?.clientActivityState?.elements?.get(componentId);\r\n\r\n // Notify plugins\r\n notifyFormUpdate({\r\n stateKey,\r\n activityType: 'input', // Changed from 'type'\r\n path,\r\n timestamp: Date.now(),\r\n details: {\r\n value: newValue,\r\n inputLength:\r\n typeof newValue === 'string' ? newValue.length : undefined,\r\n isComposing: false, // You'd need to track this from the actual input event\r\n isPasting: false, // You'd need to track this from paste events\r\n keystrokeCount:\r\n (element?.currentActivity?.details?.keystrokeCount \|\| 0) + 1,\r\n },\r\n });\r\n // Validation (keep existing)\r\n const virtualOperation: UpdateTypeDetail = {\r\n stateKey,\r\n path,\r\n newValue: newValue,\r\n updateType: 'update',\r\n timeStamp: Date.now(),\r\n status: 'new',\r\n oldValue: globalStateValue,\r\n };\r\n runValidation(virtualOperation, 'onChange');\r\n\r\n // Debounce state update (keep existing)\r\n isCurrentlyDebouncing.current = true;\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n }\r\n\r\n const debounceTime = formOpts?.debounceTime ?? 200;\r\n debounceTimeoutRef.current = setTimeout(() => {\r\n isCurrentlyDebouncing.current = false;\r\n setState(newValue, path, {\r\n updateType: 'update',\r\n validationTrigger: 'onChange',\r\n });\r\n }, debounceTime);\r\n },\r\n [\r\n setState,\r\n path,\r\n formOpts?.debounceTime,\r\n typeInfo,\r\n globalStateValue,\r\n stateKey,\r\n componentId,\r\n ]\r\n );\r\n\r\n const handleFocus = useCallback(() => {\r\n const { getShadowMetadata, setShadowMetadata } = getGlobalStore.getState();\r\n\r\n // Update element's current activity\r\n const meta = getShadowMetadata(stateKey, path);\r\n if (meta?.clientActivityState?.elements?.has(componentId)) {\r\n const element = meta.clientActivityState.elements.get(componentId)!;\r\n element.currentActivity = {\r\n type: 'focus',\r\n startTime: Date.now(),\r\n details: {\r\n value: localValue,\r\n inputLength:\r\n typeof localValue === 'string' ? localValue.length : undefined,\r\n },\r\n };\r\n setShadowMetadata(stateKey, path, meta);\r\n }\r\n\r\n // Notify plugins\r\n notifyFormUpdate({\r\n stateKey,\r\n activityType: 'focus', // Changed from 'type'\r\n path,\r\n timestamp: Date.now(),\r\n details: {\r\n cursorPosition: formElementRef.current?.selectionStart,\r\n },\r\n });\r\n }, [stateKey, path, componentId, localValue]);\r\n const handleBlur = useCallback(() => {\r\n const { getShadowMetadata, setShadowMetadata } = getGlobalStore.getState();\r\n\r\n // Clear debounce if active\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n debounceTimeoutRef.current = null;\r\n isCurrentlyDebouncing.current = false;\r\n setState(localValue, path, {\r\n updateType: 'update',\r\n validationTrigger: 'onBlur',\r\n });\r\n }\r\n\r\n // Clear element's current activity\r\n const meta = getShadowMetadata(stateKey, path);\r\n if (meta?.clientActivityState?.elements?.has(componentId)) {\r\n const element = meta.clientActivityState.elements.get(componentId)!;\r\n element.currentActivity = undefined;\r\n setShadowMetadata(stateKey, path, meta);\r\n }\r\n const focusStartTime =\r\n meta?.clientActivityState?.elements?.get(componentId)?.currentActivity\r\n ?.startTime;\r\n\r\n // Notify plugins\r\n notifyFormUpdate({\r\n stateKey,\r\n activityType: 'blur', // Changed from 'type'\r\n path,\r\n timestamp: Date.now(),\r\n duration: focusStartTime ? Date.now() - focusStartTime : undefined,\r\n details: {\r\n duration: focusStartTime ? Date.now() - focusStartTime : 0,\r\n },\r\n });\r\n\r\n // Run validation if configured\r\n const validationOptions = getInitialOptions(stateKey)?.validation;\r\n if (validationOptions?.onBlur) {\r\n const virtualOperation: UpdateTypeDetail = {\r\n stateKey,\r\n path,\r\n newValue: localValue,\r\n updateType: 'update',\r\n timeStamp: Date.now(),\r\n status: 'new',\r\n oldValue: globalStateValue,\r\n };\r\n runValidation(virtualOperation, 'onBlur');\r\n }\r\n }, [localValue, setState, path, stateKey, componentId, globalStateValue]);\r\n\r\n const baseState = rebuildStateShape({\r\n path: path,\r\n componentId: componentId,\r\n meta: undefined,\r\n });\r\n\r\n const stateWithInputProps = new Proxy(baseState, {\r\n get(target, prop) {\r\n if (prop === '$inputProps') {\r\n return {\r\n value: localValue ?? '',\r\n onChange: (e: any) => {\r\n debouncedUpdate(e.target.value);\r\n },\r\n onFocus: handleFocus,\r\n onBlur: handleBlur,\r\n ref: formElementRef,\r\n };\r\n }\r\n\r\n return target[prop];\r\n },\r\n });\r\n\r\n const initialElement = renderFn(stateWithInputProps);\r\n\r\n return (\r\n <ValidationWrapper formOpts={formOpts} path={path} stateKey={stateKey}>\r\n {initialElement}\r\n </ValidationWrapper>\r\n );\r\n}\r\nexport function useRegisterComponent(\r\n stateKey: string,\r\n componentId: string,\r\n forceUpdate: (o: object) => void\r\n) {\r\n const fullComponentId = `${stateKey}////${componentId}`;\r\n\r\n useLayoutEffect(() => {\r\n registerComponent(stateKey, fullComponentId, {\r\n forceUpdate: () => forceUpdate({}),\r\n paths: new Set(),\r\n reactiveType: ['component'],\r\n });\r\n return () => {\r\n unregisterComponent(stateKey, fullComponentId);\r\n };\r\n }, [stateKey, fullComponentId]);\r\n}\r\n\r\nconst useImageLoaded = (ref: RefObject<HTMLElement>): boolean => {\r\n const [loaded, setLoaded] = useState(false);\r\n\r\n useLayoutEffect(() => {\r\n if (!ref.current) {\r\n setLoaded(true);\r\n return;\r\n }\r\n\r\n const images = Array.from(ref.current.querySelectorAll('img'));\r\n\r\n // If there are no images, we are \"loaded\" immediately.\r\n if (images.length === 0) {\r\n setLoaded(true);\r\n return;\r\n }\r\n\r\n let loadedCount = 0;\r\n const handleImageLoad = () => {\r\n loadedCount++;\r\n if (loadedCount === images.length) {\r\n setLoaded(true);\r\n }\r\n };\r\n\r\n images.forEach((image) => {\r\n if (image.complete) {\r\n handleImageLoad();\r\n } else {\r\n image.addEventListener('load', handleImageLoad);\r\n image.addEventListener('error', handleImageLoad);\r\n }\r\n });\r\n\r\n return () => {\r\n images.forEach((image) => {\r\n image.removeEventListener('load', handleImageLoad);\r\n image.removeEventListener('error', handleImageLoad);\r\n });\r\n };\r\n }, [ref.current]);\r\n\r\n return loaded;\r\n};\r\n// Components.tsx\r\n\r\n// Generic isolated component wrapper\r\nexport function IsolatedComponentWrapper({\r\n stateKey,\r\n path,\r\n rebuildStateShape,\r\n renderFn,\r\n}: {\r\n stateKey: string;\r\n path: string[];\r\n rebuildStateShape: (options: {\r\n path: string[];\r\n componentId: string;\r\n meta?: any;\r\n }) => any;\r\n renderFn: (state: any) => React.ReactNode;\r\n}) {\r\n const [componentId] = useState(() => uuidv4());\r\n const [, forceUpdate] = useState({});\r\n\r\n const stateKeyPathKey = [stateKey, ...path].join('.');\r\n useRegisterComponent(stateKey, componentId, forceUpdate);\r\n\r\n useEffect(() => {\r\n const unsubscribe = getGlobalStore\r\n .getState()\r\n .subscribeToPath(stateKeyPathKey, () => {\r\n forceUpdate({});\r\n });\r\n return () => unsubscribe();\r\n }, [stateKeyPathKey]);\r\n\r\n const baseState = rebuildStateShape({\r\n path: path,\r\n componentId: componentId,\r\n meta: undefined,\r\n });\r\n\r\n return <>{renderFn(baseState)}</>;\r\n}\r\n\r\n// 1. Define the MINIMAL props needed.\r\ntype PluginWrapperProps = {\r\n children: React.ReactNode;\r\n stateKey: string;\r\n path: string[];\r\n pluginName: string;\r\n wrapperDepth: number;\r\n};\r\n\r\nconst PluginWrapper = memo(function PluginWrapper({\r\n children,\r\n stateKey,\r\n path,\r\n pluginName,\r\n wrapperDepth,\r\n}: PluginWrapperProps) {\r\n const [, forceUpdate] = useState({});\r\n\r\n useEffect(() => {\r\n const fullPathKey = [stateKey, ...path].join('.');\r\n const unsubscribe = getGlobalStore\r\n .getState()\r\n .subscribeToPath(fullPathKey, () => {\r\n forceUpdate({});\r\n });\r\n return unsubscribe;\r\n }, [stateKey, path]);\r\n\r\n const plugin = pluginStore\r\n .getState()\r\n .registeredPlugins.find((p) => p.name === pluginName);\r\n\r\n const stateHandler: StateObject<any> \| undefined = pluginStore\r\n .getState()\r\n .stateHandlers.get(stateKey);\r\n\r\n const typeInfo = getGlobalStore.getState().getShadowNode(stateKey, path)\r\n ?._meta?.typeInfo;\r\n\r\n const options = pluginStore\r\n .getState()\r\n .pluginOptions.get(stateKey)\r\n ?.get(pluginName);\r\n\r\n const hookData = pluginStore.getState().getHookResult(stateKey, pluginName);\r\n\r\n if (!plugin?.formWrapper \|\| !stateHandler) {\r\n return <>{children}</>;\r\n }\r\n\r\n const deconstructed = toDeconstructedMethods(stateHandler);\r\n const scopedMetadataContext = createScopedMetadataContext(\r\n stateKey,\r\n plugin.name,\r\n path\r\n );\r\n return plugin.formWrapper({\r\n element: children,\r\n path,\r\n stateKey,\r\n pluginName: plugin.name,\r\n ...deconstructed,\r\n\r\n ...scopedMetadataContext,\r\n options,\r\n hookData,\r\n fieldType: typeInfo?.type,\r\n wrapperDepth,\r\n });\r\n});\r\n"],"names":["getInitialOptions","getShadowMetadata","setShadowMetadata","getShadowValue","registerComponent","unregisterComponent","notifyPathSubscribers","subscribeToPath","getGlobalStore","stateHandlers","notifyFormUpdate","pluginStore","ValidationWrapper","formOpts","path","stateKey","children","thisStateOpts","validationState","status","errors","err","errorMessages","warningMessages","message","primarySeverity","registeredPlugins","pluginsApi","plugin","pluginName","hookData","scopedMetadata","createScopedMetadataContext","jsx","Fragment","React","MemoizedCogsItemWrapper","memo","ListItemWrapper","prevProps","nextProps","itemComponentId","itemPath","localIndex","arraySetter","rebuildStateShape","renderFn","forceUpdate","useState","inViewRef","inView","useInView","elementRef","useRef","imagesLoaded","useImageLoaded","hasReportedInitialHeight","fullKey","useRegisterComponent","setRefs","useCallback","element","useEffect","unsubscribe","e","newHeight","arrayPath","arrayPathKey","itemValue","itemSetter","FormElementWrapper","setState","componentId","uuidv4","formElementRef","stateKeyPathKey","typeInfo","globalStateValue","localValue","setLocalValue","isCurrentlyDebouncing","debounceTimeoutRef","isDeepEqual","currentMeta","detectElementType","el","tagName","type","newValue","meta","debouncedUpdate","runValidation","debounceTime","handleFocus","handleBlur","focusStartTime","baseState","stateWithInputProps","target","prop","initialElement","fullComponentId","useLayoutEffect","ref","loaded","setLoaded","images","loadedCount","handleImageLoad","image","IsolatedComponentWrapper","wrapperDepth","fullPathKey","p","stateHandler","options","deconstructed","toDeconstructedMethods","scopedMetadataContext"],"mappings":"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"}
1	+ {"version":3,"file":"Components.jsx","sources":["../src/Components.tsx"],"sourcesContent":["import {\r\n FormElementParams,\r\n StateObject,\r\n UpdateTypeDetail,\r\n type FormOptsType,\r\n} from './CogsState';\r\nimport { pluginStore } from './pluginStore';\r\nimport {\r\n createMetadataContext,\r\n createScopedMetadataContext,\r\n toDeconstructedMethods,\r\n} from './plugins';\r\nimport React, {\r\n memo,\r\n RefObject,\r\n useCallback,\r\n useEffect,\r\n useLayoutEffect,\r\n useRef,\r\n useState,\r\n useMemo,\r\n} from 'react';\r\nimport { getGlobalStore, ValidationError, ValidationSeverity } from './store';\r\nimport { useInView } from 'react-intersection-observer';\r\nimport { v4 as uuidv4 } from 'uuid';\r\nimport { isDeepEqual } from './utility';\r\nimport { runValidation } from './validation';\r\n\r\nconst {\r\n getInitialOptions,\r\n\r\n getShadowMetadata,\r\n setShadowMetadata,\r\n getShadowValue,\r\n\r\n registerComponent,\r\n unregisterComponent,\r\n\r\n notifyPathSubscribers,\r\n subscribeToPath,\r\n} = getGlobalStore.getState();\r\nconst { stateHandlers, notifyFormUpdate } = pluginStore.getState();\r\n\r\nexport type ValidationWrapperProps = {\r\n formOpts?: FormOptsType;\r\n path: string[];\r\n stateKey: string;\r\n children: React.ReactNode;\r\n};\r\n\r\nexport function ValidationWrapper({\r\n formOpts,\r\n path,\r\n stateKey,\r\n children,\r\n}: ValidationWrapperProps) {\r\n const { getInitialOptions, getShadowMetadata, getShadowValue } =\r\n getGlobalStore.getState();\r\n const thisStateOpts = getInitialOptions(stateKey!);\r\n\r\n const shadowMeta = getShadowMetadata(stateKey!, path);\r\n const validationState = shadowMeta?.validation;\r\n\r\n const status = validationState?.status \|\| 'NOT_VALIDATED';\r\n\r\n const errors = (validationState?.errors \|\| []).map((err) => ({\r\n ...err,\r\n path: path,\r\n })) as ValidationError[];\r\n const errorMessages = errors\r\n .filter((err) => err.severity === 'error')\r\n .map((err) => err.message);\r\n const warningMessages = errors\r\n .filter((err) => err.severity === 'warning')\r\n .map((err) => err.message);\r\n\r\n // Use first error, or first warning if no errors\r\n const message = errorMessages[0] \|\| warningMessages[0];\r\n const primarySeverity: ValidationSeverity =\r\n errorMessages.length > 0\r\n ? 'error'\r\n : warningMessages.length > 0\r\n ? 'warning'\r\n : undefined;\r\n const { registeredPlugins } = pluginStore.getState();\r\n const pluginsApi: any = {};\r\n\r\n // We iterate over ALL registered plugins in the app.\r\n registeredPlugins.forEach((plugin) => {\r\n // A plugin is considered \"active\" for this state key if its name\r\n // exists as a key in the options (e.g., options.syncPlugin exists).\r\n if (thisStateOpts && thisStateOpts.hasOwnProperty(plugin.name)) {\r\n const pluginName = plugin.name;\r\n\r\n // Now we can safely build the API for this active plugin.\r\n const hookData = pluginStore\r\n .getState()\r\n .getHookResult(stateKey, pluginName);\r\n\r\n const scopedMetadata = createScopedMetadataContext(\r\n stateKey,\r\n pluginName,\r\n path\r\n );\r\n\r\n pluginsApi[pluginName] = {\r\n hookData,\r\n getFieldMetaData: scopedMetadata.getFieldMetaData,\r\n setFieldMetaData: scopedMetadata.setFieldMetaData,\r\n };\r\n }\r\n });\r\n return (\r\n <>\r\n {thisStateOpts?.formElements?.validation &&\r\n !formOpts?.validation?.disable ? (\r\n thisStateOpts.formElements!.validation!({\r\n children: (\r\n <React.Fragment key={path.toString()}>{children}</React.Fragment>\r\n ),\r\n status, // Now passes the new ValidationStatus type\r\n message: formOpts?.validation?.hideMessage\r\n ? ''\r\n : formOpts?.validation?.message \|\| message \|\| '',\r\n severity: primarySeverity,\r\n hasErrors: errorMessages.length > 0,\r\n hasWarnings: warningMessages.length > 0,\r\n allErrors: errors,\r\n path: path,\r\n getData: () => getShadowValue(stateKey!, path),\r\n plugins: pluginsApi,\r\n })\r\n ) : (\r\n <React.Fragment key={path.toString()}>{children}</React.Fragment>\r\n )}\r\n </>\r\n );\r\n}\r\nexport const MemoizedCogsItemWrapper = memo(\r\n ListItemWrapper,\r\n (prevProps, nextProps) => {\r\n // Re-render if any of these change:\r\n return (\r\n prevProps.itemPath.join('.') === nextProps.itemPath.join('.') &&\r\n prevProps.stateKey === nextProps.stateKey &&\r\n prevProps.itemComponentId === nextProps.itemComponentId &&\r\n prevProps.localIndex === nextProps.localIndex\r\n );\r\n }\r\n);\r\nexport function ListItemWrapper({\r\n stateKey,\r\n itemComponentId,\r\n itemPath,\r\n localIndex,\r\n arraySetter,\r\n rebuildStateShape,\r\n renderFn,\r\n}: {\r\n stateKey: string;\r\n itemComponentId: string;\r\n itemPath: string[];\r\n localIndex: number;\r\n arraySetter: any;\r\n\r\n rebuildStateShape: (options: {\r\n currentState: any;\r\n path: string[];\r\n componentId: string;\r\n meta?: any;\r\n }) => any;\r\n renderFn: (\r\n setter: any,\r\n index: number,\r\n\r\n arraySetter: any\r\n ) => React.ReactNode;\r\n}) {\r\n const [, forceUpdate] = useState({});\r\n const { ref: inViewRef, inView } = useInView();\r\n const elementRef = useRef<HTMLDivElement \| null>(null);\r\n\r\n const imagesLoaded = useImageLoaded(elementRef);\r\n const hasReportedInitialHeight = useRef(false);\r\n const fullKey = [stateKey, ...itemPath].join('.');\r\n useRegisterComponent(stateKey, itemComponentId, forceUpdate);\r\n\r\n const setRefs = useCallback(\r\n (element: HTMLDivElement \| null) => {\r\n elementRef.current = element;\r\n inViewRef(element); // This is the ref from useInView\r\n },\r\n [inViewRef]\r\n );\r\n\r\n useEffect(() => {\r\n const unsubscribe = subscribeToPath(fullKey, (e) => {\r\n forceUpdate({});\r\n });\r\n return () => unsubscribe();\r\n }, [fullKey]);\r\n useEffect(() => {\r\n if (!inView \|\| !imagesLoaded \|\| hasReportedInitialHeight.current) {\r\n return;\r\n }\r\n\r\n const element = elementRef.current;\r\n if (element && element.offsetHeight > 0) {\r\n hasReportedInitialHeight.current = true;\r\n const newHeight = element.offsetHeight;\r\n\r\n setShadowMetadata(stateKey, itemPath, {\r\n virtualizer: {\r\n itemHeight: newHeight,\r\n domRef: element,\r\n },\r\n });\r\n\r\n const arrayPath = itemPath.slice(0, -1);\r\n const arrayPathKey = [stateKey, ...arrayPath].join('.');\r\n notifyPathSubscribers(arrayPathKey, {\r\n type: 'ITEMHEIGHT',\r\n itemKey: itemPath.join('.'),\r\n\r\n ref: elementRef.current,\r\n });\r\n }\r\n }, [inView, imagesLoaded, stateKey, itemPath]);\r\n\r\n const itemValue = getShadowValue(stateKey, itemPath);\r\n\r\n if (itemValue === undefined) {\r\n return null;\r\n }\r\n\r\n const itemSetter = rebuildStateShape({\r\n currentState: itemValue,\r\n path: itemPath,\r\n componentId: itemComponentId,\r\n });\r\n const children = renderFn(itemSetter, localIndex, arraySetter);\r\n\r\n return <div ref={setRefs}>{children}</div>;\r\n}\r\n\r\nexport function FormElementWrapper({\r\n stateKey,\r\n path,\r\n rebuildStateShape,\r\n renderFn,\r\n formOpts,\r\n setState,\r\n}: {\r\n stateKey: string;\r\n path: string[];\r\n rebuildStateShape: (options: {\r\n path: string[];\r\n componentId: string;\r\n meta?: any;\r\n }) => any;\r\n renderFn: (params: FormElementParams<any>) => React.ReactNode;\r\n formOpts?: FormOptsType;\r\n setState: any;\r\n}) {\r\n const componentId = useRef(uuidv4()).current;\r\n\r\n const [, forceUpdate] = useState({});\r\n const formElementRef = useRef<any>(null);\r\n const stateKeyPathKey = [stateKey, ...path].join('.');\r\n useRegisterComponent(stateKey, componentId, forceUpdate);\r\n // Get the shadow node to access typeInfo and schema\r\n const shadowNode = getGlobalStore.getState().getShadowNode(stateKey, path);\r\n const typeInfo = shadowNode?._meta?.typeInfo;\r\n\r\n const globalStateValue = getShadowValue(stateKey, path);\r\n const [localValue, setLocalValue] = useState<any>(globalStateValue);\r\n const isCurrentlyDebouncing = useRef(false);\r\n const debounceTimeoutRef = useRef<NodeJS.Timeout \| null>(null);\r\n\r\n useEffect(() => {\r\n if (\r\n !isCurrentlyDebouncing.current &&\r\n !isDeepEqual(globalStateValue, localValue)\r\n ) {\r\n setLocalValue(globalStateValue);\r\n }\r\n }, [globalStateValue]);\r\n\r\n useEffect(() => {\r\n const { getShadowMetadata, setShadowMetadata } = getGlobalStore.getState();\r\n\r\n // Initialize clientActivityState if needed\r\n const currentMeta = getShadowMetadata(stateKey, path) \|\| {};\r\n if (!currentMeta.clientActivityState) {\r\n currentMeta.clientActivityState = { elements: new Map() };\r\n }\r\n\r\n // Detect element type from the ref\r\n const detectElementType = () => {\r\n const el = formElementRef.current;\r\n if (!el) return 'input';\r\n const tagName = el.tagName.toLowerCase();\r\n if (tagName === 'textarea') return 'textarea';\r\n if (tagName === 'select') return 'select';\r\n if (tagName === 'input') {\r\n const type = (el as HTMLInputElement).type;\r\n if (type === 'checkbox') return 'checkbox';\r\n if (type === 'radio') return 'radio';\r\n if (type === 'range') return 'range';\r\n if (type === 'file') return 'file';\r\n }\r\n return 'input';\r\n };\r\n\r\n // Add this element to the Map\r\n currentMeta.clientActivityState.elements.set(componentId, {\r\n domRef: formElementRef,\r\n elementType: detectElementType(),\r\n inputType: formElementRef.current?.type,\r\n mountedAt: Date.now(),\r\n });\r\n\r\n setShadowMetadata(stateKey, path, currentMeta);\r\n\r\n // Subscribe to path updates\r\n const unsubscribe = getGlobalStore\r\n .getState()\r\n .subscribeToPath(stateKeyPathKey, (newValue) => {\r\n if (!isCurrentlyDebouncing.current && localValue !== newValue) {\r\n forceUpdate({});\r\n }\r\n });\r\n\r\n // Cleanup\r\n return () => {\r\n unsubscribe();\r\n\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n isCurrentlyDebouncing.current = false;\r\n }\r\n\r\n // Remove element from Map\r\n const meta = getGlobalStore.getState().getShadowMetadata(stateKey, path);\r\n if (meta?.clientActivityState?.elements) {\r\n meta.clientActivityState.elements.delete(componentId);\r\n setShadowMetadata(stateKey, path, meta);\r\n }\r\n };\r\n }, []);\r\n\r\n const debouncedUpdate = useCallback(\r\n (newValue: any) => {\r\n // Type conversion logic (keep existing)\r\n if (typeInfo) {\r\n if (typeInfo.type === 'number' && typeof newValue === 'string') {\r\n newValue =\r\n newValue === ''\r\n ? typeInfo.nullable\r\n ? null\r\n : (typeInfo.default ?? 0)\r\n : Number(newValue);\r\n } else if (\r\n typeInfo.type === 'boolean' &&\r\n typeof newValue === 'string'\r\n ) {\r\n newValue = newValue === 'true' \|\| newValue === '1';\r\n } else if (typeInfo.type === 'date' && typeof newValue === 'string') {\r\n newValue = new Date(newValue);\r\n }\r\n } else {\r\n const currentType = typeof globalStateValue;\r\n if (currentType === 'number' && typeof newValue === 'string') {\r\n newValue = newValue === '' ? 0 : Number(newValue);\r\n }\r\n }\r\n\r\n setLocalValue(newValue);\r\n\r\n // Update input activity details\r\n const { getShadowMetadata, setShadowMetadata } =\r\n getGlobalStore.getState();\r\n const meta = getShadowMetadata(stateKey, path);\r\n if (meta?.clientActivityState?.elements?.has(componentId)) {\r\n const element = meta.clientActivityState.elements.get(componentId);\r\n if (element && element.currentActivity?.type === 'focus') {\r\n element!.currentActivity.details = {\r\n ...element!.currentActivity.details,\r\n value: newValue,\r\n previousValue:\r\n element!.currentActivity.details?.value \|\| globalStateValue,\r\n inputLength:\r\n typeof newValue === 'string' ? newValue.length : undefined,\r\n keystrokeCount:\r\n (element!.currentActivity.details?.keystrokeCount \|\| 0) + 1,\r\n };\r\n setShadowMetadata(stateKey, path, meta);\r\n }\r\n }\r\n const element = meta?.clientActivityState?.elements?.get(componentId);\r\n\r\n // Notify plugins\r\n notifyFormUpdate({\r\n stateKey,\r\n activityType: 'input', // Changed from 'type'\r\n path,\r\n timestamp: Date.now(),\r\n details: {\r\n value: newValue,\r\n inputLength:\r\n typeof newValue === 'string' ? newValue.length : undefined,\r\n isComposing: false, // You'd need to track this from the actual input event\r\n isPasting: false, // You'd need to track this from paste events\r\n keystrokeCount:\r\n (element?.currentActivity?.details?.keystrokeCount \|\| 0) + 1,\r\n },\r\n });\r\n // Validation (keep existing)\r\n const virtualOperation: UpdateTypeDetail = {\r\n stateKey,\r\n path,\r\n newValue: newValue,\r\n updateType: 'update',\r\n timeStamp: Date.now(),\r\n status: 'new',\r\n oldValue: globalStateValue,\r\n };\r\n runValidation(virtualOperation, 'onChange');\r\n\r\n // Debounce state update (keep existing)\r\n isCurrentlyDebouncing.current = true;\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n }\r\n\r\n const debounceTime = formOpts?.debounceTime ?? 200;\r\n debounceTimeoutRef.current = setTimeout(() => {\r\n isCurrentlyDebouncing.current = false;\r\n setState(newValue, path, {\r\n updateType: 'update',\r\n validationTrigger: 'onChange',\r\n });\r\n }, debounceTime);\r\n },\r\n [\r\n setState,\r\n path,\r\n formOpts?.debounceTime,\r\n typeInfo,\r\n globalStateValue,\r\n stateKey,\r\n componentId,\r\n ]\r\n );\r\n\r\n const handleFocus = useCallback(() => {\r\n const { getShadowMetadata, setShadowMetadata } = getGlobalStore.getState();\r\n\r\n // Update element's current activity\r\n const meta = getShadowMetadata(stateKey, path);\r\n if (meta?.clientActivityState?.elements?.has(componentId)) {\r\n const element = meta.clientActivityState.elements.get(componentId)!;\r\n element.currentActivity = {\r\n type: 'focus',\r\n startTime: Date.now(),\r\n details: {\r\n value: localValue,\r\n inputLength:\r\n typeof localValue === 'string' ? localValue.length : undefined,\r\n },\r\n };\r\n setShadowMetadata(stateKey, path, meta);\r\n }\r\n\r\n // Notify plugins\r\n notifyFormUpdate({\r\n stateKey,\r\n activityType: 'focus', // Changed from 'type'\r\n path,\r\n timestamp: Date.now(),\r\n details: {\r\n cursorPosition: formElementRef.current?.selectionStart,\r\n },\r\n });\r\n }, [stateKey, path, componentId, localValue]);\r\n const handleBlur = useCallback(() => {\r\n const { getShadowMetadata, setShadowMetadata } = getGlobalStore.getState();\r\n\r\n // Clear debounce if active\r\n if (debounceTimeoutRef.current) {\r\n clearTimeout(debounceTimeoutRef.current);\r\n debounceTimeoutRef.current = null;\r\n isCurrentlyDebouncing.current = false;\r\n setState(localValue, path, {\r\n updateType: 'update',\r\n validationTrigger: 'onBlur',\r\n });\r\n }\r\n\r\n // Clear element's current activity\r\n const meta = getShadowMetadata(stateKey, path);\r\n if (meta?.clientActivityState?.elements?.has(componentId)) {\r\n const element = meta.clientActivityState.elements.get(componentId)!;\r\n element.currentActivity = undefined;\r\n setShadowMetadata(stateKey, path, meta);\r\n }\r\n const focusStartTime =\r\n meta?.clientActivityState?.elements?.get(componentId)?.currentActivity\r\n ?.startTime;\r\n\r\n // Notify plugins\r\n notifyFormUpdate({\r\n stateKey,\r\n activityType: 'blur', // Changed from 'type'\r\n path,\r\n timestamp: Date.now(),\r\n duration: focusStartTime ? Date.now() - focusStartTime : undefined,\r\n details: {\r\n duration: focusStartTime ? Date.now() - focusStartTime : 0,\r\n },\r\n });\r\n\r\n // Run validation if configured\r\n const validationOptions = getInitialOptions(stateKey)?.validation;\r\n if (validationOptions?.onBlur) {\r\n const virtualOperation: UpdateTypeDetail = {\r\n stateKey,\r\n path,\r\n newValue: localValue,\r\n updateType: 'update',\r\n timeStamp: Date.now(),\r\n status: 'new',\r\n oldValue: globalStateValue,\r\n };\r\n runValidation(virtualOperation, 'onBlur');\r\n }\r\n }, [localValue, setState, path, stateKey, componentId, globalStateValue]);\r\n\r\n const baseState = rebuildStateShape({\r\n path: path,\r\n componentId: componentId,\r\n meta: undefined,\r\n });\r\n\r\n const stateWithInputProps = new Proxy(baseState, {\r\n get(target, prop) {\r\n if (prop === '$inputProps') {\r\n return {\r\n value: localValue ?? '',\r\n onChange: (e: any) => {\r\n debouncedUpdate(e.target.value);\r\n },\r\n onFocus: handleFocus,\r\n onBlur: handleBlur,\r\n ref: formElementRef,\r\n };\r\n }\r\n\r\n return target[prop];\r\n },\r\n });\r\n\r\n const initialElement = renderFn(stateWithInputProps);\r\n\r\n return (\r\n <ValidationWrapper formOpts={formOpts} path={path} stateKey={stateKey}>\r\n {initialElement}\r\n </ValidationWrapper>\r\n );\r\n}\r\nexport function useRegisterComponent(\r\n stateKey: string,\r\n componentId: string,\r\n forceUpdate: (o: object) => void\r\n) {\r\n const fullComponentId = `${stateKey}////${componentId}`;\r\n\r\n useLayoutEffect(() => {\r\n registerComponent(stateKey, fullComponentId, {\r\n forceUpdate: () => forceUpdate({}),\r\n paths: new Set(),\r\n reactiveType: ['component'],\r\n });\r\n return () => {\r\n unregisterComponent(stateKey, fullComponentId);\r\n };\r\n }, [stateKey, fullComponentId]);\r\n}\r\n\r\nconst useImageLoaded = (ref: RefObject<HTMLElement>): boolean => {\r\n const [loaded, setLoaded] = useState(false);\r\n\r\n useLayoutEffect(() => {\r\n if (!ref.current) {\r\n setLoaded(true);\r\n return;\r\n }\r\n\r\n const images = Array.from(ref.current.querySelectorAll('img'));\r\n\r\n // If there are no images, we are \"loaded\" immediately.\r\n if (images.length === 0) {\r\n setLoaded(true);\r\n return;\r\n }\r\n\r\n let loadedCount = 0;\r\n const handleImageLoad = () => {\r\n loadedCount++;\r\n if (loadedCount === images.length) {\r\n setLoaded(true);\r\n }\r\n };\r\n\r\n images.forEach((image) => {\r\n if (image.complete) {\r\n handleImageLoad();\r\n } else {\r\n image.addEventListener('load', handleImageLoad);\r\n image.addEventListener('error', handleImageLoad);\r\n }\r\n });\r\n\r\n return () => {\r\n images.forEach((image) => {\r\n image.removeEventListener('load', handleImageLoad);\r\n image.removeEventListener('error', handleImageLoad);\r\n });\r\n };\r\n }, [ref.current]);\r\n\r\n return loaded;\r\n};\r\n// Components.tsx\r\n\r\nexport function IsolatedComponentWrapper({\r\n stateKey,\r\n path, // The path of the parent node (e.g. ['form'])\r\n dependencies, // NEW: Optional array of Proxy objects or path arrays\r\n rebuildStateShape,\r\n renderFn,\r\n}: {\r\n stateKey: string;\r\n path: string[];\r\n dependencies?: any[]; // The explicit list of dependencies\r\n rebuildStateShape: (options: any) => any;\r\n renderFn: (state: any) => React.ReactNode;\r\n}) {\r\n const [componentId] = useState(() => uuidv4());\r\n const [, forceUpdate] = useState({});\r\n\r\n useRegisterComponent(stateKey, componentId, forceUpdate);\r\n\r\n const pathsToSubscribe = useMemo(() => {\r\n if (dependencies && dependencies.length > 0) {\r\n return dependencies.map((dep) => {\r\n return [stateKey, ...dep.$_path].join('.');\r\n });\r\n }\r\n\r\n return [[stateKey, ...path].join('.')];\r\n }, [stateKey, path, dependencies]);\r\n\r\n // 2. Subscribe to ALL calculated paths\r\n useEffect(() => {\r\n const store = getGlobalStore.getState();\r\n\r\n // Create an array of unsubscribe functions\r\n const unsubs = pathsToSubscribe.map((fullPathKey) => {\r\n return store.subscribeToPath(fullPathKey, () => {\r\n forceUpdate({});\r\n });\r\n });\r\n\r\n return () => {\r\n unsubs.forEach((unsub) => unsub());\r\n };\r\n }, [pathsToSubscribe]);\r\n\r\n const baseState = rebuildStateShape({\r\n path: path,\r\n componentId: componentId,\r\n meta: undefined,\r\n });\r\n\r\n return <>{renderFn(baseState)}</>;\r\n}\r\n// 1. Define the MINIMAL props needed.\r\ntype PluginWrapperProps = {\r\n children: React.ReactNode;\r\n stateKey: string;\r\n path: string[];\r\n pluginName: string;\r\n wrapperDepth: number;\r\n};\r\n\r\nconst PluginWrapper = memo(function PluginWrapper({\r\n children,\r\n stateKey,\r\n path,\r\n pluginName,\r\n wrapperDepth,\r\n}: PluginWrapperProps) {\r\n const [, forceUpdate] = useState({});\r\n\r\n useEffect(() => {\r\n const fullPathKey = [stateKey, ...path].join('.');\r\n const unsubscribe = getGlobalStore\r\n .getState()\r\n .subscribeToPath(fullPathKey, () => {\r\n forceUpdate({});\r\n });\r\n return unsubscribe;\r\n }, [stateKey, path]);\r\n\r\n const plugin = pluginStore\r\n .getState()\r\n .registeredPlugins.find((p) => p.name === pluginName);\r\n\r\n const stateHandler: StateObject<any> \| undefined = pluginStore\r\n .getState()\r\n .stateHandlers.get(stateKey);\r\n\r\n const typeInfo = getGlobalStore.getState().getShadowNode(stateKey, path)\r\n ?._meta?.typeInfo;\r\n\r\n const options = pluginStore\r\n .getState()\r\n .pluginOptions.get(stateKey)\r\n ?.get(pluginName);\r\n\r\n const hookData = pluginStore.getState().getHookResult(stateKey, pluginName);\r\n\r\n if (!plugin?.formWrapper \|\| !stateHandler) {\r\n return <>{children}</>;\r\n }\r\n\r\n const deconstructed = toDeconstructedMethods(stateHandler);\r\n const scopedMetadataContext = createScopedMetadataContext(\r\n stateKey,\r\n plugin.name,\r\n path\r\n );\r\n return plugin.formWrapper({\r\n element: children,\r\n path,\r\n stateKey,\r\n pluginName: plugin.name,\r\n ...deconstructed,\r\n\r\n ...scopedMetadataContext,\r\n options,\r\n hookData,\r\n fieldType: typeInfo?.type,\r\n wrapperDepth,\r\n });\r\n});\r\n"],"names":["getInitialOptions","getShadowMetadata","setShadowMetadata","getShadowValue","registerComponent","unregisterComponent","notifyPathSubscribers","subscribeToPath","getGlobalStore","stateHandlers","notifyFormUpdate","pluginStore","ValidationWrapper","formOpts","path","stateKey","children","thisStateOpts","validationState","status","errors","err","errorMessages","warningMessages","message","primarySeverity","registeredPlugins","pluginsApi","plugin","pluginName","hookData","scopedMetadata","createScopedMetadataContext","jsx","Fragment","React","MemoizedCogsItemWrapper","memo","ListItemWrapper","prevProps","nextProps","itemComponentId","itemPath","localIndex","arraySetter","rebuildStateShape","renderFn","forceUpdate","useState","inViewRef","inView","useInView","elementRef","useRef","imagesLoaded","useImageLoaded","hasReportedInitialHeight","fullKey","useRegisterComponent","setRefs","useCallback","element","useEffect","unsubscribe","e","newHeight","arrayPath","arrayPathKey","itemValue","itemSetter","FormElementWrapper","setState","componentId","uuidv4","formElementRef","stateKeyPathKey","typeInfo","globalStateValue","localValue","setLocalValue","isCurrentlyDebouncing","debounceTimeoutRef","isDeepEqual","currentMeta","detectElementType","el","tagName","type","newValue","meta","debouncedUpdate","runValidation","debounceTime","handleFocus","handleBlur","focusStartTime","baseState","stateWithInputProps","target","prop","initialElement","fullComponentId","useLayoutEffect","ref","loaded","setLoaded","images","loadedCount","handleImageLoad","image","IsolatedComponentWrapper","dependencies","pathsToSubscribe","useMemo","dep","store","unsubs","fullPathKey","unsub","wrapperDepth","p","stateHandler","options","deconstructed","toDeconstructedMethods","scopedMetadataContext"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "cogsbox-state",
-  "version": "0.5.475-canary.4",
+  "version": "0.5.475-canary.8",
   "description": "React state management library with form controls and server sync",
   "type": "module",
   "main": "./dist/index.js",
@@ -48,7 +48,7 @@
   },
   "peerDependencies": {
     "@trpc/next": "^10.0.0 || ^11.0.0",
-    "@types/react": "^18.0.0",
+    "@types/react": "^18.0.0 || ^19.0.0",
     "zod": "^3.25.0 || ^4.0.0"
   },
   "devDependencies": {

package/src/CogsState.tsx CHANGED Viewed

@@ -230,9 +230,18 @@ export type EndType<
   $update: UpdateType<T>;
   $_path: string[];
   $_stateKey: string;
-  $isolate: (
-    renderFn: (state: StateObject<T, TPlugins>) => React.ReactNode
-  ) => JSX.Element;
+  $isolate: {
+    // Overload 1: Just the render function (Default behavior)
+    (
+      renderFn: (state: StateObject<T, TPlugins>) => React.ReactNode
+    ): JSX.Element;
+    // Overload 2: Dependencies array + render function (Optimized behavior)
+    (
+      dependencies: any[],
+      renderFn: (state: StateObject<T, TPlugins>) => React.ReactNode
+    ): JSX.Element;
+  };
   $formElement: (
     control: FormControl<T>,
     opts?: PerPathFormOptsType<T, TPlugins>
@@ -314,6 +323,7 @@ export type StateObject<
   };
 export type CogsUpdate<T extends unknown> = UpdateType<T>;
 type EffectiveSetStateArg<
   T,
   UpdateType extends 'update' | 'insert' | 'cut',
@@ -349,7 +359,6 @@ export type UpdateTypeDetail = {
   oldValue: any;
   newValue: any;
   userId?: number;
   itemId?: string;
   insertAfterId?: string;
   metaData?: Record<string, any>;
@@ -511,14 +520,12 @@ const {
   addPathComponent,
   clearSelectedIndexesForState,
   addStateLog,
-  setSyncInfo,
   clearSelectedIndex,
   getSyncInfo,
   notifyPathSubscribers,
   getPluginMetaDataMap,
   setPluginMetaData,
   removePluginMetaData,
-  // Note: The old functions are no longer imported under their original names
 } = getGlobalStore.getState();
 const { notifyUpdate } = pluginStore.getState();
@@ -1069,9 +1076,7 @@ let isFlushScheduled = false;
 function scheduleFlush() {
   if (!isFlushScheduled) {
     isFlushScheduled = true;
-    console.log('Scheduling flush');
     queueMicrotask(() => {
-      console.log('Actually flushing');
       flushQueue();
     });
   }
@@ -2764,7 +2769,7 @@ function createProxyHandler<
         if (prop === '$cut') {
           return (index?: number, options?: { waitForSync?: boolean }) => {
             const shadowMeta = getShadowMetadata(stateKey, path);
-            console.log('shadowMeta ->>>>>>>>>>>>>>>>', shadowMeta);
             if (!shadowMeta?.arrayKeys || shadowMeta.arrayKeys.length === 0)
               return;
@@ -2775,12 +2780,8 @@ function createProxyHandler<
                   ? index
                   : shadowMeta.arrayKeys.length - 1;
-            console.log('indexToCut ->>>>>>>>>>>>>>>>', indexToCut);
             const idToCut = shadowMeta.arrayKeys[indexToCut];
             if (!idToCut) return;
-            console.log('idToCut ->>>>>>>>>>>>>>>>', idToCut);
             effectiveSetState(null, [...path, idToCut], {
               updateType: 'cut',
             });
@@ -3011,7 +3012,6 @@ function createProxyHandler<
               getPluginMetaDataMap(stateKey, path)?.get(pluginName);
           }
           if (prop === '$addPluginMetaData') {
-            console.log('$addPluginMetaDat');
             return (pluginName: string, data: Record<string, any>) =>
               setPluginMetaData(stateKey, path, pluginName, data);
           }
@@ -3078,12 +3078,6 @@ function createProxyHandler<
               },
               metaData?: Record<string, any>
             ) => {
-              console.log(
-                'getGlobalStore',
-                getGlobalStore
-                  .getState()
-                  .getShadowMetadata(stateKey, operation.path)
-              );
               let index: number | undefined;
               if (
                 operation.insertAfterId &&
@@ -3269,11 +3263,29 @@ function createProxyHandler<
           };
         }
         if (prop === '$isolate') {
-          return (renderFn: (state: any) => React.ReactNode) => {
+          // We accept (renderFn) OR (deps, renderFn)
+          return (
+            arg1: any[] | ((state: any) => React.ReactNode),
+            arg2?: (state: any) => React.ReactNode
+          ) => {
+            // Check if the first argument is the dependency array
+            const hasDependencies = Array.isArray(arg1);
+            // Normalize arguments
+            const dependencies = hasDependencies ? arg1 : undefined;
+            const renderFn = hasDependencies ? arg2 : arg1;
+            if (!renderFn || typeof renderFn !== 'function') {
+              throw new Error(
+                'CogsState: $isolate requires a render function.'
+              );
+            }
             return (
               <IsolatedComponentWrapper
                 stateKey={stateKey}
-                path={path}
+                path={path} // The path of the node calling $isolate (e.g. "form")
+                dependencies={dependencies} // Pass the specific parts to watch
                 rebuildStateShape={rebuildStateShape}
                 renderFn={renderFn}
               />

package/src/Components.tsx CHANGED Viewed

@@ -633,36 +633,49 @@ const useImageLoaded = (ref: RefObject<HTMLElement>): boolean => {
 };
 // Components.tsx
-// Generic isolated component wrapper
 export function IsolatedComponentWrapper({
   stateKey,
-  path,
+  path, // The path of the parent node (e.g. ['form'])
+  dependencies, // NEW: Optional array of Proxy objects or path arrays
   rebuildStateShape,
   renderFn,
 }: {
   stateKey: string;
   path: string[];
-  rebuildStateShape: (options: {
-    path: string[];
-    componentId: string;
-    meta?: any;
-  }) => any;
+  dependencies?: any[]; // The explicit list of dependencies
+  rebuildStateShape: (options: any) => any;
   renderFn: (state: any) => React.ReactNode;
 }) {
   const [componentId] = useState(() => uuidv4());
   const [, forceUpdate] = useState({});
-  const stateKeyPathKey = [stateKey, ...path].join('.');
   useRegisterComponent(stateKey, componentId, forceUpdate);
+  const pathsToSubscribe = useMemo(() => {
+    if (dependencies && dependencies.length > 0) {
+      return dependencies.map((dep) => {
+        return [stateKey, ...dep.$_path].join('.');
+      });
+    }
+    return [[stateKey, ...path].join('.')];
+  }, [stateKey, path, dependencies]);
+  // 2. Subscribe to ALL calculated paths
   useEffect(() => {
-    const unsubscribe = getGlobalStore
-      .getState()
-      .subscribeToPath(stateKeyPathKey, () => {
+    const store = getGlobalStore.getState();
+    // Create an array of unsubscribe functions
+    const unsubs = pathsToSubscribe.map((fullPathKey) => {
+      return store.subscribeToPath(fullPathKey, () => {
         forceUpdate({});
       });
-    return () => unsubscribe();
-  }, [stateKeyPathKey]);
+    });
+    return () => {
+      unsubs.forEach((unsub) => unsub());
+    };
+  }, [pathsToSubscribe]);
   const baseState = rebuildStateShape({
     path: path,
@@ -672,7 +685,6 @@ export function IsolatedComponentWrapper({
   return <>{renderFn(baseState)}</>;
 }
 // 1. Define the MINIMAL props needed.
 type PluginWrapperProps = {
   children: React.ReactNode;