@opengovsg/oui 0.0.47 → 0.0.49

package/dist/esm/infobox/use-infobox.js

@@ -0,0 +1,30 @@
+"use strict";
+import { useMemo } from 'react';
+import { useDeepCompareMemo } from 'use-deep-compare';
+import { infoboxStyles } from '@opengovsg/oui-theme';
+import { mapPropsVariants } from '../system/utils.js';
+
+function useInfobox(originalProps) {
+  const [_props, variantProps] = mapPropsVariants(
+    originalProps,
+    infoboxStyles.variantKeys
+  );
+  const { children, as, classNames, icon } = _props;
+  const Component = useMemo(() => as || "div", [as]);
+  const slots = useDeepCompareMemo(
+    () => ({
+      ...infoboxStyles({ ...variantProps })
+    }),
+    [variantProps, infoboxStyles]
+  );
+  return {
+    Component,
+    children,
+    slots,
+    classNames,
+    icon,
+    variant: variantProps.variant
+  };
+}
+
+export { useInfobox };

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

@@ -5,10 +5,10 @@ import { useContext, isValidElement } from 'react';
 import { useLocalizedStringFormatter } from 'react-aria';
 import { Dialog } from 'react-aria-components';
 import { cn } from '@opengovsg/oui-theme';
-import { Button } from '../button/button.js';
 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.2.3/node_modules/lucide-react/dist/esm/icons/x.js';
