@opengovsg/oui 0.0.24 → 0.0.25

package/dist/esm/hooks/use-draggable.js

@@ -0,0 +1,86 @@
+"use strict";
+"use client";
+import { useRef, useCallback, useEffect } from 'react';
+import { useMove } from '@react-aria/interactions';
+
+function useDraggable(props) {
+  const { targetRef, isDisabled = false, canOverflow = false } = props;
+  const boundary = useRef({ minLeft: 0, minTop: 0, maxLeft: 0, maxTop: 0 });
+  const isDragging = useRef(false);
+  let transform = { offsetX: 0, offsetY: 0 };
+  const onMoveStart = useCallback(() => {
+    isDragging.current = true;
+    const { offsetX, offsetY } = transform;
+    const targetRect = targetRef?.current?.getBoundingClientRect();
+    const targetLeft = targetRect?.left ?? 0;
+    const targetTop = targetRect?.top ?? 0;
+    const targetWidth = targetRect?.width ?? 0;
+    const targetHeight = targetRect?.height ?? 0;
+    const clientWidth = document.documentElement.clientWidth;
+    const clientHeight = document.documentElement.clientHeight;
+    const minLeft = -targetLeft + offsetX;
+    const minTop = -targetTop + offsetY;
+    const maxLeft = clientWidth - targetLeft - targetWidth + offsetX;
+    const maxTop = clientHeight - targetTop - targetHeight + offsetY;
+    boundary.current = {
+      minLeft,
+      minTop,
+      maxLeft,
+      maxTop
+    };
+  }, [transform, targetRef?.current]);
+  const onMove = useCallback(
+    (e) => {
+      if (isDisabled) {
+        return;
+      }
+      const { offsetX, offsetY } = transform;
+      const { minLeft, minTop, maxLeft, maxTop } = boundary.current;
+      let moveX = offsetX + e.deltaX;
+      let moveY = offsetY + e.deltaY;
+      if (!canOverflow) {
+        moveX = Math.min(Math.max(moveX, minLeft), maxLeft);
+        moveY = Math.min(Math.max(moveY, minTop), maxTop);
+      }
+      transform = {
+        offsetX: moveX,
+        offsetY: moveY
+      };
+      if (targetRef?.current) {
+        targetRef.current.style.transform = `translate(${moveX}px, ${moveY}px)`;
+      }
+    },
+    [isDisabled, transform, boundary.current, canOverflow, targetRef?.current]
+  );
+  const onMoveEnd = useCallback(() => {
+    isDragging.current = false;
+  }, []);
+  const { moveProps } = useMove({
+    onMoveStart,
+    onMove,
+    onMoveEnd
+  });
+  const preventDefault = useCallback((e) => {
+    if (isDragging.current) {
+      e.preventDefault();
+    }
+  }, []);
+  useEffect(() => {
+    if (!isDisabled) {
+      document.body.addEventListener("touchmove", preventDefault, {
+        passive: false
+      });
+    }
+    return () => {
+      document.body.removeEventListener("touchmove", preventDefault);
+    };
+  }, [isDisabled, preventDefault]);
+  return {
+    moveProps: {
+      ...moveProps,
+      style: { cursor: !isDisabled ? "move" : void 0 }
+    }
+  };
+}
+
+export { useDraggable };

package/dist/esm/index.js

@@ -1,5 +1,6 @@
 "use strict";
 export { useControllableState } from './hooks/use-controllable-state.js';
+export { useDraggable } from './hooks/use-draggable.js';
 export { GovtBanner } from './govt-banner/govt-banner.js';
 export { Ripple } from './ripple/ripple.js';
 export { useRipple } from './ripple/use-ripple.js';
@@ -12,15 +13,28 @@ export { TextField } from './text-field/text-field.js';
 export { Description, FieldError, FieldErrorIcon, FieldGroup, Label } from './field/field.js';
 export { TextArea } from './text-area/text-area.js';
 export { TextAreaField } from './text-area-field/text-area-field.js';
