@commonpub/layer 0.21.4 → 0.21.5

package/components/SearchFilters.vue

@@ -156,7 +156,7 @@ function removeTag(tag: string): void {
   padding: 7px 10px;
   font-size: 12px;
   color: var(--text);
-  font-family: system-ui, -apple-system, sans-serif;
+  font-family: var(--font-sans);
   outline: none;
   margin-bottom: 6px;
   transition: border-color 0.15s;

package/components/ShareToHubModal.vue

@@ -14,6 +14,14 @@ const { data: userHubs } = useLazyFetch<{ items: Array<{ id: string; name: strin
 const sharing = ref(false);
 const selectedHub = ref('');
 
+// Parent mounts/unmounts this modal via v-if, so it's always "open" while
+// mounted. A local ref flipped on mount drives useFocusTrap's watcher
+// (false -> true), activating the trap, Esc handler and scroll lock.
+const contentRef = ref<HTMLElement | null>(null);
+const visible = ref(false);
+onMounted(() => { visible.value = true; });
+useFocusTrap(contentRef, () => visible.value, () => emit('close'));
+
 async function handleShare(): Promise<void> {
   if (!selectedHub.value) return;
   sharing.value = true;
@@ -35,9 +43,9 @@ async function handleShare(): Promise<void> {
 
 <template>
   <div class="cpub-modal-backdrop" @click.self="emit('close')">
-    <div class="cpub-modal-content">
+    <div ref="contentRef" class="cpub-modal-content" role="dialog" aria-modal="true" aria-labelledby="cpub-share-hub-title">
       <div class="cpub-modal-header">
-        <h3 class="cpub-modal-title">Share to Hub</h3>
+        <h3 id="cpub-share-hub-title" class="cpub-modal-title">Share to Hub</h3>
         <button class="cpub-modal-close" aria-label="Close" @click="emit('close')"><i class="fa-solid fa-xmark"></i></button>
       </div>
 

package/components/homepage/HomepageSectionRenderer.vue

@@ -21,7 +21,7 @@ const features = useFeatures();
 
 function isFeatureEnabled(featureGate?: string): boolean {
   if (!featureGate) return true;
-  return (features.features as unknown as Record<string, boolean>)?.[featureGate] ?? true;
+  return (features.features.value as unknown as Record<string, boolean>)?.[featureGate] ?? true;
 }
 
 /** Section types that render in the full-width zone (above the 2-column layout) */

package/error.vue

@@ -125,7 +125,7 @@ function handleBack(): void {
 
 .cpub-error-btn-primary {
   background: var(--accent, #5b9cf6);
-  color: #fff;
+  color: var(--color-text-inverse, #fff);
   box-shadow: var(--shadow-md);
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commonpub/layer",
-  "version": "0.21.4",
+  "version": "0.21.5",
   "type": "module",
   "main": "./nuxt.config.ts",
   "files": [
@@ -50,16 +50,16 @@
     "vue": "^3.4.0",
     "vue-router": "^4.3.0",
     "zod": "^4.3.6",
+    "@commonpub/auth": "0.6.0",
     "@commonpub/editor": "0.7.9",
-    "@commonpub/protocol": "0.9.10",
-    "@commonpub/schema": "0.16.0",
     "@commonpub/docs": "0.6.3",
-    "@commonpub/auth": "0.6.0",
-    "@commonpub/explainer": "0.7.12",
+    "@commonpub/protocol": "0.9.10",
     "@commonpub/learning": "0.5.2",
+    "@commonpub/explainer": "0.7.12",
     "@commonpub/ui": "0.8.5",
-    "@commonpub/config": "0.12.0",
-    "@commonpub/server": "2.53.0"
+    "@commonpub/server": "2.53.0",
+    "@commonpub/schema": "0.16.0",
+    "@commonpub/config": "0.12.0"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",
@@ -68,5 +68,7 @@
     "jsdom": "^25.0.1",
     "vitest": "^3.2.4"
   },
-  "scripts": {}
+  "scripts": {
+    "test": "vitest run"
+  }
 }

package/pages/search.vue

@@ -512,7 +512,7 @@ const { data: relatedCommunities } = await useFetch('/api/hubs', {
   font-size: 15px;
   font-weight: 500;
   color: var(--text);
-  font-family: system-ui, -apple-system, sans-serif;
+  font-family: var(--font-sans);
   outline: none;
   transition: border-color 0.15s, box-shadow 0.15s;
 }

package/pages/u/[username]/index.vue

@@ -679,7 +679,7 @@ async function handleReport(): Promise<void> {
   background: none;
   cursor: pointer;
   border-bottom: 3px solid transparent;
-  font-family: system-ui, -apple-system, sans-serif;
+  font-family: var(--font-sans);
   display: flex;
   align-items: center;
   gap: 6px;