@tribepad/themis 1.0.1 → 1.0.3

package/dist/elements/ButtonGroup/index.js

@@ -1,239 +1,3 @@
 "use client";
-'use strict';
-
-var react = require('react');
-var reactAriaComponents = require('react-aria-components');
-var clsx = require('clsx');
-var tailwindMerge = require('tailwind-merge');
-var classVarianceAuthority = require('class-variance-authority');
-var jsxRuntime = require('react/jsx-runtime');
-var zod = require('zod');
-
-// src/elements/ButtonGroup/ButtonGroup.tsx
-function cn(...inputs) {
-  return tailwindMerge.twMerge(clsx.clsx(inputs));
-}
-var ButtonGroupContext = react.createContext(null);
-ButtonGroupContext.displayName = "ButtonGroupContext";
-function useButtonGroupContext() {
-  return react.useContext(ButtonGroupContext);
-}
-var ButtonGroupItemContext = react.createContext(null);
-ButtonGroupItemContext.displayName = "ButtonGroupItemContext";
-function useButtonGroupItemContext() {
-  return react.useContext(ButtonGroupItemContext);
-}
-var buttonGroupVariants = classVarianceAuthority.cva("inline-flex items-center gap-0", {
-  variants: {
-    orientation: {
-      horizontal: "flex-row",
-      vertical: "flex-col w-full"
-    }
-  },
-  defaultVariants: {
-    orientation: "horizontal"
-  }
-});
-var buttonGroupItemVariants = classVarianceAuthority.cva("", {
-  variants: {
-    orientation: {
-      // min-w-[44px] ensures visual layer fills touch target width (for icon buttons)
-      horizontal: "min-w-[44px]",
-      // flex (overrides inline-flex) + min-h-[44px] makes visual layer fill touch target,
-      // eliminating gaps between stacked buttons in vertical orientation
-      vertical: "flex min-h-[44px]"
-    },
-    position: {
-      first: "",
-      middle: "",
-      last: "",
-      only: ""
-      // Single button - no modifications needed
-    }
-  },
-  compoundVariants: [
-    // ==========================================================================
-    // Horizontal Orientation
-    // ==========================================================================
-    {
-      orientation: "horizontal",
-      position: "first",
-      className: "rounded-r-none border-r-0"
-    },
-    {
-      orientation: "horizontal",
-      position: "middle",
-      className: "rounded-none border-r-0"
-    },
-    {
-      orientation: "horizontal",
-      position: "last",
-      className: "rounded-l-none"
-    },
-    // ==========================================================================
-    // Vertical Orientation
-    // Note: w-full is handled by Button's effectiveFullWidth for both layers
-    // ==========================================================================
-    {
-      orientation: "vertical",
-      position: "first",
-      className: "rounded-b-none border-b-0"
-    },
-    {
-      orientation: "vertical",
-      position: "middle",
-      className: "rounded-none border-b-0"
-    },
-    {
-      orientation: "vertical",
-      position: "last",
-      className: "rounded-t-none"
-    }
-  ],
-  defaultVariants: {
-    orientation: "horizontal",
-    position: "only"
-  }
-});
-var buttonGroupSeparatorVariants = classVarianceAuthority.cva("bg-[var(--border)]", {
-  variants: {
-    orientation: {
-      horizontal: "w-px h-6 mx-1",
-      vertical: "h-px w-full my-1"
-    }
-  },
-  defaultVariants: {
-    orientation: "horizontal"
-  }
-});
-var isButtonElement = (child) => {
-  if (!react.isValidElement(child)) return false;
-  const componentType = child.type;
-  return componentType?.displayName === "Button";
-};
-var isSeparatorElement = (child) => {
-  if (!react.isValidElement(child)) return false;
-  const componentType = child.type;
-  return componentType?.displayName === "ButtonGroupSeparator";
-};
-var getPosition = (index, total) => {
-  if (total === 1) return "only";
-  if (index === 0) return "first";
-  if (index === total - 1) return "last";
-  return "middle";
-};
-var filterButtonChildren = (children) => {
-  return children.filter(isButtonElement);
-};
-var getButtonIndex = (child, buttonChildren) => {
-  return buttonChildren.indexOf(child);
-};
-var ButtonGroup = react.forwardRef(
-  ({
-    orientation = "horizontal",
-    variant,
-    size,
-    isDisabled,
-    className,
-    children,
-    ...props
-  }, ref) => {
-    const childArray = react.Children.toArray(children);
-    const buttonChildren = childArray.filter(isButtonElement);
-    const totalButtons = buttonChildren.length;
-    const groupContextValue = {
-      orientation,
-      variant,
-      size,
-      isDisabled
-    };
-    const wrappedChildren = childArray.map((child, index) => {
-      if (isButtonElement(child)) {
-        const buttonIndex = buttonChildren.indexOf(child);
-        const position = getPosition(buttonIndex, totalButtons);
-        return /* @__PURE__ */ jsxRuntime.jsx(
-          ButtonGroupItemContext.Provider,
-          {
-            value: { position },
-            children: child
-          },
-          index
-        );
-      }
-      return child;
-    });
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      reactAriaComponents.Toolbar,
-      {
-        ref,
-        orientation,
-        "aria-label": props["aria-label"],
-        "aria-labelledby": props["aria-labelledby"],
-        className: cn(buttonGroupVariants({ orientation }), className),
-        children: /* @__PURE__ */ jsxRuntime.jsx(ButtonGroupContext.Provider, { value: groupContextValue, children: wrappedChildren })
-      }
-    );
-  }
-);
-ButtonGroup.displayName = "ButtonGroup";
-var ButtonGroupSeparator = react.forwardRef(
-  ({ className, ...props }, ref) => {
-    const groupContext = useButtonGroupContext();
-    const orientation = groupContext?.orientation ?? "horizontal";
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        ref,
-        role: "separator",
-        "aria-hidden": "true",
-        className: cn(
-          buttonGroupSeparatorVariants({ orientation }),
-          className
-        ),
-        ...props
-      }
-    );
-  }
-);
-ButtonGroupSeparator.displayName = "ButtonGroupSeparator";
-var ButtonGroupPropsSchema = zod.z.object({
-  /** Orientation of the button group layout */
-  orientation: zod.z.enum(["horizontal", "vertical"]).optional().default("horizontal"),
-  /** Default variant for all child buttons (can be overridden per-button) */
-  variant: zod.z.enum(["default", "destructive", "outline", "secondary", "ghost"]).optional(),
-  /** Default size for all child buttons (can be overridden per-button) */
-  size: zod.z.enum(["sm", "default", "lg", "icon"]).optional(),
-  /** Disable all buttons in the group */
-  isDisabled: zod.z.boolean().optional(),
-  /** Accessible label for the toolbar (recommended) */
-  "aria-label": zod.z.string().optional(),
-  /** ID of element that labels the toolbar */
-  "aria-labelledby": zod.z.string().optional(),
-  /** Additional CSS classes */
-  className: zod.z.string().optional(),
-  /** Child elements (Buttons, Separators, etc.) */
-  children: zod.z.custom()
-});
-var ButtonGroupSeparatorPropsSchema = zod.z.object({
-  /** Additional CSS classes */
-  className: zod.z.string().optional(),
-  /** Test ID for testing */
-  "data-testid": zod.z.string().optional()
-});
-
-exports.ButtonGroup = ButtonGroup;
-exports.ButtonGroupPropsSchema = ButtonGroupPropsSchema;
-exports.ButtonGroupSeparator = ButtonGroupSeparator;
-exports.ButtonGroupSeparatorPropsSchema = ButtonGroupSeparatorPropsSchema;
-exports.buttonGroupItemVariants = buttonGroupItemVariants;
-exports.buttonGroupSeparatorVariants = buttonGroupSeparatorVariants;
-exports.buttonGroupVariants = buttonGroupVariants;
-exports.filterButtonChildren = filterButtonChildren;
-exports.getButtonIndex = getButtonIndex;
-exports.getPosition = getPosition;
-exports.isButtonElement = isButtonElement;
-exports.isSeparatorElement = isSeparatorElement;
-exports.useButtonGroupContext = useButtonGroupContext;
-exports.useButtonGroupItemContext = useButtonGroupItemContext;
-//# sourceMappingURL=index.js.map
+'use strict';var react=require('react'),reactAriaComponents=require('react-aria-components'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),classVarianceAuthority=require('class-variance-authority'),jsxRuntime=require('react/jsx-runtime'),zod=require('zod');function s(...t){return tailwindMerge.twMerge(clsx.clsx(t))}var a=react.createContext(null);a.displayName="ButtonGroupContext";function m(){return react.useContext(a)}var u=react.createContext(null);u.displayName="ButtonGroupItemContext";function M(){return react.useContext(u)}var d=classVarianceAuthority.cva("inline-flex items-center gap-0",{variants:{orientation:{horizontal:"flex-row",vertical:"flex-col w-full"}},defaultVariants:{orientation:"horizontal"}}),A=classVarianceAuthority.cva("",{variants:{orientation:{horizontal:"min-w-[44px]",vertical:"flex min-h-[44px]"},position:{first:"",middle:"",last:"",only:""}},compoundVariants:[{orientation:"horizontal",position:"first",className:"rounded-r-none border-r-0"},{orientation:"horizontal",position:"middle",className:"rounded-none border-r-0"},{orientation:"horizontal",position:"last",className:"rounded-l-none"},{orientation:"vertical",position:"first",className:"rounded-b-none border-b-0"},{orientation:"vertical",position:"middle",className:"rounded-none border-b-0"},{orientation:"vertical",position:"last",className:"rounded-t-none"}],defaultVariants:{orientation:"horizontal",position:"only"}}),B=classVarianceAuthority.cva("bg-[var(--border)]",{variants:{orientation:{horizontal:"w-px h-6 mx-1",vertical:"h-px w-full my-1"}},defaultVariants:{orientation:"horizontal"}});var r=t=>react.isValidElement(t)?t.type?.displayName==="Button":false,H=t=>react.isValidElement(t)?t.type?.displayName==="ButtonGroupSeparator":false,x=(t,e)=>e===1?"only":t===0?"first":t===e-1?"last":"middle",L=t=>t.filter(r),j=(t,e)=>e.indexOf(t);var P=react.forwardRef(({orientation:t="horizontal",variant:e,size:p,isDisabled:f,className:l,children:S,...G},g)=>{let y=react.Children.toArray(S),b=y.filter(r),z=b.length,I={orientation:t,variant:e,size:p,isDisabled:f},R=y.map((n,E)=>{if(r(n)){let T=b.indexOf(n),w=x(T,z);return jsxRuntime.jsx(u.Provider,{value:{position:w},children:n},E)}return n});return jsxRuntime.jsx(reactAriaComponents.Toolbar,{ref:g,orientation:t,"aria-label":G["aria-label"],"aria-labelledby":G["aria-labelledby"],className:s(d({orientation:t}),l),children:jsxRuntime.jsx(a.Provider,{value:I,children:R})})});P.displayName="ButtonGroup";var N=react.forwardRef(({className:t,...e},p)=>{let l=m()?.orientation??"horizontal";return jsxRuntime.jsx("div",{ref:p,role:"separator","aria-hidden":"true",className:s(B({orientation:l}),t),...e})});N.displayName="ButtonGroupSeparator";var F=zod.z.object({orientation:zod.z.enum(["horizontal","vertical"]).optional().default("horizontal"),variant:zod.z.enum(["default","destructive","outline","secondary","ghost"]).optional(),size:zod.z.enum(["sm","default","lg","icon"]).optional(),isDisabled:zod.z.boolean().optional(),"aria-label":zod.z.string().optional(),"aria-labelledby":zod.z.string().optional(),className:zod.z.string().optional(),children:zod.z.custom()}),J=zod.z.object({className:zod.z.string().optional(),"data-testid":zod.z.string().optional()});exports.ButtonGroup=P;exports.ButtonGroupPropsSchema=F;exports.ButtonGroupSeparator=N;exports.ButtonGroupSeparatorPropsSchema=J;exports.buttonGroupItemVariants=A;exports.buttonGroupSeparatorVariants=B;exports.buttonGroupVariants=d;exports.filterButtonChildren=L;exports.getButtonIndex=j;exports.getPosition=x;exports.isButtonElement=r;exports.isSeparatorElement=H;exports.useButtonGroupContext=m;exports.useButtonGroupItemContext=M;//# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/elements/ButtonGroup/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/cn.ts","../../../src/elements/ButtonGroup/ButtonGroupContext.tsx","../../../src/elements/ButtonGroup/ButtonGroup.variants.ts","../../../src/elements/ButtonGroup/ButtonGroup.utils.ts","../../../src/elements/ButtonGroup/ButtonGroup.tsx","../../../src/elements/ButtonGroup/ButtonGroup.types.ts"],"names":["twMerge","clsx","createContext","useContext","cva","isValidElement","forwardRef","Children","jsx","Toolbar","z"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Class Name Utility\n * Merges Tailwind CSS classes with conflict resolution\n *\n * Combines clsx for conditional classes and tailwind-merge for deduplication\n *\n * @example\n * cn('px-2 py-1', 'px-4') // => 'py-1 px-4' (px-4 overrides px-2)\n * cn('text-red-500', condition && 'text-blue-500') // => conditional application\n */\n\nimport { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { createContext, useContext } from 'react';\nimport type {\n  ButtonGroupContextValue,\n  ButtonGroupItemContextValue,\n} from './ButtonGroup.types';\n\n/**\n * ButtonGroup Context System (Two-Level)\n *\n * Provides a two-level context pattern for ButtonGroup:\n *\n * 1. ButtonGroupContext (group-level):\n *    - Provides: orientation, variant, size, isDisabled\n *    - Consumed by: Button (for prop inheritance), Separator (for orientation)\n *\n * 2. ButtonGroupItemContext (item-level):\n *    - Provides: position ('first' | 'middle' | 'last' | 'only')\n *    - Consumed by: Button (for border-radius styling)\n *\n * Both contexts return null when not in a provider, allowing Button\n * to work standalone without any group context.\n *\n * @see plan.md for architecture details\n * @see ButtonGroup.tsx for Provider implementation\n */\n\n// =============================================================================\n// Group-Level Context\n// =============================================================================\n\n/**\n * Context for group-level props (orientation, variant, size, isDisabled)\n * Default value is null to indicate \"not in a group\"\n */\nconst ButtonGroupContext = createContext<ButtonGroupContextValue | null>(null);\n\nButtonGroupContext.displayName = 'ButtonGroupContext';\n\n/**\n * Hook to access group-level context\n * @returns ButtonGroupContextValue if inside a ButtonGroup, null otherwise\n */\nexport function useButtonGroupContext(): ButtonGroupContextValue | null {\n  return useContext(ButtonGroupContext);\n}\n\n// =============================================================================\n// Item-Level Context\n// =============================================================================\n\n/**\n * Context for per-button position information\n * Default value is null to indicate \"not wrapped with position context\"\n */\nconst ButtonGroupItemContext =\n  createContext<ButtonGroupItemContextValue | null>(null);\n\nButtonGroupItemContext.displayName = 'ButtonGroupItemContext';\n\n/**\n * Hook to access item-level context (position)\n * @returns ButtonGroupItemContextValue if wrapped with position context, null otherwise\n */\nexport function useButtonGroupItemContext(): ButtonGroupItemContextValue | null {\n  return useContext(ButtonGroupItemContext);\n}\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nexport { ButtonGroupContext, ButtonGroupItemContext };\n","import { cva } from 'class-variance-authority';\n\n/**\n * ButtonGroup CVA Variants\n *\n * Defines Class Variance Authority (CVA) variants for:\n * - ButtonGroup container (orientation-based layout)\n * - ButtonGroupItem (position-based border-radius)\n * - ButtonGroupSeparator (orientation-based styling)\n *\n * @see plan.md Phase 1: Design & Contracts - CVA Variants\n * @see constitution.md Principle V (Component Quality Standards)\n */\n\n// =============================================================================\n// Container Variants\n// =============================================================================\n\n/**\n * ButtonGroup container variants\n * Controls the layout direction based on orientation\n * Uses gap-0 to ensure buttons are connected (share borders)\n */\nexport const buttonGroupVariants = cva('inline-flex items-center gap-0', {\n  variants: {\n    orientation: {\n      horizontal: 'flex-row',\n      vertical: 'flex-col w-full',\n    },\n  },\n  defaultVariants: {\n    orientation: 'horizontal',\n  },\n});\n\n// =============================================================================\n// Item Position Variants\n// =============================================================================\n\n/**\n * ButtonGroupItem position variants\n * Applied to Button's visual layer (Layer 2) for position-aware border-radius\n *\n * Compound variants handle both orientation and position combinations:\n * - Horizontal: left/right borders and radii\n * - Vertical: top/bottom borders and radii\n */\nexport const buttonGroupItemVariants = cva('', {\n  variants: {\n    orientation: {\n      // min-w-[44px] ensures visual layer fills touch target width (for icon buttons)\n      horizontal: 'min-w-[44px]',\n      // flex (overrides inline-flex) + min-h-[44px] makes visual layer fill touch target,\n      // eliminating gaps between stacked buttons in vertical orientation\n      vertical: 'flex min-h-[44px]',\n    },\n    position: {\n      first: '',\n      middle: '',\n      last: '',\n      only: '', // Single button - no modifications needed\n    },\n  },\n  compoundVariants: [\n    // ==========================================================================\n    // Horizontal Orientation\n    // ==========================================================================\n    {\n      orientation: 'horizontal',\n      position: 'first',\n      className: 'rounded-r-none border-r-0',\n    },\n    {\n      orientation: 'horizontal',\n      position: 'middle',\n      className: 'rounded-none border-r-0',\n    },\n    {\n      orientation: 'horizontal',\n      position: 'last',\n      className: 'rounded-l-none',\n    },\n    // ==========================================================================\n    // Vertical Orientation\n    // Note: w-full is handled by Button's effectiveFullWidth for both layers\n    // ==========================================================================\n    {\n      orientation: 'vertical',\n      position: 'first',\n      className: 'rounded-b-none border-b-0',\n    },\n    {\n      orientation: 'vertical',\n      position: 'middle',\n      className: 'rounded-none border-b-0',\n    },\n    {\n      orientation: 'vertical',\n      position: 'last',\n      className: 'rounded-t-none',\n    },\n  ],\n  defaultVariants: {\n    orientation: 'horizontal',\n    position: 'only',\n  },\n});\n\n// =============================================================================\n// Separator Variants\n// =============================================================================\n\n/**\n * ButtonGroupSeparator variants\n * Orientation-aware visual divider between button groups\n */\nexport const buttonGroupSeparatorVariants = cva('bg-[var(--border)]', {\n  variants: {\n    orientation: {\n      horizontal: 'w-px h-6 mx-1',\n      vertical: 'h-px w-full my-1',\n    },\n  },\n  defaultVariants: {\n    orientation: 'horizontal',\n  },\n});\n","import { isValidElement, type ReactNode, type ComponentType } from 'react';\nimport type { ButtonPosition } from './ButtonGroup.types';\n\n/**\n * ButtonGroup Utility Functions\n *\n * Provides helper functions for:\n * - Child element detection (Button vs Separator vs other)\n * - Position calculation for border-radius styling\n *\n * @see plan.md Decision 6: Non-Button Child Handling\n */\n\n// =============================================================================\n// Child Detection Functions\n// =============================================================================\n\n/**\n * Checks if a React child is a Themis Button component\n * Uses displayName for reliable detection across module boundaries\n *\n * @param child - React child element to check\n * @returns true if the child is a Button component\n */\nexport const isButtonElement = (child: ReactNode): boolean => {\n  if (!isValidElement(child)) return false;\n\n  const componentType = child.type as ComponentType;\n  return componentType?.displayName === 'Button';\n};\n\n/**\n * Checks if a React child is a ButtonGroupSeparator component\n * Uses displayName for reliable detection across module boundaries\n *\n * @param child - React child element to check\n * @returns true if the child is a ButtonGroupSeparator component\n */\nexport const isSeparatorElement = (child: ReactNode): boolean => {\n  if (!isValidElement(child)) return false;\n\n  const componentType = child.type as ComponentType;\n  return componentType?.displayName === 'ButtonGroupSeparator';\n};\n\n// =============================================================================\n// Position Calculation\n// =============================================================================\n\n/**\n * Calculates the position of a button within a group\n * Used for applying position-aware border-radius styling\n *\n * @param index - Zero-based index of the button\n * @param total - Total number of buttons in the group\n * @returns Position enum: 'only' | 'first' | 'last' | 'middle'\n *\n * @example\n * getPosition(0, 1) // 'only' - single button\n * getPosition(0, 3) // 'first'\n * getPosition(1, 3) // 'middle'\n * getPosition(2, 3) // 'last'\n */\nexport const getPosition = (index: number, total: number): ButtonPosition => {\n  if (total === 1) return 'only';\n  if (index === 0) return 'first';\n  if (index === total - 1) return 'last';\n  return 'middle';\n};\n\n/**\n * Filters an array of React children to only include Button elements\n * Non-Button children (Separators, custom elements) are excluded\n *\n * @param children - Array of React children\n * @returns Array containing only Button elements\n */\nexport const filterButtonChildren = (children: ReactNode[]): ReactNode[] => {\n  return children.filter(isButtonElement);\n};\n\n/**\n * Gets the index of a button within the filtered button array\n * Used when the child array contains non-Button elements (Separators, etc.)\n *\n * @param child - The button element to find\n * @param buttonChildren - Array of only Button elements\n * @returns Index of the button, or -1 if not found\n */\nexport const getButtonIndex = (\n  child: ReactNode,\n  buttonChildren: ReactNode[]\n): number => {\n  return buttonChildren.indexOf(child);\n};\n","\"use client\";\n\n/**\n * ButtonGroup Component\n *\n * A container that groups related Themis Button components with:\n * - Consistent styling (connected borders, position-aware radii)\n * - Accessible keyboard navigation (React Aria Toolbar)\n * - WCAG 2.2 AAA compliance\n *\n * @see plan.md for architecture details\n * @see buttongroup-prd.md for requirements\n */\n\nimport { forwardRef, Children, type ReactElement } from 'react';\nimport { Toolbar } from 'react-aria-components';\nimport { cn } from '../../utils/cn';\nimport {\n  ButtonGroupContext,\n  ButtonGroupItemContext,\n  useButtonGroupContext,\n} from './ButtonGroupContext';\nimport { buttonGroupVariants, buttonGroupSeparatorVariants } from './ButtonGroup.variants';\nimport { isButtonElement, getPosition } from './ButtonGroup.utils';\nimport type { ButtonGroupProps, ButtonGroupSeparatorProps } from './ButtonGroup.types';\n\n// =============================================================================\n// ButtonGroup Component\n// =============================================================================\n\n/**\n * ButtonGroup - Groups related buttons with connected styling and keyboard navigation\n *\n * Uses React Aria's Toolbar for:\n * - Roving tabindex (single tab stop)\n * - Arrow key navigation\n * - Home/End key support\n * - RTL support\n *\n * @example\n * ```tsx\n * <ButtonGroup aria-label=\"Text formatting\">\n *   <Button variant=\"outline\">Bold</Button>\n *   <Button variant=\"outline\">Italic</Button>\n *   <Button variant=\"outline\">Underline</Button>\n * </ButtonGroup>\n * ```\n */\nconst ButtonGroup = forwardRef<HTMLDivElement, ButtonGroupProps>(\n  (\n    {\n      orientation = 'horizontal',\n      variant,\n      size,\n      isDisabled,\n      className,\n      children,\n      ...props\n    },\n    ref\n  ): ReactElement => {\n    // Convert children to array for enumeration\n    const childArray = Children.toArray(children);\n\n    // Filter to get only Button elements for position calculation\n    const buttonChildren = childArray.filter(isButtonElement);\n    const totalButtons = buttonChildren.length;\n\n    // Create context value for group-level props\n    const groupContextValue = {\n      orientation,\n      variant,\n      size,\n      isDisabled,\n    };\n\n    // Wrap each child with appropriate context\n    const wrappedChildren = childArray.map((child, index) => {\n      // If it's a Button, wrap with item context for position\n      if (isButtonElement(child)) {\n        const buttonIndex = buttonChildren.indexOf(child);\n        const position = getPosition(buttonIndex, totalButtons);\n\n        return (\n          <ButtonGroupItemContext.Provider\n            key={index}\n            value={{ position }}\n          >\n            {child}\n          </ButtonGroupItemContext.Provider>\n        );\n      }\n\n      // Non-Button children (Separators, etc.) pass through without item context\n      return child;\n    });\n\n    return (\n      <Toolbar\n        ref={ref}\n        orientation={orientation}\n        aria-label={props['aria-label']}\n        aria-labelledby={props['aria-labelledby']}\n        className={cn(buttonGroupVariants({ orientation }), className)}\n      >\n        <ButtonGroupContext.Provider value={groupContextValue}>\n          {wrappedChildren}\n        </ButtonGroupContext.Provider>\n      </Toolbar>\n    );\n  }\n);\n\nButtonGroup.displayName = 'ButtonGroup';\n\n// =============================================================================\n// ButtonGroupSeparator Component\n// =============================================================================\n\n/**\n * ButtonGroupSeparator - Visual divider between button groups\n *\n * Renders a decorative separator that:\n * - Adapts to orientation (vertical line for horizontal, horizontal for vertical)\n * - Is hidden from screen readers (aria-hidden)\n * - Is excluded from keyboard navigation\n *\n * @example\n * ```tsx\n * <ButtonGroup aria-label=\"Editor actions\">\n *   <Button>Undo</Button>\n *   <Button>Redo</Button>\n *   <ButtonGroupSeparator />\n *   <Button>Cut</Button>\n *   <Button>Copy</Button>\n * </ButtonGroup>\n * ```\n */\nconst ButtonGroupSeparator = forwardRef<HTMLDivElement, ButtonGroupSeparatorProps>(\n  ({ className, ...props }, ref): ReactElement => {\n    const groupContext = useButtonGroupContext();\n    const orientation = groupContext?.orientation ?? 'horizontal';\n\n    return (\n      <div\n        ref={ref}\n        role=\"separator\"\n        aria-hidden=\"true\"\n        className={cn(\n          buttonGroupSeparatorVariants({ orientation }),\n          className\n        )}\n        {...props}\n      />\n    );\n  }\n);\n\nButtonGroupSeparator.displayName = 'ButtonGroupSeparator';\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nexport { ButtonGroup, ButtonGroupSeparator };\n","import { z } from 'zod';\nimport type { ReactNode } from 'react';\n\n/**\n * ButtonGroup Component Types\n *\n * Defines Zod schemas and TypeScript types for the ButtonGroup component.\n * Uses a two-level context pattern:\n * - ButtonGroupContext: Group-level props (orientation, variant, size, isDisabled)\n * - ButtonGroupItemContext: Per-button position information\n *\n * @see plan.md for architecture details\n * @see constitution.md Principle II (Type Safety First)\n */\n\n// =============================================================================\n// Core Types\n// =============================================================================\n\n/**\n * Orientation of the button group\n */\nexport type ButtonGroupOrientation = 'horizontal' | 'vertical';\n\n/**\n * Position of a button within the group\n * Used for position-aware border-radius styling\n */\nexport type ButtonPosition = 'first' | 'middle' | 'last' | 'only';\n\n/**\n * Button variants (matches Themis Button variants, excluding 'link')\n * Link variant is excluded as it doesn't make sense in a grouped context\n */\nexport type ButtonGroupVariant =\n  | 'default'\n  | 'destructive'\n  | 'outline'\n  | 'secondary'\n  | 'ghost';\n\n/**\n * Button sizes (matches Themis Button sizes)\n */\nexport type ButtonGroupSize = 'sm' | 'default' | 'lg' | 'icon';\n\n// =============================================================================\n// Zod Schemas\n// =============================================================================\n\n/**\n * ButtonGroup props schema\n * Validates all props for the ButtonGroup container component\n */\nexport const ButtonGroupPropsSchema = z.object({\n  /** Orientation of the button group layout */\n  orientation: z\n    .enum(['horizontal', 'vertical'])\n    .optional()\n    .default('horizontal'),\n\n  /** Default variant for all child buttons (can be overridden per-button) */\n  variant: z\n    .enum(['default', 'destructive', 'outline', 'secondary', 'ghost'])\n    .optional(),\n\n  /** Default size for all child buttons (can be overridden per-button) */\n  size: z.enum(['sm', 'default', 'lg', 'icon']).optional(),\n\n  /** Disable all buttons in the group */\n  isDisabled: z.boolean().optional(),\n\n  /** Accessible label for the toolbar (recommended) */\n  'aria-label': z.string().optional(),\n\n  /** ID of element that labels the toolbar */\n  'aria-labelledby': z.string().optional(),\n\n  /** Additional CSS classes */\n  className: z.string().optional(),\n\n  /** Child elements (Buttons, Separators, etc.) */\n  children: z.custom<ReactNode>(),\n});\n\n/**\n * ButtonGroupSeparator props schema\n * Validates props for the visual separator between button groups\n */\nexport const ButtonGroupSeparatorPropsSchema = z.object({\n  /** Additional CSS classes */\n  className: z.string().optional(),\n  /** Test ID for testing */\n  'data-testid': z.string().optional(),\n});\n\n// =============================================================================\n// TypeScript Types (inferred from schemas)\n// =============================================================================\n\n/**\n * Props for the ButtonGroup container component\n */\nexport type ButtonGroupProps = z.infer<typeof ButtonGroupPropsSchema>;\n\n/**\n * Props for the ButtonGroupSeparator component\n */\nexport type ButtonGroupSeparatorProps = z.infer<\n  typeof ButtonGroupSeparatorPropsSchema\n>;\n\n// =============================================================================\n// Context Types\n// =============================================================================\n\n/**\n * Group-level context value\n * Provides inherited props to all child buttons\n */\nexport interface ButtonGroupContextValue {\n  /** Orientation of the group (affects keyboard navigation and styling) */\n  orientation: ButtonGroupOrientation;\n  /** Default variant for buttons (can be overridden) */\n  variant?: ButtonGroupVariant;\n  /** Default size for buttons (can be overridden) */\n  size?: ButtonGroupSize;\n  /** Whether all buttons in the group are disabled */\n  isDisabled?: boolean;\n}\n\n/**\n * Item-level context value\n * Provides position information to each button for border-radius styling\n */\nexport interface ButtonGroupItemContextValue {\n  /** Position of this button in the group */\n  position: ButtonPosition;\n}\n"]}
+{"version":3,"sources":["../../../src/utils/cn.ts","../../../src/elements/ButtonGroup/ButtonGroupContext.tsx","../../../src/elements/ButtonGroup/ButtonGroup.variants.ts","../../../src/elements/ButtonGroup/ButtonGroup.utils.ts","../../../src/elements/ButtonGroup/ButtonGroup.tsx","../../../src/elements/ButtonGroup/ButtonGroup.types.ts"],"names":["cn","inputs","twMerge","clsx","ButtonGroupContext","createContext","useButtonGroupContext","useContext","ButtonGroupItemContext","useButtonGroupItemContext","buttonGroupVariants","cva","buttonGroupItemVariants","buttonGroupSeparatorVariants","isButtonElement","child","isValidElement","isSeparatorElement","getPosition","index","total","filterButtonChildren","children","getButtonIndex","buttonChildren","ButtonGroup","forwardRef","orientation","variant","size","isDisabled","className","props","ref","childArray","Children","totalButtons","groupContextValue","wrappedChildren","buttonIndex","position","jsx","Toolbar","ButtonGroupSeparator","ButtonGroupPropsSchema","z","ButtonGroupSeparatorPropsSchema"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Class Name Utility\n * Merges Tailwind CSS classes with conflict resolution\n *\n * Combines clsx for conditional classes and tailwind-merge for deduplication\n *\n * @example\n * cn('px-2 py-1', 'px-4') // => 'py-1 px-4' (px-4 overrides px-2)\n * cn('text-red-500', condition && 'text-blue-500') // => conditional application\n */\n\nimport { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { createContext, useContext } from 'react';\nimport type {\n  ButtonGroupContextValue,\n  ButtonGroupItemContextValue,\n} from './ButtonGroup.types';\n\n/**\n * ButtonGroup Context System (Two-Level)\n *\n * Provides a two-level context pattern for ButtonGroup:\n *\n * 1. ButtonGroupContext (group-level):\n *    - Provides: orientation, variant, size, isDisabled\n *    - Consumed by: Button (for prop inheritance), Separator (for orientation)\n *\n * 2. ButtonGroupItemContext (item-level):\n *    - Provides: position ('first' | 'middle' | 'last' | 'only')\n *    - Consumed by: Button (for border-radius styling)\n *\n * Both contexts return null when not in a provider, allowing Button\n * to work standalone without any group context.\n *\n * @see plan.md for architecture details\n * @see ButtonGroup.tsx for Provider implementation\n */\n\n// =============================================================================\n// Group-Level Context\n// =============================================================================\n\n/**\n * Context for group-level props (orientation, variant, size, isDisabled)\n * Default value is null to indicate \"not in a group\"\n */\nconst ButtonGroupContext = createContext<ButtonGroupContextValue | null>(null);\n\nButtonGroupContext.displayName = 'ButtonGroupContext';\n\n/**\n * Hook to access group-level context\n * @returns ButtonGroupContextValue if inside a ButtonGroup, null otherwise\n */\nexport function useButtonGroupContext(): ButtonGroupContextValue | null {\n  return useContext(ButtonGroupContext);\n}\n\n// =============================================================================\n// Item-Level Context\n// =============================================================================\n\n/**\n * Context for per-button position information\n * Default value is null to indicate \"not wrapped with position context\"\n */\nconst ButtonGroupItemContext =\n  createContext<ButtonGroupItemContextValue | null>(null);\n\nButtonGroupItemContext.displayName = 'ButtonGroupItemContext';\n\n/**\n * Hook to access item-level context (position)\n * @returns ButtonGroupItemContextValue if wrapped with position context, null otherwise\n */\nexport function useButtonGroupItemContext(): ButtonGroupItemContextValue | null {\n  return useContext(ButtonGroupItemContext);\n}\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nexport { ButtonGroupContext, ButtonGroupItemContext };\n","import { cva } from 'class-variance-authority';\n\n/**\n * ButtonGroup CVA Variants\n *\n * Defines Class Variance Authority (CVA) variants for:\n * - ButtonGroup container (orientation-based layout)\n * - ButtonGroupItem (position-based border-radius)\n * - ButtonGroupSeparator (orientation-based styling)\n *\n * @see plan.md Phase 1: Design & Contracts - CVA Variants\n * @see constitution.md Principle V (Component Quality Standards)\n */\n\n// =============================================================================\n// Container Variants\n// =============================================================================\n\n/**\n * ButtonGroup container variants\n * Controls the layout direction based on orientation\n * Uses gap-0 to ensure buttons are connected (share borders)\n */\nexport const buttonGroupVariants = cva('inline-flex items-center gap-0', {\n  variants: {\n    orientation: {\n      horizontal: 'flex-row',\n      vertical: 'flex-col w-full',\n    },\n  },\n  defaultVariants: {\n    orientation: 'horizontal',\n  },\n});\n\n// =============================================================================\n// Item Position Variants\n// =============================================================================\n\n/**\n * ButtonGroupItem position variants\n * Applied to Button's visual layer (Layer 2) for position-aware border-radius\n *\n * Compound variants handle both orientation and position combinations:\n * - Horizontal: left/right borders and radii\n * - Vertical: top/bottom borders and radii\n */\nexport const buttonGroupItemVariants = cva('', {\n  variants: {\n    orientation: {\n      // min-w-[44px] ensures visual layer fills touch target width (for icon buttons)\n      horizontal: 'min-w-[44px]',\n      // flex (overrides inline-flex) + min-h-[44px] makes visual layer fill touch target,\n      // eliminating gaps between stacked buttons in vertical orientation\n      vertical: 'flex min-h-[44px]',\n    },\n    position: {\n      first: '',\n      middle: '',\n      last: '',\n      only: '', // Single button - no modifications needed\n    },\n  },\n  compoundVariants: [\n    // ==========================================================================\n    // Horizontal Orientation\n    // ==========================================================================\n    {\n      orientation: 'horizontal',\n      position: 'first',\n      className: 'rounded-r-none border-r-0',\n    },\n    {\n      orientation: 'horizontal',\n      position: 'middle',\n      className: 'rounded-none border-r-0',\n    },\n    {\n      orientation: 'horizontal',\n      position: 'last',\n      className: 'rounded-l-none',\n    },\n    // ==========================================================================\n    // Vertical Orientation\n    // Note: w-full is handled by Button's effectiveFullWidth for both layers\n    // ==========================================================================\n    {\n      orientation: 'vertical',\n      position: 'first',\n      className: 'rounded-b-none border-b-0',\n    },\n    {\n      orientation: 'vertical',\n      position: 'middle',\n      className: 'rounded-none border-b-0',\n    },\n    {\n      orientation: 'vertical',\n      position: 'last',\n      className: 'rounded-t-none',\n    },\n  ],\n  defaultVariants: {\n    orientation: 'horizontal',\n    position: 'only',\n  },\n});\n\n// =============================================================================\n// Separator Variants\n// =============================================================================\n\n/**\n * ButtonGroupSeparator variants\n * Orientation-aware visual divider between button groups\n */\nexport const buttonGroupSeparatorVariants = cva('bg-[var(--border)]', {\n  variants: {\n    orientation: {\n      horizontal: 'w-px h-6 mx-1',\n      vertical: 'h-px w-full my-1',\n    },\n  },\n  defaultVariants: {\n    orientation: 'horizontal',\n  },\n});\n","import { isValidElement, type ReactNode, type ComponentType } from 'react';\nimport type { ButtonPosition } from './ButtonGroup.types';\n\n/**\n * ButtonGroup Utility Functions\n *\n * Provides helper functions for:\n * - Child element detection (Button vs Separator vs other)\n * - Position calculation for border-radius styling\n *\n * @see plan.md Decision 6: Non-Button Child Handling\n */\n\n// =============================================================================\n// Child Detection Functions\n// =============================================================================\n\n/**\n * Checks if a React child is a Themis Button component\n * Uses displayName for reliable detection across module boundaries\n *\n * @param child - React child element to check\n * @returns true if the child is a Button component\n */\nexport const isButtonElement = (child: ReactNode): boolean => {\n  if (!isValidElement(child)) return false;\n\n  const componentType = child.type as ComponentType;\n  return componentType?.displayName === 'Button';\n};\n\n/**\n * Checks if a React child is a ButtonGroupSeparator component\n * Uses displayName for reliable detection across module boundaries\n *\n * @param child - React child element to check\n * @returns true if the child is a ButtonGroupSeparator component\n */\nexport const isSeparatorElement = (child: ReactNode): boolean => {\n  if (!isValidElement(child)) return false;\n\n  const componentType = child.type as ComponentType;\n  return componentType?.displayName === 'ButtonGroupSeparator';\n};\n\n// =============================================================================\n// Position Calculation\n// =============================================================================\n\n/**\n * Calculates the position of a button within a group\n * Used for applying position-aware border-radius styling\n *\n * @param index - Zero-based index of the button\n * @param total - Total number of buttons in the group\n * @returns Position enum: 'only' | 'first' | 'last' | 'middle'\n *\n * @example\n * getPosition(0, 1) // 'only' - single button\n * getPosition(0, 3) // 'first'\n * getPosition(1, 3) // 'middle'\n * getPosition(2, 3) // 'last'\n */\nexport const getPosition = (index: number, total: number): ButtonPosition => {\n  if (total === 1) return 'only';\n  if (index === 0) return 'first';\n  if (index === total - 1) return 'last';\n  return 'middle';\n};\n\n/**\n * Filters an array of React children to only include Button elements\n * Non-Button children (Separators, custom elements) are excluded\n *\n * @param children - Array of React children\n * @returns Array containing only Button elements\n */\nexport const filterButtonChildren = (children: ReactNode[]): ReactNode[] => {\n  return children.filter(isButtonElement);\n};\n\n/**\n * Gets the index of a button within the filtered button array\n * Used when the child array contains non-Button elements (Separators, etc.)\n *\n * @param child - The button element to find\n * @param buttonChildren - Array of only Button elements\n * @returns Index of the button, or -1 if not found\n */\nexport const getButtonIndex = (\n  child: ReactNode,\n  buttonChildren: ReactNode[]\n): number => {\n  return buttonChildren.indexOf(child);\n};\n","\"use client\";\n\n/**\n * ButtonGroup Component\n *\n * A container that groups related Themis Button components with:\n * - Consistent styling (connected borders, position-aware radii)\n * - Accessible keyboard navigation (React Aria Toolbar)\n * - WCAG 2.2 AAA compliance\n *\n * @see plan.md for architecture details\n * @see buttongroup-prd.md for requirements\n */\n\nimport { forwardRef, Children, type ReactElement } from 'react';\nimport { Toolbar } from 'react-aria-components';\nimport { cn } from '../../utils/cn';\nimport {\n  ButtonGroupContext,\n  ButtonGroupItemContext,\n  useButtonGroupContext,\n} from './ButtonGroupContext';\nimport { buttonGroupVariants, buttonGroupSeparatorVariants } from './ButtonGroup.variants';\nimport { isButtonElement, getPosition } from './ButtonGroup.utils';\nimport type { ButtonGroupProps, ButtonGroupSeparatorProps } from './ButtonGroup.types';\n\n// =============================================================================\n// ButtonGroup Component\n// =============================================================================\n\n/**\n * ButtonGroup - Groups related buttons with connected styling and keyboard navigation\n *\n * Uses React Aria's Toolbar for:\n * - Roving tabindex (single tab stop)\n * - Arrow key navigation\n * - Home/End key support\n * - RTL support\n *\n * @example\n * ```tsx\n * <ButtonGroup aria-label=\"Text formatting\">\n *   <Button variant=\"outline\">Bold</Button>\n *   <Button variant=\"outline\">Italic</Button>\n *   <Button variant=\"outline\">Underline</Button>\n * </ButtonGroup>\n * ```\n */\nconst ButtonGroup = forwardRef<HTMLDivElement, ButtonGroupProps>(\n  (\n    {\n      orientation = 'horizontal',\n      variant,\n      size,\n      isDisabled,\n      className,\n      children,\n      ...props\n    },\n    ref\n  ): ReactElement => {\n    // Convert children to array for enumeration\n    const childArray = Children.toArray(children);\n\n    // Filter to get only Button elements for position calculation\n    const buttonChildren = childArray.filter(isButtonElement);\n    const totalButtons = buttonChildren.length;\n\n    // Create context value for group-level props\n    const groupContextValue = {\n      orientation,\n      variant,\n      size,\n      isDisabled,\n    };\n\n    // Wrap each child with appropriate context\n    const wrappedChildren = childArray.map((child, index) => {\n      // If it's a Button, wrap with item context for position\n      if (isButtonElement(child)) {\n        const buttonIndex = buttonChildren.indexOf(child);\n        const position = getPosition(buttonIndex, totalButtons);\n\n        return (\n          <ButtonGroupItemContext.Provider\n            key={index}\n            value={{ position }}\n          >\n            {child}\n          </ButtonGroupItemContext.Provider>\n        );\n      }\n\n      // Non-Button children (Separators, etc.) pass through without item context\n      return child;\n    });\n\n    return (\n      <Toolbar\n        ref={ref}\n        orientation={orientation}\n        aria-label={props['aria-label']}\n        aria-labelledby={props['aria-labelledby']}\n        className={cn(buttonGroupVariants({ orientation }), className)}\n      >\n        <ButtonGroupContext.Provider value={groupContextValue}>\n          {wrappedChildren}\n        </ButtonGroupContext.Provider>\n      </Toolbar>\n    );\n  }\n);\n\nButtonGroup.displayName = 'ButtonGroup';\n\n// =============================================================================\n// ButtonGroupSeparator Component\n// =============================================================================\n\n/**\n * ButtonGroupSeparator - Visual divider between button groups\n *\n * Renders a decorative separator that:\n * - Adapts to orientation (vertical line for horizontal, horizontal for vertical)\n * - Is hidden from screen readers (aria-hidden)\n * - Is excluded from keyboard navigation\n *\n * @example\n * ```tsx\n * <ButtonGroup aria-label=\"Editor actions\">\n *   <Button>Undo</Button>\n *   <Button>Redo</Button>\n *   <ButtonGroupSeparator />\n *   <Button>Cut</Button>\n *   <Button>Copy</Button>\n * </ButtonGroup>\n * ```\n */\nconst ButtonGroupSeparator = forwardRef<HTMLDivElement, ButtonGroupSeparatorProps>(\n  ({ className, ...props }, ref): ReactElement => {\n    const groupContext = useButtonGroupContext();\n    const orientation = groupContext?.orientation ?? 'horizontal';\n\n    return (\n      <div\n        ref={ref}\n        role=\"separator\"\n        aria-hidden=\"true\"\n        className={cn(\n          buttonGroupSeparatorVariants({ orientation }),\n          className\n        )}\n        {...props}\n      />\n    );\n  }\n);\n\nButtonGroupSeparator.displayName = 'ButtonGroupSeparator';\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nexport { ButtonGroup, ButtonGroupSeparator };\n","import { z } from 'zod';\nimport type { ReactNode } from 'react';\n\n/**\n * ButtonGroup Component Types\n *\n * Defines Zod schemas and TypeScript types for the ButtonGroup component.\n * Uses a two-level context pattern:\n * - ButtonGroupContext: Group-level props (orientation, variant, size, isDisabled)\n * - ButtonGroupItemContext: Per-button position information\n *\n * @see plan.md for architecture details\n * @see constitution.md Principle II (Type Safety First)\n */\n\n// =============================================================================\n// Core Types\n// =============================================================================\n\n/**\n * Orientation of the button group\n */\nexport type ButtonGroupOrientation = 'horizontal' | 'vertical';\n\n/**\n * Position of a button within the group\n * Used for position-aware border-radius styling\n */\nexport type ButtonPosition = 'first' | 'middle' | 'last' | 'only';\n\n/**\n * Button variants (matches Themis Button variants, excluding 'link')\n * Link variant is excluded as it doesn't make sense in a grouped context\n */\nexport type ButtonGroupVariant =\n  | 'default'\n  | 'destructive'\n  | 'outline'\n  | 'secondary'\n  | 'ghost';\n\n/**\n * Button sizes (matches Themis Button sizes)\n */\nexport type ButtonGroupSize = 'sm' | 'default' | 'lg' | 'icon';\n\n// =============================================================================\n// Zod Schemas\n// =============================================================================\n\n/**\n * ButtonGroup props schema\n * Validates all props for the ButtonGroup container component\n */\nexport const ButtonGroupPropsSchema = z.object({\n  /** Orientation of the button group layout */\n  orientation: z\n    .enum(['horizontal', 'vertical'])\n    .optional()\n    .default('horizontal'),\n\n  /** Default variant for all child buttons (can be overridden per-button) */\n  variant: z\n    .enum(['default', 'destructive', 'outline', 'secondary', 'ghost'])\n    .optional(),\n\n  /** Default size for all child buttons (can be overridden per-button) */\n  size: z.enum(['sm', 'default', 'lg', 'icon']).optional(),\n\n  /** Disable all buttons in the group */\n  isDisabled: z.boolean().optional(),\n\n  /** Accessible label for the toolbar (recommended) */\n  'aria-label': z.string().optional(),\n\n  /** ID of element that labels the toolbar */\n  'aria-labelledby': z.string().optional(),\n\n  /** Additional CSS classes */\n  className: z.string().optional(),\n\n  /** Child elements (Buttons, Separators, etc.) */\n  children: z.custom<ReactNode>(),\n});\n\n/**\n * ButtonGroupSeparator props schema\n * Validates props for the visual separator between button groups\n */\nexport const ButtonGroupSeparatorPropsSchema = z.object({\n  /** Additional CSS classes */\n  className: z.string().optional(),\n  /** Test ID for testing */\n  'data-testid': z.string().optional(),\n});\n\n// =============================================================================\n// TypeScript Types (inferred from schemas)\n// =============================================================================\n\n/**\n * Props for the ButtonGroup container component\n */\nexport type ButtonGroupProps = z.infer<typeof ButtonGroupPropsSchema>;\n\n/**\n * Props for the ButtonGroupSeparator component\n */\nexport type ButtonGroupSeparatorProps = z.infer<\n  typeof ButtonGroupSeparatorPropsSchema\n>;\n\n// =============================================================================\n// Context Types\n// =============================================================================\n\n/**\n * Group-level context value\n * Provides inherited props to all child buttons\n */\nexport interface ButtonGroupContextValue {\n  /** Orientation of the group (affects keyboard navigation and styling) */\n  orientation: ButtonGroupOrientation;\n  /** Default variant for buttons (can be overridden) */\n  variant?: ButtonGroupVariant;\n  /** Default size for buttons (can be overridden) */\n  size?: ButtonGroupSize;\n  /** Whether all buttons in the group are disabled */\n  isDisabled?: boolean;\n}\n\n/**\n * Item-level context value\n * Provides position information to each button for border-radius styling\n */\nexport interface ButtonGroupItemContextValue {\n  /** Position of this button in the group */\n  position: ButtonPosition;\n}\n"]}

package/dist/elements/ButtonGroup/index.mjs

@@ -1,224 +1,3 @@
 "use client";
-import { createContext, forwardRef, Children, isValidElement, useContext } from 'react';
-import { Toolbar } from 'react-aria-components';
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-import { cva } from 'class-variance-authority';
-import { jsx } from 'react/jsx-runtime';
-import { z } from 'zod';
-
-// src/elements/ButtonGroup/ButtonGroup.tsx
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-var ButtonGroupContext = createContext(null);
-ButtonGroupContext.displayName = "ButtonGroupContext";
-function useButtonGroupContext() {
-  return useContext(ButtonGroupContext);
-}
-var ButtonGroupItemContext = createContext(null);
-ButtonGroupItemContext.displayName = "ButtonGroupItemContext";
-function useButtonGroupItemContext() {
-  return useContext(ButtonGroupItemContext);
-}
-var buttonGroupVariants = cva("inline-flex items-center gap-0", {
-  variants: {
-    orientation: {
-      horizontal: "flex-row",
-      vertical: "flex-col w-full"
-    }
-  },
-  defaultVariants: {
-    orientation: "horizontal"
-  }
-});
-var buttonGroupItemVariants = cva("", {
-  variants: {
-    orientation: {
-      // min-w-[44px] ensures visual layer fills touch target width (for icon buttons)
-      horizontal: "min-w-[44px]",
-      // flex (overrides inline-flex) + min-h-[44px] makes visual layer fill touch target,
-      // eliminating gaps between stacked buttons in vertical orientation
-      vertical: "flex min-h-[44px]"
-    },
-    position: {
-      first: "",
-      middle: "",
-      last: "",
-      only: ""
-      // Single button - no modifications needed
-    }
-  },
-  compoundVariants: [
-    // ==========================================================================
-    // Horizontal Orientation
-    // ==========================================================================
-    {
-      orientation: "horizontal",
-      position: "first",
-      className: "rounded-r-none border-r-0"
-    },
-    {
-      orientation: "horizontal",
-      position: "middle",
-      className: "rounded-none border-r-0"
-    },
-    {
-      orientation: "horizontal",
-      position: "last",
-      className: "rounded-l-none"
-    },
-    // ==========================================================================
-    // Vertical Orientation
-    // Note: w-full is handled by Button's effectiveFullWidth for both layers
-    // ==========================================================================
-    {
-      orientation: "vertical",
-      position: "first",
-      className: "rounded-b-none border-b-0"
-    },
-    {
-      orientation: "vertical",
-      position: "middle",
-      className: "rounded-none border-b-0"
-    },
-    {
-      orientation: "vertical",
-      position: "last",
-      className: "rounded-t-none"
-    }
-  ],
-  defaultVariants: {
-    orientation: "horizontal",
-    position: "only"
-  }
-});
-var buttonGroupSeparatorVariants = cva("bg-[var(--border)]", {
-  variants: {
-    orientation: {
-      horizontal: "w-px h-6 mx-1",
-      vertical: "h-px w-full my-1"
-    }
-  },
-  defaultVariants: {
-    orientation: "horizontal"
-  }
-});
-var isButtonElement = (child) => {
-  if (!isValidElement(child)) return false;
-  const componentType = child.type;
-  return componentType?.displayName === "Button";
-};
-var isSeparatorElement = (child) => {
-  if (!isValidElement(child)) return false;
-  const componentType = child.type;
-  return componentType?.displayName === "ButtonGroupSeparator";
-};
-var getPosition = (index, total) => {
-  if (total === 1) return "only";
-  if (index === 0) return "first";
-  if (index === total - 1) return "last";
-  return "middle";
-};
-var filterButtonChildren = (children) => {
-  return children.filter(isButtonElement);
-};
-var getButtonIndex = (child, buttonChildren) => {
-  return buttonChildren.indexOf(child);
-};
-var ButtonGroup = forwardRef(
-  ({
-    orientation = "horizontal",
-    variant,
-    size,
-    isDisabled,
-    className,
-    children,
-    ...props
-  }, ref) => {
-    const childArray = Children.toArray(children);
-    const buttonChildren = childArray.filter(isButtonElement);
-    const totalButtons = buttonChildren.length;
-    const groupContextValue = {
-      orientation,
-      variant,
-      size,
-      isDisabled
-    };
-    const wrappedChildren = childArray.map((child, index) => {
-      if (isButtonElement(child)) {
-        const buttonIndex = buttonChildren.indexOf(child);
-        const position = getPosition(buttonIndex, totalButtons);
-        return /* @__PURE__ */ jsx(
-          ButtonGroupItemContext.Provider,
-          {
-            value: { position },
-            children: child
-          },
-          index
-        );
-      }
-      return child;
-    });
-    return /* @__PURE__ */ jsx(
-      Toolbar,
-      {
-        ref,
-        orientation,
-        "aria-label": props["aria-label"],
-        "aria-labelledby": props["aria-labelledby"],
-        className: cn(buttonGroupVariants({ orientation }), className),
-        children: /* @__PURE__ */ jsx(ButtonGroupContext.Provider, { value: groupContextValue, children: wrappedChildren })
-      }
-    );
-  }
-);
-ButtonGroup.displayName = "ButtonGroup";
-var ButtonGroupSeparator = forwardRef(
-  ({ className, ...props }, ref) => {
-    const groupContext = useButtonGroupContext();
-    const orientation = groupContext?.orientation ?? "horizontal";
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        role: "separator",
-        "aria-hidden": "true",
-        className: cn(
-          buttonGroupSeparatorVariants({ orientation }),
-          className
-        ),
-        ...props
-      }
-    );
-  }
-);
-ButtonGroupSeparator.displayName = "ButtonGroupSeparator";
-var ButtonGroupPropsSchema = z.object({
-  /** Orientation of the button group layout */
-  orientation: z.enum(["horizontal", "vertical"]).optional().default("horizontal"),
-  /** Default variant for all child buttons (can be overridden per-button) */
-  variant: z.enum(["default", "destructive", "outline", "secondary", "ghost"]).optional(),
-  /** Default size for all child buttons (can be overridden per-button) */
-  size: z.enum(["sm", "default", "lg", "icon"]).optional(),
-  /** Disable all buttons in the group */
-  isDisabled: z.boolean().optional(),
-  /** Accessible label for the toolbar (recommended) */
-  "aria-label": z.string().optional(),
-  /** ID of element that labels the toolbar */
-  "aria-labelledby": z.string().optional(),
-  /** Additional CSS classes */
-  className: z.string().optional(),
-  /** Child elements (Buttons, Separators, etc.) */
-  children: z.custom()
-});
-var ButtonGroupSeparatorPropsSchema = z.object({
-  /** Additional CSS classes */
-  className: z.string().optional(),
-  /** Test ID for testing */
-  "data-testid": z.string().optional()
-});
-
-export { ButtonGroup, ButtonGroupPropsSchema, ButtonGroupSeparator, ButtonGroupSeparatorPropsSchema, buttonGroupItemVariants, buttonGroupSeparatorVariants, buttonGroupVariants, filterButtonChildren, getButtonIndex, getPosition, isButtonElement, isSeparatorElement, useButtonGroupContext, useButtonGroupItemContext };
-//# sourceMappingURL=index.mjs.map
+import {createContext,forwardRef,Children,isValidElement,useContext}from'react';import {Toolbar}from'react-aria-components';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {cva}from'class-variance-authority';import {jsx}from'react/jsx-runtime';import {z}from'zod';function s(...t){return twMerge(clsx(t))}var a=createContext(null);a.displayName="ButtonGroupContext";function m(){return useContext(a)}var u=createContext(null);u.displayName="ButtonGroupItemContext";function M(){return useContext(u)}var d=cva("inline-flex items-center gap-0",{variants:{orientation:{horizontal:"flex-row",vertical:"flex-col w-full"}},defaultVariants:{orientation:"horizontal"}}),A=cva("",{variants:{orientation:{horizontal:"min-w-[44px]",vertical:"flex min-h-[44px]"},position:{first:"",middle:"",last:"",only:""}},compoundVariants:[{orientation:"horizontal",position:"first",className:"rounded-r-none border-r-0"},{orientation:"horizontal",position:"middle",className:"rounded-none border-r-0"},{orientation:"horizontal",position:"last",className:"rounded-l-none"},{orientation:"vertical",position:"first",className:"rounded-b-none border-b-0"},{orientation:"vertical",position:"middle",className:"rounded-none border-b-0"},{orientation:"vertical",position:"last",className:"rounded-t-none"}],defaultVariants:{orientation:"horizontal",position:"only"}}),B=cva("bg-[var(--border)]",{variants:{orientation:{horizontal:"w-px h-6 mx-1",vertical:"h-px w-full my-1"}},defaultVariants:{orientation:"horizontal"}});var r=t=>isValidElement(t)?t.type?.displayName==="Button":false,H=t=>isValidElement(t)?t.type?.displayName==="ButtonGroupSeparator":false,x=(t,e)=>e===1?"only":t===0?"first":t===e-1?"last":"middle",L=t=>t.filter(r),j=(t,e)=>e.indexOf(t);var P=forwardRef(({orientation:t="horizontal",variant:e,size:p,isDisabled:f,className:l,children:S,...G},g)=>{let y=Children.toArray(S),b=y.filter(r),z=b.length,I={orientation:t,variant:e,size:p,isDisabled:f},R=y.map((n,E)=>{if(r(n)){let T=b.indexOf(n),w=x(T,z);return jsx(u.Provider,{value:{position:w},children:n},E)}return n});return jsx(Toolbar,{ref:g,orientation:t,"aria-label":G["aria-label"],"aria-labelledby":G["aria-labelledby"],className:s(d({orientation:t}),l),children:jsx(a.Provider,{value:I,children:R})})});P.displayName="ButtonGroup";var N=forwardRef(({className:t,...e},p)=>{let l=m()?.orientation??"horizontal";return jsx("div",{ref:p,role:"separator","aria-hidden":"true",className:s(B({orientation:l}),t),...e})});N.displayName="ButtonGroupSeparator";var F=z.object({orientation:z.enum(["horizontal","vertical"]).optional().default("horizontal"),variant:z.enum(["default","destructive","outline","secondary","ghost"]).optional(),size:z.enum(["sm","default","lg","icon"]).optional(),isDisabled:z.boolean().optional(),"aria-label":z.string().optional(),"aria-labelledby":z.string().optional(),className:z.string().optional(),children:z.custom()}),J=z.object({className:z.string().optional(),"data-testid":z.string().optional()});export{P as ButtonGroup,F as ButtonGroupPropsSchema,N as ButtonGroupSeparator,J as ButtonGroupSeparatorPropsSchema,A as buttonGroupItemVariants,B as buttonGroupSeparatorVariants,d as buttonGroupVariants,L as filterButtonChildren,j as getButtonIndex,x as getPosition,r as isButtonElement,H as isSeparatorElement,m as useButtonGroupContext,M as useButtonGroupItemContext};//# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map