@trsys-tech/matrix-library 0.6.0 → 1.0.0-canary.0

package/dist/timepickercontent.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"timepickercontent.es.js","sources":["../src/components/date-picker/TimePickerContent.tsx"],"sourcesContent":["import { HTMLAttributes, useEffect, useRef, useState } from \"react\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\n\r\ntype Time = { hour: number; minute: number; ampm: \"AM\" | \"PM\" };\r\n\r\ntype TimePickerContentProps = {\r\n  time: Time | undefined;\r\n  isOpen: boolean;\r\n  onTimeChange: (time: Time | undefined) => void;\r\n  slotsProps?: {\r\n    content?: HTMLAttributes<HTMLDivElement>;\r\n  };\r\n};\r\n\r\nconst getNow = (): Time => {\r\n  return { hour: new Date().getHours() % 12, minute: new Date().getMinutes(), ampm: new Date().getHours() < 12 ? \"AM\" : \"PM\" };\r\n};\r\n\r\nconst TimePickerContent: React.FC<TimePickerContentProps> = ({ isOpen, time, onTimeChange, slotsProps }) => {\r\n  const [selectedtime, setSelectedTime] = useState<Time>(time ?? getNow());\r\n  const selectedTimeRef = useRef<Time>(selectedtime);\r\n\r\n  const hourRef = useRef<HTMLDivElement>(null);\r\n  const minuteRef = useRef<HTMLDivElement>(null);\r\n\r\n  const itemHeight = 32; // Assuming each item height is 40px\r\n  const marginBetweenItems = 8; // Assuming margin between each item is 8px\r\n\r\n  // Function to scroll to a specific hour\r\n  const scrollToHour = (index: number) => {\r\n    hourRef?.current?.scrollTo({\r\n      top: index * (itemHeight + marginBetweenItems),\r\n      behavior: \"smooth\",\r\n    });\r\n  };\r\n\r\n  // Function to scroll to a specific minute\r\n  const scrollToMinute = (index: number) => {\r\n    minuteRef?.current?.scrollTo({\r\n      top: index * (itemHeight + marginBetweenItems),\r\n      behavior: \"smooth\",\r\n    });\r\n  };\r\n\r\n  const handleSethour = (hour: number) => {\r\n    selectedTimeRef.current = { ...selectedtime, hour };\r\n    setSelectedTime(selectedTimeRef.current);\r\n    onTimeChange(selectedTimeRef.current);\r\n  };\r\n\r\n  const handleSetMinute = (minute: number) => {\r\n    selectedTimeRef.current = { ...selectedtime, minute };\r\n    setSelectedTime(selectedTimeRef.current);\r\n    onTimeChange(selectedTimeRef.current);\r\n  };\r\n\r\n  const handleSetAMPM = (ampm: \"AM\" | \"PM\") => {\r\n    selectedTimeRef.current = { ...selectedtime, ampm };\r\n    setSelectedTime(selectedTimeRef.current);\r\n    onTimeChange(selectedTimeRef.current);\r\n  };\r\n\r\n  useEffect(() => {\r\n    if (isOpen) {\r\n      setSelectedTime(time ?? getNow());\r\n    }\r\n  }, [isOpen, time]);\r\n\r\n  useEffect(() => {\r\n    // Center the selected hour/minute on mount\r\n    if (isOpen) {\r\n      setTimeout(() => {\r\n        scrollToHour(selectedTimeRef.current.hour - 1);\r\n        scrollToMinute(selectedTimeRef.current.minute);\r\n      });\r\n    }\r\n  }, [isOpen]);\r\n\r\n  return (\r\n    <div {...(slotsProps?.content ?? {})} className={cn(\"py-2 px-0 h-52 w-full flex justify-center gap-1\", slotsProps?.content?.className)}>\r\n      {/* Hour Selector */}\r\n      <div className=\"w-24 px-2 h-full relative overflow-auto thin-scrollbar\" ref={hourRef}>\r\n        {Array.from({ length: 12 }, (_, i) => i).map(hour => (\r\n          <button\r\n            style={{ height: itemHeight, marginBottom: marginBetweenItems }}\r\n            className={cn(\r\n              \"w-full flex justify-center items-center rounded-full text-xs font-bold text-text-400\",\r\n              hour + 1 === selectedtime.hour && \"bg-secondary\",\r\n            )}\r\n            key={hour + 1}\r\n            onClick={() => handleSethour(hour + 1)}\r\n          >\r\n            {(hour + 1).toString().padStart(2, \"0\")}\r\n          </button>\r\n        ))}\r\n      </div>\r\n\r\n      {/* Minute Selector */}\r\n      <div className=\"h-full w-24 px-2 relative overflow-auto thin-scrollbar\" ref={minuteRef}>\r\n        {Array.from({ length: 60 }, (_, i) => i).map(minute => (\r\n          <button\r\n            style={{ height: itemHeight, marginBottom: marginBetweenItems }}\r\n            className={cn(\r\n              \"w-full flex justify-center items-center rounded-full text-xs font-bold text-text-400\",\r\n              minute === selectedtime.minute && \"bg-secondary\",\r\n            )}\r\n            key={minute}\r\n            onClick={() => handleSetMinute(minute)}\r\n          >\r\n            {minute.toString().padStart(2, \"0\")}\r\n          </button>\r\n        ))}\r\n      </div>\r\n\r\n      {/* AM/PM Selector */}\r\n      <div className=\"h-full w-24 px-2 relative overflow-auto thin-scrollbar\">\r\n        {[\"AM\", \"PM\"].map(ampm => (\r\n          <button\r\n            style={{ height: itemHeight, marginBottom: marginBetweenItems }}\r\n            className={cn(\r\n              \"w-full flex justify-center items-center rounded-full text-xs font-bold text-text-400\",\r\n              ampm === selectedtime.ampm && \"bg-secondary\",\r\n            )}\r\n            key={ampm}\r\n            onClick={() => handleSetAMPM(ampm as \"AM\" | \"PM\")}\r\n          >\r\n            {ampm}\r\n          </button>\r\n        ))}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\nexport { TimePickerContent, type TimePickerContentProps, type Time };\r\n"],"names":["getNow","TimePickerContent","isOpen","time","onTimeChange","slotsProps","selectedtime","setSelectedTime","useState","selectedTimeRef","useRef","hourRef","minuteRef","itemHeight","marginBetweenItems","scrollToHour","index","scrollToMinute","handleSethour","hour","handleSetMinute","minute","handleSetAMPM","ampm","useEffect","jsxs","cn","jsx","_","i"],"mappings":"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"}
+{"version":3,"file":"timepickercontent.es.js","sources":["../src/components/date-picker/TimePickerContent.tsx"],"sourcesContent":["import { HTMLAttributes, useEffect, useRef, useState } from \"react\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\n\r\ntype Time = { hour: number; minute: number; ampm: \"AM\" | \"PM\" };\r\n\r\ntype TimePickerContentProps = {\r\n  time: Time | undefined;\r\n  isOpen: boolean;\r\n  onTimeChange: (time: Time | undefined) => void;\r\n  slotsProps?: {\r\n    content?: HTMLAttributes<HTMLDivElement>;\r\n  };\r\n};\r\n\r\nconst getNow = (): Time => {\r\n  return { hour: new Date().getHours() % 12, minute: new Date().getMinutes(), ampm: new Date().getHours() < 12 ? \"AM\" : \"PM\" };\r\n};\r\n\r\nconst TimePickerContent: React.FC<TimePickerContentProps> = ({ isOpen, time, onTimeChange, slotsProps }) => {\r\n  const [selectedtime, setSelectedTime] = useState<Time>(time ?? getNow());\r\n  const selectedTimeRef = useRef<Time>(selectedtime);\r\n\r\n  const hourRef = useRef<HTMLDivElement>(null);\r\n  const minuteRef = useRef<HTMLDivElement>(null);\r\n\r\n  const itemHeight = 32; // Assuming each item height is 40px\r\n  const marginBetweenItems = 8; // Assuming margin between each item is 8px\r\n\r\n  // Function to scroll to a specific hour\r\n  const scrollToHour = (index: number) => {\r\n    hourRef?.current?.scrollTo({\r\n      top: index * (itemHeight + marginBetweenItems),\r\n      behavior: \"smooth\",\r\n    });\r\n  };\r\n\r\n  // Function to scroll to a specific minute\r\n  const scrollToMinute = (index: number) => {\r\n    minuteRef?.current?.scrollTo({\r\n      top: index * (itemHeight + marginBetweenItems),\r\n      behavior: \"smooth\",\r\n    });\r\n  };\r\n\r\n  const handleSethour = (hour: number) => {\r\n    selectedTimeRef.current = { ...selectedtime, hour };\r\n    setSelectedTime(selectedTimeRef.current);\r\n    onTimeChange(selectedTimeRef.current);\r\n  };\r\n\r\n  const handleSetMinute = (minute: number) => {\r\n    selectedTimeRef.current = { ...selectedtime, minute };\r\n    setSelectedTime(selectedTimeRef.current);\r\n    onTimeChange(selectedTimeRef.current);\r\n  };\r\n\r\n  const handleSetAMPM = (ampm: \"AM\" | \"PM\") => {\r\n    selectedTimeRef.current = { ...selectedtime, ampm };\r\n    setSelectedTime(selectedTimeRef.current);\r\n    onTimeChange(selectedTimeRef.current);\r\n  };\r\n\r\n  useEffect(() => {\r\n    if (isOpen) {\r\n      setSelectedTime(time ?? getNow());\r\n    }\r\n  }, [isOpen, time]);\r\n\r\n  useEffect(() => {\r\n    // Center the selected hour/minute on mount\r\n    if (isOpen) {\r\n      setTimeout(() => {\r\n        scrollToHour(selectedTimeRef.current.hour - 1);\r\n        scrollToMinute(selectedTimeRef.current.minute);\r\n      });\r\n    }\r\n  }, [isOpen]);\r\n\r\n  return (\r\n    <div\r\n      {...(slotsProps?.content ?? {})}\r\n      className={cn(\"mtx-py-2 mtx-px-0 mtx-h-52 mtx-w-full mtx-flex mtx-justify-center mtx-gap-1\", slotsProps?.content?.className)}\r\n    >\r\n      {/* Hour Selector */}\r\n      <div className=\"mtx-w-24 mtx-px-2 mtx-h-full mtx-relative mtx-overflow-auto mtx-thin-scrollbar\" ref={hourRef}>\r\n        {Array.from({ length: 12 }, (_, i) => i).map(hour => (\r\n          <button\r\n            style={{ height: itemHeight, marginBottom: marginBetweenItems }}\r\n            className={cn(\r\n              \"mtx-w-full mtx-flex mtx-justify-center mtx-items-center mtx-rounded-full mtx-text-xs mtx-font-bold mtx-text-text-400\",\r\n              hour + 1 === selectedtime.hour && \"mtx-bg-secondary\",\r\n            )}\r\n            key={hour + 1}\r\n            onClick={() => handleSethour(hour + 1)}\r\n          >\r\n            {(hour + 1).toString().padStart(2, \"0\")}\r\n          </button>\r\n        ))}\r\n      </div>\r\n\r\n      {/* Minute Selector */}\r\n      <div className=\"mtx-h-full mtx-w-24 mtx-px-2 mtx-relative mtx-overflow-auto mtx-thin-scrollbar\" ref={minuteRef}>\r\n        {Array.from({ length: 60 }, (_, i) => i).map(minute => (\r\n          <button\r\n            style={{ height: itemHeight, marginBottom: marginBetweenItems }}\r\n            className={cn(\r\n              \"mtx-w-full mtx-flex mtx-justify-center mtx-items-center mtx-rounded-full mtx-text-xs mtx-font-bold mtx-text-text-400\",\r\n              minute === selectedtime.minute && \"mtx-bg-secondary\",\r\n            )}\r\n            key={minute}\r\n            onClick={() => handleSetMinute(minute)}\r\n          >\r\n            {minute.toString().padStart(2, \"0\")}\r\n          </button>\r\n        ))}\r\n      </div>\r\n\r\n      {/* AM/PM Selector */}\r\n      <div className=\"mtx-h-full mtx-w-24 mtx-px-2 mtx-relative mtx-overflow-auto mtx-thin-scrollbar\">\r\n        {[\"AM\", \"PM\"].map(ampm => (\r\n          <button\r\n            style={{ height: itemHeight, marginBottom: marginBetweenItems }}\r\n            className={cn(\r\n              \"mtx-w-full mtx-flex mtx-justify-center mtx-items-center mtx-rounded-full mtx-text-xs mtx-font-bold mtx-text-text-400\",\r\n              ampm === selectedtime.ampm && \"mtx-bg-secondary\",\r\n            )}\r\n            key={ampm}\r\n            onClick={() => handleSetAMPM(ampm as \"AM\" | \"PM\")}\r\n          >\r\n            {ampm}\r\n          </button>\r\n        ))}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\nexport { TimePickerContent, type TimePickerContentProps, type Time };\r\n"],"names":["getNow","TimePickerContent","isOpen","time","onTimeChange","slotsProps","selectedtime","setSelectedTime","useState","selectedTimeRef","useRef","hourRef","minuteRef","itemHeight","marginBetweenItems","scrollToHour","index","scrollToMinute","handleSethour","hour","handleSetMinute","minute","handleSetAMPM","ampm","useEffect","jsxs","cn","jsx","_","i"],"mappings":"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"}

