@webority/mobile-ui 0.16.1 → 0.16.2

package/lib/commonjs/components/Calendar/Calendar.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Calendar=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_CalendarDay=require("./CalendarDay.js"),_calendarDates=require("./calendarDates.js"),_calendarStyles=require("./calendarStyles.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_TONE={holiday:"error",event:"primary",pending:"warning"},MAX_DOTS=3,DAY_TEXT_MAX_SCALE=1.5,toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":return e.colors.error;case"info":return e.colors.info;case"primary":return e.colors.primary;default:return e.colors.text.secondary}},toneInk=(e,t)=>"neutral"===t?e.colors.text.secondary:e.colors.toneText[t],Calendar=exports.Calendar=(0,_react.forwardRef)((e,t)=>{const{mode:a="single",value:r,onChange:n,month:i,onMonthChange:s,minDate:l,maxDate:o,disabledDates:c,weekStartsOn:d=0,locale:u="en-IN",markedDates:_,strikeMarkedInRange:m=!1,cellSize:y,haptic:h,accessibilityLabel:x,style:g,headerLabelStyle:v,navButtonStyle:p,testID:D}=e,b=(0,_index2.useTheme)(),f=(0,_index.usePresenceMotion)(),N=(0,_react.useMemo)(()=>(0,_calendarStyles.buildCalendarStyles)(b),[b]),[M,j]=(0,_index.useControllableState)({value:i?(0,_calendarDates.startOfMonth)(i):void 0,defaultValue:(0,_calendarDates.startOfMonth)(r?.start??new Date),onChange:s}),S=12*M.getFullYear()+M.getMonth(),k=r?.start?(0,_calendarDates.startOfDay)(r.start):null,w="range"===a&&r?.end?(0,_calendarDates.startOfDay)(r.end):null,T=k?.getTime()??null,R=w?.getTime()??null,C=(0,_calendarDates.toIso)(new Date),I=l?(0,_calendarDates.startOfDay)(l).getTime():null,L=o?(0,_calendarDates.startOfDay)(o).getTime():null,A=(0,_react.useMemo)(()=>new Set((c??[]).map(e=>(0,_calendarDates.toIso)(e))),[c]),E=(0,_react.useCallback)(e=>null!==I&&e.getTime()<I||null!==L&&e.getTime()>L||A.has((0,_calendarDates.toIso)(e)),[I,L,A]),O=(0,_react.useMemo)(()=>{const e=new Map;for(const t of _??[]){const a=(0,_calendarDates.toIso)(t.date);let r=e.get(a);r||(r={dots:[],holiday:!1,spoken:[]},e.set(a,r));const n=t.tone??DEFAULT_TONE[t.kind],i=toneColor(b,n);r.dots.length<3&&r.dots.push({key:`${t.kind}-${r.dots.length}`,color:i}),"holiday"===t.kind&&(r.holiday=!0,r.holidayInk??=toneInk(b,n)),t.label&&r.spoken.push(t.label),r.spoken.push(t.kind)}return e},[_,b]),V=(0,_react.useMemo)(()=>(0,_calendarDates.buildMonthMatrix)(new Date(Math.floor(S/12),S%12,1),d),[S,d]),F=(0,_react.useMemo)(()=>(0,_calendarDates.weekdayLabels)(u,d),[u,d]),P=(0,_react.useMemo)(()=>new Intl.DateTimeFormat(u,{month:"long",year:"numeric"}),[u]),q=(0,_react.useMemo)(()=>new Intl.DateTimeFormat(u,{weekday:"short",day:"numeric",month:"long"}),[u]),z=P.format(M),B=null===I||(0,_calendarDates.startOfMonth)(new Date(I)).getTime()<M.getTime(),H=null===L||(0,_calendarDates.startOfMonth)(new Date(L)).getTime()>M.getTime(),X=(0,_react.useRef)((0,_index2.createAnimatedValue)(0)).current,Z=(0,_react.useRef)((0,_index2.createAnimatedValue)(1)).current,$=(0,_react.useRef)(null);(0,_react.useEffect)(()=>()=>$.current?.stop(),[]);const U=(0,_react.useCallback)(e=>{!1!==h&&(0,_index3.triggerHaptic)("impactLight");const t=b.components.dateRangePicker,a=t?.monthSlideDistance??32,r=t?.monthSlideOutDuration??b.motion.duration.fast,n=t?.monthSlideInDuration??b.motion.duration.fast,[i]=f.range(-e*a,0),[s]=f.range(e*a,0),l=f.reduced?f.duration("fast"):r,o=f.reduced?f.duration("fast"):n;$.current?.stop(),$.current=_reactNative.Animated.sequence([_reactNative.Animated.parallel([_reactNative.Animated.timing(X,{toValue:i,duration:r,easing:_reactNative.Easing.out(_reactNative.Easing.quad),useNativeDriver:!0}),_reactNative.Animated.timing(Z,{toValue:0,duration:l,useNativeDriver:!0})]),_reactNative.Animated.timing(X,{toValue:s,duration:0,useNativeDriver:!0}),_reactNative.Animated.parallel([_reactNative.Animated.timing(X,{toValue:0,duration:n,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!0}),_reactNative.Animated.timing(Z,{toValue:1,duration:o,useNativeDriver:!0})])]),$.current.start();const c=(0,_calendarDates.addMonths)(M,e);j(c),_reactNative.AccessibilityInfo.announceForAccessibility(P.format(c))},[h,M,Z,P,X,f,j,b]),Y=(0,_react.useCallback)(()=>U(-1),[U]),G=(0,_react.useCallback)(()=>U(1),[U]),pressDay=e=>{if(E(e.date))return;const t=(0,_index3.resolveHaptic)(h,"selection");t&&(0,_index3.triggerHaptic)(t);const r=e.date;"single"===a||!k||w||r.getTime()<k.getTime()?n({start:r}):n({start:k,end:r}),e.inMonth||j((0,_calendarDates.startOfMonth)(r))},W=(0,_react.useRef)(pressDay);(0,_react.useLayoutEffect)(()=>{W.current=pressDay});const J=(0,_react.useCallback)(e=>W.current(e),[]),K=void 0===y?void 0:Math.max(y,_calendarStyles.MIN_CELL_SIZE),Q=(0,_react.useMemo)(()=>void 0===K?{flex:1}:{width:K},[K]),ee=(0,_react.useMemo)(()=>void 0===K?{flex:1,aspectRatio:1,minHeight:_calendarStyles.MIN_CELL_SIZE}:{width:K,height:K},[K]),te=b.components.dateRangePicker?.navButtonSize??_calendarStyles.NAV_BUTTON_SIZE,ae=Math.max(b.spacing.sm,(_calendarStyles.MIN_CELL_SIZE-te)/2),re=Math.min(b.maxFontSizeMultiplier??1.5,1.5),ne=[];for(let e=0;e<_calendarDates.GRID_CELLS;e+=7)ne.push(V.slice(e,e+7));return(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,style:[N.root,g],testID:D,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:N.headerRow,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:Y,disabled:!B,style:({pressed:e})=>[N.navBtn,e&&N.navBtnPressed,!B&&N.navBtnDisabled,p],accessibilityRole:"button",accessibilityLabel:"Previous month",accessibilityState:{disabled:!B},"aria-disabled":!B,hitSlop:ae,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:N.navText,maxFontSizeMultiplier:re,children:"‹"})}),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[N.headerLabelWrap,{opacity:Z,transform:[{translateX:X}]},v],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:N.headerLabel,accessibilityRole:"header",accessibilityLabel:x?`${x}, ${z}`:void 0,maxFontSizeMultiplier:b.maxFontSizeMultiplier,children:z})}),(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:G,disabled:!H,style:({pressed:e})=>[N.navBtn,e&&N.navBtnPressed,!H&&N.navBtnDisabled,p],accessibilityRole:"button",accessibilityLabel:"Next month",accessibilityState:{disabled:!H},"aria-disabled":!H,hitSlop:ae,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:N.navText,maxFontSizeMultiplier:re,children:"›"})})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.weekdayRow,accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:F.map(({weekday:e,label:t})=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:[N.weekdayCell,Q],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:N.weekdayText,maxFontSizeMultiplier:re,children:t})},e))}),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{opacity:Z,transform:[{translateX:X}]},children:ne.map(e=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.gridRow,children:e.map(e=>{const t=e.date.getTime(),r=null!==T&&t===T,n=null!==R&&t===R,i=null!==T&&null!==R&&t>=T&&t<=R,s=i&&!r&&!n,l=e.iso===C,o=O.get(e.iso),c=m&&i&&!0===o?.holiday,d=[q.format(e.date),...o?.spoken??[]];return l&&d.push("today"),"range"===a&&(r&&n?d.push("start and end of your range"):r?d.push("start of your range"):n?d.push("end of your range"):s&&d.push("in your range")),c&&d.push("not counted"),(0,_jsxRuntime.jsx)(_CalendarDay.CalendarDay,{cell:e,accessibilityLabel:d.join(", "),disabled:E(e.date),edge:r||n,mid:s,barLeft:i&&(n||s)&&!(r&&n),barRight:i&&(r||s)&&!(r&&n),today:l,struck:c,dots:o?.dots,inkColor:o?.holidayInk,cellStyle:ee,styles:N,maxFontSizeMultiplier:re,onPressDay:J},e.iso)})},e[0].iso))})]})});Calendar.displayName="Calendar";var _default=exports.default=Calendar;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Calendar=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_CalendarDay=require("./CalendarDay.js"),_calendarDates=require("./calendarDates.js"),_calendarStyles=require("./calendarStyles.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_TONE={holiday:"error",event:"primary",pending:"warning"},MAX_DOTS=3,DAY_TEXT_MAX_SCALE=1.5,toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":case"danger":return e.colors.error;case"info":return e.colors.info;case"primary":return e.colors.primary;default:return e.colors.text.secondary}},toneInk=(e,t)=>"neutral"===t?e.colors.text.secondary:e.colors.toneText["danger"===t?"error":t],Calendar=exports.Calendar=(0,_react.forwardRef)((e,t)=>{const{mode:a="single",value:r,onChange:n,month:i,onMonthChange:s,minDate:l,maxDate:o,disabledDates:c,weekStartsOn:d=0,locale:u="en-IN",markedDates:_,strikeMarkedInRange:m=!1,cellSize:y,haptic:h,accessibilityLabel:x,style:g,headerLabelStyle:v,navButtonStyle:p,testID:D}=e,b=(0,_index2.useTheme)(),f=(0,_index.usePresenceMotion)(),N=(0,_react.useMemo)(()=>(0,_calendarStyles.buildCalendarStyles)(b),[b]),[M,j]=(0,_index.useControllableState)({value:i?(0,_calendarDates.startOfMonth)(i):void 0,defaultValue:(0,_calendarDates.startOfMonth)(r?.start??new Date),onChange:s}),S=12*M.getFullYear()+M.getMonth(),k=r?.start?(0,_calendarDates.startOfDay)(r.start):null,w="range"===a&&r?.end?(0,_calendarDates.startOfDay)(r.end):null,T=k?.getTime()??null,R=w?.getTime()??null,C=(0,_calendarDates.toIso)(new Date),I=l?(0,_calendarDates.startOfDay)(l).getTime():null,L=o?(0,_calendarDates.startOfDay)(o).getTime():null,A=(0,_react.useMemo)(()=>new Set((c??[]).map(e=>(0,_calendarDates.toIso)(e))),[c]),E=(0,_react.useCallback)(e=>null!==I&&e.getTime()<I||null!==L&&e.getTime()>L||A.has((0,_calendarDates.toIso)(e)),[I,L,A]),O=(0,_react.useMemo)(()=>{const e=new Map;for(const t of _??[]){const a=(0,_calendarDates.toIso)(t.date);let r=e.get(a);r||(r={dots:[],holiday:!1,spoken:[]},e.set(a,r));const n=t.tone??DEFAULT_TONE[t.kind],i=toneColor(b,n);r.dots.length<3&&r.dots.push({key:`${t.kind}-${r.dots.length}`,color:i}),"holiday"===t.kind&&(r.holiday=!0,r.holidayInk??=toneInk(b,n)),t.label&&r.spoken.push(t.label),r.spoken.push(t.kind)}return e},[_,b]),V=(0,_react.useMemo)(()=>(0,_calendarDates.buildMonthMatrix)(new Date(Math.floor(S/12),S%12,1),d),[S,d]),F=(0,_react.useMemo)(()=>(0,_calendarDates.weekdayLabels)(u,d),[u,d]),P=(0,_react.useMemo)(()=>new Intl.DateTimeFormat(u,{month:"long",year:"numeric"}),[u]),q=(0,_react.useMemo)(()=>new Intl.DateTimeFormat(u,{weekday:"short",day:"numeric",month:"long"}),[u]),z=P.format(M),B=null===I||(0,_calendarDates.startOfMonth)(new Date(I)).getTime()<M.getTime(),H=null===L||(0,_calendarDates.startOfMonth)(new Date(L)).getTime()>M.getTime(),X=(0,_react.useRef)((0,_index2.createAnimatedValue)(0)).current,Z=(0,_react.useRef)((0,_index2.createAnimatedValue)(1)).current,$=(0,_react.useRef)(null);(0,_react.useEffect)(()=>()=>$.current?.stop(),[]);const U=(0,_react.useCallback)(e=>{!1!==h&&(0,_index3.triggerHaptic)("impactLight");const t=b.components.dateRangePicker,a=t?.monthSlideDistance??32,r=t?.monthSlideOutDuration??b.motion.duration.fast,n=t?.monthSlideInDuration??b.motion.duration.fast,[i]=f.range(-e*a,0),[s]=f.range(e*a,0),l=f.reduced?f.duration("fast"):r,o=f.reduced?f.duration("fast"):n;$.current?.stop(),$.current=_reactNative.Animated.sequence([_reactNative.Animated.parallel([_reactNative.Animated.timing(X,{toValue:i,duration:r,easing:_reactNative.Easing.out(_reactNative.Easing.quad),useNativeDriver:!0}),_reactNative.Animated.timing(Z,{toValue:0,duration:l,useNativeDriver:!0})]),_reactNative.Animated.timing(X,{toValue:s,duration:0,useNativeDriver:!0}),_reactNative.Animated.parallel([_reactNative.Animated.timing(X,{toValue:0,duration:n,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!0}),_reactNative.Animated.timing(Z,{toValue:1,duration:o,useNativeDriver:!0})])]),$.current.start();const c=(0,_calendarDates.addMonths)(M,e);j(c),_reactNative.AccessibilityInfo.announceForAccessibility(P.format(c))},[h,M,Z,P,X,f,j,b]),Y=(0,_react.useCallback)(()=>U(-1),[U]),G=(0,_react.useCallback)(()=>U(1),[U]),pressDay=e=>{if(E(e.date))return;const t=(0,_index3.resolveHaptic)(h,"selection");t&&(0,_index3.triggerHaptic)(t);const r=e.date;"single"===a||!k||w||r.getTime()<k.getTime()?n({start:r}):n({start:k,end:r}),e.inMonth||j((0,_calendarDates.startOfMonth)(r))},W=(0,_react.useRef)(pressDay);(0,_react.useLayoutEffect)(()=>{W.current=pressDay});const J=(0,_react.useCallback)(e=>W.current(e),[]),K=void 0===y?void 0:Math.max(y,_calendarStyles.MIN_CELL_SIZE),Q=(0,_react.useMemo)(()=>void 0===K?{flex:1}:{width:K},[K]),ee=(0,_react.useMemo)(()=>void 0===K?{flex:1,aspectRatio:1,minHeight:_calendarStyles.MIN_CELL_SIZE}:{width:K,height:K},[K]),te=b.components.dateRangePicker?.navButtonSize??_calendarStyles.NAV_BUTTON_SIZE,ae=Math.max(b.spacing.sm,(_calendarStyles.MIN_CELL_SIZE-te)/2),re=Math.min(b.maxFontSizeMultiplier??1.5,1.5),ne=[];for(let e=0;e<_calendarDates.GRID_CELLS;e+=7)ne.push(V.slice(e,e+7));return(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,style:[N.root,g],testID:D,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:N.headerRow,children:[(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:Y,disabled:!B,style:({pressed:e})=>[N.navBtn,e&&N.navBtnPressed,!B&&N.navBtnDisabled,p],accessibilityRole:"button",accessibilityLabel:"Previous month",accessibilityState:{disabled:!B},"aria-disabled":!B,hitSlop:ae,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:N.navText,maxFontSizeMultiplier:re,children:"‹"})}),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[N.headerLabelWrap,{opacity:Z,transform:[{translateX:X}]},v],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:N.headerLabel,accessibilityRole:"header",accessibilityLabel:x?`${x}, ${z}`:void 0,maxFontSizeMultiplier:b.maxFontSizeMultiplier,children:z})}),(0,_jsxRuntime.jsx)(_reactNative.Pressable,{onPress:G,disabled:!H,style:({pressed:e})=>[N.navBtn,e&&N.navBtnPressed,!H&&N.navBtnDisabled,p],accessibilityRole:"button",accessibilityLabel:"Next month",accessibilityState:{disabled:!H},"aria-disabled":!H,hitSlop:ae,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:N.navText,maxFontSizeMultiplier:re,children:"›"})})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.weekdayRow,accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:F.map(({weekday:e,label:t})=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:[N.weekdayCell,Q],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:N.weekdayText,maxFontSizeMultiplier:re,children:t})},e))}),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:{opacity:Z,transform:[{translateX:X}]},children:ne.map(e=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.gridRow,children:e.map(e=>{const t=e.date.getTime(),r=null!==T&&t===T,n=null!==R&&t===R,i=null!==T&&null!==R&&t>=T&&t<=R,s=i&&!r&&!n,l=e.iso===C,o=O.get(e.iso),c=m&&i&&!0===o?.holiday,d=[q.format(e.date),...o?.spoken??[]];return l&&d.push("today"),"range"===a&&(r&&n?d.push("start and end of your range"):r?d.push("start of your range"):n?d.push("end of your range"):s&&d.push("in your range")),c&&d.push("not counted"),(0,_jsxRuntime.jsx)(_CalendarDay.CalendarDay,{cell:e,accessibilityLabel:d.join(", "),disabled:E(e.date),edge:r||n,mid:s,barLeft:i&&(n||s)&&!(r&&n),barRight:i&&(r||s)&&!(r&&n),today:l,struck:c,dots:o?.dots,inkColor:o?.holidayInk,cellStyle:ee,styles:N,maxFontSizeMultiplier:re,onPressDay:J},e.iso)})},e[0].iso))})]})});Calendar.displayName="Calendar";var _default=exports.default=Calendar;

