@webority/mobile-ui 0.109.6 → 0.109.7

package/dist/canvas-kit/manifest.json

@@ -2,7 +2,7 @@
   "kind": "WeborityPhone",
   "library": {
     "name": "@webority/mobile-ui",
-    "version": "0.109.6"
+    "version": "0.109.7"
   },
   "rendererProtocolVersion": 12,
   "platform": "Phone",
@@ -631,6 +631,18 @@
               "type": "string",
               "required": false,
               "description": "A text label used instead of the glyph."
+            },
+            {
+              "name": "menu",
+              "type": "array",
+              "required": false,
+              "description": "The items of the menu the button opens; such a button has no onPress."
+            },
+            {
+              "name": "menuTitle",
+              "type": "string",
+              "required": false,
+              "description": "A short heading over the menu's items; also the menu's accessible name."
             }
           ],
           "required": false,
@@ -1534,12 +1546,36 @@
           "required": false,
           "description": "A colour for the initials disc that wins over tone."
         },
+        {
+          "name": "border",
+          "type": "boolean",
+          "required": false,
+          "description": "Draws a 1 pt border inside the frame, with the picture inset by it.",
+          "default": false
+        },
         {
           "name": "color",
           "type": "string",
           "required": false,
           "description": "A colour for the initials that wins over tone."
         },
+        {
+          "name": "contentFit",
+          "type": "enum",
+          "enum": [
+            "contain",
+            "cover"
+          ],
+          "required": false,
+          "description": "How the picture fills the frame; contain shows all of it, with no fill behind it.",
+          "default": "cover"
+        },
+        {
+          "name": "dimension",
+          "type": "number",
+          "required": false,
+          "description": "Width and height in points; it wins over size."
+        },
         {
           "name": "fontSize",
           "type": "number",
@@ -1559,6 +1595,23 @@
           "required": false,
           "description": "The person's name, used for the initials and the fallback colour."
         },
+        {
+          "name": "placeholderIcon",
+          "type": "icon",
+          "required": false,
+          "description": "Drawn in place of the initials when there is no picture and no name."
+        },
+        {
+          "name": "radius",
+          "type": "enum",
+          "enum": [
+            "lg",
+            "md",
+            "sm"
+          ],
+          "required": false,
+          "description": "The corner of a rounded avatar, from the radius tokens; left out, it keeps 22 percent of the side."
+        },
         {
           "name": "shape",
           "type": "enum",
@@ -1856,6 +1909,13 @@
           "required": false,
           "description": "The spoken label of the badge."
         },
+        {
+          "name": "accessible",
+          "type": "boolean",
+          "required": false,
+          "description": "False hides the badge from screen readers, for a host that already announces the count.",
+          "default": true
+        },
         {
           "name": "anchor",
           "type": "enum",
@@ -1869,6 +1929,17 @@
           "description": "The corner of the child where the badge sits.",
           "default": "topRight"
         },
+        {
+          "name": "fill",
+          "type": "enum",
+          "enum": [
+            "soft",
+            "solid"
+          ],
+          "required": false,
+          "description": "Solid fills the pill with the tone; soft draws the tone's soft colour behind a semibold count in the tone.",
+          "default": "solid"
+        },
         {
           "name": "invisible",
           "type": "boolean",
@@ -2190,6 +2261,7 @@
           "type": "enum",
           "enum": [
             "bar",
+            "tint",
             "wash"
           ],
           "required": false,
@@ -2813,6 +2885,58 @@
           "required": false,
           "description": "Tells a screen reader to ignore what is behind the sheet."
         },
+        {
+          "name": "actions",
+          "type": "array",
+          "itemFields": [
+            {
+              "name": "disabled",
+              "type": "boolean",
+              "required": false,
+              "description": "Dims the action and blocks its press (a confirm waiting on a typed phrase, say)."
+            },
+            {
+              "name": "label",
+              "type": "string",
+              "required": true,
+              "description": "The text drawn on the action button."
+            },
+            {
+              "name": "loading",
+              "type": "boolean",
+              "required": false,
+              "description": "Shows a spinner and blocks its press."
+            },
+            {
+              "name": "tone",
+              "type": "enum",
+              "enum": [
+                "danger",
+                "info",
+                "neutral",
+                "primary",
+                "success",
+                "warning"
+              ],
+              "required": false,
+              "description": "The color scheme of the action."
+            }
+          ],
+          "required": false,
+          "description": "Action buttons drawn in the footer, above footer."
+        },
+        {
+          "name": "actionsLayout",
+          "type": "enum",
+          "enum": [
+            "auto",
+            "row",
+            "stacked"
+          ],
+          "required": false,
+          "description": "How the actions are laid out: auto stacks them when a label wraps, row never stacks, stacked is a column of full-width buttons.",
+          "default": "auto"
+        },
         {
           "name": "animateMount",
           "type": "boolean",
@@ -6067,6 +6191,18 @@
           "required": false,
           "description": "Ordered action buttons."
         },
+        {
+          "name": "actionsLayout",
+          "type": "enum",
+          "enum": [
+            "auto",
+            "row",
+            "stacked"
+          ],
+          "required": false,
+          "description": "How the actions are laid out: auto stacks them when a label wraps, row never stacks, stacked is a column of full-width buttons.",
+          "default": "auto"
+        },
         {
           "name": "dismissOnAction",
           "type": "boolean",
@@ -6509,6 +6645,17 @@
           "type": "string",
           "required": true,
           "description": "Headline message."
+        },
+        {
+          "name": "variant",
+          "type": "enum",
+          "enum": [
+            "block",
+            "inline"
+          ],
+          "required": false,
+          "description": "Block is the centred block with room around it. Inline is one quiet centred caption line with the title only.",
+          "default": "block"
         }
       ],
       "itemsTakeAction": [],
@@ -7538,6 +7685,30 @@
           "required": false,
           "description": "Announces the badge as an image to screen readers; without it the badge is decorative."
         },
+        {
+          "name": "color",
+          "type": "string",
+          "required": false,
+          "description": "A colour of your own for the fill tint and the icon; it wins over the tone."
+        },
+        {
+          "name": "dimension",
+          "type": "number",
+          "required": false,
+          "description": "The width and height of the circle in points; it wins over the size."
+        },
+        {
+          "name": "fill",
+          "type": "enum",
+          "enum": [
+            "halo",
+            "surface",
+            "tint"
+          ],
+          "required": false,
+          "description": "The fill: a low tint, a stronger halo tint, or the surface colour as a seal.",
+          "default": "tint"
+        },
         {
           "name": "icon",
           "type": "icon",
@@ -7559,6 +7730,18 @@
           "description": "The Iconsax style for the icon when given as a name.",
           "default": "linear"
         },
+        {
+          "name": "pointerEvents",
+          "type": "enum",
+          "enum": [
+            "auto",
+            "box-none",
+            "box-only",
+            "none"
+          ],
+          "required": false,
+          "description": "Passed to the root view; \"none\" lets touches reach what sits under the badge."
+        },
         {
           "name": "size",
           "type": "enum",
@@ -8824,6 +9007,17 @@
           "required": false,
           "description": "Lines a text title may take before it is truncated; 0 for no limit.",
           "default": 1
+        },
+        {
+          "name": "variant",
+          "type": "enum",
+          "enum": [
+            "list",
+            "menu"
+          ],
+          "required": false,
+          "description": "The row look: list, or menu for a popup menu row (48 pt high, no press scale, announced as a menu item).",
+          "default": "list"
         }
       ],
       "itemsTakeAction": [],
@@ -8907,6 +9101,129 @@
         ]
       }
     },
