@toss/tds-react-native 1.3.0 → 1.3.2

package/dist/esm/components/bottom-sheet/Header.js

@@ -1 +1 @@
-"use strict";import{jsx as e}from"react/jsx-runtime";import{memo as r}from"react";import{Txt as i}from"../txt";import{StyleSheet as m}from"react-native";import{useAdaptive as n}from"../../core";export const BottomSheetHeader=r(function({children:t}){const o=n();return e(i,{typography:"t4",color:o.grey900,style:a.container,fontWeight:"bold",children:t})});const a=m.create({container:{paddingLeft:24,paddingRight:16,marginTop:4}});
+"use strict";import{jsx as e}from"react/jsx-runtime";import{memo as r}from"react";import{Txt as i}from"../txt/index.js";import{StyleSheet as m}from"react-native";import{useAdaptive as n}from"../../core/index.js";export const BottomSheetHeader=r(function({children:t}){const o=n();return e(i,{typography:"t4",color:o.grey900,style:a.container,fontWeight:"bold",children:t})});const a=m.create({container:{paddingLeft:24,paddingRight:16,marginTop:4}});

package/dist/esm/components/bottom-sheet/HeaderContainer.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 interface Props {
     children: ReactNode;
 }

package/dist/esm/components/bottom-sheet/HeaderDescription.js

@@ -1 +1 @@
-"use strict";import{jsx as e}from"react/jsx-runtime";import{useAdaptive as r}from"../../core";import{Txt as i}from"../txt";import{memo as n}from"react";import{StyleSheet as p}from"react-native";export const BottomSheetHeaderDescription=n(function({children:t}){const o=r();return e(i,{typography:"t6",color:o.grey600,style:a.container,fontWeight:"regular",children:t})});const a=p.create({container:{paddingTop:8,paddingRight:44,paddingBottom:0,paddingLeft:24}});
+"use strict";import{jsx as e}from"react/jsx-runtime";import{useAdaptive as r}from"../../core/index.js";import{Txt as i}from"../txt/index.js";import{memo as n}from"react";import{StyleSheet as p}from"react-native";export const BottomSheetHeaderDescription=n(function({children:t}){const o=r();return e(i,{typography:"t6",color:o.grey600,style:a.container,fontWeight:"regular",children:t})});const a=p.create({container:{paddingTop:8,paddingRight:44,paddingBottom:0,paddingLeft:24}});

package/dist/esm/components/bottom-sheet/Root.d.ts