package/lib/commonjs/components/StatusBadge/StatusBadge.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.StatusBadge=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_index2=require("../Skeleton/index.js"),_jsxRuntime=require("react/jsx-runtime");const sizeMap={sm:{height:22,paddingH:8,fontSize:11,dot:5,gap:5},md:{height:24,paddingH:10,fontSize:12,dot:6,gap:6}},SOFT_FILL_OPACITY=.14,SOFT_BORDER_OPACITY=.4,BORDER_WIDTH=1,toneFor=(e,t)=>{const{toneText:r}=e.colors;switch(t){case"success":return{base:e.colors.success,on:e.colors.onSuccess,ink:r.success};case"warning":return{base:e.colors.warning,on:e.colors.onWarning,ink:r.warning};case"error":return{base:e.colors.error,on:e.colors.onError,ink:r.error};case"info":return{base:e.colors.info,on:e.colors.onInfo,ink:r.info};case"primary":return{base:e.colors.primary,on:e.colors.onPrimary,ink:r.primary};default:return{base:e.colors.text.secondary,on:e.colors.onNeutral,ink:e.colors.text.secondary}}},isHex=e=>"string"==typeof e&&/^#[0-9a-f]{6}$/i.test(e),paletteFor=(e,t,r,o)=>{const s=isHex(o),{base:a,on:n,ink:i}=s?{base:o,on:e.colors.text.inverse,ink:o}:toneFor(e,t),l=!s&&"neutral"===t,c=l?e.colors.background.tertiary:(0,_color.tintOf)(a,.14,e.colors.background.secondary),d=l?e.colors.border.primary:(0,_color.tintOf)(a,.4,a);switch(r){case"solid":return{fill:a,border:a,text:n,dot:n};case"outline":return{fill:"transparent",border:l?d:a,text:i,dot:a};default:return{fill:c,border:d,text:i,dot:a}}},StatusBadge=exports.StatusBadge=(0,_react.forwardRef)((e,t)=>{const{label:r,tone:o="neutral",variant:s="soft",size:a="md",dot:n=!1,color:i,loading:l=!1,accessibilityLabel:c,style:d,textStyle:u,testID:g}=e,x=(0,_index.useTheme)(),b=sizeMap[a],f=(0,_react.useMemo)(()=>paletteFor(x,o,s,i),[x,o,s,i]);return l?(0,_jsxRuntime.jsx)(StatusBadgeSkeleton,{...e}):(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessible:!0,accessibilityRole:"text",accessibilityLabel:c??r,testID:g,style:[styles.base,{minHeight:b.height,paddingHorizontal:b.paddingH,borderRadius:x.radius.full,..._corners.smoothCorners,backgroundColor:f.fill,borderColor:f.border,borderWidth:1},d],children:[n?(0,_jsxRuntime.jsx)(_reactNative.View,{testID:"status-badge-dot",style:{width:b.dot,height:b.dot,borderRadius:b.dot/2,marginRight:b.gap,backgroundColor:f.dot}}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.label,{color:f.text,fontSize:b.fontSize,...(0,_index.fontFor)(x,"semibold")},u],numberOfLines:1,maxFontSizeMultiplier:x.maxFontSizeMultiplier,children:r})]})});StatusBadge.displayName="StatusBadge";const StatusBadgeSkeleton=({label:e,size:t="md",dot:r,style:o})=>{const s=sizeMap[t],a=Math.max(32,Math.min(120,6.5*(e??"").length))+2*s.paddingH+(r?s.dot+s.gap:0);return(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:a,height:s.height,radius:s.height/2,style:[styles.skeleton,o]})};StatusBadgeSkeleton.displayName="StatusBadgeSkeleton",StatusBadge.Skeleton=StatusBadgeSkeleton;const styles=_reactNative.StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},skeleton:{alignSelf:"flex-start"}});var _default=exports.default=StatusBadge;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.StatusBadge=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_toneInk=require("../../theme/toneInk.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_index2=require("../Skeleton/index.js"),_jsxRuntime=require("react/jsx-runtime");const sizeMap={sm:{height:22,paddingH:8,fontSize:11,dot:5,gap:5},md:{height:24,paddingH:10,fontSize:12,dot:6,gap:6}},SOFT_FILL_OPACITY=.14,SOFT_BORDER_OPACITY=.4,BORDER_WIDTH=1,toneFor=(e,t)=>{const{toneText:r}=e.colors;switch(t){case"success":return{base:e.colors.success,on:e.colors.onSuccess,ink:r.success};case"warning":return{base:e.colors.warning,on:e.colors.onWarning,ink:r.warning};case"error":case"danger":return{base:e.colors.error,on:e.colors.onError,ink:r.error};case"info":return{base:e.colors.info,on:e.colors.onInfo,ink:r.info};case"primary":return{base:e.colors.primary,on:e.colors.onPrimary,ink:r.primary};default:return{base:e.colors.text.secondary,on:e.colors.onNeutral,ink:e.colors.text.secondary}}},isHex=e=>"string"==typeof e&&/^#[0-9a-f]{6}$/i.test(e),paletteFor=(e,t,r,o)=>{const s=isHex(o),{base:n,on:a,ink:i}=s?{base:o,on:e.colors.text.inverse,ink:(0,_toneInk.deriveToneInk)(o,[e.colors.background.primary,e.colors.background.secondary,e.colors.background.tertiary],e.mode)}:toneFor(e,t),l=!s&&"neutral"===t,c=l?e.colors.background.tertiary:(0,_color.tintOf)(n,.14,e.colors.background.secondary),d=l?e.colors.border.primary:(0,_color.tintOf)(n,.4,n);switch(r){case"solid":return{fill:n,border:n,text:a,dot:a};case"outline":return{fill:"transparent",border:l?d:n,text:i,dot:n};default:return{fill:c,border:d,text:i,dot:n}}},StatusBadge=exports.StatusBadge=(0,_react.forwardRef)((e,t)=>{const{label:r,tone:o="neutral",variant:s="soft",size:n="md",dot:a=!1,color:i,loading:l=!1,accessibilityLabel:c,style:d,textStyle:u,testID:g}=e,x=(0,_index.useTheme)(),b=sizeMap[n],f=(0,_react.useMemo)(()=>paletteFor(x,o,s,i),[x,o,s,i]);return l?(0,_jsxRuntime.jsx)(StatusBadgeSkeleton,{...e}):(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessible:!0,accessibilityRole:"text",accessibilityLabel:c??r,testID:g,style:[styles.base,{minHeight:b.height,paddingHorizontal:b.paddingH,borderRadius:x.radius.full,..._corners.smoothCorners,backgroundColor:f.fill,borderColor:f.border,borderWidth:1},d],children:[a?(0,_jsxRuntime.jsx)(_reactNative.View,{testID:"status-badge-dot",style:{width:b.dot,height:b.dot,borderRadius:b.dot/2,marginRight:b.gap,backgroundColor:f.dot}}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.label,{color:f.text,fontSize:b.fontSize,...(0,_index.fontFor)(x,"semibold")},u],numberOfLines:1,maxFontSizeMultiplier:x.maxFontSizeMultiplier,children:r})]})});StatusBadge.displayName="StatusBadge";const StatusBadgeSkeleton=({label:e,size:t="md",dot:r,style:o})=>{const s=sizeMap[t],n=Math.max(32,Math.min(120,6.5*(e??"").length))+2*s.paddingH+(r?s.dot+s.gap:0);return(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:n,height:s.height,radius:s.height/2,style:[styles.skeleton,o]})};StatusBadgeSkeleton.displayName="StatusBadgeSkeleton",StatusBadge.Skeleton=StatusBadgeSkeleton;const styles=_reactNative.StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},skeleton:{alignSelf:"flex-start"}});var _default=exports.default=StatusBadge;

