@sis-cc/dotstatsuite-visions 15.3.0 → 15.5.0

package/dist/PeriodPicker/PeriodPicker.js

@@ -1,13 +1,12 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import 'react';
 import * as R from 'ramda';
-import { getDaysInMonth, getISOWeeksInYear, parseISO, getMonth, format, startOfYear, addQuarters, endOfISOWeekYear, startOfISOWeekYear, addWeeks, isWithinInterval, closestTo, addMonths, startOfISOWeek, endOfISOWeek, getYear, addDays, isSameYear, compareAsc, compareDesc } from 'date-fns';
+import { min, endOfYear, max, startOfYear, endOfISOWeekYear, startOfISOWeekYear, isWithinInterval, subSeconds, addISOWeekYears, endOfMonth, startOfMonth, endOfDay, startOfDay, endOfHour, startOfHour, isDate, add, sub, getISOWeek, isSameISOWeekYear, getISOWeeksInYear, isSameYear, differenceInYears, isSameQuarter, isSameISOWeek, isSameMonth, isSameDay, isSameHour, isSameMinute, format, getMonth } from 'date-fns';
 import Grid from '@mui/material/Grid';
 import Typography from '@mui/material/Typography';
 import { Button } from '../Button/Button.js';
 import { Select } from '../Select/Select.js';
 import makeStyles from '@mui/styles/makeStyles';
