fix: Some errors breaking storybook build (#18767)

* fix: filters ui breaking in routing insights page

* fix: story book build errors

---------

Co-authored-by: Anik Dhabal Babu <81948346+anikdhabal@users.noreply.github.com>

apps/storybook/.storybook/main.ts

@@ -9,8 +9,6 @@ const config: StorybookConfig = {
     "../../../packages/ui/components/**/*.docs.mdx",
     "../../../packages/features/**/*.stories.@(js|jsx|ts|tsx)",
     "../../../packages/features/**/*.docs.mdx",
-    "../../../packages/atoms/**/*.stories.@(js|jsx|ts|tsx)",
-    "../../../packages/atoms/**/*.docs.mdx",
   ],
 
   addons: [

apps/storybook/postcss.config.js

@@ -11,7 +11,8 @@ module.exports = {
      * These styles will only be added in storybook, and will NOT
      * end up in the final css bundle of apps using the components.
      */
-    "postcss-pseudo-companion-classes": {
+    [require.resolve("postcss-pseudo-companion-classes")]: {
+      prefix: "sb-pseudo--",
       prefix: "sb-pseudo--",
       // We have to keep a restrictTo list here, because otherwise
       // this library will have issues processing tailwind's \: prefixed classes

packages/app-store/salesforce/components/EventTypeAppCardInterface.tsx

@@ -209,7 +209,7 @@ const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({
                 <div>{t("value")}</div>
               </div>
               <div>
-                {...Object.keys(onBookingWriteToEventObjectMap).map((key) => (
+                {Object.keys(onBookingWriteToEventObjectMap).map((key) => (
                   <div className="mt-2 grid grid-cols-3 gap-4" key={key}>
                     <div>
                       <InputField value={key} readOnly />
@@ -303,7 +303,7 @@ const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({
                 <div>{t("when_to_write")}</div>
               </div>
               <div>
-                {...Object.keys(onBookingWriteToRecordFields).map((key) => (
+                {Object.keys(onBookingWriteToRecordFields).map((key) => (
                   <div className="mt-2 grid grid-cols-5 gap-4" key={key}>
                     <div>
                       <InputField value={key} readOnly />

packages/ui/components/buttonGroup/buttongroup.stories.mdx

@@ -12,7 +12,7 @@ import {
 
 import { Icon } from "@calcom/ui/icon";
 import { Button } from "@calcom/ui/button";
-import { ButtonGroup } from "@calcom/ui/ButtonGroup";
+import { ButtonGroup } from "@calcom/ui/buttonGroup";
 
 <Meta title="UI/Button Group" component={ButtonGroup} />
 

packages/ui/components/sheet/sheet.stories.mdx

@@ -21,7 +21,7 @@ import {
   SheetHeader,
   SheetTitle,
   SheetTrigger,
-} from "./sheet";
+} from "./Sheet";
 
 <Meta title="UI/Sheet" />