azure-devops-ui/Components/Table/TableBreakpoint.js

React components for building web UI in Azure DevOps

import "../../CommonImports";
import "../../Core/core.css";
import "./Table.css";
import * as React from "react";
import { ObservableLike } from '../../Core/Observable';
import { Breakpoint } from '../../Breakpoint';
export function TableBreakpoint(props) {
    const breakpoints = [];
    const onBreakpoint = function (breakpointIndex, breakpoint) {
        const { columnWidths } = props.breakpoints[Math.max(0, breakpointIndex)];
        for (let index = 0; index < columnWidths.length; index++) {
            if (ObservableLike.isObservable(props.columnWidths[index])) {
                props.columnWidths[index].value = columnWidths[index];
            }
        }
        // Notify the owner if the responsive udpate property was supplied.
        if (props.onBreakpoint) {
            props.onBreakpoint(breakpointIndex, breakpoint);
        }
    };
    // Compute the breakpoints from the table definition.
    for (let index = 0; index < props.breakpoints.length; index++) {
        breakpoints.push(props.breakpoints[index].breakpoint);
    }
    // Compute the set of breakpoints needed for the responsive columns.
    return React.createElement(Breakpoint, { breakpoints: breakpoints, onBreakpoint: onBreakpoint });
}