feat: init

packages/propel/.storybook/main.ts

@@ -0,0 +1,20 @@
+import type { StorybookConfig } from "@storybook/react-vite";
+
+import { join, dirname } from "path";
+
+/*
+ * This function is used to resolve the absolute path of a package.
+ * It is needed in projects that use Yarn PnP or are set up within a monorepo.
+ */
+function getAbsolutePath(value: string) {
+  return dirname(require.resolve(join(value, "package.json")));
+}
+const config: StorybookConfig = {
+  stories: ["../src/**/*.stories.@(ts|tsx)"],
+  addons: [getAbsolutePath("@storybook/addon-designs"), getAbsolutePath("@storybook/addon-docs")],
+  framework: {
+    name: getAbsolutePath("@storybook/react-vite"),
+    options: {},
+  },
+};
+export default config;

packages/propel/.storybook/manager.ts

@@ -0,0 +1,14 @@
+import { addons } from "storybook/manager-api";
+import { create } from "storybook/theming";
+
+const planeTheme = create({
+  base: "dark",
+  brandTitle: "Plane UI",
+  brandUrl: "https://plane.so",
+  brandImage: "plane-lockup-light.svg",
+  brandTarget: "_self",
+});
+
+addons.setConfig({
+  theme: planeTheme,
+});

packages/propel/.storybook/preview.ts

@@ -0,0 +1,15 @@
+import type { Preview } from "@storybook/react-vite";
+import "@plane/tailwind-config/global.css";
+import "../src/styles/react-day-picker.css";
+
+const parameters: Preview["parameters"] = {
+  controls: {
+    matchers: {},
+  },
+};
+
+const preview: Preview = {
+  parameters,
+  tags: ["autodocs"],
+};
+export default preview;