feat: add components to design system batch #1 by isadorable-png · Pull Request #1703 · blockful/anticapture

isadorable-png · 2026-03-12T14:32:39Z

No description provided.

v1.7.2

v1.7.3

vercel · 2026-03-12T14:32:45Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
anticapture	Ready	Preview, Comment	Mar 12, 2026 7:30pm
anticapture-storybook	Ready	Preview, Comment	Mar 12, 2026 7:30pm

claude · 2026-03-12T14:32:59Z

Claude encountered an error —— View job

I'll analyze this and get back to you.

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: decff100ad

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

chatgpt-codex-connector · 2026-03-12T14:39:19Z

apps/dashboard/shared/components/design-system/combobox/combobox-item/ComboboxItem.tsx

+    <div
+      role="option"
+      aria-selected={isSelected}
+      aria-disabled={disabled}
+      onClick={disabled ? undefined : onClick}


Make combobox options keyboard-focusable

These options are rendered as plain div elements with only mouse handlers, so once the listbox opens, keyboard users cannot focus an option or select it with Enter/Space. In practice this makes the combobox unusable without a mouse and contradicts the role="listbox"/role="option" semantics exposed by this component.

Useful? React with 👍 / 👎.

chatgpt-codex-connector · 2026-03-12T14:39:19Z

apps/dashboard/app/globals.css

+      transform: translateY(20px);
+    }
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }


Preserve centering transform in modal keyframes

The modal content is centered with -translate-x-1/2 -translate-y-1/2, but these keyframes set transform to only translateY(...), which overrides the centering transform during open/close animation. This causes the dialog to animate from an offset position (shifted right/down) instead of staying centered.

Useful? React with 👍 / 👎.

chatgpt-codex-connector · 2026-03-12T14:39:19Z

apps/dashboard/shared/components/design-system/tabs/tab/Tab.tsx

+    <button
+      role="tab"
+      aria-selected={isActive}
+      onClick={onClick}


Set tab button type to avoid form submission

This <button> omits type="button", so inside any surrounding <form> it defaults to type="submit". Clicking a tab in that context will submit the form unexpectedly (and can trigger navigation/validation) instead of only changing tab state.

Useful? React with 👍 / 👎.

apps/dashboard/shared/components/design-system/combobox/combobox-item/ComboboxItem.figma.tsx

apps/dashboard/shared/components/design-system/combobox/combobox-item/ComboboxItem.tsx

brunod-e · 2026-03-12T16:48:09Z

apps/dashboard/shared/components/design-system/combobox/Combobox.stories.tsx

+    value: "uniswap",
+    label: "Uniswap",
+    icon: (
+      <CrownIcon style={{ width: 14, height: 14 }} className="text-highlight" />


same here do not use inline styles

brunod-e · 2026-03-12T16:49:25Z

apps/dashboard/shared/components/design-system/combobox/Combobox.tsx

+  value,
+  placeholder = "Select…",
+  onValueChange,
+  disabled = false,


change this to isDisabled to follow dashboard patterns

brunod-e · 2026-03-12T16:50:02Z

apps/dashboard/shared/components/design-system/combobox/Combobox.tsx

+              "text-secondary shrink-0 transition-transform duration-150",
+              open && "rotate-180",
+            )}
+            style={{ width: 14, height: 14 }}


no inline styles

brunod-e · 2026-03-12T16:53:23Z

apps/dashboard/shared/components/design-system/modal/modal-footer/ModalFooter.stories.tsx

