🚀 Init preview and typebot cotext in editor

apps/builder/libs/chakra.ts

@@ -50,11 +50,6 @@ const components = {
       colorScheme: 'blue',
     },
   },
-  Button: {
-    defaultProps: {
-      colorScheme: 'blue',
-    },
-  },
   NumberInput: {
     defaultProps: {
       focusBorderColor: 'blue.200',

apps/builder/libs/kbar.ts

@@ -0,0 +1,16 @@
+export const actions = [
+  {
+    id: 'blog',
+    name: 'Blog',
+    shortcut: ['b'],
+    keywords: 'writing words',
+    perform: () => (window.location.pathname = 'blog'),
+  },
+  {
+    id: 'contact',
+    name: 'Contact',
+    shortcut: ['c'],
+    keywords: 'email',
+    perform: () => (window.location.pathname = 'contact'),
+  },
+]

apps/builder/libs/plate.ts

@@ -0,0 +1,56 @@
+import {
+  AutoformatRule,
+  createAutoformatPlugin,
+} from '@udecode/plate-autoformat'
+import {
+  MARK_BOLD,
+  MARK_UNDERLINE,
+  MARK_ITALIC,
+  createBoldPlugin,
+  createItalicPlugin,
+  createUnderlinePlugin,
+} from '@udecode/plate-basic-marks'
+import { createPlugins } from '@udecode/plate-core'
+import { createLinkPlugin } from '@udecode/plate-link'
+
+export const editorStyle: React.CSSProperties = {
+  flex: 1,
+  padding: '1rem',
+  backgroundColor: 'white',
+  borderRadius: '0.25rem',
+}
+
+export const autoFormatRules: AutoformatRule[] = [
+  {
+    mode: 'mark',
+    type: MARK_BOLD,
+    match: '**',
+  },
+  {
+    mode: 'mark',
+    type: MARK_UNDERLINE,
+    match: '__',
+  },
+  {
+    mode: 'mark',
+    type: MARK_ITALIC,
+    match: '*',
+  },
+  {
+    mode: 'mark',
+    type: MARK_ITALIC,
+    match: '_',
+  },
+]
+
+export const platePlugins = createPlugins([
+  createBoldPlugin(),
+  createItalicPlugin(),
+  createUnderlinePlugin(),
+  createLinkPlugin(),
+  createAutoformatPlugin({
+    options: {
+      rules: autoFormatRules,
+    },
+  }),
+])