@toss/tds-react-native 1.3.3 → 1.3.5

package/dist/cjs/components/segmented-control/components/Indicator/Indicator.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Indicator=Indicator;const jsx_runtime_1=require("react/jsx-runtime"),tds_easings_1=require("@toss/tds-easings"),react_1=require("react"),react_native_1=require("react-native"),index_js_1=require("../../../../core/index.js"),AlignmentContext_js_1=require("../../contexts/AlignmentContext.js"),IndicatorContext_js_1=require("../../contexts/IndicatorContext.js"),RadioContext_js_1=require("../../contexts/RadioContext.js"),useIndicatorBackground_js_1=require("../../hooks/useIndicatorBackground.js"),useIndicatorStyle_js_1=require("./useIndicatorStyle.js");function Indicator({style:s,children:a}){const{indicatorX:c,setIndicatorX:n,indicatorWidth:d,setIndicatorWidth:r}=(0,react_1.useContext)(IndicatorContext_js_1.IndicatorContext),{selectedElementLayout:t}=(0,react_1.useContext)(RadioContext_js_1.RadioContext),{indicatorStyle:u}=(0,useIndicatorStyle_js_1.useIndicatorStyle)(),{colorPreference:l}=(0,index_js_1.useColorPreference)(),{alignment:g}=(0,react_1.useContext)(AlignmentContext_js_1.AlignmentContext),x=(0,useIndicatorBackground_js_1.useIndicatorBackground)(),o=(0,react_1.useRef)(!0),i=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,e=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,h=e.interpolate({inputRange:[0,1],outputRange:[c,t?.x??0]}),_=e.interpolate({inputRange:[0,1],outputRange:[d,t?.width??0]});(0,react_1.useEffect)(()=>{t!=null&&(o.current===!0?(r(t.width),n(t.x),o.current=!1,react_native_1.Animated.spring(i,{toValue:1,useNativeDriver:!1,...tds_easings_1.spring.quick}).start()):(e.setValue(0),react_native_1.Animated.spring(e,{toValue:1,useNativeDriver:!1,...tds_easings_1.spring.quick}).start(()=>{n(t.x),r(t.width)})))},[t,i,e,r,n]);const f={zIndex:0,top:g==="fluid"?0:void 0,height:t?.height,backgroundColor:x,width:_,opacity:i,transform:[{translateX:h}]};return(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[u,f,{shadowColor:l==="light"?"rgba(0, 0, 0, 0.09)":"rgba(1, 1, 1, 0.09)",shadowOffset:{width:0,height:0},shadowOpacity:1,shadowRadius:2},s],children:a})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Indicator=Indicator;const jsx_runtime_1=require("react/jsx-runtime"),tds_easings_1=require("@toss/tds-easings"),react_1=require("react"),react_native_1=require("react-native"),core_1=require("../../../../core"),AlignmentContext_1=require("../../contexts/AlignmentContext"),IndicatorContext_1=require("../../contexts/IndicatorContext"),RadioContext_1=require("../../contexts/RadioContext"),useIndicatorBackground_1=require("../../hooks/useIndicatorBackground"),useIndicatorStyle_1=require("./useIndicatorStyle");function Indicator({style:s,children:a}){const{indicatorX:c,setIndicatorX:n,indicatorWidth:d,setIndicatorWidth:r}=(0,react_1.useContext)(IndicatorContext_1.IndicatorContext),{selectedElementLayout:t}=(0,react_1.useContext)(RadioContext_1.RadioContext),{indicatorStyle:u}=(0,useIndicatorStyle_1.useIndicatorStyle)(),{colorPreference:l}=(0,core_1.useColorPreference)(),{alignment:g}=(0,react_1.useContext)(AlignmentContext_1.AlignmentContext),x=(0,useIndicatorBackground_1.useIndicatorBackground)(),i=(0,react_1.useRef)(!0),o=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,e=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,h=e.interpolate({inputRange:[0,1],outputRange:[c,t?.x??0]}),f=e.interpolate({inputRange:[0,1],outputRange:[d,t?.width??0]});(0,react_1.useEffect)(()=>{t!=null&&(i.current===!0?(r(t.width),n(t.x),i.current=!1,react_native_1.Animated.spring(o,{toValue:1,useNativeDriver:!1,...tds_easings_1.spring.quick}).start()):(e.setValue(0),react_native_1.Animated.spring(e,{toValue:1,useNativeDriver:!1,...tds_easings_1.spring.quick}).start(()=>{n(t.x),r(t.width)})))},[t,o,e,r,n]);const p={zIndex:0,top:g==="fluid"?0:void 0,height:t?.height,backgroundColor:x,width:f,opacity:o,transform:[{translateX:h}]};return(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[u,p,{shadowColor:l==="light"?"rgba(0, 0, 0, 0.09)":"rgba(1, 1, 1, 0.09)",shadowOffset:{width:0,height:0},shadowOpacity:1,shadowRadius:2},s],children:a})}

package/dist/cjs/components/segmented-control/components/Indicator/index.d.ts

@@ -1 +1 @@
-export * from './Indicator.js';
+export * from './Indicator';

package/dist/cjs/components/segmented-control/components/Indicator/index.js

@@ -1 +1 @@
-"use strict";var __createBinding=Object.create?function(i,t,e,r){r===void 0&&(r=e);var n=Object.getOwnPropertyDescriptor(t,e);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(i,r,n)}:function(i,t,e,r){r===void 0&&(r=e),i[r]=t[e]},__exportStar=function(i,t){for(var e in i)e!=="default"&&!Object.prototype.hasOwnProperty.call(t,e)&&__createBinding(t,i,e)};Object.defineProperty(exports,"__esModule",{value:!0}),__exportStar(require("./Indicator.js"),exports);
+"use strict";var __createBinding=Object.create?function(i,t,e,r){r===void 0&&(r=e);var n=Object.getOwnPropertyDescriptor(t,e);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(i,r,n)}:function(i,t,e,r){r===void 0&&(r=e),i[r]=t[e]},__exportStar=function(i,t){for(var e in i)e!=="default"&&!Object.prototype.hasOwnProperty.call(t,e)&&__createBinding(t,i,e)};Object.defineProperty(exports,"__esModule",{value:!0}),__exportStar(require("./Indicator"),exports);

package/dist/cjs/components/segmented-control/components/Indicator/useIndicatorStyle.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useIndicatorStyle=useIndicatorStyle;const react_1=require("react"),react_native_1=require("react-native"),SizeContext_js_1=require("../../contexts/SizeContext.js"),indicatorStyleBase={position:"absolute",zIndex:0,left:0},indicatorStyleSmall={top:3,bottom:3,borderRadius:8},indicatorStyleLarge={top:4,bottom:4,borderRadius:10};function useIndicatorStyle(){const t=(0,react_1.useContext)(SizeContext_js_1.SizeContext)==="small"?indicatorStyleSmall:indicatorStyleLarge;return{indicatorStyle:react_native_1.StyleSheet.compose(indicatorStyleBase,t)}}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useIndicatorStyle=useIndicatorStyle;const react_1=require("react"),react_native_1=require("react-native"),SizeContext_1=require("../../contexts/SizeContext"),indicatorStyleBase={position:"absolute",zIndex:0,left:0},indicatorStyleSmall={top:3,bottom:3,borderRadius:8},indicatorStyleLarge={top:4,bottom:4,borderRadius:10};function useIndicatorStyle(){const t=(0,react_1.useContext)(SizeContext_1.SizeContext)==="small"?indicatorStyleSmall:indicatorStyleLarge;return{indicatorStyle:react_native_1.StyleSheet.compose(indicatorStyleBase,t)}}

package/dist/cjs/components/segmented-control/components/Item/Item.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Item=Item;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),index_js_1=require("../../../../core/index.js"),index_js_2=require("../../../../extensions/prevent-font-scaling/index.js"),index_js_3=require("../../../../interactions/pressable-effect/index.js"),index_js_4=require("../../../paragraph/index.js"),AlignmentContext_js_1=require("../../contexts/AlignmentContext.js"),RadioContext_js_1=require("../../contexts/RadioContext.js"),useItemStyle_js_1=require("./useItemStyle.js");function Item({style:d,children:x,value:s,disabled:y=!1,size:j,..._}){const{ensureFluidAlignment:m}=(0,react_1.useContext)(AlignmentContext_js_1.AlignmentContext),[n,f]=(0,react_1.useState)(null),{setSelectedValue:c,selectedValue:b,setSelectedElementLayout:i,disabled:g}=(0,react_1.useContext)(RadioContext_js_1.RadioContext),t=g||y,o=(0,useItemStyle_js_1.useItemStyle)({size:j,disabled:t}),r=(0,index_js_1.useAdaptive)(),e=b===s,p=(0,react_1.useCallback)(()=>{c(s)},[s,c]),a=(0,react_1.useCallback)(()=>{n!=null&&i(n)},[n,i]);return(0,react_1.useEffect)(()=>{e&&a()},[e,a]),(0,jsx_runtime_1.jsx)(index_js_3.PressableEffect,{onPress:t||e?void 0:p,onLayout:l=>{const u=l.nativeEvent.layout;f(u),e&&i(u)},style:[o.containerStyle,d],accessibilityRole:"radio",accessibilityValue:{text:s},accessibilityState:{selected:e,disabled:t},disabled:t,..._,children:(0,jsx_runtime_1.jsx)(react_native_1.View,{style:{justifyContent:"center",alignItems:"center"},children:(0,jsx_runtime_1.jsx)(index_js_2.PreventFontScaling,{limit:140,children:(0,jsx_runtime_1.jsx)(index_js_4.Root,{typography:o.labelTypography,style:o.labelStyle,onTextLayout:l=>{m(l.nativeEvent.lines.length>1)},children:(0,jsx_runtime_1.jsx)(index_js_4.Text,{color:t?r.grey400:e?r.grey800:r.grey600,fontWeight:e?"semiBold":"medium",children:x})})})})})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Item=Item;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),core_1=require("../../../../core"),prevent_font_scaling_1=require("../../../../extensions/prevent-font-scaling"),pressable_effect_1=require("../../../../interactions/pressable-effect"),paragraph_1=require("../../../paragraph"),AlignmentContext_1=require("../../contexts/AlignmentContext"),RadioContext_1=require("../../contexts/RadioContext"),useItemStyle_1=require("./useItemStyle");function Item({style:d,children:y,value:n,disabled:x=!1,size:f,...p}){const{ensureFluidAlignment:g}=(0,react_1.useContext)(AlignmentContext_1.AlignmentContext),[s,m]=(0,react_1.useState)(null),{setSelectedValue:a,selectedValue:_,setSelectedElementLayout:i,disabled:b}=(0,react_1.useContext)(RadioContext_1.RadioContext),t=b||x,o=(0,useItemStyle_1.useItemStyle)({size:f,disabled:t}),r=(0,core_1.useAdaptive)(),e=_===n,h=(0,react_1.useCallback)(()=>{a(n)},[n,a]),c=(0,react_1.useCallback)(()=>{s!=null&&i(s)},[s,i]);return(0,react_1.useEffect)(()=>{e&&c()},[e,c]),(0,jsx_runtime_1.jsx)(pressable_effect_1.PressableEffect,{onPress:t||e?void 0:h,onLayout:l=>{const u=l.nativeEvent.layout;m(u),e&&i(u)},style:[o.containerStyle,d],accessibilityRole:"radio",accessibilityValue:{text:n},accessibilityState:{selected:e,disabled:t},disabled:t,...p,children:(0,jsx_runtime_1.jsx)(react_native_1.View,{style:{justifyContent:"center",alignItems:"center"},children:(0,jsx_runtime_1.jsx)(prevent_font_scaling_1.PreventFontScaling,{limit:140,children:(0,jsx_runtime_1.jsx)(paragraph_1.Root,{typography:o.labelTypography,style:o.labelStyle,onTextLayout:l=>{g(l.nativeEvent.lines.length>1)},children:(0,jsx_runtime_1.jsx)(paragraph_1.Text,{color:t?r.grey400:e?r.grey800:r.grey600,fontWeight:e?"semiBold":"medium",children:y})})})})})}

package/dist/cjs/components/segmented-control/components/Item/index.d.ts

@@ -1 +1 @@
-export * from './Item.js';
+export * from './Item';

package/dist/cjs/components/segmented-control/components/Item/index.js

@@ -1 +1 @@
-"use strict";var __createBinding=Object.create?function(i,t,e,r){r===void 0&&(r=e);var n=Object.getOwnPropertyDescriptor(t,e);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(i,r,n)}:function(i,t,e,r){r===void 0&&(r=e),i[r]=t[e]},__exportStar=function(i,t){for(var e in i)e!=="default"&&!Object.prototype.hasOwnProperty.call(t,e)&&__createBinding(t,i,e)};Object.defineProperty(exports,"__esModule",{value:!0}),__exportStar(require("./Item.js"),exports);
+"use strict";var __createBinding=Object.create?function(i,t,e,r){r===void 0&&(r=e);var n=Object.getOwnPropertyDescriptor(t,e);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(i,r,n)}:function(i,t,e,r){r===void 0&&(r=e),i[r]=t[e]},__exportStar=function(i,t){for(var e in i)e!=="default"&&!Object.prototype.hasOwnProperty.call(t,e)&&__createBinding(t,i,e)};Object.defineProperty(exports,"__esModule",{value:!0}),__exportStar(require("./Item"),exports);

package/dist/cjs/components/segmented-control/components/Item/useItemStyle.d.ts

@@ -1,5 +1,5 @@
 import type { ViewProps } from 'react-native';
