@salt-ds/date-components 0.0.0-snapshot-20260330155807

package/css/salt-date-components.css

@@ -0,0 +1,633 @@
+/* src/calendar/Calendar.css */
+.saltCalendar {
+  --calendar-gap: var(--salt-spacing-fixed-100);
+  --calendar-day-size: var(--salt-size-base);
+  background: var(--salt-container-primary-background);
+  padding: var(--salt-spacing-100);
+}
+
+/* src/calendar/CalendarGrid.css */
+.saltCalendarGrid-grid {
+  display: grid;
+  grid-auto-flow: column;
+}
+.saltCalendarGrid-grid > * {
+  position: absolute;
+  left: 0;
+  width: 100%;
+}
+.saltCalendarGrid-grid > :nth-child(2) {
+  position: relative;
+}
+
+/* src/calendar/CalendarMonthHeader.css */
+.saltCalendarMonthHeader {
+  width: 100%;
+  text-align: center;
+}
+
+/* src/calendar/CalendarNavigation.css */
+.saltCalendarNavigation {
+  display: grid;
+  grid-template-columns: min-content auto min-content;
+  padding-bottom: var(--salt-spacing-100);
+  grid-gap: var(--salt-spacing-25);
+  align-items: center;
+  box-sizing: border-box;
+}
+.saltCalendarNavigation-yearDropdown {
+  min-width: 4.3em;
+}
+.saltCalendarNavigation-hideYearDropdown {
+  grid-template-columns: min-content auto min-content;
+  grid-gap: var(--salt-spacing-300);
+}
+.saltCalendarNavigation-dropdowns {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  grid-gap: var(--salt-spacing-50);
+}
+
+/* src/calendar/CalendarWeekHeader.css */
+.saltCalendarWeekHeader {
+  display: flex;
+  text-align: center;
+  align-items: center;
+  height: var(--salt-size-base);
+  gap: var(--calendar-gap);
+}
+.saltCalendarWeekHeader-dayOfWeek {
+  width: var(--calendar-day-size);
+  color: var(--salt-content-secondary-foreground);
+  font-family: var(--salt-text-fontFamily);
+  font-weight: var(--salt-text-fontWeight);
+  font-size: var(--salt-text-fontSize);
+  line-height: var(--salt-text-lineHeight);
+}
+
+/* src/date-input/DateInput.css */
+.saltDateInput {
+  align-items: center;
+  background: var(--saltDateInput-background, var(--input-background));
+  border-radius: var(--salt-palette-corner-weak, 0);
+  color: var(--saltDateInput-color, var(--salt-content-primary-foreground));
+  display: inline-flex;
+  font-family: var(--salt-text-fontFamily);
+  font-size: var(--saltDateInput-fontSize, var(--salt-text-fontSize));
+  line-height: var(--saltDateInput-lineHeight, var(--salt-text-lineHeight));
+  letter-spacing: var(--salt-text-letterSpacing);
+  height: var(--saltDateInput-height, var(--salt-size-base));
+  min-height: var(--saltDateInput-minHeight, var(--salt-size-base));
+  min-width: var(--saltDateInput-minWidth, 4em);
+  padding-left: var(--saltDateInput-paddingLeft, var(--salt-spacing-100));
+  padding-right: var(--saltDateInput-paddingRight, var(--salt-spacing-100));
+  position: relative;
+  box-sizing: border-box;
+  overflow: hidden;
+  width: 100%;
+}
+.saltDateInput:hover {
+  cursor: var(--salt-cursor-text);
+}
+.saltDateInput-bordered.saltDateInput {
+  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--input-borderColor);
+}
+.saltDateInput-bordered.saltDateInput:hover {
+  border-style: var(--salt-borderStyle-solid);
+  border-color: var(--input-borderColor-hover);
+}
+.saltDateInput-bordered.saltDateInput-focused,
+.saltDateInput-bordered.saltDateInput-focused:hover {
+  border-style: var(--salt-borderStyle-solid);
+  border-color: var(--input-borderColor-active);
+}
+.saltDateInput-bordered.saltDateInput-readOnly,
+.saltDateInput-bordered.saltDateInput-readOnly:hover {
+  border-style: var(--salt-borderStyle-solid);
+  border-color: var(--salt-editable-borderColor-readonly);
+}
+.saltDateInput-bordered.saltDateInput-disabled,
+.saltDateInput-bordered.saltDateInput-disabled:hover {
+  border-style: var(--salt-borderStyle-solid);
+  border-color: var(--salt-editable-borderColor-disabled);
+}
+.saltDateInput-activationIndicator {
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  position: absolute;
+  border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--input-borderColor);
+}
+.saltDateInput:hover .saltDateInput-activationIndicator {
+  border-bottom-style: var(--salt-borderStyle-solid);
+  border-bottom-color: var(--input-borderColor-hover);
+}
+.saltDateInput-focused .saltDateInput-activationIndicator,
+.saltDateInput-focused:hover .saltDateInput-activationIndicator {
+  border-bottom: var(--salt-size-fixed-200) var(--salt-borderStyle-solid) var(--input-borderColor-active);
+}
+.saltDateInput-readOnly .saltDateInput-activationIndicator,
+.saltDateInput-readOnly:hover .saltDateInput-activationIndicator {
+  border-bottom-style: var(--salt-borderStyle-solid);
+  border-bottom-color: var(--salt-editable-borderColor-readonly);
+}
+.saltDateInput-disabled .saltDateInput-activationIndicator,
+.saltDateInput-disabled:hover .saltDateInput-activationIndicator {
+  border-bottom-style: var(--salt-borderStyle-solid);
+  border-bottom-color: var(--salt-editable-borderColor-disabled);
+}
+.saltDateInput-bordered .saltDateInput-activationIndicator,
+.saltDateInput-bordered.saltDateInput-readOnly .saltDateInput-activationIndicator,
+.saltDateInput-bordered.saltDateInput-disabled:hover .saltDateInput-activationIndicator {
+  border-bottom-width: 0;
+}
+.saltDateInput-bordered.saltDateInput-focused .saltDateInput-activationIndicator {
+  border-bottom-width: var(--salt-size-fixed-100);
+}
+.saltDateInput-primary {
+  --input-background: var(--salt-editable-primary-background);
+  --input-background-disabled: var(--salt-editable-primary-background-disabled);
+  --input-background-readonly: var(--salt-editable-background-readonly);
+  --input-borderColor: var(--salt-editable-borderColor);
+  --input-borderColor-active: var(--salt-editable-borderColor-active);
+  --input-borderColor-hover: var(--salt-editable-borderColor-hover);
+  --input-outlineColor: var(--salt-focused-outlineColor);
+}
+.saltDateInput-secondary {
+  --input-background: var(--salt-editable-secondary-background);
+  --input-background-disabled: var(--salt-editable-secondary-background-disabled);
+  --input-background-readonly: var(--salt-editable-background-readonly);
+  --input-borderColor: var(--salt-editable-borderColor);
+  --input-borderColor-active: var(--salt-editable-borderColor-active);
+  --input-borderColor-hover: var(--salt-editable-borderColor-hover);
+  --input-outlineColor: var(--salt-focused-outlineColor);
+}
+.saltDateInput-tertiary {
+  --input-background: var(--salt-editable-tertiary-background);
+  --input-background-readonly: var(--salt-editable-background-readonly);
+  --input-borderColor: var(--salt-editable-borderColor);
+  --input-borderColor-active: var(--salt-editable-borderColor-active);
+  --input-borderColor-hover: var(--salt-editable-borderColor-hover);
+  --input-outlineColor: var(--salt-focused-outlineColor);
+}
+.saltDateInput-error {
+  --input-background: var(--salt-status-error-background);
+  --input-background-readonly: var(--salt-status-error-background);
+  --input-borderColor: var(--salt-status-error-borderColor);
+  --input-borderColor-active: var(--salt-status-error-borderColor);
+  --input-borderColor-hover: var(--salt-status-error-borderColor);
+  --input-outlineColor: var(--salt-status-error-borderColor);
+}
+.saltDateInput-warning {
+  --input-background: var(--salt-status-warning-background);
+  --input-background-readonly: var(--salt-status-warning-background);
+  --input-borderColor: var(--salt-status-warning-borderColor);
+  --input-borderColor-active: var(--salt-status-warning-borderColor);
+  --input-borderColor-hover: var(--salt-status-warning-borderColor);
+  --input-outlineColor: var(--salt-status-warning-borderColor);
+}
+.saltDateInput-success {
+  --input-background: var(--salt-status-success-background);
+  --input-background-readonly: var(--salt-status-success-background);
+  --input-borderColor: var(--salt-status-success-borderColor);
+  --input-borderColor-active: var(--salt-status-success-borderColor);
+  --input-borderColor-hover: var(--salt-status-success-borderColor);
+  --input-outlineColor: var(--salt-status-success-borderColor);
+}
+.saltDateInput-focused,
+.saltDateInput-focused:hover {
+  cursor: var(--salt-cursor-text);
+  outline: var(--saltDateInput-outline, var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--input-outlineColor));
+}
+.saltDateInput.saltDateInput-readOnly {
+  background: var(--input-background-readonly);
+  cursor: var(--salt-cursor-readonly);
+}
+.saltDateInput-disabled,
+.saltDateInput-disabled:hover {
+  background: var(--input-background-disabled);
+  cursor: var(--salt-cursor-disabled);
+  color: var(--saltDateInput-color-disabled, var(--salt-content-primary-foreground-disabled));
+}
+.saltDateInput-startAdornmentContainer {
+  align-items: center;
+  display: inline-flex;
+  padding-right: var(--salt-spacing-100);
+  column-gap: var(--salt-spacing-100);
+}
+.saltDateInput-endAdornmentContainer {
+  display: inline-flex;
+  column-gap: var(--salt-spacing-50);
+  align-items: flex-end;
+}
+.saltDateInput-endAdornmentContainer .saltButton ~ .saltButton {
+  margin-left: calc(-1 * var(--salt-spacing-50));
+}
+.saltDateInput-endAdornmentContainer .saltButton:last-child {
+  margin-right: calc(var(--salt-spacing-50) * -1);
+}
+.saltDateInput-startAdornmentContainer > .saltButton,
+.saltDateInput-endAdornmentContainer > .saltButton {
+  --saltButton-padding: calc(var(--salt-spacing-50) - var(--button-borderWidth));
+  --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));
+  --saltButton-borderRadius: var(--salt-palette-corner-weaker);
+}
+.saltDateInput-input {
+  background: none;
+  border: none;
+  box-sizing: content-box;
+  color: inherit;
+  cursor: inherit;
+  display: block;
+  font: inherit;
+  height: 100%;
+  letter-spacing: var(--saltDateInput-letterSpacing, 0);
+  margin: 0;
+  min-width: 0;
+  overflow: hidden;
+  padding: 0;
+  text-align: left;
+  width: 100%;
+}
+.saltDateInput-input:focus {
+  outline: none;
+}
+.saltDateInput-disabled .saltDateInput-input::selection {
+  background: none;
+}
+.saltDateInput-input::placeholder {
+  color: var(--salt-content-secondary-foreground);
+  font-weight: var(--salt-text-fontWeight-small);
+}
+.saltDateInput-dash {
+  margin: 0 var(--salt-spacing-50);
+}
+
+/* src/date-picker/DatePickerActions.css */
+.saltDatePickerActions {
+  box-sizing: border-box;
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  width: 100%;
+  padding-top: var(--salt-spacing-100);
+  padding-bottom: var(--salt-spacing-100);
+  padding-left: var(--salt-spacing-100);
+  padding-right: var(--salt-spacing-100);
+}
+.saltDatePickerActions-body {
+  flex-grow: 1;
+}
+.saltDatePickerActions-action + .saltDatePickerActions-action {
+  margin-left: var(--salt-spacing-100);
+}
+
+/* src/date-picker/DatePickerHelperText.css */
+.saltDatePickerHelperText {
+  visibility: visible;
+  margin-top: var(--salt-spacing-75);
+}
+.saltDatePickerHelperText-open {
+  visibility: hidden;
+}
+
+/* src/date-picker/DatePickerOverlay.css */
+.saltDatePickerOverlay {
+  background: var(--salt-container-primary-background);
+  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor-selected);
+  overflow: hidden;
+  overflow-y: auto;
+  position: relative;
+  z-index: var(--salt-zIndex-flyover);
+  box-shadow: var(--salt-overlayable-shadow-popout);
+  box-sizing: border-box;
+  display: flex;
+}
+
+/* src/date-picker/DatePickerPanel.css */
+.saltDatePickerOverlay {
+  background: var(--salt-container-primary-background);
+  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor-selected);
+  border-radius: var(--salt-palette-corner, 0);
+  overflow: hidden;
+  overflow-y: auto;
+  position: relative;
+  z-index: var(--salt-zIndex-flyover);
+  box-shadow: var(--salt-overlayable-shadow-popout);
+  box-sizing: border-box;
+  display: flex;
+}
+.saltDatePickerPanel-container {
+  width: min-content;
+  gap: 1px;
+}
+.saltDatePickerPanel-container > .saltDatePickerPanel-header {
+  padding: var(--salt-spacing-100);
+}
+
+/* src/calendar/internal/CalendarDay.css */
+.salt-density-touch {
+  --calendar-day-highlight-size: 14px;
+}
+.salt-density-low {
+  --calendar-day-highlight-size: 12px;
+}
+.salt-density-medium {
+  --calendar-day-highlight-size: 10px;
+}
+.salt-density-high {
+  --calendar-day-highlight-size: 8px;
+}
+.saltCalendarDay {
+  --calendar-day-zIndex-content: calc(var(--salt-zIndex-default) + 1);
+  --calendar-day-zIndex-highlight: calc(var(--calendar-day-zIndex-content) + 2);
+  font-family: var(--salt-text-fontFamily);
+  font-weight: var(--salt-text-fontWeight);
+  line-height: var(--salt-text-lineHeight);
+  font-size: var(--salt-text-fontSize);
+  width: var(--salt-size-base);
+  height: var(--salt-size-base);
+  color: var(--salt-content-primary-foreground);
+  background: var(--salt-selectable-background);
+  cursor: var(--salt-cursor-hover);
+  border: none;
+  padding: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+}
+.saltCalendarDay-content {
+  margin: 0 var(--salt-spacing-50);
+  width: 100%;
+  z-index: var(--calendar-day-zIndex-content);
+}
+.saltCalendarDay:hover {
+  color: var(--salt-content-primary-foreground);
+  background: var(--salt-selectable-background-hover);
+  border-radius: var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarDay-hoveredSpan:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedEnd),
+.saltCalendarDay-hoveredSpan:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedEnd)::before,
+.saltCalendarDay-selectedSpan:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedEnd),
+.saltCalendarDay-selectedSpan:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedEnd)::before {
+  border-radius: 0;
+}
+.saltCalendarDay-focused,
+.saltCalendarDay:focus,
+.saltCalendarDay:focus-visible {
+  outline: none;
+  z-index: var(--calendar-day-zIndex-content);
+}
+.saltCalendarDay-focused:focus-visible::before {
+  content: "";
+  position: absolute;
+  box-sizing: border-box;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  outline: var(--salt-focused-outline);
+  outline-offset: calc(var(--salt-focused-outlineWidth) * -1);
+  border-radius: var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarDay-selected .saltCalendarDay-content,
+.saltCalendarDay-selected:hover .saltCalendarDay-content,
+.saltCalendarDay-selectedStart .saltCalendarDay-content,
+.saltCalendarDay-hoveredStart .saltCalendarDay-content,
+.saltCalendarDay-selectedSpan .saltCalendarDay-content,
+.saltCalendarDay-hoveredSpan .saltCalendarDay-content,
+.saltCalendarDay-selectedEnd .saltCalendarDay-content,
+.saltCalendarDay-hoveredEnd .saltCalendarDay-content {
+  color: var(--salt-content-primary-foreground);
+}
+.saltCalendarDay-selectedSpan:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedEnd)::before,
+.saltCalendarDay-hoveredSpan:not(.saltCalendarDay-selectedSpan):not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedEnd)::before {
+  content: "";
+  position: absolute;
+  box-sizing: border-box;
+  top: 0;
+  left: calc(var(--calendar-gap) * -1);
+  right: calc(var(--calendar-gap) * -1);
+  bottom: 0;
+  background: var(--salt-selectable-background-hover);
+  border-top: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor-selected);
+  border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor-selected);
+}
+.saltCalendarDay-selectedStart::before,
+.saltCalendarDay-selectedEnd::before {
+  content: "";
+  position: absolute;
+  box-sizing: border-box;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: var(--salt-selectable-background-selected);
+  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor-selected);
+}
+.saltCalendarDay-selectedStart,
+.saltCalendarDay-selectedStart::before,
+.saltCalendarDay-focused.saltCalendarDay-selectedStart,
+.saltCalendarDay-focused.saltCalendarDay-selectedStart::before {
+  border-radius: var(--salt-palette-corner-weak, 0) 0 0 var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarDay-focused.saltCalendarDay-selectedEnd:not(.saltCalendarDay-selectedStart),
+.saltCalendarDay-focused.saltCalendarDay-selectedEnd:not(.saltCalendarDay-selectedStart)::before,
+.saltCalendarDay-selectedEnd:not(.saltCalendarDay-selectedStart),
+.saltCalendarDay-selectedEnd:not(.saltCalendarDay-selectedStart)::before {
+  border-radius: 0 var(--salt-palette-corner-weak, 0) var(--salt-palette-corner-weak, 0) 0;
+}
+.saltCalendarDay-focused.saltCalendarDay-selectedSameDay,
+.saltCalendarDay-focused.saltCalendarDay-selectedSameDay::before,
+.saltCalendarDay-selectedSameDay,
+.saltCalendarDay-selectedSameDay::before {
+  border-radius: var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarMonth-single .saltCalendarDay:hover:not(.saltCalendarDay-selected) {
+  color: var(--salt-content-primary-foreground);
+  background: var(--salt-selectable-background-hover);
+  border-radius: var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarMonth-single .saltCalendarDay-selected::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  color: var(--salt-content-primary-foreground);
+  background: var(--salt-selectable-background-selected);
+  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor-selected);
+  border-radius: var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarMonth-range .saltCalendarDay-focused.saltCalendarDay-selectedSpan,
+.saltCalendarMonth-range .saltCalendarDay-focused.saltCalendarDay-hoveredSpan {
+  outline-offset: calc(calc(var(--salt-focused-outlineWidth) * -1));
+}
+.saltCalendarMonth-range .saltCalendarDay:hover:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedSpan):not(.saltCalendarDay-selectedEnd) {
+  color: var(--salt-content-primary-foreground);
+  background: var(--salt-selectable-background-hover);
+  border-radius: var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarMonth-range .saltCalendarDay:hover.saltCalendarDay-selectedSpan::before,
+.saltCalendarMonth-range .saltCalendarDay:hover.saltCalendarDay-hoveredSpan::before,
+.saltCalendarMonth-range .saltCalendarDay-focused.saltCalendarDay-hoveredEnd:not(.saltCalendarDay-selectedEnd):not(.saltCalendarDay-selectedStart)::before,
+.saltCalendarMonth-range .saltCalendarDay-focused.saltCalendarDay-hoveredEnd:not(.saltCalendarDay-selectedEnd):not(.saltCalendarDay-selectedStart)::before {
+  border-radius: 0;
+}
+.saltCalendarMonth-range .saltCalendarDay-hoveredEnd:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedEnd) {
+  border-radius: 0;
+}
+.saltCalendarMonth-range .saltCalendarDay-hoveredEnd:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedEnd):not(.saltCalendarDay-unselectable)::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: calc(var(--calendar-gap) * -1);
+  right: 0;
+  bottom: 0;
+  background: var(--salt-selectable-background-hover);
+  border-radius: 0;
+  border-top: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor-selected);
+  border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-borderColor-selected);
+}
+.saltCalendarMonth-offset .saltCalendarDay-hoveredSpan,
+.saltCalendarMonth-offset .saltCalendarDay-hoveredSpan::before {
+  border-radius: 0;
+}
+.saltCalendarMonth-offset .saltCalendarDay-focused.saltCalendarDay-hoveredStart:not(.saltCalendarDay-selectedStart),
+.saltCalendarMonth-offset .saltCalendarDay-focused.saltCalendarDay-hoveredStart:not(.saltCalendarDay-selectedStart)::before {
+  border-radius: var(--salt-palette-corner-weak, 0) 0 0 var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarMonth-offset .saltCalendarDay:hover:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedSpan):not(.saltCalendarDay-selectedEnd),
+.saltCalendarMonth-offset .saltCalendarDay-hoveredStart:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedSpan):not(.saltCalendarDay-selectedEnd),
+.saltCalendarMonth-offset .saltCalendarDay-hoveredSpan:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedSpan):not(.saltCalendarDay-selectedEnd),
+.saltCalendarMonth-offset .saltCalendarDay-hoveredEnd:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedSpan):not(.saltCalendarDay-selectedEnd) {
+  color: var(--salt-content-primary-foreground);
+  background: var(--salt-selectable-background-hover);
+}
+.saltCalendarMonth-offset .saltCalendarDay-hoveredSpan:not(.saltCalendarDay-selectedStart):not(.saltCalendarDay-selectedSpan):not(.saltCalendarDay-selectedEnd)::before {
+  border-top: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-background-hover);
+  border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--salt-selectable-background-hover);
+}
+.saltCalendarMonth-offset .saltCalendarDay-hoveredStart,
+.saltCalendarMonth-offset .saltCalendarDay-selectedStart {
+  border-radius: var(--salt-palette-corner-weak, 0) 0 0 var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarMonth-offset .saltCalendarDay.saltCalendarDay-hoveredEnd,
+.saltCalendarMonth-offset .saltCalendarDay-selectedEnd {
+  border-radius: 0 var(--salt-palette-corner-weak, 0) var(--salt-palette-corner-weak, 0) 0;
+}
+.saltCalendarMonth-offset .saltCalendarDay-hoveredSpan,
+.saltCalendarMonth-offset .saltCalendarDay-selectedSpan {
+  border-radius: 0;
+}
+.saltCalendarMonth-offset .saltCalendarDay-selectedStart.saltCalendarDay-selectedEnd {
+  border-radius: var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarDay-outOfRange {
+  color: var(--salt-content-secondary-foreground);
+}
+.saltCalendarDay-outOfRange:hover {
+  color: var(--salt-content-primary-foreground);
+}
+.saltCalendarDay-outOfRange .saltCalendarDay-today > span:last-of-type {
+  border-bottom: var(--salt-size-indicator) var(--salt-borderStyle-solid) var(--salt-content-secondary-foreground);
+}
+.saltCalendarDay-outOfRange .saltCalendarDay-highlighted::after {
+  background: var(--salt-content-secondary-foreground);
+}
+.saltCalendarDay-unselectable,
+.saltCalendarDay-unselectable:hover {
+  background: var(--salt-selectable-background-disabled);
+  cursor: var(--salt-cursor-disabled);
+}
+.saltCalendarDay-highlighted {
+  position: absolute;
+  left: 0;
+  right: -1px;
+  height: 100%;
+  overflow: hidden;
+  border-radius: var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarDay-selectedStart .saltCalendarDay-highlighted {
+  right: 0;
+}
+.saltCalendarDay-selectedEnd .saltCalendarDay-highlighted {
+  right: 1px;
+}
+.saltCalendarDay-selectedStart .saltCalendarDay-highlighted,
+.saltCalendarDay-hoveredEnd:not(.saltCalendarDay-selectedEnd) .saltCalendarDay-highlighted,
+.saltCalendarDay-hoveredSpan .saltCalendarDay-highlighted,
+.saltCalendarDay-selectedSpan .saltCalendarDay-highlighted {
+  border-radius: 0;
+}
+.saltCalendarDay-selectedSameDay .saltCalendarDay-highlighted {
+  border-radius: var(--salt-palette-corner-weak, 0);
+}
+.saltCalendarDay-highlighted::after {
+  content: "";
+  top: 0;
+  right: 0;
+  box-sizing: border-box;
+  height: var(--calendar-day-highlight-size);
+  width: var(--calendar-day-highlight-size);
+  background: var(--salt-accent-background);
+  position: absolute;
+  clip-path: polygon(100% 0, 100% 100%, 0 0);
+  z-index: var(--calendar-day-zIndex-highlight);
+}
+.saltCalendarDay-focused:focus-visible .saltCalendarDay-highlighted::after {
+  border: var(--salt-focused-outline);
+}
+.saltCalendarDay-unselectable::after {
+  content: "";
+  height: var(--salt-size-fixed-100);
+  width: calc(100% - var(--salt-spacing-100));
+  background: var(--salt-content-secondary-foreground);
+  position: absolute;
+}
+.saltCalendarDay-today > span:last-of-type::after {
+  content: "";
+  display: block;
+  width: calc(100% - calc(var(--salt-spacing-50) * 2));
+  height: var(--salt-size-indicator);
+  background: var(--salt-accent-borderColor);
+  border-radius: var(--salt-palette-corner-weak);
+  position: absolute;
+  bottom: var(--salt-spacing-50);
+  left: var(--salt-spacing-50);
+  right: var(--salt-spacing-50);
+}
+.saltCalendarDay-hidden {
+  visibility: hidden;
+}
+
+/* src/calendar/internal/CalendarMonth.css */
+.saltCalendarMonth-grid {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  width: calc(var(--calendar-day-size) * 7 + var(--calendar-gap) * 6);
+  text-align: center;
+  gap: var(--calendar-gap);
+}
+.saltCalendarMonth-grid > .saltCalendarMonth-week {
+  display: flex;
+  justify-content: flex-start;
+  gap: var(--calendar-gap);
+  width: 100%;
+}
+.saltCalendarMonth-grid > .saltCalendarMonth-week > .saltCalendarDay:last-child::before {
+  right: 0;
+}
+.saltCalendarMonth-grid > .saltCalendarMonth-week > .saltCalendarDay:first-child::before {
+  left: 0;
+}
+.saltCalendarMonth-grid > .saltCalendarMonth-week > * {
+  width: var(--calendar-day-size);
+  height: var(--calendar-day-size);
+  box-sizing: border-box;
+}
+
+/* src/7d44d987-5035-4ffe-9d8f-66d8e8e8bda7.css */

package/dist-cjs/calendar/Calendar.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltCalendar {\n  --calendar-gap: var(--salt-spacing-fixed-100);\n  --calendar-day-size: var(--salt-size-base);\n\n  background: var(--salt-container-primary-background);\n  padding: var(--salt-spacing-100);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=Calendar.css.js.map

package/dist-cjs/calendar/Calendar.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}