@opengovsg/oui 0.0.9 → 0.0.11

package/dist/esm/tabs/tabs.js

@@ -0,0 +1,90 @@
+"use strict";
+"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 { forwardRefGeneric, mapPropsVariants } from '../system/utils.js';
+import { createContext } from '../system/react-utils/context.js';
+
+const [TabsVariantContext, useTabsVariantContext] = createContext({
+  name: "TabsVariantContext",
+  strict: true
+});
+function Tabs(originalProps) {
+  const [props, variantProps] = mapPropsVariants(
+    originalProps,
+    tabsStyles.variantKeys
+  );
+  return /* @__PURE__ */ jsx(Provider, { values: [[TabsVariantContext, variantProps]], children: /* @__PURE__ */ jsx(
+    Tabs$1,
+    {
+      ...props,
+      className: composeRenderProps(
+        props.className,
+        (className, renderProps) => tabsStyles({ ...renderProps, ...variantProps, className })
+      )
+    }
+  ) });
+}
+const TabList = forwardRefGeneric(function TabList2(originalProps, ref) {
+  [originalProps, ref] = useContextProps(
+    originalProps,
+    ref,
+    TabsVariantContext
+  );
+  const [props, variantProps] = mapPropsVariants(
+    originalProps,
+    tabListStyles.variantKeys
+  );
+  return /* @__PURE__ */ jsx(
+    TabList$1,
+    {
+      ref,
+      ...props,
+      className: composeRenderProps(
+        props.className,
+        (className, renderProps) => tabListStyles({ ...renderProps, ...variantProps, className })
+      )
+    }
+  );
+});
+const Tab = forwardRef(function Tab2(originalProps, ref) {
+  [originalProps, ref] = useContextProps(
+    originalProps,
+    ref,
+    TabsVariantContext
+  );
+  const [{ children, startContent, endContent, ...props }, variantProps] = mapPropsVariants(originalProps, tabStyles.variantKeys);
+  return /* @__PURE__ */ jsx(
+    Tab$1,
+    {
+      ref,
+      ...props,
+      isDisabled: originalProps.isDisabled,
+      className: composeRenderProps(
+        props.className,
+        (className, renderProps) => tabStyles({ ...renderProps, ...variantProps, className })
+      ),
+      children: (renderProps) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        startContent,
+        typeof children === "function" ? children(renderProps) : children,
+        endContent
+      ] })
+    }
+  );
+});
+function TabPanel(props) {
+  return /* @__PURE__ */ jsx(
+    TabPanel$1,
+    {
+      ...props,
+      className: composeRenderProps(
+        props.className,
+        (className, renderProps) => tabPanelStyles({ ...renderProps, className })
+      )
+    }
+  );
+}
+
+export { Tab, TabList, TabPanel, Tabs, TabsVariantContext, useTabsVariantContext };

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

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

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

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

package/dist/types/calendar/agnostic-calendar-state-context.d.ts

@@ -0,0 +1,3 @@
+import type { CalendarState, RangeCalendarState } from "react-stately";
+export declare const AgnosticCalendarStateContext: import("react").Context<CalendarState | RangeCalendarState>, useAgnosticCalendarStateContext: () => CalendarState | RangeCalendarState;
+//# sourceMappingURL=agnostic-calendar-state-context.d.ts.map

package/dist/types/calendar/agnostic-calendar-state-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"agnostic-calendar-state-context.d.ts","sourceRoot":"","sources":["../../../src/calendar/agnostic-calendar-state-context.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAA;AAItE,eAAO,MAAO,4BAA4B,+DAAE,+BAA+B,0CAIvE,CAAA"}

package/dist/types/calendar/calendar-bottom-content.d.ts

@@ -0,0 +1,4 @@
+import type { CalendarDate } from "@internationalized/date";
+import type { CalendarProps } from "./types";
+export declare const CalendarBottomContent: <T extends CalendarDate>({ bottomContent, showTodayButton, }: Pick<CalendarProps<T>, "bottomContent" | "showTodayButton">) => string | number | bigint | true | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=calendar-bottom-content.d.ts.map

package/dist/types/calendar/calendar-bottom-content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-bottom-content.d.ts","sourceRoot":"","sources":["../../../src/calendar/calendar-bottom-content.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAA;AAI3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAM5C,eAAO,MAAM,qBAAqB,GAAI,CAAC,SAAS,YAAY,uCAGzD,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,eAAe,GAAG,iBAAiB,CAAC,6VAkC7D,CAAA"}

package/dist/types/calendar/calendar-grid-header.d.ts

@@ -0,0 +1,2 @@
+export declare function CalendarGridHeader(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=calendar-grid-header.d.ts.map

package/dist/types/calendar/calendar-grid-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-grid-header.d.ts","sourceRoot":"","sources":["../../../src/calendar/calendar-grid-header.tsx"],"names":[],"mappings":"AASA,wBAAgB,kBAAkB,4CAiBjC"}

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

@@ -0,0 +1,6 @@
+interface CalendarHeaderProps {
+    offsetMonths?: number;
+}
+export declare function CalendarHeader({ offsetMonths }: CalendarHeaderProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=calendar-header.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-header.d.ts","sourceRoot":"","sources":["../../../src/calendar/calendar-header.tsx"],"names":[],"mappings":"AAYA,UAAU,mBAAmB;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,wBAAgB,cAAc,CAAC,EAAE,YAAgB,EAAE,EAAE,mBAAmB,2CA8DvE"}

package/dist/types/calendar/calendar-month-day-selector.d.ts

@@ -0,0 +1,2 @@
+export declare const CalendarMonthDaySelector: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=calendar-month-day-selector.d.ts.map

package/dist/types/calendar/calendar-month-day-selector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-month-day-selector.d.ts","sourceRoot":"","sources":["../../../src/calendar/calendar-month-day-selector.tsx"],"names":[],"mappings":"AAWA,eAAO,MAAM,wBAAwB,+CA2EpC,CAAA"}