@mobilestockweb/snackbar 0.0.3 → 0.0.5

package/index.js

@@ -1,29 +1,31 @@
-"use strict";var I=Object.create;var l=Object.defineProperty,N=Object.defineProperties,W=Object.getOwnPropertyDescriptor,H=Object.getOwnPropertyDescriptors,J=Object.getOwnPropertyNames,x=Object.getOwnPropertySymbols,L=Object.getPrototypeOf,b=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var h=(t,e,a)=>e in t?l(t,e,{enumerable:!0,configurable:!0,writable:!0,value:a}):t[e]=a,$=(t,e)=>{for(var a in e||(e={}))b.call(e,a)&&h(t,a,e[a]);if(x)for(var a of x(e))v.call(e,a)&&h(t,a,e[a]);return t},w=(t,e)=>N(t,H(e));var C=(t,e)=>{var a={};for(var r in t)b.call(t,r)&&e.indexOf(r)<0&&(a[r]=t[r]);if(t!=null&&x)for(var r of x(t))e.indexOf(r)<0&&v.call(t,r)&&(a[r]=t[r]);return a};var O=(t,e)=>{for(var a in e)l(t,a,{get:e[a],enumerable:!0})},g=(t,e,a,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of J(e))!b.call(t,i)&&i!==a&&l(t,i,{get:()=>e[i],enumerable:!(r=W(e,i))||r.enumerable});return t};var p=(t,e,a)=>(a=t!=null?I(L(t)):{},g(e||!t||!t.__esModule?l(a,"default",{value:t,enumerable:!0}):a,t)),A=t=>g(l({},"__esModule",{value:!0}),t);var tt={};O(tt,{SnackbarProvider:()=>_});module.exports=A(tt);var R=require("notistack");var y=p(require("chroma-js")),E=require("notistack"),s=p(require("react")),P=require("react-icons/fa"),M=require("react-icons/io5"),o=p(require("styled-components")),V=p(require("@mobilestockweb/button")),m=p(require("@mobilestockweb/tools"));function T(t){let e=(t==null?void 0:t.toString())||"",a=80;if(e.length>a){let r=e.lastIndexOf(" ",a);return r===-1&&(r=a),e.slice(0,r)}return e}var n=require("react/jsx-runtime"),d=(0,s.forwardRef)(function({id:e,message:a,variant:r},i){let{closeSnackbar:k}=(0,E.useSnackbar)(),[f,z]=(0,s.useState)(!1),u=T(a),B=(0,s.useCallback)(()=>{k(e)},[e,k]);return s.default.isValidElement(a)?(0,n.jsx)(j,{ref:i,children:a}):(0,n.jsxs)(F,{ref:i,$variant:r,$isExpanded:f,children:[(0,n.jsxs)(q,{children:[u&&(0,n.jsx)(G,{children:(0,n.jsx)(K,{"data-testid":"snackbar-title",$variant:r,children:u})}),(0,n.jsx)(S,{"data-testid":"snackbar-close-button",onClick:B,children:(0,n.jsx)(X,{$variant:r,size:16})})]}),(0,n.jsx)(Y,{$isExpanded:f,children:(0,n.jsx)(Z,{$variant:r,children:u&&(0,n.jsx)(Q,{"data-testid":"snackbar-full-message",$variant:r,children:a})})}),u!==a&&(0,n.jsx)(S,{"data-testid":"snackbar-expand-button",onClick:()=>z(!f),children:(0,n.jsx)(U,{$variant:r,$isExpanded:f})})]})});function c(t="default",e){return e.colors.alert[t]}var F=o.default.div`
-  background-color: ${({theme:t,$variant:e})=>c(e,t)};
+"use strict";var D=Object.create;var c=Object.defineProperty,A=Object.defineProperties,W=Object.getOwnPropertyDescriptor,z=Object.getOwnPropertyDescriptors,B=Object.getOwnPropertyNames,f=Object.getOwnPropertySymbols,H=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable;var v=(a,e,t)=>e in a?c(a,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):a[e]=t,$=(a,e)=>{for(var t in e||(e={}))u.call(e,t)&&v(a,t,e[t]);if(f)for(var t of f(e))h.call(e,t)&&v(a,t,e[t]);return a},T=(a,e)=>A(a,z(e));var g=(a,e)=>{var t={};for(var r in a)u.call(a,r)&&e.indexOf(r)<0&&(t[r]=a[r]);if(a!=null&&f)for(var r of f(a))e.indexOf(r)<0&&h.call(a,r)&&(t[r]=a[r]);return t};var I=(a,e)=>{for(var t in e)c(a,t,{get:e[t],enumerable:!0})},w=(a,e,t,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of B(e))!u.call(a,i)&&i!==t&&c(a,i,{get:()=>e[i],enumerable:!(r=W(e,i))||r.enumerable});return a};var b=(a,e,t)=>(t=a!=null?D(H(a)):{},w(e||!a||!a.__esModule?c(t,"default",{value:a,enumerable:!0}):t,a)),J=a=>w(c({},"__esModule",{value:!0}),a);var U={};I(U,{SnackbarProvider:()=>Q});module.exports=J(U);var R=require("notistack");var y=b(require("chroma-js")),E=require("notistack"),s=b(require("react")),o=b(require("styled-components")),P=require("@mobilestockweb/button"),x=b(require("@mobilestockweb/tools"));function C(a){let e=(a==null?void 0:a.toString())||"",t=80;if(e.length>t){let r=e.lastIndexOf(" ",t);return r===-1&&(r=t),e.slice(0,r)}return e}var n=require("react/jsx-runtime"),d=(0,s.forwardRef)(function({id:e,message:t,variant:r},i){let{closeSnackbar:k}=(0,E.useSnackbar)(),[l,M]=(0,s.useState)(!1),m=C(t),N=(0,s.useCallback)(()=>{k(e)},[e,k]);return s.default.isValidElement(t)?(0,n.jsx)(O,{ref:i,children:t}):(0,n.jsxs)(L,{ref:i,$variant:r,$isExpanded:l,children:[(0,n.jsxs)(X,{children:[m&&(0,n.jsx)(j,{children:(0,n.jsx)(q,{"data-testid":"snackbar-title",$variant:r,children:m})}),(0,n.jsx)(S,{"data-testid":"snackbar-close-button",$snackbarVariant:r,variant:"TRANSPARENT",icon:"X",onClick:N})]}),(0,n.jsx)(G,{$isExpanded:l,children:(0,n.jsx)(K,{$variant:r,children:m&&(0,n.jsx)(F,{"data-testid":"snackbar-full-message",$variant:r,children:t})})}),m!==t&&(0,n.jsx)(S,{$isExpanded:l,"data-testid":"snackbar-expand-button",$snackbarVariant:r,variant:"TRANSPARENT",icon:"ChevronDown",onClick:()=>M(!l)})]})});function p(a="default",e){return e.colors.alert[a]}var L=o.default.div`
+  background-color: ${({theme:a,$variant:e})=>p(e,a)};
   border-radius: 0.4rem;
   display: flex;
   min-height: 3rem;
