npm - @webority/mobile-ui - Versions diffs - 0.88.1 → 0.90.0 - Mend

@webority/mobile-ui 0.88.1 → 0.90.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (396) hide show

package/lib/module/components/WheelPicker/WheelPicker.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{Fragment,useCallback,useMemo}from"react";import{StyleSheet,Text,useWindowDimensions,View}from"react-native";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{useTheme}from"../../theme/index.js";import{Chip}from"../Chip/index.js";import{WHEEL_CENTER_OFFSET,WHEEL_VISIBLE_ITEMS,Wheel}from"./Wheel.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const BASE_ITEM_HEIGHT=40,MAX_FONT_SCALE=1.5,DEFAULT_COLUMN_WIDTH=64,MAX_DURATION_MINUTES=1439,range=(e,t,i=1)=>{const o=[];for(let s=e;s<=t;s+=i)o.push(s);return o},plural=(e,t,i)=>`${e} ${1===e?t:i}`,formatPreset=(e,t,i)=>{const o=Math.floor(e/60),s=e%60;return 0===o?`${s} ${i}`:0===s?`${o} ${t}`:`${o} ${t} ${s} ${i}`},toItem=e=>"object"==typeof e?e:{value:e,label:String(e)},WheelPicker=e=>{const{haptic:t,disabled:i,testID:o,style:s}=e,n=useTheme(),r=useReducedMotion(),{fontScale:a}=useWindowDimensions(),l=Math.min(Math.max(a,1),1.5),u=Math.round(40l),m=useMemo(()=>buildStyles(n,u),[n,u]),d="list"===e.mode?e.items:void 0,h=useMemo(()=>d?.map(toItem),[d]),c="duration"===e.mode?e.minuteStep??1:1,p="duration"===e.mode?Math.max(0,Math.min(1439,Math.floor(e.maxMinutes??1/0))):0,f=Math.floor(p/60),b="duration"===e.mode?e.labels:void 0,x=b?.hours??"Hours",g=b?.minutes??"Minutes",y=b?.hourUnit??"hr",M=b?.minuteUnit??"min",_="duration"===e.mode?e.presets:void 0;for(const e of _??[])if(!Number.isInteger(e)\|\|e<0\|\|e>p\|\|e%c!==0)throw new Error(`WheelPicker preset ${e} must be a whole number of minutes from 0 to ${p} in steps of ${c}.`);const S=useCallback(e=>{const t=e===f?p%60:59;return Math.floor(t/c)c},[f,p,c]),E="duration"===e.mode?e.value:0,j=useMemo(()=>{const e=Number.isFinite(E)?E:0,t=Math.max(0,Math.min(p,e)),i=Math.floor(t/60),o=Math.round(t%60/c)c;return{hour:i,minute:Math.min(S(i),o)}},[E,p,c,S]),w=useMemo(()=>"duration"===e.mode?range(0,f).map(e=>({value:e,label:String(e),accessibilityLabel:plural(e,"hour","hours")})):[],[e.mode,f]),I=S(j.hour),v=useMemo(()=>"duration"===e.mode?range(0,I,c).map(e=>({value:e,label:String(e).padStart(2,"0"),accessibilityLabel:plural(e,"minute","minutes")})):[],[e.mode,I,c]),W=useMemo(()=>"list"===e.mode?[{key:"list",label:e.label??"Value",items:h??[],value:e.value??"",width:e.width}]:"duration"===e.mode?[{key:"hours",label:x,items:w,value:j.hour,unit:y,gapAfter:n.~~spacing~~.md},{key:"minutes",label:g,items:v,value:j.minute,unit:M}]:e.columns,[e,h,w,v,j,x,g,y,M,n.~~spacing~~.md]),{onChange:T}=e,C=useCallback((t,i)=>{const o=t.items[i];if(o&&T)if("list"===e.mode)T(o.value);else if("duration"===e.mode){const e=Number(o.value),i=T;"hours"===t.key?i(60e+Math.min(j.minute,S(e))):i(60j.hour+e)}else T(t.key,o.value)},[T,e.mode,j,S]),k=useCallback(e=>{T?.(e)},[T]),L=60j.hour+j.minute,F=_jsxs(View,{style:[m.wheels,s],testID:o,children:[_jsxs(View,{pointerEvents:"none",style:m.selectionBand,children:[_jsx(View,{style:m.bandLine}),_jsx(View,{style:m.bandLine})]}),W.map(o=>{if(0===o.items.length)return null;const s=o.items.findIndex(e=>e.value===o.value);return _jsxs(Fragment,{children:[_jsx(Wheel,{label:o.label,items:o.items,selectedIndex:Math.max(0,s),onIndexChange:e=>C(o,e),itemHeight:u,width:o.width??("list"===e.mode?void 0:64),theme:n,haptic:t,disabled:i,reducedMotion:r,typeable:"duration"===e.mode,testID:o.testID}),o.unit?_jsx(Text,{style:m.unit,maxFontSizeMultiplier:1.5,numberOfLines:1,accessible:!1,importantForAccessibility:"no","aria-hidden":!0,children:o.unit}):null,o.separator?_jsx(Text,{style:m.separator,maxFontSizeMultiplier:1.5,accessible:!1,importantForAccessibility:"no","aria-hidden":!0,children:o.separator}):null,o.gapAfter?_jsx(View,{style:{width:o.gapAfter}}):null]},o.key)})]});return _&&0!==_.length?_jsxs(View,{children:[F,_jsx(View,{style:m.presets,children:_.map(e=>_jsx(Chip,{label:formatPreset(e,y,M),size:"sm",selected:e===L,disabled:i,onPress:()=>k(e)},e))})]}):F},buildStyles=(e,t)=>StyleSheet.create({wheels:{flexDirection:"row",alignItems:"center",justifyContent:"center",height:tWHEEL_VISIBLE_ITEMS,position:"relative"},selectionBand:{position:"absolute",left:0,right:0,top:tWHEEL_CENTER_OFFSET,height:t,justifyContent:"space-between"},bandLine:{height:2*StyleSheet.hairlineWidth,backgroundColor:e.colors.primary,opacity:.85},separator:{fontSize:e.~~typography.fontSize~~["2xl"],fontWeight:e.~~typography~~.~~fontWeight.~~bold,color:e.colors.text~~.primary~~,paddingHorizontal:e.~~spacing~~.xs},unit:{fontSize:e.~~typography~~.~~fontSize~~.~~base~~,fontWeight:e.~~typography~~.~~fontWeight.~~semibold,color:e.colors.text~~.secondary~~,paddingLeft:e.~~spacing~~.xs},presets:{flexDirection:"row",flexWrap:"wrap",justifyContent:"center",gap:e.~~spacing~~.xs,paddingTop:e.~~spacing~~.sm}});export{WheelPicker};export default WheelPicker;
1	+ "use strict";import{Fragment,useCallback,useMemo}from"react";import{StyleSheet,Text,useWindowDimensions,View}from"react-native";import{useReducedMotion}from"../../hooks/useReducedMotion.js";import{useTheme}from"../../theme/index.js";import{Chip}from"../Chip/index.js";import{WHEEL_CENTER_OFFSET,WHEEL_VISIBLE_ITEMS,Wheel}from"./Wheel.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const BASE_ITEM_HEIGHT=40,MAX_FONT_SCALE=1.5,DEFAULT_COLUMN_WIDTH=64,MAX_DURATION_MINUTES=1439,range=(e,t,i=1)=>{const s=[];for(let o=e;o<=t;o+=i)s.push(o);return s},plural=(e,t,i)=>`${e} ${1===e?t:i}`,formatPreset=(e,t,i)=>{const s=Math.floor(e/60),o=e%60;return 0===s?`${o} ${i}`:0===o?`${s} ${t}`:`${s} ${t} ${o} ${i}`},toItem=e=>"object"==typeof e?e:{value:e,label:String(e)},WheelPicker=e=>{const{haptic:t,disabled:i,testID:s,style:o}=e,n=useTheme(),r=useReducedMotion(),{fontScale:a}=useWindowDimensions(),l=Math.min(Math.max(a,1),1.5),u=Math.round(40l),m=useMemo(()=>buildStyles(n,u),[n,u]),d="list"===e.mode?e.items:void 0,h=useMemo(()=>d?.map(toItem),[d]),c="duration"===e.mode?e.minuteStep??1:1,p="duration"===e.mode?Math.max(0,Math.min(1439,Math.floor(e.maxMinutes??1/0))):0,b=Math.floor(p/60),f="duration"===e.mode?e.labels:void 0,x=f?.hours??"Hours",M=f?.minutes??"Minutes",y=f?.hourUnit??"hr",g=f?.minuteUnit??"min",_="duration"===e.mode?e.presets:void 0;for(const e of _??[])if(!Number.isInteger(e)\|\|e<0\|\|e>p\|\|e%c!==0)throw new Error(`WheelPicker preset ${e} must be a whole number of minutes from 0 to ${p} in steps of ${c}.`);const S=useCallback(e=>{const t=e===b?p%60:59;return Math.floor(t/c)c},[b,p,c]),w="duration"===e.mode?e.value:0,E=useMemo(()=>{const e=Number.isFinite(w)?w:0,t=Math.max(0,Math.min(p,e)),i=Math.floor(t/60),s=Math.round(t%60/c)c;return{hour:i,minute:Math.min(S(i),s)}},[w,p,c,S]),j=useMemo(()=>"duration"===e.mode?range(0,b).map(e=>({value:e,label:String(e),accessibilityLabel:plural(e,"hour","hours")})):[],[e.mode,b]),I=S(E.hour),v=useMemo(()=>"duration"===e.mode?range(0,I,c).map(e=>({value:e,label:String(e).padStart(2,"0"),accessibilityLabel:plural(e,"minute","minutes")})):[],[e.mode,I,c]),T=useMemo(()=>"list"===e.mode?[{key:"list",label:e.label??"Value",items:h??[],value:e.value??"",width:e.width}]:"duration"===e.mode?[{key:"hours",label:x,items:j,value:E.hour,unit:y,gapAfter:n.space.md},{key:"minutes",label:M,items:v,value:E.minute,unit:g}]:e.columns,[e,h,j,v,E,x,M,y,g,n.space.md]),{onChange:W}=e,C=useCallback((t,i)=>{const s=t.items[i];if(s&&W)if("list"===e.mode)W(s.value);else if("duration"===e.mode){const e=Number(s.value),i=W;"hours"===t.key?i(60e+Math.min(E.minute,S(e))):i(60E.hour+e)}else W(t.key,s.value)},[W,e.mode,E,S]),k=useCallback(e=>{W?.(e)},[W]),L=60E.hour+E.minute,F=_jsxs(View,{style:[m.wheels,o],testID:s,children:[_jsxs(View,{pointerEvents:"none",style:m.selectionBand,children:[_jsx(View,{style:m.bandLine}),_jsx(View,{style:m.bandLine})]}),T.map(s=>{if(0===s.items.length)return null;const o=s.items.findIndex(e=>e.value===s.value);return _jsxs(Fragment,{children:[_jsx(Wheel,{label:s.label,items:s.items,selectedIndex:Math.max(0,o),onIndexChange:e=>C(s,e),itemHeight:u,width:s.width??("list"===e.mode?void 0:64),theme:n,haptic:t,disabled:i,reducedMotion:r,typeable:"duration"===e.mode,testID:s.testID}),s.unit?_jsx(Text,{style:m.unit,maxFontSizeMultiplier:1.5,numberOfLines:1,accessible:!1,importantForAccessibility:"no","aria-hidden":!0,children:s.unit}):null,s.separator?_jsx(Text,{style:m.separator,maxFontSizeMultiplier:1.5,accessible:!1,importantForAccessibility:"no","aria-hidden":!0,children:s.separator}):null,s.gapAfter?_jsx(View,{style:{width:s.gapAfter}}):null]},s.key)})]});return _&&0!==_.length?_jsxs(View,{children:[F,_jsx(View,{style:m.presets,children:_.map(e=>_jsx(Chip,{label:formatPreset(e,y,g),size:"sm",selected:e===L,disabled:i,onPress:()=>k(e)},e))})]}):F},buildStyles=(e,t)=>StyleSheet.create({wheels:{flexDirection:"row",alignItems:"center",justifyContent:"center",height:tWHEEL_VISIBLE_ITEMS,position:"relative"},selectionBand:{position:"absolute",left:0,right:0,top:tWHEEL_CENTER_OFFSET,height:t,justifyContent:"space-between"},bandLine:{height:2*StyleSheet.hairlineWidth,backgroundColor:e.colors.primary,opacity:.85},separator:{fontSize:e.text["2xl"].size,fontWeight:e.weight.bold,color:e.colors["text-body"],paddingHorizontal:e.space.xs},unit:{fontSize:e.text.base.size,fontWeight:e.weight.semibold,color:e.colors["text-muted"],paddingLeft:e.space.xs},presets:{flexDirection:"row",flexWrap:"wrap",justifyContent:"center",gap:e.space.xs,paddingTop:e.space.sm}});export{WheelPicker};export default WheelPicker;

