Share

Share renders a "Copy & share" dropdown that lets users copy the page as markdown for LLMs, open the page in ChatGPT or Claude with a pre-filled prompt, or share it on X (Twitter) or LinkedIn. Designed for blog posts and documentation pages.

Behaviors

This component supports the following behaviors:

Properties

chatGptDescription

default: "Ask questions about this page"

Secondary text under the Open in ChatGPT label.

chatGptLabel

default: "Open in ChatGPT"

Label of the Open in ChatGPT menu item.

claudeDescription

default: "Ask questions about this page"

Secondary text under the Open in Claude label.

claudeLabel

default: "Open in Claude"

Label of the Open in Claude menu item.

copiedLabel

default: "Copied!"

Label shown briefly after copying succeeds.

copyDescription

default: "Copy page as markdown for LLMs"

Secondary text under the Copy page label.

copyLabel

default: "Copy page"

Label of the Copy page menu item.

label

default: "Copy page"

Label shown on the primary (left) split-button. Clicking the primary button copies the page; clicking the chevron opens the share menu.

linkedInDescription

default: "Start conversation"

Secondary text under the Share in LinkedIn label.

linkedInLabel

default: "Share in LinkedIn"

Label of the Share in LinkedIn menu item.

markdownContent

Markdown content placed on the clipboard by the Copy page action.

pageTitle

Title used as the share text on social platforms. Defaults to document.title.

pageUrl

URL to share. Defaults to window.location.href when not provided.

showChatGpt

default: true

Whether to show the Open in ChatGPT menu item.

showClaude

default: true

Whether to show the Open in Claude menu item.

showCopy

default: true

Whether to show the Copy page menu item.

showLinkedIn

default: true

Whether to show the Share in LinkedIn menu item.

showTwitter

default: true

Whether to show the Share in X (Twitter) menu item.

toggleAriaLabel

default: "Open share menu"

Accessible label for the chevron toggle button.

twitterDescription

default: "Start conversation"

Secondary text under the Share in X label.

twitterLabel

default: "Share in X (Twitter)"

Label of the Share in X menu item.

Events

This component does not have any events.

Exposed Methods

This component does not expose any methods.

Styling

Theme Variables