frst-components 0.20.1 → 0.20.2

package/src/components/quantidadeDesafios/index.tsx

@@ -1,152 +0,0 @@
-import * as Styles from './quantidadeDesafios'
-
-interface ObjItemDesafio {
-  title: string
-  count: number
-  percentage: string
-  title_en?: string
-  title_es?: string
-}
-
-interface ObjQuantidadeDesafio {
-  definicao: ObjItemDesafio
-  hipoteses: ObjItemDesafio
-  testes: ObjItemDesafio
-  resultados: ObjItemDesafio
-  proximosPassos: ObjItemDesafio
-  finalizados: ObjItemDesafio
-  languagem?: string
-}
-
-export default function QuantidadeDesafios({
-  definicao,
-  hipoteses,
-  testes,
-  resultados,
-  proximosPassos,
-  finalizados,
-  languagem
-}: ObjQuantidadeDesafio) {
-  return (
-    <Styles.ContainerDesafios>
-      <Styles.ContainerItemDesafio>
-        <Styles.ItemDesafio>
-          <Styles.QuantidadeDesafio>
-            <h1>{definicao.count}</h1>
-            <p>{definicao.percentage}</p>
-          </Styles.QuantidadeDesafio>
-        </Styles.ItemDesafio>
-        <Styles.ItemDesafio>
-          <Styles.QuantidadeDesafio>
-            <h1>{hipoteses.count}</h1>
-            <p>{hipoteses.percentage}</p>
-          </Styles.QuantidadeDesafio>
-        </Styles.ItemDesafio>
-        <Styles.ItemDesafio>
-          <Styles.QuantidadeDesafio>
-            <h1>{testes.count}</h1>
-            <p>{testes.percentage}</p>
-          </Styles.QuantidadeDesafio>
-        </Styles.ItemDesafio>
-        <Styles.ItemDesafio>
-          <Styles.QuantidadeDesafio>
-            <h1>{resultados.count}</h1>
-            <p>{resultados.percentage}</p>
-          </Styles.QuantidadeDesafio>
-        </Styles.ItemDesafio>
-        <Styles.ItemDesafio>
-          <Styles.QuantidadeDesafio>
-            <h1>{proximosPassos.count}</h1>
-            <p>{proximosPassos.percentage}</p>
-          </Styles.QuantidadeDesafio>
-        </Styles.ItemDesafio>
-        <Styles.ItemDesafio>
-          <Styles.QuantidadeDesafio>
-            <h1>{finalizados.count}</h1>
-            <p>{finalizados.percentage}</p>
-          </Styles.QuantidadeDesafio>
-        </Styles.ItemDesafio>
-      </Styles.ContainerItemDesafio>
-      <Styles.containerTitleDesafio>
-        <Styles.TitleDesafiosWhite>
-          {languagem
-            ? languagem === 'en-US'
-              ? definicao.title_en
-                ? definicao.title_en
-                : definicao.title
-              : languagem === 'es'
-              ? definicao.title_es
-                ? definicao.title_es
-                : definicao.title
-              : definicao.title
-            : definicao.title}
-        </Styles.TitleDesafiosWhite>
-        <Styles.TitleDesafiosGrey>
-          {languagem
-            ? languagem === 'en-US'
-              ? hipoteses.title_en
-                ? hipoteses.title_en
-                : hipoteses.title
-              : languagem === 'es'
-              ? hipoteses.title_es
-                ? hipoteses.title_es
-                : hipoteses.title
-              : hipoteses.title
-            : hipoteses.title}
-        </Styles.TitleDesafiosGrey>
-        <Styles.TitleDesafiosWhite>
-          {languagem
-            ? languagem === 'en-US'
-              ? testes.title_en
-                ? testes.title_en
-                : testes.title
-              : languagem === 'es'
-              ? testes.title_es
-                ? testes.title_es
-                : testes.title
-              : testes.title
-            : testes.title}
-        </Styles.TitleDesafiosWhite>
-        <Styles.TitleDesafiosGrey>
-          {languagem
-            ? languagem === 'en-US'
-              ? resultados.title_en
-                ? resultados.title_en
-                : resultados.title
-              : languagem === 'es'
-              ? resultados.title_es
-                ? resultados.title_es
-                : resultados.title
-              : resultados.title
-            : resultados.title}
-        </Styles.TitleDesafiosGrey>
-        <Styles.TitleDesafiosWhite>
-          {languagem
-            ? languagem === 'en-US'
-              ? proximosPassos.title_en
-                ? proximosPassos.title_en
-                : proximosPassos.title
-              : languagem === 'es'
-              ? proximosPassos.title_es
-                ? proximosPassos.title_es
-                : proximosPassos.title
-              : proximosPassos.title
-            : proximosPassos.title}
-        </Styles.TitleDesafiosWhite>
-        <Styles.TitleDesafiosGrey>
-          {languagem
-            ? languagem === 'en-US'
-              ? finalizados.title_en
-                ? finalizados.title_en
-                : finalizados.title
-              : languagem === 'es'
-              ? finalizados.title_es
-                ? finalizados.title_es
-                : finalizados.title
-              : finalizados.title
-            : finalizados.title}
-        </Styles.TitleDesafiosGrey>
-      </Styles.containerTitleDesafio>
-    </Styles.ContainerDesafios>
-  )
-}

