Skip to content

Conversation

@codegangsta
Copy link
Collaborator

Description

CleanShot 2025-12-15 at 17 14 29@2x

This PR adds VS Code autocomplete support for Pine Design System web components. When developers use Pine
components in their HTML/JSX, VS Code, Cursor, Windsurf, Zed and neovim (via vscode-html-language-server) will now provide intelligent autocomplete suggestions including:

  • Component tag names with descriptions
  • Component attributes with types, defaults, and enum values
  • Slots, CSS parts, and events documentation
  • Links to Storybook documentation for each component

The feature consists of two main parts:

  1. Custom Data Generator - A Stencil output target that generates VS Code HTML custom data during build
  2. VS Code Settings Patcher - A postinstall script that automatically configures VS Code to use the custom
    data

New dependencies:

  • @testing-library/dom (peer dev dependency - added by lockfile)

Type of change

  • New feature (non-breaking change which adds functionality)

How Has This Been Tested?

  • tested manually

Test Configuration:

  • Pine versions: 3.11.1
  • OS: macOS
  • Browsers: N/A (VS Code feature)
  • Screen readers: N/A
  • Misc: VS Code with HTML Language Server

Checklist:

  • My code follows the style guidelines of this project
  • I have performed a self-review of my code
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes to the documentation
  • My changes generate no new warnings
  • I have added tests that prove my fix is effective or that my feature works
  • New and existing tests pass locally with my changes
  • Design has QA'ed and approved this PR

@github-actions github-actions bot added the package: core Changes have been made to the Core package label Dec 16, 2025
@netlify
Copy link

netlify bot commented Dec 16, 2025

Deploy Preview for pine-design-system ready!

Name Link
🔨 Latest commit c1b6386
🔍 Latest deploy log https://app.netlify.com/projects/pine-design-system/deploys/6940b2b7c12b150008d92474
😎 Deploy Preview https://deploy-preview-614--pine-design-system.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Copy link
Member

@pixelflips pixelflips left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Thanks so much for this addition!

@codegangsta codegangsta merged commit f84a6d6 into main Dec 16, 2025
15 checks passed
@codegangsta codegangsta deleted the feat/add-autocomplete branch December 16, 2025 17:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package: core Changes have been made to the Core package

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants