@box-kite/react 2.2.17 → 2.3.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 (80) hide show
  1. package/.claude/rules/box-kite-rules.md +6 -4
  2. package/.claude/skills/box-kite/SKILL.md +6 -4
  3. package/.claude/skills/box-kite/references/components.md +1 -1
  4. package/.claude/skills/box-kite/references/patterns.md +1 -1
  5. package/.claude/skills/box-kite/references/styling.md +2 -2
  6. package/.cursor/rules/box-kite.mdc +6 -4
  7. package/AGENTS.md +6 -4
  8. package/BOX_AI_CONTEXT.md +40 -3
  9. package/BOX_KITE_AI_CONTEXT.md +40 -3
  10. package/behavior.cjs +1 -1
  11. package/behavior.mjs +62 -62
  12. package/box.cjs +1 -1
  13. package/box.d.ts +1 -0
  14. package/box.mjs +1 -1
  15. package/catalog.cjs +1 -1
  16. package/catalog.mjs +4 -4
  17. package/client.cjs +1 -1
  18. package/client.mjs +11 -11
  19. package/components/accordion.cjs +1 -1
  20. package/components/accordion.mjs +1 -1
  21. package/components/calendar.cjs +1 -1
  22. package/components/calendar.mjs +21 -20
  23. package/components/combobox.cjs +1 -1
  24. package/components/combobox.mjs +1 -1
  25. package/components/dashboard.cjs +1 -1
  26. package/components/dashboard.mjs +12 -12
  27. package/components/dataGrid.cjs +2 -2
  28. package/components/dataGrid.mjs +5 -5
  29. package/components/dateField.cjs +1 -1
  30. package/components/dateField.mjs +6 -6
  31. package/components/datePicker.cjs +1 -1
  32. package/components/datePicker.mjs +118 -116
  33. package/components/dialog.cjs +1 -1
  34. package/components/dialog.d.ts +1 -1
  35. package/components/dialog.mjs +108 -101
  36. package/components/dropdown.cjs +1 -1
  37. package/components/dropdown.mjs +8 -3
  38. package/components/form.cjs +1 -1
  39. package/components/form.mjs +1 -1
  40. package/components/menu.cjs +1 -1
  41. package/components/menu.mjs +10 -10
  42. package/components/overlay.cjs +1 -1
  43. package/components/overlay.mjs +5 -5
  44. package/components/popover.cjs +1 -1
  45. package/components/popover.d.ts +8 -2
  46. package/components/popover.mjs +58 -55
  47. package/components/radioGroup.cjs +1 -1
  48. package/components/radioGroup.mjs +1 -1
  49. package/components/slider.cjs +1 -1
  50. package/components/slider.mjs +8 -8
  51. package/components/sortableList.cjs +1 -1
  52. package/components/sortableList.mjs +1 -1
  53. package/components/swipeItem.cjs +1 -1
  54. package/components/swipeItem.mjs +10 -10
  55. package/components/tabs.cjs +1 -1
  56. package/components/tabs.mjs +9 -9
  57. package/components/toaster.cjs +1 -1
  58. package/components/toaster.mjs +133 -115
  59. package/components/tooltip.cjs +1 -1
  60. package/components/tooltip.mjs +1 -1
  61. package/components/virtualList.cjs +1 -1
  62. package/components/virtualList.mjs +1 -1
  63. package/docs/props.md +6 -6
  64. package/interactionListening.cjs +1 -1
  65. package/interactionListening.mjs +1 -1
  66. package/layer.cjs +1 -1
  67. package/layer.mjs +17 -14
  68. package/package.json +2 -2
  69. package/placement.cjs +1 -1
  70. package/placement.mjs +10 -10
  71. package/platform.cjs +1 -1
  72. package/platform.mjs +23 -11
  73. package/react-shared.cjs +1 -1
  74. package/react-shared.mjs +1 -1
  75. package/rsc.cjs +1 -1
  76. package/rsc.d.ts +1 -0
  77. package/rsc.mjs +1 -1
  78. package/scrolling.cjs +1 -1
  79. package/scrolling.mjs +1 -1
  80. package/utils/dom/domUtils.d.ts +9 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@box-kite/react",
3
- "version": "2.2.17",
3
+ "version": "2.3.0",
4
4
  "type": "module",
5
5
  "sideEffects": [
6
6
  "pages/**"
@@ -654,7 +654,7 @@
654
654
  "react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
655
655
  },
656
656
  "dependencies": {
657
- "@box-kite/core": "2.2.17",
657
+ "@box-kite/core": "2.3.0",
658
658
  "csstype": "^3.2.3",
659
659
  "use-sync-external-store": "^1.6.0"
660
660
  },
