@agent-native/core 0.132.2 → 0.133.1

package/corpus/templates/analytics/app/components/layout/Sidebar.tsx

@@ -2229,13 +2229,17 @@ export function Sidebar({ mobile }: { mobile?: boolean } = {}) {
                 src={appPath("/agent-native-icon-light.svg")}
                 alt=""
                 aria-hidden="true"
-                className="block h-5 w-auto shrink-0 dark:hidden"
+                width={35}
+                height={20}
+                className="block h-5 w-[35px] shrink-0 object-contain object-center dark:hidden"
               />
               <img
                 src={appPath("/agent-native-icon-dark.svg")}
                 alt=""
                 aria-hidden="true"
-                className="hidden h-5 w-auto shrink-0 dark:block"
+                width={35}
+                height={20}
+                className="hidden h-5 w-[35px] shrink-0 object-contain object-center dark:block"
               />
               <span className="text-lg font-bold tracking-tight">
                 {t("navigation.brand")}

package/corpus/templates/assets/app/components/layout/Sidebar.tsx

@@ -377,6 +377,44 @@ export function Sidebar() {
       className={collapsed ? "h-8 w-8" : "min-w-0"}
     />
   );
+  const brandControl = (
+    <button
+      type="button"
+      onClick={() => setCollapsed((value) => !value)}
+      aria-label={
+        collapsed
+          ? t("navigation.expandSidebar")
+          : t("navigation.collapseSidebar")
+      }
+      className={cn(
+        "flex items-center gap-2 rounded outline-none transition-colors hover:bg-sidebar-accent/50 focus-visible:ring-2 focus-visible:ring-ring",
+        collapsed ? "size-8 justify-center" : "text-start",
+      )}
+      data-sidebar-brand-toggle
+    >
+      <img
+        src={appPath("/agent-native-icon-light.svg")}
+        alt=""
+        aria-hidden="true"
+        width={28}
+        height={16}
+        className="block h-4 w-7 shrink-0 object-contain object-center dark:hidden"
+      />
+      <img
+        src={appPath("/agent-native-icon-dark.svg")}
+        alt=""
+        aria-hidden="true"
+        width={28}
+        height={16}
+        className="hidden h-4 w-7 shrink-0 object-contain object-center dark:block"
+      />
+      {!collapsed && (
+        <span className="text-sm font-semibold tracking-tight">
+          {t("navigation.brand")}
+        </span>
+      )}
+    </button>
+  );
 
   return (
     <aside
@@ -391,25 +429,7 @@ export function Sidebar() {
           collapsed ? "justify-center px-2" : "justify-between px-4",
         )}
       >
-        {!collapsed && (
-          <div className="flex items-center gap-2">
-            <img
-              src={appPath("/agent-native-icon-light.svg")}
-              alt=""
-              aria-hidden="true"
-              className="block h-4 w-auto dark:hidden"
-            />
-            <img
-              src={appPath("/agent-native-icon-dark.svg")}
-              alt=""
-              aria-hidden="true"
-              className="hidden h-4 w-auto dark:block"
-            />
-            <span className="text-sm font-semibold tracking-tight">
-              {t("navigation.brand")}
-            </span>
-          </div>
-        )}
+        {brandControl}
       </div>
 
       <div className="flex min-h-0 flex-1 flex-col overflow-y-auto">

package/corpus/templates/assets/changelog/2026-07-31-the-agent-native-logo-stays-visible-when-the-sidebar-is-coll.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-31
+---
+
+The Agent Native logo stays visible when the sidebar is collapsed and toggles the sidebar when clicked.

package/corpus/templates/brain/app/components/layout/Sidebar.tsx

@@ -310,23 +310,50 @@ export function Sidebar({
       >
         <Link
           to="/"
+          onClick={(event) => {
+            if (
+              !collapsible ||
+              !onCollapsedChange ||
+              event.metaKey ||
+              event.ctrlKey ||
+              event.shiftKey ||
+              event.altKey ||
+              event.button !== 0
+            ) {
+              return;
+            }
+            event.preventDefault();
+            onCollapsedChange(!collapsed);
+          }}
           className={cn(
             "flex min-w-0 items-center rounded outline-none focus-visible:ring-2 focus-visible:ring-ring",
             collapsed ? "size-8 justify-center" : "flex-1 gap-3",
           )}
-          aria-label={collapsed ? t("navigation.brand") : undefined}
+          aria-label={
+            collapsible && onCollapsedChange
+              ? collapsed
+                ? t("navigation.expandSidebar")
+                : t("navigation.collapseSidebar")
+              : collapsed
+                ? t("navigation.brand")
+                : undefined
+          }
         >
           <img
             src={appPath("/agent-native-icon-light.svg")}
             alt=""
             aria-hidden="true"
-            className="block h-4 w-auto shrink-0 dark:hidden"
+            width={28}
+            height={16}
+            className="block h-4 w-7 shrink-0 object-contain object-center dark:hidden"
           />
           <img
             src={appPath("/agent-native-icon-dark.svg")}
             alt=""
             aria-hidden="true"
-            className="hidden h-4 w-auto shrink-0 dark:block"
+            width={28}
+            height={16}
+            className="hidden h-4 w-7 shrink-0 object-contain object-center dark:block"
           />
           <div className={cn("min-w-0", collapsed && "sr-only")}>
             <p className="truncate text-sm font-semibold text-sidebar-accent-foreground">

package/corpus/templates/brain/changelog/2026-07-31-clicking-the-agent-native-logo-now-toggles-the-app-sidebar.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-31
+---
+
+Clicking the Agent Native logo now toggles the app sidebar.

package/corpus/templates/calendar/app/components/layout/AppLayout.tsx

@@ -386,7 +386,7 @@ export function AppLayout({ children }: AppLayoutProps) {
               open={sidebarOpen}
               onClose={() => setSidebarOpen(false)}
               collapsed={!isMobile && sidebarCollapsed}
-              onCollapsedChange={setSidebarCollapsed}
+              onCollapsedChange={isMobile ? undefined : setSidebarCollapsed}
             />
             <AgentSidebar
               position="right"

package/corpus/templates/calendar/app/components/layout/Sidebar.tsx

@@ -775,31 +775,60 @@ export function Sidebar({
             collapsed ? "px-1" : "px-4",
           )}
         >
-          {!collapsed && (
-            <>
-              <Link
-                to="/"
-                onClick={onClose}
-                className="flex items-center gap-2 rounded outline-none focus-visible:ring-2 focus-visible:ring-ring"
-              >
-                <img
-                  src={appPath("/agent-native-icon-light.svg")}
-                  alt=""
-                  aria-hidden="true"
-                  className="block h-4 w-auto shrink-0 dark:hidden"
-                />
-                <img
-                  src={appPath("/agent-native-icon-dark.svg")}
-                  alt=""
-                  aria-hidden="true"
-                  className="hidden h-4 w-auto shrink-0 dark:block"
-                />
-                <span className="text-base font-semibold tracking-tight">
-                  {t("navigation.brand")}
-                </span>
-              </Link>
-            </>
-          )}
+          <Link
+            to="/"
+            onClick={(event) => {
+              onClose();
+              if (
+                !onCollapsedChange ||
+                event.metaKey ||
+                event.ctrlKey ||
+                event.shiftKey ||
+                event.altKey ||
+                event.button !== 0
+              ) {
+                return;
+              }
+              event.preventDefault();
+              onCollapsedChange(!collapsed);
+            }}
+            className={cn(
+              "flex items-center gap-2 rounded outline-none focus-visible:ring-2 focus-visible:ring-ring",
+              collapsed ? "size-8 justify-center" : "flex-1",
+            )}
+            aria-label={
+              onCollapsedChange
+                ? collapsed
+                  ? t("sidebar.expandSidebar")
+                  : t("sidebar.collapseSidebar")
+                : collapsed
+                  ? t("navigation.brand")
+                  : undefined
+            }
+            data-sidebar-brand-toggle
+          >
+            <img
+              src={appPath("/agent-native-icon-light.svg")}
+              alt=""
+              aria-hidden="true"
+              width={28}
+              height={16}
+              className="block h-4 w-7 shrink-0 object-contain object-center dark:hidden"
+            />
+            <img
+              src={appPath("/agent-native-icon-dark.svg")}
+              alt=""
+              aria-hidden="true"
+              width={28}
+              height={16}
+              className="hidden h-4 w-7 shrink-0 object-contain object-center dark:block"
+            />
+            {!collapsed && (
+              <span className="text-base font-semibold tracking-tight">
+                {t("navigation.brand")}
+              </span>
+            )}
+          </Link>
         </div>
 
         <div className="min-h-0 flex-1 overflow-y-auto">

package/corpus/templates/calendar/changelog/2026-07-31-the-agent-native-logo-stays-visible-when-the-sidebar-is-coll.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-31
+---
+
+The Agent Native logo stays visible when the sidebar is collapsed and toggles the sidebar when clicked.

package/corpus/templates/chat/app/components/layout/Sidebar.tsx

@@ -358,23 +358,50 @@ export function Sidebar({
       >
         <Link
           to="/"
+          onClick={(event) => {
+            if (
+              !collapsible ||
+              !onCollapsedChange ||
+              event.metaKey ||
+              event.ctrlKey ||
+              event.shiftKey ||
+              event.altKey ||
+              event.button !== 0
+            ) {
+              return;
+            }
+            event.preventDefault();
+            onCollapsedChange(!collapsed);
+          }}
           className={cn(
             "flex min-w-0 items-center rounded outline-none focus-visible:ring-2 focus-visible:ring-ring",
             collapsed ? "size-7 justify-center" : "flex-1 gap-3",
           )}
-          aria-label={collapsed ? APP_TITLE : undefined}
+          aria-label={
+            collapsible && onCollapsedChange
+              ? collapsed
+                ? t("navigation.expandSidebar")
+                : t("navigation.collapseSidebar")
+              : collapsed
+                ? APP_TITLE
+                : undefined
+          }
         >
           <img
             src={appPath("/agent-native-icon-light.svg")}
             alt=""
             aria-hidden="true"
-            className="block h-4 w-auto shrink-0 dark:hidden"
+            width={28}
+            height={16}
+            className="block h-4 w-7 shrink-0 object-contain object-center dark:hidden"
           />
           <img
             src={appPath("/agent-native-icon-dark.svg")}
             alt=""
             aria-hidden="true"
-            className="hidden h-4 w-auto shrink-0 dark:block"
+            width={28}
+            height={16}
+            className="hidden h-4 w-7 shrink-0 object-contain object-center dark:block"
           />
           <div className={cn("min-w-0", collapsed && "sr-only")}>
             <p className="truncate text-sm font-semibold text-sidebar-accent-foreground">

package/corpus/templates/chat/changelog/2026-07-31-clicking-the-agent-native-logo-now-toggles-the-app-sidebar.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-31
+---
+
+Clicking the Agent Native logo now toggles the app sidebar.

package/corpus/templates/clips/app/components/library/library-layout.tsx

@@ -336,32 +336,48 @@ export function LibraryLayout({ children }: LibraryLayoutProps) {
             showCollapsedSidebar ? "justify-center px-2" : "px-4",
           )}
         >
-          <div
+          <button
+            type="button"
+            onClick={() => {
+              if (!isMobile) setSidebarCollapsed((value) => !value);
+            }}
+            aria-label={
+              isMobile
+                ? t("navigation.brand")
+                : showCollapsedSidebar
+                  ? t("navigation.expandSidebar")
+                  : t("navigation.collapseSidebar")
+            }
             className={cn(
-              "flex min-w-0 items-center gap-2",
-              !showCollapsedSidebar && "flex-1",
+              "flex min-w-0 items-center gap-2 rounded outline-none focus-visible:ring-2 focus-visible:ring-ring",
+              showCollapsedSidebar
+                ? "size-8 justify-center"
+                : "flex-1 text-start",
             )}
+            data-sidebar-brand-toggle
           >
+            <img
+              src={appPath("/agent-native-icon-light.svg")}
+              alt=""
+              aria-hidden="true"
+              width={28}
+              height={16}
+              className="block h-4 w-7 shrink-0 object-contain object-center dark:hidden"
+            />
+            <img
+              src={appPath("/agent-native-icon-dark.svg")}
+              alt=""
+              aria-hidden="true"
+              width={28}
+              height={16}
+              className="hidden h-4 w-7 shrink-0 object-contain object-center dark:block"
+            />
             {!showCollapsedSidebar && (
-              <>
-                <img
-                  src={appPath("/agent-native-icon-light.svg")}
-                  alt=""
-                  aria-hidden="true"
-                  className="block h-4 w-auto shrink-0 dark:hidden"
-                />
-                <img
-                  src={appPath("/agent-native-icon-dark.svg")}
-                  alt=""
-                  aria-hidden="true"
-                  className="hidden h-4 w-auto shrink-0 dark:block"
-                />
-                <span className="truncate text-sm font-semibold text-foreground">
-                  {t("navigation.brand")}
-                </span>
-              </>
+              <span className="truncate text-sm font-semibold text-foreground">
+                {t("navigation.brand")}
+              </span>
             )}
-          </div>
+          </button>
         </div>
         <div className="min-h-0 flex-1 overflow-y-auto">
           {showCollapsedSidebar ? (

package/corpus/templates/clips/changelog/2026-07-31-the-agent-native-logo-stays-visible-when-the-sidebar-is-coll.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-31
+---
+
+The Agent Native logo stays visible when the sidebar is collapsed and toggles the sidebar when clicked.

package/corpus/templates/clips/desktop/src/hooks/useMediaDevices.ts

@@ -13,7 +13,7 @@ import {
   isPseudoMediaDeviceId,
   isSelectableAudioInputDevice,
   normalizedMediaDeviceId,
-} from "../lib/media-device-selection";
+} from "../../../shared/media-device-selection";
 import {
   isHardCapturePermissionError,
   MACOS_CAPTURE_PERMISSION_MESSAGE,

package/corpus/templates/clips/desktop/src/lib/media-capture-constraints.ts

@@ -3,7 +3,7 @@ import {
   enumerateAudioInputDevices,
   isLikelyPhoneMicLabel,
   type AudioInputFallback,
-} from "./media-device-selection";
+} from "../../../shared/media-device-selection";
 
 export const VOICE_FOCUSED_AUDIO_CONSTRAINTS: MediaTrackConstraints = {
   echoCancellation: { ideal: true },

package/corpus/templates/content/app/components/sidebar/DocumentSidebar.tsx

@@ -1617,6 +1617,38 @@ export function DocumentSidebar({
       className={collapsed ? "size-8" : "h-8 min-w-0"}
     />
   );
+  const brandButton = (isCollapsed: boolean) => (
+    <button
+      type="button"
+      onClick={onToggleCollapsed}
+      aria-label={isCollapsed ? t("sidebar.expand") : t("sidebar.collapse")}
+      className={cn(
+        "flex items-center gap-2 rounded outline-none text-foreground transition-colors hover:bg-accent/50 focus-visible:ring-2 focus-visible:ring-ring",
+        isCollapsed ? "size-8 justify-center" : "min-w-0 text-start",
+      )}
+      data-sidebar-brand-toggle
+    >
+      <img
+        src={appPath("/agent-native-icon-light.svg")}
+        alt=""
+        aria-hidden="true"
+        width={28}
+        height={16}
+        className="block h-4 w-7 shrink-0 object-contain object-center dark:hidden"
+      />
+      <img
+        src={appPath("/agent-native-icon-dark.svg")}
+        alt=""
+        aria-hidden="true"
+        width={28}
+        height={16}
+        className="hidden h-4 w-7 shrink-0 object-contain object-center dark:block"
+      />
+      {!isCollapsed && (
+        <span className="text-base font-semibold tracking-tight">Content</span>
+      )}
+    </button>
+  );
 
   const toggleSection = (id: SidebarSectionId) => {
     setStoredCollapsedSections((current) => {
@@ -2118,6 +2150,7 @@ export function DocumentSidebar({
   if (collapsed) {
     return (
       <div className="agent-layout-left-drawer flex h-full w-12 flex-col items-center gap-1 border-e border-border bg-sidebar py-3 transition-[width] duration-200 ease-out">
+        {brandButton(true)}
         {renderCollapsedNewButton()}
         <Tooltip>
           <TooltipTrigger asChild>
@@ -2156,23 +2189,7 @@ export function DocumentSidebar({
     >
       {/* Header */}
       <div className="flex h-12 shrink-0 items-center justify-between border-b border-border px-3">
-        <div className="flex items-center gap-2 min-w-0">
-          <img
-            src={appPath("/agent-native-icon-light.svg")}
-            alt=""
-            aria-hidden="true"
-            className="block h-4 w-auto shrink-0 dark:hidden"
-          />
-          <img
-            src={appPath("/agent-native-icon-dark.svg")}
-            alt=""
-            aria-hidden="true"
-            className="hidden h-4 w-auto shrink-0 dark:block"
-          />
-          <span className="text-base font-semibold tracking-tight text-foreground">
-            Content
-          </span>
-        </div>
+        {brandButton(false)}
       </div>
 
       {/* Search */}

package/corpus/templates/content/changelog/2026-07-31-the-agent-native-logo-stays-visible-when-the-sidebar-is-coll.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-31
+---
+
+The Agent Native logo stays visible when the sidebar is collapsed and toggles the sidebar when clicked.

package/corpus/templates/design/.agents/skills/design-systems/SKILL.md

@@ -30,6 +30,7 @@ Design systems are stored in the `design_systems` SQL table. Each has:
 - `is_default` — boolean, whether this is the user's default design system
 - `owner_email` — auto-set from session
 - `org_id` — organization scope
+- `visibility` — defaults to `org` inside an organization, otherwise `private`
 
 ### DesignSystemData Schema
 
@@ -125,7 +126,9 @@ brand's actual extracted fonts) rather than defaulting to Space Grotesk/DM
 Sans every time; that pairing is this skill's own most common convergence
 fingerprint.
 
-If this is the user's first design system, it is automatically set as the default.
+If this is the user's first design system in the active organization, it is
+automatically set as the default. Organization-scoped systems are shared with
+that organization by default.
 
 ### Starting from an established public system
 
@@ -175,7 +178,8 @@ Only provided fields are updated. You can also update `--title`, `--description`
 pnpm action set-default-design-system --id <id>
 ```
 
-Unsets any previously-default design system for this user.
+Pass `--isDefault false` to clear the current default. Setting a system as the
+default unsets the previous default in the same user and organization scope.
 
 ## Multi-Source Import Flow
 

package/corpus/templates/design/actions/create-design-system.ts

@@ -166,6 +166,7 @@ export default defineAction({
       isDefault,
       ownerEmail,
       orgId,
+      visibility: orgId ? "org" : "private",
       createdAt: now,
       updatedAt: now,
     });

package/corpus/templates/design/actions/set-default-design-system.ts

@@ -11,11 +11,16 @@ import { getDb, schema } from "../server/db/index.js";
 
 export default defineAction({
   description:
-    "Set a design system as the default. Unsets any previously-default design system for this user.",
+    "Set or unset a design system as the default for the current user and organization.",
   schema: z.object({
     id: z.string().describe("Design system ID to set as default"),
+    isDefault: z
+      .boolean()
+      .optional()
+      .default(true)
+      .describe("Whether this design system should be the default"),
   }),
-  run: async ({ id }) => {
+  run: async ({ id, isDefault = true }) => {
     await assertAccess("design-system", id, "editor");
 
     const db = getDb();
@@ -26,42 +31,45 @@ export default defineAction({
     const orgId = getRequestOrgId();
 
     const [target] = await db
-      .select({ ownerEmail: schema.designSystems.ownerEmail })
+      .select({
+        ownerEmail: schema.designSystems.ownerEmail,
+        orgId: schema.designSystems.orgId,
+      })
       .from(schema.designSystems)
       .where(eq(schema.designSystems.id, id))
       .limit(1);
 
-    if (target?.ownerEmail !== userEmail) {
+    if (
+      target?.ownerEmail !== userEmail ||
+      (target.orgId ?? null) !== (orgId ?? null)
+    ) {
       throw new Error("Only the owner can set a design system as default");
     }
 
     await db.transaction(async (tx) => {
-      await tx
-        .update(schema.designSystems)
-        .set({ isDefault: false, updatedAt: now })
-        .where(
-          orgId
-            ? and(
-                eq(schema.designSystems.ownerEmail, userEmail),
-                eq(schema.designSystems.orgId, orgId),
-              )
-            : and(
-                eq(schema.designSystems.ownerEmail, userEmail),
-                isNull(schema.designSystems.orgId),
-              ),
-        );
+      const targetScope = orgId
+        ? and(
+            eq(schema.designSystems.ownerEmail, userEmail),
+            eq(schema.designSystems.orgId, orgId),
+          )
+        : and(
+            eq(schema.designSystems.ownerEmail, userEmail),
+            isNull(schema.designSystems.orgId),
+          );
+
+      if (isDefault) {
+        await tx
+          .update(schema.designSystems)
+          .set({ isDefault: false, updatedAt: now })
+          .where(targetScope);
+      }
 
       await tx
         .update(schema.designSystems)
-        .set({ isDefault: true, updatedAt: now })
-        .where(
-          and(
-            eq(schema.designSystems.id, id),
-            eq(schema.designSystems.ownerEmail, userEmail),
-          ),
-        );
+        .set({ isDefault, updatedAt: now })
+        .where(and(eq(schema.designSystems.id, id), targetScope));
     });
 
-    return { id, isDefault: true };
+    return { id, isDefault };
   },
 });