+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 { 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 { 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';
 export { Tab, TabList, TabPanel, Tabs, TabsVariantContext, useTabsVariantContext } from './tabs/tabs.js';
+export { DateField, DateInput } from './date-field/date-field.js';
+export { DatePicker } from './date-picker/date-picker.js';
+export { DateRangePicker } from './date-range-picker/date-range-picker.js';
+export { Checkbox, CheckboxGroup } from './checkbox/checkbox.js';
+export { CheckboxGroupStyleContext, useCheckboxGroupStyleContext } from './checkbox/checkbox-group-style-context.js';
 export { Pagination } from './pagination/pagination.js';
 export { PaginationCursor } from './pagination/pagination-cursor.js';
 export { PaginationItem } from './pagination/pagination-item.js';
@@ -30,19 +44,12 @@ export { FileDropzone } from './file-dropzone/file-dropzone.js';
 export { FileInfo } from './file-dropzone/file-info.js';
 export { formatBytes, formatErrorMessage } from './file-dropzone/utils.js';
 export { NumberField } from './number-field/number-field.js';
+export { Modal } from './modal/modal.js';
+export { ModalContent } from './modal/modal-content.js';
+export { ModalFooter } from './modal/modal-footer.js';
+export { ModalBody } from './modal/modal-body.js';
+export { ModalHeader } from './modal/modal-header.js';
+export { ModalVariantContext, useModalVariantContext } from './modal/modal-variant-context.js';
 export { Button } from './button/button.js';
-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 { 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 { DateField, DateInput } from './date-field/date-field.js';
-export { DatePicker } from './date-picker/date-picker.js';
-export { DateRangePicker } from './date-range-picker/date-range-picker.js';
-export { Checkbox, CheckboxGroup } from './checkbox/checkbox.js';
-export { CheckboxGroupStyleContext, useCheckboxGroupStyleContext } from './checkbox/checkbox-group-style-context.js';

package/dist/esm/modal/i18n.js

@@ -0,0 +1,17 @@
+"use strict";
+const i18nStrings = {
+  "en-SG": {
+    dismiss: "Dismiss"
+  },
+  "zh-SG": {
+    dismiss: "\u53D6\u6D88"
+  },
+  "ms-SG": {
+    dismiss: "Tutup"
+  },
+  "ta-SG": {
+    dismiss: "\u0BAE\u0BC2\u0B9F\u0BC1"
+  }
+};
+
+export { i18nStrings };

package/dist/esm/modal/index.js

@@ -0,0 +1,7 @@
+"use strict";
+export { Modal } from './modal.js';
+export { ModalContent } from './modal-content.js';
+export { ModalFooter } from './modal-footer.js';
+export { ModalBody } from './modal-body.js';
+export { ModalHeader } from './modal-header.js';
+export { ModalVariantContext, useModalVariantContext } from './modal-variant-context.js';

package/dist/esm/modal/modal-body.js

@@ -0,0 +1,24 @@
+"use strict";
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { useContext } from 'react';
+import { cn } from '@opengovsg/oui-theme';
+import { forwardRef } from '../system/utils.js';
+import { ModalVariantContext } from './modal-variant-context.js';
+
+const ModalBody = forwardRef(function ModalBody2({ as, ...props }, ref) {
+  const { slots, classNames } = useContext(ModalVariantContext);
+  const Component = as || "div";
+  return /* @__PURE__ */ jsx(
+    Component,
+    {
+      ref,
+      className: slots.body({
+        className: cn(classNames?.body, props.className)
+      }),
+      ...props
+    }
+  );
+});
+
+export { ModalBody };

package/dist/esm/modal/modal-content.js

@@ -0,0 +1,52 @@
+"use strict";
+"use client";
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useContext, isValidElement } from 'react';
+import { useMessageFormatter } from 'react-aria';
+import { Dialog } from 'react-aria-components';
+import { cn } from '@opengovsg/oui-theme';
+import { i18nStrings } from './i18n.js';
+import { ModalVariantContext } from './modal-variant-context.js';
+import X from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/x.js';
+import { Button } from '../button/button.js';
+
+function ModalContent({
+  closeButtonContent: closeButtonContentProp,
+  hideCloseButton,
+  closeButtonProps,
+  ...props
+}) {
+  const { slots, classNames, buttonSize } = useContext(ModalVariantContext);
+  const formatMessage = useMessageFormatter(i18nStrings);
+  const closeButtonContent = isValidElement(closeButtonContentProp) ? closeButtonContentProp : /* @__PURE__ */ jsx(X, {});
+  return /* @__PURE__ */ jsx(
+    Dialog,
+    {
+      ...props,
+      className: slots.dialog({
+        className: props.className ?? classNames?.dialog
+      }),
+      children: ({ close }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        !hideCloseButton && /* @__PURE__ */ jsx(
+          Button,
+          {
+            slot: "close",
+            isIconOnly: true,
+            "aria-label": formatMessage("dismiss"),
+            size: buttonSize,
+            variant: "clear",
+            color: "neutral",
+            ...closeButtonProps,
+            className: slots.closeButton({
+              className: cn(classNames?.closeButton, props.className)
+            }),
+            children: closeButtonContent
+          }
+        ),
+        typeof props.children === "function" ? props.children(close) : props.children
+      ] })
+    }
+  );
+}
+
+export { ModalContent };

