Apply AST Transformations

packages/ui/src/content.ts

@@ -1,30 +1,28 @@
 import { ElementType } from "react";
-import {
-  Book2Fill,
-  BulletListFill,
-  DiamondTurnRightFill,
-  DubAnalyticsIcon,
-  DubLinksIcon,
-  DubPartnersIcon,
-  FeatherFill,
-  Github,
-  Go,
-  HeadsetFill,
-  HeartFill,
-  HexadecagonStar,
-  LinkedIn,
-  MicrophoneFill,
-  Php,
-  ProductHunt,
-  Python,
-  Raycast,
-  Ruby,
-  Toggle2Fill,
-  Twitter,
-  Typescript,
-  UsersFill,
-  YouTube,
-} from "./icons";
+import { Book2Fill } from "./icons/nucleo/book2-fill";
+import { BulletListFill } from "./icons/nucleo/bullet-list-fill";
+import { DiamondTurnRightFill } from "./icons/nucleo/diamond-turn-right-fill";
+import { DubAnalyticsIcon } from "./icons/dub-analytics";
+import { DubLinksIcon } from "./icons/dub-links";
+import { DubPartnersIcon } from "./icons/dub-partners";
+import { FeatherFill } from "./icons/nucleo/feather-fill";
+import { Github } from "./icons/github";
+import { Go } from "./icons/go";
+import { HeadsetFill } from "./icons/nucleo/headset-fill";
+import { HeartFill } from "./icons/nucleo/heart-fill";
+import { HexadecagonStar } from "./icons/nucleo/hexadecagon-star";
+import { LinkedIn } from "./icons/linkedin";
+import { MicrophoneFill } from "./icons/nucleo/microphone-fill";
+import { Php } from "./icons/php";
+import { ProductHunt } from "./icons/product-hunt";
+import { Python } from "./icons/python";
+import { Raycast } from "./icons/raycast";
+import { Ruby } from "./icons/ruby";
+import { Toggle2Fill } from "./icons/nucleo/toggle2-fill";
+import { Twitter } from "./icons/twitter";
+import { Typescript } from "./icons/typescript";
+import { UsersFill } from "./icons/nucleo/users-fill";
+import { YouTube } from "./icons/youtube";
 import { DubApiIcon } from "./icons/dub-api";
 import { Elxo } from "./icons/elxo";
 

packages/ui/src/copy-button.tsx

@@ -3,8 +3,9 @@ import { cn } from "@dub/utils";
 import { VariantProps, cva } from "class-variance-authority";
 import { LucideIcon } from "lucide-react";
 import { toast } from "sonner";