package/src/components/quantidadeDesafios/quantidadeDesafios.stories.tsx

@@ -1,49 +0,0 @@
-import React from 'react'
-
-import QuantidadeDesafios from './index'
-
-// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
-export default {
-  title: 'Base/QuantidadeDesafios',
-  component: QuantidadeDesafios
-}
-
-// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
-const Template = (args) => <QuantidadeDesafios {...args} />
-
-export const normal = Template.bind({})
-normal.args = {
-  languagem: 'es',
-  definicao: {
-    title: 'definicao',
-    count: 111,
-    percentage: '10%',
-    title_en: 'definition',
-    title_es: 'definición'
-  },
-  hipoteses: {
-    title: 'hipoteses',
-    count: 222,
-    percentage: '20%'
-  },
-  testes: {
-    title: 'testes',
-    count: 333,
-    percentage: '30%'
-  },
-  resultados: {
-    title: 'resultados',
-    count: 444,
-    percentage: '40%'
-  },
-  proximosPassos: {
-    title: 'Próximos Passos',
-    count: 555,
-    percentage: '50%'
-  },
-  finalizados: {
-    title: 'finalizados',
-    count: 777,
-    percentage: '70%'
-  }
-}

package/src/components/quantidadeDesafios/quantidadeDesafios.ts