+import { Button } from '../button/button.js';
 
 function ModalContent({
   closeButtonContent: closeButtonContentProp,

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

@@ -0,0 +1,17 @@
+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 = [
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
+  ["path", { d: "m9 12 2 2 4-4", key: "dzmm74" }]
+];
+const CircleCheck = createLucideIcon("CircleCheck", __iconNode);
+
+export { __iconNode, CircleCheck as default };

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

@@ -2,13 +2,13 @@
 "use client";
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { NumberField as NumberField$1 } from 'react-aria-components';
-import { numberFieldStyles, composeTailwindRenderProps, dataAttr, fieldBorderStyles, cn } from '@opengovsg/oui-theme';
-import { Button } from '../button/button.js';
+import { numberFieldStyles, fieldBorderStyles, cn, composeTailwindRenderProps, dataAttr } from '@opengovsg/oui-theme';
 import { Label, FieldGroup, Description, FieldError } from '../field/field.js';
 import { Input } from '../input/input.js';
 import { mapPropsVariants } from '../system/utils.js';
 import Minus from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/minus.js';
 import Plus from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/plus.js';
+import { Button } from '../button/button.js';
 
 function NumberField(originalProps) {
   const [

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

@@ -3,7 +3,7 @@
 import { useMemo } from 'react';
 import { useFocusRing } from '@react-aria/focus';
 import { usePress, useHover } from '@react-aria/interactions';
-import { useRouter, mergeProps, chain, shouldClientNavigate } from '@react-aria/utils';
+import { useRouter, chain, shouldClientNavigate, mergeProps } from '@react-aria/utils';
 import { cn, dataAttr } from '@opengovsg/oui-theme';
 import { useDomRef } from '../system/react-utils/refs.js';
 import { filterDOMProps } from '../system/react-utils/filter-dom-props.js';

package/dist/esm/phone-number-field/phone-number-field.js

@@ -1,12 +1,12 @@
 "use strict";
 "use client";
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useMemo, useState, useRef, useCallback } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useMemo, useCallback, useState, useRef } from 'react';
 import { TextField, Provider } from 'react-aria-components';
 import BasePhoneInput, { getCountryCallingCode } from 'react-phone-number-input';
 import flags from 'react-phone-number-input/flags';
 import NonInternationalBasePhoneInput from 'react-phone-number-input/input';
-import { phoneNumberFieldStyles, cn } from '@opengovsg/oui-theme';
+import { cn, phoneNumberFieldStyles } from '@opengovsg/oui-theme';
 import { Label, FieldGroup, Description, FieldError } from '../field/field.js';
 import { useControllableState } from '../hooks/use-controllable-state.js';
 import { Input } from '../input/input.js';
@@ -15,7 +15,7 @@ import { SelectItem } from '../select/select-item.js';
 import { useLocalizedStringFormatter } from '../system/l10n.js';
 import { mapPropsVariants } from '../system/utils.js';
 import { MOBILE_EXAMPLES } from './constants.js';
-import { PhoneInputContext, usePhoneInputContext } from './context.js';
+import { usePhoneInputContext, PhoneInputContext } from './context.js';
 import { i18nStrings } from './i18n.js';
 
 const PhoneInput = ({

package/dist/esm/popover/popover.js

@@ -1,7 +1,7 @@
 "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 { useSlottedContext, PopoverContext, Popover as Popover$1, OverlayArrow, composeRenderProps } from 'react-aria-components';
 import { popoverArrowStyles, popoverStyles } from '@opengovsg/oui-theme';
 
 const Popover = ({

package/dist/esm/radio-group/index.js

@@ -0,0 +1,2 @@
+"use strict";
+export { Radio, RadioGroup } from './radio.js';

package/dist/esm/radio-group/radio-group-variant-context.js

@@ -0,0 +1,12 @@
+"use strict";
+import { createContext } from '../system/react-utils/context.js';
+
+const [RadioGroupVariantContext, useRadioGroupVariantContext] = createContext({
+  name: "RadioGroupVariantContext",
+  strict: false,
+  defaultValue: {
+    size: "md"
+  }
+});
+
+export { RadioGroupVariantContext, useRadioGroupVariantContext };

package/dist/esm/radio-group/radio.js

@@ -0,0 +1,96 @@
+"use strict";
+"use client";
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { Radio as Radio$1, composeRenderProps, Provider, RadioGroup as RadioGroup$1 } from 'react-aria-components';
+import { radioStyles, radioGroupStyles } from '@opengovsg/oui-theme';
+import { Description, Label, FieldError } from '../field/field.js';
+import { renderChildren } from '../system/react-utils/children.js';
+import { mapPropsVariants } from '../system/utils.js';
+import { useRadioGroupVariantContext, RadioGroupVariantContext } from './radio-group-variant-context.js';
+
+const Radio = ({
+  classNames,
+  className,
+  children,
+  description,
+  ...originalProps
+}) => {
+  const [props, variants] = mapPropsVariants(
+    originalProps,
+    radioStyles.variantKeys
+  );
+  const groupContext = useRadioGroupVariantContext();
+  const styles = radioStyles({ size: groupContext?.size, ...variants });
+  return /* @__PURE__ */ jsx(
+    Radio$1,
+    {
+      ...props,
+      isDisabled: variants.isDisabled,
+      className: composeRenderProps(
+        className ?? classNames?.base,
+        (className2, renderProps) => styles.base({ ...renderProps, className: className2 })
+      ),
+      children: (renderProps) => {
+        return /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: styles.circle({
+                ...renderProps,
+                className: classNames?.circle
+              }),
+              children: /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: styles.icon({
+                    ...renderProps,
+                    className: classNames?.icon
+                  })
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: styles.label({ className: classNames?.label }), children: renderChildren(renderProps, children) }),
+          description && /* @__PURE__ */ jsx(
+            Description,
+            {
+              size: groupContext?.size,
+              className: styles.description({
+                className: classNames?.description
+              }),
+              children: description
+            }
+          )
+        ] });
+      }
+    }
+  );
+};
+const RadioGroup = ({
+  label,
+  description,
+  errorMessage,
+  classNames,
+  size,
+  ...props
+}) => {
+  const context = { size };
+  return /* @__PURE__ */ jsx(Provider, { values: [[RadioGroupVariantContext, context]], children: /* @__PURE__ */ jsxs(
+    RadioGroup$1,
+    {
+      ...props,
+      className: composeRenderProps(
+        props.className ?? classNames?.base,
+        (className, renderProps) => radioGroupStyles({ ...renderProps, size, className })
+      ),
+      children: [
+        label && /* @__PURE__ */ jsx(Label, { size, className: classNames?.label, children: label }),
+        props.children,
+        description && /* @__PURE__ */ jsx(Description, { size, className: classNames?.description, children: description }),
+        /* @__PURE__ */ jsx(FieldError, { size, classNames: classNames?.error, children: errorMessage })
+      ]
+    }
+  ) });
+};
+
+export { Radio, RadioGroup };

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/esm/search-field/search-field.js

@@ -3,13 +3,13 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { useLocalizedStringFormatter } from 'react-aria';
 import { SearchField as SearchField$1 } from 'react-aria-components';
 import { searchFieldStyles, composeRenderProps } from '@opengovsg/oui-theme';
-import { Button } from '../button/button.js';
 import { Label, FieldGroup, Description, FieldError } from '../field/field.js';
 import { Input } from '../input/input.js';
 import { mapPropsVariants } from '../system/utils.js';
 import { i18nStrings } from './i18n.js';
 import Search from '../node_modules/.pnpm/lucide-react@0.475.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/search.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 { Button } from '../button/button.js';
 
 function SearchField(originalProps) {
   const [

package/dist/esm/select/select.js

@@ -5,7 +5,6 @@ import { useMemo, isValidElement, cloneElement } from 'react';
 import { useLocalizedStringFormatter } from 'react-aria';
 import { useFilter, Virtualizer, ListLayout, ListBox, Provider, Select as Select$1, SelectValue, Autocomplete, SearchField, Input } from 'react-aria-components';
 import { selectStyles, cn, composeRenderProps } from '@opengovsg/oui-theme';
-import { Button } from '../button/button.js';
 import { Label, Description, FieldError } from '../field/field.js';
 import { Popover } from '../popover/popover.js';
 import { useElementWidth } from '../system/react-utils/sizing.js';
@@ -13,6 +12,7 @@ import { mapPropsVariants } from '../system/utils.js';
 import { i18nStrings } from './i18n.js';
 import { SelectVariantContext } from './select-variant-context.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 { Button } from '../button/button.js';
 
 const calculateEstimatedRowHeight = (size) => {
   switch (size) {

package/dist/esm/sidebar/sidebar-list.js

@@ -6,11 +6,11 @@ import { useLocalizedStringFormatter } from 'react-aria';
 import { Disclosure, DisclosurePanel, Provider, Link, Button as Button$1 } from 'react-aria-components';
 import { useDisclosureState } from 'react-stately';
 import { dataAttr } from '@opengovsg/oui-theme';
-import { Button } from '../button/button.js';
 import { forwardRef } from '../system/utils.js';
 import { useSidebarStyleContext, useSidebarCollapseContext, SidebarNestContext, useSidebarNestContext } from './context.js';
 import { i18nStrings } from './i18n.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 { Button } from '../button/button.js';
 
 const SidebarListSection = ({
   onlyCaretToggle,

package/dist/esm/tabs/index.js

@@ -1,2 +1,2 @@
 "use strict";
-export { Tab, TabList, TabPanel, Tabs, TabsVariantContext, useTabsVariantContext } from './tabs.js';
+export { Tab, TabList, TabPanel, TabPanels, Tabs, TabsVariantContext, useTabsVariantContext } from './tabs.js';

package/dist/esm/tabs/tabs.js

@@ -2,8 +2,8 @@
 "use client";
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
-import { useContextProps, TabList as TabList$1, composeRenderProps, Tab as Tab$1, Provider, Tabs as Tabs$1, TabPanel as TabPanel$1 } from 'react-aria-components';
-import { tabListStyles, tabStyles, tabsStyles, tabPanelStyles } from '@opengovsg/oui-theme';
+import { useContextProps, TabList as TabList$1, composeRenderProps, Tab as Tab$1, TabPanels as TabPanels$1, TabPanel as TabPanel$1, Provider, Tabs as Tabs$1 } from 'react-aria-components';
+import { tabListStyles, tabStyles, tabPanelStyles, tabsStyles } from '@opengovsg/oui-theme';
 import { forwardRefGeneric, mapPropsVariants } from '../system/utils.js';
 import { createContext } from '../system/react-utils/context.js';
 
@@ -86,5 +86,6 @@ function TabPanel(props) {
     }
   );
 }
+const TabPanels = TabPanels$1;
 
-export { Tab, TabList, TabPanel, Tabs, TabsVariantContext, useTabsVariantContext };
+export { Tab, TabList, TabPanel, TabPanels, Tabs, TabsVariantContext, useTabsVariantContext };

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

@@ -10,18 +10,18 @@ import { TagFieldStateContext } from './tag-field-state-context.js';
 const TagFieldListContext = createContext(null);
 const TagFieldListInner = (props, ref) => {
   [props, ref] = useContextProps(props, ref, TagFieldListContext);
-  const { items, getItemProps, highlightedIndex } = useContext(TagFieldStateContext);
+  const { items, getItemProps, highlightedIndex, itemToKey } = useContext(TagFieldStateContext);
   const { slot, rowVirtualizer, itemClassNames, ...rest } = props;
-  return /* @__PURE__ */ jsx("ul", { slot: slot ?? void 0, ref, ...rest, children: props.children !== void 0 && typeof props.children !== "function" ? props.children : /* @__PURE__ */ jsxs(Fragment, { children: [
+  return /* @__PURE__ */ jsx("ul", { slot: slot ?? void 0, ref, ...rest, children: props.children !== void 0 && typeof props.children !== "function" ? props.children : rowVirtualizer ? /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
       "li",
       {
         "aria-hidden": true,
-        style: { height: rowVirtualizer?.getTotalSize() }
+        style: { height: rowVirtualizer.getTotalSize() }
       },
       "total-size"
     ),
-    rowVirtualizer?.getVirtualItems().map((virtualRow) => {
+    rowVirtualizer.getVirtualItems().map((virtualRow) => {
       const item = items[virtualRow.index];
       const itemProps = getItemProps({
         item,
@@ -53,7 +53,27 @@ const TagFieldListInner = (props, ref) => {
         }
       );
     })
-  ] }) });
+  ] }) : items.map((item, index) => {
+    const itemProps = getItemProps({ item, index });
+    const key = itemToKey(item);
+    const childProps = {
+      item,
+      isHighlighted: highlightedIndex === index,
+      key,
+      classNames: itemClassNames
+    };
+    if (typeof props.children === "function") {
+      return props.children({ ...childProps, itemProps });
+    }
+    return /* @__PURE__ */ createElement(
+      TagFieldItem,
+      {
+        ...childProps,
+        ...itemProps,
+        key
+      }
+    );
+  }) });
 };
 const TagFieldList = forwardRefGeneric(TagFieldListInner);
 

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

@@ -6,6 +6,10 @@ import { useMultipleSelection, useCombobox } from 'downshift';
 import { omit } from 'lodash-es';
 import { useTextField } from 'react-aria';
 
+function useOptionalVirtualizer(isVirtualized, options) {
+  const virtualizer = useVirtualizer(options);
+  return isVirtualized ? virtualizer : null;
+}
 function useTagField(props, state) {
   let { buttonRef } = props;
   const {
@@ -19,7 +23,8 @@ function useTagField(props, state) {
     itemToKey,
     itemToText,
     label,
-    virtualRowHeight = 40
+    virtualRowHeight = 40,
+    isVirtualized = true
   } = props;
   const backupBtnRef = useRef(null);
   buttonRef = buttonRef ?? backupBtnRef;
@@ -49,7 +54,7 @@ function useTagField(props, state) {
   const disabledKeysSet = useMemo(() => {
     return new Set(disabledKeys);
   }, [disabledKeys]);
-  const rowVirtualizer = useVirtualizer({
+  const rowVirtualizer = useOptionalVirtualizer(isVirtualized, {
     count: items.length,
     getScrollElement: () => listBoxRef.current,
     estimateSize: () => virtualRowHeight,
@@ -76,11 +81,17 @@ function useTagField(props, state) {
     },
     isItemDisabled: (item) => isDisabled || isReadOnly || disabledKeysSet.has(itemToKey(item)),
     items,
-    scrollIntoView: () => {
+    // Noop for scrollIntoView if virtualized, as we'll handle it in onHighlightedIndexChange
+    scrollIntoView: (node) => {
+      if (!isVirtualized) {
+        node.scrollIntoView({ block: "nearest" });
+      }
     },
     onHighlightedIndexChange: ({ highlightedIndex: highlightedIndex2, type }) => {
       if (type !== useCombobox.stateChangeTypes.MenuMouseLeave && highlightedIndex2 >= 0) {
-        rowVirtualizer.scrollToIndex(highlightedIndex2);
+        if (rowVirtualizer) {
+          rowVirtualizer.scrollToIndex(highlightedIndex2);
+        }
       }
     },
     defaultHighlightedIndex: 0,

package/dist/esm/tooltip/tooltip.js

@@ -3,6 +3,7 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { TooltipTrigger as TooltipTrigger$1, Tooltip as Tooltip$1, OverlayArrow } from 'react-aria-components';
 import { tooltipStyles, composeRenderProps } from '@opengovsg/oui-theme';
+import { renderChildren } from '../system/react-utils/children.js';
 import { mapPropsVariants } from '../system/utils.js';
 
 function Tooltip(originalProps) {
@@ -29,13 +30,10 @@ function Tooltip(originalProps) {
             width: 8,
             height: 8,
             viewBox: "0 0 8 8",
-            className: composeRenderProps(
-              classNames?.arrow,
-              (className, renderProps2) => styles.arrow({
-                className,
-                ...renderProps2
-              })
-            )(renderProps),
+            className: styles.arrow({
+              ...renderProps,
+              className: renderChildren(renderProps, classNames?.arrow)
+            }),
             children: /* @__PURE__ */ jsx("path", { d: "M0 0 L4 4 L8 0" })
           }
         ) }),

package/dist/types/checkbox/checkbox.d.ts

@@ -1,8 +1,8 @@
-import type { CheckboxGroupProps as AriaCheckboxGroupProps, CheckboxProps as AriaCheckboxProps, ValidationResult } from "react-aria-components";
-import type { CheckboxSlots, FieldErrorSlots, SlotsToClasses, VariantProps } from "@opengovsg/oui-theme";
+import type { CheckboxGroupProps as AriaCheckboxGroupProps, CheckboxProps as AriaCheckboxProps, CheckboxRenderProps, ValidationResult } from "react-aria-components";
+import type { CheckboxSlots, FieldErrorSlots, SlotsToClasses, SlotsToClassesWithRenderProps, VariantProps } from "@opengovsg/oui-theme";
 import { checkboxStyles } from "@opengovsg/oui-theme";
 export interface CheckboxProps extends AriaCheckboxProps, VariantProps<typeof checkboxStyles> {
-    classNames?: SlotsToClasses<CheckboxSlots>;
+    classNames?: SlotsToClassesWithRenderProps<CheckboxSlots, CheckboxRenderProps>;
 }
 export declare const Checkbox: ({ classNames, className, ...originalProps }: CheckboxProps) => import("react/jsx-runtime").JSX.Element;
 export interface CheckboxGroupProps extends Omit<AriaCheckboxGroupProps, "children"> {

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

@@ -1 +1 @@
-{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/checkbox/checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,kBAAkB,IAAI,sBAAsB,EAC5C,aAAa,IAAI,iBAAiB,EAClC,gBAAgB,EACjB,MAAM,uBAAuB,CAAA;AAS9B,OAAO,KAAK,EACV,aAAa,EACb,eAAe,EACf,cAAc,EACd,YAAY,EACb,MAAM,sBAAsB,CAAA;AAC7B,OAAO,EAAuB,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAS1E,MAAM,WAAW,aACf,SAAQ,iBAAiB,EACvB,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,UAAU,CAAC,EAAE,cAAc,CAAC,aAAa,CAAC,CAAA;CAC3C;AAED,eAAO,MAAM,QAAQ,gDAIlB,aAAa,4CA4Cf,CAAA;AACD,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,sBAAsB,EAAE,UAAU,CAAC;IAChD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,UAAU,EAAE,gBAAgB,KAAK,MAAM,CAAC,CAAA;IAClE,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,GAAG,MAAM,GAAG,aAAa,CAAC,GAAG;QAC9D,KAAK,CAAC,EAAE,cAAc,CAAC,eAAe,CAAC,CAAA;KACxC,CAAA;IACD,IAAI,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAA;CAC7B;AAED,wBAAgB,aAAa,CAAC,EAC5B,WAAW,EACX,YAAY,EACZ,UAAU,EACV,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,kBAAkB,2CA8BpB"}
+{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/checkbox/checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,kBAAkB,IAAI,sBAAsB,EAC5C,aAAa,IAAI,iBAAiB,EAClC,mBAAmB,EACnB,gBAAgB,EACjB,MAAM,uBAAuB,CAAA;AAS9B,OAAO,KAAK,EACV,aAAa,EACb,eAAe,EACf,cAAc,EACd,6BAA6B,EAC7B,YAAY,EACb,MAAM,sBAAsB,CAAA;AAC7B,OAAO,EAAuB,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAU1E,MAAM,WAAW,aACf,SAAQ,iBAAiB,EACvB,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,UAAU,CAAC,EAAE,6BAA6B,CAAC,aAAa,EAAE,mBAAmB,CAAC,CAAA;CAC/E;AAED,eAAO,MAAM,QAAQ,gDAIlB,aAAa,4CAmDf,CAAA;AACD,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,sBAAsB,EAAE,UAAU,CAAC;IAChD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,UAAU,EAAE,gBAAgB,KAAK,MAAM,CAAC,CAAA;IAClE,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,GAAG,MAAM,GAAG,aAAa,CAAC,GAAG;QAC9D,KAAK,CAAC,EAAE,cAAc,CAAC,eAAe,CAAC,CAAA;KACxC,CAAA;IACD,IAAI,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAA;CAC7B;AAED,wBAAgB,aAAa,CAAC,EAC5B,WAAW,EACX,YAAY,EACZ,UAAU,EACV,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,kBAAkB,2CA8BpB"}

package/dist/types/index.d.mts

@@ -39,4 +39,6 @@ export * from "./breadcrumbs";
 export * from "./sidebar";
 export * from "./tooltip";
 export * from "./phone-number-field";
+export * from "./infobox";
+export * from "./radio-group";
 //# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts

@@ -39,4 +39,6 @@ export * from "./breadcrumbs";
 export * from "./sidebar";
 export * from "./tooltip";
 export * from "./phone-number-field";
+export * from "./infobox";
+export * from "./radio-group";
 //# 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;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA;AAC5B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA;AACzB,cAAc,sBAAsB,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;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA;AAC5B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,QAAQ,CAAA;AACtB,cAAc,eAAe,CAAA;AAC7B,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA;AACzB,cAAc,sBAAsB,CAAA;AACpC,cAAc,WAAW,CAAA;AACzB,cAAc,eAAe,CAAA"}

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

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

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

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

package/dist/types/infobox/infobox.d.ts

@@ -0,0 +1,5 @@
+import type { UseInfoboxProps } from "./use-infobox";
+export interface InfoboxProps extends UseInfoboxProps {
+}
+export declare const Infobox: (props: InfoboxProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=infobox.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"infobox.d.ts","sourceRoot":"","sources":["../../../src/infobox/infobox.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAIpD,MAAM,WAAW,YAAa,SAAQ,eAAe;CAAG;AAExD,eAAO,MAAM,OAAO,UAAW,YAAY,4CAsC1C,CAAA"}

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

@@ -0,0 +1,54 @@
+import type { InfoboxSlots, InfoboxVariantProps, SlotsToClasses } from "@opengovsg/oui-theme";
+import type { HtmlUiProps } from "../system/types";
+export interface UseInfoboxProps extends HtmlUiProps, InfoboxVariantProps {
+    /**
+     * Icon to show on the left of the infobox.
+     * If not specified, a default icon will be used according to the infobox variant.
+     * Pass `null` to explicitly hide the icon.
+     */
+    icon?: React.ReactNode | null;
+    /**
+     * Classname or List of classes to change the classNames of the element.
+     * if `className` is passed, it will be added to the base slot.
+     *
+     * @example
+     * ```ts
+     * <Infobox classNames={{
+     *    base: "base-classes",
+     *    icon: "icon-classes",
+     * }} />
+     * ```
+     */
+    classNames?: SlotsToClasses<InfoboxSlots>;
+}
+export declare function useInfobox(originalProps: UseInfoboxProps): {
+    Component: import("../system/types").As<any>;
+    children: import("react").ReactNode;
+    slots: {
+        base: ((slotProps?: ({
+            size?: "md" | "sm" | undefined;
+            variant?: "error" | "warning" | "success" | "info" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string) & ((slotProps?: ({
+            size?: "md" | "sm" | undefined;
+            variant?: "error" | "warning" | "success" | "info" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string);
+        icon: ((slotProps?: ({
+            size?: "md" | "sm" | undefined;
+            variant?: "error" | "warning" | "success" | "info" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string) & ((slotProps?: ({
+            size?: "md" | "sm" | undefined;
+            variant?: "error" | "warning" | "success" | "info" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string);
+        wrapper: ((slotProps?: ({
+            size?: "md" | "sm" | undefined;
+            variant?: "error" | "warning" | "success" | "info" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string) & ((slotProps?: ({
+            size?: "md" | "sm" | undefined;
+            variant?: "error" | "warning" | "success" | "info" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string);
+    };
+    classNames: SlotsToClasses<"base" | "wrapper" | "icon"> | undefined;
+    icon: import("react").ReactNode;
+    variant: "error" | "warning" | "success" | "info" | undefined;
+};
+//# sourceMappingURL=use-infobox.d.ts.map

package/dist/types/infobox/use-infobox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-infobox.d.ts","sourceRoot":"","sources":["../../../src/infobox/use-infobox.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,YAAY,EACZ,mBAAmB,EACnB,cAAc,EACf,MAAM,sBAAsB,CAAA;AAG7B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAGlD,MAAM,WAAW,eAAgB,SAAQ,WAAW,EAAE,mBAAmB;IACvE;;;;OAIG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,CAAA;IAC7B;;;;;;;;;;;OAWG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC,YAAY,CAAC,CAAA;CAC1C;AAED,wBAAgB,UAAU,CAAC,aAAa,EAAE,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyBxD"}

package/dist/types/radio-group/index.d.ts

@@ -0,0 +1,3 @@
+export { Radio, RadioGroup } from "./radio";
+export type { RadioGroupProps, RadioProps } from "./radio";
+//# sourceMappingURL=index.d.ts.map

package/dist/types/radio-group/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/radio-group/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAE3C,YAAY,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA"}

package/dist/types/radio-group/radio-group-variant-context.d.ts

@@ -0,0 +1,6 @@
+import type { RadioGroupVariantProps } from "@opengovsg/oui-theme";
+export interface RadioGroupVariantContextValue extends RadioGroupVariantProps {
+    size: RadioGroupVariantProps["size"];
+}
+export declare const RadioGroupVariantContext: import("react").Context<RadioGroupVariantContextValue | undefined>, useRadioGroupVariantContext: () => RadioGroupVariantContextValue | undefined;
+//# sourceMappingURL=radio-group-variant-context.d.ts.map

package/dist/types/radio-group/radio-group-variant-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group-variant-context.d.ts","sourceRoot":"","sources":["../../../src/radio-group/radio-group-variant-context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAA;AAIlE,MAAM,WAAW,6BAA8B,SAAQ,sBAAsB;IAC3E,IAAI,EAAE,sBAAsB,CAAC,MAAM,CAAC,CAAA;CACrC;AAED,eAAO,MAAO,wBAAwB,sEAAE,2BAA2B,iDAO/D,CAAA"}