package/lib/module/components/Calendar/Calendar.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useCallback,useEffect,useLayoutEffect,useMemo,useRef}from"react";import{AccessibilityInfo,Animated,Easing,Pressable,Text,View}from"react-native";import{useControllableState,usePresenceMotion}from"../../hooks/index.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{CalendarDay}from"./CalendarDay.js";import{addMonths,buildMonthMatrix,GRID_CELLS,startOfDay,startOfMonth,toIso,weekdayLabels}from"./calendarDates.js";import{buildCalendarStyles,MIN_CELL_SIZE,NAV_BUTTON_SIZE}from"./calendarStyles.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_TONE={holiday:"error",event:"primary",pending:"warning"},MAX_DOTS=3,DAY_TEXT_MAX_SCALE=1.5,toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":return e.colors.error;case"info":return e.colors.info;case"primary":return e.colors.primary;default:return e.colors.text.secondary}},toneInk=(e,t)=>"neutral"===t?e.colors.text.secondary:e.colors.toneText[t],Calendar=forwardRef((e,t)=>{const{mode:a="single",value:s,onChange:n,month:i,onMonthChange:r,minDate:o,maxDate:l,disabledDates:d,weekStartsOn:u=0,locale:c="en-IN",markedDates:m,strikeMarkedInRange:h=!1,cellSize:y,haptic:g,accessibilityLabel:f,style:p,headerLabelStyle:b,navButtonStyle:x,testID:M}=e,D=useTheme(),T=usePresenceMotion(),w=useMemo(()=>buildCalendarStyles(D),[D]),[S,_]=useControllableState({value:i?startOfMonth(i):void 0,defaultValue:startOfMonth(s?.start??new Date),onChange:r}),k=12*S.getFullYear()+S.getMonth(),v=s?.start?startOfDay(s.start):null,C="range"===a&&s?.end?startOfDay(s.end):null,I=v?.getTime()??null,L=C?.getTime()??null,E=toIso(new Date),j=o?startOfDay(o).getTime():null,A=l?startOfDay(l).getTime():null,R=useMemo(()=>new Set((d??[]).map(e=>toIso(e))),[d]),V=useCallback(e=>null!==j&&e.getTime()<j||null!==A&&e.getTime()>A||R.has(toIso(e)),[j,A,R]),N=useMemo(()=>{const e=new Map;for(const t of m??[]){const a=toIso(t.date);let s=e.get(a);s||(s={dots:[],holiday:!1,spoken:[]},e.set(a,s));const n=t.tone??DEFAULT_TONE[t.kind],i=toneColor(D,n);s.dots.length<3&&s.dots.push({key:`${t.kind}-${s.dots.length}`,color:i}),"holiday"===t.kind&&(s.holiday=!0,s.holidayInk??=toneInk(D,n)),t.label&&s.spoken.push(t.label),s.spoken.push(t.kind)}return e},[m,D]),O=useMemo(()=>buildMonthMatrix(new Date(Math.floor(k/12),k%12,1),u),[k,u]),F=useMemo(()=>weekdayLabels(c,u),[c,u]),P=useMemo(()=>new Intl.DateTimeFormat(c,{month:"long",year:"numeric"}),[c]),B=useMemo(()=>new Intl.DateTimeFormat(c,{weekday:"short",day:"numeric",month:"long"}),[c]),z=P.format(S),H=null===j||startOfMonth(new Date(j)).getTime()<S.getTime(),Z=null===A||startOfMonth(new Date(A)).getTime()>S.getTime(),X=useRef(createAnimatedValue(0)).current,U=useRef(createAnimatedValue(1)).current,$=useRef(null);useEffect(()=>()=>$.current?.stop(),[]);const q=useCallback(e=>{!1!==g&&triggerHaptic("impactLight");const t=D.components.dateRangePicker,a=t?.monthSlideDistance??32,s=t?.monthSlideOutDuration??D.motion.duration.fast,n=t?.monthSlideInDuration??D.motion.duration.fast,[i]=T.range(-e*a,0),[r]=T.range(e*a,0),o=T.reduced?T.duration("fast"):s,l=T.reduced?T.duration("fast"):n;$.current?.stop(),$.current=Animated.sequence([Animated.parallel([Animated.timing(X,{toValue:i,duration:s,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(U,{toValue:0,duration:o,useNativeDriver:!0})]),Animated.timing(X,{toValue:r,duration:0,useNativeDriver:!0}),Animated.parallel([Animated.timing(X,{toValue:0,duration:n,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(U,{toValue:1,duration:l,useNativeDriver:!0})])]),$.current.start();const d=addMonths(S,e);_(d),AccessibilityInfo.announceForAccessibility(P.format(d))},[g,S,U,P,X,T,_,D]),G=useCallback(()=>q(-1),[q]),Y=useCallback(()=>q(1),[q]),pressDay=e=>{if(V(e.date))return;const t=resolveHaptic(g,"selection");t&&triggerHaptic(t);const s=e.date;"single"===a||!v||C||s.getTime()<v.getTime()?n({start:s}):n({start:v,end:s}),e.inMonth||_(startOfMonth(s))},W=useRef(pressDay);useLayoutEffect(()=>{W.current=pressDay});const J=useCallback(e=>W.current(e),[]),K=void 0===y?void 0:Math.max(y,MIN_CELL_SIZE),Q=useMemo(()=>void 0===K?{flex:1}:{width:K},[K]),ee=useMemo(()=>void 0===K?{flex:1,aspectRatio:1,minHeight:MIN_CELL_SIZE}:{width:K,height:K},[K]),te=D.components.dateRangePicker?.navButtonSize??NAV_BUTTON_SIZE,ae=Math.max(D.spacing.sm,(MIN_CELL_SIZE-te)/2),se=Math.min(D.maxFontSizeMultiplier??1.5,1.5),ne=[];for(let e=0;e<GRID_CELLS;e+=7)ne.push(O.slice(e,e+7));return _jsxs(View,{ref:t,style:[w.root,p],testID:M,children:[_jsxs(View,{style:w.headerRow,children:[_jsx(Pressable,{onPress:G,disabled:!H,style:({pressed:e})=>[w.navBtn,e&&w.navBtnPressed,!H&&w.navBtnDisabled,x],accessibilityRole:"button",accessibilityLabel:"Previous month",accessibilityState:{disabled:!H},"aria-disabled":!H,hitSlop:ae,children:_jsx(Text,{style:w.navText,maxFontSizeMultiplier:se,children:"‹"})}),_jsx(Animated.View,{style:[w.headerLabelWrap,{opacity:U,transform:[{translateX:X}]},b],children:_jsx(Text,{style:w.headerLabel,accessibilityRole:"header",accessibilityLabel:f?`${f}, ${z}`:void 0,maxFontSizeMultiplier:D.maxFontSizeMultiplier,children:z})}),_jsx(Pressable,{onPress:Y,disabled:!Z,style:({pressed:e})=>[w.navBtn,e&&w.navBtnPressed,!Z&&w.navBtnDisabled,x],accessibilityRole:"button",accessibilityLabel:"Next month",accessibilityState:{disabled:!Z},"aria-disabled":!Z,hitSlop:ae,children:_jsx(Text,{style:w.navText,maxFontSizeMultiplier:se,children:"›"})})]}),_jsx(View,{style:w.weekdayRow,accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:F.map(({weekday:e,label:t})=>_jsx(View,{style:[w.weekdayCell,Q],children:_jsx(Text,{style:w.weekdayText,maxFontSizeMultiplier:se,children:t})},e))}),_jsx(Animated.View,{style:{opacity:U,transform:[{translateX:X}]},children:ne.map(e=>_jsx(View,{style:w.gridRow,children:e.map(e=>{const t=e.date.getTime(),s=null!==I&&t===I,n=null!==L&&t===L,i=null!==I&&null!==L&&t>=I&&t<=L,r=i&&!s&&!n,o=e.iso===E,l=N.get(e.iso),d=h&&i&&!0===l?.holiday,u=[B.format(e.date),...l?.spoken??[]];return o&&u.push("today"),"range"===a&&(s&&n?u.push("start and end of your range"):s?u.push("start of your range"):n?u.push("end of your range"):r&&u.push("in your range")),d&&u.push("not counted"),_jsx(CalendarDay,{cell:e,accessibilityLabel:u.join(", "),disabled:V(e.date),edge:s||n,mid:r,barLeft:i&&(n||r)&&!(s&&n),barRight:i&&(s||r)&&!(s&&n),today:o,struck:d,dots:l?.dots,inkColor:l?.holidayInk,cellStyle:ee,styles:w,maxFontSizeMultiplier:se,onPressDay:J},e.iso)})},e[0].iso))})]})});Calendar.displayName="Calendar";export{Calendar};export default Calendar;
+"use strict";import{forwardRef,useCallback,useEffect,useLayoutEffect,useMemo,useRef}from"react";import{AccessibilityInfo,Animated,Easing,Pressable,Text,View}from"react-native";import{useControllableState,usePresenceMotion}from"../../hooks/index.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{CalendarDay}from"./CalendarDay.js";import{addMonths,buildMonthMatrix,GRID_CELLS,startOfDay,startOfMonth,toIso,weekdayLabels}from"./calendarDates.js";import{buildCalendarStyles,MIN_CELL_SIZE,NAV_BUTTON_SIZE}from"./calendarStyles.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_TONE={holiday:"error",event:"primary",pending:"warning"},MAX_DOTS=3,DAY_TEXT_MAX_SCALE=1.5,toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"error":case"danger":return e.colors.error;case"info":return e.colors.info;case"primary":return e.colors.primary;default:return e.colors.text.secondary}},toneInk=(e,t)=>"neutral"===t?e.colors.text.secondary:e.colors.toneText["danger"===t?"error":t],Calendar=forwardRef((e,t)=>{const{mode:a="single",value:s,onChange:n,month:i,onMonthChange:r,minDate:o,maxDate:l,disabledDates:d,weekStartsOn:u=0,locale:c="en-IN",markedDates:m,strikeMarkedInRange:h=!1,cellSize:y,haptic:g,accessibilityLabel:f,style:p,headerLabelStyle:b,navButtonStyle:x,testID:M}=e,D=useTheme(),T=usePresenceMotion(),w=useMemo(()=>buildCalendarStyles(D),[D]),[S,_]=useControllableState({value:i?startOfMonth(i):void 0,defaultValue:startOfMonth(s?.start??new Date),onChange:r}),k=12*S.getFullYear()+S.getMonth(),v=s?.start?startOfDay(s.start):null,C="range"===a&&s?.end?startOfDay(s.end):null,I=v?.getTime()??null,L=C?.getTime()??null,E=toIso(new Date),j=o?startOfDay(o).getTime():null,A=l?startOfDay(l).getTime():null,R=useMemo(()=>new Set((d??[]).map(e=>toIso(e))),[d]),V=useCallback(e=>null!==j&&e.getTime()<j||null!==A&&e.getTime()>A||R.has(toIso(e)),[j,A,R]),N=useMemo(()=>{const e=new Map;for(const t of m??[]){const a=toIso(t.date);let s=e.get(a);s||(s={dots:[],holiday:!1,spoken:[]},e.set(a,s));const n=t.tone??DEFAULT_TONE[t.kind],i=toneColor(D,n);s.dots.length<3&&s.dots.push({key:`${t.kind}-${s.dots.length}`,color:i}),"holiday"===t.kind&&(s.holiday=!0,s.holidayInk??=toneInk(D,n)),t.label&&s.spoken.push(t.label),s.spoken.push(t.kind)}return e},[m,D]),O=useMemo(()=>buildMonthMatrix(new Date(Math.floor(k/12),k%12,1),u),[k,u]),F=useMemo(()=>weekdayLabels(c,u),[c,u]),P=useMemo(()=>new Intl.DateTimeFormat(c,{month:"long",year:"numeric"}),[c]),B=useMemo(()=>new Intl.DateTimeFormat(c,{weekday:"short",day:"numeric",month:"long"}),[c]),z=P.format(S),H=null===j||startOfMonth(new Date(j)).getTime()<S.getTime(),Z=null===A||startOfMonth(new Date(A)).getTime()>S.getTime(),X=useRef(createAnimatedValue(0)).current,U=useRef(createAnimatedValue(1)).current,$=useRef(null);useEffect(()=>()=>$.current?.stop(),[]);const q=useCallback(e=>{!1!==g&&triggerHaptic("impactLight");const t=D.components.dateRangePicker,a=t?.monthSlideDistance??32,s=t?.monthSlideOutDuration??D.motion.duration.fast,n=t?.monthSlideInDuration??D.motion.duration.fast,[i]=T.range(-e*a,0),[r]=T.range(e*a,0),o=T.reduced?T.duration("fast"):s,l=T.reduced?T.duration("fast"):n;$.current?.stop(),$.current=Animated.sequence([Animated.parallel([Animated.timing(X,{toValue:i,duration:s,easing:Easing.out(Easing.quad),useNativeDriver:!0}),Animated.timing(U,{toValue:0,duration:o,useNativeDriver:!0})]),Animated.timing(X,{toValue:r,duration:0,useNativeDriver:!0}),Animated.parallel([Animated.timing(X,{toValue:0,duration:n,easing:Easing.out(Easing.cubic),useNativeDriver:!0}),Animated.timing(U,{toValue:1,duration:l,useNativeDriver:!0})])]),$.current.start();const d=addMonths(S,e);_(d),AccessibilityInfo.announceForAccessibility(P.format(d))},[g,S,U,P,X,T,_,D]),G=useCallback(()=>q(-1),[q]),Y=useCallback(()=>q(1),[q]),pressDay=e=>{if(V(e.date))return;const t=resolveHaptic(g,"selection");t&&triggerHaptic(t);const s=e.date;"single"===a||!v||C||s.getTime()<v.getTime()?n({start:s}):n({start:v,end:s}),e.inMonth||_(startOfMonth(s))},W=useRef(pressDay);useLayoutEffect(()=>{W.current=pressDay});const J=useCallback(e=>W.current(e),[]),K=void 0===y?void 0:Math.max(y,MIN_CELL_SIZE),Q=useMemo(()=>void 0===K?{flex:1}:{width:K},[K]),ee=useMemo(()=>void 0===K?{flex:1,aspectRatio:1,minHeight:MIN_CELL_SIZE}:{width:K,height:K},[K]),te=D.components.dateRangePicker?.navButtonSize??NAV_BUTTON_SIZE,ae=Math.max(D.spacing.sm,(MIN_CELL_SIZE-te)/2),se=Math.min(D.maxFontSizeMultiplier??1.5,1.5),ne=[];for(let e=0;e<GRID_CELLS;e+=7)ne.push(O.slice(e,e+7));return _jsxs(View,{ref:t,style:[w.root,p],testID:M,children:[_jsxs(View,{style:w.headerRow,children:[_jsx(Pressable,{onPress:G,disabled:!H,style:({pressed:e})=>[w.navBtn,e&&w.navBtnPressed,!H&&w.navBtnDisabled,x],accessibilityRole:"button",accessibilityLabel:"Previous month",accessibilityState:{disabled:!H},"aria-disabled":!H,hitSlop:ae,children:_jsx(Text,{style:w.navText,maxFontSizeMultiplier:se,children:"‹"})}),_jsx(Animated.View,{style:[w.headerLabelWrap,{opacity:U,transform:[{translateX:X}]},b],children:_jsx(Text,{style:w.headerLabel,accessibilityRole:"header",accessibilityLabel:f?`${f}, ${z}`:void 0,maxFontSizeMultiplier:D.maxFontSizeMultiplier,children:z})}),_jsx(Pressable,{onPress:Y,disabled:!Z,style:({pressed:e})=>[w.navBtn,e&&w.navBtnPressed,!Z&&w.navBtnDisabled,x],accessibilityRole:"button",accessibilityLabel:"Next month",accessibilityState:{disabled:!Z},"aria-disabled":!Z,hitSlop:ae,children:_jsx(Text,{style:w.navText,maxFontSizeMultiplier:se,children:"›"})})]}),_jsx(View,{style:w.weekdayRow,accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:F.map(({weekday:e,label:t})=>_jsx(View,{style:[w.weekdayCell,Q],children:_jsx(Text,{style:w.weekdayText,maxFontSizeMultiplier:se,children:t})},e))}),_jsx(Animated.View,{style:{opacity:U,transform:[{translateX:X}]},children:ne.map(e=>_jsx(View,{style:w.gridRow,children:e.map(e=>{const t=e.date.getTime(),s=null!==I&&t===I,n=null!==L&&t===L,i=null!==I&&null!==L&&t>=I&&t<=L,r=i&&!s&&!n,o=e.iso===E,l=N.get(e.iso),d=h&&i&&!0===l?.holiday,u=[B.format(e.date),...l?.spoken??[]];return o&&u.push("today"),"range"===a&&(s&&n?u.push("start and end of your range"):s?u.push("start of your range"):n?u.push("end of your range"):r&&u.push("in your range")),d&&u.push("not counted"),_jsx(CalendarDay,{cell:e,accessibilityLabel:u.join(", "),disabled:V(e.date),edge:s||n,mid:r,barLeft:i&&(n||r)&&!(s&&n),barRight:i&&(s||r)&&!(s&&n),today:o,struck:d,dots:l?.dots,inkColor:l?.holidayInk,cellStyle:ee,styles:w,maxFontSizeMultiplier:se,onPressDay:J},e.iso)})},e[0].iso))})]})});Calendar.displayName="Calendar";export{Calendar};export default Calendar;

