ConfirmPopup API

API documentation for ConfirmPopup component

ConfirmPopupRoot#

Props#

Defines valid properties in ConfirmPopup component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	CSSProperties \| ((instance?: ConfirmPopupRootInstance) => CSSProperties)	null	The style to apply to the component.
className	string \| ((instance?: ConfirmPopupRootInstance) => string)	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	SafeRecord<ConfirmPopupRootPassThrough>	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	ReactNode \| ((instance: ConfirmPopupRootInstance) => ReactNode)	null	The children to render.
open	boolean	false	Specifies the visibility of the confirmpopup.
defaultOpen	boolean	false	Specifies the default visibility of the confirmpopup.
defaultFocus	"accept" \| "reject"	null	Element to receive the focus when the confirmpopup gets visible, valid values are "accept" and "reject".
onOpenChange	(event: useConfirmPopupChangeEvent) => void	null	Callback function that is called when the trigger is clicked.
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

State#

Defines valid state in ConfirmPopup component.

name	type	default	description
opened	boolean	null	Whether the confirmpopup is currently opened.

Exposes#

Defines the methods and properties exposed by ConfirmPopup component.

name	type	default	description
state	useConfirmPopupState	null	Current state of the confirmpopup.
motionRef	RefObject<{ elementRef: RefObject<HTMLDivElement> }>	null	Reference to the motion element.
triggerRef	RefObject<{ elementRef: RefObject<HTMLButtonElement> }>	null	Reference to the trigger element.
rejectRef	RefObject<{ elementRef: RefObject<HTMLButtonElement> }>	null	Reference to the reject element.
acceptRef	RefObject<{ elementRef: RefObject<HTMLButtonElement> }>	null	Reference to the accept element.
onOpenStateChange	() => void	null	Method to change the open state of the confirmpopup.
close	() => void	null	Method to close the confirmpopup.
onMotionEnter	() => void	null	Handler for motion enter events.
onMotionAfterEnter	() => void	null	Handler for motion after enter events.
onMotionAfterLeave	() => void	null	Handler for motion after leave events.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of ConfirmPopup component.

name	type	default	description
root	ConfirmPopupRootPassThroughType<HTMLAttributes<HTMLDivElement>>	null	Used to pass attributes to the root's DOM element.
trigger	ConfirmPopupRootPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the trigger's DOM element.
portal	ConfirmPopupRootPassThroughType<HTMLAttributes<HTMLDivElement>>	null	Used to pass attributes to the portal's DOM element.
content	ConfirmPopupRootPassThroughType<HTMLAttributes<HTMLDivElement>>	null	Used to pass attributes to the content's DOM element.
icon	ConfirmPopupRootPassThroughType<HTMLAttributes<HTMLSpanElement>>	null	Used to pass attributes to the icon's DOM element.
message	ConfirmPopupRootPassThroughType<HTMLAttributes<HTMLSpanElement>>	null	Used to pass attributes to the message's DOM element.
footer	ConfirmPopupRootPassThroughType<HTMLAttributes<HTMLDivElement>>	null	Used to pass attributes to the footer's DOM element.
reject	ConfirmPopupRootPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the reject's DOM element.
accept	ConfirmPopupRootPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the accept's DOM element.

Types#

Instance

Instance of ConfirmPopup component.

values
ComponentInstance<ConfirmPopupRootProps, ConfirmPopupRootState, ConfirmPopupRootExposes>

ConfirmPopupTrigger#

Props#

Defines valid properties in ConfirmPopupTrigger component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	CSSProperties \| ((instance?: ConfirmPopupTriggerInstance) => CSSProperties)	null	The style to apply to the component.
className	string \| ((instance?: ConfirmPopupTriggerInstance) => string)	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	SafeRecord<ConfirmPopupTriggerPassThrough>	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	ReactNode \| ((instance: ConfirmPopupTriggerInstance) => ReactNode)	null	The children to render.
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by ConfirmPopupTrigger component.

name	type	default	description
confirmpopup	ConfirmPopupRootInstance	null	Instance of the ConfirmPopup component.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of ConfirmPopupTrigger component.

name	type	default	description
root	ConfirmPopupTriggerPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of ConfirmPopupTrigger component.

values
ComponentInstance<ConfirmPopupTriggerProps, ConfirmPopupTriggerState, ConfirmPopupTriggerExposes>

ConfirmPopupPortal#

Props#

Defines valid properties in ConfirmPopupPortal component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	CSSProperties \| ((instance?: ConfirmPopupPortalInstance) => CSSProperties)	null	The style to apply to the component.
className	string \| ((instance?: ConfirmPopupPortalInstance) => string)	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	SafeRecord<ConfirmPopupPortalPassThrough>	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	ReactNode \| ((instance: ConfirmPopupPortalInstance) => ReactNode)	null	The children to render.
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by ConfirmPopupPortal component.