package/placement.cjs CHANGED
@@ -1 +1 @@
1
- const e=require("./platform.cjs"),t=require("./effects.cjs"),n=require("./identity.cjs");let r=require("react");var i={top:`bottom`,bottom:`top`,start:`end`,end:`start`};function a(e){return e===`top`||e===`bottom`}function o(e,t){let n=a(e),r=n?e===`top`?`block-start`:`block-end`:e===`start`?`inline-start`:`inline-end`,i=t===`center`?`span-all`:`span-${n?`inline`:`block`}-${t===`start`?`end`:`start`}`;return n?`${r} ${i}`:`${i} ${r}`}function s(e){let[t,n]=e.trim().split(` `);return n===void 0?t===`block-start`?`top`:t===`block-end`?`bottom`:t===`inline-start`?`start`:t===`inline-end`?`end`:null:t===`start`?`top`:t===`end`?`bottom`:n===`start`?`start`:n===`end`?`end`:null}function c(e){return a(e)?`flip-block, flip-inline, flip-block flip-inline`:`flip-inline, flip-block, flip-inline flip-block`}function l(e,t,n,r){let i=u(t,r);return i===`top`?e.top-n.top:i===`bottom`?n.top+n.height-(e.top+e.height):i===`left`?e.left-n.left:n.left+n.width-(e.left+e.width)}function u(e,t){return e===`top`||e===`bottom`?e:e===`start`===t?`right`:`left`}function d(e,t,n,r){return Math.max(n,Math.min(e,n+r-t))}function f(e,t,n,r){let{align:o,offset:s,flip:c,rtl:f}=r,p=(a(r.side)?t.height:t.width)+s,m=c&&l(e,r.side,n,f)<p&&l(e,i[r.side],n,f)>=p?i[r.side]:r.side,h=u(m,f),g={top:e.top-t.height-s,bottom:e.top+e.height+s,left:e.left-t.width-s,right:e.left+e.width+s}[h],_=a(m),v=_?e.left:e.top,y=_?e.width:e.height,b=_?t.width:t.height,x=o===`center`?v+y/2-b/2:o===`start`===(_&&f)?v+y-b:v,S=_?d(x,t.width,n.left,n.width):d(x,t.height,n.top,n.height);return _?{top:g,left:S,side:m}:{top:S,left:g,side:m}}var p=4,m=16,h={top:`mb`,bottom:`mt`,start:`me`,end:`ms`};function g(){return typeof CSS<`u`&&typeof CSS.supports==`function`&&CSS.supports(`anchor-name: --a`)}function _(){let e=typeof document>`u`?null:document.documentElement,t=e?parseFloat(getComputedStyle(e).fontSize):NaN;return Number.isFinite(t)&&t>0?t:m}function v(e){let{top:t,left:n,width:r,height:i}=e.getBoundingClientRect();return{top:t,left:n,width:r,height:i}}function y(e,t){return e!==null&&e.top===t.top&&e.left===t.left&&e.side===t.side&&e.anchorWidth===t.anchorWidth}function b(i={}){let{side:a=`bottom`,align:l=`center`,offset:u=0,flip:d=!0,matchWidth:m=!1,name:b,anchor:x,trackSide:S=!1}=i,C=n.t(`anchor`),w=`--${(b??C).replace(/^--/,``)}`,[T,E]=(0,r.useState)(!0),[D,O]=(0,r.useState)(null),[k,A]=(0,r.useState)(null),[j,M]=(0,r.useState)(null),[N,P]=(0,r.useState)(null);t.n(()=>{g()||E(!1)},[]),t.n(()=>{let t=e.f(x);if(t)return t.style.setProperty(`anchor-name`,w),()=>{t.style.removeProperty(`anchor-name`)}},[x,w]),t.n(()=>{!T||!S||!k||P(s(getComputedStyle(k).getPropertyValue(`position-area`)))},[T,S,k,a,l,d]),t.n(()=>{let t=e.f(x)??D;if(T||!t||!k)return;let n=()=>{let n=v(t),r=v(k),i={top:0,left:0,width:window.innerWidth,height:window.innerHeight},o=m?Math.max(r.width,n.width):r.width,s={...f(n,{...r,width:o},i,{side:a,align:l,offset:u/p*_(),flip:d,rtl:e.m(t)}),anchorWidth:n.width};M(e=>y(e,s)?e:s)};n();let r=new AbortController;return document.addEventListener(`scroll`,n,{signal:r.signal,capture:!0,passive:!0}),window.addEventListener(`resize`,n,{signal:r.signal,passive:!0}),()=>r.abort()},[T,x,D,k,a,l,u,d,m]);let F=(0,r.useCallback)(e=>O(e),[]),I=(0,r.useCallback)(e=>A(e),[]),L={ref:T?void 0:F,style:{anchorName:w}};return T?{css:T,side:N??a,anchorProps:L,layerProps:{...S?{ref:I}:{},position:`fixed`,positionArea:o(a,l),...d?{positionTryFallbacks:c(a)}:{},...m?{minWidth:`anchor-size(width)`}:{},...u?{[h[a]]:u}:{},style:{positionAnchor:w}}}:{css:T,side:j?.side??a,anchorProps:L,layerProps:{ref:I,position:`fixed`,style:j?{top:`${j.top}px`,left:`${j.left}px`,...m?{minWidth:`${j.anchorWidth}px`}:{}}:{top:0,left:0,visibility:`hidden`}}}}Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return b}});
1
+ const e=require("./platform.cjs"),t=require("./effects.cjs"),n=require("./identity.cjs");let r=require("react");var i={top:`bottom`,bottom:`top`,start:`end`,end:`start`};function a(e){return e===`top`||e===`bottom`}function o(e,t){let n=a(e),r=n?e===`top`?`block-start`:`block-end`:e===`start`?`inline-start`:`inline-end`,i=t===`center`?`span-all`:`span-${n?`inline`:`block`}-${t===`start`?`end`:`start`}`;return n?`${r} ${i}`:`${i} ${r}`}function s(e){let[t,n]=e.trim().split(` `);return n===void 0?t===`block-start`?`top`:t===`block-end`?`bottom`:t===`inline-start`?`start`:t===`inline-end`?`end`:null:t===`start`?`top`:t===`end`?`bottom`:n===`start`?`start`:n===`end`?`end`:null}function c(e){return a(e)?`flip-block, flip-inline, flip-block flip-inline`:`flip-inline, flip-block, flip-inline flip-block`}function l(e,t,n,r){let i=u(t,r);return i===`top`?e.top-n.top:i===`bottom`?n.top+n.height-(e.top+e.height):i===`left`?e.left-n.left:n.left+n.width-(e.left+e.width)}function u(e,t){return e===`top`||e===`bottom`?e:e===`start`===t?`right`:`left`}function d(e,t,n,r){return Math.max(n,Math.min(e,n+r-t))}function f(e,t,n,r){let{align:o,offset:s,flip:c,rtl:f}=r,p=(a(r.side)?t.height:t.width)+s,m=c&&l(e,r.side,n,f)<p&&l(e,i[r.side],n,f)>=p?i[r.side]:r.side,h=u(m,f),g={top:e.top-t.height-s,bottom:e.top+e.height+s,left:e.left-t.width-s,right:e.left+e.width+s}[h],_=a(m),v=_?e.left:e.top,y=_?e.width:e.height,b=_?t.width:t.height,x=o===`center`?v+y/2-b/2:o===`start`===(_&&f)?v+y-b:v,S=_?d(x,t.width,n.left,n.width):d(x,t.height,n.top,n.height);return _?{top:g,left:S,side:m}:{top:S,left:g,side:m}}var p=4,m=16,h={top:`mb`,bottom:`mt`,start:`me`,end:`ms`};function g(){return typeof CSS<`u`&&typeof CSS.supports==`function`&&CSS.supports(`anchor-name: --a`)}function _(){let e=typeof document>`u`?null:document.documentElement,t=e?parseFloat(getComputedStyle(e).fontSize):NaN;return Number.isFinite(t)&&t>0?t:m}function v(e){let{top:t,left:n,width:r,height:i}=e.getBoundingClientRect();return{top:t,left:n,width:r,height:i}}function y(e,t){return e!==null&&e.top===t.top&&e.left===t.left&&e.side===t.side&&e.anchorWidth===t.anchorWidth}function b(i={}){let{side:a=`bottom`,align:l=`center`,offset:u=0,flip:d=!0,matchWidth:m=!1,name:b,anchor:x,trackSide:S=!1}=i,C=n.t(`anchor`),w=`--${(b??C).replace(/^--/,``)}`,[T,E]=(0,r.useState)(!0),[D,O]=(0,r.useState)(null),[k,A]=(0,r.useState)(null),[j,M]=(0,r.useState)(null),[N,P]=(0,r.useState)(null);t.n(()=>{g()||E(!1)},[]),t.n(()=>{let t=e.h(x);if(t)return t.style.setProperty(`anchor-name`,w),()=>{t.style.removeProperty(`anchor-name`)}},[x,w]),t.n(()=>{!T||!S||!k||P(s(getComputedStyle(k).getPropertyValue(`position-area`)))},[T,S,k,a,l,d]),t.n(()=>{let t=e.h(x)??D;if(T||!t||!k)return;let n=()=>{let n=v(t),r=v(k),i={top:0,left:0,width:window.innerWidth,height:window.innerHeight},o=m?Math.max(r.width,n.width):r.width,s={...f(n,{...r,width:o},i,{side:a,align:l,offset:u/p*_(),flip:d,rtl:e._(t)}),anchorWidth:n.width};M(e=>y(e,s)?e:s)};n();let r=new AbortController;return document.addEventListener(`scroll`,n,{signal:r.signal,capture:!0,passive:!0}),window.addEventListener(`resize`,n,{signal:r.signal,passive:!0}),()=>r.abort()},[T,x,D,k,a,l,u,d,m]);let F=(0,r.useCallback)(e=>O(e),[]),I=(0,r.useCallback)(e=>A(e),[]),L={ref:T?void 0:F,style:{anchorName:w}};return T?{css:T,side:N??a,anchorProps:L,layerProps:{...S?{ref:I}:{},position:`fixed`,positionArea:o(a,l),...d?{positionTryFallbacks:c(a)}:{},...m?{minWidth:`anchor-size(width)`}:{},...u?{[h[a]]:u}:{},style:{positionAnchor:w}}}:{css:T,side:j?.side??a,anchorProps:L,layerProps:{ref:I,position:`fixed`,style:j?{top:`${j.top}px`,left:`${j.left}px`,...m?{minWidth:`${j.anchorWidth}px`}:{}}:{top:0,left:0,visibility:`hidden`}}}}Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return b}});
package/placement.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { f as e, m as t } from "./platform.mjs";
1
+ import { _ as e, h as t } from "./platform.mjs";
2
2
  import { n } from "./effects.mjs";
