From 7c4ea23f8863f9f346d0d0341609353a311496bf Mon Sep 17 00:00:00 2001
From: Will Martin <contact@willmartian.com>
Date: Fri, 30 Jan 2026 14:51:54 -0500
Subject: [PATCH] [CL-970] delete deprecated drawer (#18577)

* delete bit drawer

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

* fix: remove stale drawer export from components barrel file

The drawer directory was deleted but the export statement in index.ts
was not removed, causing import errors.

Co-authored-by: Will Martin <willmartian@users.noreply.github.com>

---------

Co-authored-by: Claude Sonnet 4.5 <noreply@anthropic.com>
Co-authored-by: claude[bot] <41898282+claude[bot]@users.noreply.github.com>
Co-authored-by: Will Martin <willmartian@users.noreply.github.com>
---
 libs/components/src/dialog/dialog.service.ts  |   2 +-
 .../src/{drawer => dialog}/drawer.service.ts  |   0
 .../src/drawer/drawer-body.component.ts       |  27 ----
 .../src/drawer/drawer-close.directive.ts      |  28 ----
 .../src/drawer/drawer-header.component.html   |   9 --
 .../src/drawer/drawer-header.component.ts     |  34 -----
 .../src/drawer/drawer-host.directive.ts       |  27 ----
 .../src/drawer/drawer.component.html          |   8 --
 .../components/src/drawer/drawer.component.ts |  75 ----------
 libs/components/src/drawer/drawer.mdx         | 122 -----------------
 libs/components/src/drawer/drawer.module.ts   |  12 --
 libs/components/src/drawer/drawer.stories.ts  | 128 ------------------
 libs/components/src/drawer/index.ts           |   5 -
 libs/components/src/index.ts                  |   1 -
 .../components/src/layout/layout.component.ts |   4 +-
 .../kitchen-sink-shared.module.ts             |   3 -
 16 files changed, 2 insertions(+), 483 deletions(-)
 rename libs/components/src/{drawer => dialog}/drawer.service.ts (100%)
 delete mode 100644 libs/components/src/drawer/drawer-body.component.ts
 delete mode 100644 libs/components/src/drawer/drawer-close.directive.ts
 delete mode 100644 libs/components/src/drawer/drawer-header.component.html
 delete mode 100644 libs/components/src/drawer/drawer-header.component.ts
 delete mode 100644 libs/components/src/drawer/drawer-host.directive.ts
 delete mode 100644 libs/components/src/drawer/drawer.component.html
 delete mode 100644 libs/components/src/drawer/drawer.component.ts
 delete mode 100644 libs/components/src/drawer/drawer.mdx
 delete mode 100644 libs/components/src/drawer/drawer.module.ts
 delete mode 100644 libs/components/src/drawer/drawer.stories.ts
 delete mode 100644 libs/components/src/drawer/index.ts

diff --git a/libs/components/src/dialog/dialog.service.ts b/libs/components/src/dialog/dialog.service.ts
index 8393db57b2f..ed17cb27327 100644
--- a/libs/components/src/dialog/dialog.service.ts
+++ b/libs/components/src/dialog/dialog.service.ts
@@ -16,9 +16,9 @@ import { AuthService } from "@bitwarden/common/auth/abstractions/auth.service";
 import { AuthenticationStatus } from "@bitwarden/common/auth/enums/authentication-status";
 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
 
-import { DrawerService } from "../drawer/drawer.service";
 import { isAtOrLargerThanBreakpoint } from "../utils/responsive-utils";
 
+import { DrawerService } from "./drawer.service";
 import { SimpleConfigurableDialogComponent } from "./simple-dialog/simple-configurable-dialog/simple-configurable-dialog.component";
 import { SimpleDialogOptions } from "./simple-dialog/types";
 
diff --git a/libs/components/src/drawer/drawer.service.ts b/libs/components/src/dialog/drawer.service.ts
similarity index 100%
rename from libs/components/src/drawer/drawer.service.ts
rename to libs/components/src/dialog/drawer.service.ts
diff --git a/libs/components/src/drawer/drawer-body.component.ts b/libs/components/src/drawer/drawer-body.component.ts
deleted file mode 100644
index c6499067642..00000000000
--- a/libs/components/src/drawer/drawer-body.component.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { CdkScrollable } from "@angular/cdk/scrolling";
-import { ChangeDetectionStrategy, Component } from "@angular/core";
-
-import { hasScrolledFrom } from "../utils/has-scrolled-from";
-
-/**
- * Body container for `bit-drawer`
- */
-@Component({
-  selector: "bit-drawer-body",
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  imports: [],
-  host: {
-    class:
-      "tw-p-4 tw-pt-0 tw-flex-1 tw-overflow-auto tw-border-solid tw-border tw-border-transparent tw-transition-colors tw-duration-200",
-    "[class.tw-border-t-secondary-300]": "this.hasScrolledFrom().top",
-  },
-  hostDirectives: [
-    {
-      directive: CdkScrollable,
-    },
-  ],
-  template: ` <ng-content></ng-content> `,
-})
-export class DrawerBodyComponent {
-  protected hasScrolledFrom = hasScrolledFrom();
-}
diff --git a/libs/components/src/drawer/drawer-close.directive.ts b/libs/components/src/drawer/drawer-close.directive.ts
deleted file mode 100644
index f105e21ea62..00000000000
--- a/libs/components/src/drawer/drawer-close.directive.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import { Directive, inject } from "@angular/core";
-
-import { DrawerComponent } from "./drawer.component";
-
-/**
- * Closes the ancestor drawer
- *
- * @example
- *
- * ```html
- * <bit-drawer>
- *  <button type="button" bitButton bitDrawerClose>Close</button>
- * </bit-drawer>
- * ```
- **/
-@Directive({
-  selector: "button[bitDrawerClose]",
-  host: {
-    "(click)": "onClick()",
-  },
-})
-export class DrawerCloseDirective {
-  private drawer = inject(DrawerComponent, { optional: true });
-
-  protected onClick() {
-    this.drawer?.open.set(false);
-  }
-}
diff --git a/libs/components/src/drawer/drawer-header.component.html b/libs/components/src/drawer/drawer-header.component.html
deleted file mode 100644
index 2723744eda3..00000000000
--- a/libs/components/src/drawer/drawer-header.component.html
+++ /dev/null
@@ -1,9 +0,0 @@
-<header class="tw-flex tw-justify-between tw-items-center tw-gap-4">
-  <div class="tw-flex tw-items-center tw-gap-4 tw-overflow-auto">
-    <ng-content select="[slot=start]"></ng-content>
-    <h2 bitTypography="h3" noMargin class="tw-text-main tw-mb-0 tw-truncate" [attr.title]="title()">
-      {{ title() }}
-    </h2>
-  </div>
-  <button bitIconButton="bwi-close" type="button" bitDrawerClose [label]="'close' | i18n"></button>
-</header>
diff --git a/libs/components/src/drawer/drawer-header.component.ts b/libs/components/src/drawer/drawer-header.component.ts
deleted file mode 100644
index 006c48e091d..00000000000
--- a/libs/components/src/drawer/drawer-header.component.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { CommonModule } from "@angular/common";
-import { ChangeDetectionStrategy, Component, HostBinding, input } from "@angular/core";
-
-import { I18nPipe } from "@bitwarden/ui-common";
-
-import { IconButtonModule } from "../icon-button";
-import { TypographyModule } from "../typography";
-
-import { DrawerCloseDirective } from "./drawer-close.directive";
-
-/**
- * Header container for `bit-drawer`
- **/
-@Component({
-  selector: "bit-drawer-header",
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  imports: [CommonModule, DrawerCloseDirective, TypographyModule, IconButtonModule, I18nPipe],
-  templateUrl: "drawer-header.component.html",
-  host: {
-    class: "tw-block tw-ps-4 tw-pe-2 tw-py-2",
-  },
-})
-export class DrawerHeaderComponent {
-  /**
-   * The title to display
-   */
-  readonly title = input.required<string>();
-
-  /** We don't want to set the HTML title attribute with `this.title` */
-  @HostBinding("attr.title")
-  protected get getTitle(): null {
-    return null;
-  }
-}
diff --git a/libs/components/src/drawer/drawer-host.directive.ts b/libs/components/src/drawer/drawer-host.directive.ts
deleted file mode 100644
index 7804d111ed6..00000000000
--- a/libs/components/src/drawer/drawer-host.directive.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { Portal } from "@angular/cdk/portal";
-import { Directive, signal } from "@angular/core";
-
-/**
- * Host that renders a drawer
- *
- * @internal
- */
-@Directive({
-  selector: "[bitDrawerHost]",
-})
-export class DrawerHostDirective {
-  private readonly _portal = signal<Portal<unknown> | undefined>(undefined);
-
-  /** The portal to display */
-  portal = this._portal.asReadonly();
-
-  open(portal: Portal<unknown>) {
-    this._portal.set(portal);
-  }
-
-  close(portal: Portal<unknown>) {
-    if (portal === this.portal()) {
-      this._portal.set(undefined);
-    }
-  }
-}
diff --git a/libs/components/src/drawer/drawer.component.html b/libs/components/src/drawer/drawer.component.html
deleted file mode 100644
index 79cbf319e7d..00000000000
--- a/libs/components/src/drawer/drawer.component.html
+++ /dev/null
@@ -1,8 +0,0 @@
-<ng-container *cdkPortal>
-  <section
-    [attr.role]="role()"
-    class="tw-w-[23rem] tw-sticky tw-top-0 tw-h-full tw-flex tw-flex-col tw-overflow-auto tw-border-0 tw-border-l tw-border-solid tw-border-secondary-300 tw-bg-background"
-  >
-    <ng-content></ng-content>
-  </section>
-</ng-container>
diff --git a/libs/components/src/drawer/drawer.component.ts b/libs/components/src/drawer/drawer.component.ts
deleted file mode 100644
index 042d1eace79..00000000000
--- a/libs/components/src/drawer/drawer.component.ts
+++ /dev/null
@@ -1,75 +0,0 @@
-import { CdkPortal, PortalModule } from "@angular/cdk/portal";
-import { CommonModule } from "@angular/common";
-import {
-  ChangeDetectionStrategy,
-  Component,
-  effect,
-  inject,
-  input,
-  model,
-  viewChild,
-} from "@angular/core";
-
-import { DrawerService } from "./drawer.service";
-
-/**
- * A drawer is a panel of supplementary content that is adjacent to the page's main content.
- *
- * Drawers render in `bit-layout`. Drawers must be a descendant of `bit-layout`, but they do not need to be a direct descendant.
- */
-@Component({
-  selector: "bit-drawer",
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  imports: [CommonModule, PortalModule],
-  templateUrl: "drawer.component.html",
-})
-export class DrawerComponent {
-  private drawerHost = inject(DrawerService);
-  private readonly portal = viewChild.required(CdkPortal);
-
-  /**
-   * Whether or not the drawer is open.
-   *
-   * Note: Does not support implicit boolean transform due to Angular limitation. Must be bound explicitly `[open]="true"` instead of just `open`.
-   * https://github.com/angular/angular/issues/55166#issuecomment-2032150999
-   **/
-  readonly open = model<boolean>(false);
-
-  /**
-   * The ARIA role of the drawer.
-   *
-   * - [complementary](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/complementary_role)
-   *    - For drawers that contain content that is complementary to the page's main content. (default)
-   * - [navigation](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/navigation_role)
-   *    - For drawers that primary contain links to other content.
-   */
-  readonly role = input<"complementary" | "navigation">("complementary");
-
-  constructor() {
-    effect(
-      () => {
-        this.open() ? this.drawerHost.open(this.portal()) : this.drawerHost.close(this.portal());
-      },
-      {
-        allowSignalWrites: true,
-      },
-    );
-
-    // Set `open` to `false` when another drawer is opened.
-    effect(
-      () => {
-        if (this.drawerHost.portal() !== this.portal()) {
-          this.open.set(false);
-        }
-      },
-      {
-        allowSignalWrites: true,
-      },
-    );
-  }
-
-  /** Toggle the drawer between open & closed */
-  toggle() {
-    this.open.update((prev) => !prev);
-  }
-}
diff --git a/libs/components/src/drawer/drawer.mdx b/libs/components/src/drawer/drawer.mdx
deleted file mode 100644
index 1050ab476f7..00000000000
--- a/libs/components/src/drawer/drawer.mdx
+++ /dev/null
@@ -1,122 +0,0 @@
-import { Meta, Canvas, Primary, Controls } from "@storybook/addon-docs/blocks";
-
-import * as stories from "./drawer.stories";
-
-import { DrawerOpen as KitchenSink } from "../stories/kitchen-sink/kitchen-sink.stories";
-
-<Meta of={stories} />
-
-```ts
-import { DrawerComponent } from "@bitwarden/components";
-```
-
-# Drawer
-
-**Note: `bit-drawer` is deprecated. Use `bit-dialog` and `DialogService.openDrawer(...)` instead.**
-
-A drawer is a panel of supplementary content that is adjacent to the page's main content.
-
-<Primary />
-
-<Controls />
-
-## Usage
-
-A `bit-drawer` in a template will not render inline, but rather will render adjacent to the main
-page content.
-
-```html
-<bit-drawer [open]="true">
-  <bit-drawer-header title="Hello Bitwaaaaaaaaaaaaaaaaaaaaaaaaarden!"></bit-drawer-header>
-  <bit-drawer-body>
-    <p>Lorem ipsum dolor...</p>
-  </bit-drawer-body>
-</bit-drawer>
-```
-
-`bit-drawer` must be a descendant of `bit-layout`, but it does not need to be a direct descendant.
-
-## Header and body
-
-Header and body content can be provided with the `bit-drawer-header` and `bit-drawer-body`
-components, respectively.
-
-A title can be passed to the header by input:
-`<bit-drawer-header title="Foobar"></bit-drawer-header>`
-
-Custom content can be rendered before the title with the header's `start` slot:
-
-```html
-<bit-drawer-header title="Foobar">
-  <i slot="start" class="bwi bwi-key" aria-hidden="true"></i>
-</bit-drawer-header>
-```
-
-## Opening and closing
-
-`bit-drawer` opens when its `open` input is `true`:
-
-```html
-<bit-drawer [open]="true">...</bit-drawer>
-```
-
-Note: Model inputs do not support implicit boolean transformation (see Angular reasoning
-[here](https://github.com/angular/angular/issues/55166#issuecomment-2032150999)). `open` must be
-bound explicitly `<bit-drawer [open]="true">` instead of just `<bit-drawer open>`.
-
-Buttons can be made to open/toggle drawers by referencing a template variable, or by manipulating
-state that is bound to `open`:
-
-```html
-<button (click)="myDrawer.toggle()"></button> <bit-drawer #myDrawer>...</bit-drawer>
-```
-
-For convenience, close buttons can be created _inside_ the drawer with the `bitDrawerClose`
-directive:
-
-```html
-<bit-drawer>
-  <button type="button" bitDrawerClose>Close</button>
-</bit-drawer>
-```
-
-## Multiple Drawers
-
-Only one drawer can be open at a time, and they do not stack. If a drawer is already open, opening
-another will close and replace the one already open.
-
-<Canvas of={stories.MultipleDrawers} />
-
-## Headless
-
-Omitting `bit-drawer-header` and `bit-drawer-body` allows for fully customizable content.
-
-<Canvas of={stories.Headless} />
-
-## Accessibility
-
-- The drawer should contain an h2 element. If you are using `bit-drawer-header`, this is created for
-  you via the `title` input:
-
-```html
-<bit-drawer>
-  <h2 bitTypography="h2">Hello world!</h2>
-</bit-drawer>
-
-<!-- or -->
-
-<bit-drawer>
-  <bit-drawer-header title="Hello world!"></bit-drawer-header>
-</bit-drawer>
-```
-
-- The ARIA role of the drawer can be set with the `role` attribute:
-  - [complementary](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/complementary_role)
-    (default)
-    - For drawers that contain content that is complementary to the page's main content.
-  - [navigation](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/navigation_role)
-    - For drawers that primary contain links to other content.
-
-## Kitchen Sink
-
-<Canvas of={KitchenSink} autoplay />
diff --git a/libs/components/src/drawer/drawer.module.ts b/libs/components/src/drawer/drawer.module.ts
deleted file mode 100644
index 9f51ba06b4e..00000000000
--- a/libs/components/src/drawer/drawer.module.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { NgModule } from "@angular/core";
-
-import { DrawerBodyComponent } from "./drawer-body.component";
-import { DrawerCloseDirective } from "./drawer-close.directive";
-import { DrawerHeaderComponent } from "./drawer-header.component";
-import { DrawerComponent } from "./drawer.component";
-
-@NgModule({
-  imports: [DrawerComponent, DrawerHeaderComponent, DrawerBodyComponent, DrawerCloseDirective],
-  exports: [DrawerComponent, DrawerHeaderComponent, DrawerBodyComponent, DrawerCloseDirective],
-})
-export class DrawerModule {}
diff --git a/libs/components/src/drawer/drawer.stories.ts b/libs/components/src/drawer/drawer.stories.ts
deleted file mode 100644
index 9904b77ee9f..00000000000
--- a/libs/components/src/drawer/drawer.stories.ts
+++ /dev/null
@@ -1,128 +0,0 @@
-import { RouterTestingModule } from "@angular/router/testing";
-import { Meta, StoryObj, applicationConfig, moduleMetadata } from "@storybook/angular";
-
-import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
-import { GlobalStateProvider } from "@bitwarden/state";
-
-import { ButtonModule } from "../button";
-import { CalloutModule } from "../callout";
-import { LayoutComponent } from "../layout";
-import { mockLayoutI18n } from "../layout/mocks";
-import { positionFixedWrapperDecorator } from "../stories/storybook-decorators";
-import { TypographyModule } from "../typography";
-import { I18nMockService, StorybookGlobalStateProvider } from "../utils";
-
-import { DrawerBodyComponent } from "./drawer-body.component";
-import { DrawerHeaderComponent } from "./drawer-header.component";
-import { DrawerComponent } from "./drawer.component";
-import { DrawerModule } from "./drawer.module";
-
-export default {
-  title: "Component Library/Drawer",
-  component: DrawerComponent,
-  subcomponents: {
-    DrawerHeaderComponent,
-    DrawerBodyComponent,
-  },
-  decorators: [
-    positionFixedWrapperDecorator(),
-    moduleMetadata({
-      imports: [
-        RouterTestingModule,
-        LayoutComponent,
-        DrawerModule,
-        ButtonModule,
-        CalloutModule,
-        TypographyModule,
-      ],
-      providers: [
-        {
-          provide: I18nService,
-          useFactory: () => {
-            return new I18nMockService({
-              ...mockLayoutI18n,
-              close: "Close",
-              loading: "Loading",
-            });
-          },
-        },
-      ],
-    }),
-    applicationConfig({
-      providers: [
-        {
-          provide: GlobalStateProvider,
-          useClass: StorybookGlobalStateProvider,
-        },
-      ],
-    }),
-  ],
-} as Meta<DrawerComponent>;
-
-type Story = StoryObj<DrawerComponent>;
-
-export const Default: Story = {
-  render: (args) => ({
-    props: args,
-    template: /*html*/ `
-        <bit-layout class="tw-text-main">
-            <p>The drawer is {{ open ? "open" : "closed" }}.<p>
-            <button type="button" bitButton (click)="drawer.toggle()">Toggle</button>
-            
-            <!-- Note: bit-drawer does *not* need to be a direct descendant of bit-layout. -->
-            <bit-drawer [(open)]="open" #drawer>
-              <bit-drawer-header title="Hello Bitwaaaaaaaaaaaaaaaaaaaaaaaaarden!">
-                <i slot="start" class="bwi bwi-key" aria-hidden="true"></i>
-              </bit-drawer-header>
-              <bit-drawer-body>
-                <p bitTypography="body1">
-                  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-                </p>
-              </bit-drawer-body>
-            </bit-drawer>
-        </bit-layout>
-    `,
-  }),
-  args: {
-    open: true,
-  },
-};
-
-export const Headless: Story = {
-  render: (args) => ({
-    props: args,
-    template: /*html*/ `
-        <bit-layout class="tw-text-main">
-            <p>The drawer is {{ open ? "open" : "closed" }}.<p>
-            <button type="button" bitButton (click)="drawer.toggle()">Toggle</button>
-            <bit-drawer [(open)]="open" #drawer>
-              <h2 bitTypography="h2"></h2>
-              Hello world!
-            </bit-drawer>
-        </bit-layout>
-    `,
-  }),
-  args: {
-    open: true,
-  },
-};
-
-export const MultipleDrawers: Story = {
-  render: (args) => ({
-    props: args,
-    template: /*html*/ `
-        <bit-layout class="tw-text-main">
-            <button type="button" bitButton (click)="foo.toggle()">{{ !foo.open() ? "Open" : "Close" }} Foo</button>
-            <button type="button" bitButton (click)="bar.toggle()">{{ !bar.open() ? "Open" : "Close" }} Bar</button>
-            
-            <bit-drawer #foo>
-              Foo
-            </bit-drawer>
-
-            <bit-drawer #bar [open]="true">
-              Bar
-            </bit-drawer>
-        </bit-layout>
-    `,
-  }),
-};
diff --git a/libs/components/src/drawer/index.ts b/libs/components/src/drawer/index.ts
deleted file mode 100644
index abf5b8d34f1..00000000000
--- a/libs/components/src/drawer/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export * from "./drawer.module";
-export * from "./drawer.component";
-export * from "./drawer-body.component";
-export * from "./drawer-close.directive";
-export * from "./drawer-header.component";
diff --git a/libs/components/src/index.ts b/libs/components/src/index.ts
index 80fd6fc05a6..7395b87b2ab 100644
--- a/libs/components/src/index.ts
+++ b/libs/components/src/index.ts
@@ -17,7 +17,6 @@ export * from "./container";
 export * from "./copy-click";
 export * from "./dialog";
 export * from "./disclosure";
-export * from "./drawer";
 export * from "./form-field";
 export * from "./header";
 export * from "./icon-button";
diff --git a/libs/components/src/layout/layout.component.ts b/libs/components/src/layout/layout.component.ts
index 5e3d420c8e5..da30b76a9f0 100644
--- a/libs/components/src/layout/layout.component.ts
+++ b/libs/components/src/layout/layout.component.ts
@@ -4,8 +4,7 @@ import { CommonModule } from "@angular/common";
 import { booleanAttribute, Component, ElementRef, inject, input, viewChild } from "@angular/core";
 import { RouterModule } from "@angular/router";
 
-import { DrawerHostDirective } from "../drawer/drawer-host.directive";
-import { DrawerService } from "../drawer/drawer.service";
+import { DrawerService } from "../dialog/drawer.service";
 import { LinkModule } from "../link";
 import { SideNavService } from "../navigation/side-nav.service";
 import { SharedModule } from "../shared";
@@ -31,7 +30,6 @@ import { ScrollLayoutHostDirective } from "./scroll-layout.directive";
     "(document:keydown.tab)": "handleKeydown($event)",
     class: "tw-block tw-h-screen",
   },
-  hostDirectives: [DrawerHostDirective],
 })
 export class LayoutComponent {
   protected sideNavService = inject(SideNavService);
diff --git a/libs/components/src/stories/kitchen-sink/kitchen-sink-shared.module.ts b/libs/components/src/stories/kitchen-sink/kitchen-sink-shared.module.ts
index 398251fd2e2..1b2c7cec5da 100644
--- a/libs/components/src/stories/kitchen-sink/kitchen-sink-shared.module.ts
+++ b/libs/components/src/stories/kitchen-sink/kitchen-sink-shared.module.ts
@@ -13,7 +13,6 @@ import { CalloutModule } from "../../callout";
 import { CheckboxModule } from "../../checkbox";
 import { ColorPasswordModule } from "../../color-password";
 import { DialogModule } from "../../dialog";
-import { DrawerModule } from "../../drawer";
 import { FormControlModule } from "../../form-control";
 import { FormFieldModule } from "../../form-field";
 import { IconButtonModule } from "../../icon-button";
@@ -49,7 +48,6 @@ import { TypographyModule } from "../../typography";
     ColorPasswordModule,
     CommonModule,
     DialogModule,
-    DrawerModule,
     FormControlModule,
     FormFieldModule,
     FormsModule,
@@ -87,7 +85,6 @@ import { TypographyModule } from "../../typography";
     ColorPasswordModule,
     CommonModule,
     DialogModule,
-    DrawerModule,
     FormControlModule,
     FormFieldModule,
     FormsModule,