fix(pds-button): always render start/end slots for reliable content p…

[QuintonJason]

Description

The pds-button component was conditionally rendering <slot name="start"> and <slot name="end"> based on a synchronous DOM query (this.el.querySelectorAll) during render(). With Stencil's async task queue (taskQueue: 'async'), this created a race condition where hasSlotContent() could return false if light DOM children weren't yet queryable at render time. Since the component has no @State, slotchange listener, or MutationObserver, the slots were never placed in the shadow DOM and slotted content was never projected.

This was discovered in kajabi-products PR #48962 where using <pds-icon slot="start"> instead of the deprecated icon prop resulted in the icon not rendering.

The fix:

• Always render <slot name="start"> and <slot name="end"> in the shadow DOM (removing the hasSlotContent DOM query)
• Use CSS :has(::slotted(*)) to hide the wrapper <span> when no content is slotted, preventing empty flex gap space
• Deprecated icon prop and special variant behavior (filter, disclosure) remain unchanged

Fixes DSS-147

Type of change

• Bug fix (non-breaking change which fixes an issue)

How Has This Been Tested?

• unit tests
• e2e tests
• accessibility tests
• tested manually
• other:

Test Configuration:

• Pine versions: 3.16.2
• OS: macOS
• Browsers: Chrome
• Screen readers:
• Misc:

Fixes

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

[netlify]

✅ Deploy Preview for pine-design-system ready!

Name	Link
🔨 Latest commit	0678e14
🔍 Latest deploy log	https://app.netlify.com/projects/pine-design-system/deploys/698a5a77be5a1800081f24b1
😎 Deploy Preview	https://deploy-preview-668--pine-design-system.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

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