From 5fae64f0bdd2e349694e93a895cc4a1947eb4740 Mon Sep 17 00:00:00 2001
From: Long Pham <69810988+phamduylong@users.noreply.github.com>
Date: Tue, 4 Feb 2025 21:47:48 +0200
Subject: [PATCH 1/3] Add environment info to issue template (#3191)
---
.github/ISSUE_TEMPLATE/bug_report.yml | 20 ++++++++++++++++++++
1 file changed, 20 insertions(+)
diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml
index 1a9375fbce..54e3ca6375 100644
--- a/.github/ISSUE_TEMPLATE/bug_report.yml
+++ b/.github/ISSUE_TEMPLATE/bug_report.yml
@@ -29,6 +29,26 @@ body:
id: reproduction
attributes:
label: Link to Reproduction / Stackblitz
+ - type: textarea
+ attributes:
+ label: Environment Information
+ description: Relevant information about your environment. Use `npx envinfo --system --npmPackages "@skeletonlabs/*" --binaries --browsers` to get this information.
+ placeholder: |
+ System:
+ OS: Windows 11 10.0.26100
+ CPU: (12) x64 12th Gen Intel(R) Core(TM) i5-12400
+ Memory: 4.72 GB / 15.78 GB
+ Binaries:
+ Node: 22.11.0 - C:\Program Files\nodejs\node.EXE
+ Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD
+ npm: 10.2.0 - C:\Program Files\nodejs\npm.CMD
+ pnpm: 9.6.0 - ~\AppData\Local\pnpm\pnpm.CMD
+ Browsers:
+ Edge: Chromium (130.0.2849.46)
+ Internet Explorer: 11.0.26100.1882
+ npmPackages:
+ @skeletonlabs/skeleton: ^3.0.0-next.10 => 3.0.0-next.10
+ @skeletonlabs/skeleton-react: ^1.0.0-next.13 => 1.0.0-next.13
- type: textarea
attributes:
label: More Information
From ae0e3fd10adf361ceb383cb3cb93e89a781910ee Mon Sep 17 00:00:00 2001
From: Long Pham <69810988+phamduylong@users.noreply.github.com>
Date: Fri, 7 Feb 2025 20:11:00 +0200
Subject: [PATCH 2/3] Tooltip arrow (#3185)
---
.changeset/brave-numbers-glow.md | 5 +++++
.../src/lib/components/Tooltip/Tooltip.svelte | 18 ++++++++++++++++++
.../src/lib/components/Tooltip/types.ts | 10 ++++++++++
.../components/popover/ExampleTooltip.svelte | 1 +
4 files changed, 34 insertions(+)
create mode 100644 .changeset/brave-numbers-glow.md
diff --git a/.changeset/brave-numbers-glow.md b/.changeset/brave-numbers-glow.md
new file mode 100644
index 0000000000..df5bfe5098
--- /dev/null
+++ b/.changeset/brave-numbers-glow.md
@@ -0,0 +1,5 @@
+---
+'@skeletonlabs/skeleton-svelte': patch
+---
+
+feat: Implement `arrow` for Tooltip
diff --git a/packages/skeleton-svelte/src/lib/components/Tooltip/Tooltip.svelte b/packages/skeleton-svelte/src/lib/components/Tooltip/Tooltip.svelte
index b1109c8932..d99f491ee4 100644
--- a/packages/skeleton-svelte/src/lib/components/Tooltip/Tooltip.svelte
+++ b/packages/skeleton-svelte/src/lib/components/Tooltip/Tooltip.svelte
@@ -8,6 +8,7 @@
let {
open = $bindable(false),
+ arrow = false,
// Base
base = '',
classes = '',
@@ -23,6 +24,10 @@
contentBase = '',
contentBackground = '',
contentClasses = '',
+ // Arrow
+ arrowBase = '',
+ arrowBackground = '!bg-white',
+ arrowClasses = '',
// Snippets
trigger,
content,
@@ -64,6 +69,12 @@
{#if api.open}
+
+ {#if arrow}
+
+ {/if}
{@render content?.()}
@@ -71,3 +82,10 @@
{/if}
+
+
diff --git a/packages/skeleton-svelte/src/lib/components/Tooltip/types.ts b/packages/skeleton-svelte/src/lib/components/Tooltip/types.ts
index 7e34c26755..5d28004646 100644
--- a/packages/skeleton-svelte/src/lib/components/Tooltip/types.ts
+++ b/packages/skeleton-svelte/src/lib/components/Tooltip/types.ts
@@ -4,6 +4,8 @@ import * as tooltip from '@zag-js/tooltip';
export interface TooltipProps extends Omit
{
/** Set the open state of the tooltip. */
open?: boolean;
+ /** Enable display of the popover arrow. */
+ arrow?: boolean;
// Base ---
/** Set base classes for the root element. */
@@ -35,6 +37,14 @@ export interface TooltipProps extends Omit {
/** Provide arbitrary styles for the content. */
contentClasses?: string;
+ // Arrow ---
+ /** Set base classes for the arrow. */
+ arrowBase?: string;
+ /** Set background classes for the arrow. */
+ arrowBackground?: string;
+ /** Provide arbitrary classes for the arrow. */
+ arrowClasses?: string;
+
// Snippets ---
/** Provide the template contents inside the trigger button. */
trigger?: Snippet;
diff --git a/sites/next.skeleton.dev/src/examples/components/popover/ExampleTooltip.svelte b/sites/next.skeleton.dev/src/examples/components/popover/ExampleTooltip.svelte
index e89b370733..51aaf4a553 100644
--- a/sites/next.skeleton.dev/src/examples/components/popover/ExampleTooltip.svelte
+++ b/sites/next.skeleton.dev/src/examples/components/popover/ExampleTooltip.svelte
@@ -9,6 +9,7 @@
triggerBase="underline"
contentBase="card preset-filled p-4"
openDelay={200}
+ arrow
>
{#snippet trigger()}Hover Me{/snippet}
{#snippet content()}This is a tooltip.{/snippet}
From 443935031d5669f64de6f107c8877768b7084fef Mon Sep 17 00:00:00 2001
From: Long Pham <69810988+phamduylong@users.noreply.github.com>
Date: Fri, 7 Feb 2025 20:15:03 +0200
Subject: [PATCH 3/3] Update issue template to set type automatically (#3196)
---
.github/ISSUE_TEMPLATE/bug_report.yml | 1 +
.github/ISSUE_TEMPLATE/docs_issue.yml | 1 +
.github/ISSUE_TEMPLATE/feature_request.yml | 1 +
3 files changed, 3 insertions(+)
diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml
index 54e3ca6375..3b7320fc2b 100644
--- a/.github/ISSUE_TEMPLATE/bug_report.yml
+++ b/.github/ISSUE_TEMPLATE/bug_report.yml
@@ -1,6 +1,7 @@
name: 🐞 Bug
description: Report an issue or bug
labels: [bug]
+type: Bug
body:
- type: textarea
attributes:
diff --git a/.github/ISSUE_TEMPLATE/docs_issue.yml b/.github/ISSUE_TEMPLATE/docs_issue.yml
index 0425522cd7..90f72d4828 100644
--- a/.github/ISSUE_TEMPLATE/docs_issue.yml
+++ b/.github/ISSUE_TEMPLATE/docs_issue.yml
@@ -1,6 +1,7 @@
name: 📗 Report Docs Issue
description: Use this to report a typo or incorrect information.
labels: [documentation]
+type: Task
body:
- type: input
id: link
diff --git a/.github/ISSUE_TEMPLATE/feature_request.yml b/.github/ISSUE_TEMPLATE/feature_request.yml
index 7fc6da0622..ea1e5a0b64 100644
--- a/.github/ISSUE_TEMPLATE/feature_request.yml
+++ b/.github/ISSUE_TEMPLATE/feature_request.yml
@@ -1,6 +1,7 @@
name: 🛠️ Request New Feature
description: Let us know what you would like to see added.
labels: ['feature request']
+type: Feature
body:
- type: textarea
id: description