@youcan/celeste 0.7.2 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (73) hide show
  1. package/dist/celeste.css +495 -30
  2. package/dist/cjs/calendar.cjs +2 -0
  3. package/dist/cjs/chunks/ComboboxContent.cjs +1 -1
  4. package/dist/cjs/chunks/DialogPortal.cjs +1 -1
  5. package/dist/cjs/chunks/DismissableLayer.cjs +0 -34
  6. package/dist/cjs/chunks/FocusScope.cjs +2 -2
  7. package/dist/cjs/chunks/MenuContentImpl.cjs +1 -1
  8. package/dist/cjs/chunks/SelectItemAlignedPosition.cjs +1 -1
  9. package/dist/cjs/chunks/calendar.cjs +923 -0
  10. package/dist/cjs/chunks/components.cjs +9 -1
  11. package/dist/cjs/chunks/counter-input.cjs +2 -13
  12. package/dist/cjs/chunks/date-picker.cjs +99 -0
  13. package/dist/cjs/chunks/defu.cjs +34 -0
  14. package/dist/cjs/chunks/popover-content.cjs +1 -1
  15. package/dist/cjs/chunks/range-calendar.cjs +1170 -0
  16. package/dist/cjs/chunks/range-picker.cjs +231 -0
  17. package/dist/cjs/chunks/text-input.cjs +1 -1
  18. package/dist/cjs/chunks/tooltip-content.cjs +3 -2
  19. package/dist/cjs/chunks/useCalendar.cjs +2439 -0
  20. package/dist/cjs/chunks/useLocale.cjs +20 -0
  21. package/dist/cjs/date-picker.cjs +2 -0
  22. package/dist/cjs/index.cjs +9 -1
  23. package/dist/cjs/range-calendar.cjs +2 -0
  24. package/dist/cjs/range-picker.cjs +2 -0
  25. package/dist/components/calendar/calendar.d.ts +19 -0
  26. package/dist/components/calendar/index.d.ts +2 -0
  27. package/dist/components/date-picker/date-picker.d.ts +27 -0
  28. package/dist/components/date-picker/index.d.ts +2 -0
  29. package/dist/components/index.d.ts +4 -0
  30. package/dist/components/range-calendar/index.d.ts +2 -0
  31. package/dist/components/range-calendar/range-calendar.d.ts +24 -0
  32. package/dist/components/range-picker/index.d.ts +2 -0
  33. package/dist/components/range-picker/range-picker.d.ts +38 -0
  34. package/dist/components/rich-editor/rich-editor.d.ts +1 -1
  35. package/dist/components/text-input/text-input.d.ts +2 -2
  36. package/dist/es/calendar.js +2 -0
  37. package/dist/es/chunks/ComboboxContent.js +1 -1
  38. package/dist/es/chunks/DialogPortal.js +1 -1
  39. package/dist/es/chunks/DismissableLayer.js +1 -29
  40. package/dist/es/chunks/FocusScope.js +1 -1
  41. package/dist/es/chunks/MenuContentImpl.js +1 -1
  42. package/dist/es/chunks/SelectItemAlignedPosition.js +1 -1
  43. package/dist/es/chunks/calendar.js +916 -0
  44. package/dist/es/chunks/components.js +9 -1
  45. package/dist/es/chunks/counter-input.js +1 -12
  46. package/dist/es/chunks/date-picker.js +92 -0
  47. package/dist/es/chunks/defu.js +29 -0
  48. package/dist/es/chunks/popover-content.js +1 -1
  49. package/dist/es/chunks/range-calendar.js +1163 -0
  50. package/dist/es/chunks/range-picker.js +224 -0
  51. package/dist/es/chunks/text-input.js +1 -1
  52. package/dist/es/chunks/tooltip-content.js +2 -1
  53. package/dist/es/chunks/useCalendar.js +2331 -0
  54. package/dist/es/chunks/useLocale.js +14 -0
  55. package/dist/es/date-picker.js +2 -0
  56. package/dist/es/index.js +6 -2
  57. package/dist/es/range-calendar.js +2 -0
  58. package/dist/es/range-picker.js +2 -0
  59. package/package.json +4 -3
  60. package/src/components/calendar/calendar.vue +305 -0
  61. package/src/components/calendar/index.ts +2 -0
  62. package/src/components/calendar/stories/calendar.stories.ts +76 -0
  63. package/src/components/date-picker/date-picker.vue +91 -0
  64. package/src/components/date-picker/index.ts +2 -0
  65. package/src/components/date-picker/stories/date-picker.stories.ts +92 -0
  66. package/src/components/index.ts +4 -0
  67. package/src/components/range-calendar/index.ts +2 -0
  68. package/src/components/range-calendar/range-calendar.vue +363 -0
  69. package/src/components/range-calendar/stories/range-calendar.stories.ts +46 -0
  70. package/src/components/range-picker/index.ts +2 -0
  71. package/src/components/range-picker/range-picker.vue +237 -0
  72. package/src/components/range-picker/stories/range-picker.stories.ts +97 -0
  73. package/src/components/text-input/text-input.vue +2 -1
