@box-kite/react 2.2.17 → 2.2.18
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.
- package/.claude/rules/box-kite-rules.md +3 -3
- package/.claude/skills/box-kite/SKILL.md +3 -3
- package/.claude/skills/box-kite/references/components.md +1 -1
- package/.claude/skills/box-kite/references/styling.md +1 -1
- package/.cursor/rules/box-kite.mdc +3 -3
- package/AGENTS.md +3 -3
- package/BOX_AI_CONTEXT.md +2 -2
- package/BOX_KITE_AI_CONTEXT.md +2 -2
- package/behavior.cjs +1 -1
- package/behavior.mjs +62 -62
- package/catalog.cjs +1 -1
- package/catalog.mjs +3 -3
- package/client.cjs +1 -1
- package/client.mjs +15 -15
- package/components/accordion.cjs +1 -1
- package/components/accordion.mjs +1 -1
- package/components/calendar.cjs +1 -1
- package/components/calendar.mjs +1 -1
- package/components/combobox.cjs +1 -1
- package/components/combobox.mjs +1 -1
- package/components/dashboard.cjs +1 -1
- package/components/dashboard.mjs +1 -1
- package/components/dataGrid.cjs +2 -2
- package/components/dataGrid.mjs +11 -11
- package/components/dateField.cjs +1 -1
- package/components/dateField.mjs +1 -1
- package/components/datePicker.cjs +1 -1
- package/components/datePicker.mjs +2 -5
- package/components/dialog.cjs +1 -1
- package/components/dialog.mjs +108 -101
- package/components/form.cjs +1 -1
- package/components/form.mjs +1 -1
- package/components/menu.cjs +1 -1
- package/components/menu.mjs +1 -1
- package/components/overlay.cjs +1 -1
- package/components/overlay.mjs +4 -4
- package/components/popover.cjs +1 -1
- package/components/popover.mjs +1 -1
- package/components/radioGroup.cjs +1 -1
- package/components/radioGroup.mjs +1 -1
- package/components/slider.cjs +1 -1
- package/components/slider.mjs +1 -1
- package/components/sortableList.cjs +1 -1
- package/components/sortableList.mjs +1 -1
- package/components/swipeItem.cjs +1 -1
- package/components/swipeItem.mjs +11 -11
- package/components/tabs.cjs +1 -1
- package/components/tabs.mjs +1 -1
- package/components/toaster.cjs +1 -1
- package/components/toaster.mjs +133 -115
- package/components/tooltip.cjs +1 -1
- package/components/tooltip.mjs +1 -1
- package/components/virtualList.cjs +1 -1
- package/components/virtualList.mjs +1 -1
- package/interactionListening.cjs +1 -1
- package/interactionListening.mjs +3 -3
- package/layer.cjs +1 -1
- package/layer.mjs +17 -14
- package/package.json +2 -2
- package/placement.cjs +1 -1
- package/placement.mjs +10 -10
- package/platform.cjs +1 -1
- package/platform.mjs +18 -11
- package/react-shared.cjs +1 -1
- package/react-shared.mjs +1 -1
- package/scrolling.cjs +1 -1
- package/scrolling.mjs +1 -1
- package/utils/dom/domUtils.d.ts +7 -0
package/components/dataGrid.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import {
|
|
2
|
+
import { f as e, g as t, o as n } from "../platform.mjs";
|
|
3
3
|
import { n as r } from "../effects.mjs";
|
|
4
4
|
import { t as i } from "../interactions.mjs";
|
|
5
5
|
import a from "../box.mjs";
|
|
@@ -1355,8 +1355,8 @@ ut.displayName = "DataGridAggregateValue";
|
|
|
1355
1355
|
//#endregion
|
|
1356
1356
|
//#region src/components/dataGrid/components/dataGridCell.tsx
|
|
1357
1357
|
var dt = "button,a[href],input,select,textarea";
|
|
1358
|
-
function J(
|
|
1359
|
-
let { children:
|
|
1358
|
+
function J(t) {
|
|
1359
|
+
let { children: n, cell: r, row: i, columnIndex: a, ariaColIndex: o, ariaColSpan: s, style: c, ...l } = t, { column: u } = r, d = z(), { ref: f, tabIndex: p, onFocus: m } = be(d, i, a), { range: h } = u.grid, g = r instanceof V ? i - (d?.headerRowCount ?? 0) : -1, v = g >= 0 && h.isCurrent(g, a), y = g >= 0 && h.isSelected(g, a);
|
|
1360
1360
|
u.hasAlign && (l.jc = u.align);
|
|
1361
1361
|
let b = r.isExpanded ? {
|
|
1362
1362
|
...u.cellVariant.value,
|
|
@@ -1378,8 +1378,8 @@ function J(e) {
|
|
|
1378
1378
|
...b,
|
|
1379
1379
|
isInvalid: !0
|
|
1380
1380
|
});
|
|
1381
|
-
let S = r instanceof V ? (
|
|
1382
|
-
|
|
1381
|
+
let S = r instanceof V ? (t) => {
|
|
1382
|
+
t.target.closest(dt) || (e(t.currentTarget), r.beginEdit());
|
|
1383
1383
|
} : void 0, C = h.enabled && g >= 0, w = C ? (e) => {
|
|
1384
1384
|
e.button === 0 && e.pointerType !== "touch" && (e.target.closest(dt) || h.press(g, a, e.shiftKey));
|
|
1385
1385
|
} : void 0, T = C && h.isDragging ? (e) => {
|
|
@@ -1406,7 +1406,7 @@ function J(e) {
|
|
|
1406
1406
|
...c
|
|
1407
1407
|
},
|
|
1408
1408
|
...l,
|
|
1409
|
-
children:
|
|
1409
|
+
children: n
|
|
1410
1410
|
});
|
|
1411
1411
|
}
|
|
1412
1412
|
J.displayName = "DataGridCell";
|
|
@@ -5446,7 +5446,7 @@ function tr(e) {
|
|
|
5446
5446
|
let n = (e) => String(e).padStart(2, "0");
|
|
5447
5447
|
return `${String(t.getFullYear()).padStart(4, "0")}-${n(t.getMonth() + 1)}-${n(t.getDate())}`;
|
|
5448
5448
|
}
|
|
5449
|
-
var nr = class
|
|
5449
|
+
var nr = class e {
|
|
5450
5450
|
props;
|
|
5451
5451
|
constructor(e, t) {
|
|
5452
5452
|
this.props = e, t && this.listeners.add(t);
|
|
@@ -5477,9 +5477,9 @@ var nr = class t {
|
|
|
5477
5477
|
get headerVersion() {
|
|
5478
5478
|
return `${this._epoch}:${this._selectionVersion}`;
|
|
5479
5479
|
}
|
|
5480
|
-
setProps(
|
|
5480
|
+
setProps(t) {
|
|
5481
5481
|
let n = this.props;
|
|
5482
|
-
n !==
|
|
5482
|
+
n !== t && (e.drawnPropsChanged(n, t) && this._epoch++, this.props = t, n.def !== t.def && this.sourceColumns.clear(), (n.data !== t.data || n.def !== t.def || n.globalFilterValue !== t.globalFilterValue || n.columnFilters !== t.columnFilters || n.filters !== t.filters || n.expandedRowKeys !== t.expandedRowKeys || n.expandedTreeKeys !== t.expandedTreeKeys || n.page !== t.page || n.pageSize !== t.pageSize) && this.rows.clear(), (n.globalFilterValue !== t.globalFilterValue || n.columnFilters !== t.columnFilters || n.filters !== t.filters) && this.leaveSelectionView(), (n.data !== t.data || n.def !== t.def || n.globalFilterValue !== t.globalFilterValue || n.columnFilters !== t.columnFilters || n.filters !== t.filters) && this.tree.nodes.clear());
|
|
5483
5483
|
}
|
|
5484
5484
|
get data() {
|
|
5485
5485
|
return this.props.data ?? [];
|
|
@@ -5824,7 +5824,7 @@ var nr = class t {
|
|
|
5824
5824
|
e && Object.entries(this.sizes.value).forEach(([t, n]) => e.style.setProperty(t, n));
|
|
5825
5825
|
};
|
|
5826
5826
|
get isRtl() {
|
|
5827
|
-
return
|
|
5827
|
+
return t(this._sizingElement);
|
|
5828
5828
|
}
|
|
5829
5829
|
setContainerWidth = (e) => {
|
|
5830
5830
|
this._containerWidth !== e && (this._containerWidth = e, this.flexWidths.clear(), this.notify());
|
|
@@ -6136,7 +6136,7 @@ var ir, ar;
|
|
|
6136
6136
|
function or() {
|
|
6137
6137
|
return ar ??= import("../dataGridList.mjs").then((e) => ir = e.default), ar;
|
|
6138
6138
|
}
|
|
6139
|
-
|
|
6139
|
+
n("(max-width: 36rem)")?.matches && or();
|
|
6140
6140
|
function sr(e) {
|
|
6141
6141
|
let [t, n] = F(() => ir);
|
|
6142
6142
|
return N(() => {
|
package/components/dateField.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../identity.cjs"),a=require("../dates.cjs"),o=require("../date-math.cjs"),s=require("../date-input.cjs"),c=require("../reporting.cjs"),l=require("../date-environment.cjs");let u=require("react"),d=require("react/jsx-runtime");var f=`data-segment`;function p(e,p){let{type:m=`date`,value:ee,defaultValue:te=null,onValueChange:ne,zone:h,locale:re,hourCycle:ie,granularity:g=`minute`,min:_,max:v,isDateUnavailable:y,disabled:b=!1,readOnly:x=!1,required:S=!1,invalid:ae,name:C,label:w,labelledBy:oe,describedBy:T,placeholderValue:E,disambiguation:D,showZone:se,end:O,autoFocus:ce,emptyText:le=`Empty`,tabIndex:ue=0,props:de,...k}=e,A=l.n({locale:re,zone:h===`none`?void 0:h}),{locale:j}=A,M=m===`datetime`&&h!==`none`?A.zone:null,N=ie??a.b(j),P=(0,u.useMemo)(()=>({type:m,locale:j,hourCycle:N,granularity:g}),[m,j,N,g]),F=(0,u.useMemo)(()=>s.o(P),[P]),I=`${m}|${j}|${N}|${g}|${M}`,[L,fe]=c.a({value:ee,defaultValue:te,onChange:(e,t)=>ne?.(e,{...t,...o.x(e,M??A.zone)}),interaction:{component:`dateField`,type:`valueChange`,content:[`value`]}}),[R,z]=(0,u.useState)(()=>({draft:s.n(L,P,M),source:L,key:I})),B=R.draft;if(R.source!==L||R.key!==I){let e=s.f(R.draft,F,P,{zone:M,disambiguation:D}),t={draft:R.key===I&&e===L?R.draft:s.n(L,P,M),source:L,key:I};z(t),B=t.draft}let[V,H]=(0,u.useState)(null),U=(0,u.useRef)(null),W=(0,u.useRef)(null),G=i.t(`date-field`),pe=w===void 0?void 0:`${G}-label`,K=(0,u.useMemo)(()=>s.n(E??`${o.N(A.zone)}T00:00:00`,{...P,type:P.type===`date`?`date`:`datetime`},null),[E,A.zone,P]),q=(e,t,n)=>{let r=s.f(e,F,P,{zone:M,disambiguation:D});z({draft:e,source:r,key:I}),fe(r,{reason:t,event:n})},J=r.o({draft:B,editing:V,commit:q}),Y=()=>Array.from(U.current?.querySelectorAll(`[${f}]`)??[]),X=e=>{let t=Y();t[Math.max(0,Math.min(e,t.length-1))]?.focus()},Z=e=>Y().indexOf(e),Q=(e,t,n,r)=>{let{draft:i,editing:a}=J.current,o=a?.type===t?a.buffer:``;if(t===`dayPeriod`){let t=s.d(i,n,j);t&&(J.current.commit(t,`keyboard`,r),X(Z(e)+1));return}if(!/^\d$/.test(n)){/^[^\p{L}\p{N}]$/u.test(n)&&i[t]!==void 0&&X(Z(e)+1);return}let c=s.u(i,t,o,n,P);H({type:t,buffer:c.advance?``:c.buffer}),J.current.commit(c.draft,`keyboard`,r),c.advance&&X(Z(e)+1)},me=r.a(e=>{let n=e.target.closest(`[${f}]`);if(!n||b||e.defaultPrevented)return;let r=n.getAttribute(f),i=Z(n),a=t.
|
|
1
|
+
"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../identity.cjs"),a=require("../dates.cjs"),o=require("../date-math.cjs"),s=require("../date-input.cjs"),c=require("../reporting.cjs"),l=require("../date-environment.cjs");let u=require("react"),d=require("react/jsx-runtime");var f=`data-segment`;function p(e,p){let{type:m=`date`,value:ee,defaultValue:te=null,onValueChange:ne,zone:h,locale:re,hourCycle:ie,granularity:g=`minute`,min:_,max:v,isDateUnavailable:y,disabled:b=!1,readOnly:x=!1,required:S=!1,invalid:ae,name:C,label:w,labelledBy:oe,describedBy:T,placeholderValue:E,disambiguation:D,showZone:se,end:O,autoFocus:ce,emptyText:le=`Empty`,tabIndex:ue=0,props:de,...k}=e,A=l.n({locale:re,zone:h===`none`?void 0:h}),{locale:j}=A,M=m===`datetime`&&h!==`none`?A.zone:null,N=ie??a.b(j),P=(0,u.useMemo)(()=>({type:m,locale:j,hourCycle:N,granularity:g}),[m,j,N,g]),F=(0,u.useMemo)(()=>s.o(P),[P]),I=`${m}|${j}|${N}|${g}|${M}`,[L,fe]=c.a({value:ee,defaultValue:te,onChange:(e,t)=>ne?.(e,{...t,...o.x(e,M??A.zone)}),interaction:{component:`dateField`,type:`valueChange`,content:[`value`]}}),[R,z]=(0,u.useState)(()=>({draft:s.n(L,P,M),source:L,key:I})),B=R.draft;if(R.source!==L||R.key!==I){let e=s.f(R.draft,F,P,{zone:M,disambiguation:D}),t={draft:R.key===I&&e===L?R.draft:s.n(L,P,M),source:L,key:I};z(t),B=t.draft}let[V,H]=(0,u.useState)(null),U=(0,u.useRef)(null),W=(0,u.useRef)(null),G=i.t(`date-field`),pe=w===void 0?void 0:`${G}-label`,K=(0,u.useMemo)(()=>s.n(E??`${o.N(A.zone)}T00:00:00`,{...P,type:P.type===`date`?`date`:`datetime`},null),[E,A.zone,P]),q=(e,t,n)=>{let r=s.f(e,F,P,{zone:M,disambiguation:D});z({draft:e,source:r,key:I}),fe(r,{reason:t,event:n})},J=r.o({draft:B,editing:V,commit:q}),Y=()=>Array.from(U.current?.querySelectorAll(`[${f}]`)??[]),X=e=>{let t=Y();t[Math.max(0,Math.min(e,t.length-1))]?.focus()},Z=e=>Y().indexOf(e),Q=(e,t,n,r)=>{let{draft:i,editing:a}=J.current,o=a?.type===t?a.buffer:``;if(t===`dayPeriod`){let t=s.d(i,n,j);t&&(J.current.commit(t,`keyboard`,r),X(Z(e)+1));return}if(!/^\d$/.test(n)){/^[^\p{L}\p{N}]$/u.test(n)&&i[t]!==void 0&&X(Z(e)+1);return}let c=s.u(i,t,o,n,P);H({type:t,buffer:c.advance?``:c.buffer}),J.current.commit(c.draft,`keyboard`,r),c.advance&&X(Z(e)+1)},me=r.a(e=>{let n=e.target.closest(`[${f}]`);if(!n||b||e.defaultPrevented)return;let r=n.getAttribute(f),i=Z(n),a=t.g(n),{key:o}=e,c=J.current.draft,l=t=>{e.preventDefault(),!x&&(H({type:r,buffer:``}),q(t,`keyboard`,e))};if(o===`ArrowUp`||o===`ArrowDown`)return l(s.c(c,r,o===`ArrowUp`?1:-1,P,K));if(o===`PageUp`||o===`PageDown`)return l(s.c(c,r,(o===`PageUp`?1:-1)*s.t[r],P,K));if(o===`Home`||o===`End`){let e=s.i(r,c,P);return l({...c,[r]:o===`Home`?e.min:e.max})}if(o===`ArrowLeft`||o===`ArrowRight`){e.preventDefault(),X(i+(o===`ArrowRight`===a?-1:1));return}if(o===`Backspace`||o===`Delete`){if(e.preventDefault(),x)return;let t=J.current.editing?.type===r?J.current.editing.buffer:``;if(t.length>1){let n=t.slice(0,-1);H({type:r,buffer:n}),q({...c,[r]:Number(n)},`keyboard`,e)}else c[r]===void 0?o===`Backspace`&&X(i-1):(H({type:r,buffer:``}),q({...c,[r]:void 0},`keyboard`,e));return}if(o===`Enter`){e.preventDefault(),W.current?.form?.requestSubmit();return}o===`Unidentified`||o===`Process`||e.ctrlKey||e.metaKey||e.altKey||o.length!==1||(e.preventDefault(),x||Q(n,r,o,e))});(0,u.useEffect)(()=>{let e=U.current;if(!e)return;let t=e=>{let t=e.target?.closest(`[${f}]`);if(!t||(e.preventDefault(),b||x))return;let n=t.getAttribute(f);if(e.inputType.startsWith(`delete`)){t.dispatchEvent(new KeyboardEvent(`keydown`,{key:`Backspace`,bubbles:!0,cancelable:!0}));return}for(let r of e.data??``)Q(t,n,r,e)};return e.addEventListener(`beforeinput`,t),()=>e.removeEventListener(`beforeinput`,t)});let he=r.a(e=>{if(e.preventDefault(),b||x)return;let t=m===`datetime`?M?`instant`:`datetime`:m,n=s.m(e.clipboardData.getData(`text`),{locale:j,kind:t,zone:M??A.zone});n&&q(s.n(n,P,M),`paste`,e)});(0,u.useEffect)(()=>{let e=W.current?.form;if(!e)return;let t=e=>J.current.commit(s.n(te,P,M),`reset`,e);return e.addEventListener(`reset`,t),()=>e.removeEventListener(`reset`,t)}),(0,u.useEffect)(()=>{ce&&X(0)},[]);let ge=L!==null&&(_!=null&&o.i(L,_)<0||v!=null&&o.i(L,v)>0),_e=L!==null&&m!==`time`&&y?o.O(L,{zone:M??A.zone}):null,$=ae??(ge||_e!==null&&y(_e)),ve=m===`time`?[]:a.x(j),ye=typeof w==`string`?w:void 0,be=s.r(F)[0],xe=m===`datetime`&&M&&(se??M!==A.readerZone)?a.s(M,{locale:j,style:`short`,at:L??void 0}):null;return(0,d.jsxs)(d.Fragment,{children:[w!==void 0&&(0,d.jsx)(n.default,{component:`dateField.label`,display:`block`,mb:1.5,fontSize:14,id:pe,props:{onClick:()=>X(0)},children:w}),(0,d.jsxs)(n.default,{ref:e=>{U.current=e,t.d(p,e)},component:`dateField`,display:`inline-flex`,ai:`center`,position:`relative`,cursor:`text`,css:{fontVariantNumeric:`tabular-nums`,unicodeBidi:`isolate`},...k,variant:[k.variant,{disabled:b,invalid:$}],id:G,props:{role:`group`,"aria-labelledby":[pe,oe].filter(Boolean).join(` `)||void 0,"aria-describedby":T,"aria-disabled":b||void 0,"aria-invalid":$||void 0,...de,onKeyDown:me,onPaste:he,onPointerDown:e=>{if(e.target!==e.currentTarget||b)return;e.preventDefault();let t=s.r(F).findIndex(e=>J.current.draft[e]===void 0);X(t===-1?0:t)}},children:[F.map((e,t)=>{if(e.type===`literal`)return(0,d.jsx)(n.default,{component:`dateField.literal`,whiteSpace:`pre`,props:{"aria-hidden":!0},children:e.text},t);let r=e.type,i=s.i(r,B,P),o=B[r],c=o===void 0,l=V?.type===r?V.buffer:``,u=s.a(r,B,l,j),p=c?le:r===`month`?`${o} – ${ve[o-1]}`:r===`dayPeriod`?u:String(o);return(0,d.jsx)(n.default,{component:`dateField.segment`,display:`inline-block`,px:.5,borderRadius:1,textAlign:`end`,whiteSpace:`nowrap`,variant:{placeholder:c,disabled:b},id:`${G}-${r}`,props:{[f]:r,role:`spinbutton`,tabIndex:b?-1:ue,contentEditable:!b&&!x,suppressContentEditableWarning:!0,spellCheck:!1,autoCorrect:`off`,autoCapitalize:`off`,inputMode:r===`dayPeriod`?`text`:`numeric`,enterKeyHint:`next`,"aria-label":ye?`${a.y(r,j)}, ${ye}`:a.y(r,j),"aria-valuemin":i.min,"aria-valuemax":i.max,"aria-valuenow":o??K[r]??i.min,"aria-valuetext":p,"aria-readonly":x||void 0,"aria-disabled":b||void 0,"aria-invalid":$||void 0,"aria-describedby":r===be?T:void 0,onFocus:()=>H({type:r,buffer:``}),onBlur:()=>H(null)},children:u},t)}),xe&&(0,d.jsx)(n.default,{component:`dateField.zone`,ms:2,fontSize:13,whiteSpace:`nowrap`,children:xe}),O!==void 0&&(0,d.jsx)(n.default,{display:`inline-flex`,ai:`center`,ms:`auto`,children:O}),C!==void 0||S?(0,d.jsx)(u.Fragment,{children:S?(0,d.jsx)(n.default,{tag:`input`,ref:W,component:`dateField.validation`,required:!0,disabled:b,props:{type:`text`,name:C,value:L??``,tabIndex:-1,"aria-hidden":!0,onChange:()=>{},onFocus:()=>X(0)}}):(0,d.jsx)(`input`,{ref:W,type:`hidden`,name:C,value:L??``,disabled:b})}):null]})]})}var m=e.f(p,`DateField`);exports.default=m;
|
package/components/dateField.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { f as e } from "../react-shared.mjs";
|
|
3
|
-
import {
|
|
3
|
+
import { d as t, g as n } from "../platform.mjs";
|
|
4
4
|
import r from "../box.mjs";
|
|
5
5
|
import { a as i, o as a } from "../behavior.mjs";
|
|
6
6
|
import { t as o } from "../identity.mjs";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../placement.cjs"),a=require("../dates.cjs"),o=require("../date-math.cjs"),s=require("../date-input.cjs"),c=require("../reporting.cjs"),l=require("./svg.cjs"),u=require("../date-environment.cjs"),d=require("./calendar.cjs"),f=require("../layer.cjs"),p=require("./overlay.cjs"),m=require("../motion.cjs"),h=require("./dateField.cjs");let g=require("react"),_=require("react/jsx-runtime");function v(){return(0,_.jsx)(l.Svg,{viewBox:`0 0 16 16`,width:`1rem`,height:`1rem`,props:{fill:`none`},children:(0,_.jsx)(l.Path,{d:`M3 3.5h10a1 1 0 0 1 1 1V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4.5a1 1 0 0 1 1-1ZM2 7h12M5.5 2v3M10.5 2v3`,stroke:`currentColor`,strokeWidth:1.5,strokeLinecap:`round`})})}function y(){return(0,_.jsx)(l.Svg,{viewBox:`0 0 16 16`,width:`1rem`,height:`1rem`,props:{fill:`none`},children:(0,_.jsx)(l.Path,{d:`M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12ZM8 5v3l2 1.5`,stroke:`currentColor`,strokeWidth:1.5,strokeLinecap:`round`,strokeLinejoin:`round`})})}function b(){return(0,_.jsx)(l.Svg,{viewBox:`0 0 16 16`,width:`0.875rem`,height:`0.875rem`,props:{fill:`none`},children:(0,_.jsx)(l.Path,{d:`m4.5 4.5 7 7m0-7-7 7`,stroke:`currentColor`,strokeWidth:1.5,strokeLinecap:`round`})})}function x(e){let[a,o]=(0,g.useState)(null),s=e.ref,c=(0,g.useCallback)(e=>{o(e),t.l(s,e)},[s]),l=e=>{if(!e||e.contains(document.activeElement)&&document.activeElement!==e)return;let t=[`[data-date][tabindex="0"]`,`[role="option"][tabindex="0"]`,`button:not([disabled])`].map(t=>e.querySelector(t)).find(Boolean),n=e.querySelector(`[role="listbox"]`),r=n?.querySelector(`[role="option"][tabindex="0"]`);n&&r&&(n.scrollTop=r.offsetTop-n.clientHeight/2+r.offsetHeight/2),(t??e).focus({preventScroll:!0})},u=r.a(e=>l(e)),{platform:d,isOpen:h,id:v,setPanel:y,setOpen:b,trigger:x,triggerElement:S,panelElement:C}=f.t({haspopup:`dialog`,idPrefix:`date-picker`,open:e.open,defaultOpen:e.defaultOpen,onOpenChange:e.onOpenChange,interaction:{component:`datePicker`,type:`openChange`},onOpened:u,onClosing:(e,t)=>{e&&t?.focus()}}),w=i.t({side:e.side,align:e.align,offset:1,flip:!0,matchWidth:e.matchWidth,anchor:a});(0,g.useEffect)(()=>{h&&l(C)},[h,C]);let T=(0,g.useCallback)(()=>C,[C]),E=m.n(h,T);return{attachTrigger:x.ref,triggerAttributes:x.props,triggerElement:S,closeOnChoice:e=>{S?.focus(),b(!1,{reason:`select`,event:e})},id:v,attachField:c,panel:t=>{let r={role:`dialog`,"aria-label":e.label,tabIndex:-1};return d?(0,_.jsx)(n.default,{ref:y,component:`popover`,variant:{topLayer:!0},p:3,...w.layerProps,id:v,props:{popover:`auto`,...r},children:E===`closed`?null:t}):h&&(0,_.jsx)(p.default,{contentRef:y,anchor:a,side:e.side,align:e.align,offset:1,matchWidth:e.matchWidth,component:`popover`,p:3,id:v,props:r,children:t})}}}function S(e){let{value:t,step:i,locale:o,hourCycle:c,onSelect:l,label:u,min:d,max:f,emptyLabel:p,separated:m}=e,h=(0,g.useMemo)(()=>s.l(i,{min:d,max:f}),[i,d,f]),v=s.s(t,i),y=Math.max(0,v?h.indexOf(v):h.indexOf(`09:00:00`)),b=r.t({count:h.length,defaultActiveIndex:y,loop:!1,onSelect:(e,t)=>l(h[e],t)}),x=m?{ps:2,bs:1}:{};return h.length===0?(0,_.jsx)(n.default,{component:`datePicker.empty`,flexGrow:1,px:3,py:1.5,fontSize:14,...x,props:{role:`status`},children:p}):(0,_.jsx)(n.default,{component:`datePicker.times`,position:`relative`,display:`flex`,d:`column`,flexGrow:1,gap:.5,maxHeight:72,overflowY:`auto`,p:1,...x,props:{role:`listbox`,"aria-label":u,onKeyDown:b.onKeyDown},children:h.map((e,t)=>(0,_.jsx)(n.default,{component:`datePicker.time`,variant:{selected:e===v},px:3,py:1.5,borderRadius:2,fontSize:14,textAlign:`start`,whiteSpace:`nowrap`,css:{fontVariantNumeric:`tabular-nums`},props:{role:`option`,"aria-selected":e===v,...b.itemProps(t),onClick:t=>l(e,t)},children:a.t(e,{locale:o,hour:`numeric`,minute:`2-digit`,hourCycle:c===void 0?void 0:c===12?`h12`:`h23`})},e))})}function C(e){return(0,_.jsx)(n.default,{component:`datePicker.presets`,display:`flex`,d:`column`,gap:.5,pe:2,be:1,props:{role:`group`},children:e.presets.map(t=>(0,_.jsx)(n.default,{tag:`button`,component:`datePicker.preset`,variant:{selected:e.isSelected(t.value)},px:3,py:1.5,borderRadius:2,fontSize:14,textAlign:`start`,whiteSpace:`nowrap`,props:{type:`button`,onClick:n=>e.onSelect(t.value,n)},children:t.label},t.label))})}function w(e){let{frame:t,attachField:i,attachTrigger:a,triggerAttributes:o,triggerElement:s,id:c,label:l,labelledBy:u,describedBy:d}=e,{text:f,placeholder:p,icon:m,clear:h,disabled:v,invalid:y,required:b=!1,tabIndex:x,inputs:S,onReset:C}=e,w=(0,g.useRef)(null),T=l===void 0?void 0:`${c}-label`,E=`${c}-value`,D=r.a(C);return(0,g.useEffect)(()=>{let e=w.current?.form;if(e)return e.addEventListener(`reset`,D),()=>e.removeEventListener(`reset`,D)},[D]),(0,_.jsxs)(_.Fragment,{children:[l!==void 0&&(0,_.jsx)(n.default,{component:`dateField.label`,display:`block`,mb:1.5,fontSize:14,id:T,props:{onClick:()=>s?.focus()},children:l}),(0,_.jsxs)(n.default,{ref:i,component:`dateField`,display:`inline-flex`,ai:`center`,position:`relative`,cursor:`pointer`,css:{fontVariantNumeric:`tabular-nums`},...t,variant:[t.variant,{disabled:v,invalid:y}],children:[(0,_.jsx)(n.default,{tag:`button`,ref:a,component:`datePicker.value`,variant:{placeholder:!f},flexGrow:1,textAlign:`start`,whiteSpace:`nowrap`,css:{font:`inherit`},after:{position:`absolute`,inset:0},disabled:v,props:{type:`button`,tabIndex:x,"aria-labelledby":[T,u,E].filter(Boolean).join(` `),"aria-describedby":d,"aria-invalid":y||void 0,...o},children:(0,_.jsx)(`span`,{id:E,children:f||p})}),(0,_.jsxs)(n.default,{display:`inline-flex`,ai:`center`,gap:1,ms:2,children:[h,(0,_.jsx)(n.default,{component:`datePicker.icon`,display:`inline-flex`,ai:`center`,jc:`center`,width:7,height:7,me:-1.5,props:{"aria-hidden":!0},children:m})]}),S.map((e,t)=>b?(0,_.jsx)(n.default,{tag:`input`,ref:t===0?w:void 0,component:`dateField.validation`,required:!0,disabled:v,props:{type:`text`,name:e.name,value:e.value,tabIndex:-1,"aria-hidden":!0,onChange:()=>{},onFocus:()=>s?.focus()}},t):e.name===void 0?null:(0,_.jsx)(`input`,{ref:t===0?w:void 0,type:`hidden`,name:e.name,value:e.value,disabled:v},t))]})]})}function T(e,t){let{type:r=`date`,value:i,defaultValue:s=null,onValueChange:l,zone:f,locale:p,hourCycle:m,granularity:g,disambiguation:T,min:E,max:D,isDateUnavailable:O,disabled:k=!1,readOnly:A=!1,required:j,invalid:ee,name:te,label:M,labelledBy:ne,describedBy:re,open:ie,defaultOpen:ae,onOpenChange:oe,closeOnSelect:N=!0,firstDayOfWeek:se,weekNumbers:ce,side:le=`bottom`,align:ue=`start`,matchWidth:de=r===`time`,emptyTimesLabel:fe=`No times available`,clearable:P=!1,pickOnly:pe=!1,triggerLabel:F,clearLabel:I=`Clear`,tabIndex:L,step:R=30,defaultTime:me=`00:00`,presets:z,showZone:he,...B}=e,V=u.n({locale:p,zone:f===`none`?void 0:f}),{locale:H}=V,U=r===`datetime`&&f!==`none`?V.zone:null,W=U??V.zone,[G,K]=c.a({value:i,defaultValue:s,onChange:(e,t)=>l?.(e,{...t,...o.x(e,W)}),interaction:{component:`datePicker`,type:`valueChange`,content:[`value`]}}),q=F??(r===`time`?`Choose time`:`Choose date`),J=typeof M==`string`?M:q,{attachTrigger:Y,triggerAttributes:ge,triggerElement:X,closeOnChoice:Z,id:Q,attachField:_e,panel:ve}=x({ref:t,open:ie,defaultOpen:ae,onOpenChange:oe,side:le,align:ue,matchWidth:de,label:J}),$=G&&r!==`time`?o.O(G,{zone:W}):null,ye=G&&r!==`date`?o.A(G,{zone:W}):null,be=r===`datetime`?$??o.N(W):null,xe=e=>e&&(be===null||o.O(e,{zone:W})===be)?o.A(e,{zone:W}):null,Se=G?a.t(G,{locale:H,zone:W,hourCycle:m===void 0?void 0:m===12?`h12`:`h23`,...r===`date`?{dateStyle:`medium`}:r===`time`?{timeStyle:`short`}:{dateStyle:`medium`,timeStyle:`short`}}):``,Ce=pe&&G&&U&&(he??U!==V.readerZone)?a.s(U,{locale:H,style:`short`,at:G}):null,we=Z,Te=(e,t)=>o.r(e,t,U?{zone:U,disambiguation:T}:{}),Ee=(e,t)=>{e&&(r===`date`?(K(e,{reason:`select`,event:t}),N&&we(t)):K(Te(e,ye??me),{reason:`select`,event:t}))},De=(e,t)=>{K(r===`time`?e:Te($??o.N(W),e),{reason:`select`,event:t}),N&&we(t)},Oe=(0,_.jsx)(n.default,{tag:`button`,ref:Y,component:`datePicker.trigger`,display:`inline-flex`,ai:`center`,jc:`center`,width:7,height:7,ms:2,me:-1.5,borderRadius:1.5,disabled:k||A,props:{type:`button`,"aria-label":Se?`${q}, ${Se}`:q,tabIndex:L,...ge},children:r===`time`?(0,_.jsx)(y,{}):(0,_.jsx)(v,{})}),ke=P&&G&&!k&&!A&&(0,_.jsx)(n.default,{tag:`button`,component:`datePicker.clear`,display:`inline-flex`,ai:`center`,jc:`center`,width:6,height:6,ms:1,borderRadius:999,position:`relative`,zIndex:1,props:{type:`button`,"aria-label":I,tabIndex:L,onClick:e=>K(null,{reason:`clear`,event:e})},children:(0,_.jsx)(b,{})}),Ae=G!==null&&(E!=null&&o.i(G,E)<0||D!=null&&o.i(G,D)>0),je=pe?(0,_.jsx)(w,{frame:B,attachField:_e,attachTrigger:A?void 0:Y,triggerAttributes:A?void 0:ge,triggerElement:X,id:Q,label:M,labelledBy:ne,describedBy:re,text:Ce?`${Se} ${Ce}`:Se,placeholder:q,icon:r===`time`?(0,_.jsx)(y,{}):(0,_.jsx)(v,{}),clear:ke,disabled:k,invalid:ee??(Ae||$!==null&&!!O?.($)),required:j,tabIndex:L,inputs:[{name:te,value:G??``}],onReset:e=>K(s,{reason:`reset`,event:e})}):(0,_.jsx)(h.default,{ref:_e,...B,type:r,value:G,onValueChange:(e,t)=>K(e,{reason:t.reason,event:t.event}),zone:f,locale:p,hourCycle:m,granularity:g,disambiguation:T,min:E,max:D,isDateUnavailable:O,disabled:k,readOnly:A,required:j,invalid:ee,name:te,label:M,labelledBy:ne,describedBy:re,showZone:he,tabIndex:L,end:(0,_.jsxs)(_.Fragment,{children:[ke,Oe]})});return(0,_.jsxs)(c.t,{children:[je,ve((0,_.jsxs)(n.default,{display:`flex`,gap:3,ai:`stretch`,children:[z&&z.length>0&&(0,_.jsx)(C,{presets:z,isSelected:e=>G!==null&&o.i(e,G,{zone:W})===0,onSelect:(e,t)=>{K(e,{reason:`preset`,event:t}),N&&we(t)}}),r!==`time`&&(0,_.jsx)(d.default,{value:$,onValueChange:(e,t)=>Ee(e,t.event),min:E?o.O(E,{zone:W}):void 0,max:D?o.O(D,{zone:W}):void 0,isDateUnavailable:O,locale:p,zone:f===`none`?void 0:f,firstDayOfWeek:se,weekNumbers:ce}),r!==`date`&&(0,_.jsx)(S,{value:ye,step:R,locale:H,hourCycle:m,label:r===`time`?J:`Time`,min:xe(E),max:xe(D),emptyLabel:fe,separated:r===`datetime`,onSelect:De})]}))]})}function E(e,t){let{value:r,defaultValue:i=null,onValueChange:s,locale:l,min:f,max:p,isDateUnavailable:m,disabled:y=!1,readOnly:S=!1,required:T,invalid:E,startName:D,endName:O,label:k,labelledBy:A,describedBy:j,startLabel:ee=`Start date`,endLabel:te=`End date`,open:M,defaultOpen:ne,onOpenChange:re,closeOnSelect:ie=!0,firstDayOfWeek:ae,weekNumbers:oe,months:N=2,side:se=`bottom`,align:ce=`start`,matchWidth:le=!1,emptyTimesLabel:ue,clearable:de=!1,pickOnly:fe=!1,triggerLabel:P=`Choose dates`,clearLabel:pe=`Clear`,tabIndex:F,presets:I,props:L,...R}=e,{locale:me}=u.n({locale:l}),[z,he]=c.a({value:r,defaultValue:i,onChange:s,interaction:{component:`dateRangePicker`,type:`valueChange`,content:[`value`]}}),[B,V]=(0,g.useState)({start:z?.start??null,end:z?.end??null,source:z}),{start:H,end:U}=B;B.source!==z&&(H=z?.start??null,U=z?.end??null,V({start:H,end:U,source:z}));let{attachTrigger:W,triggerAttributes:G,triggerElement:K,closeOnChoice:q,id:J,attachField:Y,panel:ge}=x({ref:t,open:M,defaultOpen:ne,onOpenChange:re,side:se,align:ce,matchWidth:le,label:typeof k==`string`?k:P}),X=z?a.n(z.start,z.end,{locale:me}):``,Z=H!==null&&U!==null&&o.i(H,U)>0,Q=(e,t,n,r)=>{let i=e&&t&&o.i(e,t)<=0?{start:e,end:t}:null;V({start:e,end:t,source:i}),he(i,{reason:n,event:r})},_e=q,ve={locale:l,min:f,max:p,isDateUnavailable:m,disabled:y,readOnly:S,required:T,component:`datePicker.part`,px:0,py:0,tabIndex:F},$=de&&z&&!y&&!S&&(0,_.jsx)(n.default,{tag:`button`,component:`datePicker.clear`,display:`inline-flex`,ai:`center`,jc:`center`,width:6,height:6,borderRadius:999,position:`relative`,zIndex:1,props:{type:`button`,"aria-label":pe,tabIndex:F,onClick:e=>Q(null,null,`clear`,e)},children:(0,_.jsx)(b,{})}),ye=z!==null&&(f!=null&&o.i(z.start,f)<0||p!=null&&o.i(z.end,p)>0),be=fe?(0,_.jsx)(w,{frame:{...R,props:L},attachField:Y,attachTrigger:S?void 0:W,triggerAttributes:S?void 0:G,triggerElement:K,id:J,label:k,labelledBy:A,describedBy:j,text:X,placeholder:P,icon:(0,_.jsx)(v,{}),clear:$,disabled:y,invalid:E??ye,required:T,tabIndex:F,inputs:[{name:D,value:z?.start??``},{name:O,value:z?.end??``}],onReset:e=>Q(i?.start??null,i?.end??null,`reset`,e)}):(0,_.jsxs)(_.Fragment,{children:[k!==void 0&&(0,_.jsx)(n.default,{component:`dateField.label`,display:`block`,mb:1.5,fontSize:14,id:`${J}-label`,children:k}),(0,_.jsxs)(n.default,{ref:Y,component:`dateField`,display:`inline-flex`,ai:`center`,gap:2,px:3,py:2,...R,variant:[R.variant,{disabled:y,invalid:E??Z}],props:{role:`group`,"aria-labelledby":[k===void 0?void 0:`${J}-label`,A].filter(Boolean).join(` `)||void 0,"aria-invalid":(E??Z)||void 0,"aria-describedby":j,...L},children:[(0,_.jsx)(h.default,{...ve,value:H,onValueChange:(e,t)=>Q(e,U,t.reason,t.event),name:D,props:{"aria-label":ee},invalid:E??Z}),(0,_.jsx)(n.default,{component:`dateField.literal`,props:{"aria-hidden":!0},children:`–`}),(0,_.jsx)(h.default,{...ve,value:U,onValueChange:(e,t)=>Q(H,e,t.reason,t.event),name:O,props:{"aria-label":te},invalid:E??Z}),(0,_.jsxs)(n.default,{display:`inline-flex`,ai:`center`,gap:2,ms:`auto`,children:[$,(0,_.jsx)(n.default,{tag:`button`,ref:W,component:`datePicker.trigger`,display:`inline-flex`,ai:`center`,jc:`center`,width:7,height:7,me:-1.5,borderRadius:1.5,disabled:y||S,props:{type:`button`,"aria-label":X?`${P}, ${X}`:P,tabIndex:F,...G},children:(0,_.jsx)(v,{})})]})]})]});return(0,_.jsxs)(c.t,{children:[be,ge((0,_.jsxs)(n.default,{display:`flex`,gap:3,ai:`stretch`,children:[I&&I.length>0&&(0,_.jsx)(C,{presets:I,isSelected:e=>z!==null&&e.start===z.start&&e.end===z.end,onSelect:(e,t)=>{Q(e.start,e.end,`preset`,t),ie&&_e(t)}}),(0,_.jsx)(d.default,{mode:`range`,months:N,value:z,defaultFocusedDate:H??void 0,onValueChange:(e,t)=>{Q(e?.start??null,e?.end??null,`select`,t.event),ie&&e&&t.event&&_e(t.event)},min:f,max:p,isDateUnavailable:m,locale:l,firstDayOfWeek:ae,weekNumbers:oe})]}))]})}var D=e.f(T,`DatePicker`),O=e.f(E,`DateRangePicker`);exports.DateRangePicker=O,exports.default=D;
|
|
1
|
+
"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../placement.cjs"),a=require("../dates.cjs"),o=require("../date-math.cjs"),s=require("../date-input.cjs"),c=require("../reporting.cjs"),l=require("./svg.cjs"),u=require("../date-environment.cjs"),d=require("./calendar.cjs"),f=require("../layer.cjs"),p=require("./overlay.cjs"),m=require("../motion.cjs"),h=require("./dateField.cjs");let g=require("react"),_=require("react/jsx-runtime");function v(){return(0,_.jsx)(l.Svg,{viewBox:`0 0 16 16`,width:`1rem`,height:`1rem`,props:{fill:`none`},children:(0,_.jsx)(l.Path,{d:`M3 3.5h10a1 1 0 0 1 1 1V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4.5a1 1 0 0 1 1-1ZM2 7h12M5.5 2v3M10.5 2v3`,stroke:`currentColor`,strokeWidth:1.5,strokeLinecap:`round`})})}function y(){return(0,_.jsx)(l.Svg,{viewBox:`0 0 16 16`,width:`1rem`,height:`1rem`,props:{fill:`none`},children:(0,_.jsx)(l.Path,{d:`M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12ZM8 5v3l2 1.5`,stroke:`currentColor`,strokeWidth:1.5,strokeLinecap:`round`,strokeLinejoin:`round`})})}function b(){return(0,_.jsx)(l.Svg,{viewBox:`0 0 16 16`,width:`0.875rem`,height:`0.875rem`,props:{fill:`none`},children:(0,_.jsx)(l.Path,{d:`m4.5 4.5 7 7m0-7-7 7`,stroke:`currentColor`,strokeWidth:1.5,strokeLinecap:`round`})})}function x(e){let[a,o]=(0,g.useState)(null),s=e.ref,c=(0,g.useCallback)(e=>{o(e),t.d(s,e)},[s]),l=e=>{if(!e||e.contains(document.activeElement)&&document.activeElement!==e)return;let t=[`[data-date][tabindex="0"]`,`[role="option"][tabindex="0"]`,`button:not([disabled])`].map(t=>e.querySelector(t)).find(Boolean),n=e.querySelector(`[role="listbox"]`),r=n?.querySelector(`[role="option"][tabindex="0"]`);n&&r&&(n.scrollTop=r.offsetTop-n.clientHeight/2+r.offsetHeight/2),(t??e).focus({preventScroll:!0})},u=r.a(e=>l(e)),{platform:d,isOpen:h,id:v,setPanel:y,setOpen:b,trigger:x,triggerElement:S,panelElement:C}=f.t({haspopup:`dialog`,idPrefix:`date-picker`,open:e.open,defaultOpen:e.defaultOpen,onOpenChange:e.onOpenChange,interaction:{component:`datePicker`,type:`openChange`},onOpened:u}),w=i.t({side:e.side,align:e.align,offset:1,flip:!0,matchWidth:e.matchWidth,anchor:a});(0,g.useEffect)(()=>{h&&l(C)},[h,C]);let T=(0,g.useCallback)(()=>C,[C]),E=m.n(h,T);return{attachTrigger:x.ref,triggerAttributes:x.props,triggerElement:S,closeOnChoice:e=>{S?.focus(),b(!1,{reason:`select`,event:e})},id:v,attachField:c,panel:t=>{let r={role:`dialog`,"aria-label":e.label,tabIndex:-1};return d?(0,_.jsx)(n.default,{ref:y,component:`popover`,variant:{topLayer:!0},p:3,...w.layerProps,id:v,props:{popover:`auto`,...r},children:E===`closed`?null:t}):h&&(0,_.jsx)(p.default,{contentRef:y,anchor:a,side:e.side,align:e.align,offset:1,matchWidth:e.matchWidth,component:`popover`,p:3,id:v,props:r,children:t})}}}function S(e){let{value:t,step:i,locale:o,hourCycle:c,onSelect:l,label:u,min:d,max:f,emptyLabel:p,separated:m}=e,h=(0,g.useMemo)(()=>s.l(i,{min:d,max:f}),[i,d,f]),v=s.s(t,i),y=Math.max(0,v?h.indexOf(v):h.indexOf(`09:00:00`)),b=r.t({count:h.length,defaultActiveIndex:y,loop:!1,onSelect:(e,t)=>l(h[e],t)}),x=m?{ps:2,bs:1}:{};return h.length===0?(0,_.jsx)(n.default,{component:`datePicker.empty`,flexGrow:1,px:3,py:1.5,fontSize:14,...x,props:{role:`status`},children:p}):(0,_.jsx)(n.default,{component:`datePicker.times`,position:`relative`,display:`flex`,d:`column`,flexGrow:1,gap:.5,maxHeight:72,overflowY:`auto`,p:1,...x,props:{role:`listbox`,"aria-label":u,onKeyDown:b.onKeyDown},children:h.map((e,t)=>(0,_.jsx)(n.default,{component:`datePicker.time`,variant:{selected:e===v},px:3,py:1.5,borderRadius:2,fontSize:14,textAlign:`start`,whiteSpace:`nowrap`,css:{fontVariantNumeric:`tabular-nums`},props:{role:`option`,"aria-selected":e===v,...b.itemProps(t),onClick:t=>l(e,t)},children:a.t(e,{locale:o,hour:`numeric`,minute:`2-digit`,hourCycle:c===void 0?void 0:c===12?`h12`:`h23`})},e))})}function C(e){return(0,_.jsx)(n.default,{component:`datePicker.presets`,display:`flex`,d:`column`,gap:.5,pe:2,be:1,props:{role:`group`},children:e.presets.map(t=>(0,_.jsx)(n.default,{tag:`button`,component:`datePicker.preset`,variant:{selected:e.isSelected(t.value)},px:3,py:1.5,borderRadius:2,fontSize:14,textAlign:`start`,whiteSpace:`nowrap`,props:{type:`button`,onClick:n=>e.onSelect(t.value,n)},children:t.label},t.label))})}function w(e){let{frame:t,attachField:i,attachTrigger:a,triggerAttributes:o,triggerElement:s,id:c,label:l,labelledBy:u,describedBy:d}=e,{text:f,placeholder:p,icon:m,clear:h,disabled:v,invalid:y,required:b=!1,tabIndex:x,inputs:S,onReset:C}=e,w=(0,g.useRef)(null),T=l===void 0?void 0:`${c}-label`,E=`${c}-value`,D=r.a(C);return(0,g.useEffect)(()=>{let e=w.current?.form;if(e)return e.addEventListener(`reset`,D),()=>e.removeEventListener(`reset`,D)},[D]),(0,_.jsxs)(_.Fragment,{children:[l!==void 0&&(0,_.jsx)(n.default,{component:`dateField.label`,display:`block`,mb:1.5,fontSize:14,id:T,props:{onClick:()=>s?.focus()},children:l}),(0,_.jsxs)(n.default,{ref:i,component:`dateField`,display:`inline-flex`,ai:`center`,position:`relative`,cursor:`pointer`,css:{fontVariantNumeric:`tabular-nums`},...t,variant:[t.variant,{disabled:v,invalid:y}],children:[(0,_.jsx)(n.default,{tag:`button`,ref:a,component:`datePicker.value`,variant:{placeholder:!f},flexGrow:1,textAlign:`start`,whiteSpace:`nowrap`,css:{font:`inherit`},after:{position:`absolute`,inset:0},disabled:v,props:{type:`button`,tabIndex:x,"aria-labelledby":[T,u,E].filter(Boolean).join(` `),"aria-describedby":d,"aria-invalid":y||void 0,...o},children:(0,_.jsx)(`span`,{id:E,children:f||p})}),(0,_.jsxs)(n.default,{display:`inline-flex`,ai:`center`,gap:1,ms:2,children:[h,(0,_.jsx)(n.default,{component:`datePicker.icon`,display:`inline-flex`,ai:`center`,jc:`center`,width:7,height:7,me:-1.5,props:{"aria-hidden":!0},children:m})]}),S.map((e,t)=>b?(0,_.jsx)(n.default,{tag:`input`,ref:t===0?w:void 0,component:`dateField.validation`,required:!0,disabled:v,props:{type:`text`,name:e.name,value:e.value,tabIndex:-1,"aria-hidden":!0,onChange:()=>{},onFocus:()=>s?.focus()}},t):e.name===void 0?null:(0,_.jsx)(`input`,{ref:t===0?w:void 0,type:`hidden`,name:e.name,value:e.value,disabled:v},t))]})]})}function T(e,t){let{type:r=`date`,value:i,defaultValue:s=null,onValueChange:l,zone:f,locale:p,hourCycle:m,granularity:g,disambiguation:T,min:E,max:D,isDateUnavailable:O,disabled:k=!1,readOnly:A=!1,required:j,invalid:ee,name:te,label:M,labelledBy:ne,describedBy:re,open:ie,defaultOpen:ae,onOpenChange:oe,closeOnSelect:N=!0,firstDayOfWeek:se,weekNumbers:ce,side:le=`bottom`,align:ue=`start`,matchWidth:de=r===`time`,emptyTimesLabel:fe=`No times available`,clearable:P=!1,pickOnly:pe=!1,triggerLabel:F,clearLabel:I=`Clear`,tabIndex:L,step:R=30,defaultTime:me=`00:00`,presets:z,showZone:he,...B}=e,V=u.n({locale:p,zone:f===`none`?void 0:f}),{locale:H}=V,U=r===`datetime`&&f!==`none`?V.zone:null,W=U??V.zone,[G,K]=c.a({value:i,defaultValue:s,onChange:(e,t)=>l?.(e,{...t,...o.x(e,W)}),interaction:{component:`datePicker`,type:`valueChange`,content:[`value`]}}),q=F??(r===`time`?`Choose time`:`Choose date`),J=typeof M==`string`?M:q,{attachTrigger:Y,triggerAttributes:ge,triggerElement:X,closeOnChoice:Z,id:Q,attachField:_e,panel:ve}=x({ref:t,open:ie,defaultOpen:ae,onOpenChange:oe,side:le,align:ue,matchWidth:de,label:J}),$=G&&r!==`time`?o.O(G,{zone:W}):null,ye=G&&r!==`date`?o.A(G,{zone:W}):null,be=r===`datetime`?$??o.N(W):null,xe=e=>e&&(be===null||o.O(e,{zone:W})===be)?o.A(e,{zone:W}):null,Se=G?a.t(G,{locale:H,zone:W,hourCycle:m===void 0?void 0:m===12?`h12`:`h23`,...r===`date`?{dateStyle:`medium`}:r===`time`?{timeStyle:`short`}:{dateStyle:`medium`,timeStyle:`short`}}):``,Ce=pe&&G&&U&&(he??U!==V.readerZone)?a.s(U,{locale:H,style:`short`,at:G}):null,we=Z,Te=(e,t)=>o.r(e,t,U?{zone:U,disambiguation:T}:{}),Ee=(e,t)=>{e&&(r===`date`?(K(e,{reason:`select`,event:t}),N&&we(t)):K(Te(e,ye??me),{reason:`select`,event:t}))},De=(e,t)=>{K(r===`time`?e:Te($??o.N(W),e),{reason:`select`,event:t}),N&&we(t)},Oe=(0,_.jsx)(n.default,{tag:`button`,ref:Y,component:`datePicker.trigger`,display:`inline-flex`,ai:`center`,jc:`center`,width:7,height:7,ms:2,me:-1.5,borderRadius:1.5,disabled:k||A,props:{type:`button`,"aria-label":Se?`${q}, ${Se}`:q,tabIndex:L,...ge},children:r===`time`?(0,_.jsx)(y,{}):(0,_.jsx)(v,{})}),ke=P&&G&&!k&&!A&&(0,_.jsx)(n.default,{tag:`button`,component:`datePicker.clear`,display:`inline-flex`,ai:`center`,jc:`center`,width:6,height:6,ms:1,borderRadius:999,position:`relative`,zIndex:1,props:{type:`button`,"aria-label":I,tabIndex:L,onClick:e=>K(null,{reason:`clear`,event:e})},children:(0,_.jsx)(b,{})}),Ae=G!==null&&(E!=null&&o.i(G,E)<0||D!=null&&o.i(G,D)>0),je=pe?(0,_.jsx)(w,{frame:B,attachField:_e,attachTrigger:A?void 0:Y,triggerAttributes:A?void 0:ge,triggerElement:X,id:Q,label:M,labelledBy:ne,describedBy:re,text:Ce?`${Se} ${Ce}`:Se,placeholder:q,icon:r===`time`?(0,_.jsx)(y,{}):(0,_.jsx)(v,{}),clear:ke,disabled:k,invalid:ee??(Ae||$!==null&&!!O?.($)),required:j,tabIndex:L,inputs:[{name:te,value:G??``}],onReset:e=>K(s,{reason:`reset`,event:e})}):(0,_.jsx)(h.default,{ref:_e,...B,type:r,value:G,onValueChange:(e,t)=>K(e,{reason:t.reason,event:t.event}),zone:f,locale:p,hourCycle:m,granularity:g,disambiguation:T,min:E,max:D,isDateUnavailable:O,disabled:k,readOnly:A,required:j,invalid:ee,name:te,label:M,labelledBy:ne,describedBy:re,showZone:he,tabIndex:L,end:(0,_.jsxs)(_.Fragment,{children:[ke,Oe]})});return(0,_.jsxs)(c.t,{children:[je,ve((0,_.jsxs)(n.default,{display:`flex`,gap:3,ai:`stretch`,children:[z&&z.length>0&&(0,_.jsx)(C,{presets:z,isSelected:e=>G!==null&&o.i(e,G,{zone:W})===0,onSelect:(e,t)=>{K(e,{reason:`preset`,event:t}),N&&we(t)}}),r!==`time`&&(0,_.jsx)(d.default,{value:$,onValueChange:(e,t)=>Ee(e,t.event),min:E?o.O(E,{zone:W}):void 0,max:D?o.O(D,{zone:W}):void 0,isDateUnavailable:O,locale:p,zone:f===`none`?void 0:f,firstDayOfWeek:se,weekNumbers:ce}),r!==`date`&&(0,_.jsx)(S,{value:ye,step:R,locale:H,hourCycle:m,label:r===`time`?J:`Time`,min:xe(E),max:xe(D),emptyLabel:fe,separated:r===`datetime`,onSelect:De})]}))]})}function E(e,t){let{value:r,defaultValue:i=null,onValueChange:s,locale:l,min:f,max:p,isDateUnavailable:m,disabled:y=!1,readOnly:S=!1,required:T,invalid:E,startName:D,endName:O,label:k,labelledBy:A,describedBy:j,startLabel:ee=`Start date`,endLabel:te=`End date`,open:M,defaultOpen:ne,onOpenChange:re,closeOnSelect:ie=!0,firstDayOfWeek:ae,weekNumbers:oe,months:N=2,side:se=`bottom`,align:ce=`start`,matchWidth:le=!1,emptyTimesLabel:ue,clearable:de=!1,pickOnly:fe=!1,triggerLabel:P=`Choose dates`,clearLabel:pe=`Clear`,tabIndex:F,presets:I,props:L,...R}=e,{locale:me}=u.n({locale:l}),[z,he]=c.a({value:r,defaultValue:i,onChange:s,interaction:{component:`dateRangePicker`,type:`valueChange`,content:[`value`]}}),[B,V]=(0,g.useState)({start:z?.start??null,end:z?.end??null,source:z}),{start:H,end:U}=B;B.source!==z&&(H=z?.start??null,U=z?.end??null,V({start:H,end:U,source:z}));let{attachTrigger:W,triggerAttributes:G,triggerElement:K,closeOnChoice:q,id:J,attachField:Y,panel:ge}=x({ref:t,open:M,defaultOpen:ne,onOpenChange:re,side:se,align:ce,matchWidth:le,label:typeof k==`string`?k:P}),X=z?a.n(z.start,z.end,{locale:me}):``,Z=H!==null&&U!==null&&o.i(H,U)>0,Q=(e,t,n,r)=>{let i=e&&t&&o.i(e,t)<=0?{start:e,end:t}:null;V({start:e,end:t,source:i}),he(i,{reason:n,event:r})},_e=q,ve={locale:l,min:f,max:p,isDateUnavailable:m,disabled:y,readOnly:S,required:T,component:`datePicker.part`,px:0,py:0,tabIndex:F},$=de&&z&&!y&&!S&&(0,_.jsx)(n.default,{tag:`button`,component:`datePicker.clear`,display:`inline-flex`,ai:`center`,jc:`center`,width:6,height:6,borderRadius:999,position:`relative`,zIndex:1,props:{type:`button`,"aria-label":pe,tabIndex:F,onClick:e=>Q(null,null,`clear`,e)},children:(0,_.jsx)(b,{})}),ye=z!==null&&(f!=null&&o.i(z.start,f)<0||p!=null&&o.i(z.end,p)>0),be=fe?(0,_.jsx)(w,{frame:{...R,props:L},attachField:Y,attachTrigger:S?void 0:W,triggerAttributes:S?void 0:G,triggerElement:K,id:J,label:k,labelledBy:A,describedBy:j,text:X,placeholder:P,icon:(0,_.jsx)(v,{}),clear:$,disabled:y,invalid:E??ye,required:T,tabIndex:F,inputs:[{name:D,value:z?.start??``},{name:O,value:z?.end??``}],onReset:e=>Q(i?.start??null,i?.end??null,`reset`,e)}):(0,_.jsxs)(_.Fragment,{children:[k!==void 0&&(0,_.jsx)(n.default,{component:`dateField.label`,display:`block`,mb:1.5,fontSize:14,id:`${J}-label`,children:k}),(0,_.jsxs)(n.default,{ref:Y,component:`dateField`,display:`inline-flex`,ai:`center`,gap:2,px:3,py:2,...R,variant:[R.variant,{disabled:y,invalid:E??Z}],props:{role:`group`,"aria-labelledby":[k===void 0?void 0:`${J}-label`,A].filter(Boolean).join(` `)||void 0,"aria-invalid":(E??Z)||void 0,"aria-describedby":j,...L},children:[(0,_.jsx)(h.default,{...ve,value:H,onValueChange:(e,t)=>Q(e,U,t.reason,t.event),name:D,props:{"aria-label":ee},invalid:E??Z}),(0,_.jsx)(n.default,{component:`dateField.literal`,props:{"aria-hidden":!0},children:`–`}),(0,_.jsx)(h.default,{...ve,value:U,onValueChange:(e,t)=>Q(H,e,t.reason,t.event),name:O,props:{"aria-label":te},invalid:E??Z}),(0,_.jsxs)(n.default,{display:`inline-flex`,ai:`center`,gap:2,ms:`auto`,children:[$,(0,_.jsx)(n.default,{tag:`button`,ref:W,component:`datePicker.trigger`,display:`inline-flex`,ai:`center`,jc:`center`,width:7,height:7,me:-1.5,borderRadius:1.5,disabled:y||S,props:{type:`button`,"aria-label":X?`${P}, ${X}`:P,tabIndex:F,...G},children:(0,_.jsx)(v,{})})]})]})]});return(0,_.jsxs)(c.t,{children:[be,ge((0,_.jsxs)(n.default,{display:`flex`,gap:3,ai:`stretch`,children:[I&&I.length>0&&(0,_.jsx)(C,{presets:I,isSelected:e=>z!==null&&e.start===z.start&&e.end===z.end,onSelect:(e,t)=>{Q(e.start,e.end,`preset`,t),ie&&_e(t)}}),(0,_.jsx)(d.default,{mode:`range`,months:N,value:z,defaultFocusedDate:H??void 0,onValueChange:(e,t)=>{Q(e?.start??null,e?.end??null,`select`,t.event),ie&&e&&t.event&&_e(t.event)},min:f,max:p,isDateUnavailable:m,locale:l,firstDayOfWeek:ae,weekNumbers:oe})]}))]})}var D=e.f(T,`DatePicker`),O=e.f(E,`DateRangePicker`);exports.DateRangePicker=O,exports.default=D;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { f as e } from "../react-shared.mjs";
|
|
3
|
-
import {
|
|
3
|
+
import { d as t } from "../platform.mjs";
|
|
4
4
|
import n from "../box.mjs";
|
|
5
5
|
import { a as r, t as i } from "../behavior.mjs";
|
|
6
6
|
import { t as a } from "../placement.mjs";
|
|
@@ -82,10 +82,7 @@ function oe(e) {
|
|
|
82
82
|
component: "datePicker",
|
|
83
83
|
type: "openChange"
|
|
84
84
|
},
|
|
85
|
-
onOpened: u
|
|
86
|
-
onClosing: (e, t) => {
|
|
87
|
-
e && t?.focus();
|
|
88
|
-
}
|
|
85
|
+
onOpened: u
|
|
89
86
|
}), y = a({
|
|
90
87
|
side: e.side,
|
|
91
88
|
align: e.align,
|
package/components/dialog.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../client.cjs"),r=require("../effects.cjs"),i=require("../box.cjs"),a=require("../behavior.cjs"),o=require("../identity.cjs"),s=require("../reporting.cjs"),c=require("../motion.cjs"),l=require("./semantics.cjs");let u=require("react"),d=require("react/jsx-runtime");var f=0;function p(e){let{classNames:i,styleElements:a}=n.i({overflow:`hidden`},!1),o=i.slice(1).join(` `);return r.n(()=>{let n=t.n();if(!(!e||!n||!o))return f+=1,n.classList.add(o),()=>{--f,f===0&&n.classList.remove(o)}},[e,o]),a}var m=(0,u.createContext)(null);function h(e){let t=(0,u.useContext)(m);if(!t)throw Error(`<${e}> must be rendered inside a <Dialog>.`);return t}function g(e,t){return(0,d.jsx)(v,{role:`dialog`,...e,elementRef:t})}function _(e,t){return(0,d.jsx)(v,{role:`alertdialog`,...e,modal:!0,dismissible:!1,elementRef:t})}function v(e){let{role:n,trigger:l,children:f,open:h,defaultOpen:g=!1,onOpenChange:_,label:v,labelledBy:b,describedBy:x,modal:S=!0,dismissible:C=!0,lockScroll:w=S,initialFocus:T,elementRef:E,props:D,...O}=e,k=o.t(`dialog`),A=O.id??k,[j,M]=s.a({value:h,defaultValue:g,onChange:_,interaction:{component:n===`alertdialog`?`alertDialog`:`dialog`,type:`openChange`}}),[N,P]=(0,u.useState)(null),F=(0,u.useCallback)(e=>{P(e),t.
|
|
1
|
+
"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../client.cjs"),r=require("../effects.cjs"),i=require("../box.cjs"),a=require("../behavior.cjs"),o=require("../identity.cjs"),s=require("../reporting.cjs"),c=require("../motion.cjs"),l=require("./semantics.cjs");let u=require("react"),d=require("react/jsx-runtime");var f=0;function p(e){let{classNames:i,styleElements:a}=n.i({overflow:`hidden`},!1),o=i.slice(1).join(` `);return r.n(()=>{let n=t.n();if(!(!e||!n||!o))return f+=1,n.classList.add(o),()=>{--f,f===0&&n.classList.remove(o)}},[e,o]),a}var m=(0,u.createContext)(null);function h(e){let t=(0,u.useContext)(m);if(!t)throw Error(`<${e}> must be rendered inside a <Dialog>.`);return t}function g(e,t){return(0,d.jsx)(v,{role:`dialog`,...e,elementRef:t})}function _(e,t){return(0,d.jsx)(v,{role:`alertdialog`,...e,modal:!0,dismissible:!1,elementRef:t})}function v(e){let{role:n,trigger:l,children:f,open:h,defaultOpen:g=!1,onOpenChange:_,label:v,labelledBy:b,describedBy:x,modal:S=!0,dismissible:C=!0,lockScroll:w=S,initialFocus:T,elementRef:E,props:D,...O}=e,k=o.t(`dialog`),A=O.id??k,[j,M]=s.a({value:h,defaultValue:g,onChange:_,interaction:{component:n===`alertdialog`?`alertDialog`:`dialog`,type:`openChange`}}),[N,P]=(0,u.useState)(null),F=(0,u.useCallback)(e=>{P(e),t.d(E,e)},[E]),[I,L]=(0,u.useState)(null),[R,z]=(0,u.useState)(!1),[B,V]=(0,u.useState)({title:0,description:0}),H=p(j&&w);a.n({enabled:j,returnTo:I});let U=c.t(f,j,N),W=(0,u.useCallback)(e=>(V(t=>({...t,[e]:t[e]+1})),()=>V(t=>({...t,[e]:t[e]-1}))),[]),G=(0,u.useMemo)(()=>({titleId:`${A}-title`,descriptionId:`${A}-description`,register:W}),[A,W]);y({dialog:N,isOpen:j,domOpen:R,setDomOpen:z,setOpen:M,modal:S,dismissible:C,triggerElement:I}),r.n(()=>{let e=t.m(T);!j||!e||e.focus()},[j,T]);let K=a.a(e=>{M(e=>!e,{reason:`trigger`,event:e})}),q=(0,u.useMemo)(()=>({ref:L,props:{"aria-expanded":j,"aria-haspopup":`dialog`,"aria-controls":j?A:void 0,onClick:K}}),[A,K,j]),J=O;return(0,d.jsxs)(d.Fragment,{children:[H,l?.(q),(0,d.jsx)(m.Provider,{value:G,children:(0,d.jsx)(i.default,{ref:F,tag:`dialog`,component:`dialog`,...J,id:A,props:{role:n,"aria-label":B.title||b?void 0:v,"aria-labelledby":b??(B.title?G.titleId:void 0),"aria-describedby":x??(B.description?G.descriptionId:void 0),...D},children:U})})]})}function y(e){let{dialog:n,isOpen:i,domOpen:o,setDomOpen:s,setOpen:c,modal:l,dismissible:d,triggerElement:f}=e,p=(0,u.useRef)(`imperative`),m=t.s(),h=d?`any`:`closerequest`;r.n(()=>{!n||i===o||(s(i),i?l?n.showModal():n.show():n.close())},[n,i,o,l,s]),r.n(()=>{if(!(!n||!i||!l))return t.u(n,!0),()=>t.u(n,!1)},[n,i,l]),r.n(()=>{if(!n)return;let e=new AbortController;return n.addEventListener(`close`,e=>{s(!1),c(!1,{reason:p.current,event:e}),p.current=`imperative`},{signal:e.signal}),()=>e.abort()},[n,s,c]),r.n(()=>{if(!(!n||!m))return n.setAttribute(`closedby`,h),()=>n.removeAttribute(`closedby`)},[n,m,h]),r.n(()=>{if(!i||!n)return;let e=new AbortController,r=(t,n)=>document.addEventListener(t,n,{signal:e.signal,capture:!0});return r(`keydown`,e=>{e.key===`Escape`&&(p.current=`escape`)}),r(`pointerdown`,e=>{t.h(e,[f])?p.current=`trigger`:!t.h(e,[n])||b(n,e)?p.current=`outside-pointer`:p.current=`imperative`}),()=>e.abort()},[i,n,f]),a.r({enabled:i&&!l&&!m,inside:[n],escapeKey:!0,outsidePointer:!1,onDismiss:(e,t)=>c(!1,{reason:`escape`,event:t})}),r.n(()=>{if(!n||!i||!d||m)return;let e=new AbortController;return document.addEventListener(`pointerdown`,e=>{t.h(e,[f])||t.h(e,[n])&&!b(n,e)||c(!1,{reason:`outside-pointer`,event:e})},{signal:e.signal,capture:!0}),()=>e.abort()},[n,i,d,m,f,c])}function b(e,t){if(t.target!==e)return!1;let n=e.getBoundingClientRect();return t.clientX<n.left||t.clientX>n.right||t.clientY<n.top||t.clientY>n.bottom}function x(e){let t=h(`Dialog.Title`);return r.n(()=>t.register(`title`),[t]),(0,d.jsx)(l.H2,{id:t.titleId,component:`dialog.title`,...e})}function S(e){let t=h(`Dialog.Description`);return r.n(()=>t.register(`description`),[t]),(0,d.jsx)(l.P,{id:t.descriptionId,component:`dialog.description`,...e})}x.displayName=`Dialog.Title`,S.displayName=`Dialog.Description`;var C={Title:x,Description:S},w=Object.assign(e.f(g,`Dialog`),C),T=Object.assign(e.f(_,`AlertDialog`),C);exports.AlertDialog=T,exports.default=w;
|
package/components/dialog.mjs
CHANGED
|
@@ -1,44 +1,44 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { f as e } from "../react-shared.mjs";
|
|
3
|
-
import {
|
|
4
|
-
import { i as
|
|
5
|
-
import { n as
|
|
6
|
-
import
|
|
7
|
-
import { a as
|
|
8
|
-
import { t as
|
|
9
|
-
import { a as
|
|
10
|
-
import { t as
|
|
11
|
-
import { H2 as
|
|
12
|
-
import { createContext as
|
|
13
|
-
import { Fragment as
|
|
3
|
+
import { d as t, h as n, m as r, n as i, s as a, u as o } from "../platform.mjs";
|
|
4
|
+
import { i as s } from "../client.mjs";
|
|
5
|
+
import { n as c } from "../effects.mjs";
|
|
6
|
+
import l from "../box.mjs";
|
|
7
|
+
import { a as u, n as d, r as f } from "../behavior.mjs";
|
|
8
|
+
import { t as p } from "../identity.mjs";
|
|
9
|
+
import { a as m } from "../reporting.mjs";
|
|
10
|
+
import { t as h } from "../motion.mjs";
|
|
11
|
+
import { H2 as g, P as _ } from "./semantics.mjs";
|
|
12
|
+
import { createContext as v, useCallback as y, useContext as b, useMemo as x, useRef as S, useState as C } from "react";
|
|
13
|
+
import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
|
|
14
14
|
//#region src/react/dialog/useScrollLock.ts
|
|
15
|
-
var
|
|
16
|
-
function
|
|
17
|
-
let { classNames: t, styleElements: n } =
|
|
18
|
-
return
|
|
19
|
-
let t =
|
|
20
|
-
if (!(!e || !t || !
|
|
21
|
-
--
|
|
15
|
+
var D = 0;
|
|
16
|
+
function O(e) {
|
|
17
|
+
let { classNames: t, styleElements: n } = s({ overflow: "hidden" }, !1), r = t.slice(1).join(" ");
|
|
18
|
+
return c(() => {
|
|
19
|
+
let t = i();
|
|
20
|
+
if (!(!e || !t || !r)) return D += 1, t.classList.add(r), () => {
|
|
21
|
+
--D, D === 0 && t.classList.remove(r);
|
|
22
22
|
};
|
|
23
|
-
}, [e,
|
|
23
|
+
}, [e, r]), n;
|
|
24
24
|
}
|
|
25
25
|
//#endregion
|
|
26
26
|
//#region src/components/dialog.tsx
|
|
27
|
-
var
|
|
28
|
-
function
|
|
29
|
-
let t =
|
|
27
|
+
var k = v(null);
|
|
28
|
+
function A(e) {
|
|
29
|
+
let t = b(k);
|
|
30
30
|
if (!t) throw Error(`<${e}> must be rendered inside a <Dialog>.`);
|
|
31
31
|
return t;
|
|
32
32
|
}
|
|
33
|
-
function
|
|
34
|
-
return /* @__PURE__ */
|
|
33
|
+
function j(e, t) {
|
|
34
|
+
return /* @__PURE__ */ T(N, {
|
|
35
35
|
role: "dialog",
|
|
36
36
|
...e,
|
|
37
37
|
elementRef: t
|
|
38
38
|
});
|
|
39
39
|
}
|
|
40
|
-
function
|
|
41
|
-
return /* @__PURE__ */
|
|
40
|
+
function M(e, t) {
|
|
41
|
+
return /* @__PURE__ */ T(N, {
|
|
42
42
|
role: "alertdialog",
|
|
43
43
|
...e,
|
|
44
44
|
modal: !0,
|
|
@@ -46,55 +46,55 @@ function j(e, t) {
|
|
|
46
46
|
elementRef: t
|
|
47
47
|
});
|
|
48
48
|
}
|
|
49
|
-
function
|
|
50
|
-
let { role:
|
|
49
|
+
function N(e) {
|
|
50
|
+
let { role: n, trigger: i, children: a, open: o, defaultOpen: s = !1, onOpenChange: f, label: g, labelledBy: _, describedBy: v, modal: b = !0, dismissible: S = !0, lockScroll: D = b, initialFocus: A, elementRef: j, props: M, ...N } = e, F = p("dialog"), I = N.id ?? F, [L, R] = m({
|
|
51
51
|
value: o,
|
|
52
|
-
defaultValue:
|
|
53
|
-
onChange:
|
|
52
|
+
defaultValue: s,
|
|
53
|
+
onChange: f,
|
|
54
54
|
interaction: {
|
|
55
|
-
component:
|
|
55
|
+
component: n === "alertdialog" ? "alertDialog" : "dialog",
|
|
56
56
|
type: "openChange"
|
|
57
57
|
}
|
|
58
|
-
}), [z, B] =
|
|
59
|
-
B(e),
|
|
60
|
-
}, [j]), [H, U] =
|
|
58
|
+
}), [z, B] = C(null), V = y((e) => {
|
|
59
|
+
B(e), t(j, e);
|
|
60
|
+
}, [j]), [H, U] = C(null), [W, G] = C(!1), [K, q] = C({
|
|
61
61
|
title: 0,
|
|
62
62
|
description: 0
|
|
63
|
-
}), J =
|
|
64
|
-
|
|
63
|
+
}), J = O(L && D);
|
|
64
|
+
d({
|
|
65
65
|
enabled: L,
|
|
66
66
|
returnTo: H
|
|
67
67
|
});
|
|
68
|
-
let Y =
|
|
68
|
+
let Y = h(a, L, z), X = y((e) => (q((t) => ({
|
|
69
69
|
...t,
|
|
70
70
|
[e]: t[e] + 1
|
|
71
71
|
})), () => q((t) => ({
|
|
72
72
|
...t,
|
|
73
73
|
[e]: t[e] - 1
|
|
74
|
-
}))), []), Z =
|
|
74
|
+
}))), []), Z = x(() => ({
|
|
75
75
|
titleId: `${I}-title`,
|
|
76
76
|
descriptionId: `${I}-description`,
|
|
77
77
|
register: X
|
|
78
78
|
}), [I, X]);
|
|
79
|
-
|
|
79
|
+
P({
|
|
80
80
|
dialog: z,
|
|
81
81
|
isOpen: L,
|
|
82
82
|
domOpen: W,
|
|
83
83
|
setDomOpen: G,
|
|
84
84
|
setOpen: R,
|
|
85
|
-
modal:
|
|
86
|
-
dismissible:
|
|
85
|
+
modal: b,
|
|
86
|
+
dismissible: S,
|
|
87
87
|
triggerElement: H
|
|
88
|
-
}),
|
|
89
|
-
let e =
|
|
88
|
+
}), c(() => {
|
|
89
|
+
let e = r(A);
|
|
90
90
|
!L || !e || e.focus();
|
|
91
91
|
}, [L, A]);
|
|
92
|
-
let Q =
|
|
92
|
+
let Q = u((e) => {
|
|
93
93
|
R((e) => !e, {
|
|
94
94
|
reason: "trigger",
|
|
95
95
|
event: e
|
|
96
96
|
});
|
|
97
|
-
}), $ =
|
|
97
|
+
}), $ = x(() => ({
|
|
98
98
|
ref: U,
|
|
99
99
|
props: {
|
|
100
100
|
"aria-expanded": L,
|
|
@@ -106,23 +106,23 @@ function M(e) {
|
|
|
106
106
|
I,
|
|
107
107
|
Q,
|
|
108
108
|
L
|
|
109
|
-
]), ee =
|
|
110
|
-
return /* @__PURE__ */
|
|
109
|
+
]), ee = N;
|
|
110
|
+
return /* @__PURE__ */ E(w, { children: [
|
|
111
111
|
J,
|
|
112
112
|
i?.($),
|
|
113
|
-
/* @__PURE__ */
|
|
113
|
+
/* @__PURE__ */ T(k.Provider, {
|
|
114
114
|
value: Z,
|
|
115
|
-
children: /* @__PURE__ */
|
|
115
|
+
children: /* @__PURE__ */ T(l, {
|
|
116
116
|
ref: V,
|
|
117
117
|
tag: "dialog",
|
|
118
118
|
component: "dialog",
|
|
119
119
|
...ee,
|
|
120
120
|
id: I,
|
|
121
121
|
props: {
|
|
122
|
-
role:
|
|
122
|
+
role: n,
|
|
123
123
|
"aria-label": K.title || _ ? void 0 : g,
|
|
124
124
|
"aria-labelledby": _ ?? (K.title ? Z.titleId : void 0),
|
|
125
|
-
"aria-describedby":
|
|
125
|
+
"aria-describedby": v ?? (K.description ? Z.descriptionId : void 0),
|
|
126
126
|
...M
|
|
127
127
|
},
|
|
128
128
|
children: Y
|
|
@@ -130,64 +130,70 @@ function M(e) {
|
|
|
130
130
|
})
|
|
131
131
|
] });
|
|
132
132
|
}
|
|
133
|
-
function
|
|
134
|
-
let { dialog: t, isOpen:
|
|
135
|
-
|
|
136
|
-
!t ||
|
|
133
|
+
function P(e) {
|
|
134
|
+
let { dialog: t, isOpen: r, domOpen: i, setDomOpen: s, setOpen: l, modal: u, dismissible: d, triggerElement: p } = e, m = S("imperative"), h = a(), g = d ? "any" : "closerequest";
|
|
135
|
+
c(() => {
|
|
136
|
+
!t || r === i || (s(r), r ? u ? t.showModal() : t.show() : t.close());
|
|
137
137
|
}, [
|
|
138
138
|
t,
|
|
139
|
-
n,
|
|
140
139
|
r,
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
140
|
+
i,
|
|
141
|
+
u,
|
|
142
|
+
s
|
|
143
|
+
]), c(() => {
|
|
144
|
+
if (!(!t || !r || !u)) return o(t, !0), () => o(t, !1);
|
|
145
|
+
}, [
|
|
146
|
+
t,
|
|
147
|
+
r,
|
|
148
|
+
u
|
|
149
|
+
]), c(() => {
|
|
144
150
|
if (!t) return;
|
|
145
151
|
let e = new AbortController();
|
|
146
152
|
return t.addEventListener("close", (e) => {
|
|
147
|
-
|
|
148
|
-
reason:
|
|
153
|
+
s(!1), l(!1, {
|
|
154
|
+
reason: m.current,
|
|
149
155
|
event: e
|
|
150
|
-
}),
|
|
156
|
+
}), m.current = "imperative";
|
|
151
157
|
}, { signal: e.signal }), () => e.abort();
|
|
152
158
|
}, [
|
|
153
159
|
t,
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
]),
|
|
157
|
-
if (!(!t || !
|
|
160
|
+
s,
|
|
161
|
+
l
|
|
162
|
+
]), c(() => {
|
|
163
|
+
if (!(!t || !h)) return t.setAttribute("closedby", g), () => t.removeAttribute("closedby");
|
|
158
164
|
}, [
|
|
159
165
|
t,
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
]),
|
|
163
|
-
if (!
|
|
164
|
-
let e = new AbortController(),
|
|
166
|
+
h,
|
|
167
|
+
g
|
|
168
|
+
]), c(() => {
|
|
169
|
+
if (!r || !t) return;
|
|
170
|
+
let e = new AbortController(), i = (t, n) => document.addEventListener(t, n, {
|
|
165
171
|
signal: e.signal,
|
|
166
172
|
capture: !0
|
|
167
173
|
});
|
|
168
|
-
return
|
|
169
|
-
e.key === "Escape" && (
|
|
170
|
-
}),
|
|
171
|
-
|
|
174
|
+
return i("keydown", (e) => {
|
|
175
|
+
e.key === "Escape" && (m.current = "escape");
|
|
176
|
+
}), i("pointerdown", (e) => {
|
|
177
|
+
n(e, [p]) ? m.current = "trigger" : !n(e, [t]) || F(t, e) ? m.current = "outside-pointer" : m.current = "imperative";
|
|
172
178
|
}), () => e.abort();
|
|
173
179
|
}, [
|
|
174
|
-
|
|
180
|
+
r,
|
|
175
181
|
t,
|
|
176
|
-
|
|
177
|
-
]),
|
|
178
|
-
enabled:
|
|
182
|
+
p
|
|
183
|
+
]), f({
|
|
184
|
+
enabled: r && !u && !h,
|
|
179
185
|
inside: [t],
|
|
180
186
|
escapeKey: !0,
|
|
181
187
|
outsidePointer: !1,
|
|
182
|
-
onDismiss: (e, t) =>
|
|
188
|
+
onDismiss: (e, t) => l(!1, {
|
|
183
189
|
reason: "escape",
|
|
184
190
|
event: t
|
|
185
191
|
})
|
|
186
|
-
}),
|
|
187
|
-
if (!t || !
|
|
192
|
+
}), c(() => {
|
|
193
|
+
if (!t || !r || !d || h) return;
|
|
188
194
|
let e = new AbortController();
|
|
189
195
|
return document.addEventListener("pointerdown", (e) => {
|
|
190
|
-
|
|
196
|
+
n(e, [p]) || n(e, [t]) && !F(t, e) || l(!1, {
|
|
191
197
|
reason: "outside-pointer",
|
|
192
198
|
event: e
|
|
193
199
|
});
|
|
@@ -197,37 +203,38 @@ function N(e) {
|
|
|
197
203
|
}), () => e.abort();
|
|
198
204
|
}, [
|
|
199
205
|
t,
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
206
|
+
r,
|
|
207
|
+
d,
|
|
208
|
+
h,
|
|
209
|
+
p,
|
|
210
|
+
l
|
|
205
211
|
]);
|
|
206
212
|
}
|
|
207
|
-
function
|
|
213
|
+
function F(e, t) {
|
|
214
|
+
if (t.target !== e) return !1;
|
|
208
215
|
let n = e.getBoundingClientRect();
|
|
209
216
|
return t.clientX < n.left || t.clientX > n.right || t.clientY < n.top || t.clientY > n.bottom;
|
|
210
217
|
}
|
|
211
|
-
function
|
|
212
|
-
let t =
|
|
213
|
-
return
|
|
218
|
+
function I(e) {
|
|
219
|
+
let t = A("Dialog.Title");
|
|
220
|
+
return c(() => t.register("title"), [t]), /* @__PURE__ */ T(g, {
|
|
214
221
|
id: t.titleId,
|
|
215
222
|
component: "dialog.title",
|
|
216
223
|
...e
|
|
217
224
|
});
|
|
218
225
|
}
|
|
219
|
-
function
|
|
220
|
-
let t =
|
|
221
|
-
return
|
|
226
|
+
function L(e) {
|
|
227
|
+
let t = A("Dialog.Description");
|
|
228
|
+
return c(() => t.register("description"), [t]), /* @__PURE__ */ T(_, {
|
|
222
229
|
id: t.descriptionId,
|
|
223
230
|
component: "dialog.description",
|
|
224
231
|
...e
|
|
225
232
|
});
|
|
226
233
|
}
|
|
227
|
-
|
|
228
|
-
var
|
|
229
|
-
Title:
|
|
230
|
-
Description:
|
|
231
|
-
},
|
|
234
|
+
I.displayName = "Dialog.Title", L.displayName = "Dialog.Description";
|
|
235
|
+
var R = {
|
|
236
|
+
Title: I,
|
|
237
|
+
Description: L
|
|
238
|
+
}, z = Object.assign(e(j, "Dialog"), R), B = Object.assign(e(M, "AlertDialog"), R);
|
|
232
239
|
//#endregion
|
|
233
|
-
export {
|
|
240
|
+
export { B as AlertDialog, z as default };
|
package/components/form.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../reporting.cjs");let i=require("react");var a;(function(e){function t(e){if(!e)throw Error(`[box-kite] <Form> read its entries with no <form> element: its ref never reached the element.`);let t=Array.from(e.elements).reduce((e,t)=>{let n=t.name;return n?(e[n]||(e[n]=[]),e[n].push(t),e):e},{});return Object.entries(t).reduce((e,[t,r])=>{if(r.length===1){let i=r[0];n(e,t,i.type===`checkbox`||i.type===`radio`?i.checked:i.value)}else n(e,t,r.reduce((e,t)=>(t.type===`checkbox`||t.type===`radio`?t.checked&&e.push(t.value):e.push(t.value),e),[]));return e},{})}e.getFormEntries=t;function n(e,t,n){if(t.includes(`.`)){let r=t.split(`.`),i=e;r.forEach((e,t)=>{if(r.length>t+1){let t=e.match(/^(.+)\[(\d)\]$/);if(t){let[,e,n]=t;i[e]=i[e]||[],i[e][n]=i[e][n]||{},i=i[e][n]}else i[e]=i[e]||{},i=i[e]}else i[e]=n})}else e[t]=n}})(a||={});var o=a;function s(e,a){let{onSubmit:s,props:c,...l}=e,u=(0,i.useRef)(null),d=r.i(`form`),{ref:f,...p}=c??{},m=(0,i.useCallback)(e=>{u.current=e,t.
|
|
1
|
+
"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../reporting.cjs");let i=require("react");var a;(function(e){function t(e){if(!e)throw Error(`[box-kite] <Form> read its entries with no <form> element: its ref never reached the element.`);let t=Array.from(e.elements).reduce((e,t)=>{let n=t.name;return n?(e[n]||(e[n]=[]),e[n].push(t),e):e},{});return Object.entries(t).reduce((e,[t,r])=>{if(r.length===1){let i=r[0];n(e,t,i.type===`checkbox`||i.type===`radio`?i.checked:i.value)}else n(e,t,r.reduce((e,t)=>(t.type===`checkbox`||t.type===`radio`?t.checked&&e.push(t.value):e.push(t.value),e),[]));return e},{})}e.getFormEntries=t;function n(e,t,n){if(t.includes(`.`)){let r=t.split(`.`),i=e;r.forEach((e,t)=>{if(r.length>t+1){let t=e.match(/^(.+)\[(\d)\]$/);if(t){let[,e,n]=t;i[e]=i[e]||[],i[e][n]=i[e][n]||{},i=i[e][n]}else i[e]=i[e]||{},i=i[e]}else i[e]=n})}else e[t]=n}})(a||={});var o=a;function s(e,a){let{onSubmit:s,props:c,...l}=e,u=(0,i.useRef)(null),d=r.i(`form`),{ref:f,...p}=c??{},m=(0,i.useCallback)(e=>{u.current=e,t.d(a,e),t.d(f,e)},[a,f]),h=(0,i.useCallback)(e=>{e.preventDefault();let t=o.getFormEntries(u.current??e.currentTarget);s(t,e),d(`submit`,Object.keys(t),{reason:`submit`,event:e})},[s,d]);return n.useBoxElement({tag:`form`,...l,props:{...p,onSubmit:h}},m)}var c=e.f(s,`Form`);exports.default=c;
|
package/components/form.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { f as e } from "../react-shared.mjs";
|
|
3
|
-
import {
|
|
3
|
+
import { d as t } from "../platform.mjs";
|
|
4
4
|
import { useBoxElement as n } from "../box.mjs";
|
|
5
5
|
import { i as r } from "../reporting.mjs";
|
|
6
6
|
import { useCallback as i, useRef as a } from "react";
|