"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = Clock;
var jsx_runtime_1 = require("react/jsx-runtime");
var clsx_1 = __importDefault(require("clsx"));
var date_utils_1 = require("@wojtekmaj/date-utils");
var Hand_js_1 = __importDefault(require("./Hand.js"));
var Mark_js_1 = __importDefault(require("./Mark.js"));
var MarkNumber_js_1 = __importDefault(require("./MarkNumber.js"));
var hourFormatter_js_1 = require("./shared/hourFormatter.js");
var utils_js_1 = require("./shared/utils.js");
/**
 * Displays a complete clock.
 */
function Clock(_a) {
    var className = _a.className, _b = _a.formatHour, formatHour = _b === void 0 ? hourFormatter_js_1.formatHour : _b, _c = _a.hourHandLength, hourHandLength = _c === void 0 ? 50 : _c, hourHandOppositeLength = _a.hourHandOppositeLength, _d = _a.hourHandWidth, hourHandWidth = _d === void 0 ? 4 : _d, _e = _a.hourMarksLength, hourMarksLength = _e === void 0 ? 10 : _e, _f = _a.hourMarksWidth, hourMarksWidth = _f === void 0 ? 3 : _f, locale = _a.locale, _g = _a.minuteHandLength, minuteHandLength = _g === void 0 ? 70 : _g, minuteHandOppositeLength = _a.minuteHandOppositeLength, _h = _a.minuteHandWidth, minuteHandWidth = _h === void 0 ? 2 : _h, _j = _a.minuteMarksLength, minuteMarksLength = _j === void 0 ? 6 : _j, _k = _a.minuteMarksWidth, minuteMarksWidth = _k === void 0 ? 1 : _k, _l = _a.renderHourMarks, renderHourMarks = _l === void 0 ? true : _l, _m = _a.renderMinuteHand, renderMinuteHand = _m === void 0 ? true : _m, _o = _a.renderMinuteMarks, renderMinuteMarks = _o === void 0 ? true : _o, renderNumbers = _a.renderNumbers, _p = _a.renderSecondHand, renderSecondHand = _p === void 0 ? true : _p, _q = _a.secondHandLength, secondHandLength = _q === void 0 ? 90 : _q, secondHandOppositeLength = _a.secondHandOppositeLength, _r = _a.secondHandWidth, secondHandWidth = _r === void 0 ? 1 : _r, _s = _a.size, size = _s === void 0 ? 150 : _s, useMillisecondPrecision = _a.useMillisecondPrecision, value = _a.value;
    function renderMinuteMarksFn() {
        if (!renderMinuteMarks) {
            return null;
        }
        var minuteMarks = [];
        for (var i = 1; i <= 60; i += 1) {
            var isHourMark = renderHourMarks && !(i % 5);
            if (!isHourMark) {
                minuteMarks.push((0, jsx_runtime_1.jsx)(Mark_js_1.default, { angle: i * 6, length: minuteMarksLength, name: "minute", width: minuteMarksWidth }, "minute_".concat(i)));
            }
        }
        return minuteMarks;
    }
    function renderHourMarksFn() {
        if (!renderHourMarks) {
            return null;
        }
        var hourMarks = [];
        for (var i = 1; i <= 12; i += 1) {
            hourMarks.push((0, jsx_runtime_1.jsx)(Mark_js_1.default, { angle: i * 30, length: hourMarksLength, name: "hour", width: hourMarksWidth }, "hour_".concat(i)));
        }
        return hourMarks;
    }
    function renderNumbersFn() {
        if (!renderNumbers) {
            return null;
        }
        var numbers = [];
        for (var i = 1; i <= 12; i += 1) {
            numbers.push((0, jsx_runtime_1.jsx)(MarkNumber_js_1.default, { angle: i * 30, length: (0, utils_js_1.safeMax)(renderHourMarks && hourMarksLength, renderMinuteMarks && minuteMarksLength, 0), name: "number", number: formatHour(locale, i) }, "number_".concat(i)));
        }
        return numbers;
    }
    function renderFace() {
        return ((0, jsx_runtime_1.jsxs)("div", { className: "react-clock__face", children: [renderMinuteMarksFn(), renderHourMarksFn(), renderNumbersFn()] }));
    }
    function renderHourHandFn() {
        var angle = value
            ? (0, date_utils_1.getHours)(value) * 30 +
                (0, date_utils_1.getMinutes)(value) / 2 +
                (0, date_utils_1.getSeconds)(value) / 120 +
                (useMillisecondPrecision ? (0, date_utils_1.getMilliseconds)(value) / 120000 : 0)
            : 0;
        return ((0, jsx_runtime_1.jsx)(Hand_js_1.default, { angle: angle, length: hourHandLength, name: "hour", oppositeLength: hourHandOppositeLength, width: hourHandWidth }));
    }
    function renderMinuteHandFn() {
        if (!renderMinuteHand) {
            return null;
        }
        var angle = value
            ? (0, date_utils_1.getHours)(value) * 360 +
                (0, date_utils_1.getMinutes)(value) * 6 +
                (0, date_utils_1.getSeconds)(value) / 10 +
                (useMillisecondPrecision ? (0, date_utils_1.getMilliseconds)(value) / 10000 : 0)
            : 0;
        return ((0, jsx_runtime_1.jsx)(Hand_js_1.default, { angle: angle, length: minuteHandLength, name: "minute", oppositeLength: minuteHandOppositeLength, width: minuteHandWidth }));
    }
    function renderSecondHandFn() {
        if (!renderSecondHand) {
            return null;
        }
        var angle = value
            ? (0, date_utils_1.getMinutes)(value) * 360 +
                (0, date_utils_1.getSeconds)(value) * 6 +
                (useMillisecondPrecision ? (0, date_utils_1.getMilliseconds)(value) * 0.006 : 0)
            : 0;
        return ((0, jsx_runtime_1.jsx)(Hand_js_1.default, { angle: angle, length: secondHandLength, name: "second", oppositeLength: secondHandOppositeLength, width: secondHandWidth }));
    }
    return ((0, jsx_runtime_1.jsxs)("time", { className: (0, clsx_1.default)('react-clock', className), dateTime: value instanceof Date
            ? // Returns a string in the format "HH:MM" or "HH:MM:SS"
                value.toLocaleTimeString('en', {
                    hourCycle: 'h23',
                    hour: '2-digit',
                    minute: renderMinuteHand ? '2-digit' : undefined,
                    second: renderSecondHand ? '2-digit' : undefined,
                })
            : value || undefined, style: {
            width: size,
            height: size,
        }, children: [renderFace(), renderHourHandFn(), renderMinuteHandFn(), renderSecondHandFn()] }));
}