package/dist/celeste.css CHANGED
@@ -861,6 +861,172 @@
861
861
  .celeste-button-intent-error:not(:disabled).celeste-button-variant-ghost[data-v-d9a3a958]:not(:disabled):focus:not(:disabled) {
862
862
  outline: none;
863
863
  box-shadow: var(--shadow-buttons-error-focus);
864
+ }.celeste-calendar[data-v-b0c6d2f8] {
865
+ display: flex;
866
+ box-sizing: border-box;
867
+ flex-direction: column;
868
+ color: var(--color-text-sub-600);
869
+ gap: var(--spacing-8);
870
+ }
871
+ .celeste-calendar-header[data-v-b0c6d2f8] {
872
+ display: flex;
873
+ align-items: center;
874
+ justify-content: center;
875
+ padding: var(--spacing-6);
876
+ gap: var(--spacing-6);
877
+ border-radius: var(--radius-8);
878
+ background-color: var(--color-bg-weak-50);
879
+ }
880
+ .celeste-calendar-heading[data-v-b0c6d2f8] {
881
+ flex: 1;
882
+ color: var(--color-text-sub-600);
883
+ font: var(--label-sm);
884
+ text-align: center;
885
+ }
886
+ .celeste-calendar-nav[data-v-b0c6d2f8] {
887
+ display: inline-flex;
888
+ box-sizing: border-box;
889
+ align-items: center;
890
+ justify-content: center;
891
+ width: 24px;
892
+ height: 24px;
893
+ padding: 2px;
894
+ transition-property: background-color, color, box-shadow;
895
+ transition-duration: var(--animation-fast);
896
+ transition-timing-function: ease-out;
897
+ border: none;
898
+ border-radius: var(--radius-6);
899
+ background-color: var(--color-bg-white-0);
900
+ box-shadow: var(--shadow-regular-xs);
901
+ color: var(--color-icon-sub-600);
902
+ cursor: pointer;
903
+ }
904
+ .celeste-calendar-nav i[data-v-b0c6d2f8] {
905
+ width: 20px;
906
+ height: 20px;
907
+ }
908
+ .celeste-calendar-nav:dir(rtl) i[data-v-b0c6d2f8] {
909
+ transform: scaleX(-1);
910
+ }
911
+ .celeste-calendar-nav[data-v-b0c6d2f8]:hover {
912
+ color: var(--color-icon-strong-950);
913
+ }
914
+ .celeste-calendar-nav[data-v-b0c6d2f8]:focus-visible {
915
+ outline: none;
916
+ box-shadow: var(--shadow-buttons-important-focus);
917
+ }
918
+ .celeste-calendar-nav[data-disabled][data-v-b0c6d2f8] {
919
+ background-color: transparent;
920
+ box-shadow: none;
921
+ color: var(--color-icon-disabled-300);
922
+ cursor: default;
923
+ pointer-events: none;
924
+ }
925
+ .celeste-calendar-months[data-v-b0c6d2f8] {
926
+ display: flex;
927
+ gap: var(--spacing-16);
928
+ }
929
+ .celeste-calendar-grid[data-v-b0c6d2f8] {
930
+ display: flex;
931
+ flex-direction: column;
932
+ gap: var(--spacing-8);
933
+ width: 100%;
934
+ border-collapse: collapse;
935
+ }
936
+ .celeste-calendar-body[data-v-b0c6d2f8] {
937
+ display: flex;
938
+ flex-direction: column;
939
+ gap: var(--spacing-8);
940
+ }
941
+ .celeste-calendar-week[data-v-b0c6d2f8] {
942
+ display: flex;
943
+ align-items: center;
944
+ gap: var(--spacing-8);
945
+ }
946
+ .celeste-calendar-weekday[data-v-b0c6d2f8] {
947
+ flex: 1;
948
+ padding-block: var(--spacing-10);
949
+ color: var(--color-text-soft-400);
950
+ font: var(--label-sm);
951
+ text-align: center;
952
+ text-transform: uppercase;
953
+ }
954
+ .celeste-calendar-cell[data-v-b0c6d2f8] {
955
+ position: relative;
956
+ flex: 1;
957
+ min-width: 0;
958
+ }
959
+ .celeste-calendar-day[data-v-b0c6d2f8] {
960
+ display: flex;
961
+ position: relative;
962
+ box-sizing: border-box;
963
+ align-items: center;
964
+ justify-content: center;
965
+ width: 100%;
966
+ padding-block: var(--spacing-10);
967
+ transition-property: background-color, color;
968
+ transition-duration: var(--animation-fast);
969
+ transition-timing-function: ease-out;
970
+ border-radius: var(--radius-8);
971
+ background-color: var(--color-bg-white-0);
972
+ color: var(--color-text-sub-600);
973
+ font: var(--label-sm);
974
+ cursor: pointer;
975
+ -webkit-user-select: none;
976
+ -moz-user-select: none;
977
+ user-select: none;
978
+ }
979
+ .celeste-calendar-day[data-v-b0c6d2f8]:hover {
980
+ background-color: var(--color-bg-weak-50);
981
+ color: var(--color-text-strong-950);
982
+ }
983
+ .celeste-calendar-day[data-v-b0c6d2f8]:focus-visible {
984
+ outline: none;
985
+ box-shadow: var(--shadow-buttons-important-focus);
986
+ }
987
+ .celeste-calendar-day[data-outside-view][data-v-b0c6d2f8], .celeste-calendar-day[data-outside-visible-view][data-v-b0c6d2f8] {
988
+ color: var(--color-text-disabled-300);
989
+ }
990
+ .celeste-calendar-day[data-outside-view][data-v-b0c6d2f8]:hover, .celeste-calendar-day[data-outside-visible-view][data-v-b0c6d2f8]:hover {
991
+ background-color: var(--color-bg-white-0);
992
+ color: var(--color-text-disabled-300);
993
+ }
994
+ .celeste-calendar-day[data-disabled][data-v-b0c6d2f8] {
995
+ color: var(--color-text-disabled-300);
996
+ cursor: default;
997
+ pointer-events: none;
998
+ }
999
+ .celeste-calendar-day[data-unavailable][data-v-b0c6d2f8] {
1000
+ color: var(--color-text-disabled-300);
1001
+ text-decoration: line-through;
1002
+ pointer-events: none;
1003
+ }
1004
+ .celeste-calendar-day[data-selected][data-v-b0c6d2f8] {
1005
+ background-color: var(--color-primary-base);
1006
+ color: var(--color-text-white-0);
1007
+ }
1008
+ .celeste-calendar-day[data-selected][data-v-b0c6d2f8]:hover {
1009
+ background-color: var(--color-primary-base);
1010
+ color: var(--color-text-white-0);
1011
+ }
1012
+ .celeste-calendar-day-number[data-v-b0c6d2f8] {
1013
+ position: relative;
1014
+ }
1015
+ .celeste-calendar-day[data-today][data-v-b0c6d2f8]::after,
1016
+ .celeste-calendar-day[data-marked][data-v-b0c6d2f8]::after {
1017
+ content: "";
1018
+ position: absolute;
1019
+ bottom: 6px;
1020
+ left: 50%;
1021
+ width: 3px;
1022
+ height: 3px;
1023
+ transform: translateX(-50%);
1024
+ border-radius: var(--radius-full);
1025
+ background-color: var(--color-primary-base);
1026
+ }
1027
+ .celeste-calendar-day[data-selected][data-today][data-v-b0c6d2f8]::after,
1028
+ .celeste-calendar-day[data-selected][data-marked][data-v-b0c6d2f8]::after {
1029
+ background-color: var(--color-text-white-0);
864
1030
  }[data-v-93ac8a54] {
865
1031
  box-sizing: border-box;
866
1032
  }
