@alexgorbatchev/shadcn 0.0.48 → 0.0.49

package/dist/index.js

@@ -160,6 +160,14 @@ import {
   StepperIndicator2,
   StepperContent2,
   AppShell2,
+  Stack2,
+  Grid2,
+  GridItem2,
+  Container2,
+  Text2,
+  Heading2,
+  WeatherSummary2,
+  WeatherForecast2,
   PageHeader2,
   WorkspaceSwitcher2,
   AccountMenu2,
@@ -172,7 +180,7 @@ import {
   StatusTracker2,
   DashboardLayout2,
   BillingUsage2
-} from "./chunk-svr3r7pj.js";
+} from "./chunk-jhvy8jay.js";
 import {
   Tabs2,
   tabsListVariants2,
@@ -187,7 +195,7 @@ import {
   useDropTarget2,
   DropTarget2,
   Kanban2
-} from "./chunk-gbmvkt3q.js";
+} from "./chunk-62ggz655.js";
 import {
   Toolbar2,
   ToolbarButton2,
@@ -195,10 +203,8 @@ import {
   ToolbarInput2,
   ToolbarGroup2,
   ToolbarSeparator2
-} from "./chunk-x6vx0v6d.js";
+} from "./chunk-7srpghny.js";
 import {
-  ScrollArea2,
-  ScrollBar2,
   Combobox2,
   ComboboxValue2,
   ComboboxTrigger2,
@@ -222,15 +228,15 @@ import {
   NumberFieldIncrement2,
   NumberFieldScrubArea2,
   NumberFieldScrubAreaCursor2
-} from "./chunk-a6mes7w0.js";
+} from "./chunk-31wptjv4.js";
 import {
   NativeSelect2,
   NativeSelectOption2,
   NativeSelectOptGroup2
-} from "./chunk-r4jzz4f2.js";
+} from "./chunk-sp4g23m0.js";
 import {
   Slider2
-} from "./chunk-2mn2ctsk.js";
+} from "./chunk-7cq1s2ey.js";
 import {
   MenuPortal,
   MenuPopup,
@@ -248,7 +254,7 @@ import {
   MenuShortcut2,
   DropdownMenu2,
   DropdownMenuTrigger2
-} from "./chunk-cfnkbp0y.js";
+} from "./chunk-10vjajh7.js";
 import {
   Empty2,
   EmptyHeader2,
@@ -256,7 +262,7 @@ import {
   EmptyTitle2,
   EmptyDescription2,
   EmptyContent2
-} from "./chunk-9de1htr5.js";
+} from "./chunk-4e96tpw0.js";
 import {
   Table2,
   TableHeader2,
@@ -268,55 +274,59 @@ import {
   TableColumnGroup2,
   TableColumn2,
   TableCaption2
-} from "./chunk-zte6pw69.js";
+} from "./chunk-tjn53x34.js";
 import {
-  Alert2,
-  AlertTitle2,
-  AlertDescription2,
-  AlertAction2
-} from "./chunk-zdt8xxzy.js";
+  ScrollArea2,
+  ScrollBar2
+} from "./chunk-f9sm5zpv.js";
 import {
   RadioGroup2,
   RadioGroupItem2
-} from "./chunk-ekbesw9t.js";
-import {
-  FieldSet2,
-  FieldLegend2,
-  FieldGroup2,
-  Field2,
-  FieldContent2,
-  FieldLabel2,
-  FieldTitle2,
-  FieldDescription2,
-  FieldSeparator2,
-  FieldError2
-} from "./chunk-6jpz5geq.js";
+} from "./chunk-kgqe8gpb.js";
 import {
   toggleVariants2,
   Toggle2,
   ToggleGroup2,
   ToggleGroupItem2
-} from "./chunk-q606kj28.js";
-import {
-  Spinner2
-} from "./chunk-1xncv9gb.js";
+} from "./chunk-p56he2j7.js";
 import {
   Checkbox2
-} from "./chunk-caz81rnv.js";
+} from "./chunk-b5s5y5wq.js";
 import {
   Kbd2,
   KbdGroup2
-} from "./chunk-vyve5wf3.js";
+} from "./chunk-7vnpp3ya.js";
 import {
   Switch2
-} from "./chunk-ptgtqv1a.js";
+} from "./chunk-m98d89xc.js";
 import {
   Progress2,
   ProgressTrack2,
   ProgressIndicator2,
   ProgressLabel2,
   ProgressValue2
-} from "./chunk-5j39rehg.js";
+} from "./chunk-bcwbh20z.js";
+import {
+  Alert2,
+  AlertTitle2,
+  AlertDescription2,
+  AlertAction2
+} from "./chunk-x9qph1g4.js";
+import {
+  FieldSet2,
+  FieldLegend2,
+  FieldGroup2,
+  Field2,
+  FieldContent2,
+  FieldLabel2,
+  FieldTitle2,
+  FieldDescription2,
+  FieldSeparator2,
+  FieldError2
+} from "./chunk-9n0axzd5.js";
+import {
+  Spinner2
+} from "./chunk-t3p4dn1p.js";
 import {
   Card2,
   CardHeader2,
@@ -325,7 +335,7 @@ import {
   CardAction2,
   CardContent2,
   CardFooter2
-} from "./chunk-bygq5yqf.js";
+} from "./chunk-k1f35j55.js";
 import {
   Sheet2,
   SheetTrigger2,
@@ -359,7 +369,7 @@ import {
   SidebarMenuSub2,
   SidebarMenuSubItem2,
   SidebarMenuSubButton2
-} from "./chunk-c9ypcp4s.js";
+} from "./chunk-1f6p05qh.js";
 import {
   Avatar2,
   AvatarImage2,
@@ -367,28 +377,28 @@ import {
   AvatarBadge2,
   AvatarGroup2,
   AvatarGroupCount2
-} from "./chunk-hyq4nwg2.js";
+} from "./chunk-0hq6rg7w.js";
 import {
   HoverCard2,
   HoverCardTrigger2,
   HoverCardContent2
-} from "./chunk-60p7sagm.js";
+} from "./chunk-9ecf92s6.js";
 import {
   Skeleton2
-} from "./chunk-d70rcwk7.js";
-import {
-  Label2
-} from "./chunk-jcxxjkqx.js";
-import"./chunk-4710gn6d.js";
+} from "./chunk-1fzwfn11.js";
+import"./chunk-m4geb1s5.js";
 import {
   badgeVariants2,
   Badge2
-} from "./chunk-wjx6zf94.js";
+} from "./chunk-9t530p75.js";
 import {
   Collapsible2,
   CollapsibleTrigger2,
   CollapsibleContent2
 } from "./chunk-fw86vanx.js";
