index-addon.js

import { addFilter, addAction } from '@wordpress/hooks';
import {Button } from '@wordpress/components'
addFilter( 'WPTReactPluginTestButtonText', 'WPRactPluginTestHook', (arg )=>{
    return arg + ' Please'
}, 10  )


addFilter( 'WPTReactPluginTestButtonText', 'WPRactPluginTestHook', (arg)=>{
    return arg + ' Here'
}, 9 )

addFilter( 'WPTReactPluginTestButton', 'WPRactPluginTestHook', (arg )=>{
    return <Button isPrimary>New Button from addon</Button>
}, 10  )



addAction( 'WPTReactPluginTestButtonAction', 'WPRactPluginTestHook', (arg)=>{
    alert('Clicked ' + arg);
}, 11 )

// console.log('test from addon');

index-main.js

import { render } from '@wordpress/element'
import domReady from '@wordpress/dom-ready';
import {Button,Notice,TextareaControl,Icon,ToggleControl,Panel, PanelBody, PanelRow} from '@wordpress/components'
import { applyFilters, doAction } from '@wordpress/hooks';

const App = () => {
    return <>
    
    Welcome to WP react Tuts
    <div className="textarea-wrapper">
    <TextareaControl></TextareaControl>

    </div>
    <Button isPrimary onClick={()=>{
        doAction('WPTReactPluginTestButtonAction', 'Some action' );
    }}> {applyFilters('WPTReactPluginTestButtonText', 'Click' )}</Button>
    <Notice status="error">
        An unknown error occurred.
    </Notice>
    <Icon icon="screenoptions" />
    <ToggleControl
        label="Fixed Background"
        help={ 'No fixed background.' }

    />
    {applyFilters('WPTReactPluginTestButton', <Button isPrimary>Test Button</Button> )}
    <Panel header="My Panel">
        <PanelBody title="My Block Settings"  initialOpen={ true }>
            <PanelRow>My Panel Inputs and Labels</PanelRow>
        </PanelBody>
        <PanelBody title="My Block Settings 2"  initialOpen={ false }>
            <PanelRow>My Panel Inputs and Labels 2</PanelRow>
        </PanelBody>
    </Panel>
    </>
}

domReady(function () {
    if ('undefined' !== typeof document.getElementById('wp-react-plugin-test-app') && null !== document.getElementById('wp-react-plugin-test-app')) {
        render(<App />, document.getElementById('wp-react-plugin-test-app'));
    }
});