-import type { ItemProps } from './Item.js';
+import type { ItemProps } from './Item';
 interface ItemStyles {
     containerStyle: ViewProps['style'];
     labelStyle: ViewProps['style'];

package/dist/cjs/components/segmented-control/components/Item/useItemStyle.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useItemStyle=useItemStyle;const react_1=require("react"),react_native_1=require("react-native"),AlignmentContext_js_1=require("../../contexts/AlignmentContext.js"),SizeContext_js_1=require("../../contexts/SizeContext.js"),containerStyle={zIndex:1,overflow:"hidden",borderRadius:12},containerStyleFixed={flex:1},containerStyleFluid={flexGrow:0,flexShrink:0,flexBasis:"auto"},labelStyleFixed={display:"flex",alignItems:"center",justifyContent:"center"},labelStyleSmall={paddingVertical:5,paddingHorizontal:14},labelStyleLarge={paddingVertical:7,paddingHorizontal:14};function useItemStyle(l){const o=(0,react_1.useContext)(SizeContext_js_1.SizeContext),{alignment:e}=(0,react_1.useContext)(AlignmentContext_js_1.AlignmentContext),t=l.size??o,n=t==="small"?labelStyleSmall:labelStyleLarge;return{containerStyle:react_native_1.StyleSheet.compose(containerStyle,e==="fixed"?containerStyleFixed:containerStyleFluid),labelStyle:e==="fixed"?react_native_1.StyleSheet.compose(labelStyleFixed,n):n,labelTypography:t==="small"?"t6":"t5"}}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useItemStyle=useItemStyle;const react_1=require("react"),react_native_1=require("react-native"),AlignmentContext_1=require("../../contexts/AlignmentContext"),SizeContext_1=require("../../contexts/SizeContext"),containerStyle={zIndex:1,overflow:"hidden",borderRadius:12},containerStyleFixed={flex:1},containerStyleFluid={flexGrow:0,flexShrink:0,flexBasis:"auto"},labelStyleFixed={display:"flex",alignItems:"center",justifyContent:"center"},labelStyleSmall={paddingVertical:5,paddingHorizontal:14},labelStyleLarge={paddingVertical:7,paddingHorizontal:14};function useItemStyle(l){const o=(0,react_1.useContext)(SizeContext_1.SizeContext),{alignment:e}=(0,react_1.useContext)(AlignmentContext_1.AlignmentContext),t=l.size??o,n=t==="small"?labelStyleSmall:labelStyleLarge;return{containerStyle:react_native_1.StyleSheet.compose(containerStyle,e==="fixed"?containerStyleFixed:containerStyleFluid),labelStyle:e==="fixed"?react_native_1.StyleSheet.compose(labelStyleFixed,n):n,labelTypography:t==="small"?"t6":"t5"}}

package/dist/cjs/components/segmented-control/components/ItemGroup/ItemGroup.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ItemGroup=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),index_js_1=require("../../../../core/index.js"),AlignmentContext_js_1=require("../../contexts/AlignmentContext.js"),RadioContext_js_1=require("../../contexts/RadioContext.js"),ScrollContext_js_1=require("../../contexts/ScrollContext.js"),useItemGroupStyle_js_1=require("./useItemGroupStyle.js");exports.ItemGroup=(0,react_1.forwardRef)(function({style:n,children:o},s){const{ref:e,scrollHandlers:c}=(0,react_1.useContext)(ScrollContext_js_1.ScrollContext),{selectedElementLayout:t}=(0,react_1.useContext)(RadioContext_js_1.RadioContext),{alignment:l}=(0,react_1.useContext)(AlignmentContext_js_1.AlignmentContext),i=(0,index_js_1.useAdaptive)(),u=(0,useItemGroupStyle_js_1.useItemGroupStyle)();return(0,react_1.useEffect)(()=>{if(e!=null&&e.current&&t){const r=Math.max(0,t.x-t.width/2);e.current.scrollTo({x:r,animated:!0})}},[e,t]),(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[u.containerStyle,{backgroundColor:i.greyOpacity100},n],accessibilityRole:"radiogroup",ref:s,children:l==="fluid"?(0,jsx_runtime_1.jsx)(react_native_1.Animated.ScrollView,{scrollEventThrottle:16,onScroll:r=>{c.forEach(a=>{a(r)})},ref:e,horizontal:!0,showsHorizontalScrollIndicator:!1,alwaysBounceVertical:!1,children:o}):o})});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ItemGroup=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),core_1=require("../../../../core"),AlignmentContext_1=require("../../contexts/AlignmentContext"),RadioContext_1=require("../../contexts/RadioContext"),ScrollContext_1=require("../../contexts/ScrollContext"),useItemGroupStyle_1=require("./useItemGroupStyle");exports.ItemGroup=(0,react_1.forwardRef)(function({style:n,children:o},c){const{ref:e,scrollHandlers:s}=(0,react_1.useContext)(ScrollContext_1.ScrollContext),{selectedElementLayout:t}=(0,react_1.useContext)(RadioContext_1.RadioContext),{alignment:l}=(0,react_1.useContext)(AlignmentContext_1.AlignmentContext),i=(0,core_1.useAdaptive)(),u=(0,useItemGroupStyle_1.useItemGroupStyle)();return(0,react_1.useEffect)(()=>{if(e!=null&&e.current&&t){const r=Math.max(0,t.x-t.width/2);e.current.scrollTo({x:r,animated:!0})}},[e,t]),(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[u.containerStyle,{backgroundColor:i.greyOpacity100},n],accessibilityRole:"radiogroup",ref:c,children:l==="fluid"?(0,jsx_runtime_1.jsx)(react_native_1.Animated.ScrollView,{scrollEventThrottle:16,onScroll:r=>{s.forEach(a=>{a(r)})},ref:e,horizontal:!0,showsHorizontalScrollIndicator:!1,alwaysBounceVertical:!1,children:o}):o})});

package/dist/cjs/components/segmented-control/components/ItemGroup/index.d.ts

@@ -1 +1 @@
-export * from './ItemGroup.js';
+export * from './ItemGroup';

package/dist/cjs/components/segmented-control/components/ItemGroup/index.js

@@ -1 +1 @@
-"use strict";var __createBinding=Object.create?function(i,t,e,r){r===void 0&&(r=e);var n=Object.getOwnPropertyDescriptor(t,e);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(i,r,n)}:function(i,t,e,r){r===void 0&&(r=e),i[r]=t[e]},__exportStar=function(i,t){for(var e in i)e!=="default"&&!Object.prototype.hasOwnProperty.call(t,e)&&__createBinding(t,i,e)};Object.defineProperty(exports,"__esModule",{value:!0}),__exportStar(require("./ItemGroup.js"),exports);
+"use strict";var __createBinding=Object.create?function(i,t,e,r){r===void 0&&(r=e);var n=Object.getOwnPropertyDescriptor(t,e);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(i,r,n)}:function(i,t,e,r){r===void 0&&(r=e),i[r]=t[e]},__exportStar=function(i,t){for(var e in i)e!=="default"&&!Object.prototype.hasOwnProperty.call(t,e)&&__createBinding(t,i,e)};Object.defineProperty(exports,"__esModule",{value:!0}),__exportStar(require("./ItemGroup"),exports);

package/dist/cjs/components/segmented-control/components/ItemGroup/useItemGroupStyle.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useItemGroupStyle=useItemGroupStyle;const react_1=require("react"),react_native_1=require("react-native"),AlignmentContext_js_1=require("../../contexts/AlignmentContext.js"),SizeContext_js_1=require("../../contexts/SizeContext.js"),containerStyleBase={position:"relative",width:"100%",display:"flex",flexDirection:"row",alignItems:"flex-start",alignSelf:"flex-start",justifyContent:"flex-start"},containerStyleSmall={padding:3,borderRadius:10},containerStyleLarge={paddingHorizontal:5,paddingVertical:4,borderRadius:15},containerStyleFixed={flexWrap:"nowrap"};function useItemGroupStyle(){const{alignment:t}=(0,react_1.useContext)(AlignmentContext_js_1.AlignmentContext),e=(0,react_1.useContext)(SizeContext_js_1.SizeContext)==="small"?containerStyleSmall:containerStyleLarge;return{containerStyle:t==="fixed"?react_native_1.StyleSheet.compose(containerStyleBase,react_native_1.StyleSheet.compose(e,containerStyleFixed)):react_native_1.StyleSheet.compose(containerStyleBase,e)}}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useItemGroupStyle=useItemGroupStyle;const react_1=require("react"),react_native_1=require("react-native"),AlignmentContext_1=require("../../contexts/AlignmentContext"),SizeContext_1=require("../../contexts/SizeContext"),containerStyleBase={position:"relative",width:"100%",display:"flex",flexDirection:"row",alignItems:"flex-start",alignSelf:"flex-start",justifyContent:"flex-start"},containerStyleSmall={padding:3,borderRadius:10},containerStyleLarge={paddingHorizontal:5,paddingVertical:4,borderRadius:15},containerStyleFixed={flexWrap:"nowrap"};function useItemGroupStyle(){const{alignment:t}=(0,react_1.useContext)(AlignmentContext_1.AlignmentContext),e=(0,react_1.useContext)(SizeContext_1.SizeContext)==="small"?containerStyleSmall:containerStyleLarge;return{containerStyle:t==="fixed"?react_native_1.StyleSheet.compose(containerStyleBase,react_native_1.StyleSheet.compose(e,containerStyleFixed)):react_native_1.StyleSheet.compose(containerStyleBase,e)}}

package/dist/cjs/components/segmented-control/components/Root.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RootBase=RootBase;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),AlignmentContext_js_1=require("../contexts/AlignmentContext.js"),IndicatorContext_js_1=require("../contexts/IndicatorContext.js"),RadioContext_js_1=require("../contexts/RadioContext.js"),ScrollContext_js_1=require("../contexts/ScrollContext.js"),SizeContext_js_1=require("../contexts/SizeContext.js"),index_js_1=require("./Indicator/index.js"),index_js_2=require("./ItemGroup/index.js"),ScrollControlOverlay_js_1=require("./ScrollControlOverlay/ScrollControlOverlay.js");function RootBase({value:e,defaultValue:t,indicator:o=(0,jsx_runtime_1.jsx)(index_js_1.Indicator,{}),previousButton:v,gradation:f,controller:i=(0,jsx_runtime_1.jsx)(ScrollControlOverlay_js_1.ScrollControlOverlay,{}),size:s="large",alignment:l="fixed",disabled:c=!1,onChange:a,style:d,children:u,...x}){const[r,j]=(0,react_1.useState)(l),_=(0,react_1.useCallback)(n=>{j(C=>C==="fluid"||n?"fluid":"fixed")},[]);return(0,jsx_runtime_1.jsx)(AlignmentContext_js_1.AlignmentContext.Provider,{value:{alignment:r,ensureFluidAlignment:_},children:(0,jsx_runtime_1.jsx)(SizeContext_js_1.SizeContext.Provider,{value:s,children:(0,jsx_runtime_1.jsx)(ScrollContext_js_1.ScrollContextProvider,{children:(0,jsx_runtime_1.jsx)(RadioContext_js_1.RadioContextProvider,{selectedValue:e,setSelectedValue:n=>{a?.(n)},disabled:c,name:x.name,children:(0,jsx_runtime_1.jsx)(IndicatorContext_js_1.IndicatorContextProvider,{children:(0,jsx_runtime_1.jsx)(Wrapper,{style:d,children:(0,jsx_runtime_1.jsxs)(Container,{children:[(0,jsx_runtime_1.jsxs)(index_js_2.ItemGroup,{children:[u,o]}),r==="fluid"?i:void 0]})})})})})})})}function Wrapper({style:e,...t}){return(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[{position:"relative",width:"100%",paddingHorizontal:24},e],...t})}function Container({style:e,...t}){return(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[{position:"relative",width:"100%"},e],...t})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RootBase=RootBase;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),AlignmentContext_1=require("../contexts/AlignmentContext"),IndicatorContext_1=require("../contexts/IndicatorContext"),RadioContext_1=require("../contexts/RadioContext"),ScrollContext_1=require("../contexts/ScrollContext"),SizeContext_1=require("../contexts/SizeContext"),Indicator_1=require("./Indicator"),ItemGroup_1=require("./ItemGroup"),ScrollControlOverlay_1=require("./ScrollControlOverlay/ScrollControlOverlay");function RootBase({value:e,defaultValue:t,indicator:o=(0,jsx_runtime_1.jsx)(Indicator_1.Indicator,{}),previousButton:_,gradation:m,controller:i=(0,jsx_runtime_1.jsx)(ScrollControlOverlay_1.ScrollControlOverlay,{}),size:l="large",alignment:s="fixed",disabled:c=!1,onChange:a,style:d,children:u,...x}){const[n,C]=(0,react_1.useState)(s),v=(0,react_1.useCallback)(r=>{C(j=>j==="fluid"||r?"fluid":"fixed")},[]);return(0,jsx_runtime_1.jsx)(AlignmentContext_1.AlignmentContext.Provider,{value:{alignment:n,ensureFluidAlignment:v},children:(0,jsx_runtime_1.jsx)(SizeContext_1.SizeContext.Provider,{value:l,children:(0,jsx_runtime_1.jsx)(ScrollContext_1.ScrollContextProvider,{children:(0,jsx_runtime_1.jsx)(RadioContext_1.RadioContextProvider,{selectedValue:e,setSelectedValue:r=>{a?.(r)},disabled:c,name:x.name,children:(0,jsx_runtime_1.jsx)(IndicatorContext_1.IndicatorContextProvider,{children:(0,jsx_runtime_1.jsx)(Wrapper,{style:d,children:(0,jsx_runtime_1.jsxs)(Container,{children:[(0,jsx_runtime_1.jsxs)(ItemGroup_1.ItemGroup,{children:[u,o]}),n==="fluid"?i:void 0]})})})})})})})}function Wrapper({style:e,...t}){return(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[{position:"relative",width:"100%",paddingHorizontal:24},e],...t})}function Container({style:e,...t}){return(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[{position:"relative",width:"100%"},e],...t})}

