@workday/canvas-kit-docs/dist/es6/mdx/versionsTable.js

Documentation components of Canvas Kit components

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from 'react';
import { Table } from '@workday/canvas-kit-react';
import { StatusIndicator } from '@workday/canvas-kit-preview-react';
// @ts-ignore: Cannot find module error
import { version } from '../../../lerna.json';
const statusIndicators = {
    stable: {
        variant: 'blue',
        label: 'Stable',
    },
    support: {
        variant: 'green',
        label: 'Support',
    },
    deprecated: {
        variant: 'red',
        label: 'No Longer Supported',
    },
};
function getVersionStatusIndicator(versionNumber) {
    // version from lerna is a string, so we need to do modify into a number
    const currentMajorVersion = Number(version.split('.')[0]);
    const modifiedVersionNumber = typeof versionNumber === 'string' ? Number(versionNumber.split('.')[0]) : versionNumber;
    // if this is the current version
    if (modifiedVersionNumber === currentMajorVersion) {
        return statusIndicators.stable;
    }
    else if (modifiedVersionNumber === currentMajorVersion - 1) {
        return statusIndicators.support;
    }
    else {
        return statusIndicators.deprecated;
    }
}
export const VersionTable = () => {
    const [versions, setVersions] = React.useState([]);
    const minVersion = 6;
    const currentMajorVersion = Number(version === null || version === void 0 ? void 0 : version.split('.')[0]);
    React.useEffect(() => {
        let arr = [];
        for (let i = minVersion; i <= currentMajorVersion; i++) {
            arr.push({
                versionNumber: i,
                versionUrl: i === currentMajorVersion
                    ? 'https://canvas.workday.com/'
                    : `https://canvas.workday.com/v${i}/`,
            });
        }
        setVersions(arr);
    }, []);
    return (_jsxs(Table, { children: [_jsx(Table.Head, { children: _jsxs(Table.Row, { children: [_jsx(Table.Header, { scope: "col", children: "Version" }), _jsx(Table.Header, { scope: "col", children: "Documentation" }), _jsx(Table.Header, { scope: "col", children: "Status" })] }) }), _jsx(Table.Body, { children: versions
                    .slice()
                    .reverse()
                    .map(item => {
                    const { label, variant } = getVersionStatusIndicator(item.versionNumber);
                    return (_jsxs(Table.Row, { children: [_jsxs(Table.Cell, { children: ["v", item.versionNumber] }), _jsx(Table.Cell, { children: _jsx("a", { href: item.versionUrl, target: "_blank", rel: "noreferrer", children: "Documentation" }) }), _jsx(Table.Cell, { children: _jsx(StatusIndicator, { variant: variant, children: _jsx(StatusIndicator.Label, { children: label }) }) })] }));
                }) })] }));
};