ketekny-ui-kit 1.0.122 → 1.0.124

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ketekny-ui-kit",
   "type": "module",
-  "version": "1.0.122",
+  "version": "1.0.124",
   "description": "A Vue 3 UI component library with Tailwind CSS styling",
   "main": "index.js",
   "files": [

package/src/twoColLayout/components/MultilevelSidebar.vue

@@ -14,10 +14,21 @@ import {
 import SidebarMenuItem from './SidebarMenuItem.vue'
 import kMenu from '../../ui/kMenu.vue'
 import demoAvatarUrl from '../assets/placeholder-user.jpg'
+import logoLightUrl from '../assets/logo-light.png'
+import logoDarkUrl from '../assets/logo-dark.png'
+import logoIconLightUrl from '../assets/logo_icon.jpg'
+import logoIconDarkUrl from '../assets/logo-icon-dark.png'
 
 const FAVORITES_STORAGE_KEY = 'ketekny-ui-sidebar-favorites'
 const MENU_TAB_STORAGE_KEY = 'ketekny-ui-sidebar-menu-tab'
-const LOGO_BASE_URL = 'https://s3.ketekny.gr/public/web-apps/logos'
+// const LOGO_BASE_URL = 'https://s3.ketekny.gr/public/web-apps/logos'
+
+const DEFAULT_LOGOS = {
+  light: logoLightUrl,
+  dark: logoDarkUrl,
+  iconLight: logoIconLightUrl,
+  iconDark: logoIconDarkUrl,
+}
 const LG_VIEWPORT_QUERY = '(min-width: 1024px)'
 
 export default {
@@ -45,6 +56,11 @@ export default {
       type: String,
       default: "",
     },
+    // { light, dark, iconLight, iconDark } — any subset overrides the default
+    logos: {
+      type: Object,
+      default: null,
+    },
     width: {
       type: String,
       default: "360px",
@@ -83,7 +99,6 @@ export default {
   data() {
     return {
       demoAvatarUrl,
-      logoBaseUrl: LOGO_BASE_URL,
       activeId: '',
       activeMenuTab: 'all',
       query: '',
@@ -100,6 +115,9 @@ export default {
     }
   },
   computed: {
+    logoSrc() {
+      return { ...DEFAULT_LOGOS, ...this.logos }
+    },
     sidebarWidthStyle() {
       return {
         width: this.collapsed ? this.collapsedWidth : this.width,
@@ -483,13 +501,13 @@ export default {
     <div class="relative flex items-center px-4 py-4" :class="collapsed ? 'justify-center' : 'gap-2.5'">
       <template v-if="collapsed">
         <img
-          :src="`${logoBaseUrl}/logo_icon.jpg`"
+          :src="logoSrc.iconLight"
           alt="Ketekny logo"
           class="sidebar-logo-light size-9 shrink-0 rounded-lg object-contain cursor-pointer"
           @click="handleLogoClick"
         />
         <img
-          :src="`${logoBaseUrl}/logo-icon-dark.png`"
+          :src="logoSrc.iconDark"
           alt="Ketekny logo"
           class="sidebar-logo-dark size-9 shrink-0 rounded-lg object-contain cursor-pointer"
           @click="handleLogoClick"
@@ -497,13 +515,13 @@ export default {
       </template>
       <template v-else>
         <img
-          :src="`${logoBaseUrl}/logo-light.png`"
+          :src="logoSrc.light"
           alt="Ketekny logo"
           class="sidebar-logo-light min-w-0 flex-1 object-contain cursor-pointer"
           @click="handleLogoClick"
         />
         <img
-          :src="`${logoBaseUrl}/logo-dark.png`"
+          :src="logoSrc.dark"
           alt="Ketekny logo"
           class="sidebar-logo-dark min-w-0 flex-1 object-contain cursor-pointer"
           @click="handleLogoClick"

package/src/twoColLayout/components/TwoColLayout.vue

@@ -1,11 +1,12 @@
 <template>
-  <div class="flex h-screen bg-canvas text-canvas-foreground">
+  <div class="flex h-[100dvh] bg-canvas text-canvas-foreground">
     <div v-if="mobileMenuOpen" class="fixed inset-0 z-30 bg-slate-950/50 backdrop-blur-[1px] lg:hidden" @click="closeMenu" />
 
     <MultilevelSidebar
       :theme="theme"
       :title="title"
       :app-icon="appIcon"
+      :logos="logos"
       :width="width"
       :collapsed-width="collapsedWidth"
       :main-menu="mainMenu"
@@ -70,6 +71,11 @@ export default {
       type: String,
       default: "",
     },
+    // { light, dark, iconLight, iconDark } — any subset overrides the default
+    logos: {
+      type: Object,
+      default: null,
+    },
     width: {
       type: String,
       default: "360px",