@opengovsg/oui 0.0.0-snapshot-20250326085831 → 0.0.0-snapshot-20250401072718

package/dist/esm/combo-box/combo-box.js

@@ -3,9 +3,10 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useMemo, useCallback } from 'react';
 import { useMessageFormatter } from 'react-aria';
-import { ListLayout, Provider, ComboBox as ComboBox$1, Input, Button, Popover, Virtualizer, ListBox } from 'react-aria-components';
-import { comboBoxItemStyles, cn, comboBoxStyles, composeTailwindRenderProps, composeRenderProps, comboBoxClearButtonStyles } from '@opengovsg/oui-theme';
+import { ListLayout, Provider, ComboBox as ComboBox$1, Input, Button, Virtualizer, ListBox } from 'react-aria-components';
+import { listBoxItemStyles, cn, comboBoxStyles, composeTailwindRenderProps, composeRenderProps, comboBoxClearButtonStyles } from '@opengovsg/oui-theme';
 import { Label, FieldGroup, Description, FieldError } from '../field/field.js';
+import { Popover } from '../popover/popover.js';
 import { mapPropsVariants } from '../system/utils.js';
 import { ComboBoxVariantContext } from './combo-box-variant-context.js';
 import ChevronUp from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/chevron-up.js';
@@ -44,7 +45,7 @@ function ComboBoxEmptyState({
   size,
   className
 }) {
-  const styles = comboBoxItemStyles({ size });
+  const styles = listBoxItemStyles({ size });
   const formatMessage = useMessageFormatter(i18nStrings);
   return /* @__PURE__ */ jsx(
     "span",

package/dist/esm/index.js

@@ -1,5 +1,6 @@
 "use strict";
 export { useControllableState } from './hooks/use-controllable-state.js';
+export { Button } from './button/button.js';
 export { GovtBanner } from './govt-banner/govt-banner.js';
 export { Ripple } from './ripple/ripple.js';
 export { useRipple } from './ripple/use-ripple.js';
@@ -16,16 +17,17 @@ export { ComboBox, ComboBoxEmptyState } from './combo-box/combo-box.js';
 export { ComboBoxFuzzy } from './combo-box/combo-box-fuzzy.js';
 export { ComboBoxItem } from './combo-box/combo-box-item.js';
 export { ComboBoxVariantContext, useComboBoxVariantContext } from './combo-box/combo-box-variant-context.js';
+export { Banner } from './banner/banner.js';
 export { TagField } from './tag-field/tag-field.js';
 export { TagFieldItem } from './tag-field/tag-field-item.js';
 export { Select } from './select/select.js';
 export { SelectItem } from './select/select-item.js';
 export { SelectVariantContext, useSelectVariantContext } from './select/select-variant-context.js';
-export { RangeCalendar, RangeCalendarCell, RangeCalendarStateWrapper } from './range-calendar/range-calendar.js';
-export { Button } from './button/button.js';
-export { Banner } from './banner/banner.js';
 export { Badge } from './badge/badge.js';
-export { CalendarDate } from '@internationalized/date';
 export { Calendar, CalendarStateWrapper } from './calendar/calendar.js';
 export { CalendarStyleContext, useCalendarStyleContext } from './calendar/calendar-style-context.js';
 export { getEraFormat, useGenerateLocalizedMonths, useGenerateLocalizedYears, useLocalizedMonthYear } from './calendar/utils.js';
+export { CalendarDate } from '@internationalized/date';
+export { RangeCalendar, RangeCalendarCell, RangeCalendarStateWrapper } from './range-calendar/range-calendar.js';
+export { Menu, MenuItem, MenuSection, MenuSeparator, MenuTrigger, MenuVariantContext, SubmenuTrigger, useMenuVariantContext } from './menu/menu.js';
+export { Popover } from './popover/popover.js';

package/dist/esm/menu/index.js

@@ -0,0 +1,2 @@
+"use strict";
+export { Menu, MenuItem, MenuSection, MenuSeparator, MenuTrigger, MenuVariantContext, SubmenuTrigger, useMenuVariantContext } from './menu.js';

package/dist/esm/menu/menu.js

@@ -0,0 +1,220 @@
+"use strict";
+"use client";
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { forwardRef, useMemo, useCallback } from 'react';
+import { useContextProps, MenuItem as MenuItem$1, composeRenderProps, Provider, Menu as Menu$1, MenuSection as MenuSection$1, Header, Collection, MenuTrigger as MenuTrigger$1, SubmenuTrigger as SubmenuTrigger$1, Separator } from 'react-aria-components';
+import { listBoxItemStyles, menuItemStyles, menuStyles, menuSectionStyles, menuDividerStyles } from '@opengovsg/oui-theme';
+import { Popover } from '../popover/popover.js';
+import { forwardRefGeneric, mapPropsVariants } from '../system/utils.js';
+import Check from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/check.js';
+import ChevronRight from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/chevron-right.js';
+import { createContext } from '../system/react-utils/context.js';
+
+const [MenuVariantContext, useMenuVariantContext] = createContext({
+  name: "MenuVariantContext",
+  strict: false
+});
+function MenuInner(originalProps, ref) {
+  [originalProps, ref] = useContextProps(
+    originalProps,
+    ref,
+    MenuVariantContext
+  );
+  const [props, variantProps] = mapPropsVariants(
+    originalProps,
+    menuStyles.variantKeys
+  );
+  const { className, classNames, placement, ...rest } = props;
+  const styles = menuStyles(variantProps);
+  return /* @__PURE__ */ jsx(Provider, { values: [[MenuVariantContext, variantProps]], children: /* @__PURE__ */ jsx(
+    Popover,
+    {
+      placement,
+      className: styles.popover({ className: classNames?.popover }),
+      children: /* @__PURE__ */ jsx(
+        Menu$1,
+        {
+          ...rest,
+          ref,
+          className: composeRenderProps(
+            className ?? classNames?.base,
+            (className2, renderProps) => styles.base({
+              className: className2,
+              ...renderProps
+            })
+          )
+        }
+      )
+    }
+  ) });
+}
+const Menu = forwardRefGeneric(MenuInner);
+const MenuItem = forwardRef(function MenuItem2(originalProps, ref) {
+  [originalProps, ref] = useContextProps(
+    originalProps,
+    ref,
+    MenuVariantContext
+  );
+  const [
+    {
+      classNames,
+      className,
+      multipleSelectionIcon: multipleSelectionIconProp,
+      singleSelectionIcon: singleSelectionIconProp,
+      startContent,
+      endContent,
+      ...props
+    },
+    variantProps
+  ] = mapPropsVariants(originalProps, listBoxItemStyles.variantKeys);
+  const styles = menuItemStyles(variantProps);
+  const multipleSelectionIcon = useMemo(() => {
+    if (multipleSelectionIconProp !== void 0) {
+      return multipleSelectionIconProp;
+    }
+    return /* @__PURE__ */ jsx(
+      Check,
+      {
+        "aria-hidden": true,
+        className: styles.icon({ className: classNames?.icon })
+      }
+    );
+  }, [classNames?.icon, multipleSelectionIconProp, styles]);
+  const singleSelectionIcon = useMemo(() => {
+    if (singleSelectionIconProp !== void 0) {
+      return singleSelectionIconProp;
+    }
+    return /* @__PURE__ */ jsx(
+      Check,
+      {
+        "aria-hidden": true,
+        className: styles.icon({ className: classNames?.icon })
+      }
+    );
+  }, [classNames?.icon, singleSelectionIconProp, styles]);
+  const showIconContainer = useCallback(
+    (selectionMode) => {
+      switch (selectionMode) {
+        case "none":
+          return false;
+        case "multiple":
+          return !!multipleSelectionIcon;
+        case "single":
+          return !!singleSelectionIcon;
+      }
+    },
+    [multipleSelectionIcon, singleSelectionIcon]
+  );
+  const defaultTextValue = useMemo(() => {
+    if (props.textValue) {
+      return props.textValue;
+    }
+    if (typeof props.children === "string") {
+      return props.children;
+    }
+    return void 0;
+  }, [props.children, props.textValue]);
+  return /* @__PURE__ */ jsx(
+    MenuItem$1,
+    {
+      ref,
+      textValue: defaultTextValue,
+      ...props,
+      isDisabled: variantProps.isDisabled,
+      className: composeRenderProps(
+        className ?? classNames?.container,
+        (className2, renderProps) => styles.container({
+          className: className2,
+          ...renderProps
+        })
+      ),
+      children: composeRenderProps(
+        props.children,
+        (children, { selectionMode, isSelected, hasSubmenu }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+          startContent,
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: styles.label({
+                className: classNames?.label
+              }),
+              children
+            }
+          ),
+          showIconContainer(selectionMode) && /* @__PURE__ */ jsxs(
+            "span",
+            {
+              className: styles.iconContainer({
+                className: classNames?.iconContainer
+              }),
+              children: [
+                isSelected && selectionMode === "multiple" && multipleSelectionIcon,
+                isSelected && selectionMode === "single" && singleSelectionIcon
+              ]
+            }
+          ),
+          endContent,
+          hasSubmenu && /* @__PURE__ */ jsx(
+            ChevronRight,
+            {
+              "aria-hidden": true,
+              className: styles.icon({
+                className: classNames?.icon
+              })
+            }
+          )
+        ] })
+      )
+    }
+  );
+});
+function MenuSeparator(props) {
+  return /* @__PURE__ */ jsx(
+    Separator,
+    {
+      ...props,
+      className: menuDividerStyles({
+        className: props.className
+      })
+    }
+  );
+}
+function MenuSectionInner(originalProps, ref) {
+  [originalProps, ref] = useContextProps(
+    originalProps,
+    ref,
+    MenuVariantContext
+  );
+  const [{ title, classNames, ...props }, variantProps] = mapPropsVariants(
+    originalProps,
+    menuSectionStyles.variantKeys
+  );
+  const styles = menuSectionStyles(variantProps);
+  return /* @__PURE__ */ jsxs(
+    MenuSection$1,
+    {
+      ref,
+      className: styles.base({
+        className: props.className ?? classNames?.base
+      }),
+      ...props,
+      children: [
+        title && /* @__PURE__ */ jsx(
+          Header,
+          {
+            className: styles.header({
+              className: classNames?.header
+            }),
+            children: title
+          }
+        ),
+        /* @__PURE__ */ jsx(Collection, { items: props.items, children: props.children })
+      ]
+    }
+  );
+}
+const MenuSection = forwardRefGeneric(MenuSectionInner);
+const MenuTrigger = MenuTrigger$1;
+const SubmenuTrigger = SubmenuTrigger$1;
+
+export { Menu, MenuItem, MenuSection, MenuSeparator, MenuTrigger, MenuVariantContext, SubmenuTrigger, useMenuVariantContext };

