@stack-spot/portal-components 0.0.18 → 1.0.1

package/dist/components/tour/utils.js

@@ -1,43 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { theme } from '@stack-spot/portal-theme';
-import { StepContainer } from './StepContainer.js';
-const TOUR_COOKIE = 'guided-tour-global';
-const DOMAIN_REGEX = new RegExp(/(\.*(prd|stg|dev)*.stackspot.com)|localhost/);
-const portalUrl = new URL(location.href);
-const cookieDomain = DOMAIN_REGEX.exec(portalUrl.host)?.[0];
-const defaultCookieAttributes = `domain=${cookieDomain}; SameSite=Strict;`;
-const getCookies = () => document.cookie.split('; ').reduce((prev, current) => {
-    const [name, ...value] = current.split('=');
-    prev[name] = value.join('=');
-    return prev;
-}, {});
-const setCookie = (key, value) => {
-    document.cookie = `${key}=${value}; ${defaultCookieAttributes}`;
-};
-const getCookie = (key) => getCookies()[key];
-const getTourCookie = () => {
-    const currentTourObject = getCookie(TOUR_COOKIE);
-    return currentTourObject ? currentTourObject.split(',') : [];
-};
-export const finishTourStep = (key) => {
-    const tourObject = getTourCookie();
-    if (!tourObject.includes(key))
-        tourObject.push(key);
-    setCookie(TOUR_COOKIE, tourObject.toString());
-};
-export const isNewTourStep = (step) => !hasFinishedTourStep(`${step.selector}`);
-export const hasFinishedTourStep = (key) => getTourCookie().includes(key);
-export const tourStepBuilder = ({ selector, position, title, content, style, customNavigation, ...rest }) => ({
-    selector,
-    content: (_jsx(StepContainer, { stepKey: selector, position: position, title: title, customNavigation: customNavigation, children: content })),
-    position,
-    style: {
-        backgroundColor: theme.color.inverse[500],
-        width: '256px',
-        padding: 0,
-        top: ['right', 'left'].includes(position) ? '-3px' : '0',
-        ...(style || {}),
-    },
-    ...(rest || {}),
-});
-//# sourceMappingURL=utils.js.map

package/dist/components/tour/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/tour/utils.tsx"],"names":[],"mappings":"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"}

package/src/components/Login.tsx

@@ -1,157 +0,0 @@
-/* eslint-disable max-len */
-import { Button, IconBox, Input, Text } from '@citric/core'
-import { Github } from '@citric/icons'
-import { LoadingCircular } from '@citric/ui'
-import { theme } from '@stack-spot/portal-theme'
-import { Dictionary, useTranslate } from '@stack-spot/portal-translate'
-import { useState } from 'react'
-import { styled } from 'styled-components'
-import { BannerWarning } from './BannerWarning'
-import { MiniLogo } from './MiniLogo'
-
-type LoginType = 'sso' | 'idp'
-
-interface BaseData {
-  type: LoginType,
-}
-
-interface SSOData extends BaseData {
-  type: 'sso',
-  email: string,
-}
-
-interface IDPData extends BaseData {
-  type: 'idp',
-  provider: 'external-idp:github',
-}
-
-type LoginData = SSOData | IDPData
-
-interface Props {
-  initialValue?: string,
-  onSubmit: (data: LoginData) => Promise<void>,
-  welcomeText?: string,
-  removeLoadingOnSuccess?: boolean,
-  className?: string,
-  style?: React.CSSProperties,
-  bannerData?: React.ReactNode,
-}
-
-const LoginBox = styled.form`
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  gap: 24px;
-
-  header {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    gap: 24px;
-  }
-
-  .title {
-    font-size: 1rem;
-  }
-
-  .separator {
-    padding: 0 8px;
-    background-color: ${theme.color.light['400']};
-    color: ${theme.color.light['700']};
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-    gap: 20px;
-    margin: 0;
-
-    &:before, &:after {
-      content: '';
-      height: 1px;
-      flex: 1;
-      background-color: ${theme.color.light['600']};
-    }
-  }
-
-  .error {
-    color: ${theme.color.danger['500']};
-    line-height: 1.5rem;
-  }
-`
-
-export const Login = ({ onSubmit, initialValue = '', welcomeText, removeLoadingOnSuccess, className, style, bannerData }: Props) => {
-  const t = useTranslate(dictionary)
-  const searchParams = new URLSearchParams(location.search)
-  const [error, setError] = useState(searchParams.get('error_description') || searchParams.get('error') || '')
-  const [loading, setLoading] = useState(false)
-  const [email, setEmail] = useState(initialValue)
-  const disabled = !email.match(/\w+@\w+/)
-
-  async function login(type: LoginType) {
-    setError('')
-    setLoading(true)
-    try {
-      const data: LoginData = type === 'sso' ? { type: 'sso', email } : { type: 'idp', provider: 'external-idp:github' }
-      await onSubmit(data)
-      if (removeLoadingOnSuccess) setLoading(false)
-    } catch (error: any) {
-      setLoading(false)
-      setError(error.message || error.toString())
-    }
-  }
-
-  function submitForm(e: React.FormEvent<HTMLFormElement>) {
-    e.preventDefault()
-    if (disabled) return
-    login('sso')
-  }
-
-  return (
-    <>
-      <LoginBox onSubmit={submitForm} className={className} style={style}>
-        <header>
-          <MiniLogo />
-          <Text className="title">{welcomeText || t.welcome}</Text>
-        </header>
-        <Input name="email" value={email} onChange={e => setEmail(e.target.value)} placeholder={t.placeholder} />
-        <Button colorScheme="primary" disabled={disabled || loading}>
-          {loading ? <LoadingCircular /> : <Text>{t.continue}</Text>}
-        </Button>
-        <p className="separator">{t.or}</p>
-        <Button colorScheme="light" type="button" onClick={() => login('idp')} disabled={loading}>
-          {loading ? <LoadingCircular /> : (
-            <>
-              <IconBox>
-                <Github />
-              </IconBox>
-              <Text>{t.loginWithGithub}</Text>
-            </>
-          )}
-        </Button>
-        {error && <Text className="error">{t.error}: {error}</Text>}
-      </LoginBox>
-      {bannerData ? <BannerWarning>
-        {bannerData}
-      </BannerWarning> : null}
-    </>
-  )
-}
-
-const dictionary = {
-  en: {
-    welcome: 'Welcome to StackSpot',
-    placeholder: 'your@email.com',
-    continue: 'Continue',
-    or: 'or',
-    loginWithGithub: 'Login with Github',
-    error: 'Error while attempting to login',
-  },
-  pt: {
-    welcome: 'Bem vindo à StackSpot',
-    placeholder: 'nome@email.com',
-    continue: 'Continuar',
-    or: 'ou',
-    loginWithGithub: 'Logar com o GitHub',
-    error: 'Erro ao fazer login',
-  },
-} satisfies Dictionary