package/lib/module/hooks/useDragToDismiss.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{useMemo,useRef}from"react";import{Animated,Easing}from"react-native";import{Gesture}from"react-native-gesture-handler";import{createAnimatedValue,setNativeValue,useTheme}from"../theme/index.js";import{usePresenceMotion}from"./usePresenceMotion.js";export const DRAG_DISMISS_DISTANCE=100;export const DRAG_DISMISS_VELOCITY=.5;export const createDragToDismissController=({drag:e,travel:t,onDismiss:a,opacity:n},s,r)=>{const{snappy:i}=s.spring,springBack=()=>Animated.spring(e,{toValue:0,damping:i.damping,stiffness:i.stiffness,mass:i.mass,useNativeDriver:!0}).start(),o=!0===r?.reduced?n:void 0,u=r?.duration("~~normal~~")??s.duration.~~normal~~;return{move:t=>{setNativeValue(e,Math.max(0,t))},release:(n,r)=>{if(n>100\|\|r>.5){if(o)return void Animated.timing(o,{toValue:0,duration:u,easing:Easing.bezier(...s.~~easing~~.accelerate),useNativeDriver:!0}).start(()=>a());Animated.timing(e,{toValue:"function"==typeof t?t():t,duration:s.duration.fast,easing:Easing.bezier(...s.~~easing~~.accelerate),useNativeDriver:!0}).start(()=>a())}else springBack()},cancel:springBack}};export const useDragToDismiss=e=>{const{drag:t,travel:a,onDismiss:n,contentAtTop:s,scrollGesture:r}=e,{motion:i}=useTheme(),o=usePresenceMotion(),u=useRef(createAnimatedValue(1)).current;return useMemo(()=>{const e=createDragToDismissController({drag:t,travel:a,onDismiss:n,opacity:u},i,o),l=Gesture.Pan().runOnJS(!0).activeOffsetY(6).failOffsetX([-12,12]).onUpdate(t=>e.move(t.translationY)).onEnd(t=>e.release(t.translationY,t.velocityY/1e3)).onFinalize((_e,t)=>{t\|\|e.cancel()});let c=0,m=!1;const f=Gesture.Pan().runOnJS(!0).activeOffsetY(8).failOffsetX([-12,12]).onBegin(()=>{c=0,m=!1}).onUpdate(t=>{if(!m){if(s&&!s())return;m=!0,c=t.translationY}e.move(t.translationY-c)}).onEnd(t=>{m&&e.release(t.translationY-c,t.velocityY/1e3)}).onFinalize((_e,t)=>{!t&&m&&e.cancel()});return r&&f.simultaneousWithExternalGesture(r),{handleGesture:l,sheetGesture:f,opacity:u}},[t,a,n,s,r,i,o,u])};
1	+ "use strict";import{useMemo,useRef}from"react";import{Animated,Easing}from"react-native";import{Gesture}from"react-native-gesture-handler";import{createAnimatedValue,setNativeValue,useTheme}from"../theme/index.js";import{usePresenceMotion}from"./usePresenceMotion.js";export const DRAG_DISMISS_DISTANCE=100;export const DRAG_DISMISS_VELOCITY=.5;export const createDragToDismissController=({drag:e,travel:t,onDismiss:a,opacity:s},n,r)=>{const{snappy:i}=n.spring,springBack=()=>Animated.spring(e,{toValue:0,damping:i.damping,stiffness:i.stiffness,mass:i.mass,useNativeDriver:!0}).start(),o=!0===r?.reduced?s:void 0,u=r?.duration("default")??n.duration.default;return{move:t=>{setNativeValue(e,Math.max(0,t))},release:(s,r)=>{if(s>100\|\|r>.5){if(o)return void Animated.timing(o,{toValue:0,duration:u,easing:Easing.bezier(...n.ease.accelerate),useNativeDriver:!0}).start(()=>a());Animated.timing(e,{toValue:"function"==typeof t?t():t,duration:n.duration.fast,easing:Easing.bezier(...n.ease.accelerate),useNativeDriver:!0}).start(()=>a())}else springBack()},cancel:springBack}};export const useDragToDismiss=e=>{const{drag:t,travel:a,onDismiss:s,contentAtTop:n,scrollGesture:r}=e,{motion:i}=useTheme(),o=usePresenceMotion(),u=useRef(createAnimatedValue(1)).current;return useMemo(()=>{const e=createDragToDismissController({drag:t,travel:a,onDismiss:s,opacity:u},i,o),l=Gesture.Pan().runOnJS(!0).activeOffsetY(6).failOffsetX([-12,12]).onUpdate(t=>e.move(t.translationY)).onEnd(t=>e.release(t.translationY,t.velocityY/1e3)).onFinalize((_e,t)=>{t\|\|e.cancel()});let c=0,m=!1;const f=Gesture.Pan().runOnJS(!0).activeOffsetY(8).failOffsetX([-12,12]).onBegin(()=>{c=0,m=!1}).onUpdate(t=>{if(!m){if(n&&!n())return;m=!0,c=t.translationY}e.move(t.translationY-c)}).onEnd(t=>{m&&e.release(t.translationY-c,t.velocityY/1e3)}).onFinalize((_e,t)=>{!t&&m&&e.cancel()});return r&&f.simultaneousWithExternalGesture(r),{handleGesture:l,sheetGesture:f,opacity:u}},[t,a,s,n,r,i,o,u])};

package/lib/module/hooks/usePressAnimation.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{useCallback,useMemo,useRef}from"react";import{Easing,Animated as RNAnimated}from"react-native";import{useTheme}from"../theme/index.js";import{createAnimatedValue}from"../theme/animatedValue.js";import{usePresenceMotion}from"./usePresenceMotion.js";export const PRESS_ANIMATION_PRESETS=["scale","bounce","fade","sink","pulse"];const FADE_TO=.6,SINK_BY=2,PULSE_TO=1.05,DEFAULT_SCALE_TO={scale:.97,bounce:.92,fade:1,sink:1,pulse:1};export const usePressAnimation=({preset:e="scale",scaleTo:a,pressDuration:s,enabled:t=!0}={})=>{const n=useTheme(),i=usePresenceMotion(),r=useRef(createAnimatedValue(1)).current,o=useRef(createAnimatedValue(1)).current,c=useRef(createAnimatedValue(0)).current,u=i.reduced?"fade":e,m=a??DEFAULT_SCALE_TO[u],l=s??i.duration("fast"),d=useCallback((e,a,s)=>RNAnimated.timing(e,{toValue:a,duration:l,easing:Easing.bezier(...s),useNativeDriver:!0}),[l]),p=useCallback((e,a,s)=>RNAnimated.spring(e,{toValue:a,damping:n.motion.spring[s].damping,stiffness:n.motion.spring[s].stiffness,mass:n.motion.spring[s].mass,useNativeDriver:!0}),[n]),f=useCallback(()=>{if(t)switch(u){case"scale":case"bounce":d(r,m,n.motion.~~easing.standard~~).start();break;case"fade":d(o,.6,n.motion.~~easing.standard~~).start();break;case"sink":d(c,2,n.motion.~~easing.standard~~).start()}},[t,u,m,r,o,c,n,d]),b=useCallback(()=>{if(t)switch(u){case"scale":p(r,1,"snappy").start();break;case"bounce":p(r,1,"bouncy").start();break;case"fade":d(o,1,n.motion.~~easing~~.decelerate).start();break;case"sink":p(c,0,"snappy").start()}},[t,u,r,o,c,n,d,p]),g=useCallback(()=>{t&&"pulse"===u&&RNAnimated.sequence([RNAnimated.timing(r,{toValue:1.05,duration:n.motion.duration.instant,easing:Easing.bezier(...n.motion.~~easing~~.accelerate),useNativeDriver:!0}),p(r,1,"snappy")]).start()},[t,u,r,n,p]),A=useMemo(()=>({transform:[{scale:r},{translateY:c}],opacity:o}),[r,c,o]);return{scale:r,opacity:o,translateY:c,style:A,pressIn:f,pressOut:b,press:g}};
1	+ "use strict";import{useCallback,useMemo,useRef}from"react";import{Easing,Animated as RNAnimated}from"react-native";import{useTheme}from"../theme/index.js";import{createAnimatedValue}from"../theme/animatedValue.js";import{usePresenceMotion}from"./usePresenceMotion.js";export const PRESS_ANIMATION_PRESETS=["scale","bounce","fade","sink","pulse"];const FADE_TO=.6,SINK_BY=2,PULSE_TO=1.05,DEFAULT_SCALE_TO={scale:.97,bounce:.92,fade:1,sink:1,pulse:1};export const usePressAnimation=({preset:e="scale",scaleTo:a,pressDuration:s,enabled:t=!0}={})=>{const n=useTheme(),i=usePresenceMotion(),r=useRef(createAnimatedValue(1)).current,o=useRef(createAnimatedValue(1)).current,c=useRef(createAnimatedValue(0)).current,u=i.reduced?"fade":e,m=a??DEFAULT_SCALE_TO[u],l=s??i.duration("fast"),p=useCallback((e,a,s)=>RNAnimated.timing(e,{toValue:a,duration:l,easing:Easing.bezier(...s),useNativeDriver:!0}),[l]),d=useCallback((e,a,s)=>RNAnimated.spring(e,{toValue:a,damping:n.motion.spring[s].damping,stiffness:n.motion.spring[s].stiffness,mass:n.motion.spring[s].mass,useNativeDriver:!0}),[n]),f=useCallback(()=>{if(t)switch(u){case"scale":case"bounce":p(r,m,n.motion.ease["in-out"]).start();break;case"fade":p(o,.6,n.motion.ease["in-out"]).start();break;case"sink":p(c,2,n.motion.ease["in-out"]).start()}},[t,u,m,r,o,c,n,p]),b=useCallback(()=>{if(t)switch(u){case"scale":d(r,1,"snappy").start();break;case"bounce":d(r,1,"bouncy").start();break;case"fade":p(o,1,n.motion.ease.decelerate).start();break;case"sink":d(c,0,"snappy").start()}},[t,u,r,o,c,n,p,d]),A=useCallback(()=>{t&&"pulse"===u&&RNAnimated.sequence([RNAnimated.timing(r,{toValue:1.05,duration:n.motion.duration.instant,easing:Easing.bezier(...n.motion.ease.accelerate),useNativeDriver:!0}),d(r,1,"snappy")]).start()},[t,u,r,n,d]),k=useMemo(()=>({transform:[{scale:r},{translateY:c}],opacity:o}),[r,c,o]);return{scale:r,opacity:o,translateY:c,style:k,pressIn:f,pressOut:b,press:A}};

package/lib/module/hooks/useRefreshControl.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{Logger}from"@webority/mobile-core";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Platform,RefreshControl}from"react-native";import{useTheme}from"../theme/index.js";import{announce}from"../utils/announce.js";import{resolveHaptic,triggerHaptic}from"../utils/hapticUtils.js";import{jsx as _jsx}from"react/jsx-runtime";const DEFAULT_MIN_VISIBLE_MS=400;export const useRefreshControl=e=>{const{onRefresh:r,refreshing:t=!1,haptic:o,title:s,minVisibleMs:n=DEFAULT_MIN_VISIBLE_MS,labels:c}=e,i=useTheme(),[u,a]=useState(!1),l=useRef(!1),f=useRef(!0),m=useRef(null),h=useRef(r);h.current=r;const p=useRef(c);p.current=c;const g=useRef(n);g.current=n,useEffect(()=>(f.current=!0,()=>{f.current=!1,m.current?.release()}),[]);const b=useCallback(e=>new Promise(r=>{if(e<=0)return void r();const t=setTimeout(()=>{m.current=null,r()},e);m.current={release:()=>{clearTimeout(t),m.current=null,r()}}}),[]),d=useCallback(async e=>{if(l.current)return;l.current=!0,a(!0);const r=Date.now();e&&announce(p.current?.refreshing??"Refreshing");let t=!1;try{await h.current()}catch(e){t=!0,Logger.error("[@webority/mobile-ui] useRefreshControl: onRefresh failed.",e)}f.current&&await b(g.current-(Date.now()-r)),l.current=!1,f.current&&(a(!1),e&&!t&&announce(p.current?.refreshed??"Updated"))},[b]),R="android"===Platform.OS?"gestureStart":null,C=void 0===o?R:resolveHaptic(o,"gestureStart"),y=useCallback(()=>{l.current\|\|(C&&triggerHaptic(C),d(!1))},[C,d]),v=useCallback(()=>d(!0),[d]),S=useMemo(()=>({accessibilityActions:[{name:"refresh",label:c?.refresh??"Refresh"}],onAccessibilityAction:e=>{"refresh"===e.nativeEvent.actionName&&d(!0)}}),[c?.refresh,d]),k=u\|\|t;return{refreshControl:useMemo(()=>_jsx(RefreshControl,{refreshing:k,onRefresh:y,tintColor:i.colors.primary,colors:[i.colors.primary],progressBackgroundColor:i.colors.~~background.elevated~~,title:s,titleColor:i.colors.text~~.secondary~~}),[k,y,s,i.colors.primary,i.colors.~~background.elevated~~,i.colors.text~~.secondary~~]),refreshing:k,refresh:v,accessibilityProps:S}};
1	+ "use strict";import{Logger}from"@webority/mobile-core";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Platform,RefreshControl}from"react-native";import{useTheme}from"../theme/index.js";import{announce}from"../utils/announce.js";import{resolveHaptic,triggerHaptic}from"../utils/hapticUtils.js";import{jsx as _jsx}from"react/jsx-runtime";const DEFAULT_MIN_VISIBLE_MS=400;export const useRefreshControl=e=>{const{onRefresh:r,refreshing:t=!1,haptic:s,title:o,minVisibleMs:n=DEFAULT_MIN_VISIBLE_MS,labels:c}=e,u=useTheme(),[i,a]=useState(!1),l=useRef(!1),f=useRef(!0),m=useRef(null),h=useRef(r);h.current=r;const p=useRef(c);p.current=c;const g=useRef(n);g.current=n,useEffect(()=>(f.current=!0,()=>{f.current=!1,m.current?.release()}),[]);const R=useCallback(e=>new Promise(r=>{if(e<=0)return void r();const t=setTimeout(()=>{m.current=null,r()},e);m.current={release:()=>{clearTimeout(t),m.current=null,r()}}}),[]),b=useCallback(async e=>{if(l.current)return;l.current=!0,a(!0);const r=Date.now();e&&announce(p.current?.refreshing??"Refreshing");let t=!1;try{await h.current()}catch(e){t=!0,Logger.error("[@webority/mobile-ui] useRefreshControl: onRefresh failed.",e)}f.current&&await R(g.current-(Date.now()-r)),l.current=!1,f.current&&(a(!1),e&&!t&&announce(p.current?.refreshed??"Updated"))},[R]),C="android"===Platform.OS?"gestureStart":null,d=void 0===s?C:resolveHaptic(s,"gestureStart"),y=useCallback(()=>{l.current\|\|(d&&triggerHaptic(d),b(!1))},[d,b]),S=useCallback(()=>b(!0),[b]),x=useMemo(()=>({accessibilityActions:[{name:"refresh",label:c?.refresh??"Refresh"}],onAccessibilityAction:e=>{"refresh"===e.nativeEvent.actionName&&b(!0)}}),[c?.refresh,b]),M=i\|\|t;return{refreshControl:useMemo(()=>_jsx(RefreshControl,{refreshing:M,onRefresh:y,tintColor:u.colors.primary,colors:[u.colors.primary],progressBackgroundColor:u.colors.surface,title:o,titleColor:u.colors["text-muted"]}),[M,y,o,u.colors.primary,u.colors.surface,u.colors["text-muted"]]),refreshing:M,refresh:S,accessibilityProps:x}};

package/lib/module/index.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";export*from"./components/index.js";export{APP_ICON_SIZES,AppIcon,CURATED_ICON_NAMES,defaultIcons,ICON_NAMES,ICONSAX_SUFFIX,renderSlotIcon}from"./components/AppIcon/index.js";export{deletePath,Form,getPath,HookFormField,isFieldFilled,rules,setPath,useField,useFieldArray,useForm,useFormCompletion,useFormContext,useHookFormField,useOptionalFormContext}from"./form/index.js";export{FLICK_TOLERANCE,PRESENCE_REDUCE_MOTION,PRESS_ANIMATION_PRESETS,useControllableState,useDebounce,useFieldChain,useFlickGuard,usePresenceMotion,usePressAnimation,useReducedMotion,useRefreshControl,useScrollDirection,useToggle}from"./hooks/index.js";export{initUI}from"./initUI.js";export{NetworkStatusBanner}from"./network/index.js";export{darkTheme,~~fontSizeOf~~,getColorMode,getTheme,lightTheme,~~mergeTheme~~,radiusOf,resetTheme,resolveBadgeSize,resolveButtonSize,resolveCheckboxSize,resolveChipSize,resolveEmptyStateSize,resolveFieldSize,resolveFloatingActionButtonSize,resolveListItemSize,resolveOtpInputSize,resolveRadioSize,resolveSegmentedControlSize,resolveSliderSize,resolveSwitchSize,resolveTabsSize,setColorMode,setTheme,spaceOf,subscribeTheme,ThemeProvider,useTheme,useThemeMode}from"./theme/index.js";export{announce,Breakpoints,configureFeedback,feedback,hapticForIntent,isFeedbackEnabled,isScreenSize,isTablet,Responsive,ScreenDimensions,SQUIRCLE_MIN_RADIUS,SQUIRCLE_SMOOTHING,setHapticImplementation,shadowStyle,smoothCorners,squircleApplies,squircleHostRadius,squirclePath,triggerHaptic,useScreenDimensions,warnUnknownProps}from"./utils/index.js";
1	+ "use strict";export*from"./components/index.js";export{APP_ICON_SIZES,AppIcon,CURATED_ICON_NAMES,defaultIcons,ICON_NAMES,ICONSAX_SUFFIX,renderSlotIcon}from"./components/AppIcon/index.js";export{deletePath,Form,getPath,HookFormField,isFieldFilled,rules,setPath,useField,useFieldArray,useForm,useFormCompletion,useFormContext,useHookFormField,useOptionalFormContext}from"./form/index.js";export{FLICK_TOLERANCE,PRESENCE_REDUCE_MOTION,PRESS_ANIMATION_PRESETS,useControllableState,useDebounce,useFieldChain,useFlickGuard,usePresenceMotion,usePressAnimation,useReducedMotion,useRefreshControl,useScrollDirection,useToggle}from"./hooks/index.js";export{initUI}from"./initUI.js";export{NetworkStatusBanner}from"./network/index.js";export{COLOR_NAMES,DURATION_NAMES,darkTheme,EASE_NAMES,FONT_NAMES,getColorMode,getTheme,LEADING_NAMES,LETTER_SPACING_NAMES,lightTheme,mergeBrand,RADIUS_NAMES,radiusOf,resetTheme,resolveBadgeSize,resolveButtonSize,resolveCheckboxSize,resolveChipSize,resolveEmptyStateSize,resolveFieldSize,resolveFloatingActionButtonSize,resolveListItemSize,resolveOtpInputSize,resolveRadioSize,resolveSegmentedControlSize,resolveSliderSize,resolveSwitchSize,resolveTabsSize,SHADOW_NAMES,SIZE_NAMES,SPACE_NAMES,setColorMode,setTheme,spaceOf,subscribeTheme,TEXT_NAMES,ThemeProvider,textOf,useTheme,useThemeMode,WEIGHT_NAMES}from"./theme/index.js";export{announce,Breakpoints,configureFeedback,feedback,hapticForIntent,isFeedbackEnabled,isScreenSize,isTablet,Responsive,ScreenDimensions,SQUIRCLE_MIN_RADIUS,SQUIRCLE_SMOOTHING,setHapticImplementation,shadowStyle,smoothCorners,squircleApplies,squircleHostRadius,squirclePath,triggerHaptic,useScreenDimensions,warnUnknownProps}from"./utils/index.js";

