@xaui/native 0.9.1-beta.96 → 0.9.1-beta.97

package/dist/chunk-C6JO2RTV.cjs

@@ -0,0 +1,752 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+function _interopRequireDefault(obj) {
+  return obj && obj.__esModule ? obj : {
+    default: obj
+  };
+}
+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 _chunk7EIHHOHPcjs = require('./chunk-7EIHHOHP.cjs');
+var _chunkGSZDN6EZcjs = require('./chunk-GSZDN6EZ.cjs');
+var _chunkFHNIGHN5cjs = require('./chunk-FHNIGHN5.cjs');
+var _chunkSL3V7R2Ycjs = require('./chunk-SL3V7R2Y.cjs');
+var _chunkCDRGTUYFcjs = require('./chunk-CDRGTUYF.cjs');
+var _chunkIIAQISBGcjs = require('./chunk-IIAQISBG.cjs');
+var _chunkTK44VBIEcjs = require('./chunk-TK44VBIE.cjs');
+
+// src/components/slide-button/slide-button-fill.tsx
+var _react = require('react');
+var _reactnative = require('react-native');
+var _reactnativereanimated = require('react-native-reanimated');
+var _reactnativereanimated2 = _interopRequireDefault(_reactnativereanimated);
+
+// src/components/slide-button/slide-button.animation.ts
+var THUMB_PRESSED_SCALE = 1.06;
+var THUMB_SPRING = {
+  damping: 20,
+  stiffness: 260,
+  mass: 0.7
+};
+var DEFAULT_THRESHOLD = 0.9;
+const _worklet_16393505849963_init_data = {
+  code: "function sweptWidth_chunkC6JO2RTVCjs1(offset,travel,trackLength){return travel>0?offset/travel*trackLength:0;}",
+  location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-C6JO2RTV.cjs",
+  sourceMap: "{\"version\":3,\"names\":[\"sweptWidth_chunkC6JO2RTVCjs1\",\"offset\",\"travel\",\"trackLength\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-C6JO2RTV.cjs\"],\"mappings\":\"AAiCA,SAAAA,4BAAoCA,CAAAC,MAAA,CAAAC,MAAa,CAAAC,WAAA,EAE/C,MAAO,CAAAD,MAAM,CAAG,CAAC,CAAGD,MAAM,CAAGC,MAAM,CAAGC,WAAW,CAAG,CAAC,CACvD\",\"ignoreList\":[]}"
+};
+const sweptWidth = function sweptWidth_chunkC6JO2RTVCjs1Factory({
+  _worklet_16393505849963_init_data
+}) {
+  const _e = [new global.Error(), 1, -27];
+  const sweptWidth = function (offset, travel, trackLength) {
+    return travel > 0 ? offset / travel * trackLength : 0;
+  };
+  sweptWidth.__closure = {};
+  sweptWidth.__workletHash = 16393505849963;
+  sweptWidth.__pluginVersion = "0.7.4";
+  sweptWidth.__initData = _worklet_16393505849963_init_data;
+  sweptWidth.__stackDetails = _e;
+  return sweptWidth;
+}({
+  _worklet_16393505849963_init_data
+}); // src/components/slide-button/slide-button.context.ts
+var [SlideButtonProvider, useSlideButton] = _chunkCDRGTUYFcjs.createSlotContext.call(void 0, "SlideButton");
+
+// src/components/slide-button/slide-button-fill.tsx
+var _jsxruntime = require('react/jsx-runtime');
+const _worklet_4491413439968_init_data = {
+  code: "function chunkC6JO2RTVCjs2(){const{sweptWidth,offset,travel,trackLength}=this.__closure;return{width:sweptWidth(offset.get(),travel,trackLength)};}",
+  location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-C6JO2RTV.cjs",
+  sourceMap: "{\"version\":3,\"names\":[\"chunkC6JO2RTVCjs2\",\"sweptWidth\",\"offset\",\"travel\",\"trackLength\",\"__closure\",\"width\",\"get\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-C6JO2RTV.cjs\"],\"mappings\":\"AA+CuE,SAAAA,iBAAMA,CAAA,QAAAC,UAAA,CAAAC,MAAA,CAAAC,MAAA,CAAAC,WAAA,OAAAC,SAAA,CAEvE,MAAO,CAAEC,KAAK,CAAEL,UAAU,CAACC,MAAM,CAACK,GAAG,CAAC,CAAC,CAAEJ,MAAM,CAAEC,WAAW,CAAE,CAAC,CACjE\",\"ignoreList\":[]}"
+};
+var SlideButtonFill = _react.forwardRef.call(void 0, function SlideButtonFill2({
+  style,
+  ...props
+}, ref) {
+  const {
+    fillClipStyle,
+    fillStyle,
+    offset,
+    travel,
+    trackLength
+  } = useSlideButton();
+  const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+  const width = _reactnativereanimated.useAnimatedStyle.call(void 0, function chunkC6JO2RTVCjs2Factory({
+    _worklet_4491413439968_init_data,
+    sweptWidth,
+    offset,
+    travel,
+    trackLength
+  }) {
+    const _e = [new global.Error(), -5, -27];
+    const chunkC6JO2RTVCjs2 = function () {
+      return {
+        width: sweptWidth(offset.get(), travel, trackLength)
+      };
+    };
+    chunkC6JO2RTVCjs2.__closure = {
+      sweptWidth,
+      offset,
+      travel,
+      trackLength
+    };
+    chunkC6JO2RTVCjs2.__workletHash = 4491413439968;
+    chunkC6JO2RTVCjs2.__pluginVersion = "0.7.4";
+    chunkC6JO2RTVCjs2.__initData = _worklet_4491413439968_init_data;
+    chunkC6JO2RTVCjs2.__stackDetails = _e;
+    return chunkC6JO2RTVCjs2;
+  }({
+    _worklet_4491413439968_init_data,
+    sweptWidth,
+    offset,
+    travel,
+    trackLength
+  }), [travel, trackLength]);
+  return /* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnative.View, {
+    pointerEvents: "box-none",
+    style: fillClipStyle,
+    children: /* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnativereanimated2.default.View, {
+      ref,
+      ...rest,
+      style: [fillStyle, width, styleProps, style]
+    })
+  });
+});
+SlideButtonFill.displayName = "XAUI.SlideButton.Fill";
+
+// src/components/slide-button/slide-button-icon.tsx
+
+function SlideButtonIcon({
+  size,
+  color,
+  ...rest
+}) {
+  const {
+    icon
+  } = useSlideButton();
+  return /* @__PURE__ */_jsxruntime.jsx.call(void 0, _chunkGSZDN6EZcjs.Icon, {
+    size: _nullishCoalesce(size, () => icon.size),
+    color: _nullishCoalesce(color, () => icon.color),
+    ...rest
+  });
+}
+SlideButtonIcon.displayName = "XAUI.SlideButton.Icon";
+
+// src/components/slide-button/slide-button-label.tsx
+
+var CLIP = _reactnative.StyleSheet.create({
+  window: {
+    position: "absolute",
+    top: 0,
+    bottom: 0,
+    start: 0,
+    overflow: "hidden",
+    justifyContent: "center"
+  }
+});
+const _worklet_10972554653121_init_data = {
+  code: "function chunkC6JO2RTVCjs3(){const{sweptWidth,offset,travel,trackLength}=this.__closure;return{width:sweptWidth(offset.get(),travel,trackLength)};}",
+  location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-C6JO2RTV.cjs",
+  sourceMap: "{\"version\":3,\"names\":[\"chunkC6JO2RTVCjs3\",\"sweptWidth\",\"offset\",\"travel\",\"trackLength\",\"__closure\",\"width\",\"get\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-C6JO2RTV.cjs\"],\"mappings\":\"AA0FsE,SAAAA,iBAAMA,CAAA,QAAAC,UAAA,CAAAC,MAAA,CAAAC,MAAA,CAAAC,WAAA,OAAAC,SAAA,CAEtE,MAAO,CAAEC,KAAK,CAAEL,UAAU,CAACC,MAAM,CAACK,GAAG,CAAC,CAAC,CAAEJ,MAAM,CAAEC,WAAW,CAAE,CAAC,CACjE\",\"ignoreList\":[]}"
+};
+var SlideButtonLabel = _react.forwardRef.call(void 0, function SlideButtonLabel2({
+  children,
+  style,
+  ...props
+}, ref) {
+  const {
+    labelStyle,
+    labelSweptStyle,
+    offset,
+    travel,
+    trackLength
+  } = useSlideButton();
+  const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+  const clip = _reactnativereanimated.useAnimatedStyle.call(void 0, function chunkC6JO2RTVCjs3Factory({
+    _worklet_10972554653121_init_data,
+    sweptWidth,
+    offset,
+    travel,
+    trackLength
+  }) {
+    const _e = [new global.Error(), -5, -27];
+    const chunkC6JO2RTVCjs3 = function () {
+      return {
+        width: sweptWidth(offset.get(), travel, trackLength)
+      };
+    };
+    chunkC6JO2RTVCjs3.__closure = {
+      sweptWidth,
+      offset,
+      travel,
+      trackLength
+    };
+    chunkC6JO2RTVCjs3.__workletHash = 10972554653121;
+    chunkC6JO2RTVCjs3.__pluginVersion = "0.7.4";
+    chunkC6JO2RTVCjs3.__initData = _worklet_10972554653121_init_data;
+    chunkC6JO2RTVCjs3.__stackDetails = _e;
+    return chunkC6JO2RTVCjs3;
+  }({
+    _worklet_10972554653121_init_data,
+    sweptWidth,
+    offset,
+    travel,
+    trackLength
+  }), [travel, trackLength]);
+  return /* @__PURE__ */_jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, {
+    children: [/* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnative.Text, {
+      ref,
+      numberOfLines: 1,
+      ...rest,
+      style: [labelStyle, styleProps, style],
+      children
+    }), /* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnativereanimated2.default.View, {
+      pointerEvents: "none",
+      style: [CLIP.window, clip],
+      children: /* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnative.Text, {
+        numberOfLines: 1,
+        ...rest,
+        accessibilityElementsHidden: true,
+        importantForAccessibility: "no-hide-descendants",
+        style: [labelSweptStyle, styleProps, style],
+        children
+      })
+    })]
+  });
+});
+SlideButtonLabel.displayName = "XAUI.SlideButton.Label";
+
+// src/components/slide-button/slide-button-thumb.tsx
+
+var _reactnativegesturehandler = require('react-native-gesture-handler');
+const _worklet_13716117858015_init_data = {
+  code: "function chunkC6JO2RTVCjs4(){const{direction,offset,pressed,THUMB_PRESSED_SCALE}=this.__closure;return{transform:[{translateX:direction*offset.get()},{scale:1+pressed.get()*(THUMB_PRESSED_SCALE-1)}]};}",
+  location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-C6JO2RTV.cjs",
+  sourceMap: "{\"version\":3,\"names\":[\"chunkC6JO2RTVCjs4\",\"direction\",\"offset\",\"pressed\",\"THUMB_PRESSED_SCALE\",\"__closure\",\"transform\",\"translateX\",\"get\",\"scale\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-C6JO2RTV.cjs\"],\"mappings\":\"AAkKwE,SAAAA,iBAAMA,CAAA,QAAAC,SAAA,CAAAC,MAAA,CAAAC,OAAA,CAAAC,mBAAA,OAAAC,SAAA,CAE1E,MAAO,CACLC,SAAS,CAAE,CACT,CAAEC,UAAU,CAAEN,SAAS,CAAGC,MAAM,CAACM,GAAG,CAAC,CAAE,CAAC,CACxC,CAAEC,KAAK,CAAE,CAAC,CAAGN,OAAO,CAACK,GAAG,CAAC,CAAC,EAAIJ,mBAAmB,CAAG,CAAC,CAAE,CAAC,CAE5D,CAAC,CACH\",\"ignoreList\":[]}"
+};
+function SlideButtonThumb({
+  children,
+  style,
+  ...props
+}) {
+  const {
+    thumbStyle,
+    glyphStyle,
+    offset,
+    travel,
+    threshold,
+    isDisabled,
+    isConfirmed,
+    confirm
+  } = useSlideButton();
+  const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+  const pressed = _reactnativereanimated.useSharedValue.call(void 0, 0);
+  const start = _reactnativereanimated.useSharedValue.call(void 0, 0);
+  const direction = _reactnative.I18nManager.isRTL ? -1 : 1;
+  const pan = _reactnativegesturehandler.Gesture.Pan().enabled(!isDisabled && !isConfirmed).onBegin(() => {
+    start.set(offset.get());
+    pressed.set(_reactnativereanimated.withSpring.call(void 0, 1, THUMB_SPRING));
+  }).onUpdate(event => {
+    const next = start.get() + direction * event.translationX;
+    offset.set(Math.min(Math.max(next, 0), travel));
+  }).onFinalize(() => {
+    pressed.set(_reactnativereanimated.withSpring.call(void 0, 0, THUMB_SPRING));
+    const reached = travel > 0 && offset.get() / travel >= threshold;
+    offset.set(_reactnativereanimated.withSpring.call(void 0, reached ? travel : 0, THUMB_SPRING));
+    if (reached) _reactnativereanimated.runOnJS.call(void 0, confirm)();
+  });
+  const animated = _reactnativereanimated.useAnimatedStyle.call(void 0, function chunkC6JO2RTVCjs4Factory({
+    _worklet_13716117858015_init_data,
+    direction,
+    offset,
+    pressed,
+    THUMB_PRESSED_SCALE
+  }) {
+    const _e = [new global.Error(), -5, -27];
+    const chunkC6JO2RTVCjs4 = function () {
+      return {
+        transform: [{
+          translateX: direction * offset.get()
+        }, {
+          scale: 1 + pressed.get() * (THUMB_PRESSED_SCALE - 1)
+        }]
+      };
+    };
+    chunkC6JO2RTVCjs4.__closure = {
+      direction,
+      offset,
+      pressed,
+      THUMB_PRESSED_SCALE
+    };
+    chunkC6JO2RTVCjs4.__workletHash = 13716117858015;
+    chunkC6JO2RTVCjs4.__pluginVersion = "0.7.4";
+    chunkC6JO2RTVCjs4.__initData = _worklet_13716117858015_init_data;
+    chunkC6JO2RTVCjs4.__stackDetails = _e;
+    return chunkC6JO2RTVCjs4;
+  }({
+    _worklet_13716117858015_init_data,
+    direction,
+    offset,
+    pressed,
+    THUMB_PRESSED_SCALE
+  }), [direction]);
+  return /* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnativegesturehandler.GestureDetector, {
+    gesture: pan,
+    children: /* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnativereanimated2.default.View, {
+      ...rest,
+      style: [thumbStyle, animated, styleProps, style],
+      children: _nullishCoalesce(children, () => (/* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnative.View, {
+        style: glyphStyle
+      })))
+    })
+  });
+}
+SlideButtonThumb.displayName = "XAUI.SlideButton.Thumb";
+
+// src/components/slide-button/slide-button.tsx
+
+// src/components/slide-button/slide-button.recipe.ts
+var SLOTS = ["root", "fillClip", "fill", "label", "labelSwept", "thumb", "glyph"];
+var VARIANT_TOKENS = {
+  primary: {
+    bg: "accentSoft",
+    fg: "accentSoftForeground",
+    bgSelected: "accent",
+    fgSelected: "accentForeground"
+  },
+  secondary: {
+    bg: "default",
+    fg: "defaultForeground"
+  },
+  tertiary: {
+    border: "border",
+    fg: "foreground"
+  },
+  ghost: {
+    fg: "foreground"
+  },
+  success: {
+    bg: "successSoft",
+    fg: "successSoftForeground",
+    bgSelected: "success",
+    fgSelected: "successForeground"
+  },
+  "success-soft": {
+    bg: "successSoft",
+    fg: "success"
+  },
+  warning: {
+    bg: "warningSoft",
+    fg: "warningSoftForeground",
+    bgSelected: "warning",
+    fgSelected: "warningForeground"
+  },
+  "warning-soft": {
+    bg: "warningSoft",
+    fg: "warning"
+  },
+  danger: {
+    bg: "dangerSoft",
+    fg: "dangerSoftForeground",
+    bgSelected: "danger",
+    fgSelected: "dangerForeground"
+  },
+  "danger-soft": {
+    bg: "dangerSoft",
+    fg: "danger"
+  }
+};
+var FILL_ALPHA = 0.2;
+var THUMB_RATIO = 1.5;
+var NO_SHADOW = {
+  shadowColor: "#000000",
+  shadowOffset: {
+    width: 0,
+    height: 0
+  },
+  shadowOpacity: 0,
+  shadowRadius: 0,
+  elevation: 0
+};
+var SIZES = {
+  sm: {
+    height: "sm",
+    inset: 3,
+    glyph: 14,
+    label: "sm"
+  },
+  md: {
+    height: "md",
+    inset: 4,
+    glyph: 16,
+    label: "md"
+  },
+  lg: {
+    height: "lg",
+    inset: 4,
+    glyph: 20,
+    label: "lg"
+  }
+};
+function sizeAxis(step) {
+  return theme => {
+    const height = theme.controlHeights[step.height];
+    const handleHeight = height - step.inset * 2;
+    return {
+      root: {
+        height
+      },
+      // Centred across the whole pill, not laid out beside the handle — the handle slides
+      // over it, so there is no gap to keep. Symmetric `start`/`end` insets (R13, never
+      // `left`/`right`) just keep a long label off the pill's rounded ends.
+      label: {
+        start: theme.spacing(4),
+        end: theme.spacing(4),
+        fontSize: theme.fontSizes[step.label],
+        lineHeight: theme.lineHeights[step.label]
+      },
+      // The same type at the same inset. No `end`: this copy is laid out inside a clip
+      // whose width is the trail's, and an `end` would measure against *that*, re-centring
+      // the text in a box that keeps narrowing. The slot gives it a width off the measured
+      // pill instead, so both copies sit on exactly the same glyphs.
+      labelSwept: {
+        start: theme.spacing(4),
+        fontSize: theme.fontSizes[step.label],
+        lineHeight: theme.lineHeights[step.label]
+      },
+      // A horizontal stadium: wider than tall, its corners a half-height so the ends stay
+      // round at any width. `start` is its resting inset; the pan translates it from there.
+      thumb: {
+        width: Math.round(handleHeight * THUMB_RATIO),
+        height: handleHeight,
+        borderRadius: handleHeight / 2,
+        start: step.inset
+      },
+      glyph: {
+        width: step.glyph,
+        height: step.glyph
+      }
+    };
+  };
+}
+var slideButtonRecipe = _chunkSL3V7R2Ycjs.createRecipe.call(void 0, {
+  slots: SLOTS,
+  base: theme => ({
+    // A fixed-height bar holding absolutely-positioned children — the fill, the label and
+    // its clipped copy, the thumb — so none of them pushes the others around as it moves.
+    //
+    // **It does not clip.** The trail needs clipping and gets it from `fillClip`, one layer
+    // in; putting `overflow: 'hidden'` up here instead costs the handle its shadow. That
+    // shadow is offset a point down over a three-point blur, and the handle sits four
+    // points off the floor — so the lower half reaches the pill's edge exactly, and the
+    // clip cut it flat there and curved it away at the leading cap while leaving the top
+    // untouched. A shadow soft above and sheared below does not read as a clipped shadow;
+    // it reads as a handle sunk into a groove, which is what it looked like.
+    root: {
+      width: "100%",
+      justifyContent: "center",
+      borderCurve: "continuous",
+      borderRadius: theme.radius.full,
+      borderWidth: 0
+    },
+    /**
+     * The window the trail is read through, and the whole reason it has one.
+     *
+     * The pill is `radius.full`, which on a 48-tall bar resolves to a 24-point cap. The
+     * trail's own `full` is clamped to half of whichever side is shorter — half its
+     * *width* for the first 48 points of the drag — so it draws a squarer corner inside a
+     * rounder one and bulges past the leading edge. No radius fixes that, because the
+     * clamp applies whatever is asked for: the trail has to be cut to the pill's shape.
+     *
+     * Cutting it here rather than on the root is what keeps the cut off the handle.
+     */
+    fillClip: {
+      position: "absolute",
+      top: 0,
+      bottom: 0,
+      start: 0,
+      end: 0,
+      overflow: "hidden",
+      borderCurve: "continuous",
+      borderRadius: theme.radius.full
+    },
+    // Zero width at rest — the width is the swept fraction of the pill, set by the slot,
+    // so there is nothing to draw until the drag has actually started. The radius is the
+    // pill's, so the trail matches the leading cap once it is wide enough to render it;
+    // `fillClip` covers the widths where it cannot. The colour is the variant's,
+    // set in `paint`.
+    fill: {
+      position: "absolute",
+      top: 0,
+      bottom: 0,
+      start: 0,
+      borderRadius: theme.radius.full
+    },
+    label: {
+      position: "absolute",
+      textAlign: "center",
+      fontFamily: theme.fontFamilies.body,
+      fontWeight: theme.fontWeights.medium
+    },
+    /**
+     * The label again, for the ground the trail has already covered.
+     *
+     * One label cannot serve both: on the four inverted variants the pill goes from a soft
+     * slice to the vivid one, and the polarity of a readable text colour flips with it —
+     * measured, a label painted for the soft pill reads 1.2–1.5:1 once the trail is under
+     * it, in light and in dark alike. Fading the label out would answer legibility by
+     * removing the instruction, which is the wrong trade on the control whose whole job is
+     * to say what the slide will do. So it is drawn twice and the top copy is clipped to
+     * the trail: each half of a straddling word sits on the ground it was painted for, and
+     * the switch happens exactly at the trail's edge rather than at some threshold.
+     */
+    labelSwept: {
+      position: "absolute",
+      textAlign: "center",
+      fontFamily: theme.fontFamilies.body,
+      fontWeight: theme.fontWeights.medium
+    },
+    /**
+     * The handle: the surface colour, lifted off the pill by a shadow — the same treatment
+     * the `Slider`'s knob takes, and for the same reason, so the chevron on it never has
+     * to fight the pill for contrast.
+     */
+    thumb: {
+      position: "absolute",
+      alignItems: "center",
+      justifyContent: "center",
+      backgroundColor: theme.colors.background,
+      ...theme.shadows.surface
+    },
+    /**
+     * The built-in chevron, drawn from two borders a quarter turn round — a control whose
+     * whole affordance is "drag me this way" cannot be written without one, and a peer
+     * dependency for a single arrow is the bargain the `CloseButton`'s cross also refuses.
+     * The lit edges are `top` and `end`, so under RTL it flips to point the other way on
+     * its own — the direction the handle travels either way. `children` replace it.
+     */
+    glyph: {
+      borderColor: theme.colors.foreground,
+      borderTopWidth: 2,
+      borderEndWidth: 2,
+      transform: [{
+        rotate: "45deg"
+      }]
+    }
+  }),
+  variantTokens: VARIANT_TOKENS,
+  paint: (theme, colors) => ({
+    root: {
+      backgroundColor: colors.bg,
+      borderColor: colors.border,
+      borderWidth: colors.border ? theme.borderWidth.default : 0
+    },
+    label: {
+      color: colors.fg
+    },
+    // A variant with no vivid slice sweeps a wash, which the resting label already reads
+    // against — so it falls back to the same colour and the two copies are one label.
+    labelSwept: {
+      color: _nullishCoalesce(colors.fgSelected, () => colors.fg)
+    },
+    // The vivid slice where the variant named one, so the slide *arrives* at the intent
+    // rather than opening on it. Everything else keeps a wash of the same foreground the
+    // label uses, which reads against every pill without a token of its own. Either way a
+    // raw `color` moves the trail, because both roles go through the tint pass.
+    fill: {
+      backgroundColor: _nullishCoalesce(colors.bgSelected, () => colors.fg ? _chunkIIAQISBGcjs.alpha.call(void 0, colors.fg, FILL_ALPHA) : void 0)
+    }
+  }),
+  variants: {
+    size: {
+      sm: sizeAxis(SIZES.sm),
+      md: sizeAxis(SIZES.md),
+      lg: sizeAxis(SIZES.lg)
+    },
+    /** After `size`, so a caller's `radius` wins over the pill's `full`. */
+    radius: _chunkSL3V7R2Ycjs.radiusAxis.call(void 0, "root", "fillClip", "fill")
+  },
+  states: {
+    disabled: theme => ({
+      root: {
+        opacity: theme.opacity.disabled
+      },
+      // The handle also puts its shadow down. Opacity fades the pill until its edges are
+      // most of the way to the page, but it fades the shadow too — and a shadow at half
+      // strength is still the strongest edge left in the picture, sitting a point below a
+      // handle whose own outline has gone. What reads then is not a faded control, it is a
+      // handle pressed into a dent. Nothing about a disabled control should look lifted
+      // anyway, so the lift goes rather than being dimmed with everything else.
+      thumb: NO_SHADOW
+    })
+  },
+  defaultVariants: {
+    variant: "secondary",
+    size: "md"
+  }
+});
+
+// src/components/slide-button/slide-button.tsx
+
+var SlideButtonRoot = _react.forwardRef.call(void 0, function SlideButton({
+  children,
+  variant,
+  size,
+  radius,
+  color,
+  threshold = DEFAULT_THRESHOLD,
+  isConfirmed: controlledConfirmed,
+  defaultConfirmed = false,
+  onConfirm,
+  isDisabled = false,
+  accessibilityRole = "button",
+  accessibilityState,
+  style,
+  onLayout,
+  ...props
+}, ref) {
+  const theme = _chunkIIAQISBGcjs.useXAUITheme.call(void 0);
+  const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+  const [trackLength, setTrackLength] = _react.useState.call(void 0, 0);
+  const offset = _reactnativereanimated.useSharedValue.call(void 0, 0);
+  const reach = Math.min(Math.max(threshold, 0), 1);
+  const [confirmed, setConfirmed] = _chunk7EIHHOHPcjs.useControllableState.call(void 0, {
+    value: controlledConfirmed,
+    defaultValue: defaultConfirmed
+  });
+  const selection = {
+    variant,
+    size,
+    radius
+  };
+  const states = {
+    disabled: isDisabled
+  };
+  const styles = slideButtonRecipe.resolve({
+    theme,
+    selection,
+    states
+  });
+  const tint = color ? slideButtonRecipe.tint({
+    theme,
+    color,
+    selection,
+    states
+  }) : void 0;
+  const thumb = _reactnative.StyleSheet.flatten([styles.thumb]);
+  const thumbSize = typeof thumb.width === "number" ? thumb.width : 0;
+  const inset = typeof thumb.start === "number" ? thumb.start : 0;
+  const travel = Math.max(trackLength - thumbSize - inset * 2, 0);
+  const confirm = _react.useCallback.call(void 0, () => {
+    setConfirmed(true);
+    _optionalChain([onConfirm, 'optionalCall', _ => _()]);
+  }, [onConfirm, setConfirmed]);
+  _react.useEffect.call(void 0, () => {
+    offset.set(_reactnativereanimated.withSpring.call(void 0, confirmed ? travel : 0, THUMB_SPRING));
+  }, [confirmed, travel, offset]);
+  const measure = _react.useCallback.call(void 0, event => {
+    _optionalChain([onLayout, 'optionalCall', _2 => _2(event)]);
+    setTrackLength(event.nativeEvent.layout.width);
+  }, [onLayout]);
+  const context = _react.useMemo.call(void 0, () => {
+    const glyph = _reactnative.StyleSheet.flatten([styles.glyph, _optionalChain([tint, 'optionalAccess', _3 => _3.glyph])]);
+    const labelInset = _reactnative.StyleSheet.flatten([styles.label]).start;
+    const sweptWidth2 = Math.max(trackLength - (typeof labelInset === "number" ? labelInset : 0) * 2, 0);
+    return {
+      fillClipStyle: styles.fillClip,
+      fillStyle: tint ? [styles.fill, tint.fill] : styles.fill,
+      labelStyle: tint ? [styles.label, tint.label] : styles.label,
+      labelSweptStyle: [styles.labelSwept, _optionalChain([tint, 'optionalAccess', _4 => _4.labelSwept]), {
+        width: sweptWidth2
+      }],
+      thumbStyle: styles.thumb,
+      glyphStyle: tint ? [styles.glyph, tint.glyph] : styles.glyph,
+      icon: {
+        size: typeof glyph.width === "number" ? glyph.width : void 0,
+        // The chevron is on the surface-coloured handle, so its colour is the theme's
+        // foreground and not the variant's — `color` (R7) stays on the pill.
+        color: theme.colors.foreground
+      },
+      offset,
+      travel,
+      thumbSize,
+      threshold: reach,
+      isDisabled,
+      isConfirmed: confirmed,
+      confirm,
+      trackLength
+    };
+  }, [styles, tint, theme.colors.foreground, offset, travel, thumbSize, reach, isDisabled, confirmed, confirm, trackLength]);
+  const text = _chunkFHNIGHN5cjs.childrenToString.call(void 0, children);
+  return /* @__PURE__ */_jsxruntime.jsx.call(void 0, SlideButtonProvider, {
+    value: context,
+    children: /* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnative.View, {
+      ref,
+      accessibilityRole,
+      accessibilityState: {
+        disabled: isDisabled,
+        ...accessibilityState
+      },
+      accessibilityActions: [{
+        name: "activate"
+      }],
+      onAccessibilityAction: event => {
+        if (event.nativeEvent.actionName === "activate" && !isDisabled) confirm();
+      },
+      ...rest,
+      onLayout: measure,
+      style: [styles.root, _optionalChain([tint, 'optionalAccess', _5 => _5.root]), styleProps, style],
+      children: text !== null ? /* @__PURE__ */_jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, {
+        children: [/* @__PURE__ */_jsxruntime.jsx.call(void 0, SlideButtonFill, {}), /* @__PURE__ */_jsxruntime.jsx.call(void 0, SlideButtonLabel, {
+          children: text
+        }), /* @__PURE__ */_jsxruntime.jsx.call(void 0, SlideButtonThumb, {})]
+      }) : children
+    })
+  });
+});
+SlideButtonRoot.displayName = "XAUI.SlideButton.Root";
+
+// src/components/slide-button/index.ts
+var SlideButton2 = Object.assign(SlideButtonRoot, {
+  Fill: SlideButtonFill,
+  Label: SlideButtonLabel,
+  Thumb: SlideButtonThumb,
+  Icon: SlideButtonIcon
+});
+exports.useSlideButton = useSlideButton;
+exports.SlideButtonFill = SlideButtonFill;
+exports.SlideButtonIcon = SlideButtonIcon;
+exports.SlideButtonLabel = SlideButtonLabel;
+exports.SlideButtonThumb = SlideButtonThumb;
+exports.slideButtonRecipe = slideButtonRecipe;
+exports.SlideButtonRoot = SlideButtonRoot;
+exports.SlideButton = SlideButton2;