niuma-ui 2.0.2 → 2.0.4

package/dist/components/calendar-grid/src/RsCalendarGrid.css

@@ -1,99 +1,159 @@
 
-.rs-calendar-grid[data-v-35786efd] {
+.rs-calendar-grid[data-v-e9d29258] {
   display: flex;
   flex-direction: column;
-  gap: var(--rs-space-sm);
-}
-.rs-calendar-grid__header[data-v-35786efd] {
+  gap: var(--rs-calendar-grid-gap);
+  --rs-calendar-grid-cell-size: var(--rs-control-height-md);
+  --rs-calendar-grid-nav-size: var(--rs-control-height-sm);
+  --rs-calendar-grid-font: var(--rs-font-size-sm);
+}
+.rs-calendar-grid--ssm[data-v-e9d29258] {
+  --rs-calendar-grid-cell-size: var(--rs-control-height-ssm);
+  --rs-calendar-grid-nav-size: var(--rs-control-height-ssm);
+  --rs-calendar-grid-font: var(--rs-font-size-xs);
+}
+.rs-calendar-grid--sm[data-v-e9d29258] {
+  --rs-calendar-grid-cell-size: var(--rs-control-height-sm);
+  --rs-calendar-grid-nav-size: var(--rs-control-height-ssm);
+  --rs-calendar-grid-font: var(--rs-font-size-xs);
+}
+.rs-calendar-grid--lg[data-v-e9d29258] {
+  --rs-calendar-grid-cell-size: var(--rs-control-height-lg);
+  --rs-calendar-grid-nav-size: var(--rs-control-height-md);
+  --rs-calendar-grid-font: var(--rs-font-size-base);
+}
+.rs-calendar-grid__header[data-v-e9d29258] {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--rs-space-sm);
 }
-.rs-calendar-grid__nav-group[data-v-35786efd] {
+.rs-calendar-grid__nav-group[data-v-e9d29258] {
   display: inline-flex;
   align-items: center;
   flex: 0 0 auto;
 }
-.rs-calendar-grid__title[data-v-35786efd] {
+.rs-calendar-grid__title[data-v-e9d29258] {
   flex: 1;
   min-width: 0;
   text-align: center;
-  font-size: var(--rs-font-size-sm);
+  font-size: var(--rs-calendar-grid-font);
   font-weight: var(--rs-font-weight-semibold);
-  color: var(--rs-text);
+  color: var(--rs-calendar-grid-title);
 }
-.rs-calendar-grid__nav[data-v-35786efd] {
+.rs-calendar-grid__nav[data-v-e9d29258] {
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  width: 1.75rem;
-  height: 1.75rem;
+  width: var(--rs-calendar-grid-nav-size);
+  height: var(--rs-calendar-grid-nav-size);
   border: 0;
-  border-radius: var(--rs-radius-sm);
+  border-radius: var(--rs-calendar-grid-radius);
   background: transparent;
-  color: var(--rs-muted);
+  color: var(--rs-calendar-grid-nav);
   cursor: pointer;
   transition: background var(--rs-transition-fast), color var(--rs-transition-fast);
 }
-.rs-calendar-grid__nav[data-v-35786efd]:hover {
-  background: var(--rs-surface-hover);
-  color: var(--rs-text);
+.rs-calendar-grid__nav[data-v-e9d29258]:hover:not(:disabled) {
+  background: var(--rs-calendar-grid-nav-hover);
+  color: var(--rs-calendar-grid-title);
+}
+.rs-calendar-grid__nav[data-v-e9d29258]:focus {
+  outline: none;
+}
+.rs-calendar-grid__nav[data-v-e9d29258]:focus-visible {
+  box-shadow: 0 0 0 var(--rs-focus-ring-width) var(--rs-focus-ring);
 }
-.rs-calendar-grid__table[data-v-35786efd] {
+.rs-calendar-grid__nav[data-v-e9d29258]:disabled {
+  opacity: var(--rs-calendar-grid-disabled-opacity);
+  cursor: not-allowed;
+}
+.rs-calendar-grid__table[data-v-e9d29258] {
   width: 100%;
   border-collapse: separate;
-  border-spacing: 2px;
+  border-spacing: var(--rs-calendar-grid-cell-gap);
   table-layout: fixed;
 }
-.rs-calendar-grid__weekday[data-v-35786efd] {
-  padding: 0.125rem 0;
+.rs-calendar-grid__weekday[data-v-e9d29258] {
+  padding-block: var(--rs-space-xs);
+  padding-inline: 0;
   text-align: center;
   font-size: var(--rs-font-size-xs);
   font-weight: var(--rs-font-weight-medium);
-  color: var(--rs-muted);
+  color: var(--rs-calendar-grid-weekday);
+}
+.rs-calendar-grid__weekday--week[data-v-e9d29258],
+.rs-calendar-grid__week-num[data-v-e9d29258] {
+  width: var(--rs-calendar-grid-week-col);
+  color: var(--rs-calendar-grid-week);
+  font-size: var(--rs-font-size-xs);
+  font-weight: var(--rs-font-weight-medium);
+  text-align: center;
 }
-.rs-calendar-grid__day[data-v-35786efd] {
+.rs-calendar-grid__day[data-v-e9d29258] {
   padding: 0;
   text-align: center;
   vertical-align: middle;
 }
-.rs-calendar-grid__cell[data-v-35786efd] {
+.rs-calendar-grid__cell[data-v-e9d29258] {
   width: 100%;
-  height: 2rem;
+  min-width: var(--rs-calendar-grid-cell-size);
+  height: var(--rs-calendar-grid-cell-size);
   border: 0;
-  border-radius: var(--rs-radius-sm);
+  border-radius: var(--rs-calendar-grid-radius);
   background: transparent;
-  color: var(--rs-text);
-  font-size: var(--rs-font-size-sm);
+  color: var(--rs-calendar-grid-day);
+  font-size: var(--rs-calendar-grid-font);
   cursor: pointer;
   transition:
     background var(--rs-transition-fast),
     color var(--rs-transition-fast);
 }
-.rs-calendar-grid__cell[data-v-35786efd]:hover:not(:disabled) {
-  background: var(--rs-item-hover);
+.rs-calendar-grid__cell[data-v-e9d29258]:hover:not(:disabled) {
+  background: var(--rs-calendar-grid-day-hover);
 }
-.rs-calendar-grid__cell--outside[data-v-35786efd] {
-  color: var(--rs-placeholder);
+.rs-calendar-grid__cell[data-v-e9d29258]:focus {
+  outline: none;
 }
-.rs-calendar-grid__cell--endpoint[data-v-35786efd],
-.rs-calendar-grid__cell--selected[data-v-35786efd] {
-  background: var(--rs-primary);
-  color: var(--rs-primary-foreground);
+.rs-calendar-grid__cell[data-v-e9d29258]:focus-visible {
+  box-shadow: 0 0 0 var(--rs-focus-ring-width) var(--rs-focus-ring);
 }
-.rs-calendar-grid__cell--in-range[data-v-35786efd] {
-  border-radius: 0;
-  background: color-mix(in srgb, var(--rs-primary) 12%, transparent);
-  color: var(--rs-primary);
+.rs-calendar-grid__cell--outside[data-v-e9d29258] {
+  color: var(--rs-calendar-grid-day-outside);
 }
-.rs-calendar-grid__cell--range-start[data-v-35786efd]:not(.rs-calendar-grid__cell--range-end) {
-  border-radius: var(--rs-radius-sm) 0 0 var(--rs-radius-sm);
+.rs-calendar-grid__cell--today[data-v-e9d29258]:not(.rs-calendar-grid__cell--endpoint) {
+  box-shadow: inset 0 0 0 1px var(--rs-calendar-grid-today);
+  color: var(--rs-calendar-grid-today);
 }
-.rs-calendar-grid__cell--range-end[data-v-35786efd]:not(.rs-calendar-grid__cell--range-start) {
-  border-radius: 0 var(--rs-radius-sm) var(--rs-radius-sm) 0;
+.rs-calendar-grid__cell--endpoint[data-v-e9d29258],
+.rs-calendar-grid__cell--selected[data-v-e9d29258] {
+  background: var(--rs-calendar-grid-selected);
+  color: var(--rs-calendar-grid-selected-fg);
 }
-.rs-calendar-grid__cell[data-v-35786efd]:disabled {
-  opacity: 0.38;
+.rs-calendar-grid__cell--in-range[data-v-e9d29258] {
+  border-radius: 0;
+  background: var(--rs-calendar-grid-in-range);
+  color: var(--rs-calendar-grid-today);
+}
+.rs-calendar-grid__cell--range-start[data-v-e9d29258]:not(.rs-calendar-grid__cell--range-end) {
+  border-start-start-radius: var(--rs-calendar-grid-radius);
+  border-end-start-radius: var(--rs-calendar-grid-radius);
+  border-start-end-radius: 0;
+  border-end-end-radius: 0;
+}
+.rs-calendar-grid__cell--range-end[data-v-e9d29258]:not(.rs-calendar-grid__cell--range-start) {
+  border-start-end-radius: var(--rs-calendar-grid-radius);
+  border-end-end-radius: var(--rs-calendar-grid-radius);
+  border-start-start-radius: 0;
+  border-end-start-radius: 0;
+}
+.rs-calendar-grid__cell[data-v-e9d29258]:disabled {
+  opacity: var(--rs-calendar-grid-disabled-opacity);
   cursor: not-allowed;
 }
+@media (prefers-reduced-motion: reduce) {
+.rs-calendar-grid__nav[data-v-e9d29258],
+  .rs-calendar-grid__cell[data-v-e9d29258] {
+    transition: none;
+}
+}

package/dist/components/calendar-grid/src/RsCalendarGrid.d.ts

@@ -1,4 +1,12 @@
-import { type RsParsedDate } from '../../date-picker/src/date-picker-utils';
+import { type RsComponentSize, type RsRadius } from '../../../theme/types';
+import { type RsDatePickerDisabledDate, type RsParsedDate, type RsWeekStartsOn } from '../../date-picker/src/date-picker-utils';
+export interface RsCalendarGridExpose {
+    focus: () => void;
+    goToToday: () => void;
+}
+export type RsCalendarGridInstance = RsCalendarGridExpose & {
+    $el: HTMLElement;
+};
 type __VLS_Props = {
     selected?: RsParsedDate | null;
     rangeStart?: RsParsedDate | null;
@@ -6,13 +14,54 @@ type __VLS_Props = {
     minDate?: string;
     maxDate?: string;
     disabledDates?: string[];
+    /** 禁用某一天；与 disabledDates / minDate / maxDate 同时生效 */
+    disabledDate?: RsDatePickerDisabledDate;
+    /** 一周起始。未传跟 locale（en-US 周日，zh-CN 周一） */
+    weekStartsOn?: RsWeekStartsOn;
+    /** 控件密度。跟 Input / DatePicker 同一套 --rs-control-height-* */
+    size?: RsComponentSize;
+    radius?: RsRadius;
+    /** 禁用整张月历（含翻页）。也会继承 Form.disabled */
+    disabled?: boolean;
+    /** 今天描边。默认开 */
+    highlightToday?: boolean;
+    /** 画出邻月日期。默认开，关了仍占 6 行以免把 DatePicker 撑跳 */
+    showOutside?: boolean;
+    /** 点邻月日期是否发出 select。默认开，与原行为一致 */
+    selectOutside?: boolean;
+    /** 行首 ISO 周序号。欧洲排班常用 */
+    showWeekNumbers?: boolean;
+    /** 月历可访问名称 */
+    ariaLabel?: string;
+    id?: string;
 };
 type __VLS_ModelProps = {
     'viewYear': number;
     'viewMonth': number;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare var __VLS_11: {
+    year: number;
+    month: number;
+    label: string;
+}, __VLS_23: {
+    date: RsParsedDate;
+    iso: string;
+    inCurrentMonth: boolean;
+    selected: boolean;
+    disabled: boolean;
+    today: boolean;
+    inRange: boolean;
+    rangeStart: boolean;
+    rangeEnd: boolean;
+    weekNumber: number;
+};
+type __VLS_Slots = {} & {
+    title?: (props: typeof __VLS_11) => any;
+} & {
+    cell?: (props: typeof __VLS_23) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, RsCalendarGridExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     select: (date: RsParsedDate) => any;
     "update:viewYear": (value: number) => any;
     "update:viewMonth": (value: number) => any;
@@ -21,10 +70,21 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     "onUpdate:viewYear"?: ((value: number) => any) | undefined;
     "onUpdate:viewMonth"?: ((value: number) => any) | undefined;
 }>, {
+    disabled: boolean;
     selected: RsParsedDate | null;
     rangeStart: RsParsedDate | null;
     rangeEnd: RsParsedDate | null;
     disabledDates: string[];
+    highlightToday: boolean;
+    showOutside: boolean;
+    selectOutside: boolean;
+    showWeekNumbers: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};