@tcn/ui 0.13.1 → 0.15.0

package/dist/layouts/section/index.js

@@ -0,0 +1,9 @@
+import { Section as r } from "./section.js";
+import { Heading as f } from "./heading.js";
+import { Detail as m } from "./detail.js";
+export {
+  m as Detail,
+  f as Heading,
+  r as Section
+};
+//# sourceMappingURL=index.js.map

package/dist/layouts/section/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/layouts/section/section.js

@@ -2,7 +2,7 @@ import { jsx as m } from "react/jsx-runtime";
 import n from "react";
 import { clsx as f } from "clsx";
 import { VStack as a } from "../../stacks/v_stack.js";
-import { s as p } from "../../section.module-0wyGkhDg.js";
+import { s as p } from "../../section.module-BXlxYmJK.js";
 const _ = n.forwardRef(function({ children: t, className: o, hAlign: r = "start", as: c = "section", style: s, ...e }, i) {
   return /* @__PURE__ */ m(
     a,

package/dist/mobile/actions/button/mobile_button.d.ts

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+import { ButtonProps } from '../../../actions/button/button/button.js';
+export interface MobileButtonProps extends ButtonProps {
+}
+export declare const MobileButton: React.ForwardRefExoticComponent<Omit<MobileButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=mobile_button.d.ts.map

package/dist/mobile/actions/button/mobile_button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile_button.d.ts","sourceRoot":"","sources":["../../../../src/mobile/actions/button/mobile_button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,0CAA0C,CAAC;AAGpF,MAAM,WAAW,iBAAkB,SAAQ,WAAW;CAAG;AAEzD,eAAO,MAAM,YAAY,0GAkBxB,CAAC"}

package/dist/mobile/actions/button/mobile_button.js

@@ -0,0 +1,21 @@
+import { jsx as o } from "react/jsx-runtime";
+import l from "react";
+import { clsx as e } from "clsx";
+import { Button as u } from "../../../actions/button/button/button.js";
+import '../../../mobile_button.css';const s = "_mobile-button_44bdeb0", r = "_mobile-button-text_4d530ed", n = { "mobile-button": s, "mobile-button-text": r }, _ = l.forwardRef(
+  function({ children: t, className: b, ...m }, i) {
+    return /* @__PURE__ */ o(
+      u,
+      {
+        ref: i,
+        className: e(n["mobile-button"], "tcn-mobile-button", b),
+        ...m,
+        children: typeof t == "string" ? /* @__PURE__ */ o("span", { className: e(n["mobile-button-text"], "tcn-mobile-button-text"), children: t }) : t
+      }
+    );
+  }
+);
+export {
+  _ as MobileButton
+};
+//# sourceMappingURL=mobile_button.js.map

package/dist/mobile/actions/button/mobile_button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile_button.js","sources":["../../../../src/mobile/actions/button/mobile_button.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { Button, type ButtonProps } from '../../../actions/button/button/button.js';\nimport styles from './mobile_button.module.css';\n\nexport interface MobileButtonProps extends ButtonProps {}\n\nexport const MobileButton = React.forwardRef<HTMLButtonElement, MobileButtonProps>(\n  function MobileButton({ children, className, ...props }, ref) {\n    return (\n      <Button\n        ref={ref}\n        className={clsx(styles['mobile-button'], 'tcn-mobile-button', className)}\n        {...props}\n      >\n        {typeof children === 'string' ? (\n          <span className={clsx(styles['mobile-button-text'], 'tcn-mobile-button-text')}>\n            {children}\n          </span>\n        ) : (\n          children\n        )}\n      </Button>\n    );\n  }\n);\n"],"names":["MobileButton","React","children","className","props","ref","jsx","Button","clsx","styles"],"mappings":";;;;4HAOaA,IAAeC,EAAM;AAAA,EAChC,SAAsB,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,EAAA,GAASC,GAAK;AAC5D,WACE,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,KAAAF;AAAA,QACA,WAAWG,EAAKC,EAAO,eAAe,GAAG,qBAAqBN,CAAS;AAAA,QACtE,GAAGC;AAAA,QAEH,UAAA,OAAOF,KAAa,WACnB,gBAAAI,EAAC,QAAA,EAAK,WAAWE,EAAKC,EAAO,oBAAoB,GAAG,wBAAwB,GACzE,UAAAP,GACH,IAEAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;"}

package/dist/mobile/actions/floating_action_button/floating_action_button.d.ts

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+import { ButtonProps } from '../../../actions/button/button/button.js';
+export interface FloatingActionButtonProps extends ButtonProps {
+}
+export declare const FloatingActionButton: React.ForwardRefExoticComponent<Omit<FloatingActionButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=floating_action_button.d.ts.map

package/dist/mobile/actions/floating_action_button/floating_action_button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"floating_action_button.d.ts","sourceRoot":"","sources":["../../../../src/mobile/actions/floating_action_button/floating_action_button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,0CAA0C,CAAC;AAGpF,MAAM,WAAW,yBAA0B,SAAQ,WAAW;CAAG;AAEjE,eAAO,MAAM,oBAAoB,kHAiB/B,CAAC"}

package/dist/mobile/actions/floating_action_button/floating_action_button.js

@@ -0,0 +1,20 @@
+import { jsx as f } from "react/jsx-runtime";
+import c from "react";
+import { clsx as s } from "clsx";
+import { Button as i } from "../../../actions/button/button/button.js";
+import '../../../floating_action_button.css';const m = "_fab_b64d221", e = { fab: m }, _ = c.forwardRef(function({ children: t, className: o, hierarchy: n = "secondary", ...r }, a) {
+  return /* @__PURE__ */ f(
+    i,
+    {
+      ref: a,
+      className: s(e.fab, "tcn-fab", o),
+      hierarchy: n,
+      ...r,
+      children: t
+    }
+  );
+});
+export {
+  _ as FloatingActionButton
+};
+//# sourceMappingURL=floating_action_button.js.map

package/dist/mobile/actions/floating_action_button/floating_action_button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"floating_action_button.js","sources":["../../../../src/mobile/actions/floating_action_button/floating_action_button.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { Button, type ButtonProps } from '../../../actions/button/button/button.js';\nimport styles from './floating_action_button.module.css';\n\nexport interface FloatingActionButtonProps extends ButtonProps {}\n\nexport const FloatingActionButton = React.forwardRef<\n  HTMLButtonElement,\n  FloatingActionButtonProps\n>(function FloatingActionButton(\n  { children, className, hierarchy = 'secondary', ...props },\n  ref\n) {\n  return (\n    <Button\n      ref={ref}\n      className={clsx(styles.fab, 'tcn-fab', className)}\n      hierarchy={hierarchy}\n      {...props}\n    >\n      {children}\n    </Button>\n  );\n});\n"],"names":["FloatingActionButton","React","children","className","hierarchy","props","ref","jsx","Button","clsx","styles"],"mappings":";;;;0CAOaA,IAAuBC,EAAM,WAGxC,SACA,EAAE,UAAAC,GAAU,WAAAC,GAAW,WAAAC,IAAY,aAAa,GAAGC,EAAA,GACnDC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,WAAWG,EAAKC,EAAO,KAAK,WAAWP,CAAS;AAAA,MAChD,WAAAC;AAAA,MACC,GAAGC;AAAA,MAEH,UAAAH;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}

package/dist/mobile/inputs/date_picker/mobile_date_picker.d.ts

@@ -0,0 +1,17 @@
+import { default as React } from 'react';
+import { DatePickerPresenter } from '../../../inputs/date_picker/date_picker_presenter.js';
+export interface MobileDatePickerProps {
+    value: Date | null;
+    disabled?: boolean;
+    onChange?: (value: Date | null) => void;
+    onError?: (error: string | null) => void;
+    min?: Date | null;
+    max?: Date | null;
+    disabledDates?: Date[];
+    countryCode?: string;
+    renderActions?: (datePickerPresenter: DatePickerPresenter) => React.ReactNode;
+    selectMonthMessage?: string;
+    selectYearMessage?: string;
+}
+export declare const MobileDatePicker: React.ForwardRefExoticComponent<MobileDatePickerProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=mobile_date_picker.d.ts.map

package/dist/mobile/inputs/date_picker/mobile_date_picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile_date_picker.d.ts","sourceRoot":"","sources":["../../../../src/mobile/inputs/date_picker/mobile_date_picker.tsx"],"names":[],"mappings":"AAIA,OAAO,KAA4C,MAAM,OAAO,CAAC;AAGjE,OAAO,EAAE,mBAAmB,EAAE,MAAM,sDAAsD,CAAC;AAG3F,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACxC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACzC,GAAG,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAClB,GAAG,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAClB,aAAa,CAAC,EAAE,IAAI,EAAE,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,mBAAmB,EAAE,mBAAmB,KAAK,KAAK,CAAC,SAAS,CAAC;IAC9E,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,eAAO,MAAM,gBAAgB,8FA6F3B,CAAC"}

package/dist/mobile/inputs/date_picker/mobile_date_picker.js

@@ -0,0 +1,80 @@
+import { jsx as r, jsxs as b } from "react/jsx-runtime";
+import { useSignalValue as _, useSignalValueEffect as u } from "@tcn/state";
+import { Spacer as B } from "../../../stacks/spacer.js";
+import { VStack as a } from "../../../stacks/v_stack.js";
+import { clsx as h } from "clsx";
+import y, { useRef as R, useState as V, useLayoutEffect as o } from "react";
+import { MobileDatePickerBody as j } from "./mobile_date_picker_body.js";
+import { MobileDatePickerHeader as F } from "./mobile_date_picker_header.js";
+import { DatePickerPresenter as I } from "../../../inputs/date_picker/date_picker_presenter.js";
+import '../../../mobile_date_picker.css';const N = "_mobile-date-picker_a4f6410", Y = "_mobile-date-picker-box_d3c7945", k = { "mobile-date-picker": N, "mobile-date-picker-box": Y }, T = y.forwardRef(function({
+  value: t,
+  disabled: x,
+  onChange: c,
+  onError: s,
+  min: n = null,
+  max: m = null,
+  disabledDates: l,
+  countryCode: d = "en-US",
+  renderActions: f,
+  selectMonthMessage: D,
+  selectYearMessage: g
+}, M) {
+  const p = R(!1), [e] = V(() => {
+    const i = /* @__PURE__ */ new Date(), w = t == null ? i.getFullYear() : t.getFullYear(), S = t == null ? i.getMonth() : t.getMonth();
+    return new I(t, w, S, !1);
+  }), P = _(e.stateBroadcast).error;
+  return u((i) => {
+    P !== i && s && s(i);
+  }, e.errorBroadcast), u((i) => {
+    p.current ? c && c(i) : p.current = !0;
+  }, e.valueBroadcast), o(() => {
+    e.initialize();
+  }, [e]), o(() => {
+    e.setMinDate(n);
+  }, [e, n]), o(() => {
+    e.setMaxDate(m);
+  }, [e, m]), o(() => {
+    l == null ? e.setDisabledDates([]) : e.setDisabledDates(l);
+  }, [e, l]), o(() => {
+    e.selectDate(t);
+  }, [e, t]), /* @__PURE__ */ r(
+    a,
+    {
+      ref: M,
+      width: "flex",
+      height: "flex",
+      className: h(k["mobile-date-picker"], "tcn-mobile-date-picker"),
+      tabIndex: 0,
+      children: /* @__PURE__ */ b(
+        a,
+        {
+          height: "flex",
+          width: "100%",
+          className: h(k["mobile-date-picker-box"], "tcn-mobile-date-picker-box"),
+          "data-is-disabled": x,
+          children: [
+            /* @__PURE__ */ b(a, { height: "auto", width: "100%", children: [
+              /* @__PURE__ */ r(
+                F,
+                {
+                  selectMonthMessage: D,
+                  selectYearMessage: g,
+                  countryCode: d,
+                  presenter: e
+                }
+              ),
+              /* @__PURE__ */ r(j, { countryCode: d, presenter: e })
+            ] }),
+            f && /* @__PURE__ */ r(a, { paddingInline: "8px", children: f(e) }),
+            /* @__PURE__ */ r(B, { height: "8px" })
+          ]
+        }
+      )
+    }
+  );
+});
+export {
+  T as MobileDatePicker
+};
+//# sourceMappingURL=mobile_date_picker.js.map

package/dist/mobile/inputs/date_picker/mobile_date_picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile_date_picker.js","sources":["../../../../src/mobile/inputs/date_picker/mobile_date_picker.tsx"],"sourcesContent":["import { useSignalValue, useSignalValueEffect } from '@tcn/state';\nimport { Spacer } from '../../../stacks/spacer.js';\nimport { VStack } from '../../../stacks/v_stack.js';\nimport { clsx } from 'clsx';\nimport React, { useLayoutEffect, useRef, useState } from 'react';\nimport { MobileDatePickerBody } from './mobile_date_picker_body.js';\nimport { MobileDatePickerHeader } from './mobile_date_picker_header.js';\nimport { DatePickerPresenter } from '../../../inputs/date_picker/date_picker_presenter.js';\nimport styles from './mobile_date_picker.module.css';\n\nexport interface MobileDatePickerProps {\n  value: Date | null;\n  disabled?: boolean;\n  onChange?: (value: Date | null) => void;\n  onError?: (error: string | null) => void;\n  min?: Date | null;\n  max?: Date | null;\n  disabledDates?: Date[];\n  countryCode?: string;\n  renderActions?: (datePickerPresenter: DatePickerPresenter) => React.ReactNode;\n  selectMonthMessage?: string;\n  selectYearMessage?: string;\n}\n\nexport const MobileDatePicker = React.forwardRef(function MobileDatePicker(\n  {\n    value,\n    disabled,\n    onChange,\n    onError,\n    min: minDate = null,\n    max: maxDate = null,\n    disabledDates,\n    countryCode = 'en-US',\n    renderActions,\n    selectMonthMessage,\n    selectYearMessage,\n  }: MobileDatePickerProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const isMountedRef = useRef(false);\n  const [presenter] = useState(() => {\n    const today = new Date();\n\n    const year = value == null ? today.getFullYear() : value.getFullYear();\n    const month = value == null ? today.getMonth() : value.getMonth();\n\n    return new DatePickerPresenter(value, year, month, false);\n  });\n\n  const state = useSignalValue(presenter.stateBroadcast);\n  const error = state.error;\n\n  useSignalValueEffect<string | null>(innerError => {\n    error !== innerError && onError && onError(innerError);\n  }, presenter.errorBroadcast);\n\n  useSignalValueEffect<Date | null>(value => {\n    if (isMountedRef.current) {\n      onChange && onChange(value);\n    } else {\n      isMountedRef.current = true;\n    }\n  }, presenter.valueBroadcast);\n\n  useLayoutEffect(() => {\n    presenter.initialize();\n  }, [presenter]);\n\n  useLayoutEffect(() => {\n    presenter.setMinDate(minDate);\n  }, [presenter, minDate]);\n\n  useLayoutEffect(() => {\n    presenter.setMaxDate(maxDate);\n  }, [presenter, maxDate]);\n\n  useLayoutEffect(() => {\n    if (disabledDates == null) {\n      presenter.setDisabledDates([]);\n    } else {\n      presenter.setDisabledDates(disabledDates);\n    }\n  }, [presenter, disabledDates]);\n\n  useLayoutEffect(() => {\n    presenter.selectDate(value);\n  }, [presenter, value]);\n\n  return (\n    <VStack\n      ref={ref}\n      width=\"flex\"\n      height=\"flex\"\n      className={clsx(styles['mobile-date-picker'], 'tcn-mobile-date-picker')}\n      tabIndex={0}\n    >\n      <VStack\n        height=\"flex\"\n        width=\"100%\"\n        className={clsx(styles['mobile-date-picker-box'], 'tcn-mobile-date-picker-box')}\n        data-is-disabled={disabled}\n      >\n        <VStack height=\"auto\" width=\"100%\">\n          <MobileDatePickerHeader\n            selectMonthMessage={selectMonthMessage}\n            selectYearMessage={selectYearMessage}\n            countryCode={countryCode}\n            presenter={presenter}\n          />\n          <MobileDatePickerBody countryCode={countryCode} presenter={presenter} />\n        </VStack>\n        {renderActions && <VStack paddingInline=\"8px\">{renderActions(presenter)}</VStack>}\n        <Spacer height=\"8px\" />\n      </VStack>\n    </VStack>\n  );\n});\n"],"names":["MobileDatePicker","React","value","disabled","onChange","onError","minDate","maxDate","disabledDates","countryCode","renderActions","selectMonthMessage","selectYearMessage","ref","isMountedRef","useRef","presenter","useState","today","year","month","DatePickerPresenter","error","useSignalValue","useSignalValueEffect","innerError","useLayoutEffect","jsx","VStack","clsx","styles","jsxs","MobileDatePickerHeader","MobileDatePickerBody","Spacer"],"mappings":";;;;;;;;;8IAwBaA,IAAmBC,EAAM,WAAW,SAC/C;AAAA,EACE,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,KAAKC,IAAU;AAAA,EACf,KAAKC,IAAU;AAAA,EACf,eAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,eAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,mBAAAC;AACF,GACAC,GACA;AACA,QAAMC,IAAeC,EAAO,EAAK,GAC3B,CAACC,CAAS,IAAIC,EAAS,MAAM;AACjC,UAAMC,wBAAY,KAAA,GAEZC,IAAOjB,KAAS,OAAOgB,EAAM,YAAA,IAAgBhB,EAAM,YAAA,GACnDkB,IAAQlB,KAAS,OAAOgB,EAAM,SAAA,IAAahB,EAAM,SAAA;AAEvD,WAAO,IAAImB,EAAoBnB,GAAOiB,GAAMC,GAAO,EAAK;AAAA,EAC1D,CAAC,GAGKE,IADQC,EAAeP,EAAU,cAAc,EACjC;AAEpB,SAAAQ,EAAoC,CAAAC,MAAc;AAChD,IAAAH,MAAUG,KAAcpB,KAAWA,EAAQoB,CAAU;AAAA,EACvD,GAAGT,EAAU,cAAc,GAE3BQ,EAAkC,CAAAtB,MAAS;AACzC,IAAIY,EAAa,UACfV,KAAYA,EAASF,CAAK,IAE1BY,EAAa,UAAU;AAAA,EAE3B,GAAGE,EAAU,cAAc,GAE3BU,EAAgB,MAAM;AACpB,IAAAV,EAAU,WAAA;AAAA,EACZ,GAAG,CAACA,CAAS,CAAC,GAEdU,EAAgB,MAAM;AACpB,IAAAV,EAAU,WAAWV,CAAO;AAAA,EAC9B,GAAG,CAACU,GAAWV,CAAO,CAAC,GAEvBoB,EAAgB,MAAM;AACpB,IAAAV,EAAU,WAAWT,CAAO;AAAA,EAC9B,GAAG,CAACS,GAAWT,CAAO,CAAC,GAEvBmB,EAAgB,MAAM;AACpB,IAAIlB,KAAiB,OACnBQ,EAAU,iBAAiB,EAAE,IAE7BA,EAAU,iBAAiBR,CAAa;AAAA,EAE5C,GAAG,CAACQ,GAAWR,CAAa,CAAC,GAE7BkB,EAAgB,MAAM;AACpB,IAAAV,EAAU,WAAWd,CAAK;AAAA,EAC5B,GAAG,CAACc,GAAWd,CAAK,CAAC,GAGnB,gBAAAyB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAf;AAAA,MACA,OAAM;AAAA,MACN,QAAO;AAAA,MACP,WAAWgB,EAAKC,EAAO,oBAAoB,GAAG,wBAAwB;AAAA,MACtE,UAAU;AAAA,MAEV,UAAA,gBAAAC;AAAA,QAACH;AAAA,QAAA;AAAA,UACC,QAAO;AAAA,UACP,OAAM;AAAA,UACN,WAAWC,EAAKC,EAAO,wBAAwB,GAAG,4BAA4B;AAAA,UAC9E,oBAAkB3B;AAAA,UAElB,UAAA;AAAA,YAAA,gBAAA4B,EAACH,GAAA,EAAO,QAAO,QAAO,OAAM,QAC1B,UAAA;AAAA,cAAA,gBAAAD;AAAA,gBAACK;AAAA,gBAAA;AAAA,kBACC,oBAAArB;AAAA,kBACA,mBAAAC;AAAA,kBACA,aAAAH;AAAA,kBACA,WAAAO;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEF,gBAAAW,EAACM,GAAA,EAAqB,aAAAxB,GAA0B,WAAAO,EAAA,CAAsB;AAAA,YAAA,GACxE;AAAA,YACCN,KAAiB,gBAAAiB,EAACC,GAAA,EAAO,eAAc,OAAO,UAAAlB,EAAcM,CAAS,GAAE;AAAA,YACxE,gBAAAW,EAACO,GAAA,EAAO,QAAO,MAAA,CAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACvB;AAAA,EAAA;AAGN,CAAC;"}

package/dist/mobile/inputs/date_picker/mobile_date_picker_body.d.ts

@@ -0,0 +1,7 @@
+import { DatePickerPresenter } from '../../../inputs/date_picker/date_picker_presenter.js';
+export interface MobileDatePickerBodyProps {
+    presenter: DatePickerPresenter;
+    countryCode: string;
+}
+export declare function MobileDatePickerBody({ presenter, countryCode, }: MobileDatePickerBodyProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=mobile_date_picker_body.d.ts.map

package/dist/mobile/inputs/date_picker/mobile_date_picker_body.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile_date_picker_body.d.ts","sourceRoot":"","sources":["../../../../src/mobile/inputs/date_picker/mobile_date_picker_body.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sDAAsD,CAAC;AAEhG,MAAM,WAAW,yBAAyB;IACxC,SAAS,EAAE,mBAAmB,CAAC;IAC/B,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,WAAW,GACZ,EAAE,yBAAyB,2CAsC3B"}

package/dist/mobile/inputs/date_picker/mobile_date_picker_body.js

@@ -0,0 +1,35 @@
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import s from "react";
+import { useSignalValue as f } from "@tcn/state";
+import { HStack as h } from "../../../stacks/h_stack.js";
+import { Spacer as c } from "../../../stacks/spacer.js";
+import { VStack as u } from "../../../stacks/v_stack.js";
+import { MobileDatePickerDate as d } from "./mobile_date_picker_date.js";
+import { MobileDatePickerDay as g } from "./mobile_date_picker_day.js";
+function P({
+  presenter: i,
+  countryCode: l
+}) {
+  const { visibleDates: o } = f(i.stateBroadcast), a = [];
+  for (let t = 0; t < o.length; t += 7)
+    a.push(o.slice(t, t + 7));
+  return /* @__PURE__ */ m(u, { height: "auto", width: "100%", className: "tcn-mobile-date-picker-body", children: [
+    /* @__PURE__ */ e(h, { height: "auto", width: "100%", children: new Array(7).fill(0).map((t, r) => /* @__PURE__ */ e(
+      g,
+      {
+        countryCode: l,
+        dayOfTheWeek: r
+      },
+      r
+    )) }),
+    /* @__PURE__ */ e(c, { height: "2px" }),
+    a.map((t, r) => /* @__PURE__ */ m(s.Fragment, { children: [
+      /* @__PURE__ */ e(h, { height: "auto", width: "100%", children: t.map((p, n) => /* @__PURE__ */ e(d, { date: p, presenter: i }, n)) }, r),
+      /* @__PURE__ */ e(c, { height: "1px" })
+    ] }, r))
+  ] });
+}
+export {
+  P as MobileDatePickerBody
+};
+//# sourceMappingURL=mobile_date_picker_body.js.map

package/dist/mobile/inputs/date_picker/mobile_date_picker_body.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile_date_picker_body.js","sources":["../../../../src/mobile/inputs/date_picker/mobile_date_picker_body.tsx"],"sourcesContent":["import React from 'react';\nimport { useSignalValue } from '@tcn/state';\nimport { HStack } from '../../../stacks/h_stack.js';\nimport { Spacer } from '../../../stacks/spacer.js';\nimport { VStack } from '../../../stacks/v_stack.js';\nimport type { CalendarDate } from '../../../utils/calendar/calendar_date.js';\nimport { MobileDatePickerDate } from './mobile_date_picker_date.js';\nimport { MobileDatePickerDay } from './mobile_date_picker_day.js';\nimport type { DatePickerPresenter } from '../../../inputs/date_picker/date_picker_presenter.js';\n\nexport interface MobileDatePickerBodyProps {\n  presenter: DatePickerPresenter;\n  countryCode: string;\n}\n\nexport function MobileDatePickerBody({\n  presenter,\n  countryCode,\n}: MobileDatePickerBodyProps) {\n  const { visibleDates } = useSignalValue(presenter.stateBroadcast);\n  const rows: CalendarDate[][] = [];\n\n  for (let i = 0; i < visibleDates.length; i += 7) {\n    rows.push(visibleDates.slice(i, i + 7));\n  }\n\n  return (\n    <VStack height=\"auto\" width=\"100%\" className=\"tcn-mobile-date-picker-body\">\n      <HStack height=\"auto\" width=\"100%\">\n        {new Array(7).fill(0).map((_, index) => {\n          return (\n            <MobileDatePickerDay\n              key={index}\n              countryCode={countryCode}\n              dayOfTheWeek={index}\n            />\n          );\n        })}\n      </HStack>\n      <Spacer height=\"2px\" />\n      {rows.map((dates, index) => {\n        return (\n          <React.Fragment key={index}>\n            <HStack key={index} height=\"auto\" width=\"100%\">\n              {dates.map((date, index) => {\n                return (\n                  <MobileDatePickerDate key={index} date={date} presenter={presenter} />\n                );\n              })}\n            </HStack>\n            <Spacer height=\"1px\" />\n          </React.Fragment>\n        );\n      })}\n    </VStack>\n  );\n}\n"],"names":["MobileDatePickerBody","presenter","countryCode","visibleDates","useSignalValue","rows","i","VStack","jsx","HStack","_","index","MobileDatePickerDay","Spacer","dates","jsxs","React","date","MobileDatePickerDate"],"mappings":";;;;;;;;AAeO,SAASA,EAAqB;AAAA,EACnC,WAAAC;AAAA,EACA,aAAAC;AACF,GAA8B;AAC5B,QAAM,EAAE,cAAAC,EAAA,IAAiBC,EAAeH,EAAU,cAAc,GAC1DI,IAAyB,CAAA;AAE/B,WAASC,IAAI,GAAGA,IAAIH,EAAa,QAAQG,KAAK;AAC5C,IAAAD,EAAK,KAAKF,EAAa,MAAMG,GAAGA,IAAI,CAAC,CAAC;AAGxC,2BACGC,GAAA,EAAO,QAAO,QAAO,OAAM,QAAO,WAAU,+BAC3C,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EAAO,QAAO,QAAO,OAAM,QACzB,UAAA,IAAI,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE,IAAI,CAACC,GAAGC,MAE1B,gBAAAH;AAAA,MAACI;AAAA,MAAA;AAAA,QAEC,aAAAV;AAAA,QACA,cAAcS;AAAA,MAAA;AAAA,MAFTA;AAAA,IAAA,CAKV,EAAA,CACH;AAAA,IACA,gBAAAH,EAACK,GAAA,EAAO,QAAO,MAAA,CAAM;AAAA,IACpBR,EAAK,IAAI,CAACS,GAAOH,MAEd,gBAAAI,EAACC,EAAM,UAAN,EACC,UAAA;AAAA,MAAA,gBAAAR,EAACC,GAAA,EAAmB,QAAO,QAAO,OAAM,QACrC,UAAAK,EAAM,IAAI,CAACG,GAAMN,MAEd,gBAAAH,EAACU,GAAA,EAAiC,MAAAD,GAAY,WAAAhB,EAAA,GAAnBU,CAAyC,CAEvE,KALUA,CAMb;AAAA,MACA,gBAAAH,EAACK,GAAA,EAAO,QAAO,MAAA,CAAM;AAAA,IAAA,EAAA,GARFF,CASrB,CAEH;AAAA,EAAA,GACH;AAEJ;"}

package/dist/mobile/inputs/date_picker/mobile_date_picker_date.d.ts

@@ -0,0 +1,8 @@
+import { CalendarDate } from '../../../utils/calendar/calendar_date.js';
+import { DatePickerPresenter } from '../../../inputs/date_picker/date_picker_presenter.js';
+export interface MobileDatePickerDateProps {
+    date: CalendarDate;
+    presenter: DatePickerPresenter;
+}
+export declare function MobileDatePickerDate({ presenter, date: calendarDate, }: MobileDatePickerDateProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=mobile_date_picker_date.d.ts.map

package/dist/mobile/inputs/date_picker/mobile_date_picker_date.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile_date_picker_date.d.ts","sourceRoot":"","sources":["../../../../src/mobile/inputs/date_picker/mobile_date_picker_date.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0CAA0C,CAAC;AAC7E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sDAAsD,CAAC;AAIhG,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,YAAY,CAAC;IACnB,SAAS,EAAE,mBAAmB,CAAC;CAChC;AAED,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,IAAI,EAAE,YAAY,GACnB,EAAE,yBAAyB,2CAqF3B"}

package/dist/mobile/inputs/date_picker/mobile_date_picker_date.js

@@ -0,0 +1,74 @@
+import { jsx as a, jsxs as T } from "react/jsx-runtime";
+import { useSignalValue as b } from "@tcn/state";
+import { BodyText as w } from "../../../typography/body_text/body_text.js";
+import "../../../typography/callout/callout.js";
+import "../../../typography/caption/caption.js";
+import "../../../typography/footnote/footnote.js";
+import "../../../typography/headline/headline.js";
+import "../../../typography/subheadline/subheadline.js";
+import "../../../typography/title/title.js";
+import { ZStack as M } from "../../../stacks/z_stack.js";
+import { clsx as u } from "clsx";
+import '../../../mobile_date_picker_date.css';const D = "_mobile-date-picker-date_96ddea0", B = "_mobile-date-picker-today_36627c6", k = { "mobile-date-picker-date": D, "mobile-date-picker-today": B };
+function C({
+  presenter: i,
+  date: t
+}) {
+  const {
+    visibleMonth: f,
+    disabledDates: S,
+    min: m,
+    max: d
+  } = b(i.stateBroadcast), o = b(i.valueBroadcast);
+  let r = -1 / 0, c = 1 / 0;
+  if (m != null) {
+    const e = new Date(m);
+    e.setHours(0, 0, 0, 0), r = e.getTime();
+  }
+  if (d != null) {
+    const e = new Date(d);
+    e.setHours(23, 59, 59, 999), c = e.getTime();
+  }
+  const s = /* @__PURE__ */ new Date(), l = new Date(
+    t.year,
+    t.month,
+    t.date
+  ).getTime(), g = f === t.month, n = o?.getMonth() === t.month && o.getFullYear() === t.year && o.getDate() === t.date, h = S.some(
+    (e) => e.getMonth() === t.month && e.getFullYear() === t.year && e.getDate() === t.date
+  ), p = l >= r && l < c, y = s.getMonth() === t.month && s.getFullYear() === t.year && s.getDate() === t.date;
+  function x() {
+    const e = new Date(t.year, t.month, t.date);
+    if (n && i.stateBroadcast.get().showTime) {
+      i.clear();
+      return;
+    }
+    i.selectDate(e);
+  }
+  return /* @__PURE__ */ a(
+    "button",
+    {
+      disabled: !g || h || !p,
+      className: u(k["mobile-date-picker-date"], "tcn-date-picker-date"),
+      onClick: x,
+      "data-is-within-month": String(g),
+      "data-is-selected": String(n),
+      "data-is-disabled": String(h),
+      "data-is-within-range": String(p),
+      "data-is-today": String(y),
+      children: /* @__PURE__ */ T(M, { height: "100%", children: [
+        /* @__PURE__ */ a(w, { children: String(t.date) }),
+        y && /* @__PURE__ */ a(
+          "div",
+          {
+            className: u(k["mobile-date-picker-today"], "tcn-date-picker-today"),
+            "data-is-selected": String(n)
+          }
+        )
+      ] })
+    }
+  );
+}
+export {
+  C as MobileDatePickerDate
+};
+//# sourceMappingURL=mobile_date_picker_date.js.map

package/dist/mobile/inputs/date_picker/mobile_date_picker_date.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile_date_picker_date.js","sources":["../../../../src/mobile/inputs/date_picker/mobile_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 '../../../inputs/date_picker/date_picker_presenter.js';\nimport styles from './mobile_date_picker_date.module.css';\nimport { clsx } from 'clsx';\n\nexport interface MobileDatePickerDateProps {\n  date: CalendarDate;\n  presenter: DatePickerPresenter;\n}\n\nexport function MobileDatePickerDate({\n  presenter,\n  date: calendarDate,\n}: MobileDatePickerDateProps) {\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    const normalizedMinDate = new Date(minDate);\n    normalizedMinDate.setHours(0, 0, 0, 0);\n    minTime = normalizedMinDate.getTime();\n  }\n\n  if (maxDate != null) {\n    const 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['mobile-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['mobile-date-picker-today'], 'tcn-date-picker-today')}\n            data-is-selected={String(isSelected)}\n          ></div>\n        )}\n      </ZStack>\n    </button>\n  );\n}\n"],"names":["MobileDatePickerDate","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,EAAqB;AAAA,EACnC,WAAAC;AAAA,EACA,MAAMC;AACR,GAA8B;AAC5B,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,UAAMM,IAAoB,IAAI,KAAKN,CAAO;AAC1C,IAAAM,EAAkB,SAAS,GAAG,GAAG,GAAG,CAAC,GACrCF,IAAUE,EAAkB,QAAA;AAAA,EAC9B;AAEA,MAAIL,KAAW,MAAM;AACnB,UAAMM,IAAoB,IAAI,KAAKN,CAAO;AAC1C,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,yBAAyB,GAAG,sBAAsB;AAAA,MACzE,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,0BAA0B,GAAG,uBAAuB;AAAA,YAC3E,oBAAkB,OAAOR,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MACpC,EAAA,CAEL;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/mobile/inputs/date_picker/mobile_date_picker_day.d.ts

@@ -0,0 +1,6 @@
+export interface MobileDatePickerDayProps {
+    dayOfTheWeek: number;
+    countryCode: string;
+}
+export declare function MobileDatePickerDay({ dayOfTheWeek, countryCode, }: MobileDatePickerDayProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=mobile_date_picker_day.d.ts.map

package/dist/mobile/inputs/date_picker/mobile_date_picker_day.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile_date_picker_day.d.ts","sourceRoot":"","sources":["../../../../src/mobile/inputs/date_picker/mobile_date_picker_day.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,wBAAwB;IACvC,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,mBAAmB,CAAC,EAClC,YAAY,EACZ,WAAW,GACZ,EAAE,wBAAwB,2CAyB1B"}

package/dist/mobile/inputs/date_picker/mobile_date_picker_day.js

@@ -0,0 +1,39 @@
+import { jsx as a } from "react/jsx-runtime";
+import "../../../typography/body_text/body_text.js";
+import "../../../typography/callout/callout.js";
+import "../../../typography/caption/caption.js";
+import "../../../typography/footnote/footnote.js";
+import { Headline as c } from "../../../typography/headline/headline.js";
+import "../../../typography/subheadline/subheadline.js";
+import "../../../typography/title/title.js";
+import { ZStack as p } from "../../../stacks/z_stack.js";
+import { useMemo as s } from "react";
+import { clsx as i } from "clsx";
+import '../../../mobile_date_picker_day.css';const d = "_mobile-date-picker-day_562fbf3", o = { "mobile-date-picker-day": d };
+function g({
+  dayOfTheWeek: r,
+  countryCode: t
+}) {
+  const e = /* @__PURE__ */ new Date();
+  e.setDate(e.getDate() - e.getDay() + r);
+  const m = s(
+    () => new Intl.DateTimeFormat(t, { weekday: "short" }).format(e).toLocaleUpperCase(),
+    [t, e]
+  );
+  return /* @__PURE__ */ a(p, { className: i(o["mobile-date-picker-day"], "tcn-date-picker-day"), children: /* @__PURE__ */ a(
+    c,
+    {
+      size: "sm",
+      emphasis: "faint",
+      className: i(
+        o["mobile-date-picker-day-text"],
+        "tcn-date-picker-day-text"
+      ),
+      children: m[0]
+    }
+  ) });
+}
+export {
+  g as MobileDatePickerDay
+};
+//# sourceMappingURL=mobile_date_picker_day.js.map

package/dist/mobile/inputs/date_picker/mobile_date_picker_day.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile_date_picker_day.js","sources":["../../../../src/mobile/inputs/date_picker/mobile_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 './mobile_date_picker_day.module.css';\nimport { clsx } from 'clsx';\n\nexport interface MobileDatePickerDayProps {\n  dayOfTheWeek: number;\n  countryCode: string;\n}\n\nexport function MobileDatePickerDay({\n  dayOfTheWeek,\n  countryCode,\n}: MobileDatePickerDayProps) {\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['mobile-date-picker-day'], 'tcn-date-picker-day')}>\n      <Headline\n        size=\"sm\"\n        emphasis=\"faint\"\n        className={clsx(\n          styles['mobile-date-picker-day-text'],\n          'tcn-date-picker-day-text'\n        )}\n      >\n        {weekdayName[0]}\n      </Headline>\n    </ZStack>\n  );\n}\n"],"names":["MobileDatePickerDay","dayOfTheWeek","countryCode","date","weekdayName","useMemo","jsx","ZStack","clsx","styles","Headline"],"mappings":";;;;;;;;;;;;AAWO,SAASA,EAAoB;AAAA,EAClC,cAAAC;AAAA,EACA,aAAAC;AACF,GAA6B;AAC3B,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,wBAAwB,GAAG,qBAAqB,GAC7E,UAAA,gBAAAH;AAAA,IAACI;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAS;AAAA,MACT,WAAWF;AAAA,QACTC,EAAO,6BAA6B;AAAA,QACpC;AAAA,MAAA;AAAA,MAGD,YAAY,CAAC;AAAA,IAAA;AAAA,EAAA,GAElB;AAEJ;"}

package/dist/mobile/inputs/date_picker/mobile_date_picker_header.d.ts

@@ -0,0 +1,9 @@
+import { DatePickerPresenter } from '../../../inputs/date_picker/date_picker_presenter.js';
+export interface MobileDatePickerHeaderProps {
+    presenter: DatePickerPresenter;
+    countryCode: string;
+    selectMonthMessage?: string;
+    selectYearMessage?: string;
+}
+export declare function MobileDatePickerHeader({ presenter, countryCode, selectMonthMessage, selectYearMessage, }: MobileDatePickerHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=mobile_date_picker_header.d.ts.map

package/dist/mobile/inputs/date_picker/mobile_date_picker_header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile_date_picker_header.d.ts","sourceRoot":"","sources":["../../../../src/mobile/inputs/date_picker/mobile_date_picker_header.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,mBAAmB,EAAE,MAAM,sDAAsD,CAAC;AAW3F,MAAM,WAAW,2BAA2B;IAC1C,SAAS,EAAE,mBAAmB,CAAC;IAC/B,WAAW,EAAE,MAAM,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,wBAAgB,sBAAsB,CAAC,EACrC,SAAS,EACT,WAAW,EACX,kBAAmC,EACnC,iBAAiC,GAClC,EAAE,2BAA2B,2CAsJ7B"}

package/dist/mobile/inputs/date_picker/mobile_date_picker_header.js

@@ -0,0 +1,163 @@
+import { jsxs as i, Fragment as I, jsx as e } from "react/jsx-runtime";
+import { useSignalValue as L } from "@tcn/state";
+import { HStack as M } from "../../../stacks/h_stack.js";
+import { VStack as h } from "../../../stacks/v_stack.js";
+import { Spacer as v } from "../../../stacks/spacer.js";
+import { useState as k, useRef as d, useMemo as g } from "react";
+import { getMonthsOfYear as w } from "../../../utils/calendar/get_months_of_year.js";
+import { MobileDatePickerYearSelector as j } from "./mobile_date_picker_year_selector.js";
+import { MobileButton as n } from "../../actions/button/mobile_button.js";
+import { MobilePortal as x } from "../../portal/mobile_portal.js";
+import { MobileOverlayHeader as O } from "./mobile_overlay_header.js";
+import "../../../utils/click_away_listener.js";
+import { FocusRedirect as q } from "../../../utils/focus_redirect.js";
+import "../../../utils/scroll_away_listener.js";
+import "../../../utils/hooks/use_resize_observer.js";
+import "../../../utils/dnd/context.js";
+import { clsx as z } from "clsx";
+import "../../../draggable.module-BgelQsuJ.js";
+import { ChevronLeftIcon as E } from "@tcn/icons/chevron_left_icon.js";
+import { ChevronRightIcon as T } from "@tcn/icons/chevron_right_icon.js";
+import '../../../mobile_date_picker_header.css';const W = "_mobile-date-picker-header_0678759", G = "_mobile-date-picker-overlay_d1d8dc4", J = "_mobile-month-list_1081f6a", Q = "_mobile-year-overlay_daba362", l = { "mobile-date-picker-header": W, "mobile-date-picker-overlay": G, "mobile-month-list": J, "mobile-year-overlay": Q };
+function be({
+  presenter: r,
+  countryCode: a,
+  selectMonthMessage: R = "Select Month",
+  selectYearMessage: S = "Select Year"
+}) {
+  const t = L(r.stateBroadcast), [Y, f] = k(!1), [D, p] = k(!1), u = d(null), b = d(null), y = d(null), N = g(() => w(a, "long"), [a]), _ = g(() => w(a, "short"), [a]);
+  function C(o) {
+    r.setVisibleMonth(Number(o));
+  }
+  function P() {
+    r.setVisibleMonth(t.visibleMonth - 1);
+  }
+  function V() {
+    r.setVisibleMonth(t.visibleMonth + 1);
+  }
+  function B() {
+    f(!0);
+  }
+  function c() {
+    f(!1), requestAnimationFrame(() => u.current?.focus());
+  }
+  function F() {
+    p(!0);
+  }
+  function s() {
+    p(!1), requestAnimationFrame(() => b.current?.focus());
+  }
+  function H(o) {
+    o.key === "Escape" && c();
+  }
+  function K(o) {
+    o.key === "Escape" && s();
+  }
+  function A() {
+    y.current?.focus();
+  }
+  return /* @__PURE__ */ i(I, { children: [
+    /* @__PURE__ */ i(
+      M,
+      {
+        className: z(
+          l["mobile-date-picker-header"],
+          "tcn-mobile-date-picker-header"
+        ),
+        minWidth: "35px",
+        width: "100%",
+        children: [
+          /* @__PURE__ */ e(
+            n,
+            {
+              disabled: !t.canNavigateToPreviousMonth,
+              hierarchy: "tertiary",
+              width: "auto",
+              onClick: P,
+              children: /* @__PURE__ */ e(E, { flipOnRtl: !0, size: "md" })
+            }
+          ),
+          /* @__PURE__ */ e(v, {}),
+          /* @__PURE__ */ i(M, { hAlign: "center", gap: "4px", width: "auto", children: [
+            /* @__PURE__ */ e(
+              n,
+              {
+                ref: u,
+                hierarchy: "tertiary",
+                width: "auto",
+                onClick: B,
+                children: _[t.visibleMonth]
+              }
+            ),
+            /* @__PURE__ */ e(
+              n,
+              {
+                ref: b,
+                hierarchy: "tertiary",
+                width: "auto",
+                onClick: F,
+                children: String(t.visibleYear)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ e(v, {}),
+          /* @__PURE__ */ e(
+            n,
+            {
+              disabled: !t.canNavigateToNextMonth,
+              hierarchy: "tertiary",
+              width: "auto",
+              onClick: V,
+              children: /* @__PURE__ */ e(T, { flipOnRtl: !0, size: "md" })
+            }
+          )
+        ]
+      }
+    ),
+    Y && /* @__PURE__ */ e(x, { children: /* @__PURE__ */ i(
+      h,
+      {
+        className: l["mobile-date-picker-overlay"],
+        onKeyDown: H,
+        children: [
+          /* @__PURE__ */ e(O, { title: R, onClose: c }),
+          /* @__PURE__ */ i(
+            h,
+            {
+              ref: y,
+              tabIndex: 0,
+              padding: "16px",
+              gap: "8px",
+              height: "flex",
+              overflowY: "auto",
+              className: l["mobile-month-list"],
+              children: [
+                N.map((o, m) => /* @__PURE__ */ e(
+                  n,
+                  {
+                    hierarchy: m === t.visibleMonth ? "primary" : "secondary",
+                    width: "100%",
+                    onClick: () => {
+                      C(String(m)), c();
+                    },
+                    children: o
+                  },
+                  m
+                )),
+                /* @__PURE__ */ e(q, { onRedirect: A })
+              ]
+            }
+          )
+        ]
+      }
+    ) }),
+    D && /* @__PURE__ */ e(x, { children: /* @__PURE__ */ i(h, { className: l["mobile-year-overlay"], onKeyDown: K, children: [
+      /* @__PURE__ */ e(O, { title: S, onClose: s }),
+      /* @__PURE__ */ e(j, { presenter: r, onClose: s })
+    ] }) })
+  ] });
+}
+export {
+  be as MobileDatePickerHeader
+};
+//# sourceMappingURL=mobile_date_picker_header.js.map