Move all login components into same location

panel/lab/components/login/1_login-form/index.php

@@ -0,0 +1,5 @@
+<?php
+
+return [
+	'docs' => 'k-login-form'
+];

panel/lab/components/login/login/index.vue → panel/lab/components/login/1_login-form/index.vue

@@ -1,13 +1,13 @@
 <template>
 	<k-lab-examples>
 		<k-lab-example label="Default">
-			<k-login />
+			<k-login-form />
 		</k-lab-example>
 		<k-lab-example label="With password">
-			<k-login :methods="['password']" />
+			<k-login-form :methods="['password']" />
 		</k-lab-example>
 		<k-lab-example label="Prefilled">
-			<k-login
+			<k-login-form
 				:methods="['password']"
 				:value="{
 					email: 'homer@simpson.com',
@@ -17,10 +17,10 @@
 			/>
 		</k-lab-example>
 		<k-lab-example label="Toggle between login methods">
-			<k-login :methods="['password', 'code']" />
+			<k-login-form :methods="['password', 'code']" />
 		</k-lab-example>
 		<k-lab-example label="Password reset">
-			<k-login :methods="['password', 'password-reset']" />
+			<k-login-form :methods="['password', 'password-reset']" />
 		</k-lab-example>
 	</k-lab-examples>
 </template>

panel/lab/components/login/2_login-code-form/index.php

@@ -0,0 +1,5 @@
+<?php
+
+return [
+	'docs' => 'k-login-code-form'
+];

panel/lab/components/login/login-code/index.vue → panel/lab/components/login/2_login-code-form/index.vue

@@ -1,13 +1,13 @@
 <template>
 	<k-lab-examples>
 		<k-lab-example label="Default">
-			<k-login-code />
+			<k-login-code-form />
 		</k-lab-example>
 		<k-lab-example label="Prefilled">
-			<k-login-code value="123456" />
+			<k-login-code-form value="123456" />
 		</k-lab-example>
 		<k-lab-example label="Pending info">
-			<k-login-code
+			<k-login-code-form
 				:pending="{ email: 'homer@simpson.com', challenge: 'totp' }"
 			/>
 		</k-lab-example>

panel/src/components/Forms/index.js

@@ -6,13 +6,8 @@ import FormButtons from "./FormButtons.vue";
 import Field from "./Field.vue";
 import Fieldset from "./Fieldset.vue";
 import Input from "./Input.vue";
-import Login from "./Login.vue";
-import LoginCode from "./LoginCode.vue";
 import Upload from "./Upload.vue";
 
-/** Form Helpers */
-import LoginAlert from "./LoginAlert.vue";
-
 /* Form parts */
 import Blocks from "./Blocks/index.js";
 import Fields from "./Field/index.js";