name	type	default	description
confirmpopup	ConfirmPopupRootInstance	null	Instance of the ConfirmPopup component.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of ConfirmPopupPortal component.

name	type	default	description
root	ConfirmPopupPortalPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of ConfirmPopupPortal component.

values
ComponentInstance<ConfirmPopupPortalProps, ConfirmPopupPortalState, ConfirmPopupPortalExposes>

ConfirmPopupContent#

Props#

Defines valid properties in ConfirmPopupContent component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	CSSProperties \| ((instance?: ConfirmPopupContentInstance) => CSSProperties)	null	The style to apply to the component.
className	string \| ((instance?: ConfirmPopupContentInstance) => string)	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	SafeRecord<ConfirmPopupContentPassThrough>	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	ReactNode \| ((instance: ConfirmPopupContentInstance) => ReactNode)	null	The children to render.
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by ConfirmPopupContent component.

name	type	default	description
confirmpopup	ConfirmPopupRootInstance	null	Instance of the ConfirmPopup component.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of ConfirmPopupContent component.

name	type	default	description
root	ConfirmPopupContentPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of ConfirmPopupContent component.

values
ComponentInstance<ConfirmPopupContentProps, ConfirmPopupContentState, ConfirmPopupContentExposes>

ConfirmPopupIcon#

Props#

Defines valid properties in ConfirmPopupIcon component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	CSSProperties \| ((instance?: ConfirmPopupIconInstance) => CSSProperties)	null	The style to apply to the component.
className	string \| ((instance?: ConfirmPopupIconInstance) => string)	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	SafeRecord<ConfirmPopupIconPassThrough>	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	ReactNode \| ((instance: ConfirmPopupIconInstance) => ReactNode)	null	The children to render.
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by ConfirmPopupIcon component.

name	type	default	description
confirmpopup	ConfirmPopupRootInstance	null	Instance of the ConfirmPopup component.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of ConfirmPopupIcon component.

name	type	default	description
root	ConfirmPopupIconPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of ConfirmPopupIcon component.

values
ComponentInstance<ConfirmPopupIconProps, ConfirmPopupIconState, ConfirmPopupIconExposes>

ConfirmPopupMessage#

Props#

Defines valid properties in ConfirmPopupMessage component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	CSSProperties \| ((instance?: ConfirmPopupMessageInstance) => CSSProperties)	null	The style to apply to the component.
className	string \| ((instance?: ConfirmPopupMessageInstance) => string)	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	SafeRecord<ConfirmPopupMessagePassThrough>	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	ReactNode \| ((instance: ConfirmPopupMessageInstance) => ReactNode)	null	The children to render.
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by ConfirmPopupMessage component.

name	type	default	description
confirmpopup	ConfirmPopupRootInstance	null	Instance of the ConfirmPopup component.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of ConfirmPopupMessage component.

name	type	default	description
root	ConfirmPopupMessagePassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of ConfirmPopupMessage component.

values
ComponentInstance<ConfirmPopupMessageProps, ConfirmPopupMessageState, ConfirmPopupMessageExposes>

ConfirmPopupFooter#

Props#

Defines valid properties in ConfirmPopupFooter component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	CSSProperties \| ((instance?: ConfirmPopupFooterInstance) => CSSProperties)	null	The style to apply to the component.
className	string \| ((instance?: ConfirmPopupFooterInstance) => string)	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	SafeRecord<ConfirmPopupFooterPassThrough>	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	ReactNode \| ((instance: ConfirmPopupFooterInstance) => ReactNode)	null	The children to render.
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by ConfirmPopupFooter component.

name	type	default	description
confirmpopup	ConfirmPopupRootInstance	null	Instance of the ConfirmPopup component.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of ConfirmPopupFooter component.

name	type	default	description
root	ConfirmPopupFooterPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of ConfirmPopupFooter component.

values
ComponentInstance<ConfirmPopupFooterProps, ConfirmPopupFooterState, ConfirmPopupFooterExposes>

ConfirmPopupReject#

Props#

Defines valid properties in ConfirmPopupReject component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	CSSProperties \| ((instance?: ConfirmPopupRejectInstance) => CSSProperties)	null	The style to apply to the component.
className	string \| ((instance?: ConfirmPopupRejectInstance) => string)	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	SafeRecord<ConfirmPopupRejectPassThrough>	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	ReactNode \| ((instance: ConfirmPopupRejectInstance) => ReactNode)	null	The children to render.
size	"small" \| "large" \| "normal"	small	The size of the reject button
variant	"link" \| "text" \| "outlined"	text	the variant of the reject button
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by ConfirmPopupReject component.

