@box-kite/react 2.2.18 → 2.3.1

package/react-shared.cjs

@@ -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._()&&(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}});
+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

@@ -1,4 +1,4 @@
-import { _ as e } from "./platform.mjs";
+import { v as e } from "./platform.mjs";
 import t, { forwardRef as n, memo as r } from "react";
 import { classNames as i, getDefaultEngine as a } from "@box-kite/core";
 //#region src/react/boxClassNames.ts

package/rsc.cjs

@@ -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;
+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

@@ -14,6 +14,7 @@ interface RscBoxType {
     components: typeof BoxExtends.components;
     /** The `vars` record that points the components' `accent` and `base` families at others, for an element and its subtree. */
     palette: typeof BoxExtends.palette;
+    sizes: typeof BoxExtends.sizes;
     /** A design for one subtree. A Server Component cannot read the provider that applies it; a client one under `<Box.Components>` can. */
     createComponents: typeof BoxExtends.createComponents;
     keyframes: typeof BoxExtends.keyframes;

package/rsc.mjs

@@ -13,7 +13,7 @@ function l(e) {
 	return c(e);
 }
 var u = l;
-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;
+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;
 function d(e, r) {
 	return n(t(e, r?.svg === !0), e.className);
 }

package/utils/dom/domUtils.d.ts

@@ -43,3 +43,5 @@ export type ModalEventDetail = {
     open: boolean;
 };
 export declare function announceModal(dialog: HTMLElement, open: boolean): void;
+/** The first element inside that Tab would reach — where APG puts focus when a dialog opens. */
+export declare function firstTabbable(container: Element): HTMLElement | null;