import React from 'react';
import { getNumericAttribute } from '../../dom-utils';
import { audioLabelId } from '../../ids';
import Audio from '../shared/Audio';
import { faPlay } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { formatDuration } from '../shared/internal/RestrictedAudioPlayer';
export const AudioContainer = ({ element, renderChildNodes, renderComponentOverrides }) => {
    const restricted = !!getNumericAttribute(element, 'times');
    const duration = getNumericAttribute(element, 'duration');
    const labelId = audioLabelId(element);
    if (restricted) {
        return React.createElement(AudioPlaceholder, { duration: duration, labelId: labelId });
    }
    else {
        return (React.createElement(Audio, { element: element, renderChildNodes: renderChildNodes, renderComponentOverrides: renderComponentOverrides }));
    }
};
const AudioPlaceholder = ({ duration, labelId }) => (React.createElement("div", { className: "audio e-columns e-columns--center-v e-mrg-b-2" },
    React.createElement("div", { className: "e-pad-1 restricted-audio-player restricted-audio-player--disabled e-columns e-columns--center-v" },
        React.createElement("button", { className: "restricted-audio-player__play e-column e-column--narrow", disabled: true, onClick: () => undefined },
            React.createElement(FontAwesomeIcon, { icon: faPlay, fixedWidth: true })),
        React.createElement("span", { className: "e-column restricted-audio-player__duration e-text-right e-column" }, formatDuration(duration))),
    React.createElement("span", { className: "e-pad-l-2", id: labelId },
        React.createElement("em", null, "Ei kuunneltavissa"))));
//# sourceMappingURL=AudioContainer.js.map