@mobilestockweb/header 0.0.2 → 0.0.3

package/index.js

@@ -1,7 +1,7 @@
-"use strict";var v=Object.defineProperty,ee=Object.defineProperties,re=Object.getOwnPropertyDescriptor,oe=Object.getOwnPropertyDescriptors,te=Object.getOwnPropertyNames,b=Object.getOwnPropertySymbols;var T=Object.prototype.hasOwnProperty,V=Object.prototype.propertyIsEnumerable;var A=(e,r,o)=>r in e?v(e,r,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[r]=o,l=(e,r)=>{for(var o in r||(r={}))T.call(r,o)&&A(e,o,r[o]);if(b)for(var o of b(r))V.call(r,o)&&A(e,o,r[o]);return e},g=(e,r)=>ee(e,oe(r));var c=(e,r)=>{var o={};for(var n in e)T.call(e,n)&&r.indexOf(n)<0&&(o[n]=e[n]);if(e!=null&&b)for(var n of b(e))r.indexOf(n)<0&&V.call(e,n)&&(o[n]=e[n]);return o};var ae=(e,r)=>{for(var o in r)v(e,o,{get:r[o],enumerable:!0})},ne=(e,r,o,n)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of te(r))!T.call(e,i)&&i!==o&&v(e,i,{get:()=>r[i],enumerable:!(n=re(r,i))||n.enumerable});return e};var ie=e=>ne(v({},"__esModule",{value:!0}),e);var pe={};ae(pe,{Header:()=>L,HeaderProvider:()=>Y,SubHeader:()=>J,useHeader:()=>p});module.exports=ie(pe);var O=require("react"),f=require("styled-components"),R=require("@mobilestockweb/button"),B=require("@mobilestockweb/clickable"),u=require("@mobilestockweb/container"),k=require("@mobilestockweb/image"),h=require("@mobilestockweb/typography");var N=require("react"),E=(0,N.createContext)(null);function p(){let e=(0,N.useContext)(E);if(!e)throw new Error("useHeader must be used within a HeaderProvider");return e}var t=require("react/jsx-runtime");function L({pageTitle:e,pressOnTitle:r,backNavigation:o,disableRightSide:n=!1,disableLeftSide:i=!1}){let a=p(),d=r||a.pressOnTitle,H=o||a.onNavigateBack,m=(0,O.useCallback)(()=>{var C;(C=a.pressOnAvatar)==null||C.call(a)},[a.pressOnAvatar]);return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(de,{children:(0,t.jsx)(se,{children:(0,t.jsxs)(u.Container.Horizontal,{align:"BETWEEN_CENTER",padding:"2XS",children:[(0,t.jsx)(u.Container.Vertical,{align:"CENTER",children:(0,t.jsx)(z,{children:!i&&(0,t.jsx)(t.Fragment,{children:a.isBackArrowVisible?(0,t.jsx)(R.Button,{variant:"TRANSPARENT",icon:"ArrowLeft",circular:!0,size:"SM",onClick:H}):(0,t.jsx)(k.Img,{src:a.logo,alt:"Logo",size:"FULL",borderRadius:"ROUNDED"})})})}),(0,t.jsxs)(u.Container.Vertical,{full:!0,align:"CENTER",style:{userSelect:"none"},children:[(0,t.jsx)(B.Clickable,{onClick:d,children:(0,t.jsx)(h.Typography,{size:"LG",weight:"BOLD",color:"CONTRAST",children:a.appName})}),e&&(0,t.jsx)(h.Typography,{size:"SM",color:"CONTRAST_600",children:e})]}),(0,t.jsx)(u.Container.Vertical,{align:"CENTER",children:(0,t.jsx)(z,{children:!n&&(0,t.jsx)(t.Fragment,{children:a.avatar?(0,t.jsx)(B.Clickable,{onClick:m,style:{display:"flex"},children:(0,t.jsx)(k.Img,{alt:"Avatar",src:a.avatar,size:"FULL",borderRadius:"ROUNDED"})}):(0,t.jsx)(R.Button,{variant:"TRANSPARENT",icon:"Settings",onClick:m})})})})]})})}),(a==null?void 0:a.subHeader)&&(0,t.jsx)(le,{children:(0,t.jsx)(u.Container.Horizontal,{align:"BETWEEN_CENTER",children:a==null?void 0:a.subHeader})})]})}var z=f.styled.div`
+"use strict";var ae=Object.create;var H=Object.defineProperty,ne=Object.defineProperties,ie=Object.getOwnPropertyDescriptor,se=Object.getOwnPropertyDescriptors,de=Object.getOwnPropertyNames,g=Object.getOwnPropertySymbols,le=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty,V=Object.prototype.propertyIsEnumerable;var y=(e,r,o)=>r in e?H(e,r,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[r]=o,c=(e,r)=>{for(var o in r||(r={}))S.call(r,o)&&y(e,o,r[o]);if(g)for(var o of g(r))V.call(r,o)&&y(e,o,r[o]);return e},v=(e,r)=>ne(e,se(r));var p=(e,r)=>{var o={};for(var n in e)S.call(e,n)&&r.indexOf(n)<0&&(o[n]=e[n]);if(e!=null&&g)for(var n of g(e))r.indexOf(n)<0&&V.call(e,n)&&(o[n]=e[n]);return o};var ce=(e,r)=>{for(var o in r)H(e,o,{get:r[o],enumerable:!0})},A=(e,r,o,n)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of de(r))!S.call(e,i)&&i!==o&&H(e,i,{get:()=>r[i],enumerable:!(n=ie(r,i))||n.enumerable});return e};var pe=(e,r,o)=>(o=e!=null?ae(le(e)):{},A(r||!e||!e.__esModule?H(o,"default",{value:e,enumerable:!0}):o,e)),ue=e=>A(H({},"__esModule",{value:!0}),e);var be={};ce(be,{Header:()=>G,HeaderProvider:()=>re,SubHeader:()=>j,useHeader:()=>u});module.exports=ue(be);var M=require("react"),d=require("styled-components"),D=require("@mobilestockweb/button"),B=require("@mobilestockweb/clickable"),m=require("@mobilestockweb/container"),E=require("@mobilestockweb/image"),h=pe(require("@mobilestockweb/tools")),U=require("@mobilestockweb/typography");var x=require("react"),k=(0,x.createContext)(null);function u(){let e=(0,x.useContext)(k);if(!e)throw new Error("useHeader must be used within a HeaderProvider");return e}var t=require("react/jsx-runtime");function G({pageTitle:e,pressOnTitle:r,backNavigation:o,disableRightSide:n=!1,disableLeftSide:i=!1}){let a=u(),l=r||a.pressOnTitle,C=o||a.onNavigateBack,f=(0,M.useCallback)(()=>{var b;(b=a.pressOnAvatar)==null||b.call(a)},[a.pressOnAvatar]);return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(fe,{children:(0,t.jsx)(me,{children:(0,t.jsxs)(m.Container.Horizontal,{align:"BETWEEN_CENTER",padding:"2XS",children:[(0,t.jsx)(m.Container.Vertical,{align:"CENTER",children:(0,t.jsx)(z,{children:!i&&(0,t.jsx)(t.Fragment,{children:a.isBackArrowVisible?(0,t.jsx)(O,{variant:"TRANSPARENT",icon:"ArrowLeft",circular:!0,size:"SM",onClick:C}):(0,t.jsx)(E.Img,{src:a.logo,alt:"Logo",size:"FULL",borderRadius:"ROUNDED"})})})}),(0,t.jsxs)(m.Container.Vertical,{full:!0,align:"CENTER",style:{userSelect:"none"},children:[(0,t.jsx)(B.Clickable,{onClick:l,children:(0,t.jsx)(L,{size:"LG",weight:"BOLD",children:a.appName})}),e&&(0,t.jsx)(L,{size:"SM",children:e})]}),(0,t.jsx)(m.Container.Vertical,{align:"CENTER",children:(0,t.jsx)(z,{children:!n&&(0,t.jsx)(t.Fragment,{children:a.avatar?(0,t.jsx)(B.Clickable,{onClick:f,style:{display:"flex"},children:(0,t.jsx)(E.Img,{alt:"Avatar",src:a.avatar,size:"FULL",borderRadius:"ROUNDED"})}):(0,t.jsx)(O,{variant:"TRANSPARENT",icon:"Settings",circular:!0,size:"SM",onClick:f})})})})]})})}),(a==null?void 0:a.subHeader)&&(0,t.jsx)(He,{children:(0,t.jsx)(m.Container.Horizontal,{align:"BETWEEN_CENTER",children:a==null?void 0:a.subHeader})})]})}var z=d.styled.div`
   display: flex;
   width: 2.5rem;
