@tribepad/themis 1.0.1 → 1.0.2

package/dist/elements/Badge/index.js

@@ -1,245 +1,3 @@
 "use client";
-'use strict';
-
-var react = require('react');
-var reactAriaComponents = require('react-aria-components');
-var classVarianceAuthority = require('class-variance-authority');
-var clsx = require('clsx');
-var tailwindMerge = require('tailwind-merge');
-var jsxRuntime = require('react/jsx-runtime');
-var zod = require('zod');
-
-// src/elements/Badge/Badge.tsx
-function cn(...inputs) {
-  return tailwindMerge.twMerge(clsx.clsx(inputs));
-}
-var PRESSED_STYLES = "data-[pressed]:scale-[0.97]";
-var HOVER_STYLES = "data-[hovered]:shadow-md";
-var HIGH_CONTRAST_HOVER = "hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground";
-var HIGH_CONTRAST_PRESSED = "hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground";
-var badgeOuterVariants = classVarianceAuthority.cva(
-  [
-    "relative inline-flex items-center 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-[var(--page-background)]",
-    "disabled:pointer-events-none",
-    "disabled:opacity-50"
-  ],
-  {
-    variants: {},
-    defaultVariants: {}
-  }
-);
-var badgeVisualVariants = classVarianceAuthority.cva(
-  [
-    "inline-flex items-center justify-center",
-    "gap-1",
-    "rounded-full",
-    "font-medium",
-    "whitespace-nowrap",
-    "transition-colors"
-  ],
-  {
-    variants: {
-      variant: {
-        primary: [
-          "bg-[var(--primary-action)]",
-          "text-[var(--primary-action-foreground)]",
-          "hover:bg-[var(--primary-action)]/90",
-          "data-[pressed]:bg-[var(--primary-action)]/80"
-        ],
-        accent: [
-          "bg-[var(--accent-background)]",
-          "text-[var(--accent-foreground)]",
-          "hover:bg-[var(--accent-background)]/90",
-          "data-[pressed]:bg-[var(--accent-background)]/80"
-        ],
-        destructive: [
-          "bg-[var(--destructive-background)]",
-          "text-[var(--destructive-foreground)]",
-          "hover:bg-[var(--destructive-background)]/90",
-          "data-[pressed]:bg-[var(--destructive-background)]/80"
-        ],
-        content: [
-          "bg-[var(--accent-background)]",
-          "text-[var(--accent-foreground)]",
-          "hover:bg-[var(--accent-background)]/90",
-          "data-[pressed]:bg-[var(--accent-background)]/80"
-        ]
-      },
-      size: {
-        sm: "h-5 px-2 text-xs",
-        default: "h-6 px-2.5 text-xs",
-        lg: "h-7 px-3 text-sm"
-      }
-    },
-    defaultVariants: {
-      variant: "primary",
-      size: "default"
-    }
-  }
-);
-var badgeVariants = badgeVisualVariants;
-var iconSizeClasses = {
-  sm: "[&_svg]:h-2.5 [&_svg]:w-2.5",
-  // 10px icons for 20px badge
-  default: "[&_svg]:h-3 [&_svg]:w-3",
-  // 12px icons for 24px badge
-  lg: "[&_svg]:h-3.5 [&_svg]:w-3.5"
-  // 14px icons for 28px badge
-};
-var Badge = react.memo(
-  react.forwardRef(
-    ({
-      className,
-      variant = "primary",
-      size = "default",
-      children,
-      icon,
-      iconPosition = "start",
-      count,
-      onPress,
-      isDisabled,
-      id,
-      "aria-label": ariaLabel,
-      "aria-labelledby": ariaLabelledby,
-      "aria-describedby": ariaDescribedby,
-      "data-testid": dataTestId,
-      ...props
-    }, ref) => {
-      const visualClasses = cn(
-        badgeVisualVariants({ variant, size }),
-        iconSizeClasses[size],
-        className
-      );
-      const hasIcon = !!icon;
-      const hasCount = count !== void 0;
-      const hasChildren = !!children;
-      const multipleElements = [hasIcon, hasCount, hasChildren].filter(Boolean).length > 1;
-      const renderContent = () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        icon && iconPosition === "start" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0", "aria-hidden": "true", children: icon }),
-        children && (multipleElements ? /* @__PURE__ */ jsxRuntime.jsx("span", { children }) : children),
-        count !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono tabular-nums", children: count }),
-        icon && iconPosition === "end" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0", "aria-hidden": "true", children: icon })
-      ] });
-      if (onPress) {
-        return /* @__PURE__ */ jsxRuntime.jsx(
-          reactAriaComponents.Button,
-          {
-            ref,
-            isDisabled,
-            onPress,
-            className: badgeOuterVariants(),
-            id,
-            "aria-label": ariaLabel,
-            "aria-labelledby": ariaLabelledby,
-            "aria-describedby": ariaDescribedby,
-            "data-testid": dataTestId,
-            ...props,
-            children: (renderProps) => /* @__PURE__ */ jsxRuntime.jsx(
-              "span",
-              {
-                className: cn(
-                  visualClasses,
-                  // Interaction styles for visual feedback
-                  PRESSED_STYLES,
-                  HOVER_STYLES,
-                  HIGH_CONTRAST_HOVER,
-                  HIGH_CONTRAST_PRESSED
-                ),
-                "data-pressed": renderProps.isPressed || void 0,
-                children: renderContent()
-              }
-            )
-          }
-        );
-      }
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        "span",
-        {
-          ref,
-          className: visualClasses,
-          id,
-          "aria-label": ariaLabel,
-          "aria-labelledby": ariaLabelledby,
-          "aria-describedby": ariaDescribedby,
-          "data-testid": dataTestId,
-          ...props,
-          children: renderContent()
-        }
-      );
-    }
-  )
-);
-Badge.displayName = "Badge";
-var BaseComponentPropsSchema = zod.z.object({
-  // Styling
-  className: zod.z.string().optional(),
-  // React
-  children: zod.z.any().optional(),
-  // ReactNode not directly supported by Zod
-  id: zod.z.string().optional(),
-  // Accessibility (WCAG 2.2 AA requirements)
-  "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(),
-  // Testing & Development
-  "data-testid": zod.z.string().optional()
-});
-
-// src/elements/Badge/Badge.types.ts
-var BadgeVariantSchema = zod.z.enum([
-  "primary",
-  // Default brand color for general labels
-  "accent",
-  // Highlighted/featured content
-  "destructive",
-  // Errors, warnings, critical states
-  "content"
-  // Neutral/informational content
-]);
-var BadgeSizeSchema = zod.z.enum([
-  "sm",
-  // 20px height
-  "default",
-  // 24px height
-  "lg"
-  // 28px height
-]);
-var BadgeIconPositionSchema = zod.z.enum([
-  "start",
-  // Icon before text (default)
-  "end"
-  // Icon after text (useful for dismiss/close)
-]);
-var BadgePropsSchema = BaseComponentPropsSchema.extend({
-  // Content - override children to be string only for badges
-  children: zod.z.string().optional(),
-  icon: zod.z.custom().optional(),
-  iconPosition: BadgeIconPositionSchema.optional().default("start"),
-  count: zod.z.union([zod.z.number(), zod.z.string()]).optional(),
-  // Variants
-  variant: BadgeVariantSchema.optional().default("primary"),
-  size: BadgeSizeSchema.optional().default("default"),
-  // Interaction - makes badge actionable when provided
-  onPress: zod.z.function().optional(),
-  // React Aria PressEvent handler
-  isDisabled: zod.z.boolean().optional()
-});
-
-exports.Badge = Badge;
-exports.BadgeIconPositionSchema = BadgeIconPositionSchema;
-exports.BadgePropsSchema = BadgePropsSchema;
-exports.BadgeSizeSchema = BadgeSizeSchema;
-exports.BadgeVariantSchema = BadgeVariantSchema;
-exports.badgeOuterVariants = badgeOuterVariants;
-exports.badgeVariants = badgeVariants;
-exports.badgeVisualVariants = badgeVisualVariants;
-//# sourceMappingURL=index.js.map
+'use strict';var react=require('react'),reactAriaComponents=require('react-aria-components'),classVarianceAuthority=require('class-variance-authority'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),jsxRuntime=require('react/jsx-runtime'),zod=require('zod');function c(...i){return tailwindMerge.twMerge(clsx.clsx(i))}var p="data-[pressed]:scale-[0.97]";var l="data-[hovered]:shadow-md";var n="hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground",s="hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground";var N=classVarianceAuthority.cva(["relative inline-flex items-center 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-[var(--page-background)]","disabled:pointer-events-none","disabled:opacity-50"],{variants:{},defaultVariants:{}}),m=classVarianceAuthority.cva(["inline-flex items-center justify-center","gap-1","rounded-full","font-medium","whitespace-nowrap","transition-colors"],{variants:{variant:{primary:["bg-[var(--primary-action)]","text-[var(--primary-action-foreground)]","hover:bg-[var(--primary-action)]/90","data-[pressed]:bg-[var(--primary-action)]/80"],accent:["bg-[var(--accent-background)]","text-[var(--accent-foreground)]","hover:bg-[var(--accent-background)]/90","data-[pressed]:bg-[var(--accent-background)]/80"],destructive:["bg-[var(--destructive-background)]","text-[var(--destructive-foreground)]","hover:bg-[var(--destructive-background)]/90","data-[pressed]:bg-[var(--destructive-background)]/80"],content:["bg-[var(--accent-background)]","text-[var(--accent-foreground)]","hover:bg-[var(--accent-background)]/90","data-[pressed]:bg-[var(--accent-background)]/80"]},size:{sm:"h-5 px-2 text-xs",default:"h-6 px-2.5 text-xs",lg:"h-7 px-3 text-sm"}},defaultVariants:{variant:"primary",size:"default"}}),M=m,U={sm:"[&_svg]:h-2.5 [&_svg]:w-2.5",default:"[&_svg]:h-3 [&_svg]:w-3",lg:"[&_svg]:h-3.5 [&_svg]:w-3.5"},C=react.memo(react.forwardRef(({className:i,variant:A="primary",size:g="default",children:r,icon:o,iconPosition:f="start",count:d,onPress:v,isDisabled:z,id:b,"aria-label":S,"aria-labelledby":h,"aria-describedby":x,"data-testid":B,...E},y)=>{let P=c(m({variant:A,size:g}),U[g],i),L=[!!o,d!==void 0,!!r].filter(Boolean).length>1,T=()=>jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[o&&f==="start"&&jsxRuntime.jsx("span",{className:"shrink-0","aria-hidden":"true",children:o}),r&&(L?jsxRuntime.jsx("span",{children:r}):r),d!==void 0&&jsxRuntime.jsx("span",{className:"font-mono tabular-nums",children:d}),o&&f==="end"&&jsxRuntime.jsx("span",{className:"shrink-0","aria-hidden":"true",children:o})]});return v?jsxRuntime.jsx(reactAriaComponents.Button,{ref:y,isDisabled:z,onPress:v,className:N(),id:b,"aria-label":S,"aria-labelledby":h,"aria-describedby":x,"data-testid":B,...E,children:k=>jsxRuntime.jsx("span",{className:c(P,p,l,n,s),"data-pressed":k.isPressed||void 0,children:T()})}):jsxRuntime.jsx("span",{ref:y,className:P,id:b,"aria-label":S,"aria-labelledby":h,"aria-describedby":x,"data-testid":B,...E,children:T()})}));C.displayName="Badge";var V=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 H=zod.z.enum(["primary","accent","destructive","content"]),I=zod.z.enum(["sm","default","lg"]),O=zod.z.enum(["start","end"]),q=V.extend({children:zod.z.string().optional(),icon:zod.z.custom().optional(),iconPosition:O.optional().default("start"),count:zod.z.union([zod.z.number(),zod.z.string()]).optional(),variant:H.optional().default("primary"),size:I.optional().default("default"),onPress:zod.z.function().optional(),isDisabled:zod.z.boolean().optional()});exports.Badge=C;exports.BadgeIconPositionSchema=O;exports.BadgePropsSchema=q;exports.BadgeSizeSchema=I;exports.BadgeVariantSchema=H;exports.badgeOuterVariants=N;exports.badgeVariants=M;exports.badgeVisualVariants=m;//# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/cn.ts","../../../src/styles/interaction-states.ts","../../../src/elements/Badge/Badge.tsx","../../../src/schemas/BaseComponentProps.ts","../../../src/elements/Badge/Badge.types.ts"],"names":["twMerge","clsx","cva","memo","forwardRef","jsxs","Fragment","jsx","AriaButton","z"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Class Name Utility\n * Merges Tailwind CSS classes with conflict resolution\n *\n * Combines clsx for conditional classes and tailwind-merge for deduplication\n *\n * @example\n * cn('px-2 py-1', 'px-4') // => 'py-1 px-4' (px-4 overrides px-2)\n * cn('text-red-500', condition && 'text-blue-500') // => conditional application\n */\n\nimport { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","/**\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\n/**\n * Badge Component - 2-Layer Architecture for Actionable Badges\n * Accessible badge with React Aria primitives and CVA styling\n *\n * Architecture:\n * - Static badges: Single span element\n * - Actionable badges (with onPress):\n *   - Layer 1: Touch Target (44x44px WCAG AAA compliant, transparent)\n *   - Layer 2: Visual Badge (compact size, colors)\n *\n * @see plan.md for architecture details\n * @see badge-prd.md for requirements\n * @see constitution.md Principle IV (Accessibility First)\n */\n\nimport { forwardRef, memo, type ReactElement } from 'react';\nimport {\n  Button as AriaButton,\n  type ButtonProps as AriaButtonProps,\n} from 'react-aria-components';\nimport { cva } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport {\n  PRESSED_STYLES,\n  HOVER_STYLES,\n  HIGH_CONTRAST_HOVER,\n  HIGH_CONTRAST_PRESSED,\n} from '../../styles/interaction-states';\nimport type { BadgeProps } from './Badge.types';\n\n/**\n * Layer 1: Transparent outer touch target (44x44px minimum)\n * Only used for actionable badges (with onPress)\n * Handles WCAG 2.2 AAA touch target requirement\n * IMPORTANT: Focus ring stays on Layer 1 for AAA compliance (2.4.13)\n */\nexport const badgeOuterVariants = cva(\n  [\n    'relative inline-flex items-center justify-center',\n    'min-h-[44px] min-w-[44px]',\n    'focus-visible:outline-none',\n    'focus-visible:ring-2',\n    'focus-visible:ring-[var(--ring)]',\n    'focus-visible:ring-offset-2',\n    'focus-visible:ring-offset-[var(--page-background)]',\n    'disabled:pointer-events-none',\n    'disabled:opacity-50',\n  ],\n  {\n    variants: {},\n    defaultVariants: {},\n  }\n);\n\n/**\n * Layer 2: Visual Badge appearance\n * Used for all badges (both static and actionable)\n * Provides the visual appearance with configurable size and variant\n * NOTE: NO focus-visible styles here - focus ring is on Layer 1\n */\nexport const badgeVisualVariants = cva(\n  [\n    'inline-flex items-center justify-center',\n    'gap-1',\n    'rounded-full',\n    'font-medium',\n    'whitespace-nowrap',\n    'transition-colors',\n  ],\n  {\n    variants: {\n      variant: {\n        primary: [\n          'bg-[var(--primary-action)]',\n          'text-[var(--primary-action-foreground)]',\n          'hover:bg-[var(--primary-action)]/90',\n          'data-[pressed]:bg-[var(--primary-action)]/80',\n        ],\n        accent: [\n          'bg-[var(--accent-background)]',\n          'text-[var(--accent-foreground)]',\n          'hover:bg-[var(--accent-background)]/90',\n          'data-[pressed]:bg-[var(--accent-background)]/80',\n        ],\n        destructive: [\n          'bg-[var(--destructive-background)]',\n          'text-[var(--destructive-foreground)]',\n          'hover:bg-[var(--destructive-background)]/90',\n          'data-[pressed]:bg-[var(--destructive-background)]/80',\n        ],\n        content: [\n          'bg-[var(--accent-background)]',\n          'text-[var(--accent-foreground)]',\n          'hover:bg-[var(--accent-background)]/90',\n          'data-[pressed]:bg-[var(--accent-background)]/80',\n        ],\n      },\n      size: {\n        sm: 'h-5 px-2 text-xs',\n        default: 'h-6 px-2.5 text-xs',\n        lg: 'h-7 px-3 text-sm',\n      },\n    },\n    defaultVariants: {\n      variant: 'primary',\n      size: 'default',\n    },\n  }\n);\n\n/**\n * @deprecated Use badgeVisualVariants instead. This alias is kept for backward compatibility.\n */\nexport const badgeVariants = badgeVisualVariants;\n\n// Icon size classes mapped to badge sizes\n// Sizes are proportional to badge height: sm=20px, default=24px, lg=28px\nconst iconSizeClasses: Record<NonNullable<BadgeProps['size']>, string> = {\n  sm: '[&_svg]:h-2.5 [&_svg]:w-2.5',      // 10px icons for 20px badge\n  default: '[&_svg]:h-3 [&_svg]:w-3',      // 12px icons for 24px badge\n  lg: '[&_svg]:h-3.5 [&_svg]:w-3.5',       // 14px icons for 28px badge\n};\n\n/**\n * Badge Component - Accessible badge for labels, tags, and status indicators\n *\n * Features:\n * - WCAG 2.2 AAA compliant (7:1 contrast, 44x44px touch targets for actionable)\n * - 4 semantic variants (primary, accent, destructive, content)\n * - 3 sizes (sm, default, lg)\n * - Icon support with configurable position\n * - Count display (number or string)\n * - Static badges (span) vs actionable badges (button)\n */\nconst Badge = memo(\n  forwardRef<HTMLButtonElement | HTMLSpanElement, BadgeProps>(\n    (\n      {\n        className,\n        variant = 'primary',\n        size = 'default',\n        children,\n        icon,\n        iconPosition = 'start',\n        count,\n        onPress,\n        isDisabled,\n        id,\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledby,\n        'aria-describedby': ariaDescribedby,\n        'data-testid': dataTestId,\n        ...props\n      },\n      ref\n    ): ReactElement => {\n      // Visual classes for the badge appearance\n      const visualClasses = cn(\n        badgeVisualVariants({ variant, size }),\n        iconSizeClasses[size],\n        className\n      );\n\n      // Check if we have multiple content elements (need gap styling)\n      const hasIcon = !!icon;\n      const hasCount = count !== undefined;\n      const hasChildren = !!children;\n      const multipleElements =\n        [hasIcon, hasCount, hasChildren].filter(Boolean).length > 1;\n\n      // Content rendering: icon + children + count (all can display together)\n      // Only wrap children in span when there are multiple elements (for gap)\n      const renderContent = (): ReactElement => (\n        <>\n          {icon && iconPosition === 'start' && (\n            <span className=\"shrink-0\" aria-hidden=\"true\">\n              {icon}\n            </span>\n          )}\n          {children && (multipleElements ? <span>{children}</span> : children)}\n          {count !== undefined && (\n            <span className=\"font-mono tabular-nums\">{count}</span>\n          )}\n          {icon && iconPosition === 'end' && (\n            <span className=\"shrink-0\" aria-hidden=\"true\">\n              {icon}\n            </span>\n          )}\n        </>\n      );\n\n      // Actionable badge (with onPress) - uses 2-layer architecture\n      if (onPress) {\n        return (\n          <AriaButton\n            ref={ref as React.Ref<HTMLButtonElement>}\n            isDisabled={isDisabled}\n            onPress={onPress}\n            className={badgeOuterVariants()}\n            id={id}\n            aria-label={ariaLabel}\n            aria-labelledby={ariaLabelledby}\n            aria-describedby={ariaDescribedby}\n            data-testid={dataTestId}\n            {...(props as Omit<AriaButtonProps, 'className'>)}\n          >\n            {(renderProps) => (\n              <span\n                className={cn(\n                  visualClasses,\n                  // Interaction styles for visual feedback\n                  PRESSED_STYLES,\n                  HOVER_STYLES,\n                  HIGH_CONTRAST_HOVER,\n                  HIGH_CONTRAST_PRESSED\n                )}\n                data-pressed={renderProps.isPressed || undefined}\n              >\n                {renderContent()}\n              </span>\n            )}\n          </AriaButton>\n        );\n      }\n\n      // Static badge - simple span element\n      return (\n        <span\n          ref={ref as React.Ref<HTMLSpanElement>}\n          className={visualClasses}\n          id={id}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledby}\n          aria-describedby={ariaDescribedby}\n          data-testid={dataTestId}\n          {...props}\n        >\n          {renderContent()}\n        </span>\n      );\n    }\n  )\n);\n\nBadge.displayName = 'Badge';\n\nexport { Badge };\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 { type ReactNode } from 'react';\nimport { type PressEvent } from 'react-aria-components';\nimport { BaseComponentPropsSchema } from '../../schemas/BaseComponentProps';\n\n/**\n * Badge Component Types\n *\n * Defines the props schema and TypeScript types for the Badge component.\n * Extends BaseComponentPropsSchema for consistent accessibility and styling APIs.\n *\n * @see badge-prd.md for full requirements\n * @see WCAG 2.2 AAA compliance requirements\n */\n\n// Variant schema - semantic color variants\nexport const BadgeVariantSchema = z.enum([\n  'primary', // Default brand color for general labels\n  'accent', // Highlighted/featured content\n  'destructive', // Errors, warnings, critical states\n  'content', // Neutral/informational content\n]);\n\n// Size schema - visual size variants\nexport const BadgeSizeSchema = z.enum([\n  'sm', // 20px height\n  'default', // 24px height\n  'lg', // 28px height\n]);\n\n// Icon position schema\nexport const BadgeIconPositionSchema = z.enum([\n  'start', // Icon before text (default)\n  'end', // Icon after text (useful for dismiss/close)\n]);\n\n// Main props schema extending base component props\nexport const BadgePropsSchema = BaseComponentPropsSchema.extend({\n  // Content - override children to be string only for badges\n  children: z.string().optional(),\n  icon: z.custom<ReactNode>().optional(),\n  iconPosition: BadgeIconPositionSchema.optional().default('start'),\n  count: z.union([z.number(), z.string()]).optional(),\n\n  // Variants\n  variant: BadgeVariantSchema.optional().default('primary'),\n  size: BadgeSizeSchema.optional().default('default'),\n\n  // Interaction - makes badge actionable when provided\n  onPress: z.function().optional(), // React Aria PressEvent handler\n  isDisabled: z.boolean().optional(),\n});\n\n// TypeScript types inferred from schemas\nexport type BadgeVariant = z.infer<typeof BadgeVariantSchema>;\nexport type BadgeSize = z.infer<typeof BadgeSizeSchema>;\nexport type BadgeIconPosition = z.infer<typeof BadgeIconPositionSchema>;\n\n// Base props from Zod schema (excluding onPress which needs proper typing)\ntype BadgePropsBase = Omit<z.infer<typeof BadgePropsSchema>, 'onPress'>;\n\n/**\n * Badge component props interface\n * Uses Zod schema inference for most props, but properly types onPress\n * to match React Aria's PressEvent handler signature\n */\nexport interface BadgeProps extends BadgePropsBase {\n  /** Press handler - makes badge actionable when provided */\n  onPress?: (e: PressEvent) => void;\n}\n"]}
+{"version":3,"sources":["../../../src/utils/cn.ts","../../../src/styles/interaction-states.ts","../../../src/elements/Badge/Badge.tsx","../../../src/schemas/BaseComponentProps.ts","../../../src/elements/Badge/Badge.types.ts"],"names":["cn","inputs","twMerge","clsx","PRESSED_STYLES","HOVER_STYLES","HIGH_CONTRAST_HOVER","HIGH_CONTRAST_PRESSED","badgeOuterVariants","cva","badgeVisualVariants","badgeVariants","iconSizeClasses","Badge","memo","forwardRef","className","variant","size","children","icon","iconPosition","count","onPress","isDisabled","id","ariaLabel","ariaLabelledby","ariaDescribedby","dataTestId","props","ref","visualClasses","multipleElements","renderContent","jsxs","Fragment","jsx","AriaButton","renderProps","BaseComponentPropsSchema","z","BadgeVariantSchema","BadgeSizeSchema","BadgeIconPositionSchema","BadgePropsSchema"],"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","/**\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\n/**\n * Badge Component - 2-Layer Architecture for Actionable Badges\n * Accessible badge with React Aria primitives and CVA styling\n *\n * Architecture:\n * - Static badges: Single span element\n * - Actionable badges (with onPress):\n *   - Layer 1: Touch Target (44x44px WCAG AAA compliant, transparent)\n *   - Layer 2: Visual Badge (compact size, colors)\n *\n * @see plan.md for architecture details\n * @see badge-prd.md for requirements\n * @see constitution.md Principle IV (Accessibility First)\n */\n\nimport { forwardRef, memo, type ReactElement } from 'react';\nimport {\n  Button as AriaButton,\n  type ButtonProps as AriaButtonProps,\n} from 'react-aria-components';\nimport { cva } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport {\n  PRESSED_STYLES,\n  HOVER_STYLES,\n  HIGH_CONTRAST_HOVER,\n  HIGH_CONTRAST_PRESSED,\n} from '../../styles/interaction-states';\nimport type { BadgeProps } from './Badge.types';\n\n/**\n * Layer 1: Transparent outer touch target (44x44px minimum)\n * Only used for actionable badges (with onPress)\n * Handles WCAG 2.2 AAA touch target requirement\n * IMPORTANT: Focus ring stays on Layer 1 for AAA compliance (2.4.13)\n */\nexport const badgeOuterVariants = cva(\n  [\n    'relative inline-flex items-center justify-center',\n    'min-h-[44px] min-w-[44px]',\n    'focus-visible:outline-none',\n    'focus-visible:ring-2',\n    'focus-visible:ring-[var(--ring)]',\n    'focus-visible:ring-offset-2',\n    'focus-visible:ring-offset-[var(--page-background)]',\n    'disabled:pointer-events-none',\n    'disabled:opacity-50',\n  ],\n  {\n    variants: {},\n    defaultVariants: {},\n  }\n);\n\n/**\n * Layer 2: Visual Badge appearance\n * Used for all badges (both static and actionable)\n * Provides the visual appearance with configurable size and variant\n * NOTE: NO focus-visible styles here - focus ring is on Layer 1\n */\nexport const badgeVisualVariants = cva(\n  [\n    'inline-flex items-center justify-center',\n    'gap-1',\n    'rounded-full',\n    'font-medium',\n    'whitespace-nowrap',\n    'transition-colors',\n  ],\n  {\n    variants: {\n      variant: {\n        primary: [\n          'bg-[var(--primary-action)]',\n          'text-[var(--primary-action-foreground)]',\n          'hover:bg-[var(--primary-action)]/90',\n          'data-[pressed]:bg-[var(--primary-action)]/80',\n        ],\n        accent: [\n          'bg-[var(--accent-background)]',\n          'text-[var(--accent-foreground)]',\n          'hover:bg-[var(--accent-background)]/90',\n          'data-[pressed]:bg-[var(--accent-background)]/80',\n        ],\n        destructive: [\n          'bg-[var(--destructive-background)]',\n          'text-[var(--destructive-foreground)]',\n          'hover:bg-[var(--destructive-background)]/90',\n          'data-[pressed]:bg-[var(--destructive-background)]/80',\n        ],\n        content: [\n          'bg-[var(--accent-background)]',\n          'text-[var(--accent-foreground)]',\n          'hover:bg-[var(--accent-background)]/90',\n          'data-[pressed]:bg-[var(--accent-background)]/80',\n        ],\n      },\n      size: {\n        sm: 'h-5 px-2 text-xs',\n        default: 'h-6 px-2.5 text-xs',\n        lg: 'h-7 px-3 text-sm',\n      },\n    },\n    defaultVariants: {\n      variant: 'primary',\n      size: 'default',\n    },\n  }\n);\n\n/**\n * @deprecated Use badgeVisualVariants instead. This alias is kept for backward compatibility.\n */\nexport const badgeVariants = badgeVisualVariants;\n\n// Icon size classes mapped to badge sizes\n// Sizes are proportional to badge height: sm=20px, default=24px, lg=28px\nconst iconSizeClasses: Record<NonNullable<BadgeProps['size']>, string> = {\n  sm: '[&_svg]:h-2.5 [&_svg]:w-2.5',      // 10px icons for 20px badge\n  default: '[&_svg]:h-3 [&_svg]:w-3',      // 12px icons for 24px badge\n  lg: '[&_svg]:h-3.5 [&_svg]:w-3.5',       // 14px icons for 28px badge\n};\n\n/**\n * Badge Component - Accessible badge for labels, tags, and status indicators\n *\n * Features:\n * - WCAG 2.2 AAA compliant (7:1 contrast, 44x44px touch targets for actionable)\n * - 4 semantic variants (primary, accent, destructive, content)\n * - 3 sizes (sm, default, lg)\n * - Icon support with configurable position\n * - Count display (number or string)\n * - Static badges (span) vs actionable badges (button)\n */\nconst Badge = memo(\n  forwardRef<HTMLButtonElement | HTMLSpanElement, BadgeProps>(\n    (\n      {\n        className,\n        variant = 'primary',\n        size = 'default',\n        children,\n        icon,\n        iconPosition = 'start',\n        count,\n        onPress,\n        isDisabled,\n        id,\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledby,\n        'aria-describedby': ariaDescribedby,\n        'data-testid': dataTestId,\n        ...props\n      },\n      ref\n    ): ReactElement => {\n      // Visual classes for the badge appearance\n      const visualClasses = cn(\n        badgeVisualVariants({ variant, size }),\n        iconSizeClasses[size],\n        className\n      );\n\n      // Check if we have multiple content elements (need gap styling)\n      const hasIcon = !!icon;\n      const hasCount = count !== undefined;\n      const hasChildren = !!children;\n      const multipleElements =\n        [hasIcon, hasCount, hasChildren].filter(Boolean).length > 1;\n\n      // Content rendering: icon + children + count (all can display together)\n      // Only wrap children in span when there are multiple elements (for gap)\n      const renderContent = (): ReactElement => (\n        <>\n          {icon && iconPosition === 'start' && (\n            <span className=\"shrink-0\" aria-hidden=\"true\">\n              {icon}\n            </span>\n          )}\n          {children && (multipleElements ? <span>{children}</span> : children)}\n          {count !== undefined && (\n            <span className=\"font-mono tabular-nums\">{count}</span>\n          )}\n          {icon && iconPosition === 'end' && (\n            <span className=\"shrink-0\" aria-hidden=\"true\">\n              {icon}\n            </span>\n          )}\n        </>\n      );\n\n      // Actionable badge (with onPress) - uses 2-layer architecture\n      if (onPress) {\n        return (\n          <AriaButton\n            ref={ref as React.Ref<HTMLButtonElement>}\n            isDisabled={isDisabled}\n            onPress={onPress}\n            className={badgeOuterVariants()}\n            id={id}\n            aria-label={ariaLabel}\n            aria-labelledby={ariaLabelledby}\n            aria-describedby={ariaDescribedby}\n            data-testid={dataTestId}\n            {...(props as Omit<AriaButtonProps, 'className'>)}\n          >\n            {(renderProps) => (\n              <span\n                className={cn(\n                  visualClasses,\n                  // Interaction styles for visual feedback\n                  PRESSED_STYLES,\n                  HOVER_STYLES,\n                  HIGH_CONTRAST_HOVER,\n                  HIGH_CONTRAST_PRESSED\n                )}\n                data-pressed={renderProps.isPressed || undefined}\n              >\n                {renderContent()}\n              </span>\n            )}\n          </AriaButton>\n        );\n      }\n\n      // Static badge - simple span element\n      return (\n        <span\n          ref={ref as React.Ref<HTMLSpanElement>}\n          className={visualClasses}\n          id={id}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledby}\n          aria-describedby={ariaDescribedby}\n          data-testid={dataTestId}\n          {...props}\n        >\n          {renderContent()}\n        </span>\n      );\n    }\n  )\n);\n\nBadge.displayName = 'Badge';\n\nexport { Badge };\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 { type ReactNode } from 'react';\nimport { type PressEvent } from 'react-aria-components';\nimport { BaseComponentPropsSchema } from '../../schemas/BaseComponentProps';\n\n/**\n * Badge Component Types\n *\n * Defines the props schema and TypeScript types for the Badge component.\n * Extends BaseComponentPropsSchema for consistent accessibility and styling APIs.\n *\n * @see badge-prd.md for full requirements\n * @see WCAG 2.2 AAA compliance requirements\n */\n\n// Variant schema - semantic color variants\nexport const BadgeVariantSchema = z.enum([\n  'primary', // Default brand color for general labels\n  'accent', // Highlighted/featured content\n  'destructive', // Errors, warnings, critical states\n  'content', // Neutral/informational content\n]);\n\n// Size schema - visual size variants\nexport const BadgeSizeSchema = z.enum([\n  'sm', // 20px height\n  'default', // 24px height\n  'lg', // 28px height\n]);\n\n// Icon position schema\nexport const BadgeIconPositionSchema = z.enum([\n  'start', // Icon before text (default)\n  'end', // Icon after text (useful for dismiss/close)\n]);\n\n// Main props schema extending base component props\nexport const BadgePropsSchema = BaseComponentPropsSchema.extend({\n  // Content - override children to be string only for badges\n  children: z.string().optional(),\n  icon: z.custom<ReactNode>().optional(),\n  iconPosition: BadgeIconPositionSchema.optional().default('start'),\n  count: z.union([z.number(), z.string()]).optional(),\n\n  // Variants\n  variant: BadgeVariantSchema.optional().default('primary'),\n  size: BadgeSizeSchema.optional().default('default'),\n\n  // Interaction - makes badge actionable when provided\n  onPress: z.function().optional(), // React Aria PressEvent handler\n  isDisabled: z.boolean().optional(),\n});\n\n// TypeScript types inferred from schemas\nexport type BadgeVariant = z.infer<typeof BadgeVariantSchema>;\nexport type BadgeSize = z.infer<typeof BadgeSizeSchema>;\nexport type BadgeIconPosition = z.infer<typeof BadgeIconPositionSchema>;\n\n// Base props from Zod schema (excluding onPress which needs proper typing)\ntype BadgePropsBase = Omit<z.infer<typeof BadgePropsSchema>, 'onPress'>;\n\n/**\n * Badge component props interface\n * Uses Zod schema inference for most props, but properly types onPress\n * to match React Aria's PressEvent handler signature\n */\nexport interface BadgeProps extends BadgePropsBase {\n  /** Press handler - makes badge actionable when provided */\n  onPress?: (e: PressEvent) => void;\n}\n"]}

