@amazon-devices/kepler-graphics

import {
    Display,
    DisplayManager,
    DisplayController,
    ColorDepth,
    ColorSpace,
    HdcpLevel,
    HdrType,
    LlmState,
    HdrMode,
    IDisplayConfig,
    IDisplayListener,
    IDisplayControllerListener,
    ISubscription
} from '@amazon-devices/kepler-graphics';

const displayConnected = DisplayController.isPrimaryDisplayConnected();
if (displayConnected) {
    // Perform operations on the display.
} else {
    // Display is not connected, Do NOT use the `Display` and `DisplayManager` methods.
    // In this case, the hotplug event callbacks can be used to know
    // when a new display is connected.
}

const displayControllerListener: IDisplayControllerListener = {

    onAddDisplay: (id: Int32) => {
      console.log("IDisplayControllerListener::onAddDisplay - ", id);
      // Any initialization when new display is connected.
    },
    onRemoveDisplay: (id: Int32) => {
      console.log("IDisplayControllerListener::onRemoveDisplay - ", id);
      // Any cleanup required.
      // Please note the `Display` and `DisplayManager` methods do not work
      // when the display is disconnected.
    },
  };

// Register the listener callback object to receive events.
const subscription: ISubscription = DisplayController.addListener(displayControllerListener);

// Get currently active display config.
const displayConfig = Display.getCurrentConfig();
// Current width in pixels.
const width = displayConfig.widthInPixels;
// Current height in pixels.
const height = displayConfig.heightInPixels;
// Screen Density in DPI (dots-per-inch).
const dpi = displayConfig.screenDensityInDpi;

// Current refresh rate in milli hz (eg: 60000 = 60Hz).
const currentRefreshRate = Display.getCurrentRefreshRateInMillihertz();

// Checks if the display along with device supports any of the HDR formats.
const hdrSupport = Display.isHDRSupported();

// Get the current user selected HDR mode - possible values are in 'enum HdrMode'.
const hdrMode = Display.getHdrMode();

if (hdrSupport && (hdrMode !== HdrMode.DISABLED)) {
    // HDR is supported.
    // Now get the current configuration to check if required HDR format is supported.
    const displayConfig = Display.getCurrentConfig();
    for (const hdrType of displayConfig.supportedHdrType) {
        if (hdrType === HdrType.HDR10) {
            // HDR10 supported.
        } else if (hdrType === HdrType.HDR10_PLUS) {
            // HDR10+ supported.
        } else if (hdrType === HdrType.HLG) {
            // HLG supported.
        } else if (hdrType == HdrType.DOLBY_VISION) {
            // Dolby Vision supported.
        }
    }
} else {
    // HDR is not supported or disabled by user.
}

// Query the display connector name.
const name = Display.getName();

// Get current HDCP level - possible values are in 'enum HdcpLevel'.
const hdcpLevel = Display.getCurrentHdcpLevel();

// Get current color depth - possible values are in 'enum ColorDepth'.
const colorDepth = Display.getColorDepth();

// Get current color space - possible values are in 'enum ColorSpace'.
const colorSpace = Display.getColorSpace();

// Check if low latency mode is supported in the device.
llmSupported = Display.isLowLatencyModeSupported();
if (llmSupported) {
    // Low Latency Mode is supported in the display.
}

const displayListener: IDisplayListener = {

    onConfigChange: (config: IDisplayConfig) => {
      console.log("IDisplayListener onConfigChange  ==  ", config);
    },
    onRefreshRateChange: (refreshRateInrMillihertz: Int32) => {
      console.log("IDisplayListener onRefreshRateChange  ==  ", refreshRateInrMillihertz);
    },
    onColorDepthChange: (colorDepth: ColorDepth) => {
      Alert.alert("IDisplayListener onConfigChange  == ");
      console.log("IDisplayListener onColorDepthChange  ==  ", colorDepth);
    },
    onColorSpaceChange: (colorSpace: ColorSpace) => {
      console.log("IDisplayListener onColorSpaceChange  ==  ", colorSpace);
    },
    onHdcpLevelChange: (level: HdcpLevel) => {
      console.log("IDisplayListener onHdcpLevelChange  ==  ", level);
    },
    onAutoConfigSwitchStateChange: (state: boolean) => {
      console.log("IDisplayListener onAutoConfigSwitchStateChange  ==  ", state);
    },
    onMultipleRefreshRateStateChange: (state: boolean) => {
      console.log("IDisplayListener onMultipleRefreshRateStateChange  ==  ", state);
    },
    onLowLatencyModeStateChange: (state: LlmState) => {
      console.log("IDisplayListener onLowLatencyModeStateChange  ==  ", state);
    },
    onHdrModeChange: (hdr_mode: HdrMode) => {
      console.log("IDisplayListener onHdrModeChange  ==  ", hdr_mode);
    },
    onSinkStateChange: (active: boolean) => {
      console.log("IDisplayListener onSinkStateChange  ==  ", active);
    }
};

// Register the listener object to receive the callbacks.
const subscription: ISubscription = Display.addDisplayListener(displayListener);

  useEffect(() => {
    const subscription: ISubscription = DisplayController.addListener(displayControllerListener);
    return () => {
      subscription.unsubscribe();
    };
  }, []);

  {
      "heightInPixels": 1080,
      "maxHdcpLevel": 7,
      "screenDensityInDpi": 81,
      "supportedHdrType": [
          1,
          1,
          1,
          1,
          1
      ],
      "supportedRefreshRatesInMillihertz": [
          60000,
          50000,
          30000,
          25000,
          24000
      ],
      "widthInPixels": 1920
  }