diff --git a/crates/oxc_transformer/src/plugins/styled_components.rs b/crates/oxc_transformer/src/plugins/styled_components.rs
index 5f27515c702c8..483727e76669f 100644
--- a/crates/oxc_transformer/src/plugins/styled_components.rs
+++ b/crates/oxc_transformer/src/plugins/styled_components.rs
@@ -681,7 +681,7 @@ impl<'a> StyledComponents<'a, '_> {
         }
 
         let mut hasher = FxHasher::default();
-        if self.ctx.source_path.is_relative() {
+        if self.ctx.source_path.is_absolute() {
             self.ctx.source_path.hash(&mut hasher);
         } else {
             self.ctx.source_text.hash(&mut hasher);
diff --git a/napi/transform/test/transform.test.ts b/napi/transform/test/transform.test.ts
index 78b2eccee25ca..a1c0fe42bcd12 100644
--- a/napi/transform/test/transform.test.ts
+++ b/napi/transform/test/transform.test.ts
@@ -438,7 +438,7 @@ describe('styled-components', () => {
 			"import styled, { css } from "styled-components";
 			styled.div.withConfig({
 				displayName: "test",
-				componentId: "sc-ziiqn7-0"
+				componentId: "sc-3q0sbi-0"
 			})(["color:red;"]);
 			const v = /* @__PURE__ */ css(["color: red;"]);
 			"
diff --git a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/add-identifier-and-display-name/output.js b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/add-identifier-and-display-name/output.js
index 6f500ef1247c5..73f592c0181d2 100644
--- a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/add-identifier-and-display-name/output.js
+++ b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/add-identifier-and-display-name/output.js
@@ -1,65 +1,65 @@
 import styled from 'styled-components';
 const Test = styled.div.withConfig({
   displayName: "Test",
-  componentId: "sc-mkpq9u-0"
+  componentId: "sc-68njp2-0"
 })`width:100%;`;
 const Test2 = true ? styled.div.withConfig({
   displayName: "Test2",
-  componentId: "sc-mkpq9u-1"
+  componentId: "sc-68njp2-1"
 })`` : styled.div.withConfig({
   displayName: "Test2",
-  componentId: "sc-mkpq9u-2"
+  componentId: "sc-68njp2-2"
 })``;
 const styles = {
   One: styled.div.withConfig({
     displayName: "One",
-    componentId: "sc-mkpq9u-3"
+    componentId: "sc-68njp2-3"
   })``
 };
 let Component;
 Component = styled.div.withConfig({
   displayName: "Component",
-  componentId: "sc-mkpq9u-4"
+  componentId: "sc-68njp2-4"
 })``;
 const WrappedComponent = styled(Inner).withConfig({
   displayName: "WrappedComponent",
-  componentId: "sc-mkpq9u-5"
+  componentId: "sc-68njp2-5"
 })``;
 const WrappedComponent2 = styled.div.withConfig({
   displayName: "WrappedComponent2",
-  componentId: "sc-mkpq9u-6"
+  componentId: "sc-68njp2-6"
 })({});
 const WrappedComponent3 = styled(Inner).withConfig({
   displayName: "WrappedComponent3",
-  componentId: "sc-mkpq9u-7"
+  componentId: "sc-68njp2-7"
 })({});
 const WrappedComponent4 = styled(Inner).attrs(() => ({
   something: 'else'
 })).withConfig({
   displayName: "WrappedComponent4",
-  componentId: "sc-mkpq9u-8"
+  componentId: "sc-68njp2-8"
 })({});
 const WrappedComponent5 = styled.div.attrs(() => ({
   something: 'else'
 })).withConfig({
   displayName: "WrappedComponent5",
-  componentId: "sc-mkpq9u-9"
+  componentId: "sc-68njp2-9"
 })({});
 const WrappedComponent6 = styled.div.attrs(() => ({
   something: 'else'
 })).withConfig({
   displayName: "WrappedComponent6",
-  componentId: "sc-mkpq9u-10"
+  componentId: "sc-68njp2-10"
 })``;
 const WrappedComponent7 = styled.div.withConfig({
   shouldForwardProp: () => { },
   displayName: "WrappedComponent7",
-  componentId: "sc-mkpq9u-11"
+  componentId: "sc-68njp2-11"
 })({});
 const WrappedComponent8 = styled.div.withConfig({
   shouldForwardProp: () => { },
   displayName: "WrappedComponent8",
-  componentId: "sc-mkpq9u-12"
+  componentId: "sc-68njp2-12"
 }).attrs(() => ({
   something: 'else'
 }))({});
@@ -68,5 +68,5 @@ const WrappedComponent9 = styled.div.attrs(() => ({
 })).withConfig({
   shouldForwardProp: () => { },
   displayName: "WrappedComponent9",
-  componentId: "sc-mkpq9u-13"
+  componentId: "sc-68njp2-13"
 })({});
diff --git a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/add-identifier/output.js b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/add-identifier/output.js
index e69632966692e..5df6c9f3bac06 100644
--- a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/add-identifier/output.js
+++ b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/add-identifier/output.js
@@ -1,21 +1,21 @@
 import styled from 'styled-components';
 const Test = styled.div.withConfig({
-  componentId: "sc-80sor8-0"
+  componentId: "sc-yv1qfe-0"
 })`width:100%;`;
 const Test2 = true ? styled.div.withConfig({
-  componentId: "sc-80sor8-1"
+  componentId: "sc-yv1qfe-1"
 })`` : styled.div.withConfig({
-  componentId: "sc-80sor8-2"
+  componentId: "sc-yv1qfe-2"
 })``;
 const styles = {
   One: styled.div.withConfig({
-    componentId: "sc-80sor8-3"
+    componentId: "sc-yv1qfe-3"
   })``
 };
 let Component;
 Component = styled.div.withConfig({
-  componentId: "sc-80sor8-4"
+  componentId: "sc-yv1qfe-4"
 })``;
 const WrappedComponent = styled(Inner).withConfig({
-  componentId: "sc-80sor8-5"
+  componentId: "sc-yv1qfe-5"
 })``;
diff --git a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/ignore-external-styled-import/output.jsx b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/ignore-external-styled-import/output.jsx
index 87a7883769b7c..09aea6ff1d9cf 100644
--- a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/ignore-external-styled-import/output.jsx
+++ b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/ignore-external-styled-import/output.jsx
@@ -2,7 +2,7 @@ import { styled } from '@material/ui';
 import s from 'styled-components';
 const Paragraph = s.p.withConfig({
   displayName: "input__Paragraph",
-  componentId: "sc-33emk6-0"
+  componentId: "sc-g689do-0"
 })(["color:green;"]);
 const Foo = p => <Paragraph {...p} />;
 const TestNormal = styled(Foo)({
diff --git a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/minify-single-line-comments-with-interpolations/output.js b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/minify-single-line-comments-with-interpolations/output.js
index 0e8533133e6c7..9bb736e290ccd 100644
--- a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/minify-single-line-comments-with-interpolations/output.js
+++ b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/minify-single-line-comments-with-interpolations/output.js
@@ -1,17 +1,17 @@
 import styled from 'styled-components';
 
-const Test1 = styled.div.withConfig({ displayName: "input__Test1", componentId: "sc-clieju-0" })(["width:100%;"]);
-const Test2 = styled.div.withConfig({ displayName: "input__Test2", componentId: "sc-clieju-1" })(["width:100%;"]);
-const Test3 = styled.div.withConfig({ displayName: "input__Test3", componentId: "sc-clieju-2" })(["width:100%;", ";"], 'red');
-const Test4 = styled.div.withConfig({ displayName: "input__Test4", componentId: "sc-clieju-3" })(["width:100%;"]);
-const Test5 = styled.div.withConfig({ displayName: "input__Test5", componentId: "sc-clieju-4" })(["width:100%;"]);
-const Test6 = styled.div.withConfig({ displayName: "input__Test6", componentId: "sc-clieju-5" })(
+const Test1 = styled.div.withConfig({ displayName: "input__Test1", componentId: "sc-4bekfz-0" })(["width:100%;"]);
+const Test2 = styled.div.withConfig({ displayName: "input__Test2", componentId: "sc-4bekfz-1" })(["width:100%;"]);
+const Test3 = styled.div.withConfig({ displayName: "input__Test3", componentId: "sc-4bekfz-2" })(["width:100%;", ";"], 'red');
+const Test4 = styled.div.withConfig({ displayName: "input__Test4", componentId: "sc-4bekfz-3" })(["width:100%;"]);
+const Test5 = styled.div.withConfig({ displayName: "input__Test5", componentId: "sc-4bekfz-4" })(["width:100%;"]);
+const Test6 = styled.div.withConfig({ displayName: "input__Test6", componentId: "sc-4bekfz-5" })(
   ["background:url(\"https://google.com\");width:100%;", ""],
   'green',
 );
-const Test7 = styled.div.withConfig({ displayName: "input__Test7", componentId: "sc-clieju-6" })(
+const Test7 = styled.div.withConfig({ displayName: "input__Test7", componentId: "sc-4bekfz-6" })(
   ["background:url(\"https://google.com\");width:", ";", "height:", ";"],
   p => p.props.width,
   'green',
   p => p.props.height,
-);
+);
\ No newline at end of file
diff --git a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/track-the-imported-variable/output.js b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/track-the-imported-variable/output.js
index ca22befbc1c6a..aa39fc55e0592 100644
--- a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/track-the-imported-variable/output.js
+++ b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/track-the-imported-variable/output.js
@@ -1,27 +1,27 @@
 import s from "styled-components";
 const Test = s.div.withConfig({
   displayName: "Test",
-  componentId: "sc-4ndp5k-0"
+  componentId: "sc-etvu4p-0"
 })`width:100%;`;
 const Test2 = true ? s.div.withConfig({
   displayName: "Test2",
-  componentId: "sc-4ndp5k-1"
+  componentId: "sc-etvu4p-1"
 })`` : s.div.withConfig({
   displayName: "Test2",
-  componentId: "sc-4ndp5k-2"
+  componentId: "sc-etvu4p-2"
 })``;
 const styles = {
   One: s.div.withConfig({
     displayName: "One",
-    componentId: "sc-4ndp5k-3"
+    componentId: "sc-etvu4p-3"
   })``
 };
 let Component;
 Component = s.div.withConfig({
   displayName: "Component",
-  componentId: "sc-4ndp5k-4"
+  componentId: "sc-etvu4p-4"
 })``;
 const WrappedComponent = s(Inner).withConfig({
   displayName: "WrappedComponent",
-  componentId: "sc-4ndp5k-5"
+  componentId: "sc-etvu4p-5"
 })``;
diff --git a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-directory-name/output.js b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-directory-name/output.js
index a164bae4ca305..ccfac9ed48965 100644
--- a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-directory-name/output.js
+++ b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-directory-name/output.js
@@ -1,17 +1,17 @@
 import styled from "styled-components";
 const Test = styled.div.withConfig({
   displayName: "use-directory-name__Test",
-  componentId: "sc-885txi-0"
+  componentId: "sc-bccdtg-0"
 })`color:red;`;
 const before = styled.div.withConfig({
   displayName: "use-directory-name__before",
-  componentId: "sc-885txi-1"
+  componentId: "sc-bccdtg-1"
 })`color:blue;`;
 styled.div.withConfig({
   displayName: "use-directory-name",
-  componentId: "sc-885txi-2"
+  componentId: "sc-bccdtg-2"
 })``;
 export default styled.button.withConfig({
   displayName: "use-directory-name",
-  componentId: "sc-885txi-3"
+  componentId: "sc-bccdtg-3"
 })``;
diff --git a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-file-name/output.js b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-file-name/output.js
index 6d58ca1c4946d..89596570f3cf9 100644
--- a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-file-name/output.js
+++ b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-file-name/output.js
@@ -1,17 +1,17 @@
 import styled from "styled-components";
 const Test = styled.div.withConfig({
   displayName: "input__Test",
-  componentId: "sc-3maeg5-0"
+  componentId: "sc-bccdtg-0"
 })`color:red;`;
 const before = styled.div.withConfig({
   displayName: "input__before",
-  componentId: "sc-3maeg5-1"
+  componentId: "sc-bccdtg-1"
 })`color:blue;`;
 styled.div.withConfig({
   displayName: "input",
-  componentId: "sc-3maeg5-2"
+  componentId: "sc-bccdtg-2"
 })``;
 export default styled.button.withConfig({
   displayName: "input",
-  componentId: "sc-3maeg5-3"
+  componentId: "sc-bccdtg-3"
 })``;
diff --git a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-namespace/output.js b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-namespace/output.js
index e63c4d7f7ae4b..b820a381b913d 100644
--- a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-namespace/output.js
+++ b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/use-namespace/output.js
@@ -9,17 +9,17 @@ const GlobalStyle = styled.createGlobalStyle`
 `;
 const Test = styled.default.div.withConfig({
   displayName: "input__Test",
-  componentId: "test-namespace__sc-ko2l8q-0"
+  componentId: "test-namespace__sc-zljhv7-0"
 })`color:red;`;
 const before = styled.default.div.withConfig({
   displayName: "input__before",
-  componentId: "test-namespace__sc-ko2l8q-1"
+  componentId: "test-namespace__sc-zljhv7-1"
 })`color:blue;`;
 styled.default.div.withConfig({
   displayName: "input",
-  componentId: "test-namespace__sc-ko2l8q-2"
+  componentId: "test-namespace__sc-zljhv7-2"
 })``;
 export default styled.default.button.withConfig({
   displayName: "input",
-  componentId: "test-namespace__sc-ko2l8q-3"
+  componentId: "test-namespace__sc-zljhv7-3"
 })``;
diff --git a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/work-with-hoisted-default-as-import/output.js b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/work-with-hoisted-default-as-import/output.js
index 994932c460cc7..89ed76f6723f1 100644
--- a/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/work-with-hoisted-default-as-import/output.js
+++ b/tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/styled-components/work-with-hoisted-default-as-import/output.js
@@ -1,5 +1,5 @@
 const Test = s.div.withConfig({
   displayName: "input__Test",
-  componentId: "sc-ii5gby-0"
+  componentId: "sc-eygmw0-0"
 })`width:100%;`;
 import { default as s, css } from 'styled-components';