Live code editor for UI docs (#2351)

* Docausaurus code live editor test

* Docusaurus sandpack test

* Fix setup

* Delete files

* Fixes

* Complete work

* Fix config

* Fix config

---------

Co-authored-by: bosiraphael <raphael.bosi@gmail.com>

docs/docs/contributor/frontend/ui-components/display/_category_.json

@@ -0,0 +1,9 @@
+{
+  "label": "Display",
+  "position": 0,
+  "collapsible": true,
+  "collapsed": true,
+  "customProps": {
+    "icon": "TbForms"
+  }
+}

docs/docs/contributor/frontend/ui-components/display/checkmark.mdx

@@ -0,0 +1,16 @@
+---
+title: Checkmark
+sidebar_position: 1
+---
+
+import { SandpackEditor} from '@site/src/ui/SandpackEditor'
+
+<SandpackEditor
+  componentPath='@/ui/Checkmark/components/Checkmark'
+  componentCode={`import { Checkmark } from "@/ui/Checkmark/components/Checkmark";
+
+export const MyComponent = () => {
+ return <Checkmark />;
+}
+`} 
+/>