@astryxdesign/core 0.1.4 → 0.1.5-canary.76e6697

package/dist/Selector/SelectorOption.js

@@ -13,7 +13,7 @@ import { renderIconSlot } from "../Icon/index.js";
 import { Item } from "../Item/index.js";
 import { mergeProps } from "../utils/index.js";
 import { themeProps } from "../utils/themeProps.js";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 const embeddedStyles = {
   root: {
     k8WAf4: "xt970qd",
@@ -54,7 +54,7 @@ export function SelectorOption({
   className,
   style
 }) {
-  return /*#__PURE__*/_jsx(Item, {
+  return /*#__PURE__*/_jsxDEV(Item, {
     startContent: icon ? renderIconSlot(icon, {
       size: 'sm',
       color: 'secondary'
@@ -67,6 +67,6 @@ export function SelectorOption({
       className,
       style
     })
-  });
+  }, void 0, false);
 }
 SelectorOption.displayName = 'SelectorOption';

package/dist/SideNav/SideNav.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SideNav.d.ts","sourceRoot":"","sources":["../../src/SideNav/SideNav.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAGnD,OAAO,EAGL,KAAK,+BAA+B,EACrC,MAAM,0BAA0B,CAAC;AAKlC,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,2BAA2B,CAAC;AAwJ/D,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,WAAW,CAAC;IAC1D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAE7B;;;;OAIG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,+BAA+B,CAAC,CAAC;IAEvD;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;;;;;;;;;;;;OAcG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC;IAEtC;;;;;;;;;;;;OAYG;IACH,WAAW,CAAC,EACR,OAAO,GACP;QACE,kBAAkB,CAAC,EAAE,OAAO,CAAC;QAC7B,WAAW,CAAC,EAAE,OAAO,CAAC;QACtB,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;QACnD,SAAS,CAAC,EAAE,OAAO,CAAC;QACpB,WAAW,CAAC,EAAE,MAAM,CAAC;KACtB,CAAC;CACP;AAMD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,OAAO,CAAC,EACtB,MAAM,EACN,UAAU,EACV,QAAQ,EACR,MAAM,EACN,WAAW,EACX,WAAmB,EACnB,SAAiB,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,SAAS,EACT,GAAG,KAAK,EACT,EAAE,YAAY,+BA4Pd;yBA3Qe,OAAO"}
+{"version":3,"file":"SideNav.d.ts","sourceRoot":"","sources":["../../src/SideNav/SideNav.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAGnD,OAAO,EAGL,KAAK,+BAA+B,EACrC,MAAM,0BAA0B,CAAC;AAKlC,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,2BAA2B,CAAC;AAwJ/D,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,WAAW,CAAC;IAC1D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAE7B;;;;OAIG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,+BAA+B,CAAC,CAAC;IAEvD;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;;;;;;;;;;;;OAcG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC;IAEtC;;;;;;;;;;;;OAYG;IACH,WAAW,CAAC,EACR,OAAO,GACP;QACE,kBAAkB,CAAC,EAAE,OAAO,CAAC;QAC7B,WAAW,CAAC,EAAE,OAAO,CAAC;QACtB,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,CAAC;QACnD,SAAS,CAAC,EAAE,OAAO,CAAC;QACpB,WAAW,CAAC,EAAE,MAAM,CAAC;KACtB,CAAC;CACP;AAMD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,OAAO,CAAC,EACtB,MAAM,EACN,UAAU,EACV,QAAQ,EACR,MAAM,EACN,WAAW,EACX,WAAmB,EACnB,SAAiB,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,SAAS,EACT,GAAG,KAAK,EACT,EAAE,YAAY,+BAgQd;yBA/Qe,OAAO"}

package/dist/SideNav/SideNav.js

@@ -38,7 +38,7 @@ import { themeProps } from "../utils/themeProps.js";
 // =============================================================================
 
 /** Width below which dragging collapses the sidebar (when collapsible). */
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV, Fragment as _Fragment } from "react/jsx-dev-runtime";
 const COLLAPSE_THRESHOLD = 160;
 
 // =============================================================================
@@ -193,18 +193,18 @@ export function SideNav({
   // Topbar mode — heading + footerIcons in a horizontal bar
   // =========================================================================
   if (renderMode === 'topbar') {
-    return /*#__PURE__*/_jsxs("div", {
+    return /*#__PURE__*/_jsxDEV("div", {
       "data-testid": testId,
       ...mergeProps(themeProps('side-nav', {
         mode: 'topbar'
       }), stylex.props(styles.topbar, xstyle), className, style),
-      children: [header, /*#__PURE__*/_jsx("div", {
+      children: [header, /*#__PURE__*/_jsxDEV("div", {
         ...{
           className: "x78zum5 x6s0dn4 xzye2dw xvc5jky"
         },
         children: footerIcons
-      })]
-    });
+      }, void 0, false)]
+    }, void 0, true);
   }
 
   // =========================================================================
@@ -212,21 +212,21 @@ export function SideNav({
   // =========================================================================
   const hasDrawerFooter = !!(footer || footerIcons);
   if (renderMode === 'drawer') {
-    return /*#__PURE__*/_jsxs(MobileNav, {
+    return /*#__PURE__*/_jsxDEV(MobileNav, {
       header: header,
       "data-testid": testId,
-      children: [topContent, children, hasDrawerFooter && /*#__PURE__*/_jsxs("div", {
+      children: [topContent, children, hasDrawerFooter && /*#__PURE__*/_jsxDEV("div", {
         ...{
           className: "x78zum5 xdt5ytf xr1yuqi x1txdalj x1xye8es x11xkdxz x13fuv20 x1pc3f07"
         },
-        children: [footer, footerIcons && /*#__PURE__*/_jsx("div", {
+        children: [footer, footerIcons && /*#__PURE__*/_jsxDEV("div", {
           ...{
             className: "x78zum5 x6s0dn4 xzye2dw"
           },
           children: footerIcons
-        })]
-      })]
-    });
+        }, void 0, false)]
+      }, void 0, true)]
+    }, void 0, true);
   }
 
   // =========================================================================
@@ -234,19 +234,19 @@ export function SideNav({
   // Used when TopNav owns the drawer and SideNav items are nested inside
   // =========================================================================
   if (renderMode === 'drawer-content') {
-    return /*#__PURE__*/_jsxs(_Fragment, {
-      children: [topContent, children, hasDrawerFooter && /*#__PURE__*/_jsxs("div", {
+    return /*#__PURE__*/_jsxDEV(_Fragment, {
+      children: [topContent, children, hasDrawerFooter && /*#__PURE__*/_jsxDEV("div", {
         ...{
           className: "x78zum5 xdt5ytf xr1yuqi x1txdalj x1xye8es x11xkdxz x13fuv20 x1pc3f07"
         },
-        children: [footer, footerIcons && /*#__PURE__*/_jsx("div", {
+        children: [footer, footerIcons && /*#__PURE__*/_jsxDEV("div", {
           ...{
             className: "x78zum5 x6s0dn4 xzye2dw"
           },
           children: footerIcons
-        })]
-      })]
-    });
+        }, void 0, false)]
+      }, void 0, true)]
+    }, void 0, true);
   }
 
   // =========================================================================
@@ -254,20 +254,24 @@ export function SideNav({
   // =========================================================================
   const hasStickyTop = !!(header || topContent);
   const hasStickyBottom = !!(footer || footerIcons);
+  // The built-in collapse button only renders when collapse is enabled and it
+  // hasn't been opted out via `collapsible.hasButton: false` (e.g. when the
+  // consumer places a SideNavCollapseButton in the header instead).
+  const showCollapseButton = isCollapsible && hasCollapseButton;
 
   // When resizable, override the nav width via inline style
   const resizableNavStyle = isResizable ? {
     ...(style ?? {}),
     width: collapsed ? undefined : resizableHook.size
   } : style;
-  const navElement = /*#__PURE__*/_jsxs("nav", {
+  const navElement = /*#__PURE__*/_jsxDEV("nav", {
     ref: mergeRefs(ref, navRef),
     role: "navigation",
     "aria-label": "Side navigation",
     "data-testid": testId,
     ...mergeProps(themeProps('side-nav'), stylex.props(styles.root, collapsed && styles.rootCollapsed, xstyle), className, resizableNavStyle),
     ...props,
-    children: [hasStickyTop && /*#__PURE__*/_jsxs("div", {
+    children: [hasStickyTop && /*#__PURE__*/_jsxDEV("div", {
       ...{
         0: {
           className: "x78zum5 xdt5ytf x2lah0s x7wzq59 x13vifvy x1vjfegm xgcd1z6 x1xye8es x1wesfrj xf314gf x1txdalj"
@@ -276,11 +280,11 @@ export function SideNav({
           className: "x78zum5 xdt5ytf x2lah0s x7wzq59 x13vifvy x1vjfegm xgcd1z6 x1xye8es x1wesfrj xf314gf x1txdalj x6s0dn4"
         }
       }[!!collapsed << 0],
-      children: [header, topContent && /*#__PURE__*/_jsx("div", {
+      children: [header, topContent && /*#__PURE__*/_jsxDEV("div", {
         ...{},
         children: topContent
-      })]
-    }), /*#__PURE__*/_jsx("div", {
+      }, void 0, false)]
+    }, void 0, true), /*#__PURE__*/_jsxDEV("div", {
       ...{
         0: {
           className: "x98rzlu x1odjw0f x6ikm8r xf314gf x1xye8es x1wesfrj"
@@ -308,7 +312,7 @@ export function SideNav({
         }
       }[!!collapsed << 2 | !!hasStickyTop << 1 | !!hasStickyBottom << 0],
       children: children
-    }), (hasStickyBottom || isCollapsible) && /*#__PURE__*/_jsxs("div", {
+    }, void 0, false), (hasStickyBottom || showCollapseButton) && /*#__PURE__*/_jsxDEV("div", {
       ...{
         0: {
           className: "x78zum5 xdt5ytf x2lah0s xr1yuqi x7wzq59 x1ey2m1c xgcd1z6 x1txdalj xf314gf xfsso4q x1wesfrj x11xkdxz x13fuv20 x1pc3f07"
@@ -317,7 +321,7 @@ export function SideNav({
           className: "x78zum5 xdt5ytf x2lah0s xr1yuqi x7wzq59 x1ey2m1c xgcd1z6 x1txdalj xf314gf x1wesfrj x11xkdxz x13fuv20 x1pc3f07 xexx8yu"
         }
       }[!!collapsed << 0],
-      children: [footer, /*#__PURE__*/_jsxs("div", {
+      children: [footer, /*#__PURE__*/_jsxDEV("div", {
         ...{
           0: {
             className: "x78zum5 x6s0dn4 xzye2dw"
@@ -326,19 +330,19 @@ export function SideNav({
             className: "x78zum5 x6s0dn4 xzye2dw x3ieub6"
           }
         }[!!collapsed << 0],
-        children: [isCollapsible && hasCollapseButton && /*#__PURE__*/_jsx(SideNavCollapseButton, {}), footerIcons]
-      })]
-    })]
-  });
+        children: [showCollapseButton && /*#__PURE__*/_jsxDEV(SideNavCollapseButton, {}, void 0, false), footerIcons]
+      }, void 0, true)]
+    }, void 0, true)]
+  }, void 0, true);
 
   // Overlay drag handle inside the nav when resizable.
   // Uses ResizeHandle in overlay mode so the handle sits inside
   // the panel's overflow: clip bounds.
-  const content = showResizeHandle ? /*#__PURE__*/_jsxs("div", {
+  const content = showResizeHandle ? /*#__PURE__*/_jsxDEV("div", {
     ...{
       className: "x1n2onr6 x78zum5 x2lah0s x5yr21d"
     },
-    children: [navElement, /*#__PURE__*/_jsx(ResizeHandle, {
+    children: [navElement, /*#__PURE__*/_jsxDEV(ResizeHandle, {
       "data-testid": "astryx-sidenav-resize-handle",
       direction: "horizontal",
       position: "overlay",
@@ -346,13 +350,13 @@ export function SideNav({
       isAlwaysVisible: false,
       resizable: resizableHook.props,
       label: "Resize sidebar"
-    })]
-  }) : navElement;
+    }, void 0, false)]
+  }, void 0, true) : navElement;
   if (isCollapsible) {
-    return /*#__PURE__*/_jsx(SideNavCollapseContext, {
+    return /*#__PURE__*/_jsxDEV(SideNavCollapseContext, {
       value: collapseContext,
       children: content
-    });
+    }, void 0, false);
   }
   return content;
 }

package/dist/SideNav/SideNavCollapseButton.d.ts

@@ -53,7 +53,7 @@ export interface SideNavCollapseButtonProps extends BaseProps<HTMLButtonElement>
  * <SideNav handleRef={ref} collapsible>...</SideNav>
  * ```
  */
-export declare function SideNavCollapseButton({ ref, handleRef, label, children, ...props }: SideNavCollapseButtonProps): React.JSX.Element | null;
+export declare function SideNavCollapseButton({ ref, handleRef, label, children, onClick: onClickProp, ...props }: SideNavCollapseButtonProps): React.JSX.Element | null;
 export declare namespace SideNavCollapseButton {
     var displayName: string;
 }

package/dist/SideNav/SideNavCollapseButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SideNavCollapseButton.d.ts","sourceRoot":"","sources":["../../src/SideNav/SideNavCollapseButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAK5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,EAGL,KAAK,+BAA+B,EACrC,MAAM,0BAA0B,CAAC;AAwBlC,MAAM,WAAW,0BAA2B,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC9E,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,+BAA+B,GAAG,IAAI,CAAC,CAAC;IAEpE;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAMD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,GAAG,EACH,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,0BAA0B,4BAgC5B;yBAtCe,qBAAqB"}
+{"version":3,"file":"SideNavCollapseButton.d.ts","sourceRoot":"","sources":["../../src/SideNav/SideNavCollapseButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAK5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,EAGL,KAAK,+BAA+B,EACrC,MAAM,0BAA0B,CAAC;AAwBlC,MAAM,WAAW,0BAA2B,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC9E,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,+BAA+B,GAAG,IAAI,CAAC,CAAC;IAEpE;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAMD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,GAAG,EACH,SAAS,EACT,KAAK,EACL,QAAQ,EACR,OAAO,EAAE,WAAW,EACpB,GAAG,KAAK,EACT,EAAE,0BAA0B,4BAgC5B;yBAvCe,qBAAqB"}

package/dist/SideNav/SideNavCollapseButton.js

@@ -22,13 +22,14 @@ import "../theme/tokens.stylex.js";
 import { durationVars, easeVars } from "../theme/tokens.stylex.js";
 import { getIcon } from "../Icon/globalIconRegistry.js";
 import { Button } from "../Button/index.js";
+import { composeEventHandlers } from "../utils/index.js";
 import { useSideNavCollapse } from "./SideNavCollapseContext.js";
 import { useAppShellMobile } from "../AppShell/AppShellMobileContext.js";
 
 // =============================================================================
 // Styles
 // =============================================================================
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 // =============================================================================
 // Types
 // =============================================================================
@@ -63,6 +64,7 @@ export function SideNavCollapseButton({
   handleRef,
   label,
   children,
+  onClick: onClickProp,
   ...props
 }) {
   const {
@@ -79,13 +81,13 @@ export function SideNavCollapseButton({
   if (!isCollapsible || isMobile) {
     return null;
   }
-  return /*#__PURE__*/_jsx(Button, {
+  return /*#__PURE__*/_jsxDEV(Button, {
     ref: ref,
     label: label ?? (isCollapsed ? 'Expand sidebar' : 'Collapse sidebar'),
     variant: "ghost",
     ...props,
-    onClick: toggle,
-    icon: children ?? /*#__PURE__*/_jsx("span", {
+    onClick: composeEventHandlers(onClickProp, toggle),
+    icon: children ?? /*#__PURE__*/_jsxDEV("span", {
       ...{
         0: {
           className: "x3nfvp2 x6s0dn4 x11xpdln xuedmi6 xlr8y92"
@@ -95,9 +97,9 @@ export function SideNavCollapseButton({
         }
       }[!!isCollapsed << 0],
       children: getIcon('chevronLeft')
-    }),
+    }, void 0, false),
     isIconOnly: true
-  });
+  }, void 0, false);
 }
 SideNavCollapseButton.displayName = 'SideNavCollapseButton';
 function useSideNavCollapseState(handleRef) {