package/lib/module/initUI.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{setColorMode,setTheme}from"./theme/index.js";export const initUI=(e={})=>{e.defaultMode&&setColorMode(e.defaultMode),e.~~light&&setTheme(~~e.~~light,"light"~~)~~,e.dark~~&&setTheme(e.~~dark~~,~~"dark"~~)};
1	+ "use strict";import{setColorMode,setTheme}from"./theme/index.js";export const initUI=(e={})=>{e.defaultMode&&setColorMode(e.defaultMode),(e.brand\|\|e.settings)&&setTheme(e.brand,e.settings)};

package/lib/module/network/NetworkStatusBanner.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{useNetworkStatus}from"@webority/mobile-core";import{useEffect,useMemo,useRef,useState}from"react";import{Animated,StyleSheet,Text}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{usePresenceMotion}from"../hooks/usePresenceMotion.js";import{fontFor,useTheme}from"../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";export const NetworkStatusBanner=({message:e="You are offline. Some features may be unavailable.",position:t="top",style:o,disabled:n=!1,safeArea:a=!0})=>{const r=useTheme(),i=usePresenceMotion(),s=useSafeAreaInsets(),u=a?"top"===t?s.top:s.bottom:0,[m,l]=useState(0),c=m>0?m:56+u,{isConnected:p,isInternetReachable:d}=useNetworkStatus(),f=!(n\|\|p&&!1!==d),g=useRef(new Animated.Value(0)).current,b=useRef(new Animated.Value(0)).current,S=i.duration("~~normal~~");useEffect(()=>{Animated.parallel([Animated.timing(g,{toValue:f?1:0,duration:r.motion.duration.~~normal~~,useNativeDriver:!0}),Animated.timing(b,{toValue:f?1:0,duration:S,useNativeDriver:!0})]).start()},[f,g,~~b,r~~.motion.duration.~~normal~~,S]);const y=useMemo(()=>buildStyles(r),[r]),h=g.interpolate({inputRange:[0,1],outputRange:i.range("top"===t?-c:c,0)});return _jsx(Animated.View,{pointerEvents:f?"auto":"none",accessibilityRole:"alert",accessibilityLiveRegion:f?"polite":"none",onLayout:e=>l(e.nativeEvent.layout.height),style:[y.container,"top"===t?y.top:y.bottom,"top"===t?{paddingTop:r.~~spacing~~.sm+u}:{paddingBottom:r.~~spacing~~.sm+u},{backgroundColor:r.colors.~~error~~,opacity:b,transform:[{translateY:h}]},o],children:_jsx(Text,{style:{color:r.colors~~.onError~~,fontSize:r.~~typography~~.~~fontSize~~.sm,...fontFor(r,"semibold"),textAlign:"center"},numberOfLines:2,children:e})})};const buildStyles=e=>StyleSheet.create({container:{position:"absolute",left:0,right:0,paddingVertical:e.~~spacing~~.sm,paddingHorizontal:e.~~spacing~~.lg,zIndex:1e3,elevation:8},top:{top:0},bottom:{bottom:0}});export default NetworkStatusBanner;
1	+ "use strict";import{useNetworkStatus}from"@webority/mobile-core";import{useEffect,useMemo,useRef,useState}from"react";import{Animated,StyleSheet,Text}from"react-native";import{useSafeAreaInsets}from"react-native-safe-area-context";import{usePresenceMotion}from"../hooks/usePresenceMotion.js";import{fontFor,useTheme}from"../theme/index.js";import{jsx as _jsx}from"react/jsx-runtime";export const NetworkStatusBanner=({message:e="You are offline. Some features may be unavailable.",position:t="top",style:o,disabled:a=!1,safeArea:n=!0})=>{const i=useTheme(),r=usePresenceMotion(),s=useSafeAreaInsets(),u=n?"top"===t?s.top:s.bottom:0,[l,m]=useState(0),c=l>0?l:56+u,{isConnected:d,isInternetReachable:p}=useNetworkStatus(),f=!(a\|\|d&&!1!==p),b=useRef(new Animated.Value(0)).current,g=useRef(new Animated.Value(0)).current,S=r.duration("default");useEffect(()=>{Animated.parallel([Animated.timing(b,{toValue:f?1:0,duration:i.motion.duration.default,useNativeDriver:!0}),Animated.timing(g,{toValue:f?1:0,duration:S,useNativeDriver:!0})]).start()},[f,b,g,i.motion.duration.default,S]);const x=useMemo(()=>buildStyles(i),[i]),y=b.interpolate({inputRange:[0,1],outputRange:r.range("top"===t?-c:c,0)});return _jsx(Animated.View,{pointerEvents:f?"auto":"none",accessibilityRole:"alert",accessibilityLiveRegion:f?"polite":"none",onLayout:e=>m(e.nativeEvent.layout.height),style:[x.container,"top"===t?x.top:x.bottom,"top"===t?{paddingTop:i.space.sm+u}:{paddingBottom:i.space.sm+u},{backgroundColor:i.colors.danger,opacity:g,transform:[{translateY:y}]},o],children:_jsx(Text,{style:{color:i.colors["on-danger"],fontSize:i.text.sm.size,...fontFor(i,"semibold"),textAlign:"center"},numberOfLines:2,children:e})})};const buildStyles=e=>StyleSheet.create({container:{position:"absolute",left:0,right:0,paddingVertical:e.space.sm,paddingHorizontal:e.space.lg,zIndex:1e3,elevation:8},top:{top:0},bottom:{bottom:0}});export default NetworkStatusBanner;

package/lib/module/theme/ThemeContext.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{Storage}from"@webority/mobile-core";import{createContext,useCallback,useContext,useEffect,useMemo,useRef,useState}from"react";import{Appearance}from"react-native";import{useReducedMotion}from"../hooks/useReducedMotion.js";import{~~mergeTheme~~}from"./merge.js";import{darkTheme,lightTheme}from"./tokens.js";import{jsx as _jsx}from"react/jsx-runtime";const REDUCED_SPRING={damping:100,stiffness:1e3,mass:1},collapseMotion=e=>({...e,duration:{instant:0,fast:0,~~normal~~:0,slow:0,slower:0},spring:{gentle:REDUCED_SPRING,bouncy:REDUCED_SPRING,snappy:REDUCED_SPRING}}),isPreference=e=>"light"===e\|\|"dark"===e\|\|"system"===e,defaultValue={theme:lightTheme,mode:"light",preference:"system",setPreference:()=>{},toggleColorMode:()=>{}},ThemeContext=createContext(defaultValue);export const ThemeProvider=({children:e,initialPreference:t="system",persistKey:r,~~lightOverrides~~:o,~~darkOverrides~~:s})~~=>{~~const[n,m]=useState(t),c=useRef(!1);useEffect(()=>{if(!r)return;let e=!0;return Storage.getItem(r).then(t=>{e&&!c.current&&isPreference(t)&&m(t)}),()=>{e=!1}},[r]);const a=useCallback(e=>{c.current=!0,m(e)},[]);useEffect(()=>{r&&c.current&&Storage.setItem(r,n)},[r,n]);const[i,u]=useState(()=>Appearance.getColorScheme()??"light");useEffect(()=>{const e=Appearance.addChangeListener(({colorScheme:e})=>{u(e??"light")});return()=>e.remove()},[]);const l="system"===n?i:n,d=useReducedMotion(),f=useMemo(()=>{const e="dark"===l?darkTheme:lightTheme,t=~~"dark"===l?~~s~~:o,r=t~~?~~mergeTheme~~(e,t):e;return d?{...r,motion:collapseMotion(r.motion)}:r},[l,o,s,d]),h=useMemo(()=>({theme:f,mode:l,preference:n,setPreference:a,toggleColorMode:()=>a(e=>"system"===e?"dark"===i?"light":"dark":"dark"===e?"light":"dark")}),[f,l,~~n,i,a~~]);return _jsx(ThemeContext.Provider,{value:h,children:e})};export const useTheme=()=>useContext(ThemeContext).theme;export const useThemeMode=()=>{const e=useContext(ThemeContext);return{mode:e.mode,preference:e.preference,setPreference:e.setPreference,toggleColorMode:e.toggleColorMode}};
1	+ "use strict";import{Storage}from"@webority/mobile-core";import{createContext,useCallback,useContext,useEffect,useMemo,useRef,useState}from"react";import{Appearance}from"react-native";import{useReducedMotion}from"../hooks/useReducedMotion.js";import{mergeBrand}from"./merge.js";import{darkTheme,lightTheme}from"./tokens.js";import{jsx as _jsx}from"react/jsx-runtime";const REDUCED_SPRING={damping:100,stiffness:1e3,mass:1},collapseMotion=e=>({...e,duration:{instant:0,fast:0,default:0,slow:0,slower:0},spring:{gentle:REDUCED_SPRING,bouncy:REDUCED_SPRING,snappy:REDUCED_SPRING}}),isPreference=e=>"light"===e\|\|"dark"===e\|\|"system"===e,defaultValue={theme:lightTheme,mode:"light",preference:"system",setPreference:()=>{},toggleColorMode:()=>{}},ThemeContext=createContext(defaultValue);export const ThemeProvider=e=>{const{children:t,initialPreference:r="system",persistKey:o,brand:s,settings:n,...m}=e;if(Object.keys(m).length>0)throw new Error("ThemeProvider takes only these props: children, initialPreference, persistKey, brand, settings (mobile-ui 0.89.0). Run webority upgrade 0.89.0 to move an app.");const[a,i]=useState(r),c=useRef(!1);useEffect(()=>{if(!o)return;let e=!0;return Storage.getItem(o).then(t=>{e&&!c.current&&isPreference(t)&&i(t)}),()=>{e=!1}},[o]);const u=useCallback(e=>{c.current=!0,i(e)},[]);useEffect(()=>{o&&c.current&&Storage.setItem(o,a)},[o,a]);const[l,d]=useState(()=>Appearance.getColorScheme()??"light");useEffect(()=>{const e=Appearance.addChangeListener(({colorScheme:e})=>{d(e??"light")});return()=>e.remove()},[]);const f="system"===a?l:a,h=useReducedMotion(),g=useMemo(()=>{const e="dark"===f?darkTheme:lightTheme,t=s\|\|n?mergeBrand(e,s,n):e;return h?{...t,motion:collapseMotion(t.motion)}:t},[f,s,n,h]),p=useMemo(()=>({theme:g,mode:f,preference:a,setPreference:u,toggleColorMode:()=>u(e=>"system"===e?"dark"===l?"light":"dark":"dark"===e?"light":"dark")}),[g,f,a,l,u]);return _jsx(ThemeContext.Provider,{value:p,children:t})};export const useTheme=()=>useContext(ThemeContext).theme;export const useThemeMode=()=>{const e=useContext(ThemeContext);return{mode:e.mode,preference:e.preference,setPreference:e.setPreference,toggleColorMode:e.toggleColorMode}};