-  padding: ${({$isExpanded:t})=>t?"0 0.75rem":"0.25rem 0.75rem"};
+  padding: ${({$isExpanded:a})=>a?"0 0.75rem":"0.25rem 0.75rem"};
   flex-direction: column;
   justify-content: center;
-`,j=o.default.div``,q=o.default.div`
+`,O=o.default.div``,X=o.default.div`
   display: flex;
   justify-content: space-between;
   gap: 1rem;
-`,S=(0,o.default)(V.default)`
-  background-color: transparent;
-  width: auto;
-  min-height: unset;
-  box-shadow: none;
-  @media (max-width: 768px) {
-    font-size: calc(1rem - (48rem - 100vw) / 100);
+`,S=(0,o.default)(P.Button)`
+  * {
+    color: ${({theme:a,$snackbarVariant:e})=>x.default.defineTextColor(p(e,a))};
   }
   padding: 0.2rem 0;
-`,G=o.default.div`
+
+  ${({$isExpanded:a})=>a&&o.css`
+      svg {
+        transform: rotate(180deg);
+      }
+    `}
+`,j=o.default.div`
   max-width: 75vw;
-`,K=o.default.p`
+`,q=o.default.p`
   align-items: center;
-  color: ${({theme:t,$variant:e})=>m.default.defineTextColor(c(e,t))};
+  color: ${({theme:a,$variant:e})=>x.default.defineTextColor(p(e,a))};
   font-size: 1rem;
   display: inherit;
   overflow: hidden;
@@ -35,32 +37,22 @@
   @media (max-width: 768px) {
     font-size: calc(1.15rem - (48rem - 100vw) / 100);
   }
-`,Q=o.default.p`
-  color: ${({theme:t,$variant:e})=>m.default.defineTextColor(c(e,t))};
+`,F=o.default.p`
+  color: ${({theme:a,$variant:e})=>x.default.defineTextColor(p(e,a))};
   word-break: break-word;
   @media (min-width: 768px) {
     width: 25vw;
   }
-`,U=(0,o.default)(P.FaChevronDown)`
-  color: ${({theme:t,$variant:e})=>m.default.defineTextColor(c(e,t))};
-  transition: all 0.3s ease-in-out;
-  transform: rotate(0deg);
-
-  ${({$isExpanded:t})=>t&&o.css`
-      transform: rotate(180deg);
-    `}
-`,X=(0,o.default)(M.IoClose)`
-  color: ${({theme:t,$variant:e})=>m.default.defineTextColor(c(e,t))};
-`,Y=o.default.div`
+`,G=o.default.div`
   overflow: hidden;
   transition:
-    opacity ${({$isExpanded:t})=>t?"0.3s":"0.05s"} ease-in-out,
+    opacity ${({$isExpanded:a})=>a?"0.3s":"0.05s"} ease-in-out,
     max-height 0.3s ease-in-out;
-  max-height: ${({$isExpanded:t})=>t?"31.25rem":"0"};
-  opacity: ${({$isExpanded:t})=>t?"1":"0"};
-`,Z=o.default.div`
-  background-color: ${({theme:t,$variant:e})=>(0,y.default)(c(e,t)).shade(.25).css()};
+  max-height: ${({$isExpanded:a})=>a?"31.25rem":"0"};
+  opacity: ${({$isExpanded:a})=>a?"1":"0"};
+`,K=o.default.div`
+  background-color: ${({theme:a,$variant:e})=>(0,y.default)(p(e,a)).shade(.25).css()};
   border-radius: 0.6rem;
   display: flex;
   padding: 0 0.5rem;
-`;var D=require("react/jsx-runtime");function _(a){var r=a,{children:t}=r,e=C(r,["children"]);return(0,D.jsx)(R.SnackbarProvider,w($({Components:{default:d,error:d,info:d,success:d,warning:d},anchorOrigin:{vertical:"top",horizontal:"left"},classes:{containerRoot:"snackbar-style"},autoHideDuration:5e3},e),{children:t}))}0&&(module.exports={SnackbarProvider});
+`;var V=require("react/jsx-runtime");function Q(t){var r=t,{children:a}=r,e=g(r,["children"]);return(0,V.jsx)(R.SnackbarProvider,T($({Components:{default:d,error:d,info:d,success:d,warning:d},anchorOrigin:{vertical:"top",horizontal:"left"},classes:{containerRoot:"snackbar-style"},autoHideDuration:5e3},e),{children:a}))}0&&(module.exports={SnackbarProvider});

package/package.json

@@ -1,15 +1,16 @@
 {
   "name": "@mobilestockweb/snackbar",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "main": "index.js",
+  "dependencies": {
+    "@mobilestockweb/button": "^1.0.0",
+    "@mobilestockweb/tools": "^0.0.14"
+  },
   "peerDependencies": {
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "react-icons": "^5.3.0",
     "styled-components": "^6.1.8",
     "chroma-js": "^3.1.2",
-    "notistack": "^3.0.1",
-    "@mobilestockweb/button": "^0.0.10",
-    "@mobilestockweb/tools": "^0.0.12"
+    "notistack": "^3.0.1"
   }
 }