@oxyhq/services 0.0.73 → 0.0.75

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/dist/components/auth/SignInButton.js +1 -1
  2. package/dist/components/auth/styles/oavatar.module.css +34 -0
  3. package/dist/components/auth/styles/oavatar.module.css.map +1 -0
  4. package/dist/components/auth/styles/sign-in-button.module.css +30 -0
  5. package/dist/components/auth/styles/sign-in-button.module.css.map +1 -0
  6. package/dist/components/elements/button/components/styles/button.module.css +25 -0
  7. package/dist/components/elements/button/components/styles/button.module.css.map +1 -0
  8. package/dist/components/elements/ellipsis-wrapper/components/styles/ellipses-wrapper.module.css +11 -0
  9. package/dist/components/elements/ellipsis-wrapper/components/styles/ellipses-wrapper.module.css.map +1 -0
  10. package/dist/components/elements/ellipsis-wrapper/index.d.ts +1 -1
  11. package/dist/components/elements/ellipsis-wrapper/index.d.ts.map +1 -1
  12. package/dist/components/elements/ellipsis-wrapper/index.js +1 -1
  13. package/dist/components/elements/modal/components/confirmation-modal.js +1 -1
  14. package/dist/components/elements/modal/components/modal.js +1 -1
  15. package/dist/components/elements/modal/components/styles/confirmation-modal.module.css +105 -0
  16. package/dist/components/elements/modal/components/styles/confirmation-modal.module.css.map +1 -0
  17. package/dist/components/elements/modal/components/styles/modal.module.css +10 -0
  18. package/dist/components/elements/modal/components/styles/modal.module.css.map +1 -0
  19. package/dist/features/profile/components/styles/avatar.module.css +15 -0
  20. package/dist/features/profile/components/styles/avatar.module.css.map +1 -0
  21. package/dist/features/profile/components/styles/user-name.module.css +18 -0
  22. package/dist/features/profile/components/styles/user-name.module.css.map +1 -0
  23. package/dist/features/profile/components/styles/user-username.module.css +6 -0
  24. package/dist/features/profile/components/styles/user-username.module.css.map +1 -0
  25. package/dist/features/profile/components/user-name.js +1 -1
  26. package/dist/features/profile/components/user-username.js +1 -1
  27. package/dist/hooks/get-user.d.ts +2 -0
  28. package/dist/hooks/get-user.d.ts.map +1 -0
  29. package/dist/hooks/get-user.js +31 -0
  30. package/dist/index.css +5 -0
  31. package/dist/index.css.map +1 -0
  32. package/package.json +6 -5
@@ -1,5 +1,5 @@
1
1
  import React from "react";
2
- import styles from "./styles/sign-in-button.module.css";
2
+ import styles from "./styles/sign-in-button.module.scss";
3
3
  import { OxyLogo } from "../assets/oxy-logo";
