Copy button alignment

[maximiliani]

No description provided.

[Copilot]

Pull request overview

Updates the PID web component’s inline/expanded layout behavior (notably around copy-button placement/alignment and Safari text flow handling) while publishing a new 0.3.1 release across the monorepo with dependency/tooling bumps.

Changes:

• Adjust pid-component / pid-collapsible layout logic and CSS to improve inline flow and expanded behavior.
• Update generated typings/wrappers (Stencil + React) and bump package versions to 0.3.1.
• Upgrade key build/toolchain dependencies and raise Node versions used in CI/publish workflows.

Reviewed changes

Copilot reviewed 23 out of 25 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
somesy.toml	Bumps monorepo/project version to 0.3.1.
packages/stencil-library/web-types.json	Updates web-types version metadata to 0.3.1.
packages/stencil-library/stencil.config.ts	Switches PostCSS plugin import to @stencil-community/postcss.
packages/stencil-library/src/components/pid-component/pid-component.tsx	Adds expanded-state watcher + adjusts summary/copy-button markup/classes and toggle behavior.
packages/stencil-library/src/components/pid-component/pid-component.css	Replaces host styling selector with :host and removes prior Safari-specific hacks.
packages/stencil-library/src/components/pid-collapsible/pid-collapsible.tsx	Removes Safari clearfix injection and revises class/state styling logic for inline vs expanded modes.
packages/stencil-library/src/components/pid-collapsible/collapsible.css	Removes unconditional display:block/clear Safari rules; keeps Safari transform trick only.
packages/stencil-library/src/components.d.ts	Updates OneOf typing to improve prop/attr mutual exclusivity typing.
packages/stencil-library/somesy.toml	Bumps stencil package metadata version to 0.3.1.
packages/stencil-library/package.json	Bumps stencil package version + upgrades dependencies/devDependencies (Stencil, Tailwind, Storybook, TS, Vite, etc.).
packages/stencil-library/codemeta.json	Bumps version metadata and formats license array.
packages/stencil-library/CITATION.cff	Bumps citation version to 0.3.1.
packages/react-library/somesy.toml	Bumps react wrapper metadata version to 0.3.1.
packages/react-library/package.json	Bumps react wrapper version + upgrades TS/output-target deps (but keeps pid-component dep range unchanged).
packages/react-library/lib/components/stencil-generated/components.ts	Updates generated React component typings to include Stencil Components.* types.
packages/react-library/lib/components/stencil-generated/components.server.ts	Updates generated SSR entry typings/imports and adds a 'use client' directive.
packages/react-library/codemeta.json	Bumps version metadata and formats license array.
packages/react-library/CITATION.cff	Bumps citation version to 0.3.1.
package.json	Bumps root version and upgrades root dev deps + Vite.
codemeta.json	Bumps version metadata and formats license array.
CITATION.cff	Bumps citation version to 0.3.1.
.github/workflows/publish.yml	Raises publish workflow Node version to 24.
.github/workflows/npm-ci.yml	Updates CI matrix Node versions (20/22/24/25).
.github/workflows/deploy-storybook.yml	Raises Storybook deploy workflow Node version to 24.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The wrap-break-word class isn’t a Tailwind utility (the repo appears to use stock Tailwind via src/tailwind.css imports only). As a result, expanded summaries won’t wrap as intended. Use Tailwind’s break-words/break-all + whitespace-normal (or add a custom utility if you really need this class).

Suggested change

	class={`inline-flex items-center overflow-x-auto font-mono text-sm font-medium select-all ${this.isExpanded ? 'flex-wrap overflow-visible wrap-break-word' : 'flex-nowrap whitespace-nowrap'}`}
	class={`inline-flex items-center overflow-x-auto font-mono text-sm font-medium select-all ${this.isExpanded ? 'flex-wrap overflow-visible whitespace-normal break-words' : 'flex-nowrap whitespace-nowrap'}`}

[Copilot]

items-end only affects a flex container (align-items). Here it’s applied to the copy-button element, which is a flex item inside the summary-actions flex row, so it won’t change the button’s vertical alignment. If the goal is to align the button within its parent row, use an item-level utility (e.g., self-end/my-auto) or adjust the parent container’s alignment.

Suggested change

	class="items-end shrink-0"
	class="self-end shrink-0"

[Copilot]

The new expanded host attribute is described as being used by :host([expanded]) in this component’s CSS, but pid-component.css currently has no such selector (and is only ~20 lines). Either add the matching :host([expanded]) { … } rule (if the attribute is meant for internal styling) or adjust this comment to reflect the actual consumer-facing purpose of the attribute.

Suggested change

	* This attribute is used by :host([expanded]) in CSS to float the component
	* so surrounding text reflows around it.
	* This mirrors the component's expanded state on the host for consumer-facing styling
	* or external selectors, rather than for an internal :host([expanded]) rule in this file.

[Copilot]

components.server.ts is the package’s Next/SSR entrypoint (exported as ./next), but it’s now marked with 'use client'. That forces this module to run as a client component in Next.js and defeats SSR/hydration, likely breaking server rendering. Remove 'use client' from the server entrypoint and keep the client directive only in the client-side components.ts bundle.

Suggested change

'use client';

[Copilot]

The React wrapper package was bumped to 0.3.1, but it still depends on @kit-data-manager/pid-component: ^0.3.0. This can publish a wrapper version that doesn’t actually pull in the matching web component version. Bump this dependency range to ^0.3.1 (or whatever policy you use for synchronized releases).

Suggested change

	"@kit-data-manager/pid-component": "^0.3.0",
	"@kit-data-manager/pid-component": "^0.3.1",