feat(SW-415): Added content from API

components/HotelReservation/SelectRate/RoomSelection/FlexibilityOption/Popover/index.tsx

@@ -0,0 +1,44 @@
+import {
+  Button,
+  Dialog,
+  OverlayArrow,
+  Popover,
+  type PopoverProps,
+} from "react-aria-components"
+
+import { CloseIcon } from "@/components/Icons"
+
+import styles from "./popover.module.css"
+
+interface PricePopoverProps extends Omit<PopoverProps, "children"> {
+  children: React.ReactNode
+}
+
+export default function PricePopover({
+  children,
+  ...props
+}: PricePopoverProps) {
+  return (
+    <Popover {...props}>
+      <OverlayArrow className={styles.arrow}>
+        <svg
+          width="12"
+          height="12"
+          viewBox="0 0 12 12"
+          style={{ display: "block", transform: "rotate(180deg)" }}
+        >
+          <path d="M0 0L6 6L12 0" fill="white" />
+        </svg>
+      </OverlayArrow>
+      <Dialog>
+        <Button
+          onPress={() => props.onOpenChange?.(false)}
+          className={styles.closeButton}
+        >
+          <CloseIcon className={styles.closeIcon} />
+        </Button>
+        {children}
+      </Dialog>
+    </Popover>
+  )
+}

components/HotelReservation/SelectRate/RoomSelection/FlexibilityOption/Popover/popover.module.css

@@ -0,0 +1,12 @@
+.arrow {
+  top: -6px;
+}
+
+.closeButton {
+  position: absolute;
+  top: 5px;
+  right: 5px;
+  background: none;
+  border: none;
+  cursor: pointer;
+}