@webority/mobile-ui 0.0.38 → 0.1.0

package/README.md

@@ -10,7 +10,7 @@ npm install @webority/mobile-ui
 
 No external runtime dependencies beyond `@webority/mobile-core`. Requires
 `react-native-gesture-handler`, `react-native-reanimated` and `react-native-safe-area-context` as
-peers; `react-native-haptic-feedback` is optional. Gradients use React Native's own
+peers, and `expo-file-system`, where `AuthedImage` keeps its downloaded images; `react-native-haptic-feedback` is optional. Gradients use React Native's own
 `experimental_backgroundImage`, so no gradient library is needed.
 
 Full documentation lives in the repository's `docs/` directory.

package/lib/commonjs/components/Accordion/Accordion.js

@@ -1,343 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.AccordionGroup = exports.Accordion = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-var _index = require("../../theme/index.js");
-var _corners = require("../../utils/corners.js");
-var _hapticUtils = require("../../utils/hapticUtils.js");
-var _defaultIcons = require("../AppIcon/defaultIcons.js");
-var _index2 = require("../Skeleton/index.js");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-const AccordionGroupContext = /*#__PURE__*/(0, _react.createContext)(null);
-const useAccordionGroup = () => (0, _react.useContext)(AccordionGroupContext);
-const AccordionGroup = ({
-  children,
-  allowMultiple = false,
-  defaultExpandedKeys,
-  expandedKeys: expandedKeysProp,
-  onChange,
-  style,
-  testID
-}) => {
-  const isControlled = expandedKeysProp !== undefined;
-  const [internalKeys, setInternalKeys] = (0, _react.useState)(defaultExpandedKeys ?? []);
-  const keys = isControlled ? expandedKeysProp : internalKeys;
-  const setKeys = (0, _react.useCallback)(next => {
-    if (!isControlled) {
-      setInternalKeys(next);
-    }
-    onChange?.(next);
-  }, [isControlled, onChange]);
-  const toggle = (0, _react.useCallback)(id => {
-    const isOpen = keys.includes(id);
-    let next;
-    if (isOpen) {
-      next = keys.filter(k => k !== id);
-    } else if (allowMultiple) {
-      next = [...keys, id];
-    } else {
-      next = [id];
-    }
-    setKeys(next);
-  }, [keys, allowMultiple, setKeys]);
-  const isExpanded = (0, _react.useCallback)(id => keys.includes(id), [keys]);
-  const ctx = (0, _react.useMemo)(() => ({
-    isExpanded,
-    toggle,
-    allowMultiple
-  }), [isExpanded, toggle, allowMultiple]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(AccordionGroupContext.Provider, {
-    value: ctx,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: style,
-      testID: testID,
-      children: children
-    })
-  });
-};
-exports.AccordionGroup = AccordionGroup;
-AccordionGroup.displayName = 'AccordionGroup';
-
-/** The header's expand indicator: the icon set's line chevron, rotated open. */
-const Chevron = ({
-  rotate,
-  color
-}) => {
-  const theme = (0, _index.useTheme)();
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
-    style: [chevronStyles.icon, {
-      transform: [{
-        rotate
-      }]
-    }],
-    accessible: false,
-    children: (theme.icons?.chevronDown ?? _defaultIcons.defaultIcons.chevronDown)({
-      size: 16,
-      color
-    })
-  });
-};
-const chevronStyles = _reactNative.StyleSheet.create({
-  icon: {
-    width: 16,
-    height: 16,
-    alignItems: 'center',
-    justifyContent: 'center'
-  }
-});
-const Accordion = props => {
-  const {
-    title,
-    children,
-    id,
-    expanded: expandedProp,
-    defaultExpanded = false,
-    onChange,
-    icon,
-    disabled = false,
-    variant = 'plain',
-    accessibilityLabel,
-    style,
-    headerStyle,
-    contentStyle,
-    contentWrapperStyle,
-    containerStyle,
-    testID,
-    loading = false,
-    haptic
-  } = props;
-  const theme = (0, _index.useTheme)();
-  const styles = (0, _react.useMemo)(() => buildStyles(theme), [theme]);
-  const group = useAccordionGroup();
-  const isControlled = expandedProp !== undefined;
-  const [internalExpanded, setInternalExpanded] = (0, _react.useState)(defaultExpanded);
-  const groupExpanded = group && id ? group.isExpanded(id) : null;
-  const expanded = groupExpanded !== null ? groupExpanded : isControlled ? !!expandedProp : internalExpanded;
-  const [measuredHeight, setMeasuredHeight] = (0, _react.useState)(null);
-  const heightAnim = (0, _react.useRef)((0, _index.createAnimatedValue)(expanded ? 1 : 0)).current;
-  const opacityAnim = (0, _react.useRef)((0, _index.createAnimatedValue)(expanded ? 1 : 0)).current;
-  const rotateAnim = (0, _react.useRef)((0, _index.createAnimatedValue)(expanded ? 1 : 0)).current;
-  const lastExpandedRef = (0, _react.useRef)(expanded);
-  (0, _react.useEffect)(() => {
-    // Skip animation when state matches the previous value (e.g. on mount).
-    if (lastExpandedRef.current === expanded) {
-      return;
-    }
-    lastExpandedRef.current = expanded;
-    const anim = _reactNative.Animated.parallel([_reactNative.Animated.timing(heightAnim, {
-      toValue: expanded ? 1 : 0,
-      duration: theme.motion.duration.normal,
-      easing: _reactNative.Easing.bezier(...theme.motion.easing.standard),
-      useNativeDriver: false
-    }),
-    // Opacity & rotate run alongside the height interpolation (which must
-    // use the JS driver). Driving them on JS too keeps everything in lockstep
-    // with no driver-mixing warnings, and is fine for two small properties.
-    _reactNative.Animated.timing(opacityAnim, {
-      toValue: expanded ? 1 : 0,
-      duration: theme.motion.duration.normal,
-      easing: _reactNative.Easing.bezier(...theme.motion.easing.standard),
-      useNativeDriver: false
-    }), _reactNative.Animated.timing(rotateAnim, {
-      toValue: expanded ? 1 : 0,
-      duration: theme.motion.duration.normal,
-      easing: _reactNative.Easing.bezier(...theme.motion.easing.standard),
-      useNativeDriver: false
-    })]);
-    anim.start();
-    return () => anim.stop();
-  }, [expanded, heightAnim, opacityAnim, rotateAnim, theme.motion]);
-  const onContentLayout = (0, _react.useCallback)(e => {
-    const h = e.nativeEvent.layout.height;
-    if (h > 0 && h !== measuredHeight) {
-      setMeasuredHeight(h);
-    }
-  }, [measuredHeight]);
-  const handlePress = (0, _react.useCallback)(() => {
-    if (disabled) {
-      return;
-    }
-    const h = (0, _hapticUtils.resolveHaptic)(haptic, 'selection');
-    if (h) {
-      (0, _hapticUtils.triggerHaptic)(h);
-    }
-    if (group && id) {
-      group.toggle(id);
-      onChange?.(!expanded);
-      return;
-    }
-    if (!isControlled) {
-      setInternalExpanded(!expanded);
-    }
-    onChange?.(!expanded);
-  }, [disabled, group, id, expanded, isControlled, onChange, haptic]);
-  const rotate = rotateAnim.interpolate({
-    inputRange: [0, 1],
-    outputRange: ['0deg', '180deg']
-  });
-  const animatedHeight = measuredHeight === null ? undefined : heightAnim.interpolate({
-    inputRange: [0, 1],
-    outputRange: [0, measuredHeight]
-  });
-  const cardStyle = variant === 'card' ? [styles.card, theme.shadows.sm, {
-    backgroundColor: theme.colors.background.elevated,
-    borderRadius: theme.radius.md,
-    ..._corners.smoothCorners
-  }] : null;
-  if (loading) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(AccordionSkeleton, {
-      ...props
-    });
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: [cardStyle, style, containerStyle],
-    testID: testID,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
-      onPress: handlePress,
-      disabled: disabled,
-      accessibilityRole: "button",
-      accessibilityLabel: accessibilityLabel ?? title,
-      accessibilityState: {
-        expanded,
-        disabled
-      },
-      style: ({
-        pressed
-      }) => [styles.header, headerStyle, {
-        opacity: disabled ? 0.55 : pressed ? 0.85 : 1
-      }],
-      children: [icon ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.iconLeft,
-        children: icon
-      }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: [styles.title, {
-          color: disabled ? theme.colors.text.disabled : theme.colors.text.primary,
-          fontSize: theme.typography.fontSize.base,
-          fontWeight: theme.typography.fontWeight.semibold
-        }],
-        numberOfLines: 2,
-        children: title
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Chevron, {
-        rotate: rotate,
-        color: disabled ? theme.colors.text.disabled : theme.colors.text.secondary
-      })]
-    }), measuredHeight === null ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: styles.measurer,
-      pointerEvents: "none",
-      onLayout: onContentLayout,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: [styles.content, contentStyle],
-        children: children
-      })
-    }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
-      style: [styles.contentWrapper, measuredHeight === null ? {
-        height: 0,
-        opacity: 0
-      } : {
-        height: animatedHeight,
-        opacity: opacityAnim
-      }, contentWrapperStyle]
-      // Re-measure if children change size by listening to layout of inner
-      ,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        onLayout: onContentLayout,
-        style: [styles.content, contentStyle],
-        children: children
-      })
-    })]
-  });
-};
-exports.Accordion = Accordion;
-Accordion.displayName = 'Accordion';
-
-/**
- * Placeholder shape for `<Accordion>`. Header pill with a title-line
- * skeleton; content is collapsed (matches the closed-by-default behaviour).
- */
-const AccordionSkeleton = ({
-  variant = 'plain',
-  style
-}) => {
-  const theme = (0, _index.useTheme)();
-  const isCard = variant === 'card';
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: [isCard ? {
-      paddingHorizontal: theme.spacing.md,
-      paddingVertical: theme.spacing.sm,
-      backgroundColor: theme.colors.background.elevated,
-      borderRadius: theme.radius.md,
-      ..._corners.smoothCorners
-    } : {
-      paddingVertical: theme.spacing.sm
-    }, style],
-    accessibilityRole: "progressbar",
-    accessibilityState: {
-      busy: true
-    },
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: {
-        flexDirection: 'row',
-        alignItems: 'center'
-      },
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.Skeleton, {
-        shape: "text",
-        width: "60%",
-        height: 18,
-        style: {
-          flex: 1
-        }
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.Skeleton, {
-        width: 16,
-        height: 16,
-        radius: "sm",
-        style: {
-          marginLeft: theme.spacing.sm
-        }
-      })]
-    })
-  });
-};
-AccordionSkeleton.displayName = 'AccordionSkeleton';
-Accordion.Skeleton = AccordionSkeleton;
-
-// Suppress unused warnings on platforms that don't support LayoutAnimation
-void _reactNative.LayoutAnimation;
-const buildStyles = theme => _reactNative.StyleSheet.create({
-  card: {
-    paddingHorizontal: theme.spacing.md,
-    paddingVertical: theme.components.accordion?.cardPaddingVertical ?? 4,
-    marginVertical: theme.spacing.xs
-  },
-  header: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    paddingVertical: theme.spacing.sm
-  },
-  iconLeft: {
-    marginRight: theme.spacing.sm
-  },
-  title: {
-    flex: 1
-  },
-  contentWrapper: {
-    overflow: 'hidden'
-  },
-  content: {
-    paddingBottom: theme.spacing.sm
-  },
-  measurer: {
-    position: 'absolute',
-    opacity: 0,
-    left: 0,
-    right: 0,
-    top: 0,
-    zIndex: -1
-  }
-});
-var _default = exports.default = Accordion;
-//# sourceMappingURL=Accordion.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.AccordionGroup=exports.Accordion=void 0;var _react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_defaultIcons=require("../AppIcon/defaultIcons.js"),_index2=require("../Skeleton/index.js"),_jsxRuntime=require("react/jsx-runtime");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,a,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(n=t?r:i){if(n.has(e))return n.get(e);n.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((a=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(a.get||a.set)?n(o,t,a):o[t]=e[t]);return o})(e,t)}const AccordionGroupContext=(0,_react.createContext)(null),useAccordionGroup=()=>(0,_react.useContext)(AccordionGroupContext),AccordionGroup=({children:e,allowMultiple:t=!1,defaultExpandedKeys:i,expandedKeys:r,onChange:n,style:a,testID:o})=>{const c=void 0!==r,[s,l]=(0,_react.useState)(i??[]),d=c?r:s,u=(0,_react.useCallback)(e=>{c||l(e),n?.(e)},[c,n]),p=(0,_react.useCallback)(e=>{let i;i=d.includes(e)?d.filter(t=>t!==e):t?[...d,e]:[e],u(i)},[d,t,u]),_=(0,_react.useCallback)(e=>d.includes(e),[d]),m=(0,_react.useMemo)(()=>({isExpanded:_,toggle:p,allowMultiple:t}),[_,p,t]);return(0,_jsxRuntime.jsx)(AccordionGroupContext.Provider,{value:m,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:a,testID:o,children:e})})};exports.AccordionGroup=AccordionGroup,AccordionGroup.displayName="AccordionGroup";const Chevron=({rotate:e,color:t})=>{const i=(0,_index.useTheme)();return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[chevronStyles.icon,{transform:[{rotate:e}]}],accessible:!1,children:(i.icons?.chevronDown??_defaultIcons.defaultIcons.chevronDown)({size:16,color:t})})},chevronStyles=_reactNative.StyleSheet.create({icon:{width:16,height:16,alignItems:"center",justifyContent:"center"}}),Accordion=e=>{const{title:t,children:i,id:r,expanded:n,defaultExpanded:a=!1,onChange:o,icon:c,disabled:s=!1,variant:l="plain",accessibilityLabel:d,style:u,headerStyle:p,contentStyle:_,contentWrapperStyle:m,containerStyle:x,testID:g,loading:h=!1,haptic:y}=e,v=(0,_index.useTheme)(),f=(0,_react.useMemo)(()=>buildStyles(v),[v]),j=useAccordionGroup(),b=void 0!==n,[A,R]=(0,_react.useState)(a),N=j&&r?j.isExpanded(r):null,S=null!==N?N:b?!!n:A,[w,V]=(0,_react.useState)(null),k=(0,_react.useRef)((0,_index.createAnimatedValue)(S?1:0)).current,C=(0,_react.useRef)((0,_index.createAnimatedValue)(S?1:0)).current,I=(0,_react.useRef)((0,_index.createAnimatedValue)(S?1:0)).current,D=(0,_react.useRef)(S);(0,_react.useEffect)(()=>{if(D.current===S)return;D.current=S;const e=_reactNative.Animated.parallel([_reactNative.Animated.timing(k,{toValue:S?1:0,duration:v.motion.duration.normal,easing:_reactNative.Easing.bezier(...v.motion.easing.standard),useNativeDriver:!1}),_reactNative.Animated.timing(C,{toValue:S?1:0,duration:v.motion.duration.normal,easing:_reactNative.Easing.bezier(...v.motion.easing.standard),useNativeDriver:!1}),_reactNative.Animated.timing(I,{toValue:S?1:0,duration:v.motion.duration.normal,easing:_reactNative.Easing.bezier(...v.motion.easing.standard),useNativeDriver:!1})]);return e.start(),()=>e.stop()},[S,k,C,I,v.motion]);const q=(0,_react.useCallback)(e=>{const t=e.nativeEvent.layout.height;t>0&&t!==w&&V(t)},[w]),G=(0,_react.useCallback)(()=>{if(s)return;const e=(0,_hapticUtils.resolveHaptic)(y,"selection");if(e&&(0,_hapticUtils.triggerHaptic)(e),j&&r)return j.toggle(r),void o?.(!S);b||R(!S),o?.(!S)},[s,j,r,S,b,o,y]),W=I.interpolate({inputRange:[0,1],outputRange:["0deg","180deg"]}),E=null===w?void 0:k.interpolate({inputRange:[0,1],outputRange:[0,w]}),z="card"===l?[f.card,v.shadows.sm,{backgroundColor:v.colors.background.elevated,borderRadius:v.radius.md,..._corners.smoothCorners}]:null;return h?(0,_jsxRuntime.jsx)(AccordionSkeleton,{...e}):(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[z,u,x],testID:g,children:[(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:G,disabled:s,accessibilityRole:"button",accessibilityLabel:d??t,accessibilityState:{expanded:S,disabled:s},style:({pressed:e})=>[f.header,p,{opacity:s?.55:e?.85:1}],children:[c?(0,_jsxRuntime.jsx)(_reactNative.View,{style:f.iconLeft,children:c}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[f.title,{color:s?v.colors.text.disabled:v.colors.text.primary,fontSize:v.typography.fontSize.base,fontWeight:v.typography.fontWeight.semibold}],numberOfLines:2,children:t}),(0,_jsxRuntime.jsx)(Chevron,{rotate:W,color:s?v.colors.text.disabled:v.colors.text.secondary})]}),null===w?(0,_jsxRuntime.jsx)(_reactNative.View,{style:f.measurer,pointerEvents:"none",onLayout:q,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[f.content,_],children:i})}):null,(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[f.contentWrapper,null===w?{height:0,opacity:0}:{height:E,opacity:C},m],children:(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:q,style:[f.content,_],children:i})})]})};exports.Accordion=Accordion,Accordion.displayName="Accordion";const AccordionSkeleton=({variant:e="plain",style:t})=>{const i=(0,_index.useTheme)(),r="card"===e;return(0,_jsxRuntime.jsx)(_reactNative.View,{style:[r?{paddingHorizontal:i.spacing.md,paddingVertical:i.spacing.sm,backgroundColor:i.colors.background.elevated,borderRadius:i.radius.md,..._corners.smoothCorners}:{paddingVertical:i.spacing.sm},t],accessibilityRole:"progressbar",accessibilityState:{busy:!0},children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:{flexDirection:"row",alignItems:"center"},children:[(0,_jsxRuntime.jsx)(_index2.Skeleton,{shape:"text",width:"60%",height:18,style:{flex:1}}),(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:16,height:16,radius:"sm",style:{marginLeft:i.spacing.sm}})]})})};AccordionSkeleton.displayName="AccordionSkeleton",Accordion.Skeleton=AccordionSkeleton,_reactNative.LayoutAnimation;const buildStyles=e=>_reactNative.StyleSheet.create({card:{paddingHorizontal:e.spacing.md,paddingVertical:e.components.accordion?.cardPaddingVertical??4,marginVertical:e.spacing.xs},header:{flexDirection:"row",alignItems:"center",paddingVertical:e.spacing.sm},iconLeft:{marginRight:e.spacing.sm},title:{flex:1},contentWrapper:{overflow:"hidden"},content:{paddingBottom:e.spacing.sm},measurer:{position:"absolute",opacity:0,left:0,right:0,top:0,zIndex:-1}});var _default=exports.default=Accordion;

package/lib/commonjs/components/Accordion/index.js

@@ -1,26 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Accordion", {
-  enumerable: true,
-  get: function () {
-    return _Accordion.Accordion;
-  }
-});
-Object.defineProperty(exports, "AccordionGroup", {
-  enumerable: true,
-  get: function () {
-    return _Accordion.AccordionGroup;
-  }
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function () {
-    return _Accordion.default;
-  }
-});
-var _Accordion = _interopRequireWildcard(require("./Accordion.js"));
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-//# sourceMappingURL=index.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Accordion",{enumerable:!0,get:function(){return _Accordion.Accordion}}),Object.defineProperty(exports,"AccordionGroup",{enumerable:!0,get:function(){return _Accordion.AccordionGroup}}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return _Accordion.default}});var _Accordion=_interopRequireWildcard(require("./Accordion.js"));function _interopRequireWildcard(e,r){if("function"==typeof WeakMap)var t=new WeakMap,o=new WeakMap;return(_interopRequireWildcard=function(e,r){if(!r&&e&&e.__esModule)return e;var n,c,i={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return i;if(n=r?o:t){if(n.has(e))return n.get(e);n.set(e,i)}for(const r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((c=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,r))&&(c.get||c.set)?n(i,r,c):i[r]=e[r]);return i})(e,r)}

package/lib/commonjs/components/AmountSlider/AmountSlider.js

@@ -1,209 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.scaleAmount = exports.default = exports.AmountSlider = void 0;
-var _mobileCore = require("@webority/mobile-core");
-var _react = require("react");
-var _reactNative = require("react-native");
-var _index = require("../../hooks/index.js");
-var _index2 = require("../../theme/index.js");
-var _index3 = require("../Input/index.js");
-var _index4 = require("../Slider/index.js");
-var _valueText = require("../Slider/valueText.js");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * How the big value is scaled for reading.
- *
- * - `indian`: Thousand, Lakh and Crore (`₹ 5 Lakh`, `₹ 1.25 Crore`).
- * - `none`: the whole number with Indian digit grouping (`₹ 5,00,000`).
- */
-
-const INDIAN_TIERS = [[1e7, 'Crore'], [1e5, 'Lakh'], [1e3, 'Thousand']];
-
-/** Splits a value into the number and unit the header shows. */
-const scaleAmount = (value, units) => {
-  if (units === 'indian') {
-    const abs = Math.abs(value);
-    for (const [size, unit] of INDIAN_TIERS) {
-      if (abs >= size) {
-        return {
-          amount: value / size,
-          unit
-        };
-      }
-    }
-  }
-  return {
-    amount: value,
-    unit: ''
-  };
-};
-
-/**
- * The header number: at most two decimals with trailing zeros dropped when
- * scaled (`1.25`, `5`), Indian grouping when not (`5,00,000`).
- */
-exports.scaleAmount = scaleAmount;
-const formatAmount = (amount, scaled) => {
-  const rounded = Math.round(amount * 100) / 100;
-  if (scaled) {
-    return String(rounded);
-  }
-  return (0, _mobileCore.formatCurrency)(Math.round(amount), {
-    stripSymbol: true,
-    maximumFractionDigits: 0
-  });
-};
-const defaultFormatInput = value => (0, _mobileCore.formatCurrency)(value, {
-  maximumFractionDigits: 0
-});
-const AmountSlider = exports.AmountSlider = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
-  const {
-    min = 0,
-    max = 100,
-    step = 1,
-    disabled = false,
-    tone,
-    size,
-    variant = 'inset',
-    prefix = '₹',
-    units = 'indian',
-    formatInput = defaultFormatInput,
-    animationDuration,
-    haptic,
-    accessibilityLabel,
-    inputAccessibilityLabel = 'Amount',
-    style,
-    headerStyle,
-    valueStyle,
-    unitStyle,
-    inputStyle,
-    sliderStyle,
-    testID
-  } = props;
-  const theme = (0, _index2.useTheme)();
-  const styles = (0, _react.useMemo)(() => buildStyles(theme), [theme]);
-  const duration = animationDuration ?? theme.motion.duration.normal;
-  const [value, setValue] = (0, _index.useControllableState)({
-    value: props.value,
-    defaultValue: props.defaultValue ?? min,
-    onChange: props.onChange
-  });
-  const shownValue = (0, _valueText.clampValue)(value, min, max);
-  const box = (0, _valueText.useValueDraft)({
-    value: shownValue,
-    min,
-    max,
-    step,
-    format: formatInput,
-    onChange: setValue
-  });
-  const scaled = scaleAmount(shownValue, units);
-  const isScaled = scaled.unit !== '';
-  // Digits roll upward while the value grows and downward while it shrinks,
-  // the way a counter's do. The last value decides the direction for both
-  // the number and the unit word.
-  const lastValueRef = (0, _react.useRef)(shownValue);
-  const directionRef = (0, _react.useRef)('up');
-  if (shownValue !== lastValueRef.current) {
-    directionRef.current = shownValue > lastValueRef.current ? 'up' : 'down';
-    lastValueRef.current = shownValue;
-  }
-  const direction = directionRef.current;
-  const spoken = `${prefix}${formatAmount(scaled.amount, isScaled)}${isScaled ? ` ${scaled.unit}` : ''}`;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    ref: ref,
-    style: [styles.container, style],
-    testID: testID,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: [styles.header, headerStyle],
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.valueRow,
-        accessible: true,
-        accessibilityRole: "text",
-        accessibilityLabel: spoken,
-        children: [prefix ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
-          style: [styles.value, valueStyle],
-          children: [prefix, " "]
-        }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_valueText.RollingText, {
-          text: formatAmount(scaled.amount, isScaled),
-          direction: direction,
-          duration: duration,
-          style: [styles.value, valueStyle],
-          testID: testID ? `${testID}-value` : undefined
-        }), isScaled ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_valueText.RollingText, {
-          text: ` ${scaled.unit}`,
-          direction: direction,
-          duration: duration,
-          perCharacter: false,
-          style: [styles.unit, unitStyle],
-          testID: testID ? `${testID}-unit` : undefined
-        }) : null]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index3.Input, {
-        size: "sm",
-        value: box.text,
-        onChangeText: box.onChangeText,
-        onFocus: box.onFocus,
-        onBlur: box.onBlur,
-        onSubmitEditing: box.onBlur,
-        keyboardType: "number-pad",
-        returnKeyType: "done",
-        disabled: disabled,
-        accessibilityLabel: inputAccessibilityLabel,
-        style: [styles.input, inputStyle],
-        testID: testID ? `${testID}-input` : undefined
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.Slider, {
-      value: shownValue,
-      onChange: setValue,
-      min: min,
-      max: max,
-      step: step,
-      disabled: disabled,
-      tone: tone,
-      size: size,
-      variant: variant,
-      haptic: haptic,
-      accessibilityLabel: accessibilityLabel,
-      style: sliderStyle,
-      testID: testID ? `${testID}-slider` : undefined
-    })]
-  });
-});
-AmountSlider.displayName = 'AmountSlider';
-const buildStyles = theme => _reactNative.StyleSheet.create({
-  container: {
-    width: '100%'
-  },
-  header: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    gap: theme.spacing.md
-  },
-  valueRow: {
-    flexDirection: 'row',
-    alignItems: 'baseline',
-    flexShrink: 1
-  },
-  value: {
-    color: theme.colors.text.primary,
-    fontSize: theme.typography.fontSize['3xl'],
-    fontWeight: theme.typography.fontWeight.bold,
-    // Equal-width digits keep the unit from jittering sideways as the number counts.
-    fontVariant: ['tabular-nums']
-  },
-  unit: {
-    color: theme.colors.text.primary,
-    fontSize: theme.typography.fontSize.lg,
-    fontWeight: theme.typography.fontWeight.semibold
-  },
-  input: {
-    width: '45%',
-    maxWidth: 180
-  }
-});
-var _default = exports.default = AmountSlider;
-//# sourceMappingURL=AmountSlider.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.scaleAmount=exports.default=exports.AmountSlider=void 0;var _mobileCore=require("@webority/mobile-core"),_react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../Input/index.js"),_index4=require("../Slider/index.js"),_valueText=require("../Slider/valueText.js"),_jsxRuntime=require("react/jsx-runtime");const INDIAN_TIERS=[[1e7,"Crore"],[1e5,"Lakh"],[1e3,"Thousand"]],scaleAmount=(e,t)=>{if("indian"===t){const t=Math.abs(e);for(const[i,n]of INDIAN_TIERS)if(t>=i)return{amount:e/i,unit:n}}return{amount:e,unit:""}};exports.scaleAmount=scaleAmount;const formatAmount=(e,t)=>{const i=Math.round(100*e)/100;return t?String(i):(0,_mobileCore.formatCurrency)(Math.round(e),{stripSymbol:!0,maximumFractionDigits:0})},defaultFormatInput=e=>(0,_mobileCore.formatCurrency)(e,{maximumFractionDigits:0}),AmountSlider=exports.AmountSlider=(0,_react.forwardRef)((e,t)=>{const{min:i=0,max:n=100,step:r=1,disabled:a=!1,tone:o,size:u,variant:l="inset",prefix:s="₹",units:c="indian",formatInput:d=defaultFormatInput,animationDuration:m,haptic:x,accessibilityLabel:p,inputAccessibilityLabel:y="Amount",style:_,headerStyle:f,valueStyle:h,unitStyle:v,inputStyle:b,sliderStyle:S,testID:g}=e,j=(0,_index2.useTheme)(),I=(0,_react.useMemo)(()=>buildStyles(j),[j]),R=m??j.motion.duration.normal,[A,T]=(0,_index.useControllableState)({value:e.value,defaultValue:e.defaultValue??i,onChange:e.onChange}),C=(0,_valueText.clampValue)(A,i,n),D=(0,_valueText.useValueDraft)({value:C,min:i,max:n,step:r,format:d,onChange:T}),w=scaleAmount(C,c),N=""!==w.unit,q=(0,_react.useRef)(C),$=(0,_react.useRef)("up");C!==q.current&&($.current=C>q.current?"up":"down",q.current=C);const V=$.current,z=`${s}${formatAmount(w.amount,N)}${N?` ${w.unit}`:""}`;return(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,style:[I.container,_],testID:g,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[I.header,f],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:I.valueRow,accessible:!0,accessibilityRole:"text",accessibilityLabel:z,children:[s?(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:[I.value,h],children:[s," "]}):null,(0,_jsxRuntime.jsx)(_valueText.RollingText,{text:formatAmount(w.amount,N),direction:V,duration:R,style:[I.value,h],testID:g?`${g}-value`:void 0}),N?(0,_jsxRuntime.jsx)(_valueText.RollingText,{text:` ${w.unit}`,direction:V,duration:R,perCharacter:!1,style:[I.unit,v],testID:g?`${g}-unit`:void 0}):null]}),(0,_jsxRuntime.jsx)(_index3.Input,{size:"sm",value:D.text,onChangeText:D.onChangeText,onFocus:D.onFocus,onBlur:D.onBlur,onSubmitEditing:D.onBlur,keyboardType:"number-pad",returnKeyType:"done",disabled:a,accessibilityLabel:y,style:[I.input,b],testID:g?`${g}-input`:void 0})]}),(0,_jsxRuntime.jsx)(_index4.Slider,{value:C,onChange:T,min:i,max:n,step:r,disabled:a,tone:o,size:u,variant:l,haptic:x,accessibilityLabel:p,style:S,testID:g?`${g}-slider`:void 0})]})});AmountSlider.displayName="AmountSlider";const buildStyles=e=>_reactNative.StyleSheet.create({container:{width:"100%"},header:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:e.spacing.md},valueRow:{flexDirection:"row",alignItems:"baseline",flexShrink:1},value:{color:e.colors.text.primary,fontSize:e.typography.fontSize["3xl"],fontWeight:e.typography.fontWeight.bold,fontVariant:["tabular-nums"]},unit:{color:e.colors.text.primary,fontSize:e.typography.fontSize.lg,fontWeight:e.typography.fontWeight.semibold},input:{width:"45%",maxWidth:180}});var _default=exports.default=AmountSlider;

package/lib/commonjs/components/AmountSlider/index.js

@@ -1,20 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "AmountSlider", {
-  enumerable: true,
-  get: function () {
-    return _AmountSlider.AmountSlider;
-  }
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function () {
-    return _AmountSlider.default;
-  }
-});
-var _AmountSlider = _interopRequireWildcard(require("./AmountSlider.js"));
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-//# sourceMappingURL=index.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"AmountSlider",{enumerable:!0,get:function(){return _AmountSlider.AmountSlider}}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return _AmountSlider.default}});var _AmountSlider=_interopRequireWildcard(require("./AmountSlider.js"));function _interopRequireWildcard(e,r){if("function"==typeof WeakMap)var t=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,r){if(!r&&e&&e.__esModule)return e;var o,u,i={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return i;if(o=r?n:t){if(o.has(e))return o.get(e);o.set(e,i)}for(const r in e)"default"!==r&&{}.hasOwnProperty.call(e,r)&&((u=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,r))&&(u.get||u.set)?o(i,r,u):i[r]=e[r]);return i})(e,r)}