@webority/mobile-ui 0.95.0 → 0.98.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.css +0 -0
- package/dist/canvas-kit/kit.js +52518 -0
- package/dist/canvas-kit/manifest.json +21091 -0
- package/dist/canvas-kit/release.json +25 -0
- package/lib/commonjs/canvasKit/index.js +1 -1
- package/lib/commonjs/components/AppBar/AppBar.js +1 -1
- package/lib/commonjs/components/Avatar/Avatar.js +1 -1
- package/lib/commonjs/components/Banner/Banner.js +1 -1
- package/lib/commonjs/components/BottomNavigation/BottomNavigation.js +1 -1
- package/lib/commonjs/components/Button/Button.js +1 -1
- package/lib/commonjs/components/Calendar/Calendar.js +1 -1
- package/lib/commonjs/components/Checkbox/Checkbox.js +1 -1
- package/lib/commonjs/components/Chip/Chip.js +1 -1
- package/lib/commonjs/components/DatePicker/DatePicker.js +1 -1
- package/lib/commonjs/components/EmptyState/EmptyState.meta.js +1 -1
- package/lib/commonjs/components/FilePicker/FilePicker.js +1 -1
- package/lib/commonjs/components/IconButton/IconButton.js +1 -1
- package/lib/commonjs/components/ImageGallery/ImageGallery.js +1 -1
- package/lib/commonjs/components/InlineSelect/InlineSelect.js +1 -1
- package/lib/commonjs/components/Input/Input.js +1 -1
- package/lib/commonjs/components/KeyboardToolbar/KeyboardToolbar.js +1 -1
- package/lib/commonjs/components/OptionSheet/OptionSheet.js +1 -1
- package/lib/commonjs/components/PhoneNumberInput/PhoneNumberInput.js +1 -1
- package/lib/commonjs/components/Radio/Radio.js +1 -1
- package/lib/commonjs/components/Rating/Rating.js +1 -1
- package/lib/commonjs/components/RichTextEditor/RichTextEditor.js +1 -1
- package/lib/commonjs/components/SearchBar/SearchBar.js +1 -1
- package/lib/commonjs/components/SliderField/SliderField.js +1 -1
- package/lib/commonjs/components/Stepper/Stepper.js +1 -1
- package/lib/commonjs/components/Switch/Switch.js +1 -1
- package/lib/commonjs/components/Text/Text.js +1 -1
- package/lib/commonjs/components/Toast/Toast.js +1 -1
- package/lib/commonjs/index.js +1 -1
- package/lib/commonjs/theme/index.js +1 -1
- package/lib/module/canvasKit/index.js +1 -1
- package/lib/module/components/AppBar/AppBar.js +1 -1
- package/lib/module/components/Avatar/Avatar.js +1 -1
- package/lib/module/components/Banner/Banner.js +1 -1
- package/lib/module/components/BottomNavigation/BottomNavigation.js +1 -1
- package/lib/module/components/Button/Button.js +1 -1
- package/lib/module/components/Calendar/Calendar.js +1 -1
- package/lib/module/components/Checkbox/Checkbox.js +1 -1
- package/lib/module/components/Chip/Chip.js +1 -1
- package/lib/module/components/DatePicker/DatePicker.js +1 -1
- package/lib/module/components/EmptyState/EmptyState.meta.js +1 -1
- package/lib/module/components/FilePicker/FilePicker.js +1 -1
- package/lib/module/components/IconButton/IconButton.js +1 -1
- package/lib/module/components/ImageGallery/ImageGallery.js +1 -1
- package/lib/module/components/InlineSelect/InlineSelect.js +1 -1
- package/lib/module/components/Input/Input.js +1 -1
- package/lib/module/components/KeyboardToolbar/KeyboardToolbar.js +1 -1
- package/lib/module/components/OptionSheet/OptionSheet.js +1 -1
- package/lib/module/components/PhoneNumberInput/PhoneNumberInput.js +1 -1
- package/lib/module/components/Radio/Radio.js +1 -1
- package/lib/module/components/Rating/Rating.js +1 -1
- package/lib/module/components/RichTextEditor/RichTextEditor.js +1 -1
- package/lib/module/components/SearchBar/SearchBar.js +1 -1
- package/lib/module/components/SliderField/SliderField.js +1 -1
- package/lib/module/components/Stepper/Stepper.js +1 -1
- package/lib/module/components/Switch/Switch.js +1 -1
- package/lib/module/components/Text/Text.js +1 -1
- package/lib/module/components/Toast/Toast.js +1 -1
- package/lib/module/index.js +1 -1
- package/lib/module/theme/index.js +1 -1
- package/lib/typescript/commonjs/canvasKit/index.d.ts +20 -3
- package/lib/typescript/commonjs/components/AppBar/AppBar.d.ts +1 -0
- package/lib/typescript/commonjs/components/Button/Button.meta.d.ts +1 -1
- package/lib/typescript/commonjs/components/Card/Card.meta.d.ts +1 -1
- package/lib/typescript/commonjs/components/Checkbox/Checkbox.meta.d.ts +1 -1
- package/lib/typescript/commonjs/components/DecimalInput/DecimalInput.meta.d.ts +1 -1
- package/lib/typescript/commonjs/components/EmptyState/EmptyState.meta.d.ts +1 -1
- package/lib/typescript/commonjs/components/Input/Input.meta.d.ts +1 -1
- package/lib/typescript/commonjs/components/Radio/Radio.meta.d.ts +1 -1
- package/lib/typescript/commonjs/components/SearchBar/SearchBar.meta.d.ts +1 -1
- package/lib/typescript/commonjs/components/Switch/Switch.meta.d.ts +1 -1
- package/lib/typescript/commonjs/components/Text/Text.meta.d.ts +1 -1
- package/lib/typescript/commonjs/index.d.ts +2 -3
- package/lib/typescript/commonjs/theme/index.d.ts +0 -20
- package/lib/typescript/module/canvasKit/index.d.ts +20 -3
- package/lib/typescript/module/components/AppBar/AppBar.d.ts +1 -0
- package/lib/typescript/module/components/Button/Button.meta.d.ts +1 -1
- package/lib/typescript/module/components/Card/Card.meta.d.ts +1 -1
- package/lib/typescript/module/components/Checkbox/Checkbox.meta.d.ts +1 -1
- package/lib/typescript/module/components/DecimalInput/DecimalInput.meta.d.ts +1 -1
- package/lib/typescript/module/components/EmptyState/EmptyState.meta.d.ts +1 -1
- package/lib/typescript/module/components/Input/Input.meta.d.ts +1 -1
- package/lib/typescript/module/components/Radio/Radio.meta.d.ts +1 -1
- package/lib/typescript/module/components/SearchBar/SearchBar.meta.d.ts +1 -1
- package/lib/typescript/module/components/Switch/Switch.meta.d.ts +1 -1
- package/lib/typescript/module/components/Text/Text.meta.d.ts +1 -1
- package/lib/typescript/module/index.d.ts +2 -3
- package/lib/typescript/module/theme/index.d.ts +0 -20
- package/package.json +10 -8
- package/lib/commonjs/initUI.js +0 -1
- package/lib/module/initUI.js +0 -1
- package/lib/typescript/commonjs/initUI.d.ts +0 -12
- package/lib/typescript/module/initUI.d.ts +0 -12
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{Logger}from"@webority/mobile-core";import{createContext,forwardRef,useContext,useMemo}from"react";import{Pressable,StyleSheet}from"react-native";import{spaceOf,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{fieldTextAsString,hasFieldText}from"../FieldBase/index.js";import{ChoiceText,hasChoiceDetail}from"../FieldBase/ChoiceText.js";import{RadioDot}from"./RadioDot.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const RadioGroupContext=createContext(null);export const useRadioGroup=()=>useContext(RadioGroupContext);const toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;default:return e.colors.primary}},Radio=forwardRef((e,t)=>{const{value:o,selected:i,onChange:r,disabled:s=!1,label:a,description:l,error:c,size:n="md",tone:d="primary",accessibilityLabel:p,haptic:
|
|
1
|
+
"use strict";import{Logger}from"@webority/mobile-core";import{createContext,forwardRef,useContext,useMemo}from"react";import{Pressable,StyleSheet}from"react-native";import{spaceOf,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{fieldTextAsString,hasFieldText}from"../FieldBase/index.js";import{ChoiceText,hasChoiceDetail}from"../FieldBase/ChoiceText.js";import{RadioDot}from"./RadioDot.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";export const RadioGroupContext=createContext(null);export const useRadioGroup=()=>useContext(RadioGroupContext);const toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;default:return e.colors.primary}},Radio=forwardRef((e,t)=>{const{value:o,selected:i,onChange:r,disabled:s=!1,label:a,description:l,error:c,size:n="md",tone:d="primary",accessibilityLabel:p,haptic:m,style:u,containerStyle:h,circleStyle:b,dotStyle:x,labelStyle:f,testID:y,hitSlop:g,...S}=e,w=useTheme(),C=useMemo(()=>buildStyles(w),[w]),R=useRadioGroup();__DEV__&&void 0===o&&Logger.warn("[@webority/mobile-ui] Radio was rendered without a `value`. Selection compares against it, so the group cannot track which option is chosen.");const j=R?R.selectedValue===o:!!i,T=R&&R.disabled||s,D=toneColor(w,d),_=spaceOf(w,w.components.radio["label-gap"]),v=g??6,H=p??fieldTextAsString(a),L=!0===R?.error||!0===c||hasFieldText(c);return _jsxs(Pressable,{ref:t,onPress:e=>{if(T)return;const t=resolveHaptic(m,"selection");t&&triggerHaptic(t),R?R.onChange(o):r?.(o)},disabled:T,accessibilityRole:"radio",accessibilityLabel:H,accessibilityHint:S.accessibilityHint??fieldTextAsString(l),accessibilityState:{checked:j,disabled:T},"aria-checked":j,"aria-disabled":T,testID:y,hitSlop:v,...hitSlopMarker(v),...S,style:({pressed:e})=>[C.row,hasChoiceDetail(l,c)?C.rowTop:null,{opacity:T?.55:e?.85:1},u,h],children:[_jsx(RadioDot,{selected:j,color:D,disabled:T&&!j,size:n,style:[!L||j||T?null:{borderColor:w.colors["field-border-error"]},b],dotStyle:x}),_jsx(ChoiceText,{label:a,description:l,error:c,disabled:T,labelLines:2,style:{marginLeft:_},labelStyle:f})]})});Radio.displayName="Radio";const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},rowTop:{alignItems:"flex-start"}});export{Radio};export default Radio;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useCallback,useMemo,useRef}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizePxMap={sm:16,md:24,lg:32},resolveSize=e=>"number"==typeof e?e:sizePxMap[e],PULSE_SCALE=1.2,toneColorFor=(e,t)=>"primary"===t?e.colors.primary:e.colors.warning,clampToStep=(e,t,s)=>{const i=Math.max(0,Math.min(t,e)),n=Math.round(i/s)*s;return Number(n.toFixed(2))},Star=({index:e,filled:t,size:s,filledColor:i,emptyColor:n,scale:a})=>{const
|
|
1
|
+
"use strict";import{forwardRef,useCallback,useMemo,useRef}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizePxMap={sm:16,md:24,lg:32},resolveSize=e=>"number"==typeof e?e:sizePxMap[e],PULSE_SCALE=1.2,toneColorFor=(e,t)=>"primary"===t?e.colors.primary:e.colors.warning,clampToStep=(e,t,s)=>{const i=Math.max(0,Math.min(t,e)),n=Math.round(i/s)*s;return Number(n.toFixed(2))},Star=({index:e,filled:t,size:s,filledColor:i,emptyColor:n,scale:a})=>{const o=Math.max(0,Math.min(1,t-e));return _jsxs(Animated.View,{style:[starStyles.starWrap,{width:s,height:s,transform:[{scale:a}]}],children:[_jsx(Text,{style:[starStyles.glyph,{color:n,fontSize:s,lineHeight:s}],accessible:!1,children:"☆"}),o>0?_jsx(View,{pointerEvents:"none",style:[starStyles.fillClip,{width:s*o,height:s}],children:_jsx(Text,{style:[starStyles.glyph,{color:i,fontSize:s,lineHeight:s}],accessible:!1,children:"★"})}):null]})},Rating=forwardRef((e,t)=>{const{value:s,onChange:i,max:n=5,allowHalf:a=!0,readonly:o=!1,size:l="md",tone:r="warning",label:c,loading:m=!1,haptic:u,accessibilityLabel:d,style:p,containerStyle:y,starContainerStyle:h,testID:f}=e,g=useTheme(),x=useMemo(()=>buildStyles(g),[g]),S=!o&&"function"==typeof i,b=a?.5:1,v=resolveSize(l),w=toneColorFor(g,r),j=g.colors.border,k=useRef(v),R=useCallback(e=>{k.current=e.nativeEvent.layout.width},[]),C=useRef(new Map),_=useMemo(()=>{const e=C.current,t=[];for(let s=0;s<n;s+=1){let i=e.get(s);i||(i=new Animated.Value(1),e.set(s,i)),t.push(i)}for(const t of Array.from(e.keys()))t>=n&&e.delete(t);return t},[n]),M=g.settings.components.rating?.pulseOnPress??!1,z=useCallback(e=>{const t=_[e];t&&Animated.sequence([Animated.timing(t,{toValue:1.2,duration:g.motion.duration.fast,easing:Easing.bezier(...g.motion.ease["in-out"]),useNativeDriver:!0}),Animated.spring(t,{toValue:1,damping:g.motion.spring.bouncy.damping,stiffness:g.motion.spring.bouncy.stiffness,mass:g.motion.spring.bouncy.mass,useNativeDriver:!0})]).start()},[g.motion,_]),A=useCallback((e,t)=>{if(!S||!i)return;const s=clampToStep(e,n,b),a=resolveHaptic(u,"selection");a&&triggerHaptic(a),M&&"number"==typeof t&&z(t),i(s)},[S,i,n,b,z,u,M]),V=useCallback(e=>t=>{if(!S)return;const s=k.current||v,i=t.nativeEvent.locationX??s;let n;n=a&&i<s/2?e+.5:e+1,A(n,e)},[S,v,a,A]),P=useCallback(e=>{S&&("increment"===e.nativeEvent.actionName?A(s+b):"decrement"===e.nativeEvent.actionName&&A(s-b))},[S,s,b,A]),E=`${s} of ${n} stars`,T=d??c??E,D=[];for(let e=0;e<n;e+=1){const t=_[e];if(!t)continue;const i=_jsx(Star,{index:e,filled:s,size:v,filledColor:w,emptyColor:j,scale:t},e);D.push(S?_jsx(Pressable,{onPress:V(e),onLayout:0===e?R:void 0,hitSlop:4,...hitSlopMarker(4),accessible:!1,style:x.starPress,children:i},e):_jsx(View,{onLayout:0===e?R:void 0,style:x.starPress,children:i},e))}const H=_jsxs(View,{style:[x.wrapper,p,y],ref:t,testID:f,children:[c?_jsx(Text,{style:[x.label,{color:g.colors["text-muted"],fontSize:g.text.sm.size}],children:c}):null,_jsx(View,{style:[x.row,h],accessible:!0,accessibilityRole:S?"adjustable":"text",accessibilityLabel:T,accessibilityValue:S?{min:0,max:n,now:s,text:E}:void 0,accessibilityActions:S?[{name:"increment"},{name:"decrement"}]:void 0,onAccessibilityAction:S?P:void 0,children:D})]});return m?_jsx(RatingSkeleton,{...e}):H});Rating.displayName="Rating";const RatingSkeleton=({max:e=5,size:t="md",label:s,containerStyle:i,starContainerStyle:n,style:a})=>{const o=useTheme(),l=resolveSize(t),r=Math.max(1,e);return _jsxs(View,{style:[{alignItems:"flex-start"},i,a],accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[void 0!==s?_jsx(Skeleton,{shape:"text",width:80,height:14,style:{marginBottom:o.space.xs}}):null,_jsx(View,{style:[{flexDirection:"row"},n],children:Array.from({length:r}).map((e,t)=>_jsx(Skeleton,{width:l,height:l,radius:Math.round(.25*l),style:t<r-1?{marginRight:o.space.xs}:void 0},`sk-star-${t}`))})]})};RatingSkeleton.displayName="RatingSkeleton",Rating.Skeleton=RatingSkeleton;const starStyles=StyleSheet.create({starWrap:{position:"relative",alignItems:"flex-start",justifyContent:"center"},glyph:{textAlign:"left",includeFontPadding:!1},fillClip:{position:"absolute",top:0,left:0,overflow:"hidden"}}),buildStyles=e=>StyleSheet.create({wrapper:{flexDirection:"column"},row:{flexDirection:"row",alignItems:"center"},starPress:{marginRight:e.space.xs},label:{marginBottom:e.space.xs}});export{Rating};export default Rating;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useCallback,useMemo,useState}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{Skeleton}from"../Skeleton/index.js";import{applyMarkdownAction,normalizeSelection}from"./markdownActions.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const ACTION_META={bold:{glyph:"B",label:"Bold"},italic:{glyph:"I",label:"Italic"},strikethrough:{glyph:"S",label:"Strikethrough"},code:{glyph:"</>",label:"Inline code"},link:{glyph:"link",label:"Link"},heading1:{glyph:"H1",label:"Heading 1"},heading2:{glyph:"H2",label:"Heading 2"},bulletList:{glyph:"•",label:"Bulleted list"},numberedList:{glyph:"1.",label:"Numbered list"},quote:{glyph:">",label:"Quote"}},DEFAULT_ACTIONS=["bold","italic","strikethrough","code","link","heading1","heading2","bulletList","numberedList","quote"],DEFAULT_MIN_HEIGHT=160,TOOLBAR_GLYPH_MAX_SCALE=1.5;export const RichTextEditor=forwardRef((e,t)=>{const{value:o,onChangeText:
|
|
1
|
+
"use strict";import{forwardRef,useCallback,useMemo,useState}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{resolveHaptic,triggerHaptic}from"../../utils/index.js";import{smoothCorners}from"../../utils/corners.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{Skeleton}from"../Skeleton/index.js";import{applyMarkdownAction,normalizeSelection}from"./markdownActions.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const ACTION_META={bold:{glyph:"B",label:"Bold"},italic:{glyph:"I",label:"Italic"},strikethrough:{glyph:"S",label:"Strikethrough"},code:{glyph:"</>",label:"Inline code"},link:{glyph:"link",label:"Link"},heading1:{glyph:"H1",label:"Heading 1"},heading2:{glyph:"H2",label:"Heading 2"},bulletList:{glyph:"•",label:"Bulleted list"},numberedList:{glyph:"1.",label:"Numbered list"},quote:{glyph:">",label:"Quote"}},DEFAULT_ACTIONS=["bold","italic","strikethrough","code","link","heading1","heading2","bulletList","numberedList","quote"],DEFAULT_MIN_HEIGHT=160,TOOLBAR_GLYPH_MAX_SCALE=1.5;export const RichTextEditor=forwardRef((e,t)=>{const{value:o,onChangeText:i,placeholder:l,actions:s=DEFAULT_ACTIONS,disabled:r=!1,loading:n=!1,minHeight:a=DEFAULT_MIN_HEIGHT,autoFocus:d=!1,accessibilityLabel:c,haptic:h,style:u,toolbarStyle:b,inputStyle:p,testID:m}=e,g=useTheme(),x=useMemo(()=>buildStyles(g),[g]),y=o??"",[S,T]=useState({start:0,end:0}),[k,f]=useState(!1),[_,j]=useState(null),C=useCallback(e=>{T(e.nativeEvent.selection),j(null)},[]),I=useCallback(e=>{j(null),i?.(e)},[i]),H=useCallback(e=>{if(r)return;const t=resolveHaptic(h,"selection");t&&triggerHaptic(t);const o=applyMarkdownAction({text:y,selection:normalizeSelection(S,y.length)},e);T(o.selection),j(o.selection),i?.(o.text)},[r,h,i,S,y]);return n?_jsx(RichTextEditorSkeleton,{actionCount:s.length,minHeight:a,style:u,testID:m}):_jsxs(View,{testID:m,style:[x.container,{borderColor:k?g.colors["focus-ring"]:g.colors.border,opacity:r?.55:1},u],children:[_jsx(View,{style:[x.toolbar,b],children:s.map(e=>_jsx(ToolbarButton,{action:e,disabled:r,onPress:H,styles:x,theme:g,testID:m?`${m}-${e}`:void 0},e))}),_jsx(TextInput,{ref:t,value:y,onChangeText:I,onSelectionChange:C,onFocus:()=>f(!0),onBlur:()=>f(!1),selection:_??void 0,editable:!r,autoFocus:d,multiline:!0,textAlignVertical:"top",placeholder:l,placeholderTextColor:g.colors["text-subtle"],accessibilityLabel:c,style:[x.input,{minHeight:a},p],testID:m?`${m}-input`:void 0})]})});RichTextEditor.displayName="RichTextEditor";const ToolbarButton=({action:e,disabled:t,onPress:o,styles:i,theme:l,testID:s})=>{const r=ACTION_META[e],n={color:t?l.colors["text-disabled"]:l.colors["text-body"]};return"bold"===e&&(n.fontWeight=l.weight.bold),"italic"===e&&(n.fontStyle="italic"),"strikethrough"===e&&(n.textDecorationLine="line-through"),_jsx(Pressable,{onPress:()=>o(e),disabled:t,accessibilityRole:"button",accessibilityLabel:r.label,accessibilityState:{disabled:t},"aria-disabled":t,hitSlop:4,...hitSlopMarker(4),testID:s,style:({pressed:e})=>[i.button,{backgroundColor:e?l.colors["surface-pressed"]:l.colors["bg-subtle"]}],children:_jsx(Text,{maxFontSizeMultiplier:Math.min(l.settings.maxFontSizeMultiplier??1.5,1.5),style:[i.buttonLabel,n],children:r.glyph})})};ToolbarButton.displayName="RichTextEditorToolbarButton";const RichTextEditorSkeleton=({actionCount:e,minHeight:t,style:o,testID:i})=>{const l=useTheme(),s=useMemo(()=>buildStyles(l),[l]),r=Array.from({length:Math.max(1,e)},(e,t)=>t);return _jsxs(View,{testID:i,style:[s.container,o],children:[_jsx(View,{style:s.toolbar,children:r.map(e=>_jsx(Skeleton,{width:34,height:30,radius:"sm"},e))}),_jsxs(View,{style:[s.skeletonBody,{minHeight:t}],children:[_jsx(Skeleton,{shape:"text",width:"94%",height:14}),_jsx(Skeleton,{shape:"text",width:"100%",height:14}),_jsx(Skeleton,{shape:"text",width:"72%",height:14})]})]})};RichTextEditorSkeleton.displayName="RichTextEditorSkeleton";const buildStyles=e=>StyleSheet.create({container:{borderWidth:e.size.border,borderColor:e.colors.border,borderRadius:e.radius.md,...smoothCorners,backgroundColor:e.colors.bg,overflow:"hidden"},toolbar:{flexDirection:"row",flexWrap:"wrap",alignItems:"center",gap:e.space.xs,padding:e.space.xs,borderBottomWidth:StyleSheet.hairlineWidth,borderBottomColor:e.colors["border-subtle"],backgroundColor:e.colors["bg-subtle"]},button:{minWidth:34,height:30,paddingHorizontal:e.space.xs,borderRadius:e.radius.sm,...smoothCorners,alignItems:"center",justifyContent:"center"},buttonLabel:{...fontFor(e,"medium"),fontSize:e.text.sm.size},input:{...fontFor(e,"normal"),color:e.colors["text-body"],fontSize:e.text.base.size,lineHeight:1.5*e.text.base.size,paddingHorizontal:e.space.md,paddingVertical:e.space.sm},skeletonBody:{paddingHorizontal:e.space.md,paddingVertical:e.space.sm,gap:e.space.sm}});export default RichTextEditor;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Pressable,StyleSheet,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/useControllableState.js";import{useDebounce}from"../../hooks/useDebounce.js";import{radiusOf,resolveFieldSize,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{FieldBase,FieldLabel,resolveFieldTextStyle,resolveVariantColors}from"../FieldBase/FieldBase.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{normalizeSuggestion,SearchRecents,SearchScopeBar,SearchSuggestions}from"./SearchPanel.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_PANEL_ROWS=8,HOLD_RELEASE_MS=50,SearchBar=forwardRef((e,s)=>{const{value:l,onChangeText:o,onSubmit:t,onFocus:a,onBlur:n,placeholder:i="Search…",autoFocus:r=!1,disabled:c=!1,onClear:u,leftIcon:d,debounceMs:
|
|
1
|
+
"use strict";import{forwardRef,useCallback,useEffect,useMemo,useRef,useState}from"react";import{Pressable,StyleSheet,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/useControllableState.js";import{useDebounce}from"../../hooks/useDebounce.js";import{radiusOf,resolveFieldSize,useTheme}from"../../theme/index.js";import{announce}from"../../utils/announce.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{mergeRefs}from"../../utils/mergeRefs.js";import{defaultIcons}from"../AppIcon/defaultIcons.js";import{renderSlotIcon}from"../AppIcon/slotIcon.js";import{FieldBase,FieldLabel,resolveFieldTextStyle,resolveVariantColors}from"../FieldBase/FieldBase.js";import{useFloatingLabel}from"../FieldBase/useFloatingLabel.js";import{normalizeSuggestion,SearchRecents,SearchScopeBar,SearchSuggestions}from"./SearchPanel.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_PANEL_ROWS=8,HOLD_RELEASE_MS=50,SearchBar=forwardRef((e,s)=>{const{value:l,onChangeText:o,onSubmit:t,onFocus:a,onBlur:n,placeholder:i="Search…",autoFocus:r=!1,disabled:c=!1,onClear:u,leftIcon:d,debounceMs:p,size:b="md",variant:f,borderRadius:m,label:g,labelMode:h="top",labelStyle:S,scopes:v,scope:x,onScopeChange:C,recents:R,recentsTitle:y="Recent searches",maxRecents:j=DEFAULT_PANEL_ROWS,onSelectRecent:F,onRemoveRecent:k,onClearRecents:_,suggestions:L,maxSuggestions:T=DEFAULT_PANEL_ROWS,onSelectSuggestion:B,haptic:E,style:I,inputStyle:z,accessibilityLabel:w,testID:H,...D}=e,M=useTheme(),A=f??M.settings.components["search-bar"]?.defaultVariant??M.settings.components.field?.defaultVariant??"filled",P="underline"===A,V=resolveFieldSize(M,b),O=radiusOf(M,M.components["search-bar"][b].radius),N=resolveFieldTextStyle(M,{disabled:c}),W=useRef(null),U=useMemo(()=>mergeRefs(W,s),[s]),$=useCallback(()=>{c||W.current?.focus()},[c]),q=useMemo(()=>buildStyles(M),[M]),K="string"==typeof l?l:"",[G,J]=useState(!1),Q=useCallback(e=>{J(!0),a?.(e)},[a]),X=useCallback(e=>{J(!1),n?.(e)},[n]),[Y,Z]=useState(K),ee=useDebounce(Y,p??0);useEffect(()=>{void 0!==p&&K!==Y&&Z(K)},[K,p]);const se=useRef(K);useEffect(()=>{void 0!==p&&ee!==se.current&&(se.current=ee,o(ee))},[ee,p,o]);const le=useCallback(e=>{void 0===p?o(e):Z(e)},[p,o]),oe=useCallback(()=>{const e=resolveHaptic(E,"selection");e&&triggerHaptic(e),void 0!==p&&(Z(""),se.current=""),o(""),u?.()},[E,p,o,u]),te=useCallback(()=>{t?.(void 0!==p?Y:K)},[t,p,Y,K]),ae=void 0!==p?Y:K,ne=ae.length>0,[ie,re]=useControllableState({value:x,defaultValue:v?.[0]?.value??"",onChange:C}),ce=useCallback(e=>{re(e);const s=v?.find(s=>s.value===e)?.label;s&&announce(`Searching ${s}`)},[v,re]),[ue,de]=useState(!1),pe=useRef(null),be=useCallback(()=>{pe.current&&(clearTimeout(pe.current),pe.current=null)},[]),fe=useCallback(()=>{be(),de(!0)},[be]),me=useCallback(()=>{be(),pe.current=setTimeout(()=>de(!1),50)},[be]);useEffect(()=>be,[be]);const ge=!c&&(G||ue),he=useMemo(()=>(R??[]).slice(0,j),[R,j]),Se=useMemo(()=>(L??[]).slice(0,T).map(normalizeSuggestion),[L,T]),ve=ge&&!ne&&he.length>0,xe=ge&&ne&&Se.length>0,Ce=xe?Se.length:0;useEffect(()=>{Ce>0&&announce(1===Ce?"1 suggestion":`${Ce} suggestions`)},[Ce]);const Re=useCallback(()=>{const e=resolveHaptic(E,"selection");e&&triggerHaptic(e)},[E]),ye=useCallback(e=>{Re(),W.current?.blur(),de(!1),F?.(e)},[Re,F]),je=useCallback(e=>{Re(),W.current?.blur(),de(!1),B?.(e)},[Re,B]),Fe=useCallback(e=>{Re(),k?.(e),announce(`Removed ${e}`),$()},[Re,k,$]),ke=useCallback(()=>{Re(),_?.(),announce("Recent searches cleared"),$()},[Re,_,$]),Le={size:V.icon,color:c?M.colors["text-disabled"]:M.colors["text-subtle"],disabled:c},Te=d?renderSlotIcon(d,Le):(M.settings.icons.search??defaultIcons.search)(Le),Be=Boolean(g)&&"float"===h,Ee=useFloatingLabel({label:g,enabled:Be,floated:G||ne,variant:A,sizeTokens:V,leadingOffset:V.icon+M.space.md,trailingOffset:ne?V.icon+M.space.md:0,paddingLeft:P?M.space.none:V["padding-x"],color:M.colors["field-label"],style:S}),Ie=ne&&!c?_jsx(Pressable,{onPress:oe,hitSlop:8,...hitSlopMarker(8),accessibilityRole:"button",accessibilityLabel:"Clear search",children:(M.settings.icons.close??defaultIcons.close)({size:V.icon,color:M.colors["text-muted"]})}):null;return _jsxs(View,{style:I,testID:H,children:[g&&!Be?_jsx(FieldLabel,{size:b,style:S,children:g}):null,_jsx(View,{style:q.root,children:_jsxs(View,{style:q.fieldWrap,children:[_jsx(FieldBase,{size:b,variant:A,focused:G,disabled:c,filled:ne,minHeight:V["min-height"],paddingHorizontal:P?M.space.none:V["padding-x"],borderRadius:m??O,leading:Te,trailing:Ie,topNotch:Ee.topNotch,onPress:$,pressFeedback:!1,accessibilityRole:"search",accessibilityLabel:w??i,children:_jsx(TextInput,{ref:U,style:[q.input,{fontSize:V.text,color:N.color,...N.weightStyle},z],value:ae,onChangeText:le,onSubmitEditing:te,onFocus:Q,onBlur:X,placeholder:!Be||G||ne?i:void 0,placeholderTextColor:N.placeholderColor,autoFocus:r,editable:!c,returnKeyType:"search",selectionColor:resolveVariantColors(M,A).borderFocusedRepresentative,accessibilityLabel:w??i,accessibilityState:{disabled:c},"aria-disabled":c,...D})}),Ee.node]})}),v&&v.length>0?_jsx(SearchScopeBar,{scopes:v,scope:ie||(v[0]?.value??""),disabled:c,haptic:E,onChange:ce}):null,ve?_jsx(SearchRecents,{recents:he,title:y,onSelect:ye,onRemove:k?Fe:void 0,onClear:_?ke:void 0,onHold:fe,onRelease:me}):null,xe?_jsx(SearchSuggestions,{suggestions:Se,query:ae,onSelect:je,onHold:fe,onRelease:me}):null]})});SearchBar.displayName="SearchBar";const buildStyles=e=>StyleSheet.create({root:{flexDirection:"row",alignItems:"center",width:"100%",position:"relative",overflow:"visible"},fieldWrap:{flex:1,position:"relative",overflow:"visible"},input:{flex:1,padding:e.space.none,margin:e.space.none,includeFontPadding:!1}});export{SearchBar};export default SearchBar;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useCallback,useMemo,useRef}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{resolveFieldSize,useTheme}from"../../theme/index.js";import{AppIcon,renderSlotIcon}from"../AppIcon/index.js";import{FieldBase,FieldLabel,FieldMessage,hasFieldText,resolveFieldTextStyle}from"../FieldBase/FieldBase.js";import{IconButton}from"../IconButton/index.js";import{Slider}from"../Slider/index.js";import{CountingText,clampValue,sliderToneInk,snapValue,useValueDraft}from"../Slider/valueText.js";import{Tooltip}from"../Tooltip/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_INPUT_WIDTH=72,defaultFormatValue=e=>String(e),stepDecimals=e=>String(e).split(".")[1]?.length??0,ValueBox=({draft:e,error:t,disabled:l,width:
|
|
1
|
+
"use strict";import{forwardRef,useCallback,useMemo,useRef}from"react";import{Pressable,StyleSheet,Text,TextInput,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{resolveFieldSize,useTheme}from"../../theme/index.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{AppIcon,renderSlotIcon}from"../AppIcon/index.js";import{FieldBase,FieldLabel,FieldMessage,hasFieldText,resolveFieldTextStyle}from"../FieldBase/FieldBase.js";import{IconButton}from"../IconButton/index.js";import{Slider}from"../Slider/index.js";import{CountingText,clampValue,sliderToneInk,snapValue,useValueDraft}from"../Slider/valueText.js";import{Tooltip}from"../Tooltip/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const DEFAULT_INPUT_WIDTH=72,defaultFormatValue=e=>String(e),stepDecimals=e=>String(e).split(".")[1]?.length??0,ValueBox=({draft:e,error:t,disabled:l,width:i,accessibilityLabel:s,styles:o,style:a,testID:r})=>{const n=useTheme(),d=resolveFieldSize(n,"sm"),u=resolveFieldTextStyle(n,{disabled:l}),c=useRef(null),p=useCallback(()=>{l||c.current?.focus()},[l]);return _jsx(FieldBase,{size:"sm",focused:e.editing,disabled:l,error:t,filled:!0,width:i,onPress:p,pressFeedback:!1,paddingHorizontal:n.space.sm,gap:n.space.xs,trailing:t?_jsx(AppIcon,{name:"info-circle",size:d.icon,color:n.colors["danger-text"]}):void 0,style:a,children:_jsx(TextInput,{ref:c,style:[o.boxInput,{color:u.color,fontSize:d.text,...u.weightStyle}],value:e.text,onChangeText:e.onChangeText,onFocus:e.onFocus,onBlur:e.onBlur,onSubmitEditing:e.onBlur,editable:!l,keyboardType:"decimal-pad",returnKeyType:"done",textAlign:"center",selectionColor:n.colors.primary,accessibilityLabel:s,accessibilityState:{disabled:l},"aria-disabled":l,testID:r})})},SliderField=forwardRef((e,t)=>{const{label:l,unit:i,info:s,required:o=!1,helperText:a,error:r,min:n=0,max:d=100,step:u=1,disabled:c=!1,tone:p="primary",size:x,variant:m,haptic:b,showBubble:h=!0,showBounds:f=!0,showInput:y=!1,showStepper:g=!1,startIcon:S,endIcon:I,startLabel:j,endLabel:T,formatValue:w=defaultFormatValue,parseInput:_,animationDuration:v,inputWidth:V=DEFAULT_INPUT_WIDTH,accessibilityLabel:F,style:z,labelStyle:D,boundStyle:B,sliderStyle:L,inputStyle:C,testID:$}=e,A=useTheme(),M=useMemo(()=>buildStyles(A),[A]),k=v??A.motion.duration.fast,P=!0===e.range,W=!0===r||hasFieldText(r),R=stepDecimals(u),[H,U]=useControllableState({value:e.value,defaultValue:e.defaultValue??(P?[n,d]:n),onChange:e.onChange}),[E,N]=P?H:[H,d],q=clampValue(Math.min(E,N),n,d),K=clampValue(Math.max(E,N),n,d),G=useValueDraft({value:q,min:n,max:d,step:u,format:w,parse:_,onChange:e=>U(P?[Math.min(e,K),K]:e)}),J=useValueDraft({value:K,min:n,max:d,step:u,format:w,parse:_,onChange:e=>U([q,Math.max(e,q)])}),stepBy=e=>{const t=snapValue(q+e*u,n,d,u);t!==q&&U(t)},O={color:c?A.colors["text-disabled"]:A.colors["text-muted"],size:resolveFieldSize(A,"md").icon,disabled:c},Q=[M.bubbleText,{color:sliderToneInk(A,p),fontWeight:A.weight.semibold}],boundText=e=>_jsx(Text,{style:[M.bound,{color:c?A.colors["text-disabled"]:A.colors["text-muted"]},B],children:e}),X={min:n,max:d,step:u,disabled:c,tone:p,size:x,variant:m,haptic:b,showLabel:!!h&&"always",renderLabel:h?e=>_jsx(CountingText,{value:e,format:w,decimals:R,duration:k,style:Q,testID:$&&!P?`${$}-bubble`:void 0}):void 0,accessibilityLabel:F??l,style:L,testID:$?`${$}-slider`:void 0};return _jsxs(View,{ref:t,style:[M.container,z],testID:$,children:[l?_jsxs(View,{style:M.labelRow,children:[_jsx(FieldLabel,{required:o,style:D,children:l}),i?_jsx(Text,{style:[M.unit,{color:A.colors["text-subtle"]}],children:i}):null,s?_jsx(Tooltip,{content:s,trigger:"press",placement:"top",children:_jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:`About ${l}`,hitSlop:8,...hitSlopMarker(8),style:M.infoButton,children:_jsx(AppIcon,{name:"info-circle",variant:"bold",size:16,color:A.colors["text-subtle"]})})}):null]}):null,_jsxs(View,{style:[M.row,h?M.rowWithBubble:null],children:[S?_jsx(View,{children:renderSlotIcon(S,O)}):null,g&&!P?_jsx(IconButton,{icon:e=>_jsx(AppIcon,{name:"minus",size:e.size,color:e.color}),onPress:()=>stepBy(-1),accessibilityLabel:"Decrease",variant:"ghost",tone:"neutral",size:"sm",disabled:c||q<=n,haptic:b,testID:$?`${$}-minus`:void 0}):null,P&&y?_jsx(ValueBox,{draft:G,error:W,disabled:c,width:V,accessibilityLabel:`${l??"Value"} low`,styles:M,style:C,testID:$?`${$}-input-low`:void 0}):f?boundText(j??w(n)):null,_jsx(View,{style:M.sliderWrap,children:_jsx(Slider,P?{...X,range:!0,value:[q,K],onChange:U}:{...X,value:q,onChange:U})}),P&&y?_jsx(ValueBox,{draft:J,error:W,disabled:c,width:V,accessibilityLabel:`${l??"Value"} high`,styles:M,style:C,testID:$?`${$}-input-high`:void 0}):f?boundText(T??w(d)):null,g&&!P?_jsx(IconButton,{icon:e=>_jsx(AppIcon,{name:"add",size:e.size,color:e.color}),onPress:()=>stepBy(1),accessibilityLabel:"Increase",variant:"ghost",tone:"neutral",size:"sm",disabled:c||q>=d,haptic:b,testID:$?`${$}-plus`:void 0}):null,I?_jsx(View,{children:renderSlotIcon(I,O)}):null,!P&&y?_jsx(ValueBox,{draft:G,error:W,disabled:c,width:V,accessibilityLabel:`${l??"Value"} value`,styles:M,style:C,testID:$?`${$}-input`:void 0}):null]}),_jsx(FieldMessage,{text:W?r:a,error:W})]})});SliderField.displayName="SliderField";const buildStyles=e=>StyleSheet.create({container:{width:"100%"},labelRow:{flexDirection:"row",alignItems:"center",gap:e.space.xs},unit:{fontSize:e.text.xs.size},infoButton:{marginLeft:e.space.xxs},row:{flexDirection:"row",alignItems:"center",gap:e.space.sm},rowWithBubble:{marginTop:e.space.lg},sliderWrap:{flex:1,paddingHorizontal:e.space.sm},bound:{fontSize:e.text.sm.size,fontVariant:["tabular-nums"]},bubbleText:{fontSize:e.text.xs.size,fontVariant:["tabular-nums"]},boxInput:{flex:1,padding:e.space.none,margin:e.space.none,includeFontPadding:!1}});export{SliderField};export default SliderField;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";import{createAnimatedValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{resolveHaptic,triggerHaptic}from"../../utils/hapticUtils.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const CIRCLE_SIZE=24,SEGMENT_HEIGHT=4,PULSE_SIZE=32,PULSE_DURATION=1100,toneColorFor=(e,t)=>"success"===t?e.colors.success:e.colors.primary,toneOnColorFor=(e,t)=>"success"===t?e.colors["on-success"]:e.colors["on-primary"],StepCircle=({index:e,step:t,status:i,toneColor:s,upcomingColor:o,upcomingFillColor:l,textOnColor:r,upcomingTextColor:n,interactive:a,canPress:c,totalSteps:d,onPress:u,pulseEnabled:p,circleStyles:h,circleSlotStyle:m})=>{const y="active"===i,x=useTheme(),g=useRef(createAnimatedValue(1)).current,b=useRef(createAnimatedValue(.5)).current;useEffect(()=>{if(!y||!p)return g.setValue(1),void b.setValue(0);const e=Animated.loop(Animated.parallel([Animated.sequence([Animated.timing(g,{toValue:1.4,duration:1100,easing:Easing.out(Easing.ease),useNativeDriver:!0}),Animated.timing(g,{toValue:1,duration:0,useNativeDriver:!0})]),Animated.sequence([Animated.timing(b,{toValue:0,duration:1100,easing:Easing.out(Easing.ease),useNativeDriver:!0}),Animated.timing(b,{toValue:.5,duration:0,useNativeDriver:!0})])]));return e.start(),()=>e.stop()},[y,g,b,p]);const S="upcoming"===i?l:s,f="upcoming"===i?o:s,w="upcoming"===i?n:r,C="complete"===i,v=`Step ${e+1} of ${d}, ${t.label}, ${i}`,j=_jsxs(View,{style:h.relative,children:[y&&p?_jsx(Animated.View,{pointerEvents:"none",style:[h.pulse,{width:32,height:32,borderRadius:x.radius.pill,...smoothCorners,backgroundColor:s,opacity:b,transform:[{scale:g}]}]}):null,_jsx(View,{style:[h.circle,{width:24,height:24,borderRadius:x.radius.pill,...smoothCorners,backgroundColor:S,borderColor:f},m],children:t.icon?t.icon:_jsx(Text,C?{style:[h.glyph,{color:w}],children:"✓"}:{style:[h.glyph,{color:w}],children:e+1})})]});return a?_jsx(Pressable,{onPress:()=>u(e),disabled:!c,accessibilityRole:"button",accessibilityLabel:v,accessibilityState:{selected:y,disabled:!c},"aria-selected":y,"aria-disabled":!c,hitSlop:8,children:j}):_jsx(View,{accessibilityRole:"text",accessibilityLabel:v,accessibilityState:{selected:y},"aria-selected":y,children:j})},buildCircleStyles=e=>StyleSheet.create({relative:{alignItems:"center",justifyContent:"center"},pulse:{position:"absolute"},circle:{borderWidth:2,alignItems:"center",justifyContent:"center"},glyph:{fontSize:e.text.sm.size,fontWeight:"600",includeFontPadding:!1}}),Stepper=forwardRef((e,t)=>{const{steps:i,activeStep:s,defaultActiveStep:o=0,pressMode:l="none",onStepPress:r,onActiveStepChange:n,variant:a="horizontal",tone:c="primary",formatCaption:d,showCaption:u=!0,loading:p=!1,accessibilityLabel:h,style:m,containerStyle:y,circleStyle:x,labelStyle:g,connectorStyle:b,haptic:S,testID:f}=e,w=useTheme(),C=w.settings.components.stepper?.pulseAnimation??!1,v=resolveHaptic(S,"selection"),j=useMemo(()=>buildStyles(w),[w]),_=useMemo(()=>buildCircleStyles(w),[w]),V=toneColorFor(w,c),k=w.colors.border,R=w.colors.bg,I=w.colors["text-muted"],A=toneOnColorFor(w,c),E=i.length,L="none"!==l,T=void 0!==s,[$,D]=useState(o),P=T?s:$,F=null==P||P<0?null:P,z=i.map((e,t)=>(e=>null===F?"upcoming":e<F?"complete":e===F?"active":"upcoming")(t)),B=z.filter(e=>"upcoming"!==e).length,O=z.filter(e=>"complete"===e).length,canPressStatus=e=>"back"===l?"complete"===e:L,handleStepPress=e=>{if(!canPressStatus(z[e]))return;v&&triggerHaptic(v),r?.(e);const t="select"===l&&e===F?null:e;T||D(t),n?.(t)},N=useRef(createAnimatedValue(B)).current,M=useRef(B);useEffect(()=>{const e=M.current;if(e===B)return;M.current=B;const t=Animated.timing(N,{toValue:B,duration:w.motion.duration.default*Math.abs(B-e),easing:Easing.linear,useNativeDriver:!1});return t.start(),()=>t.stop()},[B,N,w.motion]);const sliceOf=e=>N.interpolate({inputRange:[e,e+1],outputRange:["0%","100%"],extrapolate:"clamp"}),H=E<=1?"0%":N.interpolate({inputRange:[1,E],outputRange:["0%","100%"],extrapolate:"clamp"}),U=null!==F&&F<E?F:null,G=h??(null!==U?`Progress: step ${U+1} of ${E}`:`Progress: ${O} of ${E} steps done`),[W,q]=useState(0),Z=E>0&&W>0?W/(2*E):0,J=_jsx(View,{ref:t,style:[j.container,y,m],testID:f,accessibilityRole:"progressbar",accessibilityLabel:G,accessibilityValue:{min:0,max:E,now:B},children:"segmented"===a?(()=>{const e=null!==U?i[U]:void 0,t=u?d?d(U,E,e):null!==U?`Step ${U+1} of ${E}${e?.label?` · ${e.label}`:""}`:`${O} of ${E} done`:"";return _jsxs(View,{children:[u?_jsx(Text,{style:[j.sCaption,{color:w.colors["text-muted"],fontSize:w.text.sm.size,marginBottom:w.space.sm},g],numberOfLines:1,children:t}):null,_jsx(View,{style:j.sRow,children:i.map((e,t)=>{const i=z[t],s=`Step ${t+1} of ${E}, ${e.label}, ${i}`,o=_jsx(View,{testID:f?`${f}-segment-${t}`:void 0,style:[j.sTrack,{backgroundColor:k},b],children:_jsx(Animated.View,{style:[j.sFill,{backgroundColor:V,width:sliceOf(t)}]})});if(L){const l=canPressStatus(i);return _jsx(Pressable,{style:j.sItem,onPress:()=>handleStepPress(t),disabled:!l,accessibilityRole:"button",accessibilityLabel:s,accessibilityState:{selected:"active"===i,disabled:!l},"aria-selected":"active"===i,"aria-disabled":!l,hitSlop:{top:12,bottom:12},children:o},e.key)}return _jsx(View,{style:j.sItem,accessibilityRole:"text",accessibilityLabel:s,accessibilityState:{selected:"active"===i},"aria-selected":"active"===i,children:o},e.key)})})]})})():"vertical"===a?_jsx(View,{style:j.vCol,children:i.map((e,t)=>{const i=z[t],s=t===E-1;return _jsxs(View,{style:j.vRow,children:[_jsxs(View,{style:j.vLeft,children:[_jsx(StepCircle,{index:t,step:e,status:i,toneColor:V,upcomingColor:k,upcomingFillColor:R,onPressColor:V,textOnColor:A,upcomingTextColor:I,interactive:L,canPress:canPressStatus(i),totalSteps:E,onPress:handleStepPress,pulseEnabled:C,circleStyles:_,circleSlotStyle:x}),s?null:_jsxs(View,{style:[j.vConnectorContainer,b],children:[_jsx(View,{style:[j.vConnectorTrack,{backgroundColor:k}]}),_jsx(Animated.View,{style:[j.vConnectorFill,{backgroundColor:V,height:sliceOf(t+1)}]})]})]}),_jsxs(View,{style:j.vBody,children:[_jsx(Text,{style:[j.vLabel,{color:"upcoming"===i?w.colors["text-subtle"]:w.colors["text-body"],fontSize:w.text.base.size,fontWeight:w.weight.semibold},g],numberOfLines:1,children:e?.label??" "}),e.description?_jsx(Text,{style:[j.vDescription,{color:w.colors["text-muted"],fontSize:w.text.sm.size}],numberOfLines:3,children:e.description}):null]})]},e.key)})}):_jsxs(View,{style:j.hRow,onLayout:e=>q(e.nativeEvent.layout.width),children:[_jsxs(View,{pointerEvents:"none",style:[j.hConnectorContainer,{left:Z,right:Z},b],children:[_jsx(View,{style:[j.hConnectorTrack,{backgroundColor:k}]}),_jsx(Animated.View,{style:[j.hConnectorFill,{backgroundColor:V,width:H}]})]}),i.map((e,t)=>{const i=z[t];return _jsxs(View,{style:j.hStepItem,children:[_jsx(StepCircle,{index:t,step:e,status:i,toneColor:V,upcomingColor:k,upcomingFillColor:R,onPressColor:V,textOnColor:A,upcomingTextColor:I,interactive:L,canPress:canPressStatus(i),totalSteps:E,onPress:handleStepPress,pulseEnabled:C,circleStyles:_,circleSlotStyle:x}),_jsx(Text,{style:[j.hLabel,{color:"upcoming"===i?w.colors["text-subtle"]:w.colors["text-body"],fontSize:w.text.xs.size},g],numberOfLines:1,children:e?.label??" "})]},e.key)})]})});return p?_jsx(StepperSkeleton,{...e}):J});Stepper.displayName="Stepper";const StepperSkeleton=({steps:e,variant:t="horizontal",showCaption:i=!0,containerStyle:s,style:o,testID:l})=>{const r=useTheme(),n=useMemo(()=>buildStyles(r),[r]),a=useMemo(()=>buildSkeletonStyles(r),[r]),c=e.length||3;return"segmented"===t?_jsxs(View,{style:[n.container,s,o],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[i?_jsx(Skeleton,{shape:"text",width:"45%",height:14,style:{marginBottom:r.space.sm}}):null,_jsx(View,{style:n.sRow,children:Array.from({length:c}).map((e,t)=>_jsx(View,{style:n.sItem,children:_jsx(Skeleton,{width:"100%",height:4,radius:"pill"})},`sk-step-${t}`))})]}):_jsx(View,"vertical"===t?{style:[n.container,s,o],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:_jsx(View,{style:a.vCol,children:Array.from({length:c}).map((e,t)=>{const i=t===c-1;return _jsxs(View,{style:a.vRow,children:[_jsxs(View,{style:[a.vLeft,{width:32}],children:[_jsx(Skeleton,{shape:"circle",width:24,height:24}),i?null:_jsx(Skeleton,{width:2,height:36})]}),_jsxs(View,{style:a.vBody,children:[_jsx(Skeleton,{shape:"text",width:"55%",height:16,style:{marginBottom:r.space.xs}}),_jsx(Skeleton,{shape:"text",width:"80%",height:12})]})]},`sk-step-${t}`)})})}:{style:[n.container,s,o],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:_jsxs(View,{style:n.hRow,children:[_jsx(View,{pointerEvents:"none",style:[n.hConnectorContainer,{left:50/c+"%",right:50/c+"%"}],children:_jsx(Skeleton,{width:"100%",height:2,radius:"pill"})}),Array.from({length:c}).map((e,t)=>_jsxs(View,{style:n.hStepItem,children:[_jsx(Skeleton,{shape:"circle",width:24,height:24}),_jsx(Skeleton,{shape:"text",width:"80%",height:12,style:{marginTop:r.space.xs}})]},`sk-step-${t}`))]})})};StepperSkeleton.displayName="StepperSkeleton",Stepper.Skeleton=StepperSkeleton;const buildSkeletonStyles=e=>StyleSheet.create({vCol:{flexDirection:"column"},vRow:{flexDirection:"row",alignItems:"flex-start"},vLeft:{alignItems:"center"},vBody:{flex:1,paddingLeft:e.space.md,paddingBottom:e.space.lg}}),buildStyles=e=>StyleSheet.create({container:{width:"100%"},hRow:{flexDirection:"row",alignItems:"flex-start",justifyContent:"space-between",position:"relative"},hConnectorContainer:{position:"absolute",top:11,height:2,flexDirection:"row",alignItems:"center"},hConnectorTrack:{position:"absolute",left:0,right:0,height:2,borderRadius:e.radius.pill,...smoothCorners},hConnectorFill:{position:"absolute",left:0,height:2,borderRadius:e.radius.pill,...smoothCorners},hStepItem:{alignItems:"center",flex:1},hLabel:{marginTop:e.space.xs,textAlign:"center"},vCol:{flexDirection:"column"},vRow:{flexDirection:"row",alignItems:"flex-start"},vLeft:{alignItems:"center",alignSelf:"stretch",width:32},vConnectorContainer:{flex:1,width:2,minHeight:32,position:"relative",alignSelf:"center"},vConnectorTrack:{position:"absolute",top:0,bottom:0,width:2,borderRadius:e.radius.pill,...smoothCorners},vConnectorFill:{position:"absolute",top:0,width:2,borderRadius:e.radius.pill,...smoothCorners},vBody:{flex:1,paddingLeft:e.space.sm,paddingBottom:e.space.md},vLabel:{marginBottom:e.space.xxs},vDescription:{},sCaption:{includeFontPadding:!1},sRow:{flexDirection:"row",columnGap:e.space.xs},sItem:{flex:1},sTrack:{height:4,borderRadius:e.radius.pill,overflow:"hidden"},sFill:{height:4,borderRadius:e.radius.pill}});export{Stepper};export default Stepper;
|
|
1
|
+
"use strict";import{forwardRef,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,Pressable,StyleSheet,Text,View}from"react-native";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{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const CIRCLE_SIZE=24,SEGMENT_HEIGHT=4,PULSE_SIZE=32,PULSE_DURATION=1100,toneColorFor=(e,t)=>"success"===t?e.colors.success:e.colors.primary,toneOnColorFor=(e,t)=>"success"===t?e.colors["on-success"]:e.colors["on-primary"],StepCircle=({index:e,step:t,status:i,toneColor:s,upcomingColor:o,upcomingFillColor:l,textOnColor:r,upcomingTextColor:n,interactive:a,canPress:c,totalSteps:d,onPress:p,pulseEnabled:u,circleStyles:h,circleSlotStyle:m})=>{const y="active"===i,x=useTheme(),g=useRef(createAnimatedValue(1)).current,b=useRef(createAnimatedValue(.5)).current;useEffect(()=>{if(!y||!u)return g.setValue(1),void b.setValue(0);const e=Animated.loop(Animated.parallel([Animated.sequence([Animated.timing(g,{toValue:1.4,duration:1100,easing:Easing.out(Easing.ease),useNativeDriver:!0}),Animated.timing(g,{toValue:1,duration:0,useNativeDriver:!0})]),Animated.sequence([Animated.timing(b,{toValue:0,duration:1100,easing:Easing.out(Easing.ease),useNativeDriver:!0}),Animated.timing(b,{toValue:.5,duration:0,useNativeDriver:!0})])]));return e.start(),()=>e.stop()},[y,g,b,u]);const S="upcoming"===i?l:s,f="upcoming"===i?o:s,w="upcoming"===i?n:r,C="complete"===i,v=`Step ${e+1} of ${d}, ${t.label}, ${i}`,j=_jsxs(View,{style:h.relative,children:[y&&u?_jsx(Animated.View,{pointerEvents:"none",style:[h.pulse,{width:32,height:32,borderRadius:x.radius.pill,...smoothCorners,backgroundColor:s,opacity:b,transform:[{scale:g}]}]}):null,_jsx(View,{style:[h.circle,{width:24,height:24,borderRadius:x.radius.pill,...smoothCorners,backgroundColor:S,borderColor:f},m],children:t.icon?t.icon:_jsx(Text,C?{style:[h.glyph,{color:w}],children:"✓"}:{style:[h.glyph,{color:w}],children:e+1})})]});return a?_jsx(Pressable,{onPress:()=>p(e),disabled:!c,accessibilityRole:"button",accessibilityLabel:v,accessibilityState:{selected:y,disabled:!c},"aria-selected":y,"aria-disabled":!c,hitSlop:8,...hitSlopMarker(8),children:j}):_jsx(View,{accessibilityRole:"text",accessibilityLabel:v,accessibilityState:{selected:y},"aria-selected":y,children:j})},buildCircleStyles=e=>StyleSheet.create({relative:{alignItems:"center",justifyContent:"center"},pulse:{position:"absolute"},circle:{borderWidth:2,alignItems:"center",justifyContent:"center"},glyph:{fontSize:e.text.sm.size,fontWeight:"600",includeFontPadding:!1}}),Stepper=forwardRef((e,t)=>{const{steps:i,activeStep:s,defaultActiveStep:o=0,pressMode:l="none",onStepPress:r,onActiveStepChange:n,variant:a="horizontal",tone:c="primary",formatCaption:d,showCaption:p=!0,loading:u=!1,accessibilityLabel:h,style:m,containerStyle:y,circleStyle:x,labelStyle:g,connectorStyle:b,haptic:S,testID:f}=e,w=useTheme(),C=w.settings.components.stepper?.pulseAnimation??!1,v=resolveHaptic(S,"selection"),j=useMemo(()=>buildStyles(w),[w]),_=useMemo(()=>buildCircleStyles(w),[w]),V=toneColorFor(w,c),k=w.colors.border,R=w.colors.bg,I=w.colors["text-muted"],A=toneOnColorFor(w,c),E=i.length,L="none"!==l,T=void 0!==s,[$,D]=useState(o),P=T?s:$,F=null==P||P<0?null:P,z=i.map((e,t)=>(e=>null===F?"upcoming":e<F?"complete":e===F?"active":"upcoming")(t)),M=z.filter(e=>"upcoming"!==e).length,B=z.filter(e=>"complete"===e).length,canPressStatus=e=>"back"===l?"complete"===e:L,handleStepPress=e=>{if(!canPressStatus(z[e]))return;v&&triggerHaptic(v),r?.(e);const t="select"===l&&e===F?null:e;T||D(t),n?.(t)},O=useRef(createAnimatedValue(M)).current,N=useRef(M);useEffect(()=>{const e=N.current;if(e===M)return;N.current=M;const t=Animated.timing(O,{toValue:M,duration:w.motion.duration.default*Math.abs(M-e),easing:Easing.linear,useNativeDriver:!1});return t.start(),()=>t.stop()},[M,O,w.motion]);const sliceOf=e=>O.interpolate({inputRange:[e,e+1],outputRange:["0%","100%"],extrapolate:"clamp"}),H=E<=1?"0%":O.interpolate({inputRange:[1,E],outputRange:["0%","100%"],extrapolate:"clamp"}),U=null!==F&&F<E?F:null,G=h??(null!==U?`Progress: step ${U+1} of ${E}`:`Progress: ${B} of ${E} steps done`),[W,q]=useState(0),Z=E>0&&W>0?W/(2*E):0,J=_jsx(View,{ref:t,style:[j.container,y,m],testID:f,accessibilityRole:"progressbar",accessibilityLabel:G,accessibilityValue:{min:0,max:E,now:M},children:"segmented"===a?(()=>{const e=null!==U?i[U]:void 0,t=p?d?d(U,E,e):null!==U?`Step ${U+1} of ${E}${e?.label?` · ${e.label}`:""}`:`${B} of ${E} done`:"";return _jsxs(View,{children:[p?_jsx(Text,{style:[j.sCaption,{color:w.colors["text-muted"],fontSize:w.text.sm.size,marginBottom:w.space.sm},g],numberOfLines:1,children:t}):null,_jsx(View,{style:j.sRow,children:i.map((e,t)=>{const i=z[t],s=`Step ${t+1} of ${E}, ${e.label}, ${i}`,o=_jsx(View,{testID:f?`${f}-segment-${t}`:void 0,style:[j.sTrack,{backgroundColor:k},b],children:_jsx(Animated.View,{style:[j.sFill,{backgroundColor:V,width:sliceOf(t)}]})});if(L){const l=canPressStatus(i);return _jsx(Pressable,{style:j.sItem,onPress:()=>handleStepPress(t),disabled:!l,accessibilityRole:"button",accessibilityLabel:s,accessibilityState:{selected:"active"===i,disabled:!l},"aria-selected":"active"===i,"aria-disabled":!l,hitSlop:{top:12,bottom:12},...hitSlopMarker({top:12,bottom:12}),children:o},e.key)}return _jsx(View,{style:j.sItem,accessibilityRole:"text",accessibilityLabel:s,accessibilityState:{selected:"active"===i},"aria-selected":"active"===i,children:o},e.key)})})]})})():"vertical"===a?_jsx(View,{style:j.vCol,children:i.map((e,t)=>{const i=z[t],s=t===E-1;return _jsxs(View,{style:j.vRow,children:[_jsxs(View,{style:j.vLeft,children:[_jsx(StepCircle,{index:t,step:e,status:i,toneColor:V,upcomingColor:k,upcomingFillColor:R,onPressColor:V,textOnColor:A,upcomingTextColor:I,interactive:L,canPress:canPressStatus(i),totalSteps:E,onPress:handleStepPress,pulseEnabled:C,circleStyles:_,circleSlotStyle:x}),s?null:_jsxs(View,{style:[j.vConnectorContainer,b],children:[_jsx(View,{style:[j.vConnectorTrack,{backgroundColor:k}]}),_jsx(Animated.View,{style:[j.vConnectorFill,{backgroundColor:V,height:sliceOf(t+1)}]})]})]}),_jsxs(View,{style:j.vBody,children:[_jsx(Text,{style:[j.vLabel,{color:"upcoming"===i?w.colors["text-subtle"]:w.colors["text-body"],fontSize:w.text.base.size,fontWeight:w.weight.semibold},g],numberOfLines:1,children:e?.label??" "}),e.description?_jsx(Text,{style:[j.vDescription,{color:w.colors["text-muted"],fontSize:w.text.sm.size}],numberOfLines:3,children:e.description}):null]})]},e.key)})}):_jsxs(View,{style:j.hRow,onLayout:e=>q(e.nativeEvent.layout.width),children:[_jsxs(View,{pointerEvents:"none",style:[j.hConnectorContainer,{left:Z,right:Z},b],children:[_jsx(View,{style:[j.hConnectorTrack,{backgroundColor:k}]}),_jsx(Animated.View,{style:[j.hConnectorFill,{backgroundColor:V,width:H}]})]}),i.map((e,t)=>{const i=z[t];return _jsxs(View,{style:j.hStepItem,children:[_jsx(StepCircle,{index:t,step:e,status:i,toneColor:V,upcomingColor:k,upcomingFillColor:R,onPressColor:V,textOnColor:A,upcomingTextColor:I,interactive:L,canPress:canPressStatus(i),totalSteps:E,onPress:handleStepPress,pulseEnabled:C,circleStyles:_,circleSlotStyle:x}),_jsx(Text,{style:[j.hLabel,{color:"upcoming"===i?w.colors["text-subtle"]:w.colors["text-body"],fontSize:w.text.xs.size},g],numberOfLines:1,children:e?.label??" "})]},e.key)})]})});return u?_jsx(StepperSkeleton,{...e}):J});Stepper.displayName="Stepper";const StepperSkeleton=({steps:e,variant:t="horizontal",showCaption:i=!0,containerStyle:s,style:o,testID:l})=>{const r=useTheme(),n=useMemo(()=>buildStyles(r),[r]),a=useMemo(()=>buildSkeletonStyles(r),[r]),c=e.length||3;return"segmented"===t?_jsxs(View,{style:[n.container,s,o],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:[i?_jsx(Skeleton,{shape:"text",width:"45%",height:14,style:{marginBottom:r.space.sm}}):null,_jsx(View,{style:n.sRow,children:Array.from({length:c}).map((e,t)=>_jsx(View,{style:n.sItem,children:_jsx(Skeleton,{width:"100%",height:4,radius:"pill"})},`sk-step-${t}`))})]}):_jsx(View,"vertical"===t?{style:[n.container,s,o],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:_jsx(View,{style:a.vCol,children:Array.from({length:c}).map((e,t)=>{const i=t===c-1;return _jsxs(View,{style:a.vRow,children:[_jsxs(View,{style:[a.vLeft,{width:32}],children:[_jsx(Skeleton,{shape:"circle",width:24,height:24}),i?null:_jsx(Skeleton,{width:2,height:36})]}),_jsxs(View,{style:a.vBody,children:[_jsx(Skeleton,{shape:"text",width:"55%",height:16,style:{marginBottom:r.space.xs}}),_jsx(Skeleton,{shape:"text",width:"80%",height:12})]})]},`sk-step-${t}`)})})}:{style:[n.container,s,o],testID:l,accessibilityRole:"progressbar",accessibilityState:{busy:!0},"aria-busy":!0,children:_jsxs(View,{style:n.hRow,children:[_jsx(View,{pointerEvents:"none",style:[n.hConnectorContainer,{left:50/c+"%",right:50/c+"%"}],children:_jsx(Skeleton,{width:"100%",height:2,radius:"pill"})}),Array.from({length:c}).map((e,t)=>_jsxs(View,{style:n.hStepItem,children:[_jsx(Skeleton,{shape:"circle",width:24,height:24}),_jsx(Skeleton,{shape:"text",width:"80%",height:12,style:{marginTop:r.space.xs}})]},`sk-step-${t}`))]})})};StepperSkeleton.displayName="StepperSkeleton",Stepper.Skeleton=StepperSkeleton;const buildSkeletonStyles=e=>StyleSheet.create({vCol:{flexDirection:"column"},vRow:{flexDirection:"row",alignItems:"flex-start"},vLeft:{alignItems:"center"},vBody:{flex:1,paddingLeft:e.space.md,paddingBottom:e.space.lg}}),buildStyles=e=>StyleSheet.create({container:{width:"100%"},hRow:{flexDirection:"row",alignItems:"flex-start",justifyContent:"space-between",position:"relative"},hConnectorContainer:{position:"absolute",top:11,height:2,flexDirection:"row",alignItems:"center"},hConnectorTrack:{position:"absolute",left:0,right:0,height:2,borderRadius:e.radius.pill,...smoothCorners},hConnectorFill:{position:"absolute",left:0,height:2,borderRadius:e.radius.pill,...smoothCorners},hStepItem:{alignItems:"center",flex:1},hLabel:{marginTop:e.space.xs,textAlign:"center"},vCol:{flexDirection:"column"},vRow:{flexDirection:"row",alignItems:"flex-start"},vLeft:{alignItems:"center",alignSelf:"stretch",width:32},vConnectorContainer:{flex:1,width:2,minHeight:32,position:"relative",alignSelf:"center"},vConnectorTrack:{position:"absolute",top:0,bottom:0,width:2,borderRadius:e.radius.pill,...smoothCorners},vConnectorFill:{position:"absolute",top:0,width:2,borderRadius:e.radius.pill,...smoothCorners},vBody:{flex:1,paddingLeft:e.space.sm,paddingBottom:e.space.md},vLabel:{marginBottom:e.space.xxs},vDescription:{},sCaption:{includeFontPadding:!1},sRow:{flexDirection:"row",columnGap:e.space.xs},sItem:{flex:1},sTrack:{height:4,borderRadius:e.radius.pill,overflow:"hidden"},sFill:{height:4,borderRadius:e.radius.pill}});export{Stepper};export default Stepper;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,Easing,Pressable,StyleSheet,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{createAnimatedValue,resolveSwitchSize,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{ChoiceText,hasChoiceDetail}from"../FieldBase/ChoiceText.js";import{fieldTextAsString,hasFieldText}from"../FieldBase/FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;default:return e.colors.primary}},Switch=forwardRef((e,t)=>{const{value:
|
|
1
|
+
"use strict";import{forwardRef,useEffect,useMemo,useRef}from"react";import{Animated,Easing,Pressable,StyleSheet,View}from"react-native";import{useControllableState}from"../../hooks/index.js";import{createAnimatedValue,resolveSwitchSize,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{triggerHaptic}from"../../utils/hapticUtils.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{ChoiceText,hasChoiceDetail}from"../FieldBase/ChoiceText.js";import{fieldTextAsString,hasFieldText}from"../FieldBase/FieldBase.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const toneColor=(e,t)=>{switch(t){case"success":return e.colors.success;case"warning":return e.colors.warning;case"danger":return e.colors.danger;default:return e.colors.primary}},Switch=forwardRef((e,t)=>{const{value:i,defaultValue:s,onChange:r,disabled:a=!1,size:o="md",tone:n="primary",label:l,description:c,error:d,labelLines:u,layout:p="inline",accessibilityLabel:m,haptic:h="selection",bounce:f=!1,style:b,containerStyle:g,trackStyle:y,thumbStyle:w,testID:x,hitSlop:S,...j}=e,[C,R]=useControllableState({value:i,defaultValue:s??!1,onChange:r}),v=useTheme(),T=useMemo(()=>resolveSwitchSize(v,o),[v,o]),k=v.colors.thumb,A=useMemo(()=>buildStyles(v),[v]),V="dark"===v.mode?v.colors.neutral:v.colors["surface-disabled"],D=toneColor(v,n),_=S??8,L=useRef(createAnimatedValue(C?1:0)).current;useEffect(()=>{const e=Animated.spring(L,{toValue:C?1:0,damping:v.motion.spring.snappy.damping,stiffness:v.motion.spring.snappy.stiffness,mass:v.motion.spring.snappy.mass,useNativeDriver:!0});return e.start(),()=>e.stop()},[C,L,v.motion.spring.snappy]);const E=useRef(createAnimatedValue(C?1:0)).current;useEffect(()=>{const e=Animated.timing(E,{toValue:C?1:0,duration:v.motion.duration.fast,easing:Easing.out(Easing.ease),useNativeDriver:!1});return e.start(),()=>e.stop()},[C,E,v.motion.duration.fast]);const z=T.padding,F=T["track-width"]-T["thumb-size"]-T.padding,H=L.interpolate({inputRange:[0,1],outputRange:[z,F]}),M=E.interpolate({inputRange:[0,1],outputRange:[V,D]}),P=useRef(createAnimatedValue(1)).current,I=useRef(!0);useEffect(()=>{if(!f)return;if(I.current)return void(I.current=!1);const e=Animated.sequence([Animated.spring(P,{toValue:1.15,damping:10,stiffness:220,mass:1,useNativeDriver:!0}),Animated.spring(P,{toValue:1,damping:14,stiffness:240,mass:1,useNativeDriver:!0})]);return e.start(),()=>e.stop()},[C,f,P]);const handlePress=e=>{a||(!1!==h&&triggerHaptic(h),R(!C),j.onPressOut?.(e))},N=m??fieldTextAsString(l),B=hasFieldText(l)||hasChoiceDetail(c,d),q=(!0===d||hasFieldText(d))&&!C&&!a,O="row"===p&&B,U=_jsxs(Animated.View,{style:[A.track,{width:T["track-width"],height:T["track-height"],borderRadius:v.radius.pill,...smoothCorners,backgroundColor:M},y],children:[q?_jsx(View,{pointerEvents:"none",style:[A.errorRing,{borderRadius:v.radius.pill,...smoothCorners,borderWidth:v.size.border,borderColor:v.colors["field-border-error"]}]}):null,_jsx(Animated.View,{style:[A.thumb,v.shadow.card,{backgroundColor:k,width:T["thumb-size"],height:T["thumb-size"],borderRadius:v.radius.pill,...smoothCorners,transform:[{translateX:H},{scale:P}]},w]})]});if(O)return _jsxs(Pressable,{ref:t,onPress:handlePress,disabled:a,accessibilityRole:"switch",accessibilityLabel:N,accessibilityHint:j.accessibilityHint??fieldTextAsString(c),accessibilityState:{checked:C,disabled:a},"aria-checked":C,"aria-disabled":a,testID:x,hitSlop:S,...null==S?{}:hitSlopMarker(S),...j,style:({pressed:e})=>[A.row,A.spreadRow,hasChoiceDetail(c,d)?A.rowTop:null,{opacity:a?.55:e?.9:1},g,b],children:[_jsx(ChoiceText,{label:l,description:c,error:d,disabled:a,labelLines:u||void 0,descriptionLines:u||void 0,style:A.spreadText}),U]});const W=_jsx(Pressable,{ref:t,onPress:handlePress,disabled:a,accessibilityRole:"switch",accessibilityLabel:N,accessibilityHint:j.accessibilityHint??fieldTextAsString(c),accessibilityState:{checked:C,disabled:a},"aria-checked":C,"aria-disabled":a,testID:x,hitSlop:_,...hitSlopMarker(_),...j,style:({pressed:e})=>[{opacity:a?.55:e?.9:1},B?null:b],children:U});return B?_jsxs(View,{style:[A.row,hasChoiceDetail(c,d)?A.rowTop:null,g,b],children:[W,_jsx(ChoiceText,{label:l,description:c,error:d,disabled:a,labelLines:u||void 0,descriptionLines:u||void 0,style:A.text})]}):g?_jsx(View,{style:g,children:W}):W});Switch.displayName="Switch";const buildStyles=e=>StyleSheet.create({row:{flexDirection:"row",alignItems:"center"},track:{justifyContent:"center"},thumb:{position:"absolute",top:2},errorRing:{...StyleSheet.absoluteFill},rowTop:{alignItems:"flex-start"},text:{marginLeft:e.space.sm},spreadRow:{minHeight:44,justifyContent:"space-between"},spreadText:{flex:1,marginRight:e.space.md}});export{Switch};export default Switch;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{forwardRef,useMemo}from"react";import{Text as RNText}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{warnInvalidValue}from"../../utils/warnInvalidValue.js";import{jsx as _jsx}from"react/jsx-runtime";const VARIANTS={display:{size:"4xl",weight:"bold",line:"display",color:"primary",heading:!0,fontFamily:"display"},h1:{size:"3xl",weight:"bold",line:"heading",color:"primary",heading:!0,fontFamily:"display"},h2:{size:"2xl",weight:"semibold",line:"heading",color:"primary",heading:!0,fontFamily:"display"},h3:{size:"xl",weight:"semibold",line:"heading",color:"primary",heading:!0},title:{size:"lg",weight:"semibold",line:"body",color:"primary",fontFamily:"display"},body:{size:"base",weight:"normal",line:"body",color:"primary"},bodySmall:{size:"sm",weight:"normal",line:"body",color:"secondary"},caption:{size:"xs",weight:"normal",line:"body",color:"tertiary"},label:{size:"sm",weight:"medium",line:"body",color:"secondary"},overline:{size:"xs",weight:"semibold",line:"body",color:"secondary",uppercase:!0,letterSpacing:"wide"}},TEXT_ROLE_COLOR={textStrong:"text",primary:"text-body",secondary:"text-muted",tertiary:"text-subtle",inverse:"text-inverse",disabled:"text-disabled",link:"link"},SEMANTIC={success:!0,warning:!0,danger:!0,info:!0};export const resolveColor=(e,
|
|
1
|
+
"use strict";import{forwardRef,useMemo}from"react";import{Text as RNText}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{warnInvalidValue}from"../../utils/warnInvalidValue.js";import{NotationInkContext,useNotationInk}from"../Notation/Notation.js";import{jsx as _jsx}from"react/jsx-runtime";const VARIANTS={display:{size:"4xl",weight:"bold",line:"display",color:"primary",heading:!0,fontFamily:"display"},h1:{size:"3xl",weight:"bold",line:"heading",color:"primary",heading:!0,fontFamily:"display"},h2:{size:"2xl",weight:"semibold",line:"heading",color:"primary",heading:!0,fontFamily:"display"},h3:{size:"xl",weight:"semibold",line:"heading",color:"primary",heading:!0},title:{size:"lg",weight:"semibold",line:"body",color:"primary",fontFamily:"display"},body:{size:"base",weight:"normal",line:"body",color:"primary"},bodySmall:{size:"sm",weight:"normal",line:"body",color:"secondary"},caption:{size:"xs",weight:"normal",line:"body",color:"tertiary"},label:{size:"sm",weight:"medium",line:"body",color:"secondary"},overline:{size:"xs",weight:"semibold",line:"body",color:"secondary",uppercase:!0,letterSpacing:"wide"}},TEXT_ROLE_COLOR={textStrong:"text",primary:"text-body",secondary:"text-muted",tertiary:"text-subtle",inverse:"text-inverse",disabled:"text-disabled",link:"link"},SEMANTIC={success:!0,warning:!0,danger:!0,info:!0};export const resolveColor=(e,t)=>Object.hasOwn(TEXT_ROLE_COLOR,t)?e.colors[TEXT_ROLE_COLOR[t]]:Object.hasOwn(SEMANTIC,t)?e.colors[`${t}-text`]:t;const Text=forwardRef((e,t)=>{const{variant:i="body",color:o,weight:r,size:n,align:l,italic:a,underline:s,style:d,children:c,...m}=e,y=useTheme(),p=Object.hasOwn(VARIANTS,i),g=y.settings.textVariants,x=!p&&g&&Object.hasOwn(g,i)?g[i]:void 0;p||x||warnInvalidValue("Text","variant",e.variant,[...Object.keys(VARIANTS),...Object.keys(g??{})]);const h=useMemo(()=>{if(x){const e="string"==typeof n?n:x.size,t="number"==typeof n?n:y.text[e].size;return{fontSize:t,lineHeight:x.lineHeight??("number"==typeof n?void 0:Math.round(t*y.leading[x.heading?"heading":"body"])),color:void 0!==o?resolveColor(y,o):x.color?y.colors[x.color]:resolveColor(y,"primary"),textAlign:l,textTransform:x.uppercase?"uppercase":void 0,letterSpacing:x.letterSpacing?y["letter-spacing"][x.letterSpacing]:void 0,fontStyle:a||x.italic?"italic":void 0,fontVariant:x.fontVariant,textDecorationLine:s?"underline":void 0,...fontFor(y,r??x.weight??"normal",x.fontFamily)}}const e=VARIANTS[p?i:"body"],t="number"==typeof n?n:y.text[n??e.size].size;return{fontSize:t,lineHeight:Math.round(t*y.leading[e.line]),color:resolveColor(y,o??e.color),textAlign:l,textTransform:e.uppercase?"uppercase":void 0,letterSpacing:e.letterSpacing?y["letter-spacing"][e.letterSpacing]:void 0,fontStyle:a?"italic":void 0,textDecorationLine:s?"underline":void 0,...fontFor(y,r??e.weight,e.fontFamily)}},[y,x,p,i,o,r,n,l,a,s]),b=useNotationInk([h,d],y.text.base.size,y.colors["text-body"]),f=p?VARIANTS[i].heading:x?.heading,u="string"==typeof c||"number"==typeof c;return _jsx(RNText,{ref:t,style:[h,d],maxFontSizeMultiplier:y.settings.maxFontSizeMultiplier,accessibilityRole:f?"header":m.accessibilityRole,...m,children:u?c:_jsx(NotationInkContext.Provider,{value:b,children:c})})});Text.displayName="Text";export{Text};export default Text;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,PanResponder,Platform,Pressable,StyleSheet,Text,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,fontFor,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SWIPE_DISMISS_THRESHOLD=80,SWIPE_VELOCITY_THRESHOLD=.5,STACK_OFFSET=8,STACK_SCALE_STEP=.04,DEFAULT_AUTO_DISMISS_MS=3e3,WEB_ACTION_MIN_DURATION_MS=8e3,COUNTDOWN_BAR_HEIGHT=3,ACTION_HIT_SLOP={top:10,bottom:10,left:10,right:10},DISMISS_ACTIONS=[{name:"dismiss",label:"Dismiss"}],Toast=({toast:e,index:t,onDismiss:n,shownAt:i,runtime:s})=>{const a=useTheme(),r=usePresenceMotion(),o=r.duration("fast"),l=e.variant??"default",c=e.position??"bottom",u=useMemo(()=>buildStyles(a),[a]),d=useMemo(()=>tintFor(a,l),[a,l]),m=useMemo(()=>inkFor(a,l),[a,l]),p=a.components.toast["icon-circle-size"],g=a.text[a.components.toast["icon-glyph-text"]].size,h=a.components.toast["tint-bar-width"],f=a.settings.components.toast?.defaultDurationMs??3e3,b=a.settings.components.toast?.enableSwipeDismiss??!0,x="top"===c?-120:120,v=useRef(createAnimatedValue(r.reduced?0:x)).current,A=useRef(createAnimatedValue(0)).current,S=useRef(createAnimatedValue(0)).current,y=useRef(!1),w="top"===c?8*t:8*-t,M=Math.max(1-.04*t,.9),T=useRef(createAnimatedValue(w)).current;useEffect(()=>{setNativeValue(T,w)},[w,T]);const V=useMemo(()=>Animated.add(v,T),[v,T]),_=void 0!==e.action,D=e.duration??f,
|
|
1
|
+
"use strict";import{useCallback,useEffect,useMemo,useRef,useState}from"react";import{Animated,Easing,PanResponder,Platform,Pressable,StyleSheet,Text,View}from"react-native";import{usePresenceMotion}from"../../hooks/usePresenceMotion.js";import{createAnimatedValue,fontFor,setNativeValue,useTheme}from"../../theme/index.js";import{smoothCorners}from"../../utils/corners.js";import{hitSlopMarker}from"../../utils/hitSlop.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const SWIPE_DISMISS_THRESHOLD=80,SWIPE_VELOCITY_THRESHOLD=.5,STACK_OFFSET=8,STACK_SCALE_STEP=.04,DEFAULT_AUTO_DISMISS_MS=3e3,WEB_ACTION_MIN_DURATION_MS=8e3,COUNTDOWN_BAR_HEIGHT=3,ACTION_HIT_SLOP={top:10,bottom:10,left:10,right:10},DISMISS_ACTIONS=[{name:"dismiss",label:"Dismiss"}],Toast=({toast:e,index:t,onDismiss:n,shownAt:i,runtime:s})=>{const a=useTheme(),r=usePresenceMotion(),o=r.duration("fast"),l=e.variant??"default",c=e.position??"bottom",u=useMemo(()=>buildStyles(a),[a]),d=useMemo(()=>tintFor(a,l),[a,l]),m=useMemo(()=>inkFor(a,l),[a,l]),p=a.components.toast["icon-circle-size"],g=a.text[a.components.toast["icon-glyph-text"]].size,h=a.components.toast["tint-bar-width"],f=a.settings.components.toast?.defaultDurationMs??3e3,b=a.settings.components.toast?.enableSwipeDismiss??!0,x="top"===c?-120:120,v=useRef(createAnimatedValue(r.reduced?0:x)).current,A=useRef(createAnimatedValue(0)).current,S=useRef(createAnimatedValue(0)).current,y=useRef(!1),w="top"===c?8*t:8*-t,M=Math.max(1-.04*t,.9),T=useRef(createAnimatedValue(w)).current;useEffect(()=>{setNativeValue(T,w)},[w,T]);const V=useMemo(()=>Animated.add(v,T),[v,T]),_=void 0!==e.action,D=e.duration??f,C=D>0&&_&&"web"===Platform.OS?Math.max(D,8e3):D,R=C<=0||_&&!0===s?.screenReaderOn,N=!0===e.countdown&&!R,I=useRef(createAnimatedValue(1)).current,E=useRef({initialised:!1,timer:null,remaining:0,startedAt:0}),P=useRef({touch:!1,pan:!1,hover:!1}),j=useRef(()=>{}),k=useRef({id:e.id,totalMs:C,shownAt:i,runtime:s,persistent:R,animateBar:!1});k.current={id:e.id,totalMs:C,shownAt:i,runtime:s,persistent:R,animateBar:N&&!r.reduced};const O=useCallback(()=>{const e=E.current,t=k.current,n=P.current;if(!e.initialised){e.initialised=!0;const n=t.runtime?.readRemaining(t.id),i=void 0===t.shownAt?0:Date.now()-t.shownAt;e.remaining=n??(t.totalMs>0?Math.max(t.totalMs-i,0):0),t.totalMs>0&&e.remaining<t.totalMs&&setNativeValue(I,e.remaining/t.totalMs)}const i=!(t.persistent||y.current||n.touch||n.pan||n.hover);i&&null===e.timer?(e.startedAt=Date.now(),e.timer=setTimeout(()=>{e.timer=null,e.remaining=0,j.current()},e.remaining),t.animateBar&&Animated.timing(I,{toValue:0,duration:e.remaining,easing:Easing.linear,useNativeDriver:!0}).start()):i||null===e.timer||(clearTimeout(e.timer),e.timer=null,e.remaining=Math.max(e.remaining-(Date.now()-e.startedAt),0),I.stopAnimation())},[I]),dismiss=()=>{if(y.current)return;y.current=!0,O();const t=[Animated.timing(S,{toValue:0,duration:o,easing:Easing.bezier(...a.motion.ease.accelerate),useNativeDriver:!0})];r.reduced||t.push(Animated.timing(v,{toValue:x,duration:a.motion.duration.fast,easing:Easing.bezier(...a.motion.ease.accelerate),useNativeDriver:!0})),Animated.parallel(t).start(()=>n(e.id))};j.current=dismiss,useEffect(()=>{const e=r.reduced?Animated.timing(S,{toValue:1,duration:o,useNativeDriver:!0}):Animated.parallel([Animated.spring(v,{toValue:0,damping:18,stiffness:180,mass:1,useNativeDriver:!0}),Animated.timing(S,{toValue:1,duration:o,useNativeDriver:!0})]);return e.start(),()=>e.stop()},[]),useEffect(()=>{O()},[R,O]),useEffect(()=>()=>{const e=E.current,t=k.current;null!==e.timer&&(clearTimeout(e.timer),e.timer=null,e.remaining=Math.max(e.remaining-(Date.now()-e.startedAt),0)),I.stopAnimation(),e.initialised&&t.totalMs>0&&!y.current&&t.runtime?.writeRemaining(t.id,e.remaining)},[I]);const L=useCallback((e,t)=>{P.current[e]=t,O()},[O]),H=useCallback(()=>L("touch",!0),[L]),F=useCallback(e=>L("touch",(e.nativeEvent.touches?.length??0)>0),[L]),z=useCallback(()=>L("hover",!0),[L]),B=useCallback(()=>L("hover",!1),[L]),G=useMemo(()=>PanResponder.create({onMoveShouldSetPanResponder:(e,t)=>Math.abs(t.dx)>Math.abs(t.dy)&&Math.abs(t.dx)>6,onPanResponderGrant:()=>L("pan",!0),onPanResponderMove:(e,t)=>{setNativeValue(A,t.dx);const n=1-.7*Math.min(Math.abs(t.dx)/200,1);setNativeValue(S,n)},onPanResponderTerminate:()=>{if(L("pan",!1),r.reduced)return setNativeValue(A,0),void Animated.timing(S,{toValue:1,duration:o,useNativeDriver:!0}).start();Animated.parallel([Animated.spring(A,{toValue:0,damping:a.motion.spring.snappy.damping,stiffness:a.motion.spring.snappy.stiffness,mass:a.motion.spring.snappy.mass,useNativeDriver:!0}),Animated.timing(S,{toValue:1,duration:o,useNativeDriver:!0})]).start()},onPanResponderRelease:(t,i)=>{if(Math.abs(i.dx)>80||Math.abs(i.vx)>.5){const t=i.dx>=0?1:-1;y.current=!0,L("pan",!1);const s=[Animated.timing(S,{toValue:0,duration:o,useNativeDriver:!0})];r.reduced||s.push(Animated.timing(A,{toValue:500*t,duration:a.motion.duration.fast,useNativeDriver:!0})),Animated.parallel(s).start(()=>n(e.id))}else L("pan",!1),r.reduced?(setNativeValue(A,0),Animated.timing(S,{toValue:1,duration:o,useNativeDriver:!0}).start()):Animated.parallel([Animated.spring(A,{toValue:0,useNativeDriver:!0}),Animated.spring(S,{toValue:1,useNativeDriver:!0})]).start()}}),[A,S,L,o,r.reduced,a.motion.duration.fast,a.motion.spring.snappy.damping,a.motion.spring.snappy.stiffness,a.motion.spring.snappy.mass,n,e.id]),W={accessibilityActions:DISMISS_ACTIONS,onAccessibilityAction:e=>{"dismiss"===e.nativeEvent.actionName&&dismiss()}},[U,$]=useState(0),K=useMemo(()=>I.interpolate({inputRange:[0,1],outputRange:[-U,0]}),[I,U]),X=e.description?`${e.message}. ${e.description}`:e.message,Y=e.action&&N?`${e.action.label}, ${Math.ceil(C/1e3)} seconds`:e.action?.label;return _jsxs(Animated.View,{...b?G.panHandlers:{},..._?{}:{accessible:!0,...W},..."web"===Platform.OS?{onPointerEnter:z,onPointerLeave:B}:{},onTouchStart:H,onTouchEnd:F,onTouchCancel:F,accessibilityLabel:X,testID:e.testID,style:[u.container,{backgroundColor:a.colors.surface,borderRadius:a.radius.lg,...smoothCorners,padding:a.space.md,...a.shadow.elevated,opacity:S,transform:[{translateY:V},{translateX:A},{scale:M}]},e.style,e.containerStyle],children:[h>0?_jsx(View,{style:[u.tintBar,{width:h,backgroundColor:d}]}):null,_jsxs(View,{style:u.row,children:[(()=>{if(e.icon)return e.icon;const t=defaultGlyph(l);return t?_jsx(View,{style:[u.iconCircle,{width:p,height:p,borderRadius:a.radius.pill,...smoothCorners,backgroundColor:d+"22"},e.iconCircleStyle],children:_jsx(Text,{style:[u.iconGlyph,{color:m,fontSize:g}],accessible:!1,children:t})}):null})(),_jsxs(View,{style:u.textBlock,children:[_jsx(Text,{style:[u.message,{color:a.colors["text-body"],fontSize:a.text.base.size,...fontFor(a,"semibold")},e.textStyle,e.messageStyle],numberOfLines:2,children:e.message}),e.description?_jsx(Text,{style:[u.description,{color:a.colors["text-muted"],fontSize:a.text.sm.size}],numberOfLines:3,children:e.description}):null]}),e.action?_jsx(Pressable,{accessibilityRole:"button",accessibilityLabel:Y,hitSlop:ACTION_HIT_SLOP,...hitSlopMarker(ACTION_HIT_SLOP),...W,onPress:()=>{e.action?.onPress(),dismiss()},style:({pressed:t})=>[u.actionBtn,{backgroundColor:t?a.colors["surface-pressed"]:"transparent"},e.actionButtonStyle],children:_jsx(Text,{style:{color:d,fontSize:a.text.sm.size,...fontFor(a,"semibold")},numberOfLines:1,children:e.action.label})}):null]}),N?_jsxs(View,{pointerEvents:"none",accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",onLayout:e=>$(e.nativeEvent.layout.width),testID:"toast-countdown",style:[u.countdownTrack,{backgroundColor:d+"22"}],children:[r.reduced?_jsx(View,{style:[u.countdownFill,{backgroundColor:d}]}):null,!r.reduced&&U>0?_jsx(Animated.View,{style:[u.countdownFill,{backgroundColor:d,transform:[{translateX:K}]}]}):null]}):null]})},tintFor=(e,t)=>{switch(t){case"success":return e.colors.success;case"danger":return e.colors.danger;case"warning":return e.colors.warning;case"info":return e.colors.info;default:return e.colors["text-body"]}},inkFor=(e,t)=>{switch(t){case"success":return e.colors["success-text"];case"danger":return e.colors["danger-text"];case"warning":return e.colors["warning-text"];case"info":return e.colors["info-text"];default:return e.colors["text-body"]}},defaultGlyph=e=>{switch(e){case"success":return"✓";case"danger":return"×";case"warning":return"!";case"info":return"i";default:return""}},buildStyles=e=>StyleSheet.create({container:{overflow:"hidden",marginVertical:e.space.xs},tintBar:{position:"absolute",left:0,top:0,bottom:0},row:{flexDirection:"row",alignItems:"center",paddingLeft:e.space.sm},iconCircle:{alignItems:"center",justifyContent:"center",marginRight:e.space.md},iconGlyph:{fontWeight:"700",lineHeight:19},textBlock:{flex:1,paddingRight:e.space.sm},message:{lineHeight:20},description:{marginTop:e.space.xxs,lineHeight:18},countdownTrack:{position:"absolute",left:0,right:0,bottom:0,height:3,overflow:"hidden"},countdownFill:{position:"absolute",left:0,right:0,top:0,bottom:0},actionBtn:{paddingHorizontal:e.space.sm,paddingVertical:e.space.xs,minHeight:e.components.toast["action-min-height"],borderRadius:e.radius.md,...smoothCorners,marginLeft:e.space.sm}});export{Toast};export default Toast;
|
package/lib/module/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";export*from"./components/index.js";export{APP_ICON_SIZES,AppIcon,CURATED_ICON_NAMES,defaultIcons,ICON_NAMES,ICONSAX_SUFFIX,renderSlotIcon}from"./components/AppIcon/index.js";export{deletePath,Form,getPath,HookFormField,isFieldFilled,rules,setPath,useField,useFieldArray,useForm,useFormCompletion,useFormContext,useHookFormField,useOptionalFormContext}from"./form/index.js";export{FLICK_TOLERANCE,PRESENCE_REDUCE_MOTION,PRESS_ANIMATION_PRESETS,useControllableState,useDebounce,useFieldChain,useFlickGuard,usePresenceMotion,usePressAnimation,useReducedMotion,useRefreshControl,useScrollDirection,useToggle}from"./hooks/index.js";export{
|
|
1
|
+
"use strict";export{PHONE_CHROME_INSETS}from"./canvasKit/index.js";export*from"./components/index.js";export{APP_ICON_SIZES,AppIcon,CURATED_ICON_NAMES,defaultIcons,ICON_NAMES,ICONSAX_SUFFIX,renderSlotIcon}from"./components/AppIcon/index.js";export{deletePath,Form,getPath,HookFormField,isFieldFilled,rules,setPath,useField,useFieldArray,useForm,useFormCompletion,useFormContext,useHookFormField,useOptionalFormContext}from"./form/index.js";export{FLICK_TOLERANCE,PRESENCE_REDUCE_MOTION,PRESS_ANIMATION_PRESETS,useControllableState,useDebounce,useFieldChain,useFlickGuard,usePresenceMotion,usePressAnimation,useReducedMotion,useRefreshControl,useScrollDirection,useToggle}from"./hooks/index.js";export{NetworkStatusBanner}from"./network/index.js";export{COLOR_NAMES,DURATION_NAMES,darkTheme,EASE_NAMES,FONT_NAMES,LEADING_NAMES,LETTER_SPACING_NAMES,lightTheme,mergeBrand,RADIUS_NAMES,radiusOf,resolveBadgeSize,resolveButtonSize,resolveCheckboxSize,resolveChipSize,resolveEmptyStateSize,resolveFieldSize,resolveFloatingActionButtonSize,resolveListItemSize,resolveOtpInputSize,resolveRadioSize,resolveSegmentedControlSize,resolveSliderSize,resolveSwitchSize,resolveTabsSize,SHADOW_NAMES,SIZE_NAMES,SPACE_NAMES,spaceOf,TEXT_NAMES,ThemeProvider,textOf,useTheme,useThemeMode,WEIGHT_NAMES}from"./theme/index.js";export{announce,Breakpoints,configureFeedback,feedback,hapticForIntent,isFeedbackEnabled,isScreenSize,isTablet,Responsive,ScreenDimensions,SQUIRCLE_MIN_RADIUS,SQUIRCLE_SMOOTHING,setHapticImplementation,shadowStyle,smoothCorners,squircleApplies,squircleHostRadius,squirclePath,triggerHaptic,useScreenDimensions,warnUnknownProps}from"./utils/index.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
"use strict";export{createAnimatedValue,setNativeValue}from"./animatedValue.js";export{resolveBadgeSize,resolveButtonSize,resolveCheckboxSize,resolveChipSize,resolveEmptyStateSize,resolveFieldSize,resolveFloatingActionButtonSize,resolveListItemSize,resolveOtpInputSize,resolveRadioSize,resolveSegmentedControlSize,resolveSliderSize,resolveSwitchSize,resolveTabsSize,validateComponentTokens}from"./componentSizes.js";export{Gradient,gradientAngle,toBackgroundImage}from"./Gradient.js";export{mergeBrand}from"./merge.js";export{radiusOf,spaceOf,textOf}from"./scale.js";export{ThemeProvider,useTheme,useThemeMode}from"./ThemeContext.js";export{fontFor}from"./textStyle.js";export{darkTheme,lightTheme}from"./tokens.js";export{COLOR_NAMES,DURATION_NAMES,EASE_NAMES,FONT_NAMES,LEADING_NAMES,LETTER_SPACING_NAMES,RADIUS_NAMES,SHADOW_NAMES,SIZE_NAMES,SPACE_NAMES,TEXT_NAMES,WEIGHT_NAMES}from"./tokens.generated.js";
|
|
@@ -2,11 +2,27 @@ import { type ReactNode } from "react";
|
|
|
2
2
|
import { View } from "react-native";
|
|
3
3
|
import type { ColorMode } from "../theme/types";
|
|
4
4
|
export type PhoneChromeOs = "Ios" | "Android";
|
|
5
|
+
export declare const PHONE_CHROME_INSETS: {
|
|
6
|
+
readonly Ios: {
|
|
7
|
+
readonly top: 54;
|
|
8
|
+
readonly bottom: 34;
|
|
9
|
+
};
|
|
10
|
+
readonly Android: {
|
|
11
|
+
readonly top: 24;
|
|
12
|
+
readonly bottom: 0;
|
|
13
|
+
};
|
|
14
|
+
};
|
|
5
15
|
export interface StatusBarProps {
|
|
6
16
|
os: PhoneChromeOs;
|
|
7
17
|
colorMode?: ColorMode;
|
|
18
|
+
/** The clock as shown, such as 9:41. */
|
|
19
|
+
time?: string;
|
|
20
|
+
/** Signal strength in bars, 0 to 4. */
|
|
21
|
+
signal?: number;
|
|
22
|
+
/** Battery level in percent, 0 to 100. */
|
|
23
|
+
battery?: number;
|
|
8
24
|
}
|
|
9
|
-
export declare const StatusBar: ({ os, colorMode }: StatusBarProps) => import("react").CElement<import("react-native").ViewProps, View>;
|
|
25
|
+
export declare const StatusBar: ({ os, colorMode, time, signal, battery }: StatusBarProps) => import("react").CElement<import("react-native").ViewProps, View>;
|
|
10
26
|
export interface HomeIndicatorProps {
|
|
11
27
|
os: PhoneChromeOs;
|
|
12
28
|
colorMode?: ColorMode;
|
|
@@ -31,9 +47,10 @@ export interface KeyboardFrameProps {
|
|
|
31
47
|
export declare const KeyboardFrame: ({ colorMode, previewOs, children }: KeyboardFrameProps) => import("react").CElement<import("react-native").ViewProps, View>;
|
|
32
48
|
export interface PhoneChromeManifestProp {
|
|
33
49
|
name: string;
|
|
34
|
-
type: "enum";
|
|
35
|
-
enum
|
|
50
|
+
type: "enum" | "string" | "number";
|
|
51
|
+
enum?: string[];
|
|
36
52
|
required: boolean;
|
|
53
|
+
description?: string;
|
|
37
54
|
}
|
|
38
55
|
export interface PhoneChromeManifestComponent {
|
|
39
56
|
name: string;
|
|
@@ -24,6 +24,7 @@ export interface AppBarRightAction extends AppBarAction {
|
|
|
24
24
|
}
|
|
25
25
|
export interface AppBarProps {
|
|
26
26
|
title?: string;
|
|
27
|
+
/** One line, two on the large variant; longer text ends in an ellipsis. */
|
|
27
28
|
subtitle?: string;
|
|
28
29
|
titleAlignment?: AppBarTitleAlignment;
|
|
29
30
|
leftAction?: AppBarAction;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { ButtonProps } from "./Button";
|
|
2
|
-
export declare const meta: import("../../canvasKit/meta").PhoneMeta<ButtonProps, "gradient" | "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "
|
|
2
|
+
export declare const meta: import("../../canvasKit/meta").PhoneMeta<ButtonProps, "gradient" | "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "pressRetentionOffset" | "haptic" | "delayLongPress" | "cancelable" | "delayHoverIn" | "delayHoverOut" | "android_disableSound" | "android_ripple" | "testOnly_pressed" | "unstable_pressDelay" | "pressAnimation", never>;
|
|
3
3
|
//# sourceMappingURL=Button.meta.d.ts.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { CardProps } from "./Card";
|
|
2
|
-
export declare const meta: import("../../canvasKit/meta").PhoneMeta<CardProps, "gradient" | "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "
|
|
2
|
+
export declare const meta: import("../../canvasKit/meta").PhoneMeta<CardProps, "gradient" | "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "pressRetentionOffset" | "haptic" | "delayLongPress" | "cancelable" | "delayHoverIn" | "delayHoverOut" | "android_disableSound" | "android_ripple" | "testOnly_pressed" | "unstable_pressDelay" | "imageSource", never>;
|
|
3
3
|
//# sourceMappingURL=Card.meta.d.ts.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { CheckboxProps } from "./Checkbox";
|
|
2
|
-
export declare const meta: import("../../canvasKit/meta").PhoneMeta<CheckboxProps, "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "
|
|
2
|
+
export declare const meta: import("../../canvasKit/meta").PhoneMeta<CheckboxProps, "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "pressRetentionOffset" | "haptic" | "delayLongPress" | "cancelable" | "delayHoverIn" | "delayHoverOut" | "android_disableSound" | "android_ripple" | "testOnly_pressed" | "unstable_pressDelay", never>;
|
|
3
3
|
//# sourceMappingURL=Checkbox.meta.d.ts.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { DecimalInputProps } from "./DecimalInput";
|
|
2
|
-
export declare const meta: import("../../canvasKit/meta").PhoneMeta<DecimalInputProps, "
|
|
2
|
+
export declare const meta: import("../../canvasKit/meta").PhoneMeta<DecimalInputProps, "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityHint" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "maxFontSizeMultiplier" | "textAlign" | "textAlignVertical" | "verticalAlign" | "numberOfLines" | "allowFontScaling" | "lineBreakStrategyIOS" | "selectionColor" | "textBreakStrategy" | "selection" | "scrollEnabled" | "defaultValue" | "returnKeyType" | "submitBehavior" | "autoCapitalize" | "autoComplete" | "autoCorrect" | "autoFocus" | "blurOnSubmit" | "caretHidden" | "contextMenuHidden" | "editable" | "inputMode" | "placeholderTextColor" | "enterKeyHint" | "selectTextOnFocus" | "inputAccessoryViewID" | "inputAccessoryViewButtonLabel" | "disableKeyboardShortcuts" | "clearButtonMode" | "clearTextOnFocus" | "dataDetectorTypes" | "enablesReturnKeyAutomatically" | "keyboardAppearance" | "passwordRules" | "rejectResponderTermination" | "selectionState" | "spellCheck" | "textContentType" | "lineBreakModeIOS" | "smartInsertDelete" | "cursorColor" | "selectionHandleColor" | "importantForAutofill" | "disableFullscreenUI" | "inlineImageLeft" | "inlineImagePadding" | "returnKeyLabel" | "underlineColorAndroid" | "showSoftInputOnFocus", never>;
|
|
3
3
|
//# sourceMappingURL=DecimalInput.meta.d.ts.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { EmptyStateProps } from "./EmptyState";
|
|
2
|
-
export declare const meta: import("../../canvasKit/meta").PhoneMeta<EmptyStateProps,
|
|
2
|
+
export declare const meta: import("../../canvasKit/meta").PhoneMeta<EmptyStateProps, never, never>;
|
|
3
3
|
//# sourceMappingURL=EmptyState.meta.d.ts.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { InputProps } from "./Input";
|
|
2
|
-
export declare const meta: import("../../canvasKit/meta").PhoneMeta<InputProps, "
|
|
2
|
+
export declare const meta: import("../../canvasKit/meta").PhoneMeta<InputProps, "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityHint" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "maxFontSizeMultiplier" | "textAlign" | "textAlignVertical" | "verticalAlign" | "numberOfLines" | "allowFontScaling" | "lineBreakStrategyIOS" | "selectionColor" | "textBreakStrategy" | "selection" | "scrollEnabled" | "defaultValue" | "submitBehavior" | "autoComplete" | "autoCorrect" | "autoFocus" | "blurOnSubmit" | "caretHidden" | "contextMenuHidden" | "inputMode" | "placeholderTextColor" | "enterKeyHint" | "selectTextOnFocus" | "inputAccessoryViewID" | "inputAccessoryViewButtonLabel" | "disableKeyboardShortcuts" | "clearButtonMode" | "clearTextOnFocus" | "dataDetectorTypes" | "enablesReturnKeyAutomatically" | "keyboardAppearance" | "passwordRules" | "rejectResponderTermination" | "selectionState" | "spellCheck" | "textContentType" | "lineBreakModeIOS" | "smartInsertDelete" | "cursorColor" | "selectionHandleColor" | "importantForAutofill" | "disableFullscreenUI" | "inlineImageLeft" | "inlineImagePadding" | "returnKeyLabel" | "underlineColorAndroid" | "showSoftInputOnFocus" | "leftIcon" | "rightIcon" | "action", never>;
|
|
3
3
|
//# sourceMappingURL=Input.meta.d.ts.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { RadioProps } from "./Radio";
|
|
2
|
-
export declare const meta: import("../../canvasKit/meta").PhoneMeta<RadioProps, "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "
|
|
2
|
+
export declare const meta: import("../../canvasKit/meta").PhoneMeta<RadioProps, "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "pressRetentionOffset" | "haptic" | "delayLongPress" | "cancelable" | "delayHoverIn" | "delayHoverOut" | "android_disableSound" | "android_ripple" | "testOnly_pressed" | "unstable_pressDelay", never>;
|
|
3
3
|
//# sourceMappingURL=Radio.meta.d.ts.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { SearchBarProps } from "./SearchBar";
|
|
2
|
-
export declare const meta: import("../../canvasKit/meta").PhoneMeta<Pick<SearchBarProps, "disabled" | "size" | "
|
|
2
|
+
export declare const meta: import("../../canvasKit/meta").PhoneMeta<Pick<SearchBarProps, "disabled" | "size" | "accessibilityLabel" | "value" | "label" | "borderRadius" | "variant" | "placeholder" | "haptic" | "autoFocus" | "leftIcon" | "labelMode" | "scope" | "scopes" | "recents" | "suggestions" | "debounceMs" | "recentsTitle" | "maxRecents" | "maxSuggestions">, "haptic", never>;
|
|
3
3
|
//# sourceMappingURL=SearchBar.meta.d.ts.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { SwitchProps } from "./Switch";
|
|
2
|
-
export declare const meta: import("../../canvasKit/meta").PhoneMeta<SwitchProps, "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityHint" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "
|
|
2
|
+
export declare const meta: import("../../canvasKit/meta").PhoneMeta<SwitchProps, "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "pointerEvents" | "removeClippedSubviews" | "nativeID" | "collapsable" | "collapsableChildren" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "accessible" | "accessibilityActions" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityHint" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "pressRetentionOffset" | "haptic" | "delayLongPress" | "cancelable" | "delayHoverIn" | "delayHoverOut" | "android_disableSound" | "android_ripple" | "testOnly_pressed" | "unstable_pressDelay", never>;
|
|
3
3
|
//# sourceMappingURL=Switch.meta.d.ts.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { TextProps } from "./Text";
|
|
2
|
-
export declare const meta: import("../../canvasKit/meta").PhoneMeta<TextProps, "disabled" | "
|
|
2
|
+
export declare const meta: import("../../canvasKit/meta").PhoneMeta<TextProps, "disabled" | "id" | "pointerEvents" | "nativeID" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityHint" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "maxFontSizeMultiplier" | "allowFontScaling" | "ellipsizeMode" | "lineBreakMode" | "minimumFontScale" | "pressRetentionOffset" | "adjustsFontSizeToFit" | "dynamicTypeRamp" | "suppressHighlighting" | "lineBreakStrategyIOS" | "selectable" | "selectionColor" | "textBreakStrategy" | "dataDetectorType" | "android_hyphenationFrequency", never>;
|
|
3
3
|
//# sourceMappingURL=Text.meta.d.ts.map
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
export { PHONE_CHROME_INSETS } from "./canvasKit";
|
|
1
2
|
export * from "./components";
|
|
2
3
|
export type { AppIconName, AppIconProps, AppIconSize, CuratedIconName, IconName, IconsaxShadowedName, IconVariant, SlotIcon, SlotIconRef, SlotIconState, SlotNode, } from "./components/AppIcon";
|
|
3
4
|
export { APP_ICON_SIZES, AppIcon, CURATED_ICON_NAMES, defaultIcons, ICON_NAMES, ICONSAX_SUFFIX, renderSlotIcon, } from "./components/AppIcon";
|
|
@@ -5,12 +6,10 @@ export type { FieldArrayApi, FieldInputProps, FieldRules, FieldState, FocusableN
|
|
|
5
6
|
export { deletePath, Form, getPath, HookFormField, isFieldFilled, rules, setPath, useField, useFieldArray, useForm, useFormCompletion, useFormContext, useHookFormField, useOptionalFormContext, } from "./form";
|
|
6
7
|
export type { FieldChain, FieldChainProps, MotionDurationKey, PresenceMotion, PressAnimationPreset, ScrollDirection, UseControllableStateOptions, UsePressAnimationOptions, UsePressAnimationResult, UseRefreshControlLabels, UseRefreshControlOptions, UseRefreshControlResult, UseScrollDirectionOptions, UseScrollDirectionResult, UseToggleResult, } from "./hooks";
|
|
7
8
|
export { FLICK_TOLERANCE, PRESENCE_REDUCE_MOTION, PRESS_ANIMATION_PRESETS, useControllableState, useDebounce, useFieldChain, useFlickGuard, usePresenceMotion, usePressAnimation, useReducedMotion, useRefreshControl, useScrollDirection, useToggle, } from "./hooks";
|
|
8
|
-
export type { InitUIOptions } from "./initUI";
|
|
9
|
-
export { initUI } from "./initUI";
|
|
10
9
|
export type { NetworkStatusBannerProps } from "./network";
|
|
11
10
|
export { NetworkStatusBanner } from "./network";
|
|
12
11
|
export type { BrandOverrides, ColorMode, ColorName, ColorSchemePreference, ComponentName, ComponentSettings, ComponentSizeTokens, ComponentTokens, DurationName, EaseName, FieldVariant, FontFaces, FontName, FontWeightValue, GradientDefinition, GradientScale, IconRegistry, IconRenderer, LeadingName, LetterSpacingName, PhoneShadow, RadiusName, Resolved, ShadowName, SizeName, SpaceName, Spring, SpringScale, TextName, TextVariantSpec, Theme, ThemeProviderProps, ThemeSettings, TokenSet, WeightName, } from "./theme";
|
|
13
|
-
export { COLOR_NAMES, DURATION_NAMES, darkTheme, EASE_NAMES, FONT_NAMES,
|
|
12
|
+
export { COLOR_NAMES, DURATION_NAMES, darkTheme, EASE_NAMES, FONT_NAMES, LEADING_NAMES, LETTER_SPACING_NAMES, lightTheme, mergeBrand, RADIUS_NAMES, radiusOf, resolveBadgeSize, resolveButtonSize, resolveCheckboxSize, resolveChipSize, resolveEmptyStateSize, resolveFieldSize, resolveFloatingActionButtonSize, resolveListItemSize, resolveOtpInputSize, resolveRadioSize, resolveSegmentedControlSize, resolveSliderSize, resolveSwitchSize, resolveTabsSize, SHADOW_NAMES, SIZE_NAMES, SPACE_NAMES, spaceOf, TEXT_NAMES, ThemeProvider, textOf, useTheme, useThemeMode, WEIGHT_NAMES, } from "./theme";
|
|
14
13
|
export type { AnnounceOptions, BreakpointKey, FeedbackIntent, HapticType, ResponsiveScales, ScreenInfo, SquirclePathParams, } from "./utils";
|
|
15
14
|
export { announce, Breakpoints, configureFeedback, feedback, hapticForIntent, isFeedbackEnabled, isScreenSize, isTablet, Responsive, ScreenDimensions, SQUIRCLE_MIN_RADIUS, SQUIRCLE_SMOOTHING, setHapticImplementation, shadowStyle, smoothCorners, squircleApplies, squircleHostRadius, squirclePath, triggerHaptic, useScreenDimensions, warnUnknownProps, } from "./utils";
|
|
16
15
|
//# sourceMappingURL=index.d.ts.map
|