@viasat/beam-react 2.56.0 → 2.58.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/chunks/{DateField.Segment.CwhRnhtq.js → DateField.Segment.BMXzpxgl.js} +27 -26
  3. package/chunks/DateField.Segment.BqMaeKLk.js +1 -0
  4. package/chunks/use-isomorphic-layout-effect.browser.esm.CkGv31zs.js +1 -0
  5. package/chunks/use-isomorphic-layout-effect.browser.esm.DERp5kr6.js +5 -0
  6. package/lib/wip/DataTable/DataTable.columns.cjs.js +1 -0
  7. package/lib/wip/DataTable/DataTable.columns.d.ts +26 -0
  8. package/lib/wip/DataTable/DataTable.columns.es.js +10 -0
  9. package/lib/wip/DataTable/index.cjs.js +1 -1
  10. package/lib/wip/DataTable/index.d.ts +2 -0
  11. package/lib/wip/DataTable/index.es.js +13 -11
  12. package/lib/wip/DateField/DateField.Segment.cjs.js +1 -1
  13. package/lib/wip/DateField/DateField.Segment.es.js +3 -2
  14. package/lib/wip/DateField/DateField.Segments.cjs.js +1 -1
  15. package/lib/wip/DateField/DateField.Segments.es.js +1 -1
  16. package/lib/wip/DateField/DateField.cjs.js +1 -1
  17. package/lib/wip/DateField/DateField.devWarnings.cjs.js +1 -0
  18. package/lib/wip/DateField/DateField.devWarnings.d.ts +15 -0
  19. package/lib/wip/DateField/DateField.devWarnings.es.js +22 -0
  20. package/lib/wip/DateField/DateField.es.js +186 -177
  21. package/lib/wip/DateField/DateField.utils.cjs.js +1 -1
  22. package/lib/wip/DateField/DateField.utils.d.ts +7 -5
  23. package/lib/wip/DateField/DateField.utils.es.js +84 -70
  24. package/lib/wip/ErrorBoundary/ErrorBoundary.cjs.js +1 -0
  25. package/lib/wip/ErrorBoundary/ErrorBoundary.d.ts +28 -0
  26. package/lib/wip/ErrorBoundary/ErrorBoundary.es.js +19 -0
  27. package/lib/wip/ErrorBoundary/index.cjs.js +1 -0
  28. package/lib/wip/ErrorBoundary/index.d.ts +2 -0
  29. package/lib/wip/ErrorBoundary/index.es.js +4 -0
  30. package/lib/wip/index.cjs.js +1 -1
  31. package/lib/wip/index.d.ts +1 -0
  32. package/lib/wip/index.es.js +17 -13
  33. package/package.json +7 -7
  34. package/utils/hooks/useId.cjs.js +1 -1
  35. package/utils/hooks/useId.es.js +7 -8
  36. package/chunks/DateField.Segment.CqFLhMYA.js +0 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,23 @@