package/lib/module/theme/componentSizes.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{~~fontSizeOf,radiusOf,spaceOf~~}from"./scale.js";const ~~resolveSize~~=(e,t,o,s)=>{const n={};~~for~~(~~const~~ i ~~of Object.keys~~(~~o))~~{~~const p=~~t~~[i],a=`$~~{s}.${i}~~`;switch(o[i]~~)~~{case"space":n[i]~~=~~spaceOf~~(e,p,a)~~;break;case~~"text"~~:n[i]=fontSizeOf(e,p,a);break;case~~"radius"~~:n[i]=radiusOf~~(e,p,a);~~break;case"px":~~if("number"!=typeof p)throw new Error(`${a} is ${JSON.stringify(p)}; it takes a number ~~of pixels~~.`);~~n[i]=p}}~~return n},~~BUTTON~~=~~{paddingX:"space"~~,~~paddingY:"space"~~,~~minHeight:"px",text:"text",radius:"radius",icon:"px",badgeIcon:"px"},FIELD=~~{~~paddingX:"space",paddingY:"space",minHeight:"px",text:"text",radius:"radius",icon:"px",labelText:"text",labelGap:"space",messageText:"text",messageGap:"space"},EMPTY_STATE~~=~~{icon:"px"~~,~~titleText:"text",descriptionText:"text",paddingY:"space",titleGap:"space",descriptionGap:"space"},LIST_ITEM~~={~~paddingY:"space",titleText:"text",subtitleText:"text",minHeight:"px"~~}~~,BADGE~~=~~{text:"text"~~,~~minWidth:"px"~~,~~height:"px"~~,~~paddingX:"space"~~,~~dotSize:"px"},CHIP=~~{~~paddingX:"space",paddingY:"space",text:"text",minHeight:"px",closeSize:"px",closeText:"text",gap:"space",icon:"px"~~}~~,CHECKBOX=~~{~~boxSize:"px"~~}~~,RADIO=~~{~~outer:"px",inner:"px"~~}~~,SWITCH={trackWidth:"px",trackHeight:"px",thumbSize:"px",padding:"px"~~},OTP_INPUT={cell:"px",text:"text",radius:"radius",gap:"space"},SEGMENTED_CONTROL={height:"px",text:"text",paddingX:"space",icon:"px"},TABS={text:"text",paddingY:"space",paddingX:"space",scrollablePaddingX:"space",icon:"px"},SLIDER={trackHeight:"px",thumbDiameter:"px"},FAB={diameter:"px",icon:"px",text:"text",labelPaddingX:"space"};export const resolveButtonSize=(e,t)=>resolveSize(e,~~e.components.~~button~~[t]~~,~~BUTTON,`components.button.${t}`~~);export const resolveFieldSize=(e,t)=>resolveSize(e,~~e.components.~~field~~[t]~~,~~FIELD,`components.field.${t}`~~);export const resolveEmptyStateSize=(e,t)=>resolveSize(e,~~e.components.emptyState[t]~~,~~EMPTY_STATE,`components.emptyState.${t}`~~);export const resolveListItemSize=(e,t)=>resolveSize(e,~~e.components.listItem[t]~~,~~LIST_ITEM,`components.listItem.${t}`~~);export const resolveBadgeSize=(e,t)=>resolveSize(e,~~e.components.~~badge~~[t]~~,~~BADGE,`components.badge.${t}`~~);export const resolveChipSize=(e,t)=>resolveSize(e,~~e.components.~~chip~~[t]~~,~~CHIP,`components.chip.${t}`~~);export const resolveCheckboxSize=(e,t)=>resolveSize(e,~~e.components.~~checkbox~~[t]~~,~~CHECKBOX,`components.checkbox.${t}`~~);export const resolveRadioSize=(e,t)=>resolveSize(e,~~e.components.~~radio~~[t]~~,~~RADIO,`components.radio.${t}`~~);export const resolveSwitchSize=(e,t)=>resolveSize(e,~~e.components.~~switch~~[t]~~,~~SWITCH,`components.switch.${t}`~~);export const resolveOtpInputSize=(e,t)=>resolveSize(e,~~e.components.otpInput[t]~~,~~OTP_INPUT,`components.otpInput.${t}`~~);export const resolveSegmentedControlSize=(e,t)=>resolveSize(e,~~e.components.segmentedControl[t]~~,~~SEGMENTED_CONTROL,`components.segmentedControl.${t}`~~);export const resolveTabsSize=(e,t)=>resolveSize(e,~~e.components.~~tabs~~[t]~~,~~TABS,`components.tabs.${t}`~~);export const resolveSliderSize=(e,t)=>resolveSize(e,~~e.components.~~slider~~[t]~~,~~SLIDER,`components.slider.${t}`~~);export const resolveFloatingActionButtonSize=(e,t)=>resolveSize(e,~~e.components.floatingActionButton[t],FAB,`components.floatingActionButton.${t}`);const THREE=[~~"sm",~~"md","lg"],TWO=["sm","md"],FIVE=["xs","sm","md","lg","xl"]~~;export const validateComponentTokens=e=>{~~const t=e.components;~~for(const t of ~~FIVE~~)~~resolveButtonSize(~~e~~,t)~~;for(const o of ~~THREE)resolveFieldSize~~(~~e,o~~)~~,resolveEmptyStateSize(e,o~~)~~,resolveListItemSize~~(~~e,o~~)~~,resolveCheckboxSize~~(e,o),~~resolveRadioSize(e,o~~)~~,resolveSwitchSize~~(e,~~o),resolveOtpInputSize~~(e,o),~~resolveSegmentedControlSize(e,o~~),~~resolveTabsSize(e,o),resolveSliderSize(e,o),resolveFloatingActionButtonSize(e,o),radiusOf(e,~~t~~.searchBar~~[o]~~.radius~~,`components~~.searchBar~~.${o}~~.radius~~`);for(const t of TWO)resolveBadgeSize(e,t),resolveChipSize(e,t);spaceOf(e,t.checkbox.labelGap,"components.checkbox.labelGap"),spaceOf(e,t.radio.labelGap,"components.radio.labelGap"),spaceOf(e,t.segmentedControl.trackPadding,"components.segmentedControl.trackPadding"),spaceOf(e,t.segmentedControl.pillInset,"components.segmentedControl.pillInset"),spaceOf(e,t.tabs.iconGap,"components.tabs.iconGap"),spaceOf(e,t.tabs.trackPadding,"components.tabs.trackPadding"),spaceOf(e,t.tabs.pillInset,"components.tabs.pillInset"),spaceOf(e,t.tabs.badgeGap,"components.tabs.badgeGap"),spaceOf(e,t.floatingActionButton.edgeOffset,"components.floatingActionButton.edgeOffset"),spaceOf(e,t.floatingActionButton.bottomOffset,"components.floatingActionButton.bottomOffset"),spaceOf(e,t.floatingActionButton.secondaryGap,"components.floatingActionButton.secondaryGap"),fontSizeOf(e,t.toast.iconGlyphText,"components.toast.iconGlyphText"),void 0!==t.segmentedControl.radius&&radiusOf(e,t.segmentedControl.radius,"components.segmentedControl.radius"),void 0!==t.tabs.radius&&radiusOf(e,t.tabs.radius,"components.tabs.radius")};
1	+ "use strict";import{scaleStep}from"./scale.js";import{COMPONENT_KINDS}from"./tokens.generated.js";const SIZE_KEYS=["xs","sm","md","lg","xl"],kindOf=(e,o,t)=>{const s=COMPONENT_KINDS[e][o];if(!s)throw new Error(`components.${e}${t?`.${t}`:""}.${o} has no kind in COMPONENT_KINDS.`);return s},pixelsOf=(e,o,t,s)=>{if("space"===o\|\|"text"===o\|\|"radius"===o)return scaleStep(e,o,String(t),s);if("number"!=typeof t)throw new Error(`${s} is ${JSON.stringify(t)}; it takes a number.`);return t},resolveSize=(e,o,t)=>{const s=e.components[o][t],r={};for(const i of Object.keys(s))r[i]=pixelsOf(e,kindOf(o,i,t),s[i],`components.${o}.${t}.${i}`);return r};export const resolveButtonSize=(e,o)=>resolveSize(e,"button",o);export const resolveFieldSize=(e,o)=>resolveSize(e,"field",o);export const resolveEmptyStateSize=(e,o)=>resolveSize(e,"empty-state",o);export const resolveListItemSize=(e,o)=>resolveSize(e,"list-item",o);export const resolveBadgeSize=(e,o)=>resolveSize(e,"badge",o);export const resolveChipSize=(e,o)=>resolveSize(e,"chip",o);export const resolveCheckboxSize=(e,o)=>resolveSize(e,"checkbox",o);export const resolveRadioSize=(e,o)=>resolveSize(e,"radio",o);export const resolveSwitchSize=(e,o)=>resolveSize(e,"switch",o);export const resolveOtpInputSize=(e,o)=>resolveSize(e,"otp-input",o);export const resolveSegmentedControlSize=(e,o)=>resolveSize(e,"segmented-control",o);export const resolveTabsSize=(e,o)=>resolveSize(e,"tabs",o);export const resolveSliderSize=(e,o)=>resolveSize(e,"slider",o);export const resolveFloatingActionButtonSize=(e,o)=>resolveSize(e,"floating-action-button",o);export const validateComponentTokens=e=>{for(const o of Object.keys(COMPONENT_KINDS)){const t=e.components[o];for(const s of Object.keys(t))SIZE_KEYS.includes(s)?resolveSize(e,o,s):pixelsOf(e,kindOf(o,s),t[s],`components.${o}.${s}`)}};

package/lib/module/theme/index.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{~~mergeTheme~~}from"./merge.js";import{darkTheme,lightTheme}from"./tokens.js";let ~~lightOverridesGlobal~~,~~darkOverridesGlobal~~,currentMode="light",currentTheme=lightTheme;const subscribers=new Set,recompute=()=>{const e="dark"===currentMode?darkTheme:lightTheme~~,r="dark"===currentMode?darkOverridesGlobal:lightOverridesGlobal~~;currentTheme=r?~~mergeTheme~~(e,r):e,subscribers.forEach(e=>e())};export const setTheme=(e,r)=>{~~r&&(currentMode~~=r),~~"dark"===currentMode?darkOverridesGlobal~~=~~e:lightOverridesGlobal=e~~,recompute()};export const setColorMode=e=>{currentMode=e,recompute()};export const getColorMode=()=>currentMode;export const getTheme=()=>currentTheme;export const resetTheme=()=>{currentMode="light",~~lightOverridesGlobal~~=void 0,~~darkOverridesGlobal~~=void 0,recompute()};export const subscribeTheme=e=>(subscribers.add(e),()=>{subscribers.delete(e)});export{createAnimatedValue,setNativeValue}from"./animatedValue.js";export{resolveBadgeSize,resolveButtonSize,resolveCheckboxSize,resolveChipSize,resolveEmptyStateSize,resolveFieldSize,resolveFloatingActionButtonSize,resolveListItemSize,resolveOtpInputSize,resolveRadioSize,resolveSegmentedControlSize,resolveSliderSize,resolveSwitchSize,resolveTabsSize,validateComponentTokens}from"./componentSizes.js";export{Gradient,gradientAngle,toBackgroundImage}from"./Gradient.js";export{~~mergeTheme~~}from"./merge.js";export{~~fontSizeOf,~~radiusOf,spaceOf}from"./scale.js";export{ThemeProvider,useTheme,useThemeMode}from"./ThemeContext.js";export{fontFor}from"./textStyle.js";export{darkTheme,lightTheme}from"./tokens.js";
1	+ "use strict";import{mergeBrand}from"./merge.js";import{darkTheme,lightTheme}from"./tokens.js";let brandGlobal,settingsGlobal,currentMode="light",currentTheme=lightTheme;const subscribers=new Set,recompute=()=>{const e="dark"===currentMode?darkTheme:lightTheme;currentTheme=brandGlobal\|\|settingsGlobal?mergeBrand(e,brandGlobal,settingsGlobal):e,subscribers.forEach(e=>e())};export const setTheme=(e,r)=>{brandGlobal=e,settingsGlobal=r,recompute()};export const setColorMode=e=>{currentMode=e,recompute()};export const getColorMode=()=>currentMode;export const getTheme=()=>currentTheme;export const resetTheme=()=>{currentMode="light",brandGlobal=void 0,settingsGlobal=void 0,recompute()};export const subscribeTheme=e=>(subscribers.add(e),()=>{subscribers.delete(e)});export{createAnimatedValue,setNativeValue}from"./animatedValue.js";export{resolveBadgeSize,resolveButtonSize,resolveCheckboxSize,resolveChipSize,resolveEmptyStateSize,resolveFieldSize,resolveFloatingActionButtonSize,resolveListItemSize,resolveOtpInputSize,resolveRadioSize,resolveSegmentedControlSize,resolveSliderSize,resolveSwitchSize,resolveTabsSize,validateComponentTokens}from"./componentSizes.js";export{Gradient,gradientAngle,toBackgroundImage}from"./Gradient.js";export{mergeBrand}from"./merge.js";export{radiusOf,spaceOf,textOf}from"./scale.js";export{ThemeProvider,useTheme,useThemeMode}from"./ThemeContext.js";export{fontFor}from"./textStyle.js";export{darkTheme,lightTheme}from"./tokens.js";export{COLOR_NAMES,DURATION_NAMES,EASE_NAMES,FONT_NAMES,LEADING_NAMES,LETTER_SPACING_NAMES,RADIUS_NAMES,SHADOW_NAMES,SIZE_NAMES,SPACE_NAMES,TEXT_NAMES,WEIGHT_NAMES}from"./tokens.generated.js";

