[PM-2452] Popover Component (#5889)

* setup popover component template and basic story

* add a11y features

* add multiple positions for the popover

* add stories for open right and left

* prevent panel from hugging edges of screen

* fix typo

* add popover arrow depending on position

* add buttons to stories

* add figma preview

* move toward directive approach

* add all positions

* add header input

* add close functionality

* make standalone component

* add a11y import

* add all stories

* add story controls/args

* add module of standalone components

* gracefully handle text wrap and align close button to top for longer headings

* update semantic html

* add story for open state

* use bitIconButton

* adjust styles

* add public close method

* setup walkthrough mode

* add walkthrough mode

* revert to before walkthrough service added

* add triggerRef to stories

* change property name

* add Escape key to close events

* add initially open state

* add docs

* minor reformatting

---------

Co-authored-by: William Martin <contact@willmartian.com>

libs/components/src/popover/popover.component.html

@@ -0,0 +1,26 @@
+<ng-template>
+  <section cdkTrapFocus cdkTrapFocusAutoCapture class="tw-relative" role="dialog" aria-modal="true">
+    <div class="tw-overflow-hidden tw-rounded-md tw-border tw-border-solid tw-border-secondary-300">
+      <div
+        class="tw-relative tw-z-20 tw-w-72 tw-break-words tw-bg-background tw-pb-4 tw-pt-2 tw-text-main"
+      >
+        <div class="tw-mb-1 tw-mr-2 tw-flex tw-items-start tw-justify-between tw-gap-4 tw-pl-4">
+          <h2 class="tw-mb-0 tw-mt-1 tw-text-base tw-font-semibold">
+            {{ title }}
+          </h2>
+          <button
+            type="button"
+            bitIconButton="bwi-close"
+            [attr.title]="'close' | i18n"
+            [attr.aria-label]="'close' | i18n"
+            (click)="closed.emit()"
+          ></button>
+        </div>
+        <div class="tw-px-4">
+          <ng-content></ng-content>
+        </div>
+      </div>
+    </div>
+    <div class="bit-popover-arrow"></div>
+  </section>
+</ng-template>