package/dist/cjs/components/segmented-control/components/ScrollControlOverlay/EdgeGradient.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LeftEdgeGradient=LeftEdgeGradient,exports.RightEdgeGradient=RightEdgeGradient;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),tds_colors_1=require("@toss/tds-colors"),react_1=require("react"),react_native_1=require("react-native"),index_js_1=require("../../../../core/index.js"),spring_js_1=require("../../constants/spring.js"),LEFT_GRADIENT_ID="segmented-left-gradient";function useFadeAnimation(){const e=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,t=(0,react_1.useCallback)(()=>{react_native_1.Animated.spring(e,{toValue:1,useNativeDriver:!0,...spring_js_1.SPRING_OPTION}).start()},[e]),r=(0,react_1.useCallback)(()=>{react_native_1.Animated.spring(e,{toValue:0,useNativeDriver:!0,...spring_js_1.SPRING_OPTION}).start()},[e]);return{fadeIn:t,fadeOut:r,style:{opacity:e}}}function LeftEdgeGradient({style:e,exiting:t,...r}){const i=(0,index_js_1.useAdaptive)(),{colorPreference:n}=(0,index_js_1.useColorPreference)(),{fadeIn:s,fadeOut:o,style:a}=useFadeAnimation();return(0,react_1.useEffect)(()=>{t?s():o()},[t,s,o]),(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[gradientStyleBase,leftGradientStyle,e,a],...r,children:(0,jsx_runtime_1.jsxs)(react_native_svg_1.Svg,{width:"100%",height:"100%",pointerEvents:"none",children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Defs,{children:(0,jsx_runtime_1.jsxs)(react_native_svg_1.LinearGradient,{id:LEFT_GRADIENT_ID,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:0,stopColor:i.grey100}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:1,stopColor:n==="light"?tds_colors_1.colors.grey100:tds_colors_1.colors.inverseGrey100,stopOpacity:0})]})}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Rect,{x:"0",y:"0",width:"100%",height:"100%",fill:`url(#${LEFT_GRADIENT_ID})`})]})})}function RightEdgeGradient({style:e,exiting:t,...r}){const i=(0,index_js_1.useAdaptive)(),{colorPreference:n}=(0,index_js_1.useColorPreference)(),{fadeIn:s,fadeOut:o,style:a}=useFadeAnimation();return(0,react_1.useEffect)(()=>{t?s():o()},[t,s,o]),(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[gradientStyleBase,rightGradationStyle,e,a],...r,children:(0,jsx_runtime_1.jsxs)(react_native_svg_1.Svg,{width:"100%",height:"100%",pointerEvents:"none",children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Defs,{children:(0,jsx_runtime_1.jsxs)(react_native_svg_1.LinearGradient,{id:LEFT_GRADIENT_ID,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:0,stopColor:n==="light"?tds_colors_1.colors.grey100:tds_colors_1.colors.inverseGrey100,stopOpacity:0}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:1,stopColor:i.grey100})]})}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Rect,{x:"0",y:"0",width:"100%",height:"100%",fill:`url(#${LEFT_GRADIENT_ID})`})]})})}const gradientStyleBase={position:"absolute",width:28,height:"100%",top:0,bottom:0,overflow:"hidden",zIndex:1},leftGradientStyle={left:0,borderTopLeftRadius:12,borderBottomLeftRadius:12},rightGradationStyle={right:0,borderTopRightRadius:12,borderBottomRightRadius:12};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LeftEdgeGradient=LeftEdgeGradient,exports.RightEdgeGradient=RightEdgeGradient;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),tds_colors_1=require("@toss/tds-colors"),react_1=require("react"),react_native_1=require("react-native"),core_1=require("../../../../core"),spring_1=require("../../constants/spring"),LEFT_GRADIENT_ID="segmented-left-gradient";function useFadeAnimation(){const e=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,t=(0,react_1.useCallback)(()=>{react_native_1.Animated.spring(e,{toValue:1,useNativeDriver:!0,...spring_1.SPRING_OPTION}).start()},[e]),r=(0,react_1.useCallback)(()=>{react_native_1.Animated.spring(e,{toValue:0,useNativeDriver:!0,...spring_1.SPRING_OPTION}).start()},[e]);return{fadeIn:t,fadeOut:r,style:{opacity:e}}}function LeftEdgeGradient({style:e,exiting:t,...r}){const i=(0,core_1.useAdaptive)(),{colorPreference:n}=(0,core_1.useColorPreference)(),{fadeIn:s,fadeOut:o,style:a}=useFadeAnimation();return(0,react_1.useEffect)(()=>{t?s():o()},[t,s,o]),(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[gradientStyleBase,leftGradientStyle,e,a],...r,children:(0,jsx_runtime_1.jsxs)(react_native_svg_1.Svg,{width:"100%",height:"100%",pointerEvents:"none",children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Defs,{children:(0,jsx_runtime_1.jsxs)(react_native_svg_1.LinearGradient,{id:LEFT_GRADIENT_ID,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:0,stopColor:i.grey100}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:1,stopColor:n==="light"?tds_colors_1.colors.grey100:tds_colors_1.colors.inverseGrey100,stopOpacity:0})]})}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Rect,{x:"0",y:"0",width:"100%",height:"100%",fill:`url(#${LEFT_GRADIENT_ID})`})]})})}function RightEdgeGradient({style:e,exiting:t,...r}){const i=(0,core_1.useAdaptive)(),{colorPreference:n}=(0,core_1.useColorPreference)(),{fadeIn:s,fadeOut:o,style:a}=useFadeAnimation();return(0,react_1.useEffect)(()=>{t?s():o()},[t,s,o]),(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[gradientStyleBase,rightGradationStyle,e,a],...r,children:(0,jsx_runtime_1.jsxs)(react_native_svg_1.Svg,{width:"100%",height:"100%",pointerEvents:"none",children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Defs,{children:(0,jsx_runtime_1.jsxs)(react_native_svg_1.LinearGradient,{id:LEFT_GRADIENT_ID,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:0,stopColor:n==="light"?tds_colors_1.colors.grey100:tds_colors_1.colors.inverseGrey100,stopOpacity:0}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:1,stopColor:i.grey100})]})}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Rect,{x:"0",y:"0",width:"100%",height:"100%",fill:`url(#${LEFT_GRADIENT_ID})`})]})})}const gradientStyleBase={position:"absolute",width:28,height:"100%",top:0,bottom:0,overflow:"hidden",zIndex:1},leftGradientStyle={left:0,borderTopLeftRadius:12,borderBottomLeftRadius:12},rightGradationStyle={right:0,borderTopRightRadius:12,borderBottomRightRadius:12};

package/dist/cjs/components/segmented-control/components/ScrollControlOverlay/PreviousButton.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PreviousButton=PreviousButton;const jsx_runtime_1=require("react/jsx-runtime"),index_js_1=require("../../../icon/index.js"),index_js_2=require("../../../../core/index.js"),react_native_1=require("react-native"),useIndicatorBackground_js_1=require("../../hooks/useIndicatorBackground.js");function PreviousButton({onPress:e,style:r}){const t=(0,index_js_2.useAdaptive)(),{colorPreference:o}=(0,index_js_2.useColorPreference)(),s=(0,useIndicatorBackground_js_1.useIndicatorBackground)();return(0,jsx_runtime_1.jsx)(react_native_1.Pressable,{accessibilityRole:"button",style:[{justifyContent:"center",alignItems:"center",left:-12,top:0,borderRadius:12,backgroundColor:s,width:24,height:24,padding:0,shadowColor:o==="light"?"rgba(0, 0, 0, 0.09)":"rgba(1, 1, 1, 0.09)",shadowOffset:{width:0,height:1},shadowOpacity:1,shadowRadius:2},r],onPress:e,children:(0,jsx_runtime_1.jsx)(index_js_1.Icon,{size:12,name:"icon-arrow-left-small",color:t.grey600})})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PreviousButton=PreviousButton;const jsx_runtime_1=require("react/jsx-runtime"),icon_1=require("../../../icon"),core_1=require("../../../../core"),react_native_1=require("react-native"),useIndicatorBackground_1=require("../../hooks/useIndicatorBackground");function PreviousButton({onPress:e,style:r}){const o=(0,core_1.useAdaptive)(),{colorPreference:t}=(0,core_1.useColorPreference)(),s=(0,useIndicatorBackground_1.useIndicatorBackground)();return(0,jsx_runtime_1.jsx)(react_native_1.Pressable,{accessibilityRole:"button",style:[{justifyContent:"center",alignItems:"center",left:-12,top:0,borderRadius:12,backgroundColor:s,width:24,height:24,padding:0,shadowColor:t==="light"?"rgba(0, 0, 0, 0.09)":"rgba(1, 1, 1, 0.09)",shadowOffset:{width:0,height:1},shadowOpacity:1,shadowRadius:2},r],onPress:e,children:(0,jsx_runtime_1.jsx)(icon_1.Icon,{size:12,name:"icon-arrow-left-small",color:o.grey600})})}

package/dist/cjs/components/segmented-control/components/ScrollControlOverlay/ScrollControlOverlay.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ScrollControlOverlay=ScrollControlOverlay;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),spring_js_1=require("../../constants/spring.js"),ScrollContext_js_1=require("../../contexts/ScrollContext.js"),EdgeGradient_js_1=require("./EdgeGradient.js"),PreviousButton_js_1=require("./PreviousButton.js");function ScrollControlOverlay(){const{ref:o,scrollHandlers:n}=(0,react_1.useContext)(ScrollContext_js_1.ScrollContext),[t,i]=(0,react_1.useState)(!1),[a,c]=(0,react_1.useState)(!1),e=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,u=e.interpolate({inputRange:[0,1],outputRange:[-5,0]});(0,react_1.useEffect)(()=>{function d(r){const f=r.nativeEvent.contentSize.width,x=r.nativeEvent.contentOffset.x,g=r.nativeEvent.layoutMeasurement.width,s=x/Math.max(0,f-g);i(s>.05),c(s<=.95)}return n.add(d),()=>{n.clear()}},[n]);const l=()=>{o?.current?.scrollTo({x:0})};return(0,react_1.useEffect)(()=>()=>{react_native_1.Animated.spring(e,{toValue:t?0:1,useNativeDriver:!0,...spring_js_1.SPRING_OPTION}).start()},[e,t]),(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[(0,jsx_runtime_1.jsx)(EdgeGradient_js_1.LeftEdgeGradient,{exiting:t}),(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{pointerEvents:t?"auto":"none",style:[buttonContainerStyle,{transform:[{translateX:u}],opacity:e}],children:(0,jsx_runtime_1.jsx)(PreviousButton_js_1.PreviousButton,{onPress:l})})]}),(0,jsx_runtime_1.jsx)(EdgeGradient_js_1.RightEdgeGradient,{exiting:a})]})}const buttonContainerStyle={zIndex:1,position:"absolute",left:0,top:0,bottom:0,display:"flex",justifyContent:"center",alignItems:"center"};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ScrollControlOverlay=ScrollControlOverlay;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),spring_1=require("../../constants/spring"),ScrollContext_1=require("../../contexts/ScrollContext"),EdgeGradient_1=require("./EdgeGradient"),PreviousButton_1=require("./PreviousButton");function ScrollControlOverlay(){const{ref:s,scrollHandlers:n}=(0,react_1.useContext)(ScrollContext_1.ScrollContext),[t,i]=(0,react_1.useState)(!1),[a,c]=(0,react_1.useState)(!1),e=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,u=e.interpolate({inputRange:[0,1],outputRange:[-5,0]});(0,react_1.useEffect)(()=>{function d(r){const f=r.nativeEvent.contentSize.width,x=r.nativeEvent.contentOffset.x,g=r.nativeEvent.layoutMeasurement.width,o=x/Math.max(0,f-g);i(o>.05),c(o<=.95)}return n.add(d),()=>{n.clear()}},[n]);const l=()=>{s?.current?.scrollTo({x:0})};return(0,react_1.useEffect)(()=>()=>{react_native_1.Animated.spring(e,{toValue:t?0:1,useNativeDriver:!0,...spring_1.SPRING_OPTION}).start()},[e,t]),(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[(0,jsx_runtime_1.jsx)(EdgeGradient_1.LeftEdgeGradient,{exiting:t}),(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{pointerEvents:t?"auto":"none",style:[buttonContainerStyle,{transform:[{translateX:u}],opacity:e}],children:(0,jsx_runtime_1.jsx)(PreviousButton_1.PreviousButton,{onPress:l})})]}),(0,jsx_runtime_1.jsx)(EdgeGradient_1.RightEdgeGradient,{exiting:a})]})}const buttonContainerStyle={zIndex:1,position:"absolute",left:0,top:0,bottom:0,display:"flex",justifyContent:"center",alignItems:"center"};

package/dist/cjs/components/segmented-control/hooks/useIndicatorBackground.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useIndicatorBackground=useIndicatorBackground;const tds_colors_1=require("@toss/tds-colors"),index_js_1=require("../../../core/index.js");function useIndicatorBackground(){const{colorPreference:e}=(0,index_js_1.useColorPreference)();return e==="light"?tds_colors_1.colors.white:tds_colors_1.colors.inverseGrey300}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useIndicatorBackground=useIndicatorBackground;const tds_colors_1=require("@toss/tds-colors"),core_1=require("../../../core");function useIndicatorBackground(){const{colorPreference:e}=(0,core_1.useColorPreference)();return e==="light"?tds_colors_1.colors.white:tds_colors_1.colors.inverseGrey300}

package/dist/cjs/components/segmented-control/index.d.ts