package/lib/module/theme/merge.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{validateComponentTokens}from"./componentSizes.js";import{~~RETIRED_THEME_KEYS~~,~~RETIRED_THEME_KEYS_RELEASE~~}from"./~~retiredThemeKeys~~.js";import{deriveSolidFill,deriveStateFills,deriveToneInk}from"./toneInk.js";const ~~isPlainObject~~=~~e=>~~"~~object"==typeof~~ ~~e&&null!==e&&!Array~~.~~isArray(e)~~,~~SIZES~~=["xs","sm","md","lg","xl"],~~walkRetired~~=(e,r,o)=>{if(!isPlainObject(e)~~\|\|0===r~~.~~length~~)~~return[]~~;const~~[s,...t]=r,i="<size>"===s?~~Object.keys(e)~~.filter~~(~~e=>SIZES~~.includes(e)):~~[s]~~,n=[];for(const r of i){if(!~~Object~~.~~hasOwn~~(e,r))~~continue~~;const s=[~~...~~o,r]~~,i=e[r]~~;~~0===~~t.~~length?void~~ ~~0!==i&&n.push~~(s):n.~~push~~(~~...walkRetired(i~~,~~t,s~~))}~~return~~ n}~~,refuseRetiredKeys=e=>~~{~~const~~ r=[]~~;for(~~const o of ~~RETIRED_THEME_KEYS~~)for(const s of ~~walkRetired(e,o~~.~~path.split~~(~~"."~~)~~,[]~~)){const e=s.~~join~~(".")~~,t=s~~.~~slice~~(~~0,-1~~)~~.join~~(~~"."~~);if(~~null===o~~.to)~~r.push~~(`- ${e}: ~~removed~~; ${o.~~hint~~}`);~~else~~ if(o.~~scale~~){const s=~~"fontSize"===~~o~~.scale?"base":"md"~~;~~r.push~~(`- ${e}: ~~now~~ ${t}.${o.to}, a ${o~~.scale~~} ~~scale~~ ~~name~~ ~~such~~ ~~as '~~${s}'`)~~}else~~ r.~~push~~(`- ${e}: ~~now~~ ${t}~~.${o.to}`~~)}if(0~~!==r.length~~)throw new Error([`Theme ~~overrides~~ ~~use~~ ~~keys~~ ~~mobile-ui~~ ${~~RETIRED_THEME_KEYS_RELEASE~~} ~~retired~~. ~~Run~~ ~~\`mobile-tools~~ ~~codemod~~ ~~theme-~~keys\` in ~~the~~ ~~app~~ ~~folder~~, ~~then~~ ~~fix~~ ~~what~~ it ~~lists:`,...r]~~.~~join("\n"~~)~~)},deepMerge~~=(e,r)~~=>{~~if(!isPlainObject(e)~~\|\|!isPlainObject(r~~)~~)return~~ ~~void~~ ~~0!==r?r:e~~;~~const~~ o={~~...~~e};for(const s of Object.keys(r)){const t=~~r[s],i=~~e[s];~~isPlainObject~~(t)&&isPlainObject(i)?o[s]~~=deepMerge~~(~~i,t~~):~~void~~ ~~0!==t&&~~(~~o[s]=t~~)}~~return~~ o},TONES=["primary","success","warning","~~error~~","info"]~~,ON_INK~~=~~{primary:"onPrimary"~~,~~success:"onSuccess"~~,~~warning:"onWarning",error:"onError",info:"onInfo"},withDerivedTones=~~(e,~~r,o~~)~~=>{~~const s=~~o?.colors;if~~(~~!s\|\|!~~e?.colors?.~~toneText~~)~~return~~ ~~e;const~~{~~background:t}=e~~.colors,i=[t.~~primary~~,t.~~secondary,~~t.~~tertiary],n=~~{},c={};~~let~~ l={};for(const o of TONES){const t="string"==typeof s[o];let a=e~~.colors[o~~];if(t\|\|"string"==typeof s[~~ON_INK[o~~]]){const r=deriveSolidFill(a,e~~.colors[ON_INK[o~~]]);r!==a&&(n[o]=r,a=r)}if(t&&"string"!=typeof ~~s.toneText?.~~[o]&&(c[o]=deriveToneInk(a,~~i,r~~.mode)),"primary"===o&&(t\|\|void 0!==n.primary)){const o=deriveStateFills(a,~~e.colors.onPrimary~~,{fill:r.colors.primary,hover:r.colors~~.primaryHover~~,pressed:r.colors~~.primaryPressed~~});~~l={...~~"string"==typeof s.~~primaryHover?{}:{primaryHover:o.~~hover~~},...~~"string"==typeof s.~~primaryPressed?{}:{primaryPressed:o.~~pressed}}}~~}return~~ ~~0===~~Object.keys(n).~~length&&0===Object~~.~~keys(c~~)~~.length&&0===~~Object.keys(l).~~length?~~e:{...e,~~colors~~:{...e.~~colors~~,...~~n,...l~~,~~toneText~~:{...e.~~colors~~.~~toneText~~,...c}}}~~};export const mergeTheme~~=~~(e,r)=>~~{~~refuseRetiredKeys(r);const~~ o~~=withDerivedTones(deepMerge(e~~,r),e,r);return validateComponentTokens(o),o};
1	+ "use strict";import{validateComponentTokens}from"./componentSizes.js";import{COLOR_NAMES,FONT_NAMES,RADIUS_NAMES,WEIGHT_NAMES}from"./tokens.generated.js";import{deriveSolidFill,deriveStateFills,deriveToneInk}from"./toneInk.js";const HINT="Run webority upgrade to rename old names.",BRAND_KEYS=["colors","radius","font"],COLOR_MODES=["light","dark"],FIXED_RADII=["none","pill"],RADIUS_ALLOWED="sm, md, lg, xl",SETTINGS_KEYS=["icons","gradients","textVariants","maxFontSizeMultiplier","components"],COMPONENT_SETTING_KEYS={field:{defaultVariant:!0,requiredMarker:!0},input:{defaultVariant:!0,defaultLabelMode:!0,tintLabelOnFocus:!0,shakeOnError:!0},"search-bar":{defaultVariant:!0},select:{defaultVariant:!0},"otp-input":{shakeOnError:!0},"option-sheet":{selectedMarker:!0},"profile-picker":{defaultTone:!0,defaultVariant:!0,defaultAvatarTone:!0},slider:{thumbPressAnimation:!0},rating:{pulseOnPress:!0},stepper:{pulseAnimation:!0},tooltip:{enableScaleAnimation:!0},toast:{enableSwipeDismiss:!0,defaultDurationMs:!0}},isPlainObject=o=>"object"==typeof o&&null!==o&&!Array.isArray(o),validateBrand=o=>{if(void 0===o)return;if(!isPlainObject(o))throw new Error(`A brand is an object of colors, radius and font; got ${typeof o}. ${HINT}`);for(const e of Object.keys(o))if(!BRAND_KEYS.includes(e))throw new Error(`A brand sets colors, radius and font only; ${e} is not allowed (allowed: colors, radius, font). ${HINT}`);const e=o.colors;if(void 0!==e&&!isPlainObject(e))throw new Error(`A brand's colors is an object of light and dark; got ${typeof e}. ${HINT}`);for(const o of Object.keys(e??{})){if(!COLOR_MODES.includes(o))throw new Error(`A brand sets colours under light and dark only; ${o} is not allowed (allowed: light, dark). ${HINT}`);const t=e[o];for(const o of Object.keys(t)){if(!COLOR_NAMES.includes(o))throw new Error(`unknown colour ${o}; allowed: ${COLOR_NAMES.join(", ")}. ${HINT}`);if(void 0!==t[o]&&"string"!=typeof t[o])throw new Error(`colour ${o} must be a string; got ${typeof t[o]}.`)}}const t=o.radius;if(void 0!==t&&!isPlainObject(t))throw new Error(`A brand's radius is an object of radius names; got ${typeof t}. ${HINT}`);for(const o of Object.keys(t??{})){const e=t[o];if(!RADIUS_NAMES.includes(o))throw new Error(`unknown radius ${o}; allowed: ${RADIUS_ALLOWED}. ${HINT}`);if(FIXED_RADII.includes(o))throw new Error(`radius ${o} is fixed by the library; allowed: ${RADIUS_ALLOWED}.`);if("number"!=typeof e\|\|!Number.isFinite(e))throw new Error(`radius ${o} must be a number; got ${typeof e}.`)}const n=o.font;if(void 0!==n&&!isPlainObject(n))throw new Error(`A brand's font is an object of font names; got ${typeof n}. ${HINT}`);for(const o of Object.keys(n??{})){if(!FONT_NAMES.includes(o))throw new Error(`unknown font ${o}; allowed: ${FONT_NAMES.join(", ")}. ${HINT}`);const e=n[o];if(!isPlainObject(e))throw new Error(`font ${o} must be an object of weights; got ${typeof e}. ${HINT}`);for(const t of Object.keys(e)){if(!WEIGHT_NAMES.includes(t))throw new Error(`unknown font weight ${t} in font ${o}; allowed: ${WEIGHT_NAMES.join(", ")}. ${HINT}`);const n=e[t];if("string"!=typeof n\|\|0===n.length)throw new Error(`font ${o} weight ${t} must be a non-empty string.`)}}},validateSettings=o=>{if(void 0===o)return;if(!isPlainObject(o))throw new Error(`Theme settings is an object; got ${typeof o}. ${HINT}`);for(const e of Object.keys(o))if(!SETTINGS_KEYS.includes(e))throw new Error(`Theme settings take ${SETTINGS_KEYS.join(", ")} only; ${e} is not allowed. ${HINT}`);const e=o.components;if(void 0===e)return;if(!isPlainObject(e))throw new Error(`Theme settings components is an object of component names; got ${typeof e}. ${HINT}`);const t=COMPONENT_SETTING_KEYS;for(const o of Object.keys(e)){if(!Object.keys(t).includes(o))throw new Error(`unknown component ${o} in theme settings; allowed: ${Object.keys(COMPONENT_SETTING_KEYS).join(", ")}. ${HINT}`);const n=e[o];if(void 0===n)continue;if(!isPlainObject(n))throw new Error(`theme settings for ${o} is an object; got ${typeof n}. ${HINT}`);const r=t[o];for(const e of Object.keys(n))if(!(e in r))throw new Error(`unknown setting ${e} for ${o}; allowed: ${Object.keys(r).join(", ")}. ${HINT}`)}},TONES=["primary","success","warning","danger","info"];export const mergeBrand=(o,e,t)=>{validateBrand(e),validateSettings(t);const n=Object.fromEntries(Object.entries(e?.colors?.[o.mode]??{}).filter(([,o])=>void 0!==o)),r={...o.colors,...n},i={...o.radius,...e?.radius},s={...o.font};for(const t of Object.keys(e?.font??{}))s[t]={...o.font[t],...e?.font?.[t]};const a=[r.bg,r["bg-subtle"],r["bg-muted"]],l={};for(const e of TONES){const t="string"==typeof n[e];let i=r[e];if(t\|\|"string"==typeof n[`on-${e}`]){const o=deriveSolidFill(i,r[`on-${e}`]);o!==i&&(l[e]=o,i=o)}if(t&&"string"!=typeof n[`${e}-text`]&&(l[`${e}-text`]=deriveToneInk(i,a,o.mode)),"primary"===e&&(t\|\|void 0!==l.primary)){const e=deriveStateFills(i,r["on-primary"],{fill:o.colors.primary,hover:o.colors["primary-hover"],pressed:o.colors["primary-pressed"]});"string"!=typeof n["primary-hover"]&&(l["primary-hover"]=e.hover),"string"!=typeof n["primary-pressed"]&&(l["primary-pressed"]=e.pressed)}}const c={},f=new Set([...Object.keys(o.settings.components),...Object.keys(t?.components??{})]);for(const e of f)c[e]={...o.settings.components[e],...t?.components?.[e]};const d=t?.maxFontSizeMultiplier??o.settings.maxFontSizeMultiplier,u={icons:{...o.settings.icons,...t?.icons},gradients:{...o.settings.gradients,...t?.gradients},textVariants:{...o.settings.textVariants,...t?.textVariants},components:c,...void 0===d?{}:{maxFontSizeMultiplier:d}},p={...o,colors:{...r,...l},radius:i,font:s,settings:u};return validateComponentTokens(p),p};

package/lib/module/theme/scale.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";const ~~resolve~~=(e,o,s,r)=>{const t=e[s];if("number"!=typeof t)throw new Error(`${r} is ${JSON.stringify(s)}, which is not a ${o} name. Use one of: ${~~Object.keys(~~e~~).join(", ")~~}.`);return t};export const spaceOf=(e,~~o,s~~)=>~~resolve~~(e~~.spacing~~,"~~spacing~~",~~o,s~~);export const ~~fontSizeOf~~=(e,~~o,s~~)=>~~resolve~~(e~~.typography.fontSize~~,"~~text size~~",~~o,s~~);export const ~~radiusOf~~=(e,~~o,s~~)=>~~resolve~~(e~~.radius~~,"~~corner~~",~~o,s~~);
1	+ "use strict";export const scaleStep=(e,t,s,r)=>{const c="space"===t?e.space:"radius"===t?e.radius:e.text,o=c[s],a="text"===t?o?.size:o;if("number"!=typeof a){const e=Object.keys(c).join(", ");throw new Error(`${r?`${r} is `:""}${JSON.stringify(s)}, which is not a ${"text"===t?"text size":"radius"===t?"corner":"space"} name. Use one of: ${e}.`)}return a};export const spaceOf=(e,t)=>scaleStep(e,"space",t);export const radiusOf=(e,t)=>scaleStep(e,"radius",t);export const textOf=(e,t)=>scaleStep(e,"text",t);

package/lib/module/theme/textStyle.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";~~const FAMILY_KEY={normal:"regular",medium:"medium",semibold:"semibold",bold:"bold"};~~export const fontFor=(o,t,i)=>{const n="display"===i?~~o.typography.fontFamily?.~~display:~~void 0;if(n)return{fontFamily:n};const r=~~o~~.typography.fontFamily?.[FAMILY_KEY[t~~]];return r?{fontFamily:r}:{fontWeight:o.~~typography.fontWeight~~[t]}};
1	+ "use strict";export const fontFor=(t,o,i)=>{const n=t.font["display"===i?"display":"ui"][o];return n?{fontFamily:n}:{fontWeight:t.weight[o]}};

