@startupjs-ui/popover 0.1.13 → 0.1.19

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.1.19](https://github.com/startupjs/startupjs-ui/compare/v0.1.18...v0.1.19) (2026-03-17)
+
+
+### Bug Fixes
+
+* **docs:** don't load all icons to keep bundle small ([#17](https://github.com/startupjs/startupjs-ui/issues/17)) ([d7eb70b](https://github.com/startupjs/startupjs-ui/commit/d7eb70bc11f5b15923f2e43b7ef1f86ea066494e))
+
+
+
+
+
+## [0.1.16](https://github.com/startupjs/startupjs-ui/compare/v0.1.15...v0.1.16) (2026-02-10)
+
+**Note:** Version bump only for package @startupjs-ui/popover
+
+
+
+
+
 ## [0.1.13](https://github.com/startupjs/startupjs-ui/compare/v0.1.12...v0.1.13) (2026-02-03)
 
 **Note:** Version bump only for package @startupjs-ui/popover

package/README.mdx

@@ -1,6 +1,6 @@
 import { useState } from 'react'
 import { Sandbox } from '@startupjs-ui/docs'
-import { faUserCircle } from '@fortawesome/free-solid-svg-icons'
+import { faUserCircle } from '@fortawesome/free-solid-svg-icons/faUserCircle'
 import Popover, { _PropsJsonSchema as PopoverPropsJsonSchema } from './index'
 import Icon from '@startupjs-ui/icon'
 import Button from '@startupjs-ui/button'
@@ -9,7 +9,11 @@ import Span from '@startupjs-ui/span'
 
 # Popover
 
-Pop-up window for displaying hidden content, linked in some way to a specific element on the page and becomes visible when you click on this.
+A floating panel that appears near an anchor element when triggered. Use it to display additional content, menus, or tooltips tied to a specific element on the page.
+
+The `visible` prop controls whether the popover is shown, and `onChange` is called when visibility should change. You can also use `$visible` for two-way data binding. Pass `children` as the anchor (the always-visible element) and `renderContent` to render the popover content. A `ref` can be used to programmatically call `open()` and `close()`.
+
+The component also supports lifecycle callbacks inherited from AbstractPopover: `onRequestOpen`, `onRequestClose`, `onOpenComplete`, and `onCloseComplete`. Use `renderWrapper` to wrap the popover node with custom markup.
 
 ```jsx
 import { Popover } from 'startupjs-ui'
@@ -17,12 +21,11 @@ import { Popover } from 'startupjs-ui'
 
 ## Initialization
 
-Before use you need to configure [Portal](/docs/components/Portal)
+Before using Popover, you need to configure [Portal](/docs/components/Portal).
 
 ## Simple example
 
-- `children` (ReactNode): anchor (visible part)
-- `renderContent` (function: ReactNode): function returns hidden part
+Pass `children` as the anchor element and `renderContent` as a function that returns the popover content.
 
 ```jsx example
 const [visible, setVisible] = useState(false)
@@ -48,9 +51,7 @@ return (
 
 ## Position
 
-- `position` (string - 'top', 'bottom', 'left', 'right'): position relative to the visible part
-- `attachment` (string - 'start', 'center', 'end'): optional parameter for offset
-- `placements` (array): what positions can be used for auto-fix
+Use the `position` prop to control where the popover appears relative to the anchor: `'top'`, `'bottom'` (default), `'left'`, or `'right'`. The `attachment` prop adjusts alignment along the secondary axis: `'start'` (default), `'center'`, or `'end'`. The `placements` prop accepts an array of fallback positions used for automatic repositioning when the popover would overflow the screen.
 
 ```jsx example
 const [visible, setVisible] = useState(false)
@@ -76,13 +77,15 @@ return (
 )
 ```
 
-## Stylization
+## Styling
+
+Use the following props to customize the appearance:
+
+- `style` -- styles for the anchor wrapper
+- `attachmentStyle` -- styles for the popover container
+- `overlayStyle` -- styles for the dismiss overlay
 
-- `style`: styles for the anchor wrapper
-- `attachmentStyle`: styles for the popover container
-- `overlayStyle`: dismiss overlay styles
-- `arrow` (boolean): show an arrow
-- `matchAnchorWidth` (boolean): the width of the popover is equal to the width of the anchor
+Set `arrow` to `true` to display an arrow pointing from the popover to the anchor. Set `matchAnchorWidth` to `true` to make the popover match the anchor's width.
 
 ```jsx example
 const [visible, setVisible] = useState(false)
@@ -110,8 +113,7 @@ return (
 
 ## Extra options
 
-- `durationOpen` (number): animation time on opening
-- `durationClose` (number): animation time on close
+Use `durationOpen` (defaults to `100`ms) and `durationClose` (defaults to `50`ms) to control the animation timing for opening and closing the popover.
 
 ## Sandbox
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startupjs-ui/popover",
-  "version": "0.1.13",
+  "version": "0.1.19",
   "publishConfig": {
     "access": "public"
   },
@@ -8,14 +8,14 @@
   "types": "index.d.ts",
   "type": "module",
   "dependencies": {
-    "@startupjs-ui/abstract-popover": "^0.1.11",
-    "@startupjs-ui/core": "^0.1.11",
-    "@startupjs-ui/div": "^0.1.13"
+    "@startupjs-ui/abstract-popover": "^0.1.19",
+    "@startupjs-ui/core": "^0.1.19",
+    "@startupjs-ui/div": "^0.1.19"
   },
   "peerDependencies": {
     "react": "*",
     "react-native": "*",
     "startupjs": "*"
   },
-  "gitHead": "5cfdccf2bdae3873e968289a3e6b938fad02101a"
+  "gitHead": "bfcca786dc363f42a09b6eef4feb7ca8139302fc"
 }