status-im
/
dappconnect-sdks
mirror of https://github.com/status-im/dappconnect-sdks.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: adds checkbox and changes dropdown menu

This commit is contained in:
marcelines 2023-06-05 17:21:39 +01:00
parent 20f9f11fbf
commit b6f24857c1
No known key found for this signature in database
GPG Key ID: 56B1E53E2A3F43C7
13 changed files with 434 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/website/src/components/index.tsx
View File

@ -1,2 +1,4 @@
export { Breadcrumbs } from './breadcrumbs/breadcrumbs'
export { EpicOverview } from './epic-overview'
export { SideBar } from './side-bar/side-bar'
export { TableIssues } from './table-issues'

79
apps/website/src/components/table-issues/filters/filter-author.tsx Normal file
View File

@ -0,0 +1,79 @@
import { useState } from 'react'
import { Avatar, Button, Input, Text } from '@status-im/components'
import { DropdownMenu } from '@status-im/components/src/dropdown-menu'
import { DropdownIcon, SearchIcon } from '@status-im/icons'
type Props = {
authors: {
id: number
name: string
avatar?: string
}[]
}
const FilterAuthor = (props: Props) => {
const { authors } = props
const [authorFilterText, setAuthorFilterText] = useState('')
const filteredAuthors = authors.filter(author =>
author.name.toLowerCase().includes(authorFilterText.toLowerCase())
)
const [selectedAuthors, setSelectedAuthors] = useState<number[]>([])
return (
<div className="pr-3">
<DropdownMenu>
<Button
size={32}
variant="outline"
iconAfter={<DropdownIcon size={20} />}
>
Author
</Button>
<DropdownMenu.Content sideOffset={10} align="end">
<div className="p-2 px-1">
<Input
placeholder="Find Author"
icon={<SearchIcon size={20} />}
size={32}
value={authorFilterText}
onChangeText={setAuthorFilterText}
/>
</div>
{filteredAuthors.map(author => (
<DropdownMenu.CheckboxItem
key={author.id}
icon={
<Avatar
name={author.name}
src={author.avatar}
size={16}
type="user"
/>
}
label={author.name}
checked={selectedAuthors.includes(author.id)}
onSelect={() => {
if (selectedAuthors.includes(author.id)) {
setSelectedAuthors(
selectedAuthors.filter(id => id !== author.id)
)
} else {
setSelectedAuthors([...selectedAuthors, author.id])
}
}}
/>
))}
{filteredAuthors.length === 0 && (
<div className="p-2 py-1">
<Text size={13}> No authors found</Text>
</div>
)}
</DropdownMenu.Content>
</DropdownMenu>
</div>
)
}
export { FilterAuthor }

1
apps/website/src/components/table-issues/index.tsx Normal file
View File

@ -0,0 +1 @@
export { TableIssues } from './table-issues'

55
apps/website/src/components/table-issues.tsx → apps/website/src/components/table-issues/table-issues.tsx
View File

