diff --git a/packages/react/src/components/popover/popover-props.ts b/packages/react/src/components/popover/popover-props.ts index c5b7760a4..0d38576a8 100644 --- a/packages/react/src/components/popover/popover-props.ts +++ b/packages/react/src/components/popover/popover-props.ts @@ -8,7 +8,15 @@ export interface PopoverProps extends BaseProps, Omit { * screen is too small. */ overlay?: boolean; + /** + * An event that notifies the intention to close the Popover, usually from an + * outside click. + */ onClose?: () => void; + /** + * An event that notifies the initial rendering of the Popover has completed, + * provides the Popover element as argument. + */ onRender?: (popover: HTMLDivElement | null) => void; /** * Ref to an element which the Popover should target for placement. diff --git a/packages/react/src/components/popover/popover.stories.tsx b/packages/react/src/components/popover/popover.stories.tsx index 66d800ced..31baaca35 100644 --- a/packages/react/src/components/popover/popover.stories.tsx +++ b/packages/react/src/components/popover/popover.stories.tsx @@ -2,7 +2,6 @@ import { Button, Popover, PopoverProps } from '@onfido/castor-react'; import React, { Fragment, useRef } from 'react'; import { Meta, - omit, optionsToSummary, reactMatrix, Story, @@ -15,7 +14,13 @@ export default { title: 'React/Popover', component: Popover, argTypes: { - ...omit('onClose', 'target'), + withPortal: { + description: [ + 'Toggle between an example with and without `target` ref.', + 'Specific to `react-dom`.', + ].join('\n\n'), + name: '[Story only] with portal', + }, align: { control: { type: 'inline-radio', options: align }, table: { @@ -34,13 +39,10 @@ export default { type: { summary: optionsToSummary(position) }, }, }, - withPortal: { - description: [ - 'Toggle between an example with and without `target` ref.', - 'Specific to `react-dom`.', - ].join('\n\n'), - name: '[Story only] with portal', - }, + overlay: { control: null }, + onClose: {}, + onRender: {}, + target: { control: null }, }, args: { children: 'Popover content', diff --git a/packages/react/src/components/tooltip/tooltip.stories.tsx b/packages/react/src/components/tooltip/tooltip.stories.tsx index 191d75e4b..9fd9ab1af 100644 --- a/packages/react/src/components/tooltip/tooltip.stories.tsx +++ b/packages/react/src/components/tooltip/tooltip.stories.tsx @@ -14,6 +14,13 @@ export default { title: 'React/Tooltip', component: Tooltip, argTypes: { + withPortal: { + description: [ + 'Toggle between an example with and without `target` ref.', + 'Specific to `react-dom`.', + ].join('\n\n'), + name: '[Story only] with portal', + }, align: { control: { type: 'inline-radio', options: align }, table: { @@ -38,13 +45,6 @@ export default { table: { type: { summary: 'boolean | "on-hover"' } }, }, target: { control: { disable: true } }, - withPortal: { - description: [ - 'Toggle between an example with and without `target` ref.', - 'Specific to `react-dom`.', - ].join('\n\n'), - name: '[Story only] with portal', - }, }, args: { children: 'Tooltip',