diff --git a/website/src/components/organisms/liveCode.tsx b/website/src/components/organisms/liveCode.tsx index 6f69de76..cb6e61af 100644 --- a/website/src/components/organisms/liveCode.tsx +++ b/website/src/components/organisms/liveCode.tsx @@ -3,7 +3,7 @@ import { useEffect, useState, useRef, memo } from 'react'; import { debounce } from '@elbwalker/utils'; import CodeBox, { formatValue } from '../molecules/codeBox'; -interface LiveCodeProps { +export interface LiveCodeProps { input: string; config?: string; output?: string; diff --git a/website/src/components/organisms/liveDestination.tsx b/website/src/components/organisms/liveDestination.tsx index c1f2536a..1636f3da 100644 --- a/website/src/components/organisms/liveDestination.tsx +++ b/website/src/components/organisms/liveDestination.tsx @@ -1,5 +1,6 @@ import type { Destination, Mapping, WalkerOS } from '@elbwalker/types'; import type { DestinationWeb } from '@elbwalker/walker.js'; +import type { LiveCodeProps } from './liveCode'; import React, { createContext, useCallback, @@ -96,28 +97,18 @@ export const DestinationInit: React.FC = ({ ); }; -interface DestinationPushProps { +interface DestinationPushProps + extends Omit { event: WalkerOS.PartialEvent; mapping?: Mapping.EventConfig | string; - height?: number; - smallText?: boolean; - className?: string; - labelLeft?: string; - labelMiddle?: string; - labelRight?: string; eventConfig?: boolean; } export const DestinationPush: React.FC = ({ event, mapping = {}, - height, - smallText, - className, - labelLeft, - labelMiddle = 'Event Config', - labelRight, eventConfig = true, + ...liveCodeProps }) => { const { customConfig, destination, fnName } = useDestinationContext(); const inputValue = formatValue(event); @@ -165,12 +156,7 @@ export const DestinationPush: React.FC = ({ config={mappingValue} fn={mappingFn} options={customConfig} - height={height} - smallText={smallText} - className={className} - labelInput={labelLeft} - labelConfig={labelMiddle} - labelOutput={labelRight} + {...liveCodeProps} /> ); };