Skip to content

Format icon component usage and nucleo icon definitions #4142

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
devkiran merged 1 commit into from
Jul 8, 2026
Merged

Format icon component usage and nucleo icon definitions #4142

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 8 additions & 2 deletions apps/web/app/(ee)/admin.dub.co/(dashboard)/partners/fraud/review-fraud-alert-sheet.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -255,7 +255,10 @@ function SheetContent({
<Icon className="size-3 shrink-0" />
<span>{value}</span>
{verified && (
<BadgeCheck2 variant="fill" className="size-3 text-green-600" />
<BadgeCheck2
variant="fill"
className="size-3 text-green-600"
/>
)}
</Link>
}
Expand All @@ -269,7 +272,10 @@ function SheetContent({
<Icon className="size-3" />
<span className="sr-only">{label}</span>
{verified && (
<BadgeCheck2 variant="fill" className="absolute -right-1 -top-1 size-3 text-green-600" />
<BadgeCheck2
variant="fill"
className="absolute -right-1 -top-1 size-3 text-green-600"
/>
)}
</Link>
</Tooltip>
Expand Down
10 changes: 8 additions & 2 deletions apps/web/app/(ee)/admin.dub.co/(dashboard)/partners/trusted/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -415,7 +415,10 @@ export default function PartnersPage() {
<Icon className="size-3 shrink-0" />
<span>{value}</span>
{verified && (
<BadgeCheck2 variant="fill" className="size-3 text-green-600" />
<BadgeCheck2
variant="fill"
className="size-3 text-green-600"
/>
)}
</Link>
}
Expand All @@ -430,7 +433,10 @@ export default function PartnersPage() {
<Icon className="size-3" />
<span className="sr-only">{label}</span>
{verified && (
<BadgeCheck2 variant="fill" className="absolute -right-1 -top-1 size-3 text-green-600" />
<BadgeCheck2
variant="fill"
className="absolute -right-1 -top-1 size-3 text-green-600"
/>
)}
</Link>
</Tooltip>
Expand Down
9 changes: 6 additions & 3 deletions apps/web/app/(ee)/app.dub.co/(new-program)/[slug]/program/new/rewards/form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -202,7 +202,8 @@ export function Form() {
{description}
</span>
</div>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"-mr-px -mt-px flex size-4 scale-75 items-center justify-center rounded-full opacity-0 transition-[transform,opacity] duration-150",
isSelected && "scale-100 opacity-100",
Expand Down Expand Up @@ -283,7 +284,8 @@ export function Form() {
{COMMISSION_STRUCTURE_DESCRIPTIONS[value]}
</span>
</div>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"-mr-px -mt-px flex size-4 scale-75 items-center justify-center rounded-full opacity-0 transition-[transform,opacity] duration-150",
isSelected && "scale-100 opacity-100",
Expand Down Expand Up @@ -381,7 +383,8 @@ export function Form() {
{description}
</span>
</div>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"-mr-px -mt-px flex size-4 scale-75 items-center justify-center rounded-full opacity-0 transition-[transform,opacity] duration-150",
isSelected && "scale-100 opacity-100",
Expand Down
6 changes: 4 additions & 2 deletions apps/web/app/(ee)/app.dub.co/embed/referrals/bounties/submission-fields.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -314,7 +314,8 @@ export function EmbedSocialUrlField({
: "text-content-muted",
)}
>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"size-2.5 transition-opacity",
isPostedFromYourAccount
Expand All @@ -331,7 +332,8 @@ export function EmbedSocialUrlField({
isAfterStartDate ? "text-content-success" : "text-content-muted",
)}
>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"size-2.5 transition-opacity",
isAfterStartDate
Expand Down
5 changes: 4 additions & 1 deletion apps/web/app/(ee)/partners.dub.co/(apply)/[programSlug]/(default)/apply/success/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -161,7 +161,10 @@ export default async function SuccessPage(props: {
src={program.logo || `${OG_AVATAR_URL}${program.name}`}
alt={`${program.name} logo`}
/>
<Bolt variant="fill" className="shrink-0 text-[var(--brand)] opacity-30" />
<Bolt
variant="fill"
className="shrink-0 text-[var(--brand)] opacity-30"
/>
<Logo className="size-10 shrink-0" />
</div>
)}
Expand Down
3 changes: 2 additions & 1 deletion ...rd)/[slug]/(ee)/program/groups/[groupSlug]/links/add-edit-group-additional-link-modal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -283,7 +283,8 @@ function AddDestinationUrlModalContent({
{type.recommended && (
<Badge variant="blueGradient">Recommended</Badge>
)}
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"-mr-px -mt-px flex size-4 scale-75 items-center justify-center rounded-full opacity-0 transition-[transform,opacity] duration-150",
isSelected && "scale-100 opacity-100",
Expand Down
3 changes: 2 additions & 1 deletion ...p.dub.co/(dashboard)/[slug]/(ee)/program/groups/[groupSlug]/links/group-link-settings.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -225,7 +225,8 @@ function GroupLinkSettingsForm({ group }: { group: GroupProps }) {
{type.recommended && (
<Badge variant="blueGradient">Recommended</Badge>
)}
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"-mr-px -mt-px flex size-4 scale-75 items-center justify-center rounded-full opacity-0 transition-[transform,opacity] duration-150",
isSelected && "scale-100 opacity-100",
Expand Down
10 changes: 8 additions & 2 deletions apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/network/network-partner-card.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -351,7 +351,10 @@ function PlatformStatCard({
className={cn("size-3.5", !value && "text-content-subtle opacity-40")}
/>
{verified && (
<BadgeCheck2 variant="fill" className="absolute -right-1.5 -top-1.5 size-3 text-green-600" />
<BadgeCheck2
variant="fill"
className="absolute -right-1.5 -top-1.5 size-3 text-green-600"
/>
)}
</div>
<span
Expand Down Expand Up @@ -435,7 +438,10 @@ function PlatformStatTooltipContent({
<div className="text-content-subtle border-border-subtle flex items-center gap-1.5 border-t px-3 py-1.5 font-medium">
{verifiedAt ? (
<>
<BadgeCheck2 variant="fill" className="size-3 shrink-0 text-green-600" />
<BadgeCheck2
variant="fill"
className="size-3 shrink-0 text-green-600"
/>
Verified {timeAgo(verifiedAt, { withAgo: true })}
</>
) : (
Expand Down
9 changes: 6 additions & 3 deletions apps/web/app/app.dub.co/(onboarding)/onboarding/(steps)/program/reward/form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -206,7 +206,8 @@ export function Form() {
{description}
</span>
</div>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"-mr-px -mt-px flex size-4 scale-75 items-center justify-center rounded-full opacity-0 transition-[transform,opacity] duration-150",
isSelected && "scale-100 opacity-100",
Expand Down Expand Up @@ -290,7 +291,8 @@ export function Form() {
{shortDescription}
</span>
</div>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"-mr-px -mt-px flex size-4 scale-75 items-center justify-center rounded-full opacity-0 transition-[transform,opacity] duration-150",
isSelected && "scale-100 opacity-100",
Expand Down Expand Up @@ -385,7 +387,8 @@ export function Form() {
{description}
</span>
</div>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"-mr-px -mt-px flex size-4 scale-75 items-center justify-center rounded-full opacity-0 transition-[transform,opacity] duration-150",
isSelected && "scale-100 opacity-100",
Expand Down
4 changes: 3 additions & 1 deletion apps/web/lib/zod/schemas/partners.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -189,7 +189,9 @@ export const getPartnersQuerySchema = z
search: z
.string()
.optional()
.describe("A search query to filter partners by ID, name, email, or company name.")
.describe(
"A search query to filter partners by ID, name, email, or company name.",
)
.meta({ example: "john" }),
})
.extend(getPaginationQuerySchema({ pageSize: PARTNERS_MAX_PAGE_SIZE }));
Expand Down
5 changes: 4 additions & 1 deletion apps/web/ui/integrations/integration-status-badge.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,10 @@ export function IntegrationStatusBadge({
<Tooltip
content={
<div className="flex max-w-xs items-start gap-1.5 p-3">
<BadgeCheck2 variant="fill" className="mt-0.5 size-5 shrink-0 text-blue-500" />
<BadgeCheck2
variant="fill"
className="mt-0.5 size-5 shrink-0 text-blue-500"
/>
<div className="flex flex-col gap-1">
<span className="text-sm font-semibold text-neutral-900">
Verified Integration
Expand Down
3 changes: 2 additions & 1 deletion apps/web/ui/modals/link-conversion-tracking-modal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,8 @@ function LinkConversionTrackingModalInner({
<span className="font-medium">{option.label}</span>
<span>{option.description}</span>
</div>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"-mr-px -mt-px flex size-4 scale-75 items-center justify-center rounded-full opacity-0 transition-[transform,opacity] duration-150",
isSelected && "scale-100 opacity-100",
Expand Down
6 changes: 4 additions & 2 deletions apps/web/ui/partners/bounties/bounty-social-content.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,8 @@ function SocialContentRequirementChecks({
isPostedFromYourAccount ? "text-green-600" : "text-neutral-400",
)}
>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"size-2.5 transition-opacity",
isPostedFromYourAccount ? "text-green-600" : "text-neutral-200",
Expand All @@ -59,7 +60,8 @@ function SocialContentRequirementChecks({
isAfterStartDate ? "text-green-600" : "text-neutral-400",
)}
>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"size-2.5 transition-opacity",
isAfterStartDate ? "text-green-600" : "text-neutral-200",
Expand Down
3 changes: 2 additions & 1 deletion apps/web/ui/partners/discounts/add-edit-discount-sheet.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -355,7 +355,8 @@ function DiscountSheetContent({
<span className="font-medium">{label}</span>
<span>{description}</span>
</div>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"-mr-px -mt-px flex size-4 scale-75 items-center justify-center rounded-full opacity-0 transition-[transform,opacity] duration-150",
isSelected && "scale-100 opacity-100",
Expand Down
3 changes: 2 additions & 1 deletion apps/web/ui/partners/fraud-risks/partner-risk-indicator.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,8 @@ export function PartnerRiskIndicator({ partnerId }: PartnerRiskIndicatorProps) {
content: tooltipContent,
}}
>
<Flag variant="fill"
<Flag
variant="fill"
className={cn(
"size-3.5 cursor-pointer",
FRAUD_SEVERITY_CONFIG["high"].fg,
Expand Down
8 changes: 6 additions & 2 deletions apps/web/ui/partners/partner-network/partner-network-status-badge.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,10 @@ export function PartnerNetworkStatusBadge({
<Tooltip
content={
<div className="flex max-w-xs items-start gap-1.5 p-3">
<BadgeCheck2 variant="fill" className="mt-0.5 size-5 shrink-0 text-blue-500" />
<BadgeCheck2
variant="fill"
className="mt-0.5 size-5 shrink-0 text-blue-500"
/>
<div className="flex flex-col gap-1">
<span className="text-sm font-semibold text-neutral-900">
Approved Partner
Expand All @@ -31,7 +34,8 @@ export function PartnerNetworkStatusBadge({
</div>
}
>
<BadgeCheck2 variant="fill"
<BadgeCheck2
variant="fill"
className={cn(
"shrink-0 text-blue-500",
size === "small" ? "size-3.5" : "size-5",
Expand Down
5 changes: 4 additions & 1 deletion apps/web/ui/partners/partner-platform-card.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,10 @@ export function PartnerPlatformCard({
{verified && (
<Tooltip content="Verified" disableHoverableContent>
<div className="shrink-0">
<BadgeCheck2 variant="fill" className="size-3.5 text-green-600" />
<BadgeCheck2
variant="fill"
className="size-3.5 text-green-600"
/>
</div>
</Tooltip>
)}
Expand Down
3 changes: 2 additions & 1 deletion apps/web/ui/shared/password-requirements.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,8 @@ export const PasswordRequirements = memo(function PasswordRequirements({
checked ? "text-green-600" : errors[field] && "text-red-600",
)}
>
<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"size-2.5 transition-opacity",
checked
Expand Down
3 changes: 2 additions & 1 deletion packages/ui/src/card-selector.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,8 @@ export function CardSelector({
<span className="text-xs text-neutral-600">{description}</span>
</div>

<CircleCheck variant="fill"
<CircleCheck
variant="fill"
className={cn(
"mr-1.5 mt-1.5 flex size-4 scale-75 items-center justify-center rounded-full opacity-0 transition-[transform,opacity] duration-150",
isSelected && "scale-100 opacity-100",
Expand Down
13 changes: 5 additions & 8 deletions packages/ui/src/combobox/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,7 @@ import {
import { AnimatedSizeContainer } from "../animated-size-container";
import { Button, ButtonProps } from "../button";
import { useMediaQuery } from "../hooks";
import {
Check2,
CheckboxIcon,
Icon,
LoadingSpinner,
Plus,
} from "../icons";
import { Check2, CheckboxIcon, Icon, LoadingSpinner, Plus } from "../icons";
import { Popover, PopoverProps } from "../popover";
import { ScrollContainer } from "../scroll-container";
import { Tooltip } from "../tooltip";
Expand Down Expand Up @@ -444,7 +438,10 @@ function Option({
{multiple && (
<div className="text-content-default shrink-0">
{selected ? (
<CheckboxIcon variant="fill" className="text-content-default size-4" />
<CheckboxIcon
variant="fill"
className="text-content-default size-4"
/>
) : (
<CheckboxIcon className="text-content-muted size-4" />
)}
Expand Down
16 changes: 8 additions & 8 deletions packages/ui/src/icons/nucleo/bolt.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,19 +16,19 @@ export function Bolt({
{variant === "fill" ? (
<>
<path
d="M14.922,7.657c-.218-.405-.64-.657-1.1-.657h-3.969l.752-5.83c.061-.464-.204-.902-.643-1.065-.438-.164-.926-.004-1.184,.387L3.134,9.063c-.253,.384-.274,.875-.056,1.28s.64,.657,1.1,.657h3.969l-.752,5.83c-.061,.464,.204,.902,.643,1.065,.115,.043,.234,.064,.352,.064,.328,0,.642-.162,.832-.45h0s5.645-8.572,5.645-8.572c.253-.384,.274-.875,.056-1.28Z"
fill="currentColor"
d="M14.922,7.657c-.218-.405-.64-.657-1.1-.657h-3.969l.752-5.83c.061-.464-.204-.902-.643-1.065-.438-.164-.926-.004-1.184,.387L3.134,9.063c-.253,.384-.274,.875-.056,1.28s.64,.657,1.1,.657h3.969l-.752,5.83c-.061,.464,.204,.902,.643,1.065,.115,.043,.234,.064,.352,.064,.328,0,.642-.162,.832-.45h0s5.645-8.572,5.645-8.572c.253-.384,.274-.875,.056-1.28Z"
fill="currentColor"
/>
</>
) : (
<>
<path
d="m8.597,16.41l5.872-8.265c.118-.166,0-.395-.204-.395h-5.016l.604-5.98c.037-.26-.299-.394-.451-.18L3.531,9.855c-.118.166,0,.395.204.395h5.016l-.604,5.98c-.037.26.299.394.451.18Z"
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
d="m8.597,16.41l5.872-8.265c.118-.166,0-.395-.204-.395h-5.016l.604-5.98c.037-.26-.299-.394-.451-.18L3.531,9.855c-.118.166,0,.395.204.395h5.016l-.604,5.98c-.037.26.299.394.451.18Z"
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
/>
</>
)}
Expand Down
Loading
Loading