package/dist/esm/modal/modal-footer.js

@@ -0,0 +1,25 @@
+"use strict";
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { useContext } from 'react';
+import { cn } from '@opengovsg/oui-theme';
+import { forwardRef } from '../system/utils.js';
+import { ModalVariantContext } from './modal-variant-context.js';
+
+const ModalFooter = forwardRef(function ModalFooter2({ as, ...props }, ref) {
+  const { slots, classNames } = useContext(ModalVariantContext);
+  const Component = as || "footer";
+  return /* @__PURE__ */ jsx(
+    Component,
+    {
+      ref,
+      className: slots.footer({
+        className: cn(classNames?.footer, props.className)
+      }),
+      ...props
+    }
+  );
+});
+ModalFooter.displayName = "ModalFooter";
+
+export { ModalFooter };

package/dist/esm/modal/modal-header.js

@@ -0,0 +1,23 @@
+"use strict";
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { useContext } from 'react';
+import { Heading } from 'react-aria-components';
+import { cn } from '@opengovsg/oui-theme';
+import { ModalVariantContext } from './modal-variant-context.js';
+
+function ModalHeader(props) {
+  const { slots, classNames } = useContext(ModalVariantContext);
+  return /* @__PURE__ */ jsx(
+    Heading,
+    {
+      slot: "title",
+      ...props,
+      className: slots.header({
+        className: cn(classNames?.header, props.className)
+      })
+    }
+  );
+}
+
+export { ModalHeader };

package/dist/esm/modal/modal-variant-context.js

@@ -0,0 +1,10 @@
+"use strict";
+"use client";
+import { createContext } from '../system/react-utils/context.js';
+
+const [ModalVariantContext, useModalVariantContext] = createContext({
+  name: "ModalVariantContext",
+  strict: true
+});
+
+export { ModalVariantContext, useModalVariantContext };

package/dist/esm/modal/modal.js