@ -1,10 +1,11 @@
import { useState } from 'react'
import { Avatar, Button, Input, Tag, Text } from '@status-im/components'
import { DropdownMenu } from '@status-im/components/src/dropdown-menu'
import { DropdownIcon, OpenIcon, SearchIcon } from '@status-im/icons'
import { Avatar, Button, Tag, Text } from '@status-im/components'
import { OpenIcon } from '@status-im/icons'
import Link from 'next/link'
import { FilterAuthor } from './filters/filter-author'
const issues = [
{
id: 5154,
@ -92,11 +93,6 @@ const authors = [
export const TableIssues = () => {
const [activeTab, setActiveTab] = useState<'open' | 'closed'>('open')
const [authorFilterText, setAuthorFilterText] = useState('')
const filteredAuthors = authors.filter(author =>
author.name.toLowerCase().includes(authorFilterText.toLowerCase())
)
return (
<div className="border-neutral-10 overflow-hidden rounded-2xl border">
<div className="bg-neutral-5 border-neutral-10 flex border-b p-3">
@ -123,48 +119,7 @@ export const TableIssues = () => {
</div>
<div className="flex-1">
<div className="flex items-center justify-end">
<div className="pr-3">
<DropdownMenu>
<Button
size={32}
variant="outline"
iconAfter={<DropdownIcon size={20} />}
>
Author
</Button>
<DropdownMenu.Content sideOffset={10} align="end">
<div className="p-2 px-1">
<Input
placeholder="Find Author"
icon={<SearchIcon size={20} />}
size={32}
value={authorFilterText}
onChangeText={setAuthorFilterText}
/>
</div>
{filteredAuthors.map(author => (
<DropdownMenu.Item
key={author.id}
icon={
<Avatar
name={author.name}
src={author.avatar}
size={16}
type="user"
/>
}
label={author.name}
onSelect={() => alert('Author: ' + author.name)}
/>
))}
{filteredAuthors.length === 0 && (
<div className="p-2 py-1">
<Text size={13}> No authors found</Text>
</div>
)}
</DropdownMenu.Content>
</DropdownMenu>
</div>
<FilterAuthor authors={authors} />
<div className="pr-3">
<Button size={32} variant="ghost">
Filter

4
apps/website/src/pages/insights/epics/[epic].tsx
View File

@ -1,6 +1,4 @@
import { Breadcrumbs } from '@/components'
import { EpicOverview } from '@/components/epic-overview'
import { TableIssues } from '@/components/table-issues'
import { Breadcrumbs, EpicOverview, TableIssues } from '@/components'
import { InsightsLayout } from '@/layouts/insights-layout'
import type { Page } from 'next'

2
apps/website/src/pages/insights/orphans.tsx
View File

@ -1,6 +1,6 @@
import { Text } from '@status-im/components'
import { TableIssues } from '@/components/table-issues'
import { TableIssues } from '@/components'
import { InsightsLayout } from '@/layouts/insights-layout'
import type { Page } from 'next'

4
apps/website/src/pages/insights/workstreams/[workstream].tsx
View File

@ -1,6 +1,4 @@
import { Breadcrumbs } from '@/components'
import { EpicOverview } from '@/components/epic-overview'
import { TableIssues } from '@/components/table-issues'
import { Breadcrumbs, EpicOverview, TableIssues } from '@/components'
import { InsightsLayout } from '@/layouts/insights-layout'
import type { Page } from 'next'

1
packages/components/package.json
View File

@ -31,6 +31,7 @@
},
"dependencies": {
"@radix-ui/react-accordion": "^1.1.1",
"@radix-ui/react-checkbox": "^1.0.4",
"@radix-ui/react-dialog": "^1.0.3",
"@radix-ui/react-dropdown-menu": "^2.0.4",
"@radix-ui/react-popover": "^1.0.5",

64
packages/components/src/dropdown-menu/dropdown-menu.tsx
View File

@ -1,6 +1,7 @@
import { cloneElement } from 'react'
import { cloneElement, forwardRef } from 'react'
import {
CheckboxItem,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuSeparator,
@ -8,8 +9,9 @@ import {
Root,
Trigger,
} from '@radix-ui/react-dropdown-menu'
import { styled } from '@tamagui/core'
import { Stack, styled } from '@tamagui/core'
import { Checkbox } from '../selectors'
import { Text } from '../text'
interface Props {
@ -35,6 +37,7 @@ interface DropdownMenuItemProps {
icon: React.ReactElement
label: string
onSelect: () => void
selected?: boolean
danger?: boolean
}
@ -54,6 +57,38 @@ const MenuItem = (props: DropdownMenuItemProps) => {
)
}
interface DropdownMenuCheckboxItemProps {
icon: React.ReactElement
label: string
onSelect: () => void
checked?: boolean
danger?: boolean
}
const DropdownMenuCheckboxItem = forwardRef<
HTMLDivElement,
DropdownMenuCheckboxItemProps
>(function _DropdownMenuCheckboxItem(props, forwardedRef) {
const { checked, label, icon, onSelect } = props
const handleSelect = (event: Event) => {
event.preventDefault()
onSelect()
}
return (
<ItemBaseCheckbox {...props} ref={forwardedRef} onSelect={handleSelect}>
<Stack flexDirection="row" gap={8} alignItems="center">
{cloneElement(icon, { color: '$neutral-50' })}
<Text size={15} weight="medium" color="$neutral-100">
{label}
</Text>
</Stack>
<Checkbox id={label} selected={checked} variant="outline" />
</ItemBaseCheckbox>
)
})
const Content = styled(DropdownMenuContent, {
name: 'DropdownMenuContent',
acceptsClassName: true,
@ -90,6 +125,30 @@ const ItemBase = styled(DropdownMenuItem, {
},
})
const ItemBaseCheckbox = styled(CheckboxItem, {
name: 'DropdownMenuCheckboxItem',
acceptsClassName: true,
display: 'flex',
alignItems: 'center',
justifyContent: 'space-between',
height: 32,
paddingHorizontal: 8,
borderRadius: '$10',
cursor: 'pointer',
userSelect: 'none',
gap: 8,
hoverStyle: {
backgroundColor: '$neutral-5',
},
pressStyle: {
backgroundColor: '$neutral-10',
},
})
const Separator = styled(DropdownMenuSeparator, {
name: 'DropdownMenuSeparator',
acceptsClassName: true,
@ -104,6 +163,7 @@ const Separator = styled(DropdownMenuSeparator, {
DropdownMenu.Content = Content
DropdownMenu.Item = MenuItem
DropdownMenu.Separator = Separator
DropdownMenu.CheckboxItem = DropdownMenuCheckboxItem
export { DropdownMenu }
export type DropdownMenuProps = Omit<Props, 'children'>

58
packages/components/src/selectors/checkbox.stories.tsx Normal file
View File

@ -0,0 +1,58 @@
import { useState } from 'react'
import { Checkbox } from './checkbox'
import type { Meta, StoryObj } from '@storybook/react'
const meta: Meta<typeof Checkbox> = {
component: Checkbox,
argTypes: {},
parameters: {
design: {
type: 'figma',
url: 'https://www.figma.com/file/IBmFKgGL1B4GzqD8LQTw6n/Design-System-for-Desktop%2FWeb?node-id=180-9685&t=tDEqIV09qddTZgXF-4',
},
},
}
type Story = StoryObj<typeof Checkbox>
const CheckBoxWithHookFilled = () => {
const [checked, setChecked] = useState(false)
return (
<Checkbox
id="checkbox"
selected={checked}
onCheckedChange={() => setChecked(!checked)}
variant="filled"
/>
)
}
const CheckBoxWithHookOutlined = () => {
const [checked, setChecked] = useState(false)
return (
<Checkbox
id="checkbox"
selected={checked}
onCheckedChange={() => setChecked(!checked)}
variant="outline"
/>
)
}
export const Filled: Story = {
render: () => {
return <CheckBoxWithHookFilled />
},
}
export const Outlined: Story = {
render: () => {
return <CheckBoxWithHookOutlined />
},
}
export default meta

124
packages/components/src/selectors/checkbox.tsx Normal file
View File

@ -0,0 +1,124 @@
import { Indicator as _Indicator, Root } from '@radix-ui/react-checkbox'
import { CheckIcon } from '@status-im/icons'
import { styled } from '@tamagui/core'
import type { GetVariants } from '../types'
import type { IconProps } from '@status-im/icons'
import type { ColorTokens } from '@tamagui/core'
type Variants = GetVariants<typeof Base>
interface Props {
selected?: boolean
onCheckedChange?: (checked: boolean) => void
id: string
size?: 32 | 20
variant?: Variants['variant']
}
const iconColor: Record<Variants['variant'], ColorTokens> = {
filled: '$neutral-50',
outline: '$white-100',
}
const iconSize: Record<Variants['size'], IconProps['size']> = {
32: 20,
20: 16,
}
const Checkbox = (props: Props) => {
const { id, selected, onCheckedChange, size = 20, variant = 'filled' } = props
return (
<Base
id={id}
selected={selected ? variant : undefined}
size={size}
onCheckedChange={onCheckedChange}
variant={variant}
checked={selected}
>
<Indicator>
<CheckIcon size={iconSize[size]} color={iconColor[variant]} />
</Indicator>
</Base>
)
}
export { Checkbox }
export type { Props as CheckboxProps }
const Base = styled(Root, {
name: 'Checkbox',
tag: 'span',
accessibilityRole: 'checkbox',
backgroundColor: 'transparent',
borderRadius: '$2',
cursor: 'pointer',
animation: 'fast',
height: 32,
width: 32,
borderWidth: 1,
variants: {
size: {
32: {
height: 32,
width: 32,
},
20: {
height: 20,
width: 20,
},
},
variant: {
filled: {
backgroundColor: '$neutral-20',
hoverStyle: { backgroundColor: '$neutral-30' },
pressStyle: { backgroundColor: '$neutral-30' },
},
outline: {
borderColor: '$neutral-20',
hoverStyle: { borderColor: '$neutral-30' },
pressStyle: { borderColor: '$neutral-30' },
},
},
selected: {
filled: {
hoverStyle: { backgroundColor: '$primary-60' },
pressStyle: { backgroundColor: '$primary-60' },
},
outline: {
backgroundColor: '$primary-50',
borderColor: '$primary-50',
hoverStyle: {
backgroundColor: '$primary-60',
},
pressStyle: {
backgroundColor: '$primary-60',
},
},
},
disabled: {
true: {
opacity: 0.3,
cursor: 'default',
},
},
} as const,
})
const Indicator = styled(_Indicator, {
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
height: '100%',
width: '100%',
})

1
packages/components/src/selectors/index.tsx Normal file
View File

@ -0,0 +1 @@
export { Checkbox } from './checkbox'

98
yarn.lock
View File

@ -4160,6 +4160,13 @@
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/primitive@1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@radix-ui/primitive/-/primitive-1.0.1.tgz#e46f9958b35d10e9f6dc71c497305c22e3e55dbd"
integrity sha512-yQ8oGX2GVsEYMWGxcovu1uGWPCxV5BFfeeYxqPmuAzUyLT9qmaMXSAhXpb0WrspIeqYzdJpkh2vHModJPgRIaw==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-accordion@^1.1.1":
version "1.1.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-accordion/-/react-accordion-1.1.1.tgz#fa1ab1b5c6a29aa75aefaf306a9e72fe3a482dbc"
@ -4184,6 +4191,21 @@
"@babel/runtime" "^7.13.10"
"@radix-ui/react-primitive" "1.0.2"
"@radix-ui/react-checkbox@^1.0.4":
version "1.0.4"
resolved "https://registry.yarnpkg.com/@radix-ui/react-checkbox/-/react-checkbox-1.0.4.tgz#98f22c38d5010dd6df4c5744cac74087e3275f4b"
integrity sha512-CBuGQa52aAYnADZVt/KBQzXrwx6TqnlwtcIPGtVt5JkkzQwMOLJjPukimhfKEr4GQNd43C+djUh5Ikopj8pSLg==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/primitive" "1.0.1"
"@radix-ui/react-compose-refs" "1.0.1"
"@radix-ui/react-context" "1.0.1"
"@radix-ui/react-presence" "1.0.1"
"@radix-ui/react-primitive" "1.0.3"
"@radix-ui/react-use-controllable-state" "1.0.1"
"@radix-ui/react-use-previous" "1.0.1"
"@radix-ui/react-use-size" "1.0.1"
"@radix-ui/react-collapsible@1.0.2":
version "1.0.2"
resolved "https://registry.yarnpkg.com/@radix-ui/react-collapsible/-/react-collapsible-1.0.2.tgz#0583470c7caa8cd1ab6f606416288d19b3baf777"
@ -4217,6 +4239,13 @@
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-compose-refs@1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-compose-refs/-/react-compose-refs-1.0.1.tgz#7ed868b66946aa6030e580b1ffca386dd4d21989"
integrity sha512-fDSBgd44FKHa1FRMU59qBMPFcl2PZE+2nmqunj+BWFyYYjnhIDWL2ItDs3rrbJDQOtzt5nIebLCQc4QRfz6LJw==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-context@1.0.0":
version "1.0.0"
resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-1.0.0.tgz#f38e30c5859a9fb5e9aa9a9da452ee3ed9e0aee0"
@ -4224,6 +4253,13 @@
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-context@1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-1.0.1.tgz#fe46e67c96b240de59187dcb7a1a50ce3e2ec00c"
integrity sha512-ebbrdFoYTcuZ0v4wG5tedGnp9tzcV8awzsxYph7gXUyvnNLuTIcCk1q17JEbnVhXAKG9oX3KtchwiMIAYp9NLg==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-dialog@^1.0.3":
version "1.0.3"
resolved "https://registry.yarnpkg.com/@radix-ui/react-dialog/-/react-dialog-1.0.3.tgz#a715bf30f35fcd80476c0a07fcc073c1968e6d3e"
@ -4405,6 +4441,15 @@
"@radix-ui/react-compose-refs" "1.0.0"
"@radix-ui/react-use-layout-effect" "1.0.0"
"@radix-ui/react-presence@1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-presence/-/react-presence-1.0.1.tgz#491990ba913b8e2a5db1b06b203cb24b5cdef9ba"
integrity sha512-UXLW4UAbIY5ZjcvzjfRFo5gxva8QirC9hF7wRE4U5gz+TP0DbRk+//qyuAQ1McDxBt1xNMBTaciFGvEmJvAZCg==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-compose-refs" "1.0.1"
"@radix-ui/react-use-layout-effect" "1.0.1"
"@radix-ui/react-primitive@1.0.2":
version "1.0.2"
resolved "https://registry.yarnpkg.com/@radix-ui/react-primitive/-/react-primitive-1.0.2.tgz#54e22f49ca59ba88d8143090276d50b93f8a7053"
@ -4413,6 +4458,14 @@
"@babel/runtime" "^7.13.10"
"@radix-ui/react-slot" "1.0.1"
"@radix-ui/react-primitive@1.0.3":
version "1.0.3"
resolved "https://registry.yarnpkg.com/@radix-ui/react-primitive/-/react-primitive-1.0.3.tgz#d49ea0f3f0b2fe3ab1cb5667eb03e8b843b914d0"
integrity sha512-yi58uVyoAcK/Nq1inRY56ZSjKypBNKTa/1mcL8qdl6oJeEaDbOldlzrGn7P6Q3Id5d+SYNGc5AJgc4vGhjs5+g==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-slot" "1.0.2"
"@radix-ui/react-roving-focus@1.0.3":
version "1.0.3"
resolved "https://registry.yarnpkg.com/@radix-ui/react-roving-focus/-/react-roving-focus-1.0.3.tgz#0b4f4f9bd509f4510079e9e0734a734fd17cdce3"
@ -4437,6 +4490,14 @@
"@babel/runtime" "^7.13.10"
"@radix-ui/react-compose-refs" "1.0.0"
"@radix-ui/react-slot@1.0.2":
version "1.0.2"
resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-1.0.2.tgz#a9ff4423eade67f501ffb32ec22064bc9d3099ab"
integrity sha512-YeTpuq4deV+6DusvVUW4ivBgnkHwECUu0BiN43L5UCDFgdhsRUWAghhTF5MbvNTPzmiFOx90asDSUjWuCNapwg==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-compose-refs" "1.0.1"
"@radix-ui/react-tabs@^1.0.3":
version "1.0.3"
resolved "https://registry.yarnpkg.com/@radix-ui/react-tabs/-/react-tabs-1.0.3.tgz#8b4158160a7c6633c893c74641e929d2708e709a"
@ -4504,6 +4565,13 @@
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-callback-ref@1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.0.1.tgz#f4bb1f27f2023c984e6534317ebc411fc181107a"
integrity sha512-D94LjX4Sp0xJFVaoQOd3OO9k7tpBYNOXdVhkltUbGv2Qb9OXdrg/CpsjlZv7ia14Sylv398LswWBVVu5nqKzAQ==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-controllable-state@1.0.0":
version "1.0.0"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.0.0.tgz#a64deaafbbc52d5d407afaa22d493d687c538b7f"
@ -4512,6 +4580,14 @@
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-callback-ref" "1.0.0"
"@radix-ui/react-use-controllable-state@1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.0.1.tgz#ecd2ced34e6330caf89a82854aa2f77e07440286"
integrity sha512-Svl5GY5FQeN758fWKrjM6Qb7asvXeiZltlT4U2gVfl8Gx5UAv2sMR0LWo8yhsIZh2oQ0eFdZ59aoOOMV7b47VA==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-callback-ref" "1.0.1"
"@radix-ui/react-use-escape-keydown@1.0.2":
version "1.0.2"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-1.0.2.tgz#09ab6455ab240b4f0a61faf06d4e5132c4d639f6"
@ -4535,6 +4611,13 @@
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-layout-effect@1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.1.tgz#be8c7bc809b0c8934acf6657b577daf948a75399"
integrity sha512-v/5RegiJWYdoCvMnITBkNNx6bCj20fiaJnWtRkU18yITptraXjffz5Qbn05uOiQnOvi+dbkznkoaMltz1GnszQ==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-previous@1.0.0":
version "1.0.0"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-previous/-/react-use-previous-1.0.0.tgz#e48a69c3a7d8078a967084038df66d0d181c56ac"
@ -4542,6 +4625,13 @@
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-previous@1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-previous/-/react-use-previous-1.0.1.tgz#b595c087b07317a4f143696c6a01de43b0d0ec66"
integrity sha512-cV5La9DPwiQ7S0gf/0qiD6YgNqM5Fk97Kdrlc5yBcrF3jyEZQwm7vYFqMo4IfeHgJXsRaMvLABFtd0OVEmZhDw==
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"
@ -4565,6 +4655,14 @@
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-layout-effect" "1.0.0"
"@radix-ui/react-use-size@1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@radix-ui/react-use-size/-/react-use-size-1.0.1.tgz#1c5f5fea940a7d7ade77694bb98116fb49f870b2"
integrity sha512-ibay+VqrgcaI6veAojjofPATwledXiSmX+C0KrBk/xgpX9rBzPV3OsfwlhQdUOFbh+LKQorLYT+xTXW9V8yd0g==
dependencies:
"@babel/runtime" "^7.13.10"
"@radix-ui/react-use-layout-effect" "1.0.1"
"@radix-ui/react-visually-hidden@1.0.2":
version "1.0.2"
resolved "https://registry.yarnpkg.com/@radix-ui/react-visually-hidden/-/react-visually-hidden-1.0.2.tgz#29b117a59ef09a984bdad12cb98d81e8350be450"