{"version":3,"sources":["../src/segmented/index.tsx"],"names":["useTheme","jsxs","radius","jsx","spacing"],"mappings":"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","file":"segmented.cjs","sourcesContent":["/**\n * Segmented (web). A compact single-select control — a row of segments\n * with one active. For 2–4 mutually exclusive views (Review / Pack,\n * Edit / Score / Preview, theme mode). Sliding highlight tracks the\n * selection.\n *\n *   <Segmented value={tab} onChange={setTab}\n *     options={[{label:\"Review\",value:\"review\"},{label:\"Pack\",value:\"pack\"}]} />\n */\nimport { type CSSProperties } from \"react\";\nimport { useTheme } from \"@plyxui/styles\";\nimport { radius, spacing } from \"@plyxui/core\";\n\nexport type SegmentedSize = \"sm\" | \"md\";\n\nexport interface SegmentedOption<T extends string = string> {\n  label: string;\n  value: T;\n  disabled?: boolean;\n}\n\nexport interface SegmentedProps<T extends string = string> {\n  options: SegmentedOption<T>[];\n  value: T;\n  onChange: (value: T) => void;\n  size?: SegmentedSize;\n  fullWidth?: boolean;\n  className?: string;\n  style?: CSSProperties;\n}\n\nconst heightMap: Record<SegmentedSize, number> = { sm: 30, md: 36 };\n\nexport function Segmented<T extends string = string>({\n  options,\n  value,\n  onChange,\n  size = \"md\",\n  fullWidth,\n  className,\n  style,\n}: SegmentedProps<T>) {\n  const { colors } = useTheme();\n  const idx = Math.max(0, options.findIndex((o) => o.value === value));\n  const h = heightMap[size];\n\n  return (\n    <div\n      className={className}\n      role=\"tablist\"\n      style={{\n        position: \"relative\",\n        display: fullWidth ? \"grid\" : \"inline-grid\",\n        gridTemplateColumns: `repeat(${options.length}, ${fullWidth ? \"1fr\" : \"minmax(64px, auto)\"})`,\n        padding: 3,\n        gap: 0,\n        height: h,\n        background: colors.containerFill,\n        borderRadius: radius.md,\n        ...style,\n      }}\n    >\n      {/* sliding highlight */}\n      <span\n        aria-hidden\n        style={{\n          position: \"absolute\",\n          top: 3,\n          left: 3,\n          bottom: 3,\n          width: `calc((100% - 6px) / ${options.length})`,\n          transform: `translateX(${idx * 100}%)`,\n          background: colors.surfaceFill,\n          borderRadius: radius.sm,\n          boxShadow: \"0 1px 2px rgba(0,0,0,.08)\",\n          transition: \"transform 0.22s cubic-bezier(0.23,1,0.32,1)\",\n        }}\n      />\n      {options.map((o) => {\n        const active = o.value === value;\n        return (\n          <button\n            key={o.value}\n            type=\"button\"\n            role=\"tab\"\n            aria-selected={active}\n            disabled={o.disabled}\n            onClick={() => !o.disabled && onChange(o.value)}\n            style={{\n              position: \"relative\",\n              zIndex: 1,\n              background: \"transparent\",\n              border: \"none\",\n              cursor: o.disabled ? \"default\" : \"pointer\",\n              padding: `0 ${spacing[3]}px`,\n              font: \"inherit\",\n              fontSize: size === \"sm\" ? 12.5 : 13.5,\n              fontWeight: 600,\n              color: active ? colors.text : colors.textMuted,\n              opacity: o.disabled ? 0.5 : 1,\n              transition: \"color 0.2s ease\",\n              whiteSpace: \"nowrap\",\n            }}\n          >\n            {o.label}\n          </button>\n        );\n      })}\n    </div>\n  );\n}\n"]}