package/src/components/tour/utils.tsx

@@ -1,65 +0,0 @@
-import { theme } from '@stack-spot/portal-theme'
-import { ReactNode } from 'react'
-import { ReactourStep } from 'reactour'
-import { PointingArrowPosition, StepContainer } from './StepContainer'
-import { NavigationProps } from './StepNavigation'
-
-const TOUR_COOKIE = 'guided-tour-global'
-const DOMAIN_REGEX = new RegExp(/(\.*(prd|stg|dev)*.stackspot.com)|localhost/)
-const portalUrl = new URL(location.href)
-const cookieDomain = DOMAIN_REGEX.exec(portalUrl.host)?.[0]
-const defaultCookieAttributes = `domain=${cookieDomain}; SameSite=Strict;`
-
-const getCookies = (): Record<string, string> => document.cookie.split('; ').reduce((prev, current) => {
-  const [name, ...value] = current.split('=')
-  prev[name] = value.join('=')
-  return prev
-}, {} as Record<string, string>)
-
-const setCookie = (key: string, value: string) => {
-  document.cookie = `${key}=${value}; ${defaultCookieAttributes}`
-}
-
-const getCookie = (key: string) => getCookies()[key]
-
-const getTourCookie = () => {
-  const currentTourObject = getCookie(TOUR_COOKIE)
-  return currentTourObject ? currentTourObject.split(',') : []
-}
-
-export const finishTourStep = (key: string) => {
-  const tourObject: string[] = getTourCookie()
-  if (!tourObject.includes(key)) tourObject.push(key)
-  setCookie(TOUR_COOKIE, tourObject.toString())
-}
-
-export const isNewTourStep = (step: ReactourStep) => !hasFinishedTourStep(`${step.selector}`)
-export const hasFinishedTourStep = (key: string) => getTourCookie().includes(key)
-
-export const tourStepBuilder = ({
-  selector,
-  position,
-  title,
-  content,
-  style,
-  customNavigation,
-  ...rest
-}: ReactourStep & { title: string, selector: string, content: ReactNode, customNavigation?: NavigationProps }): ReactourStep => ({
-  selector,
-  content: (<StepContainer
-    stepKey={selector}
-    position={position as PointingArrowPosition}
-    title={title}
-    customNavigation={customNavigation}>
-    {content}
-  </StepContainer>),
-  position,
-  style: {
-    backgroundColor: theme.color.inverse[500],
-    width: '256px',
-    padding: 0,
-    top: ['right', 'left'].includes(position as PointingArrowPosition) ? '-3px' : '0',
-    ...(style || {}),
-  },
-  ...(rest || {}),
-})