refactor: move frontend projects to frontend folder

.gitignore

@@ -20,12 +20,12 @@
 hanko
 
 # Dependency directories (remove the comment below to include it)
-elements/dist/
-elements/node_modules/
+frontend/elements/dist/
+frontend/elements/node_modules/
 e2e/node_modules/
 e2e/test-results/
 e2e/playwright-report/
 e2e/playwright/.cache/
-frontend-sdk/dist/
-frontend-sdk/node_modules/
-frontend-sdk/coverage
+frontend/frontend-sdk/dist/
+frontend/frontend-sdk/node_modules/
+frontend/frontend-sdk/coverage

README.md

@@ -34,8 +34,8 @@ With most devices now shipping with passkey support and biometric sensors like T
 # Architecture
 The main building blocks of the Hanko project are
 - [backend](/backend/README.md) - An authentication API powering passkeys, passcodes, and passwords, as well as user management and JWT token issuing
-- [hanko-elements](/elements/README.md) - A slick web component made for Hanko backend that features a polished onboarding and login experience and is highly customizable
-- [hanko-frontend-sdk](/frontend-sdk/README.md) - A client package for using the Hanko API
+- [hanko-elements](/frontend/elements/README.md) - A slick web component made for Hanko backend that features a polished onboarding and login experience and is highly customizable
+- [hanko-frontend-sdk](/frontend/frontend-sdk/README.md) - A client package for using the Hanko API
 
 The remainder of the repository contents consist of:
 - [quickstart](/quickstart) - The quickstart example app, showing off Hanko's login experience and acting as a reference implementation
@@ -50,12 +50,12 @@ The remainder of the repository contents consist of:
 - **I need an authentication API for my project, but I do not want to build it myself**: head over to our
   [backend](/backend/README.md) to learn how to get it up and running.
 - **I also need a registration/login UI in my frontend, but I do not want to build it myself**:
