@oxyhq/services 0.0.76 → 0.0.77

package/dist/components/elements/ellipsis-wrapper/components/EllipsisWrapper.tsx

@@ -1,18 +0,0 @@
-import React from "react";
-import styles from "./styles/ellipses-wrapper.module.scss";
-
-export const EllipsisWrapper = ({
-  children,
-}: {
-  children: React.ReactNode;
-}) => {
-  return (
-    <div
-      aria-hidden={true}
-      role="presentation"
-      className="grid grid-flow-col [&>*]:truncate"
-    >
-      {children}
-    </div>
-  );
-};

package/dist/components/elements/ellipsis-wrapper/components/styles/ellipses-wrapper.module.css

@@ -1,11 +0,0 @@
-.container {
-  display: grid;
-  grid-auto-flow: column;
-}
-.container * {
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-
-/*# sourceMappingURL=ellipses-wrapper.module.css.map */

package/dist/components/elements/ellipsis-wrapper/components/styles/ellipses-wrapper.module.css.map

@@ -1 +0,0 @@
-{"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"}

package/dist/components/elements/ellipsis-wrapper/components/styles/ellipses-wrapper.module.scss

@@ -1,10 +0,0 @@
-.container {
-  display: grid;
-  grid-auto-flow: column;
-
-  * {
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-  }
-}

package/dist/components/elements/ellipsis-wrapper/index.ts

@@ -1 +0,0 @@
-export * from "./components/EllipsisWrapper";

package/dist/components/elements/modal/components/confirmation-modal.tsx

@@ -1,62 +0,0 @@
-import React, { useEffect } from "react";
-import { motion } from "framer-motion";
-import styles from "./styles/confirmation-modal.module.scss";
-
-export const ConfirmationModal = ({
-  heading,
-  paragraph,
-  confirmButtonText,
-  confirmButtonClick,
-  confirmButtonStyle = "delete",
-  cancelButtonText,
-  cancelButtonClick,
-  logo,
-}: {
-  heading: string;
-  paragraph: string;
-  confirmButtonText: string;
-  confirmButtonClick: () => void;
-  confirmButtonStyle: "delete" | "unfollow" | "logout";
-  cancelButtonText: string;
-  cancelButtonClick: () => void;
-  logo?: React.ReactNode;
-}) => {
-  useEffect(() => {
-    document.body.style.overflow = "hidden";
-    document.body.style.paddingRight = "11px";
-
-    return () => {
-      document.body.style.overflow = "unset";
-      document.body.style.paddingRight = "0";
-    };
-  }, []);
-
-  return (
-    <motion.div
-      initial={{ opacity: 0, y: 50 }}
-      animate={{ opacity: 1, y: 0 }}
-      exit={{ opacity: 0, y: 50 }}
-      transition={{ duration: 0.2 }}
-      className={styles.container}
-    >
-      {logo && <div className={styles.logo}>{logo}</div>}
-      <h1>{heading}</h1>
-      <p>{paragraph}</p>
-
-      <div className={styles.buttons}>
-        <button
-          onClick={confirmButtonClick}
-          className={`${styles.confirm} ${
-            styles[confirmButtonStyle as "delete" | "unfollow" | "logout"]
-          }
-        }`}
-        >
-          {confirmButtonText}
-        </button>
-        <button onClick={cancelButtonClick} className={styles.cancel}>
-          {cancelButtonText}
-        </button>
-      </div>
-    </motion.div>
-  );
-};

package/dist/components/elements/modal/components/modal.tsx

@@ -1,182 +0,0 @@
-/* eslint-disable jsx-a11y/no-static-element-interactions */
-/* eslint-disable jsx-a11y/click-events-have-key-events */
-/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
-"use client";
-import { motion } from "framer-motion";
-import React, { useCallback, useLayoutEffect, useRef } from "react";
-import { createPortal } from "react-dom";
-
-import styles from "./styles/modal.module.scss";
-
-export const Modal = ({
-  children,
-  onClose,
-  closeOnBackdropClick = true,
-  background,
-  minViewportWidth = null,
-  maxViewportWidth = null,
-  disableScroll = false,
-  focusOnElement = null,
-  focusAfterClose = null,
-}: {
-  children: React.ReactNode;
-  onClose: () => void;
-  closeOnBackdropClick?: boolean;
-  background?: string;
-  minViewportWidth?: number | null;
-  maxViewportWidth?: number | null;
-  disableScroll?: boolean;
-  focusOnElement?: string | null;
-  focusAfterClose?: string | null;
-}) => {
-  const modalRef = useRef<HTMLDivElement>(null);
-  const previouslyFocusedElementRef = useRef<HTMLElement | null>(null);
-
-  const handleKeyDown = useCallback(
-    (e: KeyboardEvent) => {
-      if (e.key === "Escape") {
-        onClose();
-      }
-
-      if (e.key === "Tab") {
-        const modal = modalRef.current;
-        if (!modal) return;
-
-        const focusableElements = Array.from(
-          modal.querySelectorAll(
-            'a[href]:not([disabled]), button:not([disabled]), textarea:not([disabled]), input[type="text"]:not([disabled]), input[type="radio"]:not([disabled]), input[type="checkbox"]:not([disabled]), select:not([disabled])'
-          )
-        );
-        const firstFocusableElement = focusableElements[0] as HTMLElement;
-        const lastFocusableElement = focusableElements[
-          focusableElements.length - 1
-        ] as HTMLElement;
-
-        if (e.shiftKey) {
-          if (document.activeElement === firstFocusableElement) {
-            lastFocusableElement.focus();
-            e.preventDefault();
-          }
-        } else {
-          if (document.activeElement === lastFocusableElement) {
-            firstFocusableElement.focus();
-            e.preventDefault();
-          }
-        }
-      }
-    },
-    [onClose]
-  );
-
-  const handleScroll = useCallback(
-    (e: Event) => {
-      if (disableScroll) {
-        e.preventDefault();
-      }
-    },
-    [disableScroll]
-  );
-
-  const handleDisplay = useCallback(() => {
-    const modal = modalRef.current;
-    if (!modal) return;
-
-    const viewportWidth = window.innerWidth;
-
-    if (
-      (minViewportWidth && viewportWidth < minViewportWidth) ||
-      (maxViewportWidth && viewportWidth > maxViewportWidth)
-    ) {
-      onClose();
-    }
-  }, [onClose, minViewportWidth, maxViewportWidth]);
-
-  useLayoutEffect(() => {
-    const modal = modalRef.current;
-    if (!modal) return;
-
-    const focusableElements = Array.from(
-      modal.querySelectorAll(
-        'a[href]:not([disabled]), button:not([disabled]), textarea:not([disabled]), input[type="text"]:not([disabled]), input[type="radio"]:not([disabled]), input[type="checkbox"]:not([disabled]), select:not([disabled])'
-      )
-    );
-    const firstFocusableElement = focusableElements?.[0] as HTMLElement;
-
-    previouslyFocusedElementRef.current = document.activeElement as HTMLElement;
-
-    modal?.addEventListener("keydown", handleKeyDown);
-    if (focusOnElement) {
-      const elementToFocus = modal.querySelector(focusOnElement) as HTMLElement;
-      elementToFocus?.focus();
-    } else {
-      firstFocusableElement?.focus();
-    }
-
-    if (disableScroll) {
-      document.body.style.overflow = "hidden";
-      document.body.style.paddingRight = "11px";
-      window.addEventListener("scroll", handleScroll);
-    }
-
-    if (minViewportWidth || maxViewportWidth) {
-      handleDisplay();
-    }
-
-    return () => {
-      modal?.removeEventListener("keydown", handleKeyDown);
-      if (focusAfterClose) {
-        const elementToFocus = document.querySelector(
-          focusAfterClose
-        ) as HTMLElement;
-        elementToFocus?.focus();
-      } else {
-        previouslyFocusedElementRef.current?.focus();
-      }
-
-      if (disableScroll) {
-        document.body.style.overflow = "";
-        document.body.style.paddingRight = "";
-        window.removeEventListener("scroll", handleScroll);
-      }
-    };
-  }, [
-    onClose,
-    disableScroll,
-    handleKeyDown,
-    handleScroll,
-    handleDisplay,
-    minViewportWidth,
-    maxViewportWidth,
-    focusOnElement,
-    focusAfterClose,
-  ]);
-
-  const backdropStyle: React.CSSProperties = {
-    backgroundColor:
-      background === "none" ? "transparent" : "var(--clr-modal-background)",
-  };
-
-  return createPortal(
-    <motion.div
-      initial={{ opacity: 0 }}
-      animate={{ opacity: 1 }}
-      exit={{ opacity: 0 }}
-      onClick={(e) => {
-        e.stopPropagation();
-        if (e.currentTarget === e.target && closeOnBackdropClick) onClose();
-      }}
-      onKeyDown={(e) => {
-        e.stopPropagation();
-      }}
-      ref={modalRef}
-      className={`${styles.container}`}
-      style={backdropStyle}
-      id="dialog"
-      role="dialog"
-      aria-modal="true"
-    >
-      {children}
-    </motion.div>,
-    document.body
-  );
-};

package/dist/components/elements/modal/components/styles/confirmation-modal.module.css

@@ -1,105 +0,0 @@
-.container {
-  position: fixed;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  right: 0;
-  width: fit-content;
-  max-width: 320px;
-  height: fit-content;
-  margin: auto;
-  background-color: var(--clr-background);
-  padding: 2em;
-  border-radius: 1rem;
-}
-.container .logo {
-  display: grid;
-  place-items: center;
-  margin-bottom: 1em;
-}
-.container .logo svg {
-  width: var(--fs-kilo);
-  height: var(--fs-kilo);
-  fill: var(--clr-primary);
-}
-.container h1 {
-  font-size: var(--fs-h2);
-  font-weight: var(--fw-700);
-  margin-bottom: 0.5em;
-}
-.container p {
-  font-size: var(--fs-milli);
-  color: var(--clr-tertiary);
-  margin-bottom: 2rem;
-  line-height: 1.4;
-}
-.container .buttons {
-  display: grid;
-  gap: 0.8rem;
-}
-.container .buttons button {
-  display: grid;
-  place-items: center;
-  padding: 0.9em;
-  border-radius: 100vmax;
-  font-size: var(--fs-milli);
-  font-weight: var(--fw-700);
-  cursor: pointer;
-  transition: background-color 0.2s ease;
-}
-.container .buttons .delete {
-  background-color: var(--clr-red);
-}
-.container .buttons .delete:hover {
-  background-color: var(--clr-red-hover);
-}
-.container .buttons .delete:active {
-  background-color: var(--clr-red-active);
-}
-.container .buttons .delete:focus-visible {
-  outline: 2px solid var(--clr-secondary);
-  background-color: var(--clr-red-hover);
-}
-.container .buttons .unfollow {
-  background-color: var(--clr-secondary);
-  color: var(--clr-background);
-}
-.container .buttons .unfollow:hover {
-  background-color: var(--clr-secondary-hover);
-}
-.container .buttons .unfollow:active {
-  background-color: var(--clr-secondary-active);
-}
-.container .buttons .unfollow:focus-visible {
-  outline: 2px solid var(--clr-secondary);
-}
-.container .buttons .signout {
-  background-color: var(--clr-secondary);
-  color: var(--clr-background);
-}
-.container .buttons .signout:hover {
-  background-color: var(--clr-signout-logout-hover);
-}
-.container .buttons .signout:active {
-  background-color: var(--clr-signout-logout-active);
-}
-.container .buttons .signout:focus-visible {
-  outline: 2px solid var(--clr-secondary);
-  background-color: var(--clr-signout-logout-hover);
-}
-.container .buttons .cancel {
-  color: var(--clr-secondary);
-  border: 1px solid var(--clr-tertiary);
-}
-.container .buttons .cancel:hover {
-  background-color: var(--clr-trends-hover);
-}
-.container .buttons .cancel:active {
-  background-color: var(--clr-trends-active);
-}
-.container .buttons .cancel:focus-visible {
-  outline: 2px solid var(--clr-secondary);
-  background-color: var(--clr-trends-hover);
-}
-
-/*# sourceMappingURL=confirmation-modal.module.css.map */

package/dist/components/elements/modal/components/styles/confirmation-modal.module.css.map

@@ -1 +0,0 @@
-{"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"}

package/dist/components/elements/modal/components/styles/confirmation-modal.module.scss

@@ -1,125 +0,0 @@
-.container {
-  position: fixed;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  right: 0;
-  width: fit-content;
-  max-width: 320px;
-  height: fit-content;
-  margin: auto;
-  background-color: var(--clr-background);
-  padding: 2em;
-  border-radius: 1rem;
-
-  .logo {
-    display: grid;
-    place-items: center;
-    margin-bottom: 1em;
-
-    svg {
-      width: var(--fs-kilo);
-      height: var(--fs-kilo);
-      fill: var(--clr-primary);
-    }
-  }
-
-  h1 {
-    font-size: var(--fs-h2);
-    font-weight: var(--fw-700);
-    margin-bottom: 0.5em;
-  }
-
-  p {
-    font-size: var(--fs-milli);
-    color: var(--clr-tertiary);
-    margin-bottom: 2rem;
-    line-height: 1.4;
-  }
-
-  .buttons {
-    display: grid;
-    gap: 0.8rem;
-
-    button {
-      display: grid;
-      place-items: center;
-      padding: 0.9em;
-      border-radius: 100vmax;
-      font-size: var(--fs-milli);
-      font-weight: var(--fw-700);
-      cursor: pointer;
-      transition: background-color 0.2s ease;
-    }
-
-    .delete {
-      background-color: var(--clr-red);
-
-      &:hover {
-        background-color: var(--clr-red-hover);
-      }
-
-      &:active {
-        background-color: var(--clr-red-active);
-      }
-
-      &:focus-visible {
-        outline: 2px solid var(--clr-secondary);
-        background-color: var(--clr-red-hover);
-      }
-    }
-
-    .unfollow {
-      background-color: var(--clr-secondary);
-      color: var(--clr-background);
-
-      &:hover {
-        background-color: var(--clr-secondary-hover);
-      }
-
-      &:active {
-        background-color: var(--clr-secondary-active);
-      }
-
-      &:focus-visible {
-        outline: 2px solid var(--clr-secondary);
-      }
-    }
-
-    .signout {
-      background-color: var(--clr-secondary);
-      color: var(--clr-background);
-
-      &:hover {
-        background-color: var(--clr-signout-logout-hover);
-      }
-
-      &:active {
-        background-color: var(--clr-signout-logout-active);
-      }
-
-      &:focus-visible {
-        outline: 2px solid var(--clr-secondary);
-        background-color: var(--clr-signout-logout-hover);
-      }
-    }
-
-    .cancel {
-      color: var(--clr-secondary);
-      border: 1px solid var(--clr-tertiary);
-
-      &:hover {
-        background-color: var(--clr-trends-hover);
-      }
-
-      &:active {
-        background-color: var(--clr-trends-active);
-      }
-
-      &:focus-visible {
-        outline: 2px solid var(--clr-secondary);
-        background-color: var(--clr-trends-hover);
-      }
-    }
-  }
-}

package/dist/components/elements/modal/components/styles/modal.module.css

@@ -1,10 +0,0 @@
-.container {
-  z-index: var(--z-index-modal-backdrop);
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-}
-
-/*# sourceMappingURL=modal.module.css.map */

package/dist/components/elements/modal/components/styles/modal.module.css.map

@@ -1 +0,0 @@
-{"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"}

package/dist/components/elements/modal/components/styles/modal.module.scss

@@ -1,8 +0,0 @@
-.container {
-  z-index: var(--z-index-modal-backdrop);
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-}

package/dist/components/elements/modal/hooks/use-track-position.ts

@@ -1,49 +0,0 @@
-"use client";
-import { useState, useLayoutEffect } from "react";
-
-export const useTrackPosition = ({
-  buttonRef,
-  trackScroll = false,
-}: {
-  buttonRef: React.RefObject<HTMLButtonElement>;
-  trackScroll?: boolean;
-}) => {
-  const [buttonBoundaries, setButtonBoundaries] = useState<DOMRect | null>(
-    buttonRef?.current?.getBoundingClientRect() ?? null,
-  );
-
-  useLayoutEffect(() => {
-    const handleResize = () => {
-      if (buttonRef?.current) {
-        setButtonBoundaries(buttonRef.current.getBoundingClientRect());
-      }
-    };
-
-    window.addEventListener("resize", handleResize);
-    if (trackScroll) {
-      window.addEventListener("scroll", handleResize);
-    }
-
-    return () => {
-      window.removeEventListener("resize", handleResize);
-      if (trackScroll) {
-        window.removeEventListener("scroll", handleResize);
-      }
-    };
-  }, [
-    buttonRef,
-    buttonRef.current?.getBoundingClientRect,
-    trackScroll,
-    setButtonBoundaries,
-  ]);
-
-  useLayoutEffect(() => {
-    setButtonBoundaries(buttonRef.current?.getBoundingClientRect() ?? null);
-  }, [
-    buttonRef,
-    buttonRef.current?.getBoundingClientRect,
-    setButtonBoundaries,
-  ]);
-
-  return buttonBoundaries;
-};

package/dist/components/elements/modal/index.ts

@@ -1,3 +0,0 @@
-export * from "./components/modal";
-export * from "./components/confirmation-modal";
-export * from "./hooks/use-track-position";

package/dist/config/index.ts

@@ -1,17 +0,0 @@
-import { z } from "zod";
-
-const envSchema = z.object({
-  NODE_ENV: z.enum(["development", "production"]),
-  OXY_AUTH_URL: z.string().url(),
-});
-
-declare global {
-  // eslint-disable-next-line @typescript-eslint/no-namespace
-  namespace NodeJS {
-    interface ProcessEnv extends z.infer<typeof envSchema> {}
-  }
-}
-
-export const NODE_ENV = process.env.NODE_ENV;
-export const OXY_AUTH_URL =
-  NODE_ENV === "production" ? "https://auth.oxy.so" : "http://localhost:3001";

package/dist/features/profile/components/avatar.tsx

@@ -1,30 +0,0 @@
-import Image from "next/image";
-import React from "react";
-
-import { cn } from "../../../utils/cn";
-
-interface IAvatar extends React.ImgHTMLAttributes<HTMLImageElement> {
-  userImage: string | null | undefined;
-  className?: string;
-  width?: number;
-  height?: number;
-}
-
-export const Avatar = ({ userImage, className, ...props }: IAvatar) => {
-  return (
-    <div
-      className={cn(
-        "relative aspect-square w-[calc(var(--tw-fs-kilo)+9px)] overflow-hidden rounded-full",
-        className
-      )}
-    >
-      <Image
-        {...props}
-        src={userImage || `/user_placeholder.png`}
-        alt="profile picture"
-        fill={true}
-        className="block size-full object-cover"
-      />
-    </div>
-  );
-};

package/dist/features/profile/components/styles/avatar.module.css

@@ -1,15 +0,0 @@
-.container {
-  position: relative;
-  width: var(--avatar-width);
-  border-radius: 50%;
-  overflow: hidden;
-  aspect-ratio: 1/1;
-}
-.container img {
-  display: block;
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-}
-
-/*# sourceMappingURL=avatar.module.css.map */

package/dist/features/profile/components/styles/avatar.module.css.map

@@ -1 +0,0 @@
-{"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"}

package/dist/features/profile/components/styles/avatar.module.scss

@@ -1,14 +0,0 @@
-.container {
-  position: relative;
-  width: var(--avatar-width);
-  border-radius: 50%;
-  overflow: hidden;
-  aspect-ratio: 1 / 1;
-
-  img {
-    display: block;
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-  }
-}