@cnamts/synapse 1.0.22 → 1.0.23

package/src/components/MonthPicker/tests/__snapshots__/MonthPicker.spec.ts.snap

@@ -0,0 +1,2545 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`mounthpicker > MonthPickerVisual > shows the month picker after the year is selected 1`] = `
+<div
+  aria-label="Sélectionner un mois"
+  class="month-selector"
+  role="group"
+>
+  <button
+    aria-label="January"
+    aria-pressed="false"
+    class="
+      month-1
+      month-selector__month
+    "
+    tabindex="-1"
+  >
+    Jan
+  </button>
+  <button
+    aria-label="February"
+    aria-pressed="false"
+    class="
+      month-2
+      month-selector__month
+    "
+    tabindex="-1"
+  >
+    Feb
+  </button>
+  <button
+    aria-label="March"
+    aria-pressed="false"
+    class="
+      month-3
+      month-selector__month
+    "
+    tabindex="-1"
+  >
+    Mar
+  </button>
+  <button
+    aria-label="April"
+    aria-pressed="false"
+    class="
+      month-4
+      month-selector__month
+    "
+    tabindex="-1"
+  >
+    Apr
+  </button>
+  <button
+    aria-label="May"
+    aria-pressed="false"
+    class="
+      month-5
+      month-selector__month
+    "
+    tabindex="-1"
+  >
+    May
+  </button>
+  <button
+    aria-label="June"
+    aria-pressed="false"
+    class="
+      month-6
+      month-selector__month
+    "
+    tabindex="-1"
+  >
+    Jun
+  </button>
+  <button
+    aria-label="July"
+    aria-pressed="false"
+    class="
+      month-7
+      month-selector__month
+    "
+    tabindex="-1"
+  >
+    Jul
+  </button>
+  <button
+    aria-label="August"
+    aria-pressed="false"
+    class="
+      month-8
+      month-selector__month
+    "
+    tabindex="-1"
+  >
+    Aug
+  </button>
+  <button
+    aria-label="September"
+    aria-pressed="false"
+    class="
+      month-9
+      month-selector__month
+    "
+    tabindex="-1"
+  >
+    Sep
+  </button>
+  <button
+    aria-label="October"
+    aria-pressed="false"
+    class="
+      month-10
+      month-selector__month
+    "
+    tabindex="-1"
+  >
+    Oct
+  </button>
+  <button
+    aria-label="November"
+    aria-pressed="true"
+    class="
+      month-11
+      month-selector__month
+      month-selector__month--active
+      month-selector__month--selected
+    "
+    tabindex="0"
+  >
+    Nov
+  </button>
+  <button
+    aria-label="December"
+    aria-pressed="false"
+    class="
+      month-12
+      month-selector__month
+    "
+    tabindex="-1"
+  >
+    Dec
+  </button>
+</div>
+`;
+
+exports[`mounthpicker > MonthPickerVisual > shows the year picker after the month is selected 1`] = `
+<div
+  aria-label="Sélectionner une année"
+  class="year-selector"
+  role="group"
+>
+  <button
+    aria-pressed="false"
+    class="
+      year-1900
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1900
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1901
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1901
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1902
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1902
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1903
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1903
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1904
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1904
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1905
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1905
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1906
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1906
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1907
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1907
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1908
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1908
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1909
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1909
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1910
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1910
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1911
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1911
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1912
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1912
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1913
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1913
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1914
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1914
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1915
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1915
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1916
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1916
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1917
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1917
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1918
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1918
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1919
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1919
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1920
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1920
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1921
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1921
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1922
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1922
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1923
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1923
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1924
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1924
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1925
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1925
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1926
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1926
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1927
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1927
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1928
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1928
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1929
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1929
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1930
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1930
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1931
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1931
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1932
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1932
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1933
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1933
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1934
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1934
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1935
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1935
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1936
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1936
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1937
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1937
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1938
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1938
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1939
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1939
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1940
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1940
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1941
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1941
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1942
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1942
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1943
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1943
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1944
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1944
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1945
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1945
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1946
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1946
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1947
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1947
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1948
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1948
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1949
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1949
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1950
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1950
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1951
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1951
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1952
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1952
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1953
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1953
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1954
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1954
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1955
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1955
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1956
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1956
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1957
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1957
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1958
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1958
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1959
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1959
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1960
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1960
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1961
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1961
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1962
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1962
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1963
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1963
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1964
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1964
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1965
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1965
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1966
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1966
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1967
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1967
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1968
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1968
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1969
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1969
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1970
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1970
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1971
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1971
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1972
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1972
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1973
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1973
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1974
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1974
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1975
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1975
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1976
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1976
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1977
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1977
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1978
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1978
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1979
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1979
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1980
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1980
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1981
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1981
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1982
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1982
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1983
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1983
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1984
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1984
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1985
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1985
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1986
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1986
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1987
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1987
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1988
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1988
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1989
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1989
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1990
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1990
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1991
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1991
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1992
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1992
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1993
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1993
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1994
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1994
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1995
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1995
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1996
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1996
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1997
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1997
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1998
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1998
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-1999
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    1999
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2000
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2000
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2001
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2001
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2002
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2002
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2003
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2003
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2004
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2004
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2005
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2005
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2006
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2006
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2007
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2007
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2008
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2008
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2009
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2009
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2010
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2010
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2011
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2011
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2012
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2012
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2013
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2013
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2014
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2014
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2015
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2015
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2016
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2016
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2017
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2017
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2018
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2018
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2019
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2019
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2020
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2020
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2021
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2021
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2022
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2022
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2023
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2023
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2024
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2024
+  </button>
+  <button
+    aria-pressed="true"
+    class="
+      year-2025
+      year-selector__year
+      year-selector__year--active
+      year-selector__year--selected
+    "
+    tabindex="0"
+  >
+    2025
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2026
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2026
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2027
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2027
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2028
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2028
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2029
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2029
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2030
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2030
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2031
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2031
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2032
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2032
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2033
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2033
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2034
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2034
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2035
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2035
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2036
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2036
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2037
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2037
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2038
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2038
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2039
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2039
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2040
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2040
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2041
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2041
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2042
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2042
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2043
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2043
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2044
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2044
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2045
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2045
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2046
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2046
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2047
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2047
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2048
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2048
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2049
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2049
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2050
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2050
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2051
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2051
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2052
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2052
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2053
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2053
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2054
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2054
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2055
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2055
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2056
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2056
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2057
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2057
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2058
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2058
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2059
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2059
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2060
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2060
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2061
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2061
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2062
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2062
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2063
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2063
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2064
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2064
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2065
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2065
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2066
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2066
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2067
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2067
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2068
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2068
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2069
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2069
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2070
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2070
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2071
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2071
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2072
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2072
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2073
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2073
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2074
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2074
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2075
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2075
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2076
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2076
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2077
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2077
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2078
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2078
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2079
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2079
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2080
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2080
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2081
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2081
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2082
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2082
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2083
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2083
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2084
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2084
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2085
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2085
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2086
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2086
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2087
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2087
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2088
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2088
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2089
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2089
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2090
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2090
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2091
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2091
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2092
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2092
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2093
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2093
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2094
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2094
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2095
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2095
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2096
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2096
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2097
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2097
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2098
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2098
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2099
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2099
+  </button>
+  <button
+    aria-pressed="false"
+    class="
+      year-2100
+      year-selector__year
+    "
+    tabindex="-1"
+  >
+    2100
+  </button>
+</div>
+`;
+
+exports[`mounthpicker > should open the menu when clicking on the input 1`] = `
+<div class="month-picker-menu">
+  <div class="visual-picker-header">
+    <div
+      class="visual-picker-header__title"
+      id="v-3-title"
+    >
+      Sélectionner un mois
+    </div>
+    <div class="visual-picker-header__date">
+      December 2026
+    </div>
+  </div>
+  <div class="visual-picker-subheader">
+    <button
+      aria-label="Sélectionner une année, l'année sélectionnée est 2026"
+      class="visual-picker-year-btn"
+      title="Sélectionner une année, l'année sélectionnée est 2026"
+      type="button"
+    >
+      2026
+      <i
+        aria-hidden="true"
+        class="
+          M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z
+          mdi
+          notranslate
+          v-icon
+          v-icon--size-default
+          v-theme--light
+        "
+      ></i>
+    </button>
+  </div>
+  <div
+    aria-label="Sélectionner un mois"
+    class="month-selector"
+    role="group"
+  >
+    <button
+      aria-label="January"
+      aria-pressed="false"
+      class="
+        month-1
+        month-selector__month
+      "
+      tabindex="-1"
+    >
+      Jan
+    </button>
+    <button
+      aria-label="February"
+      aria-pressed="false"
+      class="
+        month-2
+        month-selector__month
+      "
+      tabindex="-1"
+    >
+      Feb
+    </button>
+    <button
+      aria-label="March"
+      aria-pressed="false"
+      class="
+        month-3
+        month-selector__month
+      "
+      tabindex="-1"
+    >
+      Mar
+    </button>
+    <button
+      aria-label="April"
+      aria-pressed="false"
+      class="
+        month-4
+        month-selector__month
+      "
+      tabindex="-1"
+    >
+      Apr
+    </button>
+    <button
+      aria-label="May"
+      aria-pressed="false"
+      class="
+        month-5
+        month-selector__month
+      "
+      tabindex="-1"
+    >
+      May
+    </button>
+    <button
+      aria-label="June"
+      aria-pressed="false"
+      class="
+        month-6
+        month-selector__month
+      "
+      tabindex="-1"
+    >
+      Jun
+    </button>
+    <button
+      aria-label="July"
+      aria-pressed="false"
+      class="
+        month-7
+        month-selector__month
+      "
+      tabindex="-1"
+    >
+      Jul
+    </button>
+    <button
+      aria-label="August"
+      aria-pressed="false"
+      class="
+        month-8
+        month-selector__month
+      "
+      tabindex="-1"
+    >
+      Aug
+    </button>
+    <button
+      aria-label="September"
+      aria-pressed="false"
+      class="
+        month-9
+        month-selector__month
+      "
+      tabindex="-1"
+    >
+      Sep
+    </button>
+    <button
+      aria-label="October"
+      aria-pressed="false"
+      class="
+        month-10
+        month-selector__month
+      "
+      tabindex="-1"
+    >
+      Oct
+    </button>
+    <button
+      aria-label="November"
+      aria-pressed="false"
+      class="
+        month-11
+        month-selector__month
+      "
+      tabindex="-1"
+    >
+      Nov
+    </button>
+    <button
+      aria-label="December"
+      aria-pressed="true"
+      class="
+        month-12
+        month-selector__month
+        month-selector__month--active
+        month-selector__month--selected
+      "
+      tabindex="0"
+    >
+      Dec
+    </button>
+  </div>
+  <div class="month-picker-footer">
+    <button
+      aria-label="Sélectionner le mois en cours"
+      class="month-picker-footer__current-month-btn"
+      title="Sélectionner le mois en cours"
+      type="button"
+    >
+      <i
+        aria-hidden="true"
+        class="
+          11H9V13H7V11M21
+          13V11H13V13H11M7
+          13V11H17V13H15M11
+          15H9V17H7V15M15
+          17V15H13V17H11Z
+          17V15H17V17H15M11
+          19
+          19V5C3
+          19V9H5V19H19M15
+          20.1
+          20.11
+          20.11
+          21
+          21
+          21
+          21
+          21H5C3.89
+          3
+          3
+          3
+          3
+          3.9
+          3.9
+          3.9
+          3H6V1H8V3H16V1H18V3H19C20.11
+          5
+          5M5
+          5V19C21
+          7H19V5H5V7M19
+          M7
+          mdi
+          notranslate
+          v-icon
+          v-icon--size-default
+          v-theme--light
+        "
+      ></i>
+      Mois actuel
+    </button>
+  </div>
+</div>
+`;
+
+exports[`mounthpicker > should render mounthpicker 1`] = `
+<div class="month-picker">
+  <div class="sy-textfield-container">
+    <div class="
+      basic-field
+      v-input
+      v-input--center-affix
+      v-input--density-default
+      v-input--dirty
+      v-input--horizontal
+      v-locale--is-ltr
+      v-text-field
+      v-theme--light
+    ">
+      <!---->
+      <div class="v-input__control">
+        <div class="
+          bg-white
+          v-field
+          v-field--active
+          v-field--appended
+          v-field--center-affix
+          v-field--dirty
+          v-field--has-background
+          v-field--prepended
+          v-field--variant-outlined
+          v-locale--is-ltr
+          v-theme--light
+        ">
+          <div class="v-field__overlay"></div>
+          <div class="v-field__loader">
+            <!-- v-if -->
+          </div>
+          <div class="v-field__prepend-inner">
+            <!-- v-if -->
+            <!-- v-if -->
+          </div>
+          <div
+            class="v-field__field"
+            data-no-activator=""
+          >
+            <!---->
+            <label
+              aria-hidden="true"
+              class="
+                v-field-label
+                v-label
+              "
+              id="input-v-1-label"
+            >
+              <!---->
+              Début du projet
+            </label>
+            <!---->
+            <input
+              aria-describedby="input-v-1-messages"
+              aria-label="Début du projet"
+              aria-labelledby="input-v-1-label"
+              autocomplete="off"
+              class="v-field__input"
+              direction="horizontal"
+              id="input-v-1"
+              size="1"
+              title="Début du projet"
+              type="text"
+              value="'11/2025'"
+            />
+            <!---->
+          </div>
+          <!---->
+          <div class="v-field__append-inner">
+            <!-- Keyboard-focusable clear button -->
+            <!-- v-if -->
+            <!-- v-if -->
+            <!-- v-if -->
+          </div>
+          <div class="v-field__outline">
+            <div class="v-field__outline__start"></div>
+            <div class="v-field__outline__notch">
+              <label
+                aria-hidden="false"
+                class="
+                  v-field-label
+                  v-field-label--floating
+                  v-label
+                "
+                for="input-v-1"
+              >
+                <!---->
+                Début du projet
+              </label>
+            </div>
+            <div class="v-field__outline__end"></div>
+            <!---->
+          </div>
+        </div>
+      </div>
+      <div class="v-input__append">
+        <button
+          aria-label="Ouvrir le sélecteur de mois"
+          class="month-picker-input__toggle-btn"
+          title="Ouvrir le sélecteur de mois"
+          type="button"
+        >
+          <i
+            aria-hidden="true"
+            class="
+              0
+              0
+              0,0
+              0,0
+              19,3H18V1M17,12H12V17H17V12Z
+              20.1,3
+              21,19V5C21,3.89
+              3,3.89
+              3,5V19A2,2
+              5,21H19A2,2
+              M19,19H5V8H19M16,1V3H8V1H6V3H5C3.89,3
+              mdi
+              notranslate
+              v-icon
+              v-icon--size-default
+              v-theme--light
+            "
+          ></i>
+        </button>
+      </div>
+      <div
+        aria-live="polite"
+        class="v-input__details"
+        id="input-v-1-messages"
+        role="alert"
+      >
+        <transition-group-stub
+          appear="false"
+          class="v-messages"
+          css="true"
+          name="slide-y-transition"
+          persisted="false"
+          tag="div"
+        >
+          <!---->
+        </transition-group-stub>
+        <!---->
+      </div>
+    </div>
+    <!-- v-if -->
+  </div>
+  <!---->
+  <!---->
+</div>
+`;