kanto-ds 1.4.0 → 1.5.2

package/dist/chunks/kt-calendar-B_hFdD9V.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kt-calendar-B_hFdD9V.js","sources":["../../src/internal/date.ts","../../src/components/forms/kt-calendar/kt-calendar.ts"],"sourcesContent":["/**\n * Calendar dates without a time or a time zone.\n *\n * A date picker deals in days, and `Date` deals in instants: \"2026-03-29\" at\n * local midnight does not exist in some zones on DST night, and a day computed\n * in UTC is off by one for half the planet. So dates here are plain\n * `{ year, month, day }` values (month 1–12), serialised as ISO `YYYY-MM-DD`.\n * `Date` is only built — at noon, clear of any DST gap — to hand to `Intl`\n * for formatting.\n */\n\nexport interface PlainDate {\n  readonly year: number;\n  readonly month: number;\n  readonly day: number;\n}\n\nconst ISO = /^(\\d{4})-(\\d{2})-(\\d{2})$/;\n\nexport function daysInMonth(year: number, month: number): number {\n  return new Date(Date.UTC(year, month, 0)).getUTCDate();\n}\n\n/** `2026-09-25` → date, or `null` when malformed or impossible (Feb 30). */\nexport function parseDate(value: string | null | undefined): PlainDate | null {\n  const match = ISO.exec(value?.trim() ?? '');\n  if (!match) return null;\n  const [year, month, day] = [Number(match[1]), Number(match[2]), Number(match[3])];\n  if (month < 1 || month > 12 || day < 1 || day > daysInMonth(year, month)) return null;\n  return { year, month, day };\n}\n\nexport function formatDate(date: PlainDate): string {\n  const pad = (n: number, width = 2) => String(n).padStart(width, '0');\n  return `${pad(date.year, 4)}-${pad(date.month)}-${pad(date.day)}`;\n}\n\n/** An ISO 8601 interval, `start/end`. Either half may be missing or malformed. */\nexport function parseRange(value: string | null | undefined): {\n  start: PlainDate | null;\n  end: PlainDate | null;\n} {\n  const [start, end] = (value ?? '').split('/');\n  return { start: parseDate(start), end: parseDate(end) };\n}\n\nexport function formatRange(start: PlainDate, end: PlainDate): string {\n  return `${formatDate(start)}/${formatDate(end)}`;\n}\n\n/** Negative, zero or positive, like a sort comparator. */\nexport function compareDates(a: PlainDate, b: PlainDate): number {\n  return a.year - b.year || a.month - b.month || a.day - b.day;\n}\n\nexport function isSameDay(a: PlainDate | null, b: PlainDate | null): boolean {\n  return a !== null && b !== null && compareDates(a, b) === 0;\n}\n\n/** Whether `date` falls between `a` and `b`, inclusive, in either order. */\nexport function isBetween(date: PlainDate, a: PlainDate, b: PlainDate): boolean {\n  const [low, high] = compareDates(a, b) <= 0 ? [a, b] : [b, a];\n  return compareDates(date, low) >= 0 && compareDates(date, high) <= 0;\n}\n\nfunction fromUtc(time: number): PlainDate {\n  const d = new Date(time);\n  return { year: d.getUTCFullYear(), month: d.getUTCMonth() + 1, day: d.getUTCDate() };\n}\n\n/** Day arithmetic in UTC, where every day is 24 hours long. */\nexport function addDays(date: PlainDate, days: number): PlainDate {\n  return fromUtc(Date.UTC(date.year, date.month - 1, date.day + days));\n}\n\n/** Month arithmetic that clamps: 31 January + 1 month is 28 or 29 February. */\nexport function addMonths(date: PlainDate, months: number): PlainDate {\n  const index = date.year * 12 + (date.month - 1) + months;\n  const year = Math.floor(index / 12);\n  const month = (index % 12) + 1;\n  return { year, month, day: Math.min(date.day, daysInMonth(year, month)) };\n}\n\n/** 1 = Monday … 7 = Sunday, as ISO 8601 and `Intl.Locale#weekInfo` count them. */\nexport function isoWeekday(date: PlainDate): number {\n  const day = new Date(Date.UTC(date.year, date.month - 1, date.day)).getUTCDay();\n  return day === 0 ? 7 : day;\n}\n\n/** The first day of the week containing `date`, weeks starting on `firstDay`. */\nexport function startOfWeek(date: PlainDate, firstDay: number): PlainDate {\n  return addDays(date, -((isoWeekday(date) - firstDay + 7) % 7));\n}\n\n/**\n * The six weeks a month view shows — always six, so the calendar keeps its\n * height from one month to the next instead of jumping under the pointer.\n */\nexport function monthGrid(year: number, month: number, firstDay: number): PlainDate[][] {\n  let cursor = startOfWeek({ year, month, day: 1 }, firstDay);\n  const weeks: PlainDate[][] = [];\n  for (let week = 0; week < 6; week += 1) {\n    const days: PlainDate[] = [];\n    for (let day = 0; day < 7; day += 1) {\n      days.push(cursor);\n      cursor = addDays(cursor, 1);\n    }\n    weeks.push(days);\n  }\n  return weeks;\n}\n\nexport function today(): PlainDate {\n  const now = new Date();\n  return { year: now.getFullYear(), month: now.getMonth() + 1, day: now.getDate() };\n}\n\n/** A `Date` for `Intl` to format: local noon, clear of any DST transition. */\nexport function toLocalDate(date: PlainDate): Date {\n  return new Date(date.year, date.month - 1, date.day, 12);\n}\n\n/**\n * The first day of the week in `locale` — Monday in most of the world,\n * Sunday in the US, Saturday in parts of the Middle East. Read from\n * `Intl.Locale#getWeekInfo` (or the older `weekInfo` getter) where the\n * browser has it, Monday otherwise.\n */\nexport function firstDayOfWeek(locale: string): number {\n  try {\n    const info = new Intl.Locale(locale) as Intl.Locale & {\n      getWeekInfo?: () => { firstDay: number };\n      weekInfo?: { firstDay: number };\n    };\n    const firstDay = info.getWeekInfo?.().firstDay ?? info.weekInfo?.firstDay;\n    return firstDay && firstDay >= 1 && firstDay <= 7 ? firstDay : 1;\n  } catch {\n    return 1;\n  }\n}\n","import { css, html, nothing, type PropertyValues, type TemplateResult } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { KtElement, defineElement } from '#internal/kt-element';\nimport { emit, uniqueId } from '#internal/events';\nimport { dateFormat, resolveLocale } from '#internal/locale';\nimport { strings } from '#internal/strings';\nimport {\n  addDays,\n  addMonths,\n  compareDates,\n  daysInMonth,\n  firstDayOfWeek,\n  formatDate,\n  formatRange,\n  isBetween,\n  isSameDay,\n  monthGrid,\n  parseDate,\n  parseRange,\n  startOfWeek,\n  toLocalDate,\n  today,\n  type PlainDate,\n} from '#internal/date';\nimport '../../core/kt-icon/kt-icon.js';\n\nexport type KtCalendarView = 'day' | 'month' | 'year';\n\n/** Years per page of the year view: four rows of three. */\nconst YEARS_PER_PAGE = 12;\n\n/**\n * A month calendar to pick a day or a period from, shown in the page.\n *\n * The same calendar `<kt-date-picker>` opens in its popup, for when the\n * calendar is the interface rather than a way to fill a field: a booking\n * page, a dashboard's date filter, a planning view.\n *\n * The header's month and year are buttons. The month opens a grid of the\n * twelve months, the year a grid of twelve years, so reaching a date years\n * away takes three clicks rather than paging month by month.\n *\n * Keyboard, in the day grid (the WAI-ARIA date grid pattern): arrows by day\n * and week, Home/End to the week's ends, Page Up/Down by month and with Shift\n * by year, Enter to choose. In the month and year grids: arrows, Page Up/Down\n * by year or by twelve years, Enter to choose, Escape back to the days.\n *\n * @element kt-calendar\n *\n * @csspart base - The calendar.\n * @csspart day - A day cell.\n *\n * @fires kt-change - A day, or a whole period, was chosen. `detail: { value }`.\n *\n * @example\n * ```html\n * <kt-calendar value=\"2026-09-25\"></kt-calendar>\n * <kt-calendar range value=\"2026-09-01/2026-09-25\" min=\"2026-01-01\"></kt-calendar>\n * ```\n */\nexport class KtCalendar extends KtElement {\n  static override styles = [\n    KtElement.styles,\n    css`\n      :host {\n        display: inline-block;\n        --day-size: 36px;\n      }\n\n      .calendar {\n        display: flex;\n        flex-direction: column;\n        gap: var(--gap-element);\n        width: calc(var(--day-size) * 7);\n      }\n\n      .header {\n        display: grid;\n        grid-template-columns: auto 1fr auto;\n        align-items: center;\n      }\n      .title {\n        display: flex;\n        justify-content: center;\n        gap: 2px;\n      }\n\n      .nav,\n      .heading {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        height: var(--day-size);\n        padding: 0;\n        color: var(--text-muted);\n        font: var(--font-normal-medium);\n        background: none;\n        border: none;\n        border-radius: var(--radius-input);\n        cursor: pointer;\n      }\n      .nav {\n        width: var(--day-size);\n      }\n      .heading {\n        padding: 0 8px;\n        color: var(--text-body);\n        text-transform: capitalize;\n      }\n      .heading kt-icon {\n        margin-left: 2px;\n        color: var(--text-muted);\n      }\n      .heading.static {\n        cursor: default;\n      }\n      .nav:hover,\n      .heading:not(.static):hover {\n        color: var(--text-body);\n        background: var(--color-dark-22);\n      }\n      .nav:focus-visible,\n      .heading:focus-visible {\n        outline: var(--outline-width) solid var(--color-primary-base);\n      }\n\n      /* One height for every view, so the calendar does not shrink under the\n         pointer when it switches from days to months or years. */\n      .body {\n        height: calc(var(--day-size) * 7 + 16px);\n      }\n      table {\n        width: 100%;\n        table-layout: fixed;\n        border-collapse: separate;\n        border-spacing: 0 2px;\n      }\n      table.wide {\n        height: 100%;\n      }\n      th {\n        padding-bottom: 4px;\n        color: var(--text-muted);\n        font: var(--font-normal-small);\n        font-weight: 600;\n      }\n      th abbr {\n        text-decoration: none;\n      }\n\n      .cell {\n        height: var(--day-size);\n        padding: 0;\n        color: var(--text-body);\n        font: var(--font-normal-regular);\n        font-variant-numeric: tabular-nums;\n        text-align: center;\n        border-radius: var(--radius-input);\n        outline: none;\n        cursor: pointer;\n      }\n      .cell:hover {\n        background: var(--color-dark-22);\n      }\n      .cell:focus-visible {\n        box-shadow: inset 0 0 0 var(--outline-width) var(--color-primary-base);\n      }\n      /* Months and years sit three to a row, sharing the height the days use. */\n      .wide .cell {\n        height: auto;\n        text-transform: capitalize;\n      }\n      .cell.outside {\n        color: var(--text-muted);\n      }\n      .cell.current {\n        font-weight: 700;\n        text-decoration: underline;\n        text-decoration-thickness: 2px;\n        text-underline-offset: 4px;\n      }\n\n      /* A period reads as one band: the days between are tinted and squared\n         off, and only its two ends are rounded. */\n      .cell.in-range {\n        background: var(--color-primary-soft);\n        border-radius: 0;\n      }\n      .cell.range-start {\n        border-radius: var(--radius-input) 0 0 var(--radius-input);\n      }\n      .cell.range-end {\n        border-radius: 0 var(--radius-input) var(--radius-input) 0;\n      }\n      .cell.range-start.range-end {\n        border-radius: var(--radius-input);\n      }\n      .cell.selected {\n        color: var(--color-white);\n        background: var(--color-primary-base);\n      }\n\n      .cell[aria-disabled='true'] {\n        color: var(--text-disabled);\n        background: none;\n        text-decoration: line-through;\n        cursor: not-allowed;\n      }\n    `,\n  ];\n\n  private readonly liveId = uniqueId('kt-calendar-live');\n  private focusCell = false;\n  /** Set while the calendar writes its own value, which should not move it. */\n  private committing = false;\n\n  @state() private view: KtCalendarView = 'day';\n  /** First day of the month the day view shows. */\n  @state() private month: PlainDate = { ...today(), day: 1 };\n  /** The day, month or year holding the grid's one tab stop. */\n  @state() private focused: PlainDate = today();\n  /** In a period: the first end chosen, while the second is pending. */\n  @state() private anchor: PlainDate | null = null;\n\n  /** ISO date, or `start/end` interval with `range`. `null` when empty. */\n  @property({ type: String, reflect: true })\n  value: string | null = null;\n\n  /** Choose a period — two dates — instead of one day. */\n  @property({ type: Boolean, reflect: true })\n  range = false;\n\n  /** Earliest date that can be chosen, ISO. */\n  @property({ type: String })\n  min = '';\n\n  /** Latest date that can be chosen, ISO. */\n  @property({ type: String })\n  max = '';\n\n  /**\n   * BCP 47 language tag for names and the first day of the week. Empty: the\n   * page's `lang`, then the browser's language.\n   */\n  @property({ type: String })\n  locale = '';\n\n  /** Accessible name of the calendar. Defaults to the strings registry. */\n  @property({ type: String })\n  label = '';\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    // Open on the chosen day, or today, kept inside the bounds.\n    this.jumpTo(this.clamp(this.selection.start ?? today()), false);\n  }\n\n  override willUpdate(changed: PropertyValues<this>): void {\n    // A value set from outside — a \"today\" button, a reset — moves the\n    // calendar to it. One the user just picked leaves it where it is.\n    if (changed.has('value') && !this.committing && this.hasUpdated) {\n      this.anchor = null;\n      const start = this.selection.start;\n      if (start) this.jumpTo(this.clamp(start), false);\n    }\n    this.committing = false;\n  }\n\n  override updated(): void {\n    if (!this.focusCell) return;\n    this.focusCell = false;\n    this.shadowRoot?.querySelector<HTMLElement>('.cell[tabindex=\"0\"]')?.focus();\n  }\n\n  /** Focuses the grid's current cell — the chosen day, or today. */\n  override focus(): void {\n    this.focusCell = true;\n    this.requestUpdate();\n  }\n\n  // --- Reading the value ---\n\n  private get resolvedLocale(): string {\n    return resolveLocale(this.locale);\n  }\n\n  private get selection(): { start: PlainDate | null; end: PlainDate | null } {\n    return this.range\n      ? parseRange(this.value)\n      : { start: parseDate(this.value), end: parseDate(this.value) };\n  }\n\n  private get bounds(): { min: PlainDate | null; max: PlainDate | null } {\n    return { min: parseDate(this.min), max: parseDate(this.max) };\n  }\n\n  private clamp(date: PlainDate): PlainDate {\n    const { min, max } = this.bounds;\n    if (min && compareDates(date, min) < 0) return min;\n    if (max && compareDates(date, max) > 0) return max;\n    return date;\n  }\n\n  private isOutOfBounds(date: PlainDate): boolean {\n    const { min, max } = this.bounds;\n    return (\n      (min !== null && compareDates(date, min) < 0) || (max !== null && compareDates(date, max) > 0)\n    );\n  }\n\n  /** A month or a year is unavailable only when every day of it is. */\n  private isSpanOutOfBounds(first: PlainDate, last: PlainDate): boolean {\n    const { min, max } = this.bounds;\n    return (\n      (max !== null && compareDates(first, max) > 0) ||\n      (min !== null && compareDates(last, min) < 0)\n    );\n  }\n\n  private format(options: Intl.DateTimeFormatOptions, date: PlainDate): string {\n    return dateFormat(this.resolvedLocale, options).format(toLocalDate(date));\n  }\n\n  // --- Moving ---\n\n  /** Moves the tab stop, and the day view with it when it leaves the month. */\n  private jumpTo(date: PlainDate, focus = true): void {\n    this.focused = date;\n    if (date.year !== this.month.year || date.month !== this.month.month) {\n      this.month = { year: date.year, month: date.month, day: 1 };\n    }\n    this.focusCell = focus;\n  }\n\n  private setView(view: KtCalendarView): void {\n    this.view = view;\n    this.focusCell = true;\n  }\n\n  // --- Choosing ---\n\n  private chooseDay(date: PlainDate): void {\n    if (this.isOutOfBounds(date)) return;\n    this.focused = date;\n\n    if (!this.range) {\n      this.commit(formatDate(date));\n      return;\n    }\n    if (!this.anchor) {\n      this.anchor = date;\n      return;\n    }\n    const [start, end] =\n      compareDates(this.anchor, date) <= 0 ? [this.anchor, date] : [date, this.anchor];\n    this.anchor = null;\n    this.commit(formatRange(start, end));\n  }\n\n  private commit(value: string): void {\n    this.committing = true;\n    this.value = value;\n    emit(this, 'kt-change', { value });\n  }\n\n  private chooseMonth(month: number): void {\n    const day = Math.min(this.focused.day, daysInMonth(this.focused.year, month));\n    this.jumpTo(this.clamp({ year: this.focused.year, month, day }));\n    this.setView('day');\n  }\n\n  private chooseYear(year: number): void {\n    const day = Math.min(this.focused.day, daysInMonth(year, this.focused.month));\n    this.focused = { year, month: this.focused.month, day };\n    this.setView('month');\n  }\n\n  // --- Keyboard ---\n\n  private onDayKeyDown(event: KeyboardEvent): void {\n    const firstDay = firstDayOfWeek(this.resolvedLocale);\n    const from = this.focused;\n    let next: PlainDate;\n\n    switch (event.key) {\n      case 'ArrowLeft':\n        next = addDays(from, -1);\n        break;\n      case 'ArrowRight':\n        next = addDays(from, 1);\n        break;\n      case 'ArrowUp':\n        next = addDays(from, -7);\n        break;\n      case 'ArrowDown':\n        next = addDays(from, 7);\n        break;\n      case 'Home':\n        next = startOfWeek(from, firstDay);\n        break;\n      case 'End':\n        next = addDays(startOfWeek(from, firstDay), 6);\n        break;\n      case 'PageUp':\n        next = addMonths(from, event.shiftKey ? -12 : -1);\n        break;\n      case 'PageDown':\n        next = addMonths(from, event.shiftKey ? 12 : 1);\n        break;\n      case 'Enter':\n      case ' ':\n        event.preventDefault();\n        this.chooseDay(from);\n        return;\n      default:\n        return;\n    }\n    event.preventDefault();\n    this.jumpTo(next);\n  }\n\n  /** Months and years share one model: a list of cells, three to a row. */\n  private onPickerKeyDown(event: KeyboardEvent): void {\n    const inMonths = this.view === 'month';\n    const step = (by: number) =>\n      inMonths ? addMonths(this.focused, by) : addMonths(this.focused, by * 12);\n\n    let next: PlainDate;\n    switch (event.key) {\n      case 'ArrowLeft':\n        next = step(-1);\n        break;\n      case 'ArrowRight':\n        next = step(1);\n        break;\n      case 'ArrowUp':\n        next = step(-3);\n        break;\n      case 'ArrowDown':\n        next = step(3);\n        break;\n      case 'PageUp':\n        next = step(inMonths ? -12 : -YEARS_PER_PAGE);\n        break;\n      case 'PageDown':\n        next = step(inMonths ? 12 : YEARS_PER_PAGE);\n        break;\n      case 'Enter':\n      case ' ':\n        event.preventDefault();\n        if (inMonths) this.chooseMonth(this.focused.month);\n        else this.chooseYear(this.focused.year);\n        return;\n      case 'Escape':\n        // Back to the days, not out of whatever holds the calendar.\n        event.preventDefault();\n        event.stopPropagation();\n        this.setView('day');\n        return;\n      default:\n        return;\n    }\n    event.preventDefault();\n    this.focused = next;\n    this.focusCell = true;\n  }\n\n  // --- Rendering ---\n\n  private renderHeader(): TemplateResult {\n    const { year } = this.focused;\n    const s = strings();\n\n    if (this.view === 'day') {\n      return html`<div class=\"header\">\n        <button\n          type=\"button\"\n          class=\"nav\"\n          aria-label=${s.previousMonth}\n          @click=${() => this.jumpTo(addMonths(this.focused, -1), false)}\n        >\n          <kt-icon name=\"chevron-left\" size=\"18\"></kt-icon>\n        </button>\n        <div class=\"title\">\n          <button\n            type=\"button\"\n            class=\"heading\"\n            aria-label=${`${s.chooseMonth}, ${this.format({ month: 'long' }, this.month)}`}\n            @click=${() => this.setView('month')}\n          >\n            ${this.format({ month: 'long' }, this.month)}\n          </button>\n          <button\n            type=\"button\"\n            class=\"heading\"\n            aria-label=${`${s.chooseYear}, ${this.month.year}`}\n            @click=${() => this.setView('year')}\n          >\n            ${this.format({ year: 'numeric' }, this.month)}\n            <kt-icon name=\"chevron-down\" size=\"14\"></kt-icon>\n          </button>\n        </div>\n        <button\n          type=\"button\"\n          class=\"nav\"\n          aria-label=${s.nextMonth}\n          @click=${() => this.jumpTo(addMonths(this.focused, 1), false)}\n        >\n          <kt-icon name=\"chevron-right\" size=\"18\"></kt-icon>\n        </button>\n      </div>`;\n    }\n\n    const inMonths = this.view === 'month';\n    const pageStart = year - (((year % YEARS_PER_PAGE) + YEARS_PER_PAGE) % YEARS_PER_PAGE);\n    const by = inMonths ? 12 : YEARS_PER_PAGE * 12;\n\n    return html`<div class=\"header\">\n      <button\n        type=\"button\"\n        class=\"nav\"\n        aria-label=${inMonths ? s.previousYear : s.previousYears}\n        @click=${() => {\n          this.focused = addMonths(this.focused, -by);\n        }}\n      >\n        <kt-icon name=\"chevron-left\" size=\"18\"></kt-icon>\n      </button>\n      <div class=\"title\">\n        ${\n          inMonths\n            ? html`<button\n                type=\"button\"\n                class=\"heading\"\n                aria-label=${`${s.chooseYear}, ${year}`}\n                @click=${() => this.setView('year')}\n              >\n                ${year}\n              </button>`\n            : html`<span class=\"heading static\"\n                >${pageStart} – ${pageStart + YEARS_PER_PAGE - 1}</span\n              >`\n        }\n      </div>\n      <button\n        type=\"button\"\n        class=\"nav\"\n        aria-label=${inMonths ? s.nextYear : s.nextYears}\n        @click=${() => {\n          this.focused = addMonths(this.focused, by);\n        }}\n      >\n        <kt-icon name=\"chevron-right\" size=\"18\"></kt-icon>\n      </button>\n    </div>`;\n  }\n\n  private renderDay(date: PlainDate): TemplateResult {\n    const { start, end } = this.selection;\n    const rangeStart = this.anchor ?? start;\n    const rangeEnd = this.anchor ? this.focused : end;\n    const [low, high] =\n      rangeStart && rangeEnd && compareDates(rangeStart, rangeEnd) > 0\n        ? [rangeEnd, rangeStart]\n        : [rangeStart, rangeEnd];\n\n    const selected = this.range\n      ? isSameDay(date, low) || isSameDay(date, high)\n      : isSameDay(date, start);\n    const inRange = this.range && low !== null && high !== null && isBetween(date, low, high);\n    const isToday = isSameDay(date, today());\n\n    return html`<td\n      part=\"day\"\n      role=\"gridcell\"\n      class=${classMap({\n        cell: true,\n        outside: date.month !== this.month.month,\n        current: isToday,\n        selected,\n        'in-range': inRange,\n        'range-start': inRange && isSameDay(date, low),\n        'range-end': inRange && isSameDay(date, high),\n      })}\n      data-date=${formatDate(date)}\n      tabindex=${isSameDay(date, this.focused) ? 0 : -1}\n      aria-selected=${selected ? 'true' : 'false'}\n      aria-disabled=${this.isOutOfBounds(date) ? 'true' : nothing}\n      aria-current=${isToday ? 'date' : nothing}\n      aria-label=${this.format({ dateStyle: 'full' }, date)}\n      @click=${() => this.chooseDay(date)}\n      @pointerenter=${() => {\n        if (this.anchor) this.focused = date;\n      }}\n    >\n      ${date.day}\n    </td>`;\n  }\n\n  private renderDays(): TemplateResult {\n    const weeks = monthGrid(this.month.year, this.month.month, firstDayOfWeek(this.resolvedLocale));\n    return html`<table role=\"grid\" aria-labelledby=${this.liveId} @keydown=${this.onDayKeyDown}>\n      <thead>\n        <tr>\n          ${weeks[0]!.map(\n            (day) =>\n              html`<th scope=\"col\">\n                <abbr title=${this.format({ weekday: 'long' }, day)}\n                  >${this.format({ weekday: 'short' }, day)}</abbr\n                >\n              </th>`,\n          )}\n        </tr>\n      </thead>\n      <tbody>\n        ${weeks.map(\n          (week) =>\n            html`<tr>\n              ${week.map((day) => this.renderDay(day))}\n            </tr>`,\n        )}\n      </tbody>\n    </table>`;\n  }\n\n  /** The month or year grid: twelve cells, three to a row. */\n  private renderPicker(): TemplateResult {\n    const inMonths = this.view === 'month';\n    const { year } = this.focused;\n    const now = today();\n    const pageStart = year - (((year % YEARS_PER_PAGE) + YEARS_PER_PAGE) % YEARS_PER_PAGE);\n\n    const cells = Array.from({ length: 12 }, (_, index) => {\n      if (inMonths) {\n        const month = index + 1;\n        const first = { year, month, day: 1 };\n        return {\n          key: `${year}-${month}`,\n          label: this.format({ month: 'short' }, first),\n          fullLabel: this.format({ month: 'long', year: 'numeric' }, first),\n          focused: month === this.focused.month,\n          selected: month === this.month.month && year === this.month.year,\n          current: month === now.month && year === now.year,\n          disabled: this.isSpanOutOfBounds(first, { year, month, day: daysInMonth(year, month) }),\n          choose: () => this.chooseMonth(month),\n        };\n      }\n      const candidate = pageStart + index;\n      return {\n        key: String(candidate),\n        label: String(candidate),\n        fullLabel: String(candidate),\n        focused: candidate === year,\n        selected: candidate === this.month.year,\n        current: candidate === now.year,\n        disabled: this.isSpanOutOfBounds(\n          { year: candidate, month: 1, day: 1 },\n          { year: candidate, month: 12, day: 31 },\n        ),\n        choose: () => this.chooseYear(candidate),\n      };\n    });\n\n    const rows = [0, 3, 6, 9].map((start) => cells.slice(start, start + 3));\n\n    return html`<table\n      role=\"grid\"\n      class=\"wide\"\n      aria-labelledby=${this.liveId}\n      @keydown=${this.onPickerKeyDown}\n    >\n      <tbody>\n        ${rows.map(\n          (row) =>\n            html`<tr>\n              ${row.map(\n                (cell) =>\n                  html`<td\n                    role=\"gridcell\"\n                    class=${classMap({\n                      cell: true,\n                      selected: cell.selected,\n                      current: cell.current,\n                    })}\n                    data-key=${cell.key}\n                    tabindex=${cell.focused ? 0 : -1}\n                    aria-selected=${cell.selected ? 'true' : 'false'}\n                    aria-disabled=${cell.disabled ? 'true' : nothing}\n                    aria-label=${cell.fullLabel}\n                    @click=${() => {\n                      if (!cell.disabled) cell.choose();\n                    }}\n                  >\n                    ${cell.label}\n                  </td>`,\n              )}\n            </tr>`,\n        )}\n      </tbody>\n    </table>`;\n  }\n\n  override render(): TemplateResult {\n    const s = strings();\n    const announced =\n      this.view === 'day'\n        ? this.format({ month: 'long', year: 'numeric' }, this.month)\n        : this.view === 'month'\n          ? String(this.focused.year)\n          : s.chooseYear;\n\n    return html`<div\n      part=\"base\"\n      class=\"calendar\"\n      role=\"group\"\n      aria-label=${this.label || (this.range ? s.selectPeriod : s.selectDate)}\n    >\n      <span id=${this.liveId} class=\"visually-hidden\" aria-live=\"polite\">${announced}</span>\n      ${this.renderHeader()}\n      <div class=\"body\">${this.view === 'day' ? this.renderDays() : this.renderPicker()}</div>\n    </div>`;\n  }\n}\n\ndefineElement('kt-calendar', KtCalendar);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kt-calendar': KtCalendar;\n  }\n}\n"],"names":["ISO","daysInMonth","year","month","parseDate","value","match","day","formatDate","date","pad","n","width","parseRange","start","end","formatRange","compareDates","a","b","isSameDay","isBetween","low","high","fromUtc","time","d","addDays","days","addMonths","months","index","isoWeekday","startOfWeek","firstDay","monthGrid","cursor","weeks","week","today","now","toLocalDate","firstDayOfWeek","locale","info","YEARS_PER_PAGE","KtCalendar","KtElement","uniqueId","css","changed","resolveLocale","min","max","first","last","options","dateFormat","focus","view","emit","event","from","next","inMonths","step","by","s","strings","html","pageStart","rangeStart","rangeEnd","selected","inRange","isToday","classMap","nothing","cells","_","candidate","rows","row","cell","announced","__decorateClass","state","property","defineElement"],"mappings":"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"}

package/dist/chunks/{kt-element-E-tfJpGQ.js → kt-element-Djx2JcGl.js}

@@ -1,5 +1,5 @@
 import { LitElement as n, css as i } from "lit";
-import { o } from "./index-DSSLJirw.js";
+import { o } from "./index-STEEvEP7.js";
 const t = "kt-strings";
 class c extends n {
   static {
@@ -49,4 +49,4 @@ export {
   c as K,
   d
 };
-//# sourceMappingURL=kt-element-E-tfJpGQ.js.map
+//# sourceMappingURL=kt-element-Djx2JcGl.js.map

package/dist/chunks/{kt-element-E-tfJpGQ.js.map → kt-element-Djx2JcGl.js.map}

@@ -1 +1 @@
-{"version":3,"file":"kt-element-E-tfJpGQ.js","sources":["../../src/internal/kt-element.ts"],"sourcesContent":["import { LitElement, css, type CSSResultGroup, type PropertyValues } from 'lit';\nimport { onStringsChange } from './strings.js';\n\n/**\n * The key a `setStrings` call marks in `changedProperties`, so an element can\n * recompute copy it caches outside `render()` — a validation message.\n */\nconst STRINGS_CHANGED = 'kt-strings';\n\n/**\n * Base class for every Kanto element.\n *\n * It exists for two reasons. First, `box-sizing: border-box` does not cross a\n * shadow boundary, so each root has to re-establish it. Second, `[hidden]`\n * loses to a `:host { display: flex }` rule inside the shadow root, and every\n * element in this system sets its own display — without the override here,\n * hiding a Kanto element from the outside silently does nothing.\n */\nexport class KtElement extends LitElement {\n  static override styles: CSSResultGroup = css`\n    :host {\n      box-sizing: border-box;\n    }\n\n    :host([hidden]) {\n      display: none !important;\n    }\n\n    *,\n    *::before,\n    *::after {\n      box-sizing: inherit;\n    }\n\n    /* Read by assistive technology, never drawn. */\n    .visually-hidden {\n      position: absolute;\n      width: 1px;\n      height: 1px;\n      overflow: hidden;\n      clip-path: inset(50%);\n      white-space: nowrap;\n    }\n  `;\n\n  private unsubscribeStrings: (() => void) | undefined;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    // Copy comes from the strings registry at render time; follow it when an\n    // application switches language.\n    // A fresh old value, because Lit skips a named update whose value did not\n    // change — and 'kt-strings' is not a property, so it is always undefined.\n    this.unsubscribeStrings = onStringsChange(() =>\n      this.requestUpdate(STRINGS_CHANGED, Symbol('previous strings')),\n    );\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.unsubscribeStrings?.();\n    this.unsubscribeStrings = undefined;\n  }\n\n  /** True when this update was triggered by `setStrings`. */\n  protected stringsChanged(changed: PropertyValues): boolean {\n    return changed.has(STRINGS_CHANGED);\n  }\n}\n\n/**\n * Registers a custom element, tolerating a repeat call.\n *\n * A design system gets loaded twice more often than you would like — two\n * versions in one dependency tree, a dev-server hot reload, a micro-frontend\n * mounting a second copy. `customElements.define` throws on a duplicate tag\n * and would take the whole page down with it.\n */\nexport function defineElement(tag: string, ctor: CustomElementConstructor): void {\n  if (customElements.get(tag)) return;\n  customElements.define(tag, ctor);\n}\n"],"names":["STRINGS_CHANGED","KtElement","LitElement","css","onStringsChange","changed","defineElement","tag","ctor"],"mappings":";;AAOA,MAAMA,IAAkB;AAWjB,MAAMC,UAAkBC,EAAW;AAAA,EACxC,OAAA;AAAA,SAAgB,SAAyBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAAA,EA4BhC,oBAA0B;AACjC,UAAM,kBAAA,GAKN,KAAK,qBAAqBC;AAAA,MAAgB,MACxC,KAAK,cAAcJ,GAAiB,uBAAO,kBAAkB,CAAC;AAAA,IAAA;AAAA,EAElE;AAAA,EAES,uBAA6B;AACpC,UAAM,qBAAA,GACN,KAAK,qBAAA,GACL,KAAK,qBAAqB;AAAA,EAC5B;AAAA;AAAA,EAGU,eAAeK,GAAkC;AACzD,WAAOA,EAAQ,IAAIL,CAAe;AAAA,EACpC;AACF;AAUO,SAASM,EAAcC,GAAaC,GAAsC;AAC/E,EAAI,eAAe,IAAID,CAAG,KAC1B,eAAe,OAAOA,GAAKC,CAAI;AACjC;"}
+{"version":3,"file":"kt-element-Djx2JcGl.js","sources":["../../src/internal/kt-element.ts"],"sourcesContent":["import { LitElement, css, type CSSResultGroup, type PropertyValues } from 'lit';\nimport { onStringsChange } from './strings.js';\n\n/**\n * The key a `setStrings` call marks in `changedProperties`, so an element can\n * recompute copy it caches outside `render()` — a validation message.\n */\nconst STRINGS_CHANGED = 'kt-strings';\n\n/**\n * Base class for every Kanto element.\n *\n * It exists for two reasons. First, `box-sizing: border-box` does not cross a\n * shadow boundary, so each root has to re-establish it. Second, `[hidden]`\n * loses to a `:host { display: flex }` rule inside the shadow root, and every\n * element in this system sets its own display — without the override here,\n * hiding a Kanto element from the outside silently does nothing.\n */\nexport class KtElement extends LitElement {\n  static override styles: CSSResultGroup = css`\n    :host {\n      box-sizing: border-box;\n    }\n\n    :host([hidden]) {\n      display: none !important;\n    }\n\n    *,\n    *::before,\n    *::after {\n      box-sizing: inherit;\n    }\n\n    /* Read by assistive technology, never drawn. */\n    .visually-hidden {\n      position: absolute;\n      width: 1px;\n      height: 1px;\n      overflow: hidden;\n      clip-path: inset(50%);\n      white-space: nowrap;\n    }\n  `;\n\n  private unsubscribeStrings: (() => void) | undefined;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    // Copy comes from the strings registry at render time; follow it when an\n    // application switches language.\n    // A fresh old value, because Lit skips a named update whose value did not\n    // change — and 'kt-strings' is not a property, so it is always undefined.\n    this.unsubscribeStrings = onStringsChange(() =>\n      this.requestUpdate(STRINGS_CHANGED, Symbol('previous strings')),\n    );\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.unsubscribeStrings?.();\n    this.unsubscribeStrings = undefined;\n  }\n\n  /** True when this update was triggered by `setStrings`. */\n  protected stringsChanged(changed: PropertyValues): boolean {\n    return changed.has(STRINGS_CHANGED);\n  }\n}\n\n/**\n * Registers a custom element, tolerating a repeat call.\n *\n * A design system gets loaded twice more often than you would like — two\n * versions in one dependency tree, a dev-server hot reload, a micro-frontend\n * mounting a second copy. `customElements.define` throws on a duplicate tag\n * and would take the whole page down with it.\n */\nexport function defineElement(tag: string, ctor: CustomElementConstructor): void {\n  if (customElements.get(tag)) return;\n  customElements.define(tag, ctor);\n}\n"],"names":["STRINGS_CHANGED","KtElement","LitElement","css","onStringsChange","changed","defineElement","tag","ctor"],"mappings":";;AAOA,MAAMA,IAAkB;AAWjB,MAAMC,UAAkBC,EAAW;AAAA,EACxC,OAAA;AAAA,SAAgB,SAAyBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAAA,EA4BhC,oBAA0B;AACjC,UAAM,kBAAA,GAKN,KAAK,qBAAqBC;AAAA,MAAgB,MACxC,KAAK,cAAcJ,GAAiB,uBAAO,kBAAkB,CAAC;AAAA,IAAA;AAAA,EAElE;AAAA,EAES,uBAA6B;AACpC,UAAM,qBAAA,GACN,KAAK,qBAAA,GACL,KAAK,qBAAqB;AAAA,EAC5B;AAAA;AAAA,EAGU,eAAeK,GAAkC;AACzD,WAAOA,EAAQ,IAAIL,CAAe;AAAA,EACpC;AACF;AAUO,SAASM,EAAcC,GAAaC,GAAsC;AAC/E,EAAI,eAAe,IAAID,CAAG,KAC1B,eAAe,OAAOA,GAAKC,CAAI;AACjC;"}

package/dist/chunks/{listbox-Sm3nvsC6.js → listbox-llcUu_V-.js}

@@ -1,10 +1,10 @@
-import { css as i } from "lit";
-function o(t) {
+import { css as o } from "lit";
+function i(t) {
   return t.label ?? String(t.id);
 }
 function l(t, e) {
   const r = e.trim().toLowerCase();
-  return r ? t.filter((n) => o(n).toLowerCase().includes(r)) : t;
+  return r ? t.filter((n) => i(n).toLowerCase().includes(r)) : t;
 }
 function s(t, e, r) {
   if (t.length === 0) return -1;
@@ -17,22 +17,18 @@ function s(t, e, r) {
 function p(t) {
   return t.findIndex((e) => !e.disabled);
 }
-function u(t) {
+function f(t) {
   for (let e = t.length - 1; e >= 0; e -= 1)
     if (!t[e]?.disabled) return e;
   return -1;
 }
-const f = i`
+const u = o`
+  /* Placed from the field by FloatingController, which also sets its width. */
   .popup {
-    position: absolute;
-    top: calc(var(--field-height, var(--button-height)) + 6px);
-    left: 0;
-    z-index: var(--z-dropdown);
     display: flex;
     flex-direction: column;
     gap: var(--gap-element);
     box-sizing: border-box;
-    width: 100%;
     max-height: 300px;
     margin: 0;
     padding: var(--padding-expand);
@@ -59,6 +55,14 @@ const f = i`
     pointer-events: auto;
   }
 
+  /* Opened above the field, for want of room below: it grows upwards. */
+  .popup.top {
+    transform-origin: bottom left;
+  }
+  .popup.top:not(.open) {
+    transform: translateY(6px) scaleY(0.98);
+  }
+
   .option {
     padding: var(--padding-expand-item);
     color: var(--text-muted);
@@ -91,11 +95,11 @@ const f = i`
   }
 `;
 export {
-  f as a,
+  u as a,
   l as b,
   p as f,
-  u as l,
+  f as l,
   s as n,
-  o
+  i as o
 };
-//# sourceMappingURL=listbox-Sm3nvsC6.js.map
+//# sourceMappingURL=listbox-llcUu_V-.js.map

package/dist/chunks/{listbox-Sm3nvsC6.js.map → listbox-llcUu_V-.js.map}

@@ -1 +1 @@
-{"version":3,"file":"listbox-Sm3nvsC6.js","sources":["../../src/internal/listbox.ts"],"sourcesContent":["import { css } from 'lit';\n\n/**\n * Shared pieces of the two option-list controls, `<kt-select>` and\n * `<kt-input-menu>`.\n *\n * They differ in how an option is chosen — pick from a list, or filter by\n * typing — but the popup, the option rows and the keyboard model are the same,\n * and having them drift apart is how a design system stops looking like one.\n */\n\nexport interface KtOption {\n  readonly id: string | number;\n  readonly label?: string;\n  readonly disabled?: boolean;\n}\n\n/** The text to display for an option: its label, or its id as a fallback. */\nexport function optionLabel(option: KtOption): string {\n  return option.label ?? String(option.id);\n}\n\n/** Case-insensitive substring match on the visible label. */\nexport function filterOptions(options: readonly KtOption[], query: string): readonly KtOption[] {\n  const needle = query.trim().toLowerCase();\n  if (!needle) return options;\n  return options.filter((option) => optionLabel(option).toLowerCase().includes(needle));\n}\n\n/**\n * The next selectable index in `direction`, skipping disabled options and\n * wrapping at both ends. Returns -1 when every option is disabled, so a caller\n * never lands the active descendant on something that cannot be chosen.\n */\nexport function nextEnabledIndex(\n  options: readonly KtOption[],\n  from: number,\n  direction: 1 | -1,\n): number {\n  if (options.length === 0) return -1;\n\n  for (let step = 1; step <= options.length; step += 1) {\n    const index = (from + direction * step + options.length * step) % options.length;\n    if (!options[index]?.disabled) return index;\n  }\n  return -1;\n}\n\n/** The first selectable index, for opening a list with nothing selected. */\nexport function firstEnabledIndex(options: readonly KtOption[]): number {\n  return options.findIndex((option) => !option.disabled);\n}\n\n/** The last selectable index, for End. */\nexport function lastEnabledIndex(options: readonly KtOption[]): number {\n  for (let index = options.length - 1; index >= 0; index -= 1) {\n    if (!options[index]?.disabled) return index;\n  }\n  return -1;\n}\n\n/**\n * The popup and option-row styles.\n *\n * The panel animates through opacity and transform while staying in the layout\n * as `visibility: hidden`, rather than being added and removed: a popup that\n * unmounts cannot animate out, and one that only sets `display: none` cannot\n * animate at all.\n */\nexport const listboxStyles = css`\n  .popup {\n    position: absolute;\n    top: calc(var(--field-height, var(--button-height)) + 6px);\n    left: 0;\n    z-index: var(--z-dropdown);\n    display: flex;\n    flex-direction: column;\n    gap: var(--gap-element);\n    box-sizing: border-box;\n    width: 100%;\n    max-height: 300px;\n    margin: 0;\n    padding: var(--padding-expand);\n    overflow: auto;\n    list-style: none;\n    background: var(--color-dark-20);\n    border-radius: var(--radius-input);\n    scrollbar-width: thin;\n\n    visibility: hidden;\n    opacity: 0;\n    transform: translateY(-6px) scaleY(0.98);\n    transform-origin: top left;\n    pointer-events: none;\n    transition:\n      opacity var(--duration-fast) var(--easing-standard),\n      transform var(--duration-fast) var(--easing-standard);\n  }\n\n  .popup.open {\n    visibility: visible;\n    opacity: 1;\n    transform: translateY(0) scaleY(1);\n    pointer-events: auto;\n  }\n\n  .option {\n    padding: var(--padding-expand-item);\n    color: var(--text-muted);\n    font: var(--font-input);\n    border-radius: var(--radius-input);\n    cursor: pointer;\n  }\n\n  .option:hover,\n  .option.active {\n    background: var(--color-dark-22);\n  }\n\n  .option.selected {\n    color: var(--text-body);\n    font-weight: 600;\n    background: var(--color-dark-23);\n  }\n\n  .option.disabled {\n    opacity: 0.5;\n    pointer-events: none;\n  }\n\n  .empty {\n    padding: var(--padding-expand-item);\n    color: var(--text-muted);\n    font: var(--font-normal-small);\n    pointer-events: none;\n  }\n`;\n"],"names":["optionLabel","option","filterOptions","options","query","needle","nextEnabledIndex","from","direction","step","index","firstEnabledIndex","lastEnabledIndex","listboxStyles","css"],"mappings":";AAkBO,SAASA,EAAYC,GAA0B;AACpD,SAAOA,EAAO,SAAS,OAAOA,EAAO,EAAE;AACzC;AAGO,SAASC,EAAcC,GAA8BC,GAAoC;AAC9F,QAAMC,IAASD,EAAM,KAAA,EAAO,YAAA;AAC5B,SAAKC,IACEF,EAAQ,OAAO,CAACF,MAAWD,EAAYC,CAAM,EAAE,YAAA,EAAc,SAASI,CAAM,CAAC,IADhEF;AAEtB;AAOO,SAASG,EACdH,GACAI,GACAC,GACQ;AACR,MAAIL,EAAQ,WAAW,EAAG,QAAO;AAEjC,WAASM,IAAO,GAAGA,KAAQN,EAAQ,QAAQM,KAAQ,GAAG;AACpD,UAAMC,KAASH,IAAOC,IAAYC,IAAON,EAAQ,SAASM,KAAQN,EAAQ;AAC1E,QAAI,CAACA,EAAQO,CAAK,GAAG,SAAU,QAAOA;AAAA,EACxC;AACA,SAAO;AACT;AAGO,SAASC,EAAkBR,GAAsC;AACtE,SAAOA,EAAQ,UAAU,CAACF,MAAW,CAACA,EAAO,QAAQ;AACvD;AAGO,SAASW,EAAiBT,GAAsC;AACrE,WAASO,IAAQP,EAAQ,SAAS,GAAGO,KAAS,GAAGA,KAAS;AACxD,QAAI,CAACP,EAAQO,CAAK,GAAG,SAAU,QAAOA;AAExC,SAAO;AACT;AAUO,MAAMG,IAAgBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"listbox-llcUu_V-.js","sources":["../../src/internal/listbox.ts"],"sourcesContent":["import { css } from 'lit';\n\n/**\n * Shared pieces of the two option-list controls, `<kt-select>` and\n * `<kt-input-menu>`.\n *\n * They differ in how an option is chosen — pick from a list, or filter by\n * typing — but the popup, the option rows and the keyboard model are the same,\n * and having them drift apart is how a design system stops looking like one.\n */\n\nexport interface KtOption {\n  readonly id: string | number;\n  readonly label?: string;\n  readonly disabled?: boolean;\n}\n\n/** The text to display for an option: its label, or its id as a fallback. */\nexport function optionLabel(option: KtOption): string {\n  return option.label ?? String(option.id);\n}\n\n/** Case-insensitive substring match on the visible label. */\nexport function filterOptions(options: readonly KtOption[], query: string): readonly KtOption[] {\n  const needle = query.trim().toLowerCase();\n  if (!needle) return options;\n  return options.filter((option) => optionLabel(option).toLowerCase().includes(needle));\n}\n\n/**\n * The next selectable index in `direction`, skipping disabled options and\n * wrapping at both ends. Returns -1 when every option is disabled, so a caller\n * never lands the active descendant on something that cannot be chosen.\n */\nexport function nextEnabledIndex(\n  options: readonly KtOption[],\n  from: number,\n  direction: 1 | -1,\n): number {\n  if (options.length === 0) return -1;\n\n  for (let step = 1; step <= options.length; step += 1) {\n    const index = (from + direction * step + options.length * step) % options.length;\n    if (!options[index]?.disabled) return index;\n  }\n  return -1;\n}\n\n/** The first selectable index, for opening a list with nothing selected. */\nexport function firstEnabledIndex(options: readonly KtOption[]): number {\n  return options.findIndex((option) => !option.disabled);\n}\n\n/** The last selectable index, for End. */\nexport function lastEnabledIndex(options: readonly KtOption[]): number {\n  for (let index = options.length - 1; index >= 0; index -= 1) {\n    if (!options[index]?.disabled) return index;\n  }\n  return -1;\n}\n\n/**\n * The popup and option-row styles.\n *\n * The panel animates through opacity and transform while staying in the layout\n * as `visibility: hidden`, rather than being added and removed: a popup that\n * unmounts cannot animate out, and one that only sets `display: none` cannot\n * animate at all.\n */\nexport const listboxStyles = css`\n  /* Placed from the field by FloatingController, which also sets its width. */\n  .popup {\n    display: flex;\n    flex-direction: column;\n    gap: var(--gap-element);\n    box-sizing: border-box;\n    max-height: 300px;\n    margin: 0;\n    padding: var(--padding-expand);\n    overflow: auto;\n    list-style: none;\n    background: var(--color-dark-20);\n    border-radius: var(--radius-input);\n    scrollbar-width: thin;\n\n    visibility: hidden;\n    opacity: 0;\n    transform: translateY(-6px) scaleY(0.98);\n    transform-origin: top left;\n    pointer-events: none;\n    transition:\n      opacity var(--duration-fast) var(--easing-standard),\n      transform var(--duration-fast) var(--easing-standard);\n  }\n\n  .popup.open {\n    visibility: visible;\n    opacity: 1;\n    transform: translateY(0) scaleY(1);\n    pointer-events: auto;\n  }\n\n  /* Opened above the field, for want of room below: it grows upwards. */\n  .popup.top {\n    transform-origin: bottom left;\n  }\n  .popup.top:not(.open) {\n    transform: translateY(6px) scaleY(0.98);\n  }\n\n  .option {\n    padding: var(--padding-expand-item);\n    color: var(--text-muted);\n    font: var(--font-input);\n    border-radius: var(--radius-input);\n    cursor: pointer;\n  }\n\n  .option:hover,\n  .option.active {\n    background: var(--color-dark-22);\n  }\n\n  .option.selected {\n    color: var(--text-body);\n    font-weight: 600;\n    background: var(--color-dark-23);\n  }\n\n  .option.disabled {\n    opacity: 0.5;\n    pointer-events: none;\n  }\n\n  .empty {\n    padding: var(--padding-expand-item);\n    color: var(--text-muted);\n    font: var(--font-normal-small);\n    pointer-events: none;\n  }\n`;\n"],"names":["optionLabel","option","filterOptions","options","query","needle","nextEnabledIndex","from","direction","step","index","firstEnabledIndex","lastEnabledIndex","listboxStyles","css"],"mappings":";AAkBO,SAASA,EAAYC,GAA0B;AACpD,SAAOA,EAAO,SAAS,OAAOA,EAAO,EAAE;AACzC;AAGO,SAASC,EAAcC,GAA8BC,GAAoC;AAC9F,QAAMC,IAASD,EAAM,KAAA,EAAO,YAAA;AAC5B,SAAKC,IACEF,EAAQ,OAAO,CAACF,MAAWD,EAAYC,CAAM,EAAE,YAAA,EAAc,SAASI,CAAM,CAAC,IADhEF;AAEtB;AAOO,SAASG,EACdH,GACAI,GACAC,GACQ;AACR,MAAIL,EAAQ,WAAW,EAAG,QAAO;AAEjC,WAASM,IAAO,GAAGA,KAAQN,EAAQ,QAAQM,KAAQ,GAAG;AACpD,UAAMC,KAASH,IAAOC,IAAYC,IAAON,EAAQ,SAASM,KAAQN,EAAQ;AAC1E,QAAI,CAACA,EAAQO,CAAK,GAAG,SAAU,QAAOA;AAAA,EACxC;AACA,SAAO;AACT;AAGO,SAASC,EAAkBR,GAAsC;AACtE,SAAOA,EAAQ,UAAU,CAACF,MAAW,CAACA,EAAO,QAAQ;AACvD;AAGO,SAASW,EAAiBT,GAAsC;AACrE,WAASO,IAAQP,EAAQ,SAAS,GAAGO,KAAS,GAAGA,KAAS;AACxD,QAAI,CAACP,EAAQO,CAAK,GAAG,SAAU,QAAOA;AAExC,SAAO;AACT;AAUO,MAAMG,IAAgBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/chunks/locale-C5xLkGx5.js

@@ -0,0 +1,14 @@
+function o(t) {
+  return t || document.documentElement.lang || navigator.language || "en";
+}
+const r = /* @__PURE__ */ new Map();
+function m(t, n) {
+  const a = `${t}|${JSON.stringify(n)}`;
+  let e = r.get(a);
+  return e || (e = new Intl.DateTimeFormat(t, n), r.set(a, e)), e;
+}
+export {
+  m as d,
+  o as r
+};
+//# sourceMappingURL=locale-C5xLkGx5.js.map

package/dist/chunks/locale-C5xLkGx5.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"locale-C5xLkGx5.js","sources":["../../src/internal/locale.ts"],"sourcesContent":["/**\n * The locale an element formats and sorts in: its own `locale` when set, else\n * the page's `<html lang>`, else the browser's language.\n *\n * The page's language comes before the browser's because it is what the text\n * around the element is written in — a French page read on an English browser\n * should still file \"Élodie\" the French way.\n */\nexport function resolveLocale(own: string): string {\n  return own || document.documentElement.lang || navigator.language || 'en';\n}\n\nconst formatters = new Map<string, Intl.DateTimeFormat>();\n\n/**\n * A date format for `locale` and `options`, made once and reused. Building an\n * `Intl.DateTimeFormat` is slow next to using one, and a calendar formats\n * every day it shows on every render — a hundred of them for two arrow keys.\n */\nexport function dateFormat(\n  locale: string,\n  options: Intl.DateTimeFormatOptions,\n): Intl.DateTimeFormat {\n  const key = `${locale}|${JSON.stringify(options)}`;\n  let format = formatters.get(key);\n  if (!format) {\n    format = new Intl.DateTimeFormat(locale, options);\n    formatters.set(key, format);\n  }\n  return format;\n}\n"],"names":["resolveLocale","own","formatters","dateFormat","locale","options","key","format"],"mappings":"AAQO,SAASA,EAAcC,GAAqB;AACjD,SAAOA,KAAO,SAAS,gBAAgB,QAAQ,UAAU,YAAY;AACvE;AAEA,MAAMC,wBAAiB,IAAA;AAOhB,SAASC,EACdC,GACAC,GACqB;AACrB,QAAMC,IAAM,GAAGF,CAAM,IAAI,KAAK,UAAUC,CAAO,CAAC;AAChD,MAAIE,IAASL,EAAW,IAAII,CAAG;AAC/B,SAAKC,MACHA,IAAS,IAAI,KAAK,eAAeH,GAAQC,CAAO,GAChDH,EAAW,IAAII,GAAKC,CAAM,IAErBA;AACT;"}

package/dist/chunks/position-Cx_ZH5zh.js

@@ -0,0 +1,39 @@
+function l(t, e, i, o) {
+  return t === "start" ? e : t === "end" ? e + i - o : e + i / 2 - o / 2;
+}
+const c = 6, s = 8, m = { top: "bottom", bottom: "top", left: "right", right: "left" }, p = (t, e, i) => Math.min(Math.max(t, e), i);
+function A(t, e, i, o, g = "center") {
+  const f = (h) => {
+    switch (h) {
+      case "top":
+        return t.top - c - e.height;
+      case "bottom":
+        return t.top + t.height + c;
+      case "left":
+        return t.left - c - e.width;
+      case "right":
+        return t.left + t.width + c;
+    }
+  }, r = (h) => {
+    const u = f(h), w = h === "top" || h === "bottom" ? e.height : e.width, a = h === "top" || h === "bottom" ? i.height : i.width;
+    return u >= s && u + w <= a - s;
+  }, n = !r(o) && r(m[o]) ? m[o] : o;
+  if (n === "top" || n === "bottom") {
+    const h = l(g, t.left, t.width, e.width);
+    return {
+      x: p(h, s, i.width - s - e.width),
+      y: f(n),
+      placement: n
+    };
+  }
+  const d = l(g, t.top, t.height, e.height);
+  return {
+    x: f(n),
+    y: p(d, s, i.height - s - e.height),
+    placement: n
+  };
+}
+export {
+  A as p
+};
+//# sourceMappingURL=position-Cx_ZH5zh.js.map

package/dist/chunks/position-Cx_ZH5zh.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"position-Cx_ZH5zh.js","sources":["../../src/internal/position.ts"],"sourcesContent":["/**\n * Placing a floating box — a tooltip bubble — beside the element it belongs\n * to, in viewport coordinates, so it can be drawn with `position: fixed` in\n * the top layer where no ancestor's `overflow` can clip it.\n */\n\nexport type Side = 'top' | 'bottom' | 'left' | 'right';\n\n/** Along its side: centred on the anchor, or flush with its start or end — a menu. */\nexport type Align = 'center' | 'start' | 'end';\n\n/** Where a box of `size` begins along an anchor edge from `start` of `length`. */\nfunction alignAlong(align: Align, start: number, length: number, size: number): number {\n  if (align === 'start') return start;\n  if (align === 'end') return start + length - size;\n  return start + length / 2 - size / 2;\n}\n\nexport interface Box {\n  readonly width: number;\n  readonly height: number;\n}\n\nexport interface Anchor extends Box {\n  readonly left: number;\n  readonly top: number;\n}\n\n/** Between the anchor and the box. */\nconst GAP = 6;\n/** Kept clear between the box and the edge of the viewport. */\nconst MARGIN = 8;\n\nconst OPPOSITE: Record<Side, Side> = { top: 'bottom', bottom: 'top', left: 'right', right: 'left' };\n\nconst clamp = (value: number, min: number, max: number) => Math.min(Math.max(value, min), max);\n\n/**\n * Where to draw `box` on the `side` asked for, or on the opposite side when\n * the one asked for would run off the screen and the other would not. Along\n * its side, the box is centred on the anchor or flush with its start or end, then\n * slid back inside the screen.\n */\nexport function placeFloating(\n  anchor: Anchor,\n  box: Box,\n  viewport: Box,\n  side: Side,\n  align: Align = 'center',\n): { x: number; y: number; placement: Side } {\n  const offset = (on: Side): number => {\n    switch (on) {\n      case 'top':\n        return anchor.top - GAP - box.height;\n      case 'bottom':\n        return anchor.top + anchor.height + GAP;\n      case 'left':\n        return anchor.left - GAP - box.width;\n      case 'right':\n        return anchor.left + anchor.width + GAP;\n    }\n  };\n  const fits = (on: Side): boolean => {\n    const at = offset(on);\n    const size = on === 'top' || on === 'bottom' ? box.height : box.width;\n    const room = on === 'top' || on === 'bottom' ? viewport.height : viewport.width;\n    return at >= MARGIN && at + size <= room - MARGIN;\n  };\n\n  const placement = !fits(side) && fits(OPPOSITE[side]) ? OPPOSITE[side] : side;\n\n  if (placement === 'top' || placement === 'bottom') {\n    const along = alignAlong(align, anchor.left, anchor.width, box.width);\n    return {\n      x: clamp(along, MARGIN, viewport.width - MARGIN - box.width),\n      y: offset(placement),\n      placement,\n    };\n  }\n  const along = alignAlong(align, anchor.top, anchor.height, box.height);\n  return {\n    x: offset(placement),\n    y: clamp(along, MARGIN, viewport.height - MARGIN - box.height),\n    placement,\n  };\n}\n"],"names":["alignAlong","align","start","length","size","GAP","MARGIN","OPPOSITE","clamp","value","min","max","placeFloating","anchor","box","viewport","side","offset","on","fits","at","room","placement","along"],"mappings":"AAYA,SAASA,EAAWC,GAAcC,GAAeC,GAAgBC,GAAsB;AACrF,SAAIH,MAAU,UAAgBC,IAC1BD,MAAU,QAAcC,IAAQC,IAASC,IACtCF,IAAQC,IAAS,IAAIC,IAAO;AACrC;AAaA,MAAMC,IAAM,GAENC,IAAS,GAETC,IAA+B,EAAE,KAAK,UAAU,QAAQ,OAAO,MAAM,SAAS,OAAO,OAAA,GAErFC,IAAQ,CAACC,GAAeC,GAAaC,MAAgB,KAAK,IAAI,KAAK,IAAIF,GAAOC,CAAG,GAAGC,CAAG;AAQtF,SAASC,EACdC,GACAC,GACAC,GACAC,GACAf,IAAe,UAC4B;AAC3C,QAAMgB,IAAS,CAACC,MAAqB;AACnC,YAAQA,GAAA;AAAA,MACN,KAAK;AACH,eAAOL,EAAO,MAAMR,IAAMS,EAAI;AAAA,MAChC,KAAK;AACH,eAAOD,EAAO,MAAMA,EAAO,SAASR;AAAA,MACtC,KAAK;AACH,eAAOQ,EAAO,OAAOR,IAAMS,EAAI;AAAA,MACjC,KAAK;AACH,eAAOD,EAAO,OAAOA,EAAO,QAAQR;AAAA,IAAA;AAAA,EAE1C,GACMc,IAAO,CAACD,MAAsB;AAClC,UAAME,IAAKH,EAAOC,CAAE,GACdd,IAAOc,MAAO,SAASA,MAAO,WAAWJ,EAAI,SAASA,EAAI,OAC1DO,IAAOH,MAAO,SAASA,MAAO,WAAWH,EAAS,SAASA,EAAS;AAC1E,WAAOK,KAAMd,KAAUc,IAAKhB,KAAQiB,IAAOf;AAAA,EAC7C,GAEMgB,IAAY,CAACH,EAAKH,CAAI,KAAKG,EAAKZ,EAASS,CAAI,CAAC,IAAIT,EAASS,CAAI,IAAIA;AAEzE,MAAIM,MAAc,SAASA,MAAc,UAAU;AACjD,UAAMC,IAAQvB,EAAWC,GAAOY,EAAO,MAAMA,EAAO,OAAOC,EAAI,KAAK;AACpE,WAAO;AAAA,MACL,GAAGN,EAAMe,GAAOjB,GAAQS,EAAS,QAAQT,IAASQ,EAAI,KAAK;AAAA,MAC3D,GAAGG,EAAOK,CAAS;AAAA,MACnB,WAAAA;AAAA,IAAA;AAAA,EAEJ;AACA,QAAMC,IAAQvB,EAAWC,GAAOY,EAAO,KAAKA,EAAO,QAAQC,EAAI,MAAM;AACrE,SAAO;AAAA,IACL,GAAGG,EAAOK,CAAS;AAAA,IACnB,GAAGd,EAAMe,GAAOjB,GAAQS,EAAS,SAAST,IAASQ,EAAI,MAAM;AAAA,IAC7D,WAAAQ;AAAA,EAAA;AAEJ;"}

package/dist/components/core/kt-avatar/kt-avatar.js

@@ -1,8 +1,8 @@
 import { css as p, nothing as f, html as n } from "lit";
 import { state as v, property as o } from "lit/decorators.js";
 import { classMap as c } from "lit/directives/class-map.js";
-import { K as d, d as g } from "../../../chunks/kt-element-E-tfJpGQ.js";
-import { s as m } from "../../../chunks/index-DSSLJirw.js";
+import { K as d, d as g } from "../../../chunks/kt-element-Djx2JcGl.js";
+import { s as m } from "../../../chunks/index-STEEvEP7.js";
 import "../kt-icon/kt-icon.js";
 var y = Object.defineProperty, s = (a, e, t, k) => {
   for (var i = void 0, l = a.length - 1, h; l >= 0; l--)

package/dist/components/core/kt-badge/kt-badge.js

@@ -2,9 +2,9 @@ import { css as h, nothing as n, html as l } from "lit";
 import { property as e } from "lit/decorators.js";
 import { classMap as b } from "lit/directives/class-map.js";
 import { styleMap as m } from "lit/directives/style-map.js";
-import { K as p, d as v } from "../../../chunks/kt-element-E-tfJpGQ.js";
-import { e as u } from "../../../chunks/events-Bjl5Zmmq.js";
-import { s as g } from "../../../chunks/index-DSSLJirw.js";
+import { K as p, d as v } from "../../../chunks/kt-element-Djx2JcGl.js";
+import { e as u } from "../../../chunks/events-r51msXNf.js";
+import { s as g } from "../../../chunks/index-STEEvEP7.js";
 import "../kt-icon/kt-icon.js";
 var f = Object.defineProperty, t = (s, r, i, y) => {
   for (var a = void 0, c = s.length - 1, d; c >= 0; c--)

package/dist/components/core/kt-button/kt-button.js

@@ -1,7 +1,7 @@
 import { css as h, html as d, nothing as i } from "lit";
 import { property as e } from "lit/decorators.js";
 import { classMap as p } from "lit/directives/class-map.js";
-import { K as u, d as v } from "../../../chunks/kt-element-E-tfJpGQ.js";
+import { K as u, d as v } from "../../../chunks/kt-element-Djx2JcGl.js";
 import "../kt-icon/kt-icon.js";
 var g = Object.defineProperty, a = (l, t, o, y) => {
   for (var n = void 0, c = l.length - 1, s; c >= 0; c--)

package/dist/components/core/kt-card/kt-card.js

@@ -2,8 +2,8 @@ import { css as f, nothing as r, html as d } from "lit";
 import { state as g, property as a } from "lit/decorators.js";
 import { classMap as n } from "lit/directives/class-map.js";
 import { styleMap as u } from "lit/directives/style-map.js";
-import { K as m, d as v } from "../../../chunks/kt-element-E-tfJpGQ.js";
-import { e as b } from "../../../chunks/events-Bjl5Zmmq.js";
+import { K as m, d as v } from "../../../chunks/kt-element-Djx2JcGl.js";
+import { e as b } from "../../../chunks/events-r51msXNf.js";
 import { h as p } from "../../../chunks/slots-BPbIdxAJ.js";
 var y = Object.defineProperty, i = (s, e, c, k) => {
   for (var o = void 0, l = s.length - 1, h; l >= 0; l--)

package/dist/components/core/kt-code/kt-code.js

@@ -1,8 +1,8 @@
 import { css as b, nothing as s, html as d } from "lit";
 import { state as m, property as c } from "lit/decorators.js";
-import { K as h, d as v } from "../../../chunks/kt-element-E-tfJpGQ.js";
-import { e as g } from "../../../chunks/events-Bjl5Zmmq.js";
-import { s as r } from "../../../chunks/index-DSSLJirw.js";
+import { K as h, d as v } from "../../../chunks/kt-element-Djx2JcGl.js";
+import { e as g } from "../../../chunks/events-r51msXNf.js";
+import { s as r } from "../../../chunks/index-STEEvEP7.js";
 import "../kt-icon/kt-icon.js";
 var y = Object.defineProperty, a = (p, o, n, x) => {
   for (var e = void 0, i = p.length - 1, l; i >= 0; i--)

package/dist/components/core/kt-icon/kt-icon.js

@@ -1,7 +1,7 @@
 import { css as f, html as c, nothing as l } from "lit";
 import { property as n } from "lit/decorators.js";
-import { K as m, d as u } from "../../../chunks/kt-element-E-tfJpGQ.js";
-import { g as v } from "../../../chunks/defaults-BwgjMcww.js";
+import { K as m, d as u } from "../../../chunks/kt-element-Djx2JcGl.js";
+import { g as v } from "../../../chunks/defaults-CFrjqae2.js";
 var w = Object.defineProperty, o = (i, e, r, h) => {
   for (var t = void 0, a = i.length - 1, d; a >= 0; a--)
     (d = i[a]) && (t = d(e, r, t) || t);

package/dist/components/core/kt-kbd/kt-kbd.js

@@ -1,6 +1,6 @@
 import { css as c, html as i } from "lit";
 import { property as p } from "lit/decorators.js";
-import { K as l, d as m } from "../../../chunks/kt-element-E-tfJpGQ.js";
+import { K as l, d as m } from "../../../chunks/kt-element-Djx2JcGl.js";
 var f = Object.defineProperty, d = (a, t, e, u) => {
   for (var r = void 0, s = a.length - 1, o; s >= 0; s--)
     (o = a[s]) && (r = o(t, e, r) || r);

package/dist/components/core/kt-split-button/kt-split-button.js

@@ -1,10 +1,10 @@
 import { css as g, nothing as p, html as a } from "lit";
 import { query as f, state as y, property as o } from "lit/decorators.js";
 import { classMap as w } from "lit/directives/class-map.js";
-import { K as h, d as x } from "../../../chunks/kt-element-E-tfJpGQ.js";
-import { e as k } from "../../../chunks/events-Bjl5Zmmq.js";
-import { f as m, o as $, l as I, n as u } from "../../../chunks/listbox-Sm3nvsC6.js";
-import { s as v } from "../../../chunks/index-DSSLJirw.js";
+import { K as h, d as x } from "../../../chunks/kt-element-Djx2JcGl.js";
+import { e as k } from "../../../chunks/events-r51msXNf.js";
+import { f as m, o as $, l as I, n as u } from "../../../chunks/listbox-llcUu_V-.js";
+import { s as v } from "../../../chunks/index-STEEvEP7.js";
 import "../kt-button/kt-button.js";
 import "../kt-icon/kt-icon.js";
 import "../../overlays/kt-dropdown/kt-dropdown.js";

package/dist/components/data/kt-chart/kt-chart.js

@@ -1,9 +1,9 @@
 import { svg as b, nothing as A, css as vt, html as G } from "lit";
 import { query as kt, state as et, property as B } from "lit/decorators.js";
 import { classMap as wt } from "lit/directives/class-map.js";
-import { K as nt, d as Mt } from "../../../chunks/kt-element-E-tfJpGQ.js";
-import { u as At, e as lt } from "../../../chunks/events-Bjl5Zmmq.js";
-import { s as E } from "../../../chunks/index-DSSLJirw.js";
+import { K as nt, d as Mt } from "../../../chunks/kt-element-Djx2JcGl.js";
+import { u as At, e as lt } from "../../../chunks/events-r51msXNf.js";
+import { s as E } from "../../../chunks/index-STEEvEP7.js";
 function St(s) {
   const t = Math.floor(Math.log10(s)), e = s / 10 ** t;
   return (e < 1.5 ? 1 : e < 3 ? 2 : e < 7 ? 5 : 10) * 10 ** t;

package/dist/components/data/kt-meter/kt-meter.js

@@ -1,6 +1,6 @@
 import { css as m, html as r, nothing as o } from "lit";
 import { property as i } from "lit/decorators.js";
-import { K as u, d as c } from "../../../chunks/kt-element-E-tfJpGQ.js";
+import { K as u, d as c } from "../../../chunks/kt-element-Djx2JcGl.js";
 var g = Object.defineProperty, n = (d, t, e, s) => {
   for (var a = void 0, p = d.length - 1, h; p >= 0; p--)
     (h = d[p]) && (a = h(t, e, a) || a);

package/dist/components/data/kt-pagination/kt-pagination.js

@@ -1,8 +1,8 @@
 import { css as h, html as m } from "lit";
 import { property as n } from "lit/decorators.js";
-import { K as g, d as c } from "../../../chunks/kt-element-E-tfJpGQ.js";
-import { e as u } from "../../../chunks/events-Bjl5Zmmq.js";
-import { s as i } from "../../../chunks/index-DSSLJirw.js";
+import { K as g, d as c } from "../../../chunks/kt-element-Djx2JcGl.js";
+import { e as u } from "../../../chunks/events-r51msXNf.js";
+import { s as i } from "../../../chunks/index-STEEvEP7.js";
 import "../../core/kt-button/kt-button.js";
 var d = Object.defineProperty, p = (r, a, t, f) => {
   for (var e = void 0, o = r.length - 1, l; o >= 0; o--)

package/dist/components/data/kt-stat/kt-stat.js

@@ -1,6 +1,6 @@
 import { css as h, nothing as l, html as r } from "lit";
 import { property as e } from "lit/decorators.js";
-import { K as c, d as f } from "../../../chunks/kt-element-E-tfJpGQ.js";
+import { K as c, d as f } from "../../../chunks/kt-element-Djx2JcGl.js";
 import "../../core/kt-icon/kt-icon.js";
 import "../../core/kt-badge/kt-badge.js";
 import "../../feedback/kt-skeleton/kt-skeleton.js";

package/dist/components/data/kt-table/kt-table.d.ts

@@ -1,5 +1,6 @@
-import { type TemplateResult } from 'lit';
+import { type PropertyValues, type TemplateResult } from 'lit';
 import { KtElement } from '#internal/kt-element';
+import '../../core/kt-icon/kt-icon.js';
 import '../kt-pagination/kt-pagination.js';
 export type KtSortDirection = 'asc' | 'desc' | null;
 export type KtTableRow = Record<string, unknown>;
@@ -45,7 +46,32 @@ export type KtCellRenderer = (row: KtTableRow, column: KtTableColumn) => unknown
  */
 export declare class KtTable extends KtElement {
     static styles: import("lit").CSSResultGroup[];
-    private page;
+    /** The page on screen, from 1. Set it to open on another page. */
+    page: number;
+    /**
+     * For data sorted and paged on a server: `data` is the current page, shown
+     * as given. Headers and the pager still update the state and fire their
+     * events, and the application loads what they ask for.
+     */
+    manual: boolean;
+    /**
+     * Renders only the rows in view, for thousands of rows without paging. The
+     * table scrolls inside its own box: give it a height (`kt-table { height:
+     * 480px }`). Every row must be the same height — the first one rendered is
+     * measured. A page size takes precedence.
+     */
+    virtual: boolean;
+    /** How far the scroller is scrolled. Not `scrollTop`, which the host already has. */
+    private scrollOffset;
+    /** The scroller's height, and the header's inside it, in px. */
+    private viewportHeight;
+    private headerHeight;
+    /** A body row's height, in px; 0 until one has been measured. */
+    private rowHeight;
+    private resizeObserver;
+    private observed;
+    /** In manual mode, how many rows the server holds — what the pager counts. */
+    totalRows: number;
     columns: readonly KtTableColumn[];
     data: readonly KtTableRow[];
     selectable: boolean;
@@ -64,8 +90,23 @@ export declare class KtTable extends KtElement {
     loadingText: string | undefined;
     /** Accessible name for the table. */
     label: string;
-    /** The rows after sorting, before paging. */
+    /**
+     * BCP 47 locale text is sorted in. Empty means the page's `<html lang>`,
+     * then the browser's language.
+     */
+    locale: string;
+    /** The last sort, and what it was computed from. */
+    private sortCache;
+    /**
+     * The rows after sorting, before paging.
+     *
+     * Sorted once per change of `data`, `sortKey`, `sortDirection` or locale, not on
+     * every render: hovering a row or ticking a box re-renders the table, and
+     * re-sorting a few thousand rows each time is what made that lag. Assign a
+     * new array to `data` rather than changing it in place.
+     */
     get sortedRows(): readonly KtTableRow[];
+    private sort;
     get totalPages(): number;
     /** The rows actually on screen. */
     get visibleRows(): readonly KtTableRow[];
@@ -80,6 +121,13 @@ export declare class KtTable extends KtElement {
     private toggleAll;
     /** The selected rows themselves, not just their identities. */
     get selectedRows(): readonly KtTableRow[];
+    /** Virtual rendering, unless a page size pages the rows instead. */
+    private get isVirtual();
+    private onScroll;
+    updated(changed: PropertyValues): void;
+    disconnectedCallback(): void;
+    /** Follows the scroller's height, which the page can change at any time. */
+    private observe;
     private onPageChange;
     /**
      * The aria-sort value for a column.
@@ -90,6 +138,8 @@ export declare class KtTable extends KtElement {
     private sortStateFor;
     private renderHeaderCell;
     private renderBody;
+    /** `index` counts from the first row of the data, not of the rows rendered. */
+    private renderRow;
     render(): TemplateResult;
 }
 declare global {