feat(system): add more control to Popover

packages/status-react/src/system/popover/popover.tsx

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

packages/status-react/src/system/popover/styles.tsx

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