@tcn/ui 0.0.1

package/dist/inputs/date_picker/date_picker_input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date_picker_input.js","sources":["../../../src/inputs/date_picker/date_picker_input.tsx"],"sourcesContent":["import React, { useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { Hierarchy } from '../../utils/index.js';\nimport { ZStack } from '../../stacks/z_stack.js';\nimport { Popper } from '../../overlay/popper/popper.js';\nimport classNames from 'classnames';\nimport { HTMLAttributes } from 'react';\nimport { Button } from '../../actions/index.js';\nimport { DatePicker } from './date_picker.js';\nimport { DatePickerPresenter } from './date_picker_presenter.js';\nimport { FocusRedirect } from '../../utils/index.js';\nimport styles from './date_picker_input.module.css';\n\nexport interface DatePickerInputProps\n  extends Omit<HTMLAttributes<HTMLButtonElement>, 'onChange' | 'onError'> {\n  value?: Date | null;\n  disabled?: boolean;\n  onChange?: (date: Date | null) => void;\n  onError?: (error: string | null) => void;\n  width?: string;\n  maxWidth?: string;\n  minWidth?: string;\n  showTime?: boolean;\n  timeIntervalInMinutes?: number;\n  disabledDates?: Date[] | undefined;\n  countryCode?: string;\n  renderActions?: (datePickerPresenter: DatePickerPresenter) => React.ReactNode;\n  min?: Date;\n  max?: Date;\n  hierarchy?: Hierarchy;\n  selectDateMessage?: string;\n  onTimeSelected?: (hour: number, minutes: number, seconds: number) => void;\n}\n\nexport const DatePickerInput = React.forwardRef<HTMLButtonElement, DatePickerInputProps>(\n  (\n    {\n      value = new Date(),\n      onChange,\n      onError,\n      min = new Date('01/01/1924'),\n      max = new Date('01/01/2124'),\n      disabled,\n      width = '100%',\n      maxWidth,\n      minWidth,\n      showTime = false,\n      timeIntervalInMinutes = 15,\n      hierarchy = 'secondary',\n      disabledDates,\n      selectDateMessage = 'Select Date',\n      countryCode,\n      renderActions,\n      onTimeSelected,\n      ...props\n    }: DatePickerInputProps,\n    ref: React.Ref<HTMLButtonElement>\n  ) => {\n    const [anchorElement, setAnchorElement] = useState<HTMLButtonElement | null>(null);\n    const isOpen = anchorElement != null;\n    const pickerRef = useRef<HTMLDivElement | null>(null);\n\n    const isException = useCallback((target: HTMLElement) => {\n      return target.closest('.suggestion-list') != null;\n    }, []);\n\n    const formatter = useMemo(() => {\n      const formatOptions: Intl.DateTimeFormatOptions = {\n        year: 'numeric',\n        month: 'short',\n        day: 'numeric',\n      };\n\n      if (showTime) {\n        formatOptions.hour = 'numeric';\n        formatOptions.minute = '2-digit';\n        formatOptions.hour12 = true;\n      }\n\n      return new Intl.DateTimeFormat(countryCode, formatOptions);\n    }, [countryCode, showTime]);\n\n    const formattedDate = value != null ? formatter.format(value) : selectDateMessage;\n\n    function openPicker(e: React.MouseEvent<HTMLButtonElement>) {\n      setAnchorElement(e.currentTarget);\n    }\n\n    function closePicker() {\n      setAnchorElement(null);\n    }\n\n    useLayoutEffect(() => {\n      requestAnimationFrame(() => {\n        if (anchorElement != null) {\n          pickerRef.current && pickerRef.current.focus();\n        }\n      });\n    }, [anchorElement]);\n\n    function processKeyInput(event: React.KeyboardEvent) {\n      if (event.key === 'Escape') {\n        closePicker();\n      }\n    }\n\n    function handleRedirect() {\n      const picker = pickerRef.current;\n\n      if (picker != null) {\n        picker.focus();\n      }\n    }\n\n    function dateSelected(date: Date | null) {\n      onChange?.(date);\n      !showTime && closePicker();\n    }\n\n    function timeSelected(hour: number, minutes: number, seconds: number) {\n      onTimeSelected?.(hour, minutes, seconds);\n      closePicker();\n    }\n\n    return (\n      <>\n        <Button\n          ref={ref}\n          className={classNames(styles.button, 'select')}\n          hAlign=\"start\"\n          disabled={disabled}\n          hierarchy={hierarchy}\n          onClick={openPicker}\n          width={width}\n          maxWidth={maxWidth}\n          {...props}\n        >\n          <span className=\"ellipsis\">{formattedDate}</span>\n        </Button>\n        <Popper\n          anchorElement={anchorElement}\n          disableClickAway\n          veil\n          onVeilClick={closePicker}\n          onClose={closePicker}\n          verticalAnchor=\"bottom\"\n          horizontalAnchor=\"start\"\n          verticalOrigin=\"top\"\n          horizontalOrigin=\"start\"\n          open={isOpen}\n          isClickAwayException={isException}\n          isScrollAwayException={isException}\n          restoreFocus\n        >\n          <ZStack\n            padding=\"8px\"\n            className={classNames(styles.popover, 'date-picker-popover')}\n            onKeyDown={processKeyInput}\n          >\n            <DatePicker\n              ref={pickerRef}\n              value={value}\n              onChange={dateSelected}\n              min={min}\n              max={max}\n              showTime={showTime}\n              onError={onError}\n              disabled={disabled}\n              disabledDates={disabledDates}\n              countryCode={countryCode}\n              renderActions={renderActions}\n              onTimeSelected={timeSelected}\n              timeIntervalInMinutes={timeIntervalInMinutes}\n            />\n            <FocusRedirect onRedirect={handleRedirect} />\n          </ZStack>\n        </Popper>\n      </>\n    );\n  }\n);\n"],"names":["DatePickerInput","React","value","onChange","onError","min","max","disabled","width","maxWidth","minWidth","showTime","timeIntervalInMinutes","hierarchy","disabledDates","selectDateMessage","countryCode","renderActions","onTimeSelected","props","ref","anchorElement","setAnchorElement","useState","isOpen","pickerRef","useRef","isException","useCallback","target","formatter","useMemo","formatOptions","formattedDate","openPicker","e","closePicker","useLayoutEffect","processKeyInput","event","handleRedirect","picker","dateSelected","date","timeSelected","hour","minutes","seconds","jsxs","Fragment","jsx","Button","classNames","styles","Popper","ZStack","DatePicker","FocusRedirect"],"mappings":"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"}

package/dist/inputs/date_picker/date_picker_presenter.d.ts

@@ -0,0 +1,45 @@
+import { CalendarDate } from '../../utils/calendar/calendar_date.js';
+export interface DatePickerState {
+    error: string | null;
+    visibleYear: number;
+    visibleMonth: number;
+    visibleDates: CalendarDate[];
+    canNavigateToNextMonth: boolean;
+    canNavigateToPreviousMonth: boolean;
+    showTime: boolean;
+    timeIntervalInMinutes: number;
+    minVisibleTimeInMilliseconds: number;
+    maxVisibleTimeInMilliseconds: number;
+    min: Date | null;
+    max: Date | null;
+    disabledDates: Date[];
+}
+export declare class DatePickerPresenter {
+    private _value;
+    private _error;
+    private _state;
+    private _calendarDatesGenerator;
+    private _dateUtility;
+    get stateBroadcast(): import('@tcn/state').IBroadcast<DatePickerState>;
+    get valueBroadcast(): import('@tcn/state').IBroadcast<Date | null>;
+    get errorBroadcast(): import('@tcn/state').IBroadcast<string | null>;
+    constructor(value: Date | null, visibleYear: number, visibleMonth: number, showTime: boolean, timeIntervalInMinutes?: number);
+    initialize(): void;
+    selectDate(date: Date | null): void;
+    private _keepTimeWithinBounds;
+    private _validate;
+    setShowTime(showTime: boolean): void;
+    setVisibleYear(year: number): void;
+    private _updateNavigationAvailability;
+    setVisibleMonth(month: number): void;
+    private _canNavigateToMonth;
+    setMinDate(value: Date | null): void;
+    setMaxDate(value: Date | null): void;
+    setMinVisibleTime(timeInMilliseconds: number): void;
+    setMaxVisibleTime(timeInMilliseconds: number): void;
+    setDisabledDates(dates: Date[]): void;
+    clear(): void;
+    setTime(hours: number, minutes: number, seconds: number): void;
+    setTimeIntervalInMinutes(intervalInMinutes: number): void;
+}
+//# sourceMappingURL=date_picker_presenter.d.ts.map

package/dist/inputs/date_picker/date_picker_presenter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date_picker_presenter.d.ts","sourceRoot":"","sources":["../../../src/inputs/date_picker/date_picker_presenter.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uCAAuC,CAAC;AAG1E,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,YAAY,EAAE,CAAC;IAC7B,sBAAsB,EAAE,OAAO,CAAC;IAChC,0BAA0B,EAAE,OAAO,CAAC;IACpC,QAAQ,EAAE,OAAO,CAAC;IAClB,qBAAqB,EAAE,MAAM,CAAC;IAC9B,4BAA4B,EAAE,MAAM,CAAC;IACrC,4BAA4B,EAAE,MAAM,CAAC;IACrC,GAAG,EAAE,IAAI,GAAG,IAAI,CAAC;IACjB,GAAG,EAAE,IAAI,GAAG,IAAI,CAAC;IACjB,aAAa,EAAE,IAAI,EAAE,CAAC;CACvB;AAKD,qBAAa,mBAAmB;IAC9B,OAAO,CAAC,MAAM,CAAsB;IACpC,OAAO,CAAC,MAAM,CAAwB;IACtC,OAAO,CAAC,MAAM,CAA0B;IACxC,OAAO,CAAC,uBAAuB,CAAyB;IACxD,OAAO,CAAC,YAAY,CAAO;IAE3B,IAAI,cAAc,qDAEjB;IAED,IAAI,cAAc,iDAEjB;IAED,IAAI,cAAc,mDAEjB;gBAGC,KAAK,EAAE,IAAI,GAAG,IAAI,EAClB,WAAW,EAAE,MAAM,EACnB,YAAY,EAAE,MAAM,EACpB,QAAQ,EAAE,OAAO,EACjB,qBAAqB,SAAK;IA0C5B,UAAU;IAIV,UAAU,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI;IAsB5B,OAAO,CAAC,qBAAqB;IA0B7B,OAAO,CAAC,SAAS;IAkCjB,WAAW,CAAC,QAAQ,EAAE,OAAO;IAW7B,cAAc,CAAC,IAAI,EAAE,MAAM;IAyC3B,OAAO,CAAC,6BAA6B;IAerC,eAAe,CAAC,KAAK,EAAE,MAAM;IAyC7B,OAAO,CAAC,mBAAmB;IA4B3B,UAAU,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI;IAmB7B,UAAU,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI;IAoB7B,iBAAiB,CAAC,kBAAkB,EAAE,MAAM;IAe5C,iBAAiB,CAAC,kBAAkB,EAAE,MAAM;IAe5C,gBAAgB,CAAC,KAAK,EAAE,IAAI,EAAE;IAQ9B,KAAK;IAIL,OAAO,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM;IAuBvD,wBAAwB,CAAC,iBAAiB,EAAE,MAAM;CAUnD"}

package/dist/inputs/date_picker/date_picker_presenter.js

@@ -0,0 +1,170 @@
+import { Signal as m } from "@tcn/state";
+import { CalendarDatesGenerator as u } from "../../utils/calendar/calendar_dates_generator.js";
+const h = 0, g = 24 * 1e3 * 60 * 60;
+class M {
+  _value;
+  _error;
+  _state;
+  _calendarDatesGenerator;
+  _dateUtility;
+  get stateBroadcast() {
+    return this._state.broadcast;
+  }
+  get valueBroadcast() {
+    return this._value.broadcast;
+  }
+  get errorBroadcast() {
+    return this._error.broadcast;
+  }
+  constructor(t, e, i, a, n = 15) {
+    const l = /* @__PURE__ */ new Date(), s = t == null ? l.getFullYear() : t.getFullYear(), o = t == null ? l.getMonth() : t.getMonth();
+    this._dateUtility = /* @__PURE__ */ new Date(), this._calendarDatesGenerator = new u(s, o), this._dateUtility.setFullYear(s), this._dateUtility.setMonth(o), this._value = new m(t), this._error = new m(null);
+    const r = {
+      error: null,
+      visibleYear: e,
+      visibleMonth: i,
+      visibleDates: this._calendarDatesGenerator.dates,
+      canNavigateToNextMonth: this._canNavigateToMonth(
+        i + 1,
+        e,
+        null,
+        null
+      ),
+      canNavigateToPreviousMonth: this._canNavigateToMonth(
+        i - 1,
+        e,
+        null,
+        null
+      ),
+      showTime: a,
+      timeIntervalInMinutes: n,
+      minVisibleTimeInMilliseconds: h,
+      maxVisibleTimeInMilliseconds: g,
+      min: null,
+      max: null,
+      disabledDates: []
+    };
+    this._state = new m(r);
+  }
+  initialize() {
+    this._validate(this._value.get(), this._error.get(), this._state.get());
+  }
+  selectDate(t) {
+    t?.getTime() !== this._value.get()?.getTime() && this._value.transform((e) => {
+      if (t == null || e == null)
+        e = t;
+      else {
+        const i = new Date(t);
+        i.setHours(e.getHours(), e.getMinutes(), e.getSeconds()), e = i;
+      }
+      return e && this._keepTimeWithinBounds(e), this._validate(e, this._error.get(), this._state.get()), e;
+    });
+  }
+  _keepTimeWithinBounds(t) {
+    const e = this._state.get(), i = new Date(t);
+    i.setHours(0, 0, 0, 0);
+    const a = t.getTime() - i.getTime();
+    a < e.minVisibleTimeInMilliseconds && (t.setHours(0, 0, 0, 0), t.setTime(t.getTime() + e.minVisibleTimeInMilliseconds)), a > e.maxVisibleTimeInMilliseconds && (t.setHours(0, 0, 0, 0), t.setTime(t.getTime() + e.maxVisibleTimeInMilliseconds)), e.min && t.getTime() < e.min.getTime() && t.setTime(e.min.getTime()), e.max && t.getTime() > e.max.getTime() && t.setTime(e.max.getTime());
+  }
+  _validate(t, e, i) {
+    let a = null;
+    if (t != null) {
+      const n = t.getTime(), l = i.min == null ? -1 / 0 : i.min.getTime(), s = i.max == null ? 1 / 0 : i.max.getTime();
+      (n < l || n >= s) && (a = "Selected date is outside acceptable range."), i.disabledDates.some(
+        (r) => r.getDate() === t.getDate() && r.getMonth() === t.getMonth() && r.getFullYear() === t.getFullYear()
+      ) && (a = "Selected date is disabled.");
+    }
+    a !== e && this._state.transform((n) => (n.error = a, n));
+  }
+  setShowTime(t) {
+    this._state.get().showTime !== t && this._state.transform((e) => (e.showTime = t, e));
+  }
+  setVisibleYear(t) {
+    if (this._state.get().visibleYear === t)
+      return;
+    const e = this._state.get();
+    this._dateUtility.setFullYear(t), this._dateUtility.setDate(1), this._dateUtility.setMonth(e.visibleMonth), t = this._dateUtility.getFullYear();
+    let i = this._dateUtility.getMonth();
+    const a = this._dateUtility.getTime(), n = e.min?.getTime() ?? -1 / 0, l = e.max?.getTime() ?? 1 / 0;
+    if (e.min && a < n && (t = e.min.getFullYear(), i = e.min.getMonth()), e.max && a >= l) {
+      const s = new Date(e.max);
+      s.setMilliseconds(s.getMilliseconds() - 1), t = s.getFullYear(), i = s.getMonth();
+    }
+    this._state.transform((s) => (s.visibleYear = t, s.visibleMonth = i, this._calendarDatesGenerator.updateDates(t, i), this._updateNavigationAvailability(s), s));
+  }
+  _updateNavigationAvailability(t) {
+    t.canNavigateToNextMonth = this._canNavigateToMonth(
+      t.visibleMonth + 1,
+      t.visibleYear,
+      t.min,
+      t.max
+    ), t.canNavigateToPreviousMonth = this._canNavigateToMonth(
+      t.visibleMonth - 1,
+      t.visibleYear,
+      t.min,
+      t.max
+    );
+  }
+  setVisibleMonth(t) {
+    if (this._state.get().visibleMonth === t)
+      return;
+    const e = this._state.get();
+    this._dateUtility.setFullYear(e.visibleYear), this._dateUtility.setDate(1), this._dateUtility.setMonth(t), t = this._dateUtility.getMonth();
+    let i = this._dateUtility.getFullYear();
+    const a = this._dateUtility.getTime(), n = e.min?.getTime() ?? -1 / 0, l = e.max?.getTime() ?? 1 / 0;
+    if (e.min && a < n && (i = e.min.getFullYear(), t = e.min.getMonth()), e.max && a >= l) {
+      const s = new Date(e.max);
+      s.setMilliseconds(s.getMilliseconds() - 1), i = s.getFullYear(), t = s.getMonth();
+    }
+    this._state.transform((s) => (s.visibleMonth = t, s.visibleYear = i, this._updateNavigationAvailability(s), this._calendarDatesGenerator.updateDates(i, t), s));
+  }
+  _canNavigateToMonth(t, e, i, a) {
+    this._dateUtility.setFullYear(e), this._dateUtility.setMonth(t), this._dateUtility.setDate(1), this._dateUtility.setHours(0, 0, 0, 0);
+    const n = this._dateUtility.getTime();
+    this._dateUtility.setFullYear(e), this._dateUtility.setMonth(t + 1), this._dateUtility.setDate(1);
+    const l = this._dateUtility.getTime(), s = i?.getTime() ?? -1 / 0, o = a?.getTime() ?? 1 / 0, r = Math.max(s, n), _ = Math.min(o, l);
+    return r < _;
+  }
+  setMinDate(t) {
+    const e = this._state.get();
+    e.min && e.min.getTime() === t?.getTime() || this._state.transform((i) => (t == null ? i.min = null : i.min = new Date(t), this._updateNavigationAvailability(i), this._validate(this._value.get(), this._error.get(), i), i));
+  }
+  setMaxDate(t) {
+    const e = this._state.get();
+    e.max && e.max.getTime() === t?.getTime() || this._state.transform((i) => (t == null ? i.max = null : i.max = new Date(t), this._updateNavigationAvailability(i), this._validate(this._value.get(), this._error.get(), i), i));
+  }
+  setMinVisibleTime(t) {
+    this._state.get().minVisibleTimeInMilliseconds !== t && this._state.transform((e) => (e.minVisibleTimeInMilliseconds = Math.max(
+      t,
+      h
+    ), e));
+  }
+  setMaxVisibleTime(t) {
+    this._state.get().maxVisibleTimeInMilliseconds !== t && this._state.transform((e) => (e.maxVisibleTimeInMilliseconds = Math.min(
+      t,
+      g
+    ), e));
+  }
+  setDisabledDates(t) {
+    this._state.transform((e) => (e.disabledDates = t, this._validate(this._value.get(), this._error.get(), e), e));
+  }
+  clear() {
+    this.selectDate(null);
+  }
+  setTime(t, e, i) {
+    if (this._value.get() == null || this._value.get()?.getHours() === t && this._value.get()?.getMinutes() === e && this._value.get()?.getSeconds() === i)
+      return;
+    const a = this._value.get();
+    if (a == null)
+      return;
+    const n = new Date(a);
+    n.setHours(t), n.setMinutes(e), n.setSeconds(i), this._value.set(n);
+  }
+  setTimeIntervalInMinutes(t) {
+    this._state.get().timeIntervalInMinutes !== t && this._state.transform((e) => (e.timeIntervalInMinutes = t, e));
+  }
+}
+export {
+  M as DatePickerPresenter
+};
+//# sourceMappingURL=date_picker_presenter.js.map

package/dist/inputs/date_picker/date_picker_presenter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date_picker_presenter.js","sources":["../../../src/inputs/date_picker/date_picker_presenter.ts"],"sourcesContent":["import { Signal } from '@tcn/state';\nimport type { CalendarDate } from '../../utils/calendar/calendar_date.js';\nimport { CalendarDatesGenerator } from '../../utils/calendar/calendar_dates_generator.js';\n\nexport interface DatePickerState {\n  error: string | null;\n  visibleYear: number;\n  visibleMonth: number;\n  visibleDates: CalendarDate[];\n  canNavigateToNextMonth: boolean;\n  canNavigateToPreviousMonth: boolean;\n  showTime: boolean;\n  timeIntervalInMinutes: number;\n  minVisibleTimeInMilliseconds: number;\n  maxVisibleTimeInMilliseconds: number;\n  min: Date | null;\n  max: Date | null;\n  disabledDates: Date[];\n}\n\nconst defaultMinVisibleTimeInMilliseconds = 0;\nconst defaultMaxVisibleTimeInMilliseconds = 24 * 1000 * 60 * 60;\n\nexport class DatePickerPresenter {\n  private _value: Signal<Date | null>;\n  private _error: Signal<string | null>;\n  private _state: Signal<DatePickerState>;\n  private _calendarDatesGenerator: CalendarDatesGenerator;\n  private _dateUtility: Date;\n\n  get stateBroadcast() {\n    return this._state.broadcast;\n  }\n\n  get valueBroadcast() {\n    return this._value.broadcast;\n  }\n\n  get errorBroadcast() {\n    return this._error.broadcast;\n  }\n\n  constructor(\n    value: Date | null,\n    visibleYear: number,\n    visibleMonth: number,\n    showTime: boolean,\n    timeIntervalInMinutes = 15\n  ) {\n    const today = new Date();\n    const year = value == null ? today.getFullYear() : value.getFullYear();\n    const month = value == null ? today.getMonth() : value.getMonth();\n\n    this._dateUtility = new Date();\n    this._calendarDatesGenerator = new CalendarDatesGenerator(year, month);\n    this._dateUtility.setFullYear(year);\n    this._dateUtility.setMonth(month);\n\n    this._value = new Signal(value);\n    this._error = new Signal<string | null>(null);\n    const state: DatePickerState = {\n      error: null,\n      visibleYear,\n      visibleMonth,\n      visibleDates: this._calendarDatesGenerator.dates,\n      canNavigateToNextMonth: this._canNavigateToMonth(\n        visibleMonth + 1,\n        visibleYear,\n        null,\n        null\n      ),\n      canNavigateToPreviousMonth: this._canNavigateToMonth(\n        visibleMonth - 1,\n        visibleYear,\n        null,\n        null\n      ),\n      showTime,\n      timeIntervalInMinutes: timeIntervalInMinutes,\n      minVisibleTimeInMilliseconds: defaultMinVisibleTimeInMilliseconds,\n      maxVisibleTimeInMilliseconds: defaultMaxVisibleTimeInMilliseconds,\n      min: null,\n      max: null,\n      disabledDates: [],\n    };\n\n    this._state = new Signal(state);\n  }\n\n  initialize() {\n    this._validate(this._value.get(), this._error.get(), this._state.get());\n  }\n\n  selectDate(date: Date | null) {\n    if (date?.getTime() === this._value.get()?.getTime()) {\n      return;\n    }\n\n    this._value.transform(value => {\n      if (date == null || value == null) {\n        value = date;\n      } else {\n        const clonedDate = new Date(date);\n        clonedDate.setHours(value.getHours(), value.getMinutes(), value.getSeconds());\n\n        value = clonedDate;\n      }\n\n      value && this._keepTimeWithinBounds(value);\n      this._validate(value, this._error.get(), this._state.get());\n\n      return value;\n    });\n  }\n\n  private _keepTimeWithinBounds(date: Date) {\n    const state = this._state.get();\n    const offsetDate = new Date(date);\n    offsetDate.setHours(0, 0, 0, 0);\n\n    const offset = date.getTime() - offsetDate.getTime();\n\n    if (offset < state.minVisibleTimeInMilliseconds) {\n      date.setHours(0, 0, 0, 0);\n      date.setTime(date.getTime() + state.minVisibleTimeInMilliseconds);\n    }\n\n    if (offset > state.maxVisibleTimeInMilliseconds) {\n      date.setHours(0, 0, 0, 0);\n      date.setTime(date.getTime() + state.maxVisibleTimeInMilliseconds);\n    }\n\n    if (state.min && date.getTime() < state.min.getTime()) {\n      date.setTime(state.min.getTime());\n    }\n\n    if (state.max && date.getTime() > state.max.getTime()) {\n      date.setTime(state.max.getTime());\n    }\n  }\n\n  private _validate(date: Date | null, error: string | null, state: DatePickerState) {\n    let validationError: string | null = null;\n\n    if (date != null) {\n      const time = date.getTime();\n      const minTime = state.min == null ? -Infinity : state.min.getTime();\n      const maxTime = state.max == null ? Infinity : state.max.getTime();\n\n      if (time < minTime) {\n        validationError = 'Selected date is outside acceptable range.';\n      } else if (time >= maxTime) {\n        validationError = 'Selected date is outside acceptable range.';\n      }\n\n      const isOnDisabledDate = state.disabledDates.some(\n        d =>\n          d.getDate() === date.getDate() &&\n          d.getMonth() === date.getMonth() &&\n          d.getFullYear() === date.getFullYear()\n      );\n\n      if (isOnDisabledDate) {\n        validationError = 'Selected date is disabled.';\n      }\n    }\n\n    if (validationError !== error) {\n      this._state.transform(s => {\n        s.error = validationError;\n        return s;\n      });\n    }\n  }\n\n  setShowTime(showTime: boolean) {\n    if (this._state.get().showTime === showTime) {\n      return;\n    }\n\n    this._state.transform(s => {\n      s.showTime = showTime;\n      return s;\n    });\n  }\n\n  setVisibleYear(year: number) {\n    if (this._state.get().visibleYear === year) {\n      return;\n    }\n\n    const state = this._state.get();\n\n    this._dateUtility.setFullYear(year);\n    this._dateUtility.setDate(1);\n    this._dateUtility.setMonth(state.visibleMonth);\n\n    year = this._dateUtility.getFullYear();\n    let month = this._dateUtility.getMonth();\n\n    const newDateTime = this._dateUtility.getTime();\n    const minDateTime = state.min?.getTime() ?? -Infinity;\n    const maxDateTime = state.max?.getTime() ?? Infinity;\n\n    if (state.min && newDateTime < minDateTime) {\n      year = state.min.getFullYear();\n      month = state.min.getMonth();\n    }\n\n    if (state.max && newDateTime >= maxDateTime) {\n      const date = new Date(state.max);\n      date.setMilliseconds(date.getMilliseconds() - 1);\n\n      year = date.getFullYear();\n      month = date.getMonth();\n    }\n\n    this._state.transform(s => {\n      s.visibleYear = year;\n      s.visibleMonth = month;\n\n      this._calendarDatesGenerator.updateDates(year, month);\n      this._updateNavigationAvailability(s);\n      return s;\n    });\n  }\n\n  private _updateNavigationAvailability(s: DatePickerState) {\n    s.canNavigateToNextMonth = this._canNavigateToMonth(\n      s.visibleMonth + 1,\n      s.visibleYear,\n      s.min,\n      s.max\n    );\n    s.canNavigateToPreviousMonth = this._canNavigateToMonth(\n      s.visibleMonth - 1,\n      s.visibleYear,\n      s.min,\n      s.max\n    );\n  }\n\n  setVisibleMonth(month: number) {\n    if (this._state.get().visibleMonth === month) {\n      return;\n    }\n\n    const state = this._state.get();\n\n    this._dateUtility.setFullYear(state.visibleYear);\n    this._dateUtility.setDate(1);\n    this._dateUtility.setMonth(month);\n\n    month = this._dateUtility.getMonth();\n    let year = this._dateUtility.getFullYear();\n\n    const newDateTime = this._dateUtility.getTime();\n    const minDateTime = state.min?.getTime() ?? -Infinity;\n    const maxDateTime = state.max?.getTime() ?? Infinity;\n\n    if (state.min && newDateTime < minDateTime) {\n      year = state.min.getFullYear();\n      month = state.min.getMonth();\n    }\n\n    if (state.max && newDateTime >= maxDateTime) {\n      const date = new Date(state.max);\n      date.setMilliseconds(date.getMilliseconds() - 1);\n\n      year = date.getFullYear();\n      month = date.getMonth();\n    }\n\n    this._state.transform(s => {\n      s.visibleMonth = month;\n      s.visibleYear = year;\n\n      this._updateNavigationAvailability(s);\n      this._calendarDatesGenerator.updateDates(year, month);\n      return s;\n    });\n  }\n\n  private _canNavigateToMonth(\n    month: number,\n    year: number,\n    minDate: Date | null,\n    maxDate: Date | null\n  ) {\n    this._dateUtility.setFullYear(year);\n    this._dateUtility.setMonth(month);\n    this._dateUtility.setDate(1);\n    this._dateUtility.setHours(0, 0, 0, 0);\n\n    const startTime = this._dateUtility.getTime();\n\n    this._dateUtility.setFullYear(year);\n    this._dateUtility.setMonth(month + 1);\n    this._dateUtility.setDate(1);\n\n    const endTime = this._dateUtility.getTime();\n\n    const minDateTime = minDate?.getTime() ?? -Infinity;\n    const maxDateTime = maxDate?.getTime() ?? Infinity;\n\n    const start = Math.max(minDateTime, startTime);\n    const end = Math.min(maxDateTime, endTime);\n\n    return start < end;\n  }\n\n  setMinDate(value: Date | null) {\n    const state = this._state.get();\n    if (state.min && state.min.getTime() === value?.getTime()) {\n      return;\n    }\n\n    this._state.transform(s => {\n      if (value == null) {\n        s.min = null;\n      } else {\n        s.min = new Date(value);\n      }\n\n      this._updateNavigationAvailability(s);\n      this._validate(this._value.get(), this._error.get(), s);\n      return s;\n    });\n  }\n\n  setMaxDate(value: Date | null) {\n    const state = this._state.get();\n\n    if (state.max && state.max.getTime() === value?.getTime()) {\n      return;\n    }\n\n    this._state.transform(s => {\n      if (value == null) {\n        s.max = null;\n      } else {\n        s.max = new Date(value);\n      }\n\n      this._updateNavigationAvailability(s);\n      this._validate(this._value.get(), this._error.get(), s);\n      return s;\n    });\n  }\n\n  setMinVisibleTime(timeInMilliseconds: number) {\n    if (this._state.get().minVisibleTimeInMilliseconds === timeInMilliseconds) {\n      return;\n    }\n\n    this._state.transform(s => {\n      s.minVisibleTimeInMilliseconds = Math.max(\n        timeInMilliseconds,\n        defaultMinVisibleTimeInMilliseconds\n      );\n\n      return s;\n    });\n  }\n\n  setMaxVisibleTime(timeInMilliseconds: number) {\n    if (this._state.get().maxVisibleTimeInMilliseconds === timeInMilliseconds) {\n      return;\n    }\n\n    this._state.transform(s => {\n      s.maxVisibleTimeInMilliseconds = Math.min(\n        timeInMilliseconds,\n        defaultMaxVisibleTimeInMilliseconds\n      );\n\n      return s;\n    });\n  }\n\n  setDisabledDates(dates: Date[]) {\n    this._state.transform(s => {\n      s.disabledDates = dates;\n      this._validate(this._value.get(), this._error.get(), s);\n      return s;\n    });\n  }\n\n  clear() {\n    this.selectDate(null);\n  }\n\n  setTime(hours: number, minutes: number, seconds: number) {\n    if (\n      this._value.get() == null ||\n      (this._value.get()?.getHours() === hours &&\n        this._value.get()?.getMinutes() === minutes &&\n        this._value.get()?.getSeconds() === seconds)\n    ) {\n      return;\n    }\n\n    const currentValue = this._value.get();\n    if (currentValue == null) {\n      return;\n    }\n\n    const clonedValue = new Date(currentValue);\n    clonedValue.setHours(hours);\n    clonedValue.setMinutes(minutes);\n    clonedValue.setSeconds(seconds);\n\n    this._value.set(clonedValue);\n  }\n\n  setTimeIntervalInMinutes(intervalInMinutes: number) {\n    if (this._state.get().timeIntervalInMinutes === intervalInMinutes) {\n      return;\n    }\n\n    this._state.transform(s => {\n      s.timeIntervalInMinutes = intervalInMinutes;\n      return s;\n    });\n  }\n}\n"],"names":["defaultMinVisibleTimeInMilliseconds","defaultMaxVisibleTimeInMilliseconds","DatePickerPresenter","value","visibleYear","visibleMonth","showTime","timeIntervalInMinutes","today","year","month","CalendarDatesGenerator","Signal","state","date","clonedDate","offsetDate","offset","error","validationError","time","minTime","maxTime","d","s","newDateTime","minDateTime","maxDateTime","minDate","maxDate","startTime","endTime","start","end","timeInMilliseconds","dates","hours","minutes","seconds","currentValue","clonedValue","intervalInMinutes"],"mappings":"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"}

package/dist/inputs/date_picker/date_picker_time_selector.d.ts

@@ -0,0 +1,13 @@
+export interface DatePickerTimeSelectorProps {
+    origin: Date | null;
+    intervalInMinutes: number;
+    max: Date | null;
+    min: Date | null;
+    minVisibleTimeInMilliseconds: number;
+    maxVisibleTimeInMilliseconds: number;
+    onSelect: (hours: number, minutes: number, seconds: number) => void;
+    disabled?: boolean;
+    height?: string;
+}
+export declare function DatePickerTimeSelector({ origin, intervalInMinutes, max, min, minVisibleTimeInMilliseconds, maxVisibleTimeInMilliseconds, onSelect, disabled, height, }: DatePickerTimeSelectorProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=date_picker_time_selector.d.ts.map

package/dist/inputs/date_picker/date_picker_time_selector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date_picker_time_selector.d.ts","sourceRoot":"","sources":["../../../src/inputs/date_picker/date_picker_time_selector.tsx"],"names":[],"mappings":"AASA,MAAM,WAAW,2BAA2B;IAC1C,MAAM,EAAE,IAAI,GAAG,IAAI,CAAC;IACpB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,GAAG,EAAE,IAAI,GAAG,IAAI,CAAC;IACjB,GAAG,EAAE,IAAI,GAAG,IAAI,CAAC;IACjB,4BAA4B,EAAE,MAAM,CAAC;IACrC,4BAA4B,EAAE,MAAM,CAAC;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,sBAAsB,CAAC,EACrC,MAAM,EACN,iBAAiB,EACjB,GAAG,EACH,GAAG,EACH,4BAA4B,EAC5B,4BAA4B,EAC5B,QAAQ,EACR,QAAQ,EACR,MAAM,GACP,EAAE,2BAA2B,2CAgF7B"}

package/dist/inputs/date_picker/date_picker_time_selector.js

@@ -0,0 +1,90 @@
+import { jsx as o, jsxs as N } from "react/jsx-runtime";
+import { VStack as x } from "../../stacks/v_stack.js";
+import { ZStack as C } from "../../stacks/z_stack.js";
+import s from "classnames";
+import "../../actions/button/base_button/base_button.js";
+import "../../actions/button/button_group/button_group.js";
+import "../../actions/button/slim_button/slim_button.js";
+import { Button as O } from "../../actions/button/button/button.js";
+import "../../actions/button/select_group/select_group.js";
+import "../../actions/button/select_group/single_select_group.js";
+import { BodyText as $ } from "../../typography/body_text/body_text.js";
+import "../../callout.module-D8ECmxpO.js";
+import "../../caption.module-DDq0H4xZ.js";
+import "../../footnote.module-DEyFuqOr.js";
+import "../../headline.module-BiwHBtGf.js";
+import "../../subheadline.module-C-v7zMkQ.js";
+import "../../title.module-B16de2jd.js";
+import { ClockIcon as j } from "@tcn/icons/clock_icon.js";
+import '../../date_picker_time_selector.css';const z = "_time-box_f3145be", P = "_time-box-title_6cc801b", Z = "_time-box-title-container_22add52", v = "_selected-time_33e3aa3", m = { "time-box": z, "time-box-title": P, "time-box-title-container": Z, "selected-time": v };
+function it({
+  origin: e,
+  intervalInMinutes: f,
+  max: b,
+  min: g,
+  minVisibleTimeInMilliseconds: h,
+  maxVisibleTimeInMilliseconds: S,
+  onSelect: T,
+  disabled: l,
+  height: _
+}) {
+  const n = f * 1e3 * 60, w = 24 * 1e3 * 60 * 60 / n, a = new Date(e || /* @__PURE__ */ new Date()), d = [], y = g?.getTime() ?? -1 / 0, M = b?.getTime() ?? 1 / 0;
+  a.setHours(0, 0, 0, 0);
+  let p = a.getTime(), r = 0;
+  for (let c = 0; c < w; c++) {
+    const t = new Date(p);
+    let i = t.getHours() % 12;
+    const H = t.getMinutes(), k = t.getHours() >= 12 ? "PM" : "AM";
+    i = i === 0 ? 12 : i;
+    const B = e != null && t.getHours() === e.getHours() && t.getMinutes() === e.getMinutes() && t.getSeconds() === e.getSeconds(), u = t.getTime(), D = u < y || u > M, I = /* @__PURE__ */ o(
+      O,
+      {
+        width: "flex",
+        hierarchy: "tertiary",
+        className: s("selected-time", B && m["selected-time"]),
+        disabled: e == null || l || D,
+        onClick: () => {
+          T(t.getHours(), t.getMinutes(), t.getSeconds());
+        },
+        children: `${i.toString().padStart(2, "0")}:${H.toString().padStart(2, "0")} ${k}`
+      },
+      c
+    );
+    r >= h && r <= S && d.push(I), p += n, r += n;
+  }
+  return /* @__PURE__ */ N(
+    x,
+    {
+      width: "auto",
+      height: _,
+      "data-is-disabled": l || e == null,
+      className: s(m["time-box"], "time-box"),
+      children: [
+        /* @__PURE__ */ o(
+          C,
+          {
+            className: s(
+              m["time-box-title-container"],
+              "time-box-title-container"
+            ),
+            children: /* @__PURE__ */ o($, { className: s(m["time-box-title"], "time-box-title"), children: /* @__PURE__ */ o(j, { size: "lg" }) })
+          }
+        ),
+        /* @__PURE__ */ o(
+          x,
+          {
+            width: "auto",
+            height: "flex",
+            overflowY: "auto",
+            style: { paddingInline: "4px" },
+            children: d
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  it as DatePickerTimeSelector
+};
+//# sourceMappingURL=date_picker_time_selector.js.map

package/dist/inputs/date_picker/date_picker_time_selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date_picker_time_selector.js","sources":["../../../src/inputs/date_picker/date_picker_time_selector.tsx"],"sourcesContent":["import { VStack } from '../../stacks/v_stack.js';\nimport { ZStack } from '../../stacks/z_stack.js';\nimport classNames from 'classnames';\nimport React from 'react';\nimport { Button } from '../../actions/index.js';\nimport styles from './date_picker_time_selector.module.css';\nimport { BodyText } from '../../typography/index.js';\nimport { ClockIcon } from '@tcn/icons/clock_icon.js';\n\nexport interface DatePickerTimeSelectorProps {\n  origin: Date | null;\n  intervalInMinutes: number;\n  max: Date | null;\n  min: Date | null;\n  minVisibleTimeInMilliseconds: number;\n  maxVisibleTimeInMilliseconds: number;\n  onSelect: (hours: number, minutes: number, seconds: number) => void;\n  disabled?: boolean;\n  height?: string;\n}\n\nexport function DatePickerTimeSelector({\n  origin,\n  intervalInMinutes,\n  max,\n  min,\n  minVisibleTimeInMilliseconds,\n  maxVisibleTimeInMilliseconds,\n  onSelect,\n  disabled,\n  height,\n}: DatePickerTimeSelectorProps) {\n  const stepInMilliseconds = intervalInMinutes * 1000 * 60;\n  const amountOfSteps = (24 * 1000 * 60 * 60) / stepInMilliseconds;\n  const normalizedDate = new Date(origin || new Date());\n  const options: React.ReactElement[] = [];\n  const minTime = min?.getTime() ?? -Infinity;\n  const maxTime = max?.getTime() ?? Infinity;\n\n  normalizedDate.setHours(0, 0, 0, 0);\n  let offset = normalizedDate.getTime();\n  let offsetFromZero = 0;\n\n  for (let x = 0; x < amountOfSteps; x++) {\n    const date = new Date(offset);\n\n    let hour = date.getHours() % 12;\n    const minute = date.getMinutes();\n    const meridiem = date.getHours() >= 12 ? 'PM' : 'AM';\n    hour = hour === 0 ? 12 : hour;\n\n    const isSelected =\n      origin != null &&\n      date.getHours() === origin.getHours() &&\n      date.getMinutes() === origin.getMinutes() &&\n      date.getSeconds() === origin.getSeconds();\n\n    const time = date.getTime();\n    const isOutOfRange = time < minTime || time > maxTime;\n\n    const button = (\n      <Button\n        key={x}\n        width=\"flex\"\n        hierarchy=\"tertiary\"\n        className={classNames('selected-time', isSelected && styles['selected-time'])}\n        disabled={origin == null || disabled || isOutOfRange}\n        onClick={() => {\n          onSelect(date.getHours(), date.getMinutes(), date.getSeconds());\n        }}\n      >{`${hour.toString().padStart(2, '0')}:${minute.toString().padStart(2, '0')} ${meridiem}`}</Button>\n    );\n\n    if (\n      offsetFromZero >= minVisibleTimeInMilliseconds &&\n      offsetFromZero <= maxVisibleTimeInMilliseconds\n    ) {\n      options.push(button);\n    }\n\n    offset += stepInMilliseconds;\n    offsetFromZero += stepInMilliseconds;\n  }\n\n  return (\n    <VStack\n      width=\"auto\"\n      height={height}\n      data-is-disabled={disabled || origin == null}\n      className={classNames(styles['time-box'], 'time-box')}\n    >\n      <ZStack\n        className={classNames(\n          styles['time-box-title-container'],\n          'time-box-title-container'\n        )}\n      >\n        <BodyText className={classNames(styles['time-box-title'], 'time-box-title')}>\n          <ClockIcon size=\"lg\" />\n        </BodyText>\n      </ZStack>\n      <VStack\n        width=\"auto\"\n        height=\"flex\"\n        overflowY=\"auto\"\n        style={{ paddingInline: '4px' }}\n      >\n        {options}\n      </VStack>\n    </VStack>\n  );\n}\n"],"names":["DatePickerTimeSelector","origin","intervalInMinutes","max","min","minVisibleTimeInMilliseconds","maxVisibleTimeInMilliseconds","onSelect","disabled","height","stepInMilliseconds","amountOfSteps","normalizedDate","options","minTime","maxTime","offset","offsetFromZero","x","date","hour","minute","meridiem","isSelected","time","isOutOfRange","button","jsx","Button","classNames","styles","jsxs","VStack","ZStack","BodyText","ClockIcon"],"mappings":";;;;;;;;;;;;;;;;;;;AAqBO,SAASA,GAAuB;AAAA,EACrC,QAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,KAAAC;AAAA,EACA,KAAAC;AAAA,EACA,8BAAAC;AAAA,EACA,8BAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AACF,GAAgC;AAC9B,QAAMC,IAAqBR,IAAoB,MAAO,IAChDS,IAAiB,KAAK,MAAO,KAAK,KAAMD,GACxCE,IAAiB,IAAI,KAAKX,KAAU,oBAAI,MAAM,GAC9CY,IAAgC,CAAA,GAChCC,IAAUV,GAAK,QAAA,KAAa,QAC5BW,IAAUZ,GAAK,QAAA,KAAa;AAElC,EAAAS,EAAe,SAAS,GAAG,GAAG,GAAG,CAAC;AAClC,MAAII,IAASJ,EAAe,QAAA,GACxBK,IAAiB;AAErB,WAASC,IAAI,GAAGA,IAAIP,GAAeO,KAAK;AACtC,UAAMC,IAAO,IAAI,KAAKH,CAAM;AAE5B,QAAII,IAAOD,EAAK,SAAA,IAAa;AAC7B,UAAME,IAASF,EAAK,WAAA,GACdG,IAAWH,EAAK,SAAA,KAAc,KAAK,OAAO;AAChD,IAAAC,IAAOA,MAAS,IAAI,KAAKA;AAEzB,UAAMG,IACJtB,KAAU,QACVkB,EAAK,SAAA,MAAelB,EAAO,SAAA,KAC3BkB,EAAK,WAAA,MAAiBlB,EAAO,WAAA,KAC7BkB,EAAK,WAAA,MAAiBlB,EAAO,WAAA,GAEzBuB,IAAOL,EAAK,QAAA,GACZM,IAAeD,IAAOV,KAAWU,IAAOT,GAExCW,IACJ,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QAEC,OAAM;AAAA,QACN,WAAU;AAAA,QACV,WAAWC,EAAW,iBAAiBN,KAAcO,EAAO,eAAe,CAAC;AAAA,QAC5E,UAAU7B,KAAU,QAAQO,KAAYiB;AAAA,QACxC,SAAS,MAAM;AACb,UAAAlB,EAASY,EAAK,YAAYA,EAAK,cAAcA,EAAK,YAAY;AAAA,QAChE;AAAA,QACA,aAAGC,EAAK,SAAA,EAAW,SAAS,GAAG,GAAG,CAAC,IAAIC,EAAO,WAAW,SAAS,GAAG,GAAG,CAAC,IAAIC,CAAQ;AAAA,MAAA;AAAA,MARhFJ;AAAA,IAAA;AAWT,IACED,KAAkBZ,KAClBY,KAAkBX,KAElBO,EAAQ,KAAKa,CAAM,GAGrBV,KAAUN,GACVO,KAAkBP;AAAA,EACpB;AAEA,SACE,gBAAAqB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,QAAAvB;AAAA,MACA,oBAAkBD,KAAYP,KAAU;AAAA,MACxC,WAAW4B,EAAWC,EAAO,UAAU,GAAG,UAAU;AAAA,MAEpD,UAAA;AAAA,QAAA,gBAAAH;AAAA,UAACM;AAAA,UAAA;AAAA,YACC,WAAWJ;AAAA,cACTC,EAAO,0BAA0B;AAAA,cACjC;AAAA,YAAA;AAAA,YAGF,UAAA,gBAAAH,EAACO,GAAA,EAAS,WAAWL,EAAWC,EAAO,gBAAgB,GAAG,gBAAgB,GACxE,UAAA,gBAAAH,EAACQ,GAAA,EAAU,MAAK,MAAK,EAAA,CACvB;AAAA,UAAA;AAAA,QAAA;AAAA,QAEF,gBAAAR;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,QAAO;AAAA,YACP,WAAU;AAAA,YACV,OAAO,EAAE,eAAe,MAAA;AAAA,YAEvB,UAAAnB;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/inputs/date_picker/date_picker_year_input.d.ts

@@ -0,0 +1,6 @@
+import { DatePickerPresenter } from './date_picker_presenter.js';
+export interface DatePickerYearInputProps {
+    presenter: DatePickerPresenter;
+}
+export declare function DatePickerYearInput({ presenter }: DatePickerYearInputProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=date_picker_year_input.d.ts.map

package/dist/inputs/date_picker/date_picker_year_input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date_picker_year_input.d.ts","sourceRoot":"","sources":["../../../src/inputs/date_picker/date_picker_year_input.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAIjE,MAAM,WAAW,wBAAwB;IACvC,SAAS,EAAE,mBAAmB,CAAC;CAChC;AAED,wBAAgB,mBAAmB,CAAC,EAAE,SAAS,EAAE,EAAE,wBAAwB,2CAqC1E"}

package/dist/inputs/date_picker/date_picker_year_input.js

@@ -0,0 +1,51 @@
+import { jsxs as u, Fragment as f, jsx as e } from "react/jsx-runtime";
+import "../../actions/button/base_button/base_button.js";
+import "../../actions/button/button_group/button_group.js";
+import "../../actions/button/slim_button/slim_button.js";
+import { Button as h } from "../../actions/button/button/button.js";
+import "../../actions/button/select_group/select_group.js";
+import "../../actions/button/select_group/single_select_group.js";
+import d from "classnames";
+import { useState as n } from "react";
+import { Popper as y } from "../../overlay/popper/popper.js";
+import { DatePickerYearSelector as g } from "./date_picker_year_selector.js";
+import { useSignalValue as b } from "@tcn/state";
+import '../../date_picker_year_input.css';const k = "_year-select_eb568a7", s = { "year-select": k };
+function F({ presenter: t }) {
+  const { visibleYear: a } = b(t.stateBroadcast), [c, i] = n(null), [l, r] = n(!1);
+  function o() {
+    r(!1);
+  }
+  function m(p) {
+    i(p.currentTarget), r(!0);
+  }
+  return /* @__PURE__ */ u(f, { children: [
+    /* @__PURE__ */ e(
+      h,
+      {
+        hierarchy: "tertiary",
+        className: d("date-picker-year-select", s["year-select"]),
+        width: "auto",
+        hAlign: "start",
+        onClick: m,
+        children: /* @__PURE__ */ e("span", { className: s.selectedLabel, children: a })
+      }
+    ),
+    /* @__PURE__ */ e(
+      y,
+      {
+        anchorElement: c,
+        horizontalAnchor: "center",
+        horizontalOrigin: "center",
+        onClose: o,
+        open: l,
+        restoreFocus: !0,
+        children: /* @__PURE__ */ e(g, { presenter: t, onClose: o })
+      }
+    )
+  ] });
+}
+export {
+  F as DatePickerYearInput
+};
+//# sourceMappingURL=date_picker_year_input.js.map

package/dist/inputs/date_picker/date_picker_year_input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date_picker_year_input.js","sources":["../../../src/inputs/date_picker/date_picker_year_input.tsx"],"sourcesContent":["import { Button } from '../../actions/index.js';\nimport classNames from 'classnames';\nimport styles from './date_picker_year_input.module.css';\nimport { useState } from 'react';\nimport { Popper } from '../../overlay/popper/popper.js';\nimport { DatePickerPresenter } from './date_picker_presenter.js';\nimport { DatePickerYearSelector } from './date_picker_year_selector.js';\nimport { useSignalValue } from '@tcn/state';\n\nexport interface DatePickerYearInputProps {\n  presenter: DatePickerPresenter;\n}\n\nexport function DatePickerYearInput({ presenter }: DatePickerYearInputProps) {\n  const { visibleYear } = useSignalValue(presenter.stateBroadcast);\n  const [buttonRef, setButtonRef] = useState<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n\n  function close() {\n    setIsOpen(false);\n  }\n\n  function open(event: React.MouseEvent<HTMLButtonElement>) {\n    setButtonRef(event.currentTarget);\n    setIsOpen(true);\n  }\n\n  return (\n    <>\n      <Button\n        hierarchy=\"tertiary\"\n        className={classNames('date-picker-year-select', styles['year-select'])}\n        width=\"auto\"\n        hAlign=\"start\"\n        onClick={open}\n      >\n        <span className={styles.selectedLabel}>{visibleYear}</span>\n      </Button>\n      <Popper\n        anchorElement={buttonRef}\n        horizontalAnchor=\"center\"\n        horizontalOrigin=\"center\"\n        onClose={close}\n        open={isOpen}\n        restoreFocus\n      >\n        <DatePickerYearSelector presenter={presenter} onClose={close} />\n      </Popper>\n    </>\n  );\n}\n"],"names":["DatePickerYearInput","presenter","visibleYear","useSignalValue","buttonRef","setButtonRef","useState","isOpen","setIsOpen","close","open","event","jsxs","Fragment","jsx","Button","classNames","styles","Popper","DatePickerYearSelector"],"mappings":";;;;;;;;;;;;;AAaO,SAASA,EAAoB,EAAE,WAAAC,KAAuC;AAC3E,QAAM,EAAE,aAAAC,EAAA,IAAgBC,EAAeF,EAAU,cAAc,GACzD,CAACG,GAAWC,CAAY,IAAIC,EAAmC,IAAI,GACnE,CAACC,GAAQC,CAAS,IAAIF,EAAS,EAAK;AAE1C,WAASG,IAAQ;AACf,IAAAD,EAAU,EAAK;AAAA,EACjB;AAEA,WAASE,EAAKC,GAA4C;AACxD,IAAAN,EAAaM,EAAM,aAAa,GAChCH,EAAU,EAAI;AAAA,EAChB;AAEA,SACE,gBAAAI,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,WAAWC,EAAW,2BAA2BC,EAAO,aAAa,CAAC;AAAA,QACtE,OAAM;AAAA,QACN,QAAO;AAAA,QACP,SAASP;AAAA,QAET,UAAA,gBAAAI,EAAC,QAAA,EAAK,WAAWG,EAAO,eAAgB,UAAAf,EAAA,CAAY;AAAA,MAAA;AAAA,IAAA;AAAA,IAEtD,gBAAAY;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,eAAed;AAAA,QACf,kBAAiB;AAAA,QACjB,kBAAiB;AAAA,QACjB,SAASK;AAAA,QACT,MAAMF;AAAA,QACN,cAAY;AAAA,QAEZ,UAAA,gBAAAO,EAACK,GAAA,EAAuB,WAAAlB,GAAsB,SAASQ,EAAA,CAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EAChE,GACF;AAEJ;"}

package/dist/inputs/date_picker/date_picker_year_selector.d.ts

@@ -0,0 +1,7 @@
+import { DatePickerPresenter } from './date_picker_presenter.js';
+export interface DatePickerYearSelectorProps {
+    presenter: DatePickerPresenter;
+    onClose: () => void;
+}
+export declare function DatePickerYearSelector({ presenter, onClose, }: DatePickerYearSelectorProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=date_picker_year_selector.d.ts.map

package/dist/inputs/date_picker/date_picker_year_selector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date_picker_year_selector.d.ts","sourceRoot":"","sources":["../../../src/inputs/date_picker/date_picker_year_selector.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAKjE,MAAM,WAAW,2BAA2B;IAC1C,SAAS,EAAE,mBAAmB,CAAC;IAC/B,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,wBAAgB,sBAAsB,CAAC,EACrC,SAAS,EACT,OAAO,GACR,EAAE,2BAA2B,2CA2G7B"}

package/dist/inputs/date_picker/date_picker_year_selector.js

@@ -0,0 +1,116 @@
+import { jsx as e, jsxs as h } from "react/jsx-runtime";
+import { useState as j, useRef as z, useEffect as D } from "react";
+import { ChevronLeftIcon as H } from "@tcn/icons/chevron_left_icon.js";
+import { ChevronRightIcon as O } from "@tcn/icons/chevron_right_icon.js";
+import { useSignalValue as $ } from "@tcn/state";
+import "../../actions/button/base_button/base_button.js";
+import "../../actions/button/button_group/button_group.js";
+import { SlimButton as g } from "../../actions/button/slim_button/slim_button.js";
+import "../../actions/button/button/button.js";
+import "../../actions/button/select_group/select_group.js";
+import "../../actions/button/select_group/single_select_group.js";
+import { HStack as t } from "../../stacks/h_stack.js";
+import { Spacer as y } from "../../stacks/spacer.js";
+import { VStack as E } from "../../stacks/v_stack.js";
+import { BodyText as L } from "../../typography/body_text/body_text.js";
+import x from "classnames";
+import "../../callout.module-D8ECmxpO.js";
+import "../../caption.module-DDq0H4xZ.js";
+import "../../footnote.module-DEyFuqOr.js";
+import { Headline as M } from "../../typography/headline/headline.js";
+import "../../subheadline.module-C-v7zMkQ.js";
+import "../../title.module-B16de2jd.js";
+import { FocusRedirect as T } from "../../utils/focus_redirect.js";
+import "../../utils/click_away_listener.js";
+import "../../utils/scroll_away_listener.js";
+import "../../utils/hooks/use_resize_observer.js";
+import '../../date_picker_year_selector.css';const q = "_date-picker-year-selector_ab05e1f", A = "_date-picker-year-button_fded757", Y = { "date-picker-year-selector": q, "date-picker-year-button": A };
+function xe({
+  presenter: s,
+  onClose: k
+}) {
+  const { min: p, max: m, visibleYear: o, visibleMonth: b } = $(
+    s.stateBroadcast
+  ), [c, f] = j(0), a = z(null), R = p == null ? -1 / 0 : p.getFullYear(), S = m == null ? 1 / 0 : m.getFullYear(), r = [], d = o % 20;
+  let u = o - d + c, F = u + 19;
+  for (let n = 0; n < 20; n++) {
+    let l = !1;
+    const i = new Date(o, b, 1);
+    i.setFullYear(o - d + n + c), (i.getFullYear() > S || i.getFullYear() < R) && (l = !0);
+    const V = t;
+    r.push(
+      /* @__PURE__ */ e(
+        V,
+        {
+          as: "button",
+          width: "flex",
+          disabled: l,
+          className: x(
+            Y["date-picker-year-button"],
+            "date-picker-year-button"
+          ),
+          "data-is-disabled": String(l),
+          "data-is-selected": String(i.getFullYear() === o),
+          onClick: () => {
+            s.setVisibleYear(i.getFullYear()), k();
+          },
+          children: /* @__PURE__ */ e(L, { children: i.getFullYear() })
+        },
+        n
+      )
+    );
+  }
+  function w() {
+    a.current != null && a.current.focus();
+  }
+  D(() => {
+    a.current != null && a.current.focus();
+  }, []);
+  const v = r.slice(0, 4), B = r.slice(4, 8), C = r.slice(8, 12), I = r.slice(12, 16), _ = r.slice(16, 20);
+  function N() {
+    f(c - 20);
+  }
+  function P() {
+    f(c + 20);
+  }
+  return /* @__PURE__ */ h(
+    E,
+    {
+      ref: a,
+      tabIndex: 0,
+      padding: "8px",
+      className: x(
+        Y["date-picker-year-selector"],
+        "date-picker-year-selector"
+      ),
+      gap: "4px",
+      children: [
+        /* @__PURE__ */ h(t, { gap: "4px", children: [
+          /* @__PURE__ */ e(g, { onClick: N, hierarchy: "tertiary", children: /* @__PURE__ */ e(H, { flipOnRtl: !0, size: "md" }) }),
+          /* @__PURE__ */ e(y, {}),
+          /* @__PURE__ */ e(
+            M,
+            {
+              selectable: !1,
+              emphasis: "faint",
+              hierarchy: "tertiary",
+              children: `${u}-${F}`
+            }
+          ),
+          /* @__PURE__ */ e(y, {}),
+          /* @__PURE__ */ e(g, { hierarchy: "tertiary", onClick: P, children: /* @__PURE__ */ e(O, { size: "md" }) })
+        ] }),
+        /* @__PURE__ */ e(t, { gap: "4px", children: v }),
+        /* @__PURE__ */ e(t, { gap: "4px", children: B }),
+        /* @__PURE__ */ e(t, { gap: "4px", children: C }),
+        /* @__PURE__ */ e(t, { gap: "4px", children: I }),
+        /* @__PURE__ */ e(t, { gap: "4px", children: _ }),
+        /* @__PURE__ */ e(T, { onRedirect: w })
+      ]
+    }
+  );
+}
+export {
+  xe as DatePickerYearSelector
+};
+//# sourceMappingURL=date_picker_year_selector.js.map

package/dist/inputs/date_picker/date_picker_year_selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date_picker_year_selector.js","sources":["../../../src/inputs/date_picker/date_picker_year_selector.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { ChevronLeftIcon } from '@tcn/icons/chevron_left_icon.js';\nimport { ChevronRightIcon } from '@tcn/icons/chevron_right_icon.js';\nimport { useSignalValue } from '@tcn/state';\nimport { SlimButton } from '../../actions/index.js';\nimport { HStack } from '../../stacks/h_stack.js';\nimport { Spacer } from '../../stacks/spacer.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport { BodyText, Headline } from '../../typography/index.js';\nimport { DatePickerPresenter } from './date_picker_presenter.js';\nimport styles from './date_picker_year_selector.module.css';\nimport { FocusRedirect } from '../../utils/index.js';\nimport classNames from 'classnames';\n\nexport interface DatePickerYearSelectorProps {\n  presenter: DatePickerPresenter;\n  onClose: () => void;\n}\n\nexport function DatePickerYearSelector({\n  presenter,\n  onClose,\n}: DatePickerYearSelectorProps) {\n  const { min, max, visibleYear, visibleMonth } = useSignalValue(\n    presenter.stateBroadcast\n  );\n\n  const [offset, setOffset] = useState(0);\n  const containerRef = useRef<HTMLDivElement | null>(null);\n  const minYear = min == null ? -Infinity : min.getFullYear();\n  const maxYear = max == null ? Infinity : max.getFullYear();\n  const years: React.ReactNode[] = [];\n  const remainder = visibleYear % 20;\n  let firstYear = visibleYear - remainder + offset;\n  let lastYear = firstYear + 19;\n\n  for (let x = 0; x < 20; x++) {\n    let disabled = false;\n    const date = new Date(visibleYear, visibleMonth, 1);\n    date.setFullYear(visibleYear - remainder + x + offset);\n\n    if (date.getFullYear() > maxYear || date.getFullYear() < minYear) {\n      disabled = true;\n    }\n\n    const Button: any = HStack;\n\n    years.push(\n      <Button\n        as=\"button\"\n        key={x}\n        width=\"flex\"\n        disabled={disabled}\n        className={classNames(\n          styles['date-picker-year-button'],\n          'date-picker-year-button'\n        )}\n        data-is-disabled={String(disabled)}\n        data-is-selected={String(date.getFullYear() === visibleYear)}\n        onClick={() => {\n          presenter.setVisibleYear(date.getFullYear());\n          onClose();\n        }}\n      >\n        <BodyText>{date.getFullYear()}</BodyText>\n      </Button>\n    );\n  }\n\n  function focus() {\n    if (containerRef.current != null) {\n      containerRef.current.focus();\n    }\n  }\n\n  useEffect(() => {\n    if (containerRef.current != null) {\n      containerRef.current.focus();\n    }\n  }, []);\n\n  const firstRow = years.slice(0, 4);\n  const secondRow = years.slice(4, 8);\n  const thirdRow = years.slice(8, 12);\n  const fourthRow = years.slice(12, 16);\n  const fifthRow = years.slice(16, 20);\n\n  function prev() {\n    setOffset(offset - 20);\n  }\n\n  function next() {\n    setOffset(offset + 20);\n  }\n\n  return (\n    <VStack\n      ref={containerRef}\n      tabIndex={0}\n      padding=\"8px\"\n      className={classNames(\n        styles['date-picker-year-selector'],\n        'date-picker-year-selector'\n      )}\n      gap=\"4px\"\n    >\n      <HStack gap=\"4px\">\n        <SlimButton onClick={prev} hierarchy=\"tertiary\">\n          <ChevronLeftIcon flipOnRtl size=\"md\" />\n        </SlimButton>\n        <Spacer />\n        <Headline\n          selectable={false}\n          emphasis=\"faint\"\n          hierarchy=\"tertiary\"\n        >{`${firstYear}-${lastYear}`}</Headline>\n        <Spacer />\n        <SlimButton hierarchy=\"tertiary\" onClick={next}>\n          <ChevronRightIcon size=\"md\" />\n        </SlimButton>\n      </HStack>\n      <HStack gap=\"4px\">{firstRow}</HStack>\n      <HStack gap=\"4px\">{secondRow}</HStack>\n      <HStack gap=\"4px\">{thirdRow}</HStack>\n      <HStack gap=\"4px\">{fourthRow}</HStack>\n      <HStack gap=\"4px\">{fifthRow}</HStack>\n      <FocusRedirect onRedirect={focus} />\n    </VStack>\n  );\n}\n"],"names":["DatePickerYearSelector","presenter","onClose","min","max","visibleYear","visibleMonth","useSignalValue","offset","setOffset","useState","containerRef","useRef","minYear","maxYear","years","remainder","firstYear","lastYear","x","disabled","date","Button","HStack","jsx","classNames","styles","BodyText","focus","useEffect","firstRow","secondRow","thirdRow","fourthRow","fifthRow","prev","next","jsxs","VStack","SlimButton","ChevronLeftIcon","Spacer","Headline","ChevronRightIcon","FocusRedirect"],"mappings":"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"}