Merge branch 'main' into uif/cl-349/popover-arrow

libs/components/src/chip-select/chip-select.component.ts

@@ -45,7 +45,6 @@ export type ChipSelectOption<T> = Option<T> & {
       multi: true,
     },
   ],
-  preserveWhitespaces: false,
 })
 export class ChipSelectComponent<T = unknown> implements ControlValueAccessor, AfterViewInit {
   @ViewChild(MenuComponent) menu: MenuComponent;

libs/components/src/color-password/color-password.component.ts

@@ -22,7 +22,6 @@ enum CharacterType {
       }
     </span>
   }`,
-  preserveWhitespaces: false,
   standalone: true,
 })
 export class ColorPasswordComponent {

libs/components/src/navigation/nav-group.component.ts

@@ -29,7 +29,6 @@ import { SideNavService } from "./side-nav.service";
   ],
   standalone: true,
   imports: [CommonModule, NavItemComponent, IconButtonModule, I18nPipe],
-  preserveWhitespaces: false,
 })
 export class NavGroupComponent extends NavBaseComponent implements AfterContentInit {
   @ContentChildren(NavBaseComponent, {

libs/components/src/stories/colors.mdx

@@ -13,7 +13,7 @@ export const Table = (args) => (
   <table class={"border tw-table-auto !tw-text-main " + args.class}>
     <thead>
       <tr>
-        <th>General usage</th>
+        <th class="tw-w-40">General usage</th>
         <th class="tw-w-20"></th>
       </tr>
     </thead>
@@ -119,6 +119,4 @@ Below are all the permited colors. Please consult design before considering addi
 <div class="tw-flex tw-space-x-4">
   <Table />
   <Table class="theme_dark tw-bg-background" />
-  <Table class="theme_nord tw-bg-background" />
-  <Table class="theme_solarize tw-bg-background" />
 </div>

libs/components/src/stories/kitchen-sink/components/kitchen-sink-main.component.ts

@@ -56,12 +56,6 @@ class KitchenSinkDialog {
         isolated stories. The stories for the Kitchen Sink exist to be tested by the Chromatic UI
         tests.
       </p>
-
-      <p bitTypography="body1">
-        NOTE: These stories will treat "Light & Dark" mode as "Light" mode. This is done to avoid a
-        bug with the way that we render the same component twice in the same iframe and how that
-        interacts with the <code>router-outlet</code>.
-      </p>
     </bit-callout>
 
     <bit-tab-group label="Main content tabs" class="tw-text-main">

libs/components/src/stories/kitchen-sink/kitchen-sink.mdx

@@ -9,7 +9,3 @@ import * as stories from "./kitchen-sink.stories";
 The purpose of this story is to compose together all of our components. When snapshot tests run,
 we'll be able to spot-check visual changes in a more app-like environment than just the isolated
 stories. The stories for the Kitchen Sink exist to be tested by the Chromatic UI tests.
-
-NOTE: These stories will treat "Light & Dark" mode as "Light" mode. This is done to avoid a bug with
-the way that we render the same component twice in the same iframe and how that interacts with the
-`router-outlet`.

libs/components/src/toast/toastr.component.ts

@@ -23,7 +23,6 @@ import { ToastComponent } from "./toast.component";
       transition("active => removed", animate("{{ easeTime }}ms {{ easing }}")),
     ]),
   ],
-  preserveWhitespaces: false,
   standalone: true,
   imports: [ToastComponent],
 })

libs/components/src/toggle-group/toggle-group.component.ts

@@ -12,7 +12,6 @@ let nextId = 0;
 @Component({
   selector: "bit-toggle-group",
   templateUrl: "./toggle-group.component.html",
-  preserveWhitespaces: false,
   standalone: true,
 })
 export class ToggleGroupComponent<TValue = unknown> {

libs/components/src/toggle-group/toggle.component.ts

@@ -19,7 +19,6 @@ let nextId = 0;
 @Component({
   selector: "bit-toggle",
   templateUrl: "./toggle.component.html",
-  preserveWhitespaces: false,
   standalone: true,
   imports: [NgClass],
 })