package/lib/module/components/StatusBadge/StatusBadge.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:{height:22,paddingH:8,fontSize:11,dot:5,gap:5},md:{height:24,paddingH:10,fontSize:12,dot:6,gap:6}},SOFT_FILL_OPACITY=.14,SOFT_BORDER_OPACITY=.4,BORDER_WIDTH=1,toneFor=(e,t)=>{const{toneText:o}=e.colors;switch(t){case"success":return{base:e.colors.success,on:e.colors.onSuccess,ink:o.success};case"warning":return{base:e.colors.warning,on:e.colors.onWarning,ink:o.warning};case"error":return{base:e.colors.error,on:e.colors.onError,ink:o.error};case"info":return{base:e.colors.info,on:e.colors.onInfo,ink:o.info};case"primary":return{base:e.colors.primary,on:e.colors.onPrimary,ink:o.primary};default:return{base:e.colors.text.secondary,on:e.colors.onNeutral,ink:e.colors.text.secondary}}},isHex=e=>"string"==typeof e&&/^#[0-9a-f]{6}$/i.test(e),paletteFor=(e,t,o,r)=>{const s=isHex(r),{base:n,on:a,ink:i}=s?{base:r,on:e.colors.text.inverse,ink:r}:toneFor(e,t),l=!s&&"neutral"===t,d=l?e.colors.background.tertiary:tintOf(n,.14,e.colors.background.secondary),c=l?e.colors.border.primary:tintOf(n,.4,n);switch(o){case"solid":return{fill:n,border:n,text:a,dot:a};case"outline":return{fill:"transparent",border:l?c:n,text:i,dot:n};default:return{fill:d,border:c,text:i,dot:n}}},StatusBadge=forwardRef((e,t)=>{const{label:o,tone:r="neutral",variant:s="soft",size:n="md",dot:a=!1,color:i,loading:l=!1,accessibilityLabel:d,style:c,textStyle:u,testID:g}=e,f=useTheme(),m=sizeMap[n],b=useMemo(()=>paletteFor(f,r,s,i),[f,r,s,i]);return l?_jsx(StatusBadgeSkeleton,{...e}):_jsxs(View,{ref:t,accessible:!0,accessibilityRole:"text",accessibilityLabel:d??o,testID:g,style:[styles.base,{minHeight:m.height,paddingHorizontal:m.paddingH,borderRadius:f.radius.full,...smoothCorners,backgroundColor:b.fill,borderColor:b.border,borderWidth:1},c],children:[a?_jsx(View,{testID:"status-badge-dot",style:{width:m.dot,height:m.dot,borderRadius:m.dot/2,marginRight:m.gap,backgroundColor:b.dot}}):null,_jsx(Text,{style:[styles.label,{color:b.text,fontSize:m.fontSize,...fontFor(f,"semibold")},u],numberOfLines:1,maxFontSizeMultiplier:f.maxFontSizeMultiplier,children:o})]})});StatusBadge.displayName="StatusBadge";const StatusBadgeSkeleton=({label:e,size:t="md",dot:o,style:r})=>{const s=sizeMap[t],n=Math.max(32,Math.min(120,6.5*(e??"").length))+2*s.paddingH+(o?s.dot+s.gap:0);return _jsx(Skeleton,{width:n,height:s.height,radius:s.height/2,style:[styles.skeleton,r]})};StatusBadgeSkeleton.displayName="StatusBadgeSkeleton",StatusBadge.Skeleton=StatusBadgeSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},skeleton:{alignSelf:"flex-start"}});export{StatusBadge};export default StatusBadge;
+"use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{deriveToneInk}from"../../theme/toneInk.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:{height:22,paddingH:8,fontSize:11,dot:5,gap:5},md:{height:24,paddingH:10,fontSize:12,dot:6,gap:6}},SOFT_FILL_OPACITY=.14,SOFT_BORDER_OPACITY=.4,BORDER_WIDTH=1,toneFor=(e,t)=>{const{toneText:o}=e.colors;switch(t){case"success":return{base:e.colors.success,on:e.colors.onSuccess,ink:o.success};case"warning":return{base:e.colors.warning,on:e.colors.onWarning,ink:o.warning};case"error":case"danger":return{base:e.colors.error,on:e.colors.onError,ink:o.error};case"info":return{base:e.colors.info,on:e.colors.onInfo,ink:o.info};case"primary":return{base:e.colors.primary,on:e.colors.onPrimary,ink:o.primary};default:return{base:e.colors.text.secondary,on:e.colors.onNeutral,ink:e.colors.text.secondary}}},isHex=e=>"string"==typeof e&&/^#[0-9a-f]{6}$/i.test(e),paletteFor=(e,t,o,r)=>{const s=isHex(r),{base:n,on:a,ink:i}=s?{base:r,on:e.colors.text.inverse,ink:deriveToneInk(r,[e.colors.background.primary,e.colors.background.secondary,e.colors.background.tertiary],e.mode)}:toneFor(e,t),l=!s&&"neutral"===t,d=l?e.colors.background.tertiary:tintOf(n,.14,e.colors.background.secondary),c=l?e.colors.border.primary:tintOf(n,.4,n);switch(o){case"solid":return{fill:n,border:n,text:a,dot:a};case"outline":return{fill:"transparent",border:l?c:n,text:i,dot:n};default:return{fill:d,border:c,text:i,dot:n}}},StatusBadge=forwardRef((e,t)=>{const{label:o,tone:r="neutral",variant:s="soft",size:n="md",dot:a=!1,color:i,loading:l=!1,accessibilityLabel:d,style:c,textStyle:u,testID:g}=e,m=useTheme(),f=sizeMap[n],b=useMemo(()=>paletteFor(m,r,s,i),[m,r,s,i]);return l?_jsx(StatusBadgeSkeleton,{...e}):_jsxs(View,{ref:t,accessible:!0,accessibilityRole:"text",accessibilityLabel:d??o,testID:g,style:[styles.base,{minHeight:f.height,paddingHorizontal:f.paddingH,borderRadius:m.radius.full,...smoothCorners,backgroundColor:b.fill,borderColor:b.border,borderWidth:1},c],children:[a?_jsx(View,{testID:"status-badge-dot",style:{width:f.dot,height:f.dot,borderRadius:f.dot/2,marginRight:f.gap,backgroundColor:b.dot}}):null,_jsx(Text,{style:[styles.label,{color:b.text,fontSize:f.fontSize,...fontFor(m,"semibold")},u],numberOfLines:1,maxFontSizeMultiplier:m.maxFontSizeMultiplier,children:o})]})});StatusBadge.displayName="StatusBadge";const StatusBadgeSkeleton=({label:e,size:t="md",dot:o,style:r})=>{const s=sizeMap[t],n=Math.max(32,Math.min(120,6.5*(e??"").length))+2*s.paddingH+(o?s.dot+s.gap:0);return _jsx(Skeleton,{width:n,height:s.height,radius:s.height/2,style:[styles.skeleton,r]})};StatusBadgeSkeleton.displayName="StatusBadgeSkeleton",StatusBadge.Skeleton=StatusBadgeSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},skeleton:{alignSelf:"flex-start"}});export{StatusBadge};export default StatusBadge;

