Add Design System (#238)

* feat(examples): add full height and remove wrapping div

* Remove Channel component in favour of options

* feat(react): add hook for keyboard shortcuts

* setup: sort only react related packages at the top

* Add radix-ui packages

* feat(system): add stitches config file

* feat(system): add Image primitive

* feat(system): add Avatar component

* feat(system): add Box primitive

* feat(system): add Flex primitive

* feat(system): add Grid primitive

* feat(system): add Tooltip component

* feat(system): add Icon primitive

* feat(system): add Button component

* feat(system): add IconButton component

* feat(system): add EthAddress component

* fix(system): pass down button props

* feat(system): add option to hide Icon from screen readers

* feat(system): add Heading component

* feat(system): add Text component

* feat(system): add TextInput component

* feat(system): add Dialog component

* feat(system): add VisuallyHidden primitive

* feat(system): add Menu primitive

* feat(system): add DropdownMenu component

* feat(system): add ContextMenu component

* refactor(system): Icon component prop name

* feat(system): add AlertDialog component

* feat(system): update Avatar default background color
This commit is contained in:
Pavel 2022-03-15 13:47:17 +01:00 committed by GitHub
parent 0dfe9b737c
commit 020df678b9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
77 changed files with 2165 additions and 673 deletions

View File

@ -47,7 +47,7 @@
// Side effect imports. // Side effect imports.
["^\\u0000"], ["^\\u0000"],
// `react` related packages come first. // `react` related packages come first.
["^react"], ["^react$", "^react-dom$"],
// Things that start with a letter (or digit or underscore), or `@` followed by a letter. // Things that start with a letter (or digit or underscore), or `@` followed by a letter.
["^@?\\w"], ["^@?\\w"],
// Absolute imports and other imports such as Vue-style `@/foo`. // Absolute imports and other imports such as Vue-style `@/foo`.

View File

@ -1,23 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
rel="stylesheet"
/>
<link
rel="stylesheet"
href="https://unpkg.com/tailwindcss@3.0.0/src/css/preflight.css"
/>
<link rel="stylesheet" href="styles.css" />
<title>Channel | Status</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="./index.tsx"></script>
</body>
</html>

View File

@ -1,25 +0,0 @@
import React, { StrictMode } from 'react'
import { render } from 'react-dom'
import { Channel, lightTheme } from '@status-im/react'
const App = () => {
return (
<div>
<Channel
publicKey="<YOUR_COMMUNITY_KEY>"
theme={lightTheme}
options={{
showMembers: false,
}}
/>
</div>
)
}
render(
<StrictMode>
<App />
</StrictMode>,
document.getElementById('root')
)

View File

@ -1,26 +0,0 @@
{
"name": "channel",
"version": "0.0.0",
"source": "index.html",
"browserslist": "> 0.5%, last 2 versions, not dead, not ios_saf < 13",
"scripts": {
"dev": "parcel",
"prebuild": "rm -rf dist",
"build": "parcel build"
},
"dependencies": {
"@status-im/react": "^0.0.0",
"react": "^17.0.0",
"react-dom": "^17.0.0"
},
"devDependencies": {
"@types/react": "^17.0.0",
"@types/react-dom": "^17.0.0",
"parcel": "^2.0.0",
"assert": "^2.0.0",
"crypto-browserify": "^3.12.0",
"process": "^0.11.10",
"stream-browserify": "^3.0.0",
"typescript": "^4.0.0"
}
}

View File

@ -4,11 +4,7 @@ import { render } from 'react-dom'
import { Community, lightTheme } from '@status-im/react' import { Community, lightTheme } from '@status-im/react'
const App = () => { const App = () => {
return ( return <Community publicKey="<YOUR_COMMUNITY_KEY>" theme={lightTheme} />
<div>
<Community publicKey="<YOUR_COMMUNITY_KEY>" theme={lightTheme} />
</div>
)
} }
render( render(

View File

@ -0,0 +1,5 @@
body,
html,
#root {
height: 100%;
}

View File

@ -25,7 +25,16 @@
}, },
"dependencies": { "dependencies": {
"@hcaptcha/react-hcaptcha": "^1.0.0", "@hcaptcha/react-hcaptcha": "^1.0.0",
"@radix-ui/react-accessible-icon": "^0.1.4",
"@radix-ui/react-alert-dialog": "^0.1.7",
"@radix-ui/react-collapsible": "^0.1.6",
"@radix-ui/react-context-menu": "^0.1.6",
"@radix-ui/react-dialog": "^0.1.7",
"@radix-ui/react-dropdown-menu": "^0.1.6",
"@radix-ui/react-tooltip": "^0.1.7",
"@radix-ui/react-visually-hidden": "^0.1.4",
"@status-im/core": "^0.0.0", "@status-im/core": "^0.0.0",
"@stitches/react": "^1.2.7",
"emoji-mart": "^3.0.1", "emoji-mart": "^3.0.1",
"html-entities": "^2.3.2", "html-entities": "^2.3.2",
"js-sha3": "^0.8.0", "js-sha3": "^0.8.0",
@ -34,7 +43,7 @@
"react": "^17.0.2", "react": "^17.0.2",
"react-dom": "^17.0.2", "react-dom": "^17.0.2",
"react-is": "^17.0.2", "react-is": "^17.0.2",
"styled-components": "^5.3.1" "tinykeys": "^1.4.0"
}, },
"devDependencies": { "devDependencies": {
"@types/emoji-mart": "^3.0.6", "@types/emoji-mart": "^3.0.6",

View File

@ -0,0 +1,12 @@
import { useEffect } from 'react'
import tinykeys from 'tinykeys'
import type { KeyBindingMap } from 'tinykeys'
// docs: https://github.com/jamiebuilds/tinykeys#commonly-used-keys-and-codes
export const useKeyboardShortcuts = (keyBindingMap: KeyBindingMap) => {
useEffect(() => {
return tinykeys(window, keyBindingMap)
})
}

View File

@ -1,4 +1,3 @@
export { type ChannelProps, Channel } from './modules/channel'
export { type CommunityProps, Community } from './modules/community' export { type CommunityProps, Community } from './modules/community'
export { darkTheme, lightTheme } from './styles/themes' export { darkTheme, lightTheme } from './styles/themes'
export type { Config } from './types/config' export type { Config } from './types/config'

View File

@ -1,181 +0,0 @@
import React, { useCallback, useEffect, useMemo, useState } from 'react'
import styled from 'styled-components'
import { ChatCreation } from '~/src/components/Chat/ChatCreation'
import { ChatInput } from '~/src/components/Chat/ChatInput'
import { ChatTopbar, ChatTopbarLoading } from '~/src/components/Chat/ChatTopbar'
import { TokenRequirement } from '~/src/components/Form/TokenRequirement'
import { MessagesList } from '~/src/components/Messages/MessagesList'
import { NarrowChannels } from '~/src/components/NarrowMode/NarrowChannels'
import { NarrowMembers } from '~/src/components/NarrowMode/NarrowMembers'
import { LoadingSkeleton } from '~/src/components/Skeleton/LoadingSkeleton'
import { useMessengerContext } from '~/src/contexts/messengerProvider'
import { useNarrow } from '~/src/contexts/narrowProvider'
import type { Reply } from '~/src/hooks/useReply'
import type { ChannelData } from '~/src/models/ChannelData'
export enum ChatBodyState {
Chat,
Channels,
Members,
}
function ChatBodyLoading() {
const narrow = useNarrow()
return (
<Wrapper>
<ChatBodyWrapper className={narrow ? 'narrow' : ''}>
<ChatTopbarLoading />
<LoadingSkeleton />
<ChatInput reply={undefined} setReply={() => undefined} />
</ChatBodyWrapper>
</Wrapper>
)
}
type ChatBodyContentProps = {
showState: ChatBodyState
switchShowState: (state: ChatBodyState) => void
channel: ChannelData
}
function ChatBodyContent({
showState,
switchShowState,
channel,
}: ChatBodyContentProps) {
const [reply, setReply] = useState<Reply | undefined>(undefined)
switch (showState) {
case ChatBodyState.Chat:
return (
<>
<MessagesList setReply={setReply} channel={channel} />
<ChatInput reply={reply} setReply={setReply} />
</>
)
case ChatBodyState.Channels:
return (
<NarrowChannels
setShowChannels={() => switchShowState(ChatBodyState.Channels)}
/>
)
case ChatBodyState.Members:
return (
<NarrowMembers
switchShowMembersList={() => switchShowState(ChatBodyState.Members)}
/>
)
}
}
interface GroupChatBodyProps {
onClick: () => void
showMembers: boolean
permission: boolean
editGroup: boolean
setEditGroup: React.Dispatch<React.SetStateAction<boolean>>
}
export function GroupChatBody({
onClick,
showMembers,
permission,
editGroup,
setEditGroup,
}: GroupChatBodyProps) {
const { activeChannel, loadingMessenger } = useMessengerContext()
const narrow = useNarrow()
const className = useMemo(() => (narrow ? 'narrow' : ''), [narrow])
const [showState, setShowState] = useState<ChatBodyState>(ChatBodyState.Chat)
const switchShowState = useCallback(
(state: ChatBodyState) => {
if (narrow) {
setShowState(prev => (prev === state ? ChatBodyState.Chat : state))
}
},
[narrow]
)
useEffect(() => {
if (!narrow) {
setShowState(ChatBodyState.Chat)
}
}, [narrow])
if (!loadingMessenger && activeChannel) {
return (
<Wrapper>
<ChatBodyWrapper className={className}>
{editGroup ? (
<ChatCreation
setEditGroup={setEditGroup}
activeChannel={activeChannel}
/>
) : (
<ChatTopbar
onClick={onClick}
setEditGroup={setEditGroup}
showMembers={showMembers}
showState={showState}
switchShowState={switchShowState}
/>
)}
<ChatBodyContent
showState={showState}
switchShowState={switchShowState}
channel={activeChannel}
/>
</ChatBodyWrapper>
{!permission && (
<BluredWrapper>
<TokenRequirement />
</BluredWrapper>
)}
</Wrapper>
)
}
return <ChatBodyLoading />
}
export const Wrapper = styled.div`
width: 61%;
display: flex;
flex-direction: column;
flex: 1;
height: 100%;
background: ${({ theme }) => theme.bodyBackgroundColor};
position: relative;
&.narrow {
width: 100%;
}
`
const ChatBodyWrapper = styled.div`
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
flex: 1;
background: ${({ theme }) => theme.bodyBackgroundColor};
`
const BluredWrapper = styled.div`
width: 100%;
height: 100%;
display: flex;
align-items: flex-end;
justify-content: center;
position: absolute;
bottom: 0;
left: 0;
background: ${({ theme }) => theme.bodyBackgroundGradient};
backdrop-filter: blur(4px);
z-index: 2;
`

View File

@ -1,98 +0,0 @@
import React, { useState } from 'react'
import styled from 'styled-components'
import { Channels } from '~/src/components/Channels/Channels'
import { ChatCreation } from '~/src/components/Chat/ChatCreation'
import { AgreementModal } from '~/src/components/Modals/AgreementModal'
import { CoinbaseModal } from '~/src/components/Modals/CoinbaseModal'
import { EditModal } from '~/src/components/Modals/EditModal'
import { LeavingModal } from '~/src/components/Modals/LeavingModal'
import { LogoutModal } from '~/src/components/Modals/LogoutModal'
import { ProfileFoundModal } from '~/src/components/Modals/ProfileFoundModal'
import { ProfileModal } from '~/src/components/Modals/ProfileModal'
import { StatusModal } from '~/src/components/Modals/StatusModal'
import { UserCreationModal } from '~/src/components/Modals/UserCreationModal'
import { UserCreationStartModal } from '~/src/components/Modals/UserCreationStartModal'
import { WalletConnectModal } from '~/src/components/Modals/WalletConnectModal'
import { WalletModal } from '~/src/components/Modals/WalletModal'
import { ToastMessageList } from '~/src/components/ToastMessages/ToastMessageList'
import { ChatState, useChatState } from '~/src/contexts/chatStateProvider'
import { useNarrow } from '~/src/contexts/narrowProvider'
import { GroupChatBody } from './GroupChat/GroupChatBody'
import { GroupMembers } from './GroupMembers/GroupMembers'
// import type { ChannelProps } from '.'
function Modals() {
return (
<>
<UserCreationModal />
<EditModal />
<ProfileModal />
<StatusModal />
<WalletModal />
<WalletConnectModal />
<CoinbaseModal />
<LogoutModal />
<AgreementModal />
<ProfileFoundModal />
<UserCreationStartModal />
<LeavingModal />
</>
)
}
// interface Props {
// options: ChannelProps['options']
// }
export const GroupChatRoom = () => {
const [state] = useChatState()
const [showMembers, setShowMembers] = useState(false)
const [editGroup, setEditGroup] = useState(false)
const narrow = useNarrow()
return (
<ChatWrapper>
{!narrow && (
<ChannelsWrapper>
<Channels setEditGroup={setEditGroup} />
</ChannelsWrapper>
)}
{state === ChatState.ChatBody && (
<GroupChatBody
onClick={() => setShowMembers(!showMembers)}
showMembers={showMembers}
permission={true}
editGroup={editGroup}
setEditGroup={setEditGroup}
/>
)}
{showMembers && !narrow && state === ChatState.ChatBody && (
<GroupMembers />
)}
{state === ChatState.ChatCreation && <ChatCreation />}
<Modals />
<ToastMessageList />
</ChatWrapper>
)
}
const ChatWrapper = styled.div`
width: 100%;
height: 100%;
display: flex;
position: relative;
`
const ChannelsWrapper = styled.div`
width: 21%;
height: 100%;
min-width: 250px;
background-color: ${({ theme }) => theme.sectionBackgroundColor};
padding: 10px 16px;
display: flex;
flex-direction: column;
`

View File

@ -1,50 +0,0 @@
import React, { useMemo, useState } from 'react'
import styled from 'styled-components'
import { MembersList } from '~/src/components/Members/MembersList'
import { useMessengerContext } from '~/src/contexts/messengerProvider'
export function GroupMembers() {
const { addContact, activeChannel } = useMessengerContext()
const heading = useMemo(
() =>
activeChannel && activeChannel?.type === 'group'
? 'Group members'
: 'Members',
[activeChannel]
)
const [newUserInput, setNewUserInput] = useState('')
return (
<>
<MembersWrapper>
<MemberHeading>{heading}</MemberHeading>
<MembersList />
<input
value={newUserInput}
onChange={e => setNewUserInput(e.target.value)}
/>
<button onClick={() => addContact(newUserInput)}>Add Contact</button>
</MembersWrapper>
</>
)
}
const MembersWrapper = styled.div`
width: 18%;
height: 100%;
min-width: 164px;
display: flex;
flex-direction: column;
background-color: ${({ theme }) => theme.sectionBackgroundColor};
padding: 16px;
overflow-y: scroll;
`
const MemberHeading = styled.h2`
font-weight: 500;
font-size: 15px;
line-height: 22px;
color: ${({ theme }) => theme.primary};
margin-bottom: 16px;
`

View File

@ -1,59 +0,0 @@
import React, { useRef } from 'react'
import styled, { ThemeProvider } from 'styled-components'
import { ChatStateProvider } from '~/src/contexts/chatStateProvider'
import { IdentityProvider } from '~/src/contexts/identityProvider'
import { MessengerProvider } from '~/src/contexts/messengerProvider'
import { ModalProvider } from '~/src/contexts/modalProvider'
import { NarrowProvider } from '~/src/contexts/narrowProvider'
import { ToastProvider } from '~/src/contexts/toastProvider'
import { GlobalStyle } from '~/src/styles/GlobalStyle'
import { GroupChatRoom } from './GroupChatRoom'
import type { Config } from '~/src/types/config'
interface Props extends Config {
options: {
showMembers?: false
}
}
export const Channel = (props: Props) => {
const { publicKey, theme, environment } = props
const ref = useRef<HTMLHeadingElement>(null)
return (
<ThemeProvider theme={theme}>
<NarrowProvider myRef={ref}>
<ModalProvider>
<ToastProvider>
<Wrapper ref={ref}>
<GlobalStyle />
<IdentityProvider>
<MessengerProvider
publicKey={publicKey}
environment={environment}
>
<ChatStateProvider>
<GroupChatRoom />
<div id="modal-root" />
</ChatStateProvider>
</MessengerProvider>
</IdentityProvider>
</Wrapper>
</ToastProvider>
</ModalProvider>
</NarrowProvider>
</ThemeProvider>
)
}
export type { Props as ChannelProps }
const Wrapper = styled.div`
height: 100%;
overflow: hidden;
`

View File

@ -0,0 +1,46 @@
import { createStitches } from '@stitches/react'
import type { CSS as StitchesCSS } from '@stitches/react'
export type { VariantProps } from '@stitches/react'
export type CSS = StitchesCSS<typeof config>
export const { styled, css, keyframes, theme, createTheme, config } =
createStitches({
prefix: 'status',
theme: {
fonts: {
sans: 'Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"',
mono: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace',
},
fontWeights: {
400: '400',
500: '500',
600: '600',
},
colors: {
white: '#fff',
},
space: {
1: '4px',
2: '8px',
3: '16px',
4: '20px',
5: '24px',
6: '32px',
7: '48px',
8: '64px',
9: '80px',
},
radii: {
8: '8px',
},
},
media: {
medium: '(min-width: 500px)',
large: '(min-width: 736px)',
motion: '(prefers-reduced-motion: no-preference)',
},
})

View File

@ -0,0 +1,5 @@
# Avatar
```tsx
import { Avatar } from '@status-im/components'
```

View File

@ -0,0 +1,54 @@
import React from 'react'
import { Image } from '../image'
import { Base, Indicator } from './styles'
import type { Variants } from './styles'
interface Props {
size: Variants['size']
indicator?: 'online' | 'offline'
src?: string
}
const Avatar = (props: Props) => {
const { size, src, indicator } = props
// const identicon = useMemo(() => {
// const colors = colorWheel
// .map((color, idx) => {
// const prevDeg = idx === 0 ? '0deg' : `${colorWheel[idx - 1][1]}deg`
// return `${color[0]} ${prevDeg} ${color[1]}deg`
// })
// .join(',')
// return `conic-gradient(${colors})`
// }, [colorWheel])
// const intials = useMemo(() => {
// if (contact && contact?.customName) {
// return contact.customName.slice(0, 2)
// }
// if (contact && contact.trueName) {
// return contact.trueName.slice(0, 2)
// }
// }, [contact])
return (
<Base size={size}>
{src && (
<Image
src={src}
alt="avatar"
width="100%"
height="100%"
fit="cover"
radius="full"
/>
)}
{indicator && <Indicator size={size} state={indicator} />}
</Base>
)
}
export { Avatar }
export type { Props as AvatarProps }

View File

@ -0,0 +1,2 @@
export type { AvatarProps } from './avatar'
export { Avatar } from './avatar'

View File

@ -0,0 +1,71 @@
import { styled } from '~/src/styles/config'
import type { VariantProps } from '~/src/styles/config'
export type Variants = VariantProps<typeof Base>
export const Base = styled('div', {
position: 'relative',
background: '#F6F8FA',
borderRadius: '100%',
flexShrink: 0,
variants: {
size: {
20: {
width: 20,
height: 20,
},
24: {
width: 24,
height: 24,
},
32: {
width: 32,
height: 32,
},
36: {
width: 36,
height: 36,
},
44: {
width: 44,
height: 44,
},
120: {
width: 120,
height: 120,
},
},
},
})
export const Indicator = styled('span', {
position: 'absolute',
right: -2,
bottom: -2,
borderRadius: '100%',
border: '2px solid #fff',
variants: {
size: {
20: {},
24: {},
32: {
width: 12,
height: 12,
},
36: {},
44: {},
120: {},
},
state: {
online: {
backgroundColor: '#4EBC60',
},
offline: {
backgroundColor: '#939BA1',
},
},
},
})

View File

@ -0,0 +1,5 @@
# Box
```tsx
import { Box } from '@status-im/components'
```

View File

@ -0,0 +1,8 @@
import { styled } from '~/src/styles/config'
const Box = styled('div', {
boxSizing: 'border-box',
})
export { Box }
export type BoxProps = React.ComponentProps<typeof Box>

View File

@ -0,0 +1,2 @@
export type { BoxProps } from './box'
export { Box } from './box'

View File

@ -0,0 +1,5 @@
# Button
```tsx
import { Button } from '@status-im/components'
```

View File

@ -0,0 +1,48 @@
import React, { forwardRef } from 'react'
import { Base } from './styles'
import type { Variants } from './styles'
import type { Ref } from 'react'
type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>
interface Props {
children: string
disabled?: boolean
loading?: boolean
type?: ButtonProps['type']
onClick?: ButtonProps['onClick']
variant?: Variants['variant']
}
const Button = (props: Props, ref: Ref<HTMLButtonElement>) => {
const {
type = 'button',
children,
disabled,
loading,
onClick,
variant = 'default',
...buttonProps
} = props
return (
<Base
{...buttonProps}
type={type}
ref={ref}
disabled={disabled}
loading={loading}
onClick={onClick}
variant={variant}
>
{children}
</Base>
)
}
const _Button = forwardRef(Button)
export { _Button as Button }
export type { Props as ButtonProps }

View File

@ -0,0 +1,2 @@
export type { ButtonProps } from './button'
export { Button } from './button'

View File

@ -0,0 +1,53 @@
import { styled } from '~/src/styles/config'
import type { VariantProps } from '~/src/styles/config'
export type Variants = VariantProps<typeof Base>
export const Base = styled('button', {
all: 'unset',
fontFamily: '$sans',
fontWeight: '$500',
fontSize: '15px',
position: 'relative',
display: 'inline-flex',
justifyContent: 'center',
alignItems: 'center',
padding: '11px 24px',
borderRadius: 8,
transitionProperty: 'background-color, border-color, color, fill, stroke',
transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
transitionDuration: '150ms',
'&:disabled': {
background: '#EEF2F5',
color: '#939BA1',
cursor: 'not-allowed',
},
variants: {
variant: {
default: {
background: 'rgba(67, 96, 223, 0.1)',
color: '#4360DF',
'&:hover': {},
},
minimal: {
'&:hover': {},
},
danger: {
background: 'rgba(255, 45, 85, 0.1)',
color: '#FF2D55',
'&:hover': {},
},
},
loading: {
true: {},
},
width: {
full: {
width: '100%',
},
},
},
})

View File

@ -0,0 +1,5 @@
# ContextMenu
```tsx
import { ContextMenu } from '@status-im/components'
```

View File

@ -0,0 +1,77 @@
import React from 'react'
import * as Primitive from '@radix-ui/react-context-menu'
import * as Menu from '../menu'
import type {
ContextMenuContentProps,
ContextMenuItemProps,
ContextMenuSeparatorProps,
ContextMenuTriggerProps,
} from '@radix-ui/react-context-menu'
interface TriggerProps extends ContextMenuTriggerProps {
children: [React.ReactElement, React.ReactElement]
}
const ContextMenuTrigger = (props: TriggerProps) => {
const { children, ...triggerProps } = props
const [trigger, menu] = children
return (
<Primitive.Root>
<Primitive.Trigger {...triggerProps} asChild>
{trigger}
</Primitive.Trigger>
{menu}
</Primitive.Root>
)
}
interface MenuProps extends ContextMenuContentProps {
children: React.ReactElement[] | React.ReactElement
}
const ContextMenu = (props: MenuProps) => {
const { children, sideOffset = 6, ...menuProps } = props
return (
<Menu.Content {...menuProps} as={Primitive.Content} sideOffset={sideOffset}>
{children}
</Menu.Content>
)
}
const Item = (props: ContextMenuItemProps & Menu.ItemProps) => {
return <Menu.Item as={Primitive.Item} {...props} />
}
interface TriggerItemProps extends Menu.TriggerItemProps {
label: string
children: React.ReactElement[] | React.ReactElement
}
const TriggerItem = (props: TriggerItemProps) => {
const { label, children, ...itemProps } = props
return (
<Primitive.Root>
<Menu.TriggerItem as={Primitive.TriggerItem} {...itemProps}>
{label}
</Menu.TriggerItem>
<ContextMenu sideOffset={-1}>{children}</ContextMenu>
</Primitive.Root>
)
}
const Separator = (props: ContextMenuSeparatorProps) => {
return <Menu.Separator as={Primitive.Separator} {...props} />
}
ContextMenu.Item = Item
ContextMenu.TriggerItem = TriggerItem
ContextMenu.Separator = Separator
export { ContextMenu, ContextMenuTrigger }

View File

@ -0,0 +1 @@
export { ContextMenu, ContextMenuTrigger } from './context-menu'

View File

@ -0,0 +1,68 @@
import React from 'react'
import * as Primitive from '@radix-ui/react-alert-dialog'
import { CrossIcon } from '~/src/icons/cross-icon'
import { Button } from '../button'
import { IconButton } from '../icon-button'
import { Text } from '../text'
import { Actions, Body, Content, Header, Overlay, Title } from './styles'
interface TriggerProps {
children: [React.ReactElement, React.ReactElement]
}
const AlertDialogTrigger = (props: TriggerProps) => {
const { children } = props
const [trigger, content] = children
return (
<Primitive.Root>
<Primitive.Trigger asChild>{trigger}</Primitive.Trigger>
{content}
</Primitive.Root>
)
}
interface DialogProps {
title: string
description: string
// actionLabel: string
// cancelLabel?: string
}
const AlertDialog = (props: DialogProps) => {
const { title, description } = props
return (
<Primitive.Portal>
<Overlay as={Primitive.Overlay} />
<Content as={Primitive.Content}>
<Header>
<Title as={Primitive.Title}>{title}</Title>
<Primitive.Cancel asChild>
<IconButton label="Close">
<CrossIcon />
</IconButton>
</Primitive.Cancel>
</Header>
<Body>
<Text as={Primitive.Description}>{description}</Text>
</Body>
<Actions>
<Primitive.Cancel asChild>
<Button>Cancel</Button>
</Primitive.Cancel>
<Primitive.Action asChild>
<Button>Action</Button>
</Primitive.Action>
</Actions>
</Content>
</Primitive.Portal>
)
}
export { AlertDialog, AlertDialogTrigger }

View File

@ -0,0 +1,5 @@
# Dialog
```tsx
import { Dialog, AlertDialog } from '@status-im/components'
```

View File

@ -0,0 +1,66 @@
import React, { useState } from 'react'
import * as Primitive from '@radix-ui/react-dialog'
import { CrossIcon } from '~/src/icons/cross-icon'
import { Button } from '../button'
import { IconButton } from '../icon-button'
import { Actions, Body, Content, Header, Overlay, Title } from './styles'
interface DialogTriggerProps {
children: [React.ReactElement, React.ReactElement]
}
const DialogTrigger = (props: DialogTriggerProps) => {
const { children } = props
const [open, setOpen] = useState(false)
const [trigger, content] = children
return (
<Primitive.Root open={open} onOpenChange={setOpen}>
<Primitive.Trigger asChild>{trigger}</Primitive.Trigger>
{content}
</Primitive.Root>
)
}
interface DialogProps {
title: React.ReactNode
children: React.ReactNode
actionLabel: string
cancelLabel?: string
}
const Dialog = (props: DialogProps) => {
const { title, children, actionLabel, cancelLabel } = props
return (
<Primitive.Portal>
<Overlay as={Primitive.Overlay} />
<Content as={Primitive.Content}>
<Header>
<Title as={Primitive.Title}>{title}</Title>
<Primitive.Close asChild>
<IconButton label="Close">
<CrossIcon />
</IconButton>
</Primitive.Close>
</Header>
<Body>{children}</Body>
<Actions>
{cancelLabel && (
<Primitive.Close asChild>
<Button>{cancelLabel}</Button>
</Primitive.Close>
)}
<Button>{actionLabel}</Button>
</Actions>
</Content>
</Primitive.Portal>
)
}
export { Dialog, DialogTrigger }

View File

@ -0,0 +1,2 @@
export { AlertDialog, AlertDialogTrigger } from './alert-dialog'
export { Dialog, DialogTrigger } from './dialog'

View File

@ -0,0 +1,76 @@
import { keyframes, styled } from '~/src/styles/config'
const overlayAnimation = keyframes({
'0%': {
opacity: 0,
},
'100%': {
opacity: 1,
},
})
export const Overlay = styled('div', {
inset: 0,
position: 'fixed',
backgroundColor: 'rgba(0,0,0,0.4)',
'@motion': {
animation: `${overlayAnimation} 150ms cubic-bezier(0.16, 1, 0.3, 1) forwards`,
},
})
const contentAnimation = keyframes({
'0%': {
opacity: 0,
transform: 'translate(-50%, -48%) scale(.96)',
},
'100%': {
opacity: 1,
transform: 'translate(-50%, -50%) scale(1)',
},
})
export const Content = styled('div', {
backgroundColor: 'white',
borderRadius: 8,
boxShadow:
'hsl(206 22% 7% / 35%) 0px 10px 38px -10px, hsl(206 22% 7% / 20%) 0px 10px 20px -15px',
position: 'fixed',
top: '50%',
left: '50%',
transform: 'translate(-50%, -50%)',
width: '90vw',
maxWidth: '638px',
maxHeight: '85vh',
'@motion': {
animation: `${contentAnimation} 150ms cubic-bezier(0.16, 1, 0.3, 1) forwards`,
},
})
export const Header = styled('div', {
padding: '16px',
display: 'flex',
alignItems: 'center',
justifyContent: 'space-between',
borderBottom: '1px solid #eee',
})
export const Body = styled('div', {
padding: '16px',
})
export const Actions = styled('div', {
padding: '16px 18px',
display: 'flex',
alignItems: 'center',
justifyContent: 'flex-end',
gap: 16,
borderTop: '1px solid #eee',
})
export const Title = styled('div', {
margin: 0,
fontWeight: 500,
fontSize: 17,
})

View File

@ -0,0 +1,5 @@
# DropdownMenu
```tsx
import { DropdownMenu } from '@status-im/components'
```

View File

@ -0,0 +1,82 @@
import React from 'react'
import * as Primitive from '@radix-ui/react-dropdown-menu'
import * as Menu from '../menu'
import type {
DropdownMenuContentProps,
DropdownMenuItemProps,
DropdownMenuSeparatorProps,
DropdownMenuTriggerProps,
} from '@radix-ui/react-dropdown-menu'
interface TriggerProps extends DropdownMenuTriggerProps {
children: [React.ReactElement, React.ReactElement]
}
const DropdownMenuTrigger = (props: TriggerProps) => {
const { children, ...triggerProps } = props
const [trigger, content] = children
return (
<Primitive.Root>
<Primitive.Trigger {...triggerProps} asChild>
{trigger}
</Primitive.Trigger>
{content}
</Primitive.Root>
)
}
interface MenuProps extends DropdownMenuContentProps {
children: React.ReactElement[] | React.ReactElement
}
const DropdownMenu = (props: MenuProps) => {
const { children, align = 'start', sideOffset = 6, ...menuProps } = props
return (
<Menu.Content
{...menuProps}
as={Primitive.Content}
align={align}
sideOffset={sideOffset}
>
{children}
</Menu.Content>
)
}
const Item = (props: DropdownMenuItemProps & Menu.ItemProps) => {
return <Menu.Item as={Primitive.Item} {...props} />
}
interface TriggerItemProps extends Menu.TriggerItemProps {
label: string
children: React.ReactElement[] | React.ReactElement
}
const TriggerItem = (props: TriggerItemProps) => {
const { label, children, ...itemProps } = props
return (
<Primitive.Root>
<Menu.TriggerItem as={Primitive.TriggerItem} {...itemProps}>
{label}
</Menu.TriggerItem>
<DropdownMenu sideOffset={-1}>{children}</DropdownMenu>
</Primitive.Root>
)
}
const Separator = (props: DropdownMenuSeparatorProps) => {
return <Menu.Separator as={Primitive.Separator} {...props} />
}
DropdownMenu.Item = Item
DropdownMenu.TriggerItem = TriggerItem
DropdownMenu.Separator = Separator
export { DropdownMenu, DropdownMenuTrigger }

View File

@ -0,0 +1 @@
export { DropdownMenu, DropdownMenuTrigger } from './dropdown-menu'

View File

@ -0,0 +1,5 @@
# EthAddress
```tsx
import { EthAddress } from '@status-im/components'
```

View File

@ -0,0 +1,22 @@
import React from 'react'
import { Text } from '../text'
import type { TextProps } from '../text'
interface Props extends TextProps {
children: string
}
const EthAddress = (props: Props) => {
const { children, ...textProps } = props
return (
<Text {...textProps}>
0x{children.substring(0, 3)}...{children.substring(children.length - 3)}
</Text>
)
}
export { EthAddress }
export type { Props as EthAddressProps }

View File

@ -0,0 +1,2 @@
export type { EthAddressProps } from './eth-address'
export { EthAddress } from './eth-address'

View File

@ -0,0 +1,5 @@
# Flex
```tsx
import { Flex } from '@status-im/components'
```

View File

@ -0,0 +1,105 @@
import { styled } from '~/src/styles/config'
import { Box } from '../box'
const Flex = styled(Box, {
display: 'flex',
variants: {
direction: {
row: {
flexDirection: 'row',
},
column: {
flexDirection: 'column',
},
rowReverse: {
flexDirection: 'row-reverse',
},
columnReverse: {
flexDirection: 'column-reverse',
},
},
align: {
start: {
alignItems: 'flex-start',
},
center: {
alignItems: 'center',
},
end: {
alignItems: 'flex-end',
},
stretch: {
alignItems: 'stretch',
},
baseline: {
alignItems: 'baseline',
},
},
justify: {
start: {
justifyContent: 'flex-start',
},
center: {
justifyContent: 'center',
},
end: {
justifyContent: 'flex-end',
},
between: {
justifyContent: 'space-between',
},
},
wrap: {
noWrap: {
flexWrap: 'nowrap',
},
wrap: {
flexWrap: 'wrap',
},
wrapReverse: {
flexWrap: 'wrap-reverse',
},
},
gap: {
1: {
gap: '$1',
},
2: {
gap: '$2',
},
3: {
gap: '$3',
},
4: {
gap: '$4',
},
5: {
gap: '$5',
},
6: {
gap: '$6',
},
7: {
gap: '$7',
},
8: {
gap: '$8',
},
9: {
gap: '$9',
},
},
},
defaultVariants: {
direction: 'row',
align: 'stretch',
justify: 'start',
wrap: 'noWrap',
},
})
export { Flex }
export type FlexProps = React.ComponentProps<typeof Flex>

View File

@ -0,0 +1,2 @@
export type { FlexProps } from './flex'
export { Flex } from './flex'

View File

@ -0,0 +1,5 @@
# Grid
```tsx
import { Grid } from '@status-im/components'
```

View File

@ -0,0 +1,162 @@
import { styled } from '~/src/styles/config'
import { Box } from '../box'
const Grid = styled(Box, {
display: 'grid',
variants: {
align: {
start: {
alignItems: 'start',
},
center: {
alignItems: 'center',
},
end: {
alignItems: 'end',
},
stretch: {
alignItems: 'stretch',
},
baseline: {
alignItems: 'baseline',
},
},
justify: {
start: {
justifyContent: 'start',
},
center: {
justifyContent: 'center',
},
end: {
justifyContent: 'end',
},
between: {
justifyContent: 'space-between',
},
},
flow: {
row: {
gridAutoFlow: 'row',
},
column: {
gridAutoFlow: 'column',
},
dense: {
gridAutoFlow: 'dense',
},
rowDense: {
gridAutoFlow: 'row dense',
},
columnDense: {
gridAutoFlow: 'column dense',
},
},
columns: {
1: {
gridTemplateColumns: 'repeat(1, 1fr)',
},
2: {
gridTemplateColumns: 'repeat(2, 1fr)',
},
3: {
gridTemplateColumns: 'repeat(3, 1fr)',
},
4: {
gridTemplateColumns: 'repeat(4, 1fr)',
},
},
gap: {
1: {
gap: '$1',
},
2: {
gap: '$2',
},
3: {
gap: '$3',
},
4: {
gap: '$4',
},
5: {
gap: '$5',
},
6: {
gap: '$6',
},
7: {
gap: '$7',
},
8: {
gap: '$8',
},
9: {
gap: '$9',
},
},
gapX: {
1: {
columnGap: '$1',
},
2: {
columnGap: '$2',
},
3: {
columnGap: '$3',
},
4: {
columnGap: '$4',
},
5: {
columnGap: '$5',
},
6: {
columnGap: '$6',
},
7: {
columnGap: '$7',
},
8: {
columnGap: '$8',
},
9: {
columnGap: '$9',
},
},
gapY: {
1: {
rowGap: '$1',
},
2: {
rowGap: '$2',
},
3: {
rowGap: '$3',
},
4: {
rowGap: '$4',
},
5: {
rowGap: '$5',
},
6: {
rowGap: '$6',
},
7: {
rowGap: '$7',
},
8: {
rowGap: '$8',
},
9: {
rowGap: '$9',
},
},
},
})
export { Grid }
export type GridProps = React.ComponentProps<typeof Grid>

View File

@ -0,0 +1,2 @@
export type { GridProps } from './grid'
export { Grid } from './grid'

View File

@ -0,0 +1,5 @@
# Heading
```tsx
import { Heading } from '@status-im/components'
```

View File

@ -0,0 +1,64 @@
import { styled, theme } from '~/src/styles/config'
import type React from 'react'
const Heading = styled('div', {
fontFamily: theme.fonts.sans,
fontSize: '17px',
variants: {
size: {},
color: {},
weight: {
'400': {
fontWeight: theme.fontWeights[400],
},
'500': {
fontWeight: theme.fontWeights[500],
},
'600': {
fontWeight: theme.fontWeights[600],
},
},
align: {
left: {
textAlign: 'left',
},
right: {
textAlign: 'right',
},
center: {
textAlign: 'center',
},
},
transform: {
uppercase: {
textTransform: 'uppercase',
},
lowercase: {
textTransform: 'lowercase',
},
capitalize: {
textTransform: 'capitalize',
},
},
truncate: {
true: {
whiteSpace: 'nowrap',
overflow: 'hidden',
textOverflow: 'ellipsis',
minWidth: 0,
maxWidth: '100%',
},
},
},
defaultVariants: {
align: 'left',
},
// compoundVariants: {},
})
export { Heading }
export type HeadingProps = React.ComponentProps<typeof Heading>

View File

@ -0,0 +1,2 @@
export type { HeadingProps } from './heading'
export { Heading } from './heading'

View File

@ -0,0 +1,5 @@
# IconButton
```tsx
import { IconButton } from '@status-im/components'
```

View File

@ -0,0 +1,53 @@
import React, { forwardRef } from 'react'
import { AccessibleIcon } from '@radix-ui/react-accessible-icon'
import { Base } from './styles'
import type { Variants } from './styles'
import type { Ref } from 'react'
type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>
interface Props {
label: string
children: React.ReactElement
type?: ButtonProps['type']
onClick?: ButtonProps['onClick']
intent?: Variants['intent']
color?: Variants['color']
active?: boolean
}
const IconButton = (props: Props, ref: Ref<HTMLButtonElement>) => {
const {
label,
children,
type = 'button',
onClick,
intent,
color,
active,
...buttonProps
} = props
return (
<Base
{...buttonProps}
type={type}
ref={ref}
aria-label={label}
onClick={onClick}
intent={intent}
color={color}
active={active}
>
<AccessibleIcon label={label}>{children}</AccessibleIcon>
</Base>
)
}
const _IconButton = forwardRef(IconButton)
export { _IconButton as IconButton }
export type { Props as IconButtonProps }

View File

@ -0,0 +1,2 @@
export type { IconButtonProps } from './icon-button'
export { IconButton } from './icon-button'

View File

@ -0,0 +1,58 @@
import { styled } from '~/src/styles/config'
import type { VariantProps } from '~/src/styles/config'
export type Variants = VariantProps<typeof Base>
export const Base = styled('button', {
all: 'unset',
width: 32,
height: 32,
flexShrink: 0,
display: 'inline-flex',
alignItems: 'center',
justifyContent: 'center',
borderRadius: 8,
'&:hover': {
background: '#EEF2F5',
},
'&[aria-expanded="true"]': {
background: '#F6F8FA',
},
variants: {
color: {
default: {
color: '#000',
},
gray: {
color: '#939BA1',
},
},
intent: {
info: {
'&:hover': {
background: 'rgba(67, 96, 223, 0.1)',
color: '#4360DF',
},
},
danger: {
'&:hover': {
background: 'rgba(255, 45, 85, 0.2)',
color: '#FF2D55',
},
},
},
active: {
true: {
background: '#F6F8FA',
},
},
},
defaultVariants: {
color: 'default',
},
})

View File

@ -0,0 +1,5 @@
# Icon
```tsx
import { Icon } from '@status-im/components'
```

View File

@ -0,0 +1,23 @@
import React, { cloneElement } from 'react'
import { Root } from '@radix-ui/react-accessible-icon'
type Props = ({ label: string; hidden?: false } | { hidden: true }) & {
children: React.ReactElement
}
const Icon = (props: Props) => {
const { children, hidden } = props
if (hidden) {
return cloneElement(children, {
'aria-hidden': 'true',
focusable: 'false',
})
}
return <Root label={props.label}>{children}</Root>
}
export { Icon }
export type { Props as IconProps }

View File

@ -0,0 +1,2 @@
export type { IconProps } from './icon'
export { Icon } from './icon'

View File

@ -0,0 +1,5 @@
# Image
```tsx
import { Image } from '@status-im/components'
```

View File

@ -0,0 +1,40 @@
import React from 'react'
import { Base } from './styles'
import type { Variants } from './styles'
interface Props {
src: string
alt: string
width?: number | '100%'
height?: number | '100%'
fit?: Variants['fit']
radius?: Variants['radius']
}
const Image = (props: Props) => {
const { width, height, alt, radius, fit } = props
if (!alt) {
console.warn(
'The `alt` prop was not provided to an image. ' +
'Add `alt` text for screen readers, or set `alt=""` prop to indicate that the image ' +
'is decorative or redundant with displayed text and should not be announced by screen readers.'
)
}
return (
<Base
{...props}
width={width}
height={height}
css={{ width, height }}
radius={radius}
fit={fit}
/>
)
}
export { Image }
export type { Props as ImageProps }

View File

@ -0,0 +1,2 @@
export type { ImageProps } from './image'
export { Image } from './image'

View File

@ -0,0 +1,34 @@
import { styled } from '~/src/styles/config'
import type { VariantProps } from '~/src/styles/config'
export type Variants = VariantProps<typeof Base>
export const Base = styled('img', {
display: 'block',
verticalAlign: 'middle',
maxWidth: '100%',
height: 'auto',
variants: {
radius: {
full: {
borderRadius: '100%',
},
},
fit: {
contain: {
objectFit: 'contain',
},
cover: {
objectFit: 'cover',
},
fill: {
objectFit: 'fill',
},
none: {
objectFit: 'none',
},
},
},
})

View File

@ -0,0 +1,2 @@
export type { ItemProps, TriggerItemProps } from './menu'
export { Content, Item, Separator, TriggerItem } from './menu'

View File

@ -0,0 +1,106 @@
import React, { cloneElement } from 'react'
import { ChevronRightIcon } from '~/src/icons/chevron-right-icon'
import { styled, theme } from '~/src/styles/config'
import { Box } from '../box'
import { Icon } from '../icon'
const Content = styled('div', {
minWidth: 176,
padding: '8px 0',
background: theme.colors.white,
borderRadius: theme.radii[8],
boxShadow:
'0px 2px 4px rgba(0, 34, 51, 0.16), 0px 4px 12px rgba(0, 34, 51, 0.08)',
})
interface ItemProps {
icon?: React.ReactElement
children: React.ReactNode
danger?: boolean
}
const Item = (props: ItemProps & { as: string | React.ComponentType }) => {
const { icon, children, ...itemProps } = props
return (
<ItemBase {...itemProps}>
{icon && (
<Box css={{ width: 16, height: 16 }}>
<Icon hidden>{cloneElement(icon, { width: 16, height: 16 })}</Icon>
</Box>
)}
{children}
</ItemBase>
)
}
const ItemBase = styled('div', {
all: 'unset',
height: 34,
fontSize: 13,
lineHeight: 1,
color: '#000',
display: 'flex',
alignItems: 'center',
gap: 6,
padding: '4px 12px 4px 14px',
position: 'relative',
userSelect: 'none',
whiteSpace: 'nowrap',
'&:focus, &[aria-expanded="true"]': {
backgroundColor: '#EEF2F5',
},
'&[data-disabled]': {
pointerEvents: 'none',
},
svg: {
color: '#4360DF',
},
variants: {
danger: {
true: {
color: '#FF2D55',
svg: {
color: '#FF2D55',
},
},
},
},
})
type TriggerItemProps = ItemProps
const TriggerItem = (
props: ItemProps & { as: string | React.ComponentType }
) => {
const { children, ...itemProps } = props
return (
<Item {...itemProps}>
{children}
<TriggerItemIcon>
<ChevronRightIcon />
</TriggerItemIcon>
</Item>
)
}
const TriggerItemIcon = styled('div', {
marginLeft: 'auto',
paddingLeft: 20,
})
const Separator = styled('div', {
height: 1,
background: '#F0F2F5',
margin: '5px 0',
})
export { Content, Item, Separator, TriggerItem }
export type { ItemProps, TriggerItemProps }

View File

@ -0,0 +1,2 @@
export type { TextInputProps } from './text-input'
export { TextInput } from './text-input'

View File

@ -0,0 +1,23 @@
import { styled } from '~/src/styles/config'
export const Base = styled('input', {
fontFamily: '$sans',
lineHeight: 1.2,
fontSize: '15px',
padding: '10px 16px',
background: '#EEF2F5',
borderRadius: 8,
height: 44,
width: '100%',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
'&::placeholder': {
color: '#939BA1',
},
'&:focus': {
boxShadow: `0 0 0 2px blue`,
},
})

View File

@ -0,0 +1,5 @@
# TextInput
```tsx
import { TextInput } from '@status-im/components'
```

View File

@ -0,0 +1,41 @@
import React, { forwardRef } from 'react'
import { Box } from '../box'
import { Base } from './styles'
import type { Ref } from 'react'
type InputProps = React.InputHTMLAttributes<HTMLInputElement>
interface Props {
id?: string
name?: string
type?: InputProps['type']
value?: string
defaultValue?: string
onChange?: InputProps['onChange']
onBlur?: InputProps['onBlur']
disabled?: boolean
readOnly?: boolean
required?: boolean
invalid?: boolean
autoFocus?: boolean
maxLength?: number
minLength?: number
placeholder?: string
inputMode?: InputProps['inputMode']
autoComplete?: string // https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefautocomplete
}
const TextInput = (props: Props, ref: Ref<HTMLInputElement>) => {
return (
<Box>
<Base ref={ref} {...props} />
</Box>
)
}
const _TextInput = forwardRef(TextInput)
export { _TextInput as TextInput }
export type { Props as TextInputProps }

View File

@ -0,0 +1,2 @@
export type { TextProps } from './text'
export { Text } from './text'

View File

@ -0,0 +1,5 @@
# Text
```tsx
import { Text } from '@status-im/components'
```

View File

@ -0,0 +1,79 @@
import { styled, theme } from '~/src/styles/config'
import type React from 'react'
const Text = styled('div', {
fontFamily: theme.fonts.sans,
variants: {
size: {
'10': {
fontSize: '10px',
},
'12': {
fontSize: '12px',
},
'14': {
fontSize: '14px',
},
},
color: {
gray: {
color: '#939BA1',
},
},
weight: {
'400': {
fontWeight: theme.fontWeights[400],
},
'500': {
fontWeight: theme.fontWeights[500],
},
'600': {
fontWeight: theme.fontWeights[600],
},
},
align: {
left: {
textAlign: 'left',
},
right: {
textAlign: 'right',
},
center: {
textAlign: 'center',
},
},
transform: {
uppercase: {
textTransform: 'uppercase',
},
lowercase: {
textTransform: 'lowercase',
},
capitalize: {
textTransform: 'capitalize',
},
},
truncate: {
true: {
whiteSpace: 'nowrap',
overflow: 'hidden',
textOverflow: 'ellipsis',
// minWidth: 0,
// maxWidth: '100%',
flex: 1,
},
},
},
defaultVariants: {
align: 'left',
weight: '400',
},
// compoundVariants: {},
})
export { Text }
export type TextProps = React.ComponentProps<typeof Text>

View File

@ -0,0 +1,2 @@
export type { TooltipProps } from './tooltip'
export { Tooltip } from './tooltip'

View File

@ -0,0 +1,62 @@
import * as Primitive from '@radix-ui/react-tooltip'
import { keyframes, styled, theme } from '~/src/styles/config'
export const slideUpAndFade = keyframes({
'0%': { opacity: 0, transform: 'translateY(2px)' },
'100%': { opacity: 1, transform: 'translateY(0)' },
})
export const slideRightAndFade = keyframes({
'0%': { opacity: 0, transform: 'translateX(-2px)' },
'100%': { opacity: 1, transform: 'translateX(0)' },
})
export const slideDownAndFade = keyframes({
'0%': { opacity: 0, transform: 'translateY(-2px)' },
'100%': { opacity: 1, transform: 'translateY(0)' },
})
export const slideLeftAndFade = keyframes({
'0%': { opacity: 0, transform: 'translateX(2px)' },
'100%': { opacity: 1, transform: 'translateX(0)' },
})
export const Content = styled(Primitive.Content, {
fontFamily: theme.fonts.sans,
fontSize: 13,
padding: 8,
lineHeight: 1,
backgroundColor: '#000',
color: '#fff',
borderRadius: 8,
'@media (prefers-reduced-motion: no-preference)': {
animationDuration: '400ms',
animationTimingFunction: 'cubic-bezier(0.16, 1, 0.3, 1)',
animationFillMode: 'forwards',
willChange: 'transform, opacity',
'&[data-state="delayed-open"]': {
'&[data-side="top"]': {
animationName: slideDownAndFade,
},
'&[data-side="right"]': {
animationName: slideLeftAndFade,
},
'&[data-side="bottom"]': {
animationName: slideUpAndFade,
},
'&[data-side="left"]': {
animationName: slideRightAndFade,
},
},
},
})
export const Arrow = styled(Primitive.Arrow, {
fill: '#000',
})

View File

@ -0,0 +1,5 @@
# Tooltip
```tsx
import { Tooltip } from '@status-im/components'
```

View File

@ -0,0 +1,31 @@
import React from 'react'
import * as Primitive from '@radix-ui/react-tooltip'
import { Arrow, Content } from './styles'
import type { TooltipContentProps } from '@radix-ui/react-tooltip'
interface Props {
label: string
children: React.ReactNode
side?: TooltipContentProps['side']
sideOffset?: TooltipContentProps['sideOffset']
}
const Tooltip = (props: Props) => {
const { children, label, side = 'top', sideOffset = 5 } = props
return (
<Primitive.Root delayDuration={500}>
<Primitive.Trigger asChild>{children}</Primitive.Trigger>
<Content side={side} sideOffset={sideOffset}>
{label}
<Arrow />
</Content>
</Primitive.Root>
)
}
export { Tooltip }
export type { Props as TooltipProps }

View File

@ -0,0 +1,2 @@
export type { VisuallyHiddenProps } from './visually-hidden'
export { VisuallyHidden } from './visually-hidden'

View File

@ -0,0 +1,5 @@
# VisuallyHidden
```tsx
import { VisuallyHidden } from '@status-im/components'
```

View File

@ -0,0 +1,16 @@
import React from 'react'
import { Root } from '@radix-ui/react-visually-hidden'
type Props = {
children: React.ReactNode
}
const VisuallyHidden = (props: Props) => {
const { children } = props
return <Root>{children}</Root>
}
export { VisuallyHidden }
export type { Props as VisuallyHiddenProps }

652
yarn.lock
View File

@ -2,73 +2,13 @@
# yarn lockfile v1 # yarn lockfile v1
"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.16.7": "@babel/code-frame@^7.0.0":
version "7.16.7" version "7.16.7"
resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.16.7.tgz#44416b6bd7624b998f5b1af5d470856c40138789" resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.16.7.tgz#44416b6bd7624b998f5b1af5d470856c40138789"
integrity sha512-iAXqUn8IIeBTNd72xsFlgaXHkMBMt6y4HJp1tIaK465CWLT/fG1aqB7ykr95gHHmlBdGbFeWWfyB4NJJ0nmeIg== integrity sha512-iAXqUn8IIeBTNd72xsFlgaXHkMBMt6y4HJp1tIaK465CWLT/fG1aqB7ykr95gHHmlBdGbFeWWfyB4NJJ0nmeIg==
dependencies: dependencies:
"@babel/highlight" "^7.16.7" "@babel/highlight" "^7.16.7"
"@babel/generator@^7.17.3":
version "7.17.3"
resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.17.3.tgz#a2c30b0c4f89858cb87050c3ffdfd36bdf443200"
integrity sha512-+R6Dctil/MgUsZsZAkYgK+ADNSZzJRRy0TvY65T71z/CR854xHQ1EweBYXdfT+HNeN7w0cSJJEzgxZMv40pxsg==
dependencies:
"@babel/types" "^7.17.0"
jsesc "^2.5.1"
source-map "^0.5.0"
"@babel/helper-annotate-as-pure@^7.16.0":
version "7.16.7"
resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.16.7.tgz#bb2339a7534a9c128e3102024c60760a3a7f3862"
integrity sha512-s6t2w/IPQVTAET1HitoowRGXooX8mCgtuP5195wD/QJPV6wYjpujCGF7JuMODVX2ZAJOf1GT6DT9MHEZvLOFSw==
dependencies:
"@babel/types" "^7.16.7"
"@babel/helper-environment-visitor@^7.16.7":
version "7.16.7"
resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.16.7.tgz#ff484094a839bde9d89cd63cba017d7aae80ecd7"
integrity sha512-SLLb0AAn6PkUeAfKJCCOl9e1R53pQlGAfc4y4XuMRZfqeMYLE0dM1LMhqbGAlGQY0lfw5/ohoYWAe9V1yibRag==
dependencies:
"@babel/types" "^7.16.7"
"@babel/helper-function-name@^7.16.7":
version "7.16.7"
resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.16.7.tgz#f1ec51551fb1c8956bc8dd95f38523b6cf375f8f"
integrity sha512-QfDfEnIUyyBSR3HtrtGECuZ6DAyCkYFp7GHl75vFtTnn6pjKeK0T1DB5lLkFvBea8MdaiUABx3osbgLyInoejA==
dependencies:
"@babel/helper-get-function-arity" "^7.16.7"
"@babel/template" "^7.16.7"
"@babel/types" "^7.16.7"
"@babel/helper-get-function-arity@^7.16.7":
version "7.16.7"
resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.16.7.tgz#ea08ac753117a669f1508ba06ebcc49156387419"
integrity sha512-flc+RLSOBXzNzVhcLu6ujeHUrD6tANAOU5ojrRx/as+tbzf8+stUCj7+IfRRoAbEZqj/ahXEMsjhOhgeZsrnTw==
dependencies:
"@babel/types" "^7.16.7"
"@babel/helper-hoist-variables@^7.16.7":
version "7.16.7"
resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.16.7.tgz#86bcb19a77a509c7b77d0e22323ef588fa58c246"
integrity sha512-m04d/0Op34H5v7pbZw6pSKP7weA6lsMvfiIAMeIvkY/R4xQtBSMFEigu9QTZ2qB/9l22vsxtM8a+Q8CzD255fg==
dependencies:
"@babel/types" "^7.16.7"
"@babel/helper-module-imports@^7.0.0", "@babel/helper-module-imports@^7.16.0":
version "7.16.7"
resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.16.7.tgz#25612a8091a999704461c8a222d0efec5d091437"
integrity sha512-LVtS6TqjJHFc+nYeITRo6VLXve70xmq7wPhWTqDJusJEgGmkAACWwMiTNrvfoQo6hEhFwAIixNkvB0jPXDL8Wg==
dependencies:
"@babel/types" "^7.16.7"
"@babel/helper-split-export-declaration@^7.16.7":
version "7.16.7"
resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.16.7.tgz#0b648c0c42da9d3920d85ad585f2778620b8726b"
integrity sha512-xbWoy/PFoxSWazIToT9Sif+jJTlrMcndIsaOKvTA6u7QEo7ilkRZpjew18/W3c7nm8fXdUDXh02VXTbZ0pGDNw==
dependencies:
"@babel/types" "^7.16.7"
"@babel/helper-validator-identifier@^7.16.7": "@babel/helper-validator-identifier@^7.16.7":
version "7.16.7" version "7.16.7"
resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.16.7.tgz#e8c602438c4a8195751243da9031d1607d247cad" resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.16.7.tgz#e8c602438c4a8195751243da9031d1607d247cad"
@ -83,11 +23,6 @@
chalk "^2.0.0" chalk "^2.0.0"
js-tokens "^4.0.0" js-tokens "^4.0.0"
"@babel/parser@^7.16.7", "@babel/parser@^7.17.3":
version "7.17.3"
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.3.tgz#b07702b982990bf6fdc1da5049a23fece4c5c3d0"
integrity sha512-7yJPvPV+ESz2IUTPbOL+YkIGyCqOyNIzdguKQuJGnH7bg1WTIifuM21YqokFt/THWh1AkCRn9IgoykTRCBVpzA==
"@babel/runtime-corejs3@^7.10.2": "@babel/runtime-corejs3@^7.10.2":
version "7.17.2" version "7.17.2"
resolved "https://registry.yarnpkg.com/@babel/runtime-corejs3/-/runtime-corejs3-7.17.2.tgz#fdca2cd05fba63388babe85d349b6801b008fd13" resolved "https://registry.yarnpkg.com/@babel/runtime-corejs3/-/runtime-corejs3-7.17.2.tgz#fdca2cd05fba63388babe85d349b6801b008fd13"
@ -103,38 +38,12 @@
dependencies: dependencies:
regenerator-runtime "^0.13.4" regenerator-runtime "^0.13.4"
"@babel/template@^7.16.7": "@babel/runtime@^7.13.10":
version "7.16.7" version "7.17.7"
resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.16.7.tgz#8d126c8701fde4d66b264b3eba3d96f07666d155" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.7.tgz#a5f3328dc41ff39d803f311cfe17703418cf9825"
integrity sha512-I8j/x8kHUrbYRTUxXrrMbfCa7jxkE7tZre39x3kjr9hvI82cK1FfqLygotcWN5kdPGWcLdWMHpSBavse5tWw3w== integrity sha512-L6rvG9GDxaLgFjg41K+5Yv9OMrU98sWe+Ykmc6FDJW/+vYZMhdOMKkISgzptMaERHvS2Y2lw9MDRm2gHhlQQoA==
dependencies: dependencies:
"@babel/code-frame" "^7.16.7" regenerator-runtime "^0.13.4"
"@babel/parser" "^7.16.7"
"@babel/types" "^7.16.7"
"@babel/traverse@^7.4.5":
version "7.17.3"
resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.17.3.tgz#0ae0f15b27d9a92ba1f2263358ea7c4e7db47b57"
integrity sha512-5irClVky7TxRWIRtxlh2WPUUOLhcPN06AGgaQSB8AEwuyEBgJVuJ5imdHm5zxk8w0QS5T+tDfnDxAlhWjpb7cw==
dependencies:
"@babel/code-frame" "^7.16.7"
"@babel/generator" "^7.17.3"
"@babel/helper-environment-visitor" "^7.16.7"
"@babel/helper-function-name" "^7.16.7"
"@babel/helper-hoist-variables" "^7.16.7"
"@babel/helper-split-export-declaration" "^7.16.7"
"@babel/parser" "^7.17.3"
"@babel/types" "^7.17.0"
debug "^4.1.0"
globals "^11.1.0"
"@babel/types@^7.16.7", "@babel/types@^7.17.0":
version "7.17.0"
resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.17.0.tgz#a826e368bccb6b3d84acd76acad5c0d87342390b"
integrity sha512-TmKSNO4D5rzhL5bjWFcVHHLETzfQ/AmbKpKPOSjlP0WoHZ6L911fgoOKY4Alp/emzG4cHJdyN49zpgkbXFEHHw==
dependencies:
"@babel/helper-validator-identifier" "^7.16.7"
to-fast-properties "^2.0.0"
"@chainsafe/libp2p-noise@^5.0.0": "@chainsafe/libp2p-noise@^5.0.0":
version "5.0.2" version "5.0.2"
@ -168,28 +77,6 @@
dependencies: dependencies:
"@cspotcode/source-map-consumer" "0.8.0" "@cspotcode/source-map-consumer" "0.8.0"
"@emotion/is-prop-valid@^0.8.8":
version "0.8.8"
resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz#db28b1c4368a259b60a97311d6a952d4fd01ac1a"
integrity sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==
dependencies:
"@emotion/memoize" "0.7.4"
"@emotion/memoize@0.7.4":
version "0.7.4"
resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.4.tgz#19bf0f5af19149111c40d98bb0cf82119f5d9eeb"
integrity sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==
"@emotion/stylis@^0.8.4":
version "0.8.5"
resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.8.5.tgz#deacb389bd6ee77d1e7fcaccce9e16c5c7e78e04"
integrity sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==
"@emotion/unitless@^0.7.4":
version "0.7.5"
resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.5.tgz#77211291c1900a700b8a78cfafda3160d76949ed"
integrity sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==
"@eslint/eslintrc@^1.1.0": "@eslint/eslintrc@^1.1.0":
version "1.1.0" version "1.1.0"
resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-1.1.0.tgz#583d12dbec5d4f22f333f9669f7d0b7c7815b4d3" resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-1.1.0.tgz#583d12dbec5d4f22f333f9669f7d0b7c7815b4d3"
@ -924,6 +811,366 @@
resolved "https://registry.yarnpkg.com/@protobufjs/utf8/-/utf8-1.1.0.tgz#a777360b5b39a1a2e5106f8e858f2fd2d060c570" resolved "https://registry.yarnpkg.com/@protobufjs/utf8/-/utf8-1.1.0.tgz#a777360b5b39a1a2e5106f8e858f2fd2d060c570"
integrity sha1-p3c2C1s5oaLlEG+OhY8v0tBgxXA= integrity sha1-p3c2C1s5oaLlEG+OhY8v0tBgxXA=
"@radix-ui/popper@0.1.0":
version "0.1.0"
resolved "https://registry.yarnpkg.com/@radix-ui/popper/-/popper-0.1.0.tgz#c387a38f31b7799e1ea0d2bb1ca0c91c2931b063"
integrity sha512-uzYeElL3w7SeNMuQpXiFlBhTT+JyaNMCwDfjKkrzugEcYrf5n52PHqncNdQPUtR42hJh8V9FsqyEDbDxkeNjJQ==
dependencies:
"@babel/runtime" "^7.13.10"
csstype "^3.0.4"
"@radix-ui/primitive@0.1.0":
version "0.1.0"
resolved "https://registry.yarnpkg.com/@radix-ui/primitive/-/primitive-0.1.0.tgz#6206b97d379994f0d1929809db035733b337e543"
integrity sha512-tqxZKybwN5Fa3VzZry4G6mXAAb9aAqKmPtnVbZpL0vsBwvOHTBwsjHVPXylocYLwEtBY9SCe665bYnNB515uoA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-accessible-icon@^0.1.4":
version "0.1.4"
resolved "https://registry.yarnpkg.com/@radix-ui/react-accessible-icon/-/react-accessible-icon-0.1.4.tgz#bdbf1e3226a0e9e7778b68728b175bdc532b720c"
integrity sha512-H9lZtGTDS9XtoQK41pSq9Meb2fI+cLqZJTj1FxusRd7NviWbDAvytVXZE2XI5OOSFHi6C4wpOghBUQym3EJacQ==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-visually-hidden" "0.1.4"
"@radix-ui/react-alert-dialog@^0.1.7":
version "0.1.7"
resolved "https://registry.yarnpkg.com/@radix-ui/react-alert-dialog/-/react-alert-dialog-0.1.7.tgz#2b9379d848323f5370a8b3928dd6e5ce95f8bd34"
integrity sha512-b0+TWr0VRWMWM7QcXvvcwbMGNzpTmvPBSBpYcoaD+QnVo3jdJt0k0bghwbYBuywzdyuRNUFf33xwah/57w09QA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/primitive" "0.1.0"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-context" "0.1.1"
"@radix-ui/react-dialog" "0.1.7"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-slot" "0.1.2"
"@radix-ui/react-arrow@0.1.4":
version "0.1.4"
resolved "https://registry.yarnpkg.com/@radix-ui/react-arrow/-/react-arrow-0.1.4.tgz#a871448a418cd3507d83840fdd47558cb961672b"
integrity sha512-BB6XzAb7Ml7+wwpFdYVtZpK1BlMgqyafSQNGzhIpSZ4uXvXOHPlR5GP8M449JkeQzgQjv9Mp1AsJxFC0KuOtuA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-collapsible@^0.1.6":
version "0.1.6"
resolved "https://registry.yarnpkg.com/@radix-ui/react-collapsible/-/react-collapsible-0.1.6.tgz#3eeadac476761b3c9b8dd91e8a32eb1a547e5a06"
integrity sha512-Gkf8VuqMc6HTLzA2AxVYnyK6aMczVLpatCjdD9Lj4wlYLXCz9KtiqZYslLMeqnQFLwLyZS0WKX/pQ8j5fioIBw==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/primitive" "0.1.0"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-context" "0.1.1"
"@radix-ui/react-id" "0.1.5"
"@radix-ui/react-presence" "0.1.2"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-use-controllable-state" "0.1.0"
"@radix-ui/react-use-layout-effect" "0.1.0"
"@radix-ui/react-collection@0.1.4":
version "0.1.4"
resolved "https://registry.yarnpkg.com/@radix-ui/react-collection/-/react-collection-0.1.4.tgz#734061ffd5bb93e88889d49b87391a73a63824c9"
integrity sha512-3muGI15IdgaDFjOcO7xX8a35HQRBRF6LH9pS6UCeZeRmbslkVeHyJRQr2rzICBUoX7zgIA0kXyMDbpQnJGyJTA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-context" "0.1.1"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-slot" "0.1.2"
"@radix-ui/react-compose-refs@0.1.0":
version "0.1.0"
resolved "https://registry.yarnpkg.com/@radix-ui/react-compose-refs/-/react-compose-refs-0.1.0.tgz#cff6e780a0f73778b976acff2c2a5b6551caab95"
integrity sha512-eyclbh+b77k+69Dk72q3694OHrn9B3QsoIRx7ywX341U9RK1ThgQjMFZoPtmZNQTksXHLNEiefR8hGVeFyInGg==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-context-menu@^0.1.6":
version "0.1.6"
resolved "https://registry.yarnpkg.com/@radix-ui/react-context-menu/-/react-context-menu-0.1.6.tgz#0c75f2faffec6c8697247a4b685a432b3c4d07f0"
integrity sha512-0qa6ABaeqD+WYI+8iT0jH0QLLcV8Kv0xI+mZL4FFnG4ec9H0v+yngb5cfBBfs9e/KM8mDzFFpaeegqsQlLNqyQ==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/primitive" "0.1.0"
"@radix-ui/react-context" "0.1.1"
"@radix-ui/react-menu" "0.1.6"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-use-callback-ref" "0.1.0"
"@radix-ui/react-context@0.1.1":
version "0.1.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-0.1.1.tgz#06996829ea124d9a1bc1dbe3e51f33588fab0875"
integrity sha512-PkyVX1JsLBioeu0jB9WvRpDBBLtLZohVDT3BB5CTSJqActma8S8030P57mWZb4baZifMvN7KKWPAA40UmWKkQg==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-dialog@0.1.7", "@radix-ui/react-dialog@^0.1.7":
version "0.1.7"
resolved "https://registry.yarnpkg.com/@radix-ui/react-dialog/-/react-dialog-0.1.7.tgz#285414cf66f5bbf42bc9935314e0381abe01e7d0"
integrity sha512-jXt8srGhHBRvEr9jhEAiwwJzWCWZoGRJ030aC9ja/gkRJbZdy0iD3FwXf+Ff4RtsZyLUMHW7VUwFOlz3Ixe1Vw==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/primitive" "0.1.0"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-context" "0.1.1"
"@radix-ui/react-dismissable-layer" "0.1.5"
"@radix-ui/react-focus-guards" "0.1.0"
"@radix-ui/react-focus-scope" "0.1.4"
"@radix-ui/react-id" "0.1.5"
"@radix-ui/react-portal" "0.1.4"
"@radix-ui/react-presence" "0.1.2"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-slot" "0.1.2"
"@radix-ui/react-use-controllable-state" "0.1.0"
aria-hidden "^1.1.1"
react-remove-scroll "^2.4.0"
"@radix-ui/react-dismissable-layer@0.1.5":
version "0.1.5"
resolved "https://registry.yarnpkg.com/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-0.1.5.tgz#9379032351e79028d472733a5cc8ba4a0ea43314"
integrity sha512-J+fYWijkX4M4QKwf9dtu1oC0U6e6CEl8WhBp3Ad23yz2Hia0XCo6Pk/mp5CAFy4QBtQedTSkhW05AdtSOEoajQ==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/primitive" "0.1.0"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-use-body-pointer-events" "0.1.1"
"@radix-ui/react-use-callback-ref" "0.1.0"
"@radix-ui/react-use-escape-keydown" "0.1.0"
"@radix-ui/react-dropdown-menu@^0.1.6":
version "0.1.6"
resolved "https://registry.yarnpkg.com/@radix-ui/react-dropdown-menu/-/react-dropdown-menu-0.1.6.tgz#3203229788cd57e552c9f19dcc7008e2b545919c"
integrity sha512-RZhtzjWwJ4ZBN7D8ek4Zn+ilHzYuYta9yIxFnbC0pfqMnSi67IQNONo1tuuNqtFh9SRHacPKc65zo+kBBlxtdg==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/primitive" "0.1.0"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-context" "0.1.1"
"@radix-ui/react-id" "0.1.5"
"@radix-ui/react-menu" "0.1.6"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-use-controllable-state" "0.1.0"
"@radix-ui/react-focus-guards@0.1.0":
version "0.1.0"
resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-guards/-/react-focus-guards-0.1.0.tgz#ba3b6f902cba7826569f8edc21ff8223dece7def"
integrity sha512-kRx/swAjEfBpQ3ns7J3H4uxpXuWCqN7MpALiSDOXiyo2vkWv0L9sxvbpZeTulINuE3CGMzicVMuNc/VWXjFKOg==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-focus-scope@0.1.4":
version "0.1.4"
resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-scope/-/react-focus-scope-0.1.4.tgz#c830724e212d42ffaaa81aee49533213d09b47df"
integrity sha512-fbA4ES3H4Wkxp+OeLhvN6SwL7mXNn/aBtUf7DRYxY9+Akrf7dRxl2ck4lgcpPsSg3zSDsEwLcY+h5cmj5yvlug==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-use-callback-ref" "0.1.0"
"@radix-ui/react-id@0.1.5":
version "0.1.5"
resolved "https://registry.yarnpkg.com/@radix-ui/react-id/-/react-id-0.1.5.tgz#010d311bedd5a2884c1e9bb6aaaa4e6cc1d1d3b8"
integrity sha512-IPc4H/63bes0IZ1GJJozSEkSWcDyhNGtKFWUpJ+XtaLyQ1X3x7Mf6fWwWhDcpqlYEP+5WtAvfqcyEsyjP+ZhBQ==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-layout-effect" "0.1.0"
"@radix-ui/react-menu@0.1.6":
version "0.1.6"
resolved "https://registry.yarnpkg.com/@radix-ui/react-menu/-/react-menu-0.1.6.tgz#7f9521a10f6a9cd819b33b33d5ed9538d79b2e75"
integrity sha512-ho3+bhpr3oAFkOBJ8VkUb1BcGoiZBB3OmcWPqa6i5RTUKrzNX/d6rauochu2xDlWjiRtpVuiAcsTVOeIC4FbYQ==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/primitive" "0.1.0"
"@radix-ui/react-collection" "0.1.4"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-context" "0.1.1"
"@radix-ui/react-dismissable-layer" "0.1.5"
"@radix-ui/react-focus-guards" "0.1.0"
"@radix-ui/react-focus-scope" "0.1.4"
"@radix-ui/react-id" "0.1.5"
"@radix-ui/react-popper" "0.1.4"
"@radix-ui/react-portal" "0.1.4"
"@radix-ui/react-presence" "0.1.2"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-roving-focus" "0.1.5"
"@radix-ui/react-use-callback-ref" "0.1.0"
"@radix-ui/react-use-direction" "0.1.0"
aria-hidden "^1.1.1"
react-remove-scroll "^2.4.0"
"@radix-ui/react-popper@0.1.4":
version "0.1.4"
resolved "https://registry.yarnpkg.com/@radix-ui/react-popper/-/react-popper-0.1.4.tgz#dfc055dcd7dfae6a2eff7a70d333141d15a5d029"
integrity sha512-18gDYof97t8UQa7zwklG1Dr8jIdj3u+rVOQLzPi9f5i1YQak/pVGkaqw8aY+iDUknKKuZniTk/7jbAJUYlKyOw==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/popper" "0.1.0"
"@radix-ui/react-arrow" "0.1.4"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-context" "0.1.1"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-use-rect" "0.1.1"
"@radix-ui/react-use-size" "0.1.1"
"@radix-ui/rect" "0.1.1"
"@radix-ui/react-portal@0.1.4":
version "0.1.4"
resolved "https://registry.yarnpkg.com/@radix-ui/react-portal/-/react-portal-0.1.4.tgz#17bdce3d7f1a9a0b35cb5e935ab8bc562441a7d2"
integrity sha512-MO0wRy2eYRTZ/CyOri9NANCAtAtq89DEtg90gicaTlkCfdqCLEBsLb+/q66BZQTr3xX/Vq01nnVfc/TkCqoqvw==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-use-layout-effect" "0.1.0"
"@radix-ui/react-presence@0.1.2":
version "0.1.2"
resolved "https://registry.yarnpkg.com/@radix-ui/react-presence/-/react-presence-0.1.2.tgz#9f11cce3df73cf65bc348e8b76d891f0d54c1fe3"
integrity sha512-3BRlFZraooIUfRlyN+b/Xs5hq1lanOOo/+3h6Pwu2GMFjkGKKa4Rd51fcqGqnVlbr3jYg+WLuGyAV4KlgqwrQw==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-use-layout-effect" "0.1.0"
"@radix-ui/react-primitive@0.1.4":
version "0.1.4"
resolved "https://registry.yarnpkg.com/@radix-ui/react-primitive/-/react-primitive-0.1.4.tgz#6c233cf08b0cb87fecd107e9efecb3f21861edc1"
integrity sha512-6gSl2IidySupIMJFjYnDIkIWRyQdbu/AHK7rbICPani+LW4b0XdxBXc46og/iZvuwW8pjCS8I2SadIerv84xYA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-slot" "0.1.2"
"@radix-ui/react-roving-focus@0.1.5":
version "0.1.5"
resolved "https://registry.yarnpkg.com/@radix-ui/react-roving-focus/-/react-roving-focus-0.1.5.tgz#cc48d17a36b56f253d54905b0fd60ee134cb97ee"
integrity sha512-ClwKPS5JZE+PaHCoW7eu1onvE61pDv4kO8W4t5Ra3qMFQiTJLZMdpBQUhksN//DaVygoLirz4Samdr5Y1x1FSA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/primitive" "0.1.0"
"@radix-ui/react-collection" "0.1.4"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-context" "0.1.1"
"@radix-ui/react-id" "0.1.5"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-use-callback-ref" "0.1.0"
"@radix-ui/react-use-controllable-state" "0.1.0"
"@radix-ui/react-slot@0.1.2":
version "0.1.2"
resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-0.1.2.tgz#e6f7ad9caa8ce81cc8d532c854c56f9b8b6307c8"
integrity sha512-ADkqfL+agEzEguU3yS26jfB50hRrwf7U4VTwAOZEmi/g+ITcBWe12yM46ueS/UCIMI9Py+gFUaAdxgxafFvY2Q==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-tooltip@^0.1.7":
version "0.1.7"
resolved "https://registry.yarnpkg.com/@radix-ui/react-tooltip/-/react-tooltip-0.1.7.tgz#6f8c00d6e489565d14abf209ce0fb8853c8c8ee3"
integrity sha512-eiBUsVOHenZ0JR16tl970bB0DafJBz6mFgSGfIGIVpflFj0LIsIDiLMsYyvYdx1KwwsIUDTEZtxcPm/sWjPzqA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/primitive" "0.1.0"
"@radix-ui/react-compose-refs" "0.1.0"
"@radix-ui/react-context" "0.1.1"
"@radix-ui/react-id" "0.1.5"
"@radix-ui/react-popper" "0.1.4"
"@radix-ui/react-portal" "0.1.4"
"@radix-ui/react-presence" "0.1.2"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/react-slot" "0.1.2"
"@radix-ui/react-use-controllable-state" "0.1.0"
"@radix-ui/react-use-escape-keydown" "0.1.0"
"@radix-ui/react-use-previous" "0.1.1"
"@radix-ui/react-use-rect" "0.1.1"
"@radix-ui/react-visually-hidden" "0.1.4"
"@radix-ui/react-use-body-pointer-events@0.1.1":
version "0.1.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-body-pointer-events/-/react-use-body-pointer-events-0.1.1.tgz#63e7fd81ca7ffd30841deb584cd2b7f460df2597"
integrity sha512-R8leV2AWmJokTmERM8cMXFHWSiv/fzOLhG/JLmRBhLTAzOj37EQizssq4oW0Z29VcZy2tODMi9Pk/htxwb+xpA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-layout-effect" "0.1.0"
"@radix-ui/react-use-callback-ref@0.1.0":
version "0.1.0"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-0.1.0.tgz#934b6e123330f5b3a6b116460e6662cbc663493f"
integrity sha512-Va041McOFFl+aV+sejvl0BS2aeHx86ND9X/rVFmEFQKTXCp6xgUK0NGUAGcgBlIjnJSbMYPGEk1xKSSlVcN2Aw==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-controllable-state@0.1.0":
version "0.1.0"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-0.1.0.tgz#4fced164acfc69a4e34fb9d193afdab973a55de1"
integrity sha512-zv7CX/PgsRl46a52Tl45TwqwVJdmqnlQEQhaYMz/yBOD2sx2gCkCFSoF/z9mpnYWmS6DTLNTg5lIps3fV6EnXg==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-callback-ref" "0.1.0"
"@radix-ui/react-use-direction@0.1.0":
version "0.1.0"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-direction/-/react-use-direction-0.1.0.tgz#97ac1d52e497c974389e7988f809238ed72e7df7"
integrity sha512-NajpY/An9TCPSfOVkgWIdXJV+VuWl67PxB6kOKYmtNAFHvObzIoh8o0n9sAuwSAyFCZVq211FEf9gvVDRhOyiA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-escape-keydown@0.1.0":
version "0.1.0"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-0.1.0.tgz#dc80cb3753e9d1bd992adbad9a149fb6ea941874"
integrity sha512-tDLZbTGFmvXaazUXXv8kYbiCcbAE8yKgng9s95d8fCO+Eundv0Jngbn/hKPhDDs4jj9ChwRX5cDDnlaN+ugYYQ==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-callback-ref" "0.1.0"
"@radix-ui/react-use-layout-effect@0.1.0":
version "0.1.0"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-0.1.0.tgz#ebf71bd6d2825de8f1fbb984abf2293823f0f223"
integrity sha512-+wdeS51Y+E1q1Wmd+1xSSbesZkpVj4jsg0BojCbopWvgq5iBvixw5vgemscdh58ep98BwUbsFYnrywFhV9yrVg==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-previous@0.1.1":
version "0.1.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-previous/-/react-use-previous-0.1.1.tgz#0226017f72267200f6e832a7103760e96a6db5d0"
integrity sha512-O/ZgrDBr11dR8rhO59ED8s5zIXBRFi8MiS+CmFGfi7MJYdLbfqVOmQU90Ghf87aifEgWe6380LA69KBneaShAg==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-rect@0.1.1":
version "0.1.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-rect/-/react-use-rect-0.1.1.tgz#6c15384beee59c086e75b89a7e66f3d2e583a856"
integrity sha512-kHNNXAsP3/PeszEmM/nxBBS9Jbo93sO+xuMTcRfwzXsmxT5gDXQzAiKbZQ0EecCPtJIzqvr7dlaQi/aP1PKYqQ==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/rect" "0.1.1"
"@radix-ui/react-use-size@0.1.1":
version "0.1.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-size/-/react-use-size-0.1.1.tgz#f6b75272a5d41c3089ca78c8a2e48e5f204ef90f"
integrity sha512-pTgWM5qKBu6C7kfKxrKPoBI2zZYZmp2cSXzpUiGM3qEBQlMLtYhaY2JXdXUCxz+XmD1YEjc8oRwvyfsD4AG4WA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-visually-hidden@0.1.4", "@radix-ui/react-visually-hidden@^0.1.4":
version "0.1.4"
resolved "https://registry.yarnpkg.com/@radix-ui/react-visually-hidden/-/react-visually-hidden-0.1.4.tgz#6c75eae34fb5d084b503506fbfc05587ced05f03"
integrity sha512-K/q6AEEzqeeEq/T0NPChvBqnwlp8Tl4NnQdrI/y8IOY7BRR+Ug0PEsVk6g48HJ7cA1//COugdxXXVVK/m0X1mA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-primitive" "0.1.4"
"@radix-ui/rect@0.1.1":
version "0.1.1"
resolved "https://registry.yarnpkg.com/@radix-ui/rect/-/rect-0.1.1.tgz#95b5ba51f469bea6b1b841e2d427e17e37d38419"
integrity sha512-g3hnE/UcOg7REdewduRPAK88EPuLZtaq7sA9ouu8S+YEtnyFRI16jgv6GZYe3VMoQLL1T171ebmEPtDjyxWLzw==
dependencies:
"@babel/runtime" "^7.13.10"
"@stablelib/aead@^1.0.1": "@stablelib/aead@^1.0.1":
version "1.0.1" version "1.0.1"
resolved "https://registry.yarnpkg.com/@stablelib/aead/-/aead-1.0.1.tgz#c4b1106df9c23d1b867eb9b276d8f42d5fc4c0c3" resolved "https://registry.yarnpkg.com/@stablelib/aead/-/aead-1.0.1.tgz#c4b1106df9c23d1b867eb9b276d8f42d5fc4c0c3"
@ -1040,6 +1287,11 @@
"@stablelib/random" "^1.0.1" "@stablelib/random" "^1.0.1"
"@stablelib/wipe" "^1.0.1" "@stablelib/wipe" "^1.0.1"
"@stitches/react@^1.2.7":
version "1.2.7"
resolved "https://registry.yarnpkg.com/@stitches/react/-/react-1.2.7.tgz#aea2403fac726db66d1740d29557e3910b1a1dc7"
integrity sha512-6AxpUag7OW55ANzRnuy7R15FEyQeZ66fytVo3BBilFIU0mfo3t49CAMcEAL/A1SbhSj/FCdWkn/XrbjGBTJTzg==
"@swc/helpers@^0.2.11": "@swc/helpers@^0.2.11":
version "0.2.14" version "0.2.14"
resolved "https://registry.yarnpkg.com/@swc/helpers/-/helpers-0.2.14.tgz#20288c3627442339dd3d743c944f7043ee3590f0" resolved "https://registry.yarnpkg.com/@swc/helpers/-/helpers-0.2.14.tgz#20288c3627442339dd3d743c944f7043ee3590f0"
@ -1477,6 +1729,13 @@ argparse@^2.0.1:
resolved "https://registry.yarnpkg.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38" resolved "https://registry.yarnpkg.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38"
integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q== integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
aria-hidden@^1.1.1:
version "1.1.3"
resolved "https://registry.yarnpkg.com/aria-hidden/-/aria-hidden-1.1.3.tgz#bb48de18dc84787a3c6eee113709c473c64ec254"
integrity sha512-RhVWFtKH5BiGMycI72q2RAFMLQi8JP9bLuQXgR5a8Znp7P5KOIADSJeyfI8PCVxLEp067B2HbP5JIiI/PXIZeA==
dependencies:
tslib "^1.0.0"
aria-query@^4.2.2: aria-query@^4.2.2:
version "4.2.2" version "4.2.2"
resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-4.2.2.tgz#0d2ca6c9aceb56b8977e9fed6aed7e15bbd2f83b" resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-4.2.2.tgz#0d2ca6c9aceb56b8977e9fed6aed7e15bbd2f83b"
@ -1601,22 +1860,6 @@ axobject-query@^2.2.0:
resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-2.2.0.tgz#943d47e10c0b704aa42275e20edf3722648989be" resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-2.2.0.tgz#943d47e10c0b704aa42275e20edf3722648989be"
integrity sha512-Td525n+iPOOyUQIeBfcASuG6uJsDOITl7Mds5gFyerkWiX7qhUTdYUBlSgNMyVqtSJqwpt1kXGLdUt6SykLMRA== integrity sha512-Td525n+iPOOyUQIeBfcASuG6uJsDOITl7Mds5gFyerkWiX7qhUTdYUBlSgNMyVqtSJqwpt1kXGLdUt6SykLMRA==
"babel-plugin-styled-components@>= 1.12.0":
version "2.0.4"
resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-2.0.4.tgz#2ee2574e4044f2e6dea443111aa2f3219271b181"
integrity sha512-qOQpu/f0cLzn6qUZ9BlIM693fMsBQt+QGbij0uHLd27FMzd2VMf0mBPr7r3CETzulXlNsHXVw5khzhnrvmPU/g==
dependencies:
"@babel/helper-annotate-as-pure" "^7.16.0"
"@babel/helper-module-imports" "^7.16.0"
babel-plugin-syntax-jsx "^6.18.0"
lodash "^4.17.11"
picomatch "^2.3.0"
babel-plugin-syntax-jsx@^6.18.0:
version "6.18.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
integrity sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=
balanced-match@^1.0.0: balanced-match@^1.0.0:
version "1.0.2" version "1.0.2"
resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee" resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
@ -1811,11 +2054,6 @@ camelcase@^6.0.0:
resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.3.0.tgz#5685b95eb209ac9c0c177467778c9c84df58ba9a" resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.3.0.tgz#5685b95eb209ac9c0c177467778c9c84df58ba9a"
integrity sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA== integrity sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==
camelize@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/camelize/-/camelize-1.0.0.tgz#164a5483e630fa4321e5af07020e531831b2609b"
integrity sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=
caniuse-api@^3.0.0: caniuse-api@^3.0.0:
version "3.0.0" version "3.0.0"
resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-3.0.0.tgz#5e4d90e2274961d46291997df599e3ed008ee4c0" resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-3.0.0.tgz#5e4d90e2274961d46291997df599e3ed008ee4c0"
@ -2110,11 +2348,6 @@ crypto-browserify@^3.12.0:
randombytes "^2.0.0" randombytes "^2.0.0"
randomfill "^1.0.3" randomfill "^1.0.3"
css-color-keywords@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/css-color-keywords/-/css-color-keywords-1.0.0.tgz#fea2616dc676b2962686b3af8dbdbe180b244e05"
integrity sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU=
css-declaration-sorter@^6.0.3: css-declaration-sorter@^6.0.3:
version "6.1.4" version "6.1.4"
resolved "https://registry.yarnpkg.com/css-declaration-sorter/-/css-declaration-sorter-6.1.4.tgz#b9bfb4ed9a41f8dcca9bf7184d849ea94a8294b4" resolved "https://registry.yarnpkg.com/css-declaration-sorter/-/css-declaration-sorter-6.1.4.tgz#b9bfb4ed9a41f8dcca9bf7184d849ea94a8294b4"
@ -2133,15 +2366,6 @@ css-select@^4.1.3:
domutils "^2.8.0" domutils "^2.8.0"
nth-check "^2.0.1" nth-check "^2.0.1"
css-to-react-native@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/css-to-react-native/-/css-to-react-native-3.0.0.tgz#62dbe678072a824a689bcfee011fc96e02a7d756"
integrity sha512-Ro1yETZA813eoyUp2GDBhG2j+YggidUmzO1/v9eYBKR2EHVEniE2MI/NqpTQ954BMpTPZFsGNPm46qFB9dpaPQ==
dependencies:
camelize "^1.0.0"
css-color-keywords "^1.0.0"
postcss-value-parser "^4.0.2"
css-tree@^1.1.2, css-tree@^1.1.3: css-tree@^1.1.2, css-tree@^1.1.3:
version "1.1.3" version "1.1.3"
resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-1.1.3.tgz#eb4870fb6fd7707327ec95c2ff2ab09b5e8db91d" resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-1.1.3.tgz#eb4870fb6fd7707327ec95c2ff2ab09b5e8db91d"
@ -2216,7 +2440,7 @@ csso@^4.2.0:
dependencies: dependencies:
css-tree "^1.1.2" css-tree "^1.1.2"
csstype@^3.0.2: csstype@^3.0.2, csstype@^3.0.4:
version "3.0.10" version "3.0.10"
resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.10.tgz#2ad3a7bed70f35b965707c092e5f30b327c290e5" resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.10.tgz#2ad3a7bed70f35b965707c092e5f30b327c290e5"
integrity sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA== integrity sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==
@ -2255,7 +2479,7 @@ datastore-core@^7.0.0:
it-take "^1.0.1" it-take "^1.0.1"
uint8arrays "^3.0.0" uint8arrays "^3.0.0"
debug@4.3.3, debug@^4.1.0, debug@^4.1.1, debug@^4.2.0, debug@^4.3.0, debug@^4.3.1, debug@^4.3.2, debug@^4.3.3: debug@4.3.3, debug@^4.1.1, debug@^4.2.0, debug@^4.3.0, debug@^4.3.1, debug@^4.3.2, debug@^4.3.3:
version "4.3.3" version "4.3.3"
resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.3.tgz#04266e0b70a98d4462e6e288e38259213332b664" resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.3.tgz#04266e0b70a98d4462e6e288e38259213332b664"
integrity sha512-/zxw5+vh1Tfv+4Qn7a5nsbcJKPaSvCDhojn6FEl9vupwK2VCSDtEiEtqr8DFtzYFOdz63LBkxec7DYuc2jon6Q== integrity sha512-/zxw5+vh1Tfv+4Qn7a5nsbcJKPaSvCDhojn6FEl9vupwK2VCSDtEiEtqr8DFtzYFOdz63LBkxec7DYuc2jon6Q==
@ -2335,6 +2559,11 @@ detect-libc@^1.0.3:
resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-1.0.3.tgz#fa137c4bd698edf55cd5cd02ac559f91a4c4ba9b" resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-1.0.3.tgz#fa137c4bd698edf55cd5cd02ac559f91a4c4ba9b"
integrity sha1-+hN8S9aY7fVc1c0CrFWfkaTEups= integrity sha1-+hN8S9aY7fVc1c0CrFWfkaTEups=
detect-node-es@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/detect-node-es/-/detect-node-es-1.1.0.tgz#163acdf643330caa0b4cd7c21e7ee7755d6fa493"
integrity sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ==
diff@5.0.0: diff@5.0.0:
version "5.0.0" version "5.0.0"
resolved "https://registry.yarnpkg.com/diff/-/diff-5.0.0.tgz#7ed6ad76d859d030787ec35855f5b1daf31d852b" resolved "https://registry.yarnpkg.com/diff/-/diff-5.0.0.tgz#7ed6ad76d859d030787ec35855f5b1daf31d852b"
@ -3092,6 +3321,11 @@ get-iterator@^1.0.2:
resolved "https://registry.yarnpkg.com/get-iterator/-/get-iterator-1.0.2.tgz#cd747c02b4c084461fac14f48f6b45a80ed25c82" resolved "https://registry.yarnpkg.com/get-iterator/-/get-iterator-1.0.2.tgz#cd747c02b4c084461fac14f48f6b45a80ed25c82"
integrity sha512-v+dm9bNVfOYsY1OrhaCrmyOcYoSeVvbt+hHZ0Au+T+p1y+0Uyj9aMaGIeUTT6xdpRbWzDeYKvfOslPhggQMcsg== integrity sha512-v+dm9bNVfOYsY1OrhaCrmyOcYoSeVvbt+hHZ0Au+T+p1y+0Uyj9aMaGIeUTT6xdpRbWzDeYKvfOslPhggQMcsg==
get-nonce@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/get-nonce/-/get-nonce-1.0.1.tgz#fdf3f0278073820d2ce9426c18f07481b1e0cdf3"
integrity sha512-FJhYRoDaiatfEkUK8HKlicmu/3SGFD51q3itKDGoSTysQJBnfOcxU5GxnhE1E6soB76MbT0MBtnKJuXyAx+96Q==
get-port@^4.2.0: get-port@^4.2.0:
version "4.2.0" version "4.2.0"
resolved "https://registry.yarnpkg.com/get-port/-/get-port-4.2.0.tgz#e37368b1e863b7629c43c5a323625f95cf24b119" resolved "https://registry.yarnpkg.com/get-port/-/get-port-4.2.0.tgz#e37368b1e863b7629c43c5a323625f95cf24b119"
@ -3150,11 +3384,6 @@ glob@7.2.0, glob@^7.1.2, glob@^7.1.3, glob@^7.1.7:
once "^1.3.0" once "^1.3.0"
path-is-absolute "^1.0.0" path-is-absolute "^1.0.0"
globals@^11.1.0:
version "11.12.0"
resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e"
integrity sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==
globals@^13.2.0, globals@^13.6.0, globals@^13.9.0: globals@^13.2.0, globals@^13.6.0, globals@^13.9.0:
version "13.12.1" version "13.12.1"
resolved "https://registry.yarnpkg.com/globals/-/globals-13.12.1.tgz#ec206be932e6c77236677127577aa8e50bf1c5cb" resolved "https://registry.yarnpkg.com/globals/-/globals-13.12.1.tgz#ec206be932e6c77236677127577aa8e50bf1c5cb"
@ -3272,7 +3501,7 @@ hmac-drbg@^1.0.1:
minimalistic-assert "^1.0.0" minimalistic-assert "^1.0.0"
minimalistic-crypto-utils "^1.0.1" minimalistic-crypto-utils "^1.0.1"
hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.3.0: hoist-non-react-statics@^3.3.0:
version "3.3.2" version "3.3.2"
resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw== integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
@ -3403,6 +3632,13 @@ internal-slot@^1.0.3:
has "^1.0.3" has "^1.0.3"
side-channel "^1.0.4" side-channel "^1.0.4"
invariant@^2.2.4:
version "2.2.4"
resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==
dependencies:
loose-envify "^1.0.0"
ip-address@^8.0.0: ip-address@^8.0.0:
version "8.1.0" version "8.1.0"
resolved "https://registry.yarnpkg.com/ip-address/-/ip-address-8.1.0.tgz#1fe9b4509b51ff7d2fbbef4d3d26994d9915a459" resolved "https://registry.yarnpkg.com/ip-address/-/ip-address-8.1.0.tgz#1fe9b4509b51ff7d2fbbef4d3d26994d9915a459"
@ -3876,11 +4112,6 @@ jsbn@~0.1.0:
resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513" resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513"
integrity sha1-peZUwuWi3rXyAdls77yoDA7y9RM= integrity sha1-peZUwuWi3rXyAdls77yoDA7y9RM=
jsesc@^2.5.1:
version "2.5.2"
resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-2.5.2.tgz#80564d2e483dacf6e8ef209650a67df3f0c283a4"
integrity sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==
json-parse-better-errors@^1.0.1: json-parse-better-errors@^1.0.1:
version "1.0.2" version "1.0.2"
resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9" resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9"
@ -4232,7 +4463,7 @@ lodash.uniq@^4.5.0:
resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773" resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
integrity sha1-0CJTc662Uq3BvILklFM5qEJ1R3M= integrity sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=
lodash@^4.17.11, lodash@^4.17.15, lodash@^4.17.4: lodash@^4.17.15, lodash@^4.17.4:
version "4.17.21" version "4.17.21"
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg== integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
@ -4265,7 +4496,7 @@ long@^5.2.0:
resolved "https://registry.yarnpkg.com/long/-/long-5.2.0.tgz#2696dadf4b4da2ce3f6f6b89186085d94d52fd61" resolved "https://registry.yarnpkg.com/long/-/long-5.2.0.tgz#2696dadf4b4da2ce3f6f6b89186085d94d52fd61"
integrity sha512-9RTUNjK60eJbx3uz+TEGF7fUr29ZDxR5QzXcyDpeSfeH28S9ycINflOgOlppit5U+4kNTe83KQnMEerw7GmE8w== integrity sha512-9RTUNjK60eJbx3uz+TEGF7fUr29ZDxR5QzXcyDpeSfeH28S9ycINflOgOlppit5U+4kNTe83KQnMEerw7GmE8w==
loose-envify@^1.1.0, loose-envify@^1.4.0: loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:
version "1.4.0" version "1.4.0"
resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf" resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q== integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
@ -5054,7 +5285,7 @@ picocolors@^1.0.0:
resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c" resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c"
integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ== integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.2.3, picomatch@^2.3.0: picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.2.3:
version "2.3.1" version "2.3.1"
resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42" resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42"
integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA== integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==
@ -5273,7 +5504,7 @@ postcss-unique-selectors@^5.0.4:
dependencies: dependencies:
postcss-selector-parser "^6.0.5" postcss-selector-parser "^6.0.5"
postcss-value-parser@^4.0.2, postcss-value-parser@^4.2.0: postcss-value-parser@^4.2.0:
version "4.2.0" version "4.2.0"
resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514" resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514"
integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ== integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
@ -5467,6 +5698,34 @@ react-refresh@^0.9.0:
resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.9.0.tgz#71863337adc3e5c2f8a6bfddd12ae3bfe32aafbf" resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.9.0.tgz#71863337adc3e5c2f8a6bfddd12ae3bfe32aafbf"
integrity sha512-Gvzk7OZpiqKSkxsQvO/mbTN1poglhmAV7gR/DdIrRrSMXraRQQlfikRJOr3Nb9GTMPC5kof948Zy6jJZIFtDvQ== integrity sha512-Gvzk7OZpiqKSkxsQvO/mbTN1poglhmAV7gR/DdIrRrSMXraRQQlfikRJOr3Nb9GTMPC5kof948Zy6jJZIFtDvQ==
react-remove-scroll-bar@^2.1.0:
version "2.2.0"
resolved "https://registry.yarnpkg.com/react-remove-scroll-bar/-/react-remove-scroll-bar-2.2.0.tgz#d4d545a7df024f75d67e151499a6ab5ac97c8cdd"
integrity sha512-UU9ZBP1wdMR8qoUs7owiVcpaPwsQxUDC2lypP6mmixaGlARZa7ZIBx1jcuObLdhMOvCsnZcvetOho0wzPa9PYg==
dependencies:
react-style-singleton "^2.1.0"
tslib "^1.0.0"
react-remove-scroll@^2.4.0:
version "2.4.4"
resolved "https://registry.yarnpkg.com/react-remove-scroll/-/react-remove-scroll-2.4.4.tgz#2dfff377cf17efc00de39dad51c143fc7a1b9e3e"
integrity sha512-EyC5ohYhaeKbThMSQxuN2i+QC5HqV3AJvNZKEdiATITexu0gHm00+5ko0ltNS1ajYJVeDgVG2baRSCei0AUWlQ==
dependencies:
react-remove-scroll-bar "^2.1.0"
react-style-singleton "^2.1.0"
tslib "^1.0.0"
use-callback-ref "^1.2.3"
use-sidecar "^1.0.1"
react-style-singleton@^2.1.0:
version "2.1.1"
resolved "https://registry.yarnpkg.com/react-style-singleton/-/react-style-singleton-2.1.1.tgz#ce7f90b67618be2b6b94902a30aaea152ce52e66"
integrity sha512-jNRp07Jza6CBqdRKNgGhT3u9umWvils1xsuMOjZlghBDH2MU0PL2WZor4PGYjXpnRCa9DQSlHMs/xnABWOwYbA==
dependencies:
get-nonce "^1.0.0"
invariant "^2.2.4"
tslib "^1.0.0"
react@^17.0.0, react@^17.0.2: react@^17.0.0, react@^17.0.2:
version "17.0.2" version "17.0.2"
resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037" resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037"
@ -5721,11 +5980,6 @@ sha.js@^2.4.0, sha.js@^2.4.8:
inherits "^2.0.1" inherits "^2.0.1"
safe-buffer "^5.0.1" safe-buffer "^5.0.1"
shallowequal@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
shebang-command@^1.2.0: shebang-command@^1.2.0:
version "1.2.0" version "1.2.0"
resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-1.2.0.tgz#44aac65b695b03398968c39f363fee5deafdf1ea" resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-1.2.0.tgz#44aac65b695b03398968c39f363fee5deafdf1ea"
@ -5813,11 +6067,6 @@ source-map-support@~0.5.20:
buffer-from "^1.0.0" buffer-from "^1.0.0"
source-map "^0.6.0" source-map "^0.6.0"
source-map@^0.5.0:
version "0.5.7"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=
source-map@^0.6.0, source-map@^0.6.1: source-map@^0.6.0, source-map@^0.6.1:
version "0.6.1" version "0.6.1"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263" resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
@ -6025,22 +6274,6 @@ strip-json-comments@3.1.1, strip-json-comments@^3.1.0, strip-json-comments@^3.1.
resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006" resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006"
integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig== integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==
styled-components@^5.3.1:
version "5.3.3"
resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-5.3.3.tgz#312a3d9a549f4708f0fb0edc829eb34bde032743"
integrity sha512-++4iHwBM7ZN+x6DtPPWkCI4vdtwumQ+inA/DdAsqYd4SVgUKJie5vXyzotA00ttcFdQkCng7zc6grwlfIfw+lw==
dependencies:
"@babel/helper-module-imports" "^7.0.0"
"@babel/traverse" "^7.4.5"
"@emotion/is-prop-valid" "^0.8.8"
"@emotion/stylis" "^0.8.4"
"@emotion/unitless" "^0.7.4"
babel-plugin-styled-components ">= 1.12.0"
css-to-react-native "^3.0.0"
hoist-non-react-statics "^3.0.0"
shallowequal "^1.1.0"
supports-color "^5.5.0"
stylehacks@^5.0.3: stylehacks@^5.0.3:
version "5.0.3" version "5.0.3"
resolved "https://registry.yarnpkg.com/stylehacks/-/stylehacks-5.0.3.tgz#2ef3de567bfa2be716d29a93bf3d208c133e8d04" resolved "https://registry.yarnpkg.com/stylehacks/-/stylehacks-5.0.3.tgz#2ef3de567bfa2be716d29a93bf3d208c133e8d04"
@ -6056,7 +6289,7 @@ supports-color@8.1.1:
dependencies: dependencies:
has-flag "^4.0.0" has-flag "^4.0.0"
supports-color@^5.3.0, supports-color@^5.5.0: supports-color@^5.3.0:
version "5.5.0" version "5.5.0"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f" resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow== integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==
@ -6130,10 +6363,10 @@ timsort@^0.3.0:
resolved "https://registry.yarnpkg.com/timsort/-/timsort-0.3.0.tgz#405411a8e7e6339fe64db9a234de11dc31e02bd4" resolved "https://registry.yarnpkg.com/timsort/-/timsort-0.3.0.tgz#405411a8e7e6339fe64db9a234de11dc31e02bd4"
integrity sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q= integrity sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=
to-fast-properties@^2.0.0: tinykeys@^1.4.0:
version "2.0.0" version "1.4.0"
resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e" resolved "https://registry.yarnpkg.com/tinykeys/-/tinykeys-1.4.0.tgz#c2986cd0184c86e943a6b17acc0352e42b542dff"
integrity sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4= integrity sha512-ysnVd2E4nWbNXIbHaUidcKGLTmNimqP0hdpsD0Ph5hPJ84ntCF6PHj+Jg3im9nZt9/hNsBg/E6m1psHc2KaPnQ==
to-regex-range@^5.0.1: to-regex-range@^5.0.1:
version "5.0.1" version "5.0.1"
@ -6214,7 +6447,7 @@ tsconfig-paths@^3.12.0, tsconfig-paths@^3.9.0:
minimist "^1.2.0" minimist "^1.2.0"
strip-bom "^3.0.0" strip-bom "^3.0.0"
tslib@^1.8.1: tslib@^1.0.0, tslib@^1.8.1, tslib@^1.9.3:
version "1.14.1" version "1.14.1"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00" resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg== integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
@ -6299,6 +6532,19 @@ uri-js@^4.2.2:
dependencies: dependencies:
punycode "^2.1.0" punycode "^2.1.0"
use-callback-ref@^1.2.3:
version "1.2.5"
resolved "https://registry.yarnpkg.com/use-callback-ref/-/use-callback-ref-1.2.5.tgz#6115ed242cfbaed5915499c0a9842ca2912f38a5"
integrity sha512-gN3vgMISAgacF7sqsLPByqoePooY3n2emTH59Ur5d/M8eg4WTWu1xp8i8DHjohftIyEx0S08RiYxbffr4j8Peg==
use-sidecar@^1.0.1:
version "1.0.5"
resolved "https://registry.yarnpkg.com/use-sidecar/-/use-sidecar-1.0.5.tgz#ffff2a17c1df42e348624b699ba6e5c220527f2b"
integrity sha512-k9jnrjYNwN6xYLj1iaGhonDghfvmeTmYjAiGvOr7clwKfPjMXJf4/HOr7oT5tJwYafgp2tG2l3eZEOfoELiMcA==
dependencies:
detect-node-es "^1.1.0"
tslib "^1.9.3"
utf8-byte-length@^1.0.1: utf8-byte-length@^1.0.1:
version "1.0.4" version "1.0.4"
resolved "https://registry.yarnpkg.com/utf8-byte-length/-/utf8-byte-length-1.0.4.tgz#f45f150c4c66eee968186505ab93fcbb8ad6bf61" resolved "https://registry.yarnpkg.com/utf8-byte-length/-/utf8-byte-length-1.0.4.tgz#f45f150c4c66eee968186505ab93fcbb8ad6bf61"