name	type	default	description
confirmpopup	ConfirmPopupRootInstance	null	Instance of the ConfirmPopup component.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of ConfirmPopupReject component.

name	type	default	description
root	ConfirmPopupRejectPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of ConfirmPopupReject component.

values
ComponentInstance<ConfirmPopupRejectProps, ConfirmPopupRejectState, ConfirmPopupRejectExposes>

ConfirmPopupAccept#

Props#

Defines valid properties in ConfirmPopupAccept component.

name	type	default	description
ref	Ref<unknown>	null	The reference to the component instance.
pIf	boolean	true	Whether the component should be rendered.
style	CSSProperties \| ((instance?: ConfirmPopupAcceptInstance) => CSSProperties)	null	The style to apply to the component.
className	string \| ((instance?: ConfirmPopupAcceptInstance) => string)	null	The class name to apply to the component.
as	string \| number \| bigint \| boolean \| ComponentClass<any, any> \| FunctionComponent<any> \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode, any, any> \| ReactPortal \| Promise<AwaitedReactNode>	null	The component type to render.
asChild	boolean	false	Whether the component should be rendered as a child component.
pt	SafeRecord<ConfirmPopupAcceptPassThrough>	null	The pass-through props to pass to the component
ptOptions	PassThroughOptions	null	The pass-through options to pass to the component
unstyled	boolean	null	Whether the component should be rendered without classes.
dt	unknown	null	The design token to use for the component.
styles	StylesOptions<ComponentInstance>	null	The styles to use for the component.
children	ReactNode \| ((instance: ConfirmPopupAcceptInstance) => ReactNode)	null	The children to render.
size	"small" \| "large" \| "normal"	small	The size of the accept button
[key: string]	any	null
pt-{optionName}-*	-	null	Pass through attributes for customizing component. For more info, see Pass Through tab.

Exposes#

Defines the methods and properties exposed by ConfirmPopupAccept component.

name	type	default	description
confirmpopup	ConfirmPopupRootInstance	null	Instance of the ConfirmPopup component.

Interfaces#

PassThroughOptions

Defines passthrough(pt) options of ConfirmPopupAccept component.

name	type	default	description
root	ConfirmPopupAcceptPassThroughType<HTMLAttributes<HTMLButtonElement>>	null	Used to pass attributes to the root's DOM element.

Types#

Instance

Instance of ConfirmPopupAccept component.

values
ComponentInstance<ConfirmPopupAcceptProps, ConfirmPopupAcceptState, ConfirmPopupAcceptExposes>

useConfirmPopup#

Props#

Defines valid properties in useConfirmPopup.

name	type	default	description
open	boolean	false	Specifies the visibility of the confirmpopup.
defaultOpen	boolean	false	Specifies the default visibility of the confirmpopup.
defaultFocus	"accept" \| "reject"	null	Element to receive the focus when the confirmpopup gets visible, valid values are "accept" and "reject".
onOpenChange	(event: useConfirmPopupChangeEvent) => void	null	Callback function that is called when the trigger is clicked.

State#

Defines valid state in useConfirmPopup.

name	type	default	description
opened	boolean	null	Whether the confirmpopup is currently opened.

Exposes#

Defines the methods and properties exposed by useConfirmPopup.

name	type	default	description
state	useConfirmPopupState	null	Current state of the confirmpopup.
motionRef	RefObject<{ elementRef: RefObject<HTMLDivElement> }>	null	Reference to the motion element.
triggerRef	RefObject<{ elementRef: RefObject<HTMLButtonElement> }>	null	Reference to the trigger element.
rejectRef	RefObject<{ elementRef: RefObject<HTMLButtonElement> }>	null	Reference to the reject element.
acceptRef	RefObject<{ elementRef: RefObject<HTMLButtonElement> }>	null	Reference to the accept element.
onOpenStateChange	() => void	null	Method to change the open state of the confirmpopup.
close	() => void	null	Method to close the confirmpopup.
onMotionEnter	() => void	null	Handler for motion enter events.
onMotionAfterEnter	() => void	null	Handler for motion after enter events.
onMotionAfterLeave	() => void	null	Handler for motion after leave events.

Events#

useConfirmPopupChangeEvent

Event fired when the confirmpopup's open state changes.

name	type	description
value	boolean	The value of the confirmpopup.

Types#

Instance

Instance of useConfirmPopup headless.

values
HeadlessInstance<useConfirmPopupProps, useConfirmPopupState, useConfirmPopupExposes>