package/lib/module/theme/tokens.generated.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";export const COLOR_NAMES=["bg","bg-subtle","bg-muted","surface","surface-inverse","text","text-body","text-muted","text-subtle","text-inverse","link","border","border-subtle","field-bg","field-border","field-border-focus","focus-ring","scrim","on-scrim","primary","primary-hover","primary-soft","primary-text","on-primary","neutral","neutral-hover","on-neutral","success","success-text","on-success","warning","warning-text","on-warning","danger","danger-border","danger-text","on-danger","info","info-text","on-info","primary-pressed","on-neutral-strong","text-disabled","surface-pressed","surface-hover","surface-selected","surface-disabled","skeleton","skeleton-highlight","glass-fill","glass-border","on-glass","glass-badge","field-bg-focus","field-bg-disabled","field-border-error","field-label","field-text","field-text-disabled","field-placeholder","field-placeholder-disabled","field-icon","field-icon-focus","field-icon-disabled","field-caret","field-message","avatar-1","avatar-2","avatar-3","avatar-4","avatar-5","avatar-6","avatar-7","avatar-8","thumb","success-soft","warning-soft","danger-soft","info-soft","neutral-text","primary-wash","primary-wash-strong"];export const SPACE_NAMES=["none","xxs","xs","sm","md","lg","xl","2xl","3xl","4xl"];export const RADIUS_NAMES=["none","sm","md","lg","xl","pill"];export const TEXT_NAMES=["xs","sm","base","lg","xl","2xl","3xl","4xl","5xl","6xl","7xl","8xl"];export const WEIGHT_NAMES=["normal","medium","semibold","bold"];export const LEADING_NAMES=["tight","normal","relaxed"];export const LETTER_SPACING_NAMES=["tight","normal","wide"];export const FONT_NAMES=["ui","display","mono"];export const SHADOW_NAMES=["card","elevated","popover","modal","drawer"];export const DURATION_NAMES=["instant","fast","default","slow","slower"];export const EASE_NAMES=["in-out","accelerate","decelerate","sharp"];export const SIZE_NAMES=["border"];
1	+ "use strict";export const COLOR_NAMES=["bg","bg-subtle","bg-muted","surface","surface-inverse","text","text-body","text-muted","text-subtle","text-inverse","link","border","border-subtle","field-bg","field-border","field-border-focus","focus-ring","scrim","on-scrim","thumb","primary","primary-hover","primary-soft","primary-text","on-primary","primary-wash","primary-wash-strong","neutral","neutral-hover","neutral-text","on-neutral","success","success-soft","success-text","on-success","warning","warning-soft","warning-text","on-warning","danger","danger-soft","danger-border","danger-text","on-danger","info","info-soft","info-text","on-info","primary-pressed","on-neutral-strong","text-disabled","surface-pressed","surface-hover","surface-selected","surface-disabled","skeleton","skeleton-highlight","glass-fill","glass-border","on-glass","glass-badge","field-bg-focus","field-bg-disabled","field-border-error","field-label","field-text","field-text-disabled","field-placeholder","field-placeholder-disabled","field-icon","field-icon-focus","field-icon-disabled","field-caret","field-message","avatar-1","avatar-2","avatar-3","avatar-4","avatar-5","avatar-6","avatar-7","avatar-8"];export const SPACE_NAMES=["none","xxs","xs","sm","md","lg","xl","2xl","3xl","4xl"];export const RADIUS_NAMES=["none","sm","md","lg","xl","pill"];export const TEXT_NAMES=["xs","sm","base","lg","xl","2xl","3xl","4xl","5xl","6xl","7xl","8xl"];export const WEIGHT_NAMES=["normal","medium","semibold","bold"];export const LEADING_NAMES=["tight","normal","relaxed"];export const LETTER_SPACING_NAMES=["tight","normal","wide"];export const FONT_NAMES=["ui","display","mono"];export const SHADOW_NAMES=["card","elevated","popover","modal","drawer"];export const DURATION_NAMES=["instant","fast","default","slow","slower"];export const EASE_NAMES=["in-out","accelerate","decelerate","sharp"];export const SIZE_NAMES=["border"];export const COMPONENT_KINDS={field:{radius:"radius","padding-x":"space","padding-y":"space","min-height":"px",text:"text",icon:"px","label-text":"text","label-gap":"space","message-text":"text","message-gap":"space"},press:{opacity:"number"},disabled:{opacity:"number"},button:{"padding-x":"space","padding-y":"space","min-height":"px",text:"text",radius:"radius",icon:"px","badge-icon":"px"},input:{"multiline-min-height":"px"},"search-bar":{radius:"radius"},"empty-state":{icon:"px","title-text":"text","description-text":"text","padding-y":"space","title-gap":"space","description-gap":"space"},"list-item":{"padding-y":"space","title-text":"text","subtitle-text":"text","min-height":"px"},badge:{text:"text","min-width":"px",height:"px","padding-x":"space","dot-size":"px","border-width":"px","anchor-offset":"px"},chip:{"padding-x":"space","padding-y":"space",text:"text","min-height":"px","close-size":"px","close-text":"text",gap:"space",icon:"px"},checkbox:{"box-size":"px","label-gap":"space"},radio:{outer:"px",inner:"px","label-gap":"space"},switch:{"track-width":"px","track-height":"px","thumb-size":"px",padding:"space"},"otp-input":{cell:"px",text:"text",radius:"radius",gap:"space"},"segmented-control":{height:"px",text:"text","padding-x":"space",icon:"px","track-padding":"space","underline-height":"px","pill-inset":"space"},tabs:{text:"text","padding-y":"space","padding-x":"space","scrollable-padding-x":"space",icon:"px","icon-gap":"space","track-padding":"space","underline-height":"px","pill-inset":"space","disabled-opacity":"number","badge-gap":"space"},slider:{"track-height":"px","thumb-diameter":"px"},"floating-action-button":{diameter:"px",icon:"px",text:"text","label-padding-x":"space","edge-offset":"space","bottom-offset":"space","secondary-gap":"space","stagger-ms":"ms"},dialog:{"icon-wrapper-size":"px","action-button-min-height":"px"},toast:{"icon-circle-size":"px","icon-glyph-text":"text","tint-bar-width":"px","action-min-height":"px"},banner:{"tint-bar-width":"px"}};export const lightTokens={mode:"light",colors:{bg:"#ffffff","bg-subtle":"#f8f8fb","bg-muted":"#f1f1f5",surface:"#ffffff","surface-inverse":"#0f0f1a",text:"#252f4a","text-body":"#0f0f1a","text-muted":"#52525b","text-subtle":"#62626b","text-inverse":"#ffffff",link:"#5b5bd6",border:"#e5e5ec","border-subtle":"#efeff3","field-bg":"#f9fbfc","field-border":"#ebedf3","field-border-focus":"#bed2f9","focus-ring":"#5b5bd6",scrim:"#0f0f1a80","on-scrim":"#ffffff",thumb:"#ffffff",primary:"#5b5bd6","primary-hover":"#4f4fbf","primary-soft":"#eeeefc","primary-text":"#4f4fd3","on-primary":"#ffffff","primary-wash":"#5b5bd614","primary-wash-strong":"#5b5bd633",neutral:"#f4f4f8","neutral-hover":"#e9e9f0","neutral-text":"#52525b","on-neutral":"#0f0f1a",success:"#18864f","success-soft":"#e8faee","success-text":"#147042","on-success":"#ffffff",warning:"#f59e0b","warning-soft":"#fff8e6","warning-text":"#8f5c06","on-warning":"#0f0f1a",danger:"#e12c32","danger-soft":"#ffeaef","danger-border":"#e5484d","danger-text":"#bc1b20","on-danger":"#ffffff",info:"#1b6ef5","info-soft":"#e9f3ff","info-text":"#0958d9","on-info":"#ffffff","primary-pressed":"#4040a8","on-neutral-strong":"#ffffff","text-disabled":"#b4b4bb","surface-pressed":"#0f0f1a0f","surface-hover":"#0f0f1a0a","surface-selected":"#5b5bd61a","surface-disabled":"#f1f1f5",skeleton:"#ebedf3","skeleton-highlight":"#f5f6fa","glass-fill":"#ffffff47","glass-border":"#ffffff73","on-glass":"#0f0f1a","glass-badge":"#ffffff","field-bg-focus":"#ffffff","field-bg-disabled":"#f5f6fa","field-border-error":"#fdbfce","field-label":"#242f4a","field-text":"#252f4a","field-text-disabled":"#c4cada","field-placeholder":"#626d8b","field-placeholder-disabled":"#c4cada","field-icon":"#7a849f","field-icon-focus":"#4b5675","field-icon-disabled":"#c4cada","field-caret":"#5b8dee","field-message":"#d81736","avatar-1":"#5b5bd6","avatar-2":"#0a7979","avatar-3":"#a45a05","avatar-4":"#cd226e","avatar-5":"#2462eb","avatar-6":"#7c3aed","avatar-7":"#047c57","avatar-8":"#d42222"},space:{none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,"2xl":32,"3xl":48,"4xl":64},radius:{none:0,sm:6,md:10,lg:14,xl:20,pill:9999},text:{xs:{size:11,lineHeight:17},sm:{size:13,lineHeight:20},base:{size:15,lineHeight:23},lg:{size:17,lineHeight:24},xl:{size:20,lineHeight:26},"2xl":{size:24,lineHeight:30},"3xl":{size:30,lineHeight:36},"4xl":{size:36,lineHeight:40},"5xl":{size:45,lineHeight:47},"6xl":{size:57,lineHeight:57},"7xl":{size:64,lineHeight:64},"8xl":{size:72,lineHeight:72}},weight:{normal:"400",medium:"500",semibold:"600",bold:"700"},leading:{tight:1.2,normal:1.4,relaxed:1.6},"letter-spacing":{tight:-.2,normal:0,wide:.4},font:{ui:{},display:{},mono:{}},shadow:{card:{shadowColor:"#000000",shadowOffset:{width:0,height:2},shadowOpacity:.059,shadowRadius:4,elevation:2},elevated:{shadowColor:"#000000",shadowOffset:{width:0,height:4},shadowOpacity:.078,shadowRadius:8,elevation:4},popover:{shadowColor:"#000000",shadowOffset:{width:0,height:8},shadowOpacity:.102,shadowRadius:16,elevation:8},modal:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.141,shadowRadius:24,elevation:12},drawer:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.141,shadowRadius:24,elevation:12}},motion:{duration:{instant:80,fast:160,default:240,slow:360,slower:500},ease:{"in-out":[.4,0,.2,1],accelerate:[.4,0,1,1],decelerate:[0,0,.2,1],sharp:[.4,0,.6,1]}},size:{border:1},components:{field:{sm:{radius:"md","padding-x":"sm","padding-y":"sm","min-height":38,text:"sm",icon:14,"label-text":"xs","label-gap":"xs","message-text":"xs","message-gap":"xxs"},md:{radius:"md","padding-x":"md","padding-y":"md","min-height":44,text:"base",icon:16,"label-text":"sm","label-gap":"xs","message-text":"sm","message-gap":"xxs"},lg:{radius:"md","padding-x":"lg","padding-y":"lg","min-height":52,text:"lg",icon:18,"label-text":"base","label-gap":"xs","message-text":"base","message-gap":"xxs"}},press:{opacity:.85},disabled:{opacity:.55},button:{xs:{"padding-x":"sm","padding-y":"xs","min-height":28,text:"xs",radius:"md",icon:14,"badge-icon":11},sm:{"padding-x":"md","padding-y":"xs","min-height":34,text:"sm",radius:"md",icon:16,"badge-icon":16},md:{"padding-x":"lg","padding-y":"sm","min-height":44,text:"base",radius:"md",icon:18,"badge-icon":18},lg:{"padding-x":"xl","padding-y":"md","min-height":50,text:"lg",radius:"lg",icon:20,"badge-icon":20},xl:{"padding-x":"2xl","padding-y":"md","min-height":58,text:"xl",radius:"lg",icon:22,"badge-icon":22}},input:{sm:{"multiline-min-height":72},md:{"multiline-min-height":92},lg:{"multiline-min-height":110}},"search-bar":{sm:{radius:"pill"},md:{radius:"pill"},lg:{radius:"pill"}},"empty-state":{sm:{icon:48,"title-text":"lg","description-text":"sm","padding-y":"lg","title-gap":"md","description-gap":"xs"},md:{icon:64,"title-text":"xl","description-text":"base","padding-y":"xl","title-gap":"md","description-gap":"xs"},lg:{icon:80,"title-text":"2xl","description-text":"lg","padding-y":"2xl","title-gap":"md","description-gap":"xs"}},"list-item":{sm:{"padding-y":"sm","title-text":"sm","subtitle-text":"xs","min-height":44},md:{"padding-y":"md","title-text":"base","subtitle-text":"sm","min-height":56},lg:{"padding-y":"lg","title-text":"lg","subtitle-text":"base","min-height":72}},badge:{sm:{text:"xs","min-width":16,height:16,"padding-x":"xs","dot-size":8},md:{text:"sm","min-width":20,height:20,"padding-x":"sm","dot-size":10},"border-width":1.5,"anchor-offset":4},chip:{sm:{"padding-x":"sm","padding-y":"xs",text:"xs","min-height":26,"close-size":16,"close-text":"xs",gap:"xs",icon:14},md:{"padding-x":"md","padding-y":"xs",text:"sm","min-height":32,"close-size":18,"close-text":"sm",gap:"sm",icon:16}},checkbox:{sm:{"box-size":16},md:{"box-size":20},lg:{"box-size":24},"label-gap":"sm"},radio:{sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12},"label-gap":"sm"},switch:{sm:{"track-width":42,"track-height":26,"thumb-size":22,padding:"xxs"},md:{"track-width":51,"track-height":31,"thumb-size":27,padding:"xxs"},lg:{"track-width":60,"track-height":36,"thumb-size":32,padding:"xxs"}},"otp-input":{sm:{cell:36,text:"base",radius:"sm",gap:"sm"},md:{cell:48,text:"xl",radius:"md",gap:"sm"},lg:{cell:56,text:"2xl",radius:"lg",gap:"md"}},"segmented-control":{sm:{height:32,text:"sm","padding-x":"sm",icon:14},md:{height:40,text:"base","padding-x":"md",icon:16},lg:{height:48,text:"lg","padding-x":"lg",icon:18},"track-padding":"xs","underline-height":2,"pill-inset":"xs"},tabs:{sm:{text:"sm","padding-y":"sm","padding-x":"xs","scrollable-padding-x":"md",icon:16},md:{text:"base","padding-y":"md","padding-x":"sm","scrollable-padding-x":"lg",icon:18},lg:{text:"lg","padding-y":"lg","padding-x":"md","scrollable-padding-x":"xl",icon:20},"icon-gap":"xs","track-padding":"xs","underline-height":2,"pill-inset":"xs","disabled-opacity":.45,"badge-gap":"xs"},slider:{sm:{"track-height":4,"thumb-diameter":24},md:{"track-height":6,"thumb-diameter":28},lg:{"track-height":8,"thumb-diameter":32}},"floating-action-button":{sm:{diameter:40,icon:18,text:"sm","label-padding-x":"md"},md:{diameter:56,icon:22,text:"base","label-padding-x":"lg"},lg:{diameter:72,icon:28,text:"lg","label-padding-x":"xl"},"edge-offset":"xl","bottom-offset":"xl","secondary-gap":"lg","stagger-ms":50},dialog:{"icon-wrapper-size":48,"action-button-min-height":44},toast:{"icon-circle-size":28,"icon-glyph-text":"lg","tint-bar-width":0,"action-min-height":30},banner:{"tint-bar-width":0}}};export const darkTokens={mode:"dark",colors:{bg:"#0b0b12","bg-subtle":"#13131c","bg-muted":"#1c1c26",surface:"#1c1c26","surface-inverse":"#fafafa",text:"#e2e2e2","text-body":"#fafafa","text-muted":"#b4b4bb","text-subtle":"#919199","text-inverse":"#0f0f1a",link:"#9292ee",border:"#27272f","border-subtle":"#1c1c26","field-bg":"#13131c","field-border":"#27272f","field-border-focus":"#3d5fb0","focus-ring":"#7c7ce8",scrim:"#000000a6","on-scrim":"#ffffff",thumb:"#ffffff",primary:"#7c7ce8","primary-hover":"#9292ee","primary-soft":"#1f1f3d","primary-text":"#8989ea","on-primary":"#0f0f1a","primary-wash":"#7c7ce814","primary-wash-strong":"#7c7ce833",neutral:"#1f1f26","neutral-hover":"#2a2a33","neutral-text":"#b4b4bb","on-neutral":"#fafafa",success:"#30c780","success-soft":"#04b4402e","success-text":"#30c780","on-success":"#0f0f1a",warning:"#fbbf24","warning-soft":"#dfa0002e","warning-text":"#fbbf24","on-warning":"#0f0f1a",danger:"#f87171","danger-soft":"#e826462e","danger-border":"#f87171","danger-text":"#f87171","on-danger":"#0f0f1a",info:"#60a5fa","info-soft":"#056ee92e","info-text":"#60a5fa","on-info":"#0f0f1a","primary-pressed":"#a8a8f2","on-neutral-strong":"#0f0f1a","text-disabled":"#52525b","surface-pressed":"#ffffff14","surface-hover":"#ffffff0d","surface-selected":"#7c7ce82e","surface-disabled":"#1c1c26",skeleton:"#1c1c26","skeleton-highlight":"#27272f","glass-fill":"#ffffff47","glass-border":"#ffffff73","on-glass":"#0f0f1a","glass-badge":"#ffffff","field-bg-focus":"#0b0b12","field-bg-disabled":"#1c1c26","field-border-error":"#8a2f42","field-label":"#e4e6ee","field-text":"#fafafa","field-text-disabled":"#52525b","field-placeholder":"#84848d","field-placeholder-disabled":"#52525b","field-icon":"#8b8b95","field-icon-focus":"#d4d4db","field-icon-disabled":"#52525b","field-caret":"#7c9ef0","field-message":"#f87171","avatar-1":"#8b8bee","avatar-2":"#2dd4bf","avatar-3":"#fcd34d","avatar-4":"#f472b6","avatar-5":"#60a5fa","avatar-6":"#a78bfa","avatar-7":"#34d399","avatar-8":"#f87171"},space:{none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,"2xl":32,"3xl":48,"4xl":64},radius:{none:0,sm:6,md:10,lg:14,xl:20,pill:9999},text:{xs:{size:11,lineHeight:17},sm:{size:13,lineHeight:20},base:{size:15,lineHeight:23},lg:{size:17,lineHeight:24},xl:{size:20,lineHeight:26},"2xl":{size:24,lineHeight:30},"3xl":{size:30,lineHeight:36},"4xl":{size:36,lineHeight:40},"5xl":{size:45,lineHeight:47},"6xl":{size:57,lineHeight:57},"7xl":{size:64,lineHeight:64},"8xl":{size:72,lineHeight:72}},weight:{normal:"400",medium:"500",semibold:"600",bold:"700"},leading:{tight:1.2,normal:1.4,relaxed:1.6},"letter-spacing":{tight:-.2,normal:0,wide:.4},font:{ui:{},display:{},mono:{}},shadow:{card:{shadowColor:"#000000",shadowOffset:{width:0,height:2},shadowOpacity:.4,shadowRadius:4,elevation:2},elevated:{shadowColor:"#000000",shadowOffset:{width:0,height:4},shadowOpacity:.502,shadowRadius:8,elevation:4},popover:{shadowColor:"#000000",shadowOffset:{width:0,height:8},shadowOpacity:.549,shadowRadius:16,elevation:8},modal:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.6,shadowRadius:24,elevation:12},drawer:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.6,shadowRadius:24,elevation:12}},motion:{duration:{instant:80,fast:160,default:240,slow:360,slower:500},ease:{"in-out":[.4,0,.2,1],accelerate:[.4,0,1,1],decelerate:[0,0,.2,1],sharp:[.4,0,.6,1]}},size:{border:1},components:{field:{sm:{radius:"md","padding-x":"sm","padding-y":"sm","min-height":38,text:"sm",icon:14,"label-text":"xs","label-gap":"xs","message-text":"xs","message-gap":"xxs"},md:{radius:"md","padding-x":"md","padding-y":"md","min-height":44,text:"base",icon:16,"label-text":"sm","label-gap":"xs","message-text":"sm","message-gap":"xxs"},lg:{radius:"md","padding-x":"lg","padding-y":"lg","min-height":52,text:"lg",icon:18,"label-text":"base","label-gap":"xs","message-text":"base","message-gap":"xxs"}},press:{opacity:.85},disabled:{opacity:.55},button:{xs:{"padding-x":"sm","padding-y":"xs","min-height":28,text:"xs",radius:"md",icon:14,"badge-icon":11},sm:{"padding-x":"md","padding-y":"xs","min-height":34,text:"sm",radius:"md",icon:16,"badge-icon":16},md:{"padding-x":"lg","padding-y":"sm","min-height":44,text:"base",radius:"md",icon:18,"badge-icon":18},lg:{"padding-x":"xl","padding-y":"md","min-height":50,text:"lg",radius:"lg",icon:20,"badge-icon":20},xl:{"padding-x":"2xl","padding-y":"md","min-height":58,text:"xl",radius:"lg",icon:22,"badge-icon":22}},input:{sm:{"multiline-min-height":72},md:{"multiline-min-height":92},lg:{"multiline-min-height":110}},"search-bar":{sm:{radius:"pill"},md:{radius:"pill"},lg:{radius:"pill"}},"empty-state":{sm:{icon:48,"title-text":"lg","description-text":"sm","padding-y":"lg","title-gap":"md","description-gap":"xs"},md:{icon:64,"title-text":"xl","description-text":"base","padding-y":"xl","title-gap":"md","description-gap":"xs"},lg:{icon:80,"title-text":"2xl","description-text":"lg","padding-y":"2xl","title-gap":"md","description-gap":"xs"}},"list-item":{sm:{"padding-y":"sm","title-text":"sm","subtitle-text":"xs","min-height":44},md:{"padding-y":"md","title-text":"base","subtitle-text":"sm","min-height":56},lg:{"padding-y":"lg","title-text":"lg","subtitle-text":"base","min-height":72}},badge:{sm:{text:"xs","min-width":16,height:16,"padding-x":"xs","dot-size":8},md:{text:"sm","min-width":20,height:20,"padding-x":"sm","dot-size":10},"border-width":1.5,"anchor-offset":4},chip:{sm:{"padding-x":"sm","padding-y":"xs",text:"xs","min-height":26,"close-size":16,"close-text":"xs",gap:"xs",icon:14},md:{"padding-x":"md","padding-y":"xs",text:"sm","min-height":32,"close-size":18,"close-text":"sm",gap:"sm",icon:16}},checkbox:{sm:{"box-size":16},md:{"box-size":20},lg:{"box-size":24},"label-gap":"sm"},radio:{sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12},"label-gap":"sm"},switch:{sm:{"track-width":42,"track-height":26,"thumb-size":22,padding:"xxs"},md:{"track-width":51,"track-height":31,"thumb-size":27,padding:"xxs"},lg:{"track-width":60,"track-height":36,"thumb-size":32,padding:"xxs"}},"otp-input":{sm:{cell:36,text:"base",radius:"sm",gap:"sm"},md:{cell:48,text:"xl",radius:"md",gap:"sm"},lg:{cell:56,text:"2xl",radius:"lg",gap:"md"}},"segmented-control":{sm:{height:32,text:"sm","padding-x":"sm",icon:14},md:{height:40,text:"base","padding-x":"md",icon:16},lg:{height:48,text:"lg","padding-x":"lg",icon:18},"track-padding":"xs","underline-height":2,"pill-inset":"xs"},tabs:{sm:{text:"sm","padding-y":"sm","padding-x":"xs","scrollable-padding-x":"md",icon:16},md:{text:"base","padding-y":"md","padding-x":"sm","scrollable-padding-x":"lg",icon:18},lg:{text:"lg","padding-y":"lg","padding-x":"md","scrollable-padding-x":"xl",icon:20},"icon-gap":"xs","track-padding":"xs","underline-height":2,"pill-inset":"xs","disabled-opacity":.45,"badge-gap":"xs"},slider:{sm:{"track-height":4,"thumb-diameter":24},md:{"track-height":6,"thumb-diameter":28},lg:{"track-height":8,"thumb-diameter":32}},"floating-action-button":{sm:{diameter:40,icon:18,text:"sm","label-padding-x":"md"},md:{diameter:56,icon:22,text:"base","label-padding-x":"lg"},lg:{diameter:72,icon:28,text:"lg","label-padding-x":"xl"},"edge-offset":"xl","bottom-offset":"xl","secondary-gap":"lg","stagger-ms":50},dialog:{"icon-wrapper-size":48,"action-button-min-height":44},toast:{"icon-circle-size":28,"icon-glyph-text":"lg","tint-bar-width":0,"action-min-height":30},banner:{"tint-bar-width":0}}};

