;
diff --git a/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/section-error.tsx b/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/section-error.tsx
deleted file mode 100644
index 99aa5eb404..0000000000
--- a/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/section-error.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import {
- AlertIcon,
- Heading,
- Section,
- Text,
-} from "@mittwald/flow-react-components";
-
-
-
-
- Fehler beim Laden
-
-
- Dieser Bereich konnte nicht geladen werden. Wir arbeiten
- daran das Problem zu beheben.
-
-;
diff --git a/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/section-loading.tsx b/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/section-loading.tsx
deleted file mode 100644
index f3c542f244..0000000000
--- a/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/section-loading.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import {
- Heading,
- Section,
- SkeletonText,
- Text,
-} from "@mittwald/flow-react-components";
-
-
-
-
-
-
-
-
-
-
-
-;
diff --git a/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/text-error.tsx b/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/text-error.tsx
deleted file mode 100644
index 7be47a6213..0000000000
--- a/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/text-error.tsx
+++ /dev/null
@@ -1,3 +0,0 @@
-import { AlertText } from "@mittwald/flow-react-components";
-
-Fehler beim Laden;
diff --git a/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/text-loading.tsx b/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/text-loading.tsx
deleted file mode 100644
index 3dc9641a3a..0000000000
--- a/apps/docs/src/content/02-foundations/04-internal/01-boundaries/examples/text-loading.tsx
+++ /dev/null
@@ -1,8 +0,0 @@
-import {
- Text,
- SkeletonText,
-} from "@mittwald/flow-react-components";
-
-
-
-;
diff --git a/apps/docs/src/content/02-foundations/04-internal/01-boundaries/index.mdx b/apps/docs/src/content/02-foundations/04-internal/01-boundaries/index.mdx
deleted file mode 100644
index 66536cbba7..0000000000
--- a/apps/docs/src/content/02-foundations/04-internal/01-boundaries/index.mdx
+++ /dev/null
@@ -1,408 +0,0 @@
----
-title: Boundaries
----
-
-Error- und Loading Boundaries sind ein zentrales Werkzeug, um Ladezustände
-anzuzeigen und Fehler im UI gezielt abzufangen. Sie verhindern, dass Fehler
-unkontrolliert die gesamte Anwendung zum Absturz bringen, und bieten die
-Möglichkeit, Usern eine verständliche Rückmeldung zu geben. Gleichzeitig
-unterstützen sie Entwicklern durch Logging und Monitoring bei der Fehleranalyse.
-
-Da jede Anwendung unterschiedliche Anforderungen hat, gibt es kein universelles
-Schema, wo und wie Boundaries am besten platziert werden. Die folgenden Best
-practices sollen bei der Orientierung und Entscheidungsfindung helfen.
-
----
-
-
- Guideline für interne Teams
-
- Diese Guideline richtet sich in erster Linie an das interne Team von
- mittwald und setzt entsprechendes Vorwissen voraus. Die darin genannten
- Components beziehen sich auf interne mStudio-Components.
-
-
-
----
-
-# Technische Umsetzung
-
-Bei der Platzierung der Boundaries empfiehlt es sich, vom Groben ins Detail
-vorzugehen. Entscheidend ist eine gute Balance: Zu viele kleine Boundaries
-erhöhen die Komplexität, zu wenige gefährden hingegen die Stabilität großer
-Teile der Anwendung.
-
-Boundaries wie "LayoutCard" und "Section" rendern das jeweilige Element,
-Boundaries mit dem Zusatz "Fragment" nutzen die Fehler und Ladezustände des
-jeweiligen Elements, rendern am Ende aber nur ein Fragment.
-
-| Typ | Verwendung | Fehlerfall | Loading |
-| ------------------------------- | -------------------------------------------------------------- | -------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------- |
-| LayoutCard / LayoutCardFragment | Äußerste Boundary einer Seite | | |
-| SectionsFragment | Äußerste Boundary in Tabs | | |
-| Section | Ersetzt normale Sections | | |
-| ContentFragment | Für mehrzeilige Inhalte | | |
-| Fragment | Für Inhalte die im Lade / Fehlerzustand nicht angezeigt werden | Kein Fallback | Kein Fallback |
-| Modal | Ersetzt normale Modals | | (Loading View der Flow Component) |
-| ContextMenu | Ersetzt normale ContextMenus | | |
-| MenuItemFragment | Für MenuItems | Kein Fallback | Keine Loading Boundary |
-| ChartFragment | Für CartesianCharts | | |
-| FieldFragment | Für Form Fields mit nachgeladenen Inhalten | | |
-| Avatar | Für Avatare | | |
-| Text / String | Für Texte | | |
-
-## Inhalte einer LayoutCard
-
-Sind Funktionen oder Informationen einer
-[LayoutCard](/04-components/structure/layout-card) essenziell für die Nutzung
-der Seite, sollte die gesamte LayoutCard mit `WithBoundaries.LayoutCard`
-umschlossen sein. Dabei wird die Anzahl der geladenen Sections als
-`sectionsCount` mitgegeben, um die Loading View passend darzustellen.
-
-### Listenseite
-
-Eine Listenseite enthält in der Regel eine einzelne
-[Section](/04-components/structure/section). Der `sectionsCount` beträgt hier
-daher 1. Der Count der Liste wird zuerst geladen, damit die gesamte Liste im
-Fehlerfall in die ErrorView wechseln kann.
-
-```
-export const CronjobsPage: FC = () => (
-
- {() => {
- const { projectId } = usePathParams("projectId");
- const projectGhost = ProjectGhost.ofId(projectId);
- const cronjobCount = projectGhost.cronjobs.getTotalCount().use();
-
- return (
- <>
-
-
- {backupCount === 0 ? : }
-
- >
- );
- }}
-
-);
-```
-
-### Detailseite
-
-Der `sectionsCount` sollte der erwarteten Anzahl an Sections entsprechen. So
-bleibt das Layout während des Ladevorgangs stabil. Das Hauptelement der Seite
-wird zuerst geladen, damit im Fehlerfall für die gesamte Seite eine ErrorView
-angezeigt werden kann.
-
-```
-export const CronjobPage: FC = () => (
-
- {() => {
- const { cronjobId } = usePathParams("cronjobId");
- const cronjob = CronjobGhost.ofId(cronjobId).getCommon().use();
-
- return (
- <>
-
-
-
- >
- );
- }}
-
-);
-```
-
-### Tab
-
-Manche Seiten verteilen Inhalte auf mehrere
-[Tabs](/04-components/structure/tabs). In solchen Fällen kann es sinnvoll sein,
-Tabs separat abzusichern. Dafür eignet sich `WithBoundaries.SectionsFragment`.
-
-```
-export const CronjobTabs: FC = () => (
-
-
-
- Allgemein
-
- {() => {
- const { cronjobId } = usePathParams("cronjobId");
- const cronjob = CronjobGhost.ofId(cronjobId).getCommon().use();
-
- return (
- <>
-
-
-
- >
- );
- }}
-
-
-
-
-);
-```
-
-## Modals
-
-Für Modals sollte immer ein `WithBoundaries.Modal` verwendet werden. Dies
-verhindert auch das Nachladen von Daten innerhalb des
-[Modals](/04-components/overlays/modal), bevor das Modal geöffnet wird.
-
-### Inhalte von Forms in Modals
-
-Eine teilweise geladene oder fehlerhafte
-[Form](/04-components/react-hook-form/form) untergräbt das Vertrauen der User
-und kann zu unvollständigen oder inkonsistenten Daten führen. Sobald innerhalb
-der Form ein Fehler auftritt, fällt automatisch das ganze Modal in eine
-ErrorView, auch wenn es darin noch Boundaries gibt.
-
-```
-interface Props {
- cronjob:CronjobGhost;
- controller?: OverlayController;
-}
-
-export const RenameCronjobModal: FC = (props) => (
-
- {() => {
- const { cronjobGhost } = asGhostProps(props, ["cronjob"]);
- const controller = useModalController();
- const form = useForm();
- const handleOnSubmit = async () => {
- ...
- controller.close();
- };
-
- return (
-
- );
- }}
-
-);
-```
-
-## Inhalte einzelner Sections
-
-Eine Section kann ergänzende Informationen oder Funktionen aus einem anderen
-Service enthalten, die das primäre Nutzererlebnis der Seite nicht einschränken.
-In solchen Fällen lohnt sich eine Abgrenzung über `WithBoundaries.Section`. So
-bleiben Fehler auf einen kleinen Bereich beschränkt, ohne die gesamte Seite zu
-gefährden.
-
-```
-export const AppInstallationSection: FC = (props) => (
-
- {() => {
- const { cronjobGhost } = asGhostProps(props);
- const appInstallation = cronjobGhost.getCommon().linkedAppInstallation.getCommon().use();
- const t = useTCronjob();
-
- return (
- <>...>
- );
- }}
-
-);
-```
-
-**Sonderfall:** Manche Sections werden nur unter bestimmten Bedingungen
-angezeigt. In diesen Situationen soll keine eigene Loading View erzeugt werden,
-damit Nutzer kein Ladeverhalten sehen, das später nicht zu einem sichtbaren
-Ergebnis führt. Für solche Fälle eignet sich `WithBoundaries.Fragment`, da es
-die Section schützt, ohne einen sichtbaren Ladezustand zu erzeugen.
-
-```
-export const AppInstallationSection: FC = (props) => (
-
- {() => {
- const { cronjobGhost } = asGhostProps(props);
- const cronjob = cronjobGhost.getCommon().use();
- const t = useTCronjob();
-
- if(!cronjob.linkedAppInstallation){
- return null;
- }
-
- return (
- ...
- );
- }}
-
-);
-```
-
-## Inhalte eines Diagramms
-
-Diagramme beziehen in der Regel viele Daten aus externen Services und sind daher
-fehleranfällig. Sie sollten immer von einer Boundary umschlossen werden. Für das
-`CartesianChart` gibt es hierfür das `WithBoundaries.ChartFragment`.
-
-```
-
- ...
-
-```
-
-## Inhalte einzelner Elemente
-
-Kleine Elemente wie [Texte](/04-components/content/text),
-[Links](/04-components/navigation/link), [Badges](/04-components/status/badge),
-[Actions](/04-components/actions/action) oder
-[ContextMenus](/04-components/actions/context-menu) werden oft dynamisch
-geladen, da sie das Nutzungserlebnis der Seite lediglich ergänzen. Diese sollten
-daher separat geschützt werden, um nicht die gesamte Seite zu blockieren. Diese
-Elemente besitzen oft keine eigene ErrorView und erscheinen im Fehlerfall nicht
-oder verbleiben in ihrem Ladezustand.
-
-### Texte
-
-Für Texte gibt es die `WithBoundaries.Text` Component, bzw die
-`WithBoundaries.String` Component, je nachdem ob am Ende eine `Text` Component
-oder nur ein String gerendert werden soll.
-
-```
-
-
-
- {() => projectGhost.getCommon().use().shortId }
-
-
-```
-
-Zusätzlich gibt es Components, die direkt auf ein Model angewendet werden können
-und eine eingebaute Boundary besitzen.
-
-```
-
-
-
-
-
-```
-
-### Alerts / Badges
-
-[Alerts](/04-components/status/alert) und Badges ergänzen eine Seite oft nur um
-kleine Hinweise oder Statusinformationen. Sie werden in ein
-`WithBoundaries.Fragment` verpackt. So bleiben sie geschützt, ohne eine eigene
-Loading View auszulösen.
-
-```
-export const CustomerBankruptAlert: FC = (props) => (
-
- {() => {
- const { customerGhost, asBadge } = asGhostProps(props, ["customer"]);
- const isBankrupt = customerGhost.getCommon().isBankrupt().use();
-
- if (!isBankrupt) {
- return null;
- }
-
- if (asBadge) {
- return ...
- }
-
- return ...;
- }}
-
-);
-```
-
-### Field
-
-Für [Fields](/04-components/react-hook-form/field) kann die
-`WithBoundaries.FieldFragment` Component verwendet werden. Sie zeigt im Loading
-State ein Textfeld, dem optional ein Label mitgegeben werden kann.
-
-```
-export const AppInstallationSelectField: FC = (props) => {
- const { name, label, projectGhost } = asGhostProps(props, ["project"]);
-
- return (
-
- {() => {
- const appInstallations = projectGhost.appInstallations.execute().use().items;
-
- return (
-
-
-
- );
- }}
-
- );
-};
-```
-
-### ContextMenu
-
-Für ContextMenus wird `WithBoundaries.ContextMenu` verwendet. Um zu verhindern,
-dass der Inhalt des ContextMenus springt, werden Elemente die nachgeladene
-Inhalte benötigen in ein `WithBoundaries.MenuItem` gepackt, diese Boundary
-enthält kein Suspense, damit das ganze ContextMenu im Ladezustand verbleibt.
-
-```
-export const ActionsContextMenu: FC = (props) => {
- const { appInstallationGhost } = asGhostProps(props);
- const deleteModalController = useModalController();
- const updateModalController = useModalController();
-
- return (
- <>
-
- {() => {
- const { isBusy } = appInstallationGhost.getCommon().use();
- return (
- <>
- deleteModalController.open()} isDisabled={isBusy} />
-
- {() => {
- const updateAvailable = appInstallationGhost.getCommon().appVersion.updateAvailable().use();
- if (!updateAvailable) {
- return null;
- }
- return (
- updateModalController.open()}/>
- );
- }}
-
- <>
- )
- }}
-
-
-
-
- >
- );
-};
-```
-
----
-
-# Weitere Empfehlungen
-
-Ein durchdachtes Loading und ErrorBoundary Konzept endet nicht bei der
-technischen Umsetzung. Fehler sollten zuverlässig erfasst und an
-Monitoring-Systeme, Sentry oder Datadog weitergegeben werden, damit Probleme
-früh sichtbar werden. Manuelle und automatisierte Tests helfen dabei, die
-eigenen Fallbacks regelmäßig zu überprüfen und sicherzustellen, dass sie in
-allen relevanten Situationen greifen. Ebenso wichtig ist eine klare und
-konsistente Formulierung der Fehlermeldungen, damit User verstehen, was passiert
-und wie sie weitermachen können. Für konkrete Hinweise zur sprachlichen
-Ausgestaltung bietet die Guideline
-[Fehlermeldungen](/02-foundations/03-content-guidelines/03-fehlermeldungen)
-weitere Orientierung. So entsteht ein stabiles und nachvollziehbares Verhalten,
-das sowohl die Entwicklung als auch die Nutzung der Anwendung unterstützt.
diff --git a/apps/docs/src/content/03-patterns/01-patterns/errorhandling/index.mdx b/apps/docs/src/content/03-patterns/01-patterns/errorhandling/index.mdx
index b9726c2229..8f2e0ea5a8 100644
--- a/apps/docs/src/content/03-patterns/01-patterns/errorhandling/index.mdx
+++ b/apps/docs/src/content/03-patterns/01-patterns/errorhandling/index.mdx
@@ -52,8 +52,7 @@ Kontext erhalten und der Fehler wirkt sich nicht auf die ganze
Um Errors auf kleine Bereiche zu begrenzen, nutzen wir im mStudio Loading und
Error Boundaries. Diese kapseln technische Fehler ab und sorgen für konsistentes
-Feedback. Details dazu sind in der Guideline zu
-[Boundaries (Internal)](/02-foundations/04-internal/01-boundaries) beschrieben.
+Feedback.
---
diff --git a/apps/docs/src/lib/liveCode/components/LiveCodeEditor/LiveCodeEditor.module.css b/apps/docs/src/lib/liveCode/components/LiveCodeEditor/LiveCodeEditor.module.css
index 46599827d7..91ff21999f 100644
--- a/apps/docs/src/lib/liveCode/components/LiveCodeEditor/LiveCodeEditor.module.css
+++ b/apps/docs/src/lib/liveCode/components/LiveCodeEditor/LiveCodeEditor.module.css
@@ -89,22 +89,6 @@
background-color: var(--code-block--background-color) !important;
font-size: var(--font-size-text--s);
}
-
- .staticModal {
- --modal--size--s: auto;
- --modal--size--m: auto;
- --modal--size--l: auto;
-
- > div {
- pointer-events: auto;
- height: unset;
- padding: unset;
- justify-content: unset;
- align-items: unset;
- position: unset;
- box-shadow: var(--shadow--overlay);
- }
- }
}
.editorContainer {
diff --git a/apps/docs/src/lib/liveCode/components/LiveCodeEditor/LiveCodeEditor.tsx b/apps/docs/src/lib/liveCode/components/LiveCodeEditor/LiveCodeEditor.tsx
index d82b25836c..ed8ab188f9 100644
--- a/apps/docs/src/lib/liveCode/components/LiveCodeEditor/LiveCodeEditor.tsx
+++ b/apps/docs/src/lib/liveCode/components/LiveCodeEditor/LiveCodeEditor.tsx
@@ -9,7 +9,6 @@ import {
import { extractEditorScope } from "@/lib/liveCode/components/LiveCodeEditor/lib/extractEditorScope";
import extractDefaultExport from "@/lib/liveCode/components/LiveCodeEditor/lib/extractDefaultExport";
import styles from "./LiveCodeEditor.module.css";
-import * as EditorComponents from "./components";
import clsx from "clsx";
import { Button, Icon, LayoutCard } from "@mittwald/flow-react-components";
import { IconArrowBarBoth } from "@tabler/icons-react";
@@ -242,7 +241,6 @@ const LiveCodeEditor: FC = (props) => {
code={codeToDisplay}
scope={{
...scope,
- ...EditorComponents,
}}
transformCode={transformCode}
>
diff --git a/apps/docs/src/lib/liveCode/components/LiveCodeEditor/components/StaticModal/StaticModal.tsx b/apps/docs/src/lib/liveCode/components/LiveCodeEditor/components/StaticModal/StaticModal.tsx
deleted file mode 100644
index 067f94843e..0000000000
--- a/apps/docs/src/lib/liveCode/components/LiveCodeEditor/components/StaticModal/StaticModal.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import type { FC, PropsWithChildren } from "react";
-import clsx from "clsx";
-import styles from "../../LiveCodeEditor.module.css";
-
-export const StaticModal: FC = (props) => {
- return (
-