Merge pull request #712 from smartxworks/popover

feat: add popover trigger style for tooltip and popover
This commit is contained in:
tanbowensg 2023-05-11 10:14:25 +08:00 committed by GitHub
commit b8c3a3c259
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 8 additions and 6 deletions

View File

@ -41,7 +41,7 @@ export const Popover = implementRuntimeComponent({
popupContent: { slotProps: Type.Object({}) },
content: { slotProps: Type.Object({}) },
},
styleSlots: ['content'],
styleSlots: ['content', 'popover-trigger'],
events: [],
},
})(props => {
@ -68,7 +68,7 @@ export const Popover = implementRuntimeComponent({
{...cProps}
content={slotsElements.popupContent ? slotsElements.popupContent({}) : null}
>
<span ref={elementRef}>
<span className={css(customStyle?.['popover-trigger'])} ref={elementRef}>
{slotsElements.content ? slotsElements.content({}) : <Button>Hover Me</Button>}
</span>
</BasePopover>
@ -82,7 +82,7 @@ export const Popover = implementRuntimeComponent({
setPopupVisible(visible);
}}
>
<span ref={elementRef}>
<span className={css(customStyle?.['popover-trigger'])} ref={elementRef}>
{slotsElements.content ? slotsElements.content({}) : <Button>Hover Me</Button>}
</span>
</BasePopover>

View File

@ -39,7 +39,7 @@ export const Tooltip = implementRuntimeComponent({
slots: {
content: { slotProps: Type.Object({}) },
},
styleSlots: ['content'],
styleSlots: ['content', 'tooltip-trigger'],
events: [],
},
})(props => {
@ -60,7 +60,7 @@ export const Tooltip = implementRuntimeComponent({
}, [subscribeMethods]);
return controlled ? (
<div>
<div className={css(customStyle?.['tooltip-trigger'])}>
<BaseTooltip
ref={elementRef}
className={css(customStyle?.content)}
@ -74,7 +74,7 @@ export const Tooltip = implementRuntimeComponent({
</BaseTooltip>
</div>
) : (
<div>
<div className={css(customStyle?.['tooltip-trigger'])}>
<BaseTooltip className={css(customStyle?.content)} {...cProps}>
<span ref={elementRef}>
{slotsElements.content ? slotsElements.content({}) : <Button>Hover Me</Button>}

View File

@ -17,6 +17,7 @@ export const PopoverPropsSpec = {
}),
color: Type.String({
title: 'Background',
description: 'Background color of the popup-layer',
category: Category.Style,
}),
position: StringUnion(

View File

@ -6,6 +6,7 @@ export const TooltipPropsSpec = {
color: Type.String({
title: 'Color',
category: Category.Style,
description: 'Background color of the popup-layer',
widget: 'core/v1/color',
}),
position: StringUnion(