@zonos/amino 5.1.5 → 5.1.6

package/components/toast/Toast.d.ts

@@ -1,10 +1,12 @@
 import type { ReactNode } from 'react';
 import type { Intent } from "../../types";
+export type Direction = 'top' | 'right' | 'bottom' | 'left';
 export type ToastProps = {
     children: ReactNode;
+    direction?: Direction;
     /** Dismiss delay (default 6000 ms) */
     duration?: number;
     intent?: Extract<Intent, 'success' | 'warning' | 'error' | 'info'>;
     toastKey: string;
 };
-export declare const Toast: ({ children, intent, toastKey }: ToastProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Toast: ({ children, direction, intent, toastKey, }: ToastProps) => import("react/jsx-runtime").JSX.Element;

package/components/toast/Toast.js

@@ -1 +1 @@
-"use strict";var e=require("../../_tslib-ccfac372.js"),n=require("react/jsx-runtime"),o=require("framer-motion"),r=require("styled-components"),a=require("../../icons/CheckCircleDuotoneIcon.js"),t=require("../../icons/InfoDuotoneIcon.js"),c=require("../../icons/RemoveCircleDuotoneIcon.js"),s=require("../../icons/WarningDuotoneIcon.js"),l=require("../../styles/constants/theme.js");function i(e){return e&&e.__esModule?e:{default:e}}require("react"),require("../../icons/icon-base/_IconBase.js");var u,d,g,m,h,b=i(r),_=b.default(o.motion.div)(u||(u=e.__makeTemplateObject(["\n  background: ",";\n  z-index: 999999;\n  border-radius: ",";\n  color: ",";\n  box-shadow: ",";\n  padding: "," ",";\n  display: flex;\n  align-items: center;\n  gap: ",";\n  font-weight: 500;\n  user-select: none;\n\n  & + & {\n    margin-top: ",";\n  }\n"],["\n  background: ",";\n  z-index: 999999;\n  border-radius: ",";\n  color: ",";\n  box-shadow: ",";\n  padding: "," ",";\n  display: flex;\n  align-items: center;\n  gap: ",";\n  font-weight: 500;\n  user-select: none;\n\n  & + & {\n    margin-top: ",";\n  }\n"])),l.theme.gray100,l.theme.radius8,l.theme.gray1000,l.theme.v3ShadowLarge,l.theme.space16,l.theme.space24,l.theme.space8,l.theme.space24),j=b.default(_)(d||(d=e.__makeTemplateObject(["\n  background-color: ",";\n  color: ",";\n"],["\n  background-color: ",";\n  color: ",";\n"])),l.theme.green100,l.theme.green800),y=b.default(_)(g||(g=e.__makeTemplateObject(["\n  background-color: ",";\n  color: ",";\n"],["\n  background-color: ",";\n  color: ",";\n"])),l.theme.red100,l.theme.red800),p=b.default(_)(m||(m=e.__makeTemplateObject(["\n  background-color: ",";\n  color: ",";\n"],["\n  background-color: ",";\n  color: ",";\n"])),l.theme.orange100,l.theme.orange800),x=b.default(_)(h||(h=e.__makeTemplateObject(["\n  background-color: ",";\n  color: ",";\n"],["\n  background-color: ",";\n  color: ",";\n"])),l.theme.blue100,l.theme.blue800);exports.Toast=function(o){var r=o.children,l=o.intent,i={animate:{opacity:1,translateX:0},exit:{opacity:0},initial:{opacity:0,translateX:10},key:o.toastKey};switch(l){case"success":return n.jsxs(j,e.__assign({layout:!0},i,{children:[n.jsx(a.CheckCircleDuotoneIcon,{color:"green900",secondaryColor:"green400"}),r]}));case"error":return n.jsxs(y,e.__assign({layout:!0},i,{children:[n.jsx(c.RemoveCircleDuotoneIcon,{color:"red900",secondaryColor:"red400"}),r]}));case"warning":return n.jsxs(p,e.__assign({layout:!0},i,{children:[n.jsx(s.WarningDuotoneIcon,{color:"orange900",secondaryColor:"orange400"}),r]}));case"info":return n.jsxs(x,e.__assign({layout:!0},i,{children:[n.jsx(t.InfoDuotoneIcon,{color:"blue900",secondaryColor:"blue400"}),r]}));default:return n.jsxs(_,e.__assign({layout:!0},i,{children:[n.jsx(t.InfoDuotoneIcon,{color:"gray900",secondaryColor:"gray400"}),r]}))}};
+"use strict";var e=require("../../_tslib-ccfac372.js"),n=require("react/jsx-runtime"),o=require("framer-motion"),r=require("styled-components"),t=require("../../icons/CheckCircleDuotoneIcon.js"),a=require("../../icons/InfoDuotoneIcon.js"),c=require("../../icons/RemoveCircleDuotoneIcon.js"),s=require("../../icons/WarningDuotoneIcon.js"),l=require("../../styles/constants/theme.js");function i(e){return e&&e.__esModule?e:{default:e}}require("react"),require("../../icons/icon-base/_IconBase.js");var u,d,g,m,h,b=i(r),p=b.default(o.motion.div)(u||(u=e.__makeTemplateObject(["\n  background: ",";\n  z-index: 999999;\n  border-radius: ",";\n  color: ",";\n  box-shadow: ",";\n  padding: "," ",";\n  display: flex;\n  align-items: center;\n  gap: ",";\n  font-weight: 500;\n  user-select: none;\n\n  & + & {\n    margin-top: ",";\n  }\n"],["\n  background: ",";\n  z-index: 999999;\n  border-radius: ",";\n  color: ",";\n  box-shadow: ",";\n  padding: "," ",";\n  display: flex;\n  align-items: center;\n  gap: ",";\n  font-weight: 500;\n  user-select: none;\n\n  & + & {\n    margin-top: ",";\n  }\n"])),l.theme.gray100,l.theme.radius10,l.theme.gray1000,l.theme.v3ShadowLarge,l.theme.space16,l.theme.space24,l.theme.space8,l.theme.space24),y=b.default(p)(d||(d=e.__makeTemplateObject(["\n  background-color: ",";\n  color: ",";\n"],["\n  background-color: ",";\n  color: ",";\n"])),l.theme.green100,l.theme.green800),_=b.default(p)(g||(g=e.__makeTemplateObject(["\n  background-color: ",";\n  color: ",";\n"],["\n  background-color: ",";\n  color: ",";\n"])),l.theme.red100,l.theme.red800),j=b.default(p)(m||(m=e.__makeTemplateObject(["\n  background-color: ",";\n  color: ",";\n"],["\n  background-color: ",";\n  color: ",";\n"])),l.theme.orange100,l.theme.orange800),f=b.default(p)(h||(h=e.__makeTemplateObject(["\n  background-color: ",";\n  color: ",";\n"],["\n  background-color: ",";\n  color: ",";\n"])),l.theme.blue100,l.theme.blue800);exports.Toast=function(o){var r=o.children,l=o.direction,i=o.intent,u=o.toastKey,d=function(){switch(l){case"top":return{opacity:0,translateX:0,translateY:-10};case"bottom":return{opacity:0,translateX:0,translateY:10};case"left":return{opacity:0,translateX:-10,translateY:0};default:return{opacity:0,translateX:10,translateY:0}}},g={animate:{opacity:1,translateX:0,translateY:0},exit:d(),initial:d(),key:u};switch(i){case"success":return n.jsxs(y,e.__assign({layout:!0},g,{children:[n.jsx(t.CheckCircleDuotoneIcon,{color:"green900",secondaryColor:"green400"}),r]}));case"error":return n.jsxs(_,e.__assign({layout:!0},g,{children:[n.jsx(c.RemoveCircleDuotoneIcon,{color:"red900",secondaryColor:"red400"}),r]}));case"warning":return n.jsxs(j,e.__assign({layout:!0},g,{children:[n.jsx(s.WarningDuotoneIcon,{color:"orange900",secondaryColor:"orange400"}),r]}));case"info":return n.jsxs(f,e.__assign({layout:!0},g,{children:[n.jsx(a.InfoDuotoneIcon,{color:"blue900",secondaryColor:"blue400"}),r]}));default:return n.jsxs(p,e.__assign({layout:!0},g,{children:[n.jsx(a.InfoDuotoneIcon,{color:"gray900",secondaryColor:"gray400"}),r]}))}};

package/components/toast/ToastContext.d.ts

@@ -1,7 +1,10 @@
 import { type ReactNode } from 'react';
 import { type ToastProps } from "./Toast";
 type BaseProps = Omit<ToastProps, 'children' | 'toastKey'>;
-export type ToastContextFunctionType = (toast: ReactNode, props?: BaseProps) => void;
+export type ToastContextFunctionType = (toast: ReactNode, props?: BaseProps, location?: {
+    bottom?: string;
+    left?: string;
+}) => void;
 export declare const ToastContext: import("react").Context<ToastContextFunctionType>;
 type Props = {
     children: ReactNode;

package/components/toast/ToastContext.js

@@ -1 +1 @@
-"use strict";var e=require("../../_tslib-ccfac372.js"),r=require("react/jsx-runtime"),n=require("react"),t=require("framer-motion"),o=require("uuid"),s=require("./Toast.js");require("styled-components"),require("../../icons/CheckCircleDuotoneIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../../styles/constants/theme.js"),require("../../icons/InfoDuotoneIcon.js"),require("../../icons/RemoveCircleDuotoneIcon.js"),require("../../icons/WarningDuotoneIcon.js");var i=n.createContext((function(e,r){}));exports.ToastContext=i,exports.ToastContextProvider=function(c){var a=c.children,u=e.__read(n.useState([]),2),d=u[0],l=u[1],j=n.useCallback((function(r,n){l((function(t){return e.__spreadArray(e.__spreadArray([],e.__read(t),!1),[{props:n,toast:r,uuid:o.v4()}],!1)})),setTimeout((function(){return l((function(e){return e.slice(1)}))}),(null==n?void 0:n.duration)||6e3)}),[l]);return r.jsx(t.AnimatePresence,{children:r.jsxs(i.Provider,{value:j,children:[a,r.jsx("div",{className:"toast-container",children:r.jsx("div",{className:"toasts-wrapper",children:r.jsx(t.AnimatePresence,{children:d.map((function(e){var n=e.props,t=e.toast,o=e.uuid,i="toast-".concat(t,"-").concat(o);return r.jsx(s.Toast,{intent:null==n?void 0:n.intent,toastKey:i,children:t},i)}))})})})]})})};
+"use strict";var e=require("../../_tslib-ccfac372.js"),t=require("react/jsx-runtime"),n=require("react"),r=require("framer-motion"),o=require("styled-components"),i=require("uuid"),s=require("./Toast.js");function u(e){return e&&e.__esModule?e:{default:e}}require("../../icons/CheckCircleDuotoneIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../../styles/constants/theme.js"),require("../../icons/InfoDuotoneIcon.js"),require("../../icons/RemoveCircleDuotoneIcon.js"),require("../../icons/WarningDuotoneIcon.js");var a,c=u(o),l=n.createContext((function(e,t){})),d=c.default.div(a||(a=e.__makeTemplateObject(["\n  bottom: ",";\n  left: ",";\n"],["\n  bottom: ",";\n  left: ",";\n"])),(function(e){var t;return(null===(t=e.location)||void 0===t?void 0:t.bottom)||""}),(function(e){var t;return(null===(t=e.location)||void 0===t?void 0:t.left)||""}));exports.ToastContext=l,exports.ToastContextProvider=function(o){var u=o.children,a=e.__read(n.useState([]),2),c=a[0],f=a[1],m=e.__read(n.useState({bottom:"",left:""}),2),v=m[0],j=m[1],_=n.useCallback((function(t,n){f((function(r){return e.__spreadArray(e.__spreadArray([],e.__read(r),!1),[{props:n,toast:t,uuid:i.v4()}],!1)})),setTimeout((function(){return f((function(e){return e.slice(1)}))}),(null==n?void 0:n.duration)||6e3)}),[f]),p=n.useCallback((function(e,t,n){n&&j({bottom:n.bottom||"",left:n.left||""}),_(e,t)}),[_]);return t.jsx(r.AnimatePresence,{children:t.jsxs(l.Provider,{value:p,children:[u,t.jsx("div",{className:"toast-container",children:t.jsx(d,{className:"toasts-wrapper",location:v,children:t.jsx(r.AnimatePresence,{children:c.map((function(e){var n=e.props,r=e.toast,o=e.uuid,i="toast-".concat(r,"-").concat(o);return t.jsx(s.Toast,{direction:null==n?void 0:n.direction,intent:null==n?void 0:n.intent,toastKey:i,children:r},i)}))})})})]})})};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zonos/amino",
-  "version": "5.1.5",
+  "version": "5.1.6",
   "description": "Core UI components for Amino",
   "repository": "git@github.com:Zonos/amino.git",
   "license": "MIT",

package/types/Color.d.ts

@@ -2,4 +2,4 @@ export declare const colorPrefixes: readonly ["blue", "cyan", "green", "orange",
 export declare const colorContrasts: readonly ["100", "200", "300", "400", "500", "600", "700", "800", "900", "1000"];
 export type ColorContrast = (typeof colorContrasts)[number];
 export type ColorPrefix = (typeof colorPrefixes)[number];
-export type Color = 'gray0' | 'glass0' | 'glass50' | `${ColorPrefix}${ColorContrast}` | 'gray1100' | 'gray1200' | 'glass1100' | 'glass1200';
+export type Color = 'gray0' | 'gray50' | 'glass0' | 'glass50' | `${ColorPrefix}${ColorContrast}` | 'gray1100' | 'gray1200' | 'glass1100' | 'glass1200';

package/utils/hooks/useNotify.js

@@ -1 +1 @@
-"use strict";var e=require("react"),o=require("../../components/toast/ToastContext.js");require("../../_tslib-ccfac372.js"),require("react/jsx-runtime"),require("framer-motion"),require("uuid"),require("../../components/toast/Toast.js"),require("styled-components"),require("../../icons/CheckCircleDuotoneIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../../styles/constants/theme.js"),require("../../icons/InfoDuotoneIcon.js"),require("../../icons/RemoveCircleDuotoneIcon.js"),require("../../icons/WarningDuotoneIcon.js");exports.useNotify=function(){return e.useContext(o.ToastContext)};
+"use strict";var e=require("react"),o=require("../../components/toast/ToastContext.js");require("../../_tslib-ccfac372.js"),require("react/jsx-runtime"),require("framer-motion"),require("styled-components"),require("uuid"),require("../../components/toast/Toast.js"),require("../../icons/CheckCircleDuotoneIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../../styles/constants/theme.js"),require("../../icons/InfoDuotoneIcon.js"),require("../../icons/RemoveCircleDuotoneIcon.js"),require("../../icons/WarningDuotoneIcon.js");exports.useNotify=function(){return e.useContext(o.ToastContext)};