diff --git a/components/Popover/__test__/fixture/popover.open.svelte b/components/Popover/__test__/fixture/popover.open.svelte
new file mode 100644
index 00000000..1c0c0445
--- /dev/null
+++ b/components/Popover/__test__/fixture/popover.open.svelte
@@ -0,0 +1,10 @@
+
+
+
+ top
+
+
diff --git a/components/Popover/__test__/popover.spec.ts b/components/Popover/__test__/popover.spec.ts
index 4f04f8bc..926a7e4d 100644
--- a/components/Popover/__test__/popover.spec.ts
+++ b/components/Popover/__test__/popover.spec.ts
@@ -7,6 +7,7 @@ import KPopoverDisabled from './fixture/popover.disabled.svelte';
import KPopoverChange from './fixture/popover.change.svelte';
import KPopoverArrow from './fixture/popover.arrow.svelte';
import KPopoverDelay from './fixture/popover.delay.svelte';
+import KPopoverOpen from './fixture/popover.open.svelte';
let host: HTMLElement;
const initHost = () => {
@@ -24,6 +25,15 @@ afterEach(() => {
});
// TODO E2E test
describe('Test: KPopover', () => {
+ vi.mock('svelte', async () => {
+ const actual = (await vi.importActual('svelte')) as object;
+ return {
+ ...actual,
+ // @ts-ignore
+ onMount: (await import('svelte/internal')).onMount
+ };
+ });
+
test('props: placement', async () => {
//@ts-ignore
const instance = new KPopoverPlacement({
@@ -84,6 +94,17 @@ describe('Test: KPopover', () => {
expect(host.innerHTML).matchSnapshot();
});
+ test('props: defaultOpen', async () => {
+ //@ts-ignore
+ const instance = new KPopoverOpen({
+ target: host
+ });
+ expect(instance).toBeTruthy();
+ await tick();
+ await vi.advanceTimersByTimeAsync(500);
+ expect(host.innerHTML.includes('有美一人,清扬婉兮')).toBeTruthy();
+ });
+
test('props: trigger', async () => {
//@ts-ignore
const instance = new KPopoverTrigger({
diff --git a/components/Popover/src/index.svelte b/components/Popover/src/index.svelte
index 47535ed9..9b078e75 100644
--- a/components/Popover/src/index.svelte
+++ b/components/Popover/src/index.svelte
@@ -4,7 +4,7 @@
import { getPrefixCls } from '@ikun-ui/utils';
import { clsx } from 'clsx';
import type { KPopoverProps } from './types';
- import { createEventDispatcher } from 'svelte';
+ import { createEventDispatcher, onMount } from 'svelte';
export let placement: KPopoverProps['placement'] = 'top';
// hover click manual
@@ -16,6 +16,7 @@
export let mouseLeaveDelay: KPopoverProps['mouseLeaveDelay'] = 200;
export let cls: KPopoverProps['cls'] = undefined;
export let clsTrigger: KPopoverProps['clsTrigger'] = undefined;
+ export let defaultOpen: KPopoverProps['defaultOpen'] = undefined;
/**
* @internal
*/
@@ -61,6 +62,11 @@
} as PopperOptions);
let isShow = false;
+ onMount(() => {
+ if (defaultOpen !== undefined) {
+ doUpdateShow(!!defaultOpen);
+ }
+ });
const handleClick = () => {
if (trigger === 'manual') {
doUpdateShow(!isShow);
diff --git a/components/Popover/src/types.d.ts b/components/Popover/src/types.d.ts
index f33c57f9..47c1af5b 100644
--- a/components/Popover/src/types.d.ts
+++ b/components/Popover/src/types.d.ts
@@ -3,6 +3,7 @@ import type { ClassValue } from 'clsx';
import { IKunPlacement, IKunTrigger } from '@ikun-ui/utils';
export type KPopoverProps = {
+ defaultOpen?: boolean;
placement: IKunPlacement;
trigger: IKunTrigger;
disabled: boolean;
diff --git a/components/Tooltip/src/index.svelte b/components/Tooltip/src/index.svelte
index 8fd98c84..955fc745 100644
--- a/components/Tooltip/src/index.svelte
+++ b/components/Tooltip/src/index.svelte
@@ -1,5 +1,5 @@
-
+
{content}
diff --git a/docs/components/KPopover.md b/docs/components/KPopover.md
index 5bab3c4f..c5fe6bb3 100644
--- a/docs/components/KPopover.md
+++ b/docs/components/KPopover.md
@@ -50,6 +50,7 @@ Specify different trigger methods through the `trigger` attribute
| disabled | `boolean` | `false` | Disabled the popover |
| mouseEnterDelay | `number` | `200` | Delay in seconds, before `popover` is shown on mouse enter, unit `ms` |
| mouseLeaveDelay | `number` | `200` | Delay in seconds, before `popover` is shown on mouse enter, unit `ms` |
+| defaultOpen | `boolean` | `-` | Open `popover` by default |
| arrow | `boolean` | `true` | Display the arrow |
| cls | `string` | `-` | Additional class |
| attrs | `Record` | `{}` | Additional attributes |
diff --git a/docs/components/KTooltip.md b/docs/components/KTooltip.md
index a9f4d380..98d41b0b 100644
--- a/docs/components/KTooltip.md
+++ b/docs/components/KTooltip.md
@@ -44,11 +44,12 @@ Specify different trigger methods through the `trigger` attribute
## Tooltip Props
| Name | Type | Default | Description |
-| --------------- | ------------------------------------- | ------- | --------------------------------------------------------------------- |
+|-----------------|---------------------------------------|---------| --------------------------------------------------------------------- |
| placement | `'top' / 'left' / 'right' / 'bottom'` | `top` | Where the `tooltip` appears |
| trigger | `'manual' / 'click' / 'hover'` | `hover` | How `tooltip` are triggered |
| mouseEnterDelay | `number` | `200` | Delay in seconds, before `tooltip` is shown on mouse enter, unit `ms` |
| mouseLeaveDelay | `number` | `200` | Delay in seconds, before `tooltip` is shown on mouse enter, unit `ms` |
+| defaultOpen | `boolean` | `-` | Open `tooltip` by default |
| cls | `string` | `-` | Additional class |
| attrs | `Record` | `{}` | Additional attributes |
| content | `string` | `-` | `tooltip`'s content |