package/dist/elements/Badge/index.mjs

@@ -1,236 +1,3 @@
 "use client";
-import { memo, forwardRef } from 'react';
-import { Button } from 'react-aria-components';
-import { cva } from 'class-variance-authority';
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { z } from 'zod';
-
-// src/elements/Badge/Badge.tsx
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-var PRESSED_STYLES = "data-[pressed]:scale-[0.97]";
-var HOVER_STYLES = "data-[hovered]:shadow-md";
-var HIGH_CONTRAST_HOVER = "hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground";
-var HIGH_CONTRAST_PRESSED = "hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground";
-var badgeOuterVariants = cva(
-  [
-    "relative inline-flex items-center 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-[var(--page-background)]",
-    "disabled:pointer-events-none",
-    "disabled:opacity-50"
-  ],
-  {
-    variants: {},
-    defaultVariants: {}
-  }
-);
-var badgeVisualVariants = cva(
-  [
-    "inline-flex items-center justify-center",
-    "gap-1",
-    "rounded-full",
-    "font-medium",
-    "whitespace-nowrap",
-    "transition-colors"
-  ],
-  {
-    variants: {
-      variant: {
-        primary: [
-          "bg-[var(--primary-action)]",
-          "text-[var(--primary-action-foreground)]",
-          "hover:bg-[var(--primary-action)]/90",
-          "data-[pressed]:bg-[var(--primary-action)]/80"
-        ],
-        accent: [
-          "bg-[var(--accent-background)]",
-          "text-[var(--accent-foreground)]",
-          "hover:bg-[var(--accent-background)]/90",
-          "data-[pressed]:bg-[var(--accent-background)]/80"
-        ],
-        destructive: [
-          "bg-[var(--destructive-background)]",
-          "text-[var(--destructive-foreground)]",
-          "hover:bg-[var(--destructive-background)]/90",
-          "data-[pressed]:bg-[var(--destructive-background)]/80"
-        ],
-        content: [
-          "bg-[var(--accent-background)]",
-          "text-[var(--accent-foreground)]",
-          "hover:bg-[var(--accent-background)]/90",
-          "data-[pressed]:bg-[var(--accent-background)]/80"
-        ]
-      },
-      size: {
-        sm: "h-5 px-2 text-xs",
-        default: "h-6 px-2.5 text-xs",
-        lg: "h-7 px-3 text-sm"
-      }
-    },
-    defaultVariants: {
-      variant: "primary",
-      size: "default"
-    }
-  }
-);
-var badgeVariants = badgeVisualVariants;
-var iconSizeClasses = {
-  sm: "[&_svg]:h-2.5 [&_svg]:w-2.5",
-  // 10px icons for 20px badge
-  default: "[&_svg]:h-3 [&_svg]:w-3",
-  // 12px icons for 24px badge
-  lg: "[&_svg]:h-3.5 [&_svg]:w-3.5"
-  // 14px icons for 28px badge
-};
-var Badge = memo(
-  forwardRef(
-    ({
-      className,
-      variant = "primary",
-      size = "default",
-      children,
-      icon,
-      iconPosition = "start",
-      count,
-      onPress,
-      isDisabled,
-      id,
-      "aria-label": ariaLabel,
-      "aria-labelledby": ariaLabelledby,
-      "aria-describedby": ariaDescribedby,
-      "data-testid": dataTestId,
-      ...props
-    }, ref) => {
-      const visualClasses = cn(
-        badgeVisualVariants({ variant, size }),
-        iconSizeClasses[size],
-        className
-      );
-      const hasIcon = !!icon;
-      const hasCount = count !== void 0;
-      const hasChildren = !!children;
-      const multipleElements = [hasIcon, hasCount, hasChildren].filter(Boolean).length > 1;
-      const renderContent = () => /* @__PURE__ */ jsxs(Fragment, { children: [
-        icon && iconPosition === "start" && /* @__PURE__ */ jsx("span", { className: "shrink-0", "aria-hidden": "true", children: icon }),
-        children && (multipleElements ? /* @__PURE__ */ jsx("span", { children }) : children),
-        count !== void 0 && /* @__PURE__ */ jsx("span", { className: "font-mono tabular-nums", children: count }),
-        icon && iconPosition === "end" && /* @__PURE__ */ jsx("span", { className: "shrink-0", "aria-hidden": "true", children: icon })
-      ] });
-      if (onPress) {
-        return /* @__PURE__ */ jsx(
-          Button,
-          {
-            ref,
-            isDisabled,
-            onPress,
-            className: badgeOuterVariants(),
-            id,
-            "aria-label": ariaLabel,
-            "aria-labelledby": ariaLabelledby,
-            "aria-describedby": ariaDescribedby,
-            "data-testid": dataTestId,
-            ...props,
-            children: (renderProps) => /* @__PURE__ */ jsx(
-              "span",
-              {
-                className: cn(
-                  visualClasses,
-                  // Interaction styles for visual feedback
-                  PRESSED_STYLES,
-                  HOVER_STYLES,
-                  HIGH_CONTRAST_HOVER,
-                  HIGH_CONTRAST_PRESSED
-                ),
-                "data-pressed": renderProps.isPressed || void 0,
-                children: renderContent()
-              }
-            )
-          }
-        );
-      }
-      return /* @__PURE__ */ jsx(
-        "span",
-        {
-          ref,
-          className: visualClasses,
-          id,
-          "aria-label": ariaLabel,
-          "aria-labelledby": ariaLabelledby,
-          "aria-describedby": ariaDescribedby,
-          "data-testid": dataTestId,
-          ...props,
-          children: renderContent()
-        }
-      );
-    }
-  )
-);
-Badge.displayName = "Badge";
-var BaseComponentPropsSchema = z.object({
-  // Styling
-  className: z.string().optional(),
-  // React
-  children: z.any().optional(),
-  // ReactNode not directly supported by Zod
-  id: z.string().optional(),
-  // Accessibility (WCAG 2.2 AA requirements)
-  "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(),
-  // Testing & Development
-  "data-testid": z.string().optional()
-});
-
-// src/elements/Badge/Badge.types.ts
-var BadgeVariantSchema = z.enum([
-  "primary",
-  // Default brand color for general labels
-  "accent",
-  // Highlighted/featured content
-  "destructive",
-  // Errors, warnings, critical states
-  "content"
-  // Neutral/informational content
-]);
-var BadgeSizeSchema = z.enum([
-  "sm",
-  // 20px height
-  "default",
-  // 24px height
-  "lg"
-  // 28px height
-]);
-var BadgeIconPositionSchema = z.enum([
-  "start",
-  // Icon before text (default)
-  "end"
-  // Icon after text (useful for dismiss/close)
-]);
-var BadgePropsSchema = BaseComponentPropsSchema.extend({
-  // Content - override children to be string only for badges
-  children: z.string().optional(),
-  icon: z.custom().optional(),
-  iconPosition: BadgeIconPositionSchema.optional().default("start"),
-  count: z.union([z.number(), z.string()]).optional(),
-  // Variants
-  variant: BadgeVariantSchema.optional().default("primary"),
-  size: BadgeSizeSchema.optional().default("default"),
-  // Interaction - makes badge actionable when provided
-  onPress: z.function().optional(),
-  // React Aria PressEvent handler
-  isDisabled: z.boolean().optional()
-});
-
-export { Badge, BadgeIconPositionSchema, BadgePropsSchema, BadgeSizeSchema, BadgeVariantSchema, badgeOuterVariants, badgeVariants, badgeVisualVariants };
-//# sourceMappingURL=index.mjs.map
+import {memo,forwardRef}from'react';import {Button}from'react-aria-components';import {cva}from'class-variance-authority';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {jsx,jsxs,Fragment}from'react/jsx-runtime';import {z}from'zod';function c(...i){return twMerge(clsx(i))}var p="data-[pressed]:scale-[0.97]";var l="data-[hovered]:shadow-md";var n="hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground",s="hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground";var N=cva(["relative inline-flex items-center 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-[var(--page-background)]","disabled:pointer-events-none","disabled:opacity-50"],{variants:{},defaultVariants:{}}),m=cva(["inline-flex items-center justify-center","gap-1","rounded-full","font-medium","whitespace-nowrap","transition-colors"],{variants:{variant:{primary:["bg-[var(--primary-action)]","text-[var(--primary-action-foreground)]","hover:bg-[var(--primary-action)]/90","data-[pressed]:bg-[var(--primary-action)]/80"],accent:["bg-[var(--accent-background)]","text-[var(--accent-foreground)]","hover:bg-[var(--accent-background)]/90","data-[pressed]:bg-[var(--accent-background)]/80"],destructive:["bg-[var(--destructive-background)]","text-[var(--destructive-foreground)]","hover:bg-[var(--destructive-background)]/90","data-[pressed]:bg-[var(--destructive-background)]/80"],content:["bg-[var(--accent-background)]","text-[var(--accent-foreground)]","hover:bg-[var(--accent-background)]/90","data-[pressed]:bg-[var(--accent-background)]/80"]},size:{sm:"h-5 px-2 text-xs",default:"h-6 px-2.5 text-xs",lg:"h-7 px-3 text-sm"}},defaultVariants:{variant:"primary",size:"default"}}),M=m,U={sm:"[&_svg]:h-2.5 [&_svg]:w-2.5",default:"[&_svg]:h-3 [&_svg]:w-3",lg:"[&_svg]:h-3.5 [&_svg]:w-3.5"},C=memo(forwardRef(({className:i,variant:A="primary",size:g="default",children:r,icon:o,iconPosition:f="start",count:d,onPress:v,isDisabled:z,id:b,"aria-label":S,"aria-labelledby":h,"aria-describedby":x,"data-testid":B,...E},y)=>{let P=c(m({variant:A,size:g}),U[g],i),L=[!!o,d!==void 0,!!r].filter(Boolean).length>1,T=()=>jsxs(Fragment,{children:[o&&f==="start"&&jsx("span",{className:"shrink-0","aria-hidden":"true",children:o}),r&&(L?jsx("span",{children:r}):r),d!==void 0&&jsx("span",{className:"font-mono tabular-nums",children:d}),o&&f==="end"&&jsx("span",{className:"shrink-0","aria-hidden":"true",children:o})]});return v?jsx(Button,{ref:y,isDisabled:z,onPress:v,className:N(),id:b,"aria-label":S,"aria-labelledby":h,"aria-describedby":x,"data-testid":B,...E,children:k=>jsx("span",{className:c(P,p,l,n,s),"data-pressed":k.isPressed||void 0,children:T()})}):jsx("span",{ref:y,className:P,id:b,"aria-label":S,"aria-labelledby":h,"aria-describedby":x,"data-testid":B,...E,children:T()})}));C.displayName="Badge";var V=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 H=z.enum(["primary","accent","destructive","content"]),I=z.enum(["sm","default","lg"]),O=z.enum(["start","end"]),q=V.extend({children:z.string().optional(),icon:z.custom().optional(),iconPosition:O.optional().default("start"),count:z.union([z.number(),z.string()]).optional(),variant:H.optional().default("primary"),size:I.optional().default("default"),onPress:z.function().optional(),isDisabled:z.boolean().optional()});export{C as Badge,O as BadgeIconPositionSchema,q as BadgePropsSchema,I as BadgeSizeSchema,H as BadgeVariantSchema,N as badgeOuterVariants,M as badgeVariants,m as badgeVisualVariants};//# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map