@tribepad/themis 1.0.0 → 1.0.2

package/dist/elements/Button/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.mjs"}
+{"version":3,"sources":["../../../src/utils/cn.ts","../../../src/elements/Button/Button.styles.ts","../../../src/styles/interaction-states.ts","../../../src/elements/ButtonGroup/ButtonGroupContext.tsx","../../../src/elements/ButtonGroup/ButtonGroup.variants.ts","../../../src/elements/Button/Button.tsx"],"names":["cn","inputs","twMerge","clsx","buttonOuterVariants","cva","buttonVisualVariants","buttonVariants","PRESSED_STYLES","HOVER_STYLES","HIGH_CONTRAST_HOVER","HIGH_CONTRAST_PRESSED","ButtonGroupContext","createContext","useButtonGroupContext","useContext","ButtonGroupItemContext","useButtonGroupItemContext","buttonGroupItemVariants","Button","memo","forwardRef","className","buttonVisualClassName","variant","size","visualSize","fullWidth","loading","loadingText","shortcut","children","isDisabled","paywall","paywallRedirect","paywallDescription","onPress","props","ref","paywallDescriptionId","useId","groupContext","itemContext","effectiveVariant","effectiveSize","effectiveIsDisabled","isInVerticalGroup","effectiveFullWidth","positionClassName","effectiveVisualSize","jsx","AriaButton","e","renderProps","jsxs","Fragment","Loader2","Zap"],"mappings":"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","file":"index.mjs","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","import { cva } from 'class-variance-authority';\n\n/**\n * Layer 1: Transparent outer touch target (44x44px minimum)\n * Handles WCAG 2.2 AAA touch target requirement\n * Always transparent, centers the visual button inside\n * IMPORTANT: Focus ring stays on Layer 1 for AAA compliance (2.4.13)\n *\n * In vertical ButtonGroups, uses items-stretch so the visual layer (Layer 2)\n * can fill the full touch target height, eliminating gaps between buttons.\n */\nexport const buttonOuterVariants = cva(\n  \"inline-flex justify-center min-h-[44px] min-w-[44px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50\",\n  {\n    variants: {\n      fullWidth: {\n        true: \"w-full\",\n        false: \"\",\n      },\n      inVerticalGroup: {\n        true: \"items-stretch\",\n        false: \"items-center\",\n      },\n    },\n    defaultVariants: {\n      fullWidth: false,\n      inVerticalGroup: false,\n    },\n  }\n);\n\n/**\n * Layer 2: Visual button appearance (adjustable size)\n * Provides the visual appearance with configurable size\n * Can be smaller than touch target for use cases like carousel dots\n * NOTE: NO focus-visible styles here - focus ring is on Layer 1\n */\nexport const buttonVisualVariants = cva(\n  \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 relative cursor-pointer\",\n  {\n    variants: {\n      variant: {\n        default:\n          \"bg-[var(--primary-action)] text-[var(--primary-action-foreground)] shadow-md hover:bg-[var(--primary-action-hover)] data-[pressed]:bg-[var(--primary-action)]/80\",\n        destructive:\n          \"bg-[var(--destructive-background)] text-[var(--destructive-foreground)] shadow-md hover:bg-[var(--destructive-background)]/90 data-[pressed]:bg-[var(--destructive-background)]/80\",\n        outline:\n          \"border border-[var(--input-border)] bg-[var(--page-background)] hover:bg-[var(--input-border)] data-[pressed]:bg-[var(--input-border)]\",\n        secondary:\n          \"bg-[var(--secondary)] text-[var(--secondary-foreground)] shadow-md hover:bg-[var(--secondary)]/80 data-[pressed]:bg-[var(--secondary)]/70\",\n        ghost:\n          \"hover:bg-[var(--accent)] hover:text-[var(--accent-foreground)] data-[pressed]:bg-[var(--accent)]\",\n        link: \"text-[var(--text-link)] underline-offset-4 hover:underline data-[pressed]:text-[var(--text-link-hover)]\",\n      },\n      fullWidth: {\n        true: \"w-full\",\n        false: \"\",\n      },\n      visualSize: {\n        default: \"h-10 px-4 py-2\",\n        sm: \"h-9 rounded-md px-3 text-xs\",\n        lg: \"h-11 rounded-md px-8\",\n        icon: \"h-10 w-10\",\n        dot: \"h-5 w-5 rounded-full p-0 min-h-0 min-w-0\",\n      },\n      paywall: {\n        true: \"!bg-[var(--paywall)] !text-[var(--paywall-foreground)] !shadow-md hover:!bg-[var(--paywall)]/90 !cursor-not-allowed !border-transparent\",\n        false: \"\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      visualSize: \"default\",\n      paywall: false,\n    },\n  }\n);\n\n/**\n * @deprecated Use buttonVisualVariants instead. This alias is kept for backward compatibility.\n */\nexport const buttonVariants = buttonVisualVariants;\n","/**\n * Global Interaction State Styles\n *\n * Consistent interaction patterns across all Themis components.\n * These styles ensure WCAG 2.2 AAA compliance and predictable UX.\n *\n * @see spec.md FR-010 (Visible focus ring for keyboard navigation)\n * @see spec.md FR-031 (Pressed state feedback)\n * @see spec.md FR-012 (High contrast mode support)\n * @see constitution.md Principle IV (Accessibility First)\n */\n\n/**\n * Focus state styles (FR-010)\n * Visible focus ring for keyboard navigation - WCAG 2.2 Level AAA\n *\n * Components can override by extending these styles:\n * @example\n * cn(FOCUS_STYLES, \"ring-4\") // Increases ring width to 4px\n */\nexport const FOCUS_STYLES = \"data-[focus-visible]:ring-2 data-[focus-visible]:ring-[var(--themis-ring)] data-[focus-visible]:ring-offset-2\";\n\n/**\n * Pressed/Active state styles (FR-031)\n * Visual feedback for press interactions\n *\n * Components can override the scale amount:\n * @example\n * cn(PRESSED_STYLES_BASE, \"data-[pressed]:scale-[0.95]\") // More pronounced scale\n */\nexport const PRESSED_STYLES = \"data-[pressed]:scale-[0.97]\";\n\n/**\n * Base pressed styles without scale (for components that need different feedback)\n */\nexport const PRESSED_STYLES_BASE = \"data-[pressed]:transition-transform data-[pressed]:duration-100\";\n\n/**\n * Hover state styles\n * Elevation change on hover for better affordance\n *\n * Components can override shadow depth:\n * @example\n * cn(HOVER_STYLES_BASE, \"data-[hovered]:shadow-lg\") // Larger shadow\n */\nexport const HOVER_STYLES = \"data-[hovered]:shadow-md\";\n\n/**\n * Base hover styles without shadow (for components that use different hover effects)\n */\nexport const HOVER_STYLES_BASE = \"data-[hovered]:transition-shadow data-[hovered]:duration-200\";\n\n/**\n * High contrast mode focus (FR-012)\n * Enhanced outlines for users requiring high contrast\n *\n * Uses 'hc:' prefix for prefers-contrast: more media query\n */\nexport const HIGH_CONTRAST_FOCUS = \"hc:data-[focus-visible]:outline hc:data-[focus-visible]:outline-4 hc:data-[focus-visible]:outline-offset-2 hc:data-[focus-visible]:outline-foreground\";\n\n/**\n * High contrast mode hover (FR-012)\n * Enhanced outlines for hover in high contrast mode\n */\nexport const HIGH_CONTRAST_HOVER = \"hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground\";\n\n/**\n * High contrast mode pressed state\n * Enhanced outlines for pressed state in high contrast mode\n */\nexport const HIGH_CONTRAST_PRESSED = \"hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground\";\n\n/**\n * Combined high contrast styles\n * Use this for components that need all high contrast interaction states\n */\nexport const HIGH_CONTRAST_INTERACTIONS = `${HIGH_CONTRAST_FOCUS} ${HIGH_CONTRAST_HOVER} ${HIGH_CONTRAST_PRESSED}`;\n\n/**\n * Disabled state styles\n * Consistent disabled appearance across all components\n */\nexport const DISABLED_STYLES = \"disabled:pointer-events-none disabled:opacity-50\";\n\n/**\n * Default interaction bundle\n * Most common combination for interactive components\n *\n * Includes: focus ring, pressed scale, hover shadow, high contrast enhancements\n *\n * @example\n * <button className={cn(DEFAULT_INTERACTIONS, \"bg-primary\")}>Click</button>\n */\nexport const DEFAULT_INTERACTIONS = `${FOCUS_STYLES} ${PRESSED_STYLES} ${HOVER_STYLES} ${HIGH_CONTRAST_FOCUS} ${HIGH_CONTRAST_HOVER} ${HIGH_CONTRAST_PRESSED}`;\n\n/**\n * Subtle interaction bundle\n * For components that need less pronounced feedback\n *\n * Includes: focus ring and high contrast, but no hover shadow or pressed scale\n */\nexport const SUBTLE_INTERACTIONS = `${FOCUS_STYLES} ${HIGH_CONTRAST_FOCUS}`;\n\n/**\n * Non-interactive element styles\n * For elements that should indicate they are not interactive\n */\nexport const NON_INTERACTIVE = \"cursor-default select-none\";\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","\"use client\";\n\n/**\n * Button Component - 3-Layer Architecture\n * Accessible button with React Aria primitives and CVA styling\n *\n * Architecture:\n * - Layer 1: Touch Target (44x44px WCAG AAA compliant, transparent)\n * - Layer 2: Visual Button (configurable size, colors, borders)\n * - Layer 3: Content & Effects (text, icons, ripple, loading spinner)\n *\n * @see 3layer-plan.md for architecture details\n * @see spec.md FR-029 to FR-037 (Button Component Requirements)\n * @see spec.md FR-009 (WCAG 2.2 AAA - 7:1 contrast ratio)\n * @see spec.md FR-014 (44x44px minimum touch targets)\n * @see constitution.md Principle IV (Accessibility First)\n */\n\nimport { forwardRef, memo, useId } from 'react';\nimport {\n  Button as AriaButton,\n  type ButtonProps as AriaButtonProps,\n} from 'react-aria-components';\nimport { Loader2, Zap } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport type { ButtonProps } from './Button.types';\nimport { buttonOuterVariants, buttonVisualVariants, buttonVariants } from './Button.styles';\nimport { PRESSED_STYLES, HOVER_STYLES, HIGH_CONTRAST_HOVER, HIGH_CONTRAST_PRESSED } from '../../styles/interaction-states';\nimport {\n  useButtonGroupContext,\n  useButtonGroupItemContext,\n} from '../ButtonGroup/ButtonGroupContext';\nimport { buttonGroupItemVariants } from '../ButtonGroup/ButtonGroup.variants';\n\n/**\n * Button Component - 3-Layer Architecture\n * Fully accessible button with React Aria and themed styling\n *\n * Layer 1: Touch Target (AriaButton) - 44x44px WCAG AAA compliant\n * Layer 2: Visual Button (span) - configurable appearance\n * Layer 3: Content (children) - text, icons, effects\n */\nconst Button = memo(forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      buttonVisualClassName,\n      variant,\n      size,\n      visualSize,\n      fullWidth,\n      loading = false,\n      loadingText = \"Loading...\",\n      shortcut,\n      children,\n      isDisabled,\n      paywall = false,\n      paywallRedirect,\n      paywallDescription,\n      onPress,\n      ...props\n    },\n    ref\n  ) => {\n    const paywallDescriptionId = useId();\n\n    // ==========================================================================\n    // ButtonGroup Context Integration\n    // ==========================================================================\n\n    // Consume group-level context (variant, size, isDisabled, orientation)\n    const groupContext = useButtonGroupContext();\n\n    // Consume item-level context (position for border-radius styling)\n    const itemContext = useButtonGroupItemContext();\n\n    // Merge context values with props (props take precedence)\n    const effectiveVariant = variant ?? groupContext?.variant ?? 'default';\n    const effectiveSize = size ?? groupContext?.size;\n    const effectiveIsDisabled = isDisabled ?? groupContext?.isDisabled ?? false;\n\n    // In vertical groups, buttons should be full width automatically\n    const isInVerticalGroup = groupContext?.orientation === 'vertical';\n    const effectiveFullWidth = fullWidth || isInVerticalGroup;\n\n    // Position styling for ButtonGroup (only applied when in a group)\n    const positionClassName = itemContext\n      ? buttonGroupItemVariants({\n          orientation: groupContext?.orientation ?? 'horizontal',\n          position: itemContext.position,\n        })\n      : '';\n\n    // Default visualSize to size for backward compatibility\n    const effectiveVisualSize = visualSize ?? effectiveSize ?? 'default';\n\n    // AAA Accessibility: Warn in dev/test if icon/dot variant lacks accessible name\n    if (process.env.NODE_ENV !== 'production') {\n      if (\n        (effectiveVisualSize === 'dot' || effectiveVisualSize === 'icon') &&\n        !props['aria-label'] &&\n        !children\n      ) {\n        console.warn(\n          '[Button] visualSize=\"dot\" or \"icon\" requires aria-label when no visible text is provided (WCAG 1.1.1)'\n        );\n      }\n    }\n\n    /**\n     * Handle button press - intercepts action when paywalled\n     * If paywalled with redirect URL, opens in new tab\n     * Otherwise, calls the normal onPress handler\n     */\n    const handlePress = (e: Parameters<NonNullable<AriaButtonProps['onPress']>>[0]): void => {\n      if (paywall) {\n        if (paywallRedirect) {\n          window.open(paywallRedirect, '_blank', 'noopener,noreferrer');\n        }\n        // Don't call onPress when paywalled\n        return;\n      }\n      onPress?.(e);\n    };\n\n    // Only set isDisabled when we have a reason to disable\n    // Otherwise, let slot system control disabled state (e.g., in NumberField)\n    const computedIsDisabled = effectiveIsDisabled || loading || undefined;\n\n    return (\n      <AriaButton\n        ref={ref}\n        isDisabled={computedIsDisabled}\n        aria-disabled={paywall ? true : undefined}\n        aria-describedby={paywall ? paywallDescriptionId : undefined}\n        onPress={handlePress}\n        className={cn(buttonOuterVariants({ fullWidth: effectiveFullWidth, inVerticalGroup: isInVerticalGroup }), className)}\n        {...props}\n      >\n        {(renderProps) => (\n          /* Layer 2: Visual Button */\n          <span\n            className={cn(\n              buttonVisualVariants({\n                variant: effectiveVariant,\n                visualSize: effectiveVisualSize,\n                paywall,\n                fullWidth: effectiveFullWidth,\n              }),\n              // Position styling from ButtonGroup context (border-radius adjustments)\n              positionClassName,\n              buttonVisualClassName,\n              // Layer 2 interaction styles (no focus - focus ring is on Layer 1)\n              PRESSED_STYLES,\n              HOVER_STYLES,\n              HIGH_CONTRAST_HOVER,\n              HIGH_CONTRAST_PRESSED\n            )}\n            data-pressed={renderProps.isPressed || undefined}\n          >\n            {/* Layer 3: Content & Effects */}\n\n            {/* FR-033: Loading spinner with screen reader announcement */}\n            {/* Uses motion-safe: for WCAG 2.3.3 AAA (Animation from Interactions) */}\n            {loading && (\n              <>\n                <Loader2 className=\"motion-safe:animate-spin\" aria-hidden=\"true\" />\n                <span className=\"sr-only\" aria-live=\"polite\">\n                  {loadingText}\n                </span>\n              </>\n            )}\n\n            {/* Hide children during loading */}\n            {!loading && children}\n\n            {/* Paywall: Lightning bolt icon */}\n            {paywall && (\n              <Zap\n                data-testid=\"zap-icon\"\n                aria-hidden=\"true\"\n                className=\"ml-1\"\n              />\n            )}\n\n            {/* Paywall: Screen reader description */}\n            {paywall && (\n              <span id={paywallDescriptionId} className=\"sr-only\">\n                Premium feature: {paywallDescription || \"Upgrade required to access this feature\"}\n              </span>\n            )}\n\n            {/* FR-034: Keyboard shortcut display on focus */}\n            {renderProps.isFocusVisible && shortcut && (\n              <kbd className=\"ml-auto hidden text-xs opacity-60 lg:inline\">\n                {shortcut}\n              </kbd>\n            )}\n\n            {/* Touch/press ripple effect - FR-031: Pressed state feedback */}\n            {/* Uses motion-safe: for WCAG 2.3.3 AAA (Animation from Interactions) */}\n            {renderProps.isPressed && (\n              <span\n                className=\"absolute inset-0 rounded-[inherit] bg-current opacity-10 motion-safe:animate-in motion-safe:zoom-in-95\"\n                aria-hidden=\"true\"\n              />\n            )}\n          </span>\n        )}\n      </AriaButton>\n    );\n  }\n));\n\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants, buttonOuterVariants, buttonVisualVariants };\nexport type { ButtonProps } from './Button.types';\n"]}

