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

feat(system): add more control to Popover

This commit is contained in:
Pavel Prichodko 2022-04-11 21:01:29 +02:00
parent 70143feea6
commit 03c4b96176
No known key found for this signature in database
GPG Key ID: 0EB8D75C775AB6F1
2 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/status-react/src/system/popover/popover.tsx
View File

@ -9,15 +9,17 @@ import type { Ref } from 'react'
interface TriggerProps { interface TriggerProps {
children: [React.ReactElement, React.ReactElement] children: [React.ReactElement, React.ReactElement]
open?: boolean
onOpenChange?: (open: boolean) => void
} }
const PopoverTrigger = (props: TriggerProps, ref: Ref<HTMLButtonElement>) => { const PopoverTrigger = (props: TriggerProps, ref: Ref<HTMLButtonElement>) => {
const { children, ...triggerProps } = props const { children, open, onOpenChange, ...triggerProps } = props
const [trigger, content] = children const [trigger, content] = children
return ( return (
<Primitive.Root> <Primitive.Root open={open} onOpenChange={onOpenChange}>
<Primitive.Trigger asChild> <Primitive.Trigger asChild>
{cloneElement(trigger, { ref, ...triggerProps })} {cloneElement(trigger, { ref, ...triggerProps })}
</Primitive.Trigger> </Primitive.Trigger>

1
packages/status-react/src/system/popover/styles.tsx
View File

@ -6,7 +6,6 @@ export type Variants = VariantProps<typeof Content>
export const Content = styled('div', { export const Content = styled('div', {
backgroundColor: 'white', backgroundColor: 'white',
padding: '$4',
borderRadius: 8, borderRadius: 8,
boxShadow: boxShadow:
'hsl(206 22% 7% / 35%) 0px 10px 38px -10px, hsl(206 22% 7% / 20%) 0px 10px 20px -15px', 'hsl(206 22% 7% / 35%) 0px 10px 38px -10px, hsl(206 22% 7% / 20%) 0px 10px 20px -15px',