@xaui/native 0.9.1-alpha.42 → 0.9.1-alpha.44

package/dist/{chunk-HA6BFY3A.js → chunk-34ZMNO2Y.js}

@@ -1,7 +1,7 @@
 import {
   CloseButton,
   closeButtonBase
-} from "./chunk-EYD4H4X6.js";
+} from "./chunk-VIJTAIGH.js";
 import {
   Icon
 } from "./chunk-FHUYHV6J.js";

package/dist/chunk-3X4G7UKE.cjs

@@ -0,0 +1,401 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+
+var _chunkQ2OCIQOCcjs = require('./chunk-Q2OCIQOC.cjs');
+
+
+var _chunkWDDXU3OHcjs = require('./chunk-WDDXU3OH.cjs');
+
+
+
+var _chunkEKS3W46Mcjs = require('./chunk-EKS3W46M.cjs');
+
+
+var _chunk7EIHHOHPcjs = require('./chunk-7EIHHOHP.cjs');
+
+
+var _chunkTGMVEHV7cjs = require('./chunk-TGMVEHV7.cjs');
+
+
+var _chunk7DPL3ZDScjs = require('./chunk-7DPL3ZDS.cjs');
+
+
+var _chunk7GHM4GKLcjs = require('./chunk-7GHM4GKL.cjs');
+
+
+
+var _chunkFNEUOBCVcjs = require('./chunk-FNEUOBCV.cjs');
+
+
+var _chunk57SJ4LJFcjs = require('./chunk-57SJ4LJF.cjs');
+
+
+var _chunkTK44VBIEcjs = require('./chunk-TK44VBIE.cjs');
+
+// src/components/dialog/dialog-close.tsx
+var _react = require('react');
+
+// src/components/dialog/dialog.context.ts
+var [DialogProvider, useDialog] = _chunk7GHM4GKLcjs.createSlotContext.call(void 0, "Dialog");
+
+// src/components/dialog/dialog-close.tsx
+var _jsxruntime = require('react/jsx-runtime');
+var DialogClose = _react.forwardRef.call(void 0, function DialogClose2({ asChild = false, onPress, ...props }, ref) {
+  const { close, closeStyle, closeGlyphStyle } = useDialog();
+  const handlePress = _react.useCallback.call(void 0, 
+    (event) => {
+      _optionalChain([onPress, 'optionalCall', _ => _(event)]);
+      close();
+    },
+    [close, onPress]
+  );
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _chunkQ2OCIQOCcjs.CloseButton,
+    {
+      ref,
+      name: "Dialog.Close",
+      asChild,
+      baseStyle: asChild ? void 0 : closeStyle,
+      glyphStyle: closeGlyphStyle,
+      onPress: handlePress,
+      ...props
+    }
+  );
+});
+DialogClose.displayName = "XAUI.Dialog.Close";
+
+// src/components/dialog/dialog-content.tsx
+
+var _reactnative = require('react-native');
+var _reactnativereanimated = require('react-native-reanimated'); var _reactnativereanimated2 = _interopRequireDefault(_reactnativereanimated);
+
+// src/components/dialog/dialog.animation.ts
+
+var ENTER_MS = 200;
+var EXIT_MS = 150;
+var contentEntering = new (0, _reactnativereanimated.Keyframe)({
+  0: { opacity: 0, transform: [{ scale: 0.94 }] },
+  100: {
+    opacity: 1,
+    transform: [{ scale: 1 }],
+    easing: _reactnativereanimated.Easing.out(_reactnativereanimated.Easing.cubic)
+  }
+}).duration(ENTER_MS);
+var contentExiting = new (0, _reactnativereanimated.Keyframe)({
+  0: { opacity: 1, transform: [{ scale: 1 }] },
+  100: {
+    opacity: 0,
+    transform: [{ scale: 0.94 }],
+    easing: _reactnativereanimated.Easing.in(_reactnativereanimated.Easing.cubic)
+  }
+}).duration(EXIT_MS);
+
+// src/components/dialog/dialog-content.tsx
+
+var DialogContent = _react.forwardRef.call(void 0, 
+  function DialogContent2({ children, accessibilityViewIsModal = true, style, ...props }, ref) {
+    const context = useDialog();
+    const { panelStyle, contentStyle, isOpen } = context;
+    const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+    if (!isOpen) return null;
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWDDXU3OHcjs.Portal, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogProvider, { value: context, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { pointerEvents: "box-none", style: panelStyle, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _reactnativereanimated2.default.View,
+      {
+        ref,
+        entering: contentEntering,
+        exiting: contentExiting,
+        accessibilityViewIsModal,
+        accessibilityRole: "alert",
+        ...rest,
+        style: [contentStyle, styleProps, style],
+        children
+      }
+    ) }) }) });
+  }
+);
+DialogContent.displayName = "XAUI.Dialog.Content";
+
+// src/components/dialog/dialog-description.tsx
+
+
+
+var DialogDescription = _react.forwardRef.call(void 0, 
+  function DialogDescription2({ children, style, ...props }, ref) {
+    const { descriptionStyle } = useDialog();
+    const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.Text, { ref, ...rest, style: [descriptionStyle, styleProps, style], children });
+  }
+);
+DialogDescription.displayName = "XAUI.Dialog.Description";
+
+// src/components/dialog/dialog-overlay.tsx
+
+
+
+
+var AnimatedPressable = _reactnativereanimated2.default.createAnimatedComponent(_reactnative.Pressable);
+var DialogOverlay = _react.forwardRef.call(void 0, 
+  function DialogOverlay2({ children, isDismissable = true, style, ...props }, ref) {
+    const context = useDialog();
+    const { overlayStyle, isOpen, close } = context;
+    const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+    if (!isOpen) return null;
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWDDXU3OHcjs.Portal, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogProvider, { value: context, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      AnimatedPressable,
+      {
+        ref,
+        entering: _chunkEKS3W46Mcjs.overlayEntering,
+        exiting: _chunkEKS3W46Mcjs.overlayExiting,
+        accessibilityRole: "none",
+        importantForAccessibility: "no",
+        onPress: isDismissable ? close : void 0,
+        ...rest,
+        style: [overlayStyle, styleProps, style],
+        children
+      }
+    ) }) });
+  }
+);
+DialogOverlay.displayName = "XAUI.Dialog.Overlay";
+
+// src/components/dialog/dialog-title.tsx
+
+
+
+var DialogTitle = _react.forwardRef.call(void 0, function DialogTitle2({ children, accessibilityRole = "header", style, ...props }, ref) {
+  const { titleStyle } = useDialog();
+  const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _reactnative.Text,
+    {
+      ref,
+      accessibilityRole,
+      ...rest,
+      style: [titleStyle, styleProps, style],
+      children
+    }
+  );
+});
+DialogTitle.displayName = "XAUI.Dialog.Title";
+
+// src/components/dialog/dialog-trigger.tsx
+
+
+var DialogTrigger = _react.forwardRef.call(void 0, 
+  function DialogTrigger2({
+    children,
+    asChild = false,
+    accessibilityRole = "button",
+    accessibilityState,
+    style,
+    onPress,
+    onPressIn,
+    onPressOut,
+    ...props
+  }, ref) {
+    const { isOpen, isDisabled, toggle } = useDialog();
+    const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+    const [isPressed, press] = _chunk7DPL3ZDScjs.usePressState.call(void 0, { onPressIn, onPressOut });
+    const handlePress = _react.useCallback.call(void 0, 
+      (event) => {
+        _optionalChain([onPress, 'optionalCall', _2 => _2(event)]);
+        toggle();
+      },
+      [onPress, toggle]
+    );
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkTGMVEHV7cjs.PressableFeedback,
+      {
+        ref,
+        isPressed,
+        isDisabled,
+        asChild,
+        accessibilityRole,
+        accessibilityState: {
+          disabled: isDisabled,
+          expanded: isOpen,
+          ...accessibilityState
+        },
+        ...rest,
+        style: [
+          styleProps,
+          typeof style === "function" ? style({ pressed: isPressed }) : style
+        ],
+        onPress: handlePress,
+        onPressIn: press.onPressIn,
+        onPressOut: press.onPressOut,
+        children
+      }
+    );
+  }
+);
+DialogTrigger.displayName = "XAUI.Dialog.Trigger";
+
+// src/components/dialog/dialog.tsx
+
+
+// src/components/dialog/dialog.recipe.ts
+var SLOTS = [
+  "overlay",
+  "panel",
+  "content",
+  "title",
+  "description",
+  "close",
+  "closeGlyph"
+];
+var CLOSE_BOX = 32;
+var CLOSE_BAR = 16;
+var dialogRecipe = _chunkFNEUOBCVcjs.createRecipe.call(void 0, {
+  slots: SLOTS,
+  base: (theme) => {
+    const shared = _chunkQ2OCIQOCcjs.closeButtonBase.call(void 0, theme);
+    return {
+      // Unlike the `Popover`'s, this backdrop dims by default. A popover is an aside you can
+      // read the page around; a dialog is a question, and the page behind it is not
+      // available until it is answered.
+      overlay: {
+        position: "absolute",
+        top: 0,
+        bottom: 0,
+        start: 0,
+        end: 0,
+        backgroundColor: theme.colors.backdrop
+      },
+      /**
+       * The layer the panel is centred in, filling the portal. It is not the panel: a
+       * centred box cannot also be the thing that centres it, and the padding here is the
+       * margin the dialog keeps from the screen's edges rather than its own inner padding.
+       */
+      panel: {
+        position: "absolute",
+        top: 0,
+        bottom: 0,
+        start: 0,
+        end: 0,
+        justifyContent: "center",
+        padding: theme.spacing(5)
+      },
+      content: {
+        backgroundColor: theme.colors.overlay,
+        padding: theme.spacing(5),
+        // HeroUI's `--radius-3xl` on a base of 8 is 24 points; our base is 12, so the same
+        // 24 is `2xl`. Reading their key rather than their number puts a pill on it.
+        borderRadius: theme.radius["2xl"],
+        borderCurve: "continuous",
+        gap: theme.spacing(2),
+        ...theme.shadows.overlay
+      },
+      title: {
+        fontFamily: theme.fontFamilies.body,
+        fontWeight: theme.fontWeights.medium,
+        fontSize: theme.fontSizes.lg,
+        lineHeight: theme.lineHeights.lg,
+        color: theme.colors.overlayForeground
+      },
+      description: {
+        fontFamily: theme.fontFamilies.body,
+        fontSize: theme.fontSizes.md,
+        lineHeight: theme.lineHeights.md,
+        color: theme.colors.muted
+      },
+      /**
+       * A filled disc, not a bare glyph. Their `CloseButton` is a `tertiary` button, and
+       * their `tertiary` is `background-color: var(--color-default)` — the same token our
+       * `secondary` names. A cross floating on the panel with nothing under it reads as
+       * decoration; the disc is what makes it a target.
+       *
+       * It positions nothing. Where the cross sits is the caller's, exactly as it is
+       * theirs: `alignSelf: 'flex-end'` above a title that spans the panel, or absolute in
+       * the corner over one short enough to leave it free. A slot that placed itself would
+       * have to guess which, and their own examples use both.
+       */
+      close: {
+        ...shared.close,
+        width: CLOSE_BOX,
+        height: CLOSE_BOX,
+        borderRadius: CLOSE_BOX / 2,
+        backgroundColor: theme.colors.default
+      },
+      // `muted`, like theirs: the cross is the way out, not the answer. The answer is a
+      // `Button` in the words the dialog asked for.
+      closeGlyph: {
+        ...shared.closeGlyph,
+        width: CLOSE_BAR,
+        backgroundColor: theme.colors.muted
+      }
+    };
+  },
+  /**
+   * One variant, and it is not a gap. A dialog is the theme's floating surface: it has no
+   * emphasis to report — the question it asks is in its words, not in its fill. The recipe
+   * keeps a single-entry `variantTokens` because `resolveTint` walks that mapping.
+   */
+  variantTokens: { default: {} },
+  variants: { radius: _chunkFNEUOBCVcjs.radiusAxis.call(void 0, "content") },
+  defaultVariants: { variant: "default" }
+});
+
+// src/components/dialog/dialog.tsx
+
+function Dialog({
+  children,
+  radius,
+  isOpen: controlledOpen,
+  defaultOpen = false,
+  onOpenChange,
+  isDisabled = false
+}) {
+  const theme = _chunk57SJ4LJFcjs.useXAUITheme.call(void 0, );
+  const [isOpen, setOpen] = _chunk7EIHHOHPcjs.useControllableState.call(void 0, {
+    value: controlledOpen,
+    defaultValue: defaultOpen,
+    onChange: onOpenChange
+  });
+  const styles = dialogRecipe.resolve({ theme, selection: { radius } });
+  const open = _react.useCallback.call(void 0, () => setOpen(true), [setOpen]);
+  const close = _react.useCallback.call(void 0, () => setOpen(false), [setOpen]);
+  const toggle = _react.useCallback.call(void 0, () => setOpen((current) => !current), [setOpen]);
+  const context = _react.useMemo.call(void 0, 
+    () => ({
+      overlayStyle: styles.overlay,
+      panelStyle: styles.panel,
+      contentStyle: styles.content,
+      titleStyle: styles.title,
+      descriptionStyle: styles.description,
+      closeStyle: styles.close,
+      closeGlyphStyle: styles.closeGlyph,
+      isOpen,
+      isDisabled,
+      open,
+      close,
+      toggle
+    }),
+    [styles, isOpen, isDisabled, open, close, toggle]
+  );
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogProvider, { value: context, children });
+}
+Dialog.displayName = "XAUI.Dialog.Root";
+
+// src/components/dialog/index.ts
+var Dialog2 = Object.assign(Dialog, {
+  Trigger: DialogTrigger,
+  Overlay: DialogOverlay,
+  Content: DialogContent,
+  Title: DialogTitle,
+  Description: DialogDescription,
+  Close: DialogClose
+});
+
+
+
+
+
+
+
+
+
+
+
+
+exports.useDialog = useDialog; exports.DialogClose = DialogClose; exports.DialogContent = DialogContent; exports.DialogDescription = DialogDescription; exports.DialogOverlay = DialogOverlay; exports.DialogTitle = DialogTitle; exports.DialogTrigger = DialogTrigger; exports.dialogRecipe = dialogRecipe; exports.Dialog = Dialog; exports.Dialog2 = Dialog2;