package/dist/elements/ButtonGroup/index.js

@@ -1,66 +1,3 @@
-'use strict';
-
-var chunkRFFO4KPM_js = require('../../chunk-RFFO4KPM.js');
-var chunkY3GT7ETK_js = require('../../chunk-Y3GT7ETK.js');
-require('../../chunk-VIREG536.js');
-
-
-
-Object.defineProperty(exports, "ButtonGroup", {
-  enumerable: true,
-  get: function () { return chunkRFFO4KPM_js.ButtonGroup; }
-});
-Object.defineProperty(exports, "ButtonGroupPropsSchema", {
-  enumerable: true,
-  get: function () { return chunkRFFO4KPM_js.ButtonGroupPropsSchema; }
-});
-Object.defineProperty(exports, "ButtonGroupSeparator", {
-  enumerable: true,
-  get: function () { return chunkRFFO4KPM_js.ButtonGroupSeparator; }
-});
-Object.defineProperty(exports, "ButtonGroupSeparatorPropsSchema", {
-  enumerable: true,
-  get: function () { return chunkRFFO4KPM_js.ButtonGroupSeparatorPropsSchema; }
-});
-Object.defineProperty(exports, "filterButtonChildren", {
-  enumerable: true,
-  get: function () { return chunkRFFO4KPM_js.filterButtonChildren; }
-});
-Object.defineProperty(exports, "getButtonIndex", {
-  enumerable: true,
-  get: function () { return chunkRFFO4KPM_js.getButtonIndex; }
-});
-Object.defineProperty(exports, "getPosition", {
-  enumerable: true,
-  get: function () { return chunkRFFO4KPM_js.getPosition; }
-});
-Object.defineProperty(exports, "isButtonElement", {
-  enumerable: true,
-  get: function () { return chunkRFFO4KPM_js.isButtonElement; }
-});
-Object.defineProperty(exports, "isSeparatorElement", {
-  enumerable: true,
-  get: function () { return chunkRFFO4KPM_js.isSeparatorElement; }
-});
-Object.defineProperty(exports, "buttonGroupItemVariants", {
-  enumerable: true,
-  get: function () { return chunkY3GT7ETK_js.buttonGroupItemVariants; }
-});
-Object.defineProperty(exports, "buttonGroupSeparatorVariants", {
-  enumerable: true,
-  get: function () { return chunkY3GT7ETK_js.buttonGroupSeparatorVariants; }
-});
-Object.defineProperty(exports, "buttonGroupVariants", {
-  enumerable: true,
-  get: function () { return chunkY3GT7ETK_js.buttonGroupVariants; }
-});
-Object.defineProperty(exports, "useButtonGroupContext", {
-  enumerable: true,
-  get: function () { return chunkY3GT7ETK_js.useButtonGroupContext; }
-});
-Object.defineProperty(exports, "useButtonGroupItemContext", {
-  enumerable: true,
-  get: function () { return chunkY3GT7ETK_js.useButtonGroupItemContext; }
-});
-//# sourceMappingURL=index.js.map
+"use client";
+'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":[],"names":[],"mappings":"","file":"index.js"}
+{"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,5 +1,3 @@
-export { ButtonGroup, ButtonGroupPropsSchema, ButtonGroupSeparator, ButtonGroupSeparatorPropsSchema, filterButtonChildren, getButtonIndex, getPosition, isButtonElement, isSeparatorElement } from '../../chunk-I3AUTOMZ.mjs';
-export { buttonGroupItemVariants, buttonGroupSeparatorVariants, buttonGroupVariants, useButtonGroupContext, useButtonGroupItemContext } from '../../chunk-FPKEAJRZ.mjs';
-import '../../chunk-E2KQFV3O.mjs';
-//# sourceMappingURL=index.mjs.map
+"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';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

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

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.mjs"}
+{"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.mjs","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/Card/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/elements/Card/Card.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAqC,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAmB/F,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;6EAqHhB,CAAC;AAQF,eAAO,MAAM,UAAU;;;;;;;;;;6EAUtB,CAAC;AAQF,eAAO,MAAM,SAAS;;;;;;;;;;;2FAUrB,CAAC;AAQF,eAAO,MAAM,eAAe;;;;;;;;;;+FAU3B,CAAC;AAQF,eAAO,MAAM,WAAW;;;;;;;;;;mFAMvB,CAAC;AAQF,eAAO,MAAM,UAAU;;;;;;;;;;6EAUtB,CAAC;AAQF,eAAO,MAAM,UAAU;;;;;;;;;;mFAUtB,CAAC"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/elements/Card/Card.tsx"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AAEH,OAAO,EAAqC,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAmB/F,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;6EAqHhB,CAAC;AAQF,eAAO,MAAM,UAAU;;;;;;;;;;6EAUtB,CAAC;AAQF,eAAO,MAAM,SAAS;;;;;;;;;;;2FAUrB,CAAC;AAQF,eAAO,MAAM,eAAe;;;;;;;;;;+FAU3B,CAAC;AAQF,eAAO,MAAM,WAAW;;;;;;;;;;mFAMvB,CAAC;AAQF,eAAO,MAAM,UAAU;;;;;;;;;;6EAUtB,CAAC;AAQF,eAAO,MAAM,UAAU;;;;;;;;;;mFAUtB,CAAC"}

package/dist/elements/Card/index.js

@@ -1,85 +1,3 @@
-'use strict';
-
-var chunkWJGLM4CY_js = require('../../chunk-WJGLM4CY.js');
-require('../../chunk-3YOY2VJ6.js');
-require('../../chunk-Y3GT7ETK.js');
-require('../../chunk-B5Q4UPL6.js');
-require('../../chunk-VIREG536.js');
-require('../../chunk-T4COXKQ3.js');
-
-
-
-Object.defineProperty(exports, "Card", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.Card; }
-});
-Object.defineProperty(exports, "CardAction", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardAction; }
-});
-Object.defineProperty(exports, "CardActionPropsSchema", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardActionPropsSchema; }
-});
-Object.defineProperty(exports, "CardContent", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardContent; }
-});
-Object.defineProperty(exports, "CardContentPropsSchema", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardContentPropsSchema; }
-});
-Object.defineProperty(exports, "CardDescription", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardDescription; }
-});
-Object.defineProperty(exports, "CardDescriptionPropsSchema", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardDescriptionPropsSchema; }
-});
-Object.defineProperty(exports, "CardFooter", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardFooter; }
-});
-Object.defineProperty(exports, "CardFooterPropsSchema", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardFooterPropsSchema; }
-});
-Object.defineProperty(exports, "CardHeader", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardHeader; }
-});
-Object.defineProperty(exports, "CardHeaderPropsSchema", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardHeaderPropsSchema; }
-});
-Object.defineProperty(exports, "CardPropsSchema", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardPropsSchema; }
-});
-Object.defineProperty(exports, "CardTitle", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardTitle; }
-});
-Object.defineProperty(exports, "CardTitlePropsSchema", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.CardTitlePropsSchema; }
-});
-Object.defineProperty(exports, "FlipButtonIconSchema", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.FlipButtonIconSchema; }
-});
-Object.defineProperty(exports, "FlipButtonLabelSchema", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.FlipButtonLabelSchema; }
-});
-Object.defineProperty(exports, "FlipButtonPositionSchema", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.FlipButtonPositionSchema; }
-});
-Object.defineProperty(exports, "flipButtonPositionVariants", {
-  enumerable: true,
-  get: function () { return chunkWJGLM4CY_js.flipButtonPositionVariants; }
-});
-//# sourceMappingURL=index.js.map
+"use client";
+'use strict';var react=require('react'),lucideReact=require('lucide-react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),reactAriaComponents=require('react-aria-components'),classVarianceAuthority=require('class-variance-authority'),jsxRuntime=require('react/jsx-runtime'),zod=require('zod');function n(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var G=classVarianceAuthority.cva("inline-flex justify-center min-h-[44px] min-w-[44px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50",{variants:{fullWidth:{true:"w-full",false:""},inVerticalGroup:{true:"items-stretch",false:"items-center"}},defaultVariants:{fullWidth:false,inVerticalGroup:false}}),_=classVarianceAuthority.cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 relative cursor-pointer",{variants:{variant:{default:"bg-[var(--primary-action)] text-[var(--primary-action-foreground)] shadow-md hover:bg-[var(--primary-action-hover)] data-[pressed]:bg-[var(--primary-action)]/80",destructive:"bg-[var(--destructive-background)] text-[var(--destructive-foreground)] shadow-md hover:bg-[var(--destructive-background)]/90 data-[pressed]:bg-[var(--destructive-background)]/80",outline:"border border-[var(--input-border)] bg-[var(--page-background)] hover:bg-[var(--input-border)] data-[pressed]:bg-[var(--input-border)]",secondary:"bg-[var(--secondary)] text-[var(--secondary-foreground)] shadow-md hover:bg-[var(--secondary)]/80 data-[pressed]:bg-[var(--secondary)]/70",ghost:"hover:bg-[var(--accent)] hover:text-[var(--accent-foreground)] data-[pressed]:bg-[var(--accent)]",link:"text-[var(--text-link)] underline-offset-4 hover:underline data-[pressed]:text-[var(--text-link-hover)]"},fullWidth:{true:"w-full",false:""},visualSize:{default:"h-10 px-4 py-2",sm:"h-9 rounded-md px-3 text-xs",lg:"h-11 rounded-md px-8",icon:"h-10 w-10",dot:"h-5 w-5 rounded-full p-0 min-h-0 min-w-0"},paywall:{true:"!bg-[var(--paywall)] !text-[var(--paywall-foreground)] !shadow-md hover:!bg-[var(--paywall)]/90 !cursor-not-allowed !border-transparent",false:""}},defaultVariants:{variant:"default",visualSize:"default",paywall:false}});var k="data-[pressed]:scale-[0.97]";var M="data-[hovered]:shadow-md";var L="hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground",F="hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground";var K=react.createContext(null);K.displayName="ButtonGroupContext";function Q(){return react.useContext(K)}var X=react.createContext(null);X.displayName="ButtonGroupItemContext";function tt(){return react.useContext(X)}classVarianceAuthority.cva("inline-flex items-center gap-0",{variants:{orientation:{horizontal:"flex-row",vertical:"flex-col w-full"}},defaultVariants:{orientation:"horizontal"}});var et=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"}});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 I=react.memo(react.forwardRef(({className:e,buttonVisualClassName:o,variant:r,size:a,visualSize:h,fullWidth:w,loading:m=false,loadingText:A="Loading...",shortcut:v,children:S,isDisabled:P,paywall:s=false,paywallRedirect:N,paywallDescription:B,onPress:z,...T},x)=>{let p=react.useId(),c=Q(),H=tt(),R=r??c?.variant??"default",E=a??c?.size,D=P??c?.isDisabled??false,V=c?.orientation==="vertical",C=w||V,f=H?et({orientation:c?.orientation??"horizontal",position:H.position}):"",g=h??E??"default";return process.env.NODE_ENV!=="production"&&(g==="dot"||g==="icon")&&!T["aria-label"]&&!S&&console.warn('[Button] visualSize="dot" or "icon" requires aria-label when no visible text is provided (WCAG 1.1.1)'),jsxRuntime.jsx(reactAriaComponents.Button,{ref:x,isDisabled:D||m||void 0,"aria-disabled":s?true:void 0,"aria-describedby":s?p:void 0,onPress:y=>{if(s){N&&window.open(N,"_blank","noopener,noreferrer");return}z?.(y);},className:n(G({fullWidth:C,inVerticalGroup:V}),e),...T,children:y=>jsxRuntime.jsxs("span",{className:n(_({variant:R,visualSize:g,paywall:s,fullWidth:C}),f,o,k,M,L,F),"data-pressed":y.isPressed||void 0,children:[m&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(lucideReact.Loader2,{className:"motion-safe:animate-spin","aria-hidden":"true"}),jsxRuntime.jsx("span",{className:"sr-only","aria-live":"polite",children:A})]}),!m&&S,s&&jsxRuntime.jsx(lucideReact.Zap,{"data-testid":"zap-icon","aria-hidden":"true",className:"ml-1"}),s&&jsxRuntime.jsxs("span",{id:p,className:"sr-only",children:["Premium feature: ",B||"Upgrade required to access this feature"]}),y.isFocusVisible&&v&&jsxRuntime.jsx("kbd",{className:"ml-auto hidden text-xs opacity-60 lg:inline",children:v}),y.isPressed&&jsxRuntime.jsx("span",{className:"absolute inset-0 rounded-[inherit] bg-current opacity-10 motion-safe:animate-in motion-safe:zoom-in-95","aria-hidden":"true"})]})})}));I.displayName="Button";var l=zod.z.object({className:zod.z.string().optional(),children:zod.z.any().optional(),id:zod.z.string().optional(),"aria-label":zod.z.string().optional(),"aria-labelledby":zod.z.string().optional(),"aria-describedby":zod.z.string().optional(),"aria-live":zod.z.enum(["off","polite","assertive"]).optional(),"aria-hidden":zod.z.boolean().optional(),"data-testid":zod.z.string().optional()});var ot=zod.z.enum(["top-right","top-left","bottom-right","bottom-left"]),rt=zod.z.object({show:zod.z.string().optional(),hide:zod.z.string().optional()}),at=zod.z.object({front:zod.z.custom().optional(),back:zod.z.custom().optional()}),Pt=l.extend({flippable:zod.z.boolean().optional().default(false),backContent:zod.z.custom().optional(),isFlipped:zod.z.boolean().optional(),defaultFlipped:zod.z.boolean().optional().default(false),onFlipChange:zod.z.custom().optional(),flipButtonPosition:ot.optional().default("top-right"),flipButtonLabel:rt.optional(),flipButtonIcon:at.optional(),flipDuration:zod.z.number().optional().default(600)}),Nt=l.extend({children:zod.z.custom()}),Bt=l.extend({as:zod.z.enum(["h1","h2","h3","h4","h5","h6"]).optional().default("h3"),children:zod.z.custom()}),Tt=l.extend({children:zod.z.custom()}),Ht=l.extend({children:zod.z.custom()}),Et=l.extend({children:zod.z.custom()}),Vt=l.extend({children:zod.z.custom()}),W=classVarianceAuthority.cva(["absolute z-10 min-h-[44px] min-w-[44px] p-2","flex items-center justify-center","rounded-full bg-[var(--accent-background)]","text-[var(--primary-action)] hover:text-[var(--primary-action-hover)]","transition-colors duration-200","focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]"],{variants:{position:{"top-right":"top-2 right-2","top-left":"top-2 left-2","bottom-right":"bottom-2 right-2","bottom-left":"bottom-2 left-2"}},defaultVariants:{position:"top-right"}});var nt=react.forwardRef((e,o)=>{let{children:r,className:a,flippable:h=false,backContent:w,isFlipped:m,defaultFlipped:A=false,onFlipChange:v,flipButtonPosition:S="top-right",flipButtonLabel:P,flipButtonIcon:s,flipDuration:N=600,...B}=e,[z,T]=react.useState(A),x=m!==void 0,p=x?m:z,c=react.useCallback(()=>{let f=!p;x||T(f),v?.(f);},[p,x,v]);if(!h)return jsxRuntime.jsx("article",{ref:o,className:n("rounded-lg border border-[var(--border)] bg-[var(--content-background)] text-[var(--content-foreground)] shadow-sm",a),...B,children:r});let H=P?.show??"Show more details",R=P?.hide??"Show less details",E=jsxRuntime.jsx(lucideReact.RotateCcw,{className:"h-5 w-5","aria-hidden":"true"}),D=s?.front??E,V=s?.back??s?.front??E,C=({label:f,icon:g})=>jsxRuntime.jsx(I,{variant:"ghost",visualSize:"icon","aria-hidden":true,excludeFromTabOrder:true,onPress:c,className:W({position:S}),"aria-label":f,children:g});return jsxRuntime.jsx("article",{ref:o,className:n("relative",a),style:{perspective:"1000px"},...B,children:jsxRuntime.jsxs("div",{className:n("relative transition-transform","motion-reduce:transition-none"),style:{transformStyle:"preserve-3d",transitionDuration:`${N}ms`,transform:p?"rotateY(180deg)":"rotateY(0deg)"},"data-flipped":p,children:[jsxRuntime.jsxs("div",{className:"relative rounded-lg border border-[var(--border)] bg-[var(--content-background)] text-[var(--content-foreground)] shadow-sm",style:{backfaceVisibility:"hidden"},"data-side":"front",children:[r,jsxRuntime.jsx(C,{label:H,icon:D})]}),jsxRuntime.jsxs("div",{className:"absolute inset-0 overflow-y-auto rounded-lg border border-[var(--border)] bg-[var(--content-background)] text-[var(--content-foreground)] shadow-sm",style:{backfaceVisibility:"hidden",transform:"rotateY(180deg)"},"data-side":"back",children:[w,jsxRuntime.jsx(C,{label:R,icon:V})]})]})})});nt.displayName="Card";var it=react.forwardRef(({className:e,children:o,...r},a)=>jsxRuntime.jsx("header",{ref:a,className:n("flex flex-col space-y-1.5 p-6",e),...r,children:o}));it.displayName="CardHeader";var st=react.forwardRef(({className:e,as:o="h3",children:r,...a},h)=>jsxRuntime.jsx(o,{ref:h,className:n("text-2xl font-semibold leading-none tracking-tight",e),...a,children:r}));st.displayName="CardTitle";var dt=react.forwardRef(({className:e,children:o,...r},a)=>jsxRuntime.jsx("p",{ref:a,className:n("text-sm text-[var(--content-foreground-muted)]",e),...r,children:o}));dt.displayName="CardDescription";var lt=react.forwardRef(({className:e,children:o,...r},a)=>jsxRuntime.jsx("div",{ref:a,className:n("p-6 pt-0",e),...r,children:o}));lt.displayName="CardContent";var pt=react.forwardRef(({className:e,children:o,...r},a)=>jsxRuntime.jsx("footer",{ref:a,className:n("flex items-center p-6 pt-0",e),...r,children:o}));pt.displayName="CardFooter";var ct=react.forwardRef(({className:e,children:o,...r},a)=>jsxRuntime.jsx("div",{ref:a,className:n("ml-auto",e),...r,children:o}));ct.displayName="CardAction";exports.Card=nt;exports.CardAction=ct;exports.CardActionPropsSchema=Vt;exports.CardContent=lt;exports.CardContentPropsSchema=Ht;exports.CardDescription=dt;exports.CardDescriptionPropsSchema=Tt;exports.CardFooter=pt;exports.CardFooterPropsSchema=Et;exports.CardHeader=it;exports.CardHeaderPropsSchema=Nt;exports.CardPropsSchema=Pt;exports.CardTitle=st;exports.CardTitlePropsSchema=Bt;exports.FlipButtonIconSchema=at;exports.FlipButtonLabelSchema=rt;exports.FlipButtonPositionSchema=ot;exports.flipButtonPositionVariants=W;//# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}
+{"version":3,"sources":["../../../src/utils/cn.ts","../../../src/elements/Button/Button.styles.ts","../../../src/styles/interaction-states.ts","../../../src/elements/ButtonGroup/ButtonGroupContext.tsx","../../../src/elements/ButtonGroup/ButtonGroup.variants.ts","../../../src/elements/Button/Button.tsx","../../../src/schemas/BaseComponentProps.ts","../../../src/elements/Card/Card.types.ts","../../../src/elements/Card/Card.tsx"],"names":["cn","inputs","twMerge","clsx","buttonOuterVariants","cva","buttonVisualVariants","PRESSED_STYLES","HOVER_STYLES","HIGH_CONTRAST_HOVER","HIGH_CONTRAST_PRESSED","ButtonGroupContext","createContext","useButtonGroupContext","useContext","ButtonGroupItemContext","useButtonGroupItemContext","buttonGroupItemVariants","Button","memo","forwardRef","className","buttonVisualClassName","variant","size","visualSize","fullWidth","loading","loadingText","shortcut","children","isDisabled","paywall","paywallRedirect","paywallDescription","onPress","props","ref","paywallDescriptionId","useId","groupContext","itemContext","effectiveVariant","effectiveSize","effectiveIsDisabled","isInVerticalGroup","effectiveFullWidth","positionClassName","effectiveVisualSize","jsx","AriaButton","e","renderProps","jsxs","Fragment","Loader2","Zap","BaseComponentPropsSchema","z","FlipButtonPositionSchema","FlipButtonLabelSchema","FlipButtonIconSchema","CardPropsSchema","CardHeaderPropsSchema","CardTitlePropsSchema","CardDescriptionPropsSchema","CardContentPropsSchema","CardFooterPropsSchema","CardActionPropsSchema","flipButtonPositionVariants","Card","flippable","backContent","controlledFlipped","defaultFlipped","onFlipChange","flipButtonPosition","flipButtonLabel","flipButtonIcon","flipDuration","rest","internalFlipped","setInternalFlipped","useState","isControlled","flipped","handleFlip","useCallback","newState","showLabel","hideLabel","defaultIcon","RotateCcw","frontIcon","backIcon","FlipButton","label","icon","CardHeader","CardTitle","Comp","CardDescription","CardContent","CardFooter","CardAction"],"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","import { cva } from 'class-variance-authority';\n\n/**\n * Layer 1: Transparent outer touch target (44x44px minimum)\n * Handles WCAG 2.2 AAA touch target requirement\n * Always transparent, centers the visual button inside\n * IMPORTANT: Focus ring stays on Layer 1 for AAA compliance (2.4.13)\n *\n * In vertical ButtonGroups, uses items-stretch so the visual layer (Layer 2)\n * can fill the full touch target height, eliminating gaps between buttons.\n */\nexport const buttonOuterVariants = cva(\n  \"inline-flex justify-center min-h-[44px] min-w-[44px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50\",\n  {\n    variants: {\n      fullWidth: {\n        true: \"w-full\",\n        false: \"\",\n      },\n      inVerticalGroup: {\n        true: \"items-stretch\",\n        false: \"items-center\",\n      },\n    },\n    defaultVariants: {\n      fullWidth: false,\n      inVerticalGroup: false,\n    },\n  }\n);\n\n/**\n * Layer 2: Visual button appearance (adjustable size)\n * Provides the visual appearance with configurable size\n * Can be smaller than touch target for use cases like carousel dots\n * NOTE: NO focus-visible styles here - focus ring is on Layer 1\n */\nexport const buttonVisualVariants = cva(\n  \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 relative cursor-pointer\",\n  {\n    variants: {\n      variant: {\n        default:\n          \"bg-[var(--primary-action)] text-[var(--primary-action-foreground)] shadow-md hover:bg-[var(--primary-action-hover)] data-[pressed]:bg-[var(--primary-action)]/80\",\n        destructive:\n          \"bg-[var(--destructive-background)] text-[var(--destructive-foreground)] shadow-md hover:bg-[var(--destructive-background)]/90 data-[pressed]:bg-[var(--destructive-background)]/80\",\n        outline:\n          \"border border-[var(--input-border)] bg-[var(--page-background)] hover:bg-[var(--input-border)] data-[pressed]:bg-[var(--input-border)]\",\n        secondary:\n          \"bg-[var(--secondary)] text-[var(--secondary-foreground)] shadow-md hover:bg-[var(--secondary)]/80 data-[pressed]:bg-[var(--secondary)]/70\",\n        ghost:\n          \"hover:bg-[var(--accent)] hover:text-[var(--accent-foreground)] data-[pressed]:bg-[var(--accent)]\",\n        link: \"text-[var(--text-link)] underline-offset-4 hover:underline data-[pressed]:text-[var(--text-link-hover)]\",\n      },\n      fullWidth: {\n        true: \"w-full\",\n        false: \"\",\n      },\n      visualSize: {\n        default: \"h-10 px-4 py-2\",\n        sm: \"h-9 rounded-md px-3 text-xs\",\n        lg: \"h-11 rounded-md px-8\",\n        icon: \"h-10 w-10\",\n        dot: \"h-5 w-5 rounded-full p-0 min-h-0 min-w-0\",\n      },\n      paywall: {\n        true: \"!bg-[var(--paywall)] !text-[var(--paywall-foreground)] !shadow-md hover:!bg-[var(--paywall)]/90 !cursor-not-allowed !border-transparent\",\n        false: \"\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      visualSize: \"default\",\n      paywall: false,\n    },\n  }\n);\n\n/**\n * @deprecated Use buttonVisualVariants instead. This alias is kept for backward compatibility.\n */\nexport const buttonVariants = buttonVisualVariants;\n","/**\n * Global Interaction State Styles\n *\n * Consistent interaction patterns across all Themis components.\n * These styles ensure WCAG 2.2 AAA compliance and predictable UX.\n *\n * @see spec.md FR-010 (Visible focus ring for keyboard navigation)\n * @see spec.md FR-031 (Pressed state feedback)\n * @see spec.md FR-012 (High contrast mode support)\n * @see constitution.md Principle IV (Accessibility First)\n */\n\n/**\n * Focus state styles (FR-010)\n * Visible focus ring for keyboard navigation - WCAG 2.2 Level AAA\n *\n * Components can override by extending these styles:\n * @example\n * cn(FOCUS_STYLES, \"ring-4\") // Increases ring width to 4px\n */\nexport const FOCUS_STYLES = \"data-[focus-visible]:ring-2 data-[focus-visible]:ring-[var(--themis-ring)] data-[focus-visible]:ring-offset-2\";\n\n/**\n * Pressed/Active state styles (FR-031)\n * Visual feedback for press interactions\n *\n * Components can override the scale amount:\n * @example\n * cn(PRESSED_STYLES_BASE, \"data-[pressed]:scale-[0.95]\") // More pronounced scale\n */\nexport const PRESSED_STYLES = \"data-[pressed]:scale-[0.97]\";\n\n/**\n * Base pressed styles without scale (for components that need different feedback)\n */\nexport const PRESSED_STYLES_BASE = \"data-[pressed]:transition-transform data-[pressed]:duration-100\";\n\n/**\n * Hover state styles\n * Elevation change on hover for better affordance\n *\n * Components can override shadow depth:\n * @example\n * cn(HOVER_STYLES_BASE, \"data-[hovered]:shadow-lg\") // Larger shadow\n */\nexport const HOVER_STYLES = \"data-[hovered]:shadow-md\";\n\n/**\n * Base hover styles without shadow (for components that use different hover effects)\n */\nexport const HOVER_STYLES_BASE = \"data-[hovered]:transition-shadow data-[hovered]:duration-200\";\n\n/**\n * High contrast mode focus (FR-012)\n * Enhanced outlines for users requiring high contrast\n *\n * Uses 'hc:' prefix for prefers-contrast: more media query\n */\nexport const HIGH_CONTRAST_FOCUS = \"hc:data-[focus-visible]:outline hc:data-[focus-visible]:outline-4 hc:data-[focus-visible]:outline-offset-2 hc:data-[focus-visible]:outline-foreground\";\n\n/**\n * High contrast mode hover (FR-012)\n * Enhanced outlines for hover in high contrast mode\n */\nexport const HIGH_CONTRAST_HOVER = \"hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground\";\n\n/**\n * High contrast mode pressed state\n * Enhanced outlines for pressed state in high contrast mode\n */\nexport const HIGH_CONTRAST_PRESSED = \"hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground\";\n\n/**\n * Combined high contrast styles\n * Use this for components that need all high contrast interaction states\n */\nexport const HIGH_CONTRAST_INTERACTIONS = `${HIGH_CONTRAST_FOCUS} ${HIGH_CONTRAST_HOVER} ${HIGH_CONTRAST_PRESSED}`;\n\n/**\n * Disabled state styles\n * Consistent disabled appearance across all components\n */\nexport const DISABLED_STYLES = \"disabled:pointer-events-none disabled:opacity-50\";\n\n/**\n * Default interaction bundle\n * Most common combination for interactive components\n *\n * Includes: focus ring, pressed scale, hover shadow, high contrast enhancements\n *\n * @example\n * <button className={cn(DEFAULT_INTERACTIONS, \"bg-primary\")}>Click</button>\n */\nexport const DEFAULT_INTERACTIONS = `${FOCUS_STYLES} ${PRESSED_STYLES} ${HOVER_STYLES} ${HIGH_CONTRAST_FOCUS} ${HIGH_CONTRAST_HOVER} ${HIGH_CONTRAST_PRESSED}`;\n\n/**\n * Subtle interaction bundle\n * For components that need less pronounced feedback\n *\n * Includes: focus ring and high contrast, but no hover shadow or pressed scale\n */\nexport const SUBTLE_INTERACTIONS = `${FOCUS_STYLES} ${HIGH_CONTRAST_FOCUS}`;\n\n/**\n * Non-interactive element styles\n * For elements that should indicate they are not interactive\n */\nexport const NON_INTERACTIVE = \"cursor-default select-none\";\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","\"use client\";\n\n/**\n * Button Component - 3-Layer Architecture\n * Accessible button with React Aria primitives and CVA styling\n *\n * Architecture:\n * - Layer 1: Touch Target (44x44px WCAG AAA compliant, transparent)\n * - Layer 2: Visual Button (configurable size, colors, borders)\n * - Layer 3: Content & Effects (text, icons, ripple, loading spinner)\n *\n * @see 3layer-plan.md for architecture details\n * @see spec.md FR-029 to FR-037 (Button Component Requirements)\n * @see spec.md FR-009 (WCAG 2.2 AAA - 7:1 contrast ratio)\n * @see spec.md FR-014 (44x44px minimum touch targets)\n * @see constitution.md Principle IV (Accessibility First)\n */\n\nimport { forwardRef, memo, useId } from 'react';\nimport {\n  Button as AriaButton,\n  type ButtonProps as AriaButtonProps,\n} from 'react-aria-components';\nimport { Loader2, Zap } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport type { ButtonProps } from './Button.types';\nimport { buttonOuterVariants, buttonVisualVariants, buttonVariants } from './Button.styles';\nimport { PRESSED_STYLES, HOVER_STYLES, HIGH_CONTRAST_HOVER, HIGH_CONTRAST_PRESSED } from '../../styles/interaction-states';\nimport {\n  useButtonGroupContext,\n  useButtonGroupItemContext,\n} from '../ButtonGroup/ButtonGroupContext';\nimport { buttonGroupItemVariants } from '../ButtonGroup/ButtonGroup.variants';\n\n/**\n * Button Component - 3-Layer Architecture\n * Fully accessible button with React Aria and themed styling\n *\n * Layer 1: Touch Target (AriaButton) - 44x44px WCAG AAA compliant\n * Layer 2: Visual Button (span) - configurable appearance\n * Layer 3: Content (children) - text, icons, effects\n */\nconst Button = memo(forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      buttonVisualClassName,\n      variant,\n      size,\n      visualSize,\n      fullWidth,\n      loading = false,\n      loadingText = \"Loading...\",\n      shortcut,\n      children,\n      isDisabled,\n      paywall = false,\n      paywallRedirect,\n      paywallDescription,\n      onPress,\n      ...props\n    },\n    ref\n  ) => {\n    const paywallDescriptionId = useId();\n\n    // ==========================================================================\n    // ButtonGroup Context Integration\n    // ==========================================================================\n\n    // Consume group-level context (variant, size, isDisabled, orientation)\n    const groupContext = useButtonGroupContext();\n\n    // Consume item-level context (position for border-radius styling)\n    const itemContext = useButtonGroupItemContext();\n\n    // Merge context values with props (props take precedence)\n    const effectiveVariant = variant ?? groupContext?.variant ?? 'default';\n    const effectiveSize = size ?? groupContext?.size;\n    const effectiveIsDisabled = isDisabled ?? groupContext?.isDisabled ?? false;\n\n    // In vertical groups, buttons should be full width automatically\n    const isInVerticalGroup = groupContext?.orientation === 'vertical';\n    const effectiveFullWidth = fullWidth || isInVerticalGroup;\n\n    // Position styling for ButtonGroup (only applied when in a group)\n    const positionClassName = itemContext\n      ? buttonGroupItemVariants({\n          orientation: groupContext?.orientation ?? 'horizontal',\n          position: itemContext.position,\n        })\n      : '';\n\n    // Default visualSize to size for backward compatibility\n    const effectiveVisualSize = visualSize ?? effectiveSize ?? 'default';\n\n    // AAA Accessibility: Warn in dev/test if icon/dot variant lacks accessible name\n    if (process.env.NODE_ENV !== 'production') {\n      if (\n        (effectiveVisualSize === 'dot' || effectiveVisualSize === 'icon') &&\n        !props['aria-label'] &&\n        !children\n      ) {\n        console.warn(\n          '[Button] visualSize=\"dot\" or \"icon\" requires aria-label when no visible text is provided (WCAG 1.1.1)'\n        );\n      }\n    }\n\n    /**\n     * Handle button press - intercepts action when paywalled\n     * If paywalled with redirect URL, opens in new tab\n     * Otherwise, calls the normal onPress handler\n     */\n    const handlePress = (e: Parameters<NonNullable<AriaButtonProps['onPress']>>[0]): void => {\n      if (paywall) {\n        if (paywallRedirect) {\n          window.open(paywallRedirect, '_blank', 'noopener,noreferrer');\n        }\n        // Don't call onPress when paywalled\n        return;\n      }\n      onPress?.(e);\n    };\n\n    // Only set isDisabled when we have a reason to disable\n    // Otherwise, let slot system control disabled state (e.g., in NumberField)\n    const computedIsDisabled = effectiveIsDisabled || loading || undefined;\n\n    return (\n      <AriaButton\n        ref={ref}\n        isDisabled={computedIsDisabled}\n        aria-disabled={paywall ? true : undefined}\n        aria-describedby={paywall ? paywallDescriptionId : undefined}\n        onPress={handlePress}\n        className={cn(buttonOuterVariants({ fullWidth: effectiveFullWidth, inVerticalGroup: isInVerticalGroup }), className)}\n        {...props}\n      >\n        {(renderProps) => (\n          /* Layer 2: Visual Button */\n          <span\n            className={cn(\n              buttonVisualVariants({\n                variant: effectiveVariant,\n                visualSize: effectiveVisualSize,\n                paywall,\n                fullWidth: effectiveFullWidth,\n              }),\n              // Position styling from ButtonGroup context (border-radius adjustments)\n              positionClassName,\n              buttonVisualClassName,\n              // Layer 2 interaction styles (no focus - focus ring is on Layer 1)\n              PRESSED_STYLES,\n              HOVER_STYLES,\n              HIGH_CONTRAST_HOVER,\n              HIGH_CONTRAST_PRESSED\n            )}\n            data-pressed={renderProps.isPressed || undefined}\n          >\n            {/* Layer 3: Content & Effects */}\n\n            {/* FR-033: Loading spinner with screen reader announcement */}\n            {/* Uses motion-safe: for WCAG 2.3.3 AAA (Animation from Interactions) */}\n            {loading && (\n              <>\n                <Loader2 className=\"motion-safe:animate-spin\" aria-hidden=\"true\" />\n                <span className=\"sr-only\" aria-live=\"polite\">\n                  {loadingText}\n                </span>\n              </>\n            )}\n\n            {/* Hide children during loading */}\n            {!loading && children}\n\n            {/* Paywall: Lightning bolt icon */}\n            {paywall && (\n              <Zap\n                data-testid=\"zap-icon\"\n                aria-hidden=\"true\"\n                className=\"ml-1\"\n              />\n            )}\n\n            {/* Paywall: Screen reader description */}\n            {paywall && (\n              <span id={paywallDescriptionId} className=\"sr-only\">\n                Premium feature: {paywallDescription || \"Upgrade required to access this feature\"}\n              </span>\n            )}\n\n            {/* FR-034: Keyboard shortcut display on focus */}\n            {renderProps.isFocusVisible && shortcut && (\n              <kbd className=\"ml-auto hidden text-xs opacity-60 lg:inline\">\n                {shortcut}\n              </kbd>\n            )}\n\n            {/* Touch/press ripple effect - FR-031: Pressed state feedback */}\n            {/* Uses motion-safe: for WCAG 2.3.3 AAA (Animation from Interactions) */}\n            {renderProps.isPressed && (\n              <span\n                className=\"absolute inset-0 rounded-[inherit] bg-current opacity-10 motion-safe:animate-in motion-safe:zoom-in-95\"\n                aria-hidden=\"true\"\n              />\n            )}\n          </span>\n        )}\n      </AriaButton>\n    );\n  }\n));\n\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants, buttonOuterVariants, buttonVisualVariants };\nexport type { ButtonProps } from './Button.types';\n","import { z } from 'zod';\n\n/**\n * Base props schema for all Themis components\n * Ensures consistent accessibility and styling APIs across the library\n *\n * @see spec.md FR-009 to FR-014 (Accessibility Requirements)\n * @see constitution.md Principle IV (Accessibility First - WCAG 2.2 AA minimum)\n */\nexport const BaseComponentPropsSchema = z.object({\n  // Styling\n  className: z.string().optional(),\n\n  // React\n  children: z.any().optional(), // ReactNode not directly supported by Zod\n  id: z.string().optional(),\n\n  // Accessibility (WCAG 2.2 AA requirements)\n  'aria-label': z.string().optional(),\n  'aria-labelledby': z.string().optional(),\n  'aria-describedby': z.string().optional(),\n  'aria-live': z.enum(['off', 'polite', 'assertive']).optional(),\n  'aria-hidden': z.boolean().optional(),\n\n  // Testing & Development\n  'data-testid': z.string().optional(),\n});\n\nexport type BaseComponentProps = z.infer<typeof BaseComponentPropsSchema>;\n","import { z } from 'zod';\nimport { cva } from 'class-variance-authority';\nimport { BaseComponentPropsSchema } from '../../schemas/BaseComponentProps';\nimport type { ReactNode } from 'react';\n\n/**\n * Flip button position variants\n * Controls where the flip button appears on the card\n *\n * @see card-prd.md US-5 (Flip Button Position)\n */\nexport const FlipButtonPositionSchema = z.enum([\n  'top-right',\n  'top-left',\n  'bottom-right',\n  'bottom-left',\n]);\nexport type FlipButtonPosition = z.infer<typeof FlipButtonPositionSchema>;\n\n/**\n * Flip button label configuration\n * Custom labels for the flip button title attribute\n *\n * @see card-prd.md US-6 (Custom Labels)\n */\nexport const FlipButtonLabelSchema = z.object({\n  show: z.string().optional(),\n  hide: z.string().optional(),\n});\nexport type FlipButtonLabel = z.infer<typeof FlipButtonLabelSchema>;\n\n/**\n * Flip button icon configuration\n * Custom icons for the front and back flip buttons\n */\nexport const FlipButtonIconSchema = z.object({\n  /** Icon to show on front side button (default: RotateCcw) */\n  front: z.custom<ReactNode>().optional(),\n  /** Icon to show on back side button (default: same as front or RotateCcw) */\n  back: z.custom<ReactNode>().optional(),\n});\nexport type FlipButtonIcon = z.infer<typeof FlipButtonIconSchema>;\n\n/**\n * Card root component props schema\n *\n * @see card-prd.md US-1 (Basic Card Container)\n * @see card-prd.md US-2 (Flippable Card)\n * @see card-prd.md US-3 (Controlled/Uncontrolled State)\n */\nexport const CardPropsSchema = BaseComponentPropsSchema.extend({\n  // Flip functionality\n  /** Enable flip animation feature */\n  flippable: z.boolean().optional().default(false),\n\n  /** Content to display on the back side of the card */\n  backContent: z.custom<ReactNode>().optional(),\n\n  /** Controlled mode: current flip state */\n  isFlipped: z.boolean().optional(),\n\n  /** Uncontrolled mode: initial flip state */\n  defaultFlipped: z.boolean().optional().default(false),\n\n  /** Callback fired when flip state changes */\n  onFlipChange: z.custom<(isFlipped: boolean) => void>().optional(),\n\n  // Flip button configuration\n  /** Position of the flip button on the card */\n  flipButtonPosition: FlipButtonPositionSchema.optional().default('top-right'),\n\n  /** Custom labels for the flip button title attribute */\n  flipButtonLabel: FlipButtonLabelSchema.optional(),\n\n  /** Custom icons for the flip button (default: RotateCcw) */\n  flipButtonIcon: FlipButtonIconSchema.optional(),\n\n  /** Duration of flip animation in milliseconds */\n  flipDuration: z.number().optional().default(600),\n});\n\nexport type CardProps = z.infer<typeof CardPropsSchema>;\n\n/**\n * CardHeader props schema\n *\n * @see card-prd.md US-1 (Basic Card Container)\n */\nexport const CardHeaderPropsSchema = BaseComponentPropsSchema.extend({\n  children: z.custom<ReactNode>(),\n});\n\nexport type CardHeaderProps = z.infer<typeof CardHeaderPropsSchema>;\n\n/**\n * CardTitle props schema\n *\n * @see card-prd.md US-1 (Basic Card Container)\n */\nexport const CardTitlePropsSchema = BaseComponentPropsSchema.extend({\n  /** Heading level (h1-h6) - defaults to h3 */\n  as: z.enum(['h1', 'h2', 'h3', 'h4', 'h5', 'h6']).optional().default('h3'),\n\n  children: z.custom<ReactNode>(),\n});\n\nexport type CardTitleProps = z.infer<typeof CardTitlePropsSchema>;\n\n/**\n * CardDescription props schema\n *\n * @see card-prd.md US-1 (Basic Card Container)\n */\nexport const CardDescriptionPropsSchema = BaseComponentPropsSchema.extend({\n  children: z.custom<ReactNode>(),\n});\n\nexport type CardDescriptionProps = z.infer<typeof CardDescriptionPropsSchema>;\n\n/**\n * CardContent props schema\n *\n * @see card-prd.md US-1 (Basic Card Container)\n */\nexport const CardContentPropsSchema = BaseComponentPropsSchema.extend({\n  children: z.custom<ReactNode>(),\n});\n\nexport type CardContentProps = z.infer<typeof CardContentPropsSchema>;\n\n/**\n * CardFooter props schema\n *\n * @see card-prd.md US-1 (Basic Card Container)\n */\nexport const CardFooterPropsSchema = BaseComponentPropsSchema.extend({\n  children: z.custom<ReactNode>(),\n});\n\nexport type CardFooterProps = z.infer<typeof CardFooterPropsSchema>;\n\n/**\n * CardAction props schema\n *\n * @see card-prd.md US-1 (Basic Card Container)\n */\nexport const CardActionPropsSchema = BaseComponentPropsSchema.extend({\n  children: z.custom<ReactNode>(),\n});\n\nexport type CardActionProps = z.infer<typeof CardActionPropsSchema>;\n\n/**\n * CVA variants for flip button positioning\n *\n * Provides consistent positioning classes for the flip button\n * based on the flipButtonPosition prop.\n *\n * Buttons are rendered INSIDE both front and back sides so they\n * flip along with the card content for a more natural feel.\n *\n * @see card-prd.md US-5 (Flip Button Position)\n */\nexport const flipButtonPositionVariants = cva(\n  [\n    'absolute z-10 min-h-[44px] min-w-[44px] p-2',\n    'flex items-center justify-center',\n    'rounded-full bg-[var(--accent-background)]',\n    'text-[var(--primary-action)] hover:text-[var(--primary-action-hover)]',\n    'transition-colors duration-200',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]',\n  ],\n  {\n    variants: {\n      position: {\n        'top-right': 'top-2 right-2',\n        'top-left': 'top-2 left-2',\n        'bottom-right': 'bottom-2 right-2',\n        'bottom-left': 'bottom-2 left-2',\n      },\n    },\n    defaultVariants: {\n      position: 'top-right',\n    },\n  }\n);\n","'use client';\n\n/**\n * Card Component (TDD Stub)\n *\n * This is a minimal stub to allow tests to run during the RED phase.\n * Full implementation will be added in the GREEN phase.\n *\n * @see card-prd.md (Product Requirements)\n * @see plan.md (Implementation Plan)\n */\n\nimport { forwardRef, useState, useCallback, type HTMLAttributes, type ReactNode } from 'react';\nimport { RotateCcw } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport { Button } from '../Button';\nimport {\n  flipButtonPositionVariants,\n  type CardProps,\n  type CardHeaderProps,\n  type CardTitleProps,\n  type CardDescriptionProps,\n  type CardContentProps,\n  type CardFooterProps,\n  type CardActionProps,\n} from './Card.types';\n\n// ============================================================================\n// Card (Root Component)\n// ============================================================================\n\nexport const Card = forwardRef<HTMLElement, CardProps & HTMLAttributes<HTMLElement>>(\n  (props, ref) => {\n    const {\n      children,\n      className,\n      flippable = false,\n      backContent,\n      isFlipped: controlledFlipped,\n      defaultFlipped = false,\n      onFlipChange,\n      flipButtonPosition = 'top-right',\n      flipButtonLabel,\n      flipButtonIcon,\n      flipDuration = 600,\n      ...rest\n    } = props;\n\n    // Controlled/uncontrolled state\n    const [internalFlipped, setInternalFlipped] = useState(defaultFlipped);\n    const isControlled = controlledFlipped !== undefined;\n    const flipped = isControlled ? controlledFlipped : internalFlipped;\n\n    const handleFlip = useCallback(() => {\n      const newState = !flipped;\n      if (!isControlled) {\n        setInternalFlipped(newState);\n      }\n      onFlipChange?.(newState);\n    }, [flipped, isControlled, onFlipChange]);\n\n    // Non-flippable card\n    if (!flippable) {\n      return (\n        <article\n          ref={ref}\n          className={cn(\n            'rounded-lg border border-[var(--border)] bg-[var(--content-background)] text-[var(--content-foreground)] shadow-sm',\n            className\n          )}\n          {...rest}\n        >\n          {children}\n        </article>\n      );\n    }\n\n    // Flippable card\n    const showLabel = flipButtonLabel?.show ?? 'Show more details';\n    const hideLabel = flipButtonLabel?.hide ?? 'Show less details';\n\n    // Default icon\n    const defaultIcon = <RotateCcw className=\"h-5 w-5\" aria-hidden=\"true\" />;\n    // Custom icons (back defaults to front if not specified)\n    const frontIcon = flipButtonIcon?.front ?? defaultIcon;\n    const backIcon = flipButtonIcon?.back ?? flipButtonIcon?.front ?? defaultIcon;\n\n    // Flip button component - rendered on both front and back\n    const FlipButton = ({ label, icon }: { label: string; icon: ReactNode }) => (\n      <Button\n        variant=\"ghost\"\n        visualSize=\"icon\"\n        aria-hidden={true}\n        excludeFromTabOrder\n        onPress={handleFlip}\n        className={flipButtonPositionVariants({ position: flipButtonPosition })}\n        aria-label={label}\n      >\n        {icon}\n      </Button>\n    );\n\n    return (\n      <article\n        ref={ref}\n        className={cn('relative', className)}\n        style={{ perspective: '1000px' }}\n        {...rest}\n      >\n        {/* Flipper container - handles 3D transform */}\n        <div\n          className={cn(\n            'relative transition-transform',\n            'motion-reduce:transition-none'\n          )}\n          style={{\n            transformStyle: 'preserve-3d',\n            transitionDuration: `${flipDuration}ms`,\n            transform: flipped ? 'rotateY(180deg)' : 'rotateY(0deg)',\n          }}\n          data-flipped={flipped}\n        >\n          {/* Front side */}\n          <div\n            className=\"relative rounded-lg border border-[var(--border)] bg-[var(--content-background)] text-[var(--content-foreground)] shadow-sm\"\n            style={{ backfaceVisibility: 'hidden' }}\n            data-side=\"front\"\n          >\n            {children}\n            <FlipButton label={showLabel} icon={frontIcon} />\n          </div>\n\n          {/* Back side - scrollable if content overflows */}\n          <div\n            className=\"absolute inset-0 overflow-y-auto rounded-lg border border-[var(--border)] bg-[var(--content-background)] text-[var(--content-foreground)] shadow-sm\"\n            style={{\n              backfaceVisibility: 'hidden',\n              transform: 'rotateY(180deg)',\n            }}\n            data-side=\"back\"\n          >\n            {backContent}\n            <FlipButton label={hideLabel} icon={backIcon} />\n          </div>\n        </div>\n      </article>\n    );\n  }\n);\n\nCard.displayName = 'Card';\n\n// ============================================================================\n// CardHeader\n// ============================================================================\n\nexport const CardHeader = forwardRef<HTMLElement, CardHeaderProps & HTMLAttributes<HTMLElement>>(\n  ({ className, children, ...props }, ref) => (\n    <header\n      ref={ref}\n      className={cn('flex flex-col space-y-1.5 p-6', className)}\n      {...props}\n    >\n      {children}\n    </header>\n  )\n);\n\nCardHeader.displayName = 'CardHeader';\n\n// ============================================================================\n// CardTitle\n// ============================================================================\n\nexport const CardTitle = forwardRef<HTMLHeadingElement, CardTitleProps & HTMLAttributes<HTMLHeadingElement>>(\n  ({ className, as: Comp = 'h3', children, ...props }, ref) => (\n    <Comp\n      ref={ref}\n      className={cn('text-2xl font-semibold leading-none tracking-tight', className)}\n      {...props}\n    >\n      {children}\n    </Comp>\n  )\n);\n\nCardTitle.displayName = 'CardTitle';\n\n// ============================================================================\n// CardDescription\n// ============================================================================\n\nexport const CardDescription = forwardRef<HTMLParagraphElement, CardDescriptionProps & HTMLAttributes<HTMLParagraphElement>>(\n  ({ className, children, ...props }, ref) => (\n    <p\n      ref={ref}\n      className={cn('text-sm text-[var(--content-foreground-muted)]', className)}\n      {...props}\n    >\n      {children}\n    </p>\n  )\n);\n\nCardDescription.displayName = 'CardDescription';\n\n// ============================================================================\n// CardContent\n// ============================================================================\n\nexport const CardContent = forwardRef<HTMLDivElement, CardContentProps & HTMLAttributes<HTMLDivElement>>(\n  ({ className, children, ...props }, ref) => (\n    <div ref={ref} className={cn('p-6 pt-0', className)} {...props}>\n      {children}\n    </div>\n  )\n);\n\nCardContent.displayName = 'CardContent';\n\n// ============================================================================\n// CardFooter\n// ============================================================================\n\nexport const CardFooter = forwardRef<HTMLElement, CardFooterProps & HTMLAttributes<HTMLElement>>(\n  ({ className, children, ...props }, ref) => (\n    <footer\n      ref={ref}\n      className={cn('flex items-center p-6 pt-0', className)}\n      {...props}\n    >\n      {children}\n    </footer>\n  )\n);\n\nCardFooter.displayName = 'CardFooter';\n\n// ============================================================================\n// CardAction\n// ============================================================================\n\nexport const CardAction = forwardRef<HTMLDivElement, CardActionProps & HTMLAttributes<HTMLDivElement>>(\n  ({ className, children, ...props }, ref) => (\n    <div\n      ref={ref}\n      className={cn('ml-auto', className)}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n);\n\nCardAction.displayName = 'CardAction';\n"]}