4
4
  export const SignInButton = ({ icon = React.createElement(OxyLogo, null), text = "Sign in with Oxy", callback = typeof window !== "undefined" ? window.location.href : "", }) => {
5
5
  const onClick = () => {
@@ -0,0 +1,34 @@
1
+ .oavatar {
2
+ width: 2rem;
3
+ height: 2rem;
4
+ padding: 0.7em;
5
+ border-radius: 100vmax;
6
+ font-size: var(--fs-milli);
7
+ font-weight: var(--fw-700);
8
+ color: var(--clr-dark);
9
+ background-color: var(--clr-light);
10
+ border: 1px solid var(--clr-auth-border);
11
+ display: flex;
12
+ justify-content: center;
13
+ align-items: center;
14
+ cursor: pointer;
15
+ transition: background 0.2s ease-in-out;
16
+ }
17
+ .oavatar:hover {
18
+ background-color: var(--clr-auth-button-hover);
19
+ }
20
+ .oavatar:active {
21
+ background-color: var(--clr-auth-button-active);
22
+ }
23
+ .oavatar:focus-visible {
24
+ outline: 2px solid var(--clr-light);
25
+ background-color: var(--clr-auth-button-hover);
26
+ }
27
+ .oavatar svg {
28
+ width: var(--fs-h2);
29
+ height: var(--fs-h2);
30
+ fill: var(--clr-dark);
31
+ margin-right: 0.5em;
32
+ }
33
+
34
+ /*# sourceMappingURL=oavatar.module.css.map */
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,30 @@
1
+ .container {
2
+ width: 100%;
3
+ padding: 0.7em;
4
+ border-radius: 100vmax;
5
+ background-color: var(--clr-light);
6
+ border: 1px solid var(--clr-auth-border);
7
+ display: flex;
8
+ justify-content: center;
9
+ align-items: center;
10
+ cursor: pointer;
11
+ transition: background 0.2s ease-in-out;
12
+ }
13
+ .container:hover {
14
+ background-color: var(--clr-auth-button-hover);
15
+ }
16
+ .container:active {
17
+ background-color: var(--clr-auth-button-active);
18
+ }
19
+ .container:focus-visible {
20
+ outline: 2px solid var(--clr-light);
21
+ background-color: var(--clr-auth-button-hover);
22
+ }
23
+ .container svg {
24
+ width: var(--fs-h2);
25
+ height: var(--fs-h2);
26
+ fill: var(--clr-dark);
27
+ margin-right: 0.5em;
28
+ }
29
+
30
+ /*# sourceMappingURL=sign-in-button.module.css.map */
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,25 @@
1
+ .container {
2
+ cursor: pointer;
3
+ display: grid;
4
+ place-items: center;
5
+ padding: 0.5em;
6
+ border-radius: 100vmax;
7
+ transition: background-color 0.15s ease-in-out;
8
+ }
9
+ .container svg {
10
+ width: var(--fs-h2);
11
+ height: var(--fs-h2);
12
+ fill: var(--clr-secondary);
13
+ }
14
+ .container:hover {
15
+ background-color: var(--clr-nav-hover);
16
+ }
17
+ .container:active {
18
+ background-color: var(--clr-nav-active);
19
+ }
20
+ .container:focus-visible {
21
+ outline: 2px solid var(--clr-secondary);
22
+ background-color: var(--clr-nav-hover);
23
+ }
24
+
25
+ /*# sourceMappingURL=button.module.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../../../../../src/components/elements/button/components/styles/button.module.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA","file":"button.module.css"}
@@ -0,0 +1,11 @@
1
+ .container {
2
+ display: grid;
3
+ grid-auto-flow: column;
4
+ }
5
+ .container * {
6
+ white-space: nowrap;
7
+ text-overflow: ellipsis;
8
+ overflow: hidden;
9
+ }
10
+
11
+ /*# sourceMappingURL=ellipses-wrapper.module.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../../../../../src/components/elements/ellipsis-wrapper/components/styles/ellipses-wrapper.module.scss"],"names":[],"mappings":"AAAA;EACE;EACA;;AAEA;EACE;EACA;EACA","file":"ellipses-wrapper.module.css"}
@@ -1,2 +1,2 @@
1
- export * from "./components/ellipsis-wrapper";
1
+ export * from "./components/EllipsisWrapper";
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/elements/ellipsis-wrapper/index.ts"],"names":[],"mappings":"AAAA,cAAc,+BAA+B,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/elements/ellipsis-wrapper/index.ts"],"names":[],"mappings":"AAAA,cAAc,8BAA8B,CAAC"}
@@ -1 +1 @@
1
- export * from "./components/ellipsis-wrapper";
1
+ export * from "./components/EllipsisWrapper";
@@ -1,6 +1,6 @@
1
1
  import React, { useEffect } from "react";
2
2
  import { motion } from "framer-motion";
3
- import styles from "./styles/confirmation-modal.module.css";
3
+ import styles from "./styles/confirmation-modal.module.scss";
4
4
  export const ConfirmationModal = ({ heading, paragraph, confirmButtonText, confirmButtonClick, confirmButtonStyle = "delete", cancelButtonText, cancelButtonClick, logo, }) => {
5
5
  useEffect(() => {
6
6
  document.body.style.overflow = "hidden";
@@ -5,7 +5,7 @@
5
5
  import { motion } from "framer-motion";
6
6
  import React, { useCallback, useLayoutEffect, useRef } from "react";
7
7
  import { createPortal } from "react-dom";
8
- import styles from "./styles/modal.module.css";
8
+ import styles from "./styles/modal.module.scss";
9
9
  export const Modal = ({ children, onClose, closeOnBackdropClick = true, background, minViewportWidth = null, maxViewportWidth = null, disableScroll = false, focusOnElement = null, focusAfterClose = null, }) => {
10
10
  const modalRef = useRef(null);
11
11
  const previouslyFocusedElementRef = useRef(null);
@@ -0,0 +1,105 @@
1
+ .container {
2
+ position: fixed;
3
+ top: 0;
4
+ left: 0;
5
+ bottom: 0;
6
+ right: 0;
7
+ width: fit-content;
8
+ max-width: 320px;
9
+ height: fit-content;
10
+ margin: auto;
11
+ background-color: var(--clr-background);
12
+ padding: 2em;
13
+ border-radius: 1rem;
14
+ }
15
+ .container .logo {
16
+ display: grid;
17
+ place-items: center;
18
+ margin-bottom: 1em;
19
+ }
20
+ .container .logo svg {
21
+ width: var(--fs-kilo);
22
+ height: var(--fs-kilo);
23
+ fill: var(--clr-primary);
24
+ }
25
+ .container h1 {
26
+ font-size: var(--fs-h2);
27
+ font-weight: var(--fw-700);
28
+ margin-bottom: 0.5em;
29
+ }
30
+ .container p {
31
+ font-size: var(--fs-milli);
32
+ color: var(--clr-tertiary);
33
+ margin-bottom: 2rem;
34
+ line-height: 1.4;
35
+ }
36
+ .container .buttons {
37
+ display: grid;
38
+ gap: 0.8rem;
39
+ }
40
+ .container .buttons button {
41
+ display: grid;
42
+ place-items: center;
43
+ padding: 0.9em;
44
+ border-radius: 100vmax;
45
+ font-size: var(--fs-milli);
46
+ font-weight: var(--fw-700);
47
+ cursor: pointer;
48
+ transition: background-color 0.2s ease;
49
+ }
50
+ .container .buttons .delete {
51
+ background-color: var(--clr-red);
52
+ }
53
+ .container .buttons .delete:hover {
54
+ background-color: var(--clr-red-hover);
55
+ }
56
+ .container .buttons .delete:active {
57
+ background-color: var(--clr-red-active);
58
+ }
59
+ .container .buttons .delete:focus-visible {
60
+ outline: 2px solid var(--clr-secondary);
61
+ background-color: var(--clr-red-hover);
62
+ }
63
+ .container .buttons .unfollow {
64
+ background-color: var(--clr-secondary);
65
+ color: var(--clr-background);
66
+ }
67
+ .container .buttons .unfollow:hover {
68
+ background-color: var(--clr-secondary-hover);
69
+ }
70
+ .container .buttons .unfollow:active {
71
+ background-color: var(--clr-secondary-active);
72
+ }
73
+ .container .buttons .unfollow:focus-visible {
74
+ outline: 2px solid var(--clr-secondary);
75
+ }
76
+ .container .buttons .signout {
77
+ background-color: var(--clr-secondary);
78
+ color: var(--clr-background);
79
+ }
80
+ .container .buttons .signout:hover {
81
+ background-color: var(--clr-signout-logout-hover);
82
+ }
83
+ .container .buttons .signout:active {
84
+ background-color: var(--clr-signout-logout-active);
85
+ }
86
+ .container .buttons .signout:focus-visible {
87
+ outline: 2px solid var(--clr-secondary);
88
+ background-color: var(--clr-signout-logout-hover);
89
+ }
90
+ .container .buttons .cancel {
91
+ color: var(--clr-secondary);
92
+ border: 1px solid var(--clr-tertiary);
93
+ }
94
+ .container .buttons .cancel:hover {
95
+ background-color: var(--clr-trends-hover);
96
+ }
97
+ .container .buttons .cancel:active {
98
+ background-color: var(--clr-trends-active);
99
+ }
100
+ .container .buttons .cancel:focus-visible {
101
+ outline: 2px solid var(--clr-secondary);
102
+ background-color: var(--clr-trends-hover);
103
+ }
104
+
105
+ /*# sourceMappingURL=confirmation-modal.module.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../../../../../src/components/elements/modal/components/styles/confirmation-modal.module.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAIJ;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAIJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA","file":"confirmation-modal.module.css"}
@@ -0,0 +1,10 @@
1
+ .container {
2
+ z-index: var(--z-index-modal-backdrop);
3
+ position: fixed;
4
+ top: 0;
5
+ left: 0;
6
+ width: 100%;
7
+ height: 100%;
8
+ }
9
+
10
+ /*# sourceMappingURL=modal.module.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../../../../../src/components/elements/modal/components/styles/modal.module.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA","file":"modal.module.css"}
@@ -0,0 +1,15 @@
1
+ .container {
2
+ position: relative;
3
+ width: var(--avatar-width);
4
+ border-radius: 50%;
5
+ overflow: hidden;
6
+ aspect-ratio: 1/1;
7
+ }
8
+ .container img {
9
+ display: block;
10
+ width: 100%;
11
+ height: 100%;
12
+ object-fit: cover;
13
+ }
14
+
15
+ /*# sourceMappingURL=avatar.module.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../../../../src/features/profile/components/styles/avatar.module.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA","file":"avatar.module.css"}
@@ -0,0 +1,18 @@
1
+ .container {
2
+ font-size: var(--fs-milli);
3
+ font-weight: var(--fw-500);
4
+ color: var(--clr-secondary);
5
+ display: grid;
6
+ grid-auto-flow: column;
7
+ }
8
+ .container span {
9
+ white-space: nowrap;
10
+ overflow: hidden;
11
+ text-overflow: ellipsis;
12
+ }
13
+
14
+ .hover:hover {
15
+ text-decoration: underline;
16
+ }
17
+
18
+ /*# sourceMappingURL=user-name.module.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../../../../src/features/profile/components/styles/user-name.module.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAKF;EACE","file":"user-name.module.css"}
@@ -0,0 +1,6 @@
1
+ .container {
2
+ font-size: var(--fs-milli);
3
+ color: var(--clr-tertiary);
4
+ }
5
+
6
+ /*# sourceMappingURL=user-username.module.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../../../../src/features/profile/components/styles/user-username.module.scss"],"names":[],"mappings":"AAAA;EACE;EACA","file":"user-username.module.css"}
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
2
  import { VerifiedIcon } from "../../../assets/verified-icon";
3
- import styles from "./styles/user-name.module.css";
3
+ import styles from "./styles/user-name.module.scss";
4
4
  export const UserName = ({ name, isVerified = false, hover = false, }) => {
5
5
  return (React.createElement("div", { className: `${styles.container} ${hover ? styles.hover : ""}` },
6
6
  name && React.createElement("span", null, name),
@@ -1,5 +1,5 @@
1
1
  import React from "react";
2
- import styles from "./styles/user-username.module.css";
2
+ import styles from "./styles/user-username.module.scss";
3
3
  export const UserUsername = ({ username, }) => {
4
4
  return React.createElement("span", { className: styles.container },
5
5
  "@",
@@ -0,0 +1,2 @@
1
+ export declare const getUser: (id: string | undefined) => Promise<any>;
2
+ //# sourceMappingURL=get-user.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"get-user.d.ts","sourceRoot":"","sources":["../../src/hooks/get-user.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,OAAc,MAAM,GAAG,SAAS,iBA0BnD,CAAC"}
@@ -0,0 +1,31 @@
1
+ import axios from "axios";
2
+ import { OXY_AUTH_URL } from "../config";
3
+ export const getUser = async (id) => {
4
+ if (!id) {
5
+ throw new Error("User ID is required");
6
+ }
7
+ try {
8
+ const response = await axios.get(OXY_AUTH_URL + `/api/users/${id}`);
9
+ return response.data;
10
+ }
11
+ catch (error) {
12
+ if (axios.isAxiosError(error)) {
13
+ if (error.response) {
14
+ // Server responded with a status code outside of 2xx
15
+ throw new Error(`Server responded with status ${error.response.status}: ${error.response.data}`);
16
+ }
17
+ else if (error.request) {
18
+ // Request was made but no response received
19
+ throw new Error("No response received from server");
20
+ }
21
+ else {
22
+ // Error setting up the request
23
+ throw new Error(`Axios error: ${error.message}`);
24
+ }
25
+ }
26
+ else {
27
+ // Non-Axios error
28
+ throw error;
29
+ }
30
+ }
31
+ };
package/dist/index.css ADDED
@@ -0,0 +1,5 @@
1
+ @tailwind base;
2
+ @tailwind components;
3
+ @tailwind utilities;
4
+
5
+ /*# sourceMappingURL=index.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../src/index.css"],"names":[],"mappings":"AAAA;AACA;AACA","file":"index.css"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oxyhq/services",
3
- "version": "0.0.73",
3
+ "version": "0.0.75",
4
4
  "description": "",
5
5
  "homepage": "https://oxy.so/",
6
6
  "main": "./dist/index.js",
@@ -9,11 +9,11 @@
9
9
  "dist"
10
10
  ],
11
11
  "scripts": {
12
- "build:scss": "sass src:temp",
13
- "copy:css": "ncp temp dist",
12
+ "build:scss": "sass src:dist",
14
13
  "build:ts": "tsc",
15
14
  "clean": "rimraf dist",
16
- "build": "npm run clean && npm run build:scss && npm run build:ts && npm run copy:css",
15
+ "copy:scss": "cpx 'src/**/*.scss' dist",
16
+ "build": "npm run clean && npm run build:scss && npm run build:ts && npm run copy:scss",
17
17
  "test": "jest",
18
18
  "lint": "eslint src/**/*.{ts,tsx}"
19
19
  },
@@ -39,7 +39,8 @@
39
39
  "ncp": "^2.0.0",
40
40
  "sass": "^1.77.2",
41
41
  "tailwindcss": "^3.4.3",
42
- "typescript": "^5.4.5"
42
+ "typescript": "^5.4.5",
43
+ "cpx": "^1.5.0"
43
44
  },
44
45
  "dependencies": {
45
46
  "@tanstack/react-query": "^5.40.0",