@@ -1,121 +0,0 @@
-import styled from 'styled-components'
-import imgSeta from './imgSetas/setasDesafios.svg'
-
-export const ContainerDesafios = styled.div`
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-`
-export const ContainerItemDesafio = styled.div`
-  width: 100%;
-  background-image: url(${imgSeta});
-  background-repeat: no-repeat;
-  padding: 1rem;
-  display: flex;
-  background-size: 100%;
-  background-position: top 5rem;
-  background-position: -2rem;
-  justify-content: center;
-  margin-bottom: 1rem;
-`
-
-export const ItemDesafio = styled.div`
-  width: 14%;
-  padding: 1rem;
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  margin-right: 1.2rem;
-  margin-left: 0.1rem;
-`
-
-export const QuantidadeDesafio = styled.div`
-  width: 85%;
-  background: #ffffff;
-  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
-  margin-bottom: 1.5rem;
-  margin-top: 1rem;
-  height: 8rem;
-  border-radius: 100%;
-  border-width: 0px;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  h1 {
-    margin: 0;
-    font-family: 'Work Sans';
-    font-style: normal;
-    font-weight: 600;
-    font-size: 24px;
-    line-height: 28px;
-    display: flex;
-    align-items: center;
-    text-align: center;
-    color: #222222;
-    word-wrap: break-word;
-    max-width: 90%;
-    word-break: break-all;
-  }
-  p {
-    font-family: 'Work Sans';
-    font-style: normal;
-    font-weight: 400;
-    font-size: 16px;
-    line-height: 19px;
-    display: flex;
-    align-items: center;
-    text-align: center;
-    color: #222222;
-  }
-`
-
-export const containerTitleDesafio = styled.div`
-  width: 100%;
-  height: 24px;
-  padding: 0 4rem;
-  display: flex;
-  flex-direction: row;
-`
-
-export const TitleDesafiosWhite = styled.div`
-  width: 240px;
-  height: 24px;
-  background: #ffffff;
-  border: 1px solid #d1d5db;
-  border-radius: 30px;
-  font-family: 'Work Sans';
-  font-style: normal;
-  font-weight: 600;
-  font-size: 16px;
-  line-height: 15px;
-  display: flex;
-  align-items: center;
-  text-align: center;
-  color: #d14211;
-  display: flex;
-  justify-content: center;
-  position: relative;
-  z-index: 9999;
-  margin-right: -2rem;
-  margin-left: -2rem;
-`
-export const TitleDesafiosGrey = styled.div`
-  width: 240px;
-  height: 24px;
-  background: rgba(255, 255, 255, 0.4);
-  border: 1px solid #d1d5db;
-  border-radius: 30px;
-  font-family: 'Work Sans';
-  font-style: normal;
-  font-weight: 600;
-  font-size: 16px;
-  line-height: 15px;
-  display: flex;
-  align-items: center;
-  text-align: center;
-  color: #d14211;
-  display: flex;
-  justify-content: center;
-  position: relative;
-`

package/src/components/sandbox.stories.tsx

@@ -1,18 +0,0 @@
-import React from 'react'
-
-import PageSandbox from './index'
-
-// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
-export default {
-    title: 'Page/Sandbox',
-    component: PageSandbox,
-}
-
-// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
-const Template = (args) => <PageSandbox {...args} />
-
-export const sandboxPage = Template.bind({})
-sandboxPage.args = {
-    pageHeight: '340px',
-    pageWidth: '500px'
-}

package/src/components/scroll-container/index.tsx

