pkp#9890 Register new Navigation component from ui-library

classes/components/PkpNavigation.php

@@ -0,0 +1,49 @@
+<?php
+/**
+ * @file classes/components/PkpNavigation.php
+ *
+ * Copyright (c) 2014-2021 Simon Fraser University
+ * Copyright (c) 2000-2021 John Willinsky
+ * Distributed under the GNU GPL v3. For full terms see the file docs/COPYING.
+ *
+ * @class PkpNavigation
+ *
+ * @ingroup classes_components
+ *
+ * @brief A Panel component for rendering navigation menu
+ */
+
+namespace PKP\components;
+
+class PkpNavigation
+{
+    /**
+     * Aria-label for the navigation
+     *
+     * @var string
+     */
+    public $ariaLabel;
+
+    /**
+     * Navigation Links
+     *
+     * @var array
+     */
+    public $links;
+
+    /**
+     * Retrieve the configuration data to be used when initializing this
+     * handler on the frontend
+     *
+     * @return array Configuration data
+     */
+    public function getConfig()
+    {
+        $config = [];
+        $config['ariaLabel'] = $this->ariaLabel;
+        $config['links'] = $this->links;
+
+        return $config;
+    }
+
+}

js/load.js

@@ -30,6 +30,7 @@ import localizeMoment from '@/mixins/localizeMoment.js';
 import Badge from '@/components/Badge/Badge.vue';
 import Dropdown from '@/components/Dropdown/Dropdown.vue';
 import Icon from '@/components/Icon/Icon.vue';
+import Navigation from '@/components/Navigation/Navigation.vue';
 import Notification from '@/components/Notification/Notification.vue';
 import Panel from '@/components/Panel/Panel.vue';
 import PanelSection from '@/components/Panel/PanelSection.vue';
@@ -112,6 +113,7 @@ VueRegistry.registerComponent('Dropdown', Dropdown);
 VueRegistry.registerComponent('PkpDropdown', Dropdown);
 VueRegistry.registerComponent('Icon', Icon);
 VueRegistry.registerComponent('PkpIcon', Icon);
+VueRegistry.registerComponent('PkpNavigation', Navigation);
 VueRegistry.registerComponent('Notification', Notification);
 VueRegistry.registerComponent('PkpNotification', Notification);
 VueRegistry.registerComponent('Panel', Panel);