foss-design 0.9.1 → 0.9.3

package/dist/viewer-lib/styles.css

@@ -851,6 +851,10 @@
     max-height: 82dvh;
   }
 
+  .max-h-\[90dvh\] {
+    max-height: 90dvh;
+  }
+
   .max-h-\[96px\] {
     max-height: 96px;
   }
@@ -1596,6 +1600,10 @@
     }
   }
 
+  .px-0 {
+    padding-inline: 0;
+  }
+
   .px-0\.5 {
     padding-inline: calc(var(--spacing) * .5);
   }

package/dist/viewer-lib/types/viewer/src/components/search-button.d.ts

@@ -1,6 +1,11 @@
 export declare function openPalette(): void;
-/** Opens ⌘K. As tall as the buttons next to it; drops the label on narrow screens. */
-export declare function SearchButton({ width, label }: {
+/**
+ * Opens ⌘K. As tall as the buttons next to it. Without `compact` it drops the label on narrow
+ * screens; a bar that measures its own room passes `compact` instead, and gets a square icon
+ * with a tooltip when short of it.
+ */
+export declare function SearchButton({ width, label, compact, }: {
     width?: number;
     label?: string;
+    compact?: boolean;
 }): import("react").JSX.Element;

package/dist/viewer-lib/types/viewer/src/components/topbar.d.ts

@@ -1,8 +1,21 @@
-import { type ReactNode } from 'react';
+import { type ReactNode, type RefObject } from 'react';
 /** A 52px bar across the top; pages that fill the screen compose their own content into it. */
 export declare function Bar({ children, className }: {
     children: ReactNode;
     className?: string;
 }): import("react").JSX.Element;
+/**
+ * Whether the bar is short of room: its buttons show as square icons with tooltips then. Slots
+ * (Share and the like) read it to follow along.
+ */
+export declare function useBarCompact(): boolean;
+export declare const BarCompactProvider: import("react").Provider<boolean>;
+/**
+ * Measures a bar: `title` holds text that truncates (`data-fit` on each truncating element),
+ * `end` the buttons. Compact once the title has to truncate; full again once the buttons at full
+ * width fit in the room the title leaves. The full width is remembered from the last time the
+ * buttons had it, so the bar does not flip back and forth.
+ */
+export declare function useFitBar(title: RefObject<HTMLElement | null>, end: RefObject<HTMLElement | null>, deps: unknown[]): boolean;
 /** The app's top bar: project, sections, search and appearance. */
 export declare function AppTopBar(): import("react").JSX.Element;

package/dist/viewer-lib/types/viewer/src/library.d.ts

@@ -2,7 +2,7 @@ export type { AssetDoc, CanvasDoc, CanvasItem, CanvasPage, CanvasSection, Canvas
 export { DesignViewer, type DesignViewerProps } from './app';
 export { SlidePanel } from './components/slide-panel';
 export { ThemeMenu } from './components/theme-menu';
-export { Bar } from './components/topbar';
+export { Bar, useBarCompact } from './components/topbar';
 export { Mark, Wordmark } from './components/wordmark';
 export { cn } from './lib/cn';
 export { copyText } from './lib/copy';

package/dist/viewer-lib/types/viewer/src/pages/canvas/canvas-bar.d.ts

@@ -23,7 +23,9 @@ export declare function SelectionBar({ canvas, store, layoutItems, theme, onPlay
     inspect: boolean;
 }): import("react").JSX.Element | null;
 /** The inspect mode switch: a button that stays pressed while on. */
-export declare function InspectToggle({ on, onChange }: {
+export declare function InspectToggle({ on, onChange, compact, }: {
     on: boolean;
     onChange(value: boolean): void;
+    /** A square icon; the tooltip names it. */
+    compact?: boolean;
 }): import("react").JSX.Element;

package/dist/viewer-lib/types/viewer/src/ui/dialog.d.ts

@@ -2,6 +2,7 @@ import type { ReactNode } from 'react';
 /**
  * A modal over a dimmed page: focus stays inside until it closes, Escape and a
  * click outside close it. Head and foot are a panel's; `actions` go to the foot.
+ * On a phone it is a sheet from the bottom edge with a handle: swiping it down closes it too.
  */
 export declare function Dialog({ open, onOpenChange, title, description, children, actions, footNote, below, width, }: {
     open: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "foss-design",
-  "version": "0.9.1",
+  "version": "0.9.3",
   "description": "Design canvases and design systems for coding agents: live, animated, clickable screens on an infinite canvas, served locally from a .design folder.",
   "type": "module",
   "license": "MIT",