package/dist/elements/Card/index.mjs

@@ -1,8 +1,3 @@
-export { Card, CardAction, CardActionPropsSchema, CardContent, CardContentPropsSchema, CardDescription, CardDescriptionPropsSchema, CardFooter, CardFooterPropsSchema, CardHeader, CardHeaderPropsSchema, CardPropsSchema, CardTitle, CardTitlePropsSchema, FlipButtonIconSchema, FlipButtonLabelSchema, FlipButtonPositionSchema, flipButtonPositionVariants } from '../../chunk-KPRRBSG6.mjs';
-import '../../chunk-BDXKKMBZ.mjs';
-import '../../chunk-FPKEAJRZ.mjs';
-import '../../chunk-HK46BT5U.mjs';
-import '../../chunk-E2KQFV3O.mjs';
-import '../../chunk-5SVLJN2C.mjs';
-//# sourceMappingURL=index.mjs.map
+"use client";
+import {createContext,memo,forwardRef,useId,useState,useCallback,useContext}from'react';import {Loader2,Zap,RotateCcw}from'lucide-react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {Button}from'react-aria-components';import {cva}from'class-variance-authority';import {jsx,jsxs,Fragment}from'react/jsx-runtime';import {z}from'zod';function n(...e){return twMerge(clsx(e))}var G=cva("inline-flex justify-center min-h-[44px] min-w-[44px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50",{variants:{fullWidth:{true:"w-full",false:""},inVerticalGroup:{true:"items-stretch",false:"items-center"}},defaultVariants:{fullWidth:false,inVerticalGroup:false}}),_=cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 relative cursor-pointer",{variants:{variant:{default:"bg-[var(--primary-action)] text-[var(--primary-action-foreground)] shadow-md hover:bg-[var(--primary-action-hover)] data-[pressed]:bg-[var(--primary-action)]/80",destructive:"bg-[var(--destructive-background)] text-[var(--destructive-foreground)] shadow-md hover:bg-[var(--destructive-background)]/90 data-[pressed]:bg-[var(--destructive-background)]/80",outline:"border border-[var(--input-border)] bg-[var(--page-background)] hover:bg-[var(--input-border)] data-[pressed]:bg-[var(--input-border)]",secondary:"bg-[var(--secondary)] text-[var(--secondary-foreground)] shadow-md hover:bg-[var(--secondary)]/80 data-[pressed]:bg-[var(--secondary)]/70",ghost:"hover:bg-[var(--accent)] hover:text-[var(--accent-foreground)] data-[pressed]:bg-[var(--accent)]",link:"text-[var(--text-link)] underline-offset-4 hover:underline data-[pressed]:text-[var(--text-link-hover)]"},fullWidth:{true:"w-full",false:""},visualSize:{default:"h-10 px-4 py-2",sm:"h-9 rounded-md px-3 text-xs",lg:"h-11 rounded-md px-8",icon:"h-10 w-10",dot:"h-5 w-5 rounded-full p-0 min-h-0 min-w-0"},paywall:{true:"!bg-[var(--paywall)] !text-[var(--paywall-foreground)] !shadow-md hover:!bg-[var(--paywall)]/90 !cursor-not-allowed !border-transparent",false:""}},defaultVariants:{variant:"default",visualSize:"default",paywall:false}});var k="data-[pressed]:scale-[0.97]";var M="data-[hovered]:shadow-md";var L="hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground",F="hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground";var K=createContext(null);K.displayName="ButtonGroupContext";function Q(){return useContext(K)}var X=createContext(null);X.displayName="ButtonGroupItemContext";function tt(){return useContext(X)}cva("inline-flex items-center gap-0",{variants:{orientation:{horizontal:"flex-row",vertical:"flex-col w-full"}},defaultVariants:{orientation:"horizontal"}});var et=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"}});cva("bg-[var(--border)]",{variants:{orientation:{horizontal:"w-px h-6 mx-1",vertical:"h-px w-full my-1"}},defaultVariants:{orientation:"horizontal"}});var I=memo(forwardRef(({className:e,buttonVisualClassName:o,variant:r,size:a,visualSize:h,fullWidth:w,loading:m=false,loadingText:A="Loading...",shortcut:v,children:S,isDisabled:P,paywall:s=false,paywallRedirect:N,paywallDescription:B,onPress:z,...T},x)=>{let p=useId(),c=Q(),H=tt(),R=r??c?.variant??"default",E=a??c?.size,D=P??c?.isDisabled??false,V=c?.orientation==="vertical",C=w||V,f=H?et({orientation:c?.orientation??"horizontal",position:H.position}):"",g=h??E??"default";return process.env.NODE_ENV!=="production"&&(g==="dot"||g==="icon")&&!T["aria-label"]&&!S&&console.warn('[Button] visualSize="dot" or "icon" requires aria-label when no visible text is provided (WCAG 1.1.1)'),jsx(Button,{ref:x,isDisabled:D||m||void 0,"aria-disabled":s?true:void 0,"aria-describedby":s?p:void 0,onPress:y=>{if(s){N&&window.open(N,"_blank","noopener,noreferrer");return}z?.(y);},className:n(G({fullWidth:C,inVerticalGroup:V}),e),...T,children:y=>jsxs("span",{className:n(_({variant:R,visualSize:g,paywall:s,fullWidth:C}),f,o,k,M,L,F),"data-pressed":y.isPressed||void 0,children:[m&&jsxs(Fragment,{children:[jsx(Loader2,{className:"motion-safe:animate-spin","aria-hidden":"true"}),jsx("span",{className:"sr-only","aria-live":"polite",children:A})]}),!m&&S,s&&jsx(Zap,{"data-testid":"zap-icon","aria-hidden":"true",className:"ml-1"}),s&&jsxs("span",{id:p,className:"sr-only",children:["Premium feature: ",B||"Upgrade required to access this feature"]}),y.isFocusVisible&&v&&jsx("kbd",{className:"ml-auto hidden text-xs opacity-60 lg:inline",children:v}),y.isPressed&&jsx("span",{className:"absolute inset-0 rounded-[inherit] bg-current opacity-10 motion-safe:animate-in motion-safe:zoom-in-95","aria-hidden":"true"})]})})}));I.displayName="Button";var l=z.object({className:z.string().optional(),children:z.any().optional(),id:z.string().optional(),"aria-label":z.string().optional(),"aria-labelledby":z.string().optional(),"aria-describedby":z.string().optional(),"aria-live":z.enum(["off","polite","assertive"]).optional(),"aria-hidden":z.boolean().optional(),"data-testid":z.string().optional()});var ot=z.enum(["top-right","top-left","bottom-right","bottom-left"]),rt=z.object({show:z.string().optional(),hide:z.string().optional()}),at=z.object({front:z.custom().optional(),back:z.custom().optional()}),Pt=l.extend({flippable:z.boolean().optional().default(false),backContent:z.custom().optional(),isFlipped:z.boolean().optional(),defaultFlipped:z.boolean().optional().default(false),onFlipChange:z.custom().optional(),flipButtonPosition:ot.optional().default("top-right"),flipButtonLabel:rt.optional(),flipButtonIcon:at.optional(),flipDuration:z.number().optional().default(600)}),Nt=l.extend({children:z.custom()}),Bt=l.extend({as:z.enum(["h1","h2","h3","h4","h5","h6"]).optional().default("h3"),children:z.custom()}),Tt=l.extend({children:z.custom()}),Ht=l.extend({children:z.custom()}),Et=l.extend({children:z.custom()}),Vt=l.extend({children:z.custom()}),W=cva(["absolute z-10 min-h-[44px] min-w-[44px] p-2","flex items-center justify-center","rounded-full bg-[var(--accent-background)]","text-[var(--primary-action)] hover:text-[var(--primary-action-hover)]","transition-colors duration-200","focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]"],{variants:{position:{"top-right":"top-2 right-2","top-left":"top-2 left-2","bottom-right":"bottom-2 right-2","bottom-left":"bottom-2 left-2"}},defaultVariants:{position:"top-right"}});var nt=forwardRef((e,o)=>{let{children:r,className:a,flippable:h=false,backContent:w,isFlipped:m,defaultFlipped:A=false,onFlipChange:v,flipButtonPosition:S="top-right",flipButtonLabel:P,flipButtonIcon:s,flipDuration:N=600,...B}=e,[z,T]=useState(A),x=m!==void 0,p=x?m:z,c=useCallback(()=>{let f=!p;x||T(f),v?.(f);},[p,x,v]);if(!h)return jsx("article",{ref:o,className:n("rounded-lg border border-[var(--border)] bg-[var(--content-background)] text-[var(--content-foreground)] shadow-sm",a),...B,children:r});let H=P?.show??"Show more details",R=P?.hide??"Show less details",E=jsx(RotateCcw,{className:"h-5 w-5","aria-hidden":"true"}),D=s?.front??E,V=s?.back??s?.front??E,C=({label:f,icon:g})=>jsx(I,{variant:"ghost",visualSize:"icon","aria-hidden":true,excludeFromTabOrder:true,onPress:c,className:W({position:S}),"aria-label":f,children:g});return jsx("article",{ref:o,className:n("relative",a),style:{perspective:"1000px"},...B,children:jsxs("div",{className:n("relative transition-transform","motion-reduce:transition-none"),style:{transformStyle:"preserve-3d",transitionDuration:`${N}ms`,transform:p?"rotateY(180deg)":"rotateY(0deg)"},"data-flipped":p,children:[jsxs("div",{className:"relative rounded-lg border border-[var(--border)] bg-[var(--content-background)] text-[var(--content-foreground)] shadow-sm",style:{backfaceVisibility:"hidden"},"data-side":"front",children:[r,jsx(C,{label:H,icon:D})]}),jsxs("div",{className:"absolute inset-0 overflow-y-auto rounded-lg border border-[var(--border)] bg-[var(--content-background)] text-[var(--content-foreground)] shadow-sm",style:{backfaceVisibility:"hidden",transform:"rotateY(180deg)"},"data-side":"back",children:[w,jsx(C,{label:R,icon:V})]})]})})});nt.displayName="Card";var it=forwardRef(({className:e,children:o,...r},a)=>jsx("header",{ref:a,className:n("flex flex-col space-y-1.5 p-6",e),...r,children:o}));it.displayName="CardHeader";var st=forwardRef(({className:e,as:o="h3",children:r,...a},h)=>jsx(o,{ref:h,className:n("text-2xl font-semibold leading-none tracking-tight",e),...a,children:r}));st.displayName="CardTitle";var dt=forwardRef(({className:e,children:o,...r},a)=>jsx("p",{ref:a,className:n("text-sm text-[var(--content-foreground-muted)]",e),...r,children:o}));dt.displayName="CardDescription";var lt=forwardRef(({className:e,children:o,...r},a)=>jsx("div",{ref:a,className:n("p-6 pt-0",e),...r,children:o}));lt.displayName="CardContent";var pt=forwardRef(({className:e,children:o,...r},a)=>jsx("footer",{ref:a,className:n("flex items-center p-6 pt-0",e),...r,children:o}));pt.displayName="CardFooter";var ct=forwardRef(({className:e,children:o,...r},a)=>jsx("div",{ref:a,className:n("ml-auto",e),...r,children:o}));ct.displayName="CardAction";export{nt as Card,ct as CardAction,Vt as CardActionPropsSchema,lt as CardContent,Ht as CardContentPropsSchema,dt as CardDescription,Tt as CardDescriptionPropsSchema,pt as CardFooter,Et as CardFooterPropsSchema,it as CardHeader,Nt as CardHeaderPropsSchema,Pt as CardPropsSchema,st as CardTitle,Bt as CardTitlePropsSchema,at as FlipButtonIconSchema,rt as FlipButtonLabelSchema,ot as FlipButtonPositionSchema,W as flipButtonPositionVariants};//# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map