+    {
+      "name": "ListSection",
+      "marker": null,
+      "acceptsChildren": true,
+      "props": [
+        {
+          "name": "action",
+          "type": "object",
+          "fields": [
+            {
+              "name": "label",
+              "type": "string",
+              "required": true,
+              "description": "The link text."
+            },
+            {
+              "name": "testID",
+              "type": "string",
+              "required": false,
+              "description": "A test selector on the link."
+            }
+          ],
+          "required": false,
+          "description": "A link on the heading row, such as See all. It shows only when the section has a title."
+        },
+        {
+          "name": "footer",
+          "type": "string",
+          "required": false,
+          "description": "A muted caption drawn below the card."
+        },
+        {
+          "name": "title",
+          "type": "string",
+          "required": false,
+          "description": "The heading above the card, drawn in the caps heading style."
+        },
+        {
+          "name": "variant",
+          "type": "enum",
+          "enum": [
+            "elevated",
+            "filled",
+            "flat",
+            "outline"
+          ],
+          "required": false,
+          "description": "The surface style of the card the rows sit on.",
+          "default": "outline"
+        }
+      ],
+      "itemsTakeAction": [],
+      "takesAction": [],
+      "source": "@webority/mobile-ui",
+      "usage": {
+        "when": [
+          "Several related rows form one group, such as account links or settings toggles.",
+          "The group needs a heading, a link on its heading or a caption under it."
+        ],
+        "whenNot": [
+          {
+            "text": "A single row with no group around it.",
+            "instead": "ListItem"
+          },
+          {
+            "text": "Free content in a surface, not a list of rows.",
+            "instead": "Card"
+          }
+        ],
+        "do": [
+          {
+            "note": "Pass ListItem rows as children; the dividers between them are drawn for you.",
+            "example": [
+              {
+                "component": "ListSection",
+                "props": {
+                  "title": "Account"
+                },
+                "children": [
+                  {
+                    "component": "ListItem",
+                    "props": {
+                      "title": "Profile",
+                      "chevron": true
+                    }
+                  },
+                  {
+                    "component": "ListItem",
+                    "props": {
+                      "title": "Security",
+                      "chevron": true
+                    }
+                  }
+                ]
+              }
+            ]
+          }
+        ],
+        "dont": [
+          {
+            "note": "Do not set divider on the rows; ListSection already draws the lines between them.",
+            "example": [
+              {
+                "component": "ListSection",
+                "children": [
+                  {
+                    "component": "ListItem",
+                    "props": {
+                      "title": "Profile",
+                      "divider": true
+                    }
+                  }
+                ]
+              }
+            ]
+          }
+        ],
+        "a11y": [
+          "The title is exposed to screen readers as a header.",
+          "Each row keeps its own name and role from ListItem."
+        ]
+      }
+    },
     {
       "name": "LoaderOverlay",
       "marker": null,
@@ -11964,6 +12281,12 @@
           "type": "string",
           "required": false,
           "description": "Track colour override."
+        },
+        {
+          "name": "valueLabel",
+          "type": "node",
+          "required": false,
+          "description": "Text or content at the right of the label row, in place of the percent; a string is drawn like the percent."
         }
       ],
       "itemsTakeAction": [],
@@ -16640,6 +16963,17 @@
           "description": "A small disc before the label in the status colour.",
           "default": false
         },
+        {
+          "name": "ink",
+          "type": "enum",
+          "enum": [
+            "primary",
+            "tone"
+          ],
+          "required": false,
+          "description": "Tone draws the label in the tone colour; primary draws it in the body text colour, except on a solid fill.",
+          "default": "tone"
+        },
         {
           "name": "label",
           "type": "string",
@@ -16653,6 +16987,18 @@
           "description": "Draws the skeleton placeholder at the pill's footprint.",
           "default": false
         },
+        {
+          "name": "padding",
+          "type": "enum",
+          "enum": [
+            "default",
+            "md",
+            "sm"
+          ],
+          "required": false,
+          "description": "Default keeps the size's minimum height and side space; sm or md puts that space token at the sides with no minimum height.",
+          "default": "default"
+        },
         {
           "name": "size",
           "type": "enum",
@@ -16683,6 +17029,7 @@
           "name": "variant",
           "type": "enum",
           "enum": [
+            "filled",
             "flat",
             "ghost",
             "outline",
@@ -16690,8 +17037,19 @@
             "solid"
           ],
           "required": false,
-          "description": "Soft is a light tint with a tone border, flat is the soft tint with no border, outline drops the fill, solid fills with the tone. Ghost draws only the label in the tone colour.",
+          "description": "Soft is a light tint with a tone border, flat is the soft tint with no border, outline drops the fill, solid fills with the tone. Ghost draws only the label in the tone colour. Filled is an opaque soft fill with no edge.",
           "default": "soft"
+        },
+        {
+          "name": "weight",
+          "type": "enum",
+          "enum": [
+            "bold",
+            "semibold"
+          ],
+          "required": false,
+          "description": "The weight of the label.",
+          "default": "semibold"
         }
       ],
       "itemsTakeAction": [],

package/dist/canvas-kit/release.json

