@webority/mobile-ui 0.108.1 → 0.109.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/canvas-kit/kit.js +2117 -1906
- package/dist/canvas-kit/manifest.json +93 -4
- package/dist/canvas-kit/release.json +6 -6
- package/lib/commonjs/components/Banner/Banner.js +1 -1
- package/lib/commonjs/components/BarChart/BarChart.js +1 -1
- package/lib/commonjs/components/ChoiceGroup/ChoiceGroup.js +1 -1
- package/lib/commonjs/components/Composer/Composer.js +1 -1
- package/lib/commonjs/components/Descriptions/Descriptions.js +1 -1
- package/lib/commonjs/components/FilterChipRow/FilterChipRow.js +1 -1
- package/lib/commonjs/components/SectionHeader/SectionHeader.js +1 -1
- package/lib/commonjs/components/Timeline/Timeline.js +1 -1
- package/lib/commonjs/navigation/NavigationScreen.js +1 -1
- package/lib/module/components/Banner/Banner.js +1 -1
- package/lib/module/components/BarChart/BarChart.js +1 -1
- package/lib/module/components/ChoiceGroup/ChoiceGroup.js +1 -1
- package/lib/module/components/Composer/Composer.js +1 -1
- package/lib/module/components/Descriptions/Descriptions.js +1 -1
- package/lib/module/components/FilterChipRow/FilterChipRow.js +1 -1
- package/lib/module/components/SectionHeader/SectionHeader.js +1 -1
- package/lib/module/components/Timeline/Timeline.js +1 -1
- package/lib/module/navigation/NavigationScreen.js +1 -1
- package/lib/typescript/commonjs/components/Banner/Banner.d.ts +10 -0
- package/lib/typescript/commonjs/components/Banner/index.d.ts +1 -1
- package/lib/typescript/commonjs/components/BarChart/BarChart.d.ts +24 -4
- package/lib/typescript/commonjs/components/BarChart/index.d.ts +1 -1
- package/lib/typescript/commonjs/components/BottomSheet/BottomSheet.d.ts +4 -3
- package/lib/typescript/commonjs/components/ChoiceGroup/ChoiceGroup.d.ts +2 -0
- package/lib/typescript/commonjs/components/Composer/Composer.d.ts +5 -0
- package/lib/typescript/commonjs/components/Descriptions/Descriptions.d.ts +2 -0
- package/lib/typescript/commonjs/components/FilterChipRow/FilterChipRow.d.ts +2 -0
- package/lib/typescript/commonjs/components/SectionHeader/SectionHeader.d.ts +7 -0
- package/lib/typescript/commonjs/components/SectionHeader/index.d.ts +1 -1
- package/lib/typescript/commonjs/components/Timeline/Timeline.d.ts +2 -0
- package/lib/typescript/commonjs/components/index.d.ts +2 -2
- package/lib/typescript/commonjs/navigation/NavigationScreen.d.ts +6 -1
- package/lib/typescript/module/components/Banner/Banner.d.ts +10 -0
- package/lib/typescript/module/components/Banner/index.d.ts +1 -1
- package/lib/typescript/module/components/BarChart/BarChart.d.ts +24 -4
- package/lib/typescript/module/components/BarChart/index.d.ts +1 -1
- package/lib/typescript/module/components/BottomSheet/BottomSheet.d.ts +4 -3
- package/lib/typescript/module/components/ChoiceGroup/ChoiceGroup.d.ts +2 -0
- package/lib/typescript/module/components/Composer/Composer.d.ts +5 -0
- package/lib/typescript/module/components/Descriptions/Descriptions.d.ts +2 -0
- package/lib/typescript/module/components/FilterChipRow/FilterChipRow.d.ts +2 -0
- package/lib/typescript/module/components/SectionHeader/SectionHeader.d.ts +7 -0
- package/lib/typescript/module/components/SectionHeader/index.d.ts +1 -1
- package/lib/typescript/module/components/Timeline/Timeline.d.ts +2 -0
- package/lib/typescript/module/components/index.d.ts +2 -2
- package/lib/typescript/module/navigation/NavigationScreen.d.ts +6 -1
- package/package.json +6 -6
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"kind": "WeborityPhone",
|
|
3
3
|
"library": {
|
|
4
4
|
"name": "@webority/mobile-ui",
|
|
5
|
-
"version": "0.
|
|
5
|
+
"version": "0.109.0"
|
|
6
6
|
},
|
|
7
7
|
"rendererProtocolVersion": 12,
|
|
8
8
|
"platform": "Phone",
|
|
@@ -2185,6 +2185,17 @@
|
|
|
2185
2185
|
"description": "The kind of message, which sets its colour and icon.",
|
|
2186
2186
|
"default": "neutral"
|
|
2187
2187
|
},
|
|
2188
|
+
{
|
|
2189
|
+
"name": "variant",
|
|
2190
|
+
"type": "enum",
|
|
2191
|
+
"enum": [
|
|
2192
|
+
"bar",
|
|
2193
|
+
"wash"
|
|
2194
|
+
],
|
|
2195
|
+
"required": false,
|
|
2196
|
+
"description": "The look. Wash fills the banner with the tone's soft colour, with a small corner radius, no leading bar and a title in the tone's colour.",
|
|
2197
|
+
"default": "bar"
|
|
2198
|
+
},
|
|
2188
2199
|
{
|
|
2189
2200
|
"name": "visible",
|
|
2190
2201
|
"type": "boolean",
|
|
@@ -2260,7 +2271,7 @@
|
|
|
2260
2271
|
"name": "color",
|
|
2261
2272
|
"type": "string",
|
|
2262
2273
|
"required": false,
|
|
2263
|
-
"description": "A single colour for every bar. It wins over the tone."
|
|
2274
|
+
"description": "A single colour for every bar. It wins over the tone. It does not apply with series."
|
|
2264
2275
|
},
|
|
2265
2276
|
{
|
|
2266
2277
|
"name": "data",
|
|
@@ -2287,8 +2298,14 @@
|
|
|
2287
2298
|
{
|
|
2288
2299
|
"name": "value",
|
|
2289
2300
|
"type": "number",
|
|
2290
|
-
"required":
|
|
2291
|
-
"description": "The bar value. A value below zero draws under the zero line."
|
|
2301
|
+
"required": false,
|
|
2302
|
+
"description": "The bar value, for a chart without series. A value below zero draws under the zero line."
|
|
2303
|
+
},
|
|
2304
|
+
{
|
|
2305
|
+
"name": "values",
|
|
2306
|
+
"type": "object",
|
|
2307
|
+
"required": false,
|
|
2308
|
+
"description": "With series: each series' value, by series key, in place of value."
|
|
2292
2309
|
}
|
|
2293
2310
|
],
|
|
2294
2311
|
"required": true,
|
|
@@ -2319,6 +2336,40 @@
|
|
|
2319
2336
|
"required": false,
|
|
2320
2337
|
"description": "The picked bar, counted from 0, when the screen controls the selection."
|
|
2321
2338
|
},
|
|
2339
|
+
{
|
|
2340
|
+
"name": "series",
|
|
2341
|
+
"type": "array",
|
|
2342
|
+
"itemFields": [
|
|
2343
|
+
{
|
|
2344
|
+
"name": "key",
|
|
2345
|
+
"type": "string",
|
|
2346
|
+
"required": true,
|
|
2347
|
+
"description": "The key of the series in each bar's values."
|
|
2348
|
+
},
|
|
2349
|
+
{
|
|
2350
|
+
"name": "label",
|
|
2351
|
+
"type": "string",
|
|
2352
|
+
"required": true,
|
|
2353
|
+
"description": "The series name, written in the legend and read aloud with its value."
|
|
2354
|
+
},
|
|
2355
|
+
{
|
|
2356
|
+
"name": "tone",
|
|
2357
|
+
"type": "enum",
|
|
2358
|
+
"enum": [
|
|
2359
|
+
"danger",
|
|
2360
|
+
"info",
|
|
2361
|
+
"neutral",
|
|
2362
|
+
"primary",
|
|
2363
|
+
"success",
|
|
2364
|
+
"warning"
|
|
2365
|
+
],
|
|
2366
|
+
"required": false,
|
|
2367
|
+
"description": "The colour of the series. It defaults to the next of primary, info, success, warning, danger and neutral."
|
|
2368
|
+
}
|
|
2369
|
+
],
|
|
2370
|
+
"required": false,
|
|
2371
|
+
"description": "Stacks each bar into one segment per series, in this order, and adds a legend. Each bar then carries values instead of value."
|
|
2372
|
+
},
|
|
2322
2373
|
{
|
|
2323
2374
|
"name": "showValues",
|
|
2324
2375
|
"type": "boolean",
|
|
@@ -4366,6 +4417,12 @@
|
|
|
4366
4417
|
"required": true,
|
|
4367
4418
|
"description": "The text shown for the option and read aloud."
|
|
4368
4419
|
},
|
|
4420
|
+
{
|
|
4421
|
+
"name": "testID",
|
|
4422
|
+
"type": "string",
|
|
4423
|
+
"required": false,
|
|
4424
|
+
"description": "A test selector put on this option's pressable."
|
|
4425
|
+
},
|
|
4369
4426
|
{
|
|
4370
4427
|
"name": "value",
|
|
4371
4428
|
"type": "stringOrNumber",
|
|
@@ -4532,6 +4589,12 @@
|
|
|
4532
4589
|
"required": false,
|
|
4533
4590
|
"description": "Inside the bar, below the row: a disclaimer."
|
|
4534
4591
|
},
|
|
4592
|
+
{
|
|
4593
|
+
"name": "canSend",
|
|
4594
|
+
"type": "boolean",
|
|
4595
|
+
"required": false,
|
|
4596
|
+
"description": "Decides whether send is enabled. Unset, send is enabled while the text is not empty. Pass true to allow a message with an attachment and no text."
|
|
4597
|
+
},
|
|
4535
4598
|
{
|
|
4536
4599
|
"name": "disabled",
|
|
4537
4600
|
"type": "boolean",
|
|
@@ -6727,6 +6790,12 @@
|
|
|
6727
6790
|
"type": "string",
|
|
6728
6791
|
"required": true,
|
|
6729
6792
|
"description": "The text on the chip."
|
|
6793
|
+
},
|
|
6794
|
+
{
|
|
6795
|
+
"name": "testID",
|
|
6796
|
+
"type": "string",
|
|
6797
|
+
"required": false,
|
|
6798
|
+
"description": "A test selector put on this chip's pressable."
|
|
6730
6799
|
}
|
|
6731
6800
|
],
|
|
6732
6801
|
"required": true,
|
|
@@ -13339,6 +13408,26 @@
|
|
|
13339
13408
|
"marker": null,
|
|
13340
13409
|
"acceptsChildren": true,
|
|
13341
13410
|
"props": [
|
|
13411
|
+
{
|
|
13412
|
+
"name": "action",
|
|
13413
|
+
"type": "object",
|
|
13414
|
+
"fields": [
|
|
13415
|
+
{
|
|
13416
|
+
"name": "label",
|
|
13417
|
+
"type": "string",
|
|
13418
|
+
"required": true,
|
|
13419
|
+
"description": "The link text."
|
|
13420
|
+
},
|
|
13421
|
+
{
|
|
13422
|
+
"name": "testID",
|
|
13423
|
+
"type": "string",
|
|
13424
|
+
"required": false,
|
|
13425
|
+
"description": "A test selector on the link."
|
|
13426
|
+
}
|
|
13427
|
+
],
|
|
13428
|
+
"required": false,
|
|
13429
|
+
"description": "A link at the end of the heading row, such as See all."
|
|
13430
|
+
},
|
|
13342
13431
|
{
|
|
13343
13432
|
"name": "flush",
|
|
13344
13433
|
"type": "boolean",
|
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "webority-phone",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.109.0",
|
|
4
4
|
"platform": "Phone",
|
|
5
5
|
"kitModuleVersion": 2,
|
|
6
6
|
"rendererProtocolVersion": 12,
|
|
7
7
|
"library": {
|
|
8
8
|
"name": "@webority/mobile-ui",
|
|
9
|
-
"version": "0.
|
|
9
|
+
"version": "0.109.0"
|
|
10
10
|
},
|
|
11
11
|
"files": {
|
|
12
12
|
"manifest.json": {
|
|
13
|
-
"sha256": "
|
|
14
|
-
"bytes":
|
|
13
|
+
"sha256": "d4d908371673535cde1e08703be411ac2217cf3af1b044eb2209daf95594f15d",
|
|
14
|
+
"bytes": 625850
|
|
15
15
|
},
|
|
16
16
|
"kit.js": {
|
|
17
|
-
"sha256": "
|
|
18
|
-
"bytes":
|
|
17
|
+
"sha256": "6d020335714825a9fbc4c86a86ab0f24d88688f4f9620b9f99f1664581fc8271",
|
|
18
|
+
"bytes": 5938372
|
|
19
19
|
},
|
|
20
20
|
"kit.css": {
|
|
21
21
|
"sha256": "e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_BANNER_LABELS=exports.Banner=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_hitSlop=require("../../utils/hitSlop.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Skeleton/index.js"),_index3=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_BANNER_LABELS=exports.DEFAULT_BANNER_LABELS=Object.freeze({dismiss:"Dismiss banner"}),Banner=exports.Banner=(0,_react.forwardRef)((e,t)=>{const{title:r,message:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_BANNER_LABELS=exports.Banner=void 0;var _react=require("react"),_reactNative=require("react-native"),_usePresenceMotion=require("../../hooks/usePresenceMotion.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_hapticUtils=require("../../utils/hapticUtils.js"),_hitSlop=require("../../utils/hitSlop.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_index2=require("../Skeleton/index.js"),_index3=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_BANNER_LABELS=exports.DEFAULT_BANNER_LABELS=Object.freeze({dismiss:"Dismiss banner"}),Banner=exports.Banner=(0,_react.forwardRef)((e,t)=>{const{title:r,message:n,tone:i="neutral",variant:s="bar",icon:a,actions:o,dismissible:l=!1,onClose:c,haptic:u,visible:d=!0,animateMount:m=!0,loading:x=!1,accessibilityRole:p="alert",accessibilityLabel:_,labels:h,style:g,containerStyle:y,iconCircleStyle:b,tintBarStyle:v,closeButtonStyle:f,actionButtonStyle:j,testID:w}=e;(0,_warnInvalidValue.warnInvalidValue)("Banner","tone",e.tone,["primary","success","warning","danger","info","neutral"]),(0,_warnInvalidValue.warnInvalidValue)("Banner","variant",e.variant,["bar","wash"]),(0,_warnInvalidValue.warnInvalidValue)("Banner","accessibilityRole",e.accessibilityRole,["alert","summary","none"]);const R=(0,_index.useTheme)(),B=(0,_usePresenceMotion.usePresenceMotion)(),N=(0,_react.useMemo)(()=>buildStyles(R),[R]),S=(0,_react.useMemo)(()=>tintFor(R,i),[R,i]),V=(0,_react.useMemo)(()=>({...DEFAULT_BANNER_LABELS,...h}),[h]),[k,C]=B.range(-20,0),I=(0,_react.useRef)((0,_index.createAnimatedValue)(m&&d?k:0)).current,A=(0,_react.useRef)((0,_index.createAnimatedValue)(m&&d?0:d?1:0)).current,[L,D]=(0,_react.useState)(d),T=(0,_react.useRef)(!0);if((0,_react.useEffect)(()=>{if(T.current&&(T.current=!1,!m))return;let e;return d?(D(!0),e=_reactNative.Animated.parallel([_reactNative.Animated.timing(I,{toValue:C,duration:R.motion.duration.default,useNativeDriver:!0}),_reactNative.Animated.timing(A,{toValue:1,duration:B.duration("default"),useNativeDriver:!0})]),e.start()):L&&(e=_reactNative.Animated.parallel([_reactNative.Animated.timing(I,{toValue:k,duration:R.motion.duration.fast,useNativeDriver:!0}),_reactNative.Animated.timing(A,{toValue:0,duration:B.duration("fast"),useNativeDriver:!0})]),e.start(()=>{D(!1)})),()=>e?.stop()},[d]),!L)return null;const E=r??" ",q="string"==typeof n?n??" ":"",M="wash"===s,H="alert"===p?"danger"===i?"assertive":"polite":"none",z=(0,_jsxRuntime.jsxs)(_reactNative.Animated.View,{ref:t,accessibilityRole:p,accessibilityLiveRegion:H,accessibilityLabel:_,testID:w,style:[N.container,{backgroundColor:M?S.soft:R.colors["bg-subtle"],borderRadius:M?R.radius.sm:R.radius.md,..._corners.smoothCorners,padding:R.space.md,opacity:A,transform:[{translateY:I}]},g,y],children:[!M&&R.components.banner["tint-bar-width"]>0?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[N.tintBar,{backgroundColor:S.bar},v]}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:N.row,children:[!1===a?null:a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.iconWrap,children:(0,_slotIcon.renderSlotIcon)(a,{color:S.ink,size:R.text.xl.size,disabled:!1})}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[N.iconCircle,{backgroundColor:`${S.bar}22`},b],children:(0,_jsxRuntime.jsx)(_index3.Text,{variant:"body",weight:"bold",accessible:!1,style:[N.iconGlyph,{color:S.ink}],children:S.glyph})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:N.textBlock,children:[r||x?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"body",weight:"semibold",numberOfLines:2,style:{lineHeight:20,...M?{color:S.ink}:null},children:E}):null,"string"==typeof n||x?(0,_jsxRuntime.jsx)(_index3.Text,{variant:"bodySmall",color:"secondary",style:{lineHeight:18,marginTop:r?R.space.xxs:0},children:q||" "}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginTop:r?R.space.xxs:0},children:n})]}),l?(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:V.dismiss,onPress:()=>{const e=(0,_hapticUtils.resolveHaptic)(u,"selection");e&&(0,_hapticUtils.triggerHaptic)(e),c?.()},hitSlop:8,...(0,_hitSlop.hitSlopMarker)(8),style:({pressed:e})=>[N.closeBtn,{backgroundColor:e?R.colors["surface-pressed"]:"transparent"},f],children:(0,_jsxRuntime.jsx)(_index3.Text,{variant:"title",weight:"bold",color:"secondary",accessible:!1,style:{lineHeight:17},children:"×"})}):null]}),o&&o.length>0?(0,_jsxRuntime.jsx)(_reactNative.View,{style:N.actionsRow,children:o.map((e,t)=>{(0,_warnInvalidValue.warnInvalidValue)("Banner","action.tone",e.tone,["primary","success","warning","danger","info","neutral"]),(0,_warnInvalidValue.warnInvalidValue)("Banner","action.variant",e.variant,["solid","outline","ghost"]),(0,_warnInvalidValue.warnInvalidValue)("Banner","action.size",e.size,["sm","md"]);const r=e.tone??"primary",n=e.variant??"ghost",i="primary"===r?S.glyphColor:"neutral"===r?R.colors["text-muted"]:R.colors[r],s="primary"===r?S.ink:"neutral"===r?R.colors["text-muted"]:R.colors[`${r}-text`],a="primary"===r?S.on:"neutral"===r?R.colors["on-neutral-strong"]:R.colors[`on-${r}`],o="solid"===n;return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{accessibilityRole:"button",accessibilityLabel:e.label,testID:e.testID,onPress:()=>{const t=(0,_hapticUtils.resolveHaptic)(u,"selection");t&&(0,_hapticUtils.triggerHaptic)(t),e.onPress()},style:({pressed:t})=>[N.actionBtn,"md"===e.size&&N.actionBtnMd,"outline"===n&&{borderWidth:1,borderColor:s},{backgroundColor:o?i:t?R.colors["surface-pressed"]:"transparent",opacity:o&&t?.85:1},j],children:(0,_jsxRuntime.jsx)(_index3.Text,{variant:"bodySmall",weight:"semibold",align:"center",style:{color:o?a:s},children:e.label})},`${e.label}-${t}`)})}):null]});return x?(0,_jsxRuntime.jsx)(BannerSkeleton,{...e}):z});Banner.displayName="Banner";const BannerSkeleton=({title:e,actions:t,icon:r,containerStyle:n,style:i})=>{const s=(0,_index.useTheme)(),a=!1!==r;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{flexDirection:"row",alignItems:"flex-start",backgroundColor:s.colors.surface,borderRadius:s.radius.md,..._corners.smoothCorners,padding:s.space.md,borderWidth:1,borderColor:s.colors.border},n,i],accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[a?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{marginRight:s.space.sm},children:(0,_jsxRuntime.jsx)(_index2.Skeleton,{shape:"circle",width:32,height:32})}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:{flex:1},children:[void 0!==e?(0,_jsxRuntime.jsx)(_index2.Skeleton,{shape:"text",width:"55%",height:16,style:{marginBottom:s.space.xs}}):null,(0,_jsxRuntime.jsx)(_index2.SkeletonText,{lines:2,fontSize:s.text.sm.size,lastLineWidth:"70%"}),t&&t.length>0?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{flexDirection:"row",marginTop:s.space.sm},children:t.map((e,t)=>(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:72,height:28,shape:"rounded",style:{marginRight:s.space.sm}},`sk-banner-action-${t}`))}):null]})]})};BannerSkeleton.displayName="BannerSkeleton",Banner.Skeleton=BannerSkeleton;const tintFor=(e,t)=>{switch(t){case"success":return{soft:e.colors["success-soft"],bar:e.colors.success,glyphColor:e.colors.success,ink:e.colors["success-text"],on:e.colors["on-success"],glyph:"✓"};case"warning":return{soft:e.colors["warning-soft"],bar:e.colors.warning,glyphColor:e.colors.warning,ink:e.colors["warning-text"],on:e.colors["on-warning"],glyph:"⚠"};case"danger":return{soft:e.colors["danger-soft"],bar:e.colors.danger,glyphColor:e.colors.danger,ink:e.colors["danger-text"],on:e.colors["on-danger"],glyph:"✗"};case"neutral":return{soft:e.colors["bg-subtle"],bar:e.colors["text-subtle"],glyphColor:e.colors["text-muted"],ink:e.colors["text-muted"],on:e.colors["on-neutral-strong"],glyph:"i"};case"primary":return{soft:e.colors["primary-soft"],bar:e.colors.primary,glyphColor:e.colors.primary,ink:e.colors["primary-text"],on:e.colors["on-primary"],glyph:"i"};case"info":return{soft:e.colors["info-soft"],bar:e.colors.info,glyphColor:e.colors.info,ink:e.colors["info-text"],on:e.colors["on-info"],glyph:"i"};default:return tintFor(e,"neutral")}},buildStyles=e=>{const t=e.components.banner,r=e.space.sm;return _reactNative.StyleSheet.create({container:{overflow:"hidden",paddingLeft:e.space.md},tintBar:{position:"absolute",left:0,top:0,bottom:0,width:t["tint-bar-width"]},row:{flexDirection:"row",alignItems:"flex-start"},iconWrap:{marginRight:r},iconCircle:{width:28,height:28,borderRadius:e.radius.pill,..._corners.smoothCorners,alignItems:"center",justifyContent:"center",marginRight:r},iconGlyph:{lineHeight:17},textBlock:{flex:1,paddingRight:e.space.xs},closeBtn:{width:28,height:28,borderRadius:e.radius.pill,..._corners.smoothCorners,alignItems:"center",justifyContent:"center",marginLeft:e.space.xxs},actionsRow:{flexDirection:"row",flexWrap:"wrap",justifyContent:"flex-end",marginTop:e.space.xs,columnGap:e.space.xs,rowGap:e.space.xs},actionBtn:{paddingHorizontal:e.space.sm,paddingVertical:e.space.xs,borderRadius:e.radius.sm,..._corners.smoothCorners,maxWidth:"100%",alignItems:"center",justifyContent:"center"},actionBtnMd:{minHeight:44,paddingHorizontal:e.space.md}})};var _default=exports.default=Banner;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_BAR_CHART_LABELS=exports.BarChart=void 0;var _mobileCore=require("@webority/mobile-core"),_react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index4=require("../Text/index.js"),_scale=require("./scale.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_BAR_CHART_LABELS=exports.DEFAULT_BAR_CHART_LABELS=Object.freeze({chart:"Bar chart",noData:"no data",highest:(e,t)=>`Highest: ${e}, ${t}`}),AUTO_VALUES_MAX_BARS=7,MAX_BAR_WIDTH=40,BAR_SHARE=.6,MIN_BAR_HEIGHT=2,VALUE_LABEL_ROOM=20,PLOT_PAD=6,HEADER_MIN_HEIGHT=48,AXIS_LABEL_MIN_WIDTH=44,CHAR_WIDTH=7,FONT_SCALE_CAP=1.2,toneColor=(e,t)=>"neutral"===t?e.colors["text-muted"]:e.colors[`${t}-text`],safe=e=>Number.isFinite(e)?e:0,defaultFormatValue=e=>(0,_mobileCore.formatNumber)(e),defaultFormatTick=e=>(0,_mobileCore.formatCompactNumber)(e),BarChart=exports.BarChart=(0,_react.forwardRef)((e,t)=>{const{data:r,tone:a="primary",color:i,height:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_BAR_CHART_LABELS=exports.BarChart=void 0;var _mobileCore=require("@webority/mobile-core"),_react=require("react"),_reactNative=require("react-native"),_reactNativeGestureHandler=require("react-native-gesture-handler"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_index3=require("../../utils/index.js"),_corners=require("../../utils/corners.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index4=require("../Text/index.js"),_scale=require("./scale.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_BAR_CHART_LABELS=exports.DEFAULT_BAR_CHART_LABELS=Object.freeze({chart:"Bar chart",noData:"no data",highest:(e,t)=>`Highest: ${e}, ${t}`}),AUTO_VALUES_MAX_BARS=7,MAX_BAR_WIDTH=40,BAR_SHARE=.6,MIN_BAR_HEIGHT=2,VALUE_LABEL_ROOM=20,PLOT_PAD=6,HEADER_MIN_HEIGHT=48,AXIS_LABEL_MIN_WIDTH=44,CHAR_WIDTH=7,SWATCH_SIZE=10,STACK_TONES=["primary","info","success","warning","danger","neutral"],FONT_SCALE_CAP=1.2,toneColor=(e,t)=>"neutral"===t?e.colors["text-muted"]:e.colors[`${t}-text`],safe=e=>"number"==typeof e&&Number.isFinite(e)?e:0,defaultFormatValue=e=>(0,_mobileCore.formatNumber)(e),defaultFormatTick=e=>(0,_mobileCore.formatCompactNumber)(e),BarChart=exports.BarChart=(0,_react.forwardRef)((e,t)=>{const{data:r,tone:a="primary",color:i,series:s,height:n=160,label:l,summary:o,formatValue:c=defaultFormatValue,formatTick:u=defaultFormatTick,showValues:d,selection:m,defaultSelection:_=null,onSelect:x,haptic:h,labels:b,style:p,testID:f}=e;(0,_warnInvalidValue.warnInvalidValue)("BarChart","tone",e.tone,["primary","success","warning","danger","info","neutral"]);const y=(0,_react.useMemo)(()=>({...DEFAULT_BAR_CHART_LABELS,...b}),[b]),j=(0,_index2.useTheme)(),v=r.length,[R,g]=(0,_react.useState)(0),[w,S]=(0,_index.useControllableState)({value:m,defaultValue:_,onChange:x}),T=null!==w&&w>=0&&w<v?w:null,C=(0,_react.useRef)(T);C.current=T;const A=(0,_react.useRef)(-1),M=(0,_index3.resolveHaptic)(h,"tick"),N=(0,_react.useCallback)(()=>{M&&(0,_index3.triggerHaptic)(M)},[M]),L=d??(v>0&&v<=7),V=void 0!==s&&s.length>0,E=(0,_react.useMemo)(()=>V?s.map((e,t)=>e.tone??STACK_TONES[t%STACK_TONES.length]):[],[V,s]),I=(0,_react.useMemo)(()=>V?s.map(e=>e.key):[],[V,s]),B=(0,_react.useMemo)(()=>V?r.map(e=>s.map(t=>safe(e.values?.[t.key]))):null,[r,s,V]),D=(0,_react.useMemo)(()=>B?B.map(e=>e.reduce((e,t)=>e+t,0)):r.map(e=>safe(e.value)),[r,B]),H=(0,_react.useMemo)(()=>B?B.flatMap(e=>[e.reduce((e,t)=>t>0?e+t:e,0),e.reduce((e,t)=>t<0?e+t:e,0)]):D,[B,D]),$=(0,_react.useMemo)(()=>(0,_scale.barScale)(H),[H]),k=L?20:6,O=L&&$.min<0?20:6,F=Math.max(1,n-k-O),G=(0,_react.useCallback)(e=>k+($.max-e)/($.max-$.min)*F,[k,$.max,$.min,F]),q=G(0),W=(0,_react.useMemo)(()=>$.ticks.map(e=>u(e)),[$.ticks,u]),U=Math.ceil(7*Math.max(...W.map(e=>e.length),1)*1.2),z=v>0?R/v:0,P=Math.max(1,Math.ceil(44/Math.max(1,z||44))),X=(0,_react.useCallback)(e=>{const t=r[e];return t.accessibilityLabel?t.accessibilityLabel:B&&s?`${t.label}, ${s.map((t,r)=>`${t.label} ${c(B[e][r])}`).join(", ")}`:`${t.label}, ${c(D[e])}`},[r,c,D,B,s]),K=(0,_react.useMemo)(()=>{let e=-1;return D.forEach((t,r)=>{(-1===e||t>D[e])&&(e=r)}),e},[D]),J=o??(K>=0?y.highest(r[K].label,c(D[K])):""),Y=(0,_react.useRef)({fire:N,setSelected:S,count:v,plotWidth:R});Y.current={fire:N,setSelected:S,count:v,plotWidth:R};const Z=(0,_react.useMemo)(()=>{const indexAt=e=>{const{count:t,plotWidth:r}=Y.current;return 0===t||r<=0||!Number.isFinite(e)?-1:Math.min(t-1,Math.max(0,Math.floor(e/r*t)))},scrubTo=e=>{const t=indexAt(e);t<0||t===A.current||(A.current=t,Y.current.fire(),Y.current.setSelected(t))},e=_reactNativeGestureHandler.Gesture.Pan().runOnJS(!0).activeOffsetX([-8,8]).failOffsetY([-12,12]).onStart(e=>{A.current=C.current??-1,scrubTo(e.x)}).onUpdate(e=>scrubTo(e.x)).withTestId(f?`${f}-pan`:"bar-chart-pan"),t=_reactNativeGestureHandler.Gesture.Tap().runOnJS(!0).onEnd((e,t)=>{if(!t)return;const r=indexAt(e.x);r<0||(Y.current.fire(),A.current=r,Y.current.setSelected(r===C.current?null:r))}).withTestId(f?`${f}-tap`:"bar-chart-tap");return _reactNativeGestureHandler.Gesture.Race(e,t)},[f]),Q=(0,_react.useCallback)(e=>{if(0===v)return;const t=C.current,r="increment"===e.nativeEvent.actionName?null===t?0:Math.min(v-1,t+1):null===t?v-1:Math.max(0,t-1);r!==t&&(N(),S(r))},[v,N,S]),ee=(0,_react.useCallback)(e=>{const t=Math.round(e.nativeEvent.layout.width);g(e=>e===t?e:t)},[]),te=i??toneColor(j,a),re=j.radius.sm,ae=l??y.chart,ie=0===v?`${ae}, ${y.noData}`:J?`${ae}, ${J}`:ae,se=null===T?J:X(T),ne=Math.min(40,Math.max(4,.6*z)),renderStack=(e,t,r)=>{const a=e.reduce((e,t)=>t>0?e+t:e,0),i=e.reduce((e,t)=>t<0?e+t:e,0);if(0===a&&0===i)return null;const s=G(a),n=[];let l=0,o=0;return e.forEach((e,r)=>{if(0===e)return;const a=e>0?l:o,i=a+e;e>0?l=i:o=i;const c=G(a),u=G(i);n.push((0,_jsxRuntime.jsx)(_reactNative.View,{testID:f?`${f}-bar-${t}-series-${r}`:void 0,style:{position:"absolute",left:0,right:0,top:Math.min(c,u)-s,height:Math.abs(c-u),backgroundColor:toneColor(j,E[r])}},I[r]))}),(0,_jsxRuntime.jsx)(_reactNative.View,{testID:f?`${f}-bar-${t}`:void 0,style:{position:"absolute",left:(z-ne)/2,top:s,width:ne,height:Math.max(2,G(i)-s),overflow:"hidden",opacity:r?.4:1,..._corners.smoothCorners,...a>0?{borderTopLeftRadius:re,borderTopRightRadius:re}:null,...i<0?{borderBottomLeftRadius:re,borderBottomRightRadius:re}:null},children:n})},le=D.map((e,t)=>{const r=G(e),a=e>=0?r:q,i=0===e?0:Math.max(2,Math.abs(r-q)),s=null!==T&&T!==t;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.slot,{height:n}],children:[R>0&&B?renderStack(B[t],t,s):null,R>0&&!B&&i>0?(0,_jsxRuntime.jsx)(_reactNative.View,{testID:f?`${f}-bar-${t}`:void 0,style:{position:"absolute",left:(z-ne)/2,top:a,width:ne,height:i,backgroundColor:te,opacity:s?.4:1,..._corners.smoothCorners,...e>=0?{borderTopLeftRadius:re,borderTopRightRadius:re}:{borderBottomLeftRadius:re,borderBottomRightRadius:re}}}):null,L&&R>0?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"secondary",align:"center",numberOfLines:1,maxFontSizeMultiplier:1.2,style:{position:"absolute",left:0,right:0,top:e>=0?(B?G(H[2*t]):r)-20+2:(B?G(H[2*t+1]):r)+2},children:u(e)}):null]},t)});return 0===v?(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessible:!0,accessibilityRole:"image",accessibilityLabel:ie,testID:f,style:[styles.root,p],children:(0,_jsxRuntime.jsx)(_index4.Text,{variant:"bodySmall",color:"secondary",children:"No data"})}):(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessible:!0,accessibilityRole:"adjustable",accessibilityLabel:ie,accessibilityValue:{min:0,max:v-1,now:T??0,text:se},accessibilityActions:[{name:"increment"},{name:"decrement"}],onAccessibilityAction:Q,testID:f,style:[styles.root,p],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.header,{minHeight:48,marginBottom:j.space.sm}],children:null===T?J?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"bodySmall",color:"secondary",children:J}):null:(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"secondary",numberOfLines:1,children:r[T].label}),(0,_jsxRuntime.jsx)(_index4.Text,{variant:"h3",numberOfLines:1,testID:f?`${f}-callout`:void 0,children:c(D[T])})]})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.body,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:{width:U,height:n},children:$.ticks.map((e,t)=>(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"tertiary",align:"right",numberOfLines:1,maxFontSizeMultiplier:1.2,style:{position:"absolute",right:j.space.xs,left:0,top:G(e)-8},children:W[t]},e))}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.plotColumn,children:[(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:Z,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:{height:n},onLayout:ee,testID:f?`${f}-plot`:void 0,children:[$.ticks.map(e=>(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:{position:"absolute",left:0,right:0,top:G(e)-(0===e?.75:_reactNative.StyleSheet.hairlineWidth),height:0===e?1.5:2*_reactNative.StyleSheet.hairlineWidth,backgroundColor:0===e?j.colors["text-subtle"]:j.colors["border-subtle"]}},e)),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.slots,{height:n}],children:le})]})}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.axis,children:r.map((e,t)=>(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.axisSlot,children:t%P===0?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:T===t?"primary":"tertiary",weight:T===t?"semibold":void 0,align:"center",numberOfLines:1,maxFontSizeMultiplier:1.2,style:z>0?{width:z*P}:void 0,children:e.axisLabel??e.label}):null},t))})]})]}),s&&V?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.legend,{marginTop:j.space.sm,columnGap:j.space.md,rowGap:j.space.xs}],children:s.map((e,t)=>(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.legendItem,{columnGap:j.space.xs}],children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:{width:10,height:10,borderRadius:j.radius.sm,..._corners.smoothCorners,backgroundColor:toneColor(j,E[t])}}),(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"secondary",numberOfLines:1,maxFontSizeMultiplier:1.2,children:e.label})]},e.key))}):null]})});BarChart.displayName="BarChart";const styles=_reactNative.StyleSheet.create({root:{alignSelf:"stretch"},header:{justifyContent:"center"},body:{flexDirection:"row"},plotColumn:{flex:1},slots:{flexDirection:"row"},slot:{flex:1},axis:{flexDirection:"row"},legend:{flexDirection:"row",flexWrap:"wrap"},legendItem:{flexDirection:"row",alignItems:"center"},axisSlot:{flex:1,alignItems:"center",overflow:"visible"}});var _default=exports.default=BarChart;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.ChoiceGroup=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"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_ChoiceText=require("../FieldBase/ChoiceText.js"),_RadioDot=require("../Radio/RadioDot.js"),_index4=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const sizeTokensOf=e=>({sm:{paddingHorizontal:e.space.sm,chipPaddingHorizontal:e.space.md,paddingVertical:e.space.xs,fontSize:e.text.sm.size,minHeight:32,iconSize:14},md:{paddingHorizontal:e.space.md,chipPaddingHorizontal:e.space.lg,paddingVertical:e.space.sm,fontSize:e.text.base.size,minHeight:40,iconSize:16},lg:{paddingHorizontal:e.space.lg,chipPaddingHorizontal:e.space.xl,paddingVertical:e.space.md,fontSize:e.text.lg.size,minHeight:48,iconSize:18}}),ChoiceGroup=exports.ChoiceGroup=(0,_react.forwardRef)((e,i)=>{const{options:t,getOptionLabel:r,getOptionValue:o,isOptionDisabled:a,getOptionDescription:n,getOptionIcon:l,getOptionColor:s,renderOption:c,variant:d="card",indicatorPosition:u="trailing",direction:p="row",gap:x,wrap:g=!1,fullWidth:h,disabled:_=!1,size:m="md",labelLines:b,descriptionLines:v=2,haptic:j,accessibilityLabel:f,style:y,optionStyle:z,description:C,helperText:w,error:R,testID:V}=e,S=(0,_index2.useTheme)(),H=(0,_react.useMemo)(()=>buildStyles(S),[S]),I=(0,_react.useMemo)(()=>sizeTokensOf(S)[m],[S,m]);(0,_warnInvalidValue.warnInvalidValue)("ChoiceGroup","variant",e.variant,["card","chip"]),(0,_warnInvalidValue.warnInvalidValue)("ChoiceGroup","size",e.size,["sm","md","lg"]),(0,_warnInvalidValue.warnInvalidValue)("ChoiceGroup","direction",e.direction,["row","column"]),(0,_warnInvalidValue.warnInvalidValue)("ChoiceGroup","indicatorPosition",e.indicatorPosition,["leading","trailing"]),(0,_warnInvalidValue.warnInvalidValue)("ChoiceGroup","selectionMode",e.selectionMode,["single","multiple"]);const T=(0,_react.useCallback)(e=>r?r(e):e.label??"",[r]),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.ChoiceGroup=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"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_slotIcon=require("../AppIcon/slotIcon.js"),_ChoiceText=require("../FieldBase/ChoiceText.js"),_RadioDot=require("../Radio/RadioDot.js"),_index4=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const sizeTokensOf=e=>({sm:{paddingHorizontal:e.space.sm,chipPaddingHorizontal:e.space.md,paddingVertical:e.space.xs,fontSize:e.text.sm.size,minHeight:32,iconSize:14},md:{paddingHorizontal:e.space.md,chipPaddingHorizontal:e.space.lg,paddingVertical:e.space.sm,fontSize:e.text.base.size,minHeight:40,iconSize:16},lg:{paddingHorizontal:e.space.lg,chipPaddingHorizontal:e.space.xl,paddingVertical:e.space.md,fontSize:e.text.lg.size,minHeight:48,iconSize:18}}),ChoiceGroup=exports.ChoiceGroup=(0,_react.forwardRef)((e,i)=>{const{options:t,getOptionLabel:r,getOptionValue:o,isOptionDisabled:a,getOptionDescription:n,getOptionIcon:l,getOptionColor:s,renderOption:c,variant:d="card",indicatorPosition:u="trailing",direction:p="row",gap:x,wrap:g=!1,fullWidth:h,disabled:_=!1,size:m="md",labelLines:b,descriptionLines:v=2,haptic:j,accessibilityLabel:f,style:y,optionStyle:z,description:C,helperText:w,error:R,testID:V}=e,S=(0,_index2.useTheme)(),H=(0,_react.useMemo)(()=>buildStyles(S),[S]),I=(0,_react.useMemo)(()=>sizeTokensOf(S)[m],[S,m]);(0,_warnInvalidValue.warnInvalidValue)("ChoiceGroup","variant",e.variant,["card","chip"]),(0,_warnInvalidValue.warnInvalidValue)("ChoiceGroup","size",e.size,["sm","md","lg"]),(0,_warnInvalidValue.warnInvalidValue)("ChoiceGroup","direction",e.direction,["row","column"]),(0,_warnInvalidValue.warnInvalidValue)("ChoiceGroup","indicatorPosition",e.indicatorPosition,["leading","trailing"]),(0,_warnInvalidValue.warnInvalidValue)("ChoiceGroup","selectionMode",e.selectionMode,["single","multiple"]);const T=(0,_react.useCallback)(e=>r?r(e):e.label??"",[r]),D=(0,_react.useCallback)(e=>o?o(e):e.value,[o]),O=(0,_react.useCallback)(e=>a?a(e):!0===e.disabled,[a]),k=(0,_react.useCallback)(e=>n?n(e):e.description,[n]),q=(0,_react.useCallback)(e=>l?l(e):e.icon,[l]),G=(0,_react.useCallback)(e=>s?s(e):e.color,[s]),L="multiple"===e.selectionMode,{min:M,max:P}=e,[N,W]=(0,_index.useControllableState)({value:e.value,defaultValue:e.defaultValue??(L?[]:void 0),onChange:e.onChange}),F=Array.isArray(N)?N:[],A=(0,_react.useCallback)(e=>{const i=D(e);if(L){const e=F.includes(i);if(e&&null!=M&&F.length<=M)return;if(!e&&null!=P&&F.length>=P)return;const t=(0,_index3.resolveHaptic)(j,"selection");return t&&(0,_index3.triggerHaptic)(t),void W(e?F.filter(e=>e!==i):[...F,i])}const t=(0,_index3.resolveHaptic)(j,"selection");t&&(0,_index3.triggerHaptic)(t),W(i)},[j,L,M,P,F,W,D]),B=h??("card"===d&&"row"===p&&!g),$=S.radius.md,surfaceFor=(e,i,t)=>i?{borderColor:S.colors.border,backgroundColor:S.colors["surface-disabled"]}:{borderColor:e?t:S.colors.border,backgroundColor:e?(0,_color.tintOf)(t,.12,S.colors["surface-selected"]):S.colors.bg},renderIcon=(e,i,t,r)=>{const o=q(e);if(null==o)return null;const a="string"==typeof o&&i?{name:o,variant:"bold"}:o;return(0,_slotIcon.renderSlotIcon)(a,{color:t,size:I.iconSize,disabled:r})},renderChip=e=>{const{option:i,selected:t,disabled:r,color:o}=e,a=r?S.colors["text-disabled"]:t?o:S.colors["text-body"],n=renderIcon(i,t,a,r);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[H.chip,{minHeight:I.minHeight,paddingHorizontal:I.chipPaddingHorizontal,paddingVertical:I.paddingVertical,borderRadius:S.radius.pill,..._corners.smoothCorners,borderWidth:S.size.border,...surfaceFor(t,r,o),columnGap:S.space.xs}],children:[n?(0,_jsxRuntime.jsx)(_reactNative.View,{children:n}):null,(0,_jsxRuntime.jsx)(_index4.Text,{weight:"medium",numberOfLines:b,ellipsizeMode:"tail",style:[H.cardLabel,{color:a,fontSize:I.fontSize,lineHeight:Math.round(I.fontSize*S.leading.body)}],children:T(i)})]})},renderDefaultCard=e=>{const{option:i,selected:t,disabled:r,color:o}=e,a=G(i),n=r?S.colors["text-disabled"]:a??S.colors["text-body"],l=k(i),s=renderIcon(i,t,n,r),c=(0,_jsxRuntime.jsx)(_RadioDot.RadioDot,{selected:t,color:o,disabled:r,size:m});return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[H.card,{minHeight:I.minHeight,paddingHorizontal:I.paddingHorizontal,paddingVertical:I.paddingVertical,borderRadius:$,..._corners.smoothCorners,borderWidth:S.size.border,...surfaceFor(t,r,o),columnGap:S.space.sm}],children:["leading"===u?c:null,s?(0,_jsxRuntime.jsx)(_reactNative.View,{children:s}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:H.cardTextWrap,children:[(0,_jsxRuntime.jsx)(_index4.Text,{weight:"medium",numberOfLines:b,ellipsizeMode:"tail",style:[H.cardLabel,{color:n,fontSize:I.fontSize,lineHeight:Math.round(I.fontSize*S.leading.body)}],children:T(i)}),l?(0,_jsxRuntime.jsx)(_index4.Text,{numberOfLines:v,ellipsizeMode:"tail",style:[H.cardDescription,{color:t?S.colors["text-muted"]:S.colors["text-subtle"],fontSize:S.text.xs.size,lineHeight:Math.round(S.text.xs.size*S.leading.body)}],children:l}):null]}),"trailing"===u?c:null]})},E="string"==typeof R&&""!==R?R:void 0,J=!0===R||void 0!==E?null:w,K=(0,_jsxRuntime.jsx)(_reactNative.View,{ref:i,accessibilityRole:L?void 0:"radiogroup",accessibilityLabel:f,accessibilityState:{disabled:_},"aria-disabled":_,testID:V,style:[{flexDirection:p,gap:x??S.space.sm,flexWrap:g?"wrap":"nowrap"},y],children:t.map((e,i)=>{const t=D(e),r=L?F.includes(t):N===t,o=L&&null!=P&&!r&&F.length>=P,a=_||o||O(e),n=G(e)??S.colors.primary,l=c||"card"!==d?void 0:k(e);return(0,_jsxRuntime.jsx)(_reactNative.Pressable,{testID:e.testID,onPress:()=>{a||A(e)},disabled:a,accessibilityRole:L?"checkbox":"radio",accessibilityLabel:l?`${T(e)}, ${l}`:T(e),accessibilityState:{checked:r,disabled:a},"aria-checked":r,"aria-disabled":a,style:[B?H.stretchOption:null,{opacity:a&&c?.55:1},z],children:({pressed:t})=>{const o={option:e,index:i,selected:r,pressed:t&&!a,disabled:a,color:n};return(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:c?c(o):"chip"===d?renderChip(o):renderDefaultCard(o)})}},String(t))})});return(0,_ChoiceText.hasChoiceDetail)({description:C,error:E,helperText:J??void 0})?(0,_jsxRuntime.jsxs)(_reactNative.View,{children:[C?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"bodySmall",color:"secondary",style:{marginBottom:S.space.xs},children:C}):null,K,void 0!==E?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"danger",accessibilityLiveRegion:"polite",style:{marginTop:S.space.xs},children:E}):J?(0,_jsxRuntime.jsx)(_index4.Text,{variant:"caption",color:"tertiary",style:{marginTop:S.space.xs},children:J}):null]}):K});ChoiceGroup.displayName="ChoiceGroup";const buildStyles=e=>_reactNative.StyleSheet.create({stretchOption:{flex:1},card:{flexDirection:"row",alignItems:"center"},chip:{flexDirection:"row",alignItems:"center",justifyContent:"center"},cardTextWrap:{flex:1},cardLabel:{includeFontPadding:!1},cardDescription:{includeFontPadding:!1,marginTop:e.space.xxs}});var _default=exports.default=ChoiceGroup;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_COMPOSER_LABELS=exports.Composer=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_useControllableState=require("../../hooks/useControllableState.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_FieldBase=require("../FieldBase/FieldBase.js"),_index2=require("../IconButton/index.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_COMPOSER_LABELS=exports.DEFAULT_COMPOSER_LABELS=Object.freeze({send:"Send",message:"Message"}),MIN_BOX=44,Composer=exports.Composer=(0,_react.forwardRef)(({onSend:e,value:t,onChangeText:a,placeholder:o,accessibilityLabel:r,labels:i,loading:s=!1,disabled:l=!1,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.DEFAULT_COMPOSER_LABELS=exports.Composer=void 0;var _react=require("react"),_reactNative=require("react-native"),_reactNativeKeyboardController=require("react-native-keyboard-controller"),_reactNativeSafeAreaContext=require("react-native-safe-area-context"),_useControllableState=require("../../hooks/useControllableState.js"),_index=require("../../theme/index.js"),_corners=require("../../utils/corners.js"),_FieldBase=require("../FieldBase/FieldBase.js"),_index2=require("../IconButton/index.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_COMPOSER_LABELS=exports.DEFAULT_COMPOSER_LABELS=Object.freeze({send:"Send",message:"Message"}),MIN_BOX=44,Composer=exports.Composer=(0,_react.forwardRef)(({onSend:e,value:t,onChangeText:a,placeholder:o,accessibilityLabel:r,labels:i,loading:s=!1,disabled:l=!1,canSend:n,maxLength:d,maxLines:c=5,leading:u,trailing:b,above:x,below:_,keyboardAware:p=!0,keyboardOffset:m,safeArea:g=!0,autoFocus:h,haptic:S,style:C,testID:v},f)=>{const y=(0,_index.useTheme)(),j=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)(),L=(0,_react.useMemo)(()=>buildStyles(y),[y]),A=i?{...DEFAULT_COMPOSER_LABELS,...i}:DEFAULT_COMPOSER_LABELS,[E,O]=(0,_useControllableState.useControllableState)({value:t,defaultValue:"",onChange:a}),N=E.trim(),R=s||l||!(n??""!==N),T=g?j.bottom:0,w=m??T,B=(0,_FieldBase.resolveFieldTextStyle)(y,{disabled:l}),F=y.text.base.size,D=Math.round(F*y.leading.body),M=(44-D)/2,k=D*c+2*M,[q,I]=(0,_react.useState)(void 0),P=(0,_react.useCallback)(e=>{const t=e.nativeEvent.contentSize.height+2*M;I(Math.min(Math.max(t,44),k))},[M,k]),z=(0,_react.useCallback)(()=>{R||(O(""),e(N))},[R,O,e,N]),V=(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[L.bar,{paddingBottom:y.space.sm+T},C],testID:v,children:[x,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:L.row,children:[u,(0,_jsxRuntime.jsx)(_reactNative.View,{style:[L.box,l?L.boxDisabled:null],children:(0,_jsxRuntime.jsx)(_reactNative.TextInput,{ref:f,value:E,onChangeText:O,multiline:!0,maxLength:d,editable:!l,autoFocus:h,placeholder:o??A.message,placeholderTextColor:B.placeholderColor,selectionColor:y.colors["field-caret"],accessibilityLabel:r??o??A.message,accessibilityState:{disabled:l},"aria-disabled":l,onContentSizeChange:"web"===_reactNative.Platform.OS?P:void 0,style:[L.input,{color:B.color,...B.weightStyle,fontSize:F,lineHeight:D,paddingVertical:M,maxHeight:k,height:"web"===_reactNative.Platform.OS?q:void 0}],testID:v?`${v}-input`:void 0})}),b,(0,_jsxRuntime.jsx)(_index2.IconButton,{icon:"send",accessibilityLabel:A.send,variant:"solid",tone:"primary",disabled:R,loading:s,haptic:S,onPress:z,testID:v?`${v}-send`:void 0})]}),_]});return p?(0,_jsxRuntime.jsx)(_reactNativeKeyboardController.KeyboardStickyView,{offset:{closed:0,opened:w},children:V}):V});Composer.displayName="Composer";const buildStyles=e=>_reactNative.StyleSheet.create({bar:{gap:e.space.xs,paddingHorizontal:e.space.md,paddingTop:e.space.sm,backgroundColor:e.colors.bg,borderTopWidth:_reactNative.StyleSheet.hairlineWidth,borderTopColor:e.colors["border-subtle"]},row:{flexDirection:"row",alignItems:"flex-end",gap:e.space.sm},box:{flex:1,minHeight:44,justifyContent:"center",backgroundColor:e.colors["field-bg"],borderRadius:e.radius.pill,..._corners.smoothCorners,paddingHorizontal:e.space.md},boxDisabled:{backgroundColor:e.colors["field-bg-disabled"]},input:{margin:e.space.none,paddingHorizontal:e.space.none,includeFontPadding:!1,textAlignVertical:"top"}});var _default=exports.default=Composer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Descriptions=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_Notation=require("../Notation/Notation.js"),_Text=require("../Text/Text.js"),_jsxRuntime=require("react/jsx-runtime");const EMPTY_VALUE="-",rowKey=(e,t)=>e.key??("string"==typeof e.label?`${e.label}-${t}`:`row-${t}`),isEmptyValue=e=>null==e||""===e||Array.isArray(e)&&!e.length,isInlineText=e=>"string"==typeof e||"number"==typeof e||(0,_react.isValidElement)(e)&&e.type===_Notation.Notation||Array.isArray(e)&&e.length>0&&e.every(isInlineText),Descriptions=({items:e,columns:t=1,size:l="md",bordered:i=!1,title:r,variant:s="list",style:a,testID:o})=>{(0,_warnInvalidValue.warnInvalidValue)("Descriptions","size",l,["sm","md"]),(0,_warnInvalidValue.warnInvalidValue)("Descriptions","variant",s,["list","summary"]),(0,_warnInvalidValue.warnInvalidValue)("Descriptions","columns",t,[1,2]);const n=(0,_index.useTheme)(),u=(0,_react.useMemo)(()=>buildStyles(n),[n]),x="sm"===l?n.text.xs.size:n.text.sm.size,c="sm"===l?n.text.sm.size:n.text.base.size,d="sm"===l?n.space.xs:n.space.sm,m="summary"===s,_=(0,_react.useMemo)(()=>({fontSize:x,color:n.colors["text-subtle"]}),[x,n.colors["text-subtle"]]),v=(0,_react.useMemo)(()=>({fontSize:c,color:n.colors["text-muted"]}),[c,n.colors["text-muted"]]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[m?null:{gap:d},a],testID:o,children:[r?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.title,{fontSize:n.text.lg.size,color:n.colors["text-body"]}],children:r}):null,e.map((e,l)=>{const r=isEmptyValue(e.value),s=2===t&&!e.full,a=r?n.colors["text-subtle"]:(0,_Text.resolveColor)(n,e.tone??"primary"),o=(0,_index.fontFor)(n,e.strong?"semibold":"normal"),y=r||isInlineText(e.value),b=r?"-":"string"==typeof e.value?e.value:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:{fontSize:c,color:a},children:e.value});return m?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[u.summaryRow,{paddingVertical:d,borderBottomColor:n.colors["border-subtle"]}],children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.summaryLabel,{fontSize:c,color:n.colors["text-muted"]}],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:v,children:e.label})}),y?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.summaryValue,{fontSize:c,color:a},o],children:b}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:u.summaryValueView,children:e.value})]},rowKey(e,l)):(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[s?u.rowSide:u.rowStack,{paddingVertical:d},i&&l>0?u.bordered:null,i&&l>0?{borderTopColor:n.colors["border-subtle"]}:null],children:["string"==typeof e.label?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.label,{fontSize:x,color:n.colors["text-subtle"]},s?u.labelSide:null],children:e.label}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:s?u.labelSide:null,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.label,{fontSize:x,color:n.colors["text-subtle"]}],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:_,children:e.label})})}),y?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.value,{fontSize:c,color:a},e.strong?o:null,s?u.valueSide:null],children:b}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:s?u.valueSide:null,children:e.value})]},rowKey(e,l))})]})};exports.Descriptions=Descriptions;const buildStyles=e=>_reactNative.StyleSheet.create({title:{...(0,_index.fontFor)(e,"semibold")},rowStack:{gap:e.space.xxs},rowSide:{flexDirection:"row",alignItems:"flex-start",gap:e.space.md},bordered:{borderTopWidth:_reactNative.StyleSheet.hairlineWidth},label:{...(0,_index.fontFor)(e,"semibold")},labelSide:{flex:4},value:{...(0,_index.fontFor)(e,"normal")},valueSide:{flex:6},summaryRow:{flexDirection:"row",alignItems:"center",gap:e.space.md,borderBottomWidth:_reactNative.StyleSheet.hairlineWidth},summaryLabel:{flex:1,...(0,_index.fontFor)(e,"normal")},summaryValue:{textAlign:"right",flexShrink:1,maxWidth:"60%"},summaryValueView:{flexShrink:1,maxWidth:"60%",alignItems:"flex-end"}});var _default=exports.default=Descriptions;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Descriptions=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_Notation=require("../Notation/Notation.js"),_Text=require("../Text/Text.js"),_jsxRuntime=require("react/jsx-runtime");const EMPTY_VALUE="-",rowKey=(e,t)=>e.key??("string"==typeof e.label?`${e.label}-${t}`:`row-${t}`),isEmptyValue=e=>null==e||""===e||Array.isArray(e)&&!e.length,isInlineText=e=>"string"==typeof e||"number"==typeof e||(0,_react.isValidElement)(e)&&e.type===_Notation.Notation||Array.isArray(e)&&e.length>0&&e.every(isInlineText),Descriptions=({items:e,columns:t=1,size:l="md",bordered:i=!1,title:r,variant:s="list",style:a,testID:o})=>{(0,_warnInvalidValue.warnInvalidValue)("Descriptions","size",l,["sm","md"]),(0,_warnInvalidValue.warnInvalidValue)("Descriptions","variant",s,["list","summary"]),(0,_warnInvalidValue.warnInvalidValue)("Descriptions","columns",t,[1,2]);const n=(0,_index.useTheme)(),u=(0,_react.useMemo)(()=>buildStyles(n),[n]),x="sm"===l?n.text.xs.size:n.text.sm.size,c="sm"===l?n.text.sm.size:n.text.base.size,d="sm"===l?n.space.xs:n.space.sm,m="summary"===s,_=(0,_react.useMemo)(()=>({fontSize:x,color:n.colors["text-subtle"]}),[x,n.colors["text-subtle"]]),v=(0,_react.useMemo)(()=>({fontSize:c,color:n.colors["text-muted"]}),[c,n.colors["text-muted"]]);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[m?null:{gap:d},a],testID:o,children:[r?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.title,{fontSize:n.text.lg.size,color:n.colors["text-body"]}],children:r}):null,e.map((e,l)=>{const r=isEmptyValue(e.value),s=2===t&&!e.full,a=r?n.colors["text-subtle"]:(0,_Text.resolveColor)(n,e.tone??"primary"),o=(0,_index.fontFor)(n,e.strong?"semibold":"normal"),y=r||isInlineText(e.value),b=r?"-":"string"==typeof e.value?e.value:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:{fontSize:c,color:a},children:e.value});return m?(0,_jsxRuntime.jsxs)(_reactNative.View,{testID:e.testID,style:[u.summaryRow,{paddingVertical:d,borderBottomColor:n.colors["border-subtle"]}],children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.summaryLabel,{fontSize:c,color:n.colors["text-muted"]}],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:v,children:e.label})}),y?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.summaryValue,{fontSize:c,color:a},o],children:b}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:u.summaryValueView,children:e.value})]},rowKey(e,l)):(0,_jsxRuntime.jsxs)(_reactNative.View,{testID:e.testID,style:[s?u.rowSide:u.rowStack,{paddingVertical:d},i&&l>0?u.bordered:null,i&&l>0?{borderTopColor:n.colors["border-subtle"]}:null],children:["string"==typeof e.label?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.label,{fontSize:x,color:n.colors["text-subtle"]},s?u.labelSide:null],children:e.label}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:s?u.labelSide:null,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.label,{fontSize:x,color:n.colors["text-subtle"]}],children:(0,_jsxRuntime.jsx)(_Notation.NotationInkContext.Provider,{value:_,children:e.label})})}),y?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[u.value,{fontSize:c,color:a},e.strong?o:null,s?u.valueSide:null],children:b}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:s?u.valueSide:null,children:e.value})]},rowKey(e,l))})]})};exports.Descriptions=Descriptions;const buildStyles=e=>_reactNative.StyleSheet.create({title:{...(0,_index.fontFor)(e,"semibold")},rowStack:{gap:e.space.xxs},rowSide:{flexDirection:"row",alignItems:"flex-start",gap:e.space.md},bordered:{borderTopWidth:_reactNative.StyleSheet.hairlineWidth},label:{...(0,_index.fontFor)(e,"semibold")},labelSide:{flex:4},value:{...(0,_index.fontFor)(e,"normal")},valueSide:{flex:6},summaryRow:{flexDirection:"row",alignItems:"center",gap:e.space.md,borderBottomWidth:_reactNative.StyleSheet.hairlineWidth},summaryLabel:{flex:1,...(0,_index.fontFor)(e,"normal")},summaryValue:{textAlign:"right",flexShrink:1,maxWidth:"60%"},summaryValueView:{flexShrink:1,maxWidth:"60%",alignItems:"flex-end"}});var _default=exports.default=Descriptions;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.FilterChipRow=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index3=require("../Chip/index.js"),_jsxRuntime=require("react/jsx-runtime");const FilterChipRowItem=(0,_react.memo)(({itemKey:e,label:t,count:a,disabled:r,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.FilterChipRow=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../hooks/index.js"),_index2=require("../../theme/index.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index3=require("../Chip/index.js"),_jsxRuntime=require("react/jsx-runtime");const FilterChipRowItem=(0,_react.memo)(({itemKey:e,label:t,count:a,disabled:r,testID:i,selected:n,size:l,variant:s,tone:o,haptic:c,onSelect:u,onItemLayout:d})=>{const p=(0,_react.useCallback)(()=>u(e),[u,e]),h=(0,_react.useCallback)(t=>d(e,t.nativeEvent.layout),[d,e]);return(0,_jsxRuntime.jsx)(_reactNative.View,{onLayout:h,collapsable:!1,children:(0,_jsxRuntime.jsx)(_index3.Chip,{label:t,count:a,selected:n,selectionMode:"radio",disabled:r,testID:i,size:l,variant:s,tone:o,haptic:!n&&c,onPress:p})})});FilterChipRowItem.displayName="FilterChipRowItem";const FilterChipRow=exports.FilterChipRow=(0,_react.forwardRef)((e,t)=>{const{items:a,value:r,onChange:i,bleed:n=0,size:l,variant:s,tone:o,haptic:c,accessibilityLabel:u,style:d,contentContainerStyle:p,testID:h}=e;(0,_warnInvalidValue.warnInvalidValue)("FilterChipRow","size",e.size,["sm","md"]),(0,_warnInvalidValue.warnInvalidValue)("FilterChipRow","variant",e.variant,["solid","soft","outline"]),(0,_warnInvalidValue.warnInvalidValue)("FilterChipRow","tone",e.tone,["primary","success","warning","danger","info","neutral"]);const _=(0,_index2.useTheme)(),w=(0,_index.useReducedMotion)(),v=(0,_react.useRef)(null),m=(0,_react.useRef)({viewport:0,content:0,chips:{},revealed:null}),x=(0,_react.useRef)(r),C=(0,_react.useRef)(i);(0,_react.useEffect)(()=>{C.current=i},[i]);const y=(0,_react.useCallback)((e,t)=>{const a=m.current,r=a.chips[e];if(!r||0===a.viewport||0===a.content)return;const i=r.x+r.width/2-a.viewport/2,n=Math.min(Math.max(i,0),Math.max(a.content-a.viewport,0));v.current?.scrollTo({x:n,animated:t&&!w}),a.revealed=e},[w]),R=(0,_react.useCallback)(()=>{m.current.revealed!==x.current&&y(x.current,!1)},[y]);(0,_react.useEffect)(()=>{x.current=r,y(r,!0)},[r,y]);const b=(0,_react.useCallback)(e=>{m.current.viewport=e.nativeEvent.layout.width,R()},[R]),I=(0,_react.useCallback)(e=>{m.current.content=e,R()},[R]),f=(0,_react.useCallback)((e,t)=>{m.current.chips[e]={x:t.x,width:t.width},R()},[R]),j=(0,_react.useCallback)(e=>{e!==x.current?C.current(e):y(e,!0)},[y]),k=(0,_react.useMemo)(()=>[styles.row,{paddingHorizontal:n,columnGap:_.space.xs},p],[n,_.space.xs,p]);return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:t,accessibilityRole:"radiogroup",accessibilityLabel:u,testID:h,style:[n>0?{marginHorizontal:-n}:null,d],children:(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{ref:v,horizontal:!0,showsHorizontalScrollIndicator:!1,keyboardShouldPersistTaps:"handled",contentContainerStyle:k,onLayout:b,onContentSizeChange:I,children:a.map(e=>(0,_jsxRuntime.jsx)(FilterChipRowItem,{itemKey:e.key,label:e.label,count:e.count,disabled:e.disabled,testID:e.testID,selected:e.key===r,size:l,variant:s,tone:o,haptic:c,onSelect:j,onItemLayout:f},e.key))})})});FilterChipRow.displayName="FilterChipRow";const styles=_reactNative.StyleSheet.create({row:{alignItems:"center"}});var _default=exports.default=FilterChipRow;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.SectionHeader=exports.DEFAULT_SECTION_HEADER_LABELS=void 0;var _react=require("react"),_index=require("../../theme/index.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index2=require("../FieldBase/index.js"),_Text=require("../Text/Text.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_SECTION_HEADER_LABELS=exports.DEFAULT_SECTION_HEADER_LABELS=Object.freeze({required:e=>`${e}, required`}),SectionHeader=e=>{const{children:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.SectionHeader=exports.DEFAULT_SECTION_HEADER_LABELS=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index2=require("../Button/index.js"),_index3=require("../FieldBase/index.js"),_Text=require("../Text/Text.js"),_jsxRuntime=require("react/jsx-runtime");const DEFAULT_SECTION_HEADER_LABELS=exports.DEFAULT_SECTION_HEADER_LABELS=Object.freeze({required:e=>`${e}, required`}),SectionHeader=e=>{const{children:t,variant:r="title",flush:i=!1,required:a=!1,action:s,labels:n,style:o,testID:l}=e;(0,_warnInvalidValue.warnInvalidValue)("SectionHeader","variant",e.variant,["title","caps","sub"]);const c=(0,_index.useTheme)(),u=(0,_react.useMemo)(()=>({...DEFAULT_SECTION_HEADER_LABELS,...n}),[n]),d=(0,_react.useMemo)(()=>({marginTop:i?0:c.space.lg,marginBottom:c.space.sm}),[c,i]),_=(0,_react.useMemo)(()=>({flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:c.space.sm}),[c]),x=(0,_react.useMemo)(()=>({flex:1}),[]),v="caps"===r?{variant:"overline",color:"tertiary",weight:void 0}:"sub"===r?{variant:"label",color:"primary",weight:"semibold"}:{variant:"title",color:void 0,weight:void 0},m=(0,_jsxRuntime.jsxs)(_Text.Text,{variant:v.variant,color:v.color,weight:v.weight,accessibilityRole:"header",accessibilityLabel:a&&"string"==typeof t?u.required(t):void 0,style:s?x:[d,o],testID:l,children:[t,a?(0,_jsxRuntime.jsx)(_index3.RequiredMark,{}):null]});return s?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[_,d,o],children:[m,(0,_jsxRuntime.jsx)(_index2.Button,{variant:"link",size:"sm",label:s.label,onPress:s.onPress,testID:s.testID})]}):m};exports.SectionHeader=SectionHeader;var _default=exports.default=SectionHeader;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Timeline=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"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index2=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const DOT=12,HALO=6,RAIL=2,GUTTER=28,DISC=24,HALO_OPACITY=.16,STATUS_VALUES=["upcoming","current","done","onHold","rejected","cancelled","skipped"],Timeline=({items:e,variant:t="feed",orientation:r="vertical",style:i,testID:n})=>{const s=(0,_index.useTheme)(),l=s.space.xs,a=(0,_react.useMemo)(()=>buildStyles(s),[s]),o="horizontal"===r,c=s.colors.border;(0,_warnInvalidValue.warnInvalidValue)("Timeline","variant",t,["feed","progress"]),(0,_warnInvalidValue.warnInvalidValue)("Timeline","orientation",r,["vertical","horizontal"]);const[d,u]=(0,_react.useState)(0),x=(0,_react.useCallback)(e=>{const{width:t}=e.nativeEvent.layout;u(e=>e===t?e:t)},[]),m=o&&d>0&&e.length>0?d/e.length:0,renderDisc=(e,t)=>e.icon?(0,_jsxRuntime.jsx)(_reactNative.View,{style:a.disc,children:e.icon}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.disc,{backgroundColor:(0,_color.tintOf)(t,.16,s.colors["bg-muted"])}],children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.dot,{backgroundColor:t}]})}),renderText=(e,t)=>(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index2.Text,{variant:o?"bodySmall":"body",weight:"semibold",style:[{color:"upcoming"===t?s.colors["text-muted"]:s.colors["text-body"]},o?a.centred:null],children:e.title}),e.meta?(0,_jsxRuntime.jsx)(_index2.Text,{variant:"caption",style:[{color:s.colors["text-subtle"]},o?a.centred:null],children:e.meta}):null,e.description?(0,_jsxRuntime.jsx)(_index2.Text,{variant:"bodySmall",style:[{color:s.colors["text-muted"]},o?a.centred:null],children:e.description}):null,e.children]}),_=e.map((r,i)=>{(0,_warnInvalidValue.warnInvalidValue)("Timeline","status",r.status,STATUS_VALUES);const n=r.status??("feed"===t?"done":"upcoming"),d=r.color??(e=>{switch(e){case"done":return s.colors.success;case"current":return s.colors.warning;case"onHold":return s.colors.info;case"rejected":return s.colors.danger;case"cancelled":case"skipped":return s.colors["text-subtle"];default:return s.colors["text-disabled"]}})(n),u=0===i,x=i===e.length-1,_=r.key??`${r.title}-${i}`;return o?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[a.hColumn,m>0?{width:m,flex:0}:null],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:a.hDotRow,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.hSegment,{marginRight:l,backgroundColor:u?"transparent":c}]}),renderDisc(r,d),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.hSegment,{marginLeft:l,backgroundColor:x?"transparent":c}]})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:a.hBody,children:renderText(r,n)})]},_):(0,_jsxRuntime.jsxs)(_reactNative.View,{style:a.row,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:a.gutter,children:[renderDisc(r,d),x?null:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.rail,{backgroundColor:c}]})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.body,{paddingBottom:x?0:s.space.lg}],children:renderText(r,n)})]},_)});return(0,_jsxRuntime.jsx)(_reactNative.View,{style:[o?a.hRow:null,i],onLayout:o?x:void 0,testID:n,children:_})};exports.Timeline=Timeline;const buildStyles=e=>_reactNative.StyleSheet.create({row:{flexDirection:"row"},gutter:{width:Math.max(28,28),alignItems:"center"},disc:{width:24,height:24,borderRadius:e.radius.pill,..._corners.smoothCorners,alignItems:"center",justifyContent:"center"},dot:{width:12,height:12,borderRadius:e.radius.pill,..._corners.smoothCorners},rail:{width:2,flex:1,marginTop:e.space.xs,borderRadius:e.radius.pill,..._corners.smoothCorners},body:{flex:1,gap:e.space.xxs,paddingLeft:e.space.sm},hRow:{flexDirection:"row",alignItems:"flex-start"},hColumn:{flex:1,minWidth:0,alignItems:"center"},hDotRow:{alignSelf:"stretch",flexDirection:"row",alignItems:"center"},hSegment:{flex:1,height:2,borderRadius:e.radius.pill,..._corners.smoothCorners},hBody:{alignSelf:"stretch",alignItems:"center",paddingHorizontal:e.space.xs,marginTop:e.space.sm,gap:e.space.xxs},centred:{textAlign:"center"}});var _default=exports.default=Timeline;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Timeline=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"),_warnInvalidValue=require("../../utils/warnInvalidValue.js"),_index2=require("../Text/index.js"),_jsxRuntime=require("react/jsx-runtime");const DOT=12,HALO=6,RAIL=2,GUTTER=28,DISC=24,HALO_OPACITY=.16,STATUS_VALUES=["upcoming","current","done","onHold","rejected","cancelled","skipped"],Timeline=({items:e,variant:t="feed",orientation:r="vertical",style:i,testID:n})=>{const s=(0,_index.useTheme)(),l=s.space.xs,a=(0,_react.useMemo)(()=>buildStyles(s),[s]),o="horizontal"===r,c=s.colors.border;(0,_warnInvalidValue.warnInvalidValue)("Timeline","variant",t,["feed","progress"]),(0,_warnInvalidValue.warnInvalidValue)("Timeline","orientation",r,["vertical","horizontal"]);const[d,u]=(0,_react.useState)(0),x=(0,_react.useCallback)(e=>{const{width:t}=e.nativeEvent.layout;u(e=>e===t?e:t)},[]),m=o&&d>0&&e.length>0?d/e.length:0,renderDisc=(e,t)=>e.icon?(0,_jsxRuntime.jsx)(_reactNative.View,{style:a.disc,children:e.icon}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.disc,{backgroundColor:(0,_color.tintOf)(t,.16,s.colors["bg-muted"])}],children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.dot,{backgroundColor:t}]})}),renderText=(e,t)=>(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_index2.Text,{variant:o?"bodySmall":"body",weight:"semibold",style:[{color:"upcoming"===t?s.colors["text-muted"]:s.colors["text-body"]},o?a.centred:null],children:e.title}),e.meta?(0,_jsxRuntime.jsx)(_index2.Text,{variant:"caption",style:[{color:s.colors["text-subtle"]},o?a.centred:null],children:e.meta}):null,e.description?(0,_jsxRuntime.jsx)(_index2.Text,{variant:"bodySmall",style:[{color:s.colors["text-muted"]},o?a.centred:null],children:e.description}):null,e.children]}),_=e.map((r,i)=>{(0,_warnInvalidValue.warnInvalidValue)("Timeline","status",r.status,STATUS_VALUES);const n=r.status??("feed"===t?"done":"upcoming"),d=r.color??(e=>{switch(e){case"done":return s.colors.success;case"current":return s.colors.warning;case"onHold":return s.colors.info;case"rejected":return s.colors.danger;case"cancelled":case"skipped":return s.colors["text-subtle"];default:return s.colors["text-disabled"]}})(n),u=0===i,x=i===e.length-1,_=r.key??`${r.title}-${i}`;return o?(0,_jsxRuntime.jsxs)(_reactNative.View,{testID:r.testID,style:[a.hColumn,m>0?{width:m,flex:0}:null],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:a.hDotRow,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.hSegment,{marginRight:l,backgroundColor:u?"transparent":c}]}),renderDisc(r,d),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.hSegment,{marginLeft:l,backgroundColor:x?"transparent":c}]})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:a.hBody,children:renderText(r,n)})]},_):(0,_jsxRuntime.jsxs)(_reactNative.View,{testID:r.testID,style:a.row,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:a.gutter,children:[renderDisc(r,d),x?null:(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.rail,{backgroundColor:c}]})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:[a.body,{paddingBottom:x?0:s.space.lg}],children:renderText(r,n)})]},_)});return(0,_jsxRuntime.jsx)(_reactNative.View,{style:[o?a.hRow:null,i],onLayout:o?x:void 0,testID:n,children:_})};exports.Timeline=Timeline;const buildStyles=e=>_reactNative.StyleSheet.create({row:{flexDirection:"row"},gutter:{width:Math.max(28,28),alignItems:"center"},disc:{width:24,height:24,borderRadius:e.radius.pill,..._corners.smoothCorners,alignItems:"center",justifyContent:"center"},dot:{width:12,height:12,borderRadius:e.radius.pill,..._corners.smoothCorners},rail:{width:2,flex:1,marginTop:e.space.xs,borderRadius:e.radius.pill,..._corners.smoothCorners},body:{flex:1,gap:e.space.xxs,paddingLeft:e.space.sm},hRow:{flexDirection:"row",alignItems:"flex-start"},hColumn:{flex:1,minWidth:0,alignItems:"center"},hDotRow:{alignSelf:"stretch",flexDirection:"row",alignItems:"center"},hSegment:{flex:1,height:2,borderRadius:e.radius.pill,..._corners.smoothCorners},hBody:{alignSelf:"stretch",alignItems:"center",paddingHorizontal:e.space.xs,marginTop:e.space.sm,gap:e.space.xxs},centred:{textAlign:"center"}});var _default=exports.default=Timeline;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.NavigationScreen=NavigationScreen;var _bottomTabs=require("@react-navigation/bottom-tabs"),_native=require("@react-navigation/native"),_react=require("react"),_index=require("../components/Screen/index.js"),_index2=require("../theme/index.js"),_jsxRuntime=require("react/jsx-runtime");const TAB_EDGES=["top"];function NavigationScreen({kind:e="pushed",onBack:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.NavigationScreen=NavigationScreen;var _bottomTabs=require("@react-navigation/bottom-tabs"),_native=require("@react-navigation/native"),_react=require("react"),_index=require("../components/Screen/index.js"),_index2=require("../theme/index.js"),_jsxRuntime=require("react/jsx-runtime");const TAB_EDGES=["top"];function NavigationScreen({kind:e="pushed",appBar:t=!0,onBack:i,...n}){const o=(0,_native.useNavigation)(),r=(0,_react.useContext)(_bottomTabs.BottomTabBarHeightContext),a=!0===(0,_index2.useTheme)().settings.components.screen?.tabBarFloats,s=t?n:{...n,title:void 0,subtitle:void 0,leading:void 0,rightActions:void 0};return"tab"===e?(0,_jsxRuntime.jsx)(_index.Screen,{...s,largeTitle:!0,edges:TAB_EDGES,bottomInset:a?r??0:0}):(0,_jsxRuntime.jsx)(_index.Screen,{...s,largeTitle:!1,onBack:"root"!==e&&t?i??o.goBack:void 0})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useEffect,useMemo,useRef,useState}from"react";import{Animated,Pressable,StyleSheet,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{warnInvalidValue}from"../../utils/warnInvalidValue.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Skeleton,SkeletonText}from"../Skeleton/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const DEFAULT_BANNER_LABELS=Object.freeze({dismiss:"Dismiss banner"});const Banner=forwardRef((e,t)=>{const{title:r,message:
|
|
1
|
+
"use strict";import{forwardRef,useEffect,useMemo,useRef,useState}from"react";import{Animated,Pressable,StyleSheet,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{warnInvalidValue}from"../../utils/warnInvalidValue.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{Skeleton,SkeletonText}from"../Skeleton/index.js";import{Text}from"../Text/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const DEFAULT_BANNER_LABELS=Object.freeze({dismiss:"Dismiss banner"});const Banner=forwardRef((e,t)=>{const{title:r,message:o,tone:n="neutral",variant:s="bar",icon:i,actions:a,dismissible:l=!1,onClose:c,haptic:d,visible:u=!0,animateMount:m=!0,loading:p=!1,accessibilityRole:g="alert",accessibilityLabel:h,labels:y,style:b,containerStyle:x,iconCircleStyle:f,tintBarStyle:w,closeButtonStyle:j,actionButtonStyle:S,testID:v}=e;warnInvalidValue("Banner","tone",e.tone,["primary","success","warning","danger","info","neutral"]),warnInvalidValue("Banner","variant",e.variant,["bar","wash"]),warnInvalidValue("Banner","accessibilityRole",e.accessibilityRole,["alert","summary","none"]);const k=useTheme(),B=usePresenceMotion(),C=useMemo(()=>buildStyles(k),[k]),_=useMemo(()=>tintFor(k,n),[k,n]),R=useMemo(()=>({...DEFAULT_BANNER_LABELS,...y}),[y]),[V,I]=B.range(-20,0),A=useRef(createAnimatedValue(m&&u?V:0)).current,T=useRef(createAnimatedValue(m&&u?0:u?1:0)).current,[D,L]=useState(u),H=useRef(!0);if(useEffect(()=>{if(H.current&&(H.current=!1,!m))return;let e;return u?(L(!0),e=Animated.parallel([Animated.timing(A,{toValue:I,duration:k.motion.duration.default,useNativeDriver:!0}),Animated.timing(T,{toValue:1,duration:B.duration("default"),useNativeDriver:!0})]),e.start()):D&&(e=Animated.parallel([Animated.timing(A,{toValue:V,duration:k.motion.duration.fast,useNativeDriver:!0}),Animated.timing(T,{toValue:0,duration:B.duration("fast"),useNativeDriver:!0})]),e.start(()=>{L(!1)})),()=>e?.stop()},[u]),!D)return null;const M=r??" ",z="string"==typeof o?o??" ":"",N="wash"===s,P="alert"===g?"danger"===n?"assertive":"polite":"none",E=_jsxs(Animated.View,{ref:t,accessibilityRole:g,accessibilityLiveRegion:P,accessibilityLabel:h,testID:v,style:[C.container,{backgroundColor:N?_.soft:k.colors["bg-subtle"],borderRadius:N?k.radius.sm:k.radius.md,...smoothCorners,padding:k.space.md,opacity:T,transform:[{translateY:A}]},b,x],children:[!N&&k.components.banner["tint-bar-width"]>0?_jsx(View,{style:[C.tintBar,{backgroundColor:_.bar},w]}):null,_jsxs(View,{style:C.row,children:[!1===i?null:_jsx(View,i?{style:C.iconWrap,children:renderSlotIcon(i,{color:_.ink,size:k.text.xl.size,disabled:!1})}:{style:[C.iconCircle,{backgroundColor:`${_.bar}22`},f],children:_jsx(Text,{variant:"body",weight:"bold",accessible:!1,style:[C.iconGlyph,{color:_.ink}],children:_.glyph})}),_jsxs(View,{style:C.textBlock,children:[r||p?_jsx(Text,{variant:"body",weight:"semibold",numberOfLines:2,style:{lineHeight:20,...N?{color:_.ink}:null},children:M}):null,"string"==typeof o||p?_jsx(Text,{variant:"bodySmall",color:"secondary",style:{lineHeight:18,marginTop:r?k.space.xxs:0},children:z||" "}):_jsx(View,{style:{marginTop:r?k.space.xxs:0},children:o})]}),l?_jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:R.dismiss,onPress:()=>{const e=resolveHaptic(d,"selection");e&&triggerHaptic(e),c?.()},hitSlop:8,...hitSlopMarker(8),style:({pressed:e})=>[C.closeBtn,{backgroundColor:e?k.colors["surface-pressed"]:"transparent"},j],children:_jsx(Text,{variant:"title",weight:"bold",color:"secondary",accessible:!1,style:{lineHeight:17},children:"×"})}):null]}),a&&a.length>0?_jsx(View,{style:C.actionsRow,children:a.map((e,t)=>{warnInvalidValue("Banner","action.tone",e.tone,["primary","success","warning","danger","info","neutral"]),warnInvalidValue("Banner","action.variant",e.variant,["solid","outline","ghost"]),warnInvalidValue("Banner","action.size",e.size,["sm","md"]);const r=e.tone??"primary",o=e.variant??"ghost",n="primary"===r?_.glyphColor:"neutral"===r?k.colors["text-muted"]:k.colors[r],s="primary"===r?_.ink:"neutral"===r?k.colors["text-muted"]:k.colors[`${r}-text`],i="primary"===r?_.on:"neutral"===r?k.colors["on-neutral-strong"]:k.colors[`on-${r}`],a="solid"===o;return _jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:e.label,testID:e.testID,onPress:()=>{const t=resolveHaptic(d,"selection");t&&triggerHaptic(t),e.onPress()},style:({pressed:t})=>[C.actionBtn,"md"===e.size&&C.actionBtnMd,"outline"===o&&{borderWidth:1,borderColor:s},{backgroundColor:a?n:t?k.colors["surface-pressed"]:"transparent",opacity:a&&t?.85:1},S],children:_jsx(Text,{variant:"bodySmall",weight:"semibold",align:"center",style:{color:a?i:s},children:e.label})},`${e.label}-${t}`)})}):null]});return p?_jsx(BannerSkeleton,{...e}):E});Banner.displayName="Banner";const BannerSkeleton=({title:e,actions:t,icon:r,containerStyle:o,style:n})=>{const s=useTheme(),i=!1!==r;return _jsxs(View,{style:[{flexDirection:"row",alignItems:"flex-start",backgroundColor:s.colors.surface,borderRadius:s.radius.md,...smoothCorners,padding:s.space.md,borderWidth:1,borderColor:s.colors.border},o,n],accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[i?_jsx(View,{style:{marginRight:s.space.sm},children:_jsx(Skeleton,{shape:"circle",width:32,height:32})}):null,_jsxs(View,{style:{flex:1},children:[void 0!==e?_jsx(Skeleton,{shape:"text",width:"55%",height:16,style:{marginBottom:s.space.xs}}):null,_jsx(SkeletonText,{lines:2,fontSize:s.text.sm.size,lastLineWidth:"70%"}),t&&t.length>0?_jsx(View,{style:{flexDirection:"row",marginTop:s.space.sm},children:t.map((e,t)=>_jsx(Skeleton,{width:72,height:28,shape:"rounded",style:{marginRight:s.space.sm}},`sk-banner-action-${t}`))}):null]})]})};BannerSkeleton.displayName="BannerSkeleton",Banner.Skeleton=BannerSkeleton;const tintFor=(e,t)=>{switch(t){case"success":return{soft:e.colors["success-soft"],bar:e.colors.success,glyphColor:e.colors.success,ink:e.colors["success-text"],on:e.colors["on-success"],glyph:"✓"};case"warning":return{soft:e.colors["warning-soft"],bar:e.colors.warning,glyphColor:e.colors.warning,ink:e.colors["warning-text"],on:e.colors["on-warning"],glyph:"⚠"};case"danger":return{soft:e.colors["danger-soft"],bar:e.colors.danger,glyphColor:e.colors.danger,ink:e.colors["danger-text"],on:e.colors["on-danger"],glyph:"✗"};case"neutral":return{soft:e.colors["bg-subtle"],bar:e.colors["text-subtle"],glyphColor:e.colors["text-muted"],ink:e.colors["text-muted"],on:e.colors["on-neutral-strong"],glyph:"i"};case"primary":return{soft:e.colors["primary-soft"],bar:e.colors.primary,glyphColor:e.colors.primary,ink:e.colors["primary-text"],on:e.colors["on-primary"],glyph:"i"};case"info":return{soft:e.colors["info-soft"],bar:e.colors.info,glyphColor:e.colors.info,ink:e.colors["info-text"],on:e.colors["on-info"],glyph:"i"};default:return tintFor(e,"neutral")}},buildStyles=e=>{const t=e.components.banner,r=e.space.sm;return StyleSheet.create({container:{overflow:"hidden",paddingLeft:e.space.md},tintBar:{position:"absolute",left:0,top:0,bottom:0,width:t["tint-bar-width"]},row:{flexDirection:"row",alignItems:"flex-start"},iconWrap:{marginRight:r},iconCircle:{width:28,height:28,borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center",marginRight:r},iconGlyph:{lineHeight:17},textBlock:{flex:1,paddingRight:e.space.xs},closeBtn:{width:28,height:28,borderRadius:e.radius.pill,...smoothCorners,alignItems:"center",justifyContent:"center",marginLeft:e.space.xxs},actionsRow:{flexDirection:"row",flexWrap:"wrap",justifyContent:"flex-end",marginTop:e.space.xs,columnGap:e.space.xs,rowGap:e.space.xs},actionBtn:{paddingHorizontal:e.space.sm,paddingVertical:e.space.xs,borderRadius:e.radius.sm,...smoothCorners,maxWidth:"100%",alignItems:"center",justifyContent:"center"},actionBtnMd:{minHeight:44,paddingHorizontal:e.space.md}})};export{Banner};export default Banner;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{formatCompactNumber,formatNumber}from"@webority/mobile-core";import{forwardRef,useCallback,useMemo,useRef,useState}from"react";import{StyleSheet,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import{useControllableState}from"../../hooks/index.js";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{warnInvalidValue}from"../../utils/warnInvalidValue.js";import{Text}from"../Text/index.js";import{barScale}from"./scale.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";export const DEFAULT_BAR_CHART_LABELS=Object.freeze({chart:"Bar chart",noData:"no data",highest:(e,t)=>`Highest: ${e}, ${t}`});const AUTO_VALUES_MAX_BARS=7,MAX_BAR_WIDTH=40,BAR_SHARE=.6,MIN_BAR_HEIGHT=2,VALUE_LABEL_ROOM=20,PLOT_PAD=6,HEADER_MIN_HEIGHT=48,AXIS_LABEL_MIN_WIDTH=44,CHAR_WIDTH=7,FONT_SCALE_CAP=1.2,toneColor=(e,t)=>"neutral"===t?e.colors["text-muted"]:e.colors[`${t}-text`],safe=e=>Number.isFinite(e)?e:0,defaultFormatValue=e=>formatNumber(e),defaultFormatTick=e=>formatCompactNumber(e),BarChart=forwardRef((e,t)=>{const{data:r,tone:a="primary",color:s,height:i=160,label:l,summary:
|
|
1
|
+
"use strict";import{formatCompactNumber,formatNumber}from"@webority/mobile-core";import{forwardRef,useCallback,useMemo,useRef,useState}from"react";import{StyleSheet,View}from"react-native";import{Gesture,GestureDetector}from"react-native-gesture-handler";import{useControllableState}from"../../hooks/index.js";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{warnInvalidValue}from"../../utils/warnInvalidValue.js";import{Text}from"../Text/index.js";import{barScale}from"./scale.js";import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";export const DEFAULT_BAR_CHART_LABELS=Object.freeze({chart:"Bar chart",noData:"no data",highest:(e,t)=>`Highest: ${e}, ${t}`});const AUTO_VALUES_MAX_BARS=7,MAX_BAR_WIDTH=40,BAR_SHARE=.6,MIN_BAR_HEIGHT=2,VALUE_LABEL_ROOM=20,PLOT_PAD=6,HEADER_MIN_HEIGHT=48,AXIS_LABEL_MIN_WIDTH=44,CHAR_WIDTH=7,SWATCH_SIZE=10,STACK_TONES=["primary","info","success","warning","danger","neutral"],FONT_SCALE_CAP=1.2,toneColor=(e,t)=>"neutral"===t?e.colors["text-muted"]:e.colors[`${t}-text`],safe=e=>"number"==typeof e&&Number.isFinite(e)?e:0,defaultFormatValue=e=>formatNumber(e),defaultFormatTick=e=>formatCompactNumber(e),BarChart=forwardRef((e,t)=>{const{data:r,tone:a="primary",color:s,series:o,height:i=160,label:l,summary:n,formatValue:c=defaultFormatValue,formatTick:u=defaultFormatTick,showValues:m,selection:h,defaultSelection:d=null,onSelect:p,haptic:x,labels:f,style:b,testID:y}=e;warnInvalidValue("BarChart","tone",e.tone,["primary","success","warning","danger","info","neutral"]);const _=useMemo(()=>({...DEFAULT_BAR_CHART_LABELS,...f}),[f]),g=useTheme(),w=r.length,[S,j]=useState(0),[T,C]=useControllableState({value:h,defaultValue:d,onChange:p}),M=null!==T&&T>=0&&T<w?T:null,v=useRef(M);v.current=M;const R=useRef(-1),A=resolveHaptic(x,"tick"),L=useCallback(()=>{A&&triggerHaptic(A)},[A]),V=m??(w>0&&w<=7),I=void 0!==o&&o.length>0,D=useMemo(()=>I?o.map((e,t)=>e.tone??STACK_TONES[t%STACK_TONES.length]):[],[I,o]),E=useMemo(()=>I?o.map(e=>e.key):[],[I,o]),$=useMemo(()=>I?r.map(e=>o.map(t=>safe(e.values?.[t.key]))):null,[r,o,I]),k=useMemo(()=>$?$.map(e=>e.reduce((e,t)=>e+t,0)):r.map(e=>safe(e.value)),[r,$]),B=useMemo(()=>$?$.flatMap(e=>[e.reduce((e,t)=>t>0?e+t:e,0),e.reduce((e,t)=>t<0?e+t:e,0)]):k,[$,k]),H=useMemo(()=>barScale(B),[B]),O=V?20:6,F=V&&H.min<0?20:6,N=Math.max(1,i-O-F),G=useCallback(e=>O+(H.max-e)/(H.max-H.min)*N,[O,H.max,H.min,N]),W=G(0),U=useMemo(()=>H.ticks.map(e=>u(e)),[H.ticks,u]),z=Math.ceil(7*Math.max(...U.map(e=>e.length),1)*1.2),P=w>0?S/w:0,X=Math.max(1,Math.ceil(44/Math.max(1,P||44))),K=useCallback(e=>{const t=r[e];return t.accessibilityLabel?t.accessibilityLabel:$&&o?`${t.label}, ${o.map((t,r)=>`${t.label} ${c($[e][r])}`).join(", ")}`:`${t.label}, ${c(k[e])}`},[r,c,k,$,o]),J=useMemo(()=>{let e=-1;return k.forEach((t,r)=>{(-1===e||t>k[e])&&(e=r)}),e},[k]),Y=n??(J>=0?_.highest(r[J].label,c(k[J])):""),Z=useRef({fire:L,setSelected:C,count:w,plotWidth:S});Z.current={fire:L,setSelected:C,count:w,plotWidth:S};const q=useMemo(()=>{const indexAt=e=>{const{count:t,plotWidth:r}=Z.current;return 0===t||r<=0||!Number.isFinite(e)?-1:Math.min(t-1,Math.max(0,Math.floor(e/r*t)))},scrubTo=e=>{const t=indexAt(e);t<0||t===R.current||(R.current=t,Z.current.fire(),Z.current.setSelected(t))},e=Gesture.Pan().runOnJS(!0).activeOffsetX([-8,8]).failOffsetY([-12,12]).onStart(e=>{R.current=v.current??-1,scrubTo(e.x)}).onUpdate(e=>scrubTo(e.x)).withTestId(y?`${y}-pan`:"bar-chart-pan"),t=Gesture.Tap().runOnJS(!0).onEnd((e,t)=>{if(!t)return;const r=indexAt(e.x);r<0||(Z.current.fire(),R.current=r,Z.current.setSelected(r===v.current?null:r))}).withTestId(y?`${y}-tap`:"bar-chart-tap");return Gesture.Race(e,t)},[y]),Q=useCallback(e=>{if(0===w)return;const t=v.current,r="increment"===e.nativeEvent.actionName?null===t?0:Math.min(w-1,t+1):null===t?w-1:Math.max(0,t-1);r!==t&&(L(),C(r))},[w,L,C]),ee=useCallback(e=>{const t=Math.round(e.nativeEvent.layout.width);j(e=>e===t?e:t)},[]),te=s??toneColor(g,a),re=g.radius.sm,ae=l??_.chart,se=0===w?`${ae}, ${_.noData}`:Y?`${ae}, ${Y}`:ae,oe=null===M?Y:K(M),ie=Math.min(40,Math.max(4,.6*P)),renderStack=(e,t,r)=>{const a=e.reduce((e,t)=>t>0?e+t:e,0),s=e.reduce((e,t)=>t<0?e+t:e,0);if(0===a&&0===s)return null;const o=G(a),i=[];let l=0,n=0;return e.forEach((e,r)=>{if(0===e)return;const a=e>0?l:n,s=a+e;e>0?l=s:n=s;const c=G(a),u=G(s);i.push(_jsx(View,{testID:y?`${y}-bar-${t}-series-${r}`:void 0,style:{position:"absolute",left:0,right:0,top:Math.min(c,u)-o,height:Math.abs(c-u),backgroundColor:toneColor(g,D[r])}},E[r]))}),_jsx(View,{testID:y?`${y}-bar-${t}`:void 0,style:{position:"absolute",left:(P-ie)/2,top:o,width:ie,height:Math.max(2,G(s)-o),overflow:"hidden",opacity:r?.4:1,...smoothCorners,...a>0?{borderTopLeftRadius:re,borderTopRightRadius:re}:null,...s<0?{borderBottomLeftRadius:re,borderBottomRightRadius:re}:null},children:i})},le=k.map((e,t)=>{const r=G(e),a=e>=0?r:W,s=0===e?0:Math.max(2,Math.abs(r-W)),o=null!==M&&M!==t;return _jsxs(View,{style:[styles.slot,{height:i}],children:[S>0&&$?renderStack($[t],t,o):null,S>0&&!$&&s>0?_jsx(View,{testID:y?`${y}-bar-${t}`:void 0,style:{position:"absolute",left:(P-ie)/2,top:a,width:ie,height:s,backgroundColor:te,opacity:o?.4:1,...smoothCorners,...e>=0?{borderTopLeftRadius:re,borderTopRightRadius:re}:{borderBottomLeftRadius:re,borderBottomRightRadius:re}}}):null,V&&S>0?_jsx(Text,{variant:"caption",color:"secondary",align:"center",numberOfLines:1,maxFontSizeMultiplier:1.2,style:{position:"absolute",left:0,right:0,top:e>=0?($?G(B[2*t]):r)-20+2:($?G(B[2*t+1]):r)+2},children:u(e)}):null]},t)});return 0===w?_jsx(View,{ref:t,accessible:!0,accessibilityRole:"image",accessibilityLabel:se,testID:y,style:[styles.root,b],children:_jsx(Text,{variant:"bodySmall",color:"secondary",children:"No data"})}):_jsxs(View,{ref:t,accessible:!0,accessibilityRole:"adjustable",accessibilityLabel:se,accessibilityValue:{min:0,max:w-1,now:M??0,text:oe},accessibilityActions:[{name:"increment"},{name:"decrement"}],onAccessibilityAction:Q,testID:y,style:[styles.root,b],children:[_jsx(View,{style:[styles.header,{minHeight:48,marginBottom:g.space.sm}],children:null===M?Y?_jsx(Text,{variant:"bodySmall",color:"secondary",children:Y}):null:_jsxs(_Fragment,{children:[_jsx(Text,{variant:"caption",color:"secondary",numberOfLines:1,children:r[M].label}),_jsx(Text,{variant:"h3",numberOfLines:1,testID:y?`${y}-callout`:void 0,children:c(k[M])})]})}),_jsxs(View,{style:styles.body,children:[_jsx(View,{style:{width:z,height:i},children:H.ticks.map((e,t)=>_jsx(Text,{variant:"caption",color:"tertiary",align:"right",numberOfLines:1,maxFontSizeMultiplier:1.2,style:{position:"absolute",right:g.space.xs,left:0,top:G(e)-8},children:U[t]},e))}),_jsxs(View,{style:styles.plotColumn,children:[_jsx(GestureDetector,{gesture:q,children:_jsxs(View,{style:{height:i},onLayout:ee,testID:y?`${y}-plot`:void 0,children:[H.ticks.map(e=>_jsx(View,{pointerEvents:"none",style:{position:"absolute",left:0,right:0,top:G(e)-(0===e?.75:StyleSheet.hairlineWidth),height:0===e?1.5:2*StyleSheet.hairlineWidth,backgroundColor:0===e?g.colors["text-subtle"]:g.colors["border-subtle"]}},e)),_jsx(View,{style:[styles.slots,{height:i}],children:le})]})}),_jsx(View,{style:styles.axis,children:r.map((e,t)=>_jsx(View,{style:styles.axisSlot,children:t%X===0?_jsx(Text,{variant:"caption",color:M===t?"primary":"tertiary",weight:M===t?"semibold":void 0,align:"center",numberOfLines:1,maxFontSizeMultiplier:1.2,style:P>0?{width:P*X}:void 0,children:e.axisLabel??e.label}):null},t))})]})]}),o&&I?_jsx(View,{style:[styles.legend,{marginTop:g.space.sm,columnGap:g.space.md,rowGap:g.space.xs}],children:o.map((e,t)=>_jsxs(View,{style:[styles.legendItem,{columnGap:g.space.xs}],children:[_jsx(View,{style:{width:10,height:10,borderRadius:g.radius.sm,...smoothCorners,backgroundColor:toneColor(g,D[t])}}),_jsx(Text,{variant:"caption",color:"secondary",numberOfLines:1,maxFontSizeMultiplier:1.2,children:e.label})]},e.key))}):null]})});BarChart.displayName="BarChart";const styles=StyleSheet.create({root:{alignSelf:"stretch"},header:{justifyContent:"center"},body:{flexDirection:"row"},plotColumn:{flex:1},slots:{flexDirection:"row"},slot:{flex:1},axis:{flexDirection:"row"},legend:{flexDirection:"row",flexWrap:"wrap"},legendItem:{flexDirection:"row",alignItems:"center"},axisSlot:{flex:1,alignItems:"center",overflow:"visible"}});export{BarChart};export default BarChart;
|