package/dist/esm/node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/check.js

@@ -0,0 +1,14 @@
+import createLucideIcon from '../createLucideIcon.js';
+
+/**
+ * @license lucide-react v0.475.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
+const Check = createLucideIcon("Check", __iconNode);
+
+export { __iconNode, Check as default };

package/dist/esm/popover/index.js

@@ -0,0 +1,2 @@
+"use strict";
+export { Popover } from './popover.js';

package/dist/esm/popover/popover.js

@@ -0,0 +1,44 @@
+"use strict";
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useSlottedContext, PopoverContext, Popover as Popover$1, composeRenderProps, OverlayArrow } from 'react-aria-components';
+import { popoverArrowStyles, popoverStyles } from '@opengovsg/oui-theme';
+
+const Popover = ({
+  children,
+  showArrow,
+  className,
+  classNames,
+  ...props
+}) => {
+  const popoverContext = useSlottedContext(PopoverContext);
+  const isSubmenu = popoverContext?.trigger === "SubmenuTrigger";
+  let offset = showArrow ? 12 : 8;
+  offset = isSubmenu ? offset - 6 : offset;
+  return /* @__PURE__ */ jsxs(
+    Popover$1,
+    {
+      offset,
+      ...props,
+      className: composeRenderProps(
+        className ?? classNames?.base,
+        (className2, renderProps) => popoverStyles({ ...renderProps, className: className2 })
+      ),
+      children: [
+        showArrow && /* @__PURE__ */ jsx(OverlayArrow, { className: "group", children: /* @__PURE__ */ jsx(
+          "svg",
+          {
+            width: 12,
+            height: 12,
+            viewBox: "0 0 12 12",
+            className: popoverArrowStyles({ className: classNames?.arrow }),
+            children: /* @__PURE__ */ jsx("path", { d: "M0 0 L6 6 L12 0" })
+          }
+        ) }),
+        children
+      ]
+    }
+  );
+};
+
+export { Popover };

