mainstack-design-system 0.0.3 → 0.0.5

package/README.md

@@ -12,29 +12,26 @@ To view the design system documentation, visit this [link](https://mainstack-des
 
 ## Components
 
-Components can be used by importing from the `src/components` directory. For example:
+Components can be used by importing from the `'mainstack-design-system/src` directory. For example:
 
-`import { Button } from 'mainstack-design-system/src/components/Buttons';`
+`import { Button } from 'mainstack-design-system/src';`
 
 ## Icons
 
-Icons are imported from the `src/icons` directory. For example:
+Icons are imported from the `'mainstack-design-system/src` directory. For example:
 
-`import { ArrowRight } from 'mainstack-design-system/src/icons';`
+`import { ArrowRightIcon } from 'mainstack-design-system/src';`
 
 ## Colors
 
-Colors are imported from the `mainstack-design-system/src/components/styleGuide` directory. For example:
+Colors are imported from the `mainstack-design-system/src` directory. For example:
 
 ```
-	import Colors from "mainstack-design-system/components/styleGuide/Colors";
+ import {Colors} from "mainstack-design-system/src";
 
-	<Text color={Colors.black300}>Hello World</Text>
+ <Text color={Colors.black300}>Hello World</Text>
 ```
 
-Conventional Commits is a specification for adding human and machine readable meaning to commit messages. It provides an easy set of rules for creating an explicit commit history; which makes it easier to write automated tools on top of. This convention dovetails with [SemVer](https://semver.org), by describing the features, fixes, and breaking changes made in commit messages.
-[more info](https://www.conventionalcommits.org/en/v1.0.0/)
-
 ## Contributing
 
 Installing the application (as a developer) is simple in the following steps:
@@ -54,7 +51,7 @@ git clone git clone https://github.com/The-Mainstack/mainstack-design-system.git
 - Navigate into the cloned directory and install dependencies with Yarn
 
 ```yarn
-yarn install
+yarn add
 ```
 
 - Make a duplicate of the **env** file and update its content accordingly. Most times, this is just fine with no update.
@@ -67,7 +64,7 @@ cp .env.sample .env
   Open [http://localhost:[port]](http://localhost:[port]) to view it in the browser and start developing.
 
 ```yarn
-yarn run dev
+yarn dev
 ```
 
 To run storybook, run the following command:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mainstack-design-system",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "type": "module",
   "scripts": {
     "dev": "vite",

package/src/components/InputFields/MarkdownEditor.tsx

@@ -133,7 +133,7 @@ const CustomToolbar = ({
   );
 };
 
-export const MarkdownEditor = ({
+const MarkdownEditor = ({
   defaultValue,
   onChange,
   border,
@@ -244,3 +244,5 @@ export const MarkdownEditor = ({
     </Box>
   );
 };
+
+export default MarkdownEditor;

package/src/components/index.ts

@@ -0,0 +1,33 @@
+/** @format */
+
+export { default as Button } from "./Button";
+export { default as IconButton } from "./Button/IconButton";
+export { default as Accordion } from "./Accordion";
+export { default as Avatars } from "./Avatars";
+export { default as Chip } from "./controls/Chip";
+export { default as DoubleTab } from "./controls/DoubleTab";
+export { default as Pagination } from "./controls/Pagination";
+export { default as RadioButton } from "./controls/RadioButton";
+export { default as RectangleCheckButton } from "./controls/RectangleCheckButton";
+export { default as RoundCheckButton } from "./controls/RoundCheckButton";
+export { default as Stepper } from "./controls/Stepper";
+export { default as TabMenu } from "./controls/TabMenu";
+export { default as ToggleButton } from "./controls/ToggleButton";
+export * from "./InputFields/SelectInput";
+export { default as Input } from "./InputFields/Input";
+export { default as MarkdownEditor } from "./InputFields/MarkdownEditor";
+export { default as SearchInput } from "./InputFields/SearchInput";
+export { default as TextArea } from "./InputFields/TextArea";
+export { default as UsernameInput } from "./InputFields/UsernameInput";
+export { default as Banner } from "./notifications/Banner";
+export { default as ClickTooltip } from "./notifications/ClickTooltip";
+export { default as HoverTooltip } from "./notifications/HoverTooltip";
+export { default as Snackbar } from "./notifications/Snackbar";
+export { default as Colors } from "./styleGuide/Colors";
+export { default as Tiles } from "./Tiles";
+export { default as Display } from "./Typography/Display";
+export { default as Heading } from "./Typography/Heading";
+export { default as Paragraph } from "./Typography/Paragraph";
+export { default as Subtitle } from "./Typography/Subtitle";
+export { default as FileUploader } from "./Uploader/FileUploader";
+export { default as ImageUploader } from "./Uploader/ImageUploader";

package/src/index.ts

@@ -0,0 +1,4 @@
+/** @format */
+
+export * from "./components";
+export * from "./icons";

package/src/pages/Home.tsx

@@ -1,7 +1,7 @@
 /** @format */
 
 import { Box, Text } from "@chakra-ui/react";
-import { MarkdownEditor } from "components/InputFields/MarkdownEditor";
+import { Button, MarkdownEditor, Colors } from "components";
 import CountrySelectWrapper from "stories/InputFields/Select/CountrySelectWrapper";
 import PhoneNumberInputWrapper from "stories/InputFields/Select/PhoneNumberInputWrapper";
 import SelectWrapper from "stories/InputFields/Select/SelectWrapper";

package/src/stories/InputFields/MarkdownEditor.stories.ts

@@ -1,7 +1,7 @@
 /** @format */
 
 import type { Meta, StoryObj } from "@storybook/react";
-import { MarkdownEditor as MarkdownEditorComponent } from "components/InputFields/MarkdownEditor";
+import { MarkdownEditor as MarkdownEditorComponent } from "components";
 import TextArea from "components/InputFields/TextArea";
 
 const meta: Meta<typeof MarkdownEditorComponent> = {

package/vite.config.ts

@@ -5,6 +5,7 @@ import react from "@vitejs/plugin-react";
 import viteTsconfigPaths from "vite-tsconfig-paths";
 import svgrPlugin from "vite-plugin-svgr";
 import envCompatible from "vite-plugin-env-compatible";
+import { resolve } from "path";
 
 export default defineConfig({
   envPrefix: "REACT_APP_",
@@ -20,6 +21,9 @@ export default defineConfig({
   },
   build: {
     outDir: "build",
+    lib: {
+      entry: resolve(__dirname, "./src/index.ts"),
+    },
     commonjsOptions: {
       transformMixedEsModules: true,
     },