# Overriding built-in components duplicating it

**URL:** <https://forum.builder.io/t/overriding-built-in-components-duplicating-it/5434>\
**Category:** Technical Questions\
**Tags:** visual-editor, api\
**Created:** [April 24, 2024, 9:33am UTC](https://forum.builder.io/t/overriding-built-in-components-duplicating-it/5434 "2024-04-24T09:33:53Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)\
**Post date:** [April 24, 2024, 10:40am UTC](https://forum.builder.io/t/overriding-built-in-components-duplicating-it/5434/2 "2024-04-24T10:40:12Z")

</div>

Hello @saura,

For overriding the Box component, try using the below code

```auto
const FakeBox = () => <div>Boxxx!!</div>;
Builder.registerComponent(FakeBox, {
  name: "Core:Box",
  override: true,
  canHaveChildren: true,
  inputs: [
    {
      name: 'children',
      type: 'uiBlocks',
      defaultValue: [],
      // showNoBlocks: false
      hideFromUI: true,
    },
    {
      name: 'verticalAlignContent',
      type: 'string',
      enum: ['top', 'bottom', 'middle'],
      defaultValue: 'top',
    },
  ],
  defaultStyles: {
    height: '100px',
  },
});

```

To hide the insertMenu, you can use the below code

```auto
Builder.register('editor.settings', { customInsertMenu: true });

```

> <https://github.com/BuilderIO/builder/blob/main/examples/react-design-system/src/builder-settings.js#L23-L78>

---

_[View the full topic](https://forum.builder.io/t/overriding-built-in-components-duplicating-it/5434)._