@agent-native/core 0.153.0 → 0.153.1

package/corpus/templates/calendar/app/components/calendar/DayView.tsx

@@ -232,6 +232,7 @@ const DayEventCard = memo(function DayEventCard({
   const li = layout.get(event.id) ?? {
     left: 0,
     width: 100,
+    indent: 0,
     col: 0,
     totalCols: 1,
     stackOrder: 0,
@@ -304,8 +305,8 @@ const DayEventCard = memo(function DayEventCard({
       }
       style={{
         ...posStyle,
-        left: `calc(${li.left}% + ${li.col > 0 ? 2 : 0}px)`,
-        width: `calc(${li.width}% - ${li.col > 0 ? 4 : 2}px)`,
+        left: `calc(${li.left}% + ${li.indent}px)`,
+        width: `calc(${li.width}% - ${li.indent * 2 + 2}px)`,
         zIndex:
           isBeingDragged && isDragging
             ? 100

package/corpus/templates/calendar/app/components/calendar/WeekView.tsx

@@ -274,6 +274,7 @@ const WeekEventCard = memo(function WeekEventCard({
   const li = layout.get(event.id) ?? {
     left: 0,
     width: 100,
+    indent: 0,
     col: 0,
     totalCols: 1,
     stackOrder: 0,
@@ -372,8 +373,8 @@ const WeekEventCard = memo(function WeekEventCard({
       }
       style={{
         ...style,
-        left: `calc(${li.left}% + ${li.col > 0 ? 2 : 0}px)`,
-        width: `calc(${li.width}% - ${li.col > 0 ? 4 : 2}px)`,
+        left: `calc(${li.left}% + ${li.indent}px)`,
+        width: `calc(${li.width}% - ${li.indent * 2 + 2}px)`,
         zIndex:
           isBeingDragged && isDragging
             ? 100

package/corpus/templates/calendar/app/lib/event-layout.ts

@@ -4,6 +4,7 @@ import { addDays, parseISO, startOfDay } from "date-fns";
 export interface TimedEventLayout {
   left: number;
   width: number;
+  indent: number;
   col: number;
   totalCols: number;
   stackOrder: number;
@@ -20,18 +21,16 @@ interface EventEntry {
   inputOrder: number;
 }
 
-const TEXT_REGION_MINUTES = 45;
 const MIN_VISIBLE_EVENT_MINUTES = 15;
+const OVERLAP_INDENT_PX = 16;
 
 function overlaps(a: EventBounds, b: EventBounds): boolean {
   return a.start < b.end && b.start < a.end;
 }
 
 /**
- * Pack timed events into columns while reserving horizontal space only when
- * the event labels can collide. An event may span unused columns when another
- * event is present there at a different time, which keeps long events readable
- * without wasting the column width needed for genuinely simultaneous labels.
+ * Pack timed events into shallow overlap layers. Later events stay wide enough
+ * to read while their inset exposes the boundary of the event underneath.
  */
 export function computeTimedEventLayout(
   dayEvents: readonly CalendarEvent[],
@@ -66,52 +65,34 @@ export function computeTimedEventLayout(
     return a.inputOrder - b.inputOrder;
   });
 
-  const textOverlaps = (a: EventBounds, b: EventBounds): boolean => {
-    const aTextEnd = Math.min(a.start + TEXT_REGION_MINUTES * 60 * 1000, a.end);
-    const bTextEnd = Math.min(b.start + TEXT_REGION_MINUTES * 60 * 1000, b.end);
-    return a.start < bTextEnd && b.start < aTextEnd;
-  };
-
-  // Place labels side by side only when their visible text regions overlap.
-  const columns: EventEntry[][] = [];
+  // Put overlapping events into the first layer that is free at their start.
+  // Reusing finished layers keeps chained overlaps from creating empty gaps.
+  const overlapLayers: EventEntry[][] = [];
   const eventColumns = new Map<CalendarEvent, number>();
 
   for (const entry of sorted) {
-    let column = columns.findIndex((columnEntries) =>
-      columnEntries.every(
-        (placed) => !textOverlaps(placed.bounds, entry.bounds),
-      ),
+    let column = overlapLayers.findIndex((layerEntries) =>
+      layerEntries.every((placed) => !overlaps(placed.bounds, entry.bounds)),
     );
 
     if (column === -1) {
-      column = columns.length;
-      columns.push([]);
+      column = overlapLayers.length;
+      overlapLayers.push([]);
     }
 
-    columns[column].push(entry);
+    overlapLayers[column].push(entry);
     eventColumns.set(entry.event, column);
   }
 
-  const totalCols = columns.length;
+  const totalCols = overlapLayers.length;
 
   for (const [stackOrder, entry] of sorted.entries()) {
     const col = eventColumns.get(entry.event)!;
-    let span = 1;
-
-    // A column to the right is available when it has no event that overlaps
-    // this card in time. Label-only collisions do not need to block expansion.
-    for (let candidate = col + 1; candidate < totalCols; candidate++) {
-      if (
-        columns[candidate].some((other) => overlaps(other.bounds, entry.bounds))
-      ) {
-        break;
-      }
-      span++;
-    }
 
     result.set(entry.event.id, {
-      left: (col / totalCols) * 100,
-      width: (span / totalCols) * 100,
+      left: 0,
+      width: 100,
+      indent: col * OVERLAP_INDENT_PX,
       col,
       totalCols,
       stackOrder,

package/corpus/templates/clips/app/components/meetings/share-meeting-dialog.tsx

@@ -4,7 +4,7 @@ import {
   useActionQuery,
 } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
-import { IconCheck, IconLink, IconMail } from "@tabler/icons-react";
+import { IconLink, IconMail } from "@tabler/icons-react";
 import { useEffect, useMemo, useState, type ReactNode } from "react";
 import { toast } from "sonner";
 
@@ -192,57 +192,40 @@ function LinkTab({
   };
 
   return (
-    <div className="space-y-4">
+    <div className="space-y-3">
       <GeneralAccessSelect
         visibility={visibility}
         canManage={canManage}
         isPending={isPending}
         onChange={(next) => setResourceVisibility(next)}
+        showDescription={false}
       />
 
-      <div>
-        <div className="mb-2 text-xs font-semibold">
-          {t("shareMeeting.sharedContent")}
-        </div>
-        <div className="rounded-md border border-border">
-          <div className="flex items-center gap-3 border-b border-border px-3 py-2.5">
-            <span
-              aria-hidden
-              className="inline-flex size-5 shrink-0 items-center justify-center rounded-full bg-primary text-primary-foreground"
-            >
-              <IconCheck size={12} strokeWidth={2.5} />
-            </span>
-            <span className="text-sm">{t("shareMeeting.summaryIncluded")}</span>
-          </div>
-          <div className="flex items-start justify-between gap-4 px-3 py-2.5">
-            <div className="min-w-0">
-              <label
-                htmlFor={`meeting-share-transcript-${meetingId}`}
-                className="text-sm font-medium"
-              >
-                {t("shareMeeting.includeTranscript")}
-              </label>
-              <p
-                id={`meeting-share-transcript-description-${meetingId}`}
-                className="mt-0.5 text-xs text-muted-foreground"
-              >
-                {transcriptReady
-                  ? t("shareMeeting.includeTranscriptDescription")
-                  : t("shareMeeting.transcriptUnavailable")}
-              </p>
-            </div>
-            <Switch
-              id={`meeting-share-transcript-${meetingId}`}
-              checked={includeTranscript}
-              onCheckedChange={handleTranscriptSharingChange}
-              disabled={
-                !canManage || !transcriptReady || updateMeeting.isPending
-              }
-              aria-describedby={`meeting-share-transcript-description-${meetingId}`}
-              className="mt-0.5 shrink-0"
-            />
-          </div>
+      <div className="flex items-center justify-between gap-4 rounded-md border border-border px-3 py-2.5">
+        <div className="min-w-0">
+          <label
+            htmlFor={`meeting-share-transcript-${meetingId}`}
+            className="text-sm font-medium"
+          >
+            {t("shareMeeting.includeTranscript")}
+          </label>
+          <p
+            id={`meeting-share-transcript-description-${meetingId}`}
+            className="sr-only"
+          >
+            {transcriptReady
+              ? t("shareMeeting.includeTranscriptDescription")
+              : t("shareMeeting.transcriptUnavailable")}
+          </p>
         </div>
+        <Switch
+          id={`meeting-share-transcript-${meetingId}`}
+          checked={includeTranscript}
+          onCheckedChange={handleTranscriptSharingChange}
+          disabled={!canManage || !transcriptReady || updateMeeting.isPending}
+          aria-describedby={`meeting-share-transcript-description-${meetingId}`}
+          className="shrink-0"
+        />
       </div>
 
       <CopyField label={t("clipsFinalRaw.shareLink")} value={shareUrl} />

package/corpus/templates/clips/app/components/player/share-dialog.tsx

@@ -7,6 +7,7 @@ import {
 } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
 import {
+  IconChevronDown,
   IconCode,
   IconExternalLink,
   IconLink,
@@ -35,6 +36,11 @@ import {
   type Visibility,
 } from "@/components/sharing/share-ui";
 import { Button } from "@/components/ui/button";
+import {
+  Collapsible,
+  CollapsibleContent,
+  CollapsibleTrigger,
+} from "@/components/ui/collapsible";
 import { Dialog, DialogContent, DialogTitle } from "@/components/ui/dialog";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
@@ -434,6 +440,11 @@ function LinkTab({
   const agentPrompt = agentLink
     ? t("shareDialog.agentPrompt", { agentContextUrl: agentLink })
     : "";
+  const [agentDetailsOpen, setAgentDetailsOpen] = useState(false);
+
+  useEffect(() => {
+    if (isPublic) setAgentDetailsOpen(false);
+  }, [isPublic]);
 
   return (
     <div className="space-y-4">
@@ -444,6 +455,7 @@ function LinkTab({
           isPending={visibilityPending}
           onChange={(next) => setResourceVisibility(next)}
           publicDescription={t("shareDialog.publicDescription")}
+          showDescription={false}
         />
       ) : (
         <div className="space-y-2" aria-hidden>
@@ -463,42 +475,69 @@ function LinkTab({
       />
 
       {!isPublic ? (
-        <div className="space-y-2">
-          <CopyField
-            label={t("shareDialog.shareWithAgents")}
-            value={agentLink}
-            disabled={agentShareDisabled}
-          />
-          {sharesLoaded ? (
-            <>
-              <p className="text-xs text-muted-foreground">
-                {t("shareDialog.agentTokenDescription")}
-              </p>
-              {agentLinkError ? (
-                <div className="flex items-center justify-between gap-2 rounded-md border border-border bg-muted/30 px-3 py-2">
-                  <p className="text-xs text-muted-foreground">
-                    {t("shareDialog.agentLinkUnavailable")}
-                  </p>
-                  <Button
-                    type="button"
-                    variant="ghost"
-                    size="sm"
-                    className="h-7"
-                    onClick={() => void loadAgentContextUrl()}
-                    disabled={createAgentLink.isPending}
-                  >
-                    {t("shareDialog.retryAgentLink")}
-                  </Button>
-                </div>
-              ) : null}
+        <Collapsible
+          open={agentDetailsOpen}
+          onOpenChange={setAgentDetailsOpen}
+          className="overflow-hidden rounded-md border border-border"
+        >
+          <CollapsibleTrigger asChild>
+            <button
+              type="button"
+              className="flex min-h-10 w-full items-center justify-between gap-3 px-3 py-2 text-left text-sm font-medium transition-colors hover:bg-muted/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset"
+            >
+              <span className="flex min-w-0 items-center gap-2 truncate">
+                <IconLink
+                  aria-hidden="true"
+                  className="size-3.5 shrink-0 text-muted-foreground"
+                  strokeWidth={1.8}
+                />
+                {t("shareDialog.shareWithAgents")}
+              </span>
+              <IconChevronDown
+                aria-hidden="true"
+                className={`size-4 shrink-0 text-muted-foreground transition-transform ${agentDetailsOpen ? "rotate-180" : ""}`}
+              />
+            </button>
+          </CollapsibleTrigger>
+          <CollapsibleContent className="clips-collapsible-content border-t border-border px-3 py-3">
+            <div className="space-y-2">
               <CopyField
-                label={t("shareDialog.copyAgentPrompt")}
-                value={agentPrompt}
+                label={t("shareDialog.shareWithAgents")}
+                value={agentLink}
                 disabled={agentShareDisabled}
               />
-            </>
-          ) : null}
-        </div>
+              {sharesLoaded ? (
+                <>
+                  <p className="text-xs text-muted-foreground">
+                    {t("shareDialog.agentTokenDescription")}
+                  </p>
+                  {agentLinkError ? (
+                    <div className="flex items-center justify-between gap-2 rounded-md border border-border bg-muted/30 px-3 py-2">
+                      <p className="text-xs text-muted-foreground">
+                        {t("shareDialog.agentLinkUnavailable")}
+                      </p>
+                      <Button
+                        type="button"
+                        variant="ghost"
+                        size="sm"
+                        className="h-7"
+                        onClick={() => void loadAgentContextUrl()}
+                        disabled={createAgentLink.isPending}
+                      >
+                        {t("shareDialog.retryAgentLink")}
+                      </Button>
+                    </div>
+                  ) : null}
+                  <CopyField
+                    label={t("shareDialog.copyAgentPrompt")}
+                    value={agentPrompt}
+                    disabled={agentShareDisabled}
+                  />
+                </>
+              ) : null}
+            </div>
+          </CollapsibleContent>
+        </Collapsible>
       ) : null}
 
       {sharesLoaded && !isPublic && canManage ? (

package/corpus/templates/clips/app/components/sharing/share-ui.tsx

@@ -178,6 +178,7 @@ export function GeneralAccessSelect({
   isPending,
   onChange,
   publicDescription,
+  showDescription = true,
 }: {
   visibility: Visibility;
   canManage: boolean;
@@ -185,6 +186,7 @@ export function GeneralAccessSelect({
   onChange: (next: Visibility) => void;
   /** Override for the "public" visibility description (e.g. Clips comment hint). */
   publicDescription?: string;
+  showDescription?: boolean;
 }) {
   const t = useT();
   const meta = VIS_META[visibility];
@@ -222,7 +224,12 @@ export function GeneralAccessSelect({
               ))}
             </SelectContent>
           </Select>
-          <div className="mt-0.5 text-xs text-muted-foreground">
+          <div
+            className={cn(
+              "mt-0.5 text-xs text-muted-foreground",
+              !showDescription && "sr-only",
+            )}
+          >
             {description}
           </div>
         </div>
@@ -244,14 +251,19 @@ export function MakePublicCard({
 }) {
   const t = useT();
   return (
-    <div className="rounded-md border border-border bg-muted/40 px-3 py-2.5">
-      <p className="text-xs text-muted-foreground">
-        {t("shareUi.restrictedLinkDescription")}
-      </p>
+    <div className="flex items-center justify-between gap-2 rounded-md bg-muted/40 px-3 py-2">
+      <p className="sr-only">{t("shareUi.restrictedLinkDescription")}</p>
+      <IconLock
+        aria-hidden
+        size={14}
+        strokeWidth={1.8}
+        className="text-muted-foreground"
+      />
       <Button
         type="button"
+        variant="outline"
         size="sm"
-        className="mt-2 h-7"
+        className="h-7"
         onClick={onMakePublic}
         disabled={isPending}
       >

package/corpus/templates/clips/desktop/src/app.tsx

@@ -2629,7 +2629,7 @@ export function App() {
       isRecording ||
       recordingFlowActive,
     width:
-      popoverView === "settings" ? 920 : popoverView === "memory" ? 440 : 360,
+      popoverView === "settings" ? 920 : popoverView === "memory" ? 440 : 320,
   });
 
   const loadPendingUploads = useCallback(async () => {

package/corpus/templates/clips/desktop/src/styles.css

@@ -13,6 +13,7 @@
   --surface: #f7f7f7;
   --surface-hover: #f0f0f0;
   --surface-strong: #ebebeb;
+  --settings-nav-active: #ffffff;
   --fg: #171717;
   --fg-muted: #737373;
   --fg-subtle: #a3a3a3;
@@ -48,6 +49,7 @@
     --surface: #262626;
     --surface-hover: #2e2e2e;
     --surface-strong: #3d3d3d;
+    --settings-nav-active: var(--surface-hover);
     --fg: #f5f5f5;
     --fg-muted: #a3a3a3;
     --fg-subtle: #737373;
@@ -237,9 +239,9 @@ body[data-clips-route="recording-pill"] #root {
 }
 
 .settings-nav-button.is-active {
-  background: var(--bg);
+  background: var(--settings-nav-active);
   color: var(--fg);
-  box-shadow: var(--shadow-sm);
+  box-shadow: none;
 }
 
 .settings-nav-button:focus-visible {
@@ -2577,6 +2579,12 @@ body[data-clips-route="recording-pill"] #root {
   overscroll-behavior: contain;
 }
 
+.setup.settings-page {
+  padding: 0;
+  gap: 0;
+  overflow: hidden;
+}
+
 /* Meetings / dictation drill-ins: a touch more room under the last row so
    content isn't flush with the panel edge. Must follow `.setup` so it wins
    over the shorthand padding above. */

package/corpus/templates/clips/desktop/src-tauri/src/clips/mod.rs

@@ -70,7 +70,7 @@ const ONBOARDING_HEIGHT_LOGICAL: f64 = 640.0;
 const BUBBLE_SIZE_SMALL: u32 = 360;
 const BUBBLE_SIZE_MEDIUM: u32 = 504;
 const POPOVER_SHADOW_GUTTER_LOGICAL: f64 = 24.0;
-const POPOVER_DEFAULT_WIDTH_LOGICAL: f64 = 360.0;
+const POPOVER_DEFAULT_WIDTH_LOGICAL: f64 = 320.0;
 const POPOVER_DEFAULT_HEIGHT_LOGICAL: f64 = 520.0;
 const OVERLAY_SHADOW_GUTTER_LOGICAL: f64 = 18.0;
 
@@ -1342,7 +1342,7 @@ pub async fn resize_popover(app: AppHandle, height: f64, width: Option<f64>) ->
             })
             .unwrap_or(820.0);
         let clamped = height.clamp(200.0, max_logical_height);
-        let width = width.unwrap_or(360.0).clamp(320.0, 960.0);
+        let width = width.unwrap_or(320.0).clamp(320.0, 960.0);
         let (window_width, window_height) = popover_window_size_logical(width, clamped);
         let _ = w.set_size(tauri::Size::Logical(tauri::LogicalSize::new(
             window_width,

package/corpus/templates/clips/desktop/src-tauri/src/util.rs

@@ -7,7 +7,7 @@ use crate::state::{
 };
 
 const POPOVER_SHADOW_GUTTER_LOGICAL: f64 = 24.0;
-const POPOVER_DEFAULT_WIDTH_LOGICAL: f64 = 360.0;
+const POPOVER_DEFAULT_WIDTH_LOGICAL: f64 = 320.0;
 const POPOVER_DEFAULT_HEIGHT_LOGICAL: f64 = 520.0;
 
 // ---------------------------------------------------------------------------

package/corpus/templates/factory/app/routes/factory.tsx

@@ -1516,9 +1516,6 @@ function RulesView({ t }: { t: ReturnType<typeof useT> }) {
           <CardTitle className="text-base">
             {t("factoryRoute.rulesTitle")}
           </CardTitle>
-          <p className="text-sm text-muted-foreground">
-            {t("factoryRoute.rulesDescription")}
-          </p>
         </CardHeader>
         <CardContent className="space-y-2">
           <Button

package/corpus/templates/slides/app/components/editor/EditorToolbar.tsx

@@ -636,7 +636,7 @@ export default function EditorToolbar({
       />
 
       {/* Consolidated editor menu */}
-      <div className="flex-shrink-0">
+      <div className="ml-auto flex-shrink-0">
         <DropdownMenu>
           <Tooltip>
             <TooltipTrigger asChild>

package/corpus/templates/slides/app/components/editor/ShareDialog.tsx

@@ -6,6 +6,7 @@ import {
   IconCheck,
   IconLoader2,
   IconExternalLink,
+  IconChevronDown,
 } from "@tabler/icons-react";
 import { useState, type ReactNode } from "react";
 
@@ -86,7 +87,7 @@ export default function ShareDialog({ deck, children }: ShareDialogProps) {
       <PopoverTrigger asChild>{children}</PopoverTrigger>
       <PopoverContent
         align="end"
-        className="w-[420px] bg-card border-border p-4"
+        className="w-[min(420px,calc(100vw-2rem))] bg-card border-border p-4"
       >
         {showCloudUpgrade || isLocal ? (
           <CloudUpgrade
@@ -104,35 +105,37 @@ export default function ShareDialog({ deck, children }: ShareDialogProps) {
                 <IconShare2 className="w-4 h-4 text-[#609FF8]" />
                 {t("share.title")}
               </div>
-              <div className="text-muted-foreground text-xs mt-0.5">
-                {t("share.description", { title: deck.title })}
-              </div>
             </div>
 
             <div className="space-y-4">
               {!shareUrl ? (
                 <>
-                  <div className="bg-muted/50 rounded-lg p-3 border border-border">
-                    <h4 className="text-sm font-medium text-foreground/90 mb-2">
+                  <details className="group rounded-md border border-border bg-muted/30">
+                    <summary className="flex cursor-pointer list-none items-center justify-between gap-3 px-3 py-2.5 text-sm font-medium [&::-webkit-details-marker]:hidden">
                       {t("share.whatGetsShared")}
-                    </h4>
-                    <ul className="text-xs text-muted-foreground space-y-1">
-                      <li>
-                        {t("share.slideContent", {
-                          count: deck.slides.length,
-                        })}
-                      </li>
-                      <li>{t("share.presentationView")}</li>
-                    </ul>
-                    <h4 className="text-sm font-medium text-foreground/90 mt-3 mb-2">
-                      {t("share.whatStaysPrivate")}
-                    </h4>
-                    <ul className="text-xs text-muted-foreground space-y-1">
-                      <li>{t("share.speakerNotes")}</li>
-                      <li>{t("share.otherPresentations")}</li>
-                      <li>{t("share.editingAccess")}</li>
-                    </ul>
-                  </div>
+                      <IconChevronDown className="size-4 shrink-0 text-muted-foreground transition-transform group-open:rotate-180" />
+                    </summary>
+                    <div className="space-y-3 border-t border-border px-3 py-3 text-xs text-muted-foreground">
+                      <ul className="space-y-1">
+                        <li>
+                          {t("share.slideContent", {
+                            count: deck.slides.length,
+                          })}
+                        </li>
+                        <li>{t("share.presentationView")}</li>
+                      </ul>
+                      <div>
+                        <h4 className="mb-1 font-medium text-foreground/90">
+                          {t("share.whatStaysPrivate")}
+                        </h4>
+                        <ul className="space-y-1">
+                          <li>{t("share.speakerNotes")}</li>
+                          <li>{t("share.otherPresentations")}</li>
+                          <li>{t("share.editingAccess")}</li>
+                        </ul>
+                      </div>
+                    </div>
+                  </details>
 
                   {error && (
                     <p className="text-xs text-red-400 bg-red-400/10 px-3 py-2 rounded-lg">
@@ -194,7 +197,7 @@ export default function ShareDialog({ deck, children }: ShareDialogProps) {
                     {t("share.openSharedLink")}
                   </a>
 
-                  <p className="text-[11px] text-muted-foreground/70 text-center">
+                  <p className="sr-only text-[11px] text-muted-foreground/70 text-center">
                     {t("share.anyoneWithLink")}
                   </p>
                 </>