-`,se=f.styled.div`
+`,me=d.styled.div`
   max-width: 73.5rem;
   width: 100%;
   height: 4rem;
@@ -11,7 +11,7 @@
   padding: 0.25rem 0.25rem 0 0.25rem;
   display: flex;
   justify-content: center;
-`,de=f.styled.div`
+`,fe=d.styled.div`
   width: 100vw;
   position: relative;
   left: 50%;
@@ -19,7 +19,13 @@
   margin-left: -50vw;
   margin-right: -50vw;
   background-color: ${({theme:e})=>e.colors.header.background};
-`,le=f.styled.div`
+`,He=d.styled.div`
   background-color: ${({theme:e})=>e.colors.header.sub};
   border-radius: 0 0 0.4rem 0.4rem;
-`;var D=require("@mobilestockweb/button");var U=require("react/jsx-runtime");function M(n){var i=n,{icon:e,text:r}=i,o=c(i,["icon","text"]);return(0,U.jsx)(D.Button,l({icon:e,text:r,size:"SM",variant:"LINK",iconAlign:"ABOVE-TEXT"},o))}var _=require("react"),I=require("@mobilestockweb/container");var G=require("react");function S(e){let{setSubHeader:r}=p();(0,G.useEffect)(()=>(r(e),()=>{r(void 0)}),[r])}var W=require("react/jsx-runtime"),F=(0,_.forwardRef)(function(i,n){var a=i,{children:r}=a,o=c(a,["children"]);return S((0,W.jsx)(I.Container.Horizontal,g(l({ref:n,full:!0,align:"CENTER_CENTER"},o),{children:r}))),null});var X=require("react"),$=require("@mobilestockweb/container");var q=require("react/jsx-runtime"),K=(0,X.forwardRef)(function(i,n){var a=i,{children:r}=a,o=c(a,["children"]);return S((0,q.jsx)($.Container.Vertical,g(l({ref:n,full:!0},o),{children:r}))),null});function ce(){throw new Error("The SubHeader component should not be used directly. Use SubHeader.Vertical or SubHeader.Horizontal.")}var J=Object.assign(ce,{Vertical:K,Horizontal:F,Button:M});var x=require("expo-router"),s=require("react"),Q=require("@mobilestockweb/container");var P=require("react/jsx-runtime");function Y({children:e,appName:r,avatar:o,logo:n,pressOnAvatar:i,pressOnTitle:a}){let d=(0,x.useRouter)(),H=(0,x.usePathname)(),[m,C]=(0,s.useState)(void 0),[w,Z]=(0,s.useState)(!1);(0,s.useEffect)(()=>{Z(H!=="/")},[H]);let y=(0,s.useCallback)(()=>{d.canGoBack()?d.back():d.replace("/")},[d]),j=(0,s.useMemo)(()=>({appName:r,avatar:o,logo:n,subHeader:m,isBackArrowVisible:w,setSubHeader:C,pressOnAvatar:i,pressOnTitle:a,onNavigateBack:y}),[r,o,n,m,w,i,a,y]);return(0,P.jsx)(E.Provider,{value:j,children:(0,P.jsx)(Q.Container.Main,{children:e})})}0&&(module.exports={Header,HeaderProvider,SubHeader,useHeader});
+`,L=(0,d.styled)(U.Typography)`
+  color: ${({theme:e})=>h.default.defineTextColor(e.colors.header.background)};
+`,O=(0,d.styled)(D.Button)`
+  svg * {
+    color: ${({theme:e})=>h.default.defineTextColor(e.colors.header.background)} !important;
+  }
+`;var $=require("@mobilestockweb/button");var _=require("react/jsx-runtime");function I(n){var i=n,{icon:e,text:r}=i,o=p(i,["icon","text"]);return(0,_.jsx)($.Button,c({icon:e,text:r,size:"SM",variant:"LINK",iconAlign:"ABOVE-TEXT"},o))}var W=require("react"),X=require("@mobilestockweb/container");var F=require("react");function T(e){let{setSubHeader:r}=u();(0,F.useEffect)(()=>(r(e),()=>{r(void 0)}),[r])}var q=require("react/jsx-runtime"),K=(0,W.forwardRef)(function(i,n){var a=i,{children:r}=a,o=p(a,["children"]);return T((0,q.jsx)(X.Container.Horizontal,v(c({ref:n,full:!0,align:"CENTER_CENTER"},o),{children:r}))),null});var J=require("react"),Q=require("@mobilestockweb/container");var Z=require("react/jsx-runtime"),Y=(0,J.forwardRef)(function(i,n){var a=i,{children:r}=a,o=p(a,["children"]);return T((0,Z.jsx)(Q.Container.Vertical,v(c({ref:n,full:!0},o),{children:r}))),null});function Ce(){throw new Error("The SubHeader component should not be used directly. Use SubHeader.Vertical or SubHeader.Horizontal.")}var j=Object.assign(Ce,{Vertical:Y,Horizontal:K,Button:I});var N=require("expo-router"),s=require("react"),ee=require("@mobilestockweb/container");var P=require("react/jsx-runtime");function re({children:e,appName:r,avatar:o,logo:n,pressOnAvatar:i,pressOnTitle:a}){let l=(0,N.useRouter)(),C=(0,N.usePathname)(),[f,b]=(0,s.useState)(void 0),[R,oe]=(0,s.useState)(!1);(0,s.useEffect)(()=>{oe(C!=="/")},[C]);let w=(0,s.useCallback)(()=>{l.canGoBack()?l.back():l.replace("/")},[l]),te=(0,s.useMemo)(()=>({appName:r,avatar:o,logo:n,subHeader:f,isBackArrowVisible:R,setSubHeader:b,pressOnAvatar:i,pressOnTitle:a,onNavigateBack:w}),[r,o,n,f,R,i,a,w]);return(0,P.jsx)(k.Provider,{value:te,children:(0,P.jsx)(ee.Container.Main,{children:e})})}0&&(module.exports={Header,HeaderProvider,SubHeader,useHeader});

package/package.json

@@ -1,13 +1,14 @@
 {
   "name": "@mobilestockweb/header",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "main": "index.js",
   "dependencies": {
-    "@mobilestockweb/button": "^1.0.4",
     "@mobilestockweb/clickable": "^1.0.2",
-    "@mobilestockweb/container": "^0.0.3",
+    "@mobilestockweb/button": "^1.0.4",
     "@mobilestockweb/image": "^0.0.6",
-    "@mobilestockweb/typography": "^0.0.5"
+    "@mobilestockweb/typography": "^0.0.5",
+    "@mobilestockweb/tools": "^0.0.15",
+    "@mobilestockweb/container": "^0.0.3"
   },
   "peerDependencies": {
     "react": "18.2.0",