@opengovsg/oui 0.0.0-snapshot-20251203100754 → 0.0.0-snapshot-20251216073051

package/dist/esm/pagination/pagination.js

@@ -9,9 +9,9 @@ import { PaginationItemType } from './hooks/use-pagination.js';
 import { PaginationCursor } from './pagination-cursor.js';
 import { PaginationItem } from './pagination-item.js';
 import { usePagination } from './use-pagination.js';
-import ChevronLeft from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/chevron-left.js';
-import Ellipsis from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/ellipsis.js';
-import ChevronsRight from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.0.0/node_modules/lucide-react/dist/esm/icons/chevrons-right.js';
+import ChevronLeft from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/chevron-left.js';
+import Ellipsis from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/ellipsis.js';
+import ChevronsRight from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/chevrons-right.js';
 
 const Pagination = forwardRef((props, ref) => {
   const {

package/dist/esm/pagination/use-pagination-item.js

@@ -5,8 +5,8 @@ import { useFocusRing } from '@react-aria/focus';
 import { usePress, useHover } from '@react-aria/interactions';
 import { useRouter, mergeProps, chain, shouldClientNavigate } from '@react-aria/utils';
 import { cn, dataAttr } from '@opengovsg/oui-theme';
-import { filterDOMProps } from '../system/react-utils/filter-dom-props.js';
 import { useDomRef } from '../system/react-utils/refs.js';
+import { filterDOMProps } from '../system/react-utils/filter-dom-props.js';
 
 function usePaginationItem(props) {
   const {

package/dist/esm/select/select.js

@@ -4,11 +4,11 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 import { Provider, Select as Select$1, SelectValue, Virtualizer, ListLayout, ListBox } from 'react-aria-components';
 import { selectStyles, composeRenderProps } from '@opengovsg/oui-theme';
-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 { Label, Description, FieldError } from '../field/field.js';
+import ChevronDown from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/chevron-down.js';
+import { Popover } from '../popover/popover.js';
 import { Button } from '../button/button.js';
 
 const calculateEstimatedRowHeight = (size) => {

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

@@ -0,0 +1,23 @@
+"use strict";
+import { Children, isValidElement } from 'react';
+
+function getValidChildren(children) {
+  return Children.toArray(children).filter(
+    (child) => isValidElement(child)
+  );
+}
+const pickChildren = (children, targetChild) => {
+  const target = [];
+  const withoutTargetChildren = Children.map(children, (item) => {
+    if (!isValidElement(item)) return item;
+    if (item.type === targetChild) {
+      target.push(item);
+      return null;
+    }
+    return item;
+  })?.filter(Boolean);
+  const targetChildren = target.length >= 0 ? target : void 0;
+  return [withoutTargetChildren, targetChildren];
+};
+
+export { getValidChildren, pickChildren };

package/dist/esm/system/utils.js

@@ -1,5 +1,5 @@
 "use strict";
-import { forwardRef as forwardRef$1, useMemo } from 'react';
+import { forwardRef as forwardRef$1 } from 'react';
 
 function forwardRef(component) {
   return forwardRef$1(component);
@@ -26,53 +26,6 @@ const mapPropsVariants = (props, variantKeys, removeVariantProps = true) => {
   }
   return [props, picked];
 };
-function useRenderProps(props) {
-  const {
-    className,
-    style,
-    children,
-    defaultClassName = void 0,
-    defaultChildren = void 0,
-    defaultStyle,
-    values
-  } = props;
-  return useMemo(() => {
-    let computedClassName;
-    let computedStyle;
-    let computedChildren;
-    if (typeof className === "function") {
-      computedClassName = className({ ...values, defaultClassName });
-    } else {
-      computedClassName = className;
-    }
-    if (typeof style === "function") {
-      computedStyle = style({ ...values, defaultStyle: defaultStyle || {} });
-    } else {
-      computedStyle = style;
-    }
-    if (typeof children === "function") {
-      computedChildren = children({ ...values, defaultChildren });
-    } else if (children == null) {
-      computedChildren = defaultChildren;
-    } else {
-      computedChildren = children;
-    }
-    return {
-      className: computedClassName ?? defaultClassName,
-      style: computedStyle || defaultStyle ? { ...defaultStyle, ...computedStyle } : void 0,
-      children: computedChildren ?? defaultChildren,
-      "data-rac": ""
-    };
-  }, [
-    className,
-    style,
-    children,
-    defaultClassName,
-    defaultChildren,
-    defaultStyle,
-    values
-  ]);
-}
 function removeDataAttributes(props) {
   const prefix = /^(data-.*)$/;
   const filteredProps = {};
@@ -94,4 +47,4 @@ function pickAriaAttributes(props) {
   return filteredProps;
 }
 
-export { forwardRef, forwardRefGeneric, mapPropsVariants, pickAriaAttributes, removeDataAttributes, useRenderProps };
+export { forwardRef, forwardRefGeneric, mapPropsVariants, pickAriaAttributes, removeDataAttributes };

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

@@ -2,7 +2,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useContext, useCallback } from 'react';
 import { TagFieldStateContext } from './tag-field-state-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 X from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/x.js';
 
 const TagFieldTagList = ({
   classNames,

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

@@ -4,15 +4,15 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { createElement } from 'react';
 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';
 import { TagFieldTagList } from './tag-field-tag-list.js';
 import { TagFieldTrigger } from './tag-field-trigger.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 ChevronDown from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/chevron-down.js';
+import { Label, FieldGroup, Description, FieldError } from '../field/field.js';
+import { Input } from '../input/input.js';
+import { Popover } from '../popover/popover.js';
 
 function TagField({
   classNames,

package/dist/esm/text-area-field/text-area-field.js

@@ -3,8 +3,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { TextField } from 'react-aria-components';
 import { composeTailwindRenderProps } from '@opengovsg/oui-theme';
-import { Label, Description, FieldError } from '../field/field.js';
 import { TextArea } from '../text-area/text-area.js';
+import { Label, Description, FieldError } from '../field/field.js';
 
 function TextAreaField({
   label,

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

@@ -3,8 +3,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { TextField as TextField$1 } from 'react-aria-components';
 import { composeTailwindRenderProps } from '@opengovsg/oui-theme';
-import { Label, Description, FieldError } from '../field/field.js';
 import { Input } from '../input/input.js';
+import { Label, Description, FieldError } from '../field/field.js';
 
 function TextField({
   label,

package/dist/esm/toast/index.js

@@ -0,0 +1,3 @@
+"use strict";
+export { Toaster } from './toast.js';
+export { toast } from 'sonner';

package/dist/esm/toast/toast.js

@@ -0,0 +1,86 @@
+"use strict";
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { Toaster as Toaster$1 } from 'sonner';
+export { toast } from 'sonner';
+import { toastStyles } from '@opengovsg/oui-theme';
+import { mapPropsVariants } from '../system/utils.js';
+import X from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/x.js';
+import { Spinner } from '../spinner/spinner.js';
+
+function Toaster(originalProps) {
+  const [{ toastOptions, closeButton = true, ...props }, variantProps] = mapPropsVariants(originalProps, toastStyles.variantKeys);
+  const styles = toastStyles(variantProps);
+  return /* @__PURE__ */ jsx(
+    Toaster$1,
+    {
+      className: styles.base({
+        className: props.className ?? props.classNames?.base
+      }),
+      position: "top-center",
+      icons: {
+        loading: /* @__PURE__ */ jsx(Spinner, { size: "xs" }),
+        close: /* @__PURE__ */ jsx(X, {})
+      },
+      mobileOffset: 8,
+      offset: {
+        top: 8
+      },
+      closeButton,
+      toastOptions: {
+        classNames: {
+          toast: styles.toast({
+            className: props.classNames?.toast
+          }),
+          title: styles.title({
+            className: props.classNames?.title
+          }),
+          description: styles.description({
+            className: props.classNames?.description
+          }),
+          loader: styles.loader({
+            className: props.classNames?.loader
+          }),
+          closeButton: styles.closeButton({
+            className: props.classNames?.closeButton
+          }),
+          success: styles.success({
+            className: props.classNames?.success
+          }),
+          error: styles.error({
+            className: props.classNames?.error
+          }),
+          info: styles.info({
+            className: props.classNames?.info
+          }),
+          warning: styles.warning({
+            className: props.classNames?.warning
+          }),
+          loading: styles.loading({
+            className: props.classNames?.loading
+          }),
+          default: styles.default({
+            className: props.classNames?.default
+          }),
+          content: styles.content({
+            className: props.classNames?.content
+          }),
+          icon: styles.icon({
+            className: props.classNames?.icon
+          }),
+          actionButton: styles.actionButton({
+            className: props.classNames?.actionButton
+          }),
+          cancelButton: styles.cancelButton({
+            className: props.classNames?.cancelButton
+          })
+        },
+        unstyled: true,
+        ...toastOptions
+      },
+      ...props
+    }
+  );
+}
+
+export { Toaster };

package/dist/types/hooks/use-scroll-position.d.ts

@@ -0,0 +1,29 @@
+export type ScrollValue = {
+    x: number;
+    y: number;
+};
+export interface UseScrollPositionOptions {
+    /**
+     * The wait time in milliseconds before triggering the callback.
+     * @default 30
+     */
+    delay?: number;
+    /**
+     * Whether the scroll position should be tracked or not.
+     * @default true
+     */
+    isEnabled?: boolean;
+    /**
+     * The element to track the scroll position for.
+     */
+    elementRef?: React.RefObject<HTMLElement> | null;
+    /**
+     * The callback function to be called when the scroll position changes.
+     */
+    callback?: ({ prevPos, currPos, }: {
+        prevPos: ScrollValue;
+        currPos: ScrollValue;
+    }) => void;
+}
+export declare const useScrollPosition: (props: UseScrollPositionOptions) => ScrollValue;
+//# sourceMappingURL=use-scroll-position.d.ts.map

package/dist/types/hooks/use-scroll-position.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-scroll-position.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-scroll-position.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,WAAW,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AAalD,MAAM,WAAW,wBAAwB;IACvC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,IAAI,CAAA;IAChD;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,EACV,OAAO,EACP,OAAO,GACR,EAAE;QACD,OAAO,EAAE,WAAW,CAAA;QACpB,OAAO,EAAE,WAAW,CAAA;KACrB,KAAK,IAAI,CAAA;CACX;AAED,eAAO,MAAM,iBAAiB,UACrB,wBAAwB,KAC9B,WAiDF,CAAA"}

package/dist/types/index.d.mts

@@ -28,4 +28,6 @@ export * from "./pagination";
 export * from "./file-dropzone";
 export * from "./number-field";
 export * from "./modal";
+export * from "./toast";
+export * from "./navbar";
 //# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts

@@ -28,4 +28,6 @@ export * from "./pagination";
 export * from "./file-dropzone";
 export * from "./number-field";
 export * from "./modal";
+export * from "./toast";
+export * from "./navbar";
 //# 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;AAC9B,cAAc,SAAS,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;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA"}

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

@@ -0,0 +1,17 @@
+export { Navbar } from "./navbar";
+export { NavbarBrand } from "./navbar-brand";
+export { NavbarContent } from "./navbar-content";
+export { NavbarMenu } from "./navbar-menu/menu";
+export { NavbarMenuItem } from "./navbar-menu/item";
+export { NavbarMenuToggle } from "./navbar-menu/toggle";
+export { NavbarItem } from "./navbar-item";
+export { useNavbar } from "./use-navbar";
+export { NavbarProvider, useNavbarContext } from "./navbar-context";
+export type { NavbarProps } from "./navbar";
+export type { NavbarBrandProps } from "./navbar-brand";
+export type { NavbarContentProps } from "./navbar-content";
+export type { NavbarMenuProps } from "./navbar-menu/menu";
+export type { NavbarMenuItemProps } from "./navbar-menu/item";
+export type { NavbarMenuToggleProps } from "./navbar-menu/toggle";
+export type { NavbarItemProps } from "./navbar-item";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/navbar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAA;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAA;AAEnE,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAC3C,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AACtD,YAAY,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AAC1D,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AACzD,YAAY,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAA;AAC7D,YAAY,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAA;AACjE,YAAY,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA"}

package/dist/types/navbar/navbar-brand.d.ts

@@ -0,0 +1,6 @@
+import type { HtmlUiProps } from "../system/types";
+export interface NavbarBrandProps extends HtmlUiProps<"div"> {
+    children?: React.ReactNode | React.ReactNode[];
+}
+export declare const NavbarBrand: import("../system/utils").InternalForwardRefRenderFunction<"div", NavbarBrandProps, never>;
+//# sourceMappingURL=navbar-brand.d.ts.map

package/dist/types/navbar/navbar-brand.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"navbar-brand.d.ts","sourceRoot":"","sources":["../../../src/navbar/navbar-brand.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAKlD,MAAM,WAAW,gBAAiB,SAAQ,WAAW,CAAC,KAAK,CAAC;IAC1D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAA;CAC/C;AAED,eAAO,MAAM,WAAW,4FAiBtB,CAAA"}

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

@@ -0,0 +1,14 @@
+import type { HtmlUiProps } from "../system/types";
+export interface NavbarContentProps extends HtmlUiProps<"ul"> {
+    /**
+     * The content of the Navbar.Content. It is usually the `NavbarItem`,
+     */
+    children?: React.ReactNode | React.ReactNode[];
+    /**
+     * The justify of the content
+     * @default start
+     */
+    justify?: "start" | "end" | "center";
+}
+export declare const NavbarContent: import("../system/utils").InternalForwardRefRenderFunction<"div", NavbarContentProps, never>;
+//# sourceMappingURL=navbar-content.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"navbar-content.d.ts","sourceRoot":"","sources":["../../../src/navbar/navbar-content.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAKlD,MAAM,WAAW,kBAAmB,SAAQ,WAAW,CAAC,IAAI,CAAC;IAC3D;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAA;IAC9C;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAA;CACrC;AAED,eAAO,MAAM,aAAa,8FAsBzB,CAAA"}

package/dist/types/navbar/navbar-context.d.ts

@@ -0,0 +1,182 @@
+export declare const NavbarProvider: import("react").Context<{
+    Component: import("../system/types").As<any>;
+    slots: {
+        base: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        wrapper: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        toggle: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        toggleIcon: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        brand: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        content: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        item: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        menu: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        menuItem: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+    } & {
+        base: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        wrapper: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        toggle: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        toggleIcon: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        brand: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        content: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        item: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        menu: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        menuItem: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+    } & {};
+    domRef: import("react").RefObject<HTMLElement | null>;
+    menuTopOffset: number;
+    menuTopOffsetPx: string;
+    isNavbarHidden: boolean;
+    shouldShowOnScrollUp: boolean;
+    isMenuOpen: boolean;
+    classNames: import("@opengovsg/oui-theme").SlotsToClasses<"toggle" | "content" | "base" | "wrapper" | "item" | "brand" | "menu" | "menuItem" | "toggleIcon"> | undefined;
+    setIsMenuOpen: (value: boolean, ...args: any[]) => void;
+    menuRef: import("react").RefObject<HTMLButtonElement | null>;
+    getBaseProps: import("../system/types").PropGetter;
+    getWrapperProps: import("../system/types").PropGetter;
+    position: "static" | "sticky";
+    motionProps: Omit<import("motion/react").HTMLMotionProps<"nav">, "ref"> | undefined;
+}>, useNavbarContext: () => {
+    Component: import("../system/types").As<any>;
+    slots: {
+        base: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        wrapper: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        toggle: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        toggleIcon: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        brand: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        content: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        item: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        menu: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        menuItem: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+    } & {
+        base: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        wrapper: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        toggle: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        toggleIcon: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        brand: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        content: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        item: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        menu: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+        menuItem: (slotProps?: ({
+            position?: "static" | "sticky" | undefined;
+            hasBorder?: boolean | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
+    } & {};
+    domRef: import("react").RefObject<HTMLElement | null>;
+    menuTopOffset: number;
+    menuTopOffsetPx: string;
+    isNavbarHidden: boolean;
+    shouldShowOnScrollUp: boolean;
+    isMenuOpen: boolean;
+    classNames: import("@opengovsg/oui-theme").SlotsToClasses<"toggle" | "content" | "base" | "wrapper" | "item" | "brand" | "menu" | "menuItem" | "toggleIcon"> | undefined;
+    setIsMenuOpen: (value: boolean, ...args: any[]) => void;
+    menuRef: import("react").RefObject<HTMLButtonElement | null>;
+    getBaseProps: import("../system/types").PropGetter;
+    getWrapperProps: import("../system/types").PropGetter;
+    position: "static" | "sticky";
+    motionProps: Omit<import("motion/react").HTMLMotionProps<"nav">, "ref"> | undefined;
+};
+//# sourceMappingURL=navbar-context.d.ts.map

package/dist/types/navbar/navbar-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"navbar-context.d.ts","sourceRoot":"","sources":["../../../src/navbar/navbar-context.ts"],"names":[],"mappings":"AAKA,eAAO,MAAO,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAAE,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAM1C,CAAA"}

package/dist/types/navbar/navbar-item.d.ts

@@ -0,0 +1,11 @@
+import type { HtmlUiProps } from "../system/types";
+export interface NavbarItemProps extends HtmlUiProps<"li"> {
+    children?: React.ReactNode;
+    /**
+     * Whether the item is active or not.
+     * @default false
+     */
+    isActive?: boolean;
+}
+export declare const NavbarItem: import("../system/utils").InternalForwardRefRenderFunction<"div", NavbarItemProps, never>;
+//# sourceMappingURL=navbar-item.d.ts.map

package/dist/types/navbar/navbar-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"navbar-item.d.ts","sourceRoot":"","sources":["../../../src/navbar/navbar-item.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAKlD,MAAM,WAAW,eAAgB,SAAQ,WAAW,CAAC,IAAI,CAAC;IACxD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,eAAO,MAAM,UAAU,2FAkBrB,CAAA"}

package/dist/types/navbar/navbar-menu/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/navbar/navbar-menu/i18n.d.ts.map

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

package/dist/types/navbar/navbar-menu/item.d.ts

@@ -0,0 +1,16 @@
+import type { ClassNameOrFunction } from "@opengovsg/oui-theme";
+import type { HtmlUiProps } from "../../system/types";
+export interface NavbarMenuItemRenderProps {
+    isActive: boolean;
+}
+export interface NavbarMenuItemProps extends Omit<HtmlUiProps<"li">, "className"> {
+    /**
+     * Whether the item is active or not.
+     * @default false
+     */
+    isActive?: boolean;
+    children?: React.ReactNode;
+    className?: ClassNameOrFunction<NavbarMenuItemRenderProps>;
+}
+export declare const NavbarMenuItem: import("../../system/utils").InternalForwardRefRenderFunction<"li", NavbarMenuItemProps, never>;
+//# sourceMappingURL=item.d.ts.map

package/dist/types/navbar/navbar-menu/item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../../../src/navbar/navbar-menu/item.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAA;AAG/D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAA;AAKrD,MAAM,WAAW,yBAAyB;IACxC,QAAQ,EAAE,OAAO,CAAA;CAClB;AAED,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,WAAW,CAAC;IAC5C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,mBAAmB,CAAC,yBAAyB,CAAC,CAAA;CAC3D;AAED,eAAO,MAAM,cAAc,iGAgC1B,CAAA"}

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

@@ -0,0 +1,11 @@
+import type { HtmlUiProps } from "../../system/types";
+export interface NavbarMenuProps extends HtmlUiProps<"ul"> {
+    children?: React.ReactNode;
+    /**
+     * The container element in which the navbar menu overlay portal will be placed.
+     * @default below the navbar element
+     */
+    portalContainer?: Element;
+}
+export declare const NavbarMenu: import("../../system/utils").InternalForwardRefRenderFunction<"ul", NavbarMenuProps, never>;
+//# sourceMappingURL=menu.d.ts.map