Merge pull request #28 from firecamp-io/feat/monaco

Feat/monaco

packages/ui-kit/package.json

@@ -70,6 +70,7 @@
   },
   "dependencies": {
     "@firecamp/types": "^0.0.11",
+    "@radix-ui/react-toast": "^1.0.0",
     "@szhsin/react-menu": "^2.3.2",
     "autoprefixer": "^10",
     "classnames": "^2.3.1",

packages/ui-kit/src/components/toast/Toast.stories.tsx

@@ -0,0 +1,14 @@
+import Toast from './Toast';
+import { VscMenu } from "@react-icons/all-files/vsc/VscMenu";
+
+export default {
+  title: "UI-Kit/Toast",
+  component: Toast,
+  argTypes: {
+  }
+};
+
+const Template = (args: any) => <Toast {...args} />;
+
+export const ToastComp = Template.bind({});
+ToastComp.args = {};

packages/ui-kit/src/components/toast/Toast.tsx

@@ -0,0 +1,25 @@
+import * as Toast from '@radix-ui/react-toast';
+export default () => (
+  <Toast.Provider label="This is the toast">
+    <Toast.Root type="foreground">
+      <Toast.Description>File removed successfully.</Toast.Description>
+      <Toast.Close>Dismiss</Toast.Close>
+    </Toast.Root>
+
+    <Toast.Root type="foreground" duration={10000}>
+      <Toast.Description>File removed successfully.</Toast.Description>
+      <Toast.Action altText="Undo (Alt+U)">
+        Undo <kbd>Alt</kbd>+<kbd>U</kbd>
+      </Toast.Action>
+      <Toast.Close>Dismiss</Toast.Close>
+    </Toast.Root>
+
+    <Toast.Root>
+      <Toast.Title />
+      <Toast.Description />
+      <Toast.Action altText="action" />
+      <Toast.Close />
+    </Toast.Root>
+    <Toast.Viewport />
+  </Toast.Provider>
+);

packages/ui-kit/src/ui-kit.ts

@@ -92,10 +92,13 @@ export { default as UrlBar } from './components/url/components/UrlBar';
 export { default as Popover } from './components/popover/Popover';
 export { default as ConfirmationPopover } from './components/popover/ConfirmationPopover';
 
+// Toast
+export { default as Toast } from './components/toast/Toast';
+
 // scripts
 export { default as ScriptsTabs } from './components/scripts/ScriptsTabs';
 
-//response
+// response
 export { default as Response } from './components/response/Response';
 
 //----------------------------------------------------enums---------------------------------------------------------------------------
@@ -114,4 +117,4 @@ export { default as Alert } from './components/alert/Alert';
 export type { EAlertType } from './components/alert/Alert.interface';
 export { default as Empty } from './components/empty/Empty';
 
-export {default as Loader} from './components/loader/Loader';
+export { default as Loader } from './components/loader/Loader';

webpack.config.js

@@ -59,6 +59,7 @@ exports.output = {
   globalObject: 'this',
   filename: '[name].bundle.js',
   chunkFilename: '[name].bundle.js',
+  publicPath: '/js',
 };
 
 exports.output.path = path.join(__dirname, `./build/${env}/js`);