@@ -31,12 +26,8 @@ export default {
 		app.component("k-field", Field);
 		app.component("k-fieldset", Fieldset);
 		app.component("k-input", Input);
-		app.component("k-login", Login);
-		app.component("k-login-code", LoginCode);
 		app.component("k-upload", Upload);
 
-		app.component("k-login-alert", LoginAlert);
-
 		app.use(Blocks);
 		app.use(Inputs);
 		app.use(Fields);

panel/src/components/Views/Files/index.js

@@ -0,0 +1,11 @@
+import FileView from "./FileView.vue";
+import FileFocusButton from "./FileFocusButton.vue";
+import FilePreview from "./FilePreview.vue";
+
+export default {
+	install(app) {
+		app.component("k-file-view", FileView);
+		app.component("k-file-preview", FilePreview);
+		app.component("k-file-focus-button", FileFocusButton);
+	}
+};

panel/src/components/Views/Installation/index.js

@@ -0,0 +1,7 @@
+import InstallationView from "./InstallationView.vue";
+
+export default {
+	install(app) {
+		app.component("k-installation-view", InstallationView);
+	}
+};

panel/src/components/Views/Languages/index.js

@@ -0,0 +1,9 @@
+import LanguagesView from "./LanguagesView.vue";
+import LanguageView from "./LanguageView.vue";
+
+export default {
+	install(app) {
+		app.component("k-languages-view", LanguagesView);
+		app.component("k-language-view", LanguageView);
+	}
+};

panel/src/components/Views/Login/LoginView.vue

@@ -13,7 +13,7 @@
 			</k-login-alert>
 
 			<k-dialog-body>
-				<k-login-code
+				<k-login-code-form
 					v-if="form === 'code'"
 					v-bind="{ methods, pending, value: value.code }"
 					@error="onError"
@@ -30,17 +30,17 @@
 </template>
 
 <script>
-import { props as LoginCodeProps } from "@/components/Forms/LoginCode.vue";
-import { props as LoginProps } from "@/components/Forms/Login.vue";
+import { props as LoginCodeFormProps } from "./LoginCodeForm.vue";
+import { props as LoginFormProps } from "./LoginForm.vue";
 
 /**
  * @internal
  */
 export default {
 	components: {
-		"k-login-plugin": window.panel.plugins.login
+		"k-login-plugin-form": window.panel.plugins.login
 	},
-	mixins: [LoginCodeProps, LoginProps],
+	mixins: [LoginCodeFormProps, LoginFormProps],
 	props: {
 		/**
 		 * Values to prefill the inputs
@@ -61,7 +61,9 @@ export default {
 	},
 	computed: {
 		component() {
-			return window.panel.plugins.login ? "k-login-plugin" : "k-login";
+			return window.panel.plugins.login
+				? "k-login-plugin-form"
+				: "k-login-form";
 		},
 		form() {
 			return this.pending.email ? "code" : "login";

panel/src/components/Views/Login/index.js

@@ -0,0 +1,17 @@
+import LoginAlert from "./LoginAlert.vue";
+import LoginCodeForm from "./LoginCodeForm.vue";
+import LoginForm from "./LoginForm.vue";
+import LoginView from "./LoginView.vue";
+
+export default {
+	install(app) {
+		app.component("k-login-alert", LoginAlert);
+		app.component("k-login-code-form", LoginCodeForm);
+		app.component("k-login-form", LoginForm);
+		app.component("k-login-view", LoginView);
+
+		/** deprecated */
+		app.component("k-login", LoginForm);
+		app.component("k-login-code", LoginCodeForm);
+	}
+};

panel/src/components/Views/Pages/index.js

@@ -0,0 +1,9 @@
+import PageView from "./PageView.vue";
+import SiteView from "./SiteView.vue";
+
+export default {
+	install(app) {
+		app.component("k-page-view", PageView);
+		app.component("k-site-view", SiteView);
+	}
+};

panel/src/components/Views/System/index.js

@@ -0,0 +1,9 @@
+import SystemView from "./SystemView.vue";
+import TableUpdateStatusCell from "./TableUpdateStatusCell.vue";
+
+export default {
+	install(app) {
+		app.component("k-system-view", SystemView);
+		app.component("k-table-update-status-cell", TableUpdateStatusCell);
+	}
+};

panel/src/components/Views/Users/index.js

@@ -0,0 +1,19 @@
+import AccountView from "./AccountView.vue";
+import ResetPasswordView from "./ResetPasswordView.vue";
+import UserAvatar from "./UserAvatar.vue";
+import UserInfo from "./UserInfo.vue";
+import UserProfile from "./UserProfile.vue";
+import UserView from "./UserView.vue";
+import UsersView from "./UsersView.vue";
+
+export default {
+	install(app) {
+		app.component("k-account-view", AccountView);
+		app.component("k-reset-password-view", ResetPasswordView);
+		app.component("k-user-avatar", UserAvatar);
+		app.component("k-user-info", UserInfo);
+		app.component("k-user-profile", UserProfile);
+		app.component("k-user-view", UserView);
+		app.component("k-users-view", UsersView);
+	}
+};

panel/src/components/Views/index.js

@@ -1,29 +1,13 @@
 import ErrorView from "./ErrorView.vue";
 import SearchView from "./SearchView.vue";
 
-import FileView from "./Files/FileView.vue";
-import FilePreview from "./Files/FilePreview.vue";
-import FileFocusButton from "./Files/FileFocusButton.vue";
-
-import LanguagesView from "./Languages/LanguagesView.vue";
-import LanguageView from "./Languages/LanguageView.vue";
-
-import LoginView from "./Login/LoginView.vue";
-import InstallationView from "./Login/InstallationView.vue";
-import ResetPasswordView from "./Login/ResetPasswordView.vue";
-import UserInfo from "./Login/UserInfo.vue";
-
-import PageView from "./Pages/PageView.vue";
-import SiteView from "./Pages/SiteView.vue";
-
-import SystemView from "./System/SystemView.vue";
-import TableUpdateStatusCell from "./System/TableUpdateStatusCell.vue";
-
-import AccountView from "./Users/AccountView.vue";
-import UserAvatar from "./Users/UserAvatar.vue";
-import UserProfile from "./Users/UserProfile.vue";
-import UserView from "./Users/UserView.vue";
-import UsersView from "./Users/UsersView.vue";
+import Files from "./Files/index.js";
+import Installation from "./Installation/index.js";
+import Languages from "./Languages/index.js";
+import Login from "./Login/index.js";
+import Pages from "./Pages/index.js";
+import Users from "./Users/index.js";
+import System from "./System/index.js";
 
 import LegacyPluginView from "./LegacyPluginView.vue";
 
@@ -32,30 +16,15 @@ export default {
 		app.component("k-error-view", ErrorView);
 		app.component("k-search-view", SearchView);
 
-		app.component("k-file-view", FileView);
-		app.component("k-file-preview", FilePreview);
-		app.component("k-file-focus-button", FileFocusButton);
-
-		app.component("k-languages-view", LanguagesView);
-		app.component("k-language-view", LanguageView);
-
-		app.component("k-login-view", LoginView);
-		app.component("k-installation-view", InstallationView);
-		app.component("k-reset-password-view", ResetPasswordView);
-		app.component("k-user-info", UserInfo);
-
-		app.component("k-page-view", PageView);
-		app.component("k-site-view", SiteView);
-
-		app.component("k-system-view", SystemView);
-		app.component("k-table-update-status-cell", TableUpdateStatusCell);
-
-		app.component("k-account-view", AccountView);
-		app.component("k-user-avatar", UserAvatar);
-		app.component("k-user-profile", UserProfile);
-		app.component("k-user-view", UserView);
-		app.component("k-users-view", UsersView);
+		app.use(Files);
+		app.use(Installation);
+		app.use(Languages);
+		app.use(Login);
+		app.use(Pages);
+		app.use(System);
+		app.use(Users);
 
+		/* Deprecated */
 		app.component("k-plugin-view", LegacyPluginView);
 	}
 };