+import {
+  Label2
+} from "./chunk-m32ptxf3.js";
 import"./chunk-tcefvfr8.js";
 import {
   Popover2,
@@ -397,7 +407,7 @@ import {
   PopoverHeader2,
   PopoverTitle2,
   PopoverDescription2
-} from "./chunk-21ab0jsp.js";
+} from "./chunk-bf8kbj33.js";
 import {
   Dialog2,
   DialogTrigger2,
@@ -409,7 +419,7 @@ import {
   DialogFooter2,
   DialogTitle2,
   DialogDescription2
-} from "./chunk-jgdpa00w.js";
+} from "./chunk-4t23yhc0.js";
 import {
   InputGroup2,
   InputGroupAddon2,
@@ -417,18 +427,18 @@ import {
   InputGroupText2,
   InputGroupInput2,
   InputGroupTextarea2
-} from "./chunk-14mh00z3.js";
-import {
-  Input2
-} from "./chunk-0fmrwsgp.js";
+} from "./chunk-rxjxb4vy.js";
 import {
   Textarea2
-} from "./chunk-tq0pfv5h.js";
+} from "./chunk-er6e5fj8.js";
+import {
+  Input2
+} from "./chunk-7vg045gd.js";
 import"./chunk-7jpsybag.js";
 import"./chunk-k99h6evz.js";
 import {
   Separator2
-} from "./chunk-rajgnfbr.js";
+} from "./chunk-52aadmkc.js";
 import {
   useTheme2
 } from "./chunk-1j2hz3w9.js";