@@ -1834,7 +2000,7 @@ to {
1834
2000
  .celeste-text-input-button[inline=true][data-v-8b3cdb5f]:hover {
1835
2001
  background-color: transparent !important;
1836
2002
  }/* stylelint-disable no-descending-specificity */
1837
- .celeste-text-input-wrapper[data-v-4aaec87f] {
2003
+ .celeste-text-input-wrapper[data-v-394fa109] {
1838
2004
  --celeste-text-input-border-color: var(--color-stroke-soft-200);
1839
2005
  --celeste-text-input-drop-shadow: var(--shadow-regular-xs);
1840
2006
  --celeste-text-input-icon-color: var(--color-text-soft-400);
@@ -1857,28 +2023,28 @@ to {
1857
2023
  font: var(--paragraph-sm);
1858
2024
  gap: var(--input-gap);
1859
2025
  }
1860
- .celeste-text-input-wrapper[size=xs][data-v-4aaec87f] {
2026
+ .celeste-text-input-wrapper[size=xs][data-v-394fa109] {
1861
2027
  --input-gap: 8px;
1862
2028
  --input-height: 32px;
1863
2029
  --input-radius: var(--radius-8);
1864
2030
  --input-padding: calc(var(--spacing-8) - var(--spacing-2));
1865
2031
  }
1866
- .celeste-text-input-wrapper[size=sm][data-v-4aaec87f] {
2032
+ .celeste-text-input-wrapper[size=sm][data-v-394fa109] {
1867
2033
  --input-gap: 6px;
1868
2034
  --input-height: 36px;
1869
2035
  --input-radius: var(--radius-8);
1870
2036
  --input-padding: var(--spacing-8);
1871
2037
  }
1872
- .celeste-text-input-wrapper[size=md][data-v-4aaec87f] {
2038
+ .celeste-text-input-wrapper[size=md][data-v-394fa109] {
1873
2039
  --input-gap: 6px;
1874
2040
  --input-height: 40px;
1875
2041
  --input-radius: var(--radius-10);
1876
2042
  --input-padding: var(--spacing-10);
1877
2043
  }
1878
- .celeste-text-input-wrapper[has-error=true][data-v-4aaec87f] {
2044
+ .celeste-text-input-wrapper[has-error=true][data-v-394fa109] {
1879
2045
  --celeste-text-input-border-color: var(--color-state-error-base);
1880
2046
  }
1881
- .celeste-text-input-wrapper .celeste-text-input[data-v-4aaec87f] {
2047
+ .celeste-text-input-wrapper .celeste-text-input[data-v-394fa109] {
1882
2048
  width: 100%;
1883
2049
  height: 100%;
1884
2050
  padding: 0;
@@ -1888,49 +2054,49 @@ to {
1888
2054
  color: inherit;
1889
2055
  font: inherit;
1890
2056
  }
1891
- .celeste-text-input-wrapper .celeste-text-input[data-v-4aaec87f]::-moz-placeholder {
2057
+ .celeste-text-input-wrapper .celeste-text-input[data-v-394fa109]::-moz-placeholder {
1892
2058
  -moz-transition: color var(--animation-fast) ease-out;
1893
2059
  transition: color var(--animation-fast) ease-out;
1894
2060
  color: var(--celeste-text-input-placeholder-color);
1895
2061
  }
1896
- .celeste-text-input-wrapper .celeste-text-input[data-v-4aaec87f]::placeholder {
2062
+ .celeste-text-input-wrapper .celeste-text-input[data-v-394fa109]::placeholder {
1897
2063
  transition: color var(--animation-fast) ease-out;
1898
2064
  color: var(--celeste-text-input-placeholder-color);
1899
2065
  }
1900
- .celeste-text-input-wrapper .celeste-text-input[type=search][data-v-4aaec87f]::-webkit-search-cancel-button {
2066
+ .celeste-text-input-wrapper .celeste-text-input[type=search][data-v-394fa109]::-webkit-search-cancel-button {
1901
2067
  display: none;
1902
2068
  -webkit-appearance: none;
1903
2069
  appearance: none;
1904
2070
  }
1905
- .celeste-text-input-wrapper .celeste-text-input[type=search][data-v-4aaec87f]::-webkit-search-decoration {
2071
+ .celeste-text-input-wrapper .celeste-text-input[type=search][data-v-394fa109]::-webkit-search-decoration {
1906
2072
  display: none;
1907
2073
  -webkit-appearance: none;
1908
2074
  appearance: none;
1909
2075
  }
1910
- .celeste-text-input-wrapper[data-v-4aaec87f]:has(.celeste-text-input-leading-node) {
2076
+ .celeste-text-input-wrapper[data-v-394fa109]:has(.celeste-text-input-leading-node) {
1911
2077
  padding-inline-start: 0;
1912
2078
  }
1913
- .celeste-text-input-wrapper[data-v-4aaec87f]:has(.celeste-text-input-trailing-node) {
2079
+ .celeste-text-input-wrapper[data-v-394fa109]:has(.celeste-text-input-trailing-node) {
1914
2080
  padding-inline-end: 0;
1915
2081
  }
1916
- .celeste-text-input-wrapper[data-v-4aaec87f]:has(.celeste-text-input:focus) {
2082
+ .celeste-text-input-wrapper[data-v-394fa109]:has(.celeste-text-input:focus) {
1917
2083
  --celeste-text-input-border-color: var(--color-stroke-strong-950);
1918
2084
  --celeste-text-input-placeholder-color: var(--color-text-sub-600);
1919
2085
  --celeste-text-input-icon-color: var(--color-text-sub-600);
1920
2086
  --celeste-text-input-affix-color: var(--color-text-sub-600);
1921
2087
  outline-color: var(--color-stroke-soft-200);
1922
2088
  }
1923
- .celeste-text-input-wrapper:has(.celeste-text-input:focus)[has-error=true][data-v-4aaec87f] {
2089
+ .celeste-text-input-wrapper:has(.celeste-text-input:focus)[has-error=true][data-v-394fa109] {
1924
2090
  --celeste-text-input-border-color: var(--color-state-error-base);
1925
2091
  outline-color: var(--color-state-error-lighter);
1926
2092
  }
1927
- .celeste-text-input-wrapper[data-v-4aaec87f] input:-webkit-autofill {
2093
+ .celeste-text-input-wrapper[data-v-394fa109] input:-webkit-autofill {
1928
2094
  -webkit-transition: background-color 5000s ease-in-out 0s;
1929
2095
  transition: background-color 5000s ease-in-out 0s;
1930
2096
  -webkit-background-clip: text;
1931
2097
  background-clip: text;
1932
2098
  }
1933
- .celeste-text-input-wrapper[data-v-4aaec87f]:has(.celeste-text-input:disabled) {
2099
+ .celeste-text-input-wrapper[data-v-394fa109]:has(.celeste-text-input:disabled) {
1934
2100
  --celeste-text-input-border-color: transparent;
1935
2101
  --celeste-text-input-drop-shadow: none;
1936
2102
  --celeste-text-input-affix-background-color: var(--color-bg-weak-50);
@@ -1942,56 +2108,56 @@ to {
1942
2108
  color: var(--color-text-disabled-300);
1943
2109
  pointer-events: none;
1944
2110
  }
1945
- .celeste-text-input-wrapper:has(.celeste-text-input:disabled) .celeste-text-input[data-v-4aaec87f]::-moz-placeholder {
2111
+ .celeste-text-input-wrapper:has(.celeste-text-input:disabled) .celeste-text-input[data-v-394fa109]::-moz-placeholder {
1946
2112
  color: currentcolor;
1947
2113
  }
1948
- .celeste-text-input-wrapper:has(.celeste-text-input:disabled) .celeste-text-input[data-v-4aaec87f]::placeholder {
2114
+ .celeste-text-input-wrapper:has(.celeste-text-input:disabled) .celeste-text-input[data-v-394fa109]::placeholder {
1949
2115
  color: currentcolor;
1950
2116
  }
1951
- .celeste-text-input-wrapper:has(.celeste-text-input:disabled) .celeste-text-input-clear-button[data-v-4aaec87f] {
2117
+ .celeste-text-input-wrapper:has(.celeste-text-input:disabled) .celeste-text-input-clear-button[data-v-394fa109] {
1952
2118
  color: var(--color-text-disabled-300);
1953
2119
  pointer-events: none;
1954
2120
  }
1955
- .celeste-text-input-wrapper[data-v-4aaec87f]:has(.celeste-text-input:hover:not(:focus, :disabled)):not(:has(.celeste-text-input-node)) {
2121
+ .celeste-text-input-wrapper[data-v-394fa109]:has(.celeste-text-input:hover:not(:focus, :disabled)):not(:has(.celeste-text-input-node)) {
1956
2122
  --celeste-text-input-border-color: transparent;
1957
2123
  }
1958
- .celeste-text-input-wrapper[data-v-4aaec87f]:has(.celeste-text-input:hover:not(:focus, :disabled)):not(:has(.celeste-text-input-node:hover)) {
2124
+ .celeste-text-input-wrapper[data-v-394fa109]:has(.celeste-text-input:hover:not(:focus, :disabled)):not(:has(.celeste-text-input-node:hover)) {
1959
2125
  --celeste-text-input-icon-color: var(--color-text-sub-600);
1960
2126
  --celeste-text-input-placeholder-color: var(--color-text-sub-600);
1961
2127
  background-color: var(--color-bg-weak-50);
1962
2128
  }
1963
- .celeste-text-input-wrapper .celeste-text-input-icon[data-v-4aaec87f] {
2129
+ .celeste-text-input-wrapper .celeste-text-input-icon[data-v-394fa109] {
1964
2130
  flex-shrink: 0;
1965
2131
  width: 20px;
1966
2132
  height: 20px;
1967
2133
  transition: all var(--animation-fast) ease-out;
1968
2134
  color: var(--celeste-text-input-icon-color);
1969
2135
  }
1970
- .celeste-text-input-wrapper[data-v-4aaec87f] .celeste-text-input-node.celeste-text-input-leading-node,
1971
- .celeste-text-input-wrapper[data-v-4aaec87f] .celeste-text-input-node.celeste-text-input-trailing-node {
2136
+ .celeste-text-input-wrapper[data-v-394fa109] .celeste-text-input-node.celeste-text-input-leading-node,
2137
+ .celeste-text-input-wrapper[data-v-394fa109] .celeste-text-input-node.celeste-text-input-trailing-node {
1972
2138
  height: calc(var(--input-height) - var(--spacing-2)) !important;
1973
2139
  }
1974
- [dir=ltr] .celeste-text-input-wrapper[data-v-4aaec87f] .celeste-text-input-node.celeste-text-input-leading-node {
2140
+ [dir=ltr] .celeste-text-input-wrapper[data-v-394fa109] .celeste-text-input-node.celeste-text-input-leading-node {
1975
2141
  border-right: 1px solid var(--color-stroke-soft-200) !important;
1976
2142
  border-radius: var(--input-radius) 0 0 var(--input-radius) !important;
1977
2143
  }
1978
- [dir=ltr] .celeste-text-input-wrapper[data-v-4aaec87f] .celeste-text-input-node.celeste-text-input-trailing-node {
2144
+ [dir=ltr] .celeste-text-input-wrapper[data-v-394fa109] .celeste-text-input-node.celeste-text-input-trailing-node {
1979
2145
  border-left: 1px solid var(--color-stroke-soft-200) !important;
1980
2146
  border-radius: 0 var(--input-radius) var(--input-radius) 0 !important;
1981
2147
  }
1982
- [dir=rtl] .celeste-text-input-wrapper[data-v-4aaec87f] .celeste-text-input-node.celeste-text-input-leading-node {
2148
+ [dir=rtl] .celeste-text-input-wrapper[data-v-394fa109] .celeste-text-input-node.celeste-text-input-leading-node {
1983
2149
  border-left: 1px solid var(--color-stroke-soft-200) !important;
1984
2150
  border-radius: 0 var(--input-radius) var(--input-radius) 0 !important;
1985
2151
  }
1986
- [dir=rtl] .celeste-text-input-wrapper[data-v-4aaec87f] .celeste-text-input-node.celeste-text-input-trailing-node {
2152
+ [dir=rtl] .celeste-text-input-wrapper[data-v-394fa109] .celeste-text-input-node.celeste-text-input-trailing-node {
1987
2153
  border-right: 1px solid var(--color-stroke-soft-200) !important;
1988
2154
  border-radius: var(--input-radius) 0 0 var(--input-radius) !important;
1989
2155
  }
1990
- .celeste-text-input-wrapper[data-v-4aaec87f] .celeste-text-input-node.celeste-text-input-leading-node {
2156
+ .celeste-text-input-wrapper[data-v-394fa109] .celeste-text-input-node.celeste-text-input-leading-node {
1991
2157
  border-right: 1px solid var(--color-stroke-soft-200) !important;
1992
2158
  border-radius: var(--input-radius) 0 0 var(--input-radius) !important;
1993
2159
  }
1994
- .celeste-text-input-wrapper[data-v-4aaec87f] .celeste-text-input-node.celeste-text-input-trailing-node {
2160
+ .celeste-text-input-wrapper[data-v-394fa109] .celeste-text-input-node.celeste-text-input-trailing-node {
1995
2161
  border-left: 1px solid var(--color-stroke-soft-200) !important;
1996
2162
  border-radius: 0 var(--input-radius) var(--input-radius) 0 !important;
1997
2163
  }.celeste-picker-trigger[data-v-94b97787] {
@@ -2720,6 +2886,31 @@ to {
2720
2886
  .celeste-counter-input-wrapper:has(.celeste-counter-input:hover:not(:focus, :disabled)) {
2721
2887
  --celeste-counter-input-border-color: transparent;
2722
2888
  --celeste-counter-input-bg-color: var(--color-bg-weak-50);
2889
+ }.celeste-date-picker[data-v-ac6d198e] {
2890
+ display: flex;
2891
+ box-sizing: border-box;
2892
+ flex-direction: column;
2893
+ width: 368px;
2894
+ max-width: 100%;
2895
+ overflow: hidden;
2896
+ border: 1px solid var(--color-stroke-soft-200);
2897
+ border-radius: var(--radius-20);
2898
+ background-color: var(--color-bg-white-0);
2899
+ box-shadow: var(--shadow-regular-md);
2900
+ }
2901
+ .celeste-date-picker-body[data-v-ac6d198e] {
2902
+ padding: 20px;
2903
+ border-block-end: 1px solid var(--color-stroke-soft-200);
2904
+ }
2905
+ .celeste-date-picker-footer[data-v-ac6d198e] {
2906
+ display: flex;
2907
+ align-items: center;
2908
+ justify-content: center;
2909
+ padding: var(--spacing-16);
2910
+ gap: var(--spacing-16);
2911
+ }
2912
+ .celeste-date-picker-action[data-v-ac6d198e] {
2913
+ flex: 1;
2723
2914
  }.celeste-digit-input-group[data-v-442c7563] {
2724
2915
  display: flex;
2725
2916
  align-items: center;
@@ -3667,6 +3858,208 @@ to {
3667
3858
  height: 8px;
3668
3859
  border-radius: var(--radius-full);
3669
3860
  background-color: var(--color-static-white);
3861
+ }.celeste-range-calendar[data-v-dc79fc39] {
3862
+ display: flex;
3863
+ box-sizing: border-box;
3864
+ color: var(--color-text-sub-600);
3865
+ }
3866
+ .celeste-range-calendar-months[data-v-dc79fc39] {
3867
+ display: flex;
3868
+ align-items: stretch;
3869
+ }
3870
+ .celeste-range-calendar-month[data-v-dc79fc39] {
3871
+ display: flex;
3872
+ flex: 1;
3873
+ flex-direction: column;
3874
+ gap: var(--spacing-8);
3875
+ min-width: 0;
3876
+ padding: 20px;
3877
+ }
3878
+ .celeste-range-calendar-month[data-v-dc79fc39]:not(:last-child) {
3879
+ border-inline-end: 1px solid var(--color-stroke-soft-200);
3880
+ }
3881
+ .celeste-range-calendar-header[data-v-dc79fc39] {
3882
+ display: flex;
3883
+ align-items: center;
3884
+ justify-content: center;
3885
+ padding: var(--spacing-6);
3886
+ gap: var(--spacing-6);
3887
+ border-radius: var(--radius-8);
3888
+ background-color: var(--color-bg-weak-50);
3889
+ }
3890
+ .celeste-range-calendar-heading[data-v-dc79fc39] {
3891
+ flex: 1;
3892
+ color: var(--color-text-sub-600);
3893
+ font: var(--label-sm);
3894
+ text-align: center;
3895
+ }
3896
+ .celeste-range-calendar-nav[data-v-dc79fc39] {
3897
+ display: inline-flex;
3898
+ box-sizing: border-box;
3899
+ align-items: center;
3900
+ justify-content: center;
3901
+ width: 24px;
3902
+ height: 24px;
3903
+ padding: 2px;
3904
+ transition-property: background-color, color, box-shadow;
3905
+ transition-duration: var(--animation-fast);
3906
+ transition-timing-function: ease-out;
3907
+ border: none;
3908
+ border-radius: var(--radius-6);
3909
+ background-color: var(--color-bg-white-0);
3910
+ box-shadow: var(--shadow-regular-xs);
3911
+ color: var(--color-icon-sub-600);
3912
+ cursor: pointer;
3913
+ }
3914
+ .celeste-range-calendar-nav i[data-v-dc79fc39] {
3915
+ width: 20px;
3916
+ height: 20px;
3917
+ }
3918
+ .celeste-range-calendar-nav:dir(rtl) i[data-v-dc79fc39] {
3919
+ transform: scaleX(-1);
3920
+ }
3921
+ .celeste-range-calendar-nav[data-v-dc79fc39]:hover {
3922
+ color: var(--color-icon-strong-950);
3923
+ }
3924
+ .celeste-range-calendar-nav[data-v-dc79fc39]:focus-visible {
3925
+ outline: none;
3926
+ box-shadow: var(--shadow-buttons-important-focus);
3927
+ }
3928
+ .celeste-range-calendar-nav[data-disabled][data-v-dc79fc39] {
3929
+ background-color: transparent;
3930
+ box-shadow: none;
3931
+ color: var(--color-icon-disabled-300);
3932
+ cursor: default;
3933
+ pointer-events: none;
3934
+ }
3935
+ .celeste-range-calendar-grid[data-v-dc79fc39] {
3936
+ display: flex;
3937
+ flex-direction: column;
3938
+ gap: var(--spacing-8);
3939
+ width: 100%;
3940
+ border-collapse: collapse;
3941
+ }
3942
+ .celeste-range-calendar-body[data-v-dc79fc39] {
3943
+ display: flex;
3944
+ flex-direction: column;
3945
+ gap: var(--spacing-8);
3946
+ }
3947
+ .celeste-range-calendar-week[data-v-dc79fc39] {
3948
+ display: grid;
3949
+ grid-template-columns: repeat(7, minmax(0, 1fr));
3950
+ align-items: center;
3951
+ }
3952
+ .celeste-range-calendar-weekday[data-v-dc79fc39] {
3953
+ padding-block: var(--spacing-10);
3954
+ color: var(--color-text-soft-400);
3955
+ font: var(--label-sm);
3956
+ text-align: center;
3957
+ text-transform: uppercase;
3958
+ }
3959
+ .celeste-range-calendar-cell[data-v-dc79fc39] {
3960
+ position: relative;
3961
+ min-width: 0;
3962
+ }
3963
+ .celeste-range-calendar-cell[data-v-dc79fc39]:has(.celeste-range-calendar-day[data-selected]),
3964
+ .celeste-range-calendar-cell[data-v-dc79fc39]:has(.celeste-range-calendar-day[data-highlighted]) {
3965
+ background-color: var(--color-primary-alpha-10);
3966
+ }
3967
+ .celeste-range-calendar-cell[data-v-dc79fc39]:has(.celeste-range-calendar-day[data-selection-start]),
3968
+ .celeste-range-calendar-cell[data-v-dc79fc39]:has(.celeste-range-calendar-day[data-highlighted-start]),
3969
+ .celeste-range-calendar-week > .celeste-range-calendar-cell[data-v-dc79fc39]:first-child:has(.celeste-range-calendar-day[data-selected]),
3970
+ .celeste-range-calendar-week > .celeste-range-calendar-cell[data-v-dc79fc39]:first-child:has(.celeste-range-calendar-day[data-highlighted]) {
3971
+ border-start-start-radius: var(--radius-8);
3972
+ border-end-start-radius: var(--radius-8);
3973
+ }
3974
+ .celeste-range-calendar-cell[data-v-dc79fc39]:has(.celeste-range-calendar-day[data-selection-end]),
3975
+ .celeste-range-calendar-cell[data-v-dc79fc39]:has(.celeste-range-calendar-day[data-highlighted-end]),
3976
+ .celeste-range-calendar-week > .celeste-range-calendar-cell[data-v-dc79fc39]:last-child:has(.celeste-range-calendar-day[data-selected]),
3977
+ .celeste-range-calendar-week > .celeste-range-calendar-cell[data-v-dc79fc39]:last-child:has(.celeste-range-calendar-day[data-highlighted]) {
3978
+ border-start-end-radius: var(--radius-8);
3979
+ border-end-end-radius: var(--radius-8);
3980
+ }
3981
+ .celeste-range-calendar-day[data-v-dc79fc39] {
3982
+ display: flex;
3983
+ position: relative;
3984
+ box-sizing: border-box;
3985
+ align-items: center;
3986
+ justify-content: center;
3987
+ width: 40px;
3988
+ max-width: 100%;
3989
+ margin-inline: auto;
3990
+ padding-block: var(--spacing-10);
3991
+ transition-property: background-color, color;
3992
+ transition-duration: var(--animation-fast);
3993
+ transition-timing-function: ease-out;
3994
+ border-radius: var(--radius-8);
3995
+ background-color: transparent;
3996
+ color: var(--color-text-sub-600);
3997
+ font: var(--label-sm);
3998
+ cursor: pointer;
3999
+ -webkit-user-select: none;
4000
+ -moz-user-select: none;
4001
+ user-select: none;
4002
+ }
4003
+ .celeste-range-calendar-day[data-v-dc79fc39]:hover {
4004
+ background-color: var(--color-bg-weak-50);
4005
+ color: var(--color-text-strong-950);
4006
+ }
4007
+ .celeste-range-calendar-day[data-v-dc79fc39]:focus-visible {
4008
+ outline: none;
4009
+ box-shadow: var(--shadow-buttons-important-focus);
4010
+ }
4011
+ .celeste-range-calendar-day[data-outside-view][data-v-dc79fc39], .celeste-range-calendar-day[data-outside-visible-view][data-v-dc79fc39] {
4012
+ color: var(--color-text-disabled-300);
4013
+ }
4014
+ .celeste-range-calendar-day[data-outside-view][data-v-dc79fc39]:hover, .celeste-range-calendar-day[data-outside-visible-view][data-v-dc79fc39]:hover {
4015
+ background-color: transparent;
4016
+ color: var(--color-text-disabled-300);
4017
+ }
4018
+ .celeste-range-calendar-day[data-disabled][data-v-dc79fc39] {
4019
+ color: var(--color-text-disabled-300);
4020
+ cursor: default;
4021
+ pointer-events: none;
4022
+ }
4023
+ .celeste-range-calendar-day[data-unavailable][data-v-dc79fc39] {
4024
+ color: var(--color-text-disabled-300);
4025
+ text-decoration: line-through;
4026
+ pointer-events: none;
4027
+ }
4028
+ .celeste-range-calendar-day[data-selected][data-v-dc79fc39], .celeste-range-calendar-day[data-highlighted][data-v-dc79fc39] {
4029
+ color: var(--color-primary-base);
4030
+ }
4031
+ .celeste-range-calendar-day[data-selected][data-v-dc79fc39]:hover, .celeste-range-calendar-day[data-highlighted][data-v-dc79fc39]:hover {
4032
+ background-color: transparent;
4033
+ color: var(--color-primary-base);
4034
+ }
4035
+ .celeste-range-calendar-day[data-selection-start][data-v-dc79fc39], .celeste-range-calendar-day[data-selection-end][data-v-dc79fc39] {
4036
+ background-color: var(--color-primary-base);
4037
+ color: var(--color-text-white-0);
4038
+ }
4039
+ .celeste-range-calendar-day[data-selection-start][data-v-dc79fc39]:hover, .celeste-range-calendar-day[data-selection-end][data-v-dc79fc39]:hover {
4040
+ background-color: var(--color-primary-base);
4041
+ color: var(--color-text-white-0);
4042
+ }
4043
+ .celeste-range-calendar-day-number[data-v-dc79fc39] {
4044
+ position: relative;
4045
+ }
4046
+ .celeste-range-calendar-day[data-today][data-v-dc79fc39]::after,
4047
+ .celeste-range-calendar-day[data-marked][data-v-dc79fc39]::after {
4048
+ content: "";
4049
+ position: absolute;
4050
+ bottom: 6px;
4051
+ left: 50%;
4052
+ width: 3px;
4053
+ height: 3px;
4054
+ transform: translateX(-50%);
4055
+ border-radius: var(--radius-full);
4056
+ background-color: var(--color-primary-base);
4057
+ }
4058
+ .celeste-range-calendar-day[data-selection-start][data-today][data-v-dc79fc39]::after,
4059
+ .celeste-range-calendar-day[data-selection-end][data-today][data-v-dc79fc39]::after,
4060
+ .celeste-range-calendar-day[data-selection-start][data-marked][data-v-dc79fc39]::after,
4061
+ .celeste-range-calendar-day[data-selection-end][data-marked][data-v-dc79fc39]::after {
4062
+ background-color: var(--color-text-white-0);
3670
4063
  }.celeste-scroll-bar[data-v-4c845c7c] {
3671
4064
  --bar-size: 8px;
3672
4065
  display: flex;
@@ -4412,6 +4805,78 @@ to {
4412
4805
  }.celeste-radio-wrapper[data-orientation=vertical] {
4413
4806
  display: flex;
4414
4807
  flex-direction: column;
4808
+ }.celeste-range-picker[data-v-4f5c8aa9] {
4809
+ display: flex;
4810
+ box-sizing: border-box;
4811
+ align-items: stretch;
4812
+ max-width: 100%;
4813
+ overflow: hidden;
4814
+ border: 1px solid var(--color-stroke-soft-200);
4815
+ border-radius: var(--radius-20);
4816
+ background-color: var(--color-bg-white-0);
4817
+ box-shadow: var(--shadow-regular-md);
4818
+ }
4819
+ .celeste-range-picker-presets[data-v-4f5c8aa9] {
4820
+ display: flex;
4821
+ box-sizing: border-box;
4822
+ flex-direction: column;
4823
+ width: 200px;
4824
+ padding: 20px var(--spacing-16) var(--spacing-2);
4825
+ gap: var(--spacing-8);
4826
+ border-inline-end: 1px solid var(--color-stroke-soft-200);
4827
+ }
4828
+ .celeste-range-picker-preset[data-v-4f5c8aa9] {
4829
+ display: flex;
4830
+ align-items: center;
4831
+ padding: var(--spacing-8) var(--spacing-8) var(--spacing-8) var(--spacing-12);
4832
+ transition-property: background-color, color;
4833
+ transition-duration: var(--animation-fast);
4834
+ transition-timing-function: ease-out;
4835
+ border: none;
4836
+ border-radius: var(--radius-8);
4837
+ background-color: var(--color-bg-white-0);
4838
+ color: var(--color-text-sub-600);
4839
+ font: var(--label-sm);
4840
+ text-align: start;
4841
+ cursor: pointer;
4842
+ }
4843
+ .celeste-range-picker-preset[data-v-4f5c8aa9]:hover {
4844
+ background-color: var(--color-bg-weak-50);
4845
+ color: var(--color-text-strong-950);
4846
+ }
4847
+ .celeste-range-picker-preset[data-v-4f5c8aa9]:focus-visible {
4848
+ outline: none;
4849
+ box-shadow: var(--shadow-buttons-important-focus);
4850
+ }
4851
+ .celeste-range-picker-preset[data-active][data-v-4f5c8aa9] {
4852
+ background-color: var(--color-bg-weak-50);
4853
+ color: var(--color-text-strong-950);
4854
+ }
4855
+ .celeste-range-picker-content[data-v-4f5c8aa9] {
4856
+ display: flex;
4857
+ flex: 1;
4858
+ flex-direction: column;
4859
+ min-width: 0;
4860
+ }
4861
+ .celeste-range-picker-calendar[data-v-4f5c8aa9] {
4862
+ border-block-end: 1px solid var(--color-stroke-soft-200);
4863
+ }
4864
+ .celeste-range-picker-footer[data-v-4f5c8aa9] {
4865
+ display: flex;
4866
+ align-items: center;
4867
+ padding: var(--spacing-16) var(--spacing-16) var(--spacing-16) 24px;
4868
+ gap: var(--spacing-16);
4869
+ }
4870
+ .celeste-range-picker-hint[data-v-4f5c8aa9] {
4871
+ flex: 1;
4872
+ min-width: 0;
4873
+ margin: 0;
4874
+ color: var(--color-text-sub-600);
4875
+ font: var(--paragraph-sm);
4876
+ }
4877
+ .celeste-range-picker-hint-value[data-v-4f5c8aa9] {
4878
+ color: var(--color-text-strong-950);
4879
+ font: var(--label-sm);
4415
4880
  }
4416
4881
  .celeste-segmented-control[data-v-fe40de14] {
4417
4882
  display: flex;
@@ -0,0 +1,2 @@
1
+ const require_calendar = require("./chunks/calendar.cjs");
2
+ module.exports = require_calendar.calendar_default;
@@ -4,7 +4,6 @@ const require_createContext = require("./createContext.cjs");
4
4
  const require_getActiveElement = require("./getActiveElement.cjs");
5
5
  const require_dist = require("./dist.cjs");
6
6
  const require_Primitive = require("./Primitive.cjs");
7
- const require_DismissableLayer = require("./DismissableLayer.cjs");
8
7
  const require_FocusScope = require("./FocusScope.cjs");
9
8
  const require_useFocusGuards = require("./useFocusGuards.cjs");
10
9
  const require_useForwardExpose = require("./useForwardExpose.cjs");
@@ -13,6 +12,7 @@ const require_useForwardPropsEmits = require("./useForwardPropsEmits.cjs");
13
12
  const require_useHideOthers = require("./useHideOthers.cjs");
14
13
  const require_useId = require("./useId.cjs");
15
14
  const require_Presence = require("./Presence.cjs");
15
+ const require_DismissableLayer = require("./DismissableLayer.cjs");
16
16
  const require_Collection = require("./Collection.cjs");
17
17
  const require_PopperContent = require("./PopperContent.cjs");
18
18
  let vue = require("vue");