@@ -1,189 +0,0 @@
-import React, { useEffect, useState } from 'react'
-import '../../shared/global.css'
-import { ThemeProvider } from 'styled-components'
-import { FRSTTheme } from '../../theme'
-import * as Styles from './scrollContainerStyles'
-
-import { ArrowScrollLeft, ArrowScrollRight } from '@shared/icons'
-import { IScrollContainer } from './scrollContainer'
-import { randID } from './scrollContainer.utils'
-
-import { WrapperHorizontal, WrapperContent, ButtonControll, CardTest } from './scrollContainerStyles'
-
-export default function ScrollContainer({
-  children,
-  type,
-  isVisibleControlsButtons,
-  positionArrowButton,
-  marginTopArrrowButton,
-  stepMove,
-  className,
-  styles,
-  sizeArrowButton,
-  marginsArrowButton,
-  horizontalMarginInternScroll,
-  refreshResize
-}: IScrollContainer) {
-  const [actionAreaButtonLeft, setActionAreaButtonLeft] = useState(false)
-  const [actionAreaButtonRight, setActionAreaButtonRight] = useState(false)
-
-  const [iDScroll, setIDScroll] = useState(`iDScroll-${randID()}`)
-
-  const [isVisibleArrowButtonLeft, setIsVisibleArrowButtonLeft] = useState(false)
-  const [isVisibleArrowButtonRight, setIsVisibleArrowButtonRight] = useState(false)
-
-  const scrollToLeft = () => {
-    var objDiv = document.getElementById(iDScroll)
-    if (objDiv !== null) {
-      objDiv.scrollLeft - stepMove <= 0 ? setIsVisibleArrowButtonLeft(false) : setIsVisibleArrowButtonLeft(true)
-      setIsVisibleArrowButtonRight(true)
-      objDiv.scrollLeft = objDiv.scrollLeft - stepMove
-    }
-  }
-
-  const scrollToRight = () => {
-    var objDiv = document.getElementById(iDScroll)
-    if (objDiv !== null) {
-      objDiv.scrollLeft + stepMove <= 0 ? setIsVisibleArrowButtonLeft(false) : setIsVisibleArrowButtonLeft(true)
-      objDiv.offsetWidth + objDiv.scrollLeft + stepMove >= objDiv.scrollWidth
-        ? setIsVisibleArrowButtonRight(false)
-        : setIsVisibleArrowButtonRight(true)
-      objDiv.scrollLeft = objDiv.scrollLeft + stepMove
-    }
-  }
-
-  useEffect(() => {
-    var objDiv = document.getElementById(iDScroll)
-    if (objDiv && objDiv.clientWidth && objDiv.clientWidth < objDiv.scrollWidth) setIsVisibleArrowButtonRight(true)
-    else setIsVisibleArrowButtonRight(false)
-  }, [])
-
-  useEffect(() => {
-    updateSize()
-  }, [refreshResize])
-
-  const updateSize = () => {
-    var objDiv = document.getElementById(iDScroll)
-    if (objDiv !== null) {
-      objDiv.offsetWidth + objDiv.scrollLeft >= objDiv.scrollWidth
-        ? setIsVisibleArrowButtonRight(false)
-        : setIsVisibleArrowButtonRight(true)
-      objDiv.scrollLeft - stepMove <= 0 ? setIsVisibleArrowButtonLeft(false) : setIsVisibleArrowButtonLeft(true)
-
-      if (objDiv && objDiv.clientWidth && objDiv.clientWidth < objDiv.scrollWidth) setIsVisibleArrowButtonRight(true)
-      else setIsVisibleArrowButtonRight(false)
-    }
-  }
-
-  useEffect(() => {
-    window.addEventListener('resize', updateSize)
-    updateSize()
-    return () => window.removeEventListener('resize', updateSize)
-  }, [])
-
-  return (
-    <ThemeProvider theme={FRSTTheme}>
-      <div style={{ ...styles }} className={className}>
-        <WrapperHorizontal>
-          {isVisibleControlsButtons && positionArrowButton != 'bottom' && (
-            <ButtonArrow
-              isLeftButton={true}
-              onClick={scrollToLeft}
-              onActionArea={setActionAreaButtonLeft}
-              actionArea={actionAreaButtonLeft}
-              sizeButton={sizeArrowButton}
-              isVisible={isVisibleArrowButtonLeft}
-              margin={marginsArrowButton ? (marginsArrowButton + 50) * -1 + 'px' : '-138px'}
-              ArrowScroll={ArrowScrollLeft}
-              marginTopArrrowButton={marginTopArrrowButton}
-            />
-          )}
-          <WrapperContent
-            id={iDScroll}
-            paddingIntern={horizontalMarginInternScroll ? horizontalMarginInternScroll : '150px'}
-          >
-            {children}
-          </WrapperContent>
-          {isVisibleControlsButtons && positionArrowButton != 'bottom' && (
-            <ButtonArrow
-              isLeftButton={false}
-              onClick={scrollToRight}
-              onActionArea={setActionAreaButtonRight}
-              actionArea={actionAreaButtonRight}
-              sizeButton={sizeArrowButton}
-              isVisible={isVisibleArrowButtonRight}
-              margin={marginsArrowButton ? (marginsArrowButton + 50) * -1 + 'px' : '-138px'}
-              ArrowScroll={ArrowScrollRight}
-              marginTopArrrowButton={marginTopArrrowButton}
-            />
-          )}
-        </WrapperHorizontal>
-        <div style={{ display: 'flex', justifyContent: 'center', width: '100%' }}>
-          {isVisibleControlsButtons && positionArrowButton == 'bottom' && (
-            <div
-              style={{
-                display: 'flex',
-                flexDirection: 'row',
-                marginTop: marginTopArrrowButton ? marginTopArrrowButton : '5px'
-              }}
-            >
-              <ButtonArrow
-                isLeftButton={true}
-                onClick={scrollToLeft}
-                onActionArea={setActionAreaButtonLeft}
-                actionArea={actionAreaButtonLeft}
-                sizeButton={sizeArrowButton}
-                isVisible={isVisibleArrowButtonLeft}
-                margin={marginsArrowButton ? marginsArrowButton + 'px' : '10px'}
-                ArrowScroll={ArrowScrollLeft}
-                marginTopArrrowButton={marginTopArrrowButton}
-              />
-              <ButtonArrow
-                isLeftButton={false}
-                onClick={scrollToRight}
-                onActionArea={setActionAreaButtonRight}
-                actionArea={actionAreaButtonRight}
-                sizeButton={sizeArrowButton}
-                isVisible={isVisibleArrowButtonRight}
-                margin={marginsArrowButton ? marginsArrowButton + 'px' : '10px'}
-                ArrowScroll={ArrowScrollRight}
-                marginTopArrrowButton={marginTopArrrowButton}
-              />
-            </div>
-          )}
-        </div>
-      </div>
-    </ThemeProvider>
-  )
-}
-
-function ButtonArrow({
-  isLeftButton,
-  onClick,
-  onActionArea,
-  actionArea,
-  sizeButton,
-  isVisible,
-  margin,
-  ArrowScroll,
-  marginTopArrrowButton
-}) {
-  return (
-    <ButtonControll
-      isLeftButton={isLeftButton}
-      onClick={onClick}
-      onMouseOver={() => onActionArea(true)}
-      onMouseOut={() => onActionArea(false)}
-      sizeButton={sizeButton ? sizeButton : 80}
-      visibility={isVisible ? 'visible' : 'hidden'}
-      marginsArrowButton={margin}
-      marginTopArrrowButton={marginTopArrrowButton}
-    >
-      <ArrowScroll
-        fill={actionArea ? '#fff' : '#000'}
-        height={sizeButton ? (sizeButton / 2.3).toFixed(0).toString() : '34'}
-        width={sizeButton ? (sizeButton / 4.3).toFixed(0).toString() : '18'}
-      />
-    </ButtonControll>
-  )
-}

