(function() {
  var useRef = React.useRef;
  var useEffect = React.useEffect;
  var useGlassAdaptivity = window.useGlassAdaptivity;

  function assignRef(ref, value) {
    if (!ref) return;
    if (typeof ref === 'function') ref(value);
    else { try { ref.current = value; } catch (e) {} }
  }

  var GlassSurface = React.forwardRef(function GlassSurface(props, forwardedRef) {
    var elevation = props.elevation != null ? props.elevation : 1;
    var radius = props.radius || 'md';
    var tone = props.chrome ? 'dark' : (props.tone || 'adaptive');
    var chrome = props.chrome;
    var interactive = props.interactive;
    var className = props.className || '';
    var style = props.style || {};
    var onClick = props.onClick;
    var onKeyDown = props.onKeyDown;
    var onMouseEnter = props.onMouseEnter;
    var onMouseLeave = props.onMouseLeave;
    var onMouseDown = props.onMouseDown;
    var onMouseUp = props.onMouseUp;
    var role = props.role;
    var tabIndex = props.tabIndex;
    var ariaLabel = props['aria-label'];
    var dataTour = props['data-tour'];
    var children = props.children;
    var as = props.as || 'div';
    var id = props.id;
    var type = props.type;
    var disabled = props.disabled;

    var doAdapt = !chrome && tone === 'adaptive';
    var rootRef = useRef(null);

    // Observe the backdrop luminance directly on the mounted node.
    // (The old useGlassAdaptivity indirection read its ref before this
    //  component populated it, so observe() always saw null → adaptivity
    //  never engaged and glass stayed at the opaque dark default.)
    useEffect(function() {
      var el = rootRef.current;
      assignRef(forwardedRef, el);
      var observing = false;
      if (doAdapt && el && window.GlassLuminance) {
        window.GlassLuminance.observe(el);
        observing = true;
      }
      return function() {
        if (observing && window.GlassLuminance) window.GlassLuminance.unobserve(el);
        assignRef(forwardedRef, null);
      };
    }, [doAdapt]);

    var classes = 'glass' +
      (chrome ? ' glass-chrome' : '') +
      (interactive ? ' glass-interactive' : '') +
      (disabled ? ' glass-disabled' : '') +
      (className ? ' ' + className : '');

    var attrs = {
      ref: rootRef,
      id: id,
      className: classes,
      'data-elevation': elevation,
      'data-radius': radius,
      'data-tone': tone,
      style: style,
      onClick: disabled ? undefined : onClick,
      onKeyDown: onKeyDown,
      onMouseEnter: onMouseEnter,
      onMouseLeave: onMouseLeave,
      onMouseDown: onMouseDown,
      onMouseUp: onMouseUp,
      role: role,
      tabIndex: tabIndex,
      'aria-label': ariaLabel,
      'data-tour': dataTour,
      disabled: as === 'button' ? disabled : undefined,
      type: as === 'button' ? type : undefined
    };

    return React.createElement(as, attrs,
      React.createElement('div', { className: 'glass-bg' + (chrome ? ' glass-bg-chrome' : ''), 'aria-hidden': true }),
      !chrome && React.createElement('div', { className: 'glass-diffuse', 'aria-hidden': true }),
      !chrome && React.createElement('div', { className: 'glass-edge', 'aria-hidden': true }),
      React.createElement('div', { className: 'glass-content' }, children)
    );
  });

  GlassSurface.displayName = 'GlassSurface';
  window.GlassSurface = GlassSurface;
})();