@luscii-healthtech/web-ui 2.9.0 → 2.10.2

package/src/styles/_layout.scss

@@ -1,64 +0,0 @@
-// media query breakpoints
-$max-small-screen-width: 767px;
-$min-medium-screen-width: $max-small-screen-width + 1px;
-
-$default-height: 44px;
-$default-border-radius: 4px;
-$header-container-height: 75px;
-
-$header-z-index: 10000;
-$sidemenu-z-index: 10001;
-$sidebar-container-z-index: 11000;
-$modal-window-overlay-z-index: 12000;
-$modal-window-z-index: 13000;
-$modal-window-drag-item-z-index: $modal-window-z-index + 100;
-
-@mixin flexbox-layout($align-items: flex-start, $justify-content: flex-start, $flex-direction: row) {
-  display: flex;
-  justify-content: $justify-content;
-  flex-direction: $flex-direction;
-  align-items: $align-items;
-}
-
-// tailwind: flex justify-start flex-row items-start
-@mixin flexbox-horizontal($align-items: flex-start, $justify-content: flex-start) {
-  @include flexbox-layout($align-items, $justify-content, row);
-}
-
-// tailwind: flex justify-start flex-col items-start
-@mixin flexbox-vertical($align-items: flex-start, $justify-content: flex-start) {
-  @include flexbox-layout($align-items, $justify-content, column);
-}
-
-@mixin horizontal-static-position($position: absolute, $z-index: 1, $distance: 0) {
-  position: $position;
-  left: $distance;
-  right: $distance;
-  z-index: $z-index;
-}
-
-@mixin static-position($position: absolute, $z-index: 1, $distance: 0) {
-  @include horizontal-static-position($position, $z-index, $distance);
-  top: $distance;
-  bottom: $distance;
-}
-
-@mixin vertical-padding($padding-top, $padding-bottom: $padding-top) {
-  padding-top: $padding-top;
-  padding-bottom: $padding-bottom;
-}
-
-@mixin horizontal-padding($padding-left, $padding-right: $padding-left) {
-  padding-left: $padding-left;
-  padding-right: $padding-right;
-}
-
-@mixin vertical-margin($margin-top, $margin-bottom: $margin-top) {
-  margin-top: $margin-top;
-  margin-bottom: $margin-bottom;
-}
-
-@mixin horizontal-margin($margin-left, $margin-right: $margin-left) {
-  margin-left: $margin-left;
-  margin-right: $margin-right;
-}

package/src/styles/_shadows.scss

@@ -1,19 +0,0 @@
-@mixin box-shadow-1dp() {
-  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.14);
-}
-
-@mixin box-shadow-2dp() {
-  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.14);
-}
-
-@mixin box-shadow-4dp() {
-  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 4px 5px 0 rgba(0, 0, 0, 0.14);
-}
-
-@mixin box-shadow-8dp() {
-  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 8px 10px 1px rgba(0, 0, 0, 0.14);
-}
-
-@mixin box-shadow-basic($x: 0px, $y: 5px) {
-  box-shadow: $x $y 14px 2px rgba(0, 0, 0, 0.12);
-}

package/src/styles/_skeleton.scss

@@ -1,63 +0,0 @@
-@mixin skeleton() {
-  .skeleton-box {
-    display: inline-block;
-    height: 1em;
-    position: relative;
-    overflow: hidden;
-    background-color: #cbd5e1; //slate 300
-    border-radius: 3px;
-
-    &::after {
-      position: absolute;
-      top: 0;
-      right: 0;
-      bottom: 0;
-      left: 0;
-      transform: translateX(-100%);
-      background-image: linear-gradient(
-                      90deg,
-                      rgba(#fff, 0) 0,
-                      rgba(#fff, 0.2) 20%,
-                      rgba(#fff, 0.5) 60%,
-                      rgba(#fff, 0)
-      );
-
-      animation: shimmer 800ms infinite;
-      content: "";
-    }
-
-    &.is-circle {
-      border-radius: 50%;
-    }
-
-    &.is-button {
-      background-color: #e2e8f0; //secondary button color
-      border-radius: 9999px;
-
-      &::after {
-        position: absolute;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        left: 0;
-        transform: translateX(-100%);
-        background-image: linear-gradient(
-                        90deg,
-                        rgba(#ddd, 0) 0,
-                        rgba(#ddd, 0.2) 20%,
-                        rgba(#ddd, 0.5) 60%,
-                        rgba(#ddd, 0)
-        );
-
-        animation: shimmer 800ms infinite;
-        content: "";
-      }
-    }
-
-    @keyframes shimmer {
-      100% {
-        transform: translateX(100%);
-      }
-    }
-  }
-}

package/src/styles/_typography.scss

@@ -1,8 +0,0 @@
-@mixin text($font-size, $line-height, $color, $font-weight: normal) {
-  font-family: "Inter", "Roboto", sans-serif;
-  font-size: $font-size;
-  font-weight: $font-weight;
-  line-height: $line-height;
-  color: $color;
-  margin: 0;
-}

package/src/styles/_utils.scss

@@ -1,45 +0,0 @@
-@mixin cweb-reset-element() {
-  border: none;
-  margin: 0;
-  padding: 0;
-  width: auto;
-  overflow: visible;
-  background: transparent;
-  color: inherit;
-  font: inherit;
-  line-height: normal;
-  -webkit-font-smoothing: inherit;
-  -moz-osx-font-smoothing: inherit;
-  -webkit-appearance: none;
-  text-decoration: none;
-  outline: none;
-  box-sizing: border-box;
-}
-
-@mixin cweb-truncate() {
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-}
-
-@mixin cweb-box-shadow($top, $left, $blur, $color, $top2: false, $left2: false, $blur2: false, $color2: false) {
-  $spread: 0;
-  $params: $top $left $blur $spread $color;
-  @if $top2
-  { $params: $top $left $blur $spread $color, $top2 $left2 $blur2 $spread $color2; }
-
-  box-shadow: $params;
-
-  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
-    $spread: 1px;
-    $params: $top $left $blur $spread $color;
-    @if $top2
-    { $params: $top $left $blur $spread $color, $top2 $left2 $blur2 $spread $color2; }
-
-    box-shadow: $params;
-  }
-}
-
-.cweb-box-shadow-default {
-  @include cweb-box-shadow(0, 2px, 2px, rgba(0, 0, 0, 0.24), 0, 0, 2px, rgba(0, 0, 0, 0.12));
-}

package/src/types/general.types.ts

@@ -1,11 +0,0 @@
-// This type is used to allow for other props to be injected into the component
-// For instance, for a data-test-id or key
-export interface RestPropped {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  [key: string]: any;
-}
-
-export interface HookReturn<T> extends RestPropped {
-  data: T | undefined;
-  isLoading: boolean;
-}

package/src/utils/useOutsideClick.js

@@ -1,19 +0,0 @@
-import { useEffect } from "react";
-
-const useOutsideClick = (ref, callback) => {
-  const handleClick = (e) => {
-    if (ref.current && !ref.current.contains(e.target)) {
-      callback();
-    }
-  };
-
-  useEffect(() => {
-    document.addEventListener("click", handleClick);
-
-    return () => {
-      document.removeEventListener("click", handleClick);
-    };
-  });
-};
-
-export default useOutsideClick;