-import { useCopyToClipboard } from "./hooks";
-import { Copy, Tick } from "./icons";
+import { useCopyToClipboard } from "./hooks/use-copy-to-clipboard";
+import Copy from "./icons/copy";
+import Tick from "./icons/tick";
 
 const copyButtonVariants = cva(
   "relative group rounded-full p-1.5 transition-all duration-75",

packages/ui/src/copy-text.tsx

@@ -3,7 +3,7 @@
 import { cn } from "@dub/utils";
 import { ReactNode } from "react";
 import { toast } from "sonner";
-import { useCopyToClipboard } from "./hooks";
+import { useCopyToClipboard } from "./hooks/use-copy-to-clipboard";
 
 export function CopyText({
   value,

packages/ui/src/date-picker/date-range-picker.tsx

@@ -2,11 +2,9 @@ import { cn } from "@dub/utils";
 import { enUS } from "date-fns/locale";
 import { PropsWithChildren, useEffect, useMemo, useRef, useState } from "react";
 import { SelectRangeEventHandler } from "react-day-picker";
-import {
-  useKeyboardShortcut,
-  useMediaQuery,
-  useScrollProgress,
-} from "../hooks";
+import { useKeyboardShortcut } from "../hooks/use-keyboard-shortcut";
+import { useMediaQuery } from "../hooks/use-media-query";
+import { useScrollProgress } from "../hooks/use-scroll-progress";
 import { Popover } from "../popover";
 import { Calendar as CalendarPrimitive } from "./calendar";
 import { Presets } from "./presets";

packages/ui/src/file-upload.tsx

@@ -2,7 +2,9 @@ import { cn, resizeImage } from "@dub/utils";
 import { VariantProps, cva } from "class-variance-authority";
 import { DragEvent, ReactNode, useState } from "react";
 import { toast } from "sonner";
-import { CloudUpload, Icon, LoadingCircle } from "./icons";
+import { Icon } from "./icons";
+import { CloudUpload } from "./icons/nucleo/cloud-upload";
+import { LoadingCircle } from "./icons/loading-circle";
 
 type AcceptedFileFormats =
   | "any"

packages/ui/src/filter/filter-list.tsx

@@ -4,7 +4,7 @@ import { X } from "lucide-react";
 import Link from "next/link";
 import { ReactNode, isValidElement } from "react";
 import { AnimatedSizeContainer } from "../animated-size-container";
-import { useKeyboardShortcut } from "../hooks";
+import { useKeyboardShortcut } from "../hooks/use-keyboard-shortcut";
 import { Filter, FilterOption } from "./types";
 
 type FilterListProps = {

packages/ui/src/filter/filter-select.tsx

@@ -14,9 +14,12 @@ import {
   useState,
 } from "react";
 import { AnimatedSizeContainer } from "../animated-size-container";
-import { useKeyboardShortcut, useMediaQuery } from "../hooks";
+import { useKeyboardShortcut } from "../hooks/use-keyboard-shortcut";
+import { useMediaQuery } from "../hooks/use-media-query";
 import { useScrollProgress } from "../hooks/use-scroll-progress";
-import { Check, LoadingSpinner, Magic } from "../icons";
+import { Check } from "../icons/nucleo/check";
+import { LoadingSpinner } from "../icons/loading-spinner";
+import Magic from "../icons/magic";
 import { Popover } from "../popover";
 import { Filter, FilterOption } from "./types";
 

packages/ui/src/footer.tsx

@@ -6,7 +6,11 @@ import Link from "next/link";
 import { useParams } from "next/navigation";
 import { COMPARE_PAGES, FEATURES_LIST, LEGAL_PAGES } from "./content";
 import { DubStatusBadge } from "./dub-status-badge";
-import { Github, LinkedIn, ReferredVia, Twitter, YouTube } from "./icons";
+import { Github } from "./icons/github";
+import { LinkedIn } from "./icons/linkedin";
+import { ReferredVia } from "./icons/nucleo/referred-via";
+import { Twitter } from "./icons/twitter";
+import { YouTube } from "./icons/youtube";
 import { MaxWidthWrapper } from "./max-width-wrapper";
 import { NavWordmark } from "./nav-wordmark";
 

packages/ui/src/icons/plan-feature-icons.tsx

@@ -1,30 +1,28 @@
-import {
-  Bolt,
-  Calendar6,
-  ChartLine,
-  ConnectedDots4,
-  CreditCard,
-  CursorRays,
-  Flask,
-  Folder,
-  Gear3,
-  Gift,
-  Globe,
-  Hyperlink,
-  InvoiceDollar,
-  License,
-  MarketingTarget,
-  PaperPlane,
-  PercentageArrowDown,
-  ShieldKeyhole,
-  Sparkle3,
-  SquareLayoutGrid5,
-  UserCrown,
-  Users2,
-  UsersSettings,
-  Versions2,
-  Webhook,
-} from "./nucleo";
+import { Bolt } from "./nucleo/bolt";
+import { Calendar6 } from "./nucleo/calendar6";
+import { ChartLine } from "./nucleo/chart-line";
+import { ConnectedDots4 } from "./nucleo/connected-dots4";
+import { CreditCard } from "./nucleo/credit-card";
+import { CursorRays } from "./nucleo/cursor-rays";
+import { Flask } from "./nucleo/flask";
+import { Folder } from "./nucleo/folder";
+import { Gear3 } from "./nucleo/gear3";
+import { Gift } from "./nucleo/gift";
+import { Globe } from "./nucleo/globe";
+import { Hyperlink } from "./nucleo/hyperlink";
+import { InvoiceDollar } from "./nucleo/invoice-dollar";
+import { License } from "./nucleo/license";
+import { MarketingTarget } from "./nucleo/marketing-target";
+import { PaperPlane } from "./nucleo/paper-plane";
+import { PercentageArrowDown } from "./nucleo/percentage-arrow-down";
+import { ShieldKeyhole } from "./nucleo/shield-keyhole";
+import { Sparkle3 } from "./nucleo/sparkle3";
+import { SquareLayoutGrid5 } from "./nucleo/square-layout-grid5";
+import { UserCrown } from "./nucleo/user-crown";
+import { Users2 } from "./nucleo/users2";
+import { UsersSettings } from "./nucleo/users-settings";
+import { Versions2 } from "./nucleo/versions2";
+import { Webhook } from "./nucleo/webhook";
 import { Slack } from "./slack";
 
 export const PLAN_FEATURE_ICONS = {

packages/ui/src/input-select.tsx

@@ -26,7 +26,7 @@ import {
 import { Drawer } from "vaul";
 import { Badge } from "./badge";
 import { BlurImage } from "./blur-image";
-import { useMediaQuery } from "./hooks";
+import { useMediaQuery } from "./hooks/use-media-query";
 import { useScrollProgress } from "./hooks/use-scroll-progress";
 
 const InputSelectContext = createContext<{

packages/ui/src/input.tsx

@@ -1,7 +1,8 @@
 import { cn } from "@dub/utils";
 import { AlertCircle } from "lucide-react";
 import React, { useCallback, useState } from "react";
-import { Eye, EyeSlash } from "./icons";
+import { Eye } from "./icons/nucleo/eye";
+import { EyeSlash } from "./icons/nucleo/eye-slash";
 
 export interface InputProps
   extends React.InputHTMLAttributes<HTMLInputElement> {

packages/ui/src/link-logo.tsx

@@ -1,7 +1,7 @@
 import { GOOGLE_FAVICON_URL, cn } from "@dub/utils";
 import { ImageProps } from "next/image";
 import { BlurImage } from "./blur-image";
-import { Globe2 } from "./icons";
+import { Globe2 } from "./icons/nucleo/globe2";
 
 export function LinkLogo({
   apexDomain,

packages/ui/src/link-preview.tsx

@@ -6,8 +6,9 @@ import { useSearchParams } from "next/navigation";
 import { useEffect, useMemo, useRef } from "react";
 import useSWR from "swr";
 import { useDebounce } from "use-debounce";
-import { useMediaQuery } from "./hooks";
-import { LoadingCircle, Photo } from "./icons";
+import { useMediaQuery } from "./hooks/use-media-query";
+import { LoadingCircle } from "./icons/loading-circle";
+import Photo from "./icons/photo";
 
 export function LinkPreview({ defaultUrl }: { defaultUrl?: string }) {
   const searchParams = useSearchParams();

packages/ui/src/modal.tsx

@@ -6,7 +6,7 @@ import * as VisuallyHidden from "@radix-ui/react-visually-hidden";
 import { useRouter } from "next/navigation";
 import { ComponentProps, Dispatch, SetStateAction } from "react";
 import { Drawer } from "vaul";
-import { useMediaQuery } from "./hooks";
+import { useMediaQuery } from "./hooks/use-media-query";
 
 export function Modal({
   children,

packages/ui/src/nav-wordmark.tsx

@@ -7,9 +7,9 @@ import { useParams } from "next/navigation";
 import { MouseEvent, useCallback, useContext, useState } from "react";
 import { toast } from "sonner";
 import { Button, ButtonProps } from "./button";
-import { useCopyToClipboard } from "./hooks";
+import { useCopyToClipboard } from "./hooks/use-copy-to-clipboard";
 import { Logo } from "./logo";
-import { NavContext } from "./nav";
+import { NavContext } from "./nav/nav";
 import { Wordmark } from "./wordmark";
 
 const logoSvg = `<svg width="65" height="64" viewBox="0 0 65 64" fill="none" xmlns="http://www.w3.org/2000/svg">

packages/ui/src/nav/content/graphics/analytics-graphic.tsx

@@ -1,6 +1,6 @@
 import { capitalize, cn } from "@dub/utils";
 import { Link2 } from "lucide-react";
-import { CursorRays } from "../../../icons";
+import { CursorRays } from "../../../icons/nucleo/cursor-rays";
 
 const data = {
   clicks: {

packages/ui/src/nav/content/product-content.tsx

@@ -3,8 +3,10 @@ import { Link as NavigationMenuLink } from "@radix-ui/react-navigation-menu";
 import Image from "next/image";
 import Link from "next/link";
 import { CSSProperties } from "react";
-import { Grid } from "../..";
-import { DubAnalyticsIcon, DubLinksIcon, DubPartnersIcon } from "../../icons";
+import { Grid } from "../../grid";
+import { DubAnalyticsIcon } from "../../icons/dub-analytics";
+import { DubLinksIcon } from "../../icons/dub-links";
+import { DubPartnersIcon } from "../../icons/dub-partners";
 import { AnalyticsGraphic } from "./graphics/analytics-graphic";
 import { LinksGraphic } from "./graphics/links-graphic";
 import { PartnersGraphic } from "./graphics/partners-graphic";

packages/ui/src/nav/content/shared.tsx

@@ -2,7 +2,8 @@ import { cn } from "@dub/utils";
 import { Link as NavigationMenuLink } from "@radix-ui/react-navigation-menu";
 import Link from "next/link";
 import { ComponentProps, ReactNode, SVGProps } from "react";
-import { ExpandingArrow, Icon } from "../../icons";
+import { Icon } from "../../icons";
+import ExpandingArrow from "../../icons/expanding-arrow";
 
 export const contentHeadingClassName =
   "text-xs uppercase text-neutral-500 dark:text-white/60";

packages/ui/src/nav/content/solutions-content.tsx

@@ -3,7 +3,9 @@ import { Link as NavigationMenuLink } from "@radix-ui/react-navigation-menu";
 import Link from "next/link";
 import { SDKS } from "../../content";
 import { Grid } from "../../grid";
-import { DiamondTurnRightFill, MicrophoneFill, UsersFill } from "../../icons";
+import { DiamondTurnRightFill } from "../../icons/nucleo/diamond-turn-right-fill";
+import { MicrophoneFill } from "../../icons/nucleo/microphone-fill";
+import { UsersFill } from "../../icons/nucleo/users-fill";
 import {
   ContentLinkCard,
   contentHeadingClassName,

packages/ui/src/nav/nav-mobile.tsx

@@ -9,12 +9,10 @@ import useSWR from "swr";
 import { AnimatedSizeContainer } from "../animated-size-container";
 import { ButtonProps, buttonVariants } from "../button";
 import { NavItemChild, NavItemChildren } from "../content";
-import {
-  DubAnalyticsIcon,
-  DubApiIcon,
-  DubLinksIcon,
-  DubPartnersIcon,
-} from "../icons";
+import { DubAnalyticsIcon } from "../icons/dub-analytics";
+import { DubApiIcon } from "../icons/dub-api";
+import { DubLinksIcon } from "../icons/dub-links";
+import { DubPartnersIcon } from "../icons/dub-partners";
 import { navItems, type NavTheme } from "./nav";
 
 const specialIcons: Record<string, ReactNode> = {

packages/ui/src/nav/nav.tsx

@@ -9,7 +9,7 @@ import { PropsWithChildren, SVGProps, createContext, useId } from "react";
 import useSWR from "swr";
 import { buttonVariants } from "../button";
 import { FEATURES_LIST, RESOURCES, SOLUTIONS } from "../content";
-import { useScroll } from "../hooks";
+import { useScroll } from "../hooks/use-scroll";
 import { MaxWidthWrapper } from "../max-width-wrapper";
 import { NavWordmark } from "../nav-wordmark";
 import { ProductContent } from "./content/product-content";

packages/ui/src/popover.tsx

@@ -4,7 +4,7 @@ import { cn } from "@dub/utils";
 import * as PopoverPrimitive from "@radix-ui/react-popover";
 import { PropsWithChildren, ReactNode, WheelEventHandler } from "react";
 import { Drawer } from "vaul";
-import { useMediaQuery } from "./hooks";
+import { useMediaQuery } from "./hooks/use-media-query";
 
 export type PopoverProps = PropsWithChildren<{
   content: ReactNode | string;

packages/ui/src/status-badge.tsx

@@ -1,13 +1,11 @@
 import { cn } from "@dub/utils";
 import { cva, type VariantProps } from "class-variance-authority";
-import {
-  CircleCheck,
-  CircleHalfDottedCheck,
-  CircleHalfDottedClock,
-  CircleInfo,
-  CircleWarning,
-  Icon,
-} from "./icons";
+import { Icon } from "./icons";
+import { CircleCheck } from "./icons/nucleo/circle-check";
+import { CircleHalfDottedCheck } from "./icons/nucleo/circle-half-dotted-check";
+import { CircleHalfDottedClock } from "./icons/nucleo/circle-half-dotted-clock";
+import { CircleInfo } from "./icons/nucleo/circle-info";
+import { CircleWarning } from "./icons/nucleo/circle-warning";
 import { DynamicTooltipWrapper } from "./tooltip";
 
 const statusBadgeVariants = cva(

packages/ui/src/tab-select.tsx

@@ -3,7 +3,7 @@ import { cva, VariantProps } from "class-variance-authority";
 import { LayoutGroup, motion } from "framer-motion";
 import Link from "next/link";
 import { Dispatch, SetStateAction, useId } from "react";
-import { ArrowUpRight } from "./icons";
+import { ArrowUpRight } from "./icons/nucleo/arrow-up-right";
 
 const tabSelectButtonVariants = cva("p-4 transition-colors duration-75", {
   variants: {

packages/ui/src/table/table.tsx

@@ -29,7 +29,8 @@ import {
   useState,
 } from "react";
 import { Button } from "../button";
-import { LoadingSpinner, SortOrder } from "../icons";
+import { LoadingSpinner } from "../icons/loading-spinner";
+import SortOrder from "../icons/sort-order";
 
 const tableCellClassName = (columnId: string, clickable?: boolean) =>
   cn([

packages/ui/src/tooltip-advanced-link-features.tsx

@@ -1,4 +1,8 @@
-import { Earth, Incognito, InputPasswordPointer, Timer2, Views } from "./icons";
+import { Earth } from "./icons/nucleo/earth";
+import { Incognito } from "./icons/nucleo/incognito";
+import { InputPasswordPointer } from "./icons/nucleo/input-password-pointer";
+import { Timer2 } from "./icons/nucleo/timer2";
+import { Views } from "./icons/nucleo/views";
 
 const advancedLinkFeatures = [
   {