d9-toast 2.5.37 → 2.5.39

package/README.md

@@ -75,7 +75,11 @@ export default function Root() {
 ```jsx
 import { toast } from "d9-toast";
 
-toast.success("Saved successfully!");
+// You can call it directly!
+const notify = () => toast("Simple notification");
+
+// Or use specific types
+const success = () => toast.success("Saved!");
 ```
 
 ✅ Works inside
@@ -97,6 +101,7 @@ import { toast } from "d9-toast";
 
 | Method                                      | Description         |
 | ------------------------------------------- | ------------------- |
+| `toast(msg, options)`                       | Show default toast  |
 | `toast.success(msg, options)`               | Show success toast  |
 | `toast.error(msg, options)`                 | Show error toast    |
 | `toast.info(msg, options)`                  | Show info toast     |

package/dist/Toast.js

@@ -110,7 +110,7 @@ var Toast = function Toast(_ref) {
     return actions.slice(0, 2).map(function (a, idx) {
       // Dynamic class names..
       var btnType = actions.length === 1 ? "action-btnA__".concat(type) : idx === 0 ? "action-btnB__".concat(type) : "action-btnA__".concat(type);
-      var classNameStr = "action-btn ".concat(theme === "colored" ? "" : btnType, " ").concat(a.className || "").trim();
+      var classNameStr = "action-btn ".concat(theme === "colored" ? theme : btnType, " ").concat(a.className || "").trim();
       return /*#__PURE__*/_jsx("button", {
         "aria-label": "Action ".concat(a.text),
         onClick: function onClick() {
@@ -129,8 +129,6 @@ var Toast = function Toast(_ref) {
 
   // Start auto-close timer.
   useEffect(function () {
-    // startTimer();
-
     // pause/resume when window focus changes.
     var handleBlur = function handleBlur() {
       return pauseOnFocusLoss && handlePause();
@@ -155,7 +153,6 @@ var Toast = function Toast(_ref) {
     dir: rtl ? "rtl" : "ltr",
     style: {
       bottom: position.includes("bottom") ? "0%" : ""
-      // zIndex: shouldExpand ? 9999 : 10 - stackIndex, // Dynamic Z-index for stacking...
     },
     children: /*#__PURE__*/_jsxs("div", {
       "data-stack": shouldExpand ? 0 : stackIndex,
@@ -174,7 +171,7 @@ var Toast = function Toast(_ref) {
         className: "toastHeader ".concat(type),
         children: [/*#__PURE__*/_jsxs("div", {
           className: "title",
-          children: [/*#__PURE__*/_jsx(Icons, {
+          children: [type !== "default" && /*#__PURE__*/_jsx(Icons, {
             name: type || "success"
           }), " ", /*#__PURE__*/_jsx("p", {
             children: type.toUpperCase()
@@ -193,11 +190,11 @@ var Toast = function Toast(_ref) {
         className: "toast-message__container",
         children: [/*#__PURE__*/_jsxs("div", {
           className: "toast-message",
-          children: [!title && /*#__PURE__*/_jsx(Icons, {
+          children: [!title && type !== "default" && /*#__PURE__*/_jsx(Icons, {
             name: type || "success",
             className: type
           }), /*#__PURE__*/_jsx("p", {
-            children: message
+            children: message || "No messages"
           })]
         }), closable && !title && /*#__PURE__*/_jsx("button", {
           className: "close-button",
@@ -213,19 +210,23 @@ var Toast = function Toast(_ref) {
         style: {
           padding: "4px"
         },
-        children: message
+        children: message || "No messages"
       }), actions.length > 0 && /*#__PURE__*/_jsx("div", {
         className: "toastActions",
         children: actionButtons
-      }), progress && duration !== 0 && autoClose && /*#__PURE__*/_jsx("div", {
+      }), duration !== 0 && autoClose && /*#__PURE__*/_jsx("div", {
         className: "progress-container ".concat(type),
+        style: {
+          opacity: progress ? 1 : 0,
+          height: progress ? "4px" : "0px"
+        },
         children: /*#__PURE__*/_jsx("div", {
           className: "toast-progress ".concat(type),
           onAnimationEnd: triggerExit,
           style: {
             animationDuration: "".concat(duration, "ms"),
             animationPlayState: isPaused ? "paused" : "running",
-            animationFillMode: rtl ? "backwards" : "forwards"
+            transformOrigin: rtl ? "right" : "left"
           }
         })
       })]

package/dist/ToastContext.js

@@ -42,59 +42,70 @@ var toastRef = null;
 
 // For public toast API.
 var warn = function warn() {
-  console.warn("ToastProvider is not mounted");
+  console.warn("D9-Toast: ToastProvider is not mounted. Ensure it wraps your app.");
   return undefined;
 };
-export var toast = {
-  sounds: sounds,
-  success: function success(msg) {
-    var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    return toastRef ? toastRef.showToast(_objectSpread({
-      type: "success",
-      message: msg !== null && msg !== void 0 ? msg : "No messages"
-    }, opts)) : warn();
-  },
-  error: function error(msg) {
-    var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    return toastRef ? toastRef.showToast(_objectSpread({
-      type: "error",
-      message: msg !== null && msg !== void 0 ? msg : "No messages"
-    }, opts)) : warn();
-  },
-  info: function info(msg) {
-    var _toastRef;
-    var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    return (_toastRef = toastRef) === null || _toastRef === void 0 ? void 0 : _toastRef.showToast(_objectSpread({
-      type: "info",
-      message: msg !== null && msg !== void 0 ? msg : "No messages"
-    }, opts));
-  },
-  warning: function warning(msg) {
-    var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    return toastRef ? toastRef.showToast(_objectSpread({
-      type: "warning",
-      message: msg !== null && msg !== void 0 ? msg : "No messages"
-    }, opts)) : warn();
-  },
-  promise: function promise(_promise, messages) {
-    var opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-    var defaultMessages = {
-      loading: "Loading...",
-      success: "Success",
-      error: "Error"
-    };
-    var finalMessages = messages && _typeof(messages) === "object" ? messages : defaultMessages;
-    return toastRef ? toastRef.promiseToast(_promise, finalMessages, opts) : warn();
-  },
-  dismiss: function dismiss(id) {
-    var _toastRef2;
-    return (_toastRef2 = toastRef) === null || _toastRef2 === void 0 ? void 0 : _toastRef2.removeToast(id);
-  },
-  dismissAll: function dismissAll() {
-    var _toastRef3;
-    return (_toastRef3 = toastRef) === null || _toastRef3 === void 0 ? void 0 : _toastRef3.removeToastAll();
-  }
+
+/** * CALLABLE API CORE */
+var toastBase = function toastBase(msg) {
+  var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return toastRef ? toastRef.showToast(_objectSpread({
+    type: "default",
+    title: false,
+    progress: false,
+    duration: 3000,
+    message: msg
+  }, opts)) : warn();
+};
+toastBase.sounds = sounds;
+toastBase.success = function (msg) {
+  var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return toastRef ? toastRef.showToast(_objectSpread({
+    type: "success",
+    message: msg,
+    progress: true
+  }, opts)) : warn();
+};
+toastBase.error = function (msg) {
+  var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return toastRef ? toastRef.showToast(_objectSpread({
+    type: "error",
+    message: msg
+  }, opts)) : warn();
+};
+toastBase.info = function (msg) {
+  var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return toastRef ? toastRef.showToast(_objectSpread({
+    type: "info",
+    message: msg
+  }, opts)) : warn();
+};
+toastBase.warning = function (msg) {
+  var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return toastRef ? toastRef.showToast(_objectSpread({
+    type: "warning",
+    message: msg
+  }, opts)) : warn();
+};
+toastBase.promise = function (promise, messages) {
+  var opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  var defaultMessages = {
+    loading: "Loading...",
+    success: "Success",
+    error: "Error"
+  };
+  var finalMessages = messages && _typeof(messages) === "object" ? messages : defaultMessages;
+  return toastRef ? toastRef.promiseToast(promise, finalMessages, opts) : warn();
+};
+toastBase.dismiss = function (id) {
+  var _toastRef;
+  return (_toastRef = toastRef) === null || _toastRef === void 0 ? void 0 : _toastRef.removeToast(id);
+};
+toastBase.dismissAll = function () {
+  var _toastRef2;
+  return (_toastRef2 = toastRef) === null || _toastRef2 === void 0 ? void 0 : _toastRef2.removeToastAll();
 };
+export var toast = toastBase;
 export var ToastProvider = function ToastProvider(_ref) {
   var children = _ref.children;
   var _useState = useState([]),

package/dist/d9-toast.d.ts

@@ -10,6 +10,7 @@ declare module "d9-toast" {
    * Controls icon, color, and default sound.
    */
   export type ToastType =
+    | "default"
     | "success"
     | "error"
     | "info"
@@ -178,16 +179,18 @@ declare module "d9-toast" {
   }
 
   /* =========================================
-   * Toast API (PUBLIC)
-   * ========================================= */
+     * Toast API (PUBLIC)
+     * ========================================= */
 
-  /**
-   * Public toast API used to trigger notifications.
-   */
-  export const toast: {
+  export interface ToastCallable {
     /**
-     * Default sound URLs used by the toast system.
-     */
+    * Show a default notification.
+    * Defaults: type="default", progress=false, duration=3000
+    * Usage: toast("Simple message")
+    */
+    (message: string | React.ReactNode, options?: ToastOptions): string | undefined;
+
+    /** Default sound URLs */
     sounds: {
       default: string;
       success: string;
@@ -196,73 +199,43 @@ declare module "d9-toast" {
       info: string;
     };
 
-    /**
-     * Show a success toast.
-     */
-    success(
-      message: string | React.ReactNode,
-      options?: ToastOptions
-    ): string | undefined;
+    /** Show a success toast */
+    success(message: string | React.ReactNode, options?: ToastOptions): string | undefined;
 
-    /**
-     * Show an error toast.
-     */
-    error(
-      message: string | React.ReactNode,
-      options?: ToastOptions
-    ): string | undefined;
+    /** Show an error toast */
+    error(message: string | React.ReactNode, options?: ToastOptions): string | undefined;
 
-    /**
-     * Show an info toast.
-     */
-    info(
-      message: string | React.ReactNode,
-      options?: ToastOptions
-    ): string | undefined;
+    /** Show an info toast */
+    info(message: string | React.ReactNode, options?: ToastOptions): string | undefined;
 
-    /**
-     * Show a warning toast.
-     */
-    warning(
-      message: string | React.ReactNode,
-      options?: ToastOptions
-    ): string | undefined;
+    /** Show a warning toast */
+    warning(message: string | React.ReactNode, options?: ToastOptions): string | undefined;
 
     /**
-        * Wraps a promise and updates the toast automatically.
-        */
+     * Wraps a promise and updates the toast automatically.
+     */
     promise<T>(
       promise: Promise<T> | (() => Promise<T>),
       messages: {
-        /**
-         * Message shown while the promise is pending.
-         */
         loading: string | React.ReactNode;
-
-        /**
-         * Message shown when the promise resolves.
-         */
         success: string | React.ReactNode | ((value: T) => string | React.ReactNode);
-
-        /**
-         * Message shown when the promise rejects.
-         */
         error: string | React.ReactNode | ((error: any) => string | React.ReactNode);
       },
       options?: ToastOptions
     ): Promise<T>;
 
-    /**
-     * Dismiss a toast by its id.
-     */
+    /** Dismiss a specific toast */
     dismiss(id: string): void;
 
-    /**
-     * Dismiss all active toasts.
-     */
+    /** Dismiss all toasts */
     dismissAll(): void;
-  };
+  }
 
+  /**
+   * Public toast API used to trigger notifications.
+   * Can be called directly as a function or via type-specific methods.
+   */
+  export const toast: ToastCallable;
   /* =========================================
    * Provider
    * ========================================= */

package/dist/toast.css

@@ -26,7 +26,6 @@
 
   --line-height-base: 1.5;
   --font-size-base: 14px;
-
 }
 
 /* Theme colors */
@@ -50,7 +49,6 @@
   --loading-bg: rgba(106, 31, 176, 0.1);
 
   --border-color: lch(91.6% 2.18 271.57);
-
 }
 
 .d9-toast.dark {
@@ -73,7 +71,6 @@
   --loading-bg: #ab4fff25;
 
   --border-color: #ffffff15;
-
 }
 
 /* Defaults */
@@ -143,7 +140,7 @@
 .toastContainer {
   position: relative;
   width: 100vw;
-  max-width: 425px;
+  max-width: 375px;
   min-height: 60px;
   pointer-events: none;
 }
@@ -171,7 +168,7 @@
   position: relative;
   top: 0;
   min-width: 250px;
-  max-width: 425px;
+  max-width: 375px;
   max-height: 425px;
   display: flex;
   flex-direction: column;
@@ -183,13 +180,24 @@
   font-size: var(--font-size-base);
   line-height: var(--line-height-base);
   text-align: start;
-  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
-    Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
+  font-family:
+    system-ui,
+    -apple-system,
+    BlinkMacSystemFont,
+    "Segoe UI",
+    Roboto,
+    Oxygen,
+    Ubuntu,
+    Cantarell,
+    "Open Sans",
+    "Helvetica Neue",
+    sans-serif;
   will-change: transform, opacity;
   background-color: var(--primary-bg);
   color: var(--primary-color);
   border: 1px solid var(--border-color);
-  transition: transform 650ms cubic-bezier(0.165, 0.84, 0.44, 1),
+  transition:
+    transform 650ms cubic-bezier(0.165, 0.84, 0.44, 1),
     opacity 300ms ease;
   pointer-events: auto;
 }
@@ -316,6 +324,11 @@
   filter: grayscale(1);
 }
 
+.colored {
+  color: #000000;
+  background-color: #ffffff;
+}
+
 /* Action button 1 */
 .action-btnA__success {
   color: var(--primary-bg);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "d9-toast",
-  "version": "2.5.37",
+  "version": "2.5.39",
   "description": "Customizable toast notifications for React",
   "homepage": "https://psathul073.github.io/d9-toast-docs/",
   "repository": {