-  [hanko-elements](/elements/README.md) provides the custom element/web component that powers
+  [hanko-elements](/frontend/elements/README.md) provides the custom element/web component that powers
   the [live example](https://example.hanko.io) and our companion page [passkeys.io](https://passkeys.io).
   We also provide [guides](https://docs.hanko.io/guides/frontend) in the official documentation on how to integrate the
   web component(s) with your favourite frontend framework as well as [example](/examples/README.md) applications.
 - **I want to use the Hanko backend API but prefer to build my own UI**: you can still make
-  use of the [hanko-frontend-sdk](/frontend-sdk/README.md). It forms the basis of our web components. The client it
+  use of the [hanko-frontend-sdk](/frontend/frontend-sdk/README.md). It forms the basis of our web components. The client it
   provides handles communication with the Hanko backend API and saves you the time of rolling your own.
 
 # Roadmap
@@ -78,7 +78,7 @@ We are currently in **Beta** and may still have critical bugs. Watch our release
 | ⚙️ | `<hanko-profile>` web component |
 | ⚙️ | Sessions |
 | | Rate limiting (application level) |
-| | Custom translations for [hanko-elements](/elements/README.md) |
+| | Custom translations for [hanko-elements](/frontend/elements/README.md) |
 | | Email templating |
 | | OAuth plugin system (Sign in with Google/Apple/GitHub/...) |
 | | Support for native Android and iOS apps |
@@ -97,4 +97,4 @@ If you have any questions or issues, please check this project's [Q&A section in
 We invite you to join our growing [Slack community](https://www.hanko.io/community) if you want to get the latest updates on passkeys, WebAuthn, and this project, or if you just want to chat with us. You can also [follow us on Twitter](https://twitter.com/hanko_io).
 
 # Licenses
-[hanko-elements](elements) and [hanko-frontend-sdk](frontend-sdk) are licensed under the [MIT License](elements/LICENSE). Everything else in this repository, including [hanko backend](backend), is licensed under the [AGPL-3.0](/LICENSE).
+[hanko-elements](frontend/elements) and [hanko-frontend-sdk](frontend/frontend-sdk) are licensed under the [MIT License](frontend/elements/LICENSE). Everything else in this repository, including [hanko backend](backend), is licensed under the [AGPL-3.0](/LICENSE).

backend/README.md

@@ -3,7 +3,7 @@
 Hanko backend provides an HTTP API to build a modern login and registration experience for your users. Its core features
 are an API for passkeys (WebAuthn), passwords, and passcodes, as well as JWT management.
 
-Hanko backend can be used on its own or in combination with [hanko-elements](../elements), a powerful frontend library
+Hanko backend can be used on its own or in combination with [hanko-elements](../frontend/elements), a powerful frontend library
 that contains polished and customizable UI flows for password-based and passwordless user authentication that can be
 easily integrated into any web app with as little as two lines of code.
 

e2e/README.md

@@ -28,7 +28,7 @@ Furthermore, you need running instances of:
 
 - the Hanko [backend](../backend)
 - a running frontend application (e.g. our [quickstart](../quickstart)) using the web component provided by
-  [hanko-elements](../elements)
+  [hanko-elements](../frontend/elements)
 - [Mailslurper](https://github.com/mailslurper/mailslurper) as an SMTP server (used to test passcodes through mail
   retrieval via its [API](https://github.com/mailslurper/mailslurper/wiki/API-Guide))
 

examples/README.md

@@ -2,7 +2,7 @@
 
 This directory contains examples that show
 
-- integration of web component(s) provided through the`@teamhanko/hanko-elements` package (see [elements](../elements)).
+- integration of web component(s) provided through the`@teamhanko/hanko-elements` package (see [elements](../frontend/elements)).
 - how to validate JSON Web Tokens (JWT) issued by the Hanko [API](../backend) in a custom backend
 
 It contains:

frontend/elements/README.md

@@ -285,7 +285,7 @@ Result:
 
 To learn more about how to integrate the `<hanko-auth>` element into frontend frameworks, see our
 [guides](https://docs.hanko.io/guides/frontend) in the official documentation and our
-[example applications](../examples/README.md).
+[example applications](../../examples/README.md).
 
 ## Bugs
 

frontend/elements/package.json

@@ -33,7 +33,7 @@
     "lint": "eslint 'src/**/*.ts?(x)'",
     "format": "pretty-quick --staged",
     "build": "npx webpack --mode=production",
-    "build:dev": "npx webpack --mode=development --config ./webpack.config.dev.cjs"
+    "build:dev": "npx webpack --mode=development --config webpack.config.dev.cjs"
   },
   "description": "The <hanko-auth> element offers a complete user interface that will bring a modern login and registration experience to your users.",
   "repository": "github:teamhanko/hanko",

frontend/elements/src/ui/contexts/PageProvider.tsx

@@ -16,14 +16,14 @@ import { PasscodeContext } from "./PasscodeProvider";
 import { TranslateContext } from "@denysvuika/preact-translate";
 
 import Initialize from "../pages/Initialize";
-import LoginEmail from "./../pages/LoginEmail";
-import LoginPasscode from "./../pages/LoginPasscode";
-import LoginPassword from "./../pages/LoginPassword";
-import LoginFinished from "./../pages/LoginFinished";
-import RegisterConfirm from "./../pages/RegisterConfirm";
-import RegisterPassword from "./../pages/RegisterPassword";
-import RegisterAuthenticator from "./../pages/RegisterAuthenticator";
-import Error from "./../pages/Error";
+import LoginEmail from "../pages/LoginEmail";
+import LoginPasscode from "../pages/LoginPasscode";
+import LoginPassword from "../pages/LoginPassword";
+import LoginFinished from "../pages/LoginFinished";
+import RegisterConfirm from "../pages/RegisterConfirm";
+import RegisterPassword from "../pages/RegisterPassword";
+import RegisterAuthenticator from "../pages/RegisterAuthenticator";
+import Error from "../pages/Error";
 import Container from "../components/Container";
 
 interface Props {

frontend/frontend-sdk/package.json

@@ -21,7 +21,7 @@
   "scripts": {
     "lint": "eslint 'src/**/*.ts'",
     "format": "pretty-quick --staged",
-    "build": "microbundle --globals @github/webauthn-json=webauthnJson --tsconfig ./tsconfig.prod.json",
+    "build": "microbundle --globals @github/webauthn-json=webauthnJson --tsconfig tsconfig.prod.json",
     "dev": "microbundle watch",
     "docs": "jsdoc -r -c jsdoc.json -d ../docs/static/jsdoc/hanko-frontend-sdk -R README.md --pedantic",
     "test": "jest --coverage"