@@ -1,5 +1,6 @@
-import React, { ComponentType, ReactNode } from 'react';
-import { StyleProp, ViewStyle } from 'react-native';
+import type { ComponentType, ReactNode } from 'react';
+import React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
 export interface RootProps<WrapperProps> {
     open: boolean;
     header?: ReactNode;

package/dist/esm/components/bottom-sheet/Root.js

@@ -1 +1 @@
-"use strict";import{jsx as o,jsxs as r}from"react/jsx-runtime";import{ScrollView as k}from"@granite-js/native/react-native-gesture-handler";import{Children as T,useCallback as s,useEffect as _,useMemo as F,useRef as I}from"react";import{Keyboard as M,View as p}from"react-native";import{useHideAccessibility as V}from"../../core/contexts/HideAccessibility";import{useFontScaleCondition as K}from"../../core/index";import{a11yCondition as P}from"./const";import{BottomSheetContainer as U}from"./Container";import{BottomSheetDimmer as q}from"./Dimmer";import{BottomSheetHandle as z}from"./Handle";import{BottomSheetHeaderContainer as G}from"./HeaderContainer";import{BottomSheetRenderingAnimation as c}from"./utils/RenderingAnimation";export function BottomSheetRoot({open:e,header:t,headerDescription:n,cta:y,disableDimmer:D=!1,children:S,onDimmerClick:b,onClose:d,onExited:C,style:x,wrapper:A=k,wrapperProps:B,a11yIncludeHeaderInScroll:j=!0,unstable_disableDragging:v=!1}){const i=V(),l=I(null),m=s(()=>{M.dismiss(),d?.()},[d]),w=s(()=>{l.current?.darken()},[]),E=s(()=>{l.current?.lighten(.5)},[]),u=s(()=>{l.current?.reset()},[]),H=t!=null?30:0,R=F(()=>[t,n].filter(a=>a!=null).length*30,[t,n]),f=K(P.root)&&j,g=t!=null||n!=null?r(G,{children:[o(c,{children:t}),o(c,{delay:H,children:n})]}):null;return _(()=>(e?i.activate():i.inactivate(),i.inactivate),[i,e]),r(p,{style:{position:"absolute",top:0,left:0,right:0,bottom:0},pointerEvents:e?"auto":"none",onAccessibilityEscape:()=>{m?.()},children:[D?null:o(q,{ref:l,open:e,onPress:()=>{m?.(),b?.()}}),r(U,{open:e,onExited:C,onDraggedUp:w,onDraggedMiddle:u,onDraggedDown:E,onDragToClose:m,onDragFinished:u,style:x,unstable_disableDragging:v,children:[r(p,{children:[o(z,{}),!f&&g]}),r(A,{...B,children:[f&&g,T.map(S,(a,h)=>o(c,{delay:R+h*30,children:a},h))]}),y]})]})}
+"use strict";import{jsx as o,jsxs as r}from"react/jsx-runtime";import{ScrollView as k}from"@granite-js/native/react-native-gesture-handler";import{Children as T,useCallback as s,useEffect as _,useMemo as F,useRef as I}from"react";import{Keyboard as M,View as p}from"react-native";import{useHideAccessibility as V}from"../../core/contexts/HideAccessibility.js";import{useFontScaleCondition as K}from"../../core/index.js";import{a11yCondition as P}from"./const.js";import{BottomSheetContainer as U}from"./Container.js";import{BottomSheetDimmer as q}from"./Dimmer.js";import{BottomSheetHandle as z}from"./Handle.js";import{BottomSheetHeaderContainer as G}from"./HeaderContainer.js";import{BottomSheetRenderingAnimation as c}from"./utils/RenderingAnimation.js";export function BottomSheetRoot({open:e,header:t,headerDescription:n,cta:y,disableDimmer:D=!1,children:S,onDimmerClick:b,onClose:d,onExited:C,style:x,wrapper:A=k,wrapperProps:B,a11yIncludeHeaderInScroll:j=!0,unstable_disableDragging:v=!1}){const i=V(),l=I(null),m=s(()=>{M.dismiss(),d?.()},[d]),w=s(()=>{l.current?.darken()},[]),E=s(()=>{l.current?.lighten(.5)},[]),u=s(()=>{l.current?.reset()},[]),H=t!=null?30:0,R=F(()=>[t,n].filter(a=>a!=null).length*30,[t,n]),f=K(P.root)&&j,g=t!=null||n!=null?r(G,{children:[o(c,{children:t}),o(c,{delay:H,children:n})]}):null;return _(()=>(e?i.activate():i.inactivate(),i.inactivate),[i,e]),r(p,{style:{position:"absolute",top:0,left:0,right:0,bottom:0},pointerEvents:e?"auto":"none",onAccessibilityEscape:()=>{m?.()},children:[D?null:o(q,{ref:l,open:e,onPress:()=>{m?.(),b?.()}}),r(U,{open:e,onExited:C,onDraggedUp:w,onDraggedMiddle:u,onDraggedDown:E,onDragToClose:m,onDragFinished:u,style:x,unstable_disableDragging:v,children:[r(p,{children:[o(z,{}),!f&&g]}),r(A,{...B,children:[f&&g,T.map(S,(a,h)=>o(c,{delay:R+h*30,children:a},h))]}),y]})]})}

package/dist/esm/components/bottom-sheet/Select.js

@@ -1 +1 @@
-"use strict";import{jsx as t,jsxs as h}from"react/jsx-runtime";import{Checkbox as f}from"../checkbox";import{useAdaptive as u}from"../../core";import{PressableEffect as y}from"../../interactions/pressable-effect";import{Txt as b}from"../txt";import{StyleSheet as p,View as s}from"react-native";import{BottomSheetRenderingAnimation as x}from"./utils/RenderingAnimation";export function BottomSheetSelect({options:n,value:a,animation:d,animationDelay:l=0,onChange:c}){const o=u();return t(s,{children:n.map((e,m)=>{const i=e.value===a,r=t(y,{accessibilityState:{selected:i},disabled:e.disabled,onPress:()=>{c(e.value)},children:h(s,{style:g.itemContainer,children:[t(b,{color:o.grey700,typography:"t5",fontWeight:"medium",children:e.name}),!e.hideUnCheckedCheckBox||i?t(f.Line,{importantForAccessibility:"no-hide-descendants",accessibilityElementsHidden:!0,checked:i,disabled:e.disabled,size:24,style:{width:24,height:24}}):null]})},e.value);return d?t(x,{delay:l+30*m,children:r},e.value):r})})}const g=p.create({itemContainer:{display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center",paddingVertical:16,paddingHorizontal:24,borderRadius:12}});
+"use strict";import{jsx as t,jsxs as h}from"react/jsx-runtime";import{Checkbox as f}from"../checkbox/index.js";import{useAdaptive as u}from"../../core/index.js";import{PressableEffect as y}from"../../interactions/pressable-effect/index.js";import{Txt as b}from"../txt/index.js";import{StyleSheet as p,View as s}from"react-native";import{BottomSheetRenderingAnimation as x}from"./utils/RenderingAnimation.js";export function BottomSheetSelect({options:n,value:a,animation:d,animationDelay:l=0,onChange:c}){const o=u();return t(s,{children:n.map((e,m)=>{const i=e.value===a,r=t(y,{accessibilityState:{selected:i},disabled:e.disabled,onPress:()=>{c(e.value)},children:h(s,{style:g.itemContainer,children:[t(b,{color:o.grey700,typography:"t5",fontWeight:"medium",children:e.name}),!e.hideUnCheckedCheckBox||i?t(f.Line,{importantForAccessibility:"no-hide-descendants",accessibilityElementsHidden:!0,checked:i,disabled:e.disabled,size:24,style:{width:24,height:24}}):null]})},e.value);return d?t(x,{delay:l+30*m,children:r},e.value):r})})}const g=p.create({itemContainer:{display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center",paddingVertical:16,paddingHorizontal:24,borderRadius:12}});

package/dist/esm/components/bottom-sheet/const.d.ts

@@ -1,2 +1,2 @@
-import { A11yCondition } from '../../core/index';
+import type { A11yCondition } from '../../core/index.js';
 export declare const a11yCondition: Record<'root', A11yCondition>;

package/dist/esm/components/bottom-sheet/index.d.ts

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

package/dist/esm/components/bottom-sheet/index.js

@@ -1 +1 @@
-"use strict";export{BottomSheet}from"./BottomSheet";
+"use strict";export{BottomSheet}from"./BottomSheet.js";

package/dist/esm/components/bottom-sheet/types.d.ts

@@ -1,6 +1,6 @@
-import { SingleCTAProps, DoubleCTAProps } from './CTA';
-import { HeaderProps } from './Header';
-import { HeaderDescriptionProps } from './HeaderDescription';
-import { RootProps } from './Root';
-import { SelectProps } from './Select';
+import type { SingleCTAProps, DoubleCTAProps } from './CTA/index.js';
+import type { HeaderProps } from './Header.js';
+import type { HeaderDescriptionProps } from './HeaderDescription.js';
+import type { RootProps } from './Root.js';
+import type { SelectProps } from './Select.js';
 export type { SingleCTAProps, DoubleCTAProps, HeaderProps, HeaderDescriptionProps, RootProps, SelectProps };

package/dist/esm/components/bottom-sheet/utils/CTAAnimation.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
-import { StyleProp, ViewStyle } from 'react-native';
+import type { ReactNode } from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
 interface Props {
     children: ReactNode;
     style?: StyleProp<ViewStyle>;

package/dist/esm/components/bottom-sheet/utils/GestureBoundary.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 interface Props {
     children: ReactNode;
 }

package/dist/esm/components/bottom-sheet/utils/RenderingAnimation.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 interface Props {
     delay?: number;
     children: ReactNode;

package/dist/esm/components/button/Button.d.ts

@@ -1,5 +1,6 @@
-import { ReactNode } from 'react';
-import { PressableProps, StyleProp, TextStyle, View, ViewProps, ViewStyle } from 'react-native';
+import type { ReactNode } from 'react';
+import type { PressableProps, StyleProp, TextStyle, ViewProps, ViewStyle } from 'react-native';
+import { View } from 'react-native';
 export interface ButtonProps extends Omit<PressableProps, 'style'> {
     /**
      * `Button` 컴포넌트 내부에 표시될 내용을 지정해요.

package/dist/esm/components/button/Button.js

@@ -1 +1 @@
-"use strict";import{jsx as d,jsxs as x}from"react/jsx-runtime";import{colors as W}from"@toss/tds-colors";import{bezier as S,spring as t}from"@toss/tds-easings";import{Children as L,forwardRef as F,Fragment as _,useCallback as A,useEffect as M,useMemo as v,useState as J}from"react";import{Easing as b,Pressable as K,StyleSheet as B,useAnimatedValue as m,View as Q}from"react-native";import{ThemeProvider as U,useTheme as X}from"../../core/index";import{Animated as e}from"../../interactions/animated/index";import{RadialGradient as Y}from"../gradient/index";import{Txt as Z}from"../txt";const $=F(function({children:a,onPress:i,size:o="big",style:u="fill",display:c="inline",disabled:l=!1,loading:n=!1,viewStyle:s,color:g,containerStyle:C,textStyle:N,pointerEvents:q=void 0,leftAccessory:w,onPressIn:V,onPressOut:z,...O},E){const f=X(),D=re(),k=u==="weak"?{backgroundColor:f.token.button.backgroundWeakColor,textColor:f.token.button.textWeakColor,dimColor:f.token.button.dimWeakColor,gradientStartColor:f.token.button.gradientStartWeakColor,gradientEndColor:f.token.button.gradientEndWeakColor,loaderColor:f.token.button.loaderWeakColor}:{backgroundColor:f.token.button.backgroundFillColor,textColor:f.token.button.textFillColor,dimColor:f.token.button.dimFillColor,gradientStartColor:f.token.button.gradientStartFillColor,gradientEndColor:f.token.button.gradientEndFillColor,loaderColor:f.token.button.loaderFillColor},h=!(l||n),[H,j]=J(!1),I=A(y=>{V?.(y),h!==!1&&j(!0)},[V,h]),P=A(y=>{z?.(y),h!==!1&&j(!1)},[z,h]),p=ie({style:u,display:c});M(()=>{if(H){p.controller.pressed.start();return}if(n&&D.controller.loader.start(),n&&l){p.controller.loadingWhileDisabled.start();return}if(n&&!l){p.controller.loading.start();return}if(!n&&l){p.controller.disabled.start();return}p.controller.default.start()},[n,l,p.controller,D.controller,H]);const T=L.map(a,(y,G)=>typeof y=="string"||typeof y=="number"?d(Z,{typography:oe[o],color:g??k.textColor,style:N,fontWeight:"semibold",children:y}):d(_,{children:y},G));return d(K,{accessibilityRole:"button",onPress:h?i:void 0,pointerEvents:q,onPressIn:I,onPressOut:P,style:[ee[c],s],ref:E,...O,accessibilityState:{disabled:l,...O.accessibilityState},children:x(e.View,{ref:E,style:[containerStylesBySize.base,containerStylesBySize[o],te[c],p.style.container,C],children:[d(e.View,{style:[{position:"absolute",top:0,left:0,right:0,bottom:0},{backgroundColor:k.backgroundColor},p.style.background]}),x(e.View,{style:[{flexDirection:"row",alignItems:"center"},p.style.text],children:[w,T]}),d(e.View,{style:[{position:"absolute",top:0,left:0,right:0,bottom:0,justifyContent:"center",alignItems:"center"},p.style.gradient],children:d(Q,{style:{width:"110%",aspectRatio:1},children:d(Y,{colors:[k.gradientStartColor,k.gradientEndColor]})})}),d(e.View,{style:[{position:"absolute",top:0,left:0,right:0,bottom:0,justifyContent:"center",alignItems:"center"},p.style.loader],children:x(e.View,{style:{flexDirection:"row",gap:7},children:[d(e.View,{style:[{width:8,height:8,backgroundColor:k.loaderColor,borderRadius:99},D.style.loader1]}),d(e.View,{style:[{width:8,height:8,backgroundColor:k.loaderColor,borderRadius:99},D.style.loader2]}),d(e.View,{style:[{width:8,height:8,backgroundColor:k.loaderColor,borderRadius:99},D.style.loader3]})]})}),d(e.View,{style:[{position:"absolute",top:0,left:0,right:0,bottom:0},{backgroundColor:k.dimColor},p.style.dim]})]})})});export const containerStylesBySize=B.create({base:{alignItems:"center",justifyContent:"center",overflow:"hidden",position:"relative"},tiny:{paddingHorizontal:10,paddingVertical:2,minHeight:32,minWidth:52,borderRadius:8},medium:{paddingHorizontal:16,paddingVertical:2,minHeight:38,minWidth:64,borderRadius:10},large:{paddingHorizontal:16,paddingVertical:2,minHeight:48,minWidth:80,borderRadius:14},big:{paddingHorizontal:28,paddingVertical:2,minHeight:56,minWidth:96,borderRadius:16}});const ee=B.create({inline:{alignSelf:"flex-start"},block:{},full:{}}),te=B.create({inline:{},block:{},full:{borderRadius:0}});function R(){const r=m(.2),a=m(.8),i=A(()=>e.parallel([e.loop(e.sequence([e.timing(r,{toValue:1,duration:300,easing:b.linear,useNativeDriver:!1}),e.timing(r,{toValue:.2,duration:300,easing:b.linear,useNativeDriver:!1})])),e.loop(e.sequence([e.timing(a,{toValue:1,duration:300,easing:b.linear,useNativeDriver:!1}),e.timing(a,{toValue:.8,duration:300,easing:b.linear,useNativeDriver:!1})]))]),[r,a]);return v(()=>({style:{loader:{opacity:r,transform:[{scale:a}]}},controller:{create:i}}),[r,a,i])}function re(){const r=R(),a=R(),i=R(),o=v(()=>e.parallel([e.sequence([r.controller.create()]),e.sequence([e.delay(100),a.controller.create()]),e.sequence([e.delay(200),i.controller.create()])]),[r.controller,a.controller,i.controller]);return v(()=>({style:{loader1:r.style.loader,loader2:a.style.loader,loader3:i.style.loader},controller:{loader:{...o,start:()=>{o.reset(),o.start()}}}}),[r.style.loader,a.style.loader,i.style.loader,o])}function ie({style:r,display:a}){const i=m(1),o=m(1),u=m(1),c=m(1),l=m(1),n=m(0),s=m(0),g=m(0),C=v(()=>e.parallel([e.spring(n,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(u,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(s,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(c,{toValue:1,...t.quick,delay:100,useNativeDriver:!1}),e.spring(g,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(i,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(o,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(l,{toValue:1,...t.quick,useNativeDriver:!1})]),[u,i,o,n,s,g,c,l]),N=v(()=>e.parallel([e.spring(n,{toValue:.26,...t.quick,useNativeDriver:!1}),e.spring(u,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(s,{toValue:0,...t.quick,useNativeDriver:!1}),a==="inline"?e.spring(o,{toValue:.96,...t.rapid,useNativeDriver:!1}):e.spring(l,{toValue:.96,...t.rapid,useNativeDriver:!1})]),[u,o,n,a,s,l]),q=v(()=>(s.setValue(0),e.parallel([e.spring(n,{toValue:.13,...t.quick,useNativeDriver:!1}),e.spring(u,{toValue:1,...t.quick,useNativeDriver:!1}),e.loop(e.sequence([e.timing(s,{toValue:r==="fill"?.7:.24,easing:b.bezier(...S.out),duration:600,useNativeDriver:!1}),e.timing(s,{toValue:0,easing:b.bezier(...S.out),duration:600,useNativeDriver:!1})])),e.spring(c,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(g,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(i,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(o,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(l,{toValue:1,...t.quick,useNativeDriver:!1})])),[u,i,o,n,s,g,r,c,l]),w=v(()=>(s.setValue(0),e.parallel([e.spring(n,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(u,{toValue:r==="fill"?.26:1,...t.quick,useNativeDriver:!1}),e.loop(e.sequence([e.timing(s,{toValue:r==="fill"?.2:.14,easing:b.bezier(...S.out),duration:600,useNativeDriver:!1}),e.timing(s,{toValue:0,easing:b.bezier(...S.out),duration:600,useNativeDriver:!1})])),e.spring(c,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(g,{toValue:r==="fill"?.7:.3,...t.quick,useNativeDriver:!1}),e.spring(i,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(o,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(l,{toValue:1,...t.quick,useNativeDriver:!1})])),[u,i,o,n,s,g,r,c,l]),V=v(()=>e.parallel([e.spring(n,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(u,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(s,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(c,{toValue:r==="fill"?1:.38,...t.quick,delay:100,useNativeDriver:!1}),e.spring(g,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(i,{toValue:r==="fill"?.26:1,...t.quick,useNativeDriver:!1}),e.spring(o,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(l,{toValue:1,...t.quick,useNativeDriver:!1})]),[u,i,o,n,s,g,r,c,l]);return v(()=>({style:{container:{opacity:i,transform:[{scale:o}]},background:{opacity:u},text:{opacity:c,transform:[{scale:l}]},dim:{opacity:n},gradient:{opacity:s},loader:{opacity:g}},controller:{default:C,pressed:N,loading:q,loadingWhileDisabled:w,disabled:V}}),[u,i,o,C,n,V,s,g,q,w,N,c,l])}const oe={tiny:"t7",medium:"t6",large:"st9",big:"st9"},ae={danger:W.red500,light:W.whiteOpacity900,dark:W.grey700};export const Button=F(function({type:a,...i},o){const u=v(()=>a===void 0||a==="primary"?{}:{color:{primary:ae[a]}},[a]);return d(U,{token:u,children:d($,{...i,ref:o})})});
+"use strict";import{jsx as d,jsxs as x}from"react/jsx-runtime";import{colors as W}from"@toss/tds-colors";import{bezier as S,spring as t}from"@toss/tds-easings";import{Children as L,forwardRef as F,Fragment as _,useCallback as A,useEffect as M,useMemo as v,useState as J}from"react";import{Easing as b,Pressable as K,StyleSheet as B,useAnimatedValue as m,View as Q}from"react-native";import{ThemeProvider as U,useTheme as X}from"../../core/index.js";import{Animated as e}from"../../interactions/animated/index.js";import{RadialGradient as Y}from"../gradient/index.js";import{Txt as Z}from"../txt/index.js";const $=F(function({children:a,onPress:i,size:o="big",style:u="fill",display:c="inline",disabled:l=!1,loading:n=!1,viewStyle:s,color:g,containerStyle:C,textStyle:N,pointerEvents:q=void 0,leftAccessory:w,onPressIn:V,onPressOut:z,...O},E){const f=X(),D=re(),k=u==="weak"?{backgroundColor:f.token.button.backgroundWeakColor,textColor:f.token.button.textWeakColor,dimColor:f.token.button.dimWeakColor,gradientStartColor:f.token.button.gradientStartWeakColor,gradientEndColor:f.token.button.gradientEndWeakColor,loaderColor:f.token.button.loaderWeakColor}:{backgroundColor:f.token.button.backgroundFillColor,textColor:f.token.button.textFillColor,dimColor:f.token.button.dimFillColor,gradientStartColor:f.token.button.gradientStartFillColor,gradientEndColor:f.token.button.gradientEndFillColor,loaderColor:f.token.button.loaderFillColor},h=!(l||n),[H,j]=J(!1),I=A(y=>{V?.(y),h!==!1&&j(!0)},[V,h]),P=A(y=>{z?.(y),h!==!1&&j(!1)},[z,h]),p=ie({style:u,display:c});M(()=>{if(H){p.controller.pressed.start();return}if(n&&D.controller.loader.start(),n&&l){p.controller.loadingWhileDisabled.start();return}if(n&&!l){p.controller.loading.start();return}if(!n&&l){p.controller.disabled.start();return}p.controller.default.start()},[n,l,p.controller,D.controller,H]);const T=L.map(a,(y,G)=>typeof y=="string"||typeof y=="number"?d(Z,{typography:oe[o],color:g??k.textColor,style:N,fontWeight:"semibold",children:y}):d(_,{children:y},G));return d(K,{accessibilityRole:"button",onPress:h?i:void 0,pointerEvents:q,onPressIn:I,onPressOut:P,style:[ee[c],s],ref:E,...O,accessibilityState:{disabled:l,...O.accessibilityState},children:x(e.View,{ref:E,style:[containerStylesBySize.base,containerStylesBySize[o],te[c],p.style.container,C],children:[d(e.View,{style:[{position:"absolute",top:0,left:0,right:0,bottom:0},{backgroundColor:k.backgroundColor},p.style.background]}),x(e.View,{style:[{flexDirection:"row",alignItems:"center"},p.style.text],children:[w,T]}),d(e.View,{style:[{position:"absolute",top:0,left:0,right:0,bottom:0,justifyContent:"center",alignItems:"center"},p.style.gradient],children:d(Q,{style:{width:"110%",aspectRatio:1},children:d(Y,{colors:[k.gradientStartColor,k.gradientEndColor]})})}),d(e.View,{style:[{position:"absolute",top:0,left:0,right:0,bottom:0,justifyContent:"center",alignItems:"center"},p.style.loader],children:x(e.View,{style:{flexDirection:"row",gap:7},children:[d(e.View,{style:[{width:8,height:8,backgroundColor:k.loaderColor,borderRadius:99},D.style.loader1]}),d(e.View,{style:[{width:8,height:8,backgroundColor:k.loaderColor,borderRadius:99},D.style.loader2]}),d(e.View,{style:[{width:8,height:8,backgroundColor:k.loaderColor,borderRadius:99},D.style.loader3]})]})}),d(e.View,{style:[{position:"absolute",top:0,left:0,right:0,bottom:0},{backgroundColor:k.dimColor},p.style.dim]})]})})});export const containerStylesBySize=B.create({base:{alignItems:"center",justifyContent:"center",overflow:"hidden",position:"relative"},tiny:{paddingHorizontal:10,paddingVertical:2,minHeight:32,minWidth:52,borderRadius:8},medium:{paddingHorizontal:16,paddingVertical:2,minHeight:38,minWidth:64,borderRadius:10},large:{paddingHorizontal:16,paddingVertical:2,minHeight:48,minWidth:80,borderRadius:14},big:{paddingHorizontal:28,paddingVertical:2,minHeight:56,minWidth:96,borderRadius:16}});const ee=B.create({inline:{alignSelf:"flex-start"},block:{},full:{}}),te=B.create({inline:{},block:{},full:{borderRadius:0}});function R(){const r=m(.2),a=m(.8),i=A(()=>e.parallel([e.loop(e.sequence([e.timing(r,{toValue:1,duration:300,easing:b.linear,useNativeDriver:!1}),e.timing(r,{toValue:.2,duration:300,easing:b.linear,useNativeDriver:!1})])),e.loop(e.sequence([e.timing(a,{toValue:1,duration:300,easing:b.linear,useNativeDriver:!1}),e.timing(a,{toValue:.8,duration:300,easing:b.linear,useNativeDriver:!1})]))]),[r,a]);return v(()=>({style:{loader:{opacity:r,transform:[{scale:a}]}},controller:{create:i}}),[r,a,i])}function re(){const r=R(),a=R(),i=R(),o=v(()=>e.parallel([e.sequence([r.controller.create()]),e.sequence([e.delay(100),a.controller.create()]),e.sequence([e.delay(200),i.controller.create()])]),[r.controller,a.controller,i.controller]);return v(()=>({style:{loader1:r.style.loader,loader2:a.style.loader,loader3:i.style.loader},controller:{loader:{...o,start:()=>{o.reset(),o.start()}}}}),[r.style.loader,a.style.loader,i.style.loader,o])}function ie({style:r,display:a}){const i=m(1),o=m(1),u=m(1),c=m(1),l=m(1),n=m(0),s=m(0),g=m(0),C=v(()=>e.parallel([e.spring(n,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(u,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(s,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(c,{toValue:1,...t.quick,delay:100,useNativeDriver:!1}),e.spring(g,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(i,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(o,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(l,{toValue:1,...t.quick,useNativeDriver:!1})]),[u,i,o,n,s,g,c,l]),N=v(()=>e.parallel([e.spring(n,{toValue:.26,...t.quick,useNativeDriver:!1}),e.spring(u,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(s,{toValue:0,...t.quick,useNativeDriver:!1}),a==="inline"?e.spring(o,{toValue:.96,...t.rapid,useNativeDriver:!1}):e.spring(l,{toValue:.96,...t.rapid,useNativeDriver:!1})]),[u,o,n,a,s,l]),q=v(()=>(s.setValue(0),e.parallel([e.spring(n,{toValue:.13,...t.quick,useNativeDriver:!1}),e.spring(u,{toValue:1,...t.quick,useNativeDriver:!1}),e.loop(e.sequence([e.timing(s,{toValue:r==="fill"?.7:.24,easing:b.bezier(...S.out),duration:600,useNativeDriver:!1}),e.timing(s,{toValue:0,easing:b.bezier(...S.out),duration:600,useNativeDriver:!1})])),e.spring(c,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(g,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(i,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(o,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(l,{toValue:1,...t.quick,useNativeDriver:!1})])),[u,i,o,n,s,g,r,c,l]),w=v(()=>(s.setValue(0),e.parallel([e.spring(n,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(u,{toValue:r==="fill"?.26:1,...t.quick,useNativeDriver:!1}),e.loop(e.sequence([e.timing(s,{toValue:r==="fill"?.2:.14,easing:b.bezier(...S.out),duration:600,useNativeDriver:!1}),e.timing(s,{toValue:0,easing:b.bezier(...S.out),duration:600,useNativeDriver:!1})])),e.spring(c,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(g,{toValue:r==="fill"?.7:.3,...t.quick,useNativeDriver:!1}),e.spring(i,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(o,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(l,{toValue:1,...t.quick,useNativeDriver:!1})])),[u,i,o,n,s,g,r,c,l]),V=v(()=>e.parallel([e.spring(n,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(u,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(s,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(c,{toValue:r==="fill"?1:.38,...t.quick,delay:100,useNativeDriver:!1}),e.spring(g,{toValue:0,...t.quick,useNativeDriver:!1}),e.spring(i,{toValue:r==="fill"?.26:1,...t.quick,useNativeDriver:!1}),e.spring(o,{toValue:1,...t.quick,useNativeDriver:!1}),e.spring(l,{toValue:1,...t.quick,useNativeDriver:!1})]),[u,i,o,n,s,g,r,c,l]);return v(()=>({style:{container:{opacity:i,transform:[{scale:o}]},background:{opacity:u},text:{opacity:c,transform:[{scale:l}]},dim:{opacity:n},gradient:{opacity:s},loader:{opacity:g}},controller:{default:C,pressed:N,loading:q,loadingWhileDisabled:w,disabled:V}}),[u,i,o,C,n,V,s,g,q,w,N,c,l])}const oe={tiny:"t7",medium:"t6",large:"st9",big:"st9"},ae={danger:W.red500,light:W.whiteOpacity900,dark:W.grey700};export const Button=F(function({type:a,...i},o){const u=v(()=>a===void 0||a==="primary"?{}:{color:{primary:ae[a]}},[a]);return d(U,{token:u,children:d($,{...i,ref:o})})});

package/dist/esm/components/button/index.d.ts

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

package/dist/esm/components/button/index.js

@@ -1 +1 @@
-"use strict";export{Button}from"./Button";
+"use strict";export{Button}from"./Button.js";

package/dist/esm/components/carousel/Carousel.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
-import { CarouselItem } from './CarouselItem';
+import type { ReactNode } from 'react';
+import { CarouselItem } from './CarouselItem.js';
 interface Props {
     children: ReactNode[];
     /** 캐러셀 아이템의 너비 */

package/dist/esm/components/carousel/Carousel.js

@@ -1 +1 @@
-"use strict";import{jsx as e,Fragment as g,jsxs as h}from"react/jsx-runtime";import{Gesture as y,GestureDetector as j}from"@granite-js/native/react-native-gesture-handler";import{Stack as C}from"@granite-js/react-native";import{Children as u,isValidElement as c,useMemo as A}from"react";import{Animated as I,View as w}from"react-native";import{useSnapAnimation as S}from"./animations/snap";import{CarouselItem as V}from"./CarouselItem";export function Carousel({children:o,itemWidth:n=280,itemGap:i=12,padding:m=24,renderIndicators:f}){const a=u.toArray(o).filter(t=>c(t)).length,r=A(()=>({itemsCount:a,itemGap:i,itemWidth:n,padding:m}),[i,n,a,m]),s=S(r),p=y.Simultaneous(s.gesture),x={transform:[...s.transforms]},l=u.toArray(o).filter(t=>c(t)).map((t,d)=>e(w,{style:{width:r.itemWidth},children:t},d));return h(g,{children:[e(j,{gesture:p,children:e(I.View,{style:x,children:e(C.Horizontal,{gutter:r.itemGap,align:"flex-start",justify:"center",children:l})})}),f?.({activeIndex:s.activeIndex,itemsCount:l.length})]})}Carousel.Item=V;
+"use strict";import{jsx as e,Fragment as g,jsxs as h}from"react/jsx-runtime";import{Gesture as y,GestureDetector as j}from"@granite-js/native/react-native-gesture-handler";import{Stack as C}from"@granite-js/react-native";import{Children as u,isValidElement as c,useMemo as A}from"react";import{Animated as I,View as w}from"react-native";import{useSnapAnimation as S}from"./animations/snap.js";import{CarouselItem as V}from"./CarouselItem.js";export function Carousel({children:o,itemWidth:n=280,itemGap:i=12,padding:m=24,renderIndicators:f}){const a=u.toArray(o).filter(t=>c(t)).length,r=A(()=>({itemsCount:a,itemGap:i,itemWidth:n,padding:m}),[i,n,a,m]),s=S(r),p=y.Simultaneous(s.gesture),x={transform:[...s.transforms]},l=u.toArray(o).filter(t=>c(t)).map((t,d)=>e(w,{style:{width:r.itemWidth},children:t},d));return h(g,{children:[e(j,{gesture:p,children:e(I.View,{style:x,children:e(C.Horizontal,{gutter:r.itemGap,align:"flex-start",justify:"center",children:l})})}),f?.({activeIndex:s.activeIndex,itemsCount:l.length})]})}Carousel.Item=V;

package/dist/esm/components/carousel/CarouselItem.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 interface Props {
     children: ReactNode;
 }

package/dist/esm/components/carousel/animations/scale.d.ts

@@ -1,6 +1,6 @@
 import { Animated } from 'react-native';
 export declare function useTapScaleAnimation(): {
-    gesture: import("react-native-gesture-handler/lib/typescript/handlers/gestures/panGesture").PanGesture;
+    gesture: import("react-native-gesture-handler/lib/typescript/handlers/gestures/panGesture.js").PanGesture;
     transforms: ({
         scaleX: Animated.Value;
         scaleY?: undefined;

package/dist/esm/components/carousel/animations/snap.d.ts

@@ -1,7 +1,7 @@
 import { Animated } from 'react-native';
-import { CarouselContext } from '../context';
+import type { CarouselContext } from '../context.js';
 export declare function useSnapAnimation(context: CarouselContext): {
-    gesture: import("react-native-gesture-handler/lib/typescript/handlers/gestures/panGesture").PanGesture;
+    gesture: import("react-native-gesture-handler/lib/typescript/handlers/gestures/panGesture.js").PanGesture;
     transforms: {
         translateX: Animated.Value;
     }[];

package/dist/esm/components/carousel/index.d.ts

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

package/dist/esm/components/carousel/index.js

@@ -1 +1 @@
-"use strict";export*from"./Carousel";
+"use strict";export*from"./Carousel.js";

package/dist/esm/components/chart/BarChart.d.ts

@@ -1,4 +1,4 @@
-import { View, ViewProps } from 'react-native';
+import type { View, ViewProps } from 'react-native';
 type Theme = 'blue' | 'green' | 'yellow' | 'orange' | 'red' | 'grey';
 type SingleBarFill = {
     /**

package/dist/esm/components/chart/BarChart.js

@@ -1 +1 @@
-"use strict";import{jsx as r,jsxs as s}from"react/jsx-runtime";import N,{Defs as U,RadialGradient as k,Rect as q,Stop as D}from"@granite-js/native/react-native-svg";import{Stack as f}from"@granite-js/react-native";import{colors as x}from"@toss/tds-colors";import{forwardRef as J,useMemo as p}from"react";import{Dimensions as K}from"react-native";import{useAdaptive as Q}from"../../core";import{Txt as L}from"../txt";function M({borderRadius:i,backgroundColor:e=x.grey100,...c}){const h="bar-background-color",o=`0 0 ${c.width} ${c.height}`;return s(N,{viewBox:o,...c,children:[r(U,{children:s(k,{id:h,cx:"0%",cy:"100%",r:"100%",fx:"0%",fy:"100%",gradientUnits:"objectBoundingBox",children:[r(D,{offset:"0%",stopColor:typeof e=="string"?e:e[0]}),r(D,{offset:"100%",stopColor:typeof e=="string"?e:e[1]})]})}),r(q,{width:c.width??"100%",height:c.height??"100%",fill:`url(#${h})`,rx:i,ry:i})]})}function b({style:i,color:e=x.grey600,...c}){return r(L,{style:[{marginTop:6,paddingHorizontal:4},i],typography:"st13",color:e,fontWeight:"medium",textAlign:"center",...c})}function Y({style:i,color:e=x.grey500,...c}){return r(L,{style:[{marginBottom:6,paddingHorizontal:6},i],typography:"st12",color:e,fontWeight:"medium",textAlign:"center",...c})}function R({gutter:i=0,...e}){return r(f,{direction:"vertical",align:"center",justify:"flex-end",gutter:i,...e})}function S({gutter:i=0,...e}){return r(f,{direction:"horizontal",justify:"center",gutter:i,...e})}function _({gutter:i=0,...e}){return r(f,{direction:"horizontal",justify:"center",gutter:i,...e})}const{width:Z}=K.get("window");export const BarChart=J(function({data:e=[],width:c=Z,height:h=205,fill:o={type:"all-bar",theme:"blue"},style:A,...B},C){const t=Q(),I=48,T=24,O=23,H=58,V=38,$=c-I,X=h-T-O,E=Math.max(...e.map(({value:n})=>n)),m=Math.floor(Math.min($/e.length,H)),F=X*.7,j=n=>Math.floor(n/E*F),u=Math.round(V/H*m),v=u>=30?8:u>9?Math.floor(u/5+2):3,a=p(()=>({default:t.grey100,blue:[t.blue300,t.blue500],green:[t.green200,t.green400],yellow:[t.yellow300,t.yellow500],orange:[t.orange300,t.orange500],red:[t.red300,t.red500],grey:[t.grey400,t.grey500]}),[t]),g=p(()=>({default:t.grey500,blue:t.blue700,green:t.green800,yellow:t.yellow900,orange:t.orange900,red:t.red700,grey:t.grey700}),[t]),W=[o.type,o.theme,o.count],z=p(()=>{const n=a.default;if(o.type==="auto"){const d=[a.blue,a.green,a.yellow,a.orange,a.red,a.grey];return new Array(e.length).fill(n).map((w,y)=>y<o.count?d[y%d.length]:w).reverse()}const l=a[o.theme]??o.theme;return o.type==="single-bar"?[...new Array(e.length-1).fill(n),l]:new Array(e.length).fill(l)},[...W,e.length,a]),G=p(()=>{const n=g.default;if(o.type==="auto"){const d=[g.blue,g.green,g.yellow,g.orange,g.red,g.grey];return new Array(e.length).fill(n).map((w,y)=>y<o.count?d[y%d.length]:w).reverse()}const l=g[o.theme]??o.theme;return o.type==="single-bar"?[...new Array(e.length-1).fill(n),l]:new Array(e.length).fill(n)},[...W,e.length,g]);return e.length<=12?s(f,{ref:C,style:[{paddingHorizontal:24,paddingVertical:12,minHeight:h},A],gutter:0,...B,children:[r(S,{children:e.map(({value:n},l)=>s(R,{style:{width:m},children:[r(Y,{color:G[l],children:n}),r(M,{width:u,height:j(n),borderRadius:v,backgroundColor:z[l]})]},l))}),r(_,{children:e.map(({xAxisLabel:n},l)=>r(b,{style:{width:m},children:n},l))})]}):s(f,{ref:C,style:[{paddingHorizontal:24,paddingVertical:12,minHeight:h},A],gutter:0,...B,children:[r(S,{style:{display:"flex",flexDirection:"row",justifyContent:"center"},children:e.map(({value:n},l)=>r(R,{style:{width:m},children:r(M,{width:u,height:j(n),borderRadius:v,backgroundColor:z[l]})},l))}),s(_,{justify:"space-between",children:[r(b,{children:e[0]?.xAxisLabel}),r(b,{children:e[e.length-1]?.xAxisLabel})]})]})});
+"use strict";import{jsx as r,jsxs as s}from"react/jsx-runtime";import{Svg as N,Defs as U,RadialGradient as k,Rect as q,Stop as D}from"@granite-js/native/react-native-svg";import{Stack as f}from"@granite-js/react-native";import{colors as x}from"@toss/tds-colors";import{forwardRef as J,useMemo as p}from"react";import{Dimensions as K}from"react-native";import{useAdaptive as Q}from"../../core/index.js";import{Txt as L}from"../txt/index.js";function M({borderRadius:i,backgroundColor:e=x.grey100,...c}){const h="bar-background-color",o=`0 0 ${c.width} ${c.height}`;return s(N,{viewBox:o,...c,children:[r(U,{children:s(k,{id:h,cx:"0%",cy:"100%",r:"100%",fx:"0%",fy:"100%",gradientUnits:"objectBoundingBox",children:[r(D,{offset:"0%",stopColor:typeof e=="string"?e:e[0]}),r(D,{offset:"100%",stopColor:typeof e=="string"?e:e[1]})]})}),r(q,{width:c.width??"100%",height:c.height??"100%",fill:`url(#${h})`,rx:i,ry:i})]})}function b({style:i,color:e=x.grey600,...c}){return r(L,{style:[{marginTop:6,paddingHorizontal:4},i],typography:"st13",color:e,fontWeight:"medium",textAlign:"center",...c})}function Y({style:i,color:e=x.grey500,...c}){return r(L,{style:[{marginBottom:6,paddingHorizontal:6},i],typography:"st12",color:e,fontWeight:"medium",textAlign:"center",...c})}function R({gutter:i=0,...e}){return r(f,{direction:"vertical",align:"center",justify:"flex-end",gutter:i,...e})}function S({gutter:i=0,...e}){return r(f,{direction:"horizontal",justify:"center",gutter:i,...e})}function _({gutter:i=0,...e}){return r(f,{direction:"horizontal",justify:"center",gutter:i,...e})}const{width:Z}=K.get("window");export const BarChart=J(function({data:e=[],width:c=Z,height:h=205,fill:o={type:"all-bar",theme:"blue"},style:A,...B},C){const t=Q(),I=48,T=24,O=23,H=58,V=38,$=c-I,X=h-T-O,E=Math.max(...e.map(({value:n})=>n)),m=Math.floor(Math.min($/e.length,H)),F=X*.7,j=n=>Math.floor(n/E*F),u=Math.round(V/H*m),v=u>=30?8:u>9?Math.floor(u/5+2):3,a=p(()=>({default:t.grey100,blue:[t.blue300,t.blue500],green:[t.green200,t.green400],yellow:[t.yellow300,t.yellow500],orange:[t.orange300,t.orange500],red:[t.red300,t.red500],grey:[t.grey400,t.grey500]}),[t]),g=p(()=>({default:t.grey500,blue:t.blue700,green:t.green800,yellow:t.yellow900,orange:t.orange900,red:t.red700,grey:t.grey700}),[t]),W=[o.type,o.theme,o.count],z=p(()=>{const n=a.default;if(o.type==="auto"){const d=[a.blue,a.green,a.yellow,a.orange,a.red,a.grey];return new Array(e.length).fill(n).map((w,y)=>y<o.count?d[y%d.length]:w).reverse()}const l=a[o.theme]??o.theme;return o.type==="single-bar"?[...new Array(e.length-1).fill(n),l]:new Array(e.length).fill(l)},[...W,e.length,a]),G=p(()=>{const n=g.default;if(o.type==="auto"){const d=[g.blue,g.green,g.yellow,g.orange,g.red,g.grey];return new Array(e.length).fill(n).map((w,y)=>y<o.count?d[y%d.length]:w).reverse()}const l=g[o.theme]??o.theme;return o.type==="single-bar"?[...new Array(e.length-1).fill(n),l]:new Array(e.length).fill(n)},[...W,e.length,g]);return e.length<=12?s(f,{ref:C,style:[{paddingHorizontal:24,paddingVertical:12,minHeight:h},A],gutter:0,...B,children:[r(S,{children:e.map(({value:n},l)=>s(R,{style:{width:m},children:[r(Y,{color:G[l],children:n}),r(M,{width:u,height:j(n),borderRadius:v,backgroundColor:z[l]})]},l))}),r(_,{children:e.map(({xAxisLabel:n},l)=>r(b,{style:{width:m},children:n},l))})]}):s(f,{ref:C,style:[{paddingHorizontal:24,paddingVertical:12,minHeight:h},A],gutter:0,...B,children:[r(S,{style:{display:"flex",flexDirection:"row",justifyContent:"center"},children:e.map(({value:n},l)=>r(R,{style:{width:m},children:r(M,{width:u,height:j(n),borderRadius:v,backgroundColor:z[l]})},l))}),s(_,{justify:"space-between",children:[r(b,{children:e[0]?.xAxisLabel}),r(b,{children:e[e.length-1]?.xAxisLabel})]})]})});

package/dist/esm/components/chart/index.d.ts

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

package/dist/esm/components/chart/index.js

@@ -1 +1 @@
-"use strict";export*from"./BarChart";
+"use strict";export*from"./BarChart.js";

package/dist/esm/components/checkbox/Circle/Graphic/AnimatedCheckboxGraphic.d.ts

@@ -1,2 +1,2 @@
-import { CheckboxBaseProps } from '../../types';
+import type { CheckboxBaseProps } from '../../types.js';
 export declare function AnimatedCheckboxGraphic({ checked, size, children, style, onTouchStart, onTouchEnd, onTouchCancel, onPress, ...pressableProps }: CheckboxBaseProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/checkbox/Circle/Graphic/AnimatedCheckboxGraphic.js

@@ -1 +1 @@
-"use strict";import{jsx as i,jsxs as C,Fragment as B}from"react/jsx-runtime";import q from"@granite-js/native/react-native-svg";import{colors as a}from"@toss/tds-colors";import c from"hex-to-rgba";import{useCallback as I,useEffect as d,useMemo as b,useRef as V,useState as H}from"react";import{Animated as t,Pressable as J,View as K}from"react-native";import{useAdaptive as L}from"../../../../core/index";import{usePressAnim as Q}from"../../../../interactions/pressable-effect/index";import{SPRING_CONFIG as U,TIMING_CONFIG as W}from"../../const";import{Check as O}from"./paths";import{styles as h}from"./styles";export function AnimatedCheckboxGraphic({checked:n,size:o,children:N,style:P,onTouchStart:R,onTouchEnd:T,onTouchCancel:G,onPress:_,...j}){const[r,f]=H(n?"on":"off"),g=b(()=>o*20/24,[o]),u=L(),k=b(()=>({background:c(u.background??a.background),grey200:c(u.grey200??a.grey200),blue600:c(a.blue600),blue500:c(a.blue500),white:c(a.white),transparent:c(a.grey200,0)}),[u.background,u.grey200]),{startPressInAnim:x,startPressOutAnim:w,scaleAnim:A}=Q(l),s=b(()=>{const{background:e,grey200:E,blue600:m,blue500:v,white:D,transparent:M}=k;return{check:{off:{stroke:M,strokeDashoffset:24,scale:l.pressOut.scale},"off-press":{stroke:m,strokeDashoffset:16,scale:l.pressIn.scale},on:{stroke:D,strokeDashoffset:0,scale:l.pressOut.scale},"on-press":{stroke:D,strokeDashoffset:13.5,scale:l.pressIn.scale}},backgroundCheck:{off:{opacity:1},"off-press":{opacity:1},on:{opacity:0},"on-press":{opacity:0}},outerCircle:{off:{fill:E},"off-press":{fill:m},on:{fill:v},"on-press":{fill:m}},innerCircle:{off:{fill:e,scale:1},"off-press":{fill:e,scale:1},on:{fill:v,scale:0},"on-press":{fill:m,scale:0}},innerCircleScaleOrigin\uBCF4\uC815:{off:{x:0,y:0},"off-press":{x:0,y:0},on:{x:12,y:12},"on-press":{x:12,y:12}}}},[k]),F=I(()=>{f(e=>e==="on"?"on-press":"off-press"),x()},[x]),S=I(()=>{f(n?e=>e==="on-press"?"on":"off":e=>e==="off-press"?"off":"on"),w()},[n,w]);d(()=>{f(n?"on":"off")},[n]);const p=V(new t.Value(s.innerCircle[r].scale)).current;d(()=>{r==="on"||r==="off"?t.spring(p,{toValue:s.innerCircle[r].scale,...U,useNativeDriver:!0}).start():t.timing(p,{toValue:s.innerCircle[r].scale,duration:0,useNativeDriver:!0}).start()},[s.innerCircle,r,p]);const y=V(new t.Value(s.check[r].strokeDashoffset)).current;return d(()=>{t.timing(y,{toValue:s.check[r].strokeDashoffset,...W,useNativeDriver:!0}).start()},[s.check,r,y]),i(J,{onTouchStart:e=>{F(),R?.(e)},onTouchEnd:e=>{S(),T?.(e)},onTouchCancel:e=>{S(),G?.(e)},onPress:_,style:[h.container,{width:o,height:o},P],accessibilityRole:"checkbox",accessibilityState:{checked:n,disabled:!1},...j,children:C(B,{children:[C(t.View,{style:[{transform:[{scale:A}]},{width:o,height:o},h.circleContainer],children:[i(t.View,{style:[{backgroundColor:s.outerCircle[r].fill,borderRadius:o/2},h.outerCircle]}),i(t.View,{style:[{width:g,height:g,backgroundColor:s.innerCircle[r].fill,borderRadius:g/2,transform:[{scale:p}]}]})]}),i(K,{style:[{width:o,height:o},h.checkContainer],children:C(X,{viewBox:"0 0 24 24",style:{transform:[{scale:A}]},children:[i(O,{stroke:k.grey200,style:{opacity:s.backgroundCheck[r].opacity}}),i(O,{stroke:s.check[r].stroke,strokeDasharray:"24px 24px",strokeDashoffset:y})]})}),N]})})}const X=t.createAnimatedComponent(q),l={pressIn:{scale:.9,opacity:0},pressOut:{scale:1,opacity:0}};
+"use strict";import{jsx as i,jsxs as C,Fragment as B}from"react/jsx-runtime";import{Svg as q}from"@granite-js/native/react-native-svg";import{colors as a}from"@toss/tds-colors";import c from"hex-to-rgba";import{useCallback as I,useEffect as d,useMemo as b,useRef as V,useState as H}from"react";import{Animated as t,Pressable as J,View as K}from"react-native";import{useAdaptive as L}from"../../../../core/index.js";import{usePressAnim as Q}from"../../../../interactions/pressable-effect/index.js";import{SPRING_CONFIG as U,TIMING_CONFIG as W}from"../../const.js";import{Check as O}from"./paths.js";import{styles as h}from"./styles.js";export function AnimatedCheckboxGraphic({checked:n,size:o,children:N,style:P,onTouchStart:R,onTouchEnd:T,onTouchCancel:G,onPress:_,...j}){const[r,f]=H(n?"on":"off"),g=b(()=>o*20/24,[o]),u=L(),k=b(()=>({background:c(u.background??a.background),grey200:c(u.grey200??a.grey200),blue600:c(a.blue600),blue500:c(a.blue500),white:c(a.white),transparent:c(a.grey200,0)}),[u.background,u.grey200]),{startPressInAnim:x,startPressOutAnim:w,scaleAnim:A}=Q(l),s=b(()=>{const{background:e,grey200:E,blue600:m,blue500:v,white:D,transparent:M}=k;return{check:{off:{stroke:M,strokeDashoffset:24,scale:l.pressOut.scale},"off-press":{stroke:m,strokeDashoffset:16,scale:l.pressIn.scale},on:{stroke:D,strokeDashoffset:0,scale:l.pressOut.scale},"on-press":{stroke:D,strokeDashoffset:13.5,scale:l.pressIn.scale}},backgroundCheck:{off:{opacity:1},"off-press":{opacity:1},on:{opacity:0},"on-press":{opacity:0}},outerCircle:{off:{fill:E},"off-press":{fill:m},on:{fill:v},"on-press":{fill:m}},innerCircle:{off:{fill:e,scale:1},"off-press":{fill:e,scale:1},on:{fill:v,scale:0},"on-press":{fill:m,scale:0}},innerCircleScaleOrigin\uBCF4\uC815:{off:{x:0,y:0},"off-press":{x:0,y:0},on:{x:12,y:12},"on-press":{x:12,y:12}}}},[k]),F=I(()=>{f(e=>e==="on"?"on-press":"off-press"),x()},[x]),S=I(()=>{f(n?e=>e==="on-press"?"on":"off":e=>e==="off-press"?"off":"on"),w()},[n,w]);d(()=>{f(n?"on":"off")},[n]);const p=V(new t.Value(s.innerCircle[r].scale)).current;d(()=>{r==="on"||r==="off"?t.spring(p,{toValue:s.innerCircle[r].scale,...U,useNativeDriver:!0}).start():t.timing(p,{toValue:s.innerCircle[r].scale,duration:0,useNativeDriver:!0}).start()},[s.innerCircle,r,p]);const y=V(new t.Value(s.check[r].strokeDashoffset)).current;return d(()=>{t.timing(y,{toValue:s.check[r].strokeDashoffset,...W,useNativeDriver:!0}).start()},[s.check,r,y]),i(J,{onTouchStart:e=>{F(),R?.(e)},onTouchEnd:e=>{S(),T?.(e)},onTouchCancel:e=>{S(),G?.(e)},onPress:_,style:[h.container,{width:o,height:o},P],accessibilityRole:"checkbox",accessibilityState:{checked:n,disabled:!1},...j,children:C(B,{children:[C(t.View,{style:[{transform:[{scale:A}]},{width:o,height:o},h.circleContainer],children:[i(t.View,{style:[{backgroundColor:s.outerCircle[r].fill,borderRadius:o/2},h.outerCircle]}),i(t.View,{style:[{width:g,height:g,backgroundColor:s.innerCircle[r].fill,borderRadius:g/2,transform:[{scale:p}]}]})]}),i(K,{style:[{width:o,height:o},h.checkContainer],children:C(X,{viewBox:"0 0 24 24",style:{transform:[{scale:A}]},children:[i(O,{stroke:k.grey200,style:{opacity:s.backgroundCheck[r].opacity}}),i(O,{stroke:s.check[r].stroke,strokeDasharray:"24px 24px",strokeDashoffset:y})]})}),N]})})}const X=t.createAnimatedComponent(q),l={pressIn:{scale:.9,opacity:0},pressOut:{scale:1,opacity:0}};

package/dist/esm/components/checkbox/Circle/Graphic/AnimatedCheckboxGraphicDisabled.d.ts

@@ -1,2 +1,2 @@
-import { CheckboxBaseProps } from '../../types';
+import type { CheckboxBaseProps } from '../../types.js';
 export declare function AnimatedCheckboxGraphicDisabled({ checked, size, style, children, onPress: _, ...pressableProps }: CheckboxBaseProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/checkbox/Circle/Graphic/AnimatedCheckboxGraphicDisabled.js

@@ -1 +1 @@
-"use strict";import{jsx as o,jsxs as g,Fragment as w}from"react/jsx-runtime";import x from"@granite-js/native/react-native-svg";import{colors as e}from"@toss/tds-colors";import t from"hex-to-rgba";import{useMemo as h}from"react";import{Animated as m,Pressable as C,View as d}from"react-native";import{useAdaptive as k,useColorPreference as S}from"../../../../core/index";import P from"../../useWiggle";import{Check as j}from"./paths";import{styles as n}from"./styles";export function AnimatedCheckboxGraphicDisabled({checked:s,size:r,style:b,children:u,onPress:v,...p}){const l=h(()=>r*20/24,[r]),{colorPreference:c}=S(),a=k(),i=h(()=>({background:t(a.background??e.background),grey200:t(a.grey200??e.grey200),disabledBlue500:c==="light"?t(e.blue100):t(e.blue500,.2),white:t(e.white),disabledWhite:c==="light"?t(e.white):t(e.white,.2),transparent:t(e.grey200,0)}),[c,a.background,a.grey200]),{startWiggle:y,style:f}=P();return o(C,{onPressIn:y,accessibilityRole:"checkbox",accessibilityState:{checked:s,disabled:!0},...p,children:o(m.View,{style:[[n.container,{width:r,height:r},f,b]],children:g(w,{children:[g(d,{style:[{width:r,height:r},n.circleContainer],children:[o(m.View,{style:[{backgroundColor:s?i.disabledBlue500:i.grey200,borderRadius:r/2},n.outerCircle]}),o(d,{style:{width:l,height:l,backgroundColor:s?i.transparent:i.background,borderRadius:l/2}})]}),o(d,{style:[{width:r,height:r},n.checkContainer],children:o(x,{viewBox:"0 0 24 24",children:o(j,{stroke:s?i.disabledWhite:i.grey200,strokeDasharray:"24px 24px"})})}),u]})})})}
+"use strict";import{jsx as o,jsxs as g,Fragment as w}from"react/jsx-runtime";import{Svg as x}from"@granite-js/native/react-native-svg";import{colors as e}from"@toss/tds-colors";import t from"hex-to-rgba";import{useMemo as h}from"react";import{Animated as m,Pressable as C,View as d}from"react-native";import{useAdaptive as k,useColorPreference as S}from"../../../../core/index.js";import P from"../../useWiggle.js";import{Check as j}from"./paths.js";import{styles as n}from"./styles.js";export function AnimatedCheckboxGraphicDisabled({checked:s,size:r,style:b,children:u,onPress:v,...p}){const l=h(()=>r*20/24,[r]),{colorPreference:c}=S(),a=k(),i=h(()=>({background:t(a.background??e.background),grey200:t(a.grey200??e.grey200),disabledBlue500:c==="light"?t(e.blue100):t(e.blue500,.2),white:t(e.white),disabledWhite:c==="light"?t(e.white):t(e.white,.2),transparent:t(e.grey200,0)}),[c,a.background,a.grey200]),{startWiggle:y,style:f}=P();return o(C,{onPressIn:y,accessibilityRole:"checkbox",accessibilityState:{checked:s,disabled:!0},...p,children:o(m.View,{style:[[n.container,{width:r,height:r},f,b]],children:g(w,{children:[g(d,{style:[{width:r,height:r},n.circleContainer],children:[o(m.View,{style:[{backgroundColor:s?i.disabledBlue500:i.grey200,borderRadius:r/2},n.outerCircle]}),o(d,{style:{width:l,height:l,backgroundColor:s?i.transparent:i.background,borderRadius:l/2}})]}),o(d,{style:[{width:r,height:r},n.checkContainer],children:o(x,{viewBox:"0 0 24 24",children:o(j,{stroke:s?i.disabledWhite:i.grey200,strokeDasharray:"24px 24px"})})}),u]})})})}

package/dist/esm/components/checkbox/Circle/Graphic/paths.d.ts

@@ -1,6 +1,7 @@
 import { Path } from '@granite-js/native/react-native-svg';
-import { ComponentProps } from 'react';
-import { Animated, StyleProp, ViewStyle } from 'react-native';
+import type { ComponentProps } from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import { Animated } from 'react-native';
 declare const AnimatedPath: Animated.AnimatedComponent<typeof Path>;
 export declare function OuterCircle(props: any): import("react/jsx-runtime").JSX.Element;
 export declare function InnerCircle(props: any): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/checkbox/Circle/index.d.ts

@@ -1,2 +1,2 @@
-import { CheckboxProps } from '../types';
+import type { CheckboxProps } from '../types.js';
 export declare function CheckboxCircle({ checked: _checked, defaultChecked, disabled, size, style, children, onCheckedChange, onPress, ...pressableProps }: CheckboxProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/checkbox/Circle/index.js

@@ -1 +1 @@
-"use strict";import{jsx as a}from"react/jsx-runtime";import{useControlled as k}from"../../../utils/index";import{useCallback as p}from"react";import{AnimatedCheckboxGraphic as u}from"./Graphic/AnimatedCheckboxGraphic";import{AnimatedCheckboxGraphicDisabled as x}from"./Graphic/AnimatedCheckboxGraphicDisabled";export function CheckboxCircle({checked:d,defaultChecked:m=!1,disabled:n,size:r=24,style:o,children:c,onCheckedChange:t,onPress:s,...h}){const[e,i]=k({controlledValue:d,defaultValue:m}),l=p(f=>{t?.(!e),i(!e),s?.(f)},[t,i,e,s]);return n?a(x,{checked:e,size:r,style:o,children:c,onPress:l}):a(u,{checked:e,size:r,style:o,children:c,onPress:l,...h})}
+"use strict";import{jsx as a}from"react/jsx-runtime";import{useControlled as k}from"../../../utils/index.js";import{useCallback as p}from"react";import{AnimatedCheckboxGraphic as u}from"./Graphic/AnimatedCheckboxGraphic.js";import{AnimatedCheckboxGraphicDisabled as x}from"./Graphic/AnimatedCheckboxGraphicDisabled.js";export function CheckboxCircle({checked:d,defaultChecked:m=!1,disabled:n,size:r=24,style:o,children:c,onCheckedChange:t,onPress:s,...h}){const[e,i]=k({controlledValue:d,defaultValue:m}),l=p(f=>{t?.(!e),i(!e),s?.(f)},[t,i,e,s]);return n?a(x,{checked:e,size:r,style:o,children:c,onPress:l}):a(u,{checked:e,size:r,style:o,children:c,onPress:l,...h})}

package/dist/esm/components/checkbox/Line/Graphic/AnimatedCheckboxGraphic.d.ts

@@ -1,2 +1,2 @@
-import { CheckboxBaseProps } from '../../types';
+import type { CheckboxBaseProps } from '../../types.js';
 export declare function AnimatedCheckboxGraphic({ checked, size, children, style, onPress, onTouchStart, onTouchEnd, onTouchCancel, ...pressableProps }: CheckboxBaseProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/checkbox/Line/Graphic/AnimatedCheckboxGraphic.js

@@ -1 +1 @@
-"use strict";import{jsx as a,jsxs as h,Fragment as G}from"react/jsx-runtime";import I from"@granite-js/native/react-native-svg";import{colors as k}from"@toss/tds-colors";import g from"hex-to-rgba";import{useCallback as b,useEffect as c,useMemo as V,useRef as y,useState as _}from"react";import{Animated as t,Pressable as j,View as F}from"react-native";import{useAdaptive as R}from"../../../../core/index";import{SPRING_CONFIG as O,TIMING_CONFIG as P}from"../../const";import{Check as x}from"./paths";import{styles as C}from"./styles";export function AnimatedCheckboxGraphic({checked:s,size:l,children:D,style:S,onPress:d,onTouchStart:v,onTouchEnd:A,onTouchCancel:N,...T}){const[o,r]=_(s?"on":"off"),m=R(),p=V(()=>({grey200:g(m.grey200??k.grey200),blue500:g(k.blue500)}),[m.grey200]),w=b(()=>{r(e=>e==="on"?"on-press":"off-press")},[]),u=b(()=>{r(s?e=>e==="on-press"?"on":"off":e=>e==="off-press"?"off":"on")},[s]);c(()=>{r(s?"on":"off")},[s]);const f=y(new t.Value(n.check[o].strokeDashoffset)).current;c(()=>{t.timing(f,{toValue:n.check[o].strokeDashoffset,...P,useNativeDriver:!0}).start()},[o,f]);const i=y(new t.Value(n.check[o].scale)).current;return c(()=>{t.spring(i,{toValue:n.check[o].scale,...O,useNativeDriver:!0}).start()},[o,i]),a(j,{onTouchStart:e=>{w(),v?.(e)},onTouchEnd:e=>{u(),A?.(e)},onTouchCancel:e=>{u(),N?.(e)},onPress:d,style:[C.container,S],accessibilityRole:"checkbox",accessibilityState:{checked:s,disabled:!1},...T,children:h(G,{children:[a(F,{style:[{width:l,height:l},C.checkContainer],children:h(E,{viewBox:"0 0 24 24",style:{transform:[{scale:i}]},children:[a(x,{stroke:p.grey200}),a(x,{stroke:p.blue500,strokeDasharray:"24px 24px",strokeDashoffset:f})]})}),D]})})}const E=t.createAnimatedComponent(I),n={check:{off:{strokeDashoffset:24,scale:1},"off-press":{strokeDashoffset:24*.6,scale:.9},on:{strokeDashoffset:0,scale:1},"on-press":{strokeDashoffset:10,scale:.9}}};
+"use strict";import{jsx as a,jsxs as h,Fragment as G}from"react/jsx-runtime";import{Svg as I}from"@granite-js/native/react-native-svg";import{colors as k}from"@toss/tds-colors";import g from"hex-to-rgba";import{useCallback as b,useEffect as c,useMemo as V,useRef as y,useState as _}from"react";import{Animated as t,Pressable as j,View as F}from"react-native";import{useAdaptive as R}from"../../../../core/index.js";import{SPRING_CONFIG as O,TIMING_CONFIG as P}from"../../const.js";import{Check as x}from"./paths.js";import{styles as C}from"./styles.js";export function AnimatedCheckboxGraphic({checked:s,size:l,children:D,style:S,onPress:d,onTouchStart:v,onTouchEnd:A,onTouchCancel:N,...T}){const[o,r]=_(s?"on":"off"),m=R(),p=V(()=>({grey200:g(m.grey200??k.grey200),blue500:g(k.blue500)}),[m.grey200]),w=b(()=>{r(e=>e==="on"?"on-press":"off-press")},[]),u=b(()=>{r(s?e=>e==="on-press"?"on":"off":e=>e==="off-press"?"off":"on")},[s]);c(()=>{r(s?"on":"off")},[s]);const f=y(new t.Value(n.check[o].strokeDashoffset)).current;c(()=>{t.timing(f,{toValue:n.check[o].strokeDashoffset,...P,useNativeDriver:!0}).start()},[o,f]);const i=y(new t.Value(n.check[o].scale)).current;return c(()=>{t.spring(i,{toValue:n.check[o].scale,...O,useNativeDriver:!0}).start()},[o,i]),a(j,{onTouchStart:e=>{w(),v?.(e)},onTouchEnd:e=>{u(),A?.(e)},onTouchCancel:e=>{u(),N?.(e)},onPress:d,style:[C.container,S],accessibilityRole:"checkbox",accessibilityState:{checked:s,disabled:!1},...T,children:h(G,{children:[a(F,{style:[{width:l,height:l},C.checkContainer],children:h(E,{viewBox:"0 0 24 24",style:{transform:[{scale:i}]},children:[a(x,{stroke:p.grey200}),a(x,{stroke:p.blue500,strokeDasharray:"24px 24px",strokeDashoffset:f})]})}),D]})})}const E=t.createAnimatedComponent(I),n={check:{off:{strokeDashoffset:24,scale:1},"off-press":{strokeDashoffset:24*.6,scale:.9},on:{strokeDashoffset:0,scale:1},"on-press":{strokeDashoffset:10,scale:.9}}};

package/dist/esm/components/checkbox/Line/Graphic/AnimatedCheckboxGraphicDisabled.d.ts

@@ -1,2 +1,2 @@
-import { CheckboxBaseProps } from '../../types';
+import type { CheckboxBaseProps } from '../../types.js';
 export declare function AnimatedCheckboxGraphicDisabled({ checked, size, style, children, onPress: _, ...pressableProps }: CheckboxBaseProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/checkbox/Line/Graphic/AnimatedCheckboxGraphicDisabled.js

@@ -1 +1 @@
-"use strict";import{jsx as e,Fragment as p,jsxs as b}from"react/jsx-runtime";import f from"@granite-js/native/react-native-svg";import{colors as r}from"@toss/tds-colors";import o from"hex-to-rgba";import{useMemo as h}from"react";import{Animated as u,Pressable as y}from"react-native";import{useAdaptive as x,useColorPreference as C}from"../../../../core/index";import P from"../../useWiggle";import{Check as S}from"./paths";import{styles as j}from"./styles";export function AnimatedCheckboxGraphicDisabled({checked:s,size:t,style:a,children:n,onPress:v,...c}){const{colorPreference:i}=C(),l=x(),m=h(()=>({grey200:o(l.grey200??r.grey200),disabledBlue500:i==="light"?o(r.blue100):o(r.blue500,.2)}),[i,l.grey200]),{startWiggle:g,style:d}=P();return e(y,{onPressIn:g,style:[j.container,a],accessibilityRole:"checkbox",accessibilityState:{checked:s,disabled:!0},...c,children:b(p,{children:[e(u.View,{style:d,children:e(f,{viewBox:"0 0 24 24",width:t,height:t,children:e(S,{stroke:s?m.disabledBlue500:m.grey200})})}),n]})})}
+"use strict";import{jsx as e,Fragment as p,jsxs as b}from"react/jsx-runtime";import{Svg as f}from"@granite-js/native/react-native-svg";import{colors as r}from"@toss/tds-colors";import o from"hex-to-rgba";import{useMemo as h}from"react";import{Animated as u,Pressable as y}from"react-native";import{useAdaptive as x,useColorPreference as C}from"../../../../core/index.js";import P from"../../useWiggle.js";import{Check as S}from"./paths.js";import{styles as j}from"./styles.js";export function AnimatedCheckboxGraphicDisabled({checked:s,size:t,style:a,children:n,onPress:v,...c}){const{colorPreference:i}=C(),l=x(),m=h(()=>({grey200:o(l.grey200??r.grey200),disabledBlue500:i==="light"?o(r.blue100):o(r.blue500,.2)}),[i,l.grey200]),{startWiggle:g,style:d}=P();return e(y,{onPressIn:g,style:[j.container,a],accessibilityRole:"checkbox",accessibilityState:{checked:s,disabled:!0},...c,children:b(p,{children:[e(u.View,{style:d,children:e(f,{viewBox:"0 0 24 24",width:t,height:t,children:e(S,{stroke:s?m.disabledBlue500:m.grey200})})}),n]})})}

package/dist/esm/components/checkbox/Line/Graphic/paths.d.ts

@@ -1,5 +1,5 @@
 import { Path } from '@granite-js/native/react-native-svg';
-import { ComponentProps } from 'react';
+import type { ComponentProps } from 'react';
 import { Animated } from 'react-native';
 declare const AnimatedPath: Animated.AnimatedComponent<typeof Path>;
 export declare function Check(props: ComponentProps<typeof AnimatedPath>): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/checkbox/Line/index.d.ts

@@ -1,2 +1,2 @@
-import { CheckboxProps } from '../types';
+import type { CheckboxProps } from '../types.js';
 export declare function CheckboxLine({ checked: _checked, defaultChecked, disabled, size, style, children, onCheckedChange, onPress, ...pressableProps }: CheckboxProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/checkbox/Line/index.js

@@ -1 +1 @@
-"use strict";import{jsx as a}from"react/jsx-runtime";import{useControlled as k}from"../../../utils/index";import{useCallback as p}from"react";import{AnimatedCheckboxGraphic as u}from"./Graphic/AnimatedCheckboxGraphic";import{AnimatedCheckboxGraphicDisabled as x}from"./Graphic/AnimatedCheckboxGraphicDisabled";export function CheckboxLine({checked:d,defaultChecked:m=!1,disabled:n,size:r=24,style:o,children:c,onCheckedChange:t,onPress:s,...h}){const[e,i]=k({controlledValue:d,defaultValue:m}),l=p(f=>{t?.(!e),i(!e),s?.(f)},[t,e,i,s]);return n?a(x,{checked:e,size:r,style:o,children:c,onPress:l}):a(u,{checked:e,size:r,style:o,children:c,onPress:l,...h})}
+"use strict";import{jsx as a}from"react/jsx-runtime";import{useControlled as k}from"../../../utils/index.js";import{useCallback as p}from"react";import{AnimatedCheckboxGraphic as u}from"./Graphic/AnimatedCheckboxGraphic.js";import{AnimatedCheckboxGraphicDisabled as x}from"./Graphic/AnimatedCheckboxGraphicDisabled.js";export function CheckboxLine({checked:d,defaultChecked:m=!1,disabled:n,size:r=24,style:o,children:c,onCheckedChange:t,onPress:s,...h}){const[e,i]=k({controlledValue:d,defaultValue:m}),l=p(f=>{t?.(!e),i(!e),s?.(f)},[t,e,i,s]);return n?a(x,{checked:e,size:r,style:o,children:c,onPress:l}):a(u,{checked:e,size:r,style:o,children:c,onPress:l,...h})}

package/dist/esm/components/checkbox/index.d.ts

@@ -1,7 +1,7 @@
-import { CheckboxCircle } from './Circle/index';
-import { CheckboxLine } from './Line/index';
+import { CheckboxCircle } from './Circle/index.js';
+import { CheckboxLine } from './Line/index.js';
 export declare const Checkbox: {
     Circle: typeof CheckboxCircle;
     Line: typeof CheckboxLine;
 };
-export type { CheckboxProps } from './types';
+export type { CheckboxProps } from './types.js';

package/dist/esm/components/checkbox/index.js

@@ -1 +1 @@
-"use strict";import{CheckboxCircle as o}from"./Circle/index";import{CheckboxLine as e}from"./Line/index";export const Checkbox={Circle:o,Line:e};
+"use strict";import{CheckboxCircle as o}from"./Circle/index.js";import{CheckboxLine as e}from"./Line/index.js";export const Checkbox={Circle:o,Line:e};

package/dist/esm/components/checkbox/types.d.ts

@@ -1,4 +1,4 @@
-import { PressableProps, StyleProp, ViewStyle } from 'react-native';
+import type { PressableProps, StyleProp, ViewStyle } from 'react-native';
 export interface CheckboxBaseProps extends PressableProps {
     /**
      * `Checkbox` 컴포넌트의 선택 상태를 설정해요.

package/dist/esm/components/dialog/AlertDialog.d.ts

@@ -1,6 +1,6 @@
-import { ReactNode } from 'react';
-import { AccessibilityProps } from 'react-native';
-import { BaseDialogProps } from './BaseDialog';
+import type { ReactNode } from 'react';
+import type { AccessibilityProps } from 'react-native';
+import type { BaseDialogProps } from './BaseDialog.js';
 export interface AlertDialogProps extends Pick<BaseDialogProps, 'open' | 'closeOnDimmerClick' | 'onClose' | 'onExited' | 'onEntered'>, AccessibilityProps {
     title: ReactNode;
     description?: ReactNode;

package/dist/esm/components/dialog/AlertDialog.js

@@ -1 +1 @@
-"use strict";import{jsx as e,Fragment as h,jsxs as x}from"react/jsx-runtime";import{colors as g}from"@toss/tds-colors";import{useCallback as p,useEffect as y}from"react";import{View as b}from"react-native";import{useHideAccessibility as D}from"../../core/contexts/HideAccessibility";import{TextButton as j}from"../text-button";import v from"./BaseDialog";import{DialogBodyTxt as A,DialogHeaderTxt as B}from"./BaseDialogContents";function E({open:o,title:t,description:i,content:n,buttonText:m="\uD655\uC778",closeOnDimmerClick:s,onClose:l,onExited:c,onButtonPress:a,onEntered:d,...f}){const r=D(),u=p(async()=>{a?.(),l()},[a,l]);return y(()=>(o?r.activate():r.inactivate(),r.inactivate),[r,o]),e(v,{open:o,header:t!=null?e(B,{children:t}):void 0,body:i!=null||n!=null?x(h,{children:[i!=null?e(A,{children:i}):null,n]}):void 0,footer:e(b,{style:{alignSelf:"flex-end"},children:e(j,{color:g.blue500,onPress:u,typography:"t5",fontWeight:"medium",children:m})}),closeOnDimmerClick:s,onClose:l,onExited:c,onEntered:d,...f})}export default E;
+"use strict";import{jsx as e,Fragment as h,jsxs as x}from"react/jsx-runtime";import{colors as g}from"@toss/tds-colors";import{useCallback as p,useEffect as y}from"react";import{View as b}from"react-native";import{useHideAccessibility as D}from"../../core/contexts/HideAccessibility.js";import{TextButton as j}from"../text-button/index.js";import v from"./BaseDialog.js";import{DialogBodyTxt as A,DialogHeaderTxt as B}from"./BaseDialogContents.js";function E({open:o,title:t,description:i,content:n,buttonText:m="\uD655\uC778",closeOnDimmerClick:s,onClose:l,onExited:c,onButtonPress:a,onEntered:d,...f}){const r=D(),u=p(async()=>{a?.(),l()},[a,l]);return y(()=>(o?r.activate():r.inactivate(),r.inactivate),[r,o]),e(v,{open:o,header:t!=null?e(B,{children:t}):void 0,body:i!=null||n!=null?x(h,{children:[i!=null?e(A,{children:i}):null,n]}):void 0,footer:e(b,{style:{alignSelf:"flex-end"},children:e(j,{color:g.blue500,onPress:u,typography:"t5",fontWeight:"medium",children:m})}),closeOnDimmerClick:s,onClose:l,onExited:c,onEntered:d,...f})}export default E;

package/dist/esm/components/dialog/BaseDialog.d.ts

@@ -1,5 +1,6 @@
-import { ReactElement } from 'react';
-import { AccessibilityProps, View } from 'react-native';
+import type { ReactElement } from 'react';
+import type { AccessibilityProps } from 'react-native';
+import { View } from 'react-native';
 export interface BaseDialogProps extends AccessibilityProps {
     open: boolean;
     header?: ReactElement;

package/dist/esm/components/dialog/BaseDialog.js

@@ -1 +1 @@
-"use strict";import{Fragment as C,jsx as n,jsxs as N}from"react/jsx-runtime";import{spring as i}from"@toss/tds-easings";import{forwardRef as b,useCallback as l,useRef as c}from"react";import{Animated as e,StyleSheet as k,View as P}from"react-native";import{useAnimatePresence as S,useWiggleAnim as q}from"../../utils";import{DialogContent as O,DialogOverlay as _}from"./BaseDialogContents";const F=()=>{},R=b(({open:p,header:m,body:u,footer:y,closeOnDimmerClick:g,onClose:f,onExited:d,onEntered:v=F,...w},V)=>{const o=c(new e.Value(t.content.close.opacity)).current,s=c(new e.Value(t.content.close.scale)).current,r=c(new e.Value(t.dimmer.close.opacity)).current,x=l(()=>new Promise(a=>{e.parallel([e.spring(o,{toValue:t.content.open.opacity,useNativeDriver:!0,...i.quick}),e.spring(s,{toValue:t.content.open.scale,useNativeDriver:!0,...i.quick}),e.spring(r,{toValue:t.dimmer.open.opacity,useNativeDriver:!0,...i.quick})]).start(()=>{a()})}),[o,s,r]),A=l(()=>new Promise(a=>{e.parallel([e.spring(o,{toValue:t.content.close.opacity,useNativeDriver:!0,...i.rapid}),e.spring(r,{toValue:t.dimmer.close.opacity,useNativeDriver:!0,...i.rapid})]).start(()=>{a()})}),[o,r]),{presenceState:D}=S(p,{enter:x,exit:A,onExited:d,onEntered:v}),{startWiggle:h,style:j}=q({direction:"x",type:"small"});return D==="invisible"?n(C,{}):N(P,{ref:V,style:W.container,...w,children:[n(_,{style:{opacity:r},onPress:g?f:h}),n(e.View,{style:[{opacity:o,transform:[{scale:s},...j.transform]}],children:n(O,{header:m,body:u,footer:y})})]})});export default R;const t={dimmer:{open:{opacity:.2},close:{opacity:0}},content:{open:{opacity:1,scale:1},close:{opacity:0,scale:.8}}},W=k.create({container:{flex:1,justifyContent:"center",alignItems:"center",position:"absolute",width:"100%",height:"100%"}});
+"use strict";import{Fragment as C,jsx as n,jsxs as N}from"react/jsx-runtime";import{spring as i}from"@toss/tds-easings";import{forwardRef as b,useCallback as l,useRef as c}from"react";import{Animated as e,StyleSheet as k,View as P}from"react-native";import{useAnimatePresence as S,useWiggleAnim as q}from"../../utils/index.js";import{DialogContent as O,DialogOverlay as _}from"./BaseDialogContents.js";const F=()=>{},R=b(({open:p,header:m,body:u,footer:y,closeOnDimmerClick:g,onClose:f,onExited:d,onEntered:v=F,...w},V)=>{const o=c(new e.Value(t.content.close.opacity)).current,s=c(new e.Value(t.content.close.scale)).current,r=c(new e.Value(t.dimmer.close.opacity)).current,x=l(()=>new Promise(a=>{e.parallel([e.spring(o,{toValue:t.content.open.opacity,useNativeDriver:!0,...i.quick}),e.spring(s,{toValue:t.content.open.scale,useNativeDriver:!0,...i.quick}),e.spring(r,{toValue:t.dimmer.open.opacity,useNativeDriver:!0,...i.quick})]).start(()=>{a()})}),[o,s,r]),A=l(()=>new Promise(a=>{e.parallel([e.spring(o,{toValue:t.content.close.opacity,useNativeDriver:!0,...i.rapid}),e.spring(r,{toValue:t.dimmer.close.opacity,useNativeDriver:!0,...i.rapid})]).start(()=>{a()})}),[o,r]),{presenceState:D}=S(p,{enter:x,exit:A,onExited:d,onEntered:v}),{startWiggle:h,style:j}=q({direction:"x",type:"small"});return D==="invisible"?n(C,{}):N(P,{ref:V,style:W.container,...w,children:[n(_,{style:{opacity:r},onPress:g?f:h}),n(e.View,{style:[{opacity:o,transform:[{scale:s},...j.transform]}],children:n(O,{header:m,body:u,footer:y})})]})});export default R;const t={dimmer:{open:{opacity:.2},close:{opacity:0}},content:{open:{opacity:1,scale:1},close:{opacity:0,scale:.8}}},W=k.create({container:{flex:1,justifyContent:"center",alignItems:"center",position:"absolute",width:"100%",height:"100%"}});

package/dist/esm/components/dialog/BaseDialogContents.d.ts

@@ -1,6 +1,7 @@
-import { ComponentProps, ReactElement } from 'react';
-import { Animated, PressableProps } from 'react-native';
-import { TxtProps } from '../txt';
+import type { ComponentProps, ReactElement } from 'react';
+import type { PressableProps } from 'react-native';
+import { Animated } from 'react-native';
+import type { TxtProps } from '../txt/index.js';
 declare function DialogOverlay({ color, style, onPress, }: {
     color?: string;
     style?: ComponentProps<typeof Animated.View>['style'];

package/dist/esm/components/dialog/BaseDialogContents.js

@@ -1 +1 @@
-"use strict";import{jsx as e,jsxs as s}from"react/jsx-runtime";import{colors as g}from"@toss/tds-colors";import{Animated as p,Dimensions as y,Pressable as h,ScrollView as u,StyleSheet as m,useWindowDimensions as f,View as r}from"react-native";import{useAdaptive as a}from"../../core";import{Txt as c}from"../txt";function w({color:o,style:t,onPress:i}){const{width:l,height:d}=f();return e(h,{onPress:i,style:[{width:l,height:d},n.overlayPressable],children:e(p.View,{style:[{backgroundColor:o??g.black},n.overlay,t]})})}function v({header:o,body:t,footer:i}){const l=a();return s(r,{style:[{backgroundColor:l.floatBackground},n.content],children:[s(u,{style:n.contentScrollView,children:[o!=null?e(r,{children:o}):null,t!=null?e(r,{style:n.contentBody,children:t}):null]}),e(r,{style:n.contentFooter,children:i})]})}function x({...o}){const t=a();return e(c,{color:t.grey800,fontWeight:"bold",typography:"t4",...o})}function b({...o}){const t=a();return e(c,{color:t.grey700,fontWeight:"medium",typography:"t6",...o})}const n=m.create({overlayPressable:{position:"absolute",top:0,left:0},overlay:{width:"100%",height:"100%"},content:{width:312,paddingTop:22,paddingHorizontal:22,paddingBottom:16,borderRadius:24},contentScrollView:{maxHeight:y.get("window").height*.7},contentBody:{marginTop:8},contentFooter:{marginTop:20}});export{b as DialogBodyTxt,v as DialogContent,x as DialogHeaderTxt,w as DialogOverlay};
+"use strict";import{jsx as e,jsxs as s}from"react/jsx-runtime";import{colors as g}from"@toss/tds-colors";import{Animated as p,Dimensions as y,Pressable as h,ScrollView as u,StyleSheet as m,useWindowDimensions as f,View as r}from"react-native";import{useAdaptive as a}from"../../core/index.js";import{Txt as c}from"../txt/index.js";function w({color:o,style:t,onPress:i}){const{width:l,height:d}=f();return e(h,{onPress:i,style:[{width:l,height:d},n.overlayPressable],children:e(p.View,{style:[{backgroundColor:o??g.black},n.overlay,t]})})}function v({header:o,body:t,footer:i}){const l=a();return s(r,{style:[{backgroundColor:l.floatBackground},n.content],children:[s(u,{style:n.contentScrollView,children:[o!=null?e(r,{children:o}):null,t!=null?e(r,{style:n.contentBody,children:t}):null]}),e(r,{style:n.contentFooter,children:i})]})}function x({...o}){const t=a();return e(c,{color:t.grey800,fontWeight:"bold",typography:"t4",...o})}function b({...o}){const t=a();return e(c,{color:t.grey700,fontWeight:"medium",typography:"t6",...o})}const n=m.create({overlayPressable:{position:"absolute",top:0,left:0},overlay:{width:"100%",height:"100%"},content:{width:312,paddingTop:22,paddingHorizontal:22,paddingBottom:16,borderRadius:24},contentScrollView:{maxHeight:y.get("window").height*.7},contentBody:{marginTop:8},contentFooter:{marginTop:20}});export{b as DialogBodyTxt,v as DialogContent,x as DialogHeaderTxt,w as DialogOverlay};

package/dist/esm/components/dialog/ConfirmDialog.d.ts

@@ -1,7 +1,8 @@
-import { ComponentProps, ReactElement, ReactNode } from 'react';
-import { AccessibilityProps, View } from 'react-native';
-import { Button } from '../button';
-import { BaseDialogProps } from './BaseDialog';
+import type { ComponentProps, ReactElement, ReactNode } from 'react';
+import type { AccessibilityProps } from 'react-native';
+import { View } from 'react-native';
+import { Button } from '../button/index.js';
+import type { BaseDialogProps } from './BaseDialog.js';
 export interface ConfirmDialogProps extends Pick<BaseDialogProps, 'open' | 'closeOnDimmerClick' | 'onClose' | 'onExited' | 'onEntered'>, AccessibilityProps {
     title: ReactNode;
     description?: ReactNode;

package/dist/esm/components/dialog/ConfirmDialog.js

@@ -1 +1 @@
-"use strict";import{jsx as t,Fragment as p,jsxs as l}from"react/jsx-runtime";import{Children as b,forwardRef as B,useEffect as D}from"react";import{StyleSheet as w,View as u}from"react-native";import{useHideAccessibility as y}from"../../core/contexts/HideAccessibility";import{Button as C}from"../button";import j from"./BaseDialog";import{DialogBodyTxt as v,DialogHeaderTxt as T}from"./BaseDialogContents";const E=B(({open:e,title:o,description:r,content:i,leftButton:a,rightButton:c,closeOnDimmerClick:f,onClose:s,onExited:m,onEntered:h,...x},g)=>{const n=y();return D(()=>(e?n.activate():n.inactivate(),n.inactivate),[n,e]),t(j,{ref:g,open:e,header:o!=null?t(T,{children:o}):void 0,body:r!=null||i!=null?l(p,{children:[r!=null?t(v,{children:r}):null,i]}):void 0,footer:l(DoubleButton,{children:[a,c]}),closeOnDimmerClick:f,onClose:s,onExited:m,onEntered:h,...x})});export function DoubleButton(e){const o=b.count(e.children);if(o!==2)throw new Error(`There should be 2 children in DoubleButton. Given children: ${o}`);return t(u,{style:d.doubleButton,children:e.children})}function I(e){return t(u,{style:d.doubleButtonItem,children:t(C,{size:"large",viewStyle:[{flexGrow:1}],...e})})}const G=Object.assign(E,{Button:I}),d=w.create({doubleButton:{flexWrap:"wrap",flexDirection:"row",justifyContent:"space-around",marginTop:-8,marginLeft:-8},doubleButtonItem:{flexDirection:"row",minWidth:"50%",flexGrow:1,paddingTop:8,paddingLeft:8}});export default G;
+"use strict";import{jsx as t,Fragment as p,jsxs as l}from"react/jsx-runtime";import{Children as b,forwardRef as B,useEffect as D}from"react";import{StyleSheet as w,View as u}from"react-native";import{useHideAccessibility as y}from"../../core/contexts/HideAccessibility.js";import{Button as C}from"../button/index.js";import j from"./BaseDialog.js";import{DialogBodyTxt as v,DialogHeaderTxt as T}from"./BaseDialogContents.js";const E=B(({open:e,title:o,description:r,content:i,leftButton:a,rightButton:c,closeOnDimmerClick:f,onClose:s,onExited:m,onEntered:h,...x},g)=>{const n=y();return D(()=>(e?n.activate():n.inactivate(),n.inactivate),[n,e]),t(j,{ref:g,open:e,header:o!=null?t(T,{children:o}):void 0,body:r!=null||i!=null?l(p,{children:[r!=null?t(v,{children:r}):null,i]}):void 0,footer:l(DoubleButton,{children:[a,c]}),closeOnDimmerClick:f,onClose:s,onExited:m,onEntered:h,...x})});export function DoubleButton(e){const o=b.count(e.children);if(o!==2)throw new Error(`There should be 2 children in DoubleButton. Given children: ${o}`);return t(u,{style:d.doubleButton,children:e.children})}function I(e){return t(u,{style:d.doubleButtonItem,children:t(C,{size:"large",viewStyle:[{flexGrow:1}],...e})})}const G=Object.assign(E,{Button:I}),d=w.create({doubleButton:{flexWrap:"wrap",flexDirection:"row",justifyContent:"space-around",marginTop:-8,marginLeft:-8},doubleButtonItem:{flexDirection:"row",minWidth:"50%",flexGrow:1,paddingTop:8,paddingLeft:8}});export default G;

package/dist/esm/components/dialog/index.d.ts

@@ -1,5 +1,5 @@
-export { default as AlertDialog } from './AlertDialog';
-export { default as BaseDialog } from './BaseDialog';
-export { default as ConfirmDialog } from './ConfirmDialog';
-export type { AlertDialogProps } from './AlertDialog';
-export type { ConfirmDialogProps } from './ConfirmDialog';
+export { default as AlertDialog } from './AlertDialog.js';
+export { default as BaseDialog } from './BaseDialog.js';
+export { default as ConfirmDialog } from './ConfirmDialog.js';
+export type { AlertDialogProps } from './AlertDialog.js';
+export type { ConfirmDialogProps } from './ConfirmDialog.js';

package/dist/esm/components/dialog/index.js

@@ -1 +1 @@
-"use strict";export{default as AlertDialog}from"./AlertDialog";export{default as BaseDialog}from"./BaseDialog";export{default as ConfirmDialog}from"./ConfirmDialog";
+"use strict";export{default as AlertDialog}from"./AlertDialog.js";export{default as BaseDialog}from"./BaseDialog.js";export{default as ConfirmDialog}from"./ConfirmDialog.js";

package/dist/esm/components/dropdown/components/Dropdown.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
-import { DropdownItem } from './DropdownItem';
+import type { ReactNode } from 'react';
+import { DropdownItem } from './DropdownItem.js';
 interface Props {
     title?: string;
     children?: ReactNode;

package/dist/esm/components/dropdown/components/Dropdown.js

@@ -1 +1 @@
-"use strict";import{jsx as e,jsxs as s}from"react/jsx-runtime";import{colors as i}from"@toss/tds-colors";import{Platform as p,View as n}from"react-native";import{useAdaptive as l,useColorPreference as c}from"../../../core";import*as f from"../../paragraph";import{useDropdown as m}from"../contexts/DropdownContext";import{DropdownItem as h}from"./DropdownItem";export function Dropdown({title:o,children:r}){const t=l(),{colorPreference:a}=c(),{dropdownBaseRef:d}=m();return s(n,{ref:d,style:{width:240,backgroundColor:t.floatBackground,paddingVertical:12,borderRadius:16,shadowColor:a==="light"?p.OS==="ios"?i.greyOpacity300:void 0:i.greyOpacity900,shadowOffset:{width:0,height:16},shadowOpacity:1,shadowRadius:60,elevation:40},children:[o!=null?e(g,{children:e(f.Text,{fontWeight:"bold",typography:"st8",color:t.grey800,children:o})}):void 0,r]})}function g({style:o,...r}){return e(n,{style:[{paddingVertical:12,paddingHorizontal:24,flexDirection:"row",alignItems:"center"},o],...r})}Dropdown.Item=h;
+"use strict";import{jsx as e,jsxs as s}from"react/jsx-runtime";import{colors as i}from"@toss/tds-colors";import{Platform as p,View as n}from"react-native";import{useAdaptive as l,useColorPreference as c}from"../../../core/index.js";import*as f from"../../paragraph/index.js";import{useDropdown as m}from"../contexts/DropdownContext.js";import{DropdownItem as h}from"./DropdownItem.js";export function Dropdown({title:o,children:r}){const t=l(),{colorPreference:a}=c(),{dropdownBaseRef:d}=m();return s(n,{ref:d,style:{width:240,backgroundColor:t.floatBackground,paddingVertical:12,borderRadius:16,shadowColor:a==="light"?p.OS==="ios"?i.greyOpacity300:void 0:i.greyOpacity900,shadowOffset:{width:0,height:16},shadowOpacity:1,shadowRadius:60,elevation:40},children:[o!=null?e(g,{children:e(f.Text,{fontWeight:"bold",typography:"st8",color:t.grey800,children:o})}):void 0,r]})}function g({style:o,...r}){return e(n,{style:[{paddingVertical:12,paddingHorizontal:24,flexDirection:"row",alignItems:"center"},o],...r})}Dropdown.Item=h;

package/dist/esm/components/dropdown/components/DropdownItem.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
-import { ViewProps } from 'react-native';
+import type { ReactNode } from 'react';
+import type { ViewProps } from 'react-native';
 interface Props {
     icon?: ReactNode;
     children: string;

package/dist/esm/components/dropdown/components/DropdownItem.js

@@ -1 +1 @@
-"use strict";import{jsx as r,jsxs as a}from"react/jsx-runtime";import{View as t}from"react-native";import*as l from"../../paragraph";import{useAdaptive as d}from"../../../core";export function DropdownItem({icon:e,children:i,style:o,iconViewStyle:n}){const s=d();return a(t,{style:[{flexDirection:"row",paddingVertical:12,paddingHorizontal:24,alignItems:"center"},o],children:[r(l.Text,{typography:"st8",fontWeight:"semiBold",color:s.grey600,children:i}),e!=null?r(t,{style:[{flexDirection:"row",alignItems:"center"},n],children:e}):void 0]})}
+"use strict";import{jsx as r,jsxs as a}from"react/jsx-runtime";import{View as t}from"react-native";import*as l from"../../paragraph/index.js";import{useAdaptive as d}from"../../../core/index.js";export function DropdownItem({icon:e,children:i,style:o,iconViewStyle:n}){const s=d();return a(t,{style:[{flexDirection:"row",paddingVertical:12,paddingHorizontal:24,alignItems:"center"},o],children:[r(l.Text,{typography:"st8",fontWeight:"semiBold",color:s.grey600,children:i}),e!=null?r(t,{style:[{flexDirection:"row",alignItems:"center"},n],children:e}):void 0]})}

package/dist/esm/components/dropdown/components/FixedFloatingDropdown.d.ts

@@ -1,6 +1,6 @@
-import { ReactNode } from 'react';
-import { ViewProps } from 'react-native';
-import { Placement, ReactElementWithRef } from '../types';
+import type { ReactNode } from 'react';
+import type { ViewProps } from 'react-native';
+import type { Placement, ReactElementWithRef } from '../types.js';
 export interface FixedFloatingDropdownProps {
     open?: boolean;
     defaultOpen?: boolean;