@cratis/components 1.0.4 → 1.1.0

package/dist/cjs/CommandDialog/CommandDialog.js

@@ -15,9 +15,9 @@ const useCommandDialogContext = () => {
     return context;
 };
 const CommandDialogWrapper = ({ header, visible, width, confirmLabel, cancelLabel, onConfirm, onCancel, onBeforeExecute, children }) => {
-    const { setCommandValues, setCommandResult, commandResult } = commands.useCommandFormContext();
+    const { setCommandValues, setCommandResult, isValid } = commands.useCommandFormContext();
     const commandInstance = commands.useCommandInstance();
-    const isDialogValid = !commandResult || commandResult.isValid;
+    const isDialogValid = isValid;
     const handleConfirm = async () => {
         if (onBeforeExecute) {
             const transformedValues = onBeforeExecute(commandInstance);

package/dist/cjs/CommandDialog/CommandDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommandDialog.js","sources":["../../../CommandDialog/CommandDialog.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { ICommandResult } from '@cratis/arc/commands';\nimport { Constructor } from '@cratis/fundamentals';\nimport { DialogButtons } from '@cratis/arc.react/dialogs';\nimport { Dialog } from '../Dialogs/Dialog';\nimport React, { createContext, useContext } from 'react';\nimport { \n    CommandForm, \n    CommandFormFieldWrapper,\n    useCommandFormContext, \n    useCommandInstance\n} from '@cratis/arc.react/commands';\n\ntype CommandFormProps = React.ComponentProps<typeof CommandForm>;\n\n// Local type definitions\nexport type BeforeExecuteCallback<TCommand> = (values: TCommand) => TCommand;\n\nexport type FieldValidator<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => string | undefined;\nexport type FieldChangeCallback<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => void;\n\nexport interface CommandDialogProps<TCommand, TResponse = object> {\n    command: Constructor<TCommand>;\n    initialValues?: Partial<TCommand>;\n    currentValues?: Partial<TCommand> | undefined;\n    visible: boolean;\n    header: string;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    confirmIcon?: string;\n    cancelIcon?: string;\n    onConfirm: (result: ICommandResult<TResponse>) => void | Promise<void>;\n    onCancel: () => void;\n    onFieldValidate?: FieldValidator<TCommand>;\n    onFieldChange?: FieldChangeCallback<TCommand>;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n    children?: React.ReactNode;\n    style?: React.CSSProperties;\n    width?: string;\n    showTitles?: boolean;\n    showErrors?: boolean;\n    validateOn?: CommandFormProps['validateOn'];\n    validateAllFieldsOnChange?: boolean;\n    validateOnInit?: boolean;\n    autoServerValidate?: boolean;\n    autoServerValidateThrottle?: number;\n    fieldContainerComponent?: CommandFormProps['fieldContainerComponent'];\n    fieldDecoratorComponent?: CommandFormProps['fieldDecoratorComponent'];\n    errorDisplayComponent?: CommandFormProps['errorDisplayComponent'];\n    tooltipComponent?: CommandFormProps['tooltipComponent'];\n    errorClassName?: string;\n    iconAddonClassName?: string;\n}\n\ninterface CommandDialogContextValue<TCommand = unknown> {\n    onSuccess: (result: ICommandResult<unknown>) => void | Promise<void>;\n    onCancel: () => void;\n    confirmLabel: string;\n    cancelLabel: string;\n    confirmIcon: string;\n    cancelIcon: string;\n    onFieldValidate?: FieldValidator<TCommand>;\n    onFieldChange?: FieldChangeCallback<TCommand>;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n}\n\nconst CommandDialogContext = createContext<CommandDialogContextValue<unknown> | undefined>(undefined);\n\nexport const useCommandDialogContext = <TCommand = unknown,>() => {\n    const context = useContext(CommandDialogContext);\n    if (!context) {\n        throw new Error('useCommandDialogContext must be used within a CommandDialog');\n    }\n    return context as CommandDialogContextValue<TCommand>;\n};\n\nconst CommandDialogWrapper = <TCommand extends object>({\n    header,\n    visible,\n    width,\n    confirmLabel,\n    cancelLabel,\n    onConfirm,\n    onCancel,\n    onBeforeExecute,\n    children\n}: {\n    header: string;\n    visible: boolean;\n    width: string;\n    confirmLabel: string;\n    cancelLabel: string;\n    onConfirm: (result: ICommandResult<unknown>) => void | Promise<void>;\n    onCancel: () => void;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n    children: React.ReactNode;\n}) => {\n    const { setCommandValues, setCommandResult, commandResult } = useCommandFormContext<TCommand>();\n    const commandInstance = useCommandInstance<TCommand>();\n\n    // Compute real dialog validity from commandResult.\n    // fieldValidities in CommandForm is never populated by field renderers, so\n    // the context's isValid is always vacuously true. We derive validity from\n    // the actual validation result instead:\n    // - No result yet (before any validate call) → enabled (allow first submit)\n    // - commandResult.isValid → reflects actual validation state\n    const isDialogValid = !commandResult || commandResult.isValid;\n\n    const handleConfirm = async () => {\n        if (onBeforeExecute) {\n            const transformedValues = onBeforeExecute(commandInstance);\n            setCommandValues(transformedValues);\n        }\n        const result = await (commandInstance as unknown as { execute: () => Promise<ICommandResult<unknown>> }).execute();\n        if (result.isSuccess) {\n            await onConfirm(result);\n            return true;\n        } else {\n            setCommandResult(result);\n            return false;\n        }\n    };\n\n    const processChildren = (nodes: React.ReactNode): React.ReactNode => {\n        return React.Children.map(nodes, (child) => {\n            if (!React.isValidElement(child)) return child;\n\n            const component = child.type as React.ComponentType<unknown>;\n            if (component.displayName === 'CommandFormField') {\n                type FieldElement = Parameters<typeof CommandFormFieldWrapper>[0]['field'];\n                return <CommandFormFieldWrapper field={child as unknown as FieldElement} />;\n            }\n\n            const childProps = child.props as Record<string, unknown>;\n            if (childProps.children != null) {\n                return React.cloneElement(child as React.ReactElement<Record<string, unknown>>, {\n                    children: processChildren(childProps.children as React.ReactNode)\n                });\n            }\n\n            return child;\n        });\n    };\n\n    const processedChildren = processChildren(children);\n\n    return (\n        <Dialog\n            title={header}\n            visible={visible}\n            width={width}\n            onConfirm={handleConfirm}\n            onCancel={onCancel}\n            buttons={DialogButtons.OkCancel}\n            okLabel={confirmLabel}\n            cancelLabel={cancelLabel}\n            isValid={isDialogValid}\n        >\n            <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }}>\n                {processedChildren}\n            </div>\n        </Dialog>\n    );\n};\n\nconst CommandDialogFieldsWrapper = (props: { children: React.ReactNode }) => {\n    return (\n        <CommandForm.Fields>\n            {props.children}\n        </CommandForm.Fields>\n    );\n};\n\nconst CommandDialogComponent = <TCommand extends object = object, TResponse = object>(props: CommandDialogProps<TCommand, TResponse>) => {\n    const {\n        command,\n        initialValues,\n        currentValues,\n        visible,\n        header,\n        confirmLabel = 'Confirm',\n        cancelLabel = 'Cancel',\n        confirmIcon = 'pi pi-check',\n        cancelIcon = 'pi pi-times',\n        onConfirm,\n        onCancel,\n        onFieldValidate,\n        onFieldChange,\n        onBeforeExecute,\n        children,\n        width = '50vw',\n        showTitles,\n        showErrors,\n        validateOn,\n        validateAllFieldsOnChange,\n        validateOnInit,\n        autoServerValidate,\n        autoServerValidateThrottle,\n        fieldContainerComponent,\n        fieldDecoratorComponent,\n        errorDisplayComponent,\n        tooltipComponent,\n        errorClassName,\n        iconAddonClassName\n    } = props;\n\n    const contextValue: CommandDialogContextValue<TCommand> = {\n        onSuccess: onConfirm,\n        onCancel,\n        confirmLabel,\n        cancelLabel,\n        confirmIcon,\n        cancelIcon,\n        onFieldValidate,\n        onFieldChange,\n        onBeforeExecute\n    };\n\n    return (\n        <CommandDialogContext.Provider value={contextValue}>\n            <CommandForm\n                command={command}\n                initialValues={initialValues}\n                currentValues={currentValues}\n                onFieldValidate={onFieldValidate}\n                onFieldChange={onFieldChange}\n                onBeforeExecute={onBeforeExecute}\n                showTitles={showTitles}\n                showErrors={showErrors}\n                validateOn={validateOn}\n                validateAllFieldsOnChange={validateAllFieldsOnChange}\n                validateOnInit={validateOnInit}\n                autoServerValidate={autoServerValidate}\n                autoServerValidateThrottle={autoServerValidateThrottle}\n                fieldContainerComponent={fieldContainerComponent}\n                fieldDecoratorComponent={fieldDecoratorComponent}\n                errorDisplayComponent={errorDisplayComponent}\n                tooltipComponent={tooltipComponent}\n                errorClassName={errorClassName}\n                iconAddonClassName={iconAddonClassName}>\n                <CommandDialogWrapper\n                    header={header}\n                    visible={visible}\n                    width={width}\n                    confirmLabel={confirmLabel}\n                    cancelLabel={cancelLabel}\n                    onConfirm={onConfirm}\n                    onCancel={onCancel}\n                    onBeforeExecute={onBeforeExecute}\n                >\n                    {children}\n                </CommandDialogWrapper>\n            </CommandForm>\n        </CommandDialogContext.Provider>\n    );\n};\n\nconst CommandDialogColumnWrapper = ({ children }: { children: React.ReactNode }) => (\n    <CommandForm.Column>{children}</CommandForm.Column>\n);\nCommandDialogColumnWrapper.displayName = 'CommandFormColumn';\n\nCommandDialogComponent.Fields = CommandDialogFieldsWrapper;\nCommandDialogComponent.Column = CommandDialogColumnWrapper;\n\nexport const CommandDialog = CommandDialogComponent;\n"],"names":["createContext","useContext","useCommandFormContext","useCommandInstance","_jsx","CommandFormFieldWrapper","Dialog","DialogButtons","CommandForm"],"mappings":";;;;;;;;AAoEA,MAAM,oBAAoB,GAAGA,mBAAa,CAAiD,SAAS,CAAC;AAE9F,MAAM,uBAAuB,GAAG,MAA0B;AAC7D,IAAA,MAAM,OAAO,GAAGC,gBAAU,CAAC,oBAAoB,CAAC;IAChD,IAAI,CAAC,OAAO,EAAE;AACV,QAAA,MAAM,IAAI,KAAK,CAAC,6DAA6D,CAAC;IAClF;AACA,IAAA,OAAO,OAA8C;AACzD;AAEA,MAAM,oBAAoB,GAAG,CAA0B,EACnD,MAAM,EACN,OAAO,EACP,KAAK,EACL,YAAY,EACZ,WAAW,EACX,SAAS,EACT,QAAQ,EACR,eAAe,EACf,QAAQ,EAWX,KAAI;IACD,MAAM,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,aAAa,EAAE,GAAGC,8BAAqB,EAAY;AAC/F,IAAA,MAAM,eAAe,GAAGC,2BAAkB,EAAY;IAQtD,MAAM,aAAa,GAAG,CAAC,aAAa,IAAI,aAAa,CAAC,OAAO;AAE7D,IAAA,MAAM,aAAa,GAAG,YAAW;QAC7B,IAAI,eAAe,EAAE;AACjB,YAAA,MAAM,iBAAiB,GAAG,eAAe,CAAC,eAAe,CAAC;YAC1D,gBAAgB,CAAC,iBAAiB,CAAC;QACvC;AACA,QAAA,MAAM,MAAM,GAAG,MAAO,eAAkF,CAAC,OAAO,EAAE;AAClH,QAAA,IAAI,MAAM,CAAC,SAAS,EAAE;AAClB,YAAA,MAAM,SAAS,CAAC,MAAM,CAAC;AACvB,YAAA,OAAO,IAAI;QACf;aAAO;YACH,gBAAgB,CAAC,MAAM,CAAC;AACxB,YAAA,OAAO,KAAK;QAChB;AACJ,IAAA,CAAC;AAED,IAAA,MAAM,eAAe,GAAG,CAAC,KAAsB,KAAqB;QAChE,OAAO,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,KAAK,KAAI;AACvC,YAAA,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;AAAE,gBAAA,OAAO,KAAK;AAE9C,YAAA,MAAM,SAAS,GAAG,KAAK,CAAC,IAAoC;AAC5D,YAAA,IAAI,SAAS,CAAC,WAAW,KAAK,kBAAkB,EAAE;AAE9C,gBAAA,OAAOC,eAACC,gCAAuB,EAAA,EAAC,KAAK,EAAE,KAAgC,GAAI;YAC/E;AAEA,YAAA,MAAM,UAAU,GAAG,KAAK,CAAC,KAAgC;AACzD,YAAA,IAAI,UAAU,CAAC,QAAQ,IAAI,IAAI,EAAE;AAC7B,gBAAA,OAAO,KAAK,CAAC,YAAY,CAAC,KAAoD,EAAE;AAC5E,oBAAA,QAAQ,EAAE,eAAe,CAAC,UAAU,CAAC,QAA2B;AACnE,iBAAA,CAAC;YACN;AAEA,YAAA,OAAO,KAAK;AAChB,QAAA,CAAC,CAAC;AACN,IAAA,CAAC;AAED,IAAA,MAAM,iBAAiB,GAAG,eAAe,CAAC,QAAQ,CAAC;AAEnD,IAAA,QACID,cAAA,CAACE,aAAM,EAAA,EACH,KAAK,EAAE,MAAM,EACb,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,aAAa,EACxB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAEC,qBAAa,CAAC,QAAQ,EAC/B,OAAO,EAAE,YAAY,EACrB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,aAAa,EAAA,QAAA,EAEtBH,cAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,EAAA,QAAA,EAClE,iBAAiB,EAAA,CAChB,EAAA,CACD;AAEjB,CAAC;AAED,MAAM,0BAA0B,GAAG,CAAC,KAAoC,KAAI;IACxE,QACIA,cAAA,CAACI,oBAAW,CAAC,MAAM,EAAA,EAAA,QAAA,EACd,KAAK,CAAC,QAAQ,EAAA,CACE;AAE7B,CAAC;AAED,MAAM,sBAAsB,GAAG,CAAuD,KAA8C,KAAI;AACpI,IAAA,MAAM,EACF,OAAO,EACP,aAAa,EACb,aAAa,EACb,OAAO,EACP,MAAM,EACN,YAAY,GAAG,SAAS,EACxB,WAAW,GAAG,QAAQ,EACtB,WAAW,GAAG,aAAa,EAC3B,UAAU,GAAG,aAAa,EAC1B,SAAS,EACT,QAAQ,EACR,eAAe,EACf,aAAa,EACb,eAAe,EACf,QAAQ,EACR,KAAK,GAAG,MAAM,EACd,UAAU,EACV,UAAU,EACV,UAAU,EACV,yBAAyB,EACzB,cAAc,EACd,kBAAkB,EAClB,0BAA0B,EAC1B,uBAAuB,EACvB,uBAAuB,EACvB,qBAAqB,EACrB,gBAAgB,EAChB,cAAc,EACd,kBAAkB,EACrB,GAAG,KAAK;AAET,IAAA,MAAM,YAAY,GAAwC;AACtD,QAAA,SAAS,EAAE,SAAS;QACpB,QAAQ;QACR,YAAY;QACZ,WAAW;QACX,WAAW;QACX,UAAU;QACV,eAAe;QACf,aAAa;QACb;KACH;AAED,IAAA,QACIJ,cAAA,CAAC,oBAAoB,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,YAAY,EAAA,QAAA,EAC9CA,cAAA,CAACI,oBAAW,EAAA,EACR,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,aAAa,EAC5B,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,EACtB,yBAAyB,EAAE,yBAAyB,EACpD,cAAc,EAAE,cAAc,EAC9B,kBAAkB,EAAE,kBAAkB,EACtC,0BAA0B,EAAE,0BAA0B,EACtD,uBAAuB,EAAE,uBAAuB,EAChD,uBAAuB,EAAE,uBAAuB,EAChD,qBAAqB,EAAE,qBAAqB,EAC5C,gBAAgB,EAAE,gBAAgB,EAClC,cAAc,EAAE,cAAc,EAC9B,kBAAkB,EAAE,kBAAkB,EAAA,QAAA,EACtCJ,cAAA,CAAC,oBAAoB,EAAA,EACjB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,eAAe,EAAE,eAAe,EAAA,QAAA,EAE/B,QAAQ,EAAA,CACU,EAAA,CACb,EAAA,CACc;AAExC,CAAC;AAED,MAAM,0BAA0B,GAAG,CAAC,EAAE,QAAQ,EAAiC,MAC3EA,cAAA,CAACI,oBAAW,CAAC,MAAM,cAAE,QAAQ,EAAA,CAAsB,CACtD;AACD,0BAA0B,CAAC,WAAW,GAAG,mBAAmB;AAE5D,sBAAsB,CAAC,MAAM,GAAG,0BAA0B;AAC1D,sBAAsB,CAAC,MAAM,GAAG,0BAA0B;AAEnD,MAAM,aAAa,GAAG;;;;;"}
+{"version":3,"file":"CommandDialog.js","sources":["../../../CommandDialog/CommandDialog.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { ICommandResult } from '@cratis/arc/commands';\nimport { Constructor } from '@cratis/fundamentals';\nimport { DialogButtons } from '@cratis/arc.react/dialogs';\nimport { Dialog } from '../Dialogs/Dialog';\nimport React, { createContext, useContext } from 'react';\nimport { \n    CommandForm, \n    CommandFormFieldWrapper,\n    useCommandFormContext, \n    useCommandInstance\n} from '@cratis/arc.react/commands';\n\ntype CommandFormProps = React.ComponentProps<typeof CommandForm>;\n\n// Local type definitions\nexport type BeforeExecuteCallback<TCommand> = (values: TCommand) => TCommand;\n\nexport type FieldValidator<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => string | undefined;\nexport type FieldChangeCallback<TCommand> = (command: TCommand, fieldName: string, oldValue: unknown, newValue: unknown) => void;\n\nexport interface CommandDialogProps<TCommand, TResponse = object> {\n    command: Constructor<TCommand>;\n    initialValues?: Partial<TCommand>;\n    currentValues?: Partial<TCommand> | undefined;\n    visible: boolean;\n    header: string;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    confirmIcon?: string;\n    cancelIcon?: string;\n    onConfirm: (result: ICommandResult<TResponse>) => void | Promise<void>;\n    onCancel: () => void;\n    onFieldValidate?: FieldValidator<TCommand>;\n    onFieldChange?: FieldChangeCallback<TCommand>;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n    children?: React.ReactNode;\n    style?: React.CSSProperties;\n    width?: string;\n    showTitles?: boolean;\n    showErrors?: boolean;\n    validateOn?: CommandFormProps['validateOn'];\n    validateAllFieldsOnChange?: boolean;\n    validateOnInit?: boolean;\n    autoServerValidate?: boolean;\n    autoServerValidateThrottle?: number;\n    fieldContainerComponent?: CommandFormProps['fieldContainerComponent'];\n    fieldDecoratorComponent?: CommandFormProps['fieldDecoratorComponent'];\n    errorDisplayComponent?: CommandFormProps['errorDisplayComponent'];\n    tooltipComponent?: CommandFormProps['tooltipComponent'];\n    errorClassName?: string;\n    iconAddonClassName?: string;\n}\n\ninterface CommandDialogContextValue<TCommand = unknown> {\n    onSuccess: (result: ICommandResult<unknown>) => void | Promise<void>;\n    onCancel: () => void;\n    confirmLabel: string;\n    cancelLabel: string;\n    confirmIcon: string;\n    cancelIcon: string;\n    onFieldValidate?: FieldValidator<TCommand>;\n    onFieldChange?: FieldChangeCallback<TCommand>;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n}\n\nconst CommandDialogContext = createContext<CommandDialogContextValue<unknown> | undefined>(undefined);\n\nexport const useCommandDialogContext = <TCommand = unknown,>() => {\n    const context = useContext(CommandDialogContext);\n    if (!context) {\n        throw new Error('useCommandDialogContext must be used within a CommandDialog');\n    }\n    return context as CommandDialogContextValue<TCommand>;\n};\n\nconst CommandDialogWrapper = <TCommand extends object>({\n    header,\n    visible,\n    width,\n    confirmLabel,\n    cancelLabel,\n    onConfirm,\n    onCancel,\n    onBeforeExecute,\n    children\n}: {\n    header: string;\n    visible: boolean;\n    width: string;\n    confirmLabel: string;\n    cancelLabel: string;\n    onConfirm: (result: ICommandResult<unknown>) => void | Promise<void>;\n    onCancel: () => void;\n    onBeforeExecute?: BeforeExecuteCallback<TCommand>;\n    children: React.ReactNode;\n}) => {\n    const { setCommandValues, setCommandResult, isValid } = useCommandFormContext<TCommand>();\n    const commandInstance = useCommandInstance<TCommand>();\n\n    const isDialogValid = isValid;\n\n    const handleConfirm = async () => {\n        if (onBeforeExecute) {\n            const transformedValues = onBeforeExecute(commandInstance);\n            setCommandValues(transformedValues);\n        }\n        const result = await (commandInstance as unknown as { execute: () => Promise<ICommandResult<unknown>> }).execute();\n        if (result.isSuccess) {\n            await onConfirm(result);\n            return true;\n        } else {\n            setCommandResult(result);\n            return false;\n        }\n    };\n\n    const processChildren = (nodes: React.ReactNode): React.ReactNode => {\n        return React.Children.map(nodes, (child) => {\n            if (!React.isValidElement(child)) return child;\n\n            const component = child.type as React.ComponentType<unknown>;\n            if (component.displayName === 'CommandFormField') {\n                type FieldElement = Parameters<typeof CommandFormFieldWrapper>[0]['field'];\n                return <CommandFormFieldWrapper field={child as unknown as FieldElement} />;\n            }\n\n            const childProps = child.props as Record<string, unknown>;\n            if (childProps.children != null) {\n                return React.cloneElement(child as React.ReactElement<Record<string, unknown>>, {\n                    children: processChildren(childProps.children as React.ReactNode)\n                });\n            }\n\n            return child;\n        });\n    };\n\n    const processedChildren = processChildren(children);\n\n    return (\n        <Dialog\n            title={header}\n            visible={visible}\n            width={width}\n            onConfirm={handleConfirm}\n            onCancel={onCancel}\n            buttons={DialogButtons.OkCancel}\n            okLabel={confirmLabel}\n            cancelLabel={cancelLabel}\n            isValid={isDialogValid}\n        >\n            <div style={{ display: 'flex', flexDirection: 'column', width: '100%' }}>\n                {processedChildren}\n            </div>\n        </Dialog>\n    );\n};\n\nconst CommandDialogFieldsWrapper = (props: { children: React.ReactNode }) => {\n    return (\n        <CommandForm.Fields>\n            {props.children}\n        </CommandForm.Fields>\n    );\n};\n\nconst CommandDialogComponent = <TCommand extends object = object, TResponse = object>(props: CommandDialogProps<TCommand, TResponse>) => {\n    const {\n        command,\n        initialValues,\n        currentValues,\n        visible,\n        header,\n        confirmLabel = 'Confirm',\n        cancelLabel = 'Cancel',\n        confirmIcon = 'pi pi-check',\n        cancelIcon = 'pi pi-times',\n        onConfirm,\n        onCancel,\n        onFieldValidate,\n        onFieldChange,\n        onBeforeExecute,\n        children,\n        width = '50vw',\n        showTitles,\n        showErrors,\n        validateOn,\n        validateAllFieldsOnChange,\n        validateOnInit,\n        autoServerValidate,\n        autoServerValidateThrottle,\n        fieldContainerComponent,\n        fieldDecoratorComponent,\n        errorDisplayComponent,\n        tooltipComponent,\n        errorClassName,\n        iconAddonClassName\n    } = props;\n\n    const contextValue: CommandDialogContextValue<TCommand> = {\n        onSuccess: onConfirm,\n        onCancel,\n        confirmLabel,\n        cancelLabel,\n        confirmIcon,\n        cancelIcon,\n        onFieldValidate,\n        onFieldChange,\n        onBeforeExecute\n    };\n\n    return (\n        <CommandDialogContext.Provider value={contextValue}>\n            <CommandForm\n                command={command}\n                initialValues={initialValues}\n                currentValues={currentValues}\n                onFieldValidate={onFieldValidate}\n                onFieldChange={onFieldChange}\n                onBeforeExecute={onBeforeExecute}\n                showTitles={showTitles}\n                showErrors={showErrors}\n                validateOn={validateOn}\n                validateAllFieldsOnChange={validateAllFieldsOnChange}\n                validateOnInit={validateOnInit}\n                autoServerValidate={autoServerValidate}\n                autoServerValidateThrottle={autoServerValidateThrottle}\n                fieldContainerComponent={fieldContainerComponent}\n                fieldDecoratorComponent={fieldDecoratorComponent}\n                errorDisplayComponent={errorDisplayComponent}\n                tooltipComponent={tooltipComponent}\n                errorClassName={errorClassName}\n                iconAddonClassName={iconAddonClassName}>\n                <CommandDialogWrapper\n                    header={header}\n                    visible={visible}\n                    width={width}\n                    confirmLabel={confirmLabel}\n                    cancelLabel={cancelLabel}\n                    onConfirm={onConfirm}\n                    onCancel={onCancel}\n                    onBeforeExecute={onBeforeExecute}\n                >\n                    {children}\n                </CommandDialogWrapper>\n            </CommandForm>\n        </CommandDialogContext.Provider>\n    );\n};\n\nconst CommandDialogColumnWrapper = ({ children }: { children: React.ReactNode }) => (\n    <CommandForm.Column>{children}</CommandForm.Column>\n);\nCommandDialogColumnWrapper.displayName = 'CommandFormColumn';\n\nCommandDialogComponent.Fields = CommandDialogFieldsWrapper;\nCommandDialogComponent.Column = CommandDialogColumnWrapper;\n\nexport const CommandDialog = CommandDialogComponent;\n"],"names":["createContext","useContext","useCommandFormContext","useCommandInstance","_jsx","CommandFormFieldWrapper","Dialog","DialogButtons","CommandForm"],"mappings":"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"}

package/dist/cjs/Common/Tooltip.css

@@ -0,0 +1,10 @@
+/* Copyright (c) Cratis. All rights reserved. */
+/* Licensed under the MIT license. See LICENSE file in the project root for full license information. */
+
+/* ── Tooltip bubble ──────────────────────────────────────────────────────── */
+.tooltip-bubble {
+    background: var(--surface-100);
+    color: var(--text-color);
+    border: 1px solid var(--surface-border);
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
+}

package/dist/cjs/Common/Tooltip.js

@@ -0,0 +1,17 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+require('./Tooltip.css');
+
+const POSITION_CLASSES = {
+    right: 'left-full ml-2 top-1/2 -translate-y-1/2',
+    left: 'right-full mr-2 top-1/2 -translate-y-1/2',
+    top: 'bottom-full mb-2 left-1/2 -translate-x-1/2',
+    bottom: 'top-full mt-2 left-1/2 -translate-x-1/2',
+};
+const Tooltip = ({ content, position = 'top', children }) => (jsxRuntime.jsxs("div", { className: 'relative group inline-flex', children: [children, jsxRuntime.jsx("div", { role: 'tooltip', className: `tooltip-bubble pointer-events-none absolute ${POSITION_CLASSES[position]} z-50
+                text-xs px-2 py-1 rounded
+                whitespace-nowrap opacity-0 group-hover:opacity-100 transition-opacity duration-150 delay-200`, style: { fontFamily: 'system-ui, sans-serif' }, children: content })] }));
+
+exports.Tooltip = Tooltip;
+//# sourceMappingURL=Tooltip.js.map

package/dist/cjs/Common/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","sources":["../../../Common/Tooltip.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport React from 'react';\nimport './Tooltip.css';\n\n/** Position of the tooltip relative to its trigger element. */\nexport type TooltipPosition = 'top' | 'right' | 'bottom' | 'left';\n\n/** Props for the {@link Tooltip} component. */\nexport interface TooltipProps {\n    /** The text to display inside the tooltip. */\n    content: string;\n    /** Where the tooltip appears relative to the trigger (default: 'top'). */\n    position?: TooltipPosition;\n    /** The element that triggers the tooltip on hover. */\n    children: React.ReactNode;\n}\n\nconst POSITION_CLASSES: Record<TooltipPosition, string> = {\n    right:  'left-full ml-2 top-1/2 -translate-y-1/2',\n    left:   'right-full mr-2 top-1/2 -translate-y-1/2',\n    top:    'bottom-full mb-2 left-1/2 -translate-x-1/2',\n    bottom: 'top-full mt-2 left-1/2 -translate-x-1/2',\n};\n\n/**\n * A CSS-only hover tooltip wrapper. Wraps any child element and displays\n * a styled floating label on hover without relying on native browser tooltips.\n */\nexport const Tooltip: React.FC<TooltipProps> = ({ content, position = 'top', children }) => (\n    <div className='relative group inline-flex'>\n        {children}\n        <div\n            role='tooltip'\n            className={`tooltip-bubble pointer-events-none absolute ${POSITION_CLASSES[position]} z-50\n                text-xs px-2 py-1 rounded\n                whitespace-nowrap opacity-0 group-hover:opacity-100 transition-opacity duration-150 delay-200`}\n            style={{ fontFamily: 'system-ui, sans-serif' }}\n        >\n            {content}\n        </div>\n    </div>\n);\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;AAmBA,MAAM,gBAAgB,GAAoC;AACtD,IAAA,KAAK,EAAG,yCAAyC;AACjD,IAAA,IAAI,EAAI,0CAA0C;AAClD,IAAA,GAAG,EAAK,4CAA4C;AACpD,IAAA,MAAM,EAAE,yCAAyC;CACpD;AAMM,MAAM,OAAO,GAA2B,CAAC,EAAE,OAAO,EAAE,QAAQ,GAAG,KAAK,EAAE,QAAQ,EAAE,MACnFA,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,4BAA4B,EAAA,QAAA,EAAA,CACtC,QAAQ,EACTC,wBACI,IAAI,EAAC,SAAS,EACd,SAAS,EAAE,CAAA,4CAAA,EAA+C,gBAAgB,CAAC,QAAQ,CAAC,CAAA;;AAEc,6GAAA,CAAA,EAClG,KAAK,EAAE,EAAE,UAAU,EAAE,uBAAuB,EAAE,EAAA,QAAA,EAE7C,OAAO,EAAA,CACN,CAAA,EAAA,CACJ;;;;"}

package/dist/cjs/Common/index.js

@@ -3,10 +3,12 @@
 var ErrorBoundary = require('./ErrorBoundary.js');
 var Page = require('./Page.js');
 var FormElement = require('./FormElement.js');
+var Tooltip = require('./Tooltip.js');
 
 
 
 exports.ErrorBoundary = ErrorBoundary.ErrorBoundary;
 exports.Page = Page.Page;
 exports.FormElement = FormElement.FormElement;
+exports.Tooltip = Tooltip.Tooltip;
 //# sourceMappingURL=index.js.map

package/dist/cjs/Common/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/dist/cjs/ObjectContentEditor/ObjectContentEditor.js

@@ -5,6 +5,7 @@ var tooltip = require('primereact/tooltip');
 var React = require('react');
 var faIcons = require('react-icons/fa6');
 var ObjectNavigationalBar = require('../ObjectNavigationalBar/ObjectNavigationalBar.js');
+var objectHelpers = require('./objectHelpers.js');
 
 function _interopNamespaceDefault(e) {
     var n = Object.create(null);
@@ -27,20 +28,6 @@ var faIcons__namespace = /*#__PURE__*/_interopNamespaceDefault(faIcons);
 
 const ObjectContentEditor = ({ object, timestamp, schema }) => {
     const [navigationPath, setNavigationPath] = React.useState([]);
-    const getValueAtPath = React.useCallback((data, path) => {
-        let current = data;
-        for (const segment of path) {
-            if (current === null || current === undefined)
-                return null;
-            if (typeof current === 'object' && !Array.isArray(current) && current !== null) {
-                current = current[segment];
-            }
-            else {
-                return null;
-            }
-        }
-        return current;
-    }, []);
     const navigateToProperty = React.useCallback((key) => {
         setNavigationPath([...navigationPath, key]);
     }, [navigationPath]);
@@ -59,7 +46,7 @@ const ObjectContentEditor = ({ object, timestamp, schema }) => {
         const lastKey = navigationPath[navigationPath.length - 1];
         const pathToParent = navigationPath.slice(0, -1);
         const parentValue = pathToParent.length > 0
-            ? getValueAtPath(object, pathToParent)
+            ? objectHelpers.getValueAtPath(object, pathToParent)
             : object;
         if (parentValue && typeof parentValue === 'object' && !Array.isArray(parentValue)) {
             const value = parentValue[lastKey];
@@ -71,7 +58,7 @@ const ObjectContentEditor = ({ object, timestamp, schema }) => {
             }
         }
         return object;
-    }, [object, navigationPath, getValueAtPath]);
+    }, [object, navigationPath, objectHelpers.getValueAtPath]);
     const currentProperties = React.useMemo(() => {
         const properties = schema.properties || {};
         if (navigationPath.length === 0) {

package/dist/cjs/ObjectContentEditor/ObjectContentEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"ObjectContentEditor.js","sources":["../../../ObjectContentEditor/ObjectContentEditor.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Tooltip } from 'primereact/tooltip';\nimport React, { useState, useCallback, useMemo } from 'react';\nimport * as faIcons from 'react-icons/fa6';\nimport { ObjectNavigationalBar } from '../ObjectNavigationalBar';\nimport { Json, JsonSchema, JsonSchemaProperty } from '../types/JsonSchema';\n\nexport interface ObjectContentEditorProps {\n    object: Json;\n    timestamp?: Date;\n    schema: JsonSchema;\n}\n\nexport const ObjectContentEditor = ({ object, timestamp, schema }: ObjectContentEditorProps) => {\n    const [navigationPath, setNavigationPath] = useState<string[]>([]);\n\n    const getValueAtPath = useCallback((data: Json, path: string[]): Json | null => {\n        let current: Json = data;\n        for (const segment of path) {\n            if (current === null || current === undefined) return null;\n            if (typeof current === 'object' && !Array.isArray(current) && current !== null) {\n                current = (current as { [key: string]: Json })[segment];\n            } else {\n                return null;\n            }\n        }\n        return current;\n    }, []);\n\n    const navigateToProperty = useCallback((key: string) => {\n        setNavigationPath([...navigationPath, key]);\n    }, [navigationPath]);\n\n    const navigateToBreadcrumb = useCallback((index: number) => {\n        if (index === 0) {\n            setNavigationPath([]);\n        } else {\n            setNavigationPath(navigationPath.slice(0, index));\n        }\n    }, [navigationPath]);\n\n    const currentData = useMemo(() => {\n        if (navigationPath.length === 0) {\n            return object;\n        }\n\n        const lastKey = navigationPath[navigationPath.length - 1];\n        const pathToParent = navigationPath.slice(0, -1);\n\n        const parentValue = pathToParent.length > 0\n            ? getValueAtPath(object, pathToParent)\n            : object;\n\n        if (parentValue && typeof parentValue === 'object' && !Array.isArray(parentValue)) {\n            const value = (parentValue as { [k: string]: Json })[lastKey];\n\n            if (Array.isArray(value)) {\n                return value;\n            } else if (value && typeof value === 'object') {\n                return value;\n            }\n        }\n\n        return object;\n    }, [object, navigationPath, getValueAtPath]);\n\n    const currentProperties = useMemo(() => {\n        const properties = schema.properties || {};\n\n        if (navigationPath.length === 0) {\n            return properties;\n        }\n\n        return {};\n    }, [schema, navigationPath]);\n\n    const tableStyle: React.CSSProperties = {\n        width: '100%',\n        borderCollapse: 'collapse',\n        fontFamily: '-apple-system, BlinkMacSystemFont, \"SF Mono\", monospace',\n        fontSize: '13px',\n    };\n\n    const rowStyle: React.CSSProperties = {\n        borderBottom: '1px solid rgba(255,255,255,0.1)',\n    };\n\n    const labelStyle: React.CSSProperties = {\n        padding: '8px 12px',\n        color: 'rgba(255,255,255,0.6)',\n        textAlign: 'left',\n        fontWeight: 500,\n        width: '140px',\n    };\n\n    const valueStyle: React.CSSProperties = {\n        padding: '8px 12px',\n        color: '#fff',\n        textAlign: 'left',\n    };\n\n    const infoIconStyle: React.CSSProperties = {\n        marginLeft: '6px',\n        fontSize: '12px',\n        color: 'rgba(100, 150, 255, 0.6)',\n        cursor: 'help',\n    };\n\n    const renderValue = (value: Json, propertyName: string) => {\n        if (value === null || value === undefined) return '';\n\n        if (Array.isArray(value)) {\n            return (\n                <div\n                    className=\"flex align-items-center gap-2 cursor-pointer\"\n                    onClick={() => navigateToProperty(propertyName)}\n                    style={{ color: 'var(--primary-color)', display: 'flex', alignItems: 'center' }}\n                >\n                    <span>Array[{value.length}]</span>\n                    <faIcons.FaArrowRight style={{ fontSize: '0.875rem', display: 'inline-flex' }} />\n                </div>\n            );\n        }\n\n        if (typeof value === 'object') {\n            return (\n                <div\n                    className=\"flex align-items-center gap-2 cursor-pointer\"\n                    onClick={() => navigateToProperty(propertyName)}\n                    style={{ color: 'var(--primary-color)', display: 'flex', alignItems: 'center' }}\n                >\n                    <span>Object</span>\n                    <faIcons.FaArrowRight style={{ fontSize: '0.875rem', display: 'inline-flex' }} />\n                </div>\n            );\n        }\n\n        return String(value);\n    };\n\n    const renderTable = () => {\n        if (Array.isArray(currentData)) {\n            if (currentData.length === 0) return <div style={{ padding: '12px', color: 'rgba(255,255,255,0.6)' }}>Empty array</div>;\n\n            const firstItem = currentData[0];\n            if (typeof firstItem === 'object' && firstItem !== null && !Array.isArray(firstItem)) {\n                const keys = Object.keys(firstItem);\n\n                return (\n                    <table style={tableStyle}>\n                        <tbody>\n                            {currentData.map((item, index) => (\n                                <React.Fragment key={index}>\n                                    {index > 0 && (\n                                        <tr style={{ height: '8px', background: 'rgba(255,255,255,0.05)' }}>\n                                            <td colSpan={2}></td>\n                                        </tr>\n                                    )}\n                                    {keys.map((key) => (\n                                        <tr key={`${index}-${key}`} style={rowStyle}>\n                                            <td style={labelStyle}>{key}</td>\n                                            <td style={valueStyle}>{renderValue((item as Record<string, Json>)[key], key)}</td>\n                                        </tr>\n                                    ))}\n                                </React.Fragment>\n                            ))}\n                        </tbody>\n                    </table>\n                );\n            } else {\n                return (\n                    <table style={tableStyle}>\n                        <tbody>\n                            {currentData.map((item, index) => (\n                                <tr key={index} style={rowStyle}>\n                                    <td style={labelStyle}>[{index}]</td>\n                                    <td style={valueStyle}>{renderValue(item, `[${index}]`)}</td>\n                                </tr>\n                            ))}\n                        </tbody>\n                    </table>\n                );\n            }\n        }\n\n        const entries = navigationPath.length === 0\n            ? Object.entries(currentProperties)\n            : Object.entries(currentData as { [key: string]: Json });\n\n        return (\n            <table style={tableStyle}>\n                <tbody>\n                    {entries.map(([propertyName, propertyDef]: [string, JsonSchemaProperty | Json]) => {\n                        const value = (currentData as Record<string, Json>)[propertyName];\n\n                        const isSchemaProperty = navigationPath.length === 0;\n                        const description = isSchemaProperty && typeof propertyDef === 'object' && propertyDef !== null && 'description' in propertyDef\n                            ? (propertyDef as JsonSchemaProperty).description\n                            : undefined;\n\n                        return (\n                            <tr key={propertyName} style={rowStyle}>\n                                <td style={labelStyle}>\n                                    {propertyName}\n                                    {description && (\n                                        <i\n                                            className=\"pi pi-info-circle property-info-icon\"\n                                            style={infoIconStyle}\n                                            data-pr-tooltip={description} />\n                                    )}\n                                </td>\n                                <td style={valueStyle}>{renderValue(value as Json, propertyName)}</td>\n                            </tr>\n                        );\n                    })}\n                </tbody>\n            </table>\n        );\n    };\n\n    return (\n        <div className=\"order-content\" style={{ display: 'flex', flexDirection: 'column', height: '100%' }}>\n            <Tooltip target=\".property-info-icon\" />\n            <ObjectNavigationalBar\n                navigationPath={navigationPath}\n                onNavigate={navigateToBreadcrumb}\n            />\n            {renderTable()}\n            {timestamp && (\n                <div style={{\n                    marginTop: '20px',\n                    padding: '12px',\n                    background: 'rgba(100, 150, 255, 0.1)',\n                    borderRadius: '8px',\n                    fontSize: '12px',\n                    color: 'rgba(255,255,255,0.6)'\n                }}>\n                    Snapshot captured: {timestamp.toLocaleString()}\n                </div>\n            )}\n        </div>\n    );\n};\n"],"names":["useState","useCallback","useMemo","_jsxs","_jsx","faIcons","Tooltip","ObjectNavigationalBar"],"mappings":"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"}
+{"version":3,"file":"ObjectContentEditor.js","sources":["../../../ObjectContentEditor/ObjectContentEditor.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Tooltip } from 'primereact/tooltip';\nimport React, { useState, useCallback, useMemo } from 'react';\nimport * as faIcons from 'react-icons/fa6';\nimport { ObjectNavigationalBar } from '../ObjectNavigationalBar';\nimport { Json, JsonSchema, JsonSchemaProperty } from '../types/JsonSchema';\nimport { getValueAtPath } from './objectHelpers';\n\nexport interface ObjectContentEditorProps {\n    object: Json;\n    timestamp?: Date;\n    schema: JsonSchema;\n}\n\nexport const ObjectContentEditor = ({ object, timestamp, schema }: ObjectContentEditorProps) => {\n    const [navigationPath, setNavigationPath] = useState<string[]>([]);\n\n    const navigateToProperty = useCallback((key: string) => {\n        setNavigationPath([...navigationPath, key]);\n    }, [navigationPath]);\n\n    const navigateToBreadcrumb = useCallback((index: number) => {\n        if (index === 0) {\n            setNavigationPath([]);\n        } else {\n            setNavigationPath(navigationPath.slice(0, index));\n        }\n    }, [navigationPath]);\n\n    const currentData = useMemo(() => {\n        if (navigationPath.length === 0) {\n            return object;\n        }\n\n        const lastKey = navigationPath[navigationPath.length - 1];\n        const pathToParent = navigationPath.slice(0, -1);\n\n        const parentValue = pathToParent.length > 0\n            ? getValueAtPath(object, pathToParent)\n            : object;\n\n        if (parentValue && typeof parentValue === 'object' && !Array.isArray(parentValue)) {\n            const value = (parentValue as { [k: string]: Json })[lastKey];\n\n            if (Array.isArray(value)) {\n                return value;\n            } else if (value && typeof value === 'object') {\n                return value;\n            }\n        }\n\n        return object;\n    }, [object, navigationPath, getValueAtPath]);\n\n    const currentProperties = useMemo(() => {\n        const properties = schema.properties || {};\n\n        if (navigationPath.length === 0) {\n            return properties;\n        }\n\n        return {};\n    }, [schema, navigationPath]);\n\n    const tableStyle: React.CSSProperties = {\n        width: '100%',\n        borderCollapse: 'collapse',\n        fontFamily: '-apple-system, BlinkMacSystemFont, \"SF Mono\", monospace',\n        fontSize: '13px',\n    };\n\n    const rowStyle: React.CSSProperties = {\n        borderBottom: '1px solid rgba(255,255,255,0.1)',\n    };\n\n    const labelStyle: React.CSSProperties = {\n        padding: '8px 12px',\n        color: 'rgba(255,255,255,0.6)',\n        textAlign: 'left',\n        fontWeight: 500,\n        width: '140px',\n    };\n\n    const valueStyle: React.CSSProperties = {\n        padding: '8px 12px',\n        color: '#fff',\n        textAlign: 'left',\n    };\n\n    const infoIconStyle: React.CSSProperties = {\n        marginLeft: '6px',\n        fontSize: '12px',\n        color: 'rgba(100, 150, 255, 0.6)',\n        cursor: 'help',\n    };\n\n    const renderValue = (value: Json, propertyName: string) => {\n        if (value === null || value === undefined) return '';\n\n        if (Array.isArray(value)) {\n            return (\n                <div\n                    className=\"flex align-items-center gap-2 cursor-pointer\"\n                    onClick={() => navigateToProperty(propertyName)}\n                    style={{ color: 'var(--primary-color)', display: 'flex', alignItems: 'center' }}\n                >\n                    <span>Array[{value.length}]</span>\n                    <faIcons.FaArrowRight style={{ fontSize: '0.875rem', display: 'inline-flex' }} />\n                </div>\n            );\n        }\n\n        if (typeof value === 'object') {\n            return (\n                <div\n                    className=\"flex align-items-center gap-2 cursor-pointer\"\n                    onClick={() => navigateToProperty(propertyName)}\n                    style={{ color: 'var(--primary-color)', display: 'flex', alignItems: 'center' }}\n                >\n                    <span>Object</span>\n                    <faIcons.FaArrowRight style={{ fontSize: '0.875rem', display: 'inline-flex' }} />\n                </div>\n            );\n        }\n\n        return String(value);\n    };\n\n    const renderTable = () => {\n        if (Array.isArray(currentData)) {\n            if (currentData.length === 0) return <div style={{ padding: '12px', color: 'rgba(255,255,255,0.6)' }}>Empty array</div>;\n\n            const firstItem = currentData[0];\n            if (typeof firstItem === 'object' && firstItem !== null && !Array.isArray(firstItem)) {\n                const keys = Object.keys(firstItem);\n\n                return (\n                    <table style={tableStyle}>\n                        <tbody>\n                            {currentData.map((item, index) => (\n                                <React.Fragment key={index}>\n                                    {index > 0 && (\n                                        <tr style={{ height: '8px', background: 'rgba(255,255,255,0.05)' }}>\n                                            <td colSpan={2}></td>\n                                        </tr>\n                                    )}\n                                    {keys.map((key) => (\n                                        <tr key={`${index}-${key}`} style={rowStyle}>\n                                            <td style={labelStyle}>{key}</td>\n                                            <td style={valueStyle}>{renderValue((item as Record<string, Json>)[key], key)}</td>\n                                        </tr>\n                                    ))}\n                                </React.Fragment>\n                            ))}\n                        </tbody>\n                    </table>\n                );\n            } else {\n                return (\n                    <table style={tableStyle}>\n                        <tbody>\n                            {currentData.map((item, index) => (\n                                <tr key={index} style={rowStyle}>\n                                    <td style={labelStyle}>[{index}]</td>\n                                    <td style={valueStyle}>{renderValue(item, `[${index}]`)}</td>\n                                </tr>\n                            ))}\n                        </tbody>\n                    </table>\n                );\n            }\n        }\n\n        const entries = navigationPath.length === 0\n            ? Object.entries(currentProperties)\n            : Object.entries(currentData as { [key: string]: Json });\n\n        return (\n            <table style={tableStyle}>\n                <tbody>\n                    {entries.map(([propertyName, propertyDef]: [string, JsonSchemaProperty | Json]) => {\n                        const value = (currentData as Record<string, Json>)[propertyName];\n\n                        const isSchemaProperty = navigationPath.length === 0;\n                        const description = isSchemaProperty && typeof propertyDef === 'object' && propertyDef !== null && 'description' in propertyDef\n                            ? (propertyDef as JsonSchemaProperty).description\n                            : undefined;\n\n                        return (\n                            <tr key={propertyName} style={rowStyle}>\n                                <td style={labelStyle}>\n                                    {propertyName}\n                                    {description && (\n                                        <i\n                                            className=\"pi pi-info-circle property-info-icon\"\n                                            style={infoIconStyle}\n                                            data-pr-tooltip={description} />\n                                    )}\n                                </td>\n                                <td style={valueStyle}>{renderValue(value as Json, propertyName)}</td>\n                            </tr>\n                        );\n                    })}\n                </tbody>\n            </table>\n        );\n    };\n\n    return (\n        <div className=\"order-content\" style={{ display: 'flex', flexDirection: 'column', height: '100%' }}>\n            <Tooltip target=\".property-info-icon\" />\n            <ObjectNavigationalBar\n                navigationPath={navigationPath}\n                onNavigate={navigateToBreadcrumb}\n            />\n            {renderTable()}\n            {timestamp && (\n                <div style={{\n                    marginTop: '20px',\n                    padding: '12px',\n                    background: 'rgba(100, 150, 255, 0.1)',\n                    borderRadius: '8px',\n                    fontSize: '12px',\n                    color: 'rgba(255,255,255,0.6)'\n                }}>\n                    Snapshot captured: {timestamp.toLocaleString()}\n                </div>\n            )}\n        </div>\n    );\n};\n"],"names":["useState","useCallback","useMemo","getValueAtPath","_jsxs","_jsx","faIcons","Tooltip","ObjectNavigationalBar"],"mappings":"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"}

package/dist/cjs/ObjectContentEditor/objectHelpers.js

@@ -0,0 +1,19 @@
+'use strict';
+
+function getValueAtPath(data, path) {
+    let current = data;
+    for (const segment of path) {
+        if (current === null || current === undefined)
+            return null;
+        if (typeof current === 'object' && !Array.isArray(current) && current !== null) {
+            current = current[segment];
+        }
+        else {
+            return null;
+        }
+    }
+    return current;
+}
+
+exports.getValueAtPath = getValueAtPath;
+//# sourceMappingURL=objectHelpers.js.map

package/dist/cjs/ObjectContentEditor/objectHelpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"objectHelpers.js","sources":["../../../ObjectContentEditor/objectHelpers.ts"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Json } from '../types/JsonSchema';\n\n/**\n * Retrieves the value at the specified path within a JSON data structure.\n * Returns null if the path cannot be followed.\n */\nexport function getValueAtPath(data: Json, path: string[]): Json | null {\n    let current: Json = data;\n    for (const segment of path) {\n        if (current === null || current === undefined) return null;\n        if (typeof current === 'object' && !Array.isArray(current) && current !== null) {\n            current = (current as { [key: string]: Json })[segment];\n        } else {\n            return null;\n        }\n    }\n    return current;\n}\n"],"names":[],"mappings":";;AASM,SAAU,cAAc,CAAC,IAAU,EAAE,IAAc,EAAA;IACrD,IAAI,OAAO,GAAS,IAAI;AACxB,IAAA,KAAK,MAAM,OAAO,IAAI,IAAI,EAAE;AACxB,QAAA,IAAI,OAAO,KAAK,IAAI,IAAI,OAAO,KAAK,SAAS;AAAE,YAAA,OAAO,IAAI;AAC1D,QAAA,IAAI,OAAO,OAAO,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,OAAO,KAAK,IAAI,EAAE;AAC5E,YAAA,OAAO,GAAI,OAAmC,CAAC,OAAO,CAAC;QAC3D;aAAO;AACH,YAAA,OAAO,IAAI;QACf;IACJ;AACA,IAAA,OAAO,OAAO;AAClB;;;;"}

package/dist/cjs/ObjectNavigationalBar/ObjectNavigationalBar.js

@@ -4,6 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var button = require('primereact/button');
 var faIcons = require('react-icons/fa6');
+var breadcrumbHelpers = require('./breadcrumbHelpers.js');
 
 function _interopNamespaceDefault(e) {
     var n = Object.create(null);
@@ -25,16 +26,7 @@ function _interopNamespaceDefault(e) {
 var faIcons__namespace = /*#__PURE__*/_interopNamespaceDefault(faIcons);
 
 function ObjectNavigationalBar({ navigationPath, onNavigate }) {
-    const breadcrumbItems = React.useMemo(() => {
-        const items = [{ name: 'Root', index: 0 }];
-        for (let i = 0; i < navigationPath.length; i++) {
-            items.push({
-                name: navigationPath[i],
-                index: i + 1
-            });
-        }
-        return items;
-    }, [navigationPath]);
+    const breadcrumbItems = React.useMemo(() => breadcrumbHelpers.buildNavigationBreadcrumbs(navigationPath), [navigationPath]);
     return (jsxRuntime.jsx("div", { className: "px-4 py-2 mb-2 border-bottom-1 surface-border", children: jsxRuntime.jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '0.5rem' }, children: [jsxRuntime.jsx(button.Button, { icon: jsxRuntime.jsx(faIcons__namespace.FaArrowLeft, {}), className: "p-button-text p-button-sm", onClick: () => onNavigate(navigationPath.length - 1), tooltip: "Navigate back", tooltipOptions: { position: 'top' }, disabled: navigationPath.length === 0 }), jsxRuntime.jsx("div", { style: { fontSize: '0.9rem', color: 'var(--text-color-secondary)' }, children: breadcrumbItems.map((item, index) => (jsxRuntime.jsxs("span", { children: [index > 0 && jsxRuntime.jsx("span", { className: "mx-2", children: ">" }), jsxRuntime.jsx("span", { onClick: () => onNavigate(item.index), style: {
                                     cursor: 'pointer',
                                     textDecoration: index < breadcrumbItems.length - 1 ? 'underline' : 'none'

package/dist/cjs/ObjectNavigationalBar/ObjectNavigationalBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ObjectNavigationalBar.js","sources":["../../../ObjectNavigationalBar/ObjectNavigationalBar.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { useMemo } from 'react';\nimport { Button } from 'primereact/button';\nimport * as faIcons from 'react-icons/fa6';\n\nexport interface ObjectNavigationalBarProps {\n    navigationPath: string[];\n    onNavigate: (index: number) => void;\n}\n\nexport function ObjectNavigationalBar({ navigationPath, onNavigate }: ObjectNavigationalBarProps) {\n    const breadcrumbItems = useMemo(() => {\n        const items: { name: string; index: number }[] = [{ name: 'Root', index: 0 }];\n        for (let i = 0; i < navigationPath.length; i++) {\n            items.push({\n                name: navigationPath[i],\n                index: i + 1\n            });\n        }\n        return items;\n    }, [navigationPath]);\n\n    return (\n        <div className=\"px-4 py-2 mb-2 border-bottom-1 surface-border\">\n            <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem' }}>\n                <Button\n                    icon={<faIcons.FaArrowLeft />}\n                    className=\"p-button-text p-button-sm\"\n                    onClick={() => onNavigate(navigationPath.length - 1)}\n                    tooltip=\"Navigate back\"\n                    tooltipOptions={{ position: 'top' }}\n                    disabled={navigationPath.length === 0}\n                />\n                <div style={{ fontSize: '0.9rem', color: 'var(--text-color-secondary)' }}>\n                    {breadcrumbItems.map((item, index) => (\n                        <span key={index}>\n                            {index > 0 && <span className=\"mx-2\">&gt;</span>}\n                            <span\n                                onClick={() => onNavigate(item.index)}\n                                style={{\n                                    cursor: 'pointer',\n                                    textDecoration: index < breadcrumbItems.length - 1 ? 'underline' : 'none'\n                                }}\n                            >\n                                {item.name}\n                            </span>\n                        </span>\n                    ))}\n                </div>\n            </div>\n        </div>\n    );\n}\n"],"names":["useMemo","_jsx","_jsxs","Button","faIcons"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;SAYgB,qBAAqB,CAAC,EAAE,cAAc,EAAE,UAAU,EAA8B,EAAA;AAC5F,IAAA,MAAM,eAAe,GAAGA,aAAO,CAAC,MAAK;AACjC,QAAA,MAAM,KAAK,GAAsC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;AAC7E,QAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,cAAc,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YAC5C,KAAK,CAAC,IAAI,CAAC;AACP,gBAAA,IAAI,EAAE,cAAc,CAAC,CAAC,CAAC;gBACvB,KAAK,EAAE,CAAC,GAAG;AACd,aAAA,CAAC;QACN;AACA,QAAA,OAAO,KAAK;AAChB,IAAA,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC;IAEpB,QACIC,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,+CAA+C,EAAA,QAAA,EAC1DC,eAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAA,QAAA,EAAA,CAChED,cAAA,CAACE,aAAM,EAAA,EACH,IAAI,EAAEF,cAAA,CAACG,kBAAO,CAAC,WAAW,EAAA,EAAA,CAAG,EAC7B,SAAS,EAAC,2BAA2B,EACrC,OAAO,EAAE,MAAM,UAAU,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,EACpD,OAAO,EAAC,eAAe,EACvB,cAAc,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,EACnC,QAAQ,EAAE,cAAc,CAAC,MAAM,KAAK,CAAC,EAAA,CACvC,EACFH,cAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,6BAA6B,EAAE,EAAA,QAAA,EACnE,eAAe,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,MAC7BC,eAAA,CAAA,MAAA,EAAA,EAAA,QAAA,EAAA,CACK,KAAK,GAAG,CAAC,IAAID,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,MAAM,EAAA,QAAA,EAAA,GAAA,EAAA,CAAY,EAChDA,cAAA,CAAA,MAAA,EAAA,EACI,OAAO,EAAE,MAAM,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,EACrC,KAAK,EAAE;AACH,oCAAA,MAAM,EAAE,SAAS;AACjB,oCAAA,cAAc,EAAE,KAAK,GAAG,eAAe,CAAC,MAAM,GAAG,CAAC,GAAG,WAAW,GAAG;AACtE,iCAAA,EAAA,QAAA,EAEA,IAAI,CAAC,IAAI,EAAA,CACP,CAAA,EAAA,EAVA,KAAK,CAWT,CACV,CAAC,EAAA,CACA,CAAA,EAAA,CACJ,EAAA,CACJ;AAEd;;;;"}
+{"version":3,"file":"ObjectNavigationalBar.js","sources":["../../../ObjectNavigationalBar/ObjectNavigationalBar.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { useMemo } from 'react';\nimport { Button } from 'primereact/button';\nimport * as faIcons from 'react-icons/fa6';\nimport { buildNavigationBreadcrumbs } from './breadcrumbHelpers';\n\nexport interface ObjectNavigationalBarProps {\n    navigationPath: string[];\n    onNavigate: (index: number) => void;\n}\n\nexport function ObjectNavigationalBar({ navigationPath, onNavigate }: ObjectNavigationalBarProps) {\n    const breadcrumbItems = useMemo(() => buildNavigationBreadcrumbs(navigationPath), [navigationPath]);\n\n    return (\n        <div className=\"px-4 py-2 mb-2 border-bottom-1 surface-border\">\n            <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem' }}>\n                <Button\n                    icon={<faIcons.FaArrowLeft />}\n                    className=\"p-button-text p-button-sm\"\n                    onClick={() => onNavigate(navigationPath.length - 1)}\n                    tooltip=\"Navigate back\"\n                    tooltipOptions={{ position: 'top' }}\n                    disabled={navigationPath.length === 0}\n                />\n                <div style={{ fontSize: '0.9rem', color: 'var(--text-color-secondary)' }}>\n                    {breadcrumbItems.map((item, index) => (\n                        <span key={index}>\n                            {index > 0 && <span className=\"mx-2\">&gt;</span>}\n                            <span\n                                onClick={() => onNavigate(item.index)}\n                                style={{\n                                    cursor: 'pointer',\n                                    textDecoration: index < breadcrumbItems.length - 1 ? 'underline' : 'none'\n                                }}\n                            >\n                                {item.name}\n                            </span>\n                        </span>\n                    ))}\n                </div>\n            </div>\n        </div>\n    );\n}\n"],"names":["useMemo","buildNavigationBreadcrumbs","_jsx","_jsxs","Button","faIcons"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;SAagB,qBAAqB,CAAC,EAAE,cAAc,EAAE,UAAU,EAA8B,EAAA;AAC5F,IAAA,MAAM,eAAe,GAAGA,aAAO,CAAC,MAAMC,4CAA0B,CAAC,cAAc,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC;IAEnG,QACIC,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,+CAA+C,EAAA,QAAA,EAC1DC,eAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAA,QAAA,EAAA,CAChED,cAAA,CAACE,aAAM,EAAA,EACH,IAAI,EAAEF,cAAA,CAACG,kBAAO,CAAC,WAAW,EAAA,EAAA,CAAG,EAC7B,SAAS,EAAC,2BAA2B,EACrC,OAAO,EAAE,MAAM,UAAU,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,EACpD,OAAO,EAAC,eAAe,EACvB,cAAc,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,EACnC,QAAQ,EAAE,cAAc,CAAC,MAAM,KAAK,CAAC,EAAA,CACvC,EACFH,cAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,6BAA6B,EAAE,EAAA,QAAA,EACnE,eAAe,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,MAC7BC,eAAA,CAAA,MAAA,EAAA,EAAA,QAAA,EAAA,CACK,KAAK,GAAG,CAAC,IAAID,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,MAAM,EAAA,QAAA,EAAA,GAAA,EAAA,CAAY,EAChDA,cAAA,CAAA,MAAA,EAAA,EACI,OAAO,EAAE,MAAM,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,EACrC,KAAK,EAAE;AACH,oCAAA,MAAM,EAAE,SAAS;AACjB,oCAAA,cAAc,EAAE,KAAK,GAAG,eAAe,CAAC,MAAM,GAAG,CAAC,GAAG,WAAW,GAAG;AACtE,iCAAA,EAAA,QAAA,EAEA,IAAI,CAAC,IAAI,EAAA,CACP,CAAA,EAAA,EAVA,KAAK,CAWT,CACV,CAAC,EAAA,CACA,CAAA,EAAA,CACJ,EAAA,CACJ;AAEd;;;;"}

package/dist/cjs/ObjectNavigationalBar/breadcrumbHelpers.js

@@ -0,0 +1,15 @@
+'use strict';
+
+function buildNavigationBreadcrumbs(navigationPath) {
+    const items = [{ name: 'Root', index: 0 }];
+    for (let i = 0; i < navigationPath.length; i++) {
+        items.push({
+            name: navigationPath[i],
+            index: i + 1,
+        });
+    }
+    return items;
+}
+
+exports.buildNavigationBreadcrumbs = buildNavigationBreadcrumbs;
+//# sourceMappingURL=breadcrumbHelpers.js.map

package/dist/cjs/ObjectNavigationalBar/breadcrumbHelpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumbHelpers.js","sources":["../../../ObjectNavigationalBar/breadcrumbHelpers.ts"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\n/**\n * Builds the breadcrumb items for an object navigation bar from a navigation path.\n * Always starts with a 'Root' item at index 0.\n */\nexport function buildNavigationBreadcrumbs(navigationPath: string[]): { name: string; index: number }[] {\n    const items: { name: string; index: number }[] = [{ name: 'Root', index: 0 }];\n    for (let i = 0; i < navigationPath.length; i++) {\n        items.push({\n            name: navigationPath[i],\n            index: i + 1,\n        });\n    }\n    return items;\n}\n"],"names":[],"mappings":";;AAOM,SAAU,0BAA0B,CAAC,cAAwB,EAAA;AAC/D,IAAA,MAAM,KAAK,GAAsC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;AAC7E,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,cAAc,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QAC5C,KAAK,CAAC,IAAI,CAAC;AACP,YAAA,IAAI,EAAE,cAAc,CAAC,CAAC,CAAC;YACvB,KAAK,EAAE,CAAC,GAAG,CAAC;AACf,SAAA,CAAC;IACN;AACA,IAAA,OAAO,KAAK;AAChB;;;;"}

package/dist/cjs/SchemaEditor/SchemaEditor.js

@@ -11,6 +11,7 @@ var faIcons = require('react-icons/fa6');
 var NameCell = require('./NameCell.js');
 var TypeCell = require('./TypeCell.js');
 var TypeFormat = require('../types/TypeFormat.js');
+var schemaHelpers = require('./schemaHelpers.js');
 var css = require('./SchemaEditor.module.css');
 
 function _interopNamespaceDefault(e) {
@@ -44,33 +45,19 @@ const SchemaEditor = ({ schema, eventTypeName = '', canEdit = true, canNotEditRe
             setCurrentPath([]);
         }
     }, [isEditMode]);
-    const validatePropertyName = React.useCallback((name, propertyId, allProperties) => {
-        if (!name || name.trim() === '') {
-            return 'Property name cannot be empty';
-        }
-        const validIdentifierPattern = /^[a-zA-Z_][a-zA-Z0-9_]*$/;
-        if (!validIdentifierPattern.test(name)) {
-            return 'Property name must start with a letter or underscore and contain only letters, numbers, and underscores';
-        }
-        const duplicates = allProperties.filter(p => p.name === name && p.id !== propertyId);
-        if (duplicates.length > 0) {
-            return 'Property name must be unique';
-        }
-        return undefined;
-    }, []);
     const validateAllProperties = React.useCallback((properties) => {
         const errors = {};
         properties.forEach(prop => {
             if (!prop.name)
                 return;
-            const error = validatePropertyName(prop.name, prop.id, properties);
+            const error = schemaHelpers.validatePropertyName(prop.name, prop.id, properties);
             if (error) {
                 errors[prop.id] = error;
             }
         });
         setValidationErrors(errors);
         return Object.keys(errors).length === 0;
-    }, [validatePropertyName]);
+    }, [schemaHelpers.validatePropertyName]);
     React.useEffect(() => {
         setCurrentSchema(schema);
         setInitialSchema(JSON.parse(JSON.stringify(schema)));
@@ -260,25 +247,7 @@ const SchemaEditor = ({ schema, eventTypeName = '', canEdit = true, canNotEditRe
         setInitialSchema(JSON.parse(JSON.stringify(currentSchema)));
         setIsEditMode(true);
     }, [currentSchema]);
-    const getBreadcrumbItems = () => {
-        const items = [{ name: eventTypeName, path: [] }];
-        for (let i = 0; i < currentPath.length; i++) {
-            const segment = currentPath[i];
-            if (segment === '$items') {
-                items.push({
-                    name: '[items]',
-                    path: currentPath.slice(0, i + 1)
-                });
-            }
-            else {
-                items.push({
-                    name: segment,
-                    path: currentPath.slice(0, i + 1)
-                });
-            }
-        }
-        return items;
-    };
+    const getBreadcrumbItems = () => schemaHelpers.buildBreadcrumbItems(eventTypeName, currentPath);
     const getCurrentDescription = React.useCallback(() => {
         let targetSchema = currentSchema;
         for (const segment of currentPath) {