1
+ ## 2.58.0 (2026-08-20)
2
+
3
+ ### 🚀 Features
4
+
5
+ - **DataTable:** column definitions (ColumnMeta + createBeamColumn) ([#1408](https://git.viasat.com/vega/Beam/pull/1408))
6
+
7
+ ### ❤️ Thank You
8
+
9
+ - Amarandei, Robert-Andrei
10
+
11
+ ## 2.57.0 (2026-08-20)
12
+
13
+ ### 🚀 Features
14
+
15
+ - **DateField:** SSR safety and error boundary ([#1399](https://git.viasat.com/vega/Beam/pull/1399))
16
+
17
+ ### ❤️ Thank You
18
+
19
+ - Roman-Ionita, Alin
20
+
1
21
  ## 2.56.0 (2026-08-20)
2
22
 
3
23
  ### 🚀 Features
@@ -1,16 +1,17 @@
1
1
  import "../assets/DateField.css";
2
2
  import { jsx as $ } from "react/jsx-runtime";
3
3
  import k from "clsx";
4
- import { useRef as I, useCallback as y, useLayoutEffect as B } from "react";
5
- import { g as L } from "./classNames.CA_0DokS.js";
6
- import { selectElementContents as P } from "../lib/wip/DateField/DateField.utils.es.js";
7
- const R = "date-field", { baseClassNamePrefix: W, classModifierPrefix: q, subElementClassPrefix: s } = L(R), S = {
4
+ import { useRef as I, useCallback as B } from "react";
5
+ import { i as P } from "./use-isomorphic-layout-effect.browser.esm.DERp5kr6.js";
6
+ import { g as R } from "./classNames.CA_0DokS.js";
7
+ import { selectElementContents as S } from "../lib/wip/DateField/DateField.utils.es.js";
8
+ const w = "date-field", { baseClassNamePrefix: q, classModifierPrefix: A, subElementClassPrefix: s } = R(w), y = {
8
9
  field: `${s}field`,
9
10
  segments: `${s}segments`,
10
11
  segment: `${s}segment`,
11
12
  separator: `${s}separator`,
12
13
  srStatus: `${s}sr-status`
13
- }, w = {
14
+ }, F = {
14
15
  "bm-light": "bm-light",
15
16
  "bm-dark": "bm-dark",
16
17
  "bm-inverse": "bm-inverse",
@@ -26,11 +27,11 @@ const R = "date-field", { baseClassNamePrefix: W, classModifierPrefix: q, subEle
26
27
  "bm-date-field__segments": "bm-date-field__segments",
27
28
  "bm-date-field__separator": "bm-date-field__separator",
28
29
  "bm-date-field__sr-status": "bm-date-field__sr-status"
29
- }, F = {
30
+ }, L = {
30
31
  day: "day",
31
32
  month: "month",
32
33
  year: "year"
33
- }, A = ({
34
+ }, H = ({
34
35
  type: r,
35
36
  value: u,
36
37
  valueMin: c,
@@ -39,32 +40,32 @@ const R = "date-field", { baseClassNamePrefix: W, classModifierPrefix: q, subEle
39
40
  isPlaceholder: p,
40
41
  valueText: g,
41
42
  invalid: C,
42
- role: i,
43
+ role: d,
43
44
  isActive: t,
44
45
  disabled: l,
45
46
  readOnly: m,
46
- onFocus: v,
47
- onBlur: x,
47
+ onFocus: x,
48
+ onBlur: v,
48
49
  onInput: E,
49
50
  onKeyDown: h,
50
51
  segmentRef: o
51
52
  }) => {
52
- const a = !l && !m, f = I(null), D = y(
53
+ const a = !l && !m, f = I(null), D = B(
53
54
  (e) => {
54
55
  f.current = e, o(e);
55
56
  },
56
57
  [o]
57
58
  ), M = (e) => {
58
59
  if (!a) return;
59
- const b = e.currentTarget, d = e.nativeEvent.data;
60
- d != null && d.length === 1 && E(r, d), b.textContent !== n && (b.textContent = n);
60
+ const b = e.currentTarget, i = e.nativeEvent.data;
61
+ i != null && i.length === 1 && E(r, i), b.textContent !== n && (b.textContent = n);
61
62
  };
62
- B(() => {
63
+ P(() => {
63
64
  if (!t || !a) return;
64
65
  const e = f.current;
65
- e && P(e);
66
+ e && S(e);
66
67
  }, [n, t, a]);
67
- const N = i === "spinbutton" ? {
68
+ const N = d === "spinbutton" ? {
68
69
  "aria-valuenow": u ?? void 0,
69
70
  "aria-valuemin": c,
70
71
  "aria-valuemax": _,
@@ -74,8 +75,8 @@ const R = "date-field", { baseClassNamePrefix: W, classModifierPrefix: q, subEle
74
75
  "span",
75
76
  {
76
77
  ref: D,
77
- role: i,
78
- "aria-label": F[r],
78
+ role: d,
79
+ "aria-label": L[r],
79
80
  ...N,
80
81
  "aria-disabled": l || void 0,
81
82
  "aria-readonly": m || void 0,
@@ -90,20 +91,20 @@ const R = "date-field", { baseClassNamePrefix: W, classModifierPrefix: q, subEle
90
91
  "data-segment": r,
91
92
  "data-active": t,
92
93
  "data-placeholder": p,
93
- onFocus: v,
94
- onBlur: x,
94
+ onFocus: x,
95
+ onBlur: v,
95
96
  onInput: M,
96
97
  onKeyDown: (e) => h(r, e),
97
98
  onMouseUp: (e) => e.preventDefault(),
98
- className: k(w[S.segment]),
99
+ className: k(F[y.segment]),
99
100
  children: n
100
101
  }
101
102
  );
102
103
  };
103
104
  export {
104
- A as D,
105
- S as a,
106
- W as b,
107
- q as c,
108
- w as s
105
+ H as D,
106
+ y as a,
107
+ q as b,
108
+ A as c,
109
+ F as s
109
110
  };
@@ -0,0 +1 @@
1
+ var T=require("../assets/DateField.css");const P=require("react/jsx-runtime"),R=require("clsx"),u=require("react"),$=require("./use-isomorphic-layout-effect.browser.esm.CkGv31zs.js"),k=require("./classNames.BFQUGnCN.js"),w=require("../lib/wip/DateField/DateField.utils.cjs.js"),y="date-field",{baseClassNamePrefix:S,classModifierPrefix:B,subElementClassPrefix:s}=k.getBEMClassNames(y),c={field:`${s}field`,segments:`${s}segments`,segment:`${s}segment`,separator:`${s}separator`,srStatus:`${s}sr-status`},_={"bm-light":"bm-light","bm-dark":"bm-dark","bm-inverse":"bm-inverse","bm-enterprise":"bm-enterprise","bm-consumer":"bm-consumer","bm-date-field":"bm-date-field","bm-date-field--disabled":"bm-date-field--disabled","bm-date-field--error":"bm-date-field--error","bm-date-field__field":"bm-date-field__field","bm-date-field__segment":"bm-date-field__segment","bm-date-field--read-only":"bm-date-field--read-only","bm-date-field--fluid":"bm-date-field--fluid","bm-date-field__segments":"bm-date-field__segments","bm-date-field__separator":"bm-date-field__separator","bm-date-field__sr-status":"bm-date-field__sr-status"},L={day:"day",month:"month",year:"year"},j=({type:i,value:g,valueMin:p,valueMax:C,displayValue:r,isPlaceholder:x,valueText:v,invalid:E,role:d,isActive:t,disabled:l,readOnly:o,onFocus:h,onBlur:D,onInput:N,onKeyDown:q,segmentRef:m})=>{const a=!l&&!o,f=u.useRef(null),F=u.useCallback(e=>{f.current=e,m(e)},[m]),M=e=>{if(!a)return;const b=e.currentTarget,n=e.nativeEvent.data;n!=null&&n.length===1&&N(i,n),b.textContent!==r&&(b.textContent=r)};$.index(()=>{if(!t||!a)return;const e=f.current;e&&w.selectElementContents(e)},[r,t,a]);const I=d==="spinbutton"?{"aria-valuenow":g??void 0,"aria-valuemin":p,"aria-valuemax":C,"aria-valuetext":v}:{"aria-multiline":!1};return P.jsx("span",{ref:F,role:d,"aria-label":L[i],...I,"aria-disabled":l||void 0,"aria-readonly":o||void 0,"aria-invalid":E||void 0,contentEditable:a&&t,suppressContentEditableWarning:!0,tabIndex:t?0:-1,inputMode:a?"numeric":void 0,spellCheck:!1,autoCorrect:"off",autoCapitalize:"off","data-segment":i,"data-active":t,"data-placeholder":x,onFocus:h,onBlur:D,onInput:M,onKeyDown:e=>q(i,e),onMouseUp:e=>e.preventDefault(),className:R(_[c.segment]),children:r})};exports.DateFieldSegment=j;exports.baseClassNamePrefix=S;exports.classModifierPrefix=B;exports.staticDateFieldClassNames=c;exports.styles=_;
@@ -0,0 +1 @@
1
+ "use strict";const e=require("react");var t=e.useLayoutEffect;exports.index=t;
@@ -0,0 +1,5 @@
1
+ import { useLayoutEffect as e } from "react";
2
+ var r = e;
3
+ export {
4
+ r as i
5
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function a(n){const{align:e,meta:t,...r}=n;return e===void 0?{...r,meta:t}:{...r,meta:{...t,align:e}}}exports.createBeamColumn=a;
@@ -0,0 +1,26 @@
1
+ import { ColumnMeta, RowData } from '@tanstack/react-table';
2
+ import { DataTableColumnDef } from './DataTable.types';
3
+ declare module '@tanstack/react-table' {
4
+ interface ColumnMeta<TData extends RowData, TValue> {
5
+ /** Horizontal alignment for the column's header and cell content. */
6
+ align?: 'left' | 'right';
7
+ }
8
+ }
9
+ /**
10
+ * Arguments for {@link createBeamColumn}: a standard {@link DataTableColumnDef}
11
+ * plus a top-level `align` convenience field.
12
+ */
13
+ export type CreateBeamColumnArgs<TData extends RowData, TValue = unknown> = DataTableColumnDef<TData, TValue> & {
14
+ /** Horizontal alignment; folded into `meta.align`. */
15
+ align?: ColumnMeta<TData, TValue>['align'];
16
+ };
17
+ /**
18
+ * Folds `align` into `meta.align` instead of introducing a new stored column
19
+ * type. Pure authoring convenience with no runtime meaning of its own — a
20
+ * hand-written `meta: { align: 'right' }` renders identically. Merges into an
21
+ * existing `meta` rather than clobbering it.
22
+ *
23
+ * @param column - {@link CreateBeamColumnArgs}.
24
+ * @returns A plain {@link DataTableColumnDef} with no top-level `align`.
25
+ */
26
+ export declare function createBeamColumn<TData extends RowData, TValue = unknown>(column: CreateBeamColumnArgs<TData, TValue>): DataTableColumnDef<TData, TValue>;
@@ -0,0 +1,10 @@
1
+ function a(r) {
2
+ const { align: e, meta: t, ...n } = r;
3
+ return e === void 0 ? { ...n, meta: t } : {
4
+ ...n,
5
+ meta: { ...t, align: e }
6
+ };
7
+ }
8
+ export {
9
+ a as createBeamColumn
10
+ };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./DataTable.cjs.js"),l=require("./DataTable.Header.cjs.js"),t=require("./DataTable.Toolbar.cjs.js"),b=require("./DataTable.Head.cjs.js"),T=require("./DataTable.ColumnHeader.cjs.js"),D=require("./DataTable.Body.cjs.js"),r=require("./DataTable.Row.cjs.js"),_=require("./DataTable.Cell.cjs.js"),o=require("./DataTable.Footer.cjs.js"),a=require("./DataTable.context.cjs.js"),i=require("./useBeamTable.cjs.js");exports.DataTable=e.DataTable;exports.DataTableHeader=l.DataTableHeader;exports.DataTableToolbar=t.DataTableToolbar;exports.DataTableHead=b.DataTableHead;exports.DataTableColumnHeader=T.DataTableColumnHeader;exports.DataTableBody=D.DataTableBody;exports.DataTableRow=r.DataTableRow;exports.DataTableCell=_.DataTableCell;exports.DataTableFooter=o.DataTableFooter;exports.DataTableProvider=a.DataTableProvider;exports.useDataTable=a.useDataTable;exports.useBeamTable=i.useBeamTable;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./DataTable.cjs.js"),l=require("./DataTable.Header.cjs.js"),t=require("./DataTable.Toolbar.cjs.js"),b=require("./DataTable.Head.cjs.js"),T=require("./DataTable.ColumnHeader.cjs.js"),r=require("./DataTable.Body.cjs.js"),_=require("./DataTable.Row.cjs.js"),D=require("./DataTable.Cell.cjs.js"),o=require("./DataTable.Footer.cjs.js"),a=require("./DataTable.context.cjs.js"),i=require("./useBeamTable.cjs.js"),u=require("./DataTable.columns.cjs.js");exports.DataTable=e.DataTable;exports.DataTableHeader=l.DataTableHeader;exports.DataTableToolbar=t.DataTableToolbar;exports.DataTableHead=b.DataTableHead;exports.DataTableColumnHeader=T.DataTableColumnHeader;exports.DataTableBody=r.DataTableBody;exports.DataTableRow=_.DataTableRow;exports.DataTableCell=D.DataTableCell;exports.DataTableFooter=o.DataTableFooter;exports.DataTableProvider=a.DataTableProvider;exports.useDataTable=a.useDataTable;exports.useBeamTable=i.useBeamTable;exports.createBeamColumn=u.createBeamColumn;
@@ -9,5 +9,7 @@ export { DataTableCell } from './DataTable.Cell';
9
9
  export { DataTableFooter } from './DataTable.Footer';
10
10
  export { DataTableProvider, useDataTable } from './DataTable.context';
11
11
  export { useBeamTable } from './useBeamTable';
12
+ export { createBeamColumn } from './DataTable.columns';
12
13
  export type { DataTableProps, DataTableColumnDef, DataTableHeaderProps, DataTableToolbarProps, DataTableHeadProps, DataTableColumnHeaderProps, DataTableBodyProps, DataTableRowProps, DataTableCellProps, DataTableFooterProps, } from './DataTable.types';
13
14
  export type { UseBeamTableArgs } from './useBeamTable';
15
+ export type { CreateBeamColumnArgs } from './DataTable.columns';
@@ -1,25 +1,27 @@
1
1
  import { DataTable as o } from "./DataTable.es.js";
2
2
  import { DataTableHeader as t } from "./DataTable.Header.es.js";
3
- import { DataTableToolbar as b } from "./DataTable.Toolbar.es.js";
3
+ import { DataTableToolbar as m } from "./DataTable.Toolbar.es.js";
4
4
  import { DataTableHead as T } from "./DataTable.Head.es.js";
5
5
  import { DataTableColumnHeader as p } from "./DataTable.ColumnHeader.es.js";
6
6
  import { DataTableBody as D } from "./DataTable.Body.es.js";
7
7
  import { DataTableRow as u } from "./DataTable.Row.es.js";
8
- import { DataTableCell as s } from "./DataTable.Cell.es.js";
9
- import { DataTableFooter as C } from "./DataTable.Footer.es.js";
10
- import { DataTableProvider as n, useDataTable as v } from "./DataTable.context.es.js";
11
- import { useBeamTable as y } from "./useBeamTable.es.js";
8
+ import { DataTableCell as C } from "./DataTable.Cell.es.js";
9
+ import { DataTableFooter as n } from "./DataTable.Footer.es.js";
10
+ import { DataTableProvider as c, useDataTable as i } from "./DataTable.context.es.js";
11
+ import { useBeamTable as w } from "./useBeamTable.es.js";
12
+ import { createBeamColumn as F } from "./DataTable.columns.es.js";
12
13
  export {
13
14
  o as DataTable,
14
15
  D as DataTableBody,
15
- s as DataTableCell,
16
+ C as DataTableCell,
16
17
  p as DataTableColumnHeader,
17
- C as DataTableFooter,
18
+ n as DataTableFooter,
18
19
  T as DataTableHead,
19
20
  t as DataTableHeader,
20
- n as DataTableProvider,
21
+ c as DataTableProvider,
21
22
  u as DataTableRow,
22
- b as DataTableToolbar,
23
- y as useBeamTable,
24
- v as useDataTable
23
+ m as DataTableToolbar,
24
+ F as createBeamColumn,
25
+ w as useBeamTable,
26
+ i as useDataTable
25
27
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");require("clsx");require("react");const e=require("../../../chunks/DateField.Segment.CqFLhMYA.js");require("./DateField.utils.cjs.js");exports.DateFieldSegment=e.DateFieldSegment;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");require("clsx");require("react");require("../../../chunks/use-isomorphic-layout-effect.browser.esm.CkGv31zs.js");const e=require("../../../chunks/DateField.Segment.BqMaeKLk.js");require("./DateField.utils.cjs.js");exports.DateFieldSegment=e.DateFieldSegment;
@@ -1,8 +1,9 @@
1
1
  import "react/jsx-runtime";
2
2
  import "clsx";
3
3
  import "react";
4
- import { D as p } from "../../../chunks/DateField.Segment.CwhRnhtq.js";
4
+ import "../../../chunks/use-isomorphic-layout-effect.browser.esm.DERp5kr6.js";
5
+ import { D as a } from "../../../chunks/DateField.Segment.BMXzpxgl.js";
5
6
  import "./DateField.utils.es.js";
6
7
  export {
7
- p as DateFieldSegment
8
+ a as DateFieldSegment
8
9
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),n=require("../../../chunks/DateField.Segment.CqFLhMYA.js"),t=require("./DateField.utils.cjs.js"),Y={month:"MM",day:"DD",year:"YYYY"},j=({parts:o,segmentText:r,segmentValues:a,focusedSegment:m,disabled:c,readOnly:d,invalid:u,role:y,onSegmentFocus:D,onSegmentBlur:h,onSegmentInput:p,onSegmentKeyDown:M,registerSegmentRef:x})=>{const _={day:{min:1,max:t.getDaysInMonth(a.year,a.month)},month:{min:1,max:t.MONTH_MAX},year:{min:t.YEAR_MIN,max:t.YEAR_MAX}};return i.jsx("span",{className:n.styles[n.staticDateFieldClassNames.segments],children:o.map((s,g)=>{if(s.type==="literal")return i.jsx("span",{"aria-hidden":"true",className:n.styles[n.staticDateFieldClassNames.separator],children:s.value},`literal-${g}`);const e=s.type,F=Y[e],{displayValue:l,isPlaceholder:S}=t.getSegmentDisplay(e,r[e],F),{min:v,max:N}=_[e],A=e==="month"&&a.month!=null?t.getMonthName(a.month):l;return i.jsx(n.DateFieldSegment,{type:e,value:a[e],valueMin:v,valueMax:N,displayValue:l,isPlaceholder:S,valueText:A,invalid:u,role:y,isActive:m===e,disabled:c,readOnly:d,onFocus:()=>D(e),onBlur:h,onInput:p,onKeyDown:M,segmentRef:x(e)},e)})})};exports.DateFieldSegments=j;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),n=require("../../../chunks/DateField.Segment.BqMaeKLk.js"),t=require("./DateField.utils.cjs.js"),Y={month:"MM",day:"DD",year:"YYYY"},j=({parts:o,segmentText:r,segmentValues:a,focusedSegment:m,disabled:c,readOnly:d,invalid:u,role:y,onSegmentFocus:D,onSegmentBlur:h,onSegmentInput:p,onSegmentKeyDown:M,registerSegmentRef:x})=>{const _={day:{min:1,max:t.getDaysInMonth(a.year,a.month)},month:{min:1,max:t.MONTH_MAX},year:{min:t.YEAR_MIN,max:t.YEAR_MAX}};return i.jsx("span",{className:n.styles[n.staticDateFieldClassNames.segments],children:o.map((s,g)=>{if(s.type==="literal")return i.jsx("span",{"aria-hidden":"true",className:n.styles[n.staticDateFieldClassNames.separator],children:s.value},`literal-${g}`);const e=s.type,F=Y[e],{displayValue:l,isPlaceholder:S}=t.getSegmentDisplay(e,r[e],F),{min:v,max:N}=_[e],A=e==="month"&&a.month!=null?t.getMonthName(a.month):l;return i.jsx(n.DateFieldSegment,{type:e,value:a[e],valueMin:v,valueMax:N,displayValue:l,isPlaceholder:S,valueText:A,invalid:u,role:y,isActive:m===e,disabled:c,readOnly:d,onFocus:()=>D(e),onBlur:h,onInput:p,onKeyDown:M,segmentRef:x(e)},e)})})};exports.DateFieldSegments=j;
@@ -1,5 +1,5 @@
1
1
  import { jsx as n } from "react/jsx-runtime";
2
- import { s, a as m, D as F } from "../../../chunks/DateField.Segment.CwhRnhtq.js";
2
+ import { s, a as m, D as F } from "../../../chunks/DateField.Segment.BMXzpxgl.js";
3
3
  import { getDaysInMonth as R, getSegmentDisplay as S, YEAR_MAX as I, YEAR_MIN as T, MONTH_MAX as _, getMonthName as B } from "./DateField.utils.es.js";
4
4
  const C = {
5
5
  month: "MM",
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),qe=require("clsx"),r=require("react"),e=require("../../../chunks/DateField.Segment.CqFLhMYA.js"),we=require("../../../chunks/constants.CgMu0_1M.js"),Ie=require("../../../chunks/helpers.BIckGIbP.js"),Me=require("../../../chunks/form.context.CkC0TwMb.js"),Ne=require("../../Form/contexts/label.context.cjs.js"),Oe=require("../../Form/contexts/helperText.context.cjs.js"),Ve=require("../../Form/hooks/useUniversalRef.hook.cjs.js"),je=require("../../../utils/hooks/useIsMounted.cjs.js"),Pe=require("./DateField.Segments.cjs.js"),i=require("./DateField.utils.cjs.js"),Re=require("./useDateFieldFocus.cjs.js"),Ce=require("./useDateFieldForm.cjs.js"),Te=require("./useDateFieldKeyboard.cjs.js"),Be=require("./useDateFieldSegments.cjs.js"),Ee=require("./useDateFieldValidity.cjs.js"),Ke=require("./useDateFieldValue.cjs.js"),He=require("./useInvalidState.cjs.js"),Le=r.forwardRef(function({value:N,defaultValue:O,onChange:V,minDate:d,maxDate:n,getClampAnnouncement:j,locale:P,label:F=null,helperText:f=null,error:_,hideRequiredMarker:R=!1,validationRules:C,width:T,theme:m,fluid:B=!1,disabled:E=!1,readOnly:K=!1,required:H=!1,name:D,id:L,className:k,style:$,"aria-label":U,"aria-describedby":W,"aria-labelledby":A,...z},G){const{disabled:s,readOnly:o,required:p,invalid:J,errorMessageProvided:g,defaultValue:Q,errorId:x,helperTextId:X,validationErrorsId:Y,labelId:v,ariaDescribedBy:Z,ariaLabelledBy:ee,showErrors:se}=Ce.useDateFieldForm({name:D,disabled:E,readOnly:K,required:H,defaultValue:O,error:_,hasHelperText:!!f,hasLabel:!!F,validationRules:C,ariaDescribedBy:W,ariaLabelledBy:A});r.useEffect(()=>{process.env.NODE_ENV!=="production"&&i.isMinMaxMisconfigured(d,n)&&console.warn("DateField: `minDate` is after `maxDate` — no date satisfies both, so the blur clamp is disabled and values are left as typed.")},[i.dateKeyOrNull(d),i.dateKeyOrNull(n)]);const{refFn:ae,ref:y}=Ve.useUniversalRef(G),{segmentRefs:ie,registerSegmentRef:le}=Be.useDateFieldSegments(),te=P??"en-US",u=i.getDateParts(te),S=r.useMemo(()=>i.getSegmentOrder(u),[u]),{segmentText:re,segmentValues:h,currentValue:q,wasTouched:de,appendDigit:w,adjustSegment:ne,clearSegment:oe,beginSegmentEdit:ue,commitOnBlur:ce,clampAnnouncement:be}=Ke.useDateFieldValue({value:N,defaultValue:Q,onChange:V,minDate:d,maxDate:n,getClampAnnouncement:j}),{focusedSegment:I,fieldTabIndex:Fe,handleSegmentFocus:M,handleFieldFocus:fe,handleFieldBlur:_e,handleFieldMouseDown:me,focusNext:c,focusPrevious:De}=Re.useDateFieldFocus({disabled:s,fieldRef:y,segmentRefs:ie,partsOrder:S,onSegmentFocusChange:ue,onFieldBlur:ce}),pe=Te.useDateFieldKeyboard({disabled:s,readOnly:o,fieldRef:y,focusNext:c,focusPrevious:De,adjustSegment:ne,clearSegment:oe}),{isInvalid:ge}=Ee.useDateFieldValidity({segments:h,currentValue:q,wasTouched:de,isFocused:I!==null}),xe=r.useCallback((l,t)=>{const{advanced:he}=w(l,t);he&&c(l)},[w,c]),b=He.useInvalidState({formInvalid:J,valueInvalid:ge}),ve=je.useIsMounted()&&Ie.isIOS()?"textbox":"spinbutton",ye=l=>{if(s)return;const t=l.target.closest("label");!t||t.id!==v||(l.preventDefault(),M(S[0]))},Se=qe(e.styles[e.baseClassNamePrefix],m&&we.themeClassName(m),B&&e.styles[`${e.classModifierPrefix}fluid`],b&&e.styles[`${e.classModifierPrefix}error`],s&&e.styles[`${e.classModifierPrefix}disabled`],o&&e.styles[`${e.classModifierPrefix}read-only`],k);return a.jsxs("div",{className:Se,style:{...$,maxWidth:T},onMouseDownCapture:ye,children:[a.jsx(Ne.LabelProvider,{ctxId:v,ctxDisabled:s,ctxRequired:p&&!R,children:F}),a.jsx("div",{...z,ref:ae,id:L,role:"group","aria-label":U,"aria-labelledby":ee,"aria-disabled":s||void 0,"aria-required":p||void 0,"aria-invalid":b||void 0,"aria-describedby":Z,"aria-errormessage":g?x:void 0,tabIndex:Fe,className:e.styles[e.staticDateFieldClassNames.field],onMouseDown:me,onFocus:fe,children:a.jsx(Pe.DateFieldSegments,{parts:u,segmentText:re,segmentValues:h,focusedSegment:I,disabled:s,readOnly:o,invalid:b,role:ve,onSegmentFocus:M,onSegmentBlur:_e,onSegmentInput:xe,onSegmentKeyDown:pe,registerSegmentRef:le})}),a.jsx("span",{role:"status","aria-live":"polite","aria-atomic":"true",className:e.styles[e.staticDateFieldClassNames.srStatus],children:be}),a.jsx("input",{type:"hidden",name:D,value:i.toISODateString(q),disabled:s}),a.jsxs(Oe.HelperTextProvider,{ctxId:X,ctxDisabled:s,children:[f,g&&a.jsx(Me.HelperText,{id:x,appearance:"negative",children:_})]}),se(Y)]})});exports.DateField=Le;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),Ie=require("clsx"),u=require("react"),e=require("../../../chunks/DateField.Segment.BqMaeKLk.js"),Me=require("../../../chunks/constants.CgMu0_1M.js"),Ee=require("../../../chunks/helpers.BIckGIbP.js"),Ne=require("../../../chunks/form.context.CkC0TwMb.js"),Re=require("../../Form/contexts/label.context.cjs.js"),Ce=require("../../Form/contexts/helperText.context.cjs.js"),je=require("../../Form/hooks/useUniversalRef.hook.cjs.js"),Le=require("../../../utils/hooks/useIsMounted.cjs.js"),Oe=require("../ErrorBoundary/ErrorBoundary.cjs.js"),Be=require("./DateField.Segments.cjs.js"),C=require("./DateField.devWarnings.cjs.js"),l=require("./DateField.utils.cjs.js"),Te=require("./useDateFieldFocus.cjs.js"),Ve=require("./useDateFieldForm.cjs.js"),Pe=require("./useDateFieldKeyboard.cjs.js"),Ae=require("./useDateFieldSegments.cjs.js"),ke=require("./useDateFieldValidity.cjs.js"),Ke=require("./useDateFieldValue.cjs.js"),He=require("./useInvalidState.cjs.js"),We="MM/DD/YYYY",Ue=()=>{process.env.NODE_ENV!=="production"&&console.warn("DateField: segments failed to render; showing a static fallback.")},Ye=u.forwardRef(function({value:c,defaultValue:_,onChange:j,minDate:F,maxDate:b,getClampAnnouncement:L,locale:O,label:D=null,helperText:m=null,error:f,hideRequiredMarker:B=!1,validationRules:T,width:V,theme:g,fluid:P=!1,disabled:A=!1,readOnly:k=!1,required:K=!1,name:p,id:H,className:W,style:U,"aria-label":Y,"aria-describedby":$,"aria-labelledby":z,...G},J){const{disabled:a,readOnly:r,required:x,invalid:Q,errorMessageProvided:v,defaultValue:X,errorId:y,helperTextId:Z,validationErrorsId:ee,labelId:h,ariaDescribedBy:se,ariaLabelledBy:ae,showErrors:ie}=Ve.useDateFieldForm({name:p,disabled:A,readOnly:k,required:K,defaultValue:_,error:f,hasHelperText:!!m,hasLabel:!!D,validationRules:T,ariaDescribedBy:$,ariaLabelledBy:z});C.useDevMinMaxWarning(F,b),C.useDevInvalidValueWarning(c,_);const{refFn:le,ref:S}=je.useUniversalRef(J),{segmentRefs:te,registerSegmentRef:re}=Ae.useDateFieldSegments(),ne=O??l.DEFAULT_LOCALE,q=Le.useIsMounted(),n=l.getDateParts(q?ne:l.DEFAULT_LOCALE),w=u.useMemo(()=>l.getSegmentOrder(n),[n]),{segmentText:de,segmentValues:I,currentValue:M,wasTouched:oe,appendDigit:E,adjustSegment:ue,clearSegment:ce,beginSegmentEdit:_e,commitOnBlur:Fe,clampAnnouncement:be}=Ke.useDateFieldValue({value:c,defaultValue:X,onChange:j,minDate:F,maxDate:b,getClampAnnouncement:L}),{focusedSegment:N,fieldTabIndex:De,handleSegmentFocus:R,handleFieldFocus:me,handleFieldBlur:fe,handleFieldMouseDown:ge,focusNext:d,focusPrevious:pe}=Te.useDateFieldFocus({disabled:a,fieldRef:S,segmentRefs:te,partsOrder:w,onSegmentFocusChange:_e,onFieldBlur:Fe}),xe=Pe.useDateFieldKeyboard({disabled:a,readOnly:r,fieldRef:S,focusNext:d,focusPrevious:pe,adjustSegment:ue,clearSegment:ce}),{isInvalid:ve}=ke.useDateFieldValidity({segments:I,currentValue:M,wasTouched:oe,isFocused:N!==null}),ye=u.useCallback((i,t)=>{const{advanced:we}=E(i,t);we&&d(i)},[E,d]),o=He.useInvalidState({formInvalid:Q,valueInvalid:ve}),he=q&&Ee.isIOS()?"textbox":"spinbutton",Se=i=>{if(a)return;const t=i.target.closest("label");!t||t.id!==h||(i.preventDefault(),R(w[0]))},qe=Ie(e.styles[e.baseClassNamePrefix],g&&Me.themeClassName(g),P&&e.styles[`${e.classModifierPrefix}fluid`],o&&e.styles[`${e.classModifierPrefix}error`],a&&e.styles[`${e.classModifierPrefix}disabled`],r&&e.styles[`${e.classModifierPrefix}read-only`],W);return s.jsxs("div",{className:qe,style:{...U,maxWidth:V},onMouseDownCapture:Se,children:[s.jsx(Re.LabelProvider,{ctxId:h,ctxDisabled:a,ctxRequired:x&&!B,children:D}),s.jsx("div",{...G,ref:le,id:H,role:"group","aria-label":Y,"aria-labelledby":ae,"aria-disabled":a||void 0,"aria-required":x||void 0,"aria-invalid":o||void 0,"aria-describedby":se,"aria-errormessage":v?y:void 0,tabIndex:De,className:e.styles[e.staticDateFieldClassNames.field],onMouseDown:ge,onFocus:me,children:s.jsx(Oe.ErrorBoundary,{fallback:s.jsx("span",{className:e.styles[e.staticDateFieldClassNames.segments],children:We}),onError:Ue,children:s.jsx(Be.DateFieldSegments,{parts:n,segmentText:de,segmentValues:I,focusedSegment:N,disabled:a,readOnly:r,invalid:o,role:he,onSegmentFocus:R,onSegmentBlur:fe,onSegmentInput:ye,onSegmentKeyDown:xe,registerSegmentRef:re})})}),s.jsx("span",{role:"status","aria-live":"polite","aria-atomic":"true",className:e.styles[e.staticDateFieldClassNames.srStatus],children:be}),s.jsx("input",{type:"hidden",name:p,value:l.toISODateString(M),disabled:a}),s.jsxs(Ce.HelperTextProvider,{ctxId:Z,ctxDisabled:a,children:[m,v&&s.jsx(Ne.HelperText,{id:y,appearance:"negative",children:f})]}),ie(ee)]})});exports.DateField=Ye;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),i=require("./DateField.utils.cjs.js"),l=(e,a)=>{s.useEffect(()=>{process.env.NODE_ENV!=="production"&&i.isMinMaxMisconfigured(e,a)&&console.warn("DateField: `minDate` is after `maxDate` — no date satisfies both, so the blur clamp is disabled and values are left as typed.")},[i.dateKeyOrNull(e),i.dateKeyOrNull(a)])},r=(e,a)=>{const n=e instanceof Date&&!i.isValidDate(e),t=a instanceof Date&&!i.isValidDate(a);s.useEffect(()=>{process.env.NODE_ENV!=="production"&&(n&&console.warn("DateField: `value` is an Invalid Date; rendering with no value."),t&&console.warn("DateField: `defaultValue` is an Invalid Date; rendering with no value."))},[n,t])};exports.useDevInvalidValueWarning=r;exports.useDevMinMaxWarning=l;
@@ -0,0 +1,15 @@
1
+ /**
2
+ * Dev-only guard: `minDate` after `maxDate` is a caller misconfig where no date
3
+ * satisfies both, so the blur clamp is disabled (values are left as typed). Warns
4
+ * once per prop change (stripped in production). Deps key on the primitive
5
+ * calendar day, not the `Date` object — an inline `new Date()` bound would
6
+ * otherwise re-run this every render and spam the warning.
7
+ */
8
+ export declare const useDevMinMaxWarning: (minDate: Date | null | undefined, maxDate: Date | null | undefined) => void;
9
+ /**
10
+ * Dev-only guard: an Invalid Date prop renders with no value (segments show
11
+ * placeholders). Warns so the caller notices rather than debugging a silently
12
+ * empty field. Keyed on booleans, not the `Date` objects, so a fresh-but-valid
13
+ * `Date` each render doesn't churn.
14
+ */
15
+ export declare const useDevInvalidValueWarning: (value: Date | null | undefined, defaultValue: Date | null | undefined) => void;
@@ -0,0 +1,22 @@
1
+ import { useEffect as o } from "react";
2
+ import { isMinMaxMisconfigured as l, dateKeyOrNull as t, isValidDate as s } from "./DateField.utils.es.js";
3
+ const c = (e, a) => {
4
+ o(() => {
5
+ process.env.NODE_ENV !== "production" && l(e, a) && console.warn(
6
+ "DateField: `minDate` is after `maxDate` — no date satisfies both, so the blur clamp is disabled and values are left as typed."
7
+ );
8
+ }, [t(e), t(a)]);
9
+ }, u = (e, a) => {
10
+ const n = e instanceof Date && !s(e), i = a instanceof Date && !s(a);
11
+ o(() => {
12
+ process.env.NODE_ENV !== "production" && (n && console.warn(
13
+ "DateField: `value` is an Invalid Date; rendering with no value."
14
+ ), i && console.warn(
15
+ "DateField: `defaultValue` is an Invalid Date; rendering with no value."
16
+ ));
17
+ }, [n, i]);
18
+ };
19
+ export {
20
+ u as useDevInvalidValueWarning,
21
+ c as useDevMinMaxWarning
22
+ };