@tcn/ui 0.3.1 → 0.3.3

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

@@ -1 +1 @@
-{"version":3,"file":"date_picker_date.js","sources":["../../../src/inputs/date_picker/date_picker_date.tsx"],"sourcesContent":["import { useSignalValue } from '@tcn/state';\nimport { BodyText } from '../../typography/index.js';\nimport { ZStack } from '../../stacks/z_stack.js';\nimport type { CalendarDate } from '../../utils/calendar/calendar_date.js';\nimport type { DatePickerPresenter } from './date_picker_presenter.js';\nimport styles from './date_picker_date.module.css';\nimport { clsx } from 'clsx';\n\nexport interface DatePickerDateProps {\n  date: CalendarDate;\n  presenter: DatePickerPresenter;\n}\n\nexport function DatePickerDate({ presenter, date: calendarDate }: DatePickerDateProps) {\n  const {\n    visibleMonth,\n    disabledDates,\n    min: minDate,\n    max: maxDate,\n  } = useSignalValue(presenter.stateBroadcast);\n  const selectedDate = useSignalValue(presenter.valueBroadcast);\n\n  let minTime = -Infinity;\n  let maxTime = Infinity;\n\n  if (minDate != null) {\n    let normalizedMinDate = new Date(minDate);\n    normalizedMinDate.setHours(0, 0, 0, 0);\n    minTime = normalizedMinDate.getTime();\n  }\n\n  if (maxDate != null) {\n    let normalizedMaxDate = new Date(maxDate);\n    normalizedMaxDate.setHours(23, 59, 59, 999);\n    maxTime = normalizedMaxDate.getTime();\n  }\n\n  const date = new Date();\n\n  const time = new Date(\n    calendarDate.year,\n    calendarDate.month,\n    calendarDate.date\n  ).getTime();\n\n  const isWithinMonth = visibleMonth === calendarDate.month;\n\n  const isSelected =\n    selectedDate?.getMonth() === calendarDate.month &&\n    selectedDate.getFullYear() === calendarDate.year &&\n    selectedDate.getDate() === calendarDate.date;\n\n  const isDisabled = disabledDates.some(\n    d =>\n      d.getMonth() === calendarDate.month &&\n      d.getFullYear() === calendarDate.year &&\n      d.getDate() === calendarDate.date\n  );\n\n  const isWithinRange = time >= minTime && time < maxTime;\n  const isToday =\n    date.getMonth() === calendarDate.month &&\n    date.getFullYear() === calendarDate.year &&\n    date.getDate() === calendarDate.date;\n\n  function select() {\n    const date = new Date(calendarDate.year, calendarDate.month, calendarDate.date);\n\n    if (isSelected && presenter.stateBroadcast.get().showTime) {\n      presenter.clear();\n      return;\n    }\n\n    presenter.selectDate(date);\n  }\n\n  return (\n    <button\n      disabled={!isWithinMonth || isDisabled || !isWithinRange}\n      className={clsx(styles['date-picker-date'], 'date-picker-date')}\n      onClick={select}\n      data-is-within-month={String(isWithinMonth)}\n      data-is-selected={String(isSelected)}\n      data-is-disabled={String(isDisabled)}\n      data-is-within-range={String(isWithinRange)}\n      data-is-today={String(isToday)}\n    >\n      <ZStack height=\"100%\">\n        <BodyText>{String(calendarDate.date)}</BodyText>\n        {isToday && (\n          <div\n            className={clsx(styles['date-picker-today'], 'date-picker-today')}\n            data-is-selected={String(isSelected)}\n          ></div>\n        )}\n      </ZStack>\n    </button>\n  );\n}\n"],"names":["DatePickerDate","presenter","calendarDate","visibleMonth","disabledDates","minDate","maxDate","useSignalValue","selectedDate","minTime","maxTime","normalizedMinDate","normalizedMaxDate","date","time","isWithinMonth","isSelected","isDisabled","d","isWithinRange","isToday","select","jsx","clsx","styles","jsxs","ZStack","BodyText"],"mappings":";;;;;;;;;;;;AAaO,SAASA,EAAe,EAAE,WAAAC,GAAW,MAAMC,KAAqC;AACrF,QAAM;AAAA,IACJ,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,KAAKC;AAAA,IACL,KAAKC;AAAA,EAAA,IACHC,EAAeN,EAAU,cAAc,GACrCO,IAAeD,EAAeN,EAAU,cAAc;AAE5D,MAAIQ,IAAU,QACVC,IAAU;AAEd,MAAIL,KAAW,MAAM;AACnB,QAAIM,IAAoB,IAAI,KAAKN,CAAO;AACxC,IAAAM,EAAkB,SAAS,GAAG,GAAG,GAAG,CAAC,GACrCF,IAAUE,EAAkB,QAAA;AAAA,EAC9B;AAEA,MAAIL,KAAW,MAAM;AACnB,QAAIM,IAAoB,IAAI,KAAKN,CAAO;AACxC,IAAAM,EAAkB,SAAS,IAAI,IAAI,IAAI,GAAG,GAC1CF,IAAUE,EAAkB,QAAA;AAAA,EAC9B;AAEA,QAAMC,wBAAW,KAAA,GAEXC,IAAO,IAAI;AAAA,IACfZ,EAAa;AAAA,IACbA,EAAa;AAAA,IACbA,EAAa;AAAA,EAAA,EACb,QAAA,GAEIa,IAAgBZ,MAAiBD,EAAa,OAE9Cc,IACJR,GAAc,SAAA,MAAeN,EAAa,SAC1CM,EAAa,YAAA,MAAkBN,EAAa,QAC5CM,EAAa,QAAA,MAAcN,EAAa,MAEpCe,IAAab,EAAc;AAAA,IAC/B,CAAAc,MACEA,EAAE,SAAA,MAAehB,EAAa,SAC9BgB,EAAE,YAAA,MAAkBhB,EAAa,QACjCgB,EAAE,QAAA,MAAchB,EAAa;AAAA,EAAA,GAG3BiB,IAAgBL,KAAQL,KAAWK,IAAOJ,GAC1CU,IACJP,EAAK,SAAA,MAAeX,EAAa,SACjCW,EAAK,YAAA,MAAkBX,EAAa,QACpCW,EAAK,QAAA,MAAcX,EAAa;AAElC,WAASmB,IAAS;AAChB,UAAMR,IAAO,IAAI,KAAKX,EAAa,MAAMA,EAAa,OAAOA,EAAa,IAAI;AAE9E,QAAIc,KAAcf,EAAU,eAAe,IAAA,EAAM,UAAU;AACzD,MAAAA,EAAU,MAAA;AACV;AAAA,IACF;AAEA,IAAAA,EAAU,WAAWY,CAAI;AAAA,EAC3B;AAEA,SACE,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAU,CAACP,KAAiBE,KAAc,CAACE;AAAA,MAC3C,WAAWI,EAAKC,EAAO,kBAAkB,GAAG,kBAAkB;AAAA,MAC9D,SAASH;AAAA,MACT,wBAAsB,OAAON,CAAa;AAAA,MAC1C,oBAAkB,OAAOC,CAAU;AAAA,MACnC,oBAAkB,OAAOC,CAAU;AAAA,MACnC,wBAAsB,OAAOE,CAAa;AAAA,MAC1C,iBAAe,OAAOC,CAAO;AAAA,MAE7B,UAAA,gBAAAK,EAACC,GAAA,EAAO,QAAO,QACb,UAAA;AAAA,QAAA,gBAAAJ,EAACK,GAAA,EAAU,UAAA,OAAOzB,EAAa,IAAI,GAAE;AAAA,QACpCkB,KACC,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWC,EAAKC,EAAO,mBAAmB,GAAG,mBAAmB;AAAA,YAChE,oBAAkB,OAAOR,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MACpC,EAAA,CAEL;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"date_picker_date.js","sources":["../../../src/inputs/date_picker/date_picker_date.tsx"],"sourcesContent":["import { useSignalValue } from '@tcn/state';\nimport { BodyText } from '../../typography/index.js';\nimport { ZStack } from '../../stacks/z_stack.js';\nimport type { CalendarDate } from '../../utils/calendar/calendar_date.js';\nimport type { DatePickerPresenter } from './date_picker_presenter.js';\nimport styles from './date_picker_date.module.css';\nimport { clsx } from 'clsx';\n\nexport interface DatePickerDateProps {\n  date: CalendarDate;\n  presenter: DatePickerPresenter;\n}\n\nexport function DatePickerDate({ presenter, date: calendarDate }: DatePickerDateProps) {\n  const {\n    visibleMonth,\n    disabledDates,\n    min: minDate,\n    max: maxDate,\n  } = useSignalValue(presenter.stateBroadcast);\n  const selectedDate = useSignalValue(presenter.valueBroadcast);\n\n  let minTime = -Infinity;\n  let maxTime = Infinity;\n\n  if (minDate != null) {\n    let normalizedMinDate = new Date(minDate);\n    normalizedMinDate.setHours(0, 0, 0, 0);\n    minTime = normalizedMinDate.getTime();\n  }\n\n  if (maxDate != null) {\n    let normalizedMaxDate = new Date(maxDate);\n    normalizedMaxDate.setHours(23, 59, 59, 999);\n    maxTime = normalizedMaxDate.getTime();\n  }\n\n  const date = new Date();\n\n  const time = new Date(\n    calendarDate.year,\n    calendarDate.month,\n    calendarDate.date\n  ).getTime();\n\n  const isWithinMonth = visibleMonth === calendarDate.month;\n\n  const isSelected =\n    selectedDate?.getMonth() === calendarDate.month &&\n    selectedDate.getFullYear() === calendarDate.year &&\n    selectedDate.getDate() === calendarDate.date;\n\n  const isDisabled = disabledDates.some(\n    d =>\n      d.getMonth() === calendarDate.month &&\n      d.getFullYear() === calendarDate.year &&\n      d.getDate() === calendarDate.date\n  );\n\n  const isWithinRange = time >= minTime && time < maxTime;\n  const isToday =\n    date.getMonth() === calendarDate.month &&\n    date.getFullYear() === calendarDate.year &&\n    date.getDate() === calendarDate.date;\n\n  function select() {\n    const date = new Date(calendarDate.year, calendarDate.month, calendarDate.date);\n\n    if (isSelected && presenter.stateBroadcast.get().showTime) {\n      presenter.clear();\n      return;\n    }\n\n    presenter.selectDate(date);\n  }\n\n  return (\n    <button\n      disabled={!isWithinMonth || isDisabled || !isWithinRange}\n      className={clsx(styles['date-picker-date'], 'tcn-date-picker-date')}\n      onClick={select}\n      data-is-within-month={String(isWithinMonth)}\n      data-is-selected={String(isSelected)}\n      data-is-disabled={String(isDisabled)}\n      data-is-within-range={String(isWithinRange)}\n      data-is-today={String(isToday)}\n    >\n      <ZStack height=\"100%\">\n        <BodyText>{String(calendarDate.date)}</BodyText>\n        {isToday && (\n          <div\n            className={clsx(styles['date-picker-today'], 'tcn-date-picker-today')}\n            data-is-selected={String(isSelected)}\n          ></div>\n        )}\n      </ZStack>\n    </button>\n  );\n}\n"],"names":["DatePickerDate","presenter","calendarDate","visibleMonth","disabledDates","minDate","maxDate","useSignalValue","selectedDate","minTime","maxTime","normalizedMinDate","normalizedMaxDate","date","time","isWithinMonth","isSelected","isDisabled","d","isWithinRange","isToday","select","jsx","clsx","styles","jsxs","ZStack","BodyText"],"mappings":";;;;;;;;;;;;AAaO,SAASA,EAAe,EAAE,WAAAC,GAAW,MAAMC,KAAqC;AACrF,QAAM;AAAA,IACJ,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,KAAKC;AAAA,IACL,KAAKC;AAAA,EAAA,IACHC,EAAeN,EAAU,cAAc,GACrCO,IAAeD,EAAeN,EAAU,cAAc;AAE5D,MAAIQ,IAAU,QACVC,IAAU;AAEd,MAAIL,KAAW,MAAM;AACnB,QAAIM,IAAoB,IAAI,KAAKN,CAAO;AACxC,IAAAM,EAAkB,SAAS,GAAG,GAAG,GAAG,CAAC,GACrCF,IAAUE,EAAkB,QAAA;AAAA,EAC9B;AAEA,MAAIL,KAAW,MAAM;AACnB,QAAIM,IAAoB,IAAI,KAAKN,CAAO;AACxC,IAAAM,EAAkB,SAAS,IAAI,IAAI,IAAI,GAAG,GAC1CF,IAAUE,EAAkB,QAAA;AAAA,EAC9B;AAEA,QAAMC,wBAAW,KAAA,GAEXC,IAAO,IAAI;AAAA,IACfZ,EAAa;AAAA,IACbA,EAAa;AAAA,IACbA,EAAa;AAAA,EAAA,EACb,QAAA,GAEIa,IAAgBZ,MAAiBD,EAAa,OAE9Cc,IACJR,GAAc,SAAA,MAAeN,EAAa,SAC1CM,EAAa,YAAA,MAAkBN,EAAa,QAC5CM,EAAa,QAAA,MAAcN,EAAa,MAEpCe,IAAab,EAAc;AAAA,IAC/B,CAAAc,MACEA,EAAE,SAAA,MAAehB,EAAa,SAC9BgB,EAAE,YAAA,MAAkBhB,EAAa,QACjCgB,EAAE,QAAA,MAAchB,EAAa;AAAA,EAAA,GAG3BiB,IAAgBL,KAAQL,KAAWK,IAAOJ,GAC1CU,IACJP,EAAK,SAAA,MAAeX,EAAa,SACjCW,EAAK,YAAA,MAAkBX,EAAa,QACpCW,EAAK,QAAA,MAAcX,EAAa;AAElC,WAASmB,IAAS;AAChB,UAAMR,IAAO,IAAI,KAAKX,EAAa,MAAMA,EAAa,OAAOA,EAAa,IAAI;AAE9E,QAAIc,KAAcf,EAAU,eAAe,IAAA,EAAM,UAAU;AACzD,MAAAA,EAAU,MAAA;AACV;AAAA,IACF;AAEA,IAAAA,EAAU,WAAWY,CAAI;AAAA,EAC3B;AAEA,SACE,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAU,CAACP,KAAiBE,KAAc,CAACE;AAAA,MAC3C,WAAWI,EAAKC,EAAO,kBAAkB,GAAG,sBAAsB;AAAA,MAClE,SAASH;AAAA,MACT,wBAAsB,OAAON,CAAa;AAAA,MAC1C,oBAAkB,OAAOC,CAAU;AAAA,MACnC,oBAAkB,OAAOC,CAAU;AAAA,MACnC,wBAAsB,OAAOE,CAAa;AAAA,MAC1C,iBAAe,OAAOC,CAAO;AAAA,MAE7B,UAAA,gBAAAK,EAACC,GAAA,EAAO,QAAO,QACb,UAAA;AAAA,QAAA,gBAAAJ,EAACK,GAAA,EAAU,UAAA,OAAOzB,EAAa,IAAI,GAAE;AAAA,QACpCkB,KACC,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWC,EAAKC,EAAO,mBAAmB,GAAG,uBAAuB;AAAA,YACpE,oBAAkB,OAAOR,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MACpC,EAAA,CAEL;AAAA,IAAA;AAAA,EAAA;AAGN;"}

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

@@ -1 +1 @@
-{"version":3,"file":"date_picker_day.d.ts","sourceRoot":"","sources":["../../../src/inputs/date_picker/date_picker_day.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,kBAAkB;IACjC,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,aAAa,CAAC,EAAE,YAAY,EAAE,WAAW,EAAE,EAAE,kBAAkB,2CAkB9E"}
+{"version":3,"file":"date_picker_day.d.ts","sourceRoot":"","sources":["../../../src/inputs/date_picker/date_picker_day.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,kBAAkB;IACjC,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,aAAa,CAAC,EAAE,YAAY,EAAE,WAAW,EAAE,EAAE,kBAAkB,2CAsB9E"}

package/dist/inputs/date_picker/date_picker_day.js

@@ -1,25 +1,33 @@
 import { jsx as a } from "react/jsx-runtime";
-import "clsx";
+import r from "clsx";
 import "../../body_text.module-h4XQE2pC.js";
 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 { Headline as c } from "../../typography/headline/headline.js";
 import "../../subheadline.module-C-v7zMkQ.js";
 import "../../typography/title/title.js";
 import { ZStack as p } from "../../stacks/z_stack.js";
 import { useMemo as s } from "react";
-import '../../date_picker_day.css';const c = "_date-picker-day_2945845", r = { "date-picker-day": c };
-function g({ dayOfTheWeek: i, countryCode: t }) {
+import '../../date_picker_day.css';const d = "_date-picker-day_2945845", i = { "date-picker-day": d };
+function u({ dayOfTheWeek: o, countryCode: t }) {
   const e = /* @__PURE__ */ new Date();
-  e.setDate(e.getDate() - e.getDay() + i);
-  const o = s(
+  e.setDate(e.getDate() - e.getDay() + o);
+  const m = s(
     () => new Intl.DateTimeFormat(t, { weekday: "short" }).format(e).toLocaleUpperCase(),
     [t, e]
   );
-  return /* @__PURE__ */ a(p, { className: r["date-picker-day"], children: /* @__PURE__ */ a(m, { size: "sm", emphasis: "faint", className: r["date-picker-day-text"], children: o[0] }) });
+  return /* @__PURE__ */ a(p, { className: r(i["date-picker-day"], "tcn-date-picker-day"), children: /* @__PURE__ */ a(
+    c,
+    {
+      size: "sm",
+      emphasis: "faint",
+      className: r(i["date-picker-day-text"], "tcn-date-picker-day-text"),
+      children: m[0]
+    }
+  ) });
 }
 export {
-  g as DatePickerDay
+  u as DatePickerDay
 };
 //# sourceMappingURL=date_picker_day.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"date_picker_day.js","sources":["../../../src/inputs/date_picker/date_picker_day.tsx"],"sourcesContent":["import { Headline } from '../../typography/index.js';\nimport { ZStack } from '../../stacks/z_stack.js';\nimport { useMemo } from 'react';\nimport styles from './date_picker_day.module.css';\n\nexport interface DatePickerDayProps {\n  dayOfTheWeek: number;\n  countryCode: string;\n}\n\nexport function DatePickerDay({ dayOfTheWeek, countryCode }: DatePickerDayProps) {\n  const date = new Date();\n  date.setDate(date.getDate() - date.getDay() + dayOfTheWeek);\n  const weekdayName = useMemo(\n    () =>\n      new Intl.DateTimeFormat(countryCode, { weekday: 'short' })\n        .format(date)\n        .toLocaleUpperCase(),\n    [countryCode, date]\n  );\n\n  return (\n    <ZStack className={styles['date-picker-day']}>\n      <Headline size=\"sm\" emphasis=\"faint\" className={styles['date-picker-day-text']}>\n        {weekdayName[0]}\n      </Headline>\n    </ZStack>\n  );\n}\n"],"names":["DatePickerDay","dayOfTheWeek","countryCode","date","weekdayName","useMemo","ZStack","styles","Headline"],"mappings":";;;;;;;;;;;;AAUO,SAASA,EAAc,EAAE,cAAAC,GAAc,aAAAC,KAAmC;AAC/E,QAAMC,wBAAW,KAAA;AACjB,EAAAA,EAAK,QAAQA,EAAK,QAAA,IAAYA,EAAK,OAAA,IAAWF,CAAY;AAC1D,QAAMG,IAAcC;AAAA,IAClB,MACE,IAAI,KAAK,eAAeH,GAAa,EAAE,SAAS,QAAA,CAAS,EACtD,OAAOC,CAAI,EACX,kBAAA;AAAA,IACL,CAACD,GAAaC,CAAI;AAAA,EAAA;AAGpB,2BACGG,GAAA,EAAO,WAAWC,EAAO,iBAAiB,GACzC,4BAACC,GAAA,EAAS,MAAK,MAAK,UAAS,SAAQ,WAAWD,EAAO,sBAAsB,GAC1E,UAAAH,EAAY,CAAC,GAChB,GACF;AAEJ;"}
+{"version":3,"file":"date_picker_day.js","sources":["../../../src/inputs/date_picker/date_picker_day.tsx"],"sourcesContent":["import { Headline } from '../../typography/index.js';\nimport { ZStack } from '../../stacks/z_stack.js';\nimport { useMemo } from 'react';\nimport styles from './date_picker_day.module.css';\nimport clsx from 'clsx';\n\nexport interface DatePickerDayProps {\n  dayOfTheWeek: number;\n  countryCode: string;\n}\n\nexport function DatePickerDay({ dayOfTheWeek, countryCode }: DatePickerDayProps) {\n  const date = new Date();\n  date.setDate(date.getDate() - date.getDay() + dayOfTheWeek);\n  const weekdayName = useMemo(\n    () =>\n      new Intl.DateTimeFormat(countryCode, { weekday: 'short' })\n        .format(date)\n        .toLocaleUpperCase(),\n    [countryCode, date]\n  );\n\n  return (\n    <ZStack className={clsx(styles['date-picker-day'], 'tcn-date-picker-day')}>\n      <Headline\n        size=\"sm\"\n        emphasis=\"faint\"\n        className={clsx(styles['date-picker-day-text'], 'tcn-date-picker-day-text')}\n      >\n        {weekdayName[0]}\n      </Headline>\n    </ZStack>\n  );\n}\n"],"names":["DatePickerDay","dayOfTheWeek","countryCode","date","weekdayName","useMemo","jsx","ZStack","clsx","styles","Headline"],"mappings":";;;;;;;;;;;;AAWO,SAASA,EAAc,EAAE,cAAAC,GAAc,aAAAC,KAAmC;AAC/E,QAAMC,wBAAW,KAAA;AACjB,EAAAA,EAAK,QAAQA,EAAK,QAAA,IAAYA,EAAK,OAAA,IAAWF,CAAY;AAC1D,QAAMG,IAAcC;AAAA,IAClB,MACE,IAAI,KAAK,eAAeH,GAAa,EAAE,SAAS,QAAA,CAAS,EACtD,OAAOC,CAAI,EACX,kBAAA;AAAA,IACL,CAACD,GAAaC,CAAI;AAAA,EAAA;AAGpB,SACE,gBAAAG,EAACC,KAAO,WAAWC,EAAKC,EAAO,iBAAiB,GAAG,qBAAqB,GACtE,UAAA,gBAAAH;AAAA,IAACI;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAS;AAAA,MACT,WAAWF,EAAKC,EAAO,sBAAsB,GAAG,0BAA0B;AAAA,MAEzE,YAAY,CAAC;AAAA,IAAA;AAAA,EAAA,GAElB;AAEJ;"}

package/dist/inputs/date_picker/date_picker_header.js

@@ -39,7 +39,7 @@ function J({ presenter: t, countryCode: o }) {
   }, t.stateBroadcast), /* @__PURE__ */ c(
     l,
     {
-      className: O(R["date-picker-header"], "date-picker-header"),
+      className: O(R["date-picker-header"], "tcn-date-picker-header"),
       minWidth: "35px",
       width: "100%",
       children: [

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

@@ -1 +1 @@
-{"version":3,"file":"date_picker_header.js","sources":["../../../src/inputs/date_picker/date_picker_header.tsx"],"sourcesContent":["import { useSignalValue, useSignalValueEffect } from '@tcn/state';\nimport { HStack } from '../../stacks/h_stack.js';\nimport { Spacer } from '../../stacks/spacer.js';\nimport React, { useMemo, useRef } from 'react';\nimport { SlimButton } from '../../actions/index.js';\nimport { getMonthsOfYear } from '../../utils/calendar/get_months_of_year.js';\nimport { DatePickerPresenter } from './date_picker_presenter.js';\nimport { Select } from '../select/select.js';\nimport { ChevronLeftIcon } from '@tcn/icons/chevron_left_icon.js';\nimport { ChevronRightIcon } from '@tcn/icons/chevron_right_icon.js';\nimport { Option, OptionProps } from '../options/option.js';\nimport { DatePickerState } from './date_picker_presenter.js';\nimport styles from './date_picker_header.module.css';\nimport { clsx } from 'clsx';\nimport { DatePickerYearInput } from './date_picker_year_input.js';\n\nfunction makeMonthsOptions(countryCode: string): React.ReactElement<OptionProps>[] {\n  const shortMonths = getMonthsOfYear(countryCode, 'short');\n  const longMonths = getMonthsOfYear(countryCode, 'long');\n\n  return shortMonths.map((m, index) => {\n    return (\n      <Option key={index} value={String(index)} label={m} keywords={[m]}>\n        {longMonths[index]}\n      </Option>\n    );\n  });\n}\n\nexport interface DatePickerHeaderProps {\n  presenter: DatePickerPresenter;\n  countryCode: string;\n}\n\nexport function DatePickerHeader({ presenter, countryCode }: DatePickerHeaderProps) {\n  const state = useSignalValue(presenter.stateBroadcast);\n  const yearInputRef = useRef<HTMLInputElement>(null);\n\n  function selectMonth(value: string) {\n    presenter.setVisibleMonth(Number(value));\n  }\n\n  function previous() {\n    return presenter.setVisibleMonth(presenter.stateBroadcast.get().visibleMonth - 1);\n  }\n\n  function next() {\n    return presenter.setVisibleMonth(presenter.stateBroadcast.get().visibleMonth + 1);\n  }\n\n  const monthsOptions = useMemo(() => {\n    return makeMonthsOptions(countryCode);\n  }, [countryCode]);\n\n  useSignalValueEffect((state: DatePickerState) => {\n    const input = yearInputRef.current;\n    if (input && input.value !== String(state.visibleYear)) {\n      input.value = String(state.visibleYear);\n    }\n  }, presenter.stateBroadcast);\n\n  return (\n    <HStack\n      className={clsx(styles['date-picker-header'], 'date-picker-header')}\n      minWidth=\"35px\"\n      width=\"100%\"\n    >\n      <SlimButton\n        disabled={!state.canNavigateToPreviousMonth}\n        hierarchy=\"tertiary\"\n        onClick={previous}\n      >\n        <ChevronLeftIcon flipOnRtl size=\"md\" />\n      </SlimButton>\n      <Spacer />\n      <HStack hAlign=\"center\" gap=\"4px\" width=\"auto\">\n        <Select\n          hierarchy=\"tertiary\"\n          width=\"auto\"\n          maxWidth=\"150px\"\n          value={String(state.visibleMonth)}\n          onChange={selectMonth}\n        >\n          {monthsOptions}\n        </Select>\n        <DatePickerYearInput presenter={presenter} />\n      </HStack>\n      <Spacer />\n      <SlimButton\n        disabled={!state.canNavigateToNextMonth}\n        hierarchy=\"tertiary\"\n        onClick={next}\n      >\n        <ChevronRightIcon flipOnRtl size=\"md\" />\n      </SlimButton>\n    </HStack>\n  );\n}\n"],"names":["makeMonthsOptions","countryCode","shortMonths","getMonthsOfYear","longMonths","m","index","jsx","Option","DatePickerHeader","presenter","state","useSignalValue","yearInputRef","useRef","selectMonth","value","previous","next","monthsOptions","useMemo","useSignalValueEffect","input","jsxs","HStack","clsx","styles","SlimButton","ChevronLeftIcon","Spacer","Select","DatePickerYearInput","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;;;;;;AAgBA,SAASA,EAAkBC,GAAwD;AACjF,QAAMC,IAAcC,EAAgBF,GAAa,OAAO,GAClDG,IAAaD,EAAgBF,GAAa,MAAM;AAEtD,SAAOC,EAAY,IAAI,CAACG,GAAGC,MAEvB,gBAAAC,EAACC,GAAA,EAAmB,OAAO,OAAOF,CAAK,GAAG,OAAOD,GAAG,UAAU,CAACA,CAAC,GAC7D,UAAAD,EAAWE,CAAK,KADNA,CAEb,CAEH;AACH;AAOO,SAASG,EAAiB,EAAE,WAAAC,GAAW,aAAAT,KAAsC;AAClF,QAAMU,IAAQC,EAAeF,EAAU,cAAc,GAC/CG,IAAeC,EAAyB,IAAI;AAElD,WAASC,EAAYC,GAAe;AAClC,IAAAN,EAAU,gBAAgB,OAAOM,CAAK,CAAC;AAAA,EACzC;AAEA,WAASC,IAAW;AAClB,WAAOP,EAAU,gBAAgBA,EAAU,eAAe,IAAA,EAAM,eAAe,CAAC;AAAA,EAClF;AAEA,WAASQ,IAAO;AACd,WAAOR,EAAU,gBAAgBA,EAAU,eAAe,IAAA,EAAM,eAAe,CAAC;AAAA,EAClF;AAEA,QAAMS,IAAgBC,EAAQ,MACrBpB,EAAkBC,CAAW,GACnC,CAACA,CAAW,CAAC;AAEhB,SAAAoB,EAAqB,CAACV,MAA2B;AAC/C,UAAMW,IAAQT,EAAa;AAC3B,IAAIS,KAASA,EAAM,UAAU,OAAOX,EAAM,WAAW,MACnDW,EAAM,QAAQ,OAAOX,EAAM,WAAW;AAAA,EAE1C,GAAGD,EAAU,cAAc,GAGzB,gBAAAa;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,oBAAoB,GAAG,oBAAoB;AAAA,MAClE,UAAS;AAAA,MACT,OAAM;AAAA,MAEN,UAAA;AAAA,QAAA,gBAAAnB;AAAA,UAACoB;AAAA,UAAA;AAAA,YACC,UAAU,CAAChB,EAAM;AAAA,YACjB,WAAU;AAAA,YACV,SAASM;AAAA,YAET,UAAA,gBAAAV,EAACqB,GAAA,EAAgB,WAAS,IAAC,MAAK,KAAA,CAAK;AAAA,UAAA;AAAA,QAAA;AAAA,0BAEtCC,GAAA,EAAO;AAAA,0BACPL,GAAA,EAAO,QAAO,UAAS,KAAI,OAAM,OAAM,QACtC,UAAA;AAAA,UAAA,gBAAAjB;AAAA,YAACuB;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAM;AAAA,cACN,UAAS;AAAA,cACT,OAAO,OAAOnB,EAAM,YAAY;AAAA,cAChC,UAAUI;AAAA,cAET,UAAAI;AAAA,YAAA;AAAA,UAAA;AAAA,UAEH,gBAAAZ,EAACwB,KAAoB,WAAArB,EAAA,CAAsB;AAAA,QAAA,GAC7C;AAAA,0BACCmB,GAAA,EAAO;AAAA,QACR,gBAAAtB;AAAA,UAACoB;AAAA,UAAA;AAAA,YACC,UAAU,CAAChB,EAAM;AAAA,YACjB,WAAU;AAAA,YACV,SAASO;AAAA,YAET,UAAA,gBAAAX,EAACyB,GAAA,EAAiB,WAAS,IAAC,MAAK,KAAA,CAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MACxC;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"date_picker_header.js","sources":["../../../src/inputs/date_picker/date_picker_header.tsx"],"sourcesContent":["import { useSignalValue, useSignalValueEffect } from '@tcn/state';\nimport { HStack } from '../../stacks/h_stack.js';\nimport { Spacer } from '../../stacks/spacer.js';\nimport React, { useMemo, useRef } from 'react';\nimport { SlimButton } from '../../actions/index.js';\nimport { getMonthsOfYear } from '../../utils/calendar/get_months_of_year.js';\nimport { DatePickerPresenter } from './date_picker_presenter.js';\nimport { Select } from '../select/select.js';\nimport { ChevronLeftIcon } from '@tcn/icons/chevron_left_icon.js';\nimport { ChevronRightIcon } from '@tcn/icons/chevron_right_icon.js';\nimport { Option, OptionProps } from '../options/option.js';\nimport { DatePickerState } from './date_picker_presenter.js';\nimport styles from './date_picker_header.module.css';\nimport { clsx } from 'clsx';\nimport { DatePickerYearInput } from './date_picker_year_input.js';\n\nfunction makeMonthsOptions(countryCode: string): React.ReactElement<OptionProps>[] {\n  const shortMonths = getMonthsOfYear(countryCode, 'short');\n  const longMonths = getMonthsOfYear(countryCode, 'long');\n\n  return shortMonths.map((m, index) => {\n    return (\n      <Option key={index} value={String(index)} label={m} keywords={[m]}>\n        {longMonths[index]}\n      </Option>\n    );\n  });\n}\n\nexport interface DatePickerHeaderProps {\n  presenter: DatePickerPresenter;\n  countryCode: string;\n}\n\nexport function DatePickerHeader({ presenter, countryCode }: DatePickerHeaderProps) {\n  const state = useSignalValue(presenter.stateBroadcast);\n  const yearInputRef = useRef<HTMLInputElement>(null);\n\n  function selectMonth(value: string) {\n    presenter.setVisibleMonth(Number(value));\n  }\n\n  function previous() {\n    return presenter.setVisibleMonth(presenter.stateBroadcast.get().visibleMonth - 1);\n  }\n\n  function next() {\n    return presenter.setVisibleMonth(presenter.stateBroadcast.get().visibleMonth + 1);\n  }\n\n  const monthsOptions = useMemo(() => {\n    return makeMonthsOptions(countryCode);\n  }, [countryCode]);\n\n  useSignalValueEffect((state: DatePickerState) => {\n    const input = yearInputRef.current;\n    if (input && input.value !== String(state.visibleYear)) {\n      input.value = String(state.visibleYear);\n    }\n  }, presenter.stateBroadcast);\n\n  return (\n    <HStack\n      className={clsx(styles['date-picker-header'], 'tcn-date-picker-header')}\n      minWidth=\"35px\"\n      width=\"100%\"\n    >\n      <SlimButton\n        disabled={!state.canNavigateToPreviousMonth}\n        hierarchy=\"tertiary\"\n        onClick={previous}\n      >\n        <ChevronLeftIcon flipOnRtl size=\"md\" />\n      </SlimButton>\n      <Spacer />\n      <HStack hAlign=\"center\" gap=\"4px\" width=\"auto\">\n        <Select\n          hierarchy=\"tertiary\"\n          width=\"auto\"\n          maxWidth=\"150px\"\n          value={String(state.visibleMonth)}\n          onChange={selectMonth}\n        >\n          {monthsOptions}\n        </Select>\n        <DatePickerYearInput presenter={presenter} />\n      </HStack>\n      <Spacer />\n      <SlimButton\n        disabled={!state.canNavigateToNextMonth}\n        hierarchy=\"tertiary\"\n        onClick={next}\n      >\n        <ChevronRightIcon flipOnRtl size=\"md\" />\n      </SlimButton>\n    </HStack>\n  );\n}\n"],"names":["makeMonthsOptions","countryCode","shortMonths","getMonthsOfYear","longMonths","m","index","jsx","Option","DatePickerHeader","presenter","state","useSignalValue","yearInputRef","useRef","selectMonth","value","previous","next","monthsOptions","useMemo","useSignalValueEffect","input","jsxs","HStack","clsx","styles","SlimButton","ChevronLeftIcon","Spacer","Select","DatePickerYearInput","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;;;;;;AAgBA,SAASA,EAAkBC,GAAwD;AACjF,QAAMC,IAAcC,EAAgBF,GAAa,OAAO,GAClDG,IAAaD,EAAgBF,GAAa,MAAM;AAEtD,SAAOC,EAAY,IAAI,CAACG,GAAGC,MAEvB,gBAAAC,EAACC,GAAA,EAAmB,OAAO,OAAOF,CAAK,GAAG,OAAOD,GAAG,UAAU,CAACA,CAAC,GAC7D,UAAAD,EAAWE,CAAK,KADNA,CAEb,CAEH;AACH;AAOO,SAASG,EAAiB,EAAE,WAAAC,GAAW,aAAAT,KAAsC;AAClF,QAAMU,IAAQC,EAAeF,EAAU,cAAc,GAC/CG,IAAeC,EAAyB,IAAI;AAElD,WAASC,EAAYC,GAAe;AAClC,IAAAN,EAAU,gBAAgB,OAAOM,CAAK,CAAC;AAAA,EACzC;AAEA,WAASC,IAAW;AAClB,WAAOP,EAAU,gBAAgBA,EAAU,eAAe,IAAA,EAAM,eAAe,CAAC;AAAA,EAClF;AAEA,WAASQ,IAAO;AACd,WAAOR,EAAU,gBAAgBA,EAAU,eAAe,IAAA,EAAM,eAAe,CAAC;AAAA,EAClF;AAEA,QAAMS,IAAgBC,EAAQ,MACrBpB,EAAkBC,CAAW,GACnC,CAACA,CAAW,CAAC;AAEhB,SAAAoB,EAAqB,CAACV,MAA2B;AAC/C,UAAMW,IAAQT,EAAa;AAC3B,IAAIS,KAASA,EAAM,UAAU,OAAOX,EAAM,WAAW,MACnDW,EAAM,QAAQ,OAAOX,EAAM,WAAW;AAAA,EAE1C,GAAGD,EAAU,cAAc,GAGzB,gBAAAa;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,oBAAoB,GAAG,wBAAwB;AAAA,MACtE,UAAS;AAAA,MACT,OAAM;AAAA,MAEN,UAAA;AAAA,QAAA,gBAAAnB;AAAA,UAACoB;AAAA,UAAA;AAAA,YACC,UAAU,CAAChB,EAAM;AAAA,YACjB,WAAU;AAAA,YACV,SAASM;AAAA,YAET,UAAA,gBAAAV,EAACqB,GAAA,EAAgB,WAAS,IAAC,MAAK,KAAA,CAAK;AAAA,UAAA;AAAA,QAAA;AAAA,0BAEtCC,GAAA,EAAO;AAAA,0BACPL,GAAA,EAAO,QAAO,UAAS,KAAI,OAAM,OAAM,QACtC,UAAA;AAAA,UAAA,gBAAAjB;AAAA,YAACuB;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAM;AAAA,cACN,UAAS;AAAA,cACT,OAAO,OAAOnB,EAAM,YAAY;AAAA,cAChC,UAAUI;AAAA,cAET,UAAAI;AAAA,YAAA;AAAA,UAAA;AAAA,UAEH,gBAAAZ,EAACwB,KAAoB,WAAArB,EAAA,CAAsB;AAAA,QAAA,GAC7C;AAAA,0BACCmB,GAAA,EAAO;AAAA,QACR,gBAAAtB;AAAA,UAACoB;AAAA,UAAA;AAAA,YACC,UAAU,CAAChB,EAAM;AAAA,YACjB,WAAU;AAAA,YACV,SAASO;AAAA,YAET,UAAA,gBAAAX,EAACyB,GAAA,EAAiB,WAAS,IAAC,MAAK,KAAA,CAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MACxC;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/inputs/date_picker/date_picker_input.js

@@ -35,7 +35,7 @@ import '../../date_picker_input.css';const U = "_button_f404820", X = "_popover_
     onTimeSelected: w,
     ..._
   }, b) => {
-    const [n, a] = L(null), v = n != null, i = M(null), p = V((t) => t.closest(".suggestion-list") != null, []), C = W(() => {
+    const [n, a] = L(null), v = n != null, i = M(null), p = V((t) => t.closest(".tcn-suggestion-list") != null, []), C = W(() => {
       const t = {
         year: "numeric",
         month: "short",
@@ -72,7 +72,7 @@ import '../../date_picker_input.css';const U = "_button_f404820", X = "_popover_
         J,
         {
           ref: b,
-          className: m(f.button, "select"),
+          className: m(f.button, "tcn-select"),
           hAlign: "start",
           disabled: l,
           hierarchy: A,
@@ -103,7 +103,7 @@ import '../../date_picker_input.css';const U = "_button_f404820", X = "_popover_
             G,
             {
               padding: "8px",
-              className: m(f.popover, "date-picker-popover"),
+              className: m(f.popover, "tcn-date-picker-popover"),
               onKeyDown: O,
               children: [
                 /* @__PURE__ */ o(

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

@@ -1 +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/legacy/popper.js';\nimport { clsx } from 'clsx';\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={clsx(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={clsx(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","clsx","styles","Popper","ZStack","DatePicker","FocusRedirect"],"mappings":"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"}
+{"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/legacy/popper.js';\nimport { clsx } from 'clsx';\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('.tcn-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={clsx(styles.button, 'tcn-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={clsx(styles.popover, 'tcn-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","clsx","styles","Popper","ZStack","DatePicker","FocusRedirect"],"mappings":"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"}

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

@@ -1 +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,2CA6E7B"}
+{"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

@@ -1,7 +1,7 @@
 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 { clsx as m } from "clsx";
+import { clsx as n } from "clsx";
 import "../../actions/button/base_button/base_button.js";
 import "../../actions/button/button_group/button_group.js";
 import "../../actions/button/slim_button/slim_button.js";
@@ -16,7 +16,7 @@ import "../../headline.module-BiwHBtGf.js";
 import "../../subheadline.module-C-v7zMkQ.js";
 import "../../typography/title/title.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", s = { "time-box": z, "time-box-title": P, "time-box-title-container": Z, "selected-time": v };
+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,
@@ -28,10 +28,10 @@ function it({
   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;
+  const s = f * 1e3 * 60, w = 24 * 1e3 * 60 * 60 / s, 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++) {
+  let p = a.getTime(), c = 0;
+  for (let r = 0; r < w; r++) {
     const t = new Date(p);
     let i = t.getHours() % 12;
     const H = t.getMinutes(), k = t.getHours() >= 12 ? "PM" : "AM";
@@ -41,16 +41,16 @@ function it({
       {
         width: "flex",
         hierarchy: "tertiary",
-        className: m("selected-time", B && s["selected-time"]),
+        className: n("tcn-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
     );
-    r >= h && r <= S && d.push(I), p += n, r += n;
+    c >= h && c <= S && d.push(I), p += s, c += s;
   }
   return /* @__PURE__ */ N(
     x,
@@ -58,13 +58,16 @@ function it({
       width: "auto",
       height: _,
       "data-is-disabled": l || e == null,
-      className: m(s["time-box"], "time-box"),
+      className: n(m["time-box"], "tcn-time-box"),
       children: [
         /* @__PURE__ */ o(
           C,
           {
-            className: m(s["time-box-title-container"], "time-box-title-container"),
-            children: /* @__PURE__ */ o($, { className: m(s["time-box-title"], "time-box-title"), children: /* @__PURE__ */ o(j, { size: "lg" }) })
+            className: n(
+              m["time-box-title-container"],
+              "tcn-time-box-title-container"
+            ),
+            children: /* @__PURE__ */ o($, { className: n(m["time-box-title"], "tcn-time-box-title"), children: /* @__PURE__ */ o(j, { size: "lg" }) })
           }
         ),
         /* @__PURE__ */ o(

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

@@ -1 +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 { clsx } from 'clsx';\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={clsx('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={clsx(styles['time-box'], 'time-box')}\n    >\n      <ZStack\n        className={clsx(styles['time-box-title-container'], 'time-box-title-container')}\n      >\n        <BodyText className={clsx(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","clsx","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,EAAK,iBAAiBN,KAAcO,EAAO,eAAe,CAAC;AAAA,QACtE,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,EAAKC,EAAO,UAAU,GAAG,UAAU;AAAA,MAE9C,UAAA;AAAA,QAAA,gBAAAH;AAAA,UAACM;AAAA,UAAA;AAAA,YACC,WAAWJ,EAAKC,EAAO,0BAA0B,GAAG,0BAA0B;AAAA,YAE9E,UAAA,gBAAAH,EAACO,GAAA,EAAS,WAAWL,EAAKC,EAAO,gBAAgB,GAAG,gBAAgB,GAClE,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;"}
+{"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 { clsx } from 'clsx';\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={clsx('tcn-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={clsx(styles['time-box'], 'tcn-time-box')}\n    >\n      <ZStack\n        className={clsx(\n          styles['time-box-title-container'],\n          'tcn-time-box-title-container'\n        )}\n      >\n        <BodyText className={clsx(styles['time-box-title'], 'tcn-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","clsx","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,EAAK,qBAAqBN,KAAcO,EAAO,eAAe,CAAC;AAAA,QAC1E,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,EAAKC,EAAO,UAAU,GAAG,cAAc;AAAA,MAElD,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,EAAKC,EAAO,gBAAgB,GAAG,oBAAoB,GACtE,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.js

@@ -12,7 +12,7 @@ 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 I({ presenter: t }) {
-  const { visibleYear: a } = b(t.stateBroadcast), [c, i] = n(null), [l, r] = n(!1);
+  const { visibleYear: c } = b(t.stateBroadcast), [a, i] = n(null), [l, r] = n(!1);
   function o() {
     r(!1);
   }
@@ -24,17 +24,17 @@ function I({ presenter: t }) {
       h,
       {
         hierarchy: "tertiary",
-        className: d("date-picker-year-select", s["year-select"]),
+        className: d("tcn-date-picker-year-select", s["year-select"]),
         width: "auto",
         hAlign: "start",
         onClick: m,
-        children: /* @__PURE__ */ e("span", { className: s.selectedLabel, children: a })
+        children: /* @__PURE__ */ e("span", { className: s.selectedLabel, children: c })
       }
     ),
     /* @__PURE__ */ e(
       y,
       {
-        anchorElement: c,
+        anchorElement: a,
         horizontalAnchor: "center",
         horizontalOrigin: "center",
         onClose: o,

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

@@ -1 +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 { clsx } from 'clsx';\nimport styles from './date_picker_year_input.module.css';\nimport { useState } from 'react';\nimport { Popper } from '../../overlay/popper/legacy/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={clsx('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","clsx","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,EAAK,2BAA2BC,EAAO,aAAa,CAAC;AAAA,QAChE,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;"}
+{"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 { clsx } from 'clsx';\nimport styles from './date_picker_year_input.module.css';\nimport { useState } from 'react';\nimport { Popper } from '../../overlay/popper/legacy/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={clsx('tcn-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","clsx","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,EAAK,+BAA+BC,EAAO,aAAa,CAAC;AAAA,QACpE,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.map

@@ -1 +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,2CAqG7B"}
+{"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,2CAwG7B"}

package/dist/inputs/date_picker/date_picker_year_selector.js

@@ -31,12 +31,12 @@ function ye({
 }) {
   const { min: p, max: m, visibleYear: o, visibleMonth: b } = $(
     s.stateBroadcast
-  ), [c, f] = z(0), a = D(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;
+  ), [a, f] = z(0), c = D(null), R = p == null ? -1 / 0 : p.getFullYear(), S = m == null ? 1 / 0 : m.getFullYear(), r = [], d = o % 20;
+  let u = o - d + a, 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);
+    i.setFullYear(o - d + n + a), (i.getFullYear() > S || i.getFullYear() < R) && (l = !0);
     const j = t;
     r.push(
       /* @__PURE__ */ e(
@@ -45,7 +45,7 @@ function ye({
           as: "button",
           width: "flex",
           disabled: l,
-          className: y(Y["date-picker-year-button"], "date-picker-year-button"),
+          className: y(Y["date-picker-year-button"], "tcn-date-picker-year-button"),
           "data-is-disabled": String(l),
           "data-is-selected": String(i.getFullYear() === o),
           onClick: () => {
@@ -58,25 +58,28 @@ function ye({
     );
   }
   function w() {
-    a.current != null && a.current.focus();
+    c.current != null && c.current.focus();
   }
   H(() => {
-    a.current != null && a.current.focus();
+    c.current != null && c.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 P() {
-    f(c - 20);
+    f(a - 20);
   }
   function V() {
-    f(c + 20);
+    f(a + 20);
   }
   return /* @__PURE__ */ h(
     E,
     {
-      ref: a,
+      ref: c,
       tabIndex: 0,
       padding: "8px",
-      className: y(Y["date-picker-year-selector"], "date-picker-year-selector"),
+      className: y(
+        Y["date-picker-year-selector"],
+        "tcn-date-picker-year-selector"
+      ),
       gap: "4px",
       children: [
         /* @__PURE__ */ h(t, { gap: "4px", children: [

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

@@ -1 +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 { clsx } from 'clsx';\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={clsx(styles['date-picker-year-button'], 'date-picker-year-button')}\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={clsx(styles['date-picker-year-selector'], 'date-picker-year-selector')}\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","clsx","styles","BodyText","focus","useEffect","firstRow","secondRow","thirdRow","fourthRow","fifthRow","prev","next","jsxs","VStack","SlimButton","ChevronLeftIcon","Spacer","Headline","ChevronRightIcon","FocusRedirect"],"mappings":"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"}
+{"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 { clsx } from 'clsx';\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={clsx(styles['date-picker-year-button'], 'tcn-date-picker-year-button')}\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={clsx(\n        styles['date-picker-year-selector'],\n        'tcn-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","clsx","styles","BodyText","focus","useEffect","firstRow","secondRow","thirdRow","fourthRow","fifthRow","prev","next","jsxs","VStack","SlimButton","ChevronLeftIcon","Spacer","Headline","ChevronRightIcon","FocusRedirect"],"mappings":"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"}

package/dist/inputs/index.d.ts

@@ -26,21 +26,17 @@ export * from './mask_input/regex_character.js';
 export * from './multi_combo_box/multi_combo_box.js';
 export * from './multiselect/multiselect.js';
 export * from './multiselect/multiselect_inline_values.js';
-export * from './multiselect/multiselect_row.js';
 export * from './multiselect/multiselect_values.js';
 export * from './options/utils.js';
 export * from './options/option.js';
 export * from './phone_number_input/countries_phone_information.js';
 export * from './phone_number_input/phone_number_input.js';
 export * from './radio/radio.js';
-export * from './radio/radio_row.js';
 export * from './select/select.js';
 export * from './slider/slider.js';
 export * from './suggestions/suggestion_item.js';
 export * from './suggestions/suggestion_list.js';
 export * from './switch/switch.js';
-export * from './switch/switch_row.js';
 export * from './textarea/textarea.js';
-export * from './textarea/textarea_row.js';
 export * from './unit_input/unit_input.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/inputs/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/inputs/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,+BAA+B,CAAC;AAE9C,cAAc,0BAA0B,CAAC;AAEzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AACjD,cAAc,mCAAmC,CAAC;AAClD,cAAc,mCAAmC,CAAC;AAClD,cAAc,oCAAoC,CAAC;AACnD,cAAc,qCAAqC,CAAC;AACpD,cAAc,wCAAwC,CAAC;AAEvD,cAAc,kBAAkB,CAAC;AAEjC,cAAc,iCAAiC,CAAC;AAChD,cAAc,yCAAyC,CAAC;AACxD,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oCAAoC,CAAC;AACnD,cAAc,mCAAmC,CAAC;AAClD,cAAc,oCAAoC,CAAC;AACnD,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,mCAAmC,CAAC;AAClD,cAAc,iCAAiC,CAAC;AAEhD,cAAc,sCAAsC,CAAC;AAErD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,4CAA4C,CAAC;AAC3D,cAAc,kCAAkC,CAAC;AACjD,cAAc,qCAAqC,CAAC;AAEpD,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AAEpC,cAAc,qDAAqD,CAAC;AACpE,cAAc,4CAA4C,CAAC;AAE3D,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AAErC,cAAc,oBAAoB,CAAC;AAEnC,cAAc,oBAAoB,CAAC;AAEnC,cAAc,kCAAkC,CAAC;AACjD,cAAc,kCAAkC,CAAC;AAEjD,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AAEvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAE3C,cAAc,4BAA4B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/inputs/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,+BAA+B,CAAC;AAE9C,cAAc,0BAA0B,CAAC;AAEzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AACjD,cAAc,mCAAmC,CAAC;AAClD,cAAc,mCAAmC,CAAC;AAClD,cAAc,oCAAoC,CAAC;AACnD,cAAc,qCAAqC,CAAC;AACpD,cAAc,wCAAwC,CAAC;AAEvD,cAAc,kBAAkB,CAAC;AAEjC,cAAc,iCAAiC,CAAC;AAChD,cAAc,yCAAyC,CAAC;AACxD,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oCAAoC,CAAC;AACnD,cAAc,mCAAmC,CAAC;AAClD,cAAc,oCAAoC,CAAC;AACnD,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,mCAAmC,CAAC;AAClD,cAAc,iCAAiC,CAAC;AAEhD,cAAc,sCAAsC,CAAC;AAErD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,4CAA4C,CAAC;AAC3D,cAAc,qCAAqC,CAAC;AAEpD,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AAEpC,cAAc,qDAAqD,CAAC;AACpE,cAAc,4CAA4C,CAAC;AAE3D,cAAc,kBAAkB,CAAC;AAEjC,cAAc,oBAAoB,CAAC;AAEnC,cAAc,oBAAoB,CAAC;AAEnC,cAAc,kCAAkC,CAAC;AACjD,cAAc,kCAAkC,CAAC;AAEjD,cAAc,oBAAoB,CAAC;AAEnC,cAAc,wBAAwB,CAAC;AAEvC,cAAc,4BAA4B,CAAC"}