feat(feedback-pulse): add FeedbackPulse CES survey popover (WDS-98)#226
Open
krnvch wants to merge 20 commits into
Open
feat(feedback-pulse): add FeedbackPulse CES survey popover (WDS-98)#226krnvch wants to merge 20 commits into
krnvch wants to merge 20 commits into
Conversation
Foundation for the new FeedbackPulse (CES survey) component — includes architecture spec, data ops design, and usage framework docs. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
The card carried both `fixed` and `relative` position utilities; Tailwind's cascade lets `relative` win, so the popover rendered in normal flow (top-left, offset by its insets) instead of pinned bottom-right. `fixed` alone already establishes the containing block the absolute timeout bar needs, so `relative` was both redundant and the source of the bug. Caught in browser verification; jsdom unit tests don't compute layout so it passed CI-style checks. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Story title 'Overlay/FeedbackPulse' sanitizes to 'overlay-feedbackpulse' (Storybook does not split camelCase), not 'overlay-feedback-pulse'. The wrong id would 404 every e2e test in CI. Verified against Storybook's index.json and sibling ids (inputs-numberinput, navigation-segmentedtabs). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Entering the Submitted phase unmounted the rating-phase Send/Close button without moving focus anywhere, so keyboard users landed on <body>. Focus the Submitted-phase Close button when the phase flips, giving focus a home and letting the adjacent aria-live confirmation be read on landing. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
FeedbackPulse is a closed-facade popover: its five interactive nodes (score radios, textarea, Send, Close) are internal and not consumer-addressable, and it deliberately exposes no arbitrary- attribute passthrough. Per the metrics contract this is the sanctioned closed-target -> consumer-callback pattern (onSubmit/onOpenChange), not a violation, but it still owes the mandatory ANALYTICS_GAPS.md declaration sibling components (Slider, InlineEdit, Table) ship. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
… in root - Center the Playground trigger button in the canvas (was snapped top-left). - Wrap the Rating story so a node stays in #storybook-root: FeedbackPulse portals its content to document.body, which otherwise left the root empty and hung the e2e story loader's render check. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
…lign submitted to Figma Design-review polish (Figma node 11669-905): - Animate Rating->Feedback grow via a grid-rows reveal, and Feedback->Submitted shrink via a height FLIP (with an rAF failsafe so the card can't stick at the pre-collapse height if a frame never runs). - Reveal container drops overflow clipping once the grow settles so the comment textarea's focus ring is no longer clipped. - Close button now shows a 'Close' tooltip in both phases (mirrors ToastClose). - Submitted state matches Figma: plain green Check icon (was CircleCheck) and the timeout bar uses states/primary-default-alt so the left-to-right fill is visible (was an invisible white bar). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
krnvch
changed the title
…orts The package barrel's FeedbackPulse export block had type names out of order (FeedbackPulseProps before FeedbackPulseCloseReason); biome's organizeImports flags it as an error and failed CI's lint check. Local lint had only been run scoped to the component folder, which excludes src/index.ts. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Collaborator
Author
|
@ipwallarm @vpavlenko-w cheknite pls, mne na vstreche pokazat nado budet, ty! |
…reenshots] Trigger CI's Docker/Playwright screenshot-update job to generate the FeedbackPulse e2e visual baselines (which don't exist yet) and commit them back to this branch, greening E2E shard 1. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
FeedbackPulse — CES survey popover (WDS-98)
A controlled, self-positioned Customer Effort Score (CES) survey popover. Front-end facade only — no network/storage/analytics; the consumer owns visibility (
open/onOpenChange) and receives the result (onSubmit).Ticket: WDS-98 · Figma: node
8029-72686(+ Submitted state11669-905)Phases
Rating (1–5 scale) → Feedback (score picked → optional comment + Send) → Submitted (confirmation + auto-dismiss timeout bar).
What's in it
opengoes false→true.showComment); emitsonSubmit({ score, comment? }).onOpenChange(open, reason).prefers-reduced-motion.ToggleButton,Textarea,Button,Tooltip, icons.How to review
Overlay/FeedbackPulse(Playground = interactive, Rating = static).pnpm --filter=@wallarm-org/design-system test:run src/components/FeedbackPulse/(15 tests).src/components/FeedbackPulse/FeedbackPulse.e2e.ts.Status / notes
[update-screenshots]trigger, so the e2e-visual checks will be red until then.onSubmit/onOpenChangecallbacks (no DOM passthrough by design); documented inFeedbackPulse/ANALYTICS_GAPS.mdper the metrics contract.The
feedback-pulse-framework.md/feedback-pulse-data-ops.mddocs in the folder are deferred scope (product governance + backend), not part of this component.🤖 Generated with Claude Code