+  },
+  decorators: [
+    (Story) => (
+      <div className="w-[600px]">


avoid explicit number like this, use tailwind classes

brunod-e · 2026-03-12T16:54:22Z

apps/dashboard/shared/components/design-system/modal/modal-footer/ModalFooter.tsx

+  actionsNumber = "1",
+  cancelLabel = "Cancel",
+  confirmLabel = "Confirm",


we dont need the actionsNumber prop, because if you pass cancelLabel you will have a cancel button, the same with confirm

brunod-e · 2026-03-12T16:58:58Z

apps/dashboard/shared/components/design-system/progress-bar/ProgressBar.stories.tsx

+  },
+  decorators: [
+    (Story) => (
+      <div className="w-[270px]">


prefer tailwind classes

brunod-e · 2026-03-12T17:00:40Z

apps/dashboard/shared/components/design-system/progress-bar/ProgressBar.tsx

+  const labelEl = label ? (
+    <span className="text-secondary shrink-0 whitespace-nowrap text-sm leading-5">
+      {label}
+    </span>
+  ) : null;
+
+  const trackEl = (


what EL means? try to make this more legible

brunod-e · 2026-03-12T17:02:53Z

...d/components/design-system/segmented-control/segmented-control-item/SegmentedControlItem.tsx

+      )}
+    >
+      {label}
+      {items !== undefined && (


Suggested change

{items !== undefined && (

{!!items && items.length > 0 && (

…anticapture into feat/ds-new-components-batch-1

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 33541861ee

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

chatgpt-codex-connector · 2026-03-12T18:08:18Z

apps/dashboard/shared/components/design-system/modal/modal-footer/ModalFooter.tsx

+        className,
+      )}
+    >
+      <Button variant="outline" size="md" onClick={onCancel}>


Set cancel action to non-submit button

This footer action is rendered through Button, which ultimately outputs a native <button> without an explicit type; in a surrounding <form>, that defaults to submit. As a result, clicking Cancel can trigger unintended form submission/navigation instead of only dismissing the modal, which is especially likely when modal content is used in form workflows.

Useful? React with 👍 / 👎.

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 09858c7438

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

chatgpt-codex-connector · 2026-03-12T19:37:42Z

apps/dashboard/shared/components/design-system/combobox/Combobox.tsx

+      </PopoverPrimitive.Trigger>
+
+      {/* Dropdown content */}
+      <PopoverPrimitive.Content


Wrap combobox content in Popover portal

The dropdown is rendered as plain PopoverPrimitive.Content inside the local DOM tree, so when this component is placed inside containers with clipping (overflow-hidden, scroll regions, transformed parents), the option list can be partially or fully hidden even though the trigger is visible. That makes selection impossible in common dashboard layouts and is why other popovers here use a portal.

Useful? React with 👍 / 👎.

chatgpt-codex-connector · 2026-03-12T19:37:42Z

apps/dashboard/shared/components/design-system/tabs/pill-tab-group/PillTabGroup.tsx

+        <PillTab
+          key={tab.value}
+          label={tab.label}
+          isActive={activeTab === tab.value}
+          onClick={() => onTabChange?.(tab.value)}


Pass counter data through PillTabGroup

PillTab supports a counter payload, but PillTabGroup only forwards label and active state, so counter metadata is silently dropped whenever tabs are rendered through the group abstraction. In practice, grouped pill tabs cannot show voter/VP/percentage values even if callers have that data.

Useful? React with 👍 / 👎.

pikonha · 2026-03-13T17:42:55Z

.agents/skills/anticapture-design-system/references/new-component-checklist.md

@@ -0,0 +1,154 @@
+# New Component Checklist


missing name and description as defined by agent skills standard

pikonha and others added 3 commits March 4, 2026 13:13

Merge pull request #1686 from blockful/dev

72d8f89

v1.7.2

Merge pull request #1691 from blockful/dev

0aa2c13

v1.7.3

feat: add components to design system

decff10

isadorable-png requested review from brunod-e and pikonha as code owners March 12, 2026 14:32

isadorable-png changed the title ~~feat: add components to design system~~ feat: add components to design system batch #1 Mar 12, 2026

vercel bot deployed to Preview – anticapture March 12, 2026 14:32 View deployment

github-actions bot added the Dashboard label Mar 12, 2026

isadorable-png self-assigned this Mar 12, 2026

chatgpt-codex-connector bot reviewed Mar 12, 2026

View reviewed changes

Merge branch 'dev' into feat/ds-new-components-batch-1

ba0e5d0

vercel bot deployed to Preview – anticapture-storybook March 12, 2026 15:50 View deployment

vercel bot deployed to Preview – anticapture March 12, 2026 15:51 View deployment

brunod-e changed the base branch from main to dev March 12, 2026 16:44

brunod-e approved these changes Mar 12, 2026

View reviewed changes

brunod-e self-requested a review March 12, 2026 17:06

isadorable-png added 4 commits March 12, 2026 14:16

fix: skip icons in code connect

01090c6

Merge branch 'feat/ds-new-components-batch-1' of github.com:blockful/…

a814144

…anticapture into feat/ds-new-components-batch-1

fix: figma url

6310516

fix: revert changes and exclude undesired elements

3354186

vercel bot deployed to Preview – anticapture-storybook March 12, 2026 18:02 View deployment

vercel bot deployed to Preview – anticapture March 12, 2026 18:02 View deployment

chatgpt-codex-connector bot reviewed Mar 12, 2026

View reviewed changes

fix: raw values, improve code

09858c7

vercel bot deployed to Preview – anticapture-storybook March 12, 2026 19:30 View deployment

vercel bot deployed to Preview – anticapture March 12, 2026 19:30 View deployment

chatgpt-codex-connector bot reviewed Mar 12, 2026

View reviewed changes

pikonha reviewed Mar 13, 2026

View reviewed changes

Conversation

isadorable-png commented Mar 12, 2026

Uh oh!

vercel bot commented Mar 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

claude bot commented Mar 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector bot Mar 12, 2026

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector bot Mar 12, 2026

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector bot Mar 12, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector bot Mar 12, 2026

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector bot Mar 12, 2026

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector bot Mar 12, 2026

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

vercel bot commented Mar 12, 2026 •

edited

Loading

claude bot commented Mar 12, 2026 •

edited

Loading