package/dist/toast-components.es.js

@@ -1,66 +1,69 @@
-import { jsx as r } from "react/jsx-runtime";
-import * as s from "react";
-import * as e from "@radix-ui/react-toast";
-import { tv as d } from "tailwind-variants";
-import { cn as n } from "./utils.es.js";
-import { XMark as l } from "@trsys-tech/matrix-icons";
-const y = e.Provider, c = s.forwardRef(({ className: a, ...t }, o) => /* @__PURE__ */ r(
-  e.Viewport,
+import { jsx as o } from "react/jsx-runtime";
+import * as r from "react";
+import * as t from "@radix-ui/react-toast";
+import { tv as n } from "tailwind-variants";
+import { cn as s } from "./utils.es.js";
+import { XMark as i } from "@trsys-tech/matrix-icons";
+const y = t.Provider, d = r.forwardRef(({ className: e, ...a }, m) => /* @__PURE__ */ o(
+  t.Viewport,
   {
-    ref: o,
-    className: n("fixed z-[100] flex flex-col-reverse gap-3 max-h-dscreen w-full p-4 top-0 right-0 md:max-w-[420px] ", a),
-    ...t
+    ref: m,
+    className: s(
+      "mtx-fixed mtx-z-[100] mtx-flex mtx-flex-col-reverse mtx-gap-3 mtx-max-h-dscreen mtx-w-full mtx-p-4 mtx-top-0 mtx-right-0 md:mtx-max-w-[420px] ",
+      e
+    ),
+    ...a
   }
 ));
-c.displayName = e.Viewport.displayName;
-const p = d({
-  base: "group pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-lg border p-4 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full",
+d.displayName = t.Viewport.displayName;
+const l = n({
+  base: "mtx-group mtx-pointer-events-auto mtx-relative mtx-flex mtx-w-full mtx-items-center mtx-justify-between mtx-space-x-2 mtx-overflow-hidden mtx-rounded-lg mtx-border mtx-p-4 mtx-shadow-lg mtx-transition-all data-[swipe=cancel]:mtx-translate-x-0 data-[swipe=end]:mtx-translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:mtx-translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:mtx-transition-none data-[state=open]:mtx-animate-in data-[state=closed]:mtx-animate-out data-[swipe=end]:mtx-animate-out data-[state=closed]:mtx-fade-out-80 data-[state=closed]:mtx-slide-out-to-right-full data-[state=open]:mtx-slide-in-from-top-full",
   // data-[state=open]:sm:slide-in-from-bottom-full
   variants: {
     variant: {
-      default: "border bg-background text-foreground",
-      danger: "danger group border-danger bg-danger-400 text-danger-800",
-      success: "success group border-success bg-success-400 text-success-800",
-      warning: "warning group border-warning bg-warning-400 text-warning-800",
-      info: "info group border-info bg-info-400 text-info-700"
+      default: "mtx-border mtx-bg-background mtx-text-foreground",
+      danger: "mtx-danger mtx-group mtx-border-danger mtx-bg-danger-400 mtx-text-danger-800",
+      success: "mtx-success mtx-group mtx-border-success mtx-bg-success-400 mtx-text-success-800",
+      warning: "mtx-warning mtx-group mtx-border-warning mtx-bg-warning-400 mtx-text-warning-800",
+      info: "mtx-info mtx-group mtx-border-info mtx-bg-info-400 mtx-text-info-700"
     }
   },
   defaultVariants: {
     variant: "default"
   }
-}), g = s.forwardRef(({ className: a, variant: t, ...o }, i) => /* @__PURE__ */ r(e.Root, { ref: i, className: n(p({ variant: t }), a), ...o }));
-g.displayName = e.Root.displayName;
-const m = s.forwardRef(
-  ({ className: a, ...t }, o) => /* @__PURE__ */ r(
-    e.Action,
+}), c = r.forwardRef(({ className: e, variant: a, ...m }, x) => /* @__PURE__ */ o(t.Root, { ref: x, className: s(l({ variant: a }), e), ...m }));
+c.displayName = t.Root.displayName;
+const p = r.forwardRef(
+  ({ className: e, ...a }, m) => /* @__PURE__ */ o(
+    t.Action,
     {
-      ref: o,
-      className: n(
-        "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium transition-colors hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring disabled:pointer-events-none disabled:opacity-50 group-[.danger]:border-muted/40 group-[.danger]:hover:border-danger/30 group-[.danger]:hover:bg-danger group-[.danger]:hover:text-danger-foreground group-[.danger]:focus:ring-danger",
-        a
+      ref: m,
+      className: s(
+        "mtx-inline-flex mtx-h-8 mtx-shrink-0 mtx-items-center mtx-justify-center mtx-rounded-md mtx-border mtx-bg-transparent mtx-px-3 mtx-text-sm mtx-font-medium mtx-transition-colors hover:mtx-bg-secondary focus:mtx-outline-none focus:mtx-ring-1 focus:mtx-ring-ring disabled:mtx-pointer-events-none disabled:mtx-opacity-50 group-[.danger]:mtx-border-muted/40 group-[.danger]:hover:mtx-border-danger/30 group-[.danger]:hover:mtx-bg-danger group-[.danger]:hover:mtx-text-danger-foreground group-[.danger]:focus:mtx-ring-danger",
+        e
       ),
-      ...t
+      ...a
     }
   )
 );
-m.displayName = e.Action.displayName;
-const f = s.forwardRef(
-  ({ className: a, ...t }, o) => /* @__PURE__ */ r(e.Close, { ref: o, className: n("focus:outline-none focus:ring-none", a), "toast-close": "", ...t, children: /* @__PURE__ */ r(l, { className: "h-5 w-5" }) })
+p.displayName = t.Action.displayName;
+const g = r.forwardRef(
+  ({ className: e, ...a }, m) => /* @__PURE__ */ o(t.Close, { ref: m, className: s("focus:mtx-outline-none focus:mtx-ring-none", e), "toast-close": "", ...a, children: /* @__PURE__ */ o(i, { className: "mtx-h-5 mtx-w-5" }) })
 );
-f.displayName = e.Close.displayName;
-const u = s.forwardRef(
-  ({ className: a, ...t }, o) => /* @__PURE__ */ r(e.Title, { ref: o, className: n("text-xs font-semibold leading-5 [&+div]:text-xs", a), ...t })
+g.displayName = t.Close.displayName;
+const f = r.forwardRef(
+  ({ className: e, ...a }, m) => /* @__PURE__ */ o(t.Title, { ref: m, className: s("mtx-text-xs mtx-font-semibold mtx-leading-5 [&+div]:mtx-text-xs", e), ...a })
 );
-u.displayName = e.Title.displayName;
-const x = s.forwardRef(({ className: a, ...t }, o) => /* @__PURE__ */ r(e.Description, { ref: o, className: n("text-sm opacity-90", a), ...t }));
-x.displayName = e.Description.displayName;
+f.displayName = t.Title.displayName;
+const u = r.forwardRef(({ className: e, ...a }, m) => /* @__PURE__ */ o(t.Description, { ref: m, className: s("mtx-text-sm mtx-opacity-90", e), ...a }));
+u.displayName = t.Description.displayName;
 export {
-  g as Toast,
-  m as ToastAction,
-  f as ToastClose,
-  x as ToastDescription,
+  c as Toast,
+  p as ToastAction,
+  g as ToastClose,
+  u as ToastDescription,
   y as ToastProvider,
-  u as ToastTitle,
-  c as ToastViewport
+  f as ToastTitle,
+  d as ToastViewport
 };
 //# sourceMappingURL=toast-components.es.js.map

package/dist/toast-components.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"toast-components.es.js","sources":["../src/components/toast/toast-components.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as ToastPrimitives from \"@radix-ui/react-toast\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\n\nimport { cn } from \"../../lib/utils\";\nimport { XMark } from \"@trsys-tech/matrix-icons\";\n\nconst ToastProvider = ToastPrimitives.Provider;\n\nconst ToastViewport = React.forwardRef<\n  React.ElementRef<typeof ToastPrimitives.Viewport>,\n  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>\n>(({ className, ...props }, ref) => (\n  <ToastPrimitives.Viewport\n    ref={ref}\n    className={cn(\"fixed z-[100] flex flex-col-reverse gap-3 max-h-dscreen w-full p-4 top-0 right-0 md:max-w-[420px] \", className)}\n    {...props}\n  />\n));\nToastViewport.displayName = ToastPrimitives.Viewport.displayName;\n\nconst toastVariants = tv({\n  base: \"group pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-lg border p-4 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full\", // data-[state=open]:sm:slide-in-from-bottom-full\n  variants: {\n    variant: {\n      default: \"border bg-background text-foreground\",\n      danger: \"danger group border-danger bg-danger-400 text-danger-800\",\n      success: \"success group border-success bg-success-400 text-success-800\",\n      warning: \"warning group border-warning bg-warning-400 text-warning-800\",\n      info: \"info group border-info bg-info-400 text-info-700\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n});\n\ntype ToastVariant = VariantProps<typeof toastVariants>[\"variant\"];\n\nconst Toast = React.forwardRef<\n  React.ElementRef<typeof ToastPrimitives.Root>,\n  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> & VariantProps<typeof toastVariants>\n>(({ className, variant, ...props }, ref) => {\n  return <ToastPrimitives.Root ref={ref} className={cn(toastVariants({ variant }), className)} {...props} />;\n});\nToast.displayName = ToastPrimitives.Root.displayName;\n\nconst ToastAction = React.forwardRef<React.ElementRef<typeof ToastPrimitives.Action>, React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>>(\n  ({ className, ...props }, ref) => (\n    <ToastPrimitives.Action\n      ref={ref}\n      className={cn(\n        \"inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium transition-colors hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring disabled:pointer-events-none disabled:opacity-50 group-[.danger]:border-muted/40 group-[.danger]:hover:border-danger/30 group-[.danger]:hover:bg-danger group-[.danger]:hover:text-danger-foreground group-[.danger]:focus:ring-danger\",\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nToastAction.displayName = ToastPrimitives.Action.displayName;\n\nconst ToastClose = React.forwardRef<React.ElementRef<typeof ToastPrimitives.Close>, React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>>(\n  ({ className, ...props }, ref) => (\n    <ToastPrimitives.Close ref={ref} className={cn(\"focus:outline-none focus:ring-none\", className)} toast-close=\"\" {...props}>\n      <XMark className=\"h-5 w-5\" />\n    </ToastPrimitives.Close>\n  ),\n);\nToastClose.displayName = ToastPrimitives.Close.displayName;\n\nconst ToastTitle = React.forwardRef<React.ElementRef<typeof ToastPrimitives.Title>, React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>>(\n  ({ className, ...props }, ref) => (\n    <ToastPrimitives.Title ref={ref} className={cn(\"text-xs font-semibold leading-5 [&+div]:text-xs\", className)} {...props} />\n  ),\n);\nToastTitle.displayName = ToastPrimitives.Title.displayName;\n\nconst ToastDescription = React.forwardRef<\n  React.ElementRef<typeof ToastPrimitives.Description>,\n  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>\n>(({ className, ...props }, ref) => <ToastPrimitives.Description ref={ref} className={cn(\"text-sm opacity-90\", className)} {...props} />);\nToastDescription.displayName = ToastPrimitives.Description.displayName;\n\ntype ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;\n\ntype ToastActionElement = React.ReactElement<typeof ToastAction>;\n\nexport {\n  type ToastProps,\n  type ToastActionElement,\n  type ToastVariant,\n  ToastProvider,\n  ToastViewport,\n  Toast,\n  ToastTitle,\n  ToastDescription,\n  ToastClose,\n  ToastAction,\n};\n"],"names":["ToastProvider","ToastPrimitives","ToastViewport","React","className","props","ref","jsx","cn","toastVariants","tv","Toast","variant","ToastAction","ToastClose","XMark","ToastTitle","ToastDescription"],"mappings":";;;;;;AASA,MAAMA,IAAgBC,EAAgB,UAEhCC,IAAgBC,EAAM,WAG1B,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAACN,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAK;AAAA,IACA,WAAWE,EAAG,sGAAsGJ,CAAS;AAAA,IAC5H,GAAGC;AAAA,EAAA;AACN,CACD;AACDH,EAAc,cAAcD,EAAgB,SAAS;AAErD,MAAMQ,IAAgBC,EAAG;AAAA,EACvB,MAAM;AAAA;AAAA,EACN,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,IAAA;AAAA,EACR;AAAA,EAEF,iBAAiB;AAAA,IACf,SAAS;AAAA,EAAA;AAEb,CAAC,GAIKC,IAAQR,EAAM,WAGlB,CAAC,EAAE,WAAAC,GAAW,SAAAQ,GAAS,GAAGP,EAAA,GAASC,MAC5B,gBAAAC,EAACN,EAAgB,MAAhB,EAAqB,KAAAK,GAAU,WAAWE,EAAGC,EAAc,EAAE,SAAAG,GAAS,GAAGR,CAAS,GAAI,GAAGC,EAAA,CAAO,CACzG;AACDM,EAAM,cAAcV,EAAgB,KAAK;AAEzC,MAAMY,IAAcV,EAAM;AAAA,EACxB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MACxB,gBAAAC;AAAA,IAACN,EAAgB;AAAA,IAAhB;AAAA,MACC,KAAAK;AAAA,MACA,WAAWE;AAAA,QACT;AAAA,QACAJ;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AACAQ,EAAY,cAAcZ,EAAgB,OAAO;AAEjD,MAAMa,IAAaX,EAAM;AAAA,EACvB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MACxB,gBAAAC,EAACN,EAAgB,OAAhB,EAAsB,KAAAK,GAAU,WAAWE,EAAG,sCAAsCJ,CAAS,GAAG,eAAY,IAAI,GAAGC,GAClH,UAAA,gBAAAE,EAACQ,GAAA,EAAM,WAAU,UAAA,CAAU,EAAA,CAC7B;AAEJ;AACAD,EAAW,cAAcb,EAAgB,MAAM;AAE/C,MAAMe,IAAab,EAAM;AAAA,EACvB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MACxB,gBAAAC,EAACN,EAAgB,OAAhB,EAAsB,KAAAK,GAAU,WAAWE,EAAG,mDAAmDJ,CAAS,GAAI,GAAGC,EAAA,CAAO;AAE7H;AACAW,EAAW,cAAcf,EAAgB,MAAM;AAE/C,MAAMgB,IAAmBd,EAAM,WAG7B,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAAQ,gBAAAC,EAACN,EAAgB,aAAhB,EAA4B,KAAAK,GAAU,WAAWE,EAAG,sBAAsBJ,CAAS,GAAI,GAAGC,GAAO,CAAE;AACxIY,EAAiB,cAAchB,EAAgB,YAAY;"}
+{"version":3,"file":"toast-components.es.js","sources":["../src/components/toast/toast-components.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as ToastPrimitives from \"@radix-ui/react-toast\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\n\nimport { cn } from \"../../lib/utils\";\nimport { XMark } from \"@trsys-tech/matrix-icons\";\n\nconst ToastProvider = ToastPrimitives.Provider;\n\nconst ToastViewport = React.forwardRef<\n  React.ElementRef<typeof ToastPrimitives.Viewport>,\n  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>\n>(({ className, ...props }, ref) => (\n  <ToastPrimitives.Viewport\n    ref={ref}\n    className={cn(\n      \"mtx-fixed mtx-z-[100] mtx-flex mtx-flex-col-reverse mtx-gap-3 mtx-max-h-dscreen mtx-w-full mtx-p-4 mtx-top-0 mtx-right-0 md:mtx-max-w-[420px] \",\n      className,\n    )}\n    {...props}\n  />\n));\nToastViewport.displayName = ToastPrimitives.Viewport.displayName;\n\nconst toastVariants = tv({\n  base: \"mtx-group mtx-pointer-events-auto mtx-relative mtx-flex mtx-w-full mtx-items-center mtx-justify-between mtx-space-x-2 mtx-overflow-hidden mtx-rounded-lg mtx-border mtx-p-4 mtx-shadow-lg mtx-transition-all data-[swipe=cancel]:mtx-translate-x-0 data-[swipe=end]:mtx-translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:mtx-translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:mtx-transition-none data-[state=open]:mtx-animate-in data-[state=closed]:mtx-animate-out data-[swipe=end]:mtx-animate-out data-[state=closed]:mtx-fade-out-80 data-[state=closed]:mtx-slide-out-to-right-full data-[state=open]:mtx-slide-in-from-top-full\", // data-[state=open]:sm:slide-in-from-bottom-full\n  variants: {\n    variant: {\n      default: \"mtx-border mtx-bg-background mtx-text-foreground\",\n      danger: \"mtx-danger mtx-group mtx-border-danger mtx-bg-danger-400 mtx-text-danger-800\",\n      success: \"mtx-success mtx-group mtx-border-success mtx-bg-success-400 mtx-text-success-800\",\n      warning: \"mtx-warning mtx-group mtx-border-warning mtx-bg-warning-400 mtx-text-warning-800\",\n      info: \"mtx-info mtx-group mtx-border-info mtx-bg-info-400 mtx-text-info-700\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n});\n\ntype ToastVariant = VariantProps<typeof toastVariants>[\"variant\"];\n\nconst Toast = React.forwardRef<\n  React.ElementRef<typeof ToastPrimitives.Root>,\n  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> & VariantProps<typeof toastVariants>\n>(({ className, variant, ...props }, ref) => {\n  return <ToastPrimitives.Root ref={ref} className={cn(toastVariants({ variant }), className)} {...props} />;\n});\nToast.displayName = ToastPrimitives.Root.displayName;\n\nconst ToastAction = React.forwardRef<React.ElementRef<typeof ToastPrimitives.Action>, React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>>(\n  ({ className, ...props }, ref) => (\n    <ToastPrimitives.Action\n      ref={ref}\n      className={cn(\n        \"mtx-inline-flex mtx-h-8 mtx-shrink-0 mtx-items-center mtx-justify-center mtx-rounded-md mtx-border mtx-bg-transparent mtx-px-3 mtx-text-sm mtx-font-medium mtx-transition-colors hover:mtx-bg-secondary focus:mtx-outline-none focus:mtx-ring-1 focus:mtx-ring-ring disabled:mtx-pointer-events-none disabled:mtx-opacity-50 group-[.danger]:mtx-border-muted/40 group-[.danger]:hover:mtx-border-danger/30 group-[.danger]:hover:mtx-bg-danger group-[.danger]:hover:mtx-text-danger-foreground group-[.danger]:focus:mtx-ring-danger\",\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nToastAction.displayName = ToastPrimitives.Action.displayName;\n\nconst ToastClose = React.forwardRef<React.ElementRef<typeof ToastPrimitives.Close>, React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>>(\n  ({ className, ...props }, ref) => (\n    <ToastPrimitives.Close ref={ref} className={cn(\"focus:mtx-outline-none focus:mtx-ring-none\", className)} toast-close=\"\" {...props}>\n      <XMark className=\"mtx-h-5 mtx-w-5\" />\n    </ToastPrimitives.Close>\n  ),\n);\nToastClose.displayName = ToastPrimitives.Close.displayName;\n\nconst ToastTitle = React.forwardRef<React.ElementRef<typeof ToastPrimitives.Title>, React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>>(\n  ({ className, ...props }, ref) => (\n    <ToastPrimitives.Title ref={ref} className={cn(\"mtx-text-xs mtx-font-semibold mtx-leading-5 [&+div]:mtx-text-xs\", className)} {...props} />\n  ),\n);\nToastTitle.displayName = ToastPrimitives.Title.displayName;\n\nconst ToastDescription = React.forwardRef<\n  React.ElementRef<typeof ToastPrimitives.Description>,\n  React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>\n>(({ className, ...props }, ref) => <ToastPrimitives.Description ref={ref} className={cn(\"mtx-text-sm mtx-opacity-90\", className)} {...props} />);\nToastDescription.displayName = ToastPrimitives.Description.displayName;\n\ntype ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;\n\ntype ToastActionElement = React.ReactElement<typeof ToastAction>;\n\nexport {\n  type ToastProps,\n  type ToastActionElement,\n  type ToastVariant,\n  ToastProvider,\n  ToastViewport,\n  Toast,\n  ToastTitle,\n  ToastDescription,\n  ToastClose,\n  ToastAction,\n};\n"],"names":["ToastProvider","ToastPrimitives","ToastViewport","React","className","props","ref","jsx","cn","toastVariants","tv","Toast","variant","ToastAction","ToastClose","XMark","ToastTitle","ToastDescription"],"mappings":";;;;;;AASA,MAAMA,IAAgBC,EAAgB,UAEhCC,IAAgBC,EAAM,WAG1B,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAACN,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAK;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAJ;AAAA,IAAA;AAAA,IAED,GAAGC;AAAA,EAAA;AACN,CACD;AACDH,EAAc,cAAcD,EAAgB,SAAS;AAErD,MAAMQ,IAAgBC,EAAG;AAAA,EACvB,MAAM;AAAA;AAAA,EACN,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,IAAA;AAAA,EACR;AAAA,EAEF,iBAAiB;AAAA,IACf,SAAS;AAAA,EAAA;AAEb,CAAC,GAIKC,IAAQR,EAAM,WAGlB,CAAC,EAAE,WAAAC,GAAW,SAAAQ,GAAS,GAAGP,EAAA,GAASC,MAC5B,gBAAAC,EAACN,EAAgB,MAAhB,EAAqB,KAAAK,GAAU,WAAWE,EAAGC,EAAc,EAAE,SAAAG,GAAS,GAAGR,CAAS,GAAI,GAAGC,EAAA,CAAO,CACzG;AACDM,EAAM,cAAcV,EAAgB,KAAK;AAEzC,MAAMY,IAAcV,EAAM;AAAA,EACxB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MACxB,gBAAAC;AAAA,IAACN,EAAgB;AAAA,IAAhB;AAAA,MACC,KAAAK;AAAA,MACA,WAAWE;AAAA,QACT;AAAA,QACAJ;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AACAQ,EAAY,cAAcZ,EAAgB,OAAO;AAEjD,MAAMa,IAAaX,EAAM;AAAA,EACvB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MACxB,gBAAAC,EAACN,EAAgB,OAAhB,EAAsB,KAAAK,GAAU,WAAWE,EAAG,8CAA8CJ,CAAS,GAAG,eAAY,IAAI,GAAGC,GAC1H,UAAA,gBAAAE,EAACQ,GAAA,EAAM,WAAU,kBAAA,CAAkB,EAAA,CACrC;AAEJ;AACAD,EAAW,cAAcb,EAAgB,MAAM;AAE/C,MAAMe,IAAab,EAAM;AAAA,EACvB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MACxB,gBAAAC,EAACN,EAAgB,OAAhB,EAAsB,KAAAK,GAAU,WAAWE,EAAG,mEAAmEJ,CAAS,GAAI,GAAGC,EAAA,CAAO;AAE7I;AACAW,EAAW,cAAcf,EAAgB,MAAM;AAE/C,MAAMgB,IAAmBd,EAAM,WAG7B,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAAQ,gBAAAC,EAACN,EAAgB,aAAhB,EAA4B,KAAAK,GAAU,WAAWE,EAAG,8BAA8BJ,CAAS,GAAI,GAAGC,GAAO,CAAE;AAChJY,EAAiB,cAAchB,EAAgB,YAAY;"}

package/dist/toast.es.js

@@ -1,40 +1,40 @@
-import { jsxs as s, jsx as o } from "react/jsx-runtime";
+import { jsxs as t, jsx as o } from "react/jsx-runtime";
 import { useEffect as l } from "react";
-import { ToastProvider as p, Toast as d, ToastTitle as T, ToastClose as h, ToastViewport as u } from "./toast-components.es.js";
-import { useToasts as w, toastParams as C } from "./use-toast.es.js";
-import { InfoCircleIcon as N } from "./infocircleicon.es.js";
-import { SuccessCircleIcon as g } from "./successcircleicon.es.js";
-import { WarningCircleIcon as I } from "./warningcircleicon.es.js";
-import { DangerCircleIcon as x } from "./dangercircleicon.es.js";
-function P({ limit: i = 3, duration: m = 5e3, slotProps: e }) {
-  const { toasts: a, removeToast: n } = w();
+import { ToastProvider as p, Toast as x, ToastTitle as d, ToastClose as T, ToastViewport as h } from "./toast-components.es.js";
+import { useToasts as u, toastParams as w } from "./use-toast.es.js";
+import { InfoCircleIcon as C } from "./infocircleicon.es.js";
+import { SuccessCircleIcon as N } from "./successcircleicon.es.js";
+import { WarningCircleIcon as g } from "./warningcircleicon.es.js";
+import { DangerCircleIcon as I } from "./dangercircleicon.es.js";
+function P({ limit: m = 3, duration: c = 5e3, slotProps: e }) {
+  const { toasts: a, removeToast: n } = u();
   return l(() => {
-    i !== void 0 && (C.limit = i);
-  }, [i]), /* @__PURE__ */ s(p, { duration: m, ...e?.providerProps ?? {}, children: [
-    Array.from(a).map(([t, { message: c, variant: r }]) => /* @__PURE__ */ s(
-      d,
+    m !== void 0 && (w.limit = m);
+  }, [m]), /* @__PURE__ */ t(p, { duration: c, ...e?.providerProps ?? {}, children: [
+    Array.from(a).map(([s, { message: i, variant: r }]) => /* @__PURE__ */ t(
+      x,
       {
         variant: r,
         onOpenChange: (f) => {
-          f || setTimeout(() => n(t), 100);
+          f || setTimeout(() => n(s), 100);
         },
         ...e?.itemProps ?? {},
         children: [
-          /* @__PURE__ */ s("div", { className: "flex gap-2 items-center", children: [
-            /* @__PURE__ */ s("div", { children: [
-              r === "danger" && /* @__PURE__ */ o(x, { className: "w-5 h-5" }),
-              r === "success" && /* @__PURE__ */ o(g, { className: "w-5 h-5" }),
-              r === "info" && /* @__PURE__ */ o(N, { className: "w-5 h-5" }),
-              r === "warning" && /* @__PURE__ */ o(I, { className: "w-5 h-5" })
+          /* @__PURE__ */ t("div", { className: "mtx-flex mtx-gap-2 mtx-items-center", children: [
+            /* @__PURE__ */ t("div", { children: [
+              r === "danger" && /* @__PURE__ */ o(I, { className: "mtx-w-5 mtx-h-5" }),
+              r === "success" && /* @__PURE__ */ o(N, { className: "mtx-w-5 mtx-h-5" }),
+              r === "info" && /* @__PURE__ */ o(C, { className: "mtx-w-5 mtx-h-5" }),
+              r === "warning" && /* @__PURE__ */ o(g, { className: "mtx-w-5 mtx-h-5" })
             ] }),
-            c && /* @__PURE__ */ o(T, { ...e?.titleProps ?? {}, children: c })
+            i && /* @__PURE__ */ o(d, { ...e?.titleProps ?? {}, children: i })
           ] }),
-          /* @__PURE__ */ o(h, { ...e?.closeProps ?? {} })
+          /* @__PURE__ */ o(T, { ...e?.closeProps ?? {} })
         ]
       },
-      t
+      s
     )),
-    /* @__PURE__ */ o(u, {})
+    /* @__PURE__ */ o(h, {})
   ] });
 }
 P.displayName = "Toast";

package/dist/toast.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"toast.es.js","sources":["../src/components/toast/Toast.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { useEffect } from \"react\";\r\nimport { Toast as Root, ToastClose, ToastProvider, ToastTitle, ToastViewport } from \"./toast-components\";\r\n\r\nimport { useToasts, toastParams } from \"./use-toast\";\r\nimport { InfoCircleIcon } from \"../Icons/InfoCircleIcon\";\r\nimport { SuccessCircleIcon } from \"../Icons/SuccessCircleIcon\";\r\nimport { WarningCircleIcon } from \"../Icons/WarningCircleIcon\";\r\nimport { DangerCircleIcon } from \"../Icons/DangerCircleIcon\";\r\nimport { ToastProviderProps, ToastViewportProps } from \"@radix-ui/react-toast\";\r\n\r\ntype ToastProps = {\r\n  limit?: number;\r\n  duration?: number;\r\n  slotProps?: {\r\n    providerProps?: ToastProviderProps;\r\n    viewportProps?: ToastViewportProps;\r\n    itemProps?: React.ComponentProps<typeof Root>;\r\n    closeProps?: React.ComponentProps<typeof ToastClose>;\r\n    titleProps?: React.ComponentProps<typeof ToastTitle>;\r\n  };\r\n};\r\n\r\nfunction Toast({ limit = 3, duration = 5000, slotProps }: ToastProps) {\r\n  const { toasts, removeToast } = useToasts();\r\n\r\n  useEffect(() => {\r\n    if (limit !== undefined) {\r\n      toastParams.limit = limit;\r\n    }\r\n  }, [limit]);\r\n\r\n  return (\r\n    <ToastProvider duration={duration} {...(slotProps?.providerProps ?? {})}>\r\n      {Array.from(toasts).map(([key, { message, variant }]) => {\r\n        return (\r\n          <Root\r\n            key={key}\r\n            variant={variant}\r\n            onOpenChange={open => {\r\n              if (!open) {\r\n                setTimeout(() => removeToast(key), 100); // let the animation finish then remove the toast\r\n              }\r\n            }}\r\n            {...(slotProps?.itemProps ?? {})}\r\n          >\r\n            <div className=\"flex gap-2 items-center\">\r\n              <div>\r\n                {variant === \"danger\" && <DangerCircleIcon className=\"w-5 h-5\" />}\r\n                {variant === \"success\" && <SuccessCircleIcon className=\"w-5 h-5\" />}\r\n                {variant === \"info\" && <InfoCircleIcon className=\"w-5 h-5\" />}\r\n                {variant === \"warning\" && <WarningCircleIcon className=\"w-5 h-5\" />}\r\n              </div>\r\n              {message && <ToastTitle {...(slotProps?.titleProps ?? {})}>{message}</ToastTitle>}\r\n            </div>\r\n            <ToastClose {...(slotProps?.closeProps ?? {})} />\r\n            {/* {action} */}\r\n          </Root>\r\n        );\r\n      })}\r\n      <ToastViewport />\r\n    </ToastProvider>\r\n  );\r\n}\r\nToast.displayName = \"Toast\";\r\n\r\nexport { Toast, type ToastProps };\r\n"],"names":["Toast","limit","duration","slotProps","toasts","removeToast","useToasts","useEffect","toastParams","ToastProvider","key","message","variant","jsxs","Root","open","jsx","DangerCircleIcon","SuccessCircleIcon","InfoCircleIcon","WarningCircleIcon","ToastTitle","ToastClose","ToastViewport"],"mappings":";;;;;;;;AAwBA,SAASA,EAAM,EAAE,OAAAC,IAAQ,GAAG,UAAAC,IAAW,KAAM,WAAAC,KAAyB;AACpE,QAAM,EAAE,QAAAC,GAAQ,aAAAC,EAAA,IAAgBC,EAAA;AAEhC,SAAAC,EAAU,MAAM;AACd,IAAIN,MAAU,WACZO,EAAY,QAAQP;AAAA,EAExB,GAAG,CAACA,CAAK,CAAC,qBAGPQ,GAAA,EAAc,UAAAP,GAAqB,GAAIC,GAAW,iBAAiB,CAAA,GACjE,UAAA;AAAA,IAAA,MAAM,KAAKC,CAAM,EAAE,IAAI,CAAC,CAACM,GAAK,EAAE,SAAAC,GAAS,SAAAC,EAAA,CAAS,MAE/C,gBAAAC;AAAA,MAACC;AAAAA,MAAA;AAAA,QAEC,SAAAF;AAAA,QACA,cAAc,CAAAG,MAAQ;AACpB,UAAKA,KACH,WAAW,MAAMV,EAAYK,CAAG,GAAG,GAAG;AAAA,QAE1C;AAAA,QACC,GAAIP,GAAW,aAAa,CAAA;AAAA,QAE7B,UAAA;AAAA,UAAA,gBAAAU,EAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,YAAA,gBAAAA,EAAC,OAAA,EACE,UAAA;AAAA,cAAAD,MAAY,YAAY,gBAAAI,EAACC,GAAA,EAAiB,WAAU,WAAU;AAAA,cAC9DL,MAAY,aAAa,gBAAAI,EAACE,GAAA,EAAkB,WAAU,WAAU;AAAA,cAChEN,MAAY,UAAU,gBAAAI,EAACG,GAAA,EAAe,WAAU,WAAU;AAAA,cAC1DP,MAAY,aAAa,gBAAAI,EAACI,GAAA,EAAkB,WAAU,UAAA,CAAU;AAAA,YAAA,GACnE;AAAA,YACCT,uBAAYU,GAAA,EAAY,GAAIlB,GAAW,cAAc,CAAA,GAAM,UAAAQ,EAAA,CAAQ;AAAA,UAAA,GACtE;AAAA,4BACCW,GAAA,EAAY,GAAInB,GAAW,cAAc,CAAA,EAAC,CAAI;AAAA,QAAA;AAAA,MAAA;AAAA,MAlB1CO;AAAA,IAAA,CAsBV;AAAA,sBACAa,GAAA,CAAA,CAAc;AAAA,EAAA,GACjB;AAEJ;AACAvB,EAAM,cAAc;"}
+{"version":3,"file":"toast.es.js","sources":["../src/components/toast/Toast.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { useEffect } from \"react\";\r\nimport { Toast as Root, ToastClose, ToastProvider, ToastTitle, ToastViewport } from \"./toast-components\";\r\n\r\nimport { useToasts, toastParams } from \"./use-toast\";\r\nimport { InfoCircleIcon } from \"../Icons/InfoCircleIcon\";\r\nimport { SuccessCircleIcon } from \"../Icons/SuccessCircleIcon\";\r\nimport { WarningCircleIcon } from \"../Icons/WarningCircleIcon\";\r\nimport { DangerCircleIcon } from \"../Icons/DangerCircleIcon\";\r\nimport { ToastProviderProps, ToastViewportProps } from \"@radix-ui/react-toast\";\r\n\r\ntype ToastProps = {\r\n  limit?: number;\r\n  duration?: number;\r\n  slotProps?: {\r\n    providerProps?: ToastProviderProps;\r\n    viewportProps?: ToastViewportProps;\r\n    itemProps?: React.ComponentProps<typeof Root>;\r\n    closeProps?: React.ComponentProps<typeof ToastClose>;\r\n    titleProps?: React.ComponentProps<typeof ToastTitle>;\r\n  };\r\n};\r\n\r\nfunction Toast({ limit = 3, duration = 5000, slotProps }: ToastProps) {\r\n  const { toasts, removeToast } = useToasts();\r\n\r\n  useEffect(() => {\r\n    if (limit !== undefined) {\r\n      toastParams.limit = limit;\r\n    }\r\n  }, [limit]);\r\n\r\n  return (\r\n    <ToastProvider duration={duration} {...(slotProps?.providerProps ?? {})}>\r\n      {Array.from(toasts).map(([key, { message, variant }]) => {\r\n        return (\r\n          <Root\r\n            key={key}\r\n            variant={variant}\r\n            onOpenChange={open => {\r\n              if (!open) {\r\n                setTimeout(() => removeToast(key), 100); // let the animation finish then remove the toast\r\n              }\r\n            }}\r\n            {...(slotProps?.itemProps ?? {})}\r\n          >\r\n            <div className=\"mtx-flex mtx-gap-2 mtx-items-center\">\r\n              <div>\r\n                {variant === \"danger\" && <DangerCircleIcon className=\"mtx-w-5 mtx-h-5\" />}\r\n                {variant === \"success\" && <SuccessCircleIcon className=\"mtx-w-5 mtx-h-5\" />}\r\n                {variant === \"info\" && <InfoCircleIcon className=\"mtx-w-5 mtx-h-5\" />}\r\n                {variant === \"warning\" && <WarningCircleIcon className=\"mtx-w-5 mtx-h-5\" />}\r\n              </div>\r\n              {message && <ToastTitle {...(slotProps?.titleProps ?? {})}>{message}</ToastTitle>}\r\n            </div>\r\n            <ToastClose {...(slotProps?.closeProps ?? {})} />\r\n            {/* {action} */}\r\n          </Root>\r\n        );\r\n      })}\r\n      <ToastViewport />\r\n    </ToastProvider>\r\n  );\r\n}\r\nToast.displayName = \"Toast\";\r\n\r\nexport { Toast, type ToastProps };\r\n"],"names":["Toast","limit","duration","slotProps","toasts","removeToast","useToasts","useEffect","toastParams","ToastProvider","key","message","variant","jsxs","Root","open","jsx","DangerCircleIcon","SuccessCircleIcon","InfoCircleIcon","WarningCircleIcon","ToastTitle","ToastClose","ToastViewport"],"mappings":";;;;;;;;AAwBA,SAASA,EAAM,EAAE,OAAAC,IAAQ,GAAG,UAAAC,IAAW,KAAM,WAAAC,KAAyB;AACpE,QAAM,EAAE,QAAAC,GAAQ,aAAAC,EAAA,IAAgBC,EAAA;AAEhC,SAAAC,EAAU,MAAM;AACd,IAAIN,MAAU,WACZO,EAAY,QAAQP;AAAA,EAExB,GAAG,CAACA,CAAK,CAAC,qBAGPQ,GAAA,EAAc,UAAAP,GAAqB,GAAIC,GAAW,iBAAiB,CAAA,GACjE,UAAA;AAAA,IAAA,MAAM,KAAKC,CAAM,EAAE,IAAI,CAAC,CAACM,GAAK,EAAE,SAAAC,GAAS,SAAAC,EAAA,CAAS,MAE/C,gBAAAC;AAAA,MAACC;AAAAA,MAAA;AAAA,QAEC,SAAAF;AAAA,QACA,cAAc,CAAAG,MAAQ;AACpB,UAAKA,KACH,WAAW,MAAMV,EAAYK,CAAG,GAAG,GAAG;AAAA,QAE1C;AAAA,QACC,GAAIP,GAAW,aAAa,CAAA;AAAA,QAE7B,UAAA;AAAA,UAAA,gBAAAU,EAAC,OAAA,EAAI,WAAU,uCACb,UAAA;AAAA,YAAA,gBAAAA,EAAC,OAAA,EACE,UAAA;AAAA,cAAAD,MAAY,YAAY,gBAAAI,EAACC,GAAA,EAAiB,WAAU,mBAAkB;AAAA,cACtEL,MAAY,aAAa,gBAAAI,EAACE,GAAA,EAAkB,WAAU,mBAAkB;AAAA,cACxEN,MAAY,UAAU,gBAAAI,EAACG,GAAA,EAAe,WAAU,mBAAkB;AAAA,cAClEP,MAAY,aAAa,gBAAAI,EAACI,GAAA,EAAkB,WAAU,kBAAA,CAAkB;AAAA,YAAA,GAC3E;AAAA,YACCT,uBAAYU,GAAA,EAAY,GAAIlB,GAAW,cAAc,CAAA,GAAM,UAAAQ,EAAA,CAAQ;AAAA,UAAA,GACtE;AAAA,4BACCW,GAAA,EAAY,GAAInB,GAAW,cAAc,CAAA,EAAC,CAAI;AAAA,QAAA;AAAA,MAAA;AAAA,MAlB1CO;AAAA,IAAA,CAsBV;AAAA,sBACAa,GAAA,CAAA,CAAc;AAAA,EAAA,GACjB;AAEJ;AACAvB,EAAM,cAAc;"}

package/dist/tooltip.es.js

@@ -1,27 +1,27 @@
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import * as m from "react";
-import { Root as n, Provider as l, Trigger as p, Portal as f, Content as t, Arrow as c } from "@radix-ui/react-tooltip";
-import { cn as g } from "./utils.es.js";
-const y = l, w = n, N = p, x = m.forwardRef(({ className: a, sideOffset: e = 4, children: r, ...i }, d) => /* @__PURE__ */ o(f, { children: /* @__PURE__ */ s(
-  t,
+import { jsx as t, jsxs as d } from "react/jsx-runtime";
+import * as s from "react";
+import { Root as x, Provider as n, Trigger as l, Portal as p, Content as o, Arrow as f } from "@radix-ui/react-tooltip";
+import { cn as c } from "./utils.es.js";
+const y = n, w = x, N = l, g = s.forwardRef(({ className: m, sideOffset: a = 4, children: e, ...r }, i) => /* @__PURE__ */ t(p, { children: /* @__PURE__ */ d(
+  o,
   {
-    ref: d,
-    sideOffset: e,
-    className: g(
-      "z-50 rounded-sm bg-primary-900 px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      a
+    ref: i,
+    sideOffset: a,
+    className: c(
+      "mtx-z-50 mtx-rounded-sm mtx-bg-primary-900 mtx-px-3 mtx-py-1.5 mtx-text-xs mtx-text-primary-foreground mtx-animate-in mtx-fade-in-0 mtx-zoom-in-95 data-[state=closed]:mtx-animate-out data-[state=closed]:mtx-fade-out-0 data-[state=closed]:mtx-zoom-out-95 data-[side=bottom]:mtx-slide-in-from-top-2 data-[side=left]:mtx-slide-in-from-right-2 data-[side=right]:mtx-slide-in-from-left-2 data-[side=top]:mtx-slide-in-from-bottom-2",
+      m
     ),
-    ...i,
+    ...r,
     children: [
-      r,
-      /* @__PURE__ */ o(c, { "data-role": "arrow", className: "w-2 h-1.5" })
+      e,
+      /* @__PURE__ */ t(f, { "data-role": "arrow", className: "mtx-w-2 mtx-h-1.5" })
     ]
   }
 ) }));
-x.displayName = t.displayName;
+g.displayName = o.displayName;
 export {
   w as Tooltip,
-  x as TooltipContent,
+  g as TooltipContent,
   y as TooltipProvider,
   N as TooltipTrigger
 };

package/dist/tooltip.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.es.js","sources":["../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport {\r\n  Root,\r\n  Provider,\r\n  Trigger,\r\n  Portal,\r\n  Content,\r\n  TooltipContentProps as ContentProps,\r\n  Arrow,\r\n  TooltipProps,\r\n  TooltipProviderProps,\r\n  TooltipTriggerProps,\r\n} from \"@radix-ui/react-tooltip\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\n\r\nconst TooltipProvider = Provider;\r\n\r\nconst Tooltip = Root;\r\n\r\nconst TooltipTrigger = Trigger;\r\n\r\nconst TooltipContent = React.forwardRef<React.ElementRef<typeof Content>, ContentProps>(({ className, sideOffset = 4, children, ...props }, ref) => (\r\n  <Portal>\r\n    <Content\r\n      ref={ref}\r\n      sideOffset={sideOffset}\r\n      className={cn(\r\n        \"z-50 rounded-sm bg-primary-900 px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    >\r\n      {children}\r\n      <Arrow data-role=\"arrow\" className=\"w-2 h-1.5\" />\r\n    </Content>\r\n  </Portal>\r\n));\r\nTooltipContent.displayName = Content.displayName;\r\ntype TooltipContentProps = ContentProps & { ref: React.Ref<React.ElementRef<typeof Content>> };\r\n\r\nexport {\r\n  Tooltip,\r\n  TooltipTrigger,\r\n  TooltipContent,\r\n  TooltipProvider,\r\n  type TooltipProps,\r\n  type TooltipContentProps,\r\n  type TooltipTriggerProps,\r\n  type TooltipProviderProps,\r\n};\r\n"],"names":["TooltipProvider","Provider","Tooltip","Root","TooltipTrigger","Trigger","TooltipContent","React","className","sideOffset","children","props","ref","Portal","jsxs","Content","cn","jsx","Arrow"],"mappings":";;;;AAkBA,MAAMA,IAAkBC,GAElBC,IAAUC,GAEVC,IAAiBC,GAEjBC,IAAiBC,EAAM,WAA2D,CAAC,EAAE,WAAAC,GAAW,YAAAC,IAAa,GAAG,UAAAC,GAAU,GAAGC,EAAA,GAASC,wBACzIC,GAAA,EACC,UAAA,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,KAAAH;AAAA,IACA,YAAAH;AAAA,IACA,WAAWO;AAAA,MACT;AAAA,MACAR;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,IAEH,UAAA;AAAA,MAAAD;AAAA,MACD,gBAAAO,EAACC,GAAA,EAAM,aAAU,SAAQ,WAAU,YAAA,CAAY;AAAA,IAAA;AAAA,EAAA;AACjD,GACF,CACD;AACDZ,EAAe,cAAcS,EAAQ;"}
+{"version":3,"file":"tooltip.es.js","sources":["../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport {\r\n  Root,\r\n  Provider,\r\n  Trigger,\r\n  Portal,\r\n  Content,\r\n  TooltipContentProps as ContentProps,\r\n  Arrow,\r\n  TooltipProps,\r\n  TooltipProviderProps,\r\n  TooltipTriggerProps,\r\n} from \"@radix-ui/react-tooltip\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\n\r\nconst TooltipProvider = Provider;\r\n\r\nconst Tooltip = Root;\r\n\r\nconst TooltipTrigger = Trigger;\r\n\r\nconst TooltipContent = React.forwardRef<React.ElementRef<typeof Content>, ContentProps>(({ className, sideOffset = 4, children, ...props }, ref) => (\r\n  <Portal>\r\n    <Content\r\n      ref={ref}\r\n      sideOffset={sideOffset}\r\n      className={cn(\r\n        \"mtx-z-50 mtx-rounded-sm mtx-bg-primary-900 mtx-px-3 mtx-py-1.5 mtx-text-xs mtx-text-primary-foreground mtx-animate-in mtx-fade-in-0 mtx-zoom-in-95 data-[state=closed]:mtx-animate-out data-[state=closed]:mtx-fade-out-0 data-[state=closed]:mtx-zoom-out-95 data-[side=bottom]:mtx-slide-in-from-top-2 data-[side=left]:mtx-slide-in-from-right-2 data-[side=right]:mtx-slide-in-from-left-2 data-[side=top]:mtx-slide-in-from-bottom-2\",\r\n        className,\r\n      )}\r\n      {...props}\r\n    >\r\n      {children}\r\n      <Arrow data-role=\"arrow\" className=\"mtx-w-2 mtx-h-1.5\" />\r\n    </Content>\r\n  </Portal>\r\n));\r\nTooltipContent.displayName = Content.displayName;\r\ntype TooltipContentProps = ContentProps & { ref: React.Ref<React.ElementRef<typeof Content>> };\r\n\r\nexport {\r\n  Tooltip,\r\n  TooltipTrigger,\r\n  TooltipContent,\r\n  TooltipProvider,\r\n  type TooltipProps,\r\n  type TooltipContentProps,\r\n  type TooltipTriggerProps,\r\n  type TooltipProviderProps,\r\n};\r\n"],"names":["TooltipProvider","Provider","Tooltip","Root","TooltipTrigger","Trigger","TooltipContent","React","className","sideOffset","children","props","ref","Portal","jsxs","Content","cn","jsx","Arrow"],"mappings":";;;;AAkBA,MAAMA,IAAkBC,GAElBC,IAAUC,GAEVC,IAAiBC,GAEjBC,IAAiBC,EAAM,WAA2D,CAAC,EAAE,WAAAC,GAAW,YAAAC,IAAa,GAAG,UAAAC,GAAU,GAAGC,EAAA,GAASC,wBACzIC,GAAA,EACC,UAAA,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,KAAAH;AAAA,IACA,YAAAH;AAAA,IACA,WAAWO;AAAA,MACT;AAAA,MACAR;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,IAEH,UAAA;AAAA,MAAAD;AAAA,MACD,gBAAAO,EAACC,GAAA,EAAM,aAAU,SAAQ,WAAU,oBAAA,CAAoB;AAAA,IAAA;AAAA,EAAA;AACzD,GACF,CACD;AACDZ,EAAe,cAAcS,EAAQ;"}

package/dist/utils.es.js

@@ -1,9 +1,10 @@
-import { clsx as o } from "clsx";
-import { twMerge as t } from "tailwind-merge";
-function n(...r) {
-  return t(o(r));
+import { clsx as r } from "clsx";
+import { extendTailwindMerge as t } from "tailwind-merge";
+const n = t({ prefix: "mtx-" });
+function x(...e) {
+  return n(r(e));
 }
 export {
-  n as cn
+  x as cn
 };
 //# sourceMappingURL=utils.es.js.map

package/dist/utils.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.es.js","sources":["../src/lib/utils.ts"],"sourcesContent":["import { ClassValue, clsx } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n \nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n"],"names":["cn","inputs","twMerge","clsx"],"mappings":";;AAGO,SAASA,KAAMC,GAAsB;AAC1C,SAAOC,EAAQC,EAAKF,CAAM,CAAC;AAC7B;"}
+{"version":3,"file":"utils.es.js","sources":["../src/lib/utils.ts"],"sourcesContent":["import { ClassValue, clsx } from \"clsx\";\nimport { extendTailwindMerge } from \"tailwind-merge\";\n\nconst twMergeExtended = extendTailwindMerge({ prefix: \"mtx-\" });\nexport function cn(...inputs: ClassValue[]) {\n  return twMergeExtended(clsx(inputs));\n}\n"],"names":["twMergeExtended","extendTailwindMerge","cn","inputs","clsx"],"mappings":";;AAGA,MAAMA,IAAkBC,EAAoB,EAAE,QAAQ,QAAQ;AACvD,SAASC,KAAMC,GAAsB;AAC1C,SAAOH,EAAgBI,EAAKD,CAAM,CAAC;AACrC;"}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@trsys-tech/matrix-library",
   "description": "MatrixUI Library",
   "private": false,
-  "version": "0.6.0",
+  "version": "1.0.0-canary.0",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.es.js",
@@ -89,15 +89,14 @@
     "vaul": "^1.1.1"
   },
   "peerDependencies": {
-    "@hookform/resolvers": "^3.9.1",
     "react": "^19.2.4",
     "react-dom": "^19.2.4",
-    "react-hook-form": "^7.61.1",
-    "zod": "^3.23.8"
+    "react-hook-form": "^7.61.1"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^1.9.0",
     "@eslint/js": "^9.13.0",
+    "@hookform/resolvers": "^5.2.2",
     "@storybook/addon-essentials": "^8.6.18",
     "@storybook/addon-interactions": "^8.6.18",
     "@storybook/addon-onboarding": "^8.6.18",
@@ -125,7 +124,8 @@
     "typescript": "~5.6.2",
     "typescript-eslint": "^8.11.0",
     "vite": "^6.3.5",
-    "vite-plugin-dts": "^4.5.4"
+    "vite-plugin-dts": "^4.5.4",
+    "zod": "^4.3.6"
   },
   "eslintConfig": {
     "extends": [