@@ -1,21 +1,21 @@
 {
   "name": "webority-phone",
-  "version": "0.109.6",
+  "version": "0.109.7",
   "platform": "Phone",
   "kitModuleVersion": 2,
   "rendererProtocolVersion": 12,
   "library": {
     "name": "@webority/mobile-ui",
-    "version": "0.109.6"
+    "version": "0.109.7"
   },
   "files": {
     "manifest.json": {
-      "sha256": "616297de652559f3f168f7f9f30c40b6d57a41dc63849ccbc97f6d4f8033fad4",
-      "bytes": 625850
+      "sha256": "133d29dc0dd83c292f0898bda8bf20a99479f8087b1aa26bbbea9b36c5d0d8c6",
+      "bytes": 636807
     },
     "kit.js": {
-      "sha256": "e07c7b94e64c9a572c6cf427edccb27c5b634c541120681eeae00659371ed023",
-      "bytes": 5940178
+      "sha256": "6de00f6a938274fc1f45d9ea786960124cbc3d004a9f37c161b49d36970dbe53",
+      "bytes": 5951187
     },
     "kit.css": {
       "sha256": "e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855",

package/lib/commonjs/components/AppBar/AppBar.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_APP_BAR_LABELS=exports.AppBar=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_Text=require("../Text/Text.js"),_jsxRuntime=require("react/jsx-runtime");const ACTION_BUTTON_SIZE=44,DOT_OFFSET=10,DOT_SIZE=8,BADGE_OFFSET=4,DEFAULT_APP_BAR_LABELS=exports.DEFAULT_APP_BAR_LABELS=Object.freeze({back:"Back"}),variantSize=(e,t)=>{switch(t){case"compact":return{height:44,titleSize:e.text.lg.size,titleWeight:"semibold",alignBottom:!1,subtitleLines:1};case"large":return{height:96,titleSize:e.text["2xl"].size,titleWeight:"bold",alignBottom:!0,subtitleLines:2};default:return{height:56,titleSize:e.text.lg.size,titleWeight:"semibold",alignBottom:!1,subtitleLines:1}}},ActionButton=({action:e,side:t,badgeStyle:i,haptic:n,flush:a})=>{const l=(0,_index.useTheme)(),{style:r,pressIn:s,pressOut:o}=(0,_usePressAnimation.usePressAnimation)({enabled:!0}),c=(0,_react.useMemo)(()=>buildActionStyles(l),[l]),d=e.badge,u=void 0!==d&&0!==d,p=void 0!==e.label;return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:r,children:(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:()=>{const t=(0,_hapticUtils.resolveHaptic)(n,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),e.onPress()},onPressIn:s,onPressOut:o,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,testID:e.testID,android_ripple:{color:l.colors["surface-pressed"],borderless:!p},style:({pressed:e})=>[p?c.textButton:c.actionButton,a?null:"left"===t?c.actionLeft:c.actionRight,e&&!p?c.actionPressed:null,e&&p?c.textPressed:null],children:[p?(0,_jsxRuntime.jsx)(_Text.Text,{variant:"body",weight:"semibold",color:"link",numberOfLines:1,children:e.label}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:c.iconWrap,children:e.icon}),u?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[c.badge,i],pointerEvents:"none",children:(0,_jsxRuntime.jsx)(_Text.Text,{variant:"caption",weight:"semibold",numberOfLines:1,style:c.badgeText,children:String(d)})}):null,e.dot?(0,_jsxRuntime.jsx)(_reactNative.View,{testID:e.testID?`${e.testID}-dot`:"appbar-action-dot",style:c.dot,pointerEvents:"none"}):null]})})},COLLAPSE_RANGE=60,LARGE_TITLE_SCALE_END=.71,AppBar=exports.AppBar=(0,_react.forwardRef)((e,t)=>{const{title:i,subtitle:n,titleAlignment:a="left",leftAction:l,rightActions:r,leading:s,trailing:o,onBack:c,gutter:d,titleVariant:u,titleOffset:p,height:m,divider:g,variant:x="default",transparent:h=!1,scrollY:_,style:b,containerStyle:f,titleStyle:A,subtitleStyle:j,badgeStyle:v,haptic:y,labels:R,testID:S}=e;(0,_warnInvalidValue.warnInvalidValue)("AppBar","variant",e.variant,["default","large","compact"]),(0,_warnInvalidValue.warnInvalidValue)("AppBar","titleAlignment",e.titleAlignment,["left","center"]);const B=(0,_react.useMemo)(()=>({...DEFAULT_APP_BAR_LABELS,...R}),[R]),w=(0,_index.useTheme)(),I=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),L=(0,_react.useMemo)(()=>variantSize(w,x),[w,x]),N=(0,_react.useMemo)(()=>buildStyles(w),[w]),T="large"===x&&void 0!==_,C=l??(c?{icon:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"arrow-left",size:24,color:w.colors["text-body"]}),onPress:c,accessibilityLabel:B.back}:void 0),V=o?void 0:r?.[r.length-1],opticalInset=e=>void 0===e?0:void 0!==e.label?w.space.sm:Math.max(10,0),P=void 0===d?null:{paddingLeft:Math.max(d-opticalInset(C),0),paddingRight:Math.max(d-opticalInset(V),0)},E=void 0!==p,O=Boolean(C)||Boolean(s),z=g??!h,D=_reactNative.StyleSheet.hairlineWidth,W=(0,_react.useMemo)(()=>{if(!_)return null;const e={inputRange:[0,60],extrapolate:"clamp"};return{titleScale:_.interpolate({...e,outputRange:[1,.71]}),titleTranslateY:_.interpolate({...e,outputRange:[0,-20]}),titleTranslateX:_.interpolate({...e,outputRange:"center"===a?[0,0]:[0,8]}),subtitleOpacity:_.interpolate({inputRange:[0,30],outputRange:[1,0],extrapolate:"clamp"}),barHeight:_.interpolate({...e,outputRange:[96,56]}),borderOpacity:_.interpolate({...e,outputRange:[0,1]})}},[_,a]),k=T&&W?{transform:[{translateX:W.titleTranslateX},{translateY:W.titleTranslateY},{scale:W.titleScale}]}:null,q=i?u?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:k,children:(0,_jsxRuntime.jsx)(_Text.Text,{variant:u,align:"center"===a?"center":"left",accessibilityRole:"header",numberOfLines:1,style:[N.titleVariant,A],children:i})}):(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{accessibilityRole:"header",style:[N.title,{fontSize:L.titleSize,fontWeight:w.weight[L.titleWeight],textAlign:"center"===a?"center":"left"},k,A],numberOfLines:1,children:i}):null,H=n?(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{style:[N.subtitle,{textAlign:"center"===a?"center":"left"},T&&W?{opacity:W.subtitleOpacity}:null,j],numberOfLines:L.subtitleLines,children:n}):null,F=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[N.titleColumn,"center"===a?N.titleColumnCenter:null,L.alignBottom?N.titleColumnBottom:null],children:[q,H]}),M=T?_reactNative.Animated.View:_reactNative.View,U=T&&W?{height:_reactNative.Animated.add(W.barHeight,new _reactNative.Animated.Value(I.top))}:{height:(m??L.height)+I.top};return(0,_jsxRuntime.jsxs)(M,{ref:t,testID:S,style:[N.root,{paddingTop:I.top,backgroundColor:h?"transparent":w.colors.surface},U,!T&&z?{borderBottomWidth:D,borderBottomColor:w.colors.border}:null,b,f],children:[T&&W&&z?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[N.animatedBorder,{backgroundColor:w.colors.border,opacity:W.borderOpacity}]}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[N.row,L.alignBottom?N.rowAlignBottom:null,P,{flex:1}],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[N.sideSlot,E?N.sideSlotCompact:null],children:[C?(0,_jsxRuntime.jsx)(ActionButton,{action:C,side:"left",haptic:y,flush:E}):null,null!=s&&!1!==s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.slotNode,children:s}):null]}),(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[N.center,"center"===a?N.centerAligned:N.centerLeft,E?{paddingLeft:O?p:w.space.none,paddingRight:w.space.none}:null],children:F}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[N.sideSlot,N.sideSlotRight,E?N.sideSlotCompact:null],children:[r?.map((e,t)=>(0,_jsxRuntime.jsx)(ActionButton,{action:e,side:"right",badgeStyle:v,haptic:y,flush:E},`appbar-right-${t}`)),null!=o&&!1!==o?(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.slotNode,children:o}):null]})]})]})});AppBar.displayName="AppBar";const buildStyles=e=>_reactNative.StyleSheet.create({root:{width:"100%"},row:{flexDirection:"row",alignItems:"center",paddingHorizontal:e.space.xs},rowAlignBottom:{alignItems:"flex-end",paddingBottom:e.space.sm},sideSlot:{flexDirection:"row",alignItems:"center",minWidth:48},sideSlotRight:{justifyContent:"flex-end"},sideSlotCompact:{minWidth:0},slotNode:{flexDirection:"row",alignItems:"center"},center:{flex:1,minWidth:0,paddingHorizontal:e.space.xs},centerAligned:{alignItems:"center"},centerLeft:{alignItems:"flex-start"},titleColumn:{flexDirection:"column",maxWidth:"100%"},titleColumnCenter:{alignItems:"center"},titleColumnBottom:{justifyContent:"flex-end"},title:{color:e.colors["text-body"]},titleVariant:{includeFontPadding:!1,textAlignVertical:"center"},subtitle:{marginTop:e.space.xxs,color:e.colors["text-subtle"],fontSize:e.text.sm.size,fontWeight:e.weight.normal},animatedBorder:{position:"absolute",left:0,right:0,bottom:0,height:_reactNative.StyleSheet.hairlineWidth}}),buildActionStyles=e=>_reactNative.StyleSheet.create({actionButton:{width:44,height:44,borderRadius:e.radius.pill,..._corners.smoothCorners,alignItems:"center",justifyContent:"center"},actionLeft:{marginRight:e.space.xs},actionRight:{marginLeft:e.space.xs},actionPressed:{backgroundColor:e.colors["surface-pressed"]},textButton:{minWidth:44,minHeight:44,paddingHorizontal:e.space.sm,alignItems:"center",justifyContent:"center"},textPressed:{opacity:.6},dot:{position:"absolute",top:10,right:10,width:8,height:8,borderRadius:e.radius.pill,backgroundColor:e.colors.danger},iconWrap:{alignItems:"center",justifyContent:"center"},badge:{position:"absolute",top:4,right:4,minWidth:16,height:16,paddingHorizontal:e.space.xs,borderRadius:e.radius.pill,..._corners.smoothCorners,backgroundColor:e.colors.danger,alignItems:"center",justifyContent:"center"},badgeText:{color:e.colors["on-danger"],fontSize:e.text.xs.size,fontWeight:e.weight.semibold,lineHeight:13}});var _default=exports.default=AppBar;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_APP_BAR_LABELS=exports.AppBar=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_usePressAnimation=require("../../hooks/usePressAnimation.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_AppIcon=require("../AppIcon/AppIcon.js"),_index2=require("../Menu/index.js"),_Text=require("../Text/Text.js"),_jsxRuntime=require("react/jsx-runtime");const ACTION_BUTTON_SIZE=44,DOT_OFFSET=10,DOT_SIZE=8,BADGE_OFFSET=4,DEFAULT_APP_BAR_LABELS=exports.DEFAULT_APP_BAR_LABELS=Object.freeze({back:"Back"}),variantSize=(e,t)=>{switch(t){case"compact":return{height:44,titleSize:e.text.lg.size,titleWeight:"semibold",alignBottom:!1,subtitleLines:1};case"large":return{height:96,titleSize:e.text["2xl"].size,titleWeight:"bold",alignBottom:!0,subtitleLines:2};default:return{height:56,titleSize:e.text.lg.size,titleWeight:"semibold",alignBottom:!1,subtitleLines:1}}},ActionButton=(0,_react.forwardRef)(({action:e,side:t,badgeStyle:i,haptic:n,flush:a,onPress:r},l)=>{const s=(0,_index.useTheme)(),{style:o,pressIn:c,pressOut:d}=(0,_usePressAnimation.usePressAnimation)({enabled:!0}),u=(0,_react.useMemo)(()=>buildActionStyles(s),[s]),p=e.badge,m=void 0!==p&&0!==p,x=void 0!==e.label;return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:o,children:(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{ref:l,onPress:t=>{const i=(0,_hapticUtils.resolveHaptic)(n,"selection");i&&(0,_hapticUtils.triggerHaptic)(i),"onPress"in e&&e.onPress(),r?.(t)},onPressIn:c,onPressOut:d,accessibilityRole:"button",accessibilityLabel:e.accessibilityLabel??e.label,testID:e.testID,android_ripple:{color:s.colors["surface-pressed"],borderless:!x},style:({pressed:e})=>[x?u.textButton:u.actionButton,a?null:"left"===t?u.actionLeft:u.actionRight,e&&!x?u.actionPressed:null,e&&x?u.textPressed:null],children:[x?(0,_jsxRuntime.jsx)(_Text.Text,{variant:"body",weight:"semibold",color:"link",numberOfLines:1,children:e.label}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:u.iconWrap,children:e.icon}),m?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[u.badge,i],pointerEvents:"none",children:(0,_jsxRuntime.jsx)(_Text.Text,{variant:"caption",weight:"semibold",numberOfLines:1,style:u.badgeText,children:String(p)})}):null,e.dot?(0,_jsxRuntime.jsx)(_reactNative.View,{testID:e.testID?`${e.testID}-dot`:"appbar-action-dot",style:u.dot,pointerEvents:"none"}):null]})})}),COLLAPSE_RANGE=60,LARGE_TITLE_SCALE_END=.71,AppBar=exports.AppBar=(0,_react.forwardRef)((e,t)=>{const{title:i,subtitle:n,titleAlignment:a="left",leftAction:r,rightActions:l,leading:s,trailing:o,onBack:c,gutter:d,titleVariant:u,titleOffset:p,height:m,divider:x,variant:g="default",transparent:h=!1,scrollY:_,style:b,containerStyle:f,titleStyle:j,subtitleStyle:A,badgeStyle:v,haptic:y,labels:R,testID:S}=e;(0,_warnInvalidValue.warnInvalidValue)("AppBar","variant",e.variant,["default","large","compact"]),(0,_warnInvalidValue.warnInvalidValue)("AppBar","titleAlignment",e.titleAlignment,["left","center"]);const B=(0,_react.useMemo)(()=>({...DEFAULT_APP_BAR_LABELS,...R}),[R]),w=(0,_index.useTheme)(),I=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),L=(0,_react.useMemo)(()=>variantSize(w,g),[w,g]),N=(0,_react.useMemo)(()=>buildStyles(w),[w]),T="large"===g&&void 0!==_,C=r??(c?{icon:(0,_jsxRuntime.jsx)(_AppIcon.AppIcon,{name:"arrow-left",size:24,color:w.colors["text-body"]}),onPress:c,accessibilityLabel:B.back}:void 0),P=o?void 0:l?.[l.length-1],opticalInset=e=>void 0===e?0:void 0!==e.label?w.space.sm:Math.max(10,0),V=void 0===d?null:{paddingLeft:Math.max(d-opticalInset(C),0),paddingRight:Math.max(d-opticalInset(P),0)},E=void 0!==p,O=Boolean(C)||Boolean(s),z=x??!h,D=_reactNative.StyleSheet.hairlineWidth,W=(0,_react.useMemo)(()=>{if(!_)return null;const e={inputRange:[0,60],extrapolate:"clamp"};return{titleScale:_.interpolate({...e,outputRange:[1,.71]}),titleTranslateY:_.interpolate({...e,outputRange:[0,-20]}),titleTranslateX:_.interpolate({...e,outputRange:"center"===a?[0,0]:[0,8]}),subtitleOpacity:_.interpolate({inputRange:[0,30],outputRange:[1,0],extrapolate:"clamp"}),barHeight:_.interpolate({...e,outputRange:[96,56]}),borderOpacity:_.interpolate({...e,outputRange:[0,1]})}},[_,a]),q=T&&W?{transform:[{translateX:W.titleTranslateX},{translateY:W.titleTranslateY},{scale:W.titleScale}]}:null,k=i?u?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:q,children:(0,_jsxRuntime.jsx)(_Text.Text,{variant:u,align:"center"===a?"center":"left",accessibilityRole:"header",numberOfLines:1,style:[N.titleVariant,j],children:i})}):(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{accessibilityRole:"header",style:[N.title,{fontSize:L.titleSize,fontWeight:w.weight[L.titleWeight],textAlign:"center"===a?"center":"left"},q,j],numberOfLines:1,children:i}):null,M=n?(0,_jsxRuntime.jsx)(_reactNative.Animated.Text,{style:[N.subtitle,{textAlign:"center"===a?"center":"left"},T&&W?{opacity:W.subtitleOpacity}:null,A],numberOfLines:L.subtitleLines,children:n}):null,F=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[N.titleColumn,"center"===a?N.titleColumnCenter:null,L.alignBottom?N.titleColumnBottom:null],children:[k,M]}),H=T?_reactNative.Animated.View:_reactNative.View,U=T&&W?{height:_reactNative.Animated.add(W.barHeight,new _reactNative.Animated.Value(I.top))}:{height:(m??L.height)+I.top};return(0,_jsxRuntime.jsxs)(H,{ref:t,testID:S,style:[N.root,{paddingTop:I.top,backgroundColor:h?"transparent":w.colors.surface},U,!T&&z?{borderBottomWidth:D,borderBottomColor:w.colors.border}:null,b,f],children:[T&&W&&z?(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{pointerEvents:"none",style:[N.animatedBorder,{backgroundColor:w.colors.border,opacity:W.borderOpacity}]}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[N.row,L.alignBottom?N.rowAlignBottom:null,V,{flex:1}],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[N.sideSlot,E?N.sideSlotCompact:null],children:[C?(0,_jsxRuntime.jsx)(ActionButton,{action:C,side:"left",haptic:y,flush:E}):null,null!=s&&!1!==s?(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.slotNode,children:s}):null]}),(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:[N.center,"center"===a?N.centerAligned:N.centerLeft,E?{paddingLeft:O?p:w.space.none,paddingRight:w.space.none}:null],children:F}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[N.sideSlot,N.sideSlotRight,E?N.sideSlotCompact:null],children:[l?.map((e,t)=>(0,_jsxRuntime.jsx)(_react.Fragment,{children:"menu"in e?(0,_jsxRuntime.jsx)(_index2.Menu,{items:e.menu,title:e.menuTitle,haptic:y,trigger:(0,_jsxRuntime.jsx)(ActionButton,{action:e,side:"right",badgeStyle:v,haptic:y,flush:E})}):(0,_jsxRuntime.jsx)(ActionButton,{action:e,side:"right",badgeStyle:v,haptic:y,flush:E})},`appbar-right-${t}`)),null!=o&&!1!==o?(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.slotNode,children:o}):null]})]})]})});AppBar.displayName="AppBar";const buildStyles=e=>_reactNative.StyleSheet.create({root:{width:"100%"},row:{flexDirection:"row",alignItems:"center",paddingHorizontal:e.space.xs},rowAlignBottom:{alignItems:"flex-end",paddingBottom:e.space.sm},sideSlot:{flexDirection:"row",alignItems:"center",minWidth:48},sideSlotRight:{justifyContent:"flex-end"},sideSlotCompact:{minWidth:0},slotNode:{flexDirection:"row",alignItems:"center"},center:{flex:1,minWidth:0,paddingHorizontal:e.space.xs},centerAligned:{alignItems:"center"},centerLeft:{alignItems:"flex-start"},titleColumn:{flexDirection:"column",maxWidth:"100%"},titleColumnCenter:{alignItems:"center"},titleColumnBottom:{justifyContent:"flex-end"},title:{color:e.colors["text-body"]},titleVariant:{includeFontPadding:!1,textAlignVertical:"center"},subtitle:{marginTop:e.space.xxs,color:e.colors["text-subtle"],fontSize:e.text.sm.size,fontWeight:e.weight.normal},animatedBorder:{position:"absolute",left:0,right:0,bottom:0,height:_reactNative.StyleSheet.hairlineWidth}}),buildActionStyles=e=>_reactNative.StyleSheet.create({actionButton:{width:44,height:44,borderRadius:e.radius.pill,..._corners.smoothCorners,alignItems:"center",justifyContent:"center"},actionLeft:{marginRight:e.space.xs},actionRight:{marginLeft:e.space.xs},actionPressed:{backgroundColor:e.colors["surface-pressed"]},textButton:{minWidth:44,minHeight:44,paddingHorizontal:e.space.sm,alignItems:"center",justifyContent:"center"},textPressed:{opacity:.6},dot:{position:"absolute",top:10,right:10,width:8,height:8,borderRadius:e.radius.pill,backgroundColor:e.colors.danger},iconWrap:{alignItems:"center",justifyContent:"center"},badge:{position:"absolute",top:4,right:4,minWidth:16,height:16,paddingHorizontal:e.space.xs,borderRadius:e.radius.pill,..._corners.smoothCorners,backgroundColor:e.colors.danger,alignItems:"center",justifyContent:"center"},badgeText:{color:e.colors["on-danger"],fontSize:e.text.xs.size,fontWeight:e.weight.semibold,lineHeight:13}});var _default=exports.default=AppBar;

package/lib/commonjs/components/Avatar/Avatar.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.avatarToneColors=exports.DEFAULT_AVATAR_LABELS=exports.AvatarGroup=exports.Avatar=exports.AVATAR_COLORS=void 0;var _expoImage=require("expo-image"),_react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_hitSlop=require("../../utils/hitSlop.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index2=require("../AppIcon/index.js"),_index3=require("../Skeleton/index.js"),_index4=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const SOFT_FILL_OPACITY=.14,MIN_TOUCH_TARGET=44,PRESSED_OPACITY=.7,INITIALS_MAX_FONT_SCALE=1.2,AVATAR_COLORS=exports.AVATAR_COLORS=["avatar-1","avatar-2","avatar-3","avatar-4","avatar-5","avatar-6","avatar-7","avatar-8"],avatarToneColors=(e,t)=>{const soft=(e,t)=>(0,_color.tintOf)(e,.14,t);switch(t){case"primary":return{background:soft(e.colors.primary,e.colors["primary-soft"]),color:e.colors["primary-text"]};case"success":return{background:soft(e.colors.success,e.colors["bg-subtle"]),color:e.colors["success-text"]};case"warning":return{background:soft(e.colors.warning,e.colors["bg-subtle"]),color:e.colors["warning-text"]};case"danger":return{background:soft(e.colors.danger,e.colors["bg-subtle"]),color:e.colors["danger-text"]};case"info":return{background:soft(e.colors.info,e.colors["bg-subtle"]),color:e.colors["info-text"]};default:return{background:e.colors["bg-muted"],color:e.colors["text-body"]}}};exports.avatarToneColors=avatarToneColors;const DEFAULT_AVATAR_LABELS=exports.DEFAULT_AVATAR_LABELS=Object.freeze({avatar:"Avatar",avatarOf:e=>`${e}'s avatar`,verified:"verified",pendingVerification:"pending verification",groupOf:e=>`Group of ${e} ${1===e?"person":"people"}`,moreCount:e=>`${e} more`,moreAvatars:"More avatars"}),sizeMap={xs:24,sm:32,md:48,lg:64,xl:80},resolveSize=e=>sizeMap[e],resolveRadius=(e,t,r)=>{switch(t){case"circle":return r/2;case"rounded":return Math.max(e.radius.sm,Math.round(.22*r));default:return 0}},initialsFromName=e=>{if(!e)return"";const t=e.trim().split(/\s+/u).filter(Boolean);return 0===t.length?"":1===t.length?t[0].charAt(0).toUpperCase():(t[0].charAt(0)+t[1].charAt(0)).toUpperCase()},hashColor=(e,t)=>{if(!e)return t[0];let r=0;for(let t=0;t<e.length;t+=1)r=(r<<5)-r+e.charCodeAt(t),r|=0;return t[Math.abs(r)%t.length]},RING_WIDTH=1.5,isRingStatus=e=>"verified"===e||"pending"===e,statusColor=(e,t)=>{switch(t){case"online":case"verified":return e.colors.success;case"busy":return e.colors.danger;case"away":case"pending":return e.colors.warning;default:return e.colors["text-subtle"]}},Avatar=exports.Avatar=(0,_react.forwardRef)((e,t)=>{const{source:r,ImageComponent:a,name:o,size:s="md",shape:i="circle",status:n=null,statusPosition:l="bottomRight",tone:c,backgroundColor:u,color:d,fontSize:h,loading:v=!1,accessibilityLabel:m,onPress:g,onLongPress:_,haptic:p,hitSlop:b,style:x,textStyle:A,testID:y,labels:f}=e;(0,_warnInvalidValue.warnInvalidValue)("Avatar","size",e.size,Object.keys(sizeMap)),(0,_warnInvalidValue.warnInvalidValue)("Avatar","shape",e.shape,["circle","square","rounded"]),(0,_warnInvalidValue.warnInvalidValue)("Avatar","status",e.status,["online","offline","busy","away","verified","pending"]),(0,_warnInvalidValue.warnInvalidValue)("Avatar","statusPosition",e.statusPosition,["topRight","bottomRight"]),(0,_warnInvalidValue.warnInvalidValue)("Avatar","tone",e.tone,["primary","success","warning","danger","info","neutral"]);const R=(0,_react.useMemo)(()=>f?{...DEFAULT_AVATAR_LABELS,...f}:DEFAULT_AVATAR_LABELS,[f]),j=(0,_index.useTheme)(),[S,w]=(0,_react.useState)(!1),C=(0,_react.useMemo)(()=>resolveSize(s),[s]),I=(0,_react.useMemo)(()=>resolveRadius(j,i,C),[j,i,C]),T=j.colors.border,V=j.colors.surface,L=(0,_react.useMemo)(()=>initialsFromName(o),[o]),M=(0,_react.useMemo)(()=>c?avatarToneColors(j,c):null,[j,c]),E=(0,_react.useMemo)(()=>u||(M?.background??j.colors[hashColor(o??"",AVATAR_COLORS)]),[u,M,o,j]),N=d??M?.color??j.colors["on-primary"],O=!!r&&!S,z=h??Math.max(j.text.xs.size,Math.round(.4*C)),k=Math.max(8,Math.round(.25*C)),F=isRingStatus(n),D=C-2*(F?3:0),G=F?resolveRadius(j,i,D):I,U=F?statusColor(j,n):"transparent",P=Math.max(12,Math.round(.32*C)),q=Math.max(10,P-4),$=O?j.colors["bg-muted"]:E,B=y??"avatar",W=o?R.avatarOf(o):R.avatar,H="verified"===n?`, ${R.verified}`:"pending"===n?`, ${R.pendingVerification}`:"",Y=m??`${W}${H}`,X="function"==typeof g||"function"==typeof _,J=m??`${o||W}${H}`,K=Math.max(0,Math.ceil((44-C)/2)),Q=b??K,Z=[styles.root,{width:C,height:C,borderRadius:I,..._corners.smoothCorners,borderWidth:0,borderColor:T,backgroundColor:F?"transparent":$},x],ee=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[F?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.ring,{borderRadius:I,..._corners.smoothCorners,borderWidth:1.5,borderColor:U}],accessible:!1,pointerEvents:"none",testID:`${B}-ring`}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.picture,{width:D,height:D,borderRadius:G,..._corners.smoothCorners,borderWidth:0,borderColor:T,backgroundColor:F?$:"transparent"}],children:O?(()=>{const e={width:D,height:D,borderRadius:G,..._corners.smoothCorners},onError=()=>w(!0);return a?(0,_jsxRuntime.jsx)(a,{source:r,onError:onError,style:e,contentFit:"cover",resizeMode:"cover",accessibilityIgnoresInvertColors:!0}):(0,_jsxRuntime.jsx)(_expoImage.Image,{source:r,onError:onError,style:e,contentFit:"cover",accessibilityIgnoresInvertColors:!0})})():(0,_jsxRuntime.jsx)(_index4.Text,{variant:"label",weight:"semibold",numberOfLines:1,maxFontSizeMultiplier:1.2,style:[styles.initials,{color:N,fontSize:z,lineHeight:Math.round(z*j.leading.body)},A],children:L??" "})}),"verified"===n?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.status,"topRight"===l?styles.badgeTopRight:styles.badgeBottomRight,{width:P,height:P,borderRadius:P/2,..._corners.smoothCorners,backgroundColor:V}],accessible:!1,pointerEvents:"none",testID:`${B}-badge`,children:(0,_jsxRuntime.jsx)(_index2.AppIcon,{name:"verify",variant:"bold",size:q,color:U})}):null,n&&!F?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.status,"topRight"===l?styles.statusTopRight:styles.statusBottomRight,{width:k,height:k,borderRadius:k/2,..._corners.smoothCorners,backgroundColor:statusColor(j,n),borderWidth:2,borderColor:V}],accessible:!1,pointerEvents:"none"}):null]}),te=X?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:t,onPress:g?e=>{const t=(0,_hapticUtils.resolveHaptic)(p,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),g?.(e)}:void 0,onLongPress:_?e=>{const t=(0,_hapticUtils.resolveHaptic)(p,"longPress");t&&(0,_hapticUtils.triggerHaptic)(t),_?.(e)}:void 0,hitSlop:Q,...(0,_hitSlop.hitSlopMarker)(Q),accessibilityRole:"button",accessibilityLabel:J,testID:y,style:({pressed:e})=>[Z,e?styles.pressed:null],children:ee}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,style:Z,accessible:!0,accessibilityRole:"image",accessibilityLabel:Y,testID:y,children:ee});return v?(0,_jsxRuntime.jsx)(AvatarSkeleton,{...e}):te});Avatar.displayName="Avatar";const AvatarSkeleton=({size:e="md",shape:t="circle",style:r})=>{const a=resolveSize(e),o="circle"===t?"circle":"rounded"===t?"rounded":"rect";return(0,_jsxRuntime.jsx)(_index3.Skeleton,{shape:o,width:a,height:a,style:r})};AvatarSkeleton.displayName="AvatarSkeleton",Avatar.Skeleton=AvatarSkeleton;const styles=_reactNative.StyleSheet.create({root:{alignItems:"center",justifyContent:"center",overflow:"visible",position:"relative"},pressed:{opacity:.7},initials:{textAlign:"center"},ring:{position:"absolute",top:0,right:0,bottom:0,left:0},picture:{alignItems:"center",justifyContent:"center",overflow:"hidden"},status:{position:"absolute"},badgeTopRight:{top:-2,right:-2,alignItems:"center",justifyContent:"center"},badgeBottomRight:{bottom:-2,right:-2,alignItems:"center",justifyContent:"center"},statusTopRight:{top:0,right:0},statusBottomRight:{bottom:0,right:0}}),SPACING_OFFSET={tight:"lg",normal:"md",loose:"sm"},STAGGER_MS=50,ENTRANCE_DURATION_MS=220,AvatarGroupItem=({delay:e,marginLeft:t,borderColor:r,borderWidth:a,children:o})=>{const s=(0,_index.useTheme)(),i=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current;return(0,_react.useEffect)(()=>{const t=_reactNative.Animated.timing(i,{toValue:1,duration:220,delay:e,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!0});return t.start(),()=>t.stop()},[e,i]),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[groupStyles.item,{marginLeft:t,borderRadius:s.radius.pill,borderColor:r,borderWidth:a,opacity:i}],children:o})},AvatarGroup=e=>{const{children:t,max:r=4,size:a="md",spacing:o="normal",overflowVariant:s="count",accessibilityLabel:i,style:n,testID:l,labels:c}=e;(0,_warnInvalidValue.warnInvalidValue)("AvatarGroup","spacing",e.spacing,["tight","normal","loose"]),(0,_warnInvalidValue.warnInvalidValue)("AvatarGroup","overflowVariant",e.overflowVariant,["count","plus"]),(0,_warnInvalidValue.warnInvalidValue)("AvatarGroup","size",e.size,Object.keys(sizeMap));const u=(0,_react.useMemo)(()=>c?{...DEFAULT_AVATAR_LABELS,...c}:DEFAULT_AVATAR_LABELS,[c]),d=(0,_index.useTheme)(),h=(0,_react.useMemo)(()=>_react.Children.toArray(t).filter(e=>(0,_react.isValidElement)(e)),[t]),v=h.length,m=h.slice(0,r),g=Math.max(0,v-r),_=g>0,p=-d.space[SPACING_OFFSET[o]],b=d.colors.surface,x=i??u.groupOf(v),A=(0,_react.useMemo)(()=>resolveSize(a),[a]),y=Math.max(d.text.xs.size,Math.round(.34*A));return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[groupStyles.row,n],accessible:!0,accessibilityLabel:x,accessibilityRole:"summary",testID:l,children:[m.map((e,t)=>{const r=e.key??`avatar-${t}`,o=(0,_react.cloneElement)(e,{size:a,labels:e.props.labels??c});return(0,_jsxRuntime.jsx)(AvatarGroupItem,{delay:50*t,marginLeft:0===t?0:p,borderColor:b,borderWidth:1.5,children:o},r)}),_?(0,_jsxRuntime.jsx)(AvatarGroupItem,{delay:50*m.length,marginLeft:0===m.length?0:p,borderColor:b,borderWidth:1.5,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[groupStyles.overflow,{width:A,height:A,borderRadius:A/2,..._corners.smoothCorners,backgroundColor:d.colors["surface-disabled"]}],accessible:!0,accessibilityRole:"text",accessibilityLabel:"count"===s?u.moreCount(g):u.moreAvatars,children:(0,_jsxRuntime.jsx)(_index4.Text,{variant:"label",weight:"semibold",color:"secondary",numberOfLines:1,maxFontSizeMultiplier:1.2,style:{fontSize:y,lineHeight:Math.round(y*d.leading.body)},children:"count"===s?`+${g}`:"+"})})},"avatar-overflow"):null]})};exports.AvatarGroup=AvatarGroup;const groupStyles=_reactNative.StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},item:{..._corners.smoothCorners},overflow:{alignItems:"center",justifyContent:"center"}});var _default=exports.default=Avatar;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.avatarToneColors=exports.DEFAULT_AVATAR_LABELS=exports.AvatarGroup=exports.Avatar=exports.AVATAR_COLORS=void 0;var _expoImage=require("expo-image"),_react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_hitSlop=require("../../utils/hitSlop.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index2=require("../AppIcon/index.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index3=require("../Skeleton/index.js"),_index4=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const SOFT_FILL_OPACITY=.14,MIN_TOUCH_TARGET=44,PRESSED_OPACITY=.7,INITIALS_MAX_FONT_SCALE=1.2,AVATAR_COLORS=exports.AVATAR_COLORS=["avatar-1","avatar-2","avatar-3","avatar-4","avatar-5","avatar-6","avatar-7","avatar-8"],avatarToneColors=(e,t)=>{const soft=(e,t)=>(0,_color.tintOf)(e,.14,t);switch(t){case"primary":return{background:soft(e.colors.primary,e.colors["primary-soft"]),color:e.colors["primary-text"]};case"success":return{background:soft(e.colors.success,e.colors["bg-subtle"]),color:e.colors["success-text"]};case"warning":return{background:soft(e.colors.warning,e.colors["bg-subtle"]),color:e.colors["warning-text"]};case"danger":return{background:soft(e.colors.danger,e.colors["bg-subtle"]),color:e.colors["danger-text"]};case"info":return{background:soft(e.colors.info,e.colors["bg-subtle"]),color:e.colors["info-text"]};default:return{background:e.colors["bg-muted"],color:e.colors["text-body"]}}};exports.avatarToneColors=avatarToneColors;const DEFAULT_AVATAR_LABELS=exports.DEFAULT_AVATAR_LABELS=Object.freeze({avatar:"Avatar",avatarOf:e=>`${e}'s avatar`,verified:"verified",pendingVerification:"pending verification",groupOf:e=>`Group of ${e} ${1===e?"person":"people"}`,moreCount:e=>`${e} more`,moreAvatars:"More avatars"}),sizeMap={xs:24,sm:32,md:48,lg:64,xl:80},resolveSize=e=>sizeMap[e],resolveRadius=(e,t,r,a)=>{switch(t){case"circle":return r/2;case"rounded":return a?e.radius[a]:Math.max(e.radius.sm,Math.round(.22*r));default:return 0}},initialsFromName=e=>{if(!e)return"";const t=e.trim().split(/\s+/u).filter(Boolean);return 0===t.length?"":1===t.length?t[0].charAt(0).toUpperCase():(t[0].charAt(0)+t[1].charAt(0)).toUpperCase()},hashColor=(e,t)=>{if(!e)return t[0];let r=0;for(let t=0;t<e.length;t+=1)r=(r<<5)-r+e.charCodeAt(t),r|=0;return t[Math.abs(r)%t.length]},RING_WIDTH=1.5,keyOfSource=e=>"object"==typeof e&&null!==e&&"uri"in e&&"string"==typeof e.uri?e.uri:e,isRingStatus=e=>"verified"===e||"pending"===e,statusColor=(e,t)=>{switch(t){case"online":case"verified":return e.colors.success;case"busy":return e.colors.danger;case"away":case"pending":return e.colors.warning;default:return e.colors["text-subtle"]}},Avatar=exports.Avatar=(0,_react.forwardRef)((e,t)=>{const{source:r,ImageComponent:a,name:o,size:s="md",shape:i="circle",dimension:n,radius:l,border:c=!1,contentFit:u="cover",placeholderIcon:d,status:h=null,statusPosition:v="bottomRight",tone:m,backgroundColor:p,color:g,fontSize:_,loading:b=!1,accessibilityLabel:x,onPress:A,onLongPress:y,haptic:f,hitSlop:R,style:I,textStyle:j,testID:w,labels:S}=e;(0,_warnInvalidValue.warnInvalidValue)("Avatar","size",e.size,Object.keys(sizeMap)),(0,_warnInvalidValue.warnInvalidValue)("Avatar","shape",e.shape,["circle","square","rounded"]),(0,_warnInvalidValue.warnInvalidValue)("Avatar","radius",e.radius,["sm","md","lg"]),(0,_warnInvalidValue.warnInvalidValue)("Avatar","contentFit",e.contentFit,["cover","contain"]),(0,_warnInvalidValue.warnInvalidValue)("Avatar","status",e.status,["online","offline","busy","away","verified","pending"]),(0,_warnInvalidValue.warnInvalidValue)("Avatar","statusPosition",e.statusPosition,["topRight","bottomRight"]),(0,_warnInvalidValue.warnInvalidValue)("Avatar","tone",e.tone,["primary","success","warning","danger","info","neutral"]);const C=(0,_react.useMemo)(()=>S?{...DEFAULT_AVATAR_LABELS,...S}:DEFAULT_AVATAR_LABELS,[S]),V=(0,_index.useTheme)(),[T,L]=(0,_react.useState)(null),M=(0,_react.useMemo)(()=>n??resolveSize(s),[n,s]),E=(0,_react.useMemo)(()=>resolveRadius(V,i,M,l),[V,i,M,l]),N=c?V.size.border:0,O=V.colors.border,k=V.colors.surface,z=(0,_react.useMemo)(()=>initialsFromName(o),[o]),F=(0,_react.useMemo)(()=>m?avatarToneColors(V,m):null,[V,m]),D=(0,_react.useMemo)(()=>p||(F?.background??V.colors[hashColor(o??"",AVATAR_COLORS)]),[p,F,o,V]),G=g??F?.color??V.colors["on-primary"],U=r?keyOfSource(r):null,q=null!==U&&U!==T,P=!q&&""===z&&null!=d,$=g??F?.color??V.colors["text-subtle"],B=_??Math.max(V.text.xs.size,Math.round(.4*M)),W=Math.max(8,Math.round(.25*M)),H=isRingStatus(h),Y=M-2*(H?3:N),X=H?resolveRadius(V,i,Y,l):Math.max(0,E-N),J=P?(0,_slotIcon.renderSlotIcon)(d,{color:$,size:Math.round(.45*Y),disabled:!1}):null,K=H?statusColor(V,h):"transparent",Q=Math.max(12,Math.round(.32*M)),Z=Math.max(10,Q-4),ee=p??F?.background??V.colors["bg-muted"],te=q?"contain"===u?"transparent":V.colors["bg-muted"]:P?ee:D,re=w??"avatar",ae=o?C.avatarOf(o):C.avatar,oe="verified"===h?`, ${C.verified}`:"pending"===h?`, ${C.pendingVerification}`:"",se=x??`${ae}${oe}`,ie="function"==typeof A||"function"==typeof y,ne=x??`${o||ae}${oe}`,le=Math.max(0,Math.ceil((44-M)/2)),ce=R??le,ue=[styles.root,{width:M,height:M,borderRadius:E,..._corners.smoothCorners,borderWidth:H?0:N,borderColor:O,backgroundColor:H?"transparent":te},I],de=(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[H?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.ring,{borderRadius:E,..._corners.smoothCorners,borderWidth:1.5,borderColor:K}],accessible:!1,pointerEvents:"none",testID:`${re}-ring`}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.picture,{width:Y,height:Y,borderRadius:X,..._corners.smoothCorners,borderWidth:H?N:0,borderColor:O,backgroundColor:H?te:"transparent"}],children:q?(()=>{const e={width:Y,height:Y,borderRadius:X,..._corners.smoothCorners},onError=()=>L(U);return a?(0,_jsxRuntime.jsx)(a,{source:r,onError:onError,style:e,contentFit:u,resizeMode:u,accessibilityIgnoresInvertColors:!0}):(0,_jsxRuntime.jsx)(_expoImage.Image,{source:r,onError:onError,style:e,contentFit:u,accessibilityIgnoresInvertColors:!0})})():J||(0,_jsxRuntime.jsx)(_index4.Text,{variant:"label",weight:"semibold",numberOfLines:1,maxFontSizeMultiplier:1.2,style:[styles.initials,{color:G,fontSize:B,lineHeight:Math.round(B*V.leading.body)},j],children:z??" "})}),"verified"===h?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.status,"topRight"===v?styles.badgeTopRight:styles.badgeBottomRight,{width:Q,height:Q,borderRadius:Q/2,..._corners.smoothCorners,backgroundColor:k}],accessible:!1,pointerEvents:"none",testID:`${re}-badge`,children:(0,_jsxRuntime.jsx)(_index2.AppIcon,{name:"verify",variant:"bold",size:Z,color:K})}):null,h&&!H?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.status,"topRight"===v?styles.statusTopRight:styles.statusBottomRight,{width:W,height:W,borderRadius:W/2,..._corners.smoothCorners,backgroundColor:statusColor(V,h),borderWidth:2,borderColor:k}],accessible:!1,pointerEvents:"none"}):null]}),he=ie?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{ref:t,onPress:A?e=>{const t=(0,_hapticUtils.resolveHaptic)(f,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),A?.(e)}:void 0,onLongPress:y?e=>{const t=(0,_hapticUtils.resolveHaptic)(f,"longPress");t&&(0,_hapticUtils.triggerHaptic)(t),y?.(e)}:void 0,hitSlop:ce,...(0,_hitSlop.hitSlopMarker)(ce),accessibilityRole:"button",accessibilityLabel:ne,testID:w,style:({pressed:e})=>[ue,e?styles.pressed:null],children:de}):(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,style:ue,accessible:!0,accessibilityRole:"image",accessibilityLabel:se,testID:w,children:de});return b?(0,_jsxRuntime.jsx)(AvatarSkeleton,{...e}):he});Avatar.displayName="Avatar";const AvatarSkeleton=({size:e="md",shape:t="circle",dimension:r,style:a})=>{const o=r??resolveSize(e),s="circle"===t?"circle":"rounded"===t?"rounded":"rect";return(0,_jsxRuntime.jsx)(_index3.Skeleton,{shape:s,width:o,height:o,style:a})};AvatarSkeleton.displayName="AvatarSkeleton",Avatar.Skeleton=AvatarSkeleton;const styles=_reactNative.StyleSheet.create({root:{alignItems:"center",justifyContent:"center",overflow:"visible",position:"relative"},pressed:{opacity:.7},initials:{textAlign:"center"},ring:{position:"absolute",top:0,right:0,bottom:0,left:0},picture:{alignItems:"center",justifyContent:"center",overflow:"hidden"},status:{position:"absolute"},badgeTopRight:{top:-2,right:-2,alignItems:"center",justifyContent:"center"},badgeBottomRight:{bottom:-2,right:-2,alignItems:"center",justifyContent:"center"},statusTopRight:{top:0,right:0},statusBottomRight:{bottom:0,right:0}}),SPACING_OFFSET={tight:"lg",normal:"md",loose:"sm"},STAGGER_MS=50,ENTRANCE_DURATION_MS=220,AvatarGroupItem=({delay:e,marginLeft:t,borderColor:r,borderWidth:a,children:o})=>{const s=(0,_index.useTheme)(),i=(0,_react.useRef)((0,_index.createAnimatedValue)(0)).current;return(0,_react.useEffect)(()=>{const t=_reactNative.Animated.timing(i,{toValue:1,duration:220,delay:e,easing:_reactNative.Easing.out(_reactNative.Easing.cubic),useNativeDriver:!0});return t.start(),()=>t.stop()},[e,i]),(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[groupStyles.item,{marginLeft:t,borderRadius:s.radius.pill,borderColor:r,borderWidth:a,opacity:i}],children:o})},AvatarGroup=e=>{const{children:t,max:r=4,size:a="md",spacing:o="normal",overflowVariant:s="count",accessibilityLabel:i,style:n,testID:l,labels:c}=e;(0,_warnInvalidValue.warnInvalidValue)("AvatarGroup","spacing",e.spacing,["tight","normal","loose"]),(0,_warnInvalidValue.warnInvalidValue)("AvatarGroup","overflowVariant",e.overflowVariant,["count","plus"]),(0,_warnInvalidValue.warnInvalidValue)("AvatarGroup","size",e.size,Object.keys(sizeMap));const u=(0,_react.useMemo)(()=>c?{...DEFAULT_AVATAR_LABELS,...c}:DEFAULT_AVATAR_LABELS,[c]),d=(0,_index.useTheme)(),h=(0,_react.useMemo)(()=>_react.Children.toArray(t).filter(e=>(0,_react.isValidElement)(e)),[t]),v=h.length,m=h.slice(0,r),p=Math.max(0,v-r),g=p>0,_=-d.space[SPACING_OFFSET[o]],b=d.colors.surface,x=i??u.groupOf(v),A=(0,_react.useMemo)(()=>resolveSize(a),[a]),y=Math.max(d.text.xs.size,Math.round(.34*A));return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[groupStyles.row,n],accessible:!0,accessibilityLabel:x,accessibilityRole:"summary",testID:l,children:[m.map((e,t)=>{const r=e.key??`avatar-${t}`,o=(0,_react.cloneElement)(e,{size:a,labels:e.props.labels??c});return(0,_jsxRuntime.jsx)(AvatarGroupItem,{delay:50*t,marginLeft:0===t?0:_,borderColor:b,borderWidth:1.5,children:o},r)}),g?(0,_jsxRuntime.jsx)(AvatarGroupItem,{delay:50*m.length,marginLeft:0===m.length?0:_,borderColor:b,borderWidth:1.5,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[groupStyles.overflow,{width:A,height:A,borderRadius:A/2,..._corners.smoothCorners,backgroundColor:d.colors["surface-disabled"]}],accessible:!0,accessibilityRole:"text",accessibilityLabel:"count"===s?u.moreCount(p):u.moreAvatars,children:(0,_jsxRuntime.jsx)(_index4.Text,{variant:"label",weight:"semibold",color:"secondary",numberOfLines:1,maxFontSizeMultiplier:1.2,style:{fontSize:y,lineHeight:Math.round(y*d.leading.body)},children:"count"===s?`+${p}`:"+"})})},"avatar-overflow"):null]})};exports.AvatarGroup=AvatarGroup;const groupStyles=_reactNative.StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},item:{..._corners.smoothCorners},overflow:{alignItems:"center",justifyContent:"center"}});var _default=exports.default=Avatar;