Toggle Group

1// Base UI base toggle-group — runs on @octanejs/base-ui's ToggleGroup.
2//
3// THERE IS NO `Item` PART. Verified by rendering the primitive: Base UI's ToggleGroup is a single
4// component whose children are ordinary `Toggle`s carrying a `value`, where radix pairs
5// `ToggleGroup.Root` with `ToggleGroup.Item`. So `ToggleGroupItem` here wraps `Toggle` — the same
6// primitive `toggle.tsrx` uses — and the exported names and `data-slot` values stay as shadcn
7// defines them, so consumers see no difference between bases.
8//
9// TWO API DIFFERENCES A CONSUMER CAN OBSERVE, both inherent to the primitive:
10//
11//   1. `type="single" | "multiple"` is translated to Base UI's `multiple` boolean, so markup
12//      written against the radix base keeps working.
13//
14//   2. VALUES ARE ALWAYS ARRAYS. Base UI's `value` / `defaultValue` / `onValueChange` speak
15//      `string[]` in both modes, where radix's single mode speaks a bare `string`. That is not
16//      translated: faking a scalar would mean inventing conversion behavior on every change, and
17//      silently reshaping the argument to the consumer's handler is worse than a documented
18//      difference. Single mode still yields at most one entry.
19//
20// The pressed dialect is `data-pressed`, not radix's `data-[state=on]` — see toggle.tsrx, whose
21// `toggleVariants` this file reuses, so the two bases cannot drift apart.
22//
23// ToggleGroup is composed with createElement: the consumer's children must sit INSIDE the context
24// Provider, and opaque compiled .tsrx children can only flow through the props.children channel
25// (see breadcrumb.tsrx's comment).
26//
27// UNVERIFIED PROVENANCE: class strings come from this package's radix base rather than
28// transcribed from upstream's Base UI source.
29import { createContext, createElement, useContext, type OctaneNode } from 'octane';
30import { type VariantProps } from 'class-variance-authority';
31import { ToggleGroup as ToggleGroupPrimitive } from '@octanejs/base-ui/toggle-group';
32import { Toggle as TogglePrimitive } from '@octanejs/base-ui/toggle';
33 
34import { cn } from '@/lib/utils';
35import { toggleVariants } from '@/components/ui/toggle';
36 
37const ToggleGroupContext = createContext<
38	VariantProps<typeof toggleVariants> & {
39		spacing?: number;
40		orientation?: 'horizontal' | 'vertical';
41	}
42>({
43	size: 'default',
44	variant: 'default',
45	spacing: 2,
46	orientation: 'horizontal',
47});
48 
49export interface ToggleGroupProps extends Record<string, unknown> {
50	className?: string;
51// … truncated