3
3
  import { t as r } from "./identity.mjs";
4
4
  import { useCallback as i, useState as a } from "react";
@@ -82,9 +82,9 @@ function S(o = {}) {
82
82
  n(() => {
83
83
  v() || O(!1);
84
84
  }, []), n(() => {
85
- let t = e(C);
86
- if (t) return t.style.setProperty("anchor-name", E), () => {
87
- t.style.removeProperty("anchor-name");
85
+ let e = t(C);
86
+ if (e) return e.style.setProperty("anchor-name", E), () => {
87
+ e.style.removeProperty("anchor-name");
88
88
  };
89
89
  }, [C, E]), n(() => {
90
90
  !D || !w || !j || I(l(getComputedStyle(j).getPropertyValue("position-area")));
@@ -96,16 +96,16 @@ function S(o = {}) {
96
96
  d,
97
97
  p
98
98
  ]), n(() => {
99
- let n = e(C) ?? k;
99
+ let n = t(C) ?? k;
100
100
  if (D || !n || !j) return;
101
101
  let r = () => {
102
- let e = b(n), r = b(j), i = {
102
+ let t = b(n), r = b(j), i = {
103
103
  top: 0,
104
104
  left: 0,
105
105
  width: window.innerWidth,
106
106
  height: window.innerHeight
107
- }, a = g ? Math.max(r.width, e.width) : r.width, o = {
108
- ...m(e, {
107
+ }, a = g ? Math.max(r.width, t.width) : r.width, o = {
108
+ ...m(t, {
109
109
  ...r,
110
110
  width: a
111
111
  }, i, {
@@ -113,9 +113,9 @@ function S(o = {}) {
113
113
  align: d,
114
114
  offset: f / h * y(),
115
115
  flip: p,
116
- rtl: t(n)
116
+ rtl: e(n)
117
117
  }),
118
- anchorWidth: e.width
118
+ anchorWidth: t.width
119
119
  };
120
120
  P((e) => x(e, o) ? e : o);
121
121
  };
package/platform.cjs CHANGED
@@ -1 +1 @@
1
- var e=globalThis[Symbol.for(`box-kite.componentAttribute`)]??={on:!1,warnings:!0},t=()=>e.on,n=()=>e.warnings;function r(t){e.on=t}function i(t){e.warnings=t}function a(e){return e?`current`in e?e.current:e:null}function o(e,t){typeof e==`function`?e(t):e&&(e.current=t)}function s(e){let t=a(e);return t instanceof HTMLElement?t:null}function c(e,t){let n=typeof e.composedPath==`function`?e.composedPath():[];return t.some(t=>{let r=a(t);return r?n.includes(r)||e.target instanceof Node&&r.contains(e.target):!1})}function l(e){let t=a(e),n=t?.ownerDocument?.defaultView;return!!t&&!!n&&n.getComputedStyle(t).direction===`rtl`}function u(e){let t=a(e)?.ownerDocument?.defaultView?.getSelection();t&&!t.isCollapsed&&t.removeAllRanges()}function d(){return typeof window<`u`&&window.document!==void 0}function f(){try{return process.env.NODE_ENV!==`production`}catch{return!1}}function p(){return typeof document<`u`}function m(){return p()?document:null}function h(){return m()?.documentElement??null}function g(){return typeof HTMLElement<`u`&&typeof HTMLElement.prototype.showPopover==`function`}function _(){return typeof HTMLDialogElement<`u`&&`closedBy`in HTMLDialogElement.prototype}function v(e){return typeof window>`u`||typeof window.matchMedia!=`function`?null:window.matchMedia(e)}Object.defineProperty(exports,"_",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"c",{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,"d",{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,"f",{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,"g",{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,"h",{enumerable:!0,get:function(){return t}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,"l",{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,"m",{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return v}}),Object.defineProperty(exports,"p",{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,"s",{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,"u",{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,"v",{enumerable:!0,get:function(){return n}});
1
+ var e=globalThis[Symbol.for(`box-kite.componentAttribute`)]??={on:!1,warnings:!0},t=()=>e.on,n=()=>e.warnings;function r(t){e.on=t}function i(t){e.warnings=t}function a(e){return e?`current`in e?e.current:e:null}function o(e,t){typeof e==`function`?e(t):e&&(e.current=t)}function s(e){let t=a(e);return t instanceof HTMLElement?t:null}function c(e,t){let n=typeof e.composedPath==`function`?e.composedPath():[];return t.some(t=>{let r=a(t);return r?n.includes(r)||e.target instanceof Node&&r.contains(e.target):!1})}function l(e){let t=a(e),n=t?.ownerDocument?.defaultView;return!!t&&!!n&&n.getComputedStyle(t).direction===`rtl`}function u(e){let t=a(e)?.ownerDocument?.defaultView?.getSelection();t&&!t.isCollapsed&&t.removeAllRanges()}var d=`box-kite:modal`;function f(e,t){e.ownerDocument.dispatchEvent(new CustomEvent(d,{detail:{dialog:e,open:t}}))}var p=`a[href],area[href],button,input:not([type="hidden"]),select,textarea,iframe,summary,[contenteditable]:not([contenteditable="false"]),[tabindex]`;function m(e){for(let t of e.querySelectorAll(p))if(!(t.tabIndex<0||t.matches(`:disabled`)||t.closest(`[inert]`))&&!(typeof t.checkVisibility==`function`&&!t.checkVisibility({visibilityProperty:!0})))return t;return null}function h(){return typeof window<`u`&&window.document!==void 0}function g(){try{return process.env.NODE_ENV!==`production`}catch{return!1}}function _(){return typeof document<`u`}function v(){return _()?document:null}function y(){return v()?.documentElement??null}function b(){return typeof HTMLElement<`u`&&typeof HTMLElement.prototype.showPopover==`function`}function x(){return typeof HTMLDialogElement<`u`&&`closedBy`in HTMLDialogElement.prototype}function S(e){return typeof window>`u`||typeof window.matchMedia!=`function`?null:window.matchMedia(e)}Object.defineProperty(exports,"_",{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,"b",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"c",{enumerable:!0,get:function(){return b}}),Object.defineProperty(exports,"d",{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,"f",{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,"g",{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,"h",{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,"l",{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,"m",{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return y}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return S}}),Object.defineProperty(exports,"p",{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,"s",{enumerable:!0,get:function(){return x}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return v}}),Object.defineProperty(exports,"u",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"v",{enumerable:!0,get:function(){return t}}),Object.defineProperty(exports,"x",{enumerable:!0,get:function(){return n}}),Object.defineProperty(exports,"y",{enumerable:!0,get:function(){return i}});
package/platform.mjs CHANGED
@@ -36,35 +36,47 @@ function u(e) {
36
36
  let t = a(e)?.ownerDocument?.defaultView?.getSelection();
37
37
  t && !t.isCollapsed && t.removeAllRanges();
38
38
  }
39
+ var d = "box-kite:modal";
40
+ function f(e, t) {
41
+ e.ownerDocument.dispatchEvent(new CustomEvent(d, { detail: {
42
+ dialog: e,
43
+ open: t
44
+ } }));
45
+ }
46
+ var p = "a[href],area[href],button,input:not([type=\"hidden\"]),select,textarea,iframe,summary,[contenteditable]:not([contenteditable=\"false\"]),[tabindex]";
47
+ function m(e) {
48
+ for (let t of e.querySelectorAll(p)) if (!(t.tabIndex < 0 || t.matches(":disabled") || t.closest("[inert]")) && !(typeof t.checkVisibility == "function" && !t.checkVisibility({ visibilityProperty: !0 }))) return t;
49
+ return null;
50
+ }
39
51
  //#endregion
40
52
  //#region src/utils/environment/environmentUtils.ts
41
- function d() {
53
+ function h() {
42
54
  return typeof window < "u" && window.document !== void 0;
43
55
  }
44
- function f() {
56
+ function g() {
45
57
  try {
46
58
  return process.env.NODE_ENV !== "production";
47
59
  } catch {
48
60
  return !1;
49
61
  }
50
62
  }
51
- function p() {
63
+ function _() {
52
64
  return typeof document < "u";
53
65
  }
54
- function m() {
55
- return p() ? document : null;
66
+ function v() {
67
+ return _() ? document : null;
56
68
  }
57
- function h() {
58
- return m()?.documentElement ?? null;
69
+ function y() {
70
+ return v()?.documentElement ?? null;
59
71
  }
60
- function g() {
72
+ function b() {
61
73
  return typeof HTMLElement < "u" && typeof HTMLElement.prototype.showPopover == "function";
62
74
  }
63
- function _() {
75
+ function x() {
64
76
  return typeof HTMLDialogElement < "u" && "closedBy" in HTMLDialogElement.prototype;
65
77
  }
66
- function v(e) {
78
+ function S(e) {
67
79
  return typeof window > "u" || typeof window.matchMedia != "function" ? null : window.matchMedia(e);
68
80
  }
69
81
  //#endregion
70
- export { r as _, f as a, g as c, a as d, s as f, i as g, t as h, d as i, o as l, l as m, h as n, v as o, c as p, p as r, _ as s, m as t, u, n as v };
82
+ export { l as _, g as a, r as b, b as c, o as d, u as f, c as g, s as h, h as i, d as l, m, y as n, S as o, a as p, _ as r, x as s, v as t, f as u, t as v, n as x, i as y };
package/react-shared.cjs CHANGED
@@ -1 +1 @@
1
- const e=require("./rolldown-runtime.cjs"),t=require("./platform.cjs");let n=require("react");n=e.t(n,1);let r=require("@box-kite/core");function i({classNames:e,styleElements:t},n){return{className:(0,r.classNames)(e,n).join(` `),styles:t}}var a=parseInt(n.default.version,10)>=19;function o(e,t){let r=a?({ref:t,...n})=>e(n,t??null):(0,n.forwardRef)(e),i=(0,n.memo)(r);return r.displayName=t,i.displayName=t,i}var s={selected:`aria-selected`},c;(function(e){function t(e,t,n){e!==void 0&&e!=null&&(n[s[t]??t]=Array.isArray(e)?e[0]:e)}e.assignBooleanProp=t})(c||={});var l=c;function u(e,n){let i=e,{props:a,className:o,disabled:s,required:c,checked:u,selected:d}=i,f={...a,className:(0,r.classNames)(n,o).join(` `)};return typeof i.component==`string`&&t.h()&&(f[`data-bk`]??=i.component),l.assignBooleanProp(s,`disabled`,f),l.assignBooleanProp(c,`required`,f),l.assignBooleanProp(u,`checked`,f),l.assignBooleanProp(d,`selected`,f),`style`in i&&(f.style=i.style),`id`in i&&(f.id=i.id),f}var d=parseInt(n.default.version,10)>=19,f=!1,p=new WeakMap,m=new WeakMap;function h(e){let t=p.get(e);if(!t){let{href:r,css:i,precedence:a}=e;t=n.default.createElement(`style`,{key:r,href:r,precedence:a,dangerouslySetInnerHTML:{__html:i}}),p.set(e,t)}return t}function g(e){if(!e?.length)return;!d&&!f&&(f=!0,console.warn(`[box-kite] Box.configure({ sink: 'element' }) needs React 19 to hoist and dedupe its <style> elements; React ${n.default.version} will render them inline. Use the default sink instead.`));let t=m.get(e);return t||(t=e.map(h),m.set(e,t)),t}function _(e,t,n){let{classNames:i,signature:a,styleElements:o}=(0,r.getDefaultEngine)().resolveClassNames(e,t,n);return{classNames:i,signature:a,styleElements:g(o)}}var v=`__boxAttributesInProps`;function y(e){return e[v]=!0,e}function b(e){return typeof e==`function`||typeof e==`object`&&e?e[v]===!0:!1}var x=[`role`,`aria-label`,`aria-labelledby`,`aria-hidden`];function S(e,t){if(e!==void 0)return{role:`img`,"aria-label":e};if(!(t&&x.some(e=>e in t)))return{"aria-hidden":!0}}var C;(function(e){function t(e){return e.charAt(0).toUpperCase()+e.slice(1)}e.capitalize=t})(C||={});var w=C,T;(function(e){function t(e,t,n){let r={...e},i=r.props||{};return t.forEach(e=>{e in r&&(i[e]=r[e],delete r[e])}),n&&Object.entries(n).forEach(([e,t])=>{i[e]=t}),r.props=i,r}e.buildProps=t;function n(e){return!!e&&typeof e==`object`}e.isObject=n;function r(e,t){return e in t}e.isKeyOf=r})(T||={});var E=T,D=[`sky-500`,`emerald-500`,`amber-500`,`violet-500`,`rose-500`,`cyan-500`],O=[`sky-400`,`emerald-400`,`amber-400`,`violet-400`,`rose-400`,`cyan-400`];function k(e){return e.reduce((e,t,n)=>(e[`chart-${n+1}`]=t,e),{})}Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return w}}),Object.defineProperty(exports,"c",{enumerable:!0,get:function(){return y}}),Object.defineProperty(exports,"d",{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,"f",{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return E}}),Object.defineProperty(exports,"l",{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return D}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return S}}),Object.defineProperty(exports,"p",{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return k}}),Object.defineProperty(exports,"s",{enumerable:!0,get:function(){return b}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return O}}),Object.defineProperty(exports,"u",{enumerable:!0,get:function(){return g}});
1
+ const e=require("./rolldown-runtime.cjs"),t=require("./platform.cjs");let n=require("react");n=e.t(n,1);let r=require("@box-kite/core");function i({classNames:e,styleElements:t},n){return{className:(0,r.classNames)(e,n).join(` `),styles:t}}var a=parseInt(n.default.version,10)>=19;function o(e,t){let r=a?({ref:t,...n})=>e(n,t??null):(0,n.forwardRef)(e),i=(0,n.memo)(r);return r.displayName=t,i.displayName=t,i}var s={selected:`aria-selected`},c;(function(e){function t(e,t,n){e!==void 0&&e!=null&&(n[s[t]??t]=Array.isArray(e)?e[0]:e)}e.assignBooleanProp=t})(c||={});var l=c;function u(e,n){let i=e,{props:a,className:o,disabled:s,required:c,checked:u,selected:d}=i,f={...a,className:(0,r.classNames)(n,o).join(` `)};return typeof i.component==`string`&&t.v()&&(f[`data-bk`]??=i.component),l.assignBooleanProp(s,`disabled`,f),l.assignBooleanProp(c,`required`,f),l.assignBooleanProp(u,`checked`,f),l.assignBooleanProp(d,`selected`,f),`style`in i&&(f.style=i.style),`id`in i&&(f.id=i.id),f}var d=parseInt(n.default.version,10)>=19,f=!1,p=new WeakMap,m=new WeakMap;function h(e){let t=p.get(e);if(!t){let{href:r,css:i,precedence:a}=e;t=n.default.createElement(`style`,{key:r,href:r,precedence:a,dangerouslySetInnerHTML:{__html:i}}),p.set(e,t)}return t}function g(e){if(!e?.length)return;!d&&!f&&(f=!0,console.warn(`[box-kite] Box.configure({ sink: 'element' }) needs React 19 to hoist and dedupe its <style> elements; React ${n.default.version} will render them inline. Use the default sink instead.`));let t=m.get(e);return t||(t=e.map(h),m.set(e,t)),t}function _(e,t,n){let{classNames:i,signature:a,styleElements:o}=(0,r.getDefaultEngine)().resolveClassNames(e,t,n);return{classNames:i,signature:a,styleElements:g(o)}}var v=`__boxAttributesInProps`;function y(e){return e[v]=!0,e}function b(e){return typeof e==`function`||typeof e==`object`&&e?e[v]===!0:!1}var x=[`role`,`aria-label`,`aria-labelledby`,`aria-hidden`];function S(e,t){if(e!==void 0)return{role:`img`,"aria-label":e};if(!(t&&x.some(e=>e in t)))return{"aria-hidden":!0}}var C;(function(e){function t(e){return e.charAt(0).toUpperCase()+e.slice(1)}e.capitalize=t})(C||={});var w=C,T;(function(e){function t(e,t,n){let r={...e},i=r.props||{};return t.forEach(e=>{e in r&&(i[e]=r[e],delete r[e])}),n&&Object.entries(n).forEach(([e,t])=>{i[e]=t}),r.props=i,r}e.buildProps=t;function n(e){return!!e&&typeof e==`object`}e.isObject=n;function r(e,t){return e in t}e.isKeyOf=r})(T||={});var E=T,D=[`sky-500`,`emerald-500`,`amber-500`,`violet-500`,`rose-500`,`cyan-500`],O=[`sky-400`,`emerald-400`,`amber-400`,`violet-400`,`rose-400`,`cyan-400`];function k(e){return e.reduce((e,t,n)=>(e[`chart-${n+1}`]=t,e),{})}Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return w}}),Object.defineProperty(exports,"c",{enumerable:!0,get:function(){return y}}),Object.defineProperty(exports,"d",{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,"f",{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return E}}),Object.defineProperty(exports,"l",{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return D}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return S}}),Object.defineProperty(exports,"p",{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return k}}),Object.defineProperty(exports,"s",{enumerable:!0,get:function(){return b}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return O}}),Object.defineProperty(exports,"u",{enumerable:!0,get:function(){return g}});
package/react-shared.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { h as e } from "./platform.mjs";
1
+ import { v as e } from "./platform.mjs";
2
2
  import t, { forwardRef as n, memo as r } from "react";
3
3
  import { classNames as i, getDefaultEngine as a } from "@box-kite/core";
4
4
  //#region src/react/boxClassNames.ts
package/rsc.cjs CHANGED
@@ -1 +1 @@
1
- Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./rolldown-runtime.cjs"),t=require("./react-shared.cjs");let n=require("react");n=e.t(n,1);let r=require("@box-kite/core");(0,r.getDefaultEngine)().configure({sink:`element`});function i(e,r){let{tag:i=`div`,children:a}=e;if(typeof a==`function`)throw Error(`[box-kite] Box children as a function track hover state, which needs the client Box — render it from a 'use client' module.`);let{classNames:o,styleElements:s}=t.l(e,i===`svg`);return n.default.createElement(n.default.Fragment,null,s,n.default.createElement(i,t.d(e,o),a))}function a(e){return i(e)}var o=a;o.extend=r.BoxExtends.extend,o.components=r.BoxExtends.components,o.palette=r.BoxExtends.palette,o.createComponents=r.BoxExtends.createComponents,o.keyframes=r.BoxExtends.keyframes,o.spring=r.Springs.spring,o.getVariableValue=e=>(0,r.getDefaultEngine)().getVariableValue(e),o.configure=e=>(0,r.getDefaultEngine)().configure(e),o.viewTransition=r.startViewTransition;function s(e,n){return t.p(t.l(e,n?.svg===!0),e.className)}exports.default=o,exports.useBoxElement=i,exports.useClassNames=s;
1
+ Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./rolldown-runtime.cjs"),t=require("./react-shared.cjs");let n=require("react");n=e.t(n,1);let r=require("@box-kite/core");(0,r.getDefaultEngine)().configure({sink:`element`});function i(e,r){let{tag:i=`div`,children:a}=e;if(typeof a==`function`)throw Error(`[box-kite] Box children as a function track hover state, which needs the client Box — render it from a 'use client' module.`);let{classNames:o,styleElements:s}=t.l(e,i===`svg`);return n.default.createElement(n.default.Fragment,null,s,n.default.createElement(i,t.d(e,o),a))}function a(e){return i(e)}var o=a;o.extend=r.BoxExtends.extend,o.components=r.BoxExtends.components,o.palette=r.BoxExtends.palette,o.sizes=r.BoxExtends.sizes,o.createComponents=r.BoxExtends.createComponents,o.keyframes=r.BoxExtends.keyframes,o.spring=r.Springs.spring,o.getVariableValue=e=>(0,r.getDefaultEngine)().getVariableValue(e),o.configure=e=>(0,r.getDefaultEngine)().configure(e),o.viewTransition=r.startViewTransition;function s(e,n){return t.p(t.l(e,n?.svg===!0),e.className)}exports.default=o,exports.useBoxElement=i,exports.useClassNames=s;
package/rsc.d.ts CHANGED
@@ -14,6 +14,7 @@ interface RscBoxType {
14
14
  components: typeof BoxExtends.components;
15
15
  /** The `vars` record that points the components' `accent` and `base` families at others, for an element and its subtree. */
16
16
  palette: typeof BoxExtends.palette;
17
+ sizes: typeof BoxExtends.sizes;
17
18
  /** A design for one subtree. A Server Component cannot read the provider that applies it; a client one under `<Box.Components>` can. */
18
19
  createComponents: typeof BoxExtends.createComponents;
19
20
  keyframes: typeof BoxExtends.keyframes;
package/rsc.mjs CHANGED
@@ -13,7 +13,7 @@ function l(e) {
13
13
  return c(e);
14
14
  }
15
15
  var u = l;
16
- u.extend = i.extend, u.components = i.components, u.palette = i.palette, u.createComponents = i.createComponents, u.keyframes = i.keyframes, u.spring = a.spring, u.getVariableValue = (e) => o().getVariableValue(e), u.configure = (e) => o().configure(e), u.viewTransition = s;
16
+ u.extend = i.extend, u.components = i.components, u.palette = i.palette, u.sizes = i.sizes, u.createComponents = i.createComponents, u.keyframes = i.keyframes, u.spring = a.spring, u.getVariableValue = (e) => o().getVariableValue(e), u.configure = (e) => o().configure(e), u.viewTransition = s;
17
17
  function d(e, r) {
18
18
  return n(t(e, r?.svg === !0), e.className);
19
19
  }
package/scrolling.cjs CHANGED
@@ -1 +1 @@
1
- const e=require("./platform.cjs");function t(e,t,n=e.length){let r=0,i=n-1;if(i<=0)return 0;for(;r<i;){let n=r+i+1>>>1;e[n]<=t?r=n:i=n-1}return r}function n(t){let n=e.d(t),r=n?.ownerDocument?.defaultView;if(!n||!r)return null;let i=n.ownerDocument.scrollingElement??n.ownerDocument.documentElement;for(let e=n.parentElement;e&&e!==i&&e!==n.ownerDocument.body;e=e.parentElement)if(/auto|scroll|overlay/.test(r.getComputedStyle(e).overflowY)&&e.scrollHeight>e.clientHeight)return e;return null}Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return t}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return n}});
1
+ const e=require("./platform.cjs");function t(e,t,n=e.length){let r=0,i=n-1;if(i<=0)return 0;for(;r<i;){let n=r+i+1>>>1;e[n]<=t?r=n:i=n-1}return r}function n(t){let n=e.p(t),r=n?.ownerDocument?.defaultView;if(!n||!r)return null;let i=n.ownerDocument.scrollingElement??n.ownerDocument.documentElement;for(let e=n.parentElement;e&&e!==i&&e!==n.ownerDocument.body;e=e.parentElement)if(/auto|scroll|overlay/.test(r.getComputedStyle(e).overflowY)&&e.scrollHeight>e.clientHeight)return e;return null}Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return t}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return n}});
package/scrolling.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { d as e } from "./platform.mjs";
1
+ import { p as e } from "./platform.mjs";
2
2
  //#region src/utils/virtual/rowSearch.ts
3
3
  function t(e, t, n = e.length) {
4
4
  let r = 0, i = n - 1;
@@ -36,3 +36,12 @@ export declare function isRtl(value: ElementLike): boolean;
36
36
  * which the browser repairs to the nearest boundary and then paints over whatever is rendered inside it.
37
37
  */
38
38
  export declare function clearSelection(element: ElementLike): void;
39
+ /** What a `<Dialog>` dispatches on its document when it opens or closes as a modal, since everything outside one is inert. */
40
+ export declare const MODAL_EVENT = "box-kite:modal";
41
+ export type ModalEventDetail = {
42
+ dialog: HTMLElement;
43
+ open: boolean;
44
+ };
45
+ export declare function announceModal(dialog: HTMLElement, open: boolean): void;
46
+ /** The first element inside that Tab would reach — where APG puts focus when a dialog opens. */
47
+ export declare function firstTabbable(container: Element): HTMLElement | null;