package/dist/esm/range-calendar/range-calendar.js

@@ -6,12 +6,12 @@ import { CalendarDate, today, getLocalTimeZone, getDayOfWeek } from '@internatio
 import { RangeCalendar as RangeCalendar$1, Provider, CalendarGrid, CalendarGridBody, Text, RangeCalendarStateContext, useLocale, CalendarCell } from 'react-aria-components';
 import { useDeepCompareMemo } from 'use-deep-compare';
 import { calendarStyles, composeRenderProps, cn, dataAttr } from '@opengovsg/oui-theme';
+import { CalendarStyleContext, useCalendarStyleContext } from '../calendar/calendar-style-context.js';
 import { AgnosticCalendarStateContext } from '../calendar/agnostic-calendar-state-context.js';
 import { CalendarBottomContent } from '../calendar/calendar-bottom-content.js';
 import { CalendarGridHeader } from '../calendar/calendar-grid-header.js';
 import { CalendarHeader } from '../calendar/calendar-header.js';
 import { mapPropsVariants } from '../system/utils.js';
-import { CalendarStyleContext, useCalendarStyleContext } from '../calendar/calendar-style-context.js';
 
 const RangeCalendar = forwardRef(function RangeCalendar2(originalProps, ref) {
   const [props, variantProps] = mapPropsVariants(

package/dist/esm/select/select.js

@@ -2,13 +2,14 @@
 "use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useMemo } from 'react';
-import { Provider, Select as Select$1, SelectValue, Popover, Virtualizer, ListLayout, ListBox } from 'react-aria-components';
+import { Provider, Select as Select$1, SelectValue, Virtualizer, ListLayout, ListBox } from 'react-aria-components';
 import { selectStyles, composeRenderProps } from '@opengovsg/oui-theme';
-import { Label, Description } from '../field/field.js';
+import { Button } from '../button/button.js';
+import { Label, Description, FieldError } from '../field/field.js';
+import { Popover } from '../popover/popover.js';
 import { mapPropsVariants } from '../system/utils.js';
 import { SelectVariantContext } from './select-variant-context.js';
 import ChevronDown from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/chevron-down.js';
-import { Button } from '../button/button.js';
 
 const calculateEstimatedRowHeight = (size) => {
   switch (size) {
@@ -24,6 +25,7 @@ function Select({
   label,
   description,
   classNames,
+  errorMessage,
   ...originalProps
 }) {
   const [_props, variantProps] = mapPropsVariants(
@@ -88,6 +90,7 @@ function Select({
             children: description
           }
         ),
+        /* @__PURE__ */ jsx(FieldError, { size: variantProps.size, className: classNames?.error, children: errorMessage }),
         /* @__PURE__ */ jsx(Popover, { className: styles.popover({ className: classNames?.popover }), children: /* @__PURE__ */ jsx(Virtualizer, { layout: ListLayout, layoutOptions, children: /* @__PURE__ */ jsx(
           ListBox,
           {

package/dist/esm/system/react-utils/context.js

@@ -5,9 +5,10 @@ function createContext(options = {}) {
   const {
     strict = true,
     errorMessage = "useContext: `context` is undefined. Seems you forgot to wrap component within the Provider",
-    name
+    name,
+    defaultValue
   } = options;
-  const Context = createContext$1(void 0);
+  const Context = createContext$1(defaultValue);
   Context.displayName = name;
   function useContext$1() {
     const context = useContext(Context);

package/dist/esm/tag-field/tag-field-item.js

@@ -2,21 +2,26 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { useContext } from 'react';
-import { tagFieldItemStyles, dataAttr } from '@opengovsg/oui-theme';
+import { listBoxItemStyles, dataAttr } from '@opengovsg/oui-theme';
 import { forwardRefGeneric } from '../system/utils.js';
 import { TagFieldStateContext } from './tag-field-state-context.js';
 
 const TagFieldItemInner = ({ item, isHighlighted, classNames, ...itemProps }, ref) => {
   const { itemToText, size } = useContext(TagFieldStateContext);
-  const styles = tagFieldItemStyles({ size });
+  const styles = listBoxItemStyles({ size });
   return /* @__PURE__ */ jsx(
     "li",
     {
       ref,
       ...itemProps,
-      className: styles.container({ className: classNames?.container }),
+      className: styles.container({
+        className: classNames?.container,
+        isFocused: isHighlighted,
+        isDisabled: itemProps["aria-disabled"]
+      }),
       "data-rac": true,
-      "data-hovered": dataAttr(isHighlighted),
+      "data-focused": dataAttr(isHighlighted),
+      "data-disabled": dataAttr(itemProps["aria-disabled"]),
       children: /* @__PURE__ */ jsx("span", { className: styles.label({ className: classNames?.label }), children: itemToText(item) })
     }
   );

package/dist/esm/tag-field/tag-field.js

@@ -2,10 +2,11 @@
 "use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { createElement } from 'react';
-import { composeRenderProps, Popover } from 'react-aria-components';
+import { composeRenderProps } from 'react-aria-components';
 import { tagFieldStyles } from '@opengovsg/oui-theme';
 import { Label, FieldGroup, Description, FieldError } from '../field/field.js';
 import { Input } from '../input/input.js';
+import { Popover } from '../popover/popover.js';
 import { TagFieldItem } from './tag-field-item.js';
 import { TagFieldList } from './tag-field-list.js';
 import { TagFieldRoot } from './tag-field-root.js';
@@ -91,7 +92,7 @@ function TagField({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx(Popover, { children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Popover, { className: styles.popover({ className: classNames?.popover }), children: /* @__PURE__ */ jsx(
       TagFieldList,
       {
         className: styles.list({ className: classNames?.list }),

package/dist/types/combo-box/combo-box-fuzzy.d.ts

@@ -1,6 +1,6 @@
 import type { Key } from "react-aria";
 import type { SetRequired } from "type-fest";
-import type { ComboBoxItemSlots, SlotsToClasses } from "@opengovsg/oui-theme";
+import type { ListBoxItemSlots, SlotsToClasses } from "@opengovsg/oui-theme";
 import type { ComboBoxProps } from "./combo-box";
 import { ComboBoxItem } from "./combo-box-item";
 type ComboBoxItem = {
@@ -9,7 +9,7 @@ type ComboBoxItem = {
     description?: string;
 };
 export interface ComboBoxFuzzyProps<T extends ComboBoxItem = ComboBoxItem> extends SetRequired<ComboBoxProps<T>, "inputValue" | "onInputChange" | "onSelectionChange" | "selectedKey" | "items"> {
-    itemClassNames?: SlotsToClasses<ComboBoxItemSlots> & SlotsToClasses<"highlight">;
+    itemClassNames?: SlotsToClasses<ListBoxItemSlots> & SlotsToClasses<"highlight">;
 }
 /**
  * Controlled variant of ComboBox, allows for fuzzy search and item highlight.

package/dist/types/combo-box/combo-box-fuzzy.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"combo-box-fuzzy.d.ts","sourceRoot":"","sources":["../../../src/combo-box/combo-box-fuzzy.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAK5C,OAAO,KAAK,EAEV,iBAAiB,EACjB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAO7B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAGhD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAQ/C,KAAK,YAAY,GAAG;IAClB,EAAE,EAAE,GAAG,CAAA;IACP,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;AAwBD,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,YAAY,GAAG,YAAY,CACvE,SAAQ,WAAW,CACjB,aAAa,CAAC,CAAC,CAAC,EACd,YAAY,GACZ,eAAe,GACf,mBAAmB,GACnB,aAAa,GACb,OAAO,CACV;IACD,cAAc,CAAC,EAAE,cAAc,CAAC,iBAAiB,CAAC,GAChD,cAAc,CAAC,WAAW,CAAC,CAAA;CAC9B;AAED;;;GAGG;AACH,wBAAgB,aAAa,CAAC,CAAC,SAAS,YAAY,GAAG,YAAY,EACjE,aAAa,EAAE,kBAAkB,CAAC,CAAC,CAAC,2CAwGrC"}
+{"version":3,"file":"combo-box-fuzzy.d.ts","sourceRoot":"","sources":["../../../src/combo-box/combo-box-fuzzy.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAK5C,OAAO,KAAK,EAEV,gBAAgB,EAChB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAO7B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAGhD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAQ/C,KAAK,YAAY,GAAG;IAClB,EAAE,EAAE,GAAG,CAAA;IACP,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;AAwBD,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,YAAY,GAAG,YAAY,CACvE,SAAQ,WAAW,CACjB,aAAa,CAAC,CAAC,CAAC,EACd,YAAY,GACZ,eAAe,GACf,mBAAmB,GACnB,aAAa,GACb,OAAO,CACV;IACD,cAAc,CAAC,EAAE,cAAc,CAAC,gBAAgB,CAAC,GAC/C,cAAc,CAAC,WAAW,CAAC,CAAA;CAC9B;AAED;;;GAGG;AACH,wBAAgB,aAAa,CAAC,CAAC,SAAS,YAAY,GAAG,YAAY,EACjE,aAAa,EAAE,kBAAkB,CAAC,CAAC,CAAC,2CAwGrC"}

package/dist/types/combo-box/combo-box-item.d.ts

@@ -1,11 +1,11 @@
 import type { ListBoxItemProps } from "react-aria-components";
-import type { ComboBoxItemSlots, ComboBoxItemVariantProps, SlotsToClasses } from "@opengovsg/oui-theme";
-export interface ComboBoxItemProps extends ListBoxItemProps, ComboBoxItemVariantProps {
+import type { ListBoxItemSlots, ListBoxItemVariantProps, SlotsToClasses } from "@opengovsg/oui-theme";
+export interface ComboBoxItemProps extends ListBoxItemProps, ListBoxItemVariantProps {
     /**
      * Description for the item, if any
      */
     description?: React.ReactNode;
-    classNames?: SlotsToClasses<ComboBoxItemSlots>;
+    classNames?: SlotsToClasses<ListBoxItemSlots>;
 }
 export declare const ComboBoxItem: import("../system/utils").InternalForwardRefRenderFunction<import("../system/types").As, ComboBoxItemProps, never>;
 //# sourceMappingURL=combo-box-item.d.ts.map

package/dist/types/combo-box/combo-box-item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"combo-box-item.d.ts","sourceRoot":"","sources":["../../../src/combo-box/combo-box-item.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AAS7D,OAAO,KAAK,EACV,iBAAiB,EACjB,wBAAwB,EACxB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAM7B,MAAM,WAAW,iBACf,SAAQ,gBAAgB,EACtB,wBAAwB;IAC1B;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,UAAU,CAAC,EAAE,cAAc,CAAC,iBAAiB,CAAC,CAAA;CAC/C;AAED,eAAO,MAAM,YAAY,oHAgEvB,CAAA"}
+{"version":3,"file":"combo-box-item.d.ts","sourceRoot":"","sources":["../../../src/combo-box/combo-box-item.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AAS7D,OAAO,KAAK,EACV,gBAAgB,EAChB,uBAAuB,EACvB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAM7B,MAAM,WAAW,iBACf,SAAQ,gBAAgB,EACtB,uBAAuB;IACzB;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,UAAU,CAAC,EAAE,cAAc,CAAC,gBAAgB,CAAC,CAAA;CAC9C;AAED,eAAO,MAAM,YAAY,oHAgEvB,CAAA"}

package/dist/types/combo-box/combo-box.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"combo-box.d.ts","sourceRoot":"","sources":["../../../src/combo-box/combo-box.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,aAAa,IAAI,iBAAiB,EAClC,YAAY,EAEZ,iBAAiB,EACjB,gBAAgB,EACjB,MAAM,uBAAuB,CAAA;AAe9B,OAAO,KAAK,EACV,aAAa,EACb,oBAAoB,EACpB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAc7B,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,CAC7C,SAAQ,oBAAoB,EAC1B,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iDAAiD;IACjD,YAAY,CAAC,EAAE,CAAC,EAAE,CAAA;IAClB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,CAAC,EAAE,CAAA;IACX,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,YAAY,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,UAAU,EAAE,gBAAgB,KAAK,MAAM,CAAC,CAAA;IAClE,UAAU,CAAC,EAAE,cAAc,CAAC,aAAa,CAAC,GACxC,cAAc,CAAC,aAAa,GAAG,YAAY,CAAC,CAAA;IAC9C;;OAEG;IACH,iBAAiB,CAAC,EAAE,iBAAiB,CAAA;IAErC,mFAAmF;IACnF,YAAY,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,CAAA;IAE9C;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IAEpB,gBAAgB,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAA;IAEtD,QAAQ,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAA;CACvC;AAkCD,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,SAAS,GACV,EAAE,IAAI,CAAC,oBAAoB,EAAE,MAAM,CAAC,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,2CAY7D;AAED,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EAAE,aAAa,EAAE,aAAa,CAAC,CAAC,CAAC,2CA6JzE"}
+{"version":3,"file":"combo-box.d.ts","sourceRoot":"","sources":["../../../src/combo-box/combo-box.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,aAAa,IAAI,iBAAiB,EAClC,YAAY,EAEZ,iBAAiB,EACjB,gBAAgB,EACjB,MAAM,uBAAuB,CAAA;AAc9B,OAAO,KAAK,EACV,aAAa,EACb,oBAAoB,EACpB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAe7B,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,CAC7C,SAAQ,oBAAoB,EAC1B,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iDAAiD;IACjD,YAAY,CAAC,EAAE,CAAC,EAAE,CAAA;IAClB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,CAAC,EAAE,CAAA;IACX,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,YAAY,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,UAAU,EAAE,gBAAgB,KAAK,MAAM,CAAC,CAAA;IAClE,UAAU,CAAC,EAAE,cAAc,CAAC,aAAa,CAAC,GACxC,cAAc,CAAC,aAAa,GAAG,YAAY,CAAC,CAAA;IAC9C;;OAEG;IACH,iBAAiB,CAAC,EAAE,iBAAiB,CAAA;IAErC,mFAAmF;IACnF,YAAY,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,CAAA;IAE9C;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IAEpB,gBAAgB,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAA;IAEtD,QAAQ,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAA;CACvC;AAkCD,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,SAAS,GACV,EAAE,IAAI,CAAC,oBAAoB,EAAE,MAAM,CAAC,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,2CAY7D;AAED,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EAAE,aAAa,EAAE,aAAa,CAAC,CAAC,CAAC,2CA6JzE"}

package/dist/types/index.d.mts

@@ -17,4 +17,6 @@ export * from "./select";
 export * from "./badge";
 export * from "./calendar";
 export * from "./range-calendar";
+export * from "./menu";
+export * from "./popover";
 //# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts

@@ -17,4 +17,6 @@ export * from "./select";
 export * from "./badge";
 export * from "./calendar";
 export * from "./range-calendar";
+export * from "./menu";
+export * from "./popover";
 //# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,eAAe,CAAA;AAC7B,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,UAAU,CAAA;AACxB,cAAc,iBAAiB,CAAA;AAC/B,cAAc,SAAS,CAAA;AACvB,cAAc,cAAc,CAAA;AAC5B,cAAc,SAAS,CAAA;AACvB,cAAc,aAAa,CAAA;AAC3B,cAAc,mBAAmB,CAAA;AACjC,cAAc,aAAa,CAAA;AAC3B,cAAc,UAAU,CAAA;AACxB,cAAc,aAAa,CAAA;AAC3B,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AACvB,cAAc,YAAY,CAAA;AAC1B,cAAc,kBAAkB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,eAAe,CAAA;AAC7B,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,UAAU,CAAA;AACxB,cAAc,iBAAiB,CAAA;AAC/B,cAAc,SAAS,CAAA;AACvB,cAAc,cAAc,CAAA;AAC5B,cAAc,SAAS,CAAA;AACvB,cAAc,aAAa,CAAA;AAC3B,cAAc,mBAAmB,CAAA;AACjC,cAAc,aAAa,CAAA;AAC3B,cAAc,UAAU,CAAA;AACxB,cAAc,aAAa,CAAA;AAC3B,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AACvB,cAAc,YAAY,CAAA;AAC1B,cAAc,kBAAkB,CAAA;AAChC,cAAc,QAAQ,CAAA;AACtB,cAAc,WAAW,CAAA"}

package/dist/types/menu/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./menu";
+//# sourceMappingURL=index.d.ts.map

package/dist/types/menu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/menu/index.tsx"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAA"}

package/dist/types/menu/menu.d.ts

@@ -0,0 +1,38 @@
+import type { MenuItemProps as AriaMenuItemProps, MenuProps as AriaMenuProps, MenuSectionProps as AriaMenuSectionProps, ContextValue, SeparatorProps } from "react-aria-components";
+import { MenuTrigger as AriaMenuTrigger } from "react-aria-components";
+import type { ListBoxItemVariantProps, MenuItemVariantSlots, MenuSectionVariantProps, MenuSectionVariantSlots, MenuVariantProps, MenuVariantSlots, SlotsToClasses } from "@opengovsg/oui-theme";
+import type { PopoverProps } from "../popover";
+export declare const MenuVariantContext: import("react").Context<ContextValue<MenuVariantProps, any>>, useMenuVariantContext: () => ContextValue<MenuVariantProps, any>;
+export interface MenuProps<T> extends AriaMenuProps<T>, MenuVariantProps {
+    placement?: PopoverProps["placement"];
+    classNames?: SlotsToClasses<MenuVariantSlots>;
+}
+export declare const Menu: <T extends object>(props: MenuProps<T> & import("react").RefAttributes<HTMLDivElement>) => React.ReactNode;
+export interface MenuItemProps extends AriaMenuItemProps, ListBoxItemVariantProps {
+    classNames?: SlotsToClasses<MenuItemVariantSlots>;
+    multipleSelectionIcon?: React.ReactNode | null;
+    singleSelectionIcon?: React.ReactNode | null;
+    /**
+     * Element to be rendered in the left side of the menu item.
+     */
+    startContent?: React.ReactNode;
+    /**
+     * Element to be rendered in the right side of the menu item.
+     */
+    endContent?: React.ReactNode;
+}
+export declare const MenuItem: import("react").ForwardRefExoticComponent<MenuItemProps & import("react").RefAttributes<object>>;
+export declare function MenuSeparator(props: SeparatorProps): import("react/jsx-runtime").JSX.Element;
+export interface MenuSectionProps<T> extends AriaMenuSectionProps<T>, MenuSectionVariantProps {
+    /**
+     * The title of the section.\
+     * If not provided, the `aria-label` prop must be provided for accessibility.
+     */
+    title?: string;
+    items?: T[];
+    classNames?: SlotsToClasses<MenuSectionVariantSlots>;
+}
+export declare const MenuSection: <T extends object>(props: MenuSectionProps<T> & import("react").RefAttributes<HTMLElement>) => React.ReactNode;
+export declare const MenuTrigger: typeof AriaMenuTrigger;
+export declare const SubmenuTrigger: (props: import("react-aria-components").SubmenuTriggerProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement | null;
+//# sourceMappingURL=menu.d.ts.map

package/dist/types/menu/menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/menu/menu.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,aAAa,IAAI,iBAAiB,EAClC,SAAS,IAAI,aAAa,EAC1B,gBAAgB,IAAI,oBAAoB,EACxC,YAAY,EAEZ,cAAc,EACf,MAAM,uBAAuB,CAAA;AAG9B,OAAO,EAIL,WAAW,IAAI,eAAe,EAQ/B,MAAM,uBAAuB,CAAA;AAE9B,OAAO,KAAK,EACV,uBAAuB,EACvB,oBAAoB,EACpB,uBAAuB,EACvB,uBAAuB,EACvB,gBAAgB,EAChB,gBAAgB,EAChB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAS7B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAK9C,eAAO,MAAO,kBAAkB,gEAAE,qBAAqB,2CAMrD,CAAA;AACF,MAAM,WAAW,SAAS,CAAC,CAAC,CAAE,SAAQ,aAAa,CAAC,CAAC,CAAC,EAAE,gBAAgB;IACtE,SAAS,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAA;IACrC,UAAU,CAAC,EAAE,cAAc,CAAC,gBAAgB,CAAC,CAAA;CAC9C;AA4CD,eAAO,MAAM,IAAI,GA1CE,CAAC,SAAS,MAAM,0EAgBhC,MAAO,SA0BsC,CAAA;AAEhD,MAAM,WAAW,aACf,SAAQ,iBAAiB,EACvB,uBAAuB;IACzB,UAAU,CAAC,EAAE,cAAc,CAAC,oBAAoB,CAAC,CAAA;IACjD,qBAAqB,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,CAAA;IAC9C,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,CAAA;IAE5C;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC7B;AAED,eAAO,MAAM,QAAQ,kGA+HnB,CAAA;AAEF,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,2CASlD;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC,CACjC,SAAQ,oBAAoB,CAAC,CAAC,CAAC,EAC7B,uBAAuB;IACzB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,CAAC,EAAE,CAAA;IACX,UAAU,CAAC,EAAE,cAAc,CAAC,uBAAuB,CAAC,CAAA;CACrD;AAwCD,eAAO,MAAM,WAAW,GAtCE,CAAC,SAAS,MAAM,8EArMvC,MAAO,SA2OoD,CAAA;AAE9D,eAAO,MAAM,WAAW,wBAAkB,CAAA;AAC1C,eAAO,MAAM,cAAc,gEACs0nD,MAAO,aAAa,qBAAoB,MAAO,YAAY,OAD52nD,CAAA"}

package/dist/types/popover/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./popover";
+//# sourceMappingURL=index.d.ts.map

package/dist/types/popover/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/popover/index.tsx"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA"}

package/dist/types/popover/popover.d.ts

@@ -0,0 +1,21 @@
+import type { PopoverProps as AriaPopoverProps } from "react-aria-components";
+import type { SlotsToClasses, VariantProps } from "@opengovsg/oui-theme";
+import { popoverStyles } from "@opengovsg/oui-theme";
+export interface PopoverProps extends Omit<AriaPopoverProps, "children">, VariantProps<typeof popoverStyles> {
+    showArrow?: boolean;
+    children: React.ReactNode;
+    /**
+     * List of classes to change the className of the element.
+     *
+     * @example
+     * ```text
+     * Component: Popover
+     *
+     * Class names:
+     * - base: the popover itself. Will be ignored if `className` is provided.
+     * - arrow: the arrow of the popover.
+     */
+    classNames?: SlotsToClasses<"arrow" | "base">;
+}
+export declare const Popover: ({ children, showArrow, className, classNames, ...props }: PopoverProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=popover.d.ts.map

package/dist/types/popover/popover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../../src/popover/popover.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,IAAI,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AAS7E,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAA;AACxE,OAAO,EAAsB,aAAa,EAAE,MAAM,sBAAsB,CAAA;AAExE,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,gBAAgB,EAAE,UAAU,CAAC,EACxC,YAAY,CAAC,OAAO,aAAa,CAAC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IAEzB;;;;;;;;;;OAUG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,GAAG,MAAM,CAAC,CAAA;CAC9C;AAED,eAAO,MAAM,OAAO,6DAMjB,YAAY,4CA8Bd,CAAA"}

package/dist/types/range-calendar/range-calendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"range-calendar.d.ts","sourceRoot":"","sources":["../../../src/range-calendar/range-calendar.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EACV,kBAAkB,IAAI,sBAAsB,EAC5C,iBAAiB,EACjB,SAAS,EACV,MAAM,uBAAuB,CAAA;AAE9B,OAAO,EACL,YAAY,EAIb,MAAM,yBAAyB,CAAA;AAahC,OAAO,KAAK,EACV,aAAa,EACb,oBAAoB,EACpB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAe7B,UAAU,kBAAkB,CAAC,CAAC,SAAS,YAAY,CACjD,SAAQ,oBAAoB,EAC1B,IAAI,CAAC,iBAAiB,EAAE,cAAc,CAAC,EACvC,sBAAsB,CAAC,CAAC,CAAC;IAC3B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAgCG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC,aAAa,CAAC,CAAA;IAC1C;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAA;IACZ;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAA;IAEZ;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAE/B,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,eAAO,MAAM,aAAa,6HAiHxB,CAAA;AAEF,eAAO,MAAM,yBAAyB,kBAEnC;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,4CAQA,CAAA;AAED,eAAO,MAAM,iBAAiB,GAAI,CAAC,SAAS,YAAY,gEAKrD;IACD,IAAI,EAAE,YAAY,CAAA;IAClB,gBAAgB,EAAE,OAAO,CAAA;IACzB,eAAe,EAAE,SAAS,GAAG,IAAI,CAAA;IACjC,cAAc,CAAC,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAA;CACzD,4CAuDA,CAAA"}
+{"version":3,"file":"range-calendar.d.ts","sourceRoot":"","sources":["../../../src/range-calendar/range-calendar.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,kBAAkB,IAAI,sBAAsB,EAC5C,iBAAiB,EACjB,SAAS,EACV,MAAM,uBAAuB,CAAA;AAE9B,OAAO,EACL,YAAY,EAIb,MAAM,yBAAyB,CAAA;AAahC,OAAO,KAAK,EACV,aAAa,EACb,oBAAoB,EACpB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAe7B,UAAU,kBAAkB,CAAC,CAAC,SAAS,YAAY,CACjD,SAAQ,oBAAoB,EAC1B,IAAI,CAAC,iBAAiB,EAAE,cAAc,CAAC,EACvC,sBAAsB,CAAC,CAAC,CAAC;IAC3B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAgCG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC,aAAa,CAAC,CAAA;IAC1C;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAA;IACZ;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAA;IAEZ;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAE/B,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,eAAO,MAAM,aAAa,6HAiHxB,CAAA;AAEF,eAAO,MAAM,yBAAyB,kBAEnC;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,4CAQA,CAAA;AAED,eAAO,MAAM,iBAAiB,GAAI,CAAC,SAAS,YAAY,gEAKrD;IACD,IAAI,EAAE,YAAY,CAAA;IAClB,gBAAgB,EAAE,OAAO,CAAA;IACzB,eAAe,EAAE,SAAS,GAAG,IAAI,CAAA;IACjC,cAAc,CAAC,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAA;CACzD,4CAuDA,CAAA"}