diff --git a/src/__tests__/native/transform.test.tsx b/src/__tests__/native/transform.test.tsx
index b7a08fc..e0f30d0 100644
--- a/src/__tests__/native/transform.test.tsx
+++ b/src/__tests__/native/transform.test.tsx
@@ -45,10 +45,10 @@ describe("scale", () => {
test("unparsed", () => {
registerCSS(`
- .my-class {
+ .my-class {
--scale-x: 2%;
--scale-y: 2%;
- scale: var(--scale-x) var(--scale-y);
+ scale: var(--scale-x) var(--scale-y);
}
`);
const component = render(
@@ -153,4 +153,24 @@ describe("transform", () => {
transform: [{ translateX: "10%" }, { scaleX: 2 }],
});
});
+
+ test.only("no duplicated translate objects", () => {
+ registerCSS(`
+.translate-x-1 {
+ --tw-translate-x: 4px;
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y));
+}
+.translate-y-1 {
+ --tw-translate-y: 4px;
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y));
+}`);
+
+ const component = render(
+ ,
+ ).getByTestId(testID);
+
+ expect(component.props.style).toStrictEqual({
+ transform: [{ translateX: 4 }, { translateY: 4 }],
+ });
+ });
});
diff --git a/src/native/objects.ts b/src/native/objects.ts
index 12e69cc..bcf20be 100644
--- a/src/native/objects.ts
+++ b/src/native/objects.ts
@@ -69,8 +69,17 @@ export function applyValue(
const transformArray: Record[] = target.transform;
- // Remove any existing values
- target.transform = transformArray.filter((t) => !(prop in t));
+ // Remove any existing values and any keys that are to be appended next
+ const keysToRemove = Array.isArray(value)
+ ? new Set(
+ value.flatMap((v) =>
+ v && typeof v === "object" ? Object.keys(v) : [],
+ ),
+ )
+ : new Set([prop]);
+ target.transform = transformArray.filter(
+ (t) => !(prop in t) && !Object.keys(t).some((k) => keysToRemove.has(k)),
+ );
if (Array.isArray(value)) {
target.transform.push(...value);