@@ -1,5 +1,5 @@
-import { Item } from './components/Item/Item.js';
-import { RootBase } from './components/Root.js';
+import { Item } from './components/Item/Item';
+import { RootBase } from './components/Root';
 export declare const SegmentedControl: {
     Root: typeof RootBase;
     Item: typeof Item;

package/dist/cjs/components/segmented-control/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SegmentedControl=void 0;const Item_js_1=require("./components/Item/Item.js"),Root_js_1=require("./components/Root.js");exports.SegmentedControl={Root:Root_js_1.RootBase,Item:Item_js_1.Item};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SegmentedControl=void 0;const Item_1=require("./components/Item/Item"),Root_1=require("./components/Root");exports.SegmentedControl={Root:Root_1.RootBase,Item:Item_1.Item};

package/dist/cjs/components/shadow/ShadowBackground.d.ts

@@ -1,5 +1,5 @@
 import { View, type ViewProps } from 'react-native';
-import { type UseShadowProps } from './useShadow.js';
+import { type UseShadowProps } from './useShadow';
 export type ShadowBackgroundProps = {
     shadow: UseShadowProps;
 } & ViewProps;

package/dist/cjs/components/shadow/ShadowBackground.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ShadowBackground=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),useShadow_js_1=require("./useShadow.js");exports.ShadowBackground=(0,react_1.forwardRef)(function({shadow:t,...e},r){const o=(0,useShadow_js_1.useShadow)(t);return(0,jsx_runtime_1.jsx)(react_native_1.View,{ref:r,...e,style:[e.style,styles.container,o]})});const styles=react_native_1.StyleSheet.create({container:{position:"absolute",width:"100%",height:"100%",top:0,left:0}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ShadowBackground=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),useShadow_1=require("./useShadow");exports.ShadowBackground=(0,react_1.forwardRef)(function({shadow:t,...e},r){const o=(0,useShadow_1.useShadow)(t);return(0,jsx_runtime_1.jsx)(react_native_1.View,{ref:r,...e,style:[e.style,styles.container,o]})});const styles=react_native_1.StyleSheet.create({container:{position:"absolute",width:"100%",height:"100%",top:0,left:0}});

package/dist/cjs/components/shadow/generateShadowStyle.d.ts

@@ -1,6 +1,6 @@
-import type { ColorPreference } from '../../core/index.js';
+import type { ColorPreference } from '../../core';
 import type { ViewStyle } from 'react-native';
-import type { Shadow } from './types.js';
+import type { Shadow } from './types';
 type ShadowStyle = Pick<ViewStyle, 'shadowColor' | 'shadowOffset' | 'shadowOpacity' | 'shadowRadius'> | Pick<ViewStyle, 'shadowColor' | 'elevation'>;
 /**
  * @description 플랫폼에 따른 shadow style을 생성합니다.

package/dist/cjs/components/shadow/generateShadowStyle.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.generateShadowStyle=void 0;const react_native_1=require("react-native"),calculateElevation_js_1=require("./calculateElevation.js"),generateShadowStyle=({offset:t={x:0,y:0},opacity:l=1,radius:a,colorPreference:i="light",...e})=>{const o="color"in e?e.color:i==="light"?e.lightColor:e.darkColor;return react_native_1.Platform.OS==="ios"?{shadowColor:o,shadowOffset:{width:t.x??0,height:t.y??0},shadowOpacity:l,shadowRadius:a}:{shadowColor:o,elevation:(0,calculateElevation_js_1.calculateElevation)(a)}};exports.generateShadowStyle=generateShadowStyle;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.generateShadowStyle=void 0;const react_native_1=require("react-native"),calculateElevation_1=require("./calculateElevation"),generateShadowStyle=({offset:t={x:0,y:0},opacity:l=1,radius:a,colorPreference:i="light",...e})=>{const o="color"in e?e.color:i==="light"?e.lightColor:e.darkColor;return react_native_1.Platform.OS==="ios"?{shadowColor:o,shadowOffset:{width:t.x??0,height:t.y??0},shadowOpacity:l,shadowRadius:a}:{shadowColor:o,elevation:(0,calculateElevation_1.calculateElevation)(a)}};exports.generateShadowStyle=generateShadowStyle;

package/dist/cjs/components/shadow/index.d.ts

@@ -1,4 +1,4 @@
-export { calculateElevation } from './calculateElevation.js';
-export { ShadowBackground, type ShadowBackgroundProps } from './ShadowBackground.js';
-export { shadow } from './tokens.js';
-export { useShadow, type UseShadowProps } from './useShadow.js';
+export { calculateElevation } from './calculateElevation';
+export { ShadowBackground, type ShadowBackgroundProps } from './ShadowBackground';
+export { shadow } from './tokens';
+export { useShadow, type UseShadowProps } from './useShadow';

package/dist/cjs/components/shadow/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useShadow=exports.shadow=exports.ShadowBackground=exports.calculateElevation=void 0;var calculateElevation_js_1=require("./calculateElevation.js");Object.defineProperty(exports,"calculateElevation",{enumerable:!0,get:function(){return calculateElevation_js_1.calculateElevation}});var ShadowBackground_js_1=require("./ShadowBackground.js");Object.defineProperty(exports,"ShadowBackground",{enumerable:!0,get:function(){return ShadowBackground_js_1.ShadowBackground}});var tokens_js_1=require("./tokens.js");Object.defineProperty(exports,"shadow",{enumerable:!0,get:function(){return tokens_js_1.shadow}});var useShadow_js_1=require("./useShadow.js");Object.defineProperty(exports,"useShadow",{enumerable:!0,get:function(){return useShadow_js_1.useShadow}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useShadow=exports.shadow=exports.ShadowBackground=exports.calculateElevation=void 0;var calculateElevation_1=require("./calculateElevation");Object.defineProperty(exports,"calculateElevation",{enumerable:!0,get:function(){return calculateElevation_1.calculateElevation}});var ShadowBackground_1=require("./ShadowBackground");Object.defineProperty(exports,"ShadowBackground",{enumerable:!0,get:function(){return ShadowBackground_1.ShadowBackground}});var tokens_1=require("./tokens");Object.defineProperty(exports,"shadow",{enumerable:!0,get:function(){return tokens_1.shadow}});var useShadow_1=require("./useShadow");Object.defineProperty(exports,"useShadow",{enumerable:!0,get:function(){return useShadow_1.useShadow}});

package/dist/cjs/components/shadow/tokens.d.ts

@@ -1,4 +1,4 @@
-import type { TokenShadowProps } from './types.js';
+import type { TokenShadowProps } from './types';
 export type ShadowTokenStrength = 'tiny' | 'weak' | 'medium';
 export type ShadowTokenDirection = 'up' | 'down';
 type ShadowToken = (direction: ShadowTokenDirection) => TokenShadowProps;

package/dist/cjs/components/shadow/useShadow.d.ts

@@ -1,4 +1,4 @@
-import type { Shadow } from './types.js';
+import type { Shadow } from './types';
 export type UseShadowProps = Shadow;
 /**
  * @description 플랫폼에 따른 shadow style을 생성합니다.

package/dist/cjs/components/shadow/useShadow.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useShadow=void 0;const index_js_1=require("../../core/index.js"),generateShadowStyle_js_1=require("./generateShadowStyle.js"),useShadow=e=>{const{colorPreference:o}=(0,index_js_1.useColorPreference)();return(0,generateShadowStyle_js_1.generateShadowStyle)({...e,colorPreference:o})};exports.useShadow=useShadow;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useShadow=void 0;const core_1=require("../../core"),generateShadowStyle_1=require("./generateShadowStyle"),useShadow=e=>{const{colorPreference:o}=(0,core_1.useColorPreference)();return(0,generateShadowStyle_1.generateShadowStyle)({...e,colorPreference:o})};exports.useShadow=useShadow;

package/dist/cjs/components/skeleton/AnimateSkeleton.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),tds_colors_1=require("@toss/tds-colors"),react_1=require("react"),react_native_1=require("react-native"),index_js_1=require("../../core/index.js");function AnimateSkeleton({children:i,delay:e,withGradient:a,withShimmer:n}){const r=(0,react_1.useRef)(new react_native_1.Animated.Value(e===500?0:1)).current,t=(0,react_1.useRef)(new react_native_1.Animated.Value(n?.2:1)).current;return(0,react_1.useEffect)(()=>{const s=react_native_1.Animated.sequence([react_native_1.Animated.delay(e),react_native_1.Animated.timing(r,{toValue:1,duration:100,useNativeDriver:!0})]),o=n?react_native_1.Animated.sequence([react_native_1.Animated.delay(e),react_native_1.Animated.loop(react_native_1.Animated.sequence([react_native_1.Animated.timing(t,{toValue:1,duration:650,useNativeDriver:!0}),react_native_1.Animated.timing(t,{toValue:.2,duration:650,useNativeDriver:!0})]))]):emptyAnimation;react_native_1.Animated.parallel([s,o]).start()},[]),(0,jsx_runtime_1.jsxs)(react_native_1.Animated.View,{style:{opacity:r},children:[(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:{opacity:t},children:i}),a?(0,jsx_runtime_1.jsx)(GradientOverlay,{}):null]})}function GradientOverlay(){const e=(0,index_js_1.useAdaptive)().background??tds_colors_1.colors.background;return(0,jsx_runtime_1.jsxs)(react_native_svg_1.Svg,{height:"100%",width:"100%",style:{position:"absolute",top:0,left:0},children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Defs,{children:(0,jsx_runtime_1.jsxs)(react_native_svg_1.LinearGradient,{id:GRADIENT_ID,gradientTransform:"rotate(90)",children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:"5%",stopColor:e,stopOpacity:0}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:"95%",stopColor:e})]})}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Rect,{x:"0",y:"0",width:"100%",height:"100%",fill:`url(#${GRADIENT_ID})`})]})}const emptyAnimation=react_native_1.Animated.delay(0),GRADIENT_ID="tds-rn-animate-skeleton-gradient";exports.default=AnimateSkeleton;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),tds_colors_1=require("@toss/tds-colors"),react_1=require("react"),react_native_1=require("react-native"),core_1=require("../../core");function AnimateSkeleton({children:i,delay:e,withGradient:a,withShimmer:n}){const r=(0,react_1.useRef)(new react_native_1.Animated.Value(e===500?0:1)).current,t=(0,react_1.useRef)(new react_native_1.Animated.Value(n?.2:1)).current;return(0,react_1.useEffect)(()=>{const s=react_native_1.Animated.sequence([react_native_1.Animated.delay(e),react_native_1.Animated.timing(r,{toValue:1,duration:100,useNativeDriver:!0})]),o=n?react_native_1.Animated.sequence([react_native_1.Animated.delay(e),react_native_1.Animated.loop(react_native_1.Animated.sequence([react_native_1.Animated.timing(t,{toValue:1,duration:650,useNativeDriver:!0}),react_native_1.Animated.timing(t,{toValue:.2,duration:650,useNativeDriver:!0})]))]):emptyAnimation;react_native_1.Animated.parallel([s,o]).start()},[]),(0,jsx_runtime_1.jsxs)(react_native_1.Animated.View,{style:{opacity:r},children:[(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:{opacity:t},children:i}),a?(0,jsx_runtime_1.jsx)(GradientOverlay,{}):null]})}function GradientOverlay(){const e=(0,core_1.useAdaptive)().background??tds_colors_1.colors.background;return(0,jsx_runtime_1.jsxs)(react_native_svg_1.Svg,{height:"100%",width:"100%",style:{position:"absolute",top:0,left:0},children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Defs,{children:(0,jsx_runtime_1.jsxs)(react_native_svg_1.LinearGradient,{id:GRADIENT_ID,gradientTransform:"rotate(90)",children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:"5%",stopColor:e,stopOpacity:0}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Stop,{offset:"95%",stopColor:e})]})}),(0,jsx_runtime_1.jsx)(react_native_svg_1.Rect,{x:"0",y:"0",width:"100%",height:"100%",fill:`url(#${GRADIENT_ID})`})]})}const emptyAnimation=react_native_1.Animated.delay(0),GRADIENT_ID="tds-rn-animate-skeleton-gradient";exports.default=AnimateSkeleton;

package/dist/cjs/components/skeleton/Skeleton.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),index_js_1=require("../../core/index.js"),react_native_1=require("react-native");function Skeleton({width:e,height:t,borderRadius:r=6,style:n}){const s=(0,index_js_1.useAdaptive)();return(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[{width:e,height:t,borderRadius:r,backgroundColor:s.grey200},n]})}exports.default=Skeleton;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),core_1=require("../../core"),react_native_1=require("react-native");function Skeleton({width:e,height:t,borderRadius:r=6,style:o}){const n=(0,core_1.useAdaptive)();return(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[{width:e,height:t,borderRadius:r,backgroundColor:n.grey200},o]})}exports.default=Skeleton;

package/dist/cjs/components/skeleton/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Skeleton } from './Skeleton.js';
-export { default as AnimateSkeleton } from './AnimateSkeleton.js';
+export { default as Skeleton } from './Skeleton';
+export { default as AnimateSkeleton } from './AnimateSkeleton';

package/dist/cjs/components/skeleton/index.js

@@ -1 +1 @@
-"use strict";var __importDefault=function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.AnimateSkeleton=exports.Skeleton=void 0;var Skeleton_js_1=require("./Skeleton.js");Object.defineProperty(exports,"Skeleton",{enumerable:!0,get:function(){return __importDefault(Skeleton_js_1).default}});var AnimateSkeleton_js_1=require("./AnimateSkeleton.js");Object.defineProperty(exports,"AnimateSkeleton",{enumerable:!0,get:function(){return __importDefault(AnimateSkeleton_js_1).default}});
+"use strict";var __importDefault=function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.AnimateSkeleton=exports.Skeleton=void 0;var Skeleton_1=require("./Skeleton");Object.defineProperty(exports,"Skeleton",{enumerable:!0,get:function(){return __importDefault(Skeleton_1).default}});var AnimateSkeleton_1=require("./AnimateSkeleton");Object.defineProperty(exports,"AnimateSkeleton",{enumerable:!0,get:function(){return __importDefault(AnimateSkeleton_1).default}});

package/dist/cjs/components/slider/Slider.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Slider=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_gesture_handler_1=require("@granite-js/native/react-native-gesture-handler"),tds_colors_1=require("@toss/tds-colors"),react_1=require("react"),react_native_1=require("react-native"),styles_js_1=require("./styles.js"),useA11yMode_js_1=require("./useA11yMode.js"),utils_js_1=require("./utils.js");exports.Slider=(0,react_1.forwardRef)(function({min:s=0,max:n=100,value:i=s+n/2,step:o=1,onChange:l,color:_=tds_colors_1.colors.blue400,style:j,...m},p){if(!Number.isInteger(o)||o<=0)throw new Error("step\uC740 \uC591\uC758 \uC815\uC218\uB9CC \uC0AC\uC6A9\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4");const[r,b]=(0,react_1.useState)({container:0,thumb:0}),a=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,u=r.container!==0&&r.thumb!==0,V=e=>{const t=r.container,c=r.thumb,y=t-c;return e===void 0||t===0||c===0||e<=c/2?s:e>=t-c/2?n:(0,utils_js_1.getNearestSteppedValue)(s+(n-s)*((e-c/2)/y),s,n,o)},d=e=>{const t=r.container,c=r.thumb,y=t-c;return(e-s)/(n-s)*y},h=e=>{const t=V(e);l?.(t),a.setValue(d(t))},v=(0,react_1.useMemo)(()=>react_native_gesture_handler_1.Gesture.Pan().onUpdate(e=>{h(e.x)}).onStart(e=>{h(e.x)}),[u]);(0,react_1.useEffect)(()=>{u&&a.setValue(d(i))},[u]);const f=(0,useA11yMode_js_1.useScreenReaderMode)();(0,react_1.useEffect)(()=>{f&&a.setValue(d(i))},[f,i]);const w=e=>{switch(e.nativeEvent.actionName){case"increment":l?.((0,utils_js_1.clamp)(i+o,s,n));break;case"decrement":l?.((0,utils_js_1.clamp)(i-o,s,n));break;default:break}};return(0,jsx_runtime_1.jsx)(react_native_gesture_handler_1.GestureDetector,{gesture:v,children:(0,jsx_runtime_1.jsxs)(react_native_1.View,{ref:p,style:[styles_js_1.styles.slider,j],onLayout:e=>{const{width:t}=e.nativeEvent.layout;b({...r,container:t})},accessible:!0,accessibilityRole:"adjustable",accessibilityValue:{text:`${i}`},accessibilityActions:[{name:"increment"},{name:"decrement"}],accessibilityLiveRegion:"polite",onAccessibilityAction:w,...m,children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:styles_js_1.styles.track,pointerEvents:"none",children:(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[styles_js_1.styles.progress,{backgroundColor:_,transform:[{translateX:a}]}]})}),(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{onLayout:e=>{const{width:t}=e.nativeEvent.layout;b({...r,thumb:t})},style:[styles_js_1.styles.thumb,{opacity:u?1:0,transform:[{translateX:a}]}],pointerEvents:"none"})]})})});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Slider=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_gesture_handler_1=require("@granite-js/native/react-native-gesture-handler"),tds_colors_1=require("@toss/tds-colors"),react_1=require("react"),react_native_1=require("react-native"),styles_1=require("./styles"),useA11yMode_1=require("./useA11yMode"),utils_1=require("./utils");exports.Slider=(0,react_1.forwardRef)(function({min:r=0,max:n=100,value:i=r+n/2,step:o=1,onChange:l,color:_=tds_colors_1.colors.blue400,style:m,...p},V){if(!Number.isInteger(o)||o<=0)throw new Error("step\uC740 \uC591\uC758 \uC815\uC218\uB9CC \uC0AC\uC6A9\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4");const[s,b]=(0,react_1.useState)({container:0,thumb:0}),a=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,u=s.container!==0&&s.thumb!==0,v=e=>{const t=s.container,c=s.thumb,y=t-c;return e===void 0||t===0||c===0||e<=c/2?r:e>=t-c/2?n:(0,utils_1.getNearestSteppedValue)(r+(n-r)*((e-c/2)/y),r,n,o)},d=e=>{const t=s.container,c=s.thumb,y=t-c;return(e-r)/(n-r)*y},h=e=>{const t=v(e);l?.(t),a.setValue(d(t))},w=(0,react_1.useMemo)(()=>react_native_gesture_handler_1.Gesture.Pan().onUpdate(e=>{h(e.x)}).onStart(e=>{h(e.x)}),[u]);(0,react_1.useEffect)(()=>{u&&a.setValue(d(i))},[u]);const f=(0,useA11yMode_1.useScreenReaderMode)();(0,react_1.useEffect)(()=>{f&&a.setValue(d(i))},[f,i]);const j=e=>{switch(e.nativeEvent.actionName){case"increment":l?.((0,utils_1.clamp)(i+o,r,n));break;case"decrement":l?.((0,utils_1.clamp)(i-o,r,n));break;default:break}};return(0,jsx_runtime_1.jsx)(react_native_gesture_handler_1.GestureDetector,{gesture:w,children:(0,jsx_runtime_1.jsxs)(react_native_1.View,{ref:V,style:[styles_1.styles.slider,m],onLayout:e=>{const{width:t}=e.nativeEvent.layout;b({...s,container:t})},accessible:!0,accessibilityRole:"adjustable",accessibilityValue:{text:`${i}`},accessibilityActions:[{name:"increment"},{name:"decrement"}],accessibilityLiveRegion:"polite",onAccessibilityAction:j,...p,children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:styles_1.styles.track,pointerEvents:"none",children:(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[styles_1.styles.progress,{backgroundColor:_,transform:[{translateX:a}]}]})}),(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{onLayout:e=>{const{width:t}=e.nativeEvent.layout;b({...s,thumb:t})},style:[styles_1.styles.thumb,{opacity:u?1:0,transform:[{translateX:a}]}],pointerEvents:"none"})]})})});

package/dist/cjs/components/slider/index.d.ts

@@ -1,2 +1,2 @@
-export { Slider } from './Slider.js';
-export type { SliderProps } from './Slider.js';
+export { Slider } from './Slider';
+export type { SliderProps } from './Slider';

package/dist/cjs/components/slider/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Slider=void 0;var Slider_js_1=require("./Slider.js");Object.defineProperty(exports,"Slider",{enumerable:!0,get:function(){return Slider_js_1.Slider}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Slider=void 0;var Slider_1=require("./Slider");Object.defineProperty(exports,"Slider",{enumerable:!0,get:function(){return Slider_1.Slider}});

package/dist/cjs/components/slider/utils.test.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const globals_1=require("@jest/globals"),utils_js_1=require("./utils.js");(0,globals_1.describe)("clamp \uD14C\uC2A4\uD2B8",()=>{(0,globals_1.it)("min, max \uC774\uB0B4\uC758 \uAC12\uC774\uB77C\uBA74 \uB0B4\uBD80 \uAC12\uC744 \uBC18\uD658\uD55C\uB2E4",()=>{(0,globals_1.expect)((0,utils_js_1.clamp)(12,10,100)).toBe(12)}),(0,globals_1.it)("min\uBCF4\uB2E4 \uC791\uC73C\uBA74 min\uC744 \uBC18\uD658\uD55C\uB2E4",()=>{(0,globals_1.expect)((0,utils_js_1.clamp)(5,10,100)).toBe(10)}),(0,globals_1.it)("max\uBCF4\uB2E4 \uD06C\uBA74 max\uB97C \uBC18\uD658\uD55C\uB2E4",()=>{(0,globals_1.expect)((0,utils_js_1.clamp)(120,10,100)).toBe(100)})}),(0,globals_1.describe)("getNearestSteppedValue",()=>{(0,globals_1.it)("min, max \uB0B4\uC5D0 \uC788\uB2E4\uBA74 \uCD08\uAE30\uAC12\uC5D0\uC11C step\uB9CC\uD07C \uC6C0\uC9C1\uC778 \uAC12\uC744 \uAD6C\uD55C\uB2E4",()=>{(0,globals_1.expect)((0,utils_js_1.getNearestSteppedValue)(2,-.5,100,3)).toBe(2.5),(0,globals_1.expect)((0,utils_js_1.getNearestSteppedValue)(-8,-100,100,5)).toBe(-10),(0,globals_1.expect)((0,utils_js_1.getNearestSteppedValue)(-6,-100,100,5)).toBe(-5),(0,globals_1.expect)((0,utils_js_1.getNearestSteppedValue)(3,-100,100,5)).toBe(5),(0,globals_1.expect)((0,utils_js_1.getNearestSteppedValue)(2,-100,100,5)).toBe(0),(0,globals_1.expect)((0,utils_js_1.getNearestSteppedValue)(-30+3.5781601728019066,-100,100,10)).toBe(-30)}),(0,globals_1.it)("min, max\uAC12\uC744 \uBC97\uC5B4\uB098\uBA74 min, max\uAC12\uC744 \uBC18\uD658\uD55C\uB2E4",()=>{(0,globals_1.expect)((0,utils_js_1.getNearestSteppedValue)(-6.2,-2.5,100,3)).toBe(-2.5),(0,globals_1.expect)((0,utils_js_1.getNearestSteppedValue)(106.2,-2.5,100,3)).toBe(100)})});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const globals_1=require("@jest/globals"),utils_1=require("./utils");(0,globals_1.describe)("clamp \uD14C\uC2A4\uD2B8",()=>{(0,globals_1.it)("min, max \uC774\uB0B4\uC758 \uAC12\uC774\uB77C\uBA74 \uB0B4\uBD80 \uAC12\uC744 \uBC18\uD658\uD55C\uB2E4",()=>{(0,globals_1.expect)((0,utils_1.clamp)(12,10,100)).toBe(12)}),(0,globals_1.it)("min\uBCF4\uB2E4 \uC791\uC73C\uBA74 min\uC744 \uBC18\uD658\uD55C\uB2E4",()=>{(0,globals_1.expect)((0,utils_1.clamp)(5,10,100)).toBe(10)}),(0,globals_1.it)("max\uBCF4\uB2E4 \uD06C\uBA74 max\uB97C \uBC18\uD658\uD55C\uB2E4",()=>{(0,globals_1.expect)((0,utils_1.clamp)(120,10,100)).toBe(100)})}),(0,globals_1.describe)("getNearestSteppedValue",()=>{(0,globals_1.it)("min, max \uB0B4\uC5D0 \uC788\uB2E4\uBA74 \uCD08\uAE30\uAC12\uC5D0\uC11C step\uB9CC\uD07C \uC6C0\uC9C1\uC778 \uAC12\uC744 \uAD6C\uD55C\uB2E4",()=>{(0,globals_1.expect)((0,utils_1.getNearestSteppedValue)(2,-.5,100,3)).toBe(2.5),(0,globals_1.expect)((0,utils_1.getNearestSteppedValue)(-8,-100,100,5)).toBe(-10),(0,globals_1.expect)((0,utils_1.getNearestSteppedValue)(-6,-100,100,5)).toBe(-5),(0,globals_1.expect)((0,utils_1.getNearestSteppedValue)(3,-100,100,5)).toBe(5),(0,globals_1.expect)((0,utils_1.getNearestSteppedValue)(2,-100,100,5)).toBe(0),(0,globals_1.expect)((0,utils_1.getNearestSteppedValue)(-30+3.5781601728019066,-100,100,10)).toBe(-30)}),(0,globals_1.it)("min, max\uAC12\uC744 \uBC97\uC5B4\uB098\uBA74 min, max\uAC12\uC744 \uBC18\uD658\uD55C\uB2E4",()=>{(0,globals_1.expect)((0,utils_1.getNearestSteppedValue)(-6.2,-2.5,100,3)).toBe(-2.5),(0,globals_1.expect)((0,utils_1.getNearestSteppedValue)(106.2,-2.5,100,3)).toBe(100)})});

package/dist/cjs/components/stepper-row/StepperRow.d.ts

@@ -1,9 +1,9 @@
 import type { ReactNode } from 'react';
-import { StepperRowAssetFrame } from './StepperRowAssetFrame.js';
-import { StepperRowNumberIcon } from './StepperRowNumberIcon.js';
-import { StepperRowRightArrow } from './StepperRowRightArrow.js';
-import { StepperRowRightButton } from './StepperRowRightButton.js';
-import { StepperRowTexts } from './StepperRowTexts.js';
+import { StepperRowAssetFrame } from './StepperRowAssetFrame';
+import { StepperRowNumberIcon } from './StepperRowNumberIcon';
+import { StepperRowRightArrow } from './StepperRowRightArrow';
+import { StepperRowRightButton } from './StepperRowRightButton';
+import { StepperRowTexts } from './StepperRowTexts';
 interface StepperRowProps {
     /**
      * `StepperRow` 컴포넌트의 왼쪽 영역에 표시될 컴포넌트를 지정해요. 주로 `StepperRow.NumberIcon`나 `StepperRow.AssetFrame` 컴포넌트가 사용돼요.

package/dist/cjs/components/stepper-row/StepperRow.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRow=StepperRow;const jsx_runtime_1=require("react/jsx-runtime"),index_js_1=require("../../core/index.js"),react_native_1=require("react-native"),a11yCondition_js_1=require("./constants/a11yCondition.js"),StepperRowAssetFrame_js_1=require("./StepperRowAssetFrame.js"),StepperRowContext_js_1=require("./StepperRowContext.js"),StepperRowNumberIcon_js_1=require("./StepperRowNumberIcon.js"),StepperRowRightArrow_js_1=require("./StepperRowRightArrow.js"),StepperRowRightButton_js_1=require("./StepperRowRightButton.js"),StepperRowTexts_js_1=require("./StepperRowTexts.js"),padding_js_1=require("./utils/padding.js");function StepperRow(t){return(0,jsx_runtime_1.jsx)(StepperRowContext_js_1.StepperRowContextProvider,{children:(0,jsx_runtime_1.jsx)(StepperRowContent,{...t})})}function StepperRowContent({left:t,center:r,right:n,hideLine:s=!1}){const e=(0,StepperRowContext_js_1.useStepperRowContext)(),o=e.right?.type==="button",p=(0,index_js_1.useFontScaleCondition)(a11yCondition_js_1.a11yCondition.center),i=(0,index_js_1.useFontScaleCondition)(a11yCondition_js_1.a11yCondition.rightButtonAlign)&&o,c=(0,index_js_1.useFontScaleCondition)(a11yCondition_js_1.a11yCondition.rightButtonPaddingTop)&&o,d=(0,padding_js_1.getCenterPaddingTop)(e.left,e.center),g=(0,padding_js_1.getRightPaddingTop)(e.left,e.right),a=(0,index_js_1.useAdaptive)();return(0,jsx_runtime_1.jsxs)(react_native_1.View,{style:styles.rootCss,children:[(0,jsx_runtime_1.jsxs)(react_native_1.View,{style:styles.leftCss,children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{children:t}),!s&&(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.lineCss,{backgroundColor:a.grey200}]})]}),(0,jsx_runtime_1.jsxs)(react_native_1.View,{style:[styles.centerRightCss,i&&styles.a11yCenterRightButtonAlign],children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.centerCss,p&&styles.a11yCenter,{paddingTop:d}],children:r}),n&&(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.rightCss,{paddingTop:c?0:g},i&&styles.a11yRightButtonAlign],children:n})]})]})}StepperRow.Texts=StepperRowTexts_js_1.StepperRowTexts,StepperRow.NumberIcon=StepperRowNumberIcon_js_1.StepperRowNumberIcon,StepperRow.AssetFrame=StepperRowAssetFrame_js_1.StepperRowAssetFrame,StepperRow.RightArrow=StepperRowRightArrow_js_1.StepperRowRightArrow,StepperRow.RightButton=StepperRowRightButton_js_1.StepperRowRightButton;const styles=react_native_1.StyleSheet.create({rootCss:{flexDirection:"row",paddingVertical:3,paddingHorizontal:24},leftCss:{flexDirection:"column",alignItems:"center",paddingRight:14},lineCss:{flexDirection:"row",width:2,minHeight:16,flex:1,borderRadius:1,marginTop:6},centerRightCss:{flex:1,flexDirection:"row",paddingBottom:16},centerCss:{flexDirection:"column",flex:1},rightCss:{flexDirection:"row",paddingLeft:12},a11yCenter:{flexDirection:"row",paddingTop:0},a11yCenterRightButtonAlign:{flexDirection:"column"},a11yRightButtonAlign:{flexDirection:"row",paddingTop:12,paddingLeft:0,paddingRight:0,paddingBottom:0}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRow=StepperRow;const jsx_runtime_1=require("react/jsx-runtime"),core_1=require("../../core"),react_native_1=require("react-native"),a11yCondition_1=require("./constants/a11yCondition"),StepperRowAssetFrame_1=require("./StepperRowAssetFrame"),StepperRowContext_1=require("./StepperRowContext"),StepperRowNumberIcon_1=require("./StepperRowNumberIcon"),StepperRowRightArrow_1=require("./StepperRowRightArrow"),StepperRowRightButton_1=require("./StepperRowRightButton"),StepperRowTexts_1=require("./StepperRowTexts"),padding_1=require("./utils/padding");function StepperRow(t){return(0,jsx_runtime_1.jsx)(StepperRowContext_1.StepperRowContextProvider,{children:(0,jsx_runtime_1.jsx)(StepperRowContent,{...t})})}function StepperRowContent({left:t,center:r,right:n,hideLine:s=!1}){const e=(0,StepperRowContext_1.useStepperRowContext)(),o=e.right?.type==="button",p=(0,core_1.useFontScaleCondition)(a11yCondition_1.a11yCondition.center),i=(0,core_1.useFontScaleCondition)(a11yCondition_1.a11yCondition.rightButtonAlign)&&o,c=(0,core_1.useFontScaleCondition)(a11yCondition_1.a11yCondition.rightButtonPaddingTop)&&o,d=(0,padding_1.getCenterPaddingTop)(e.left,e.center),g=(0,padding_1.getRightPaddingTop)(e.left,e.right),a=(0,core_1.useAdaptive)();return(0,jsx_runtime_1.jsxs)(react_native_1.View,{style:styles.rootCss,children:[(0,jsx_runtime_1.jsxs)(react_native_1.View,{style:styles.leftCss,children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{children:t}),!s&&(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.lineCss,{backgroundColor:a.grey200}]})]}),(0,jsx_runtime_1.jsxs)(react_native_1.View,{style:[styles.centerRightCss,i&&styles.a11yCenterRightButtonAlign],children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.centerCss,p&&styles.a11yCenter,{paddingTop:d}],children:r}),n&&(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.rightCss,{paddingTop:c?0:g},i&&styles.a11yRightButtonAlign],children:n})]})]})}StepperRow.Texts=StepperRowTexts_1.StepperRowTexts,StepperRow.NumberIcon=StepperRowNumberIcon_1.StepperRowNumberIcon,StepperRow.AssetFrame=StepperRowAssetFrame_1.StepperRowAssetFrame,StepperRow.RightArrow=StepperRowRightArrow_1.StepperRowRightArrow,StepperRow.RightButton=StepperRowRightButton_1.StepperRowRightButton;const styles=react_native_1.StyleSheet.create({rootCss:{flexDirection:"row",paddingVertical:3,paddingHorizontal:24},leftCss:{flexDirection:"column",alignItems:"center",paddingRight:14},lineCss:{flexDirection:"row",width:2,minHeight:16,flex:1,borderRadius:1,marginTop:6},centerRightCss:{flex:1,flexDirection:"row",paddingBottom:16},centerCss:{flexDirection:"column",flex:1},rightCss:{flexDirection:"row",paddingLeft:12},a11yCenter:{flexDirection:"row",paddingTop:0},a11yCenterRightButtonAlign:{flexDirection:"column"},a11yRightButtonAlign:{flexDirection:"row",paddingTop:12,paddingLeft:0,paddingRight:0,paddingBottom:0}});

package/dist/cjs/components/stepper-row/StepperRowAssetFrame.d.ts

@@ -1,5 +1,5 @@
-import { Asset } from '../asset/index.js';
 import type { ComponentProps } from 'react';
-type StepperRowAssetFrameProps = ComponentProps<typeof Asset['Frame']>;
+import { Asset } from '../asset';
+type StepperRowAssetFrameProps = ComponentProps<(typeof Asset)['Frame']>;
 export declare function StepperRowAssetFrame({ shape, ...props }: StepperRowAssetFrameProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/cjs/components/stepper-row/StepperRowAssetFrame.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRowAssetFrame=StepperRowAssetFrame;const jsx_runtime_1=require("react/jsx-runtime"),index_js_1=require("../asset/index.js"),index_js_2=require("../../core/index.js"),react_1=require("react"),a11yCondition_js_1=require("./constants/a11yCondition.js"),StepperRowContext_js_1=require("./StepperRowContext.js");function StepperRowAssetFrame({shape:e,...r}){const t=e.width===32;(0,StepperRowContext_js_1.useUpdateStepperRowLeft)({type:t?"asset32":"asset40"});const n=(0,index_js_2.useFontScaleCondition)(a11yCondition_js_1.a11yCondition.leftAsset),i=(0,react_1.useMemo)(()=>{const s=e.radius===9999,o=t&&!s,c=t&&s;return o?index_js_1.frameShape.CleanW40:c?index_js_1.frameShape.CircleMedium:e},[t,e]);return(0,jsx_runtime_1.jsx)(index_js_1.Asset.Frame,{shape:n?i:e,...r})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRowAssetFrame=StepperRowAssetFrame;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),core_1=require("../../core"),asset_1=require("../asset"),a11yCondition_1=require("./constants/a11yCondition"),StepperRowContext_1=require("./StepperRowContext");function StepperRowAssetFrame({shape:e,...s}){const t=e.width===32;(0,StepperRowContext_1.useUpdateStepperRowLeft)({type:t?"asset32":"asset40"});const o=(0,core_1.useFontScaleCondition)(a11yCondition_1.a11yCondition.leftAsset),n=(0,react_1.useMemo)(()=>{const r=e.radius===9999,i=t&&!r,c=t&&r;return i?asset_1.frameShape.CleanW40:c?asset_1.frameShape.CircleMedium:e},[t,e]);return(0,jsx_runtime_1.jsx)(asset_1.Asset.Frame,{shape:o?n:e,...s})}

package/dist/cjs/components/stepper-row/StepperRowNumberIcon.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRowNumberIcon=StepperRowNumberIcon;const jsx_runtime_1=require("react/jsx-runtime"),index_js_1=require("../asset/index.js"),index_js_2=require("../../core/index.js"),a11yCondition_js_1=require("./constants/a11yCondition.js"),StepperRowContext_js_1=require("./StepperRowContext.js"),frameShape=index_js_1.Asset.frameShape.CleanW32,a11yFrameShape=index_js_1.Asset.frameShape.CleanW40;function StepperRowNumberIcon({number:e}){(0,StepperRowContext_js_1.useUpdateStepperRowLeft)({type:"numberIcon"});const t=(0,index_js_2.useFontScaleCondition)(a11yCondition_js_1.a11yCondition.leftAsset),{colorPreference:s}=(0,index_js_2.useColorPreference)();return(0,jsx_runtime_1.jsx)(index_js_1.Asset.Icon,{frameShape:t?a11yFrameShape:frameShape,name:`icon-step${e}-rounded-${s}`,accessibilityLabel:`${e}\uBC88`})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRowNumberIcon=StepperRowNumberIcon;const jsx_runtime_1=require("react/jsx-runtime"),asset_1=require("../asset"),core_1=require("../../core"),a11yCondition_1=require("./constants/a11yCondition"),StepperRowContext_1=require("./StepperRowContext"),frameShape=asset_1.Asset.frameShape.CleanW32,a11yFrameShape=asset_1.Asset.frameShape.CleanW40;function StepperRowNumberIcon({number:e}){(0,StepperRowContext_1.useUpdateStepperRowLeft)({type:"numberIcon"});const t=(0,core_1.useFontScaleCondition)(a11yCondition_1.a11yCondition.leftAsset),{colorPreference:o}=(0,core_1.useColorPreference)();return(0,jsx_runtime_1.jsx)(asset_1.Asset.Icon,{frameShape:t?a11yFrameShape:frameShape,name:`icon-step${e}-rounded-${o}`,accessibilityLabel:`${e}\uBC88`})}

package/dist/cjs/components/stepper-row/StepperRowRightArrow.d.ts

@@ -1,4 +1,4 @@
-import type { FrameShapeType } from '../asset/types.js';
+import type { FrameShapeType } from '../asset/types';
 export interface StepperRowRightArrowProps {
     /**
      * 아이콘의 이름을 지정해요.

package/dist/cjs/components/stepper-row/StepperRowRightArrow.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRowRightArrow=StepperRowRightArrow;const jsx_runtime_1=require("react/jsx-runtime"),index_js_1=require("../../core/index.js"),index_js_2=require("../asset/index.js"),StepperRowContext_js_1=require("./StepperRowContext.js");function StepperRowRightArrow({name:e,color:r,frameShape:t}){const o=(0,index_js_1.useAdaptive)();return(0,StepperRowContext_js_1.useUpdateStepperRowRight)({type:"arrow"}),(0,jsx_runtime_1.jsx)(index_js_2.Asset.Icon,{name:e??"icon-arrow-right-mono",color:r??o.grey400,style:{marginRight:-8},frameShape:t})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRowRightArrow=StepperRowRightArrow;const jsx_runtime_1=require("react/jsx-runtime"),core_1=require("../../core"),asset_1=require("../asset"),StepperRowContext_1=require("./StepperRowContext");function StepperRowRightArrow({name:e,color:r,frameShape:t}){const o=(0,core_1.useAdaptive)();return(0,StepperRowContext_1.useUpdateStepperRowRight)({type:"arrow"}),(0,jsx_runtime_1.jsx)(asset_1.Asset.Icon,{name:e??"icon-arrow-right-mono",color:r??o.grey400,style:{marginRight:-8},frameShape:t})}

package/dist/cjs/components/stepper-row/StepperRowRightButton.d.ts

@@ -1,4 +1,4 @@
-import { Button } from '../button/index.js';
+import { Button } from '../button';
 import type { ComponentProps } from 'react';
 type StepperRowRightButtonProps = ComponentProps<typeof Button>;
 export declare function StepperRowRightButton({ size, type, ...restProps }: StepperRowRightButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/stepper-row/StepperRowRightButton.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRowRightButton=StepperRowRightButton;const jsx_runtime_1=require("react/jsx-runtime"),index_js_1=require("../button/index.js"),StepperRowContext_js_1=require("./StepperRowContext.js");function StepperRowRightButton({size:t="tiny",type:e="primary",...r}){return(0,StepperRowContext_js_1.useUpdateStepperRowRight)({type:"button"}),(0,jsx_runtime_1.jsx)(index_js_1.Button,{size:t,type:e,...r})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRowRightButton=StepperRowRightButton;const jsx_runtime_1=require("react/jsx-runtime"),button_1=require("../button"),StepperRowContext_1=require("./StepperRowContext");function StepperRowRightButton({size:t="tiny",type:e="primary",...r}){return(0,StepperRowContext_1.useUpdateStepperRowRight)({type:"button"}),(0,jsx_runtime_1.jsx)(button_1.Button,{size:t,type:e,...r})}

package/dist/cjs/components/stepper-row/StepperRowTexts.d.ts

@@ -1,5 +1,5 @@
 import type { ComponentProps, ReactNode } from 'react';
-import { Text } from '../paragraph/index.js';
+import { Text } from '../paragraph';
 interface StepperRowTextsProps {
     /**
      * `StepperRow.Texts` 컴포넌트의 텍스트의 타입을 설정해요. 타이틀과 설명의 스타일이 타입에 따라 달라져요.

package/dist/cjs/components/stepper-row/StepperRowTexts.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRowTexts=StepperRowTexts;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),index_js_1=require("../../core/index.js"),index_js_2=require("../paragraph/index.js"),StepperRowContext_js_1=require("./StepperRowContext.js"),isReactText=e=>typeof e=="string"||typeof e=="number",isParagraphText=e=>(0,react_1.isValidElement)(e)&&(e.type===index_js_2.Text||e.type===index_js_2.Text),typeVariants={A:{title:{typography:"t5",fontWeight:"bold"},description:{typography:"t6",fontWeight:"regular"}},B:{title:{typography:"t4",fontWeight:"bold"},description:{typography:"t6",fontWeight:"regular"}},C:{title:{typography:"t5",fontWeight:"bold"},description:{typography:"t7",fontWeight:"medium"}}};function StepperRowTexts({type:e,title:i,description:t,titleProps:p,descriptionProps:l}){const r=(0,index_js_1.useAdaptive)();(0,StepperRowContext_js_1.useUpdateStepperRowCenter)({type:e,hasDescription:t!=null});const n=react_1.Children.only(isReactText(i)?(0,jsx_runtime_1.jsx)(index_js_2.Text,{color:r.grey800,children:i}):i),o=t?react_1.Children.only(isReactText(t)?(0,jsx_runtime_1.jsx)(index_js_2.Text,{style:{color:r.grey600,paddingTop:2},children:t}):t):void 0,s=typeVariants[e],c=isParagraphText(n)?(0,react_1.cloneElement)(n,{...s.title,color:r.grey800,...n.props,...p}):n,a=isParagraphText(o)?(0,react_1.cloneElement)(o,{...s.description,color:r.grey600,...o.props,...l}):o;return(0,jsx_runtime_1.jsxs)(react_native_1.View,{children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:{flexDirection:"row"},children:c}),t&&(0,jsx_runtime_1.jsx)(react_native_1.View,{style:{flexDirection:"row"},children:a})]})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRowTexts=StepperRowTexts;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),core_1=require("../../core"),paragraph_1=require("../paragraph"),StepperRowContext_1=require("./StepperRowContext"),isReactText=e=>typeof e=="string"||typeof e=="number",isParagraphText=e=>(0,react_1.isValidElement)(e)&&(e.type===paragraph_1.Text||e.type===paragraph_1.Text),typeVariants={A:{title:{typography:"t5",fontWeight:"bold"},description:{typography:"t6",fontWeight:"regular"}},B:{title:{typography:"t4",fontWeight:"bold"},description:{typography:"t6",fontWeight:"regular"}},C:{title:{typography:"t5",fontWeight:"bold"},description:{typography:"t7",fontWeight:"medium"}}};function StepperRowTexts({type:e,title:i,description:t,titleProps:p,descriptionProps:l}){const r=(0,core_1.useAdaptive)();(0,StepperRowContext_1.useUpdateStepperRowCenter)({type:e,hasDescription:t!=null});const o=react_1.Children.only(isReactText(i)?(0,jsx_runtime_1.jsx)(paragraph_1.Text,{color:r.grey800,children:i}):i),n=t?react_1.Children.only(isReactText(t)?(0,jsx_runtime_1.jsx)(paragraph_1.Text,{style:{color:r.grey600,paddingTop:2},children:t}):t):void 0,s=typeVariants[e],c=isParagraphText(o)?(0,react_1.cloneElement)(o,{...s.title,color:r.grey800,...o.props,...p}):o,a=isParagraphText(n)?(0,react_1.cloneElement)(n,{...s.description,color:r.grey600,...n.props,...l}):n;return(0,jsx_runtime_1.jsxs)(react_native_1.View,{children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:{flexDirection:"row"},children:c}),t&&(0,jsx_runtime_1.jsx)(react_native_1.View,{style:{flexDirection:"row"},children:a})]})}

package/dist/cjs/components/stepper-row/constants/a11yCondition.d.ts

@@ -1,2 +1,2 @@
-import type { A11yCondition } from '../../../core/index.js';
+import type { A11yCondition } from '../../../core';
 export declare const a11yCondition: Record<'leftAsset' | 'center' | 'rightArrow' | 'rightButtonAlign' | 'rightButtonPaddingTop', A11yCondition>;

package/dist/cjs/components/stepper-row/index.d.ts

@@ -1 +1 @@
-export { StepperRow } from './StepperRow.js';
+export { StepperRow } from './StepperRow';

package/dist/cjs/components/stepper-row/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRow=void 0;var StepperRow_js_1=require("./StepperRow.js");Object.defineProperty(exports,"StepperRow",{enumerable:!0,get:function(){return StepperRow_js_1.StepperRow}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.StepperRow=void 0;var StepperRow_1=require("./StepperRow");Object.defineProperty(exports,"StepperRow",{enumerable:!0,get:function(){return StepperRow_1.StepperRow}});

package/dist/cjs/components/stepper-row/utils/padding.d.ts

@@ -1,3 +1,3 @@
-import type { Center, Left, Right } from '../StepperRowContext.js';
+import type { Center, Left, Right } from '../StepperRowContext';
 export declare function getCenterPaddingTop(left: Left | undefined, center: Center | undefined): number;
 export declare function getRightPaddingTop(left: Left | undefined, right: Right | undefined): number;

package/dist/cjs/components/switch/Switch.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),tds_colors_1=require("@toss/tds-colors"),react_1=require("react"),react_native_1=require("react-native"),index_js_1=require("../../interactions/animation/index.js"),index_js_2=require("../../interactions/pressable-effect/index.js"),index_js_3=require("../../utils/index.js"),useSwitchAnimation_js_1=require("./useSwitchAnimation.js");function Switch({checked:r,defaultChecked:c=!1,disabled:e,style:a,onPress:n,onCheckedChange:i,accessibilityState:u,...l}){const[t,o]=(0,index_js_3.useControlled)({controlledValue:r,defaultValue:c}),{reduceMotionEnabled:d}=(0,index_js_3.useAccessibilityInfo)(),s=(0,react_1.useMemo)(()=>t===!0?"on":"off",[t]),{backgroundStyle:f,animatedKnobStyle:m,startSwitchOnAnimation:h,startSwitchOffAnoimation:y}=(0,useSwitchAnimation_js_1.useSwitchAnimation)({animationState:s,disabled:e}),{startPressInAnim:_,startPressOutAnim:x,scaleAnim:S}=(0,index_js_2.usePressAnim)({pressIn:{scale:.96,opacity:1},pressOut:{scale:1,opacity:1}}),{startWiggle:j,style:A}=(0,index_js_1.useWiggleAnimation)({direction:"x",type:"small"}),w=(0,react_1.useCallback)(p=>{e||(n?.(p),i?.(!t),o(!t))},[t,e,n,i,o]);return(0,react_1.useEffect)(()=>{s==="on"?h():y()},[s]),(0,jsx_runtime_1.jsx)(react_native_1.Pressable,{onPress:w,onPressIn:e?j:_,onPressOut:e?void 0:x,style:[styles.container,a],accessibilityRole:"switch",accessible:!0,accessibilityState:{checked:t,disabled:e,...u},...l,children:(0,jsx_runtime_1.jsxs)(react_native_1.Animated.View,{style:[react_native_1.Platform.OS==="ios"?{opacity:e?.3:1}:void 0,d?void 0:S,e?A:void 0],children:[(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[f,{width:WIDTH,height:HEIGHT,borderRadius:RADIUS}]}),(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[styles.knob,m]})]})})}const WIDTH=50,HEIGHT=30,RADIUS=15,styles=react_native_1.StyleSheet.create({container:{alignSelf:"flex-start"},knob:{width:16,height:16,backgroundColor:tds_colors_1.colors.white,borderRadius:8,position:"absolute",left:7,top:7}});exports.default=Switch;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),tds_colors_1=require("@toss/tds-colors"),react_1=require("react"),react_native_1=require("react-native"),animation_1=require("../../interactions/animation"),pressable_effect_1=require("../../interactions/pressable-effect"),utils_1=require("../../utils"),useSwitchAnimation_1=require("./useSwitchAnimation");function Switch({checked:r,defaultChecked:c=!1,disabled:e,style:a,onPress:n,onCheckedChange:i,accessibilityState:l,...u}){const[t,o]=(0,utils_1.useControlled)({controlledValue:r,defaultValue:c}),{reduceMotionEnabled:f}=(0,utils_1.useAccessibilityInfo)(),s=(0,react_1.useMemo)(()=>t===!0?"on":"off",[t]),{backgroundStyle:m,animatedKnobStyle:d,startSwitchOnAnimation:h,startSwitchOffAnoimation:y}=(0,useSwitchAnimation_1.useSwitchAnimation)({animationState:s,disabled:e}),{startPressInAnim:S,startPressOutAnim:A,scaleAnim:w}=(0,pressable_effect_1.usePressAnim)({pressIn:{scale:.96,opacity:1},pressOut:{scale:1,opacity:1}}),{startWiggle:_,style:p}=(0,animation_1.useWiggleAnimation)({direction:"x",type:"small"}),b=(0,react_1.useCallback)(g=>{e||(n?.(g),i?.(!t),o(!t))},[t,e,n,i,o]);return(0,react_1.useEffect)(()=>{s==="on"?h():y()},[s]),(0,jsx_runtime_1.jsx)(react_native_1.Pressable,{onPress:b,onPressIn:e?_:S,onPressOut:e?void 0:A,style:[styles.container,a],accessibilityRole:"switch",accessible:!0,accessibilityState:{checked:t,disabled:e,...l},...u,children:(0,jsx_runtime_1.jsxs)(react_native_1.Animated.View,{style:[react_native_1.Platform.OS==="ios"?{opacity:e?.3:1}:void 0,f?void 0:w,e?p:void 0],children:[(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[m,{width:WIDTH,height:HEIGHT,borderRadius:RADIUS}]}),(0,jsx_runtime_1.jsx)(react_native_1.Animated.View,{style:[styles.knob,d]})]})})}const WIDTH=50,HEIGHT=30,RADIUS=15,styles=react_native_1.StyleSheet.create({container:{alignSelf:"flex-start"},knob:{width:16,height:16,backgroundColor:tds_colors_1.colors.white,borderRadius:8,position:"absolute",left:7,top:7}});exports.default=Switch;

package/dist/cjs/components/switch/index.d.ts

@@ -1 +1 @@
-export { default as Switch } from './Switch.js';
+export { default as Switch } from './Switch';

package/dist/cjs/components/switch/index.js

@@ -1 +1 @@
-"use strict";var __importDefault=function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.Switch=void 0;var Switch_js_1=require("./Switch.js");Object.defineProperty(exports,"Switch",{enumerable:!0,get:function(){return __importDefault(Switch_js_1).default}});
+"use strict";var __importDefault=function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.Switch=void 0;var Switch_1=require("./Switch");Object.defineProperty(exports,"Switch",{enumerable:!0,get:function(){return __importDefault(Switch_1).default}});

package/dist/cjs/components/switch/useSwitchAnimation.js

@@ -1 +1 @@
-"use strict";var __importDefault=function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.useSwitchAnimation=useSwitchAnimation;const tds_colors_1=require("@toss/tds-colors"),hex_to_rgba_1=__importDefault(require("hex-to-rgba")),react_1=require("react"),react_native_1=require("react-native"),index_js_1=require("../../core/index.js");function useSwitchAnimation({animationState:e,disabled:s}){const o=(0,index_js_1.useAdaptive)(),i=(0,react_1.useMemo)(()=>({grey200:(0,hex_to_rgba_1.default)(o.grey200??tds_colors_1.colors.grey200,react_native_1.Platform.OS==="android"&&s?.3:1),blue500:(0,hex_to_rgba_1.default)(tds_colors_1.colors.blue500,react_native_1.Platform.OS==="android"&&s?.3:1)}),[o.grey200,s]),a=(0,react_1.useRef)(new react_native_1.Animated.Value(e==="on"?1:0)).current,r=(0,react_1.useRef)(new react_native_1.Animated.Value(animationConfig.handler[e].translateX)).current,n=(0,react_1.useRef)(new react_native_1.Animated.Value(animationConfig.handler[e].scale)).current,t=!1,l=(0,react_1.useCallback)(()=>{react_native_1.Animated.parallel([react_native_1.Animated.spring(r,{toValue:animationConfig.handler.on.translateX,useNativeDriver:t,...SPRING_CONFIG}),react_native_1.Animated.spring(n,{toValue:animationConfig.handler.on.scale,useNativeDriver:t,...SPRING_CONFIG}),react_native_1.Animated.spring(a,{toValue:1,useNativeDriver:t,...SPRING_CONFIG})]).start()},[n,r,a,t]),u=(0,react_1.useCallback)(()=>{react_native_1.Animated.parallel([react_native_1.Animated.spring(r,{toValue:animationConfig.handler.off.translateX,useNativeDriver:t,...SPRING_CONFIG}),react_native_1.Animated.spring(n,{toValue:animationConfig.handler.off.scale,useNativeDriver:t,...SPRING_CONFIG}),react_native_1.Animated.spring(a,{toValue:0,useNativeDriver:t,...SPRING_CONFIG})]).start()},[n,r,a,t]);return{backgroundStyle:{backgroundColor:a.interpolate({inputRange:[0,1],outputRange:[i.grey200,i.blue500]})},animatedKnobStyle:{transform:[{translateX:r},{scale:n}]},startSwitchOnAnimation:l,startSwitchOffAnoimation:u}}const animationConfig={handler:{on:{scale:1.5,translateX:20},off:{scale:1,translateX:0}}},SPRING_CONFIG={stiffness:1e3,damping:52};
+"use strict";var __importDefault=function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.useSwitchAnimation=useSwitchAnimation;const tds_colors_1=require("@toss/tds-colors"),hex_to_rgba_1=__importDefault(require("hex-to-rgba")),react_1=require("react"),react_native_1=require("react-native"),core_1=require("../../core");function useSwitchAnimation({animationState:e,disabled:o}){const s=(0,core_1.useAdaptive)(),i=(0,react_1.useMemo)(()=>({grey200:(0,hex_to_rgba_1.default)(s.grey200??tds_colors_1.colors.grey200,react_native_1.Platform.OS==="android"&&o?.3:1),blue500:(0,hex_to_rgba_1.default)(tds_colors_1.colors.blue500,react_native_1.Platform.OS==="android"&&o?.3:1)}),[s.grey200,o]),a=(0,react_1.useRef)(new react_native_1.Animated.Value(e==="on"?1:0)).current,r=(0,react_1.useRef)(new react_native_1.Animated.Value(animationConfig.handler[e].translateX)).current,n=(0,react_1.useRef)(new react_native_1.Animated.Value(animationConfig.handler[e].scale)).current,t=!1,l=(0,react_1.useCallback)(()=>{react_native_1.Animated.parallel([react_native_1.Animated.spring(r,{toValue:animationConfig.handler.on.translateX,useNativeDriver:t,...SPRING_CONFIG}),react_native_1.Animated.spring(n,{toValue:animationConfig.handler.on.scale,useNativeDriver:t,...SPRING_CONFIG}),react_native_1.Animated.spring(a,{toValue:1,useNativeDriver:t,...SPRING_CONFIG})]).start()},[n,r,a,t]),u=(0,react_1.useCallback)(()=>{react_native_1.Animated.parallel([react_native_1.Animated.spring(r,{toValue:animationConfig.handler.off.translateX,useNativeDriver:t,...SPRING_CONFIG}),react_native_1.Animated.spring(n,{toValue:animationConfig.handler.off.scale,useNativeDriver:t,...SPRING_CONFIG}),react_native_1.Animated.spring(a,{toValue:0,useNativeDriver:t,...SPRING_CONFIG})]).start()},[n,r,a,t]);return{backgroundStyle:{backgroundColor:a.interpolate({inputRange:[0,1],outputRange:[i.grey200,i.blue500]})},animatedKnobStyle:{transform:[{translateX:r},{scale:n}]},startSwitchOnAnimation:l,startSwitchOffAnoimation:u}}const animationConfig={handler:{on:{scale:1.5,translateX:20},off:{scale:1,translateX:0}}},SPRING_CONFIG={stiffness:1e3,damping:52};

package/dist/cjs/components/tab/FluidTab.d.ts

@@ -1,3 +1,3 @@
-import type { BaseTabProps } from './type.js';
+import type { BaseTabProps } from './type';
 export type FullTabProps = BaseTabProps;
 export declare function FluidTab({ defaultValue, value: _value, children, onChange: _onChange, style, size, ...viewProps }: FullTabProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/tab/FluidTab.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FluidTab=FluidTab;const jsx_runtime_1=require("react/jsx-runtime"),tds_easings_1=require("@toss/tds-easings"),react_1=require("react"),react_native_1=require("react-native"),index_js_1=require("../../core/index.js"),index_js_2=require("../../interactions/animated/index.js"),index_js_3=require("../../utils/index.js"),IndicatorContext_js_1=require("./IndicatorContext.js"),TabContext_js_1=require("./TabContext.js");function FluidTab({defaultValue:c,value:d,children:u,onChange:n,style:x,size:h="large",...f}){const o=(0,index_js_1.useAdaptive)(),[j,a]=(0,index_js_3.useControlled)({controlledValue:d,defaultValue:c}),b=(0,react_1.useCallback)(r=>{n?.(r),a(r)},[n,a]),[e,w]=(0,react_1.useState)(0),i=(0,react_1.useRef)(new index_js_2.Animated.Value(e)).current,[t,_]=(0,react_1.useState)(0),y={width:t,transform:[{translateX:i}]};(0,react_1.useEffect)(()=>{index_js_2.Animated.spring(i,{toValue:e,useNativeDriver:!0,...tds_easings_1.spring.quick}).start()},[e,i]);const s=(0,react_1.useRef)(null),l=(0,react_1.useRef)(null);(0,react_1.useEffect)(()=>{s.current!=null&&l.current?.scrollTo({x:Math.max(0,e-(s.current-t)/2)})},[e,t]);const m={...styles.border,borderBottomColor:o.grey200};return(0,jsx_runtime_1.jsx)(TabContext_js_1.TabContext.Provider,{value:{fluid:!0,value:j,onChange:b,size:h},children:(0,jsx_runtime_1.jsx)(IndicatorContext_js_1.IndicatorContext.Provider,{value:{width:t,translateX:e,setWidth:_,setTranslateX:w},children:(0,jsx_runtime_1.jsxs)(react_native_1.View,{onLayout:r=>{s.current=r.nativeEvent.layout.width},children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[m,styles.fluidBorder]}),(0,jsx_runtime_1.jsx)(react_native_1.ScrollView,{ref:l,horizontal:!0,showsHorizontalScrollIndicator:!1,alwaysBounceVertical:!1,children:(0,jsx_runtime_1.jsxs)(react_native_1.View,{children:[(0,jsx_runtime_1.jsxs)(react_native_1.View,{style:[styles.itemList,x],accessibilityRole:"tablist",...f,children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.fluidPadding]}),u]}),(0,jsx_runtime_1.jsx)(index_js_2.Animated.View,{style:[{backgroundColor:o.grey800},styles.indicator,y]})]})})]})})})}const styles=react_native_1.StyleSheet.create({fluidPadding:{width:14,height:1},itemList:{flexDirection:"row",width:"100%"},border:{width:"100%",borderBottomWidth:react_native_1.StyleSheet.hairlineWidth},fluidBorder:{position:"absolute",bottom:2},indicator:{height:2,borderRadius:10,bottom:1}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FluidTab=FluidTab;const jsx_runtime_1=require("react/jsx-runtime"),tds_easings_1=require("@toss/tds-easings"),react_1=require("react"),react_native_1=require("react-native"),core_1=require("../../core"),animated_1=require("../../interactions/animated"),utils_1=require("../../utils"),IndicatorContext_1=require("./IndicatorContext"),TabContext_1=require("./TabContext");function FluidTab({defaultValue:c,value:u,children:d,onChange:o,style:h,size:f="large",...x}){const n=(0,core_1.useAdaptive)(),[b,a]=(0,utils_1.useControlled)({controlledValue:u,defaultValue:c}),w=(0,react_1.useCallback)(r=>{o?.(r),a(r)},[o,a]),[e,m]=(0,react_1.useState)(0),i=(0,react_1.useRef)(new animated_1.Animated.Value(e)).current,[t,y]=(0,react_1.useState)(0),V={width:t,transform:[{translateX:i}]};(0,react_1.useEffect)(()=>{animated_1.Animated.spring(i,{toValue:e,useNativeDriver:!0,...tds_easings_1.spring.quick}).start()},[e,i]);const s=(0,react_1.useRef)(null),l=(0,react_1.useRef)(null);(0,react_1.useEffect)(()=>{s.current!=null&&l.current?.scrollTo({x:Math.max(0,e-(s.current-t)/2)})},[e,t]);const v={...styles.border,borderBottomColor:n.grey200};return(0,jsx_runtime_1.jsx)(TabContext_1.TabContext.Provider,{value:{fluid:!0,value:b,onChange:w,size:f},children:(0,jsx_runtime_1.jsx)(IndicatorContext_1.IndicatorContext.Provider,{value:{width:t,translateX:e,setWidth:y,setTranslateX:m},children:(0,jsx_runtime_1.jsxs)(react_native_1.View,{onLayout:r=>{s.current=r.nativeEvent.layout.width},children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[v,styles.fluidBorder]}),(0,jsx_runtime_1.jsx)(react_native_1.ScrollView,{ref:l,horizontal:!0,showsHorizontalScrollIndicator:!1,alwaysBounceVertical:!1,children:(0,jsx_runtime_1.jsxs)(react_native_1.View,{children:[(0,jsx_runtime_1.jsxs)(react_native_1.View,{style:[styles.itemList,h],accessibilityRole:"tablist",...x,children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.fluidPadding]}),d]}),(0,jsx_runtime_1.jsx)(animated_1.Animated.View,{style:[{backgroundColor:n.grey800},styles.indicator,V]})]})})]})})})}const styles=react_native_1.StyleSheet.create({fluidPadding:{width:14,height:1},itemList:{flexDirection:"row",width:"100%"},border:{width:"100%",borderBottomWidth:react_native_1.StyleSheet.hairlineWidth},fluidBorder:{position:"absolute",bottom:2},indicator:{height:2,borderRadius:10,bottom:1}});

package/dist/cjs/components/tab/FullTab.d.ts

@@ -1,3 +1,3 @@
-import type { BaseTabProps } from './type.js';
+import type { BaseTabProps } from './type';
 export type FullTabProps = BaseTabProps;
 export declare function FullTab({ defaultValue, value: _value, children, onChange: _onChange, style, size, ...viewProps }: FullTabProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/tab/FullTab.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FullTab=FullTab;const jsx_runtime_1=require("react/jsx-runtime"),tds_easings_1=require("@toss/tds-easings"),react_1=require("react"),react_native_1=require("react-native"),index_js_1=require("../../core/index.js"),index_js_2=require("../../interactions/animated/index.js"),index_js_3=require("../../utils/index.js"),IndicatorContext_js_1=require("./IndicatorContext.js"),TabContext_js_1=require("./TabContext.js");function FullTab({defaultValue:a,value:l,children:d,onChange:s,style:c,size:u="large",...x}){const r=(0,index_js_1.useAdaptive)(),[h,i]=(0,index_js_3.useControlled)({controlledValue:l,defaultValue:a}),j=(0,react_1.useCallback)(o=>{s?.(o),i(o)},[s,i]),[e,_]=(0,react_1.useState)(0),t=(0,react_1.useRef)(new index_js_2.Animated.Value(e)).current,[n,b]=(0,react_1.useState)(0),w={width:n,transform:[{translateX:t}]};(0,react_1.useEffect)(()=>{index_js_2.Animated.spring(t,{toValue:e,useNativeDriver:!0,...tds_easings_1.spring.quick}).start()},[e,t]);const y={...styles.border,borderBottomColor:r.grey200};return(0,jsx_runtime_1.jsx)(TabContext_js_1.TabContext.Provider,{value:{fluid:!1,value:h,onChange:j,size:u},children:(0,jsx_runtime_1.jsx)(IndicatorContext_js_1.IndicatorContext.Provider,{value:{width:n,translateX:e,setWidth:b,setTranslateX:_},children:(0,jsx_runtime_1.jsx)(react_native_1.View,{children:(0,jsx_runtime_1.jsx)(react_native_1.ScrollView,{horizontal:!1,showsHorizontalScrollIndicator:!1,alwaysBounceVertical:!1,children:(0,jsx_runtime_1.jsxs)(react_native_1.View,{children:[(0,jsx_runtime_1.jsxs)(react_native_1.View,{style:[styles.itemList,c],accessibilityRole:"tablist",...x,children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.padding]}),d,(0,jsx_runtime_1.jsx)(react_native_1.View,{style:styles.padding})]}),(0,jsx_runtime_1.jsx)(react_native_1.View,{style:y}),(0,jsx_runtime_1.jsx)(index_js_2.Animated.View,{style:[{backgroundColor:r.grey800},styles.indicator,w]})]})})})})})}const styles=react_native_1.StyleSheet.create({padding:{width:20,height:1},itemList:{flexDirection:"row",width:"100%"},border:{width:"100%",borderBottomWidth:react_native_1.StyleSheet.hairlineWidth},indicator:{height:2,borderRadius:10,bottom:1}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FullTab=FullTab;const jsx_runtime_1=require("react/jsx-runtime"),tds_easings_1=require("@toss/tds-easings"),react_1=require("react"),react_native_1=require("react-native"),core_1=require("../../core"),animated_1=require("../../interactions/animated"),utils_1=require("../../utils"),IndicatorContext_1=require("./IndicatorContext"),TabContext_1=require("./TabContext");function FullTab({defaultValue:o,value:l,children:c,onChange:r,style:d,size:u="large",...h}){const i=(0,core_1.useAdaptive)(),[x,s]=(0,utils_1.useControlled)({controlledValue:l,defaultValue:o}),b=(0,react_1.useCallback)(n=>{r?.(n),s(n)},[r,s]),[e,w]=(0,react_1.useState)(0),t=(0,react_1.useRef)(new animated_1.Animated.Value(e)).current,[a,y]=(0,react_1.useState)(0),g={width:a,transform:[{translateX:t}]};(0,react_1.useEffect)(()=>{animated_1.Animated.spring(t,{toValue:e,useNativeDriver:!0,...tds_easings_1.spring.quick}).start()},[e,t]);const m={...styles.border,borderBottomColor:i.grey200};return(0,jsx_runtime_1.jsx)(TabContext_1.TabContext.Provider,{value:{fluid:!1,value:x,onChange:b,size:u},children:(0,jsx_runtime_1.jsx)(IndicatorContext_1.IndicatorContext.Provider,{value:{width:a,translateX:e,setWidth:y,setTranslateX:w},children:(0,jsx_runtime_1.jsx)(react_native_1.View,{children:(0,jsx_runtime_1.jsx)(react_native_1.ScrollView,{horizontal:!1,showsHorizontalScrollIndicator:!1,alwaysBounceVertical:!1,children:(0,jsx_runtime_1.jsxs)(react_native_1.View,{children:[(0,jsx_runtime_1.jsxs)(react_native_1.View,{style:[styles.itemList,d],accessibilityRole:"tablist",...h,children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.padding]}),c,(0,jsx_runtime_1.jsx)(react_native_1.View,{style:styles.padding})]}),(0,jsx_runtime_1.jsx)(react_native_1.View,{style:m}),(0,jsx_runtime_1.jsx)(animated_1.Animated.View,{style:[{backgroundColor:i.grey800},styles.indicator,g]})]})})})})})}const styles=react_native_1.StyleSheet.create({padding:{width:20,height:1},itemList:{flexDirection:"row",width:"100%"},border:{width:"100%",borderBottomWidth:react_native_1.StyleSheet.hairlineWidth},indicator:{height:2,borderRadius:10,bottom:1}});