@oxyhq/services 0.0.21 → 0.0.22

package/dist/components/auth/AccountSwitcher.js

@@ -4,8 +4,8 @@ import { signOut } from "next-auth/react";
 import useOxySession from "../../hooks/useOxySession";
 function UserInfo({ setDisplayUserInfo }) {
     const { session } = useOxySession();
-    return (React.createElement("div", { className: "relative z-10 flex flex-col items-center justify-center\n    space-y-3 rounded-2xl bg-darkC2 px-5 py-3 text-sm font-medium text-textC\n    shadow-md shadow-[#b4bebb]" },
-        React.createElement("button", { onClick: () => setDisplayUserInfo((prev) => false), className: "absolute right-3 top-3 rounded-full bg-darkC2 p-1 hover:bg-darkC" }),
+    return (React.createElement("div", { className: "fixed z-10 flex flex-col items-center justify-center\n    space-y-3 rounded-2xl bg-dark px-5 py-3 text-sm font-medium text-textC\n    shadow-md shadow-[#b4bebb]" },
+        React.createElement("button", { onClick: () => setDisplayUserInfo((prev) => false), className: "absolute right-3 top-3 rounded-full bg-dark p-1 hover:bg-dark" }),
         React.createElement("p", null, session?.user?.email),
         React.createElement("div", { className: "h-20 w-20 rounded-full border" },
             React.createElement(Image, { src: session?.user?.avatar, className: "h-full w-full rounded-full object-center", height: 500, width: 500, draggable: false, alt: "avatar" })),
@@ -15,9 +15,9 @@ function UserInfo({ setDisplayUserInfo }) {
             "!"),
         React.createElement("button", { className: "rounded-full border border-black px-7 py-2 text-textC2 hover:bg-[#d3dfee]" }, "Manage your Oxy Account"),
         React.createElement("div", { className: "flex space-x-1" },
-            React.createElement("button", { className: "tablet:w-44 flex w-36 items-center space-x-2 rounded-l-full bg-white py-3 pl-3  hover:bg-darkC" },
+            React.createElement("button", { className: "tablet:w-44 flex w-36 items-center space-x-2 rounded-l-full bg-white py-3 pl-3  hover:bg-dark" },
                 React.createElement("span", null, "Add account")),
-            React.createElement("button", { onClick: () => signOut(), className: "tablet:w-44 flex w-36 items-center space-x-2 rounded-r-full bg-white py-3 pl-3  hover:bg-darkC" },
+            React.createElement("button", { onClick: () => signOut(), className: "tablet:w-44 flex w-36 items-center space-x-2 rounded-r-full bg-white py-3 pl-3  hover:bg-dark" },
                 React.createElement("span", null, "Sign out"))),
         React.createElement("div", { className: "flex h-10 items-center space-x-2 text-xs" },
             React.createElement("span", null, "Privacy policy"),

package/dist/components/auth/OAvatar.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+export declare const OAvatar: ({ icon, text, callback, }: {
+    icon?: React.ReactNode;
+    text?: string;
+    callback?: string;
+}) => React.JSX.Element;
+export default OAvatar;
+//# sourceMappingURL=OAvatar.d.ts.map

package/dist/components/auth/OAvatar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OAvatar.d.ts","sourceRoot":"","sources":["../../../src/components/auth/OAvatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,eAAO,MAAM,OAAO,8BAIjB;IACD,IAAI,CAAC,EAAE,MAAM,SAAS,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,sBAkBA,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/components/auth/OAvatar.js

@@ -0,0 +1,18 @@
+import React from "react";
+import styles from "./oavatar.module.css";
+import { OxyLogo } from "../assets/oxy-logo";
+import useOxySession from "../../hooks/useOxySession";
+export const OAvatar = ({ icon = React.createElement(OxyLogo, null), text = "Sign in with Oxy", callback = window.location.href, }) => {
+    const { session } = useOxySession();
+    const onClick = () => {
+        if (!session?.user?.id) {
+            const redirectUrl = `https://auth.oxy.so/?callback=${encodeURIComponent(callback)}`;
+            window.location.href = redirectUrl;
+        }
+        else {
+            // Open account switcher logic here
+        }
+    };
+    return (React.createElement("button", { onClick: onClick, className: styles.oavatar }, icon && icon));
+};
+export default OAvatar;

package/dist/components/auth/SignInButton.js

@@ -1,5 +1,5 @@
 import React from "react";
-import styles from "./sign-in-button.module.css";
+import styles from "./styles/sign-in-button.module.css";
 import { OxyLogo } from "../assets/oxy-logo";
 export const SignInButton = ({ icon = React.createElement(OxyLogo, null), text = "Sign in with Oxy", callback = window.location.href, }) => {
     const onClick = () => {

package/dist/components/auth/styles/oavatar.module.css

@@ -0,0 +1,34 @@
+.oavatar {
+  width: 2rem;
+  height: 2rem;
+  padding: 0.7em;
+  border-radius: 100vmax;
+  font-size: var(--fs-milli);
+  font-weight: var(--fw-700);
+  color: var(--clr-dark);
+  background-color: var(--clr-light);
+  border: 1px solid var(--clr-auth-border);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+  transition: background 0.2s ease-in-out;
+}
+.oavatar:hover {
+  background-color: var(--clr-auth-button-hover);
+}
+.oavatar:active {
+  background-color: var(--clr-auth-button-active);
+}
+.oavatar:focus-visible {
+  outline: 2px solid var(--clr-light);
+  background-color: var(--clr-auth-button-hover);
+}
+.oavatar svg {
+  width: var(--fs-h2);
+  height: var(--fs-h2);
+  fill: var(--clr-dark);
+  margin-right: 0.5em;
+}
+
+/*# sourceMappingURL=oavatar.module.css.map */

package/dist/components/auth/styles/oavatar.module.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../../../../src/components/auth/styles/oavatar.module.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA","file":"oavatar.module.css"}

package/dist/components/auth/styles/sign-in-button.module.css

@@ -0,0 +1,30 @@
+.container {
+  width: 100%;
+  padding: 0.7em;
+  border-radius: 100vmax;
+  background-color: var(--clr-light);
+  border: 1px solid var(--clr-auth-border);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+  transition: background 0.2s ease-in-out;
+}
+.container:hover {
+  background-color: var(--clr-auth-button-hover);
+}
+.container:active {
+  background-color: var(--clr-auth-button-active);
+}
+.container:focus-visible {
+  outline: 2px solid var(--clr-light);
+  background-color: var(--clr-auth-button-hover);
+}
+.container svg {
+  width: var(--fs-h2);
+  height: var(--fs-h2);
+  fill: var(--clr-dark);
+  margin-right: 0.5em;
+}
+
+/*# sourceMappingURL=sign-in-button.module.css.map */

package/dist/components/auth/styles/sign-in-button.module.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../../../../src/components/auth/styles/sign-in-button.module.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA","file":"sign-in-button.module.css"}

package/dist/index.d.ts

@@ -2,5 +2,6 @@ import useOxySession from "./hooks/useOxySession";
 import getUserById from "./hooks/getUserById";
 import SignInButton from "./components/auth/SignInButton";
 import AccountSwitcher from "./components/auth/AccountSwitcher";
-export { useOxySession, getUserById, SignInButton, AccountSwitcher };
+import OAvatar from "./components/auth/OAvatar";
+export { useOxySession, getUserById, SignInButton, AccountSwitcher, OAvatar };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,MAAM,uBAAuB,CAAC;AAClD,OAAO,WAAW,MAAM,qBAAqB,CAAC;AAC9C,OAAO,YAAY,MAAM,gCAAgC,CAAC;AAC1D,OAAO,eAAe,MAAM,mCAAmC,CAAC;AAEhE,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,YAAY,EAAE,eAAe,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,MAAM,uBAAuB,CAAC;AAClD,OAAO,WAAW,MAAM,qBAAqB,CAAC;AAC9C,OAAO,YAAY,MAAM,gCAAgC,CAAC;AAC1D,OAAO,eAAe,MAAM,mCAAmC,CAAC;AAChE,OAAO,OAAO,MAAM,2BAA2B,CAAC;AAEhD,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,YAAY,EAAE,eAAe,EAAE,OAAO,EAAE,CAAC"}

package/dist/index.js

@@ -2,4 +2,5 @@ import useOxySession from "./hooks/useOxySession";
 import getUserById from "./hooks/getUserById";
 import SignInButton from "./components/auth/SignInButton";
 import AccountSwitcher from "./components/auth/AccountSwitcher";
-export { useOxySession, getUserById, SignInButton, AccountSwitcher };
+import OAvatar from "./components/auth/OAvatar";
+export { useOxySession, getUserById, SignInButton, AccountSwitcher, OAvatar };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oxyhq/services",
-  "version": "0.0.21",
+  "version": "0.0.22",
   "description": "",
   "homepage": "https://oxy.so/",
   "main": "./dist/index.js",