https://railsblocks.com/assets/controllers/os_detect_controller-fd…7cea42ecae29e5274b63efb666e29b57e8215557.js

1import { Controller } from "@hotwired/stimulus";
2
3export default class extends Controller {
4  static targets = ["mac", "nonMac"];
5
6  connect() {
7    this.detectOS();
8  }
9
10  detectOS() {
11    const isMac = this.#isMac();
12
13    // Show/hide mac-specific elements
14    this.macTargets.forEach((el) => {
15      el.classList.toggle("hidden", !isMac);
16    });
17
18    // Show/hide non-mac elements
19    this.nonMacTargets.forEach((el) => {
20      el.classList.toggle("hidden", isMac);
21    });
22  }
23
24  #isMac() {
25    // Use modern userAgentData API when available
26    if (navigator.userAgentData && navigator.userAgentData.platform) {
27      return navigator.userAgentData.platform === "macOS";
28    }
29
30    // Fallback to userAgent detection
31    return /Mac|iPhone|iPad|iPod/.test(navigator.userAgent);
32  }
33};