@@ -439,7 +449,7 @@ import {
   TooltipContent2,
   buttonVariants2,
   Button2
-} from "./chunk-38301e40.js";
+} from "./chunk-bd09gygt.js";
 import {
   usePortalContainer2,
   PortalProvider2
@@ -454,7 +464,7 @@ import"./chunk-8ssktt4b.js";
 import"./chunk-7ny0vyek.js";
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 export {
   Accordion2 as Accordion,
   AccordionContent2 as AccordionContent,
@@ -545,6 +555,7 @@ export {
   ComboboxTrigger2 as ComboboxTrigger,
   ComboboxValue2 as ComboboxValue,
   ConfirmationDialog2 as ConfirmationDialog,
+  Container2 as Container,
   ContextMenu2 as ContextMenu,
   MenuCheckboxItem2 as ContextMenuCheckboxItem,
   ContextMenuContent2 as ContextMenuContent,
@@ -623,6 +634,9 @@ export {
   FieldTitle2 as FieldTitle,
   FilterBar2 as FilterBar,
   FormDialog2 as FormDialog,
+  Grid2 as Grid,
+  GridItem2 as GridItem,
+  Heading2 as Heading,
   HoverCard2 as HoverCard,
   HoverCardContent2 as HoverCardContent,
   HoverCardTrigger2 as HoverCardTrigger,
@@ -783,6 +797,7 @@ export {
   Skeleton2 as Skeleton,
   Slider2 as Slider,
   Spinner2 as Spinner,
+  Stack2 as Stack,
   StarRating2 as StarRating,
   StatCard2 as StatCard,
   StatusTracker2 as StatusTracker,
@@ -807,6 +822,7 @@ export {
   TabsList2 as TabsList,
   TabsTrigger2 as TabsTrigger,
   TagInput2 as TagInput,
+  Text2 as Text,
   Textarea2 as Textarea,
   ThemeProvider2 as ThemeProvider,
   Toast2 as Toast,
@@ -832,6 +848,8 @@ export {
   TooltipContent2 as TooltipContent,
   TooltipProvider2 as TooltipProvider,
   TooltipTrigger2 as TooltipTrigger,
+  WeatherForecast2 as WeatherForecast,
+  WeatherSummary2 as WeatherSummary,
   WorkspaceSwitcher2 as WorkspaceSwitcher,
   badgeVariants2 as badgeVariants,
   buttonGroupVariants2 as buttonGroupVariants,

package/dist/layout/constants.d.ts

@@ -0,0 +1,14 @@
+import type { ContainerWidth, GridAlign, GridColumns, GridMinColumnWidth, GridSpan, LayoutBreakpoint, LayoutHeight, LayoutSpacing, StackAlign, StackDirection, StackJustify } from "./types.js";
+export declare const GAP_CLASSES: Record<LayoutSpacing, string>;
+export declare const PADDING_CLASSES: Record<LayoutSpacing, string>;
+export declare const HEIGHT_CLASSES: Record<LayoutHeight, string>;
+export declare const GROW_CLASSES = "min-h-0 min-w-0 flex-1";
+export declare const STACK_DIRECTION_CLASSES: Record<LayoutBreakpoint, Record<StackDirection, string>>;
+export declare const STACK_ALIGN_CLASSES: Record<StackAlign, string>;
+export declare const STACK_JUSTIFY_CLASSES: Record<StackJustify, string>;
+export declare const GRID_COLUMN_CLASSES: Record<LayoutBreakpoint, Record<GridColumns, string>>;
+export declare const GRID_MIN_COLUMN_WIDTH_CLASSES: Record<GridMinColumnWidth, string>;
+export declare const GRID_ALIGN_CLASSES: Record<GridAlign, string>;
+export declare const GRID_SPAN_CLASSES: Record<LayoutBreakpoint, Record<GridSpan, string>>;
+export declare const CONTAINER_WIDTH_CLASSES: Record<ContainerWidth, string>;
+export declare const LAYOUT_BREAKPOINTS: readonly LayoutBreakpoint[];

package/dist/layout/responsiveClassNames.d.ts

@@ -0,0 +1,3 @@
+import type { LayoutBreakpoint, ResponsiveValue } from "./types.js";
+/** Resolves a responsive value to the literal class names of each breakpoint it sets. */
+export declare function responsiveClassNames<Value extends string | number>(value: ResponsiveValue<Value> | undefined, classes: Readonly<Record<LayoutBreakpoint, Readonly<Record<Value, string>>>>): string;

package/dist/layout/types.d.ts

@@ -0,0 +1,28 @@
+import type { Density } from "../density/types.js";
+/** Density-aware spacing tokens from `theme.css`, smallest to largest. */
+export type LayoutSpacing = "none" | "control" | "panel-sm" | "panel" | "field" | "section";
+/** Viewport breakpoints; `base` applies below `sm`. */
+export type LayoutBreakpoint = "base" | "sm" | "md" | "lg" | "xl";
+/** A single value, or values keyed by the viewport breakpoint where each one starts to apply. */
+export type ResponsiveValue<Value> = Value | Readonly<Partial<Record<LayoutBreakpoint, Value>>>;
+/**
+ * Block size:
+ * - `auto`: intrinsic height.
+ * - `full`: the parent's full height; descendants may shrink below their intrinsic height.
+ * - `viewport`: exactly the dynamic viewport height, for application frames.
+ * - `min-viewport`: at least the dynamic viewport height, for pages that may scroll as a whole.
+ */
+export type LayoutHeight = "auto" | "full" | "viewport" | "min-viewport";
+export type StackDirection = "vertical" | "horizontal";
+export type StackAlign = "start" | "center" | "end" | "stretch" | "baseline";
+export type StackJustify = "start" | "center" | "end" | "between";
+export type GridColumns = 1 | 2 | 3 | 4 | 5 | 6 | 12;
+/** Minimum track width for intrinsically responsive grids that fit as many columns as the width allows. */
+export type GridMinColumnWidth = "xs" | "sm" | "md" | "lg";
+export type GridSpan = 1 | 2 | 3 | 4 | 5 | 6 | "full";
+export type GridAlign = "start" | "center" | "end" | "stretch";
+export type ContainerWidth = "xs" | "sm" | "md" | "lg" | "xl" | "full";
+export type LayoutState = {
+    slot: string;
+    density?: Density;
+};

package/dist/prototype.js

@@ -2051,7 +2051,7 @@ var program = new Command;
 // package.json
 var package_default = {
   name: "@alexgorbatchev/shadcn",
-  version: "0.0.48",
+  version: "0.0.49",
   description: "Sharp, monospace React components with compact and comfortable densities.",
   license: "MIT",
   repository: {

package/dist/theme.css

@@ -65,7 +65,9 @@
   --spacing-tag: var(--ag-tag-h);
   --spacing-tag-x: var(--ag-tag-x);
   --spacing-panel: var(--ag-panel-padding);
+  --spacing-panel-sm: var(--ag-panel-padding-sm);
   --spacing-field-gap: var(--ag-field-gap);
+  --spacing-section: var(--ag-section-gap);
   --shadow-frame: 0 0 0 1px var(--frame-halo), var(--ag-shadow);
 }
 
@@ -86,6 +88,7 @@
     --ag-panel-padding: 16px;
     --ag-panel-padding-sm: 12px;
     --ag-field-gap: 20px;
+    --ag-section-gap: 32px;
     color-scheme: dark;
     --background: #121417;
     --foreground: #eceff3;
@@ -216,6 +219,7 @@
     --ag-panel-padding: 16px;
     --ag-panel-padding-sm: 12px;
     --ag-field-gap: 20px;
+    --ag-section-gap: 32px;
   }
 
   [data-density="compact"] {
@@ -232,6 +236,7 @@
     --ag-panel-padding: 8px;
     --ag-panel-padding-sm: 6px;
     --ag-field-gap: 8px;
+    --ag-section-gap: 16px;
   }
 
   * {

package/dist/typography/types.d.ts

@@ -0,0 +1,2 @@
+/** Inline-direction text alignment that follows the writing direction. */
+export type TextAlign = "start" | "center" | "end";

package/llms/components/actions/ButtonLink.md

@@ -8,6 +8,7 @@ Source: src/components/stories/actions/ButtonLink.stories.tsx
 ## Public imports
 
 ```tsx
+import { AnalyticsProvider } from "@alexgorbatchev/shadcn/analytics";
 import { Button, ButtonLink } from "@alexgorbatchev/shadcn";
 ```
 
@@ -151,6 +152,27 @@ Storybook CSF excerpts. Default args and render apply unless overridden. Local h
 }
 ```
 
+### RouterLinkAnalytics
+
+```tsx
+{
+    args: { onClick: fn() },
+    decorators: [
+        (Story) => (<AnalyticsProvider enabled transport={{ track: trackLinkActivation }}>
+        <Story />
+      </AnalyticsProvider>),
+    ],
+    render: ({ href: _href, ...args }) => (<div className="flex items-center gap-4">
+      <ButtonLink {...args} render={<ClientRouterLink to="/plans" onNavigate={clientNavigate}/>}>
+        Plans
+      </ButtonLink>
+      <ButtonLink {...args} render={<ClientRouterLink to="/blocked" onNavigate={clientNavigate} onClick={(event) => event.preventDefault()}/>}>
+        Blocked
+      </ButtonLink>
+    </div>)
+}
+```
+
 ### RenderCallback
 
 ```tsx

package/llms/components/assistant-ui/elements/conversations/CanvasSplit.md

@@ -66,3 +66,41 @@ Storybook CSF excerpts. Default args and render apply unless overridden. Local h
     args: { onCopy: undefined, onClose: undefined }
 }
 ```
+
+### FillSideBySide
+
+```tsx
+{
+    decorators: [
+        (Story) => (<div className="h-[400px] w-[960px]" data-scroll="none">
+        <Story />
+      </div>),
+    ],
+    render: fillRender
+}
+```
+
+### FillStacked
+
+```tsx
+{
+    decorators: [
+        (Story) => (<div className="h-[520px] w-[360px]" data-scroll="none">
+        <Story />
+      </div>),
+    ],
+    render: fillRender
+}
+```
+
+### CardSize
+
+```tsx
+{
+    decorators: [
+        (Story) => (<div className="w-[960px]">
+        <Story />
+      </div>),
+    ]
+}
+```

package/llms/components/assistant-ui/elements/data-visualization/GeoMap.md

@@ -8,9 +8,16 @@ Source: src/components/stories/assistant-ui/elements/data-visualization/GeoMap.s
 ## Public imports
 
 ```tsx
+import { Button } from "@alexgorbatchev/shadcn";
 import { GeoMap } from "@alexgorbatchev/shadcn/assistant-ui";
 ```
 
+## Supporting imports
+
+```tsx
+import { useState, type ComponentProps, type ReactElement } from "react";
+```
+
 ## Default component
 
 ```tsx
@@ -89,3 +96,53 @@ Storybook CSF excerpts. Default args and render apply unless overridden. Local h
     args: { places: [], routes: [] }
 }
 ```
+
+### FillHeight
+
+```tsx
+{
+    args: { height: "fill" },
+    decorators: [
+        (Story) => (<div className="h-[480px] w-[520px]" data-scroll="none">
+        <Story />
+      </div>),
+    ]
+}
+```
+
+### FillResizesMap
+
+```tsx
+{
+    args: { height: "fill", showPlaces: false },
+    decorators: [
+        (Story) => (<div className="h-[240px] w-[320px] resize overflow-hidden" data-testid="GeoMapFrame">
+        <Story />
+      </div>),
+    ]
+}
+```
+
+### DynamicAttribution
+
+```tsx
+{
+    render: (args) => <SwitchingAttributionMap {...args}/>
+}
+```
+
+### ControlledSelection
+
+```tsx
+{
+    args: {
+        places: [
+            { id: "london", lat: 51.5, lng: -0.12, label: "London" },
+            { id: "paris", lat: 48.85, lng: 2.35, label: "Paris" },
+            { id: "rome", lat: 41.9, lng: 12.5, label: "Rome" },
+        ],
+        routes: [],
+    },
+    render: (args) => <ControlledSelectionMap {...args}/>
+}
+```

package/llms/components/assistant-ui/elements/data-visualization/RecommendationCard.md

@@ -1,5 +1,7 @@
 # RecommendationCard
 
+RecommendationCard presents one suggestion. Each action renders only when its handler is supplied: `onReject` (`rejectLabel`, default "Not this"), `onAlternatives` (`alternativesLabel`, default "Alternatives"), and `onAccept` (`acceptLabel`, default "Accept"). The `accepted` and `rejected` states replace the actions with `acceptedLabel` or `rejectedLabel` and keep keyboard focus on the card. Omit `confidenceLabel` to hide the confidence indicator; `fullWidth` spans the container.
+
 Story: @alexgorbatchev/shadcn/components/assistant-ui/elements/data-visualization/RecommendationCard
 Source: src/components/stories/assistant-ui/elements/data-visualization/RecommendationCard.stories.tsx
 
@@ -43,6 +45,37 @@ Storybook CSF excerpts. Default args and render apply unless overridden. Local h
 }
 ```
 
+### CustomActions
+
+```tsx
+{
+    args: {
+        ...Default.args,
+        question: "Harbor noodle bar",
+        children: "Open now, 8 minutes away on foot.",
+        confidenceLabel: undefined,
+        acceptLabel: "Go",
+        alternativesLabel: "More like this",
+        rejectLabel: "Not this",
+        onReject: fn(),
+        fullWidth: true,
+    },
+    decorators: [
+        (Story) => (<div className="w-[560px]">
+        <Story />
+      </div>),
+    ]
+}
+```
+
+### WithoutActions
+
+```tsx
+{
+    args: { ...Default.args, onAccept: undefined, onAlternatives: undefined }
+}
+```
+
 ### Accepted
 
 ```tsx
@@ -51,6 +84,14 @@ Storybook CSF excerpts. Default args and render apply unless overridden. Local h
 }
 ```
 
+### Rejected
+
+```tsx
+{
+    args: { ...CustomActions.args, state: "rejected", rejectedLabel: "Won't suggest this again" }
+}
+```
+
 ### LightTheme
 
 ```tsx