package/lib/typescript/commonjs/components/StatusBadge/StatusBadge.d.ts

@@ -2,10 +2,11 @@ import type React from 'react';
 import type { View as RNView, StyleProp, TextStyle, ViewStyle } from 'react-native';
 /**
  * The same semantic vocabulary Chip and Badge use, and the web library's
- * `AppStatusBadge` (its `danger` is `error` here, the mobile theme's name).
+ * `AppStatusBadge`. `danger` is the web name for `error`, the mobile theme's
+ * name, so a status mapped once for both platforms draws the same here.
  * A semantic name survives a palette change; a colour name does not.
  */
-export type StatusBadgeTone = 'success' | 'warning' | 'error' | 'info' | 'primary' | 'neutral';
+export type StatusBadgeTone = 'success' | 'warning' | 'error' | 'danger' | 'info' | 'primary' | 'neutral';
 /**
  * `soft` is the default: the tone at a light tint behind text in the tone,
  * with a border in the tone so the pill has an edge on any surface. `outline`

package/lib/typescript/module/components/StatusBadge/StatusBadge.d.ts

@@ -2,10 +2,11 @@ import type React from 'react';
 import type { View as RNView, StyleProp, TextStyle, ViewStyle } from 'react-native';
 /**
  * The same semantic vocabulary Chip and Badge use, and the web library's
- * `AppStatusBadge` (its `danger` is `error` here, the mobile theme's name).
+ * `AppStatusBadge`. `danger` is the web name for `error`, the mobile theme's
+ * name, so a status mapped once for both platforms draws the same here.
  * A semantic name survives a palette change; a colour name does not.
  */
-export type StatusBadgeTone = 'success' | 'warning' | 'error' | 'info' | 'primary' | 'neutral';
+export type StatusBadgeTone = 'success' | 'warning' | 'error' | 'danger' | 'info' | 'primary' | 'neutral';
 /**
  * `soft` is the default: the tone at a light tint behind text in the tone,
  * with a border in the tone so the pill has an edge on any surface. `outline`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webority/mobile-ui",
-  "version": "0.16.1",
+  "version": "0.16.2",
   "description": "Beautiful, animated, accessible React Native components, theme and form engine for Webority projects.",
   "keywords": [
     "react-native",
@@ -107,7 +107,7 @@
     ]
   },
   "devDependencies": {
-    "@webority/mobile-core": "0.16.1"
+    "@webority/mobile-core": "0.16.2"
   },
   "scripts": {
     "build": "bob build && node ../../scripts/minify-lib.mjs",