web: use absolute imports with path rewrite instead of relative imports (#3149)

.github/workflows/ci-web.yml

@@ -53,7 +53,12 @@ jobs:
           cache: 'npm'
           cache-dependency-path: web/package-lock.json
       - working-directory: web/
-        run: npm ci
+        run: |
+          npm ci
+          # lit-analyse doesn't understand path rewrites, so make it
+          # belive it's an actual module
+          cd node_modules/@goauthentik
+          ln -s ../../src/ web
       - name: Generate API
         run: make gen-client-web
       - name: lit-analyse

.vscode/settings.json

@@ -22,5 +22,9 @@
     "python.formatting.provider": "black",
     "files.associations": {
         "*.akflow": "json"
-    }
+    },
+    "typescript.preferences.importModuleSpecifier": "non-relative",
+    "typescript.preferences.importModuleSpecifierEnding": "js",
+    "typescript.tsdk": "./web/node_modules/typescript/lib",
+    "typescript.enablePromptUseWorkspaceTsdk": true
 }

web/.babelrc

@@ -2,6 +2,7 @@
     "presets": ["@babel/env", "@babel/typescript"],
     "plugins": [
         ["@babel/plugin-proposal-private-methods", { "loose": true }],
+        ["babel-plugin-tsconfig-paths", {}],
         [
             "@babel/plugin-proposal-decorators",
             {

web/package-lock.json

@@ -41,6 +41,7 @@
                 "@typescript-eslint/parser": "^5.29.0",
                 "@webcomponents/webcomponentsjs": "^2.6.0",
                 "babel-plugin-macros": "^3.1.0",
+                "babel-plugin-tsconfig-paths": "^1.0.3",
                 "base64-js": "^1.5.1",
                 "chart.js": "^3.8.0",
                 "chartjs-adapter-moment": "^1.0.0",
@@ -3322,6 +3323,14 @@
                 "@babel/core": "^7.0.0-0"
             }
         },
+        "node_modules/babel-plugin-tsconfig-paths": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/babel-plugin-tsconfig-paths/-/babel-plugin-tsconfig-paths-1.0.3.tgz",
+            "integrity": "sha512-eBTjzXpx0CXO2gooYPyIU1joS/eK1Vk2+oLhJDwRwIgh2+2kD/j649eYNtHjFKuXr36/4Y0ytPORLyiey7MLRA==",
+            "peerDependencies": {
+                "@babel/core": "^7.9.0"
+            }
+        },
         "node_modules/balanced-match": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -11271,6 +11280,12 @@
                 "@babel/helper-define-polyfill-provider": "^0.3.0"
             }
         },
+        "babel-plugin-tsconfig-paths": {
+            "version": "1.0.3",
+            "resolved": "https://registry.npmjs.org/babel-plugin-tsconfig-paths/-/babel-plugin-tsconfig-paths-1.0.3.tgz",
+            "integrity": "sha512-eBTjzXpx0CXO2gooYPyIU1joS/eK1Vk2+oLhJDwRwIgh2+2kD/j649eYNtHjFKuXr36/4Y0ytPORLyiey7MLRA==",
+            "requires": {}
+        },
         "balanced-match": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",

web/package.json

@@ -84,6 +84,7 @@
         "@typescript-eslint/parser": "^5.29.0",
         "@webcomponents/webcomponentsjs": "^2.6.0",
         "babel-plugin-macros": "^3.1.0",
+        "babel-plugin-tsconfig-paths": "^1.0.3",
         "base64-js": "^1.5.1",
         "chart.js": "^3.8.0",
         "chartjs-adapter-moment": "^1.0.0",

web/src/api/Config.ts

@@ -1,8 +1,8 @@
 import { Config, Configuration, CoreApi, CurrentTenant, FetchParams, Middleware, RequestContext, ResponseContext, RootApi } from "@goauthentik/api";