package/dist/{chunk-66FOASTP.cjs → chunk-AATY3NAV.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
 
-var _chunkAAVCMCJ3cjs = require('./chunk-AAVCMCJ3.cjs');
+var _chunkQ2OCIQOCcjs = require('./chunk-Q2OCIQOC.cjs');
 
 
 var _chunk4KFKWBN5cjs = require('./chunk-4KFKWBN5.cjs');
@@ -32,7 +32,7 @@ var _jsxruntime = require('react/jsx-runtime');
 var AlertClose = _react.forwardRef.call(void 0, function AlertClose2({ isDisabled, ...props }, ref) {
   const { closeStyle, closeGlyphStyle, isDisabled: isAlertDisabled } = useAlert();
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunkAAVCMCJ3cjs.CloseButton,
+    _chunkQ2OCIQOCcjs.CloseButton,
     {
       ref,
       name: "Alert.Close",
@@ -194,7 +194,7 @@ var alertRecipe = _chunkFNEUOBCVcjs.createRecipe.call(void 0, {
   // The cross's own geometry — thickness and centring — belongs to the shared
   // `CloseButton`; what stays below is the box and bar size this component's scale sets.
   base: (theme) => ({
-    ..._chunkAAVCMCJ3cjs.closeButtonBase.call(void 0, theme),
+    ..._chunkQ2OCIQOCcjs.closeButtonBase.call(void 0, theme),
     root: {
       flexDirection: "row",
       // Top-aligned, not centred: an alert's message can run to three lines, and an icon

package/dist/{chunk-USF6EWYR.js → chunk-ALA63XZS.js}

@@ -1,7 +1,7 @@
 import {
   CloseButton,
   closeButtonBase
-} from "./chunk-EYD4H4X6.js";
+} from "./chunk-VIJTAIGH.js";
 import {
   Icon
 } from "./chunk-FHUYHV6J.js";