-import numeral from 'numeral';
 import { w as withBlank } from '../chunks/utils-kslX1mzh.js';
 
 const useStyles = makeStyles((theme) => ({
@@ -30,355 +29,350 @@ const useStyles = makeStyles((theme) => ({
   },
 }));
 
-const YEARS = 'years';
-const SEMESTERS = 'semesters';
-const QUARTERS = 'quarters';
-const MONTHS = 'months';
-const WEEKS = 'weeks';
-const DAYS = 'days';
-const FULL_HOURS = 'full_hours';
-const HOURS = 'hours';
-const MINUTES = 'minutes';
-const frequencies = [
-  YEARS,
-  MONTHS,
-  DAYS,
-  HOURS,
-  MINUTES,
-  FULL_HOURS,
-  QUARTERS,
-  WEEKS,
-  SEMESTERS,
-];
-
 const YEAR = 'year';
 const SEMESTER = 'semester';
 const QUARTER = 'quarter';
 const MONTH = 'month';
 const WEEK = 'week';
 const DAY = 'day';
-const FULL_HOUR = 'full_hour';
 const HOUR = 'hour';
 const MINUTE = 'minute';
 
-const layoutFrequencies = {
-  S: [
-    [
-      { values: YEARS, id: YEAR },
-      { values: SEMESTERS, id: SEMESTER },
-    ],
-  ],
-  A: [[{ values: YEARS, id: YEAR }]],
-  Q: [
-    [
-      { values: YEARS, id: YEAR },
-      { values: QUARTERS, id: QUARTER },
-    ],
-  ],
-  M: [
-    [
-      { values: YEARS, id: YEAR },
-      { values: MONTHS, id: MONTH },
-    ],
-  ],
-  W: [
-    [
-      { values: YEARS, id: YEAR },
-      { values: WEEKS, id: WEEK },
-    ],
-  ],
-  B: [
-    [
-      { values: YEARS, id: YEAR },
-      { values: WEEKS, id: WEEK },
-    ],
-  ],
-  D: [
-    [
-      { values: YEARS, id: YEAR },
-      { values: MONTHS, id: MONTH },
-      { values: DAYS, id: DAY },
-    ],
-  ],
-  H: [
-    [
-      { values: YEARS, id: YEAR },
-      { values: MONTHS, id: MONTH },
-      { values: DAYS, id: DAY },
-    ],
-    [{ values: FULL_HOURS, id: FULL_HOUR }],
-  ],
-  N: [
-    [
-      { values: YEARS, id: YEAR },
-      { values: MONTHS, id: MONTH },
-      { values: DAYS, id: DAY },
-    ],
-    [
-      { values: HOURS, id: HOUR },
-      { values: MINUTES, id: MINUTE },
-    ],
-  ],
-};
+const defaultfreq = 'A';
 
-const defaultOutputValues = {
-  [YEARS]: '----',
-  [SEMESTERS]: '-',
-  [QUARTERS]: '-',
-  [MONTHS]: '--',
-  [WEEKS]: '--',
-  [DAYS]: '--',
-  [FULL_HOURS]: '--:00',
-  [HOURS]: '--',
-  [MINUTES]: '--',
-};
+const getDefaultFrequency = ({ defaultFrequency, frequencies: availableFrequencies }) => {
+  const isNotIncludes = !R.includes(defaultFrequency)(availableFrequencies);
 
-const formatOrder = [YEAR, MONTH, DAY, HOUR, MINUTE, FULL_HOUR, QUARTER, WEEK, SEMESTER];
-const defaultfreq = 'A';
+  return R.or(R.either(R.isEmpty, R.isNil)(defaultFrequency), isNotIncludes)
+    ? R.head(availableFrequencies)
+    : defaultFrequency;
+};
 
-const isWeekInPreviousYear = (date) => {
-  const startIsoWeek = startOfISOWeek(date);
-  return R.pipe(
-    R.times((n) => getYear(addDays(startIsoWeek, n))),
-    R.uniq,
-    R.length,
-    R.equals(1)
-  )(4);
+const getFrequencyOptions = (frequencyoptions, frequencyLabels) => {
+  const availableFrequencies = R.or(R.isEmpty(frequencyoptions), R.isNil(frequencyoptions))
+    ? [defaultfreq]
+    : frequencyoptions;
+  const options = R.map((option) => ({
+    value: option,
+    label: R.prop(option, frequencyLabels) || option,
+  }))(availableFrequencies);
+  if (R.isEmpty(options)) return [{ value: 'A', label: R.propOr('Annual', 'A', frequencyLabels) }];
+  return options;
 };
-const supportedFrequenciesKey = R.keys(layoutFrequencies);
-const dec = R.ifElse(R.gte(0), R.identity, R.dec);
-const addSemesters =
-  (semester = 0) =>
-  (date) =>
-    addMonths(date, R.multiply(6)(dec(Number(semester))));
-const getSemesterValue = R.ifElse(R.pipe(Number, R.inc, R.gte(6)), R.always(1), R.always(2));
-const getFormat = (value) => numeral(value).format('[0]0');
-const getHour = R.pipe(R.pick([HOUR, FULL_HOUR]), R.values, R.head);
-const getRanges = (value = [0]) => R.range(R.head(value), R.inc(R.last(value)));
-const setRange = (range) => (prop) =>
-  R.pipe(getRanges, R.prepend(R.prop(prop)(defaultOutputValues)))(R.prop(prop)(range));
-// export const getDestructuringDate = date =>
-//   R.pipe(
-//     date => format(date, 'yyyy M d H m HH Q I [S]'),
-//     R.replace(/S/, R.pipe(date => getMonth(date), getSemesterValue)(date)),
-//     R.split(' '),
-//     R.ifElse(v => R.equals(R.length(formatOrder), R.length(v)), R.map(Number), R.empty),
-//   )(date);
-const getDestructuringDate = (date) => {
-  if (!date || isNaN(new Date(date))) return [];
-  const validDate = typeof date === 'string' ? parseISO(date) : date;
-  return R.pipe(
-    (d) => {
-      const semester = getSemesterValue(getMonth(d));
-      const formatted = format(d, 'yyyy M d H m HH Q I');
-      return `${formatted} ${semester}`;
-    },
-    R.split(' '),
-    R.ifElse((v) => R.equals(R.length(formatOrder), R.length(v)), R.map(Number), R.empty)
-  )(validDate);
+
+const multiplyOffset = (offset, factor) => {
+  const res = {};
+  Object.keys(offset).forEach((k) => (res[k] = offset[k] * factor));
+  return res;
 };
 
-const updateLimit = (value, isSamePeriod, defaultValue) => {
-  if (isSamePeriod) return value;
-  return defaultValue;
+const declineDateWithinInterval = (date, interval, offset, validator) => {
+  let i = 0;
+  let declinedDate = date;
+  const domain = [];
+  while (isWithinInterval(declinedDate, interval)) {
+    domain.push(declinedDate);
+    i++;
+    declinedDate = add(date, multiplyOffset(offset, i));
+  }
+  if (!validator(domain[domain.length - 1], interval.end)) {
+    domain.push(interval.end);
+  }
+  i = 1;
+  declinedDate = sub(date, offset);
+  while (isWithinInterval(declinedDate, interval)) {
+    domain.unshift(declinedDate);
+    i++;
+    declinedDate = sub(date, multiplyOffset(offset, i));
+  }
+  if (!validator(domain[0], interval.start)) {
+    domain.unshift(interval.start);
+  }
+  return domain;
 };
 
-const getRange = R.curry((boundaries, date) => {
-  if (R.isNil(R.head(boundaries)) || R.isNil(R.last(boundaries))) {
-    return {
-      [YEARS]: [NaN],
-      [HOURS]: [NaN],
-      [FULL_HOURS]: [NaN],
-      [MONTHS]: [NaN],
-      [WEEKS]: [NaN],
-      [SEMESTERS]: [NaN],
-      [QUARTERS]: [NaN],
-      [DAYS]: [NaN],
-      [MINUTES]: [NaN],
-    };
+const declineISOWeekYears = (allowedInterval, date) => {
+  let declinedDate = date;
+  const currentISOWeek = getISOWeek(date);
+  const domain = [];
+  const addISOWeekYear = (d) => {
+    if (currentISOWeek === 53) {
+      const numberOfWeeksInNextYear = getISOWeeksInYear(add(d, { weeks: 1 }));
+      return add(d, { weeks: numberOfWeeksInNextYear });
+    }
+    const numberOfWeeksInYear = getISOWeeksInYear(d);
+    return add(d, { weeks: numberOfWeeksInYear });
+  };
+  while (isWithinInterval(declinedDate, allowedInterval)) {
+    domain.push(declinedDate);
+    declinedDate = addISOWeekYear(declinedDate);
   }
-  const destructuredDate = getDestructuringDate(date);
-  const destructuredBoundaries = R.map(getDestructuringDate, boundaries);
-  const [years, months, days, hours, minutes, , quarters, weeks, semesters] =
-    R.transpose(destructuredBoundaries);
-
-  if (R.isNil(date)) {
-    return {
-      [YEARS]: years,
-      [HOURS]: [NaN],
-      [FULL_HOURS]: [NaN],
-      [MONTHS]: [NaN],
-      [WEEKS]: [NaN],
-      [SEMESTERS]: [NaN],
-      [QUARTERS]: [NaN],
-      [DAYS]: [NaN],
-      [MINUTES]: [NaN],
-    };
+  if (!isSameISOWeekYear(domain[domain.length - 1], allowedInterval.end)) {
+    domain.push(allowedInterval.end);
   }
-  const listEqualsValueFromDate = R.pipe(
-    R.transpose,
-    R.reduce((acc, [type, value, start, end]) => {
-      return { ...acc, [type]: [R.equals(value, start), R.equals(value, end)] };
-    }, {})
-  )([frequencies, destructuredDate, ...destructuredBoundaries]);
-
-  const equalsYears = R.prop('years')(listEqualsValueFromDate);
-  const equalsMonths = R.prop('months')(listEqualsValueFromDate);
-  const equalsDays = R.prop('days')(listEqualsValueFromDate);
-
-  const hoursRange = R.addIndex(R.map)((value, index) => {
-    const isSamePeriod = R.all(R.identity)([
-      R.nth(index, equalsDays),
-      R.nth(index, equalsMonths),
-      R.nth(index, equalsYears),
-    ]);
-    return updateLimit(R.nth(index, hours), isSamePeriod, value);
-  })([0, 23]);
-
-  return {
-    [YEARS]: years,
-    [HOURS]: hoursRange,
-    [FULL_HOURS]: hoursRange,
-    [MONTHS]: R.addIndex(R.map)((value, index) =>
-      updateLimit(R.nth(index)(months), R.nth(index, equalsYears), value)
-    )([1, 12]),
-    [WEEKS]: R.addIndex(R.map)((value, index) =>
-      updateLimit(R.nth(index)(weeks), R.nth(index, equalsYears), value)
-    )([1, getISOWeeksInYear(date)]),
-    [SEMESTERS]: R.addIndex(R.map)((value, index) =>
-      updateLimit(R.nth(index)(semesters), R.nth(index, equalsYears), value)
-    )([1, 2]),
-    [QUARTERS]: R.addIndex(R.map)((value, index) =>
-      updateLimit(R.nth(index)(quarters), R.nth(index, equalsYears), value)
-    )([1, 4]),
-    [DAYS]: R.addIndex(R.map)((value, index) => {
-      const isSamePeriod = R.and(R.nth(index, equalsMonths), R.nth(index, equalsYears));
-      return updateLimit(R.nth(index)(days), isSamePeriod, value);
-    })([1, getDaysInMonth(date)]),
-    [MINUTES]: R.addIndex(R.map)((value, index) => {
-      const isSamePeriod = R.all(R.identity)([
-        R.nth(index, R.prop('hours')(listEqualsValueFromDate)),
-        R.nth(index, equalsDays),
-        R.nth(index, equalsMonths),
-        R.nth(index, equalsYears),
-      ]);
-      return updateLimit(R.nth(index)(minutes), isSamePeriod, value);
-    })([0, 59]),
+  const subAYear = (d) => {
+    const intoPreviousYear = sub(d, { weeks: currentISOWeek });
+    if (currentISOWeek === 53) {
+      return intoPreviousYear;
+    }
+    const numberOfWeeksInPreviousYear = getISOWeeksInYear(intoPreviousYear);
+    return sub(intoPreviousYear, { weeks: numberOfWeeksInPreviousYear - currentISOWeek });
   };
-});
+  declinedDate = subAYear(date);
+  while (isWithinInterval(declinedDate, allowedInterval)) {
+    domain.unshift(declinedDate);
+    declinedDate = subAYear(declinedDate);
+  }
+  if (!isSameISOWeekYear(domain[0], allowedInterval.start)) {
+    domain.unshift(allowedInterval.start);
+  }
+  return domain;
+};
 
-const getAjustedDate = (frequency) =>
-  R.when(
-    R.always(R.or(R.equals('W', frequency), R.equals('B', frequency))),
-    R.ifElse(isWeekInPreviousYear, startOfISOWeek, endOfISOWeek)
-  );
+const optionGetterGenerator = (labelAccessor, validator) => (allowedInterval, value) => {
+  const { start, end } = allowedInterval;
+  const label = labelAccessor(value);
+  if (isDate(value) && !isWithinInterval(value, allowedInterval)) {
+    if (validator(value, start)) {
+      return { label, value: start };
+    }
+    if (validator(value, end)) {
+      return { label, value: end };
+    }
+  }
+  return { label, value };
+};
 
-const isValidNumber = R.both(R.is(Number), R.complement(R.equals(NaN)));
-const getDefaultFrequency = ({ defaultFrequency, frequencies: availableFrequencies }) => {
-  const isNotIncludes = R.complement(R.and)(
-    R.includes(defaultFrequency)(availableFrequencies),
-    R.includes(defaultFrequency)(supportedFrequenciesKey)
-  );
-  return R.or(R.either(R.isEmpty, R.isNil)(defaultFrequency), isNotIncludes)
-    ? R.head(availableFrequencies)
-    : defaultFrequency;
+const yearsValuesValidator = (yearsOffset) => (d1, d2) => {
+  return yearsOffset === 1 ? isSameYear(d1, d2) : differenceInYears(d1, d2) < yearsOffset;
 };
 
-const getFrequencyOptions = (frequencyoptions, frequencyLabels) => {
-  const availableFrequencies = R.or(R.isEmpty(frequencyoptions), R.isNil(frequencyoptions))
-    ? [defaultfreq]
-    : R.filter((freq) => R.includes(freq, supportedFrequenciesKey))(frequencyoptions);
-  const options = R.map((option) => ({ value: option, label: R.prop(option, frequencyLabels) }))(
-    availableFrequencies
-  );
-  if (R.isEmpty(options)) return [{ value: 'A', label: R.propOr('Annual', 'A', frequencyLabels) }];
+const getBlankYearsInputValues = (boundaryInterval, scope = 'start', yearsOffset = 1) => {
+  const validator = yearsValuesValidator(yearsOffset);
+  const ref =
+    scope === 'end' ? endOfYear(boundaryInterval.end) : startOfYear(boundaryInterval.start);
+  const domainInterval = { ...boundaryInterval, [scope]: ref };
+  const options = declineDateWithinInterval(ref, domainInterval, { years: yearsOffset }, validator);
+  const indexToRefine = scope === 'end' ? options.length - 1 : 0;
+  options[indexToRefine] = isWithinInterval(options[indexToRefine], boundaryInterval)
+    ? options[indexToRefine]
+    : boundaryInterval[scope];
   return options;
 };
 
-const getLayout = (type, range) => {
-  const layoutPeriods = R.propOr([], type)(layoutFrequencies);
-  const hasYear = R.complement(R.isEmpty)(getRanges(range.years));
-  return R.map(
-    R.reduce((acc, period) => {
-      if (hasYear) return R.append(R.evolve({ values: setRange(range) }, period), acc);
-      return R.append(
-        R.evolve(
-          { values: R.pipe(R.flip(R.prop)(defaultOutputValues), R.flip(R.append)([])) },
-          period
-        ),
-        acc
-      );
-    }, [])
-  )(layoutPeriods);
+const getYearsInputValues = (boundaryInterval, current, yearOffset = 1) => {
+  const validator = yearsValuesValidator(yearOffset);
+  return declineDateWithinInterval(current, boundaryInterval, { years: yearOffset }, validator);
 };
 
-const getPeriodValue = R.pipe(R.zip(formatOrder), R.fromPairs);
-
-const getDate = (type, dateValue, value, isEnd) => {
-  if (R.isNil(value)) return undefined;
-  const dateValueUpdated = R.pipe(
-    R.ifElse(R.pipe(getHour, R.isNil), R.identity, R.set(R.lensProp('hour'), getHour(value))),
-    R.mergeRight(dateValue),
-    R.over(R.lensProp('month'), R.defaultTo(isEnd ? 12 : 1)),
-    R.over(R.lensProp('day'), R.defaultTo(isEnd ? 31 : 1)),
-    R.over(R.lensProp('hour'), R.defaultTo(isEnd ? 23 : 0)),
-    R.over(R.lensProp('minute'), R.defaultTo(isEnd ? 59 : 0))
-  )(value);
-  const { year, month, day, hour, minute } = dateValueUpdated;
-  const date = new Date(year, R.dec(month), day, hour, minute);
-  if (R.equals(type, 'Q')) {
-    if (R.isEmpty(dateValue) && isEnd) {
-      return R.pipe(startOfYear, R.flip(addQuarters)(3))(date);
+const getYearValueLabel = (value) => (isDate(value) ? format(value, 'yyyy') : '----');
+
+const getBlankISOWeekYearsInputValues = (allowedInterval, getter = 'start') => {
+  const ref =
+    getter === 'end'
+      ? endOfISOWeekYear(allowedInterval.end)
+      : startOfISOWeekYear(allowedInterval.start);
+  const domainInterval = { ...allowedInterval, [getter]: ref };
+  let declinedDate = ref;
+  const options = [];
+  while (isWithinInterval(declinedDate, domainInterval)) {
+    if (getter === 'end') {
+      options.unshift(declinedDate);
+    } else {
+      options.push(declinedDate);
     }
-    return R.pipe(startOfYear, (startDate) =>
-      addQuarters(startDate, dec(R.propOr(0, QUARTER)(dateValueUpdated)))
-    )(date);
-  }
-  if (R.equals(type, 'S')) {
-    if (R.isEmpty(dateValue) && isEnd) return R.pipe(startOfYear, addSemesters(2))(date);
-    return R.pipe(startOfYear, addSemesters(R.prop(SEMESTER)(dateValueUpdated)))(date);
-  }
-  if (R.or(R.equals(type, 'W'), R.equals(type, 'B'))) {
-    const weekDate = new Date(year, 6, 1, 0, 0, 0, 0);
-    if (R.isEmpty(dateValue)) {
-      return R.pipe(
-        R.ifElse(R.always(isEnd), endOfISOWeekYear, startOfISOWeekYear),
-        getAjustedDate(type)
-      )(weekDate);
+    if (getter === 'end') {
+      declinedDate = startOfISOWeekYear(declinedDate);
+      declinedDate = subSeconds(declinedDate, 1);
+    } else {
+      declinedDate = addISOWeekYears(declinedDate, 1);
     }
-    const weeksInYear = R.dec(getISOWeeksInYear(weekDate));
-    const nbWeeks = R.pipe(
-      R.propOr(0, WEEK),
-      R.dec,
-      R.ifElse(R.lt(weeksInYear), R.always(weeksInYear), R.identity)
-    )(dateValueUpdated);
-    return R.pipe(
-      startOfISOWeekYear,
-      (startDate) => addWeeks(startDate, nbWeeks),
-      R.of,
-      R.map(getAjustedDate(type)),
-      R.head
-    )(weekDate);
   }
-  return date;
+  const indexToRefine = getter === 'end' ? options.length - 1 : 0;
+  options[indexToRefine] = isWithinInterval(options[indexToRefine], allowedInterval)
+    ? options[indexToRefine]
+    : allowedInterval[getter];
+  return options;
 };
 
-const getDateInTheRange = (boundaries) => (date) => {
-  if (R.isNil(date)) return date;
-  const [start, end] = boundaries;
-  return isWithinInterval(date, { start, end }) ? date : closestTo(date, boundaries);
+const getISOWeekYearsInputValues = (boundaryInterval, current) => {
+  return declineISOWeekYears(boundaryInterval, current);
 };
 
-const numeralFormat = {
-  [YEAR]: R.identity,
-  [SEMESTER]: R.identity,
-  [QUARTER]: R.identity,
-  [MONTH]: getFormat,
-  [WEEK]: getFormat,
-  [DAY]: getFormat,
-  [FULL_HOUR]: R.converge(R.concat, [getFormat, R.always(':00')]),
-  [HOUR]: getFormat,
-  [MINUTE]: getFormat,
+const getISOWeekYearValueLabel = (value) => (isDate(value) ? format(value, 'RRRR') : '----');
+
+const getSemestersInputValues = (boundaryInterval, current) => {
+  const labelAccessor = (d) => (getMonth(d) < 6 ? '01' : '02');
+  const validator = (d1, d2) => labelAccessor(d1) === labelAccessor(d2);
+  const domainInterval = {
+    start: max([startOfYear(current), boundaryInterval.start]),
+    end: min([endOfYear(current), boundaryInterval.end]),
+  };
+  return declineDateWithinInterval(current, domainInterval, { months: 6 }, validator);
+};
+
+const getSemesterValueLabel = (value) =>
+  isDate(value) ? (getMonth(value) < 6 ? '01' : '02') : '--';
+
+const getQuartersInputValues = (boundaryInterval, current) => {
+  const domainInterval = {
+    start: max([startOfYear(current), boundaryInterval.start]),
+    end: min([endOfYear(current), boundaryInterval.end]),
+  };
+  return declineDateWithinInterval(current, domainInterval, { months: 3 }, isSameQuarter);
+};
+
+const getQuarterValueLabel = (value) => (isDate(value) ? format(value, 'QQ') : '--');
+
+const getWeeksInputValues = (boundaryInterval, current) => {
+  const domainInterval = {
+    start: max([startOfISOWeekYear(current), boundaryInterval.start]),
+    end: min([endOfISOWeekYear(current), boundaryInterval.end]),
+  };
+  return declineDateWithinInterval(current, domainInterval, { weeks: 1 }, isSameISOWeek);
+};
+
+const getWeekValueLabel = (value) => (isDate(value) ? format(value, 'II') : '--');
+
+const getMonthsInputValues = (boundaryInterval, current) => {
+  const domainInterval = {
+    start: max([startOfYear(current), boundaryInterval.start]),
+    end: min([endOfYear(current), boundaryInterval.end]),
+  };
+  return declineDateWithinInterval(current, domainInterval, { months: 1 }, isSameMonth);
+};
+
+const getMonthValueLabel = (value) => (isDate(value) ? format(value, 'MM') : '--');
+
+const getDaysInputValues = (boundaryInterval, current) => {
+  const domainInterval = {
+    start: max([startOfMonth(current), boundaryInterval.start]),
+    end: min([endOfMonth(current), boundaryInterval.end]),
+  };
+  return declineDateWithinInterval(current, domainInterval, { days: 1 }, isSameDay);
+};
+
+const getDayValueLabel = (value) => (isDate(value) ? format(value, 'dd') : '--');
+
+const getHoursInputValues = (boundaryInterval, current) => {
+  const domainInterval = {
+    start: max([startOfDay(current), boundaryInterval.start]),
+    end: min([endOfDay(current), boundaryInterval.end]),
+  };
+  return declineDateWithinInterval(current, domainInterval, { hours: 1 }, isSameHour);
+};
+
+const getHourValueLabel = (value) => (isDate(value) ? format(value, 'HH') : '--');
+
+const getMinutesInputValues = (boundaryInterval, current) => {
+  const domainInterval = {
+    start: max([startOfHour(current), boundaryInterval.start]),
+    end: min([endOfHour(current), boundaryInterval.end]),
+  };
+  return declineDateWithinInterval(current, domainInterval, { minutes: 1 }, isSameMinute);
+};
+
+const getMinuteValueLabel = (value) => (isDate(value) ? format(value, 'mm') : '--');
+
+const yearsInputFactoriesGenerator = (yearsOffset) => ({
+  id: YEAR,
+  valuesGetter: (boundaryInterval, current) =>
+    getYearsInputValues(boundaryInterval, current, yearsOffset),
+  blankValuesGetter: (boundaryInterval, scope) =>
+    getBlankYearsInputValues(boundaryInterval, scope, yearsOffset),
+  optionGetter: optionGetterGenerator(getYearValueLabel, yearsValuesValidator(yearsOffset)),
+});
+
+const isoWeekYearsInputFactories = {
+  id: YEAR,
+  valuesGetter: getISOWeekYearsInputValues,
+  blankValuesGetter: getBlankISOWeekYearsInputValues,
+  optionGetter: optionGetterGenerator(getISOWeekYearValueLabel, isSameISOWeek),
+};
+
+const semestersInputFactories = {
+  id: SEMESTER,
+  valuesGetter: getSemestersInputValues,
+  blankValuesGetter: () => [],
+  optionGetter: optionGetterGenerator(
+    getSemesterValueLabel,
+    (d1, d2) => getSemesterValueLabel(d1) === getSemesterValueLabel(d2)
+  ),
+};
+
+const quartersInputFactories = {
+  id: QUARTER,
+  valuesGetter: getQuartersInputValues,
+  blankValuesGetter: () => [],
+  optionGetter: optionGetterGenerator(getQuarterValueLabel, isSameQuarter),
+};
+
+const weeksInputFactories = {
+  id: WEEK,
+  valuesGetter: getWeeksInputValues,
+  blankValuesGetter: () => [],
+  optionGetter: optionGetterGenerator(getWeekValueLabel, isSameISOWeek),
+};
+
+const monthsInputFactories = {
+  id: MONTH,
+  valuesGetter: getMonthsInputValues,
+  blankValuesGetter: () => [],
+  optionGetter: optionGetterGenerator(getMonthValueLabel, isSameMonth),
+};
+
+const daysInputFactories = {
+  id: DAY,
+  valuesGetter: getDaysInputValues,
+  blankValuesGetter: () => [],
+  optionGetter: optionGetterGenerator(getDayValueLabel, isSameDay),
+};
+
+const hoursInputFactories = {
+  id: HOUR,
+  valuesGetter: getHoursInputValues,
+  blankValuesGetter: () => [],
+  optionGetter: optionGetterGenerator(getHourValueLabel, isSameHour),
+};
+
+const minutesInputFactories = {
+  id: MINUTE,
+  valuesGetter: getMinutesInputValues,
+  blankValuesGetter: () => [],
+  optionGetter: optionGetterGenerator(getMinuteValueLabel, isSameMinute),
+};
+
+const getInputsFactoriesLayout = (freq) => {
+  if (freq === 'S') {
+    return [[yearsInputFactoriesGenerator(1), semestersInputFactories]];
+  }
+  if (freq === 'Q') {
+    return [[yearsInputFactoriesGenerator(1), quartersInputFactories]];
+  }
+  if (freq === 'M') {
+    return [[yearsInputFactoriesGenerator(1), monthsInputFactories]];
+  }
+  if (freq === 'W' || freq === 'B') {
+    return [[isoWeekYearsInputFactories, weeksInputFactories]];
+  }
+  if (freq === 'D') {
+    return [[yearsInputFactoriesGenerator(1), monthsInputFactories, daysInputFactories]];
+  }
+  if (freq === 'H') {
+    return [
+      [yearsInputFactoriesGenerator(1), monthsInputFactories, daysInputFactories],
+      [hoursInputFactories],
+    ];
+  }
+  if (freq === 'N') {
+    return [
+      [yearsInputFactoriesGenerator(1), monthsInputFactories, daysInputFactories],
+      [hoursInputFactories, minutesInputFactories],
+    ];
+  }
+  const yearlyMatch = freq.match(/A([\d]+)$/);
+  const yearsOffset = yearlyMatch ? Number(yearlyMatch[1]) : 1;
+  return [[yearsInputFactoriesGenerator(yearsOffset)]];
 };
 
 const DEFAULT_AVAILABLE_FREQUENCIES = [defaultfreq];
@@ -406,53 +400,40 @@ const CustomPeriodPicker = ({
   const boundaries = R.defaultTo([], _boundaries);
   const availableBoundaries = R.defaultTo([], _availableBoundaries);
   const isPeriodDisabled = R.or(R.any(R.isEmpty)([period, boundaries]), periodDisabled);
-  const startDate = R.head(period);
-  const endDate = R.last(period);
-  const startPeriodBoundaries = [R.head(boundaries), R.defaultTo(R.last(boundaries), endDate)];
-  const endPeriodBoundaries = [R.defaultTo(R.head(boundaries), startDate), R.last(boundaries)];
-  const ranges = [
-    getRange(startPeriodBoundaries, startDate),
-    getRange(endPeriodBoundaries, endDate)
-  ];
-  const showFrequency = R.and(R.gt(R.length(frequencies), 1), R.not(frequencyDisabled));
-  const destructuringDates = R.map(getDestructuringDate)(period);
-  const onClickFrequency = (e, value) => {
-    if (R.is(Function, changeFrequency)) return changeFrequency(value);
+  const layoutFrequency = getInputsFactoriesLayout(frequency);
+  const boundaryInterval = {
+    start: boundaries[0],
+    end: boundaries[1]
   };
-  const _getIsDisabled = (getter) => (value, id) => {
-    const fn = R.prop(getter)({ start: R.head, end: R.last });
-    if (!isValidNumber(Number(value)) || R.length(availableBoundaries) !== 2) {
-      return false;
-    }
-    const dateValue = getPeriodValue(fn(destructuringDates));
-    let date = getDate(frequency, dateValue, { [id]: Number(value) }, getter === "end");
-    const [availableStart, availableEnd] = availableBoundaries;
-    if (id === "year") {
-      if (isSameYear(date, availableStart)) {
-        date = availableStart;
-      } else if (isSameYear(date, availableEnd)) {
-        date = availableEnd;
-      }
-    }
-    return compareAsc(date, availableStart) === -1 || compareDesc(date, availableEnd) === -1;
+  const availableInterval = {
+    start: availableBoundaries[0] || boundaries[0],
+    end: availableBoundaries[1] || boundaries[1]
+  };
+  const showFrequency = frequencies.length > 1 && !frequencyDisabled;
+  const startAvailableInterval = {
+    start: availableInterval.start,
+    end: period[1] ? min([period[1], availableInterval.end]) : availableInterval.end
+  };
+  const endAvailableInterval = {
+    start: period[0] ? max([period[0], availableInterval.start]) : availableInterval.start,
+    end: availableInterval.end
+  };
+  const getterAvailableIntervals = {
+    start: startAvailableInterval,
+    end: endAvailableInterval
   };
-  const onChangePeriod = (getter, id) => (value) => {
-    const fn = R.prop(getter)({ start: R.head, end: R.last });
-    const lensIndex = R.prop(getter)({ start: R.lensIndex(0), end: R.lensIndex(1) });
-    const dateValue = getPeriodValue(fn(destructuringDates));
-    const selectedValue = R.ifElse(
-      isValidNumber,
-      R.assoc(id, R.__, {}),
-      R.always(void 0)
-    )(Number(value));
-    const newDate = getDate(frequency, dateValue, selectedValue, getter === "end");
+  const onChangePeriod = (getter) => (_value) => {
+    const value = _value === "#NULL" ? void 0 : _value;
     if (R.is(Function, changePeriod)) {
-      return changePeriod(
-        R.pipe(R.set(lensIndex, newDate), ([nextStartDate, nextEndDate]) => [
-          getDateInTheRange(startPeriodBoundaries)(nextStartDate),
-          getDateInTheRange(endPeriodBoundaries)(nextEndDate)
-        ])(period)
-      );
+      return changePeriod([
+        getter === "start" ? value : period[0],
+        getter === "end" ? value : period[1]
+      ]);
+    }
+  };
+  const onClickFrequency = (e, value) => {
+    if (R.is(Function, changeFrequency)) {
+      return changeFrequency(value);
     }
   };
   return /* @__PURE__ */ jsxs(Grid, { "data-testid": "period-picker-test-id", container: true, direction: "row", children: [
@@ -476,62 +457,57 @@ const CustomPeriodPicker = ({
         ))(frequencies)
       }
     ),
-    R.not(isPeriodDisabled) && /* @__PURE__ */ jsx(Grid, { container: true, item: true, xs: 12, justifyContent: "space-between", children: R.map(({ getter, layout, label, value, testId, getIsDisabled }) => /* @__PURE__ */ jsxs(Grid, { item: true, xs: 5, "data-testid": testId, justifyContent: "space-between", children: [
-      /* @__PURE__ */ jsx(Grid, { container: true, direction: "row", children: /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, className: classes.sideLabel, children: /* @__PURE__ */ jsx(Typography, { variant: "body2", tabIndex: 0, "aria-label": label, children: label }) }) }),
-      /* @__PURE__ */ jsx(Grid, { container: true, direction: "row", children: /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(Grid, { container: true, className: classes.headerContainer, spacing: 1, children: R.map(
-        (row) => R.map(({ id, values }) => {
-          const selectedValue = R.isNil(R.prop(id)(value)) ? R.head(values) : R.prop(id)(value);
-          return /* @__PURE__ */ jsx(
-            Grid,
-            {
-              item: true,
-              xs: 12 / R.length(row),
-              className: classes.selectContainer,
-              children: /* @__PURE__ */ jsx(
-                Select,
-                {
-                  onChange: onChangePeriod(getter, id),
-                  label: R.prop(id)(labels),
-                  id: `${id}-${label}`,
-                  dataTestId: `${id}-${label}-test-id`,
-                  value: selectedValue,
-                  disabled: disabled || false,
-                  items: R.map((option) => ({
-                    id,
-                    value: option,
-                    disabled: getIsDisabled(option, id),
-                    label: R.ifElse(
-                      R.is(String),
-                      R.identity,
-                      R.prop(id)(numeralFormat)
-                    )(option)
-                  }))(values)
-                }
-              )
-            },
-            id
-          );
-        })(row)
-      )(layout) }) }) })
-    ] }, getter))([
+    R.not(isPeriodDisabled) && /* @__PURE__ */ jsx(Grid, { container: true, item: true, xs: 12, justifyContent: "space-between", children: R.map(({ getter, value }) => /* @__PURE__ */ jsxs(
+      Grid,
       {
-        getter: "start",
-        testId: "period-picker-start-period-test-id",
-        layout: getLayout(frequency, R.head(ranges)),
-        label: R.prop("start")(labels),
-        value: getPeriodValue(R.head(destructuringDates)),
-        getIsDisabled: _getIsDisabled("start")
+        item: true,
+        xs: 5,
+        "data-testid": `period-picker-${getter}-period-test-id`,
+        justifyContent: "space-between",
+        children: [
+          /* @__PURE__ */ jsx(Grid, { container: true, direction: "row", children: /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, className: classes.sideLabel, children: /* @__PURE__ */ jsx(Typography, { variant: "body2", tabIndex: 0, "aria-label": labels[getter] || getter, children: labels[getter] || getter }) }) }),
+          /* @__PURE__ */ jsx(Grid, { container: true, direction: "row", children: /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(Grid, { container: true, className: classes.headerContainer, spacing: 1, children: R.map(
+            (row) => R.map(({ id, valuesGetter, blankValuesGetter, optionGetter }) => {
+              const isInvalid = R.isEmpty(boundaries) || R.isNil(boundaries[0]) || R.isNil(boundaries[1]);
+              let values = [];
+              if (!isInvalid) {
+                values = R.isNil(value) ? blankValuesGetter(boundaryInterval, getter) : valuesGetter(boundaryInterval, value);
+              }
+              const options = ["#NULL", ...values].map(
+                (v) => optionGetter(availableInterval, v)
+              );
+              return /* @__PURE__ */ jsx(
+                Grid,
+                {
+                  item: true,
+                  xs: 12 / R.length(row),
+                  className: classes.selectContainer,
+                  children: /* @__PURE__ */ jsx(
+                    Select,
+                    {
+                      onChange: onChangePeriod(getter),
+                      label: R.prop(id)(labels),
+                      id: `${id}-${labels[getter] || getter}`,
+                      dataTestId: `${id}-${labels[getter] || getter}-test-id`,
+                      value: value || "#NULL",
+                      disabled: disabled || false,
+                      items: options.map((item) => ({
+                        ...item,
+                        disabled: !isDate(item.value) || !isWithinInterval(item.value, getterAvailableIntervals[getter])
+                      }))
+                    }
+                  )
+                },
+                id
+              );
+            })(row)
+          )(layoutFrequency) }) }) })
+        ]
       },
-      {
-        getter: "end",
-        testId: "period-picker-end-period-test-id",
-        layout: getLayout(
-          frequency,
-          R.last(ranges)),
-        label: R.prop("end")(labels),
-        value: getPeriodValue(R.last(destructuringDates)),
-        getIsDisabled: _getIsDisabled("end")
-      }
+      getter
+    ))([
+      { getter: "start", value: period[0] },
+      { getter: "end", value: period[1] }
     ]) })
   ] });
 };