-import { getCookie } from "../utils";
+import { getCookie } from "@goauthentik/web/utils";
-import { APIMiddleware } from "../elements/notifications/APIDrawer";
+import { APIMiddleware } from "@goauthentik/web/elements/notifications/APIDrawer";
-import { MessageMiddleware } from "../elements/messages/Middleware";
+import { MessageMiddleware } from "@goauthentik/web/elements/messages/Middleware";
-import { VERSION } from "../constants";
+import { VERSION } from "@goauthentik/web/constants";
 
 export class LoggingMiddleware implements Middleware {
 

web/src/api/Plex.ts

@@ -1,5 +1,5 @@
-import { SentryIgnoredError } from "../common/errors";
+import { SentryIgnoredError } from "@goauthentik/web/common/errors";
-import { VERSION } from "../constants";
+import { VERSION } from "@goauthentik/web/constants";
 
 export interface PlexPinResponse {
     // Only has the fields we care about

web/src/api/Sentry.ts

@@ -1,7 +1,7 @@
 import * as Sentry from "@sentry/browser";
 import { Integrations } from "@sentry/tracing";
-import { VERSION } from "../constants";
+import { VERSION } from "@goauthentik/web/constants";
-import { SentryIgnoredError } from "../common/errors";
+import { SentryIgnoredError } from "@goauthentik/web/common/errors";
 import { me } from "./Users";
 import { config } from "./Config";
 import { Config } from "@goauthentik/api";

web/src/api/Users.ts

@@ -1,5 +1,5 @@
 import { CoreApi, ResponseError, SessionUser } from "@goauthentik/api";
-import { activateLocale } from "../interfaces/locale";
+import { activateLocale } from "@goauthentik/web/interfaces/locale";
 import { DEFAULT_CONFIG } from "./Config";
 
 let globalMePromise: Promise<SessionUser> | undefined;

web/src/common/config.ts

@@ -1,6 +1,6 @@
-import { UserSelf } from "@goauthentik/api";
+import { me } from "@goauthentik/web/api/Users";
 
-import { me } from "../api/Users";
+import { UserSelf } from "@goauthentik/api";
 
 export enum UserDisplay {
     username = "username",

web/src/common/ws.ts

@@ -1,8 +1,8 @@
-import { t } from "@lingui/macro";
+import { EVENT_WS_MESSAGE } from "@goauthentik/web/constants";
+import { MessageLevel } from "@goauthentik/web/elements/messages/Message";
+import { showMessage } from "@goauthentik/web/elements/messages/MessageContainer";
 
-import { EVENT_WS_MESSAGE } from "../constants";
+import { t } from "@lingui/macro";
-import { MessageLevel } from "../elements/messages/Message";
-import { showMessage } from "../elements/messages/MessageContainer";
 
 export interface WSMessage {
     message_type: string;

web/src/elements/Divider.ts

@@ -1,7 +1,7 @@
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 @customElement("ak-divider")

web/src/elements/EmptyState.ts

@@ -1,7 +1,7 @@
 import { CSSResult, LitElement, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFEmptyState from "@patternfly/patternfly/components/EmptyState/empty-state.css";
 import PFTitle from "@patternfly/patternfly/components/Title/title.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";

web/src/elements/Label.ts

@@ -1,7 +1,7 @@
 import { CSSResult, LitElement, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFLabel from "@patternfly/patternfly/components/Label/label.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 

web/src/elements/LoadingOverlay.ts

@@ -1,10 +1,10 @@
+import { PFSize } from "@goauthentik/web/elements/Spinner";
+
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import { PFSize } from "./Spinner";
-
 @customElement("ak-loading-overlay")
 export class LoadingOverlay extends LitElement {
     @property({ type: Boolean })

web/src/elements/Markdown.ts

@@ -2,7 +2,7 @@ import { CSSResult, LitElement, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { unsafeHTML } from "lit/directives/unsafe-html.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFContent from "@patternfly/patternfly/components/Content/content.css";
 import PFList from "@patternfly/patternfly/components/List/list.css";
 

web/src/elements/PageHeader.ts

@@ -1,26 +1,26 @@
-import { t } from "@lingui/macro";
+import { DEFAULT_CONFIG, tenant } from "@goauthentik/web/api/Config";
-
+import { currentInterface } from "@goauthentik/web/api/Sentry";
-import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
+import { me } from "@goauthentik/web/api/Users";
-import { customElement, property } from "lit/decorators.js";
-
-import AKGlobal from "../authentik.css";
-import PFButton from "@patternfly/patternfly/components/Button/button.css";
-import PFContent from "@patternfly/patternfly/components/Content/content.css";
-import PFPage from "@patternfly/patternfly/components/Page/page.css";
-import PFBase from "@patternfly/patternfly/patternfly-base.css";
-
-import { EventsApi } from "@goauthentik/api";
-
-import { DEFAULT_CONFIG, tenant } from "../api/Config";
-import { currentInterface } from "../api/Sentry";
-import { me } from "../api/Users";
 import {
     EVENT_API_DRAWER_TOGGLE,
     EVENT_NOTIFICATION_DRAWER_TOGGLE,
     EVENT_SIDEBAR_TOGGLE,
     EVENT_WS_MESSAGE,
     TITLE_DEFAULT,
-} from "../constants";
+} from "@goauthentik/web/constants";
+
+import { t } from "@lingui/macro";
+
+import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+
+import AKGlobal from "@goauthentik/web/authentik.css";
+import PFButton from "@patternfly/patternfly/components/Button/button.css";
+import PFContent from "@patternfly/patternfly/components/Content/content.css";
+import PFPage from "@patternfly/patternfly/components/Page/page.css";
+import PFBase from "@patternfly/patternfly/patternfly-base.css";
+
+import { EventsApi } from "@goauthentik/api";
 
 @customElement("ak-page-header")
 export class PageHeader extends LitElement {

web/src/elements/SearchSelect.ts

@@ -3,7 +3,7 @@ import { t } from "@lingui/macro";
 import { CSSResult, LitElement, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
 import PFSelect from "@patternfly/patternfly/components/Select/select.css";

web/src/elements/Tabs.ts

@@ -1,14 +1,15 @@
+import { CURRENT_CLASS, EVENT_REFRESH, ROUTE_SEPARATOR } from "@goauthentik/web/constants";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFTabs from "@patternfly/patternfly/components/Tabs/tabs.css";
 import PFGlobal from "@patternfly/patternfly/patternfly-base.css";
 
-import { CURRENT_CLASS, EVENT_REFRESH, ROUTE_SEPARATOR } from "../constants";
 import { getURLParams, updateURLParams } from "./router/RouteMatch";
 
 @customElement("ak-tabs")

web/src/elements/Tooltip.ts

@@ -1,7 +1,7 @@
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, state } from "lit/decorators.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFTooltip from "@patternfly/patternfly/components/Tooltip/tooltip.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 

web/src/elements/TreeView.ts

@@ -1,13 +1,14 @@
+import { EVENT_REFRESH } from "@goauthentik/web/constants";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, html } from "lit";
 import { customElement, property, state } from "lit/decorators.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFTreeView from "@patternfly/patternfly/components/TreeView/tree-view.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import { EVENT_REFRESH } from "../constants";
 import { setURLParams } from "./router/RouteMatch";
 
 export interface TreeViewItem {

web/src/elements/buttons/ActionButton.ts

@@ -1,7 +1,8 @@
+import { MessageLevel } from "@goauthentik/web/elements/messages/Message";
+import { showMessage } from "@goauthentik/web/elements/messages/MessageContainer";
+
 import { customElement, property } from "lit/decorators.js";
 
-import { MessageLevel } from "../messages/Message";
-import { showMessage } from "../messages/MessageContainer";
 import { SpinnerButton } from "./SpinnerButton";
 
 @customElement("ak-action-button")

web/src/elements/buttons/Dropdown.ts

@@ -1,8 +1,8 @@
+import { EVENT_REFRESH } from "@goauthentik/web/constants";
+
 import { LitElement, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
-import { EVENT_REFRESH } from "../../constants";
-
 @customElement("ak-dropdown")
 export class DropdownButton extends LitElement {
     menu: HTMLElement | null;

web/src/elements/buttons/ModalButton.ts

@@ -1,7 +1,9 @@
+import { PFSize } from "@goauthentik/web/elements/Spinner";
+
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFBackdrop from "@patternfly/patternfly/components/Backdrop/backdrop.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFCard from "@patternfly/patternfly/components/Card/card.css";
@@ -14,8 +16,6 @@ import PFTitle from "@patternfly/patternfly/components/Title/title.css";
 import PFBullseye from "@patternfly/patternfly/layouts/Bullseye/bullseye.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import { PFSize } from "../Spinner";
-
 export const MODAL_BUTTON_STYLES = css`
     :host {
         text-align: left;

web/src/elements/buttons/SpinnerButton.ts

@@ -1,14 +1,14 @@
+import { ERROR_CLASS, PROGRESS_CLASS, SUCCESS_CLASS } from "@goauthentik/web/constants";
+import { PFSize } from "@goauthentik/web/elements/Spinner";
+
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFSpinner from "@patternfly/patternfly/components/Spinner/spinner.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import { ERROR_CLASS, PROGRESS_CLASS, SUCCESS_CLASS } from "../../constants";
-import { PFSize } from "../Spinner";
-
 @customElement("ak-spinner-button")
 export class SpinnerButton extends LitElement {
     @property({ type: Boolean })

web/src/elements/buttons/TokenCopyButton.ts

@@ -1,13 +1,14 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import { ERROR_CLASS, SECONDARY_CLASS, SUCCESS_CLASS } from "@goauthentik/web/constants";
+import { PFSize } from "@goauthentik/web/elements/Spinner";
+import { MessageLevel } from "@goauthentik/web/elements/messages/Message";
+import { showMessage } from "@goauthentik/web/elements/messages/MessageContainer";
+
 import { TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
 import { CoreApi, ResponseError } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../api/Config";
-import { ERROR_CLASS, SECONDARY_CLASS, SUCCESS_CLASS } from "../../constants";
-import { PFSize } from "../Spinner";
-import { MessageLevel } from "../messages/Message";
-import { showMessage } from "../messages/MessageContainer";
 import { ActionButton } from "./ActionButton";
 
 @customElement("ak-token-copy-button")

web/src/elements/cards/AggregateCard.ts

@@ -2,7 +2,7 @@ import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFCard from "@patternfly/patternfly/components/Card/card.css";
 import PFFlex from "@patternfly/patternfly/layouts/Flex/flex.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";

web/src/elements/cards/AggregatePromiseCard.ts

@@ -1,9 +1,10 @@
+import { PFSize } from "@goauthentik/web/elements/Spinner";
+import "@goauthentik/web/elements/Spinner";
+
 import { TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { until } from "lit/directives/until.js";
 
-import "../Spinner";
-import { PFSize } from "../Spinner";
 import { AggregateCard } from "./AggregateCard";
 
 @customElement("ak-aggregate-card-promise")

web/src/elements/charts/AdminLoginsChart.ts

@@ -1,3 +1,4 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
 import { ChartData } from "chart.js";
 
 import { t } from "@lingui/macro";
@@ -6,7 +7,6 @@ import { customElement } from "lit/decorators.js";
 
 import { AdminApi, LoginMetrics } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../api/Config";
 import { AKChart } from "./Chart";
 
 @customElement("ak-charts-admin-login")

web/src/elements/charts/AdminModelPerDay.ts

@@ -1,3 +1,4 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
 import { ChartData, Tick } from "chart.js";
 
 import { t } from "@lingui/macro";
@@ -6,7 +7,6 @@ import { customElement, property } from "lit/decorators.js";
 
 import { Coordinate, EventActions, EventsApi } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../api/Config";
 import { AKChart } from "./Chart";
 
 @customElement("ak-charts-admin-model-per-day")

web/src/elements/charts/ApplicationAuthorizeChart.ts

@@ -1,3 +1,4 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
 import { ChartData } from "chart.js";
 
 import { t } from "@lingui/macro";
@@ -6,7 +7,6 @@ import { customElement, property } from "lit/decorators.js";
 
 import { Coordinate, CoreApi } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../api/Config";
 import { AKChart } from "./Chart";
 
 @customElement("ak-charts-application-authorize")

web/src/elements/charts/Chart.ts

@@ -1,3 +1,8 @@
+import { EVENT_REFRESH } from "@goauthentik/web/constants";
+import {
+    FONT_COLOUR_DARK_MODE,
+    FONT_COLOUR_LIGHT_MODE,
+} from "@goauthentik/web/pages/flows/FlowDiagram";
 import { Chart, ChartConfiguration, ChartData, ChartOptions, Plugin, Tick } from "chart.js";
 import { Legend, Tooltip } from "chart.js";
 import { BarController, DoughnutController, LineController } from "chart.js";
@@ -10,9 +15,6 @@ import { t } from "@lingui/macro";
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { property } from "lit/decorators.js";
 
-import { EVENT_REFRESH } from "../../constants";
-import { FONT_COLOUR_DARK_MODE, FONT_COLOUR_LIGHT_MODE } from "../../pages/flows/FlowDiagram";
-
 Chart.register(Legend, Tooltip);
 Chart.register(LineController, BarController, DoughnutController);
 Chart.register(ArcElement, BarElement);

web/src/elements/charts/UserChart.ts

@@ -1,3 +1,4 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
 import { ChartData } from "chart.js";
 
 import { t } from "@lingui/macro";
@@ -6,7 +7,6 @@ import { customElement, property } from "lit/decorators.js";
 
 import { CoreApi, UserMetrics } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../api/Config";
 import { AKChart } from "./Chart";
 
 @customElement("ak-charts-user")

web/src/elements/chips/Chip.ts

@@ -1,7 +1,7 @@
 import { CSSResult, LitElement, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFChip from "@patternfly/patternfly/components/Chip/chip.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";

web/src/elements/chips/ChipGroup.ts

@@ -1,7 +1,7 @@
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFChip from "@patternfly/patternfly/components/Chip/chip.css";
 import PFChipGroup from "@patternfly/patternfly/components/ChipGroup/chip-group.css";

web/src/elements/events/ObjectChangelog.ts

@@ -1,3 +1,14 @@
+import { AKResponse } from "@goauthentik/web/api/Client";
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import { EventWithContext } from "@goauthentik/web/api/Events";
+import { uiConfig } from "@goauthentik/web/common/config";
+import "@goauthentik/web/elements/Tabs";
+import "@goauthentik/web/elements/buttons/Dropdown";
+import "@goauthentik/web/elements/buttons/ModalButton";
+import "@goauthentik/web/elements/buttons/SpinnerButton";
+import { Table, TableColumn } from "@goauthentik/web/elements/table/Table";
+import "@goauthentik/web/pages/events/EventInfo";
+
 import { t } from "@lingui/macro";
 
 import { TemplateResult, html } from "lit";
@@ -5,17 +16,6 @@ import { customElement, property } from "lit/decorators.js";
 
 import { Event, EventsApi } from "@goauthentik/api";
 
-import { AKResponse } from "../../api/Client";
-import { DEFAULT_CONFIG } from "../../api/Config";
-import { EventWithContext } from "../../api/Events";
-import { uiConfig } from "../../common/config";
-import "../../pages/events/EventInfo";
-import "../Tabs";
-import "../buttons/Dropdown";
-import "../buttons/ModalButton";
-import "../buttons/SpinnerButton";
-import { Table, TableColumn } from "../table/Table";
-
 @customElement("ak-object-changelog")
 export class ObjectChangelog extends Table<Event> {
     expandable = true;

web/src/elements/events/UserEvents.ts

@@ -1,3 +1,14 @@
+import { AKResponse } from "@goauthentik/web/api/Client";
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import { EventWithContext } from "@goauthentik/web/api/Events";
+import { uiConfig } from "@goauthentik/web/common/config";
+import "@goauthentik/web/elements/../pages/events/EventInfo";
+import "@goauthentik/web/elements/Tabs";
+import "@goauthentik/web/elements/buttons/Dropdown";
+import "@goauthentik/web/elements/buttons/ModalButton";
+import "@goauthentik/web/elements/buttons/SpinnerButton";
+import { Table, TableColumn } from "@goauthentik/web/elements/table/Table";
+
 import { t } from "@lingui/macro";
 
 import { TemplateResult, html } from "lit";
@@ -5,17 +16,6 @@ import { customElement, property } from "lit/decorators.js";
 
 import { Event, EventsApi } from "@goauthentik/api";
 
-import { AKResponse } from "../../api/Client";
-import { DEFAULT_CONFIG } from "../../api/Config";
-import { EventWithContext } from "../../api/Events";
-import { uiConfig } from "../../common/config";
-import "../../pages/events/EventInfo";
-import "../Tabs";
-import "../buttons/Dropdown";
-import "../buttons/ModalButton";
-import "../buttons/SpinnerButton";
-import { Table, TableColumn } from "../table/Table";
-
 @customElement("ak-events-user")
 export class ObjectChangelog extends Table<Event> {
     expandable = true;

web/src/elements/forms/ConfirmationForm.ts

@@ -1,14 +1,14 @@
+import { EVENT_REFRESH } from "@goauthentik/web/constants";
+import { ModalButton } from "@goauthentik/web/elements/buttons/ModalButton";
+import "@goauthentik/web/elements/buttons/SpinnerButton";
+import { MessageLevel } from "@goauthentik/web/elements/messages/Message";
+import { showMessage } from "@goauthentik/web/elements/messages/MessageContainer";
+
 import { t } from "@lingui/macro";
 
 import { TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import { EVENT_REFRESH } from "../../constants";
-import { ModalButton } from "../buttons/ModalButton";
-import "../buttons/SpinnerButton";
-import { MessageLevel } from "../messages/Message";
-import { showMessage } from "../messages/MessageContainer";
-
 @customElement("ak-forms-confirm")
 export class ConfirmationForm extends ModalButton {
     @property()

web/src/elements/forms/DeleteBulkForm.ts

@@ -1,3 +1,12 @@
+import { AKResponse } from "@goauthentik/web/api/Client";
+import { EVENT_REFRESH } from "@goauthentik/web/constants";
+import { PFSize } from "@goauthentik/web/elements/Spinner";
+import { ModalButton } from "@goauthentik/web/elements/buttons/ModalButton";
+import "@goauthentik/web/elements/buttons/SpinnerButton";
+import { MessageLevel } from "@goauthentik/web/elements/messages/Message";
+import { showMessage } from "@goauthentik/web/elements/messages/MessageContainer";
+import { Table, TableColumn } from "@goauthentik/web/elements/table/Table";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
@@ -8,15 +17,6 @@ import PFList from "@patternfly/patternfly/components/List/list.css";
 
 import { UsedBy, UsedByActionEnum } from "@goauthentik/api";
 
-import { AKResponse } from "../../api/Client";
-import { EVENT_REFRESH } from "../../constants";
-import { PFSize } from "../Spinner";
-import { ModalButton } from "../buttons/ModalButton";
-import "../buttons/SpinnerButton";
-import { MessageLevel } from "../messages/Message";
-import { showMessage } from "../messages/MessageContainer";
-import { Table, TableColumn } from "../table/Table";
-
 type BulkDeleteMetadata = { key: string; value: string }[];
 
 @customElement("ak-delete-objects-table")

web/src/elements/forms/DeleteForm.ts

@@ -1,3 +1,9 @@
+import { EVENT_REFRESH } from "@goauthentik/web/constants";
+import { ModalButton } from "@goauthentik/web/elements/buttons/ModalButton";
+import "@goauthentik/web/elements/buttons/SpinnerButton";
+import { MessageLevel } from "@goauthentik/web/elements/messages/Message";
+import { showMessage } from "@goauthentik/web/elements/messages/MessageContainer";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
@@ -8,12 +14,6 @@ import PFList from "@patternfly/patternfly/components/List/list.css";
 
 import { UsedBy, UsedByActionEnum } from "@goauthentik/api";
 
-import { EVENT_REFRESH } from "../../constants";
-import { ModalButton } from "../buttons/ModalButton";
-import "../buttons/SpinnerButton";
-import { MessageLevel } from "../messages/Message";
-import { showMessage } from "../messages/MessageContainer";
-
 @customElement("ak-forms-delete")
 export class DeleteForm extends ModalButton {
     static get styles(): CSSResult[] {

web/src/elements/forms/Form.ts

@@ -1,3 +1,8 @@
+import { SearchSelect } from "@goauthentik/web/SearchSelect";
+import { EVENT_REFRESH } from "@goauthentik/web/constants";
+import { MessageLevel } from "@goauthentik/web/elements/messages/Message";
+import { showMessage } from "@goauthentik/web/elements/messages/MessageContainer";
+import { camelToSnake, convertToSlug } from "@goauthentik/web/utils";
 import "@polymer/iron-form/iron-form";
 import { IronFormElement } from "@polymer/iron-form/iron-form";
 import "@polymer/paper-input/paper-input";
@@ -5,7 +10,7 @@ import "@polymer/paper-input/paper-input";
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFAlert from "@patternfly/patternfly/components/Alert/alert.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFCard from "@patternfly/patternfly/components/Card/card.css";
@@ -16,11 +21,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { ResponseError, ValidationError } from "@goauthentik/api";
 
-import { EVENT_REFRESH } from "../../constants";
-import { showMessage } from "../../elements/messages/MessageContainer";
-import { camelToSnake, convertToSlug } from "../../utils";
-import { SearchSelect } from "../SearchSelect";
-import { MessageLevel } from "../messages/Message";
 import { HorizontalFormElement } from "./HorizontalFormElement";
 
 export class APIError extends Error {

web/src/elements/forms/FormGroup.ts

@@ -1,7 +1,7 @@
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";

web/src/elements/forms/HorizontalFormElement.ts

@@ -1,15 +1,16 @@
+import { convertToSlug } from "@goauthentik/web/utils";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, css } from "lit";
 import { TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import { convertToSlug } from "../../utils";
 import { FormGroup } from "./FormGroup";
 
 @customElement("ak-form-element-horizontal")

web/src/elements/forms/ModalForm.ts

@@ -1,12 +1,13 @@
+import { EVENT_REFRESH } from "@goauthentik/web/constants";
+import "@goauthentik/web/elements/LoadingOverlay";
+import { ModalButton } from "@goauthentik/web/elements/buttons/ModalButton";
+import "@goauthentik/web/elements/buttons/SpinnerButton";
+
 import { t } from "@lingui/macro";
 
 import { TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import { EVENT_REFRESH } from "../../constants";
-import "../LoadingOverlay";
-import { ModalButton } from "../buttons/ModalButton";
-import "../buttons/SpinnerButton";
 import { Form } from "./Form";
 
 @customElement("ak-forms-modal")

web/src/elements/forms/ModelForm.ts

@@ -1,7 +1,8 @@
+import { EVENT_REFRESH } from "@goauthentik/web/constants";
+
 import { TemplateResult } from "lit";
 import { property } from "lit/decorators.js";
 
-import { EVENT_REFRESH } from "../../constants";
 import { Form } from "./Form";
 
 export abstract class ModelForm<T, PKT extends string | number> extends Form<T> {

web/src/elements/messages/MessageContainer.ts

@@ -1,15 +1,15 @@
+import { SentryIgnoredError } from "@goauthentik/web/common/errors";
+import { WSMessage } from "@goauthentik/web/common/ws";
+import { EVENT_WS_MESSAGE, WS_MSG_TYPE_MESSAGE } from "@goauthentik/web/constants";
+import "@goauthentik/web/elements/messages/Message";
+import { APIMessage } from "@goauthentik/web/elements/messages/Message";
+
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
 import PFAlertGroup from "@patternfly/patternfly/components/AlertGroup/alert-group.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import { SentryIgnoredError } from "../../common/errors";
-import { WSMessage } from "../../common/ws";
-import { EVENT_WS_MESSAGE, WS_MSG_TYPE_MESSAGE } from "../../constants";
-import "./Message";
-import { APIMessage } from "./Message";
-
 export function showMessage(message: APIMessage, unique = false): void {
     const container = document.querySelector<MessageContainer>("ak-message-container");
     if (!container) {

web/src/elements/messages/Middleware.ts

@@ -1,10 +1,10 @@
+import { MessageLevel } from "@goauthentik/web/elements/messages/Message";
+import { showMessage } from "@goauthentik/web/elements/messages/MessageContainer";
+
 import { t } from "@lingui/macro";
 
 import { Middleware, ResponseContext } from "@goauthentik/api";
 
-import { MessageLevel } from "./Message";
-import { showMessage } from "./MessageContainer";
-
 export class MessageMiddleware implements Middleware {
     post(context: ResponseContext): Promise<Response | void> {
         if (context.response.status >= 500) {

web/src/elements/notifications/APIDrawer.ts

@@ -1,9 +1,11 @@
+import { EVENT_API_DRAWER_REFRESH, EVENT_API_DRAWER_TOGGLE } from "@goauthentik/web/constants";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFContent from "@patternfly/patternfly/components/Content/content.css";
 import PFDropdown from "@patternfly/patternfly/components/Dropdown/dropdown.css";
@@ -12,8 +14,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { Middleware, ResponseContext } from "@goauthentik/api";
 
-import { EVENT_API_DRAWER_REFRESH, EVENT_API_DRAWER_TOGGLE } from "../../constants";
-
 export interface RequestInfo {
     method: string;
     path: string;

web/src/elements/notifications/NotificationDrawer.ts

@@ -1,9 +1,17 @@
+import { AKResponse } from "@goauthentik/web/api/Client";
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import { me } from "@goauthentik/web/api/Users";
+import { EVENT_NOTIFICATION_DRAWER_TOGGLE, EVENT_REFRESH } from "@goauthentik/web/constants";
+import { MessageLevel } from "@goauthentik/web/elements/messages/Message";
+import { showMessage } from "@goauthentik/web/elements/messages/MessageContainer";
+import { ActionToLabel } from "@goauthentik/web/pages/events/utils";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFContent from "@patternfly/patternfly/components/Content/content.css";
 import PFDropdown from "@patternfly/patternfly/components/Dropdown/dropdown.css";
@@ -12,14 +20,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { EventsApi, Notification } from "@goauthentik/api";
 
-import { AKResponse } from "../../api/Client";
-import { DEFAULT_CONFIG } from "../../api/Config";
-import { me } from "../../api/Users";
-import { EVENT_NOTIFICATION_DRAWER_TOGGLE, EVENT_REFRESH } from "../../constants";
-import { ActionToLabel } from "../../pages/events/utils";
-import { MessageLevel } from "../messages/Message";
-import { showMessage } from "../messages/MessageContainer";
-
 @customElement("ak-notification-drawer")
 export class NotificationDrawer extends LitElement {
     @property({ attribute: false })

web/src/elements/oauth/UserRefreshList.ts

@@ -1,3 +1,10 @@
+import { AKResponse } from "@goauthentik/web/api/Client";
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import { uiConfig } from "@goauthentik/web/common/config";
+import { PFColor } from "@goauthentik/web/elements/Label";
+import "@goauthentik/web/elements/forms/DeleteBulkForm";
+import { Table, TableColumn } from "@goauthentik/web/elements/table/Table";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
@@ -7,13 +14,6 @@ import PFFlex from "@patternfly/patternfly/layouts/Flex/flex.css";
 
 import { ExpiringBaseGrantModel, Oauth2Api, RefreshTokenModel } from "@goauthentik/api";
 
-import { AKResponse } from "../../api/Client";
-import { DEFAULT_CONFIG } from "../../api/Config";
-import { uiConfig } from "../../common/config";
-import { PFColor } from "../Label";
-import "../forms/DeleteBulkForm";
-import { Table, TableColumn } from "../table/Table";
-
 @customElement("ak-user-oauth-refresh-list")
 export class UserOAuthRefreshList extends Table<RefreshTokenModel> {
     expandable = true;

web/src/elements/router/Route.ts

@@ -1,8 +1,8 @@
+import "@goauthentik/web/elements/EmptyState";
+
 import { TemplateResult, html } from "lit";
 import { until } from "lit/directives/until.js";
 
-import "../EmptyState";
-
 export const SLUG_REGEX = "[-a-zA-Z0-9_]+";
 export const ID_REGEX = "\\d+";
 export const UUID_REGEX = "[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}";

web/src/elements/router/RouteMatch.ts

@@ -1,7 +1,7 @@
-import { TemplateResult } from "lit";
+import { ROUTE_SEPARATOR } from "@goauthentik/web/constants";
+import { Route } from "@goauthentik/web/elements/router/Route";
 
-import { ROUTE_SEPARATOR } from "../../constants";
+import { TemplateResult } from "lit";
-import { Route } from "./Route";
 
 export class RouteMatch {
     route: Route;

web/src/elements/router/RouterOutlet.ts

@@ -1,12 +1,13 @@
+import { ROUTE_SEPARATOR } from "@goauthentik/web/constants";
+import "@goauthentik/web/elements/router/Router404";
+
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 
-import { ROUTE_SEPARATOR } from "../../constants";
 import { Route } from "./Route";
 import { RouteMatch } from "./RouteMatch";
-import "./Router404";
 
 // Poliyfill for hashchange.newURL,
 // https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onhashchange

web/src/elements/sidebar/Sidebar.ts

@@ -1,14 +1,14 @@
+import "@goauthentik/web/elements/sidebar/SidebarBrand";
+import "@goauthentik/web/elements/sidebar/SidebarUser";
+
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFNav from "@patternfly/patternfly/components/Nav/nav.css";
 import PFPage from "@patternfly/patternfly/components/Page/page.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import "./SidebarBrand";
-import "./SidebarUser";
-
 @customElement("ak-sidebar")
 export class Sidebar extends LitElement {
     static get styles(): CSSResult[] {

web/src/elements/sidebar/SidebarBrand.ts

@@ -1,7 +1,12 @@
+import { tenant } from "@goauthentik/web/api/Config";
+import { configureSentry } from "@goauthentik/web/api/Sentry";
+import { EVENT_SIDEBAR_TOGGLE } from "@goauthentik/web/constants";
+import { first } from "@goauthentik/web/utils";
+
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFPage from "@patternfly/patternfly/components/Page/page.css";
 import PFGlobal from "@patternfly/patternfly/patternfly-base.css";
@@ -9,11 +14,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { CurrentTenant } from "@goauthentik/api";
 
-import { tenant } from "../../api/Config";
-import { configureSentry } from "../../api/Sentry";
-import { EVENT_SIDEBAR_TOGGLE } from "../../constants";
-import { first } from "../../utils";
-
 // If the viewport is wider than MIN_WIDTH, the sidebar
 // is shown besides the content, and not overlaid.
 export const MIN_WIDTH = 1200;

web/src/elements/sidebar/SidebarItem.ts

@@ -1,15 +1,15 @@
+import { ROUTE_SEPARATOR } from "@goauthentik/web/constants";
+
 import { CSSResult, LitElement, css } from "lit";
 import { TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { until } from "lit/directives/until.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFNav from "@patternfly/patternfly/components/Nav/nav.css";
 import PFPage from "@patternfly/patternfly/components/Page/page.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import { ROUTE_SEPARATOR } from "../../constants";
-
 @customElement("ak-sidebar-item")
 export class SidebarItem extends LitElement {
     static get styles(): CSSResult[] {

web/src/elements/sidebar/SidebarUser.ts

@@ -1,3 +1,5 @@
+import { me } from "@goauthentik/web/api/Users";
+
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
@@ -7,8 +9,6 @@ import PFAvatar from "@patternfly/patternfly/components/Avatar/avatar.css";
 import PFNav from "@patternfly/patternfly/components/Nav/nav.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import { me } from "../../api/Users";
-
 @customElement("ak-sidebar-user")
 export class SidebarUser extends LitElement {
     static get styles(): CSSResult[] {

web/src/elements/table/Table.ts

@@ -1,10 +1,21 @@
+import { AKResponse } from "@goauthentik/web/api/Client";
+import { EVENT_REFRESH } from "@goauthentik/web/constants";
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/elements/buttons/SpinnerButton";
+import "@goauthentik/web/elements/chips/Chip";
+import "@goauthentik/web/elements/chips/ChipGroup";
+import { getURLParam, updateURLParams } from "@goauthentik/web/elements/router/RouteMatch";
+import "@goauthentik/web/elements/table/TablePagination";
+import "@goauthentik/web/elements/table/TableSearch";
+import { groupBy } from "@goauthentik/web/utils";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, html } from "lit";
 import { property, state } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFDropdown from "@patternfly/patternfly/components/Dropdown/dropdown.css";
 import PFPagination from "@patternfly/patternfly/components/Pagination/pagination.css";
@@ -13,17 +24,6 @@ import PFToolbar from "@patternfly/patternfly/components/Toolbar/toolbar.css";
 import PFBullseye from "@patternfly/patternfly/layouts/Bullseye/bullseye.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import { AKResponse } from "../../api/Client";
-import { EVENT_REFRESH } from "../../constants";
-import { groupBy } from "../../utils";
-import "../EmptyState";
-import "../buttons/SpinnerButton";
-import "../chips/Chip";
-import "../chips/ChipGroup";
-import { getURLParam, updateURLParams } from "../router/RouteMatch";
-import "./TablePagination";
-import "./TableSearch";
-
 export class TableColumn {
     title: string;
     orderBy?: string;

web/src/elements/table/TableModal.ts

@@ -1,8 +1,11 @@
+import { PFSize } from "@goauthentik/web/elements/Spinner";
+import { MODAL_BUTTON_STYLES } from "@goauthentik/web/elements/buttons/ModalButton";
+
 import { CSSResult, LitElement } from "lit";
 import { TemplateResult, html } from "lit";
 import { property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFBackdrop from "@patternfly/patternfly/components/Backdrop/backdrop.css";
 import PFContent from "@patternfly/patternfly/components/Content/content.css";
 import PFModalBox from "@patternfly/patternfly/components/ModalBox/modal-box.css";
@@ -10,8 +13,6 @@ import PFPage from "@patternfly/patternfly/components/Page/page.css";
 import PFBullseye from "@patternfly/patternfly/layouts/Bullseye/bullseye.css";
 import PFStack from "@patternfly/patternfly/layouts/Stack/stack.css";
 
-import { PFSize } from "../Spinner";
-import { MODAL_BUTTON_STYLES } from "../buttons/ModalButton";
 import { Table } from "./Table";
 
 export abstract class TableModal<T> extends Table<T> {

web/src/elements/table/TablePage.ts

@@ -1,3 +1,6 @@
+import "@goauthentik/web/elements/../elements/PageHeader";
+import { updateURLParams } from "@goauthentik/web/elements/router/RouteMatch";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult } from "lit";
@@ -8,8 +11,6 @@ import PFContent from "@patternfly/patternfly/components/Content/content.css";
 import PFPage from "@patternfly/patternfly/components/Page/page.css";
 import PFSidebar from "@patternfly/patternfly/components/Sidebar/sidebar.css";
 
-import "../../elements/PageHeader";
-import { updateURLParams } from "../router/RouteMatch";
 import { Table } from "./Table";
 
 export abstract class TablePage<T> extends Table<T> {

web/src/elements/table/TablePagination.ts

@@ -1,15 +1,15 @@
+import { AKPagination } from "@goauthentik/web/api/Client";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFPagination from "@patternfly/patternfly/components/Pagination/pagination.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import { AKPagination } from "../../api/Client";
-
 @customElement("ak-table-pagination")
 export class TablePagination extends LitElement {
     @property({ attribute: false })

web/src/elements/table/TableSearch.ts

@@ -4,7 +4,7 @@ import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
 import PFInputGroup from "@patternfly/patternfly/components/InputGroup/input-group.css";

web/src/elements/user/SessionList.ts

@@ -1,3 +1,9 @@
+import { AKResponse } from "@goauthentik/web/api/Client";
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import { uiConfig } from "@goauthentik/web/common/config";
+import "@goauthentik/web/elements/forms/DeleteBulkForm";
+import { Table, TableColumn } from "@goauthentik/web/elements/table/Table";
+
 import { t } from "@lingui/macro";
 
 import { TemplateResult, html } from "lit";
@@ -5,12 +11,6 @@ import { customElement, property } from "lit/decorators.js";
 
 import { AuthenticatedSession, CoreApi } from "@goauthentik/api";
 
-import { AKResponse } from "../../api/Client";
-import { DEFAULT_CONFIG } from "../../api/Config";
-import { uiConfig } from "../../common/config";
-import "../forms/DeleteBulkForm";
-import { Table, TableColumn } from "../table/Table";
-
 @customElement("ak-user-session-list")
 export class AuthenticatedSessionList extends Table<AuthenticatedSession> {
     @property()

web/src/elements/user/UserConsentList.ts

@@ -1,3 +1,9 @@
+import { AKResponse } from "@goauthentik/web/api/Client";
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import { uiConfig } from "@goauthentik/web/common/config";
+import "@goauthentik/web/elements/forms/DeleteBulkForm";
+import { Table, TableColumn } from "@goauthentik/web/elements/table/Table";
+
 import { t } from "@lingui/macro";
 
 import { TemplateResult, html } from "lit";
@@ -5,12 +11,6 @@ import { customElement, property } from "lit/decorators.js";
 
 import { CoreApi, UserConsent } from "@goauthentik/api";
 
-import { AKResponse } from "../../api/Client";
-import { DEFAULT_CONFIG } from "../../api/Config";
-import { uiConfig } from "../../common/config";
-import "../forms/DeleteBulkForm";
-import { Table, TableColumn } from "../table/Table";
-
 @customElement("ak-user-consent-list")
 export class UserConsentList extends Table<UserConsent> {
     @property({ type: Number })

web/src/elements/utils/TimeDeltaHelp.ts

@@ -1,15 +1,15 @@
+import "@goauthentik/web/elements/Tooltip";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFList from "@patternfly/patternfly/components/List/list.css";
 import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
-import "../Tooltip";
-
 @customElement("ak-utils-time-delta-help")
 export class TimeDeltaHelp extends LitElement {
     @property({ type: Boolean })

web/src/elements/wizard/FormWizardPage.ts

@@ -1,8 +1,9 @@
+import { Form } from "@goauthentik/web/elements/forms/Form";
+
 import { t } from "@lingui/macro";
 
 import { customElement } from "lit/decorators.js";
 
-import { Form } from "../forms/Form";
 import { WizardPage } from "./WizardPage";
 
 @customElement("ak-wizard-page-form")

web/src/elements/wizard/Wizard.ts

@@ -1,3 +1,5 @@
+import { ModalButton } from "@goauthentik/web/elements/buttons/ModalButton";
+
 import { t } from "@lingui/macro";
 
 import { customElement } from "@lit/reactive-element/decorators/custom-element.js";
@@ -7,7 +9,6 @@ import { state } from "lit/decorators.js";
 
 import PFWizard from "@patternfly/patternfly/components/Wizard/wizard.css";
 
-import { ModalButton } from "../buttons/ModalButton";
 import { WizardPage } from "./WizardPage";
 
 @customElement("ak-wizard")

web/src/flows/FlowExecutor.ts

@@ -1,3 +1,21 @@
+import { DEFAULT_CONFIG, tenant } from "@goauthentik/web/api/Config";
+import { configureSentry } from "@goauthentik/web/api/Sentry";
+import { WebsocketClient } from "@goauthentik/web/common/ws";
+import { EVENT_FLOW_ADVANCE, TITLE_DEFAULT } from "@goauthentik/web/constants";
+import "@goauthentik/web/elements/LoadingOverlay";
+import "@goauthentik/web/flows/stages/RedirectStage";
+import "@goauthentik/web/flows/stages/access_denied/AccessDeniedStage";
+// Import webauthn-related stages to prevent issues on safari
+// Which is overly sensitive to allowing things only in the context of a
+// user interaction
+import "@goauthentik/web/flows/stages/authenticator_validate/AuthenticatorValidateStage";
+import "@goauthentik/web/flows/stages/authenticator_webauthn/WebAuthnAuthenticatorRegisterStage";
+import "@goauthentik/web/flows/stages/autosubmit/AutosubmitStage";
+import "@goauthentik/web/flows/stages/captcha/CaptchaStage";
+import "@goauthentik/web/flows/stages/identification/IdentificationStage";
+import "@goauthentik/web/flows/stages/password/PasswordStage";
+import { first } from "@goauthentik/web/utils";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
@@ -5,7 +23,7 @@ import { customElement, property } from "lit/decorators.js";
 import { unsafeHTML } from "lit/directives/unsafe-html.js";
 import { until } from "lit/directives/until.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFBackgroundImage from "@patternfly/patternfly/components/BackgroundImage/background-image.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFDrawer from "@patternfly/patternfly/components/Drawer/drawer.css";
@@ -26,24 +44,7 @@ import {
     ShellChallenge,
 } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG, tenant } from "../api/Config";
-import { configureSentry } from "../api/Sentry";
-import { WebsocketClient } from "../common/ws";
-import { EVENT_FLOW_ADVANCE, TITLE_DEFAULT } from "../constants";
-import "../elements/LoadingOverlay";
-import { first } from "../utils";
-import "./stages/RedirectStage";
-import "./stages/access_denied/AccessDeniedStage";
-// Import webauthn-related stages to prevent issues on safari
-// Which is overly sensitive to allowing things only in the context of a
-// user interaction
-import "./stages/authenticator_validate/AuthenticatorValidateStage";
-import "./stages/authenticator_webauthn/WebAuthnAuthenticatorRegisterStage";
-import "./stages/autosubmit/AutosubmitStage";
 import { StageHost } from "./stages/base";
-import "./stages/captcha/CaptchaStage";
-import "./stages/identification/IdentificationStage";
-import "./stages/password/PasswordStage";
 
 export interface FlowWindow extends Window {
     authentik: {

web/src/flows/FlowInspector.ts

@@ -1,9 +1,13 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import { EVENT_FLOW_ADVANCE } from "@goauthentik/web/constants";
+import "@goauthentik/web/elements/Expand";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFCard from "@patternfly/patternfly/components/Card/card.css";
 import PFDescriptionList from "@patternfly/patternfly/components/DescriptionList/description-list.css";
 import PFNotificationDrawer from "@patternfly/patternfly/components/NotificationDrawer/notification-drawer.css";
@@ -13,10 +17,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { FlowInspection, FlowsApi, Stage } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../api/Config";
-import { EVENT_FLOW_ADVANCE } from "../constants";
-import "../elements/Expand";
-
 @customElement("ak-flow-inspector")
 export class FlowInspector extends LitElement {
     flowSlug: string;

web/src/flows/sources/apple/AppleLoginInit.ts

@@ -1,9 +1,12 @@
+import "@goauthentik/web/elements/EmptyState";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -13,9 +16,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { AppleChallengeResponseRequest, AppleLoginChallenge } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import { BaseStage } from "../../stages/base";
-
 @customElement("ak-flow-sources-oauth-apple")
 export class AppleLoginInit extends BaseStage<AppleLoginChallenge, AppleChallengeResponseRequest> {
     @property({ type: Boolean })

web/src/flows/sources/plex/PlexLoginInit.ts

@@ -1,10 +1,16 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import { PlexAPIClient, popupCenterScreen } from "@goauthentik/web/api/Plex";
+import { MessageLevel } from "@goauthentik/web/elements/messages/Message";
+import { showMessage } from "@goauthentik/web/elements/messages/MessageContainer";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult } from "lit";
 import { TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -19,12 +25,6 @@ import {
 } from "@goauthentik/api";
 import { SourcesApi } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../../api/Config";
-import { PlexAPIClient, popupCenterScreen } from "../../../api/Plex";
-import { MessageLevel } from "../../../elements/messages/Message";
-import { showMessage } from "../../../elements/messages/MessageContainer";
-import { BaseStage } from "../../stages/base";
-
 @customElement("ak-flow-sources-plex")
 export class PlexLoginInit extends BaseStage<
     PlexAuthenticationChallenge,

web/src/flows/stages/RedirectStage.ts

@@ -3,7 +3,7 @@ import { t } from "@lingui/macro";
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";

web/src/flows/stages/access_denied/AccessDeniedStage.ts

@@ -1,10 +1,14 @@
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/flows/FormStatic";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
 import PFList from "@patternfly/patternfly/components/List/list.css";
@@ -14,10 +18,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { AccessDeniedChallenge, FlowChallengeResponseRequest } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import "../../FormStatic";
-import { BaseStage } from "../base";
-
 @customElement("ak-stage-access-denied")
 export class AccessDeniedStage extends BaseStage<
     AccessDeniedChallenge,

web/src/flows/stages/authenticator_duo/AuthenticatorDuoStage.ts

@@ -1,10 +1,16 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/elements/forms/FormElement";
+import "@goauthentik/web/flows/FormStatic";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -18,12 +24,6 @@ import {
     StagesApi,
 } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../../api/Config";
-import "../../../elements/EmptyState";
-import "../../../elements/forms/FormElement";
-import "../../FormStatic";
-import { BaseStage } from "../base";
-
 @customElement("ak-stage-authenticator-duo")
 export class AuthenticatorDuoStage extends BaseStage<
     AuthenticatorDuoChallenge,

web/src/flows/stages/authenticator_sms/AuthenticatorSMSStage.ts

@@ -1,10 +1,15 @@
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/elements/forms/FormElement";
+import "@goauthentik/web/flows/FormStatic";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFAlert from "@patternfly/patternfly/components/Alert/alert.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
@@ -18,11 +23,6 @@ import {
     AuthenticatorSMSChallengeResponseRequest,
 } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import "../../../elements/forms/FormElement";
-import "../../FormStatic";
-import { BaseStage } from "../base";
-
 @customElement("ak-stage-authenticator-sms")
 export class AuthenticatorSMSStage extends BaseStage<
     AuthenticatorSMSChallenge,

web/src/flows/stages/authenticator_static/AuthenticatorStaticStage.ts

@@ -1,10 +1,15 @@
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/elements/forms/FormElement";
+import "@goauthentik/web/flows/FormStatic";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -17,11 +22,6 @@ import {
     AuthenticatorStaticChallengeResponseRequest,
 } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import "../../../elements/forms/FormElement";
-import "../../FormStatic";
-import { BaseStage } from "../base";
-
 @customElement("ak-stage-authenticator-static")
 export class AuthenticatorStaticStage extends BaseStage<
     AuthenticatorStaticChallenge,

web/src/flows/stages/authenticator_totp/AuthenticatorTOTPStage.ts

@@ -1,3 +1,9 @@
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/elements/forms/FormElement";
+import { MessageLevel } from "@goauthentik/web/elements/messages/Message";
+import { showMessage } from "@goauthentik/web/elements/messages/MessageContainer";
+import "@goauthentik/web/flows/FormStatic";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
 import "webcomponent-qr-code";
 
 import { t } from "@lingui/macro";
@@ -6,7 +12,7 @@ import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -19,13 +25,6 @@ import {
     AuthenticatorTOTPChallengeResponseRequest,
 } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import "../../../elements/forms/FormElement";
-import { MessageLevel } from "../../../elements/messages/Message";
-import { showMessage } from "../../../elements/messages/MessageContainer";
-import "../../FormStatic";
-import { BaseStage } from "../base";
-
 @customElement("ak-stage-authenticator-totp")
 export class AuthenticatorTOTPStage extends BaseStage<
     AuthenticatorTOTPChallenge,

web/src/flows/stages/authenticator_validate/AuthenticatorValidateStage.ts

@@ -1,10 +1,17 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import "@goauthentik/web/flows/stages/authenticator_validate/AuthenticatorValidateStageCode";
+import "@goauthentik/web/flows/stages/authenticator_validate/AuthenticatorValidateStageDuo";
+import "@goauthentik/web/flows/stages/authenticator_validate/AuthenticatorValidateStageWebAuthn";
+import { BaseStage, StageHost } from "@goauthentik/web/flows/stages/base";
+import { PasswordManagerPrefill } from "@goauthentik/web/flows/stages/identification/IdentificationStage";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, css, html } from "lit";
 import { customElement, state } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -21,13 +28,6 @@ import {
     FlowsApi,
 } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../../api/Config";
-import { BaseStage, StageHost } from "../base";
-import { PasswordManagerPrefill } from "../identification/IdentificationStage";
-import "./AuthenticatorValidateStageCode";
-import "./AuthenticatorValidateStageDuo";
-import "./AuthenticatorValidateStageWebAuthn";
-
 @customElement("ak-stage-authenticator-validate")
 export class AuthenticatorValidateStage
     extends BaseStage<

web/src/flows/stages/authenticator_validate/AuthenticatorValidateStageCode.ts

@@ -1,10 +1,16 @@
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/elements/forms/FormElement";
+import "@goauthentik/web/flows/FormStatic";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+import { PasswordManagerPrefill } from "@goauthentik/web/flows/stages/identification/IdentificationStage";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -19,11 +25,6 @@ import {
     DeviceClassesEnum,
 } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import "../../../elements/forms/FormElement";
-import "../../FormStatic";
-import { BaseStage } from "../base";
-import { PasswordManagerPrefill } from "../identification/IdentificationStage";
 import { AuthenticatorValidateStage } from "./AuthenticatorValidateStage";
 
 @customElement("ak-stage-authenticator-validate-code")

web/src/flows/stages/authenticator_validate/AuthenticatorValidateStageDuo.ts

@@ -1,10 +1,15 @@
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/elements/forms/FormElement";
+import "@goauthentik/web/flows/FormStatic";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -18,10 +23,6 @@ import {
     DeviceChallenge,
 } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import "../../../elements/forms/FormElement";
-import "../../FormStatic";
-import { BaseStage } from "../base";
 import { AuthenticatorValidateStage } from "./AuthenticatorValidateStage";
 
 @customElement("ak-stage-authenticator-validate-duo")

web/src/flows/stages/authenticator_validate/AuthenticatorValidateStageWebAuthn.ts

@@ -1,9 +1,15 @@
+import {
+    transformAssertionForServer,
+    transformCredentialRequestOptions,
+} from "@goauthentik/web/flows/stages/authenticator_webauthn/utils";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFEmptyState from "@patternfly/patternfly/components/EmptyState/empty-state.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
@@ -19,11 +25,6 @@ import {
     DeviceChallenge,
 } from "@goauthentik/api";
 
-import {
-    transformAssertionForServer,
-    transformCredentialRequestOptions,
-} from "../authenticator_webauthn/utils";
-import { BaseStage } from "../base";
 import { AuthenticatorValidateStage } from "./AuthenticatorValidateStage";
 
 @customElement("ak-stage-authenticator-validate-webauthn")

web/src/flows/stages/authenticator_webauthn/WebAuthnAuthenticatorRegisterStage.ts

@@ -1,9 +1,12 @@
+import { PFSize } from "@goauthentik/web/elements/Spinner";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -16,8 +19,6 @@ import {
     AuthenticatorWebAuthnChallengeResponseRequest,
 } from "@goauthentik/api";
 
-import { PFSize } from "../../../elements/Spinner";
-import { BaseStage } from "../base";
 import {
     Assertion,
     transformCredentialCreateOptions,

web/src/flows/stages/autosubmit/AutosubmitStage.ts

@@ -1,9 +1,12 @@
+import "@goauthentik/web/elements/EmptyState";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -13,9 +16,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { AutoSubmitChallengeResponseRequest, AutosubmitChallenge } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import { BaseStage } from "../base";
-
 @customElement("ak-stage-autosubmit")
 export class AutosubmitStage extends BaseStage<
     AutosubmitChallenge,

web/src/flows/stages/captcha/CaptchaStage.ts

@@ -1,10 +1,16 @@
+import "@goauthentik/web/elements/EmptyState";
+import { PFSize } from "@goauthentik/web/elements/Spinner";
+import "@goauthentik/web/elements/forms/FormElement";
+import "@goauthentik/web/flows/FormStatic";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -14,12 +20,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { CaptchaChallenge, CaptchaChallengeResponseRequest } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import { PFSize } from "../../../elements/Spinner";
-import "../../../elements/forms/FormElement";
-import "../../FormStatic";
-import { BaseStage } from "../base";
-
 @customElement("ak-stage-captcha")
 export class CaptchaStage extends BaseStage<CaptchaChallenge, CaptchaChallengeResponseRequest> {
     static get styles(): CSSResult[] {

web/src/flows/stages/consent/ConsentStage.ts

@@ -1,10 +1,14 @@
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/flows/FormStatic";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -16,10 +20,6 @@ import PFSpacing from "@patternfly/patternfly/utilities/Spacing/spacing.css";
 
 import { ConsentChallenge, ConsentChallengeResponseRequest } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import "../../FormStatic";
-import { BaseStage } from "../base";
-
 @customElement("ak-stage-consent")
 export class ConsentStage extends BaseStage<ConsentChallenge, ConsentChallengeResponseRequest> {
     static get styles(): CSSResult[] {

web/src/flows/stages/dummy/DummyStage.ts

@@ -1,9 +1,13 @@
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/flows/FormStatic";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -13,10 +17,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { DummyChallenge, DummyChallengeResponseRequest } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import "../../FormStatic";
-import { BaseStage } from "../base";
-
 @customElement("ak-stage-dummy")
 export class DummyStage extends BaseStage<DummyChallenge, DummyChallengeResponseRequest> {
     static get styles(): CSSResult[] {

web/src/flows/stages/email/EmailStage.ts

@@ -1,9 +1,12 @@
+import "@goauthentik/web/elements/EmptyState";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -13,9 +16,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { EmailChallenge, EmailChallengeResponseRequest } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import { BaseStage } from "../base";
-
 @customElement("ak-stage-email")
 export class EmailStage extends BaseStage<EmailChallenge, EmailChallengeResponseRequest> {
     static get styles(): CSSResult[] {

web/src/flows/stages/identification/IdentificationStage.ts

@@ -1,9 +1,14 @@
+import "@goauthentik/web/elements/Divider";
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/elements/forms/FormElement";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFAlert from "@patternfly/patternfly/components/Alert/alert.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
@@ -19,11 +24,6 @@ import {
     UserFieldsEnum,
 } from "@goauthentik/api";
 
-import "../../../elements/Divider";
-import "../../../elements/EmptyState";
-import "../../../elements/forms/FormElement";
-import { BaseStage } from "../base";
-
 export const PasswordManagerPrefill: {
     password: string | undefined;
     totp: string | undefined;

web/src/flows/stages/password/PasswordStage.ts

@@ -1,10 +1,16 @@
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/elements/forms/FormElement";
+import "@goauthentik/web/flows/FormStatic";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+import { PasswordManagerPrefill } from "@goauthentik/web/flows/stages/identification/IdentificationStage";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
 import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
@@ -14,12 +20,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { PasswordChallenge, PasswordChallengeResponseRequest } from "@goauthentik/api";
 
-import "../../../elements/EmptyState";
-import "../../../elements/forms/FormElement";
-import "../../FormStatic";
-import { BaseStage } from "../base";
-import { PasswordManagerPrefill } from "../identification/IdentificationStage";
-
 @customElement("ak-stage-password")
 export class PasswordStage extends BaseStage<PasswordChallenge, PasswordChallengeResponseRequest> {
     static get styles(): CSSResult[] {

web/src/flows/stages/prompt/PromptStage.ts

@@ -1,10 +1,16 @@
+import "@goauthentik/web/elements/Divider";
+import "@goauthentik/web/elements/EmptyState";
+import "@goauthentik/web/elements/forms/FormElement";
+import { BaseStage } from "@goauthentik/web/flows/stages/base";
+import { LOCALES } from "@goauthentik/web/interfaces/locale";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, TemplateResult, html } from "lit";
 import { customElement } from "lit/decorators.js";
 import { unsafeHTML } from "lit/directives/unsafe-html.js";
 
-import AKGlobal from "../../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFAlert from "@patternfly/patternfly/components/Alert/alert.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFForm from "@patternfly/patternfly/components/Form/form.css";
@@ -20,12 +26,6 @@ import {
     StagePrompt,
 } from "@goauthentik/api";
 
-import "../../../elements/Divider";
-import "../../../elements/EmptyState";
-import "../../../elements/forms/FormElement";
-import { LOCALES } from "../../../interfaces/locale";
-import { BaseStage } from "../base";
-
 @customElement("ak-stage-prompt")
 export class PromptStage extends BaseStage<PromptChallenge, PromptChallengeResponseRequest> {
     static get styles(): CSSResult[] {

web/src/interfaces/AdminInterface.ts

@@ -1,10 +1,30 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import { me } from "@goauthentik/web/api/Users";
+import { WebsocketClient } from "@goauthentik/web/common/ws";
+import {
+    EVENT_API_DRAWER_TOGGLE,
+    EVENT_NOTIFICATION_DRAWER_TOGGLE,
+    EVENT_SIDEBAR_TOGGLE,
+    VERSION,
+} from "@goauthentik/web/constants";
+import "@goauthentik/web/elements/messages/MessageContainer";
+import "@goauthentik/web/elements/messages/MessageContainer";
+import "@goauthentik/web/elements/notifications/NotificationDrawer";
+import { ID_REGEX, SLUG_REGEX, UUID_REGEX } from "@goauthentik/web/elements/router/Route";
+import { getURLParam, updateURLParams } from "@goauthentik/web/elements/router/RouteMatch";
+import "@goauthentik/web/elements/router/RouterOutlet";
+import "@goauthentik/web/elements/sidebar/Sidebar";
+import "@goauthentik/web/elements/sidebar/SidebarItem";
+import "@goauthentik/web/interfaces/locale";
+import { ROUTES } from "@goauthentik/web/routesAdmin";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { until } from "lit/directives/until.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
 import PFDrawer from "@patternfly/patternfly/components/Drawer/drawer.css";
 import PFPage from "@patternfly/patternfly/components/Page/page.css";
@@ -12,26 +32,6 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
 
 import { AdminApi, Version } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../api/Config";
-import { me } from "../api/Users";
-import { WebsocketClient } from "../common/ws";
-import {
-    EVENT_API_DRAWER_TOGGLE,
-    EVENT_NOTIFICATION_DRAWER_TOGGLE,
-    EVENT_SIDEBAR_TOGGLE,
-    VERSION,
-} from "../constants";
-import "../elements/messages/MessageContainer";
-import "../elements/messages/MessageContainer";
-import "../elements/notifications/NotificationDrawer";
-import { ID_REGEX, SLUG_REGEX, UUID_REGEX } from "../elements/router/Route";
-import { getURLParam, updateURLParams } from "../elements/router/RouteMatch";
-import "../elements/router/RouterOutlet";
-import "../elements/sidebar/Sidebar";
-import "../elements/sidebar/SidebarItem";
-import { ROUTES } from "../routesAdmin";
-import "./locale";
-
 @customElement("ak-interface-admin")
 export class AdminInterface extends LitElement {
     @property({ type: Boolean })

web/src/interfaces/FlowInterface.ts

@@ -1,3 +1,3 @@
-import "../elements/messages/MessageContainer";
+import "@goauthentik/web/elements/messages/MessageContainer";
-import "../flows/FlowExecutor";
+import "@goauthentik/web/flows/FlowExecutor";
-import "./locale";
+import "@goauthentik/web/interfaces/locale";

web/src/interfaces/UserInterface.ts

@@ -1,10 +1,32 @@
+import { DEFAULT_CONFIG, tenant } from "@goauthentik/web/api/Config";
+import { configureSentry } from "@goauthentik/web/api/Sentry";
+import { me } from "@goauthentik/web/api/Users";
+import { UserDisplay, uiConfig } from "@goauthentik/web/common/config";
+import { WebsocketClient } from "@goauthentik/web/common/ws";
+import {
+    EVENT_API_DRAWER_TOGGLE,
+    EVENT_NOTIFICATION_DRAWER_TOGGLE,
+    EVENT_WS_MESSAGE,
+} from "@goauthentik/web/constants";
+import "@goauthentik/web/elements/messages/MessageContainer";
+import "@goauthentik/web/elements/messages/MessageContainer";
+import "@goauthentik/web/elements/notifications/NotificationDrawer";
+import { getURLParam, updateURLParams } from "@goauthentik/web/elements/router/RouteMatch";
+import "@goauthentik/web/elements/router/RouterOutlet";
+import "@goauthentik/web/elements/sidebar/Sidebar";
+import { DefaultTenant } from "@goauthentik/web/elements/sidebar/SidebarBrand";
+import "@goauthentik/web/elements/sidebar/SidebarItem";
+import "@goauthentik/web/interfaces/locale";
+import { ROUTES } from "@goauthentik/web/routesUser";
+import { first } from "@goauthentik/web/utils";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { until } from "lit/directives/until.js";
 
-import AKGlobal from "../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFAvatar from "@patternfly/patternfly/components/Avatar/avatar.css";
 import PFBrand from "@patternfly/patternfly/components/Brand/brand.css";
 import PFButton from "@patternfly/patternfly/components/Button/button.css";
@@ -17,28 +39,6 @@ import PFDisplay from "@patternfly/patternfly/utilities/Display/display.css";
 
 import { CurrentTenant, EventsApi } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG, tenant } from "../api/Config";
-import { configureSentry } from "../api/Sentry";
-import { me } from "../api/Users";
-import { UserDisplay, uiConfig } from "../common/config";
-import { WebsocketClient } from "../common/ws";
-import {
-    EVENT_API_DRAWER_TOGGLE,
-    EVENT_NOTIFICATION_DRAWER_TOGGLE,
-    EVENT_WS_MESSAGE,
-} from "../constants";
-import "../elements/messages/MessageContainer";
-import "../elements/messages/MessageContainer";
-import "../elements/notifications/NotificationDrawer";
-import { getURLParam, updateURLParams } from "../elements/router/RouteMatch";
-import "../elements/router/RouterOutlet";
-import "../elements/sidebar/Sidebar";
-import { DefaultTenant } from "../elements/sidebar/SidebarBrand";
-import "../elements/sidebar/SidebarItem";
-import { ROUTES } from "../routesUser";
-import { first } from "../utils";
-import "./locale";
-
 @customElement("ak-interface-user")
 export class UserInterface extends LitElement {
     @property({ type: Boolean })

web/src/pages/admin-overview/AdminOverviewPage.ts

@@ -1,32 +1,32 @@
+import { me } from "@goauthentik/web/api/Users";
+import "@goauthentik/web/elements/PageHeader";
+import "@goauthentik/web/elements/cards/AggregatePromiseCard";
+import "@goauthentik/web/elements/charts/AdminLoginsChart";
+import { paramURL } from "@goauthentik/web/elements/router/RouterOutlet";
+import "@goauthentik/web/pages/admin-overview/TopApplicationsTable";
+import "@goauthentik/web/pages/admin-overview/cards/AdminStatusCard";
+import "@goauthentik/web/pages/admin-overview/cards/SystemStatusCard";
+import "@goauthentik/web/pages/admin-overview/cards/VersionStatusCard";
+import "@goauthentik/web/pages/admin-overview/cards/WorkerStatusCard";
+import "@goauthentik/web/pages/admin-overview/charts/FlowStatusChart";
+import "@goauthentik/web/pages/admin-overview/charts/GroupCountStatusChart";
+import "@goauthentik/web/pages/admin-overview/charts/LDAPSyncStatusChart";
+import "@goauthentik/web/pages/admin-overview/charts/OutpostStatusChart";
+import "@goauthentik/web/pages/admin-overview/charts/PolicyStatusChart";
+import "@goauthentik/web/pages/admin-overview/charts/UserCountStatusChart";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
 import { until } from "lit/directives/until.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFContent from "@patternfly/patternfly/components/Content/content.css";
 import PFList from "@patternfly/patternfly/components/List/list.css";
 import PFPage from "@patternfly/patternfly/components/Page/page.css";
 import PFGrid from "@patternfly/patternfly/layouts/Grid/grid.css";
 
-import { me } from "../../api/Users";
-import "../../elements/PageHeader";
-import "../../elements/cards/AggregatePromiseCard";
-import "../../elements/charts/AdminLoginsChart";
-import { paramURL } from "../../elements/router/RouterOutlet";
-import "./TopApplicationsTable";
-import "./cards/AdminStatusCard";
-import "./cards/SystemStatusCard";
-import "./cards/VersionStatusCard";
-import "./cards/WorkerStatusCard";
-import "./charts/FlowStatusChart";
-import "./charts/GroupCountStatusChart";
-import "./charts/LDAPSyncStatusChart";
-import "./charts/OutpostStatusChart";
-import "./charts/PolicyStatusChart";
-import "./charts/UserCountStatusChart";
-
 @customElement("ak-admin-overview")
 export class AdminOverviewPage extends LitElement {
     static get styles(): CSSResult[] {

web/src/pages/admin-overview/DashboardUserPage.ts

@@ -1,9 +1,13 @@
+import "@goauthentik/web/elements/PageHeader";
+import "@goauthentik/web/elements/cards/AggregatePromiseCard";
+import "@goauthentik/web/elements/charts/AdminModelPerDay";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFContent from "@patternfly/patternfly/components/Content/content.css";
 import PFList from "@patternfly/patternfly/components/List/list.css";
 import PFPage from "@patternfly/patternfly/components/Page/page.css";
@@ -11,10 +15,6 @@ import PFGrid from "@patternfly/patternfly/layouts/Grid/grid.css";
 
 import { EventActions } from "@goauthentik/api";
 
-import "../../elements/PageHeader";
-import "../../elements/cards/AggregatePromiseCard";
-import "../../elements/charts/AdminModelPerDay";
-
 @customElement("ak-admin-dashboard-users")
 export class DashboardUserPage extends LitElement {
     static get styles(): CSSResult[] {

web/src/pages/admin-overview/TopApplicationsTable.ts

@@ -1,16 +1,16 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+import "@goauthentik/web/elements/Spinner";
+
 import { t } from "@lingui/macro";
 
 import { CSSResult, LitElement, TemplateResult, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
-import AKGlobal from "../../authentik.css";
+import AKGlobal from "@goauthentik/web/authentik.css";
 import PFTable from "@patternfly/patternfly/components/Table/table.css";
 
 import { EventTopPerUser, EventsApi } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../api/Config";
-import "../../elements/Spinner";
-
 @customElement("ak-top-applications-table")
 export class TopApplicationsTable extends LitElement {
     @property({ attribute: false })

web/src/pages/admin-overview/cards/AdminStatusCard.ts

@@ -1,10 +1,10 @@
+import { EVENT_REFRESH } from "@goauthentik/web/constants";
+import { PFSize } from "@goauthentik/web/elements/Spinner";
+import { AggregateCard } from "@goauthentik/web/elements/cards/AggregateCard";
+
 import { TemplateResult, html } from "lit";
 import { until } from "lit/directives/until.js";
 
-import { EVENT_REFRESH } from "../../../constants";
-import { PFSize } from "../../../elements/Spinner";
-import { AggregateCard } from "../../../elements/cards/AggregateCard";
-
 export interface AdminStatus {
     icon: string;
     message?: TemplateResult;

web/src/pages/admin-overview/cards/SystemStatusCard.ts

@@ -1,3 +1,5 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+
 import { t } from "@lingui/macro";
 
 import { TemplateResult, html } from "lit";
@@ -5,7 +7,6 @@ import { customElement } from "lit/decorators.js";
 
 import { AdminApi, OutpostsApi, System } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../../api/Config";
 import { AdminStatus, AdminStatusCard } from "./AdminStatusCard";
 
 @customElement("ak-admin-status-system")

web/src/pages/admin-overview/cards/VersionStatusCard.ts

@@ -1,3 +1,5 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+
 import { t } from "@lingui/macro";
 
 import { TemplateResult, html } from "lit";
@@ -5,7 +7,6 @@ import { customElement } from "lit/decorators.js";
 
 import { AdminApi, Version } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../../api/Config";
 import { AdminStatus, AdminStatusCard } from "./AdminStatusCard";
 
 @customElement("ak-admin-status-version")

web/src/pages/admin-overview/cards/WorkerStatusCard.ts

@@ -1,3 +1,5 @@
+import { DEFAULT_CONFIG } from "@goauthentik/web/api/Config";
+
 import { t } from "@lingui/macro";
 
 import { html } from "lit";
@@ -5,7 +7,6 @@ import { customElement } from "lit/decorators.js";
 
 import { AdminApi } from "@goauthentik/api";
 
-import { DEFAULT_CONFIG } from "../../../api/Config";
 import { AdminStatus, AdminStatusCard } from "./AdminStatusCard";
 
 @customElement("ak-admin-status-card-workers")