package/lib/module/theme/tokens.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";import{SQUIRCLE_SMOOTHING}from"../utils/squircle.js";~~const typography=~~{~~fontSize:{xs:11~~,~~sm:13,base:15,lg:17,xl:20,"2xl":24,"3xl":30,"4xl":36~~}~~,fontWeight:{normal:~~"~~400",medium:"500",semibold:"600",bold:"700"},lineHeight:{tight:1~~.~~2,normal:1~~.~~4,relaxed:1.6},letterSpacing:{tight:-.2,normal:0,wide:.4}},spacing={none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,~~"~~2xl":32,"3xl":48,"4xl":64},radius~~={none:0,sm:6,md:10,lg:14,xl:20,pill:9999},components={button:{xs:{paddingX:"sm",paddingY:"xs",minHeight:28,text:"xs",radius:"md",icon:14,badgeIcon:11},sm:{paddingX:"md",paddingY:"xs",minHeight:34,text:"sm",radius:"md",icon:16,badgeIcon:16},md:{paddingX:"lg",paddingY:"sm",minHeight:44,text:"base",radius:"md",icon:18,badgeIcon:18},lg:{paddingX:"xl",paddingY:"md",minHeight:50,text:"lg",radius:"lg",icon:20,badgeIcon:20},xl:{paddingX:"2xl",paddingY:"md",minHeight:58,text:"xl",radius:"lg",icon:22,badgeIcon:22}},field:{defaultVariant:"outlined",sm:{paddingX:"sm",paddingY:"sm",minHeight:38,text:"sm",radius:"md",icon:14,labelText:"xs",labelGap:"xs",messageText:"xs",messageGap:"xxs"},md:{paddingX:"md",paddingY:"md",minHeight:44,text:"base",radius:"md",icon:16,labelText:"sm",labelGap:"xs",messageText:"sm",messageGap:"xxs"},lg:{paddingX:"lg",paddingY:"lg",minHeight:52,text:"lg",radius:"md",icon:18,labelText:"base",labelGap:"xs",messageText:"base",messageGap:"xxs"}},input:{sm:{multilineMinHeight:72},md:{multilineMinHeight:92},lg:{multilineMinHeight:110}},searchBar:{sm:{radius:"pill"},md:{radius:"pill"},lg:{radius:"pill"}},emptyState:{sm:{icon:48,titleText:"lg",descriptionText:"sm",paddingY:"lg",titleGap:"md",descriptionGap:"xs"},md:{icon:64,titleText:"xl",descriptionText:"base",paddingY:"xl",titleGap:"md",descriptionGap:"xs"},lg:{icon:80,titleText:"2xl",descriptionText:"lg",paddingY:"2xl",titleGap:"md",descriptionGap:"xs"}},listItem:{sm:{paddingY:"sm",titleText:"sm",subtitleText:"xs",minHeight:44},md:{paddingY:"md",titleText:"base",subtitleText:"sm",minHeight:56},lg:{paddingY:"lg",titleText:"lg",subtitleText:"base",minHeight:72}},badge:{sm:{text:"xs",minWidth:16,height:16,paddingX:"xs",dotSize:8},md:{text:"sm",minWidth:20,height:20,paddingX:"sm",dotSize:10},borderWidth:1.5,anchorOffset:4},chip:{sm:{paddingX:"sm",paddingY:"xs",text:"xs",minHeight:26,closeSize:16,closeText:"xs",gap:"xs",icon:14},md:{paddingX:"md",paddingY:"xs",text:"sm",minHeight:32,closeSize:18,closeText:"sm",gap:"sm",icon:16}},checkbox:{sm:{boxSize:16},md:{boxSize:20},lg:{boxSize:24},labelGap:"sm"},radio:{sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12},labelGap:"sm"},switch:{sm:{trackWidth:42,trackHeight:26,thumbSize:22,padding:2},md:{trackWidth:51,trackHeight:31,thumbSize:27,padding:2},lg:{trackWidth:60,trackHeight:36,thumbSize:32,padding:2},thumbColor:"#FFFFFF"},otpInput:{sm:{cell:36,text:"base",radius:"sm",gap:"sm"},md:{cell:48,text:"xl",radius:"md",gap:"sm"},lg:{cell:56,text:"2xl",radius:"lg",gap:"md"}},segmentedControl:{sm:{height:32,text:"sm",paddingX:"sm",icon:14},md:{height:40,text:"base",paddingX:"md",icon:16},lg:{height:48,text:"lg",paddingX:"lg",icon:18},trackPadding:"xs",underlineHeight:2,pillInset:"xs"},tabs:{sm:{text:"sm",paddingY:"sm",paddingX:"xs",scrollablePaddingX:"md",icon:16},md:{text:"base",paddingY:"md",paddingX:"sm",scrollablePaddingX:"lg",icon:18},lg:{text:"lg",paddingY:"lg",paddingX:"md",scrollablePaddingX:"xl",icon:20},iconGap:"xs",trackPadding:"xs",underlineHeight:2,pillInset:"xs",disabledOpacity:.45,badgeGap:"xs"},slider:{sm:{trackHeight:4,thumbDiameter:24},md:{trackHeight:6,thumbDiameter:28},lg:{trackHeight:8,thumbDiameter:32}},floatingActionButton:{sm:{diameter:40,icon:18,text:"sm",labelPaddingX:"md"},md:{diameter:56,icon:22,text:"base",labelPaddingX:"lg"},lg:{diameter:72,icon:28,text:"lg",labelPaddingX:"xl"},edgeOffset:"xl",bottomOffset:"xl",secondaryGap:"lg",staggerMs:50},dialog:{iconWrapperSize:48,actionButtonMinHeight:44},toast:{iconCircleSize:28,iconGlyphText:"lg",tintBarWidth:0,actionMinHeight:30},banner:{tintBarWidth:0},formField:{inlineLabelWidth:"35%"}},motion={duration:{instant:80,fast:160,normal:240,slow:360,slower:500},fadeDuration:160,easing:{standard:[.4,0,.2,1],accelerate:[.4,0,1,1],decelerate:[0,0,.2,1],sharp:[.4,0,.6,1]},spring:{gentle:{damping:26,stiffness:240,mass:.9},bouncy:{damping:16,stiffness:200,mass:.7},snappy:{damping:20,stiffness:300,mass:.7}}},~~lightShadows~~={~~none:{}~~,xs:{~~shadowColor:"#000"~~,~~shadowOffset~~:~~{width:0~~,~~height~~:1},~~shadowOpacity:.04,shadowRadius~~:2,~~elevation~~:~~1},sm:~~{~~shadowColor~~:~~"#000",shadowOffset:~~{~~width:0,height:2~~},~~shadowOpacity:.06,shadowRadius~~:~~4,elevation:2},md:~~{~~shadowColor:"#000",shadowOffset:{width:0,height:4~~},~~shadowOpacity:.08,shadowRadius~~:~~8,elevation:4},lg:~~{~~shadowColor:"#000",shadowOffset:{width:0,height:8~~},~~shadowOpacity:.1,shadowRadius~~:~~16,elevation:8},xl:~~{~~shadowColor:"#000",shadowOffset:{width:0,height:12~~}~~,shadowOpacity:.14,shadowRadius:24,elevation:12~~}~~,"2xl":{shadowColor:"#000",shadowOffset:{width:0,height:20~~},shadowOpacity:.18,shadowRadius:32,elevation:20}},darkShadows={none:{},xs:{shadowColor:"#000",shadowOffset:{width:0,height:1},shadowOpacity:.3,shadowRadius:2,elevation:1},sm:{shadowColor:"#000",shadowOffset:{width:0,height:2},shadowOpacity:.4,shadowRadius:4,elevation:2},md:{shadowColor:"#000",shadowOffset:{width:0,height:4},shadowOpacity:.5,shadowRadius:8,elevation:4},lg:{shadowColor:"#000",shadowOffset:{width:0,height:8},shadowOpacity:.55,shadowRadius:16,elevation:8},xl:{shadowColor:"#000",shadowOffset:{width:0,height:12},shadowOpacity:.6,shadowRadius:24,elevation:12},"2xl":{shadowColor:"#000",shadowOffset:{width:0,height:20},shadowOpacity:.7,shadowRadius:32,elevation:20}};export const lightTheme={mode:"light",colors:{primary:"#5B5BD6",primaryHover:"#4F4FBF",primaryPressed:"#4040A8",primaryMuted:"#EEEEFC",secondary:"#F4F4F8",secondaryHover:"#E9E9F0",success:"#18864F",warning:"#F59E0B",error:"#E12C32",info:"#1B6EF5",onPrimary:"#FFFFFF",onNeutral:"#FFFFFF",onSecondary:"#0F0F1A",onSuccess:"#FFFFFF",onWarning:"#0F0F1A",onError:"#FFFFFF",onInfo:"#FFFFFF",onOverlay:"#FFFFFF",toneText:{primary:"#4F4FD3",success:"#147042",warning:"#8F5C06",error:"#BC1B20",info:"#0958D9"},text:{primary:"#0F0F1A",secondary:"#52525B",tertiary:"#62626B",inverse:"#FFFFFF",strong:"#252F4A",disabled:"#B4B4BB",link:"#5B5BD6"},background:{primary:"#FFFFFF",secondary:"#F8F8FB",tertiary:"#F1F1F5",elevated:"#FFFFFF",overlay:"rgba(~~15, 15, 26, 0.5~~)",inverse:"#0F0F1A"},border:{primary:"#E5E5EC",secondary:"#EFEFF3",focus:"#5B5BD6",error:"#E5484D",width:1},field:{background:"#F9FBFC",backgroundFocused:"#FFFFFF",backgroundDisabled:"#F5F6FA",border:"#EBEDF3",borderFocused:"#BED2F9",borderError:"#FDBFCE",label:"#242F4A",text:"#252F4A",textDisabled:"#C4CADA",placeholder:"#626D8B",placeholderDisabled:"#C4CADA",icon:"#7A849F",iconFocused:"#4B5675",iconDisabled:"#C4CADA",caret:"#5B8DEE",message:"#D81736"},surface:{pressed:"rgba(15, 15, 26, 0.06)",hovered:"rgba(15, 15, 26, 0.04)",selected:"rgba(91, 91, 214, 0.1)",disabled:"#F1F1F5"},glass:{fill:"rgba(255, 255, 255, 0.28)",border:"rgba(255, 255, 255, 0.45)",on:"#0F0F1A",badge:"#FFFFFF"},skeleton:{background:"#EBEDF3",highlight:"#F5F6FA"},avatarPalette:["#5B5BD6","#0A7979","#A45A05","#CD226E","#2462EB","#7C3AED","#047C57","#D42222"]},typography:typography,spacing:spacing,radius:radius,cornerSmoothing:SQUIRCLE_SMOOTHING,shadows:lightShadows,motion:motion,components:components,gradients:{}};export const darkTheme={mode:"dark",colors:{primary:"#7C7CE8",primaryHover:"#9292EE",primaryPressed:"#A8A8F2",primaryMuted:"#1F1F3D",secondary:"#1F1F26",secondaryHover:"#2A2A33",success:"#30C780",warning:"#FBBF24",error:"#F87171",info:"#60A5FA",onPrimary:"#0F0F1A",onNeutral:"#0F0F1A",onSecondary:"#FAFAFA",onSuccess:"#0F0F1A",onWarning:"#0F0F1A",onError:"#0F0F1A",onInfo:"#0F0F1A",onOverlay:"#FFFFFF",toneText:{primary:"#8989EA",success:"#30C780",warning:"#FBBF24",error:"#F87171",info:"#60A5FA"},text:{primary:"#FAFAFA",secondary:"#B4B4BB",tertiary:"#919199",inverse:"#0F0F1A",strong:"#E2E2E2",disabled:"#52525B",link:"#9292EE"},background:{primary:"#0B0B12",secondary:"#13131C",tertiary:"#1C1C26",elevated:"#1C1C26",overlay:"rgba(~~0, 0, 0, 0.65~~)",inverse:"#FAFAFA"},border:{primary:"#27272F",secondary:"#1C1C26",focus:"#7C7CE8",error:"#F87171",width:1},field:{background:"#13131C",backgroundFocused:"#0B0B12",backgroundDisabled:"#1C1C26",border:"#27272F",borderFocused:"#3D5FB0",borderError:"#8A2F42",label:"#E4E6EE",text:"#FAFAFA",textDisabled:"#52525B",placeholder:"#84848D",placeholderDisabled:"#52525B",icon:"#8B8B95",iconFocused:"#D4D4DB",iconDisabled:"#52525B",caret:"#7C9EF0",message:"#F87171"},surface:{pressed:"rgba(255, 255, 255, 0.08)",hovered:"rgba(255, 255, 255, 0.05)",selected:"rgba(124, 124, 232, 0.18)",disabled:"#1C1C26"},glass:{fill:"rgba(255, 255, 255, 0.28)",border:"rgba(255, 255, 255, 0.45)",on:"#0F0F1A",badge:"#FFFFFF"},skeleton:{background:"#1C1C26",highlight:"#27272F"},avatarPalette:["#8B8BEE","#2DD4BF","#FCD34D","#F472B6","#60A5FA","#A78BFA","#34D399","#F87171"]},typography:typography,spacing:spacing,radius:radius,cornerSmoothing:SQUIRCLE_SMOOTHING,shadows:darkShadows,motion:motion,components:components,gradients:{}};
1	+ "use strict";import{SQUIRCLE_SMOOTHING}from"../utils/squircle.js";import{darkTokens,lightTokens}from"./tokens.generated.js";const SPRINGS={gentle:{damping:26,stiffness:240,mass:.9},bouncy:{damping:16,stiffness:200,mass:.7},snappy:{damping:20,stiffness:300,mass:.7}},compose=s=>({...s,motion:{...s.motion,spring:SPRINGS,fadeDuration:s.motion.duration.fast},cornerSmoothing:SQUIRCLE_SMOOTHING,settings:{icons:{},gradients:{},textVariants:{},components:{}}});export const lightTheme=compose(lightTokens);export const darkTheme=compose(darkTokens);