@@ -0,0 +1,64 @@
+"use strict";
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef, useMemo } from 'react';
+import { Provider, ModalOverlay, Modal as Modal$1 } from 'react-aria-components';
+import { modalStyles, composeRenderProps } from '@opengovsg/oui-theme';
+import { mapPropsVariants } from '../system/utils.js';
+import { ModalVariantContext } from './modal-variant-context.js';
+
+const Modal = forwardRef(function Modal2(originalProps, ref) {
+  const [{ classNames, ...props }, variantProps] = mapPropsVariants(
+    originalProps,
+    modalStyles.variantKeys
+  );
+  const { isDismissable = true } = props;
+  const slots = modalStyles(variantProps);
+  const buttonSize = useMemo(() => {
+    switch (variantProps.size) {
+      case "mobile":
+        return "md";
+      default: {
+        return "lg";
+      }
+    }
+  }, [variantProps.size]);
+  return /* @__PURE__ */ jsx(
+    Provider,
+    {
+      values: [
+        [
+          ModalVariantContext,
+          { ...variantProps, classNames, buttonSize, slots }
+        ]
+      ],
+      children: /* @__PURE__ */ jsx(
+        ModalOverlay,
+        {
+          ...props,
+          isDismissable,
+          className: composeRenderProps(
+            classNames?.overlay,
+            (className, renderProps) => slots.overlay({ className, ...renderProps })
+          ),
+          children: /* @__PURE__ */ jsx(
+            Modal$1,
+            {
+              ...props,
+              ref,
+              isDismissable,
+              "data-placement": variantProps.placement,
+              className: composeRenderProps(
+                props.className ?? classNames?.base,
+                (className, renderProps) => slots.base({ className, ...renderProps })
+              )
+            }
+          )
+        }
+      )
+    }
+  );
+});
+Modal.displayName = "Modal";
+
+export { Modal };

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 { forwardRefGeneric, mapPropsVariants } from '../system/utils.js';
-import { CalendarStyleContext, useCalendarStyleContext } from '../calendar/calendar-style-context.js';
 
 const RangeCalendar = forwardRefGeneric(function RangeCalendar2(originalProps, ref) {
   const [props, variantProps] = mapPropsVariants(

package/dist/types/badge/use-badge.d.ts

@@ -70,48 +70,48 @@ export declare function useBadge(originalProps: UseBadgeProps): {
             };
         }, undefined, "outline-offset-2 outline-none", unknown, unknown, undefined>>>;
         base: ((slotProps?: ({
+            isDisabled?: boolean | undefined;
             size?: "md" | "sm" | "xs" | undefined;
             color?: "sub" | "main" | "neutral" | "critical" | "warning" | "success" | undefined;
-            radius?: "lg" | "md" | "sm" | "none" | "full" | undefined;
+            radius?: "none" | "lg" | "md" | "sm" | "full" | undefined;
             variant?: "solid" | "outline" | "dot" | "subtle" | undefined;
-            isDisabled?: boolean | undefined;
             isCloseable?: boolean | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string) & ((slotProps?: ({
+            isDisabled?: boolean | undefined;
             size?: "md" | "sm" | "xs" | undefined;
             color?: "sub" | "main" | "neutral" | "critical" | "warning" | "success" | undefined;
-            radius?: "lg" | "md" | "sm" | "none" | "full" | undefined;
+            radius?: "none" | "lg" | "md" | "sm" | "full" | undefined;
             variant?: "solid" | "outline" | "dot" | "subtle" | undefined;
-            isDisabled?: boolean | undefined;
             isCloseable?: boolean | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string);
         dot: ((slotProps?: ({
+            isDisabled?: boolean | undefined;
             size?: "md" | "sm" | "xs" | undefined;
             color?: "sub" | "main" | "neutral" | "critical" | "warning" | "success" | undefined;
-            radius?: "lg" | "md" | "sm" | "none" | "full" | undefined;
+            radius?: "none" | "lg" | "md" | "sm" | "full" | undefined;
             variant?: "solid" | "outline" | "dot" | "subtle" | undefined;
-            isDisabled?: boolean | undefined;
             isCloseable?: boolean | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string) & ((slotProps?: ({
+            isDisabled?: boolean | undefined;
             size?: "md" | "sm" | "xs" | undefined;
             color?: "sub" | "main" | "neutral" | "critical" | "warning" | "success" | undefined;
-            radius?: "lg" | "md" | "sm" | "none" | "full" | undefined;
+            radius?: "none" | "lg" | "md" | "sm" | "full" | undefined;
             variant?: "solid" | "outline" | "dot" | "subtle" | undefined;
-            isDisabled?: boolean | undefined;
             isCloseable?: boolean | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string);
         content: ((slotProps?: ({
+            isDisabled?: boolean | undefined;
             size?: "md" | "sm" | "xs" | undefined;
             color?: "sub" | "main" | "neutral" | "critical" | "warning" | "success" | undefined;
-            radius?: "lg" | "md" | "sm" | "none" | "full" | undefined;
+            radius?: "none" | "lg" | "md" | "sm" | "full" | undefined;
             variant?: "solid" | "outline" | "dot" | "subtle" | undefined;
-            isDisabled?: boolean | undefined;
             isCloseable?: boolean | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string) & ((slotProps?: ({
+            isDisabled?: boolean | undefined;
             size?: "md" | "sm" | "xs" | undefined;
             color?: "sub" | "main" | "neutral" | "critical" | "warning" | "success" | undefined;
-            radius?: "lg" | "md" | "sm" | "none" | "full" | undefined;
+            radius?: "none" | "lg" | "md" | "sm" | "full" | undefined;
             variant?: "solid" | "outline" | "dot" | "subtle" | undefined;
-            isDisabled?: boolean | undefined;
             isCloseable?: boolean | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string);
     };

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

@@ -1,2 +1,5 @@
-export * from "./use-controllable-state";
+export { useControllableState } from "./use-controllable-state";
+export { useDraggable } from "./use-draggable";
+export type { UseControllableStateProps } from "./use-controllable-state";
+export type { UseDraggableProps } from "./use-draggable";
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAA;AAC/D,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,YAAY,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAA;AACzE,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA"}

package/dist/types/hooks/use-draggable.d.ts

@@ -0,0 +1,24 @@
+import type { MoveResult } from "@react-aria/interactions";
+export interface UseDraggableProps {
+    /**
+     * Ref to the moving target DOM node.
+     */
+    targetRef?: React.RefObject<HTMLElement | null>;
+    /**
+     * Whether to disable the target is draggable.
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Whether the target can overflow the viewport.
+     * @default false
+     */
+    canOverflow?: boolean;
+}
+/**
+ * A hook to make a target draggable.
+ * @param props UseDraggableProps
+ * @returns MoveResult for the drag DOM node.
+ */
+export declare function useDraggable(props: UseDraggableProps): MoveResult;
+//# sourceMappingURL=use-draggable.d.ts.map

package/dist/types/hooks/use-draggable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-draggable.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-draggable.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAiB,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAIzE,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAC/C;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,UAAU,CAmGjE"}

package/dist/types/index.d.mts

@@ -27,4 +27,5 @@ export * from "./checkbox";
 export * from "./pagination";
 export * from "./file-dropzone";
 export * from "./number-field";
+export * from "./modal";
 //# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts

@@ -27,4 +27,5 @@ export * from "./checkbox";
 export * from "./pagination";
 export * from "./file-dropzone";
 export * from "./number-field";
+export * from "./modal";
 //# 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;AAChC,cAAc,QAAQ,CAAA;AACtB,cAAc,WAAW,CAAA;AACzB,cAAc,QAAQ,CAAA;AACtB,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,qBAAqB,CAAA;AACnC,cAAc,YAAY,CAAA;AAC1B,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,gBAAgB,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;AACzB,cAAc,QAAQ,CAAA;AACtB,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,qBAAqB,CAAA;AACnC,cAAc,YAAY,CAAA;AAC1B,cAAc,cAAc,CAAA;AAC5B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,SAAS,CAAA"}

package/dist/types/modal/i18n.d.ts

@@ -0,0 +1,3 @@
+import type { LocalizedStrings } from "react-aria";
+export declare const i18nStrings: LocalizedStrings;
+//# sourceMappingURL=i18n.d.ts.map

package/dist/types/modal/i18n.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"i18n.d.ts","sourceRoot":"","sources":["../../../src/modal/i18n.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAElD,eAAO,MAAM,WAAW,EAAE,gBAazB,CAAA"}

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

@@ -0,0 +1,12 @@
+export { Modal } from "./modal";
+export { ModalContent } from "./modal-content";
+export { ModalFooter } from "./modal-footer";
+export { ModalBody } from "./modal-body";
+export { ModalHeader } from "./modal-header";
+export type { ModalProps } from "./modal";
+export type { ModalContentProps } from "./modal-content";
+export type { ModalFooterProps } from "./modal-footer";
+export type { ModalBodyProps } from "./modal-body";
+export type { ModalHeaderProps } from "./modal-header";
+export { ModalVariantContext, useModalVariantContext, } from "./modal-variant-context";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/modal/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAE5C,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AACzC,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AACxD,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AACtD,YAAY,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAClD,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAEtD,OAAO,EACL,mBAAmB,EACnB,sBAAsB,GACvB,MAAM,yBAAyB,CAAA"}

package/dist/types/modal/modal-body.d.ts

@@ -0,0 +1,5 @@
+import type { HtmlUiProps } from "../system/types";
+export interface ModalBodyProps extends HtmlUiProps<"div"> {
+}
+export declare const ModalBody: import("../system/utils").InternalForwardRefRenderFunction<import("../system/types").As, ModalBodyProps, never>;
+//# sourceMappingURL=modal-body.d.ts.map

package/dist/types/modal/modal-body.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal-body.d.ts","sourceRoot":"","sources":["../../../src/modal/modal-body.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAKlD,MAAM,WAAW,cAAe,SAAQ,WAAW,CAAC,KAAK,CAAC;CAAG;AAE7D,eAAO,MAAM,SAAS,iHAiBpB,CAAA"}

package/dist/types/modal/modal-content.d.ts

@@ -0,0 +1,10 @@
+import type { DialogProps } from "react-aria-components";
+import type { ButtonProps } from "../button";
+export interface ModalContentProps extends Omit<DialogProps, "children"> {
+    children: React.ReactNode | ((onClose: () => void) => React.ReactNode);
+    closeButtonContent?: React.ReactNode;
+    hideCloseButton?: boolean;
+    closeButtonProps?: Omit<ButtonProps, "className" | "slot">;
+}
+export declare function ModalContent({ closeButtonContent: closeButtonContentProp, hideCloseButton, closeButtonProps, ...props }: ModalContentProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=modal-content.d.ts.map

package/dist/types/modal/modal-content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal-content.d.ts","sourceRoot":"","sources":["../../../src/modal/modal-content.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AAQxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAK5C,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC;IACtE,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,OAAO,EAAE,MAAM,IAAI,KAAK,KAAK,CAAC,SAAS,CAAC,CAAA;IACtE,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACpC,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,gBAAgB,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,WAAW,GAAG,MAAM,CAAC,CAAA;CAC3D;AAED,wBAAgB,YAAY,CAAC,EAC3B,kBAAkB,EAAE,sBAAsB,EAC1C,eAAe,EACf,gBAAgB,EAChB,GAAG,KAAK,EACT,EAAE,iBAAiB,2CA2CnB"}

package/dist/types/modal/modal-footer.d.ts

@@ -0,0 +1,5 @@
+import type { HtmlUiProps } from "../system/types";
+export interface ModalFooterProps extends HtmlUiProps<"footer"> {
+}
+export declare const ModalFooter: import("../system/utils").InternalForwardRefRenderFunction<import("../system/types").As, ModalFooterProps, never>;
+//# sourceMappingURL=modal-footer.d.ts.map

package/dist/types/modal/modal-footer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal-footer.d.ts","sourceRoot":"","sources":["../../../src/modal/modal-footer.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAKlD,MAAM,WAAW,gBAAiB,SAAQ,WAAW,CAAC,QAAQ,CAAC;CAAG;AAElE,eAAO,MAAM,WAAW,mHAgBtB,CAAA"}

package/dist/types/modal/modal-header.d.ts

@@ -0,0 +1,5 @@
+import type { HeadingProps } from "react-aria-components";
+export interface ModalHeaderProps extends HeadingProps {
+}
+export declare function ModalHeader(props: ModalHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=modal-header.d.ts.map

package/dist/types/modal/modal-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal-header.d.ts","sourceRoot":"","sources":["../../../src/modal/modal-header.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AASzD,MAAM,WAAW,gBAAiB,SAAQ,YAAY;CAAG;AAEzD,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAYlD"}

package/dist/types/modal/modal-variant-context.d.ts

@@ -0,0 +1,8 @@
+import type { ModalSlots, modalStyles, ModalVariantProps, SlotsToClasses } from "@opengovsg/oui-theme";
+export interface ModalVariantContextValue extends ModalVariantProps {
+    classNames?: SlotsToClasses<ModalSlots>;
+    slots: ReturnType<typeof modalStyles>;
+    buttonSize: "md" | "lg";
+}
+export declare const ModalVariantContext: import("react").Context<ModalVariantContextValue>, useModalVariantContext: () => ModalVariantContextValue;
+//# sourceMappingURL=modal-variant-context.d.ts.map

package/dist/types/modal/modal-variant-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal-variant-context.d.ts","sourceRoot":"","sources":["../../../src/modal/modal-variant-context.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,UAAU,EACV,WAAW,EACX,iBAAiB,EACjB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAI7B,MAAM,WAAW,wBAAyB,SAAQ,iBAAiB;IACjE,UAAU,CAAC,EAAE,cAAc,CAAC,UAAU,CAAC,CAAA;IACvC,KAAK,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAA;IACrC,UAAU,EAAE,IAAI,GAAG,IAAI,CAAA;CACxB;AAED,eAAO,MAAO,mBAAmB,qDAAE,sBAAsB,gCAIrD,CAAA"}

package/dist/types/modal/modal.d.ts

@@ -0,0 +1,8 @@
+import type { ModalOverlayProps } from "react-aria-components";
+import type { ModalSlots, SlotsToClasses, VariantProps } from "@opengovsg/oui-theme";
+import { modalStyles } from "@opengovsg/oui-theme";
+export interface ModalProps extends ModalOverlayProps, VariantProps<typeof modalStyles> {
+    classNames?: SlotsToClasses<ModalSlots>;
+}
+export declare const Modal: import("react").ForwardRefExoticComponent<ModalProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=modal.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/modal/modal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAA;AAQ9D,OAAO,KAAK,EACV,UAAU,EACV,cAAc,EACd,YAAY,EACb,MAAM,sBAAsB,CAAA;AAC7B,OAAO,EAAsB,WAAW,EAAE,MAAM,sBAAsB,CAAA;AAMtE,MAAM,WAAW,UACf,SAAQ,iBAAiB,EACvB,YAAY,CAAC,OAAO,WAAW,CAAC;IAClC,UAAU,CAAC,EAAE,cAAc,CAAC,UAAU,CAAC,CAAA;CACxC;AAED,eAAO,MAAM,KAAK,uGAsDhB,CAAA"}