@opengovsg/oui 0.0.25 → 0.0.27

package/dist/esm/toast/toast.js

@@ -0,0 +1,85 @@
+"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 { Spinner } from '../spinner/spinner.js';
+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';
+
+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
+      }),
+      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/index.d.mts

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

package/dist/types/index.d.ts

@@ -28,4 +28,5 @@ export * from "./pagination";
 export * from "./file-dropzone";
 export * from "./number-field";
 export * from "./modal";
+export * from "./toast";
 //# 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"}

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

@@ -26,36 +26,36 @@ export interface UseSpinnerProps extends Omit<HtmlUiProps, "children">, SpinnerV
 export declare const useSpinner: (originalProps: UseSpinnerProps) => {
     slots: {
         base: (slotProps?: ({
-            size?: "lg" | "md" | "sm" | undefined;
+            size?: "lg" | "md" | "sm" | "xs" | undefined;
             color?: "current" | "white" | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
         wrapper: (slotProps?: ({
-            size?: "lg" | "md" | "sm" | undefined;
+            size?: "lg" | "md" | "sm" | "xs" | undefined;
             color?: "current" | "white" | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
         circle1: (slotProps?: ({
-            size?: "lg" | "md" | "sm" | undefined;
+            size?: "lg" | "md" | "sm" | "xs" | undefined;
             color?: "current" | "white" | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
         circle2: (slotProps?: ({
-            size?: "lg" | "md" | "sm" | undefined;
+            size?: "lg" | "md" | "sm" | "xs" | undefined;
             color?: "current" | "white" | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
     } & {
         base: (slotProps?: ({
-            size?: "lg" | "md" | "sm" | undefined;
+            size?: "lg" | "md" | "sm" | "xs" | undefined;
             color?: "current" | "white" | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
         wrapper: (slotProps?: ({
-            size?: "lg" | "md" | "sm" | undefined;
+            size?: "lg" | "md" | "sm" | "xs" | undefined;
             color?: "current" | "white" | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
         circle1: (slotProps?: ({
-            size?: "lg" | "md" | "sm" | undefined;
+            size?: "lg" | "md" | "sm" | "xs" | undefined;
             color?: "current" | "white" | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
         circle2: (slotProps?: ({
-            size?: "lg" | "md" | "sm" | undefined;
+            size?: "lg" | "md" | "sm" | "xs" | undefined;
             color?: "current" | "white" | undefined;
         } & import("tailwind-variants").ClassProp<import("tailwind-merge").ClassNameValue>) | undefined) => string;
     } & {};