fix!: improve component naming

.prettierignore

@@ -10,3 +10,4 @@ CONTRIBUTING.md
 docs
 .next
 .cache
+api-report/*

packages/elements-react-stories/.storybook/preview.tsx

@@ -1,4 +1,3 @@
-import { IntlProvider } from "@ory/elements-react"
 import type { Decorator, Preview } from "@storybook/react"
 import { chromaticModes } from "./modes"
 import "@ory/elements-react/theme/styles.css"
@@ -28,11 +27,8 @@ const preview: Preview = {
 const withI18next: Decorator = (Story, context) => {
   const { locale } = context.globals
 
-  return (
-    <IntlProvider locale={locale} defaultLocale="en">
-      <Story />
-    </IntlProvider>
-  )
+  // TODO: this needs a refactor, because it doesn't pass the locale to the Ory Provider at the moment.
+  return <Story args={{ locale }} />
 }
 
 // export decorators for storybook to wrap your stories in

packages/elements-react-stories/src/elements-react/components/login/1fa/all.stories.ts

@@ -3,7 +3,7 @@
 
 import { LoginFlowFromJSON } from "@ory/client-fetch"
 import type { Meta, StoryObj } from "@storybook/react"
-import { Login } from "../../../pages/login"
+import { Login } from "@ory/elements-react/theme"
 import { config } from "../../../utils"
 
 const meta = {

packages/elements-react-stories/src/elements-react/components/login/1fa/code.stories.ts

@@ -1,7 +1,7 @@
 // Copyright © 2024 Ory Corp
 // SPDX-License-Identifier: Apache-2.0
 
-import { Login } from "../../../pages/login"
+import { Login } from "@ory/elements-react/theme"
 import { config } from "../../../utils"
 import { LoginFlowFromJSON } from "@ory/client-fetch"
 import type { Meta, StoryObj } from "@storybook/react"

packages/elements-react-stories/src/elements-react/components/login/1fa/custom.stories.tsx

@@ -1,18 +1,18 @@
+import { LoginFlowFromJSON } from "@ory/client-fetch"
 import {
-  HeadlessSocialButtonProps,
   OryCard,
   OryCardContent,
   OryForm,
   OryFormGroups,
   OryFormSocialButtons,
+  OryNodeOIDCButtonProps,
 } from "@ory/elements-react"
-import { FlowContextProps, Login } from "../../../pages/login"
+import { Login, LoginFlowContextProps } from "@ory/elements-react/theme"
 import { config } from "../../../utils"
-import { LoginFlowFromJSON } from "@ory/client-fetch"
 
 import type { Meta, StoryObj } from "@storybook/react"
 
-const CustomSocialButton = ({ node }: HeadlessSocialButtonProps) => (
+const CustomSocialButton = ({ node }: OryNodeOIDCButtonProps) => (
   <div
     className={
       "antialiased rounded-border-radius-buttons border border-transparent gap-3 leading-none bg-button-primary-bg-default hover:bg-button-primary-bg-hover transition-colors text-button-primary-fg-default hover:text-button-primary-fg-hover px-4 py-4.5 text-sm font-medium"
@@ -22,12 +22,14 @@ const CustomSocialButton = ({ node }: HeadlessSocialButtonProps) => (
   </div>
 )
 
-const CustomComponents = ({ flow, config }: FlowContextProps) => {
+const CustomComponents = ({ flow, config }: LoginFlowContextProps) => {
   return (
     <Login
       flow={flow}
       components={{
-        SocialButton: CustomSocialButton,
+        Node: {
+          OIDCButton: CustomSocialButton,
+        },
       }}
       config={config}
     >

packages/elements-react-stories/src/elements-react/components/login/1fa/passkey.stories.ts

@@ -1,7 +1,7 @@
 // Copyright © 2024 Ory Corp
 // SPDX-License-Identifier: Apache-2.0
 
-import { Login } from "../../../pages/login"
+import { Login } from "@ory/elements-react/theme"
 import { config } from "../../../utils"
 import { LoginFlowFromJSON } from "@ory/client-fetch"
 import type { Meta, StoryObj } from "@storybook/react"

packages/elements-react-stories/src/elements-react/components/login/1fa/password.stories.ts

@@ -1,7 +1,7 @@
 // Copyright © 2024 Ory Corp
 // SPDX-License-Identifier: Apache-2.0
 
-import { Login } from "../../../pages/login"
+import { Login } from "@ory/elements-react/theme"
 import { config } from "../../../utils"
 import { LoginFlowFromJSON } from "@ory/client-fetch"
 import type { Meta, StoryObj } from "@storybook/react"

packages/elements-react-stories/src/elements-react/components/registration/one-step/all-methods.stories.ts

@@ -1,7 +1,7 @@
 // Copyright © 2024 Ory Corp
 // SPDX-License-Identifier: Apache-2.0
 
-import { Registration } from "../../../pages/registration"
+import { Registration } from "@ory/elements-react/theme"
 import { config } from "../../../utils"
 import { LoginFlowFromJSON, RegistrationFlowFromJSON } from "@ory/client-fetch"
 import type { Meta, StoryObj } from "@storybook/react"

packages/elements-react-stories/src/elements-react/components/registration/one-step/password.stories.ts

@@ -1,7 +1,7 @@
 // Copyright © 2024 Ory Corp
 // SPDX-License-Identifier: Apache-2.0
 
-import { Registration } from "../../../pages/registration"
+import { Registration } from "@ory/elements-react/theme"
 import { config } from "../../../utils"
 import { LoginFlowFromJSON, RegistrationFlowFromJSON } from "@ory/client-fetch"
 import type { Meta, StoryObj } from "@storybook/react"

packages/elements-react-stories/src/elements-react/components/registration/one-step/webauthn.stories.ts

@@ -1,7 +1,7 @@
 // Copyright © 2024 Ory Corp
 // SPDX-License-Identifier: Apache-2.0
 
-import { Registration } from "../../../pages/registration"
+import { Registration } from "@ory/elements-react/theme"
 import { config } from "../../../utils"
 import { RegistrationFlowFromJSON } from "@ory/client-fetch"
 import type { Meta, StoryObj } from "@storybook/react"

packages/elements-react-stories/src/elements-react/components/registration/two-step/all-methods.stories.ts

@@ -1,7 +1,7 @@
 // Copyright © 2024 Ory Corp
 // SPDX-License-Identifier: Apache-2.0
 
-import { Registration } from "../../../pages/registration"
+import { Registration } from "@ory/elements-react/theme"
 import { config } from "../../../utils"
 import { LoginFlowFromJSON, RegistrationFlowFromJSON } from "@ory/client-fetch"
 import type { Meta, StoryObj } from "@storybook/react"

packages/elements-react-stories/src/elements-react/components/registration/two-step/password.stories.ts

@@ -1,7 +1,7 @@
 // Copyright © 2024 Ory Corp
 // SPDX-License-Identifier: Apache-2.0
 
-import { Registration } from "../../../pages/registration"
+import { Registration } from "@ory/elements-react/theme"
 import { config } from "../../../utils"
 import { LoginFlowFromJSON, RegistrationFlowFromJSON } from "@ory/client-fetch"
 import type { Meta, StoryObj } from "@storybook/react"

packages/elements-react/.gitignore

@@ -1,5 +1,4 @@
 playwright/.cache/
 playwright-report/*
 .last-run.json
-
-api-report/temp
+api-report/temp