package/src/components/scroll-container/scrollContainer.d.ts

@@ -1,17 +0,0 @@
-import React from "react"
-
-export interface IScrollContainer {
-    children?: any,
-    type?: string,
-    stepMove?: number,
-    isVisibleControlsButtons?: boolean,
-    handleClick?:() => void, 
-    className?: string,
-    styles?: any,
-    sizeArrowButton?: number,
-    marginsArrowButton?: number,
-    horizontalMarginInternScroll?: string,
-    positionArrowButton?: string,
-    marginTopArrrowButton?: string,
-    refreshResize?: number
-}

package/src/components/scroll-container/scrollContainer.stories.tsx

@@ -1,45 +0,0 @@
-import React from 'react'
-
-import ScrollContainer from './index'
-
-// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
-export default {
-    title: 'Learning Tech/Scroll Container',
-    component: ScrollContainer,
-}
-
-// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
-const Template = (args) => <ScrollContainer {...args} />
-
-export const normal = Template.bind({})
-normal.args = {
-    type: "horizontal",
-    stepMove: 100,
-    isVisibleControlsButtons: true,
-    handleClick: (e : any) => { alert(e) }, 
-    className: null,
-    styles: {marginLeft:'0'},
-    sizeArrowButton: 80,
-    marginsArrowButton: 50,
-    children: 
-    <>
-        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
-    </>
-}
-
-export const bottom = Template.bind({})
-bottom.args = {
-    type: "horizontal",
-    stepMove: 100,
-    isVisibleControlsButtons: true,
-    handleClick: (e : any) => { alert(e) }, 
-    className: null,
-    styles: {marginLeft:'0'},
-    sizeArrowButton: 80,
-    marginsArrowButton: 50,
-    positionArrowButton: 'bottom',
-    children: 
-    <>
-        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
-    </>
-}

package/src/components/scroll-container/scrollContainer.utils.ts

@@ -1,11 +0,0 @@
-import React from "react"
-
-interface IUtilsConvertStringLink {
-    value: string
-}
-
-export function randID() {
-    return Math.random()
-        .toString(36)
-        .substr(2, 9);
-};