d9-toast 1.0.14 → 1.0.16

package/README.md

@@ -80,10 +80,8 @@ export default App;
 
 | Prop               | Type    | Default     | Description                                                                     |
 | ------------------ | ------- | ----------- | ------------------------------------------------------------------------------- |
-| `position`         | string  | `top-right` | Position of all toasts (`top-left`, `top-right`, `bottom-left`, `bottom-right`) |
-| `theme`            | string  | `light`     | Default theme for all toasts (`light` or `dark`)                                |
-| `pauseOnHover`     | boolean | `true`      | Pause toast timer on hover                                                      |
-| `pauseOnFocusLoss` | boolean | `true`      | Pause toast timer when window loses focus                                       |
+| `position`         | string  | `top-right` | Position of all toasts (`top-left`, `top-right`, `bottom-left`, `bottom-right`, `center`, `center-top`, `center-bottom` ) |
+
 
 ### 4. Toast Options
 
@@ -92,6 +90,9 @@ export default App;
 | `message`  | string  | -       | The message to display                                                     |
 | `type`     | string  | `info`  | Type of toast (`success`, `error`, `info`, `warning`, `loading`, `submit`) |
 | `duration` | number  | 5000    | Auto-close duration in ms (0 for infinite)                                 |
+| `theme`            | string  | `light`     | Default theme for all toasts (`light` or `dark`)                                |
+| `pauseOnHover`     | boolean | `true`      | Pause toast timer on hover                                                      |
+| `pauseOnFocusLoss` | boolean | `true`      | Pause toast timer when window loses focus                                       |
 | `actions`  | array   | []      | Array of action objects `{ text: string, callback: function }`             |
 | `closable` | boolean | true    | Show close button                                                          |
 | `progress` | boolean | true    | Show progress bar                                                          |

package/dist/Toast.js

@@ -148,10 +148,13 @@ var Toast = function Toast(_ref) {
           }, idx);
         })
       }), progress && duration !== 0 && /*#__PURE__*/_jsx("div", {
-        className: "toast-progress ".concat(type),
-        style: {
-          width: "".concat(progressWidth, "%")
-        }
+        className: "progress-container ".concat(type),
+        children: /*#__PURE__*/_jsx("div", {
+          className: "toast-progress ".concat(type),
+          style: {
+            width: "".concat(progressWidth, "%")
+          }
+        })
       })]
     })
   });

package/dist/toast.css

@@ -118,22 +118,37 @@
   border: 1px solid;
   cursor: pointer;
 }
-
-.toast-progress {
+.progress-container {
   position: absolute;
   bottom: 0;
   left: 0;
+  width: 100%;
   height: 0.25rem;
-  transition: width 0.1s linear;
   border-radius: 0 0 0.25rem 0.25rem;
+  background-color: rgba(220, 220, 220, 0.715);
   overflow: hidden;
 }
-.toast-progress::before {
-  content: "";
-  width: 100%;
+
+.progress-container.success {
+  background-color: oklch(62.7% 0.194 149.214 / 0.25);
+}
+.progress-container.error {
+  background-color: oklch(57.7% 0.245 27.325 / 0.25);
+}
+.progress-container.info {
+  background-color: oklch(54.6% 0.245 262.881 / 0.25);
+}
+.progress-container.warning {
+  background-color: oklch(68.1% 0.162 75.834 / 0.25);
+}
+.progress-container.loading,
+.progress-container.submit {
+  background-color: oklch(48.847% 0.03665 257.306 / 0.25);
+}
+
+.toast-progress {
   height: 0.25rem;
-  background-color: currentColor;
-  opacity: 0.5;
+  transition: width 0.1s linear;
 }
 
 .toast-progress.success {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "d9-toast",
-  "version": "1.0.14",
+  "version": "1.0.16",
   "description": "Customizable toast notifications for React",
   "main": "dist/index.js",
   "type": "module",