tsx-shadcn-ui-ui-move-class-around-in-string

A painting is a person's account of this edit as text, recorded independently of the node mapping - a rendering often has several equally defensible answers where the mapping has one. Deletions and insertions carry no position on the opposite side in a painting, so that panel draws no caret for them.

Before1"use client"
2
3import { SignupForm } from "@/registry/bases/radix/blocks/signup-03/components/signup-form"
4import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"
5
6export default function SignupPage() {
7  return (
8    <div className="bg-muted flex min-h-svh flex-col items-center justify-center gap-6 p-6 md:p-10">
9      <div className="flex w-full max-w-sm flex-col gap-6">
10        <a href="#" className="flex items-center gap-2 self-center font-medium">
11          <div className="bg-primary text-primary-foreground flex size-6 items-center justify-center rounded-md">
12            <IconPlaceholder
13              lucide="GalleryVerticalEndIcon"
14              tabler="IconLayoutRows"
15              hugeicons="LayoutBottomIcon"
16              phosphor="RowsIcon"
17              remixicon="RiGalleryLine"
…lines 18–28 unchanged (11 lines)

After1"use client"
2
3import { SignupForm } from "@/registry/bases/radix/blocks/signup-03/components/signup-form"
4import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"
5
6export default function SignupPage() {
7  return (
8    <div className="flex min-h-svh flex-col items-center justify-center gap-6 bg-muted p-6 md:p-10">
9      <div className="flex w-full max-w-sm flex-col gap-6">
10        <a href="#" className="flex items-center gap-2 self-center font-medium">
11          <div className="flex size-6 items-center justify-center rounded-md bg-primary text-primary-foreground">
12            <IconPlaceholder
13              lucide="GalleryVerticalEndIcon"
14              tabler="IconLayoutRows"
15              hugeicons="LayoutBottomIcon"
16              phosphor="RowsIcon"
17              remixicon="RiGalleryLine"
…lines 18–28 unchanged (11 lines)

Before1"use client"
2
3import { SignupForm } from "@/registry/bases/radix/blocks/signup-03/components/signup-form"
4import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"
5
6export default function SignupPage() {
7  return (
8    <div className="bg-muted flex min-h-svh flex-col items-center justify-center gap-6 p-6 md:p-10">
9      <div className="flex w-full max-w-sm flex-col gap-6">
10        <a href="#" className="flex items-center gap-2 self-center font-medium">
11          <div className="bg-primary text-primary-foreground flex size-6 items-center justify-center rounded-md">
12            <IconPlaceholder
13              lucide="GalleryVerticalEndIcon"
14              tabler="IconLayoutRows"
15              hugeicons="LayoutBottomIcon"
16              phosphor="RowsIcon"
17              remixicon="RiGalleryLine"
…lines 18–28 unchanged (11 lines)

After1"use client"
2
3import { SignupForm } from "@/registry/bases/radix/blocks/signup-03/components/signup-form"
4import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"
5
6export default function SignupPage() {
7  return (
8    <div className="flex min-h-svh flex-col items-center justify-center gap-6 bg-muted p-6 md:p-10">
9      <div className="flex w-full max-w-sm flex-col gap-6">
10        <a href="#" className="flex items-center gap-2 self-center font-medium">
11          <div className="flex size-6 items-center justify-center rounded-md bg-primary text-primary-foreground">
12            <IconPlaceholder
13              lucide="GalleryVerticalEndIcon"
14              tabler="IconLayoutRows"
15              hugeicons="LayoutBottomIcon"
16              phosphor="RowsIcon"
17              remixicon="RiGalleryLine"
…lines 18–28 unchanged (11 lines)

Before1"use client"
2
3import { SignupForm } from "@/registry/bases/radix/blocks/signup-03/components/signup-form"
4import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"
5
6export default function SignupPage() {
7  return (
8    <div className="bg-muted flex min-h-svh flex-col items-center justify-center gap-6 p-6 md:p-10">
9      <div className="flex w-full max-w-sm flex-col gap-6">
10        <a href="#" className="flex items-center gap-2 self-center font-medium">
11          <div className="bg-primary text-primary-foreground flex size-6 items-center justify-center rounded-md">
12            <IconPlaceholder
13              lucide="GalleryVerticalEndIcon"
14              tabler="IconLayoutRows"
15              hugeicons="LayoutBottomIcon"
16              phosphor="RowsIcon"
17              remixicon="RiGalleryLine"
…lines 18–28 unchanged (11 lines)

After1"use client"
2
3import { SignupForm } from "@/registry/bases/radix/blocks/signup-03/components/signup-form"
4import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"
5
6export default function SignupPage() {
7  return (
8    <div className="flex min-h-svh flex-col items-center justify-center gap-6 bg-muted p-6 md:p-10">
9      <div className="flex w-full max-w-sm flex-col gap-6">
10        <a href="#" className="flex items-center gap-2 self-center font-medium">
11          <div className="flex size-6 items-center justify-center rounded-md bg-primary text-primary-foreground">
12            <IconPlaceholder
13              lucide="GalleryVerticalEndIcon"
14              tabler="IconLayoutRows"
15              hugeicons="LayoutBottomIcon"
16              phosphor="RowsIcon"
17              remixicon="RiGalleryLine"
…lines 18–28 unchanged (11 lines)

Before

program

expression_statement

string

" "\""

string_fragment "use client"

" "\""

import_statement

import "import"

import_clause

named_imports

{ "{"

import_specifier

identifier "SignupForm"

} "}"

from "from"

string

" "\""

string_fragment "@/registry/bases/radix/blocks/signup-03/components/signup-fo"...

" "\""

import_statement

import "import"

import_clause

named_imports

{ "{"

import_specifier

identifier "IconPlaceholder"

} "}"

from "from"

string

" "\""

string_fragment "@/app/(create)/components/icon-placeholder"

" "\""

export_statement

export "export"

default "default"

function_declaration

function "function"

identifier "SignupPage"

formal_parameters

( "("

) ")"

statement_block

{ "{"

return_statement

return "return"

parenthesized_expression

( "("

jsx_element

jsx_opening_element

< "<"

identifier "div"

jsx_attribute

property_identifier "className"

= "="

string

" "\""

string_fragment "bg-muted flex min-h-svh flex-col items-center justify-center"...

" "\""

> ">"

jsx_element

jsx_opening_element

< "<"

identifier "div"

jsx_attribute

property_identifier "className"

= "="

string

" "\""

string_fragment "flex w-full max-w-sm flex-col gap-6"

" "\""

> ">"

jsx_element

jsx_opening_element

< "<"

identifier "a"

jsx_attribute

property_identifier "href"

= "="

string

" "\""

string_fragment "#"

" "\""

jsx_attribute

property_identifier "className"

= "="

string

" "\""

string_fragment "flex items-center gap-2 self-center font-medium"

" "\""

> ">"

jsx_element

jsx_opening_element

< "<"

identifier "div"

jsx_attribute

property_identifier "className"

= "="

string

" "\""

string_fragment "bg-primary text-primary-foreground flex size-6 items-center "...

" "\""

> ">"

jsx_self_closing_element (+46 nodes collapsed)

jsx_closing_element

</ "</"

identifier "div"

> ">"

jsx_text "\n Acme Inc.\n "

jsx_closing_element

</ "</"

identifier "a"

> ">"

jsx_self_closing_element

< "<"

identifier "SignupForm"

/> "/>"

jsx_closing_element

</ "</"

identifier "div"

> ">"

jsx_closing_element

</ "</"

identifier "div"

> ">"

) ")"

} "}"

After

program

expression_statement

string

" "\""

string_fragment "use client"

" "\""

import_statement

import "import"

import_clause

named_imports

{ "{"

import_specifier

identifier "SignupForm"

} "}"

from "from"

string

" "\""

string_fragment "@/registry/bases/radix/blocks/signup-03/components/signup-fo"...

" "\""

import_statement

import "import"

import_clause

named_imports

{ "{"

import_specifier

identifier "IconPlaceholder"

} "}"

from "from"

string

" "\""

string_fragment "@/app/(create)/components/icon-placeholder"

" "\""

export_statement

export "export"

default "default"

function_declaration

function "function"

identifier "SignupPage"

formal_parameters

( "("

) ")"

statement_block

{ "{"

return_statement

return "return"

parenthesized_expression

( "("

jsx_element

jsx_opening_element

< "<"

identifier "div"

jsx_attribute

property_identifier "className"

= "="

string

" "\""

string_fragment "flex min-h-svh flex-col items-center justify-center gap-6 bg"...

" "\""

> ">"

jsx_element

jsx_opening_element

< "<"

identifier "div"

jsx_attribute

property_identifier "className"

= "="

string

" "\""

string_fragment "flex w-full max-w-sm flex-col gap-6"

" "\""

> ">"

jsx_element

jsx_opening_element

< "<"

identifier "a"

jsx_attribute

property_identifier "href"

= "="

string

" "\""

string_fragment "#"

" "\""

jsx_attribute

property_identifier "className"

= "="

string

" "\""

string_fragment "flex items-center gap-2 self-center font-medium"

" "\""

> ">"

jsx_element

jsx_opening_element

< "<"

identifier "div"

jsx_attribute

property_identifier "className"

= "="

string

" "\""

string_fragment "flex size-6 items-center justify-center rounded-md bg-primar"...

" "\""

> ">"

jsx_self_closing_element (+46 nodes collapsed)

jsx_closing_element

</ "</"

identifier "div"

> ">"

jsx_text "\n Acme Inc.\n "

jsx_closing_element

</ "</"

identifier "a"

> ">"

jsx_self_closing_element

< "<"

identifier "SignupForm"

/> "/>"

jsx_closing_element

</ "</"

identifier "div"

> ">"

jsx_closing_element

</ "</"

identifier "div"

> ">"

) ")"

} "}"