package/lib/module/utils/color.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";export const ACCENT_PRESSED_TINT="rgba(0, 0, 0, 0.12)";export const tintOf=(t,n,r)=>{const e=/^#([0-9a-f]{6})$/i.exec(t);if(!e)return r;const o=Math.round(255n).toString(16).padStart(2,"0");return`#${e[1]}${o}`};const channelsOf=t=>{const n=/^#([0-9a-f]{6})$/i.exec(t);if(!n)return null;const r=Number.parseInt(n[1],16);return[r>>16&255,r>>8&255,255&r]};export const ~~blendOf~~=(t,n,r,e)=>{const o=channelsOf(t),a=channelsOf(r);if(!o~~\|\|!a~~)return e;return`#${o.map((t,r)=>Math.round(tn+a[r]*(1-n))).map(t=>t.toString(16).padStart(2,"0")).join("")}`.toUpperCase()};
1	+ "use strict";export const ACCENT_PRESSED_TINT="rgba(0, 0, 0, 0.12)";export const tintOf=(t,r,e)=>{const s=/^#([0-9a-f]{6})$/i.exec(t);if(!s)return e;const a=Math.round(255r).toString(16).padStart(2,"0");return`#${s[1]}${a}`};const channelsOf=t=>{const r=/^#([0-9a-f]{6})$/i.exec(t);if(!r)return null;const e=Number.parseInt(r[1],16);return[e>>16&255,e>>8&255,255&e]},rgbaOf=t=>{const r=/^#([0-9a-f]{3}\|[0-9a-f]{6}\|[0-9a-f]{8})$/i.exec(t);if(r){const t=3===r[1].length?[...r[1]].map(t=>t+t).join(""):r[1],n=r=>Number.parseInt(t.slice(r,r+2),16);return[n(0),n(2),n(4),8===t.length?n(6)/255:1]}const e=/^rgba?$\s([\d.]+)\s,\s([\d.]+)\s,\s([\d.]+)\s(?:,\s([\d.]+)\s)?$$/i.exec(t);return e?[Number(e[1]),Number(e[2]),Number(e[3]),void 0===e[4]?1:Number(e[4])]:null};export const withAlpha=(t,r)=>{const e=rgbaOf(t);return e?`rgba(${e[0]}, ${e[1]}, ${e[2]}, ${r})`:null};export const transparentOf=t=>withAlpha(t,0)??"transparent";export const blendOf=(t,r,e,s)=>{const a=channelsOf(t),o=channelsOf(e);if(!a\|\|!o)return s;return`#${a.map((t,e)=>Math.round(tr+o[e]*(1-r))).map(t=>t.toString(16).padStart(2,"0")).join("")}`.toUpperCase()};

package/lib/typescript/commonjs/components/AmountSlider/AmountSlider.d.ts CHANGED Viewed

@@ -30,7 +30,7 @@ export interface AmountSliderProps {
      */
     formatInput?: (value: number) => string;
     /**
-     * Duration in ms of one digit roll. Default `theme.motion.duration.normal`,
+     * Duration in ms of one digit roll. Default `theme.motion.duration.default`,
      * which the ThemeProvider collapses to 0 when the OS asks for reduced
      * motion.
      */

package/lib/typescript/commonjs/components/AnimatePresence/AnimatePresence.d.ts CHANGED Viewed

@@ -10,7 +10,7 @@ export interface AnimatePresenceProps {
     children?: React.ReactNode;
     /** Enter/exit preset. Default `'fade'`. */
     preset?: PresencePreset;
-    /** Animation duration (ms). Defaults to `theme.motion.duration.normal`. */
+    /** Animation duration (ms). Defaults to `theme.motion.duration.default`. */
     duration?: number;
     style?: StyleProp<ViewStyle>;
     testID?: string;

package/lib/typescript/commonjs/components/AppBar/AppBar.d.ts CHANGED Viewed

@@ -39,14 +39,14 @@ export interface AppBarProps {
     onBack?: () => void;
     /**
      * The page gutter: the distance from the screen edge to the VISIBLE edge of the outermost
-     * glyph. The bar subtracts the empty space inside an action button (button size minus
-     * `theme.components.appBar.iconSize`, halved; the text padding for a text action). A
+     * glyph. The bar subtracts the empty space inside an action button (the 44 pt button minus
+     * the 24 pt icon, halved; the text padding for a text action). A
      * `leading` or `trailing` node is taken to draw to its own edge. Default: the bar's own
-     * `spacing.xs` padding.
+     * `space.xs` padding.
      */
     gutter?: number;
     /**
-     * Title typography: a `Text` variant, or one registered in `theme.textVariants`.
+     * Title typography: a `Text` variant, or one registered in `theme.settings.textVariants`.
      * Replaces the bar variant's size and weight. Default: the bar variant's own title style.
      */
     titleVariant?: TextVariant | (string & {});

package/lib/typescript/commonjs/components/AppIcon/AppIcon.d.ts CHANGED Viewed

@@ -50,7 +50,7 @@ export interface AppIconProps {
     name: AppIconName;
     /** Size token or a pixel number. Default `'md'` (22). */
     size?: AppIconSize | number;
-    /** Any colour string. Default `theme.colors.text.primary`. */
+    /** Any colour string. Default `theme.colors["text-body"]`. */
     color?: string;
     /** Iconsax style. Default `'linear'`. Names missing in a style fall back to linear. */
     variant?: IconVariant;

package/lib/typescript/commonjs/components/AppIcon/defaultIcons.d.ts CHANGED Viewed

@@ -3,7 +3,7 @@
  * themselves: the password eye, the error glyph, SearchBar's magnifier and
  * clear button, FilePicker's attachment, OptionSheet's selected tick. Every
  * one is an AppIcon, so an app gets the design system's glyphs with zero
- * setup; `theme.icons` still wins when an app registers its own.
+ * setup; `theme.settings.icons` still wins when an app registers its own.
  */
 import type { IconRegistry } from "../../theme/types";
 export declare const defaultIcons: Required<IconRegistry>;

package/lib/typescript/commonjs/components/Avatar/Avatar.d.ts CHANGED Viewed

@@ -33,8 +33,9 @@ export type AvatarStatusPosition = "topRight" | "bottomRight";
  * in the tone, the soft Button's recipe. `neutral` is the quiet grey on
  * primary text; `secondary` is the theme's secondary surface and its ink.
  */
-export type AvatarTone = "neutral" | "primary" | "secondary" | "success" | "warning" | "error" | "info";
-/** The fill and the ink (the tone as text, `toneText`) of an initials disc in a tone. Shared with ProfilePicker's placeholder. */
+export type AvatarTone = "neutral" | "primary" | "secondary" | "success" | "warning" | "danger" | "info";
+export declare const AVATAR_COLORS: readonly ["avatar-1", "avatar-2", "avatar-3", "avatar-4", "avatar-5", "avatar-6", "avatar-7", "avatar-8"];
+/** The fill and the ink (the tone as text, the `<tone>-text` colour names) of an initials disc in a tone. Shared with ProfilePicker's placeholder. */
 export declare const avatarToneColors: (theme: Theme, tone: AvatarTone) => {
     background: string;
     color: string;
@@ -63,8 +64,7 @@ export interface AvatarProps {
     backgroundColor?: string;
     color?: string;
     /**
-     * Per-instance initials font size in pixels. Wins over theme tokens
-     * (`avatar.fontSize` and `avatar.fontSizeRatio`) and the size-derived default.
+     * Per-instance initials font size in pixels. Wins over the size-derived default.
      */
     fontSize?: number;
     /**

package/lib/typescript/commonjs/components/Badge/Badge.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import type React from "react";
 import type { View as RNView, StyleProp, TextStyle, ViewStyle } from "react-native";
 export type BadgeVariant = "standard" | "dot";
-export type BadgeTone = "primary" | "success" | "warning" | "error" | "neutral" | "info";
+export type BadgeTone = "primary" | "success" | "warning" | "danger" | "neutral" | "info";
 export type BadgeSize = "sm" | "md";
 export type BadgeAnchor = "topRight" | "topLeft" | "bottomRight" | "bottomLeft";
 export interface BadgeProps {

package/lib/typescript/commonjs/components/Banner/Banner.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import type React from "react";
 import type { View as RNView, StyleProp, ViewStyle } from "react-native";
 import type { HapticType } from "../../utils/hapticUtils";
-export type BannerVariant = "info" | "success" | "warning" | "error" | "neutral";
+export type BannerVariant = "info" | "success" | "warning" | "danger" | "neutral";
 /**
  * How assistive tech treats the banner. `'alert'` announces it as it appears
  * (an error, a lost connection); `'summary'` and `'none'` are for a calm

package/lib/typescript/commonjs/components/BarChart/BarChart.d.ts CHANGED Viewed

@@ -16,7 +16,7 @@
  */
 import type { View as RNView, StyleProp, ViewStyle } from "react-native";
 import type { HapticType } from "../../utils";
-export type BarChartTone = "primary" | "success" | "warning" | "error" | "info" | "neutral";
+export type BarChartTone = "primary" | "success" | "warning" | "danger" | "info" | "neutral";
 export interface BarChartDatum {
     /** The full name of the bar, read aloud and written in the callout: "Mon 06-Oct-2026". */
     label: string;

package/lib/typescript/commonjs/components/BottomNavigation/BottomNavigation.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import React from "react";
 import type { View as RNView, StyleProp, TextStyle, ViewStyle } from "react-native";
 import type { ScrollDirection } from "../../hooks/useScrollDirection";
-import type { ShadowScale } from "../../theme/types";
+import type { ShadowName } from "../../theme/types";
 import type { HapticType } from "../../utils";
 import type { SlotIcon, SlotIconState } from "../AppIcon";
 /**
@@ -35,7 +35,7 @@ export type BottomNavigationRadius = number | "pill";
  */
 export type BottomNavigationIndicatorRadius = number | "auto";
 /** Shadow under the bar surface: a theme shadow level, or `none`. */
-export type BottomNavigationElevation = keyof ShadowScale;
+export type BottomNavigationElevation = "none" | ShadowName;
 export type TabBadge = number | string | boolean | null;
 /** What a tab knows about itself when it draws its icon. */
 export interface TabIconProps extends SlotIconState {
@@ -92,7 +92,7 @@ export interface BottomNavigationCenterAction {
     size?: number;
     /** Fill of the circle. Default the theme's `primary`. */
     color?: string;
-    /** Ink of the icon in the circle. Default the theme's `onPrimary`. */
+    /** Ink of the icon in the circle. Default the theme's `on-primary`. */
     iconColor?: string;
     /** Pixel size of the icon in the circle. Default 24. */
     iconSize?: number;
@@ -157,8 +157,8 @@ export interface BottomNavigationProps {
     /**
      * Corner radius of the active tab's background on the `pill`, `floating`,
      * `solid`, `tile` and `expand` variants. `auto` (default) takes the bar's
-     * radius once one is set through `radius` or the `radius` token, and
-     * stays fully round while none is. A number sets the background's own
+     * radius once one is set through `radius`, and stays fully round while
+     * none is. A number sets the background's own
      * radius whatever the bar's. Capped at half the background's height, since
      * Android squares off a larger radius, so a large number is fully round.
      */
@@ -170,14 +170,12 @@ export interface BottomNavigationProps {
      */
     elevation?: BottomNavigationElevation;
     /**
-     * Size of every tab icon in pixels. Default 18, or
-     * `components.bottomNavigation.iconSize`. The active pill follows it.
+     * Size of every tab icon in pixels. Default 18. The active pill follows it.
      */
     iconSize?: number;
     /**
      * Air between the bar surface and the screen's left and right edges, in
-     * pixels, on every variant. Default 16, or
-     * `components.bottomNavigation.floatingMargin`.
+     * pixels, on every variant. Default 16.
      */
     marginHorizontal?: number;
     /**
@@ -185,7 +183,7 @@ export interface BottomNavigationProps {
      * `floating` and `tile` capsules and 0 for a docked bar. Above zero it
      * lifts any variant off the screen edge. Over a safe-area inset (a home
      * indicator or Android's system buttons) the lift is the inset plus
-     * `theme.spacing.sm`, never less than this margin.
+     * `theme.space.sm`, never less than this margin.
      */
     marginVertical?: number;
     /**

package/lib/typescript/commonjs/components/BottomSheet/BottomSheet.d.ts CHANGED Viewed

@@ -92,10 +92,10 @@ export interface BottomSheetProps {
     scrollEventThrottle?: number;
     /**
      * @deprecated Backdrop opacity is now controlled by the theme token
-     * `colors.background.overlay` (alpha baked into the rgba value). Animated
+     * `colors.scrim` (alpha baked into the rgba value). Animated
      * opacity on the backdrop was unreliable under Fabric view-flattening, so
      * the scrim is now a static plain View. To tune dim level, override
-     * `theme.colors.background.overlay` in your theme bridge.
+     * `theme.colors.scrim` in your theme bridge.
      */
     backdropOpacity?: number;
     /**