huibo-ui 0.3.0 → 0.5.0

package/dist/components/hb-calendar.js.map

@@ -1 +1 @@
-{"file":"hb-calendar.js","mappings":"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","names":[],"sources":["src/components/Calendar/calendar.css?tag=hb-calendar&encapsulation=shadow","src/components/Calendar/Calendar.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hb-calendar {\n  width: 100%;\n  padding: 12px;\n  box-sizing: border-box;\n  background-color: var(--hb-color-white, #ffffff);\n  border-radius: 4px;\n}\n\n/* 头部：年月 + 上下月按钮 */\n.hb-calendar__header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 12px;\n}\n\n.hb-calendar__header-label {\n  font-weight: 600;\n  font-size: 14px;\n  color: var(--hb-color-text-regular, #606266);\n}\n\n.hb-calendar__prev-btn,\n.hb-calendar__next-btn {\n  background: none;\n  border: none;\n  font-size: 18px;\n  cursor: pointer;\n  color: var(--hb-color-text-regular, #606266);\n  padding: 4px 8px;\n  line-height: 1;\n  transition: color 0.2s;\n}\n\n.hb-calendar__prev-btn:hover,\n.hb-calendar__next-btn:hover {\n  color: var(--hb-color-primary);\n}\n\n/* 星期行 */\n.hb-calendar__weekdays {\n  display: grid;\n  grid-template-columns: repeat(7, 1fr);\n  gap: 4px;\n  margin-bottom: 8px;\n}\n\n.hb-calendar__weekday {\n  text-align: center;\n  font-size: 12px;\n  color: var(--hb-color-text-placeholder, #c0c4cc);\n  font-weight: 500;\n  padding: 4px 0;\n}\n\n/* 日期网格 */\n.hb-calendar__days {\n  display: grid;\n  grid-template-columns: repeat(7, 1fr);\n  gap: 4px;\n}\n\n.hb-calendar__day {\n  aspect-ratio: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 13px;\n  color: var(--hb-color-text-regular, #606266);\n  cursor: pointer;\n  border-radius: 4px;\n  transition: all 0.2s;\n  user-select: none;\n}\n\n.hb-calendar__day:hover:not(.hb-calendar__day--other-month) {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n}\n\n.hb-calendar__day--other-month {\n  color: var(--hb-color-text-placeholder, #c0c4cc);\n  cursor: default;\n}\n\n.hb-calendar__day--today {\n  color: var(--hb-color-primary);\n  font-weight: 600;\n}\n\n.hb-calendar__day--selected {\n  background-color: var(--hb-color-primary);\n  color: var(--hb-color-white, #ffffff);\n}\n\n.hb-calendar__day--selected:hover {\n  background-color: var(--hb-color-primary);\n}\n","import { Component, h, Prop, Event, EventEmitter, State, Watch } from '@stencil/core';\nimport {\n  getCalendarDays,\n  parseDate,\n  addMonths,\n  MONTH_NAMES,\n  WEEK_DAY_NAMES,\n} from '../../utils/date-helpers';\n\n/**\n * Calendar 日历组件\n * 月份视图日历，支持选中日期与月份切换\n */\n@Component({\n  tag: 'hb-calendar',\n  styleUrl: 'calendar.css',\n  shadow: true,\n})\nexport class Calendar {\n  /**\n   * 绑定值（ISO 日期字符串）\n   */\n  @Prop({ mutable: true }) modelValue?: string;\n\n  /**\n   * 每周第一天（0=周日，1=周一 …）\n   * @default 0\n   */\n  @Prop() firstDayOfWeek: number = 0;\n\n  /**\n   * 禁用日期判定（声明预留，暂不强求实现）\n   */\n  @Prop() disabledDate?: (date: Date) => boolean;\n\n  /**\n   * 值改变事件，detail 为 ISO 日期字符串\n   */\n  @Event() hbChange: EventEmitter<string>;\n\n  @State() viewDate: Date = new Date();\n  @State() selectedDate?: Date;\n\n  componentDidLoad() {\n    this.initFromModelValue();\n  }\n\n  @Watch('modelValue')\n  handleModelValueChange() {\n    this.initFromModelValue();\n  }\n\n  private initFromModelValue() {\n    const parsed = parseDate(this.modelValue);\n    this.selectedDate = parsed;\n    if (parsed) {\n      this.viewDate = new Date(parsed.getFullYear(), parsed.getMonth(), 1);\n    }\n  }\n\n  private handleSelect = (day: { date: Date; isCurrentMonth: boolean }) => {\n    if (!day.isCurrentMonth) return;\n    if (this.disabledDate && this.disabledDate(day.date)) return;\n    this.selectedDate = day.date;\n    const iso = this.toISODate(day.date);\n    this.modelValue = iso;\n    this.hbChange.emit(iso);\n  };\n\n  private toISODate(date: Date): string {\n    const y = date.getFullYear();\n    const m = String(date.getMonth() + 1).padStart(2, '0');\n    const d = String(date.getDate()).padStart(2, '0');\n    return `${y}-${m}-${d}`;\n  }\n\n  private changeMonth(delta: number) {\n    this.viewDate = addMonths(this.viewDate, delta);\n  }\n\n  /** 按 firstDayOfWeek 重排星期标题（getCalendarDays 网格恒以周日为首列） */\n  private get orderedWeekNames(): string[] {\n    const offset = ((this.firstDayOfWeek % 7) + 7) % 7;\n    return [...WEEK_DAY_NAMES.slice(offset), ...WEEK_DAY_NAMES.slice(0, offset)];\n  }\n\n  render() {\n    const days = getCalendarDays(this.viewDate, this.selectedDate);\n    const current = this.viewDate;\n\n    return (\n      <div class=\"hb-calendar\">\n        <div class=\"hb-calendar__header\">\n          <button\n            type=\"button\"\n            class=\"hb-calendar__prev-btn\"\n            onClick={() => this.changeMonth(-1)}\n            aria-label=\"上一月\"\n          >\n            ‹\n          </button>\n          <span class=\"hb-calendar__header-label\">\n            {current.getFullYear()}年 {MONTH_NAMES[current.getMonth()]}\n          </span>\n          <button\n            type=\"button\"\n            class=\"hb-calendar__next-btn\"\n            onClick={() => this.changeMonth(1)}\n            aria-label=\"下一月\"\n          >\n            ›\n          </button>\n        </div>\n        <div class=\"hb-calendar__body\">\n          <div class=\"hb-calendar__weekdays\">\n            {this.orderedWeekNames.map((day) => (\n              <div class=\"hb-calendar__weekday\">{day}</div>\n            ))}\n          </div>\n          <div class=\"hb-calendar__days\">\n            {days.map((day, index) => (\n              <div\n                key={index}\n                class={{\n                  'hb-calendar__day': true,\n                  'hb-calendar__day--other-month': !day.isCurrentMonth,\n                  'hb-calendar__day--today': day.isToday,\n                  'hb-calendar__day--selected': day.isSelected,\n                }}\n                onClick={() => this.handleSelect(day)}\n              >\n                {day.date.getDate()}\n              </div>\n            ))}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"hb-calendar.js","mappings":";;;AAAA,MAAM,WAAW,GAAG,+8OAA+8O,CAAC;AACp+O,yBAAe,WAAW;;MCWb,QAAQ;;;;;;;;;;IAIM,UAAU,CAAU;;;;;IAMrC,cAAc,GAAW,CAAC,CAAC;;;;IAK3B,YAAY,CAA2B;;;;IAKtC,QAAQ,CAAuB;IAE/B,QAAQ,GAAS,IAAI,IAAI,EAAE,CAAC;IAC5B,YAAY,CAAQ;;IAEpB,SAAS,GAAS,IAAI,IAAI,EAAE,CAAC;IAEtC,gBAAgB;QACd,IAAI,CAAC,kBAAkB,EAAE,CAAC;KAC3B;IAGD,sBAAsB;QACpB,IAAI,CAAC,kBAAkB,EAAE,CAAC;KAC3B;IAEO,kBAAkB;QACxB,MAAM,MAAM,GAAG,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC1C,IAAI,CAAC,YAAY,GAAG,MAAM,CAAC;QAC3B,IAAI,MAAM,EAAE;YACV,IAAI,CAAC,QAAQ,GAAG,IAAI,IAAI,CAAC,MAAM,CAAC,WAAW,EAAE,EAAE,MAAM,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,CAAC;YACrE,IAAI,CAAC,SAAS,GAAG,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC;SACnC;aAAM;;YAEL,IAAI,CAAC,SAAS,GAAG,IAAI,IAAI,EAAE,CAAC;SAC7B;KACF;IAEO,YAAY,GAAG,CAAC,GAA4C;QAClE,IAAI,CAAC,GAAG,CAAC,cAAc;YAAE,OAAO;QAChC,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC;YAAE,OAAO;QAC7D,IAAI,CAAC,YAAY,GAAG,GAAG,CAAC,IAAI,CAAC;QAC7B,IAAI,CAAC,SAAS,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACpC,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACrC,IAAI,CAAC,UAAU,GAAG,GAAG,CAAC;QACtB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KACzB,CAAC;;;;;;;;;;IAWM,iBAAiB,GAAG,CAAC,CAAgB;QAC3C,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAEtC,QAAQ,CAAC,CAAC,GAAG;YACX,KAAK,YAAY;gBACf,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC;gBACjC,MAAM;YACR,KAAK,WAAW;gBACd,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC;gBACjC,MAAM;YACR,KAAK,WAAW;gBACd,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC;gBACjC,MAAM;YACR,KAAK,SAAS;gBACZ,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC;gBACjC,MAAM;YACR,KAAK,MAAM,EAAE;gBACX,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;gBACxB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC;gBACjC,MAAM;aACP;YACD,KAAK,KAAK,EAAE;gBACV,MAAM,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;gBAC5B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC;gBACjC,MAAM;aACP;YACD,KAAK,UAAU;gBACb,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,CAAC;gBAEnC,MAAM;YACR,KAAK,QAAQ;gBACX,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,CAAC;gBAEnC,MAAM;YACR,KAAK,OAAO;gBACV,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,IAAI,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,SAAS,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC,CAAC;gBAClE,OAAO;YACT;gBACE,OAAO;SACV;QACD,CAAC,CAAC,cAAc,EAAE,CAAC;;QAEnB,IAAI,IAAI,CAAC,QAAQ,EAAE,KAAK,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE,EAAE;YACtG,IAAI,CAAC,QAAQ,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,CAAC;SAClE;QAED,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;KACvB,CAAC;IAEM,SAAS,CAAC,IAAU;QAC1B,MAAM,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;QAC7B,MAAM,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;QACvD,MAAM,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;QAClD,OAAO,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;KACzB;IAEO,WAAW,CAAC,KAAa;QAC/B,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;KACjD;;IAGD,IAAY,gBAAgB;QAC1B,MAAM,MAAM,GAAG,CAAC,CAAC,IAAI,CAAC,cAAc,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACnD,OAAO,CAAC,GAAG,cAAc,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC;KAC9E;IAED,MAAM;QACJ,MAAM,IAAI,GAAG,eAAe,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,IAAI,EAAE,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;QAChG,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC;QAE9B,QACE,4DAAK,KAAK,EAAC,aAAa,IACtB,4DAAK,KAAK,EAAC,qBAAqB,IAC9B,+DAAQ,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,uBAAuB,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,gBAAa,oBAAK,aAEhG,EACT,6DAAM,KAAK,EAAC,2BAA2B,eAAW,QAAQ,IACvD,OAAO,CAAC,WAAW,EAAE,aAAI,WAAW,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,CACpD,EACP,+DAAQ,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,uBAAuB,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,gBAAa,oBAAK,aAE/F,CACL,EACN,4DAAK,KAAK,EAAC,mBAAmB,EAAC,IAAI,EAAC,MAAM,gBAAa,GAAG,OAAO,CAAC,WAAW,EAAE,IAAI,OAAO,CAAC,QAAQ,EAAE,GAAG,CAAC,KAAK,IAC5G,4DAAK,KAAK,EAAC,uBAAuB,EAAC,IAAI,EAAC,KAAK,IAC1C,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,GAAG,KAC5B,WAAK,KAAK,EAAC,sBAAsB,EAAC,IAAI,EAAC,cAAc,mBAAe,MAAM,IACvE,GAAG,CACA,CACP,CAAC,CACE,EACN,4DAAK,KAAK,EAAC,mBAAmB,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,EAAE,IAAI,CAAC,iBAAiB,IACxE,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK;YACnB,MAAM,SAAS,GAAG,SAAS,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YACtD,MAAM,WAAW,GAAG,GAAG,CAAC,cAAc,IAAI,CAAC,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;YAC7F,QACE,WACE,GAAG,EAAE,KAAK,EACV,KAAK,EAAE;oBACL,kBAAkB,EAAE,IAAI;oBACxB,+BAA+B,EAAE,CAAC,GAAG,CAAC,cAAc;oBACpD,yBAAyB,EAAE,GAAG,CAAC,OAAO;oBACtC,4BAA4B,EAAE,GAAG,CAAC,UAAU;oBAC5C,2BAA2B,EAAE,SAAS;oBACtC,4BAA4B,EAAE,WAAW;iBAC1C,EACD,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,SAAS,GAAG,CAAC,GAAG,CAAC,CAAC,mBACb,GAAG,CAAC,UAAU,GAAG,MAAM,GAAG,OAAO,kBAClC,GAAG,CAAC,OAAO,GAAG,MAAM,GAAG,SAAS,mBAC/B,CAAC,GAAG,CAAC,cAAc,IAAI,WAAW,GAAG,MAAM,GAAG,SAAS,gBAC1D,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,EACpC,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,IAEpC,GAAG,CAAC,IAAI,CAAC,OAAO,EAAE,CACf,EACN;SACH,CAAC,CACE,CACF,CACF,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/Calendar/calendar.css?tag=hb-calendar&encapsulation=shadow","src/components/Calendar/Calendar.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hb-calendar {\n  width: 100%;\n  padding: 12px;\n  box-sizing: border-box;\n  background-color: var(--hb-color-white, #ffffff);\n  border-radius: 4px;\n}\n\n/* 头部：年月 + 上下月按钮 */\n.hb-calendar__header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 12px;\n}\n\n.hb-calendar__header-label {\n  font-weight: 600;\n  font-size: 14px;\n  color: var(--hb-color-text-regular, #606266);\n}\n\n.hb-calendar__prev-btn,\n.hb-calendar__next-btn {\n  background: none;\n  border: none;\n  font-size: 18px;\n  cursor: pointer;\n  color: var(--hb-color-text-regular, #606266);\n  padding: 4px 8px;\n  line-height: 1;\n  transition: color 0.2s;\n}\n\n.hb-calendar__prev-btn:hover,\n.hb-calendar__next-btn:hover {\n  color: var(--hb-color-primary);\n}\n\n/* 星期行 */\n.hb-calendar__weekdays {\n  display: grid;\n  grid-template-columns: repeat(7, 1fr);\n  gap: 4px;\n  margin-bottom: 8px;\n}\n\n.hb-calendar__weekday {\n  text-align: center;\n  font-size: 12px;\n  color: var(--hb-color-text-placeholder, #c0c4cc);\n  font-weight: 500;\n  padding: 4px 0;\n}\n\n/* 日期网格 */\n.hb-calendar__days {\n  display: grid;\n  grid-template-columns: repeat(7, 1fr);\n  gap: 4px;\n}\n\n.hb-calendar__day {\n  aspect-ratio: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 13px;\n  color: var(--hb-color-text-regular, #606266);\n  cursor: pointer;\n  border-radius: 4px;\n  transition: all 0.2s;\n  user-select: none;\n}\n\n.hb-calendar__day:hover:not(.hb-calendar__day--other-month) {\n  background-color: var(--hb-fill-color-light, #f5f7fa);\n}\n\n.hb-calendar__day--other-month {\n  color: var(--hb-color-text-placeholder, #c0c4cc);\n  cursor: default;\n}\n\n.hb-calendar__day--today {\n  color: var(--hb-color-primary);\n  font-weight: 600;\n}\n\n.hb-calendar__day--selected {\n  background-color: var(--hb-color-primary);\n  color: var(--hb-color-white, #ffffff);\n}\n\n.hb-calendar__day--selected:hover {\n  background-color: var(--hb-color-primary);\n}\n\n/* 键盘焦点日（roving tabindex 的可见焦点态） */\n.hb-calendar__day--focused {\n  outline: 2px solid var(--hb-color-primary, #1677ff);\n  outline-offset: -2px;\n}\n\n.hb-calendar__day--disabled {\n  color: var(--hb-color-text-disabled, #c0c4cc);\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.hb-calendar__day--disabled:hover {\n  background-color: transparent;\n}\n","import { Component, h, Prop, Event, EventEmitter, State, Watch } from '@stencil/core';\nimport { getCalendarDays, parseDate, addMonths, isSameDay, MONTH_NAMES, WEEK_DAY_NAMES } from '../../utils/date-helpers';\n\n/**\n * Calendar 日历组件\n * 月份视图日历，支持选中日期与月份切换\n */\n@Component({\n  tag: 'hb-calendar',\n  styleUrl: 'calendar.css',\n  shadow: true,\n})\nexport class Calendar {\n  /**\n   * 绑定值（ISO 日期字符串）\n   */\n  @Prop({ mutable: true }) modelValue?: string;\n\n  /**\n   * 每周第一天（0=周日，1=周一 …）\n   * @default 0\n   */\n  @Prop() firstDayOfWeek: number = 0;\n\n  /**\n   * 禁用日期判定（声明预留，暂不强求实现）\n   */\n  @Prop() disabledDate?: (date: Date) => boolean;\n\n  /**\n   * 值改变事件，detail 为 ISO 日期字符串\n   */\n  @Event() hbChange: EventEmitter<string>;\n\n  @State() viewDate: Date = new Date();\n  @State() selectedDate?: Date;\n  /** 键盘导航的焦点日期（用于 role=gridcell 的 roving tabindex） */\n  @State() focusDate: Date = new Date();\n\n  componentDidLoad() {\n    this.initFromModelValue();\n  }\n\n  @Watch('modelValue')\n  handleModelValueChange() {\n    this.initFromModelValue();\n  }\n\n  private initFromModelValue() {\n    const parsed = parseDate(this.modelValue);\n    this.selectedDate = parsed;\n    if (parsed) {\n      this.viewDate = new Date(parsed.getFullYear(), parsed.getMonth(), 1);\n      this.focusDate = new Date(parsed);\n    } else {\n      // 无选中值时焦点默认到今天\n      this.focusDate = new Date();\n    }\n  }\n\n  private handleSelect = (day: { date: Date; isCurrentMonth: boolean }) => {\n    if (!day.isCurrentMonth) return;\n    if (this.disabledDate && this.disabledDate(day.date)) return;\n    this.selectedDate = day.date;\n    this.focusDate = new Date(day.date);\n    const iso = this.toISODate(day.date);\n    this.modelValue = iso;\n    this.hbChange.emit(iso);\n  };\n\n  /**\n   * 日期网格键盘导航（对齐 WAI-ARIA grid / antd Calendar）：\n   * - ArrowRight/Left：±1 天\n   * - ArrowDown/Up：±7 天\n   * - Home/End：当周首/末日\n   * - PageDown/Up：±1 月\n   * - Enter：选中焦点日\n   * 焦点日跨月时同步滚动 viewDate。\n   */\n  private handleGridKeydown = (e: KeyboardEvent) => {\n    const next = new Date(this.focusDate);\n    let monthDelta = 0;\n    switch (e.key) {\n      case 'ArrowRight':\n        next.setDate(next.getDate() + 1);\n        break;\n      case 'ArrowLeft':\n        next.setDate(next.getDate() - 1);\n        break;\n      case 'ArrowDown':\n        next.setDate(next.getDate() + 7);\n        break;\n      case 'ArrowUp':\n        next.setDate(next.getDate() - 7);\n        break;\n      case 'Home': {\n        const d = next.getDay();\n        next.setDate(next.getDate() - d);\n        break;\n      }\n      case 'End': {\n        const d = 6 - next.getDay();\n        next.setDate(next.getDate() + d);\n        break;\n      }\n      case 'PageDown':\n        next.setMonth(next.getMonth() + 1);\n        monthDelta = 1;\n        break;\n      case 'PageUp':\n        next.setMonth(next.getMonth() - 1);\n        monthDelta = -1;\n        break;\n      case 'Enter':\n        e.preventDefault();\n        this.handleSelect({ date: this.focusDate, isCurrentMonth: true });\n        return;\n      default:\n        return;\n    }\n    e.preventDefault();\n    // 焦点跨月：viewDate 跟随（PageUp/Down 或方向键滑出）\n    if (next.getMonth() !== this.viewDate.getMonth() || next.getFullYear() !== this.viewDate.getFullYear()) {\n      this.viewDate = new Date(next.getFullYear(), next.getMonth(), 1);\n    }\n    if (monthDelta) void monthDelta;\n    this.focusDate = next;\n  };\n\n  private toISODate(date: Date): string {\n    const y = date.getFullYear();\n    const m = String(date.getMonth() + 1).padStart(2, '0');\n    const d = String(date.getDate()).padStart(2, '0');\n    return `${y}-${m}-${d}`;\n  }\n\n  private changeMonth(delta: number) {\n    this.viewDate = addMonths(this.viewDate, delta);\n  }\n\n  /** 按 firstDayOfWeek 重排星期标题；getCalendarDays 也按同一 firstDayOfWeek 对齐网格 */\n  private get orderedWeekNames(): string[] {\n    const offset = ((this.firstDayOfWeek % 7) + 7) % 7;\n    return [...WEEK_DAY_NAMES.slice(offset), ...WEEK_DAY_NAMES.slice(0, offset)];\n  }\n\n  render() {\n    const days = getCalendarDays(this.viewDate, this.selectedDate, new Date(), this.firstDayOfWeek);\n    const current = this.viewDate;\n\n    return (\n      <div class=\"hb-calendar\">\n        <div class=\"hb-calendar__header\">\n          <button type=\"button\" class=\"hb-calendar__prev-btn\" onClick={() => this.changeMonth(-1)} aria-label=\"上一月\">\n            ‹\n          </button>\n          <span class=\"hb-calendar__header-label\" aria-live=\"polite\">\n            {current.getFullYear()}年 {MONTH_NAMES[current.getMonth()]}\n          </span>\n          <button type=\"button\" class=\"hb-calendar__next-btn\" onClick={() => this.changeMonth(1)} aria-label=\"下一月\">\n            ›\n          </button>\n        </div>\n        <div class=\"hb-calendar__body\" role=\"grid\" aria-label={`${current.getFullYear()}年${current.getMonth() + 1}月日历`}>\n          <div class=\"hb-calendar__weekdays\" role=\"row\">\n            {this.orderedWeekNames.map(day => (\n              <div class=\"hb-calendar__weekday\" role=\"columnheader\" aria-disabled=\"true\">\n                {day}\n              </div>\n            ))}\n          </div>\n          <div class=\"hb-calendar__days\" role=\"row\" onKeyDown={this.handleGridKeydown}>\n            {days.map((day, index) => {\n              const isFocused = isSameDay(day.date, this.focusDate);\n              const dayDisabled = day.isCurrentMonth && !!this.disabledDate && this.disabledDate(day.date);\n              return (\n                <div\n                  key={index}\n                  class={{\n                    'hb-calendar__day': true,\n                    'hb-calendar__day--other-month': !day.isCurrentMonth,\n                    'hb-calendar__day--today': day.isToday,\n                    'hb-calendar__day--selected': day.isSelected,\n                    'hb-calendar__day--focused': isFocused,\n                    'hb-calendar__day--disabled': dayDisabled,\n                  }}\n                  role=\"gridcell\"\n                  tabindex={isFocused ? 0 : -1}\n                  aria-selected={day.isSelected ? 'true' : 'false'}\n                  aria-current={day.isToday ? 'date' : undefined}\n                  aria-disabled={!day.isCurrentMonth || dayDisabled ? 'true' : undefined}\n                  aria-label={this.toISODate(day.date)}\n                  onClick={() => this.handleSelect(day)}\n                >\n                  {day.date.getDate()}\n                </div>\n              );\n            })}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/components/hb-card.js

@@ -12,7 +12,7 @@ const Card = /*@__PURE__*/ proxyCustomElement(class Card extends H {
     header;
     shadow = 'always';
     render() {
-        return (h("div", { key: 'a6fda886ea3031b93b9f42b12053357b7a461fcf', class: { 'hb-card': true, [`hb-card--shadow-${this.shadow}`]: true } }, (this.header || this.elHasHeaderSlot) && (h("div", { key: 'fdc0b804aa88c0520bf855e1b870880d08da9dd4', class: "hb-card__header" }, h("slot", { key: 'e335dfcc2bc494a671123599657bdc7636a873b9', name: "header" }, h("span", { key: '3391493e5295f33fb4fe0d8de5fb03a69be077f3' }, this.header)))), h("div", { key: 'e3fe736ff66aec2a14d1c22f9356ddf6c069ec2a', class: "hb-card__body" }, h("slot", { key: 'd22bff61394ae6f20c0be991f87223ab34c765b2' }))));
+        return (h("div", { key: 'f7608af1d9f0b49f69ae715158640746b0cef19d', class: { 'hb-card': true, [`hb-card--shadow-${this.shadow}`]: true } }, (this.header || this.elHasHeaderSlot) && (h("div", { key: '07d640827829fba28288c45643ea94553ae668bc', class: "hb-card__header" }, h("slot", { key: 'b48962d1f96d2c6caf8aeea54739d40ebd992a7b', name: "header" }, h("span", { key: '1c4701c4b0b478fdacfb950dab4da22ed92b8eca' }, this.header)))), h("div", { key: '3c98aa57aa0f8338dac90ff5a81baeb068473bd2', class: "hb-card__body" }, h("slot", { key: 'e4e3f11461bd73def3139e19cd3b945da1bc1365' }))));
     }
     get elHasHeaderSlot() {
         return !!document.querySelector('hb-card [slot="header"]');