From b83023034a301b41fa18045af0d9bd787e415aa5 Mon Sep 17 00:00:00 2001
From: Haz <hazdiego@gmail.com>
Date: Tue, 14 Oct 2025 17:11:29 +0400
Subject: [PATCH] fix(cli): fix add registry item with at-property css rule
 (#8451)

* Add fixture and test

* Handle at-property as regular CSS rules in updateCssPlugin

* Add changeset entry

---------

Co-authored-by: shadcn <m@shadcn.com>
---
 .changeset/lazy-mails-wear.md                 |  5 ++++
 .../shadcn/src/utils/updaters/update-css.ts   |  4 +++
 .../registry/example-at-property.json         | 12 +++++++++
 packages/tests/src/tests/add.test.ts          | 27 +++++++++++++++++++
 4 files changed, 48 insertions(+)
 create mode 100644 .changeset/lazy-mails-wear.md
 create mode 100644 packages/tests/fixtures/registry/example-at-property.json

diff --git a/.changeset/lazy-mails-wear.md b/.changeset/lazy-mails-wear.md
new file mode 100644
index 000000000..c84d31c7f
--- /dev/null
+++ b/.changeset/lazy-mails-wear.md
@@ -0,0 +1,5 @@
+---
+"shadcn": patch
+---
+
+fix adding registry item with CSS at-property
diff --git a/packages/shadcn/src/utils/updaters/update-css.ts b/packages/shadcn/src/utils/updaters/update-css.ts
index a85b4066b..4ffb250b3 100644
--- a/packages/shadcn/src/utils/updaters/update-css.ts
+++ b/packages/shadcn/src/utils/updaters/update-css.ts
@@ -338,6 +338,10 @@ function updateCssPlugin(css: z.infer<typeof registryItemCssSchema>) {
                 }
               }
             }
+          }
+          // Handle at-property as regular CSS rules
+          else if (name === "property") {
+            processRule(root, selector, properties)
           } else {
             // Handle other at-rules normally
             processAtRule(root, name, params, properties)
diff --git a/packages/tests/fixtures/registry/example-at-property.json b/packages/tests/fixtures/registry/example-at-property.json
new file mode 100644
index 000000000..e47e9a523
--- /dev/null
+++ b/packages/tests/fixtures/registry/example-at-property.json
@@ -0,0 +1,12 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "example-at-property",
+  "type": "registry:style",
+  "css": {
+    "@property --foo": {
+      "syntax": "'<number>'",
+      "inherits": "false",
+      "initial-value": "0"
+    }
+  }
+}
diff --git a/packages/tests/src/tests/add.test.ts b/packages/tests/src/tests/add.test.ts
index 40a99e688..6819f4fe3 100644
--- a/packages/tests/src/tests/add.test.ts
+++ b/packages/tests/src/tests/add.test.ts
@@ -296,4 +296,31 @@ describe("shadcn add", () => {
       await fs.readFile(path.join(fixturePath, "path/to/foo.txt"), "utf-8")
     ).toBe("Foo Bar")
   })
+
+  it("should add at-property", async () => {
+    const fixturePath = await createFixtureTestDirectory("next-app-init")
+    await npxShadcn(fixturePath, [
+      "add",
+      "../../fixtures/registry/example-at-property.json",
+      "--yes",
+    ])
+
+    const globalCssContent = await fs.readFile(
+      path.join(fixturePath, "app/globals.css"),
+      "utf-8"
+    )
+
+    expect(
+      cssHasProperties(globalCssContent, [
+        {
+          selector: "@property --foo",
+          properties: {
+            syntax: "'<number>'",
+            inherits: "false",
+            "initial-value": "0",
+          },
+        },
+      ])
+    ).toBe(true)
+  })
 })