@toss/tds-react-native 1.3.0 → 1.3.1

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

@@ -1 +1 @@
-"use strict";import{jsx as l,Fragment as Y,jsxs as P}from"react/jsx-runtime";import{spring as R}from"@toss/tds-easings";import{cloneElement as _,forwardRef as j,useEffect as X,useRef as g}from"react";import{Pressable as z,View as D}from"react-native";import{useGlobalEvent as A,useOverlay as N}from"../../../core";import{AnimateRallyPresence as B,Rally as G}from"../../../interactions/rally";import{MENU_Z_INDEX as H}from"../constants/z-index";import{useDropdown as K}from"../contexts/DropdownContext";import{mergeRefs as M}from"../utils/mergeRefs";export function FixedFloatingDropdown({children:o,onOpen:p,onClose:r,open:i,dropdown:m,containerStyle:n}){const{placement:v}=K(),s=g(null),u=g(null),f=g(null),y=o.ref,F=_(o,{...o.props,ref:y!=null?M(y,s):s,onPress:()=>{i?r?.():p?.(),o.props?.onPress?.()}}),d=A();X(()=>{const t=c=>{const e=c.nativeEvent.pageX,a=c.nativeEvent.pageY;f?.current&&f.current.measure((x,b,h,I,O,w)=>{e>=O&&e<=O+h&&a>=w&&a<=w+I||r?.()})};return d.addEventListener("touchEnd",t),()=>{d.removeEventListener("touchEnd",t)}},[f,d,r,s]);const E=N();return X(()=>{if(!i){E.close();return}s.current==null||u.current==null||s.current.measure((...t)=>{u.current?.measure((...c)=>{const e={x:0,y:1,width:2,height:3,pageX:4,pageY:5};E.open(({isOpen:a,exit:x,close:b})=>{const h=v==="bottom-start"?{top:(t[e.pageY]??0)+(t[e.height]??0),left:t[e.pageX]}:{top:(t[e.pageY]??0)+(t[e.height]??0),left:(t[e.pageX]??0)+(t[e.width]??0)-(c[e.width]??0)};return l(z,{onPress:()=>{b(),r?.()},style:[{flex:1,position:"absolute",width:"100%",height:"100%",zIndex:H},n],children:l(B,{onExitEnd:x,children:a?l(S,{ref:f,style:[h],placement:v,children:m}):void 0})})})})})},[i]),P(Y,{children:[F,l(D,{ref:u,style:{opacity:0,position:"absolute",zIndex:-1},pointerEvents:"none",accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:m})]})}const S=j(function({style:p,children:r,placement:i},m){const n=i==="bottom-start"?"left":"right";return l(G,{ref:m,style:[{zIndex:9e3,position:"absolute"},p],exit:{opacity:{from:1,to:0},scale:{from:1,to:0},transformOriginX:{from:n,to:n},transformOriginY:{from:"top",to:"top"},easing:R.medium},motion:{opacity:{from:0,to:1},scale:{from:0,to:1},transformOriginX:{from:n,to:n},transformOriginY:{from:"top",to:"top"},easing:R.medium},children:r})});
+"use strict";import{jsx as l,Fragment as Y,jsxs as P}from"react/jsx-runtime";import{spring as R}from"@toss/tds-easings";import{cloneElement as _,forwardRef as j,useEffect as X,useRef as g}from"react";import{Pressable as z,View as D}from"react-native";import{useGlobalEvent as A,useOverlay as N}from"../../../core/index.js";import{AnimateRallyPresence as B,Rally as G}from"../../../interactions/rally/index.js";import{MENU_Z_INDEX as H}from"../constants/z-index.js";import{useDropdown as K}from"../contexts/DropdownContext.js";import{mergeRefs as M}from"../utils/mergeRefs.js";export function FixedFloatingDropdown({children:o,onOpen:p,onClose:r,open:i,dropdown:m,containerStyle:n}){const{placement:v}=K(),s=g(null),u=g(null),f=g(null),y=o.ref,F=_(o,{...o.props,ref:y!=null?M(y,s):s,onPress:()=>{i?r?.():p?.(),o.props?.onPress?.()}}),d=A();X(()=>{const t=c=>{const e=c.nativeEvent.pageX,a=c.nativeEvent.pageY;f?.current&&f.current.measure((x,b,h,I,O,w)=>{e>=O&&e<=O+h&&a>=w&&a<=w+I||r?.()})};return d.addEventListener("touchEnd",t),()=>{d.removeEventListener("touchEnd",t)}},[f,d,r,s]);const E=N();return X(()=>{if(!i){E.close();return}s.current==null||u.current==null||s.current.measure((...t)=>{u.current?.measure((...c)=>{const e={x:0,y:1,width:2,height:3,pageX:4,pageY:5};E.open(({isOpen:a,exit:x,close:b})=>{const h=v==="bottom-start"?{top:(t[e.pageY]??0)+(t[e.height]??0),left:t[e.pageX]}:{top:(t[e.pageY]??0)+(t[e.height]??0),left:(t[e.pageX]??0)+(t[e.width]??0)-(c[e.width]??0)};return l(z,{onPress:()=>{b(),r?.()},style:[{flex:1,position:"absolute",width:"100%",height:"100%",zIndex:H},n],children:l(B,{onExitEnd:x,children:a?l(S,{ref:f,style:[h],placement:v,children:m}):void 0})})})})})},[i]),P(Y,{children:[F,l(D,{ref:u,style:{opacity:0,position:"absolute",zIndex:-1},pointerEvents:"none",accessibilityElementsHidden:!0,importantForAccessibility:"no-hide-descendants",children:m})]})}const S=j(function({style:p,children:r,placement:i},m){const n=i==="bottom-start"?"left":"right";return l(G,{ref:m,style:[{zIndex:9e3,position:"absolute"},p],exit:{opacity:{from:1,to:0},scale:{from:1,to:0},transformOriginX:{from:n,to:n},transformOriginY:{from:"top",to:"top"},easing:R.medium},motion:{opacity:{from:0,to:1},scale:{from:0,to:1},transformOriginX:{from:n,to:n},transformOriginY:{from:"top",to:"top"},easing:R.medium},children:r})});

package/dist/esm/components/dropdown/components/Trigger.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';
 interface Props {
     open?: boolean;
     defaultOpen?: boolean;

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

@@ -1 +1 @@
-"use strict";import{jsx as o,jsxs as R,Fragment as z}from"react/jsx-runtime";import{spring as _}from"@toss/tds-easings";import{cloneElement as I,useCallback as x,useEffect as b,useState as g}from"react";import{View as v}from"react-native";import{useGlobalEvent as S}from"../../../core";import{AnimateRallyPresence as T,Rally as j}from"../../../interactions/rally";import{MENU_Z_INDEX as w}from"../constants/z-index";import{DropdownProvider as P,useDropdown as E}from"../contexts/DropdownContext";import{mergeRefs as X}from"../utils/mergeRefs";import{FixedFloatingDropdown as C}from"./FixedFloatingDropdown";function y({children:t,placement:r="bottom-start",strategy:n="absolute",...e}){return o(P,{placement:r,children:o(n==="fixed"?C:A,{...e,children:t})})}function A({children:t,onOpen:r,onClose:n,open:e,dropdown:l,containerStyle:a}){const{targetRef:i,dropdownBaseRef:f}=E(),u=t.ref,c=I(t,{...t.props,ref:u!=null?X(u,i):i,onPress:()=>{e?n?.():r?.(),t.props?.onPress?.()}}),s=S();return b(()=>{const d=(m,p)=>{f?.current==null||m.target==null||!p&&!h(m.target,f.current)&&!h(m.target,i?.current)&&n?.()};return s.addEventListener("touchEnd",d),()=>{s.removeEventListener("touchEnd",d)}},[f,s,n,i]),R(v,{style:[{position:"relative",zIndex:w},a],children:[c,o(T,{children:e?o(B,{children:l}):void 0})]})}function B({style:t,children:r,...n}){const{targetRef:e,dropdownBaseRef:l,placement:a}=E(),[i,f]=g(null),[u,c]=g(null);if(b(()=>{e?.current!=null&&l?.current!=null&&e.current.measureInWindow((d,m,p,D)=>{l?.current?.measureInWindow((N,U,F,O)=>{f({width:p,height:D}),c({width:F,height:O})})})},[l,e]),u==null||i==null)return o(v,{style:{opacity:0,position:"absolute",alignSelf:"flex-start"},children:r});const s=a==="bottom-start"?"left":"right";return o(z,{children:o(j,{style:[{zIndex:9e3,position:"absolute",top:i.height},a==="bottom-start"?{left:0}:{right:0},t],exit:{opacity:{from:1,to:0},scale:{from:1,to:0},transformOriginX:{from:s,to:s},transformOriginY:{from:"top",to:"top"},easing:_.medium},motion:{opacity:{from:0,to:1},scale:{from:0,to:1},transformOriginX:{from:s,to:s},transformOriginY:{from:"top",to:"top"},easing:_.medium},...n,children:r})})}function L({defaultOpen:t=!1,onOpen:r,onClose:n,...e}){const[l,a]=g(t),i=x(()=>{r?.(),a(!0)},[r]),f=x(()=>{n?.(),a(!1)},[n]);return o(y,{open:l,onOpen:i,onClose:f,...e})}export function Trigger(t){return t.open!=null?o(y,{...t}):o(L,{...t})}Trigger.zIndex=w;const h=(t,r)=>{if(t&&r&&t._nativeTag===r._nativeTag)return!0;if(r._children&&r._children.length>0){for(let n=0;n<=r._children.length-1;n++)if(h(t,r._children[n]))return!0}return!1};
+"use strict";import{jsx as o,jsxs as R,Fragment as z}from"react/jsx-runtime";import{spring as _}from"@toss/tds-easings";import{cloneElement as I,useCallback as x,useEffect as b,useState as g}from"react";import{View as v}from"react-native";import{useGlobalEvent as S}from"../../../core/index.js";import{AnimateRallyPresence as T,Rally as j}from"../../../interactions/rally/index.js";import{MENU_Z_INDEX as w}from"../constants/z-index.js";import{DropdownProvider as P,useDropdown as E}from"../contexts/DropdownContext.js";import{mergeRefs as X}from"../utils/mergeRefs.js";import{FixedFloatingDropdown as C}from"./FixedFloatingDropdown.js";function y({children:t,placement:r="bottom-start",strategy:n="absolute",...e}){return o(P,{placement:r,children:o(n==="fixed"?C:A,{...e,children:t})})}function A({children:t,onOpen:r,onClose:n,open:e,dropdown:l,containerStyle:a}){const{targetRef:i,dropdownBaseRef:f}=E(),u=t.ref,c=I(t,{...t.props,ref:u!=null?X(u,i):i,onPress:()=>{e?n?.():r?.(),t.props?.onPress?.()}}),s=S();return b(()=>{const d=(m,p)=>{f?.current==null||m.target==null||!p&&!h(m.target,f.current)&&!h(m.target,i?.current)&&n?.()};return s.addEventListener("touchEnd",d),()=>{s.removeEventListener("touchEnd",d)}},[f,s,n,i]),R(v,{style:[{position:"relative",zIndex:w},a],children:[c,o(T,{children:e?o(B,{children:l}):void 0})]})}function B({style:t,children:r,...n}){const{targetRef:e,dropdownBaseRef:l,placement:a}=E(),[i,f]=g(null),[u,c]=g(null);if(b(()=>{e?.current!=null&&l?.current!=null&&e.current.measureInWindow((d,m,p,D)=>{l?.current?.measureInWindow((N,U,F,O)=>{f({width:p,height:D}),c({width:F,height:O})})})},[l,e]),u==null||i==null)return o(v,{style:{opacity:0,position:"absolute",alignSelf:"flex-start"},children:r});const s=a==="bottom-start"?"left":"right";return o(z,{children:o(j,{style:[{zIndex:9e3,position:"absolute",top:i.height},a==="bottom-start"?{left:0}:{right:0},t],exit:{opacity:{from:1,to:0},scale:{from:1,to:0},transformOriginX:{from:s,to:s},transformOriginY:{from:"top",to:"top"},easing:_.medium},motion:{opacity:{from:0,to:1},scale:{from:0,to:1},transformOriginX:{from:s,to:s},transformOriginY:{from:"top",to:"top"},easing:_.medium},...n,children:r})})}function L({defaultOpen:t=!1,onOpen:r,onClose:n,...e}){const[l,a]=g(t),i=x(()=>{r?.(),a(!0)},[r]),f=x(()=>{n?.(),a(!1)},[n]);return o(y,{open:l,onOpen:i,onClose:f,...e})}export function Trigger(t){return t.open!=null?o(y,{...t}):o(L,{...t})}Trigger.zIndex=w;const h=(t,r)=>{if(t&&r&&t._nativeTag===r._nativeTag)return!0;if(r._children&&r._children.length>0){for(let n=0;n<=r._children.length-1;n++)if(h(t,r._children[n]))return!0}return!1};

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

@@ -1,2 +1,2 @@
-export * from './Dropdown';
-export * from './Trigger';
+export * from './Dropdown.js';
+export * from './Trigger.js';

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

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

package/dist/esm/components/dropdown/contexts/DropdownContext.d.ts

@@ -1,6 +1,6 @@
-import { ReactNode, RefObject } from 'react';
-import { View } from 'react-native';
-import { Placement } from '../types';
+import type { ReactNode, RefObject } from 'react';
+import type { View } from 'react-native';
+import type { Placement } from '../types.js';
 interface DropdownProviderProps {
     open?: boolean;
     placement: Placement;

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

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

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

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

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

@@ -1,4 +1,4 @@
-import { ReactElement, RefCallback, RefObject } from 'react';
+import type { ReactElement, RefCallback, RefObject } from 'react';
 export type ReactElementWithRef = ReactElement & {
     ref?: RefObject<any> | RefCallback<any>;
 };

package/dist/esm/components/error-page/ErrorPage.js

@@ -1,2 +1,2 @@
-"use strict";import{jsx as t,jsxs as h}from"react/jsx-runtime";import{Image as f}from"react-native";import{useAdaptive as b}from"../../core";import{Asset as C}from"../asset";import{Button as i}from"../button";import{FixedBottomCTA as x,FixedBottomCTAProvider as A}from"../fixed-bottom-cta";import{Top as r}from"../top";export const ErrorPage=({statusCode:e=500,title:s,subtitle:o,onPressLeftButton:a,onPressRightButton:u,children:n})=>{const l=b(),{title:m,subtitle:p,image:c}=j(e),d=s??m,g=o??p;return h(A,{children:[t(r,{title:t(r.TitleParagraph,{color:l.grey900,children:d}),subtitle2:t(r.SubtitleParagraph,{children:g}),upper:t(r.UpperAssetContent,{content:t(f,{source:{uri:c},"aria-hidden":!0,style:C.frameShape.CleanW60})})}),n,t(x.Double,{leftButton:t(i,{type:"dark",style:"weak",onPress:a,children:"\uACE0\uAC1D\uC13C\uD130 \uBB38\uC758"}),rightButton:t(i,{type:"primary",style:"fill",onPress:u,children:e===400?"\uB2E4\uC2DC \uC785\uB825\uD558\uAE30":"\uB2EB\uAE30"})})]})};const j=e=>{switch(e){case 404:return{title:"\uC815\uBCF4\uB97C \uBD88\uB7EC\uC624\uC9C0 \uBABB\uD588\uC5B4\uC694",subtitle:"\uC7A0\uC2DC \uD6C4 \uB2E4\uC2DC \uC2DC\uB3C4\uD558\uAC70\uB098, \uBB38\uC81C\uAC00 \uBC18\uBCF5\uB41C\uB2E4\uBA74 \uACE0\uAC1D\uC13C\uD130\uB85C \uBB38\uC758\uD574\uC8FC\uC138\uC694.",image:"https://static.toss.im/3d-emojis/u1F519-return.png"};case 400:return{title:`\uC785\uB825\uD55C \uC815\uBCF4\uB97C 
+"use strict";import{jsx as t,jsxs as h}from"react/jsx-runtime";import{Image as f}from"react-native";import{useAdaptive as b}from"../../core/index.js";import{Asset as C}from"../asset/index.js";import{Button as i}from"../button/index.js";import{FixedBottomCTA as x,FixedBottomCTAProvider as A}from"../fixed-bottom-cta/index.js";import{Top as r}from"../top/index.js";export const ErrorPage=({statusCode:e=500,title:s,subtitle:o,onPressLeftButton:a,onPressRightButton:u,children:n})=>{const l=b(),{title:m,subtitle:p,image:c}=j(e),d=s??m,g=o??p;return h(A,{children:[t(r,{title:t(r.TitleParagraph,{color:l.grey900,children:d}),subtitle2:t(r.SubtitleParagraph,{children:g}),upper:t(r.UpperAssetContent,{content:t(f,{source:{uri:c},"aria-hidden":!0,style:C.frameShape.CleanW60})})}),n,t(x.Double,{leftButton:t(i,{type:"dark",style:"weak",onPress:a,children:"\uACE0\uAC1D\uC13C\uD130 \uBB38\uC758"}),rightButton:t(i,{type:"primary",style:"fill",onPress:u,children:e===400?"\uB2E4\uC2DC \uC785\uB825\uD558\uAE30":"\uB2EB\uAE30"})})]})};const j=e=>{switch(e){case 404:return{title:"\uC815\uBCF4\uB97C \uBD88\uB7EC\uC624\uC9C0 \uBABB\uD588\uC5B4\uC694",subtitle:"\uC7A0\uC2DC \uD6C4 \uB2E4\uC2DC \uC2DC\uB3C4\uD558\uAC70\uB098, \uBB38\uC81C\uAC00 \uBC18\uBCF5\uB41C\uB2E4\uBA74 \uACE0\uAC1D\uC13C\uD130\uB85C \uBB38\uC758\uD574\uC8FC\uC138\uC694.",image:"https://static.toss.im/3d-emojis/u1F519-return.png"};case 400:return{title:`\uC785\uB825\uD55C \uC815\uBCF4\uB97C 
 \uB2E4\uC2DC \uD655\uC778\uD574\uC8FC\uC138\uC694`,subtitle:"\uC815\uD655\uD558\uC9C0 \uC54A\uC740 \uC815\uBCF4\uAC00 \uC788\uC5B4\uC694. \uB9DE\uAC8C \uC785\uB825\uD588\uB294\uB370\uB3C4 \uBB38\uC81C\uAC00 \uBC18\uBCF5\uB41C\uB2E4\uBA74 \uACE0\uAC1D\uC13C\uD130\uB85C \uBB38\uC758\uD574\uC8FC\uC138\uC694.",image:"https://static.toss.im/3d-emojis/u1F519-return.png"};default:return{title:"\uC77C\uC2DC\uC801\uC778 \uC624\uB958\uAC00 \uC0DD\uACBC\uC5B4\uC694",subtitle:"\uBB38\uC81C\uC758 \uC6D0\uC778\uC744 \uCC3E\uC544 \uD574\uACB0\uD558\uACE0 \uC788\uC5B4\uC694. \uBB38\uC81C\uAC00 \uBC18\uBCF5\uB41C\uB2E4\uBA74 \uACE0\uAC1D\uC13C\uD130\uB85C \uBB38\uC758\uD574\uC8FC\uC138\uC694.",image:"https://static.toss.im/3d-emojis/u1F6A7-orange-cone.png"}}};

package/dist/esm/components/error-page/index.d.ts

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

package/dist/esm/components/error-page/index.js

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

package/dist/esm/components/fixed-bottom-cta/FixedBottomCTA.d.ts

@@ -1,4 +1,4 @@
-import { BottomCTADoubleProps, BottomCTASingleProps } from '../bottom-cta';
+import type { BottomCTADoubleProps, BottomCTASingleProps } from '../bottom-cta/index.js';
 export type FixedBottomCTASingleProps = Omit<BottomCTASingleProps, 'display' | 'keyboardStyleEnabled'>;
 export type FixedBottomCTADoubleProps = Omit<BottomCTADoubleProps, 'keyboardStyleEnabled'>;
 /**

package/dist/esm/components/fixed-bottom-cta/FixedBottomCTA.js

@@ -1 +1 @@
-"use strict";import{jsx as o}from"react/jsx-runtime";import{BottomCTA as r,BottomCTAGradient as n}from"../bottom-cta";import{useAdaptive as i}from"../../core";import{FixedBottomCTAConsumer as u}from"./providers/FixedBottomCTAContext";export function FixedBottomCTAWithoutConsumer(t){const e=i();return o(r.Single,{keyboardStyleEnabled:!0,gradient:o(n,{stopColor:e.background}),...t})}export function FixedBottomCTADoubleWithoutConsumer(t){const e=i();return o(r.Double,{keyboardStyleEnabled:!0,gradient:o(n,{stopColor:e.background}),...t})}export function FixedBottomCTA(t){return o(u,{children:o(FixedBottomCTAWithoutConsumer,{...t})})}function d(t){return o(u,{children:o(FixedBottomCTADoubleWithoutConsumer,{...t})})}FixedBottomCTA.Double=d;
+"use strict";import{jsx as o}from"react/jsx-runtime";import{BottomCTA as r,BottomCTAGradient as n}from"../bottom-cta/index.js";import{useAdaptive as i}from"../../core/index.js";import{FixedBottomCTAConsumer as u}from"./providers/FixedBottomCTAContext.js";export function FixedBottomCTAWithoutConsumer(t){const e=i();return o(r.Single,{keyboardStyleEnabled:!0,gradient:o(n,{stopColor:e.background}),...t})}export function FixedBottomCTADoubleWithoutConsumer(t){const e=i();return o(r.Double,{keyboardStyleEnabled:!0,gradient:o(n,{stopColor:e.background}),...t})}export function FixedBottomCTA(t){return o(u,{children:o(FixedBottomCTAWithoutConsumer,{...t})})}function d(t){return o(u,{children:o(FixedBottomCTADoubleWithoutConsumer,{...t})})}FixedBottomCTA.Double=d;

package/dist/esm/components/fixed-bottom-cta/index.d.ts

@@ -1,2 +1,2 @@
-export * from './FixedBottomCTA';
-export { FixedBottomCTAProvider, FixedBottomCTAConsumer } from './providers/FixedBottomCTAContext';
+export * from './FixedBottomCTA.js';
+export { FixedBottomCTAProvider, FixedBottomCTAConsumer } from './providers/FixedBottomCTAContext.js';

package/dist/esm/components/fixed-bottom-cta/index.js

@@ -1 +1 @@
-"use strict";export*from"./FixedBottomCTA";export{FixedBottomCTAProvider,FixedBottomCTAConsumer}from"./providers/FixedBottomCTAContext";
+"use strict";export*from"./FixedBottomCTA.js";export{FixedBottomCTAProvider,FixedBottomCTAConsumer}from"./providers/FixedBottomCTAContext.js";

package/dist/esm/components/fixed-bottom-cta/providers/FixedBottomCTAContext.d.ts

@@ -1,4 +1,4 @@
-import { ComponentType, ReactElement, ReactNode } from 'react';
+import type { ComponentType, ReactElement, ReactNode } from 'react';
 export declare function FixedBottomCTAProvider<WrapperProps = unknown>({ children, wrapper, wrapperProps, }: {
     children: ReactNode;
     wrapper?: ComponentType<WrapperProps>;

package/dist/esm/components/fixed-bottom-cta/providers/FixedBottomCTAContext.js

@@ -1 +1 @@
-"use strict";import{jsx as n,Fragment as f,jsxs as s}from"react/jsx-runtime";import{KeyboardAboveView as T}from"@granite-js/react-native";import{BottomCTAGradient as c}from"../../bottom-cta";import{createContext as A,useCallback as u,useContext as B,useEffect as F,useMemo as h,useState as E}from"react";import{ScrollView as v,View as a}from"react-native";const x=A(null);export function FixedBottomCTAProvider({children:t,wrapper:e=v,wrapperProps:o}){const r=e,[d,l]=E(null),i=u(C=>{l(C)},[]),m=u(()=>{l(null)},[]),p=h(()=>({render:i,cleanup:m}),[i,m]);return s(x.Provider,{value:p,children:[n(r,{style:{flex:1},...o,children:s(f,{children:[t,n(a,{style:{height:c.HEIGHT}})]})}),s(T,{children:[n(a,{style:{marginTop:-(c.HEIGHT-1)}}),d]})]})}export function FixedBottomCTAConsumer({children:t}){const e=B(x);if(e==null)throw new Error("FixedBottomCTAContext \uB294 FixedBottomCTAProvider \uC5D0\uC11C \uC2E4\uD589\uD574\uC57C\uD569\uB2C8\uB2E4.");const{render:o,cleanup:r}=e;return F(()=>(o(t),()=>{r()}),[t,r,o]),null}
+"use strict";import{jsx as n,Fragment as f,jsxs as s}from"react/jsx-runtime";import{KeyboardAboveView as T}from"@granite-js/react-native";import{BottomCTAGradient as c}from"../../bottom-cta/index.js";import{createContext as A,useCallback as u,useContext as B,useEffect as F,useMemo as h,useState as E}from"react";import{ScrollView as v,View as a}from"react-native";const x=A(null);export function FixedBottomCTAProvider({children:t,wrapper:e=v,wrapperProps:o}){const r=e,[d,l]=E(null),i=u(C=>{l(C)},[]),m=u(()=>{l(null)},[]),p=h(()=>({render:i,cleanup:m}),[i,m]);return s(x.Provider,{value:p,children:[n(r,{style:{flex:1},...o,children:s(f,{children:[t,n(a,{style:{height:c.HEIGHT}})]})}),s(T,{children:[n(a,{style:{marginTop:-(c.HEIGHT-1)}}),d]})]})}export function FixedBottomCTAConsumer({children:t}){const e=B(x);if(e==null)throw new Error("FixedBottomCTAContext \uB294 FixedBottomCTAProvider \uC5D0\uC11C \uC2E4\uD589\uD574\uC57C\uD569\uB2C8\uB2E4.");const{render:o,cleanup:r}=e;return F(()=>(o(t),()=>{r()}),[t,r,o]),null}

package/dist/esm/components/gradient/LinearGradient.d.ts

@@ -1,4 +1,5 @@
-import { Svg, SvgProps } from '@granite-js/native/react-native-svg';
-import { GetLinearGradientOption } from '@toss/tds-color-utils';
+import type { SvgProps } from '@granite-js/native/react-native-svg';
+import { Svg } from '@granite-js/native/react-native-svg';
+import type { GetLinearGradientOption } from '@toss/tds-color-utils';
 export type LinearGradientProps = GetLinearGradientOption & SvgProps;
 export declare const LinearGradient: import("react").ForwardRefExoticComponent<LinearGradientProps & import("react").RefAttributes<Svg>>;

package/dist/esm/components/gradient/RadialGradient.d.ts

@@ -1,4 +1,5 @@
-import { Svg, SvgProps } from '@granite-js/native/react-native-svg';
+import type { SvgProps } from '@granite-js/native/react-native-svg';
+import { Svg } from '@granite-js/native/react-native-svg';
 type ColorWithOpacity = {
     value: string;
     opacity?: number;

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

@@ -1,4 +1,4 @@
-export { LinearGradient } from './LinearGradient';
-export type { LinearGradientProps } from './LinearGradient';
-export { RadialGradient } from './RadialGradient';
-export type { RadialGradientProps } from './RadialGradient';
+export { LinearGradient } from './LinearGradient.js';
+export type { LinearGradientProps } from './LinearGradient.js';
+export { RadialGradient } from './RadialGradient.js';
+export type { RadialGradientProps } from './RadialGradient.js';

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

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

package/dist/esm/components/grid-list/GridList.d.ts

@@ -1,5 +1,5 @@
-import { GridListItem } from './GridListItem';
-import { GridListProps } from './types';
+import { GridListItem } from './GridListItem.js';
+import type { GridListProps } from './types.js';
 /**
  *
  * @example

package/dist/esm/components/grid-list/GridList.js

@@ -1 +1 @@
-"use strict";import{jsx as r}from"react/jsx-runtime";import{StyleSheet as m,View as n}from"react-native";import{MARGIN as s}from"./const";import{GridListContext as a}from"./GridListContext";import{GridListItem as f}from"./GridListItem";function t({children:e,column:i,style:o}){return r(a.Provider,{value:{column:i},children:r(n,{style:[l.container,o],children:e})})}const l=m.create({container:{flexWrap:"wrap",flexDirection:"row",margin:s*-1}});t.Item=f;export default t;
+"use strict";import{jsx as r}from"react/jsx-runtime";import{StyleSheet as m,View as n}from"react-native";import{MARGIN as s}from"./const.js";import{GridListContext as a}from"./GridListContext.js";import{GridListItem as f}from"./GridListItem.js";function t({children:e,column:i,style:o}){return r(a.Provider,{value:{column:i},children:r(n,{style:[l.container,o],children:e})})}const l=m.create({container:{flexWrap:"wrap",flexDirection:"row",margin:s*-1}});t.Item=f;export default t;

package/dist/esm/components/grid-list/GridListContext.d.ts

@@ -1,4 +1,4 @@
-import type { GridListColumn } from './types';
+import type { GridListColumn } from './types.js';
 export interface GridListContext {
     column: GridListColumn;
 }

package/dist/esm/components/grid-list/GridListItem.d.ts

@@ -1,2 +1,2 @@
-import { GridListItemProps } from './types';
+import type { GridListItemProps } from './types.js';
 export declare function GridListItem({ image, title, style, onPress }: GridListItemProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/grid-list/GridListItem.js

@@ -1 +1 @@
-"use strict";import{jsx as t,jsxs as d}from"react/jsx-runtime";import{useAdaptive as a}from"../../core";import{Txt as p}from"../txt";import{isReactText as g}from"../../utils";import{Children as f,useContext as y}from"react";import{StyleSheet as h,TouchableHighlight as u,View as e}from"react-native";import{MARGIN as x}from"./const";import{GridListContext as C}from"./GridListContext";function j({children:i}){const r=a();return t(p,{typography:"st11",color:r.grey900,fontWeight:"medium",style:{textAlign:"center"},children:i})}export function GridListItem({image:i,title:r,style:s,onPress:l}){const n=a(),{column:c}=y(C);return t(e,{style:{flexBasis:`${100/c}%`},children:t(u,{activeOpacity:1,underlayColor:n.grey100,style:[m.itemContainer,{backgroundColor:n.opacity50},s],onPress:l,children:d(e,{children:[t(e,{style:m.itemImageContainer,children:i}),t(e,{children:f.map(r,o=>g(o)?t(j,{children:o}):o)})]})})})}const m=h.create({itemContainer:{margin:x,flex:1,paddingVertical:12,paddingHorizontal:8,borderRadius:9},itemImageContainer:{alignItems:"center",justifyContent:"center",maxHeight:28,marginBottom:6}});
+"use strict";import{jsx as t,jsxs as d}from"react/jsx-runtime";import{useAdaptive as a}from"../../core/index.js";import{Txt as p}from"../txt/index.js";import{isReactText as g}from"../../utils/index.js";import{Children as f,useContext as y}from"react";import{StyleSheet as h,TouchableHighlight as u,View as e}from"react-native";import{MARGIN as x}from"./const.js";import{GridListContext as C}from"./GridListContext.js";function j({children:i}){const r=a();return t(p,{typography:"st11",color:r.grey900,fontWeight:"medium",style:{textAlign:"center"},children:i})}export function GridListItem({image:i,title:r,style:s,onPress:l}){const n=a(),{column:c}=y(C);return t(e,{style:{flexBasis:`${100/c}%`},children:t(u,{activeOpacity:1,underlayColor:n.grey100,style:[m.itemContainer,{backgroundColor:n.opacity50},s],onPress:l,children:d(e,{children:[t(e,{style:m.itemImageContainer,children:i}),t(e,{children:f.map(r,o=>g(o)?t(j,{children:o}):o)})]})})})}const m=h.create({itemContainer:{margin:x,flex:1,paddingVertical:12,paddingHorizontal:8,borderRadius:9},itemImageContainer:{alignItems:"center",justifyContent:"center",maxHeight:28,marginBottom:6}});

package/dist/esm/components/grid-list/index.d.ts

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

package/dist/esm/components/grid-list/index.js

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

package/dist/esm/components/grid-list/types.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
-import { StyleProp, TouchableHighlightProps, ViewStyle } from 'react-native';
+import type { ReactNode } from 'react';
+import type { StyleProp, TouchableHighlightProps, ViewStyle } from 'react-native';
 export type GridListColumn = 1 | 2 | 3;
 export interface GridListProps {
     children: ReactNode | ReactNode[];

package/dist/esm/components/highlight/Highlight.d.ts

@@ -1,3 +1,3 @@
 import { View } from 'react-native';
-import type { HighlightProps } from './types';
+import type { HighlightProps } from './types.js';
 export declare const Highlight: import("react").ForwardRefExoticComponent<HighlightProps & import("react").RefAttributes<View>>;

package/dist/esm/components/highlight/Highlight.js

@@ -1 +1 @@
-"use strict";import{jsx as t}from"react/jsx-runtime";import{forwardRef as S,useEffect as V,useRef as W}from"react";import{View as n}from"react-native";import{colors as _}from"@toss/tds-colors";import{useOverlay as k}from"../../core";import{HighlightUI as q}from"./HighlightUI";import{useTimeout as z}from"./hooks";import{useTimestampRef as A}from"./hooks/useTimestampRef";import{mergeRefs as B}from"./utils/mergeRefs";export const Highlight=S(function({open:r,delay:c=0,padding:e=0,paddingLeft:u=e,paddingTop:l=e,paddingRight:h=e,paddingBottom:p=e,message:a,messageColor:g=_.white,messageXAlignment:w,messageYAlignment:R,onPress:o,onExited:v,onTargetPress:x,children:T,closeLockDuration:H=0,...i},I){const j={padding:e,paddingLeft:u,paddingTop:l,paddingRight:h,paddingBottom:p,message:a,messageColor:g,messageXAlignment:w,messageYAlignment:R,onPress:o,onTargetPress:x,...i},m=k(),s=z(),f=W(null),y=A({active:r});return V(()=>{if(r)return s.set(()=>{f.current?.measureInWindow((E,P,U,b)=>{m.open(({isOpen:C,close:D,exit:O})=>t(q,{...j,x:E,y:P,width:U,height:b,open:C,onPress:()=>{new Date().getTime()-y.current>H*1e3&&(o?.(),D())},onExited:()=>{v?.(),O()}}))})},c*1e3),s.clear;m.close()},[r]),t(n,{...i,children:t(n,{ref:B(I,f),removeClippedSubviews:!1,children:T})})});
+"use strict";import{jsx as t}from"react/jsx-runtime";import{forwardRef as S,useEffect as V,useRef as W}from"react";import{View as n}from"react-native";import{colors as _}from"@toss/tds-colors";import{useOverlay as k}from"../../core/index.js";import{HighlightUI as q}from"./HighlightUI.js";import{useTimeout as z}from"./hooks/index.js";import{useTimestampRef as A}from"./hooks/useTimestampRef.js";import{mergeRefs as B}from"./utils/mergeRefs.js";export const Highlight=S(function({open:r,delay:c=0,padding:e=0,paddingLeft:u=e,paddingTop:l=e,paddingRight:h=e,paddingBottom:p=e,message:a,messageColor:g=_.white,messageXAlignment:w,messageYAlignment:R,onPress:o,onExited:v,onTargetPress:x,children:T,closeLockDuration:H=0,...i},I){const j={padding:e,paddingLeft:u,paddingTop:l,paddingRight:h,paddingBottom:p,message:a,messageColor:g,messageXAlignment:w,messageYAlignment:R,onPress:o,onTargetPress:x,...i},m=k(),s=z(),f=W(null),y=A({active:r});return V(()=>{if(r)return s.set(()=>{f.current?.measureInWindow((E,P,U,b)=>{m.open(({isOpen:C,close:D,exit:O})=>t(q,{...j,x:E,y:P,width:U,height:b,open:C,onPress:()=>{new Date().getTime()-y.current>H*1e3&&(o?.(),D())},onExited:()=>{v?.(),O()}}))})},c*1e3),s.clear;m.close()},[r]),t(n,{...i,children:t(n,{ref:B(I,f),removeClippedSubviews:!1,children:T})})});

package/dist/esm/components/highlight/HighlightUI.d.ts

@@ -1,3 +1,3 @@
 import { View } from 'react-native';
-import type { HighlightUIProps } from './types';
+import type { HighlightUIProps } from './types.js';
 export declare const HighlightUI: import("react").ForwardRefExoticComponent<HighlightUIProps & import("react").RefAttributes<View>>;

package/dist/esm/components/highlight/HighlightUI.js

@@ -1 +1 @@
-"use strict";import{jsx as i,jsxs as c,Fragment as I}from"react/jsx-runtime";import{forwardRef as U}from"react";import{Dimensions as X,StyleSheet as Y,View as _}from"react-native";import{colors as M}from"@toss/tds-colors";import{useAnimatePresence as T}from"../../utils";import{Message as W,MessageBox as k,PassClickEventThroughHoleOverlay as B,SvgHighlightOverlay as C}from"./components";import{useHighlightUIAnimation as D}from"./hooks";import{addLayoutPadding as L,getElementXAlignment as R,getElementYAlignment as V}from"./utils";export const HighlightUI=U(function({open:y,x:l,y:r,width:s,height:a,padding:e=0,paddingLeft:p=e,paddingTop:u=e,paddingRight:f=e,paddingBottom:A=e,message:t,messageColor:d=M.white,messageXAlignment:v,messageYAlignment:w,onPress:x,onExited:H,onTargetPress:S,...m},E){const n=L({layout:{x:l,y:r,width:s,height:a},padding:{paddingLeft:p,paddingTop:u,paddingRight:f,paddingBottom:A}}),{style:o,enter:j,exit:O}=D(),{width:P,height:b}=X.get("window"),F=v??R({x:l,width:s,parentWidth:P}),g=w??V({y:r,height:a,parentHeight:b}),{presenceState:h}=T(y,{enter:j,exit:O,onExited:H});return h==="invisible"?null:c(I,{children:[c(_,{ref:E,...m,style:[Y.absoluteFill,{pointerEvents:"none"},m.style],children:[i(C,{layout:n,opacity:o.overlayOpacity,holeStep:o.holeStep}),t&&i(k,{layout:n,opacity:o.messageOpacity,yAlignment:g,children:typeof t=="string"?i(W,{layout:n,color:d,xAlignment:F,yAlignment:g,children:t}):t})]}),i(B,{layout:n,onPress:x,onTargetPress:S,style:{pointerEvents:h==="invisible-animation"?"none":"auto"}})]})});
+"use strict";import{jsx as i,jsxs as c,Fragment as I}from"react/jsx-runtime";import{forwardRef as U}from"react";import{Dimensions as X,StyleSheet as Y,View as _}from"react-native";import{colors as M}from"@toss/tds-colors";import{useAnimatePresence as T}from"../../utils/index.js";import{Message as W,MessageBox as k,PassClickEventThroughHoleOverlay as B,SvgHighlightOverlay as C}from"./components/index.js";import{useHighlightUIAnimation as D}from"./hooks/index.js";import{addLayoutPadding as L,getElementXAlignment as R,getElementYAlignment as V}from"./utils/index.js";export const HighlightUI=U(function({open:y,x:l,y:r,width:s,height:a,padding:e=0,paddingLeft:p=e,paddingTop:u=e,paddingRight:f=e,paddingBottom:A=e,message:t,messageColor:d=M.white,messageXAlignment:v,messageYAlignment:w,onPress:x,onExited:H,onTargetPress:S,...m},E){const n=L({layout:{x:l,y:r,width:s,height:a},padding:{paddingLeft:p,paddingTop:u,paddingRight:f,paddingBottom:A}}),{style:o,enter:j,exit:O}=D(),{width:P,height:b}=X.get("window"),F=v??R({x:l,width:s,parentWidth:P}),g=w??V({y:r,height:a,parentHeight:b}),{presenceState:h}=T(y,{enter:j,exit:O,onExited:H});return h==="invisible"?null:c(I,{children:[c(_,{ref:E,...m,style:[Y.absoluteFill,{pointerEvents:"none"},m.style],children:[i(C,{layout:n,opacity:o.overlayOpacity,holeStep:o.holeStep}),t&&i(k,{layout:n,opacity:o.messageOpacity,yAlignment:g,children:typeof t=="string"?i(W,{layout:n,color:d,xAlignment:F,yAlignment:g,children:t}):t})]}),i(B,{layout:n,onPress:x,onTargetPress:S,style:{pointerEvents:h==="invisible-animation"?"none":"auto"}})]})});

package/dist/esm/components/highlight/components/Message.d.ts

@@ -1,4 +1,4 @@
-import type { Layout, XAlignmentValue, YAlignmentValue } from '../types';
+import type { Layout, XAlignmentValue, YAlignmentValue } from '../types.js';
 type MessageProps = {
     color: string;
     children: string;

package/dist/esm/components/highlight/components/Message.js

@@ -1 +1 @@
-"use strict";import{jsx as f}from"react/jsx-runtime";import{Txt as p}from"../../txt";import{useState as l}from"react";import{Dimensions as m}from"react-native";export const Message=({color:r,children:s,layout:o,xAlignment:t,yAlignment:n})=>{const[d,a]=l(null),e=t==="center"?-(d?.width??0)/2+o.x+o.width/2:t==="left"?10:0,i=t==="right"?10:0;return f(p,{onLayout:h=>{a(h.nativeEvent.layout)},color:r,typography:"t6",fontWeight:"bold",textAlign:t,style:{position:"absolute",maxWidth:m.get("window").width-(i+e),left:e,right:i,bottom:n==="top"?0:void 0},children:s})};
+"use strict";import{jsx as f}from"react/jsx-runtime";import{Txt as p}from"../../txt/index.js";import{useState as l}from"react";import{Dimensions as m}from"react-native";export const Message=({color:r,children:s,layout:o,xAlignment:t,yAlignment:n})=>{const[d,a]=l(null),e=t==="center"?-(d?.width??0)/2+o.x+o.width/2:t==="left"?10:0,i=t==="right"?10:0;return f(p,{onLayout:h=>{a(h.nativeEvent.layout)},color:r,typography:"t6",fontWeight:"bold",textAlign:t,style:{position:"absolute",maxWidth:m.get("window").width-(i+e),left:e,right:i,bottom:n==="top"?0:void 0},children:s})};

package/dist/esm/components/highlight/components/MessageBox.d.ts

@@ -1,6 +1,6 @@
 import { type ReactNode } from 'react';
-import { Animated as ReactNativeAnimated } from 'react-native';
-import type { Layout, YAlignmentValue } from '../types';
+import type { Animated as ReactNativeAnimated } from 'react-native';
+import type { Layout, YAlignmentValue } from '../types.js';
 type MessageBoxProps = {
     layout: Layout;
     yAlignment: YAlignmentValue;

package/dist/esm/components/highlight/components/MessageBox.js

@@ -1 +1 @@
-"use strict";import{jsx as m,jsxs as w}from"react/jsx-runtime";import{useEffect as v,useRef as x}from"react";import{Dimensions as D,Easing as i,View as b}from"react-native";import{bezier as r}from"@toss/tds-easings";import{Animated as e}from"../../../interactions/animated";import{Asset as u}from"../../asset";import{sToMs as s}from"../utils";const n=12;export const MessageBox=({layout:{x:l,y:a,width:f,height:c},yAlignment:p,opacity:g,children:d})=>{const{height:h}=D.get("window"),o=x(new e.Value(0)).current,t=p==="top";return v(()=>{e.sequence([e.timing(o,{toValue:t?5:-5,useNativeDriver:!0,easing:i.bezier(...r.out),duration:s(.6)}),e.timing(o,{toValue:t?-5:5,useNativeDriver:!0,easing:i.bezier(...r.out),duration:s(.8)}),e.timing(o,{toValue:t?5:-5,useNativeDriver:!0,easing:i.bezier(...r.out),duration:s(.8)})]).start()},[]),w(e.View,{style:[{position:"absolute",left:0,right:0},t?{bottom:h-a+n,flexDirection:"column-reverse"}:{top:a+c+n,flexDirection:"column"},{transform:[{translateY:o}],opacity:g}],children:[m(u.Icon,{style:{left:l+f/2-n,transform:[{rotateX:t?"180deg":"0deg"}]},frameShape:u.frameShape.CleanW24,name:"icon-arrow-up-sidebar-mono",color:"white"}),m(b,{style:[{position:"relative",width:"100%"}],children:d})]})};
+"use strict";import{jsx as m,jsxs as w}from"react/jsx-runtime";import{useEffect as v,useRef as x}from"react";import{Dimensions as D,Easing as i,View as b}from"react-native";import{bezier as r}from"@toss/tds-easings";import{Animated as e}from"../../../interactions/animated/index.js";import{Asset as u}from"../../asset/index.js";import{sToMs as s}from"../utils/index.js";const n=12;export const MessageBox=({layout:{x:l,y:a,width:f,height:c},yAlignment:p,opacity:g,children:d})=>{const{height:h}=D.get("window"),o=x(new e.Value(0)).current,t=p==="top";return v(()=>{e.sequence([e.timing(o,{toValue:t?5:-5,useNativeDriver:!0,easing:i.bezier(...r.out),duration:s(.6)}),e.timing(o,{toValue:t?-5:5,useNativeDriver:!0,easing:i.bezier(...r.out),duration:s(.8)}),e.timing(o,{toValue:t?5:-5,useNativeDriver:!0,easing:i.bezier(...r.out),duration:s(.8)})]).start()},[]),w(e.View,{style:[{position:"absolute",left:0,right:0},t?{bottom:h-a+n,flexDirection:"column-reverse"}:{top:a+c+n,flexDirection:"column"},{transform:[{translateY:o}],opacity:g}],children:[m(u.Icon,{style:{left:l+f/2-n,transform:[{rotateX:t?"180deg":"0deg"}]},frameShape:u.frameShape.CleanW24,name:"icon-arrow-up-sidebar-mono",color:"white"}),m(b,{style:[{position:"relative",width:"100%"}],children:d})]})};

package/dist/esm/components/highlight/components/PassClickEventThroughHoleOverlay.d.ts

@@ -1,5 +1,5 @@
 import { type ViewProps } from 'react-native';
-import type { Layout } from '../types';
+import type { Layout } from '../types.js';
 type PassClickEventThroughHoleOverlayProps = {
     layout: Layout;
     onPress?: () => void;

package/dist/esm/components/highlight/components/PassClickEventThroughHoleOverlay.js

@@ -1 +1 @@
-"use strict";import{jsx as e}from"react/jsx-runtime";import{Pressable as o,StyleSheet as a}from"react-native";import{getHoleAnimateVariants as h}from"./getHoleAnimateVariants";export const PassClickEventThroughHoleOverlay=({layout:s,onPress:r,onTargetPress:i,style:l})=>{const{default:t}=h(s);return e(o,{onPress:r,style:[a.absoluteFill,l],children:e(o,{onPress:i,style:[{position:"absolute",left:t.x,top:t.y,width:t.width,height:t.height,borderRadius:t.radius}]})})};
+"use strict";import{jsx as e}from"react/jsx-runtime";import{Pressable as o,StyleSheet as a}from"react-native";import{getHoleAnimateVariants as h}from"./getHoleAnimateVariants.js";export const PassClickEventThroughHoleOverlay=({layout:s,onPress:r,onTargetPress:i,style:l})=>{const{default:t}=h(s);return e(o,{onPress:r,style:[a.absoluteFill,l],children:e(o,{onPress:i,style:[{position:"absolute",left:t.x,top:t.y,width:t.width,height:t.height,borderRadius:t.radius}]})})};

package/dist/esm/components/highlight/components/SvgHighlightOverlay.d.ts

@@ -1,5 +1,5 @@
-import { Animated as ReactNativeAnimated } from 'react-native';
-import type { Layout } from '../types';
+import type { Animated as ReactNativeAnimated } from 'react-native';
+import type { Layout } from '../types.js';
 type SvgHighlightOverlayProps = {
     layout: Layout;
     opacity: ReactNativeAnimated.Value;

package/dist/esm/components/highlight/components/SvgHighlightOverlay.js

@@ -1 +1 @@
-"use strict";import{jsx as t,jsxs as s}from"react/jsx-runtime";import m,{ClipPath as p,Defs as d,Rect as h}from"@granite-js/native/react-native-svg";import{StyleSheet as f}from"react-native";import{Animated as e}from"../../../interactions/animated";import{useAdaptive as g,useColorPreference as _}from"../../../core";import{SvgHolePath as H}from"./SvgHolePath";const P=e.createAnimatedComponent(m),y=e.createAnimatedComponent(h),o="HIGHLIGHT_SVG_HOLE_CLIP_PATH_ID";export const SvgHighlightOverlay=({layout:r,opacity:i,holeStep:a})=>{const{colorPreference:n}=_(),l=g(),c=n==="dark"?"rgba(33, 33, 38, 0.87)":l.greyOpacity700;return s(P,{width:"100%",height:"100%",style:f.absoluteFill,children:[t(d,{children:t(p,{id:o,children:t(H,{step:a,layout:r})})}),t(y,{x:"0",y:"0",width:"100%",height:"100%",fillOpacity:i,fill:c,clipPath:`url(#${o})`})]})};
+"use strict";import{jsx as t,jsxs as s}from"react/jsx-runtime";import{Svg as m,ClipPath as p,Defs as d,Rect as h}from"@granite-js/native/react-native-svg";import{StyleSheet as f}from"react-native";import{Animated as e}from"../../../interactions/animated/index.js";import{useAdaptive as g,useColorPreference as _}from"../../../core/index.js";import{SvgHolePath as H}from"./SvgHolePath.js";const P=e.createAnimatedComponent(m),y=e.createAnimatedComponent(h),o="HIGHLIGHT_SVG_HOLE_CLIP_PATH_ID";export const SvgHighlightOverlay=({layout:r,opacity:i,holeStep:a})=>{const{colorPreference:n}=_(),l=g(),c=n==="dark"?"rgba(33, 33, 38, 0.87)":l.greyOpacity700;return s(P,{width:"100%",height:"100%",style:f.absoluteFill,children:[t(d,{children:t(p,{id:o,children:t(H,{step:a,layout:r})})}),t(y,{x:"0",y:"0",width:"100%",height:"100%",fillOpacity:i,fill:c,clipPath:`url(#${o})`})]})};

package/dist/esm/components/highlight/components/SvgHolePath.d.ts

@@ -1,5 +1,5 @@
-import { Animated as ReactNativeAnimated } from 'react-native';
-import type { Layout } from '../types';
+import type { Animated as ReactNativeAnimated } from 'react-native';
+import type { Layout } from '../types.js';
 type Props = {
     step: ReactNativeAnimated.Value;
     layout: Layout;

package/dist/esm/components/highlight/components/SvgHolePath.js

@@ -1,4 +1,4 @@
-"use strict";import{jsx as m}from"react/jsx-runtime";import{Path as s}from"@granite-js/native/react-native-svg";import{Animated as c}from"../../../interactions/animated";import{generateRadiusRectanglePath as h,generateWindowPath as d}from"../utils";import{getHoleAnimateVariants as l}from"./getHoleAnimateVariants";const P=c.createAnimatedComponent(s);export const SvgHolePath=({step:e,layout:a})=>{const t=l(a),o=n(t.initial),i=n(t.default),r=n(t.exit);return m(P,{clipRule:"evenodd",d:e.interpolate({inputRange:[0,1,2],outputRange:[o,i,r]})})};const n=e=>{const a=h(e);return`
+"use strict";import{jsx as m}from"react/jsx-runtime";import{Path as s}from"@granite-js/native/react-native-svg";import{Animated as c}from"../../../interactions/animated/index.js";import{generateRadiusRectanglePath as h,generateWindowPath as d}from"../utils/index.js";import{getHoleAnimateVariants as l}from"./getHoleAnimateVariants.js";const P=c.createAnimatedComponent(s);export const SvgHolePath=({step:e,layout:a})=>{const t=l(a),o=n(t.initial),i=n(t.default),r=n(t.exit);return m(P,{clipRule:"evenodd",d:e.interpolate({inputRange:[0,1,2],outputRange:[o,i,r]})})};const n=e=>{const a=h(e);return`
   ${d()}
   ${a}
   `};

package/dist/esm/components/highlight/components/getHoleAnimateVariants.d.ts

@@ -1,4 +1,4 @@
-import type { Layout } from '../types';
+import type { Layout } from '../types.js';
 export declare const getHoleAnimateVariants: ({ x, y, width, height }: Layout) => {
     initial: {
         x: number;

package/dist/esm/components/highlight/components/getHoleAnimateVariants.js

@@ -1 +1 @@
-"use strict";import{Dimensions as z}from"react-native";import{calculateOffset as t}from"../utils";export const getHoleAnimateVariants=({x:n,y:s,width:i,height:e})=>{const{width:c,height:x}=z.get("window"),a=i*.9,o=e*.9,r=c*2.5,d=x*1.5;return{initial:{x:t({base:n,prevSize:i,nextSize:a}),y:t({base:s,prevSize:e,nextSize:o}),width:a,height:o,radius:16},default:{x:n,y:s,width:i,height:e,radius:16},exit:{x:t({base:n,prevSize:i,nextSize:r}),y:t({base:s,prevSize:e,nextSize:d}),width:r,height:d,radius:1e3}}};
+"use strict";import{Dimensions as z}from"react-native";import{calculateOffset as t}from"../utils/index.js";export const getHoleAnimateVariants=({x:n,y:s,width:i,height:e})=>{const{width:c,height:x}=z.get("window"),a=i*.9,o=e*.9,r=c*2.5,d=x*1.5;return{initial:{x:t({base:n,prevSize:i,nextSize:a}),y:t({base:s,prevSize:e,nextSize:o}),width:a,height:o,radius:16},default:{x:n,y:s,width:i,height:e,radius:16},exit:{x:t({base:n,prevSize:i,nextSize:r}),y:t({base:s,prevSize:e,nextSize:d}),width:r,height:d,radius:1e3}}};

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

@@ -1,4 +1,4 @@
-export { Message } from './Message';
-export { MessageBox } from './MessageBox';
-export { PassClickEventThroughHoleOverlay } from './PassClickEventThroughHoleOverlay';
-export { SvgHighlightOverlay } from './SvgHighlightOverlay';
+export { Message } from './Message.js';
+export { MessageBox } from './MessageBox.js';
+export { PassClickEventThroughHoleOverlay } from './PassClickEventThroughHoleOverlay.js';
+export { SvgHighlightOverlay } from './SvgHighlightOverlay.js';

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

@@ -1 +1 @@
-"use strict";export{Message}from"./Message";export{MessageBox}from"./MessageBox";export{PassClickEventThroughHoleOverlay}from"./PassClickEventThroughHoleOverlay";export{SvgHighlightOverlay}from"./SvgHighlightOverlay";
+"use strict";export{Message}from"./Message.js";export{MessageBox}from"./MessageBox.js";export{PassClickEventThroughHoleOverlay}from"./PassClickEventThroughHoleOverlay.js";export{SvgHighlightOverlay}from"./SvgHighlightOverlay.js";

package/dist/esm/components/highlight/hooks/index.d.ts

@@ -1,2 +1,2 @@
-export { useHighlightUIAnimation } from './useHighlightUIAnimation';
-export { useTimeout } from './useTimeout';
+export { useHighlightUIAnimation } from './useHighlightUIAnimation.js';
+export { useTimeout } from './useTimeout.js';

package/dist/esm/components/highlight/hooks/index.js

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

package/dist/esm/components/highlight/hooks/useHighlightUIAnimation.js

@@ -1 +1 @@
-"use strict";import{useRef as o}from"react";import{Platform as u}from"react-native";import{spring as r}from"@toss/tds-easings";import{Animated as e}from"../../../interactions/animated";export const useHighlightUIAnimation=()=>{const t=u.OS==="android",i=o(new e.Value(t?1:0)).current,a=o(new e.Value(0)).current,n=o(new e.Value(0)).current;return{style:{overlayOpacity:a,holeStep:i,messageOpacity:n},enter:()=>new Promise(s=>e.parallel([...t?[]:[e.spring(i,{...r.basic,toValue:1,useNativeDriver:!0})],e.spring(a,{...r.basic,toValue:1,useNativeDriver:!0}),e.spring(n,{...r.quick,toValue:1,useNativeDriver:!0})]).start(()=>{s()})),exit:()=>new Promise(s=>{e.parallel([...t?[]:[e.spring(i,{...r.slow,toValue:2,useNativeDriver:!0})],e.spring(a,{...r.basic,toValue:0,useNativeDriver:!0}),e.spring(n,{...r.rapid,toValue:0,useNativeDriver:!0})]).start(()=>{s()})})}};
+"use strict";import{useRef as o}from"react";import{Platform as u}from"react-native";import{spring as r}from"@toss/tds-easings";import{Animated as e}from"../../../interactions/animated/index.js";export const useHighlightUIAnimation=()=>{const t=u.OS==="android",i=o(new e.Value(t?1:0)).current,a=o(new e.Value(0)).current,n=o(new e.Value(0)).current;return{style:{overlayOpacity:a,holeStep:i,messageOpacity:n},enter:()=>new Promise(s=>e.parallel([...t?[]:[e.spring(i,{...r.basic,toValue:1,useNativeDriver:!0})],e.spring(a,{...r.basic,toValue:1,useNativeDriver:!0}),e.spring(n,{...r.quick,toValue:1,useNativeDriver:!0})]).start(()=>{s()})),exit:()=>new Promise(s=>{e.parallel([...t?[]:[e.spring(i,{...r.slow,toValue:2,useNativeDriver:!0})],e.spring(a,{...r.basic,toValue:0,useNativeDriver:!0}),e.spring(n,{...r.rapid,toValue:0,useNativeDriver:!0})]).start(()=>{s()})})}};

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

@@ -1,2 +1,2 @@
-export { Highlight } from './Highlight';
-export type { HighlightProps } from './types';
+export { Highlight } from './Highlight.js';
+export type { HighlightProps } from './types.js';

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

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

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

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 import type { ViewProps } from 'react-native';
 export type Layout = Pick<HighlightUIProps, 'x' | 'y' | 'width' | 'height'>;
 export type XAlignmentValue = 'left' | 'center' | 'right';

package/dist/esm/components/highlight/utils/addLayoutPadding.d.ts

@@ -1,4 +1,4 @@
-import type { Layout } from '../types';
+import type { Layout } from '../types.js';
 type AddLayoutPaddingProps = {
     layout: Layout;
     padding: {

package/dist/esm/components/highlight/utils/generateSvgPath.d.ts

@@ -1,4 +1,4 @@
-import type { Layout } from '../types';
+import type { Layout } from '../types.js';
 export declare const generateRadiusRectanglePath: ({ x, y, width, height, radius }: Layout & {
     radius: number;
 }) => string;

package/dist/esm/components/highlight/utils/index.d.ts

@@ -1,5 +1,5 @@
-export { addLayoutPadding } from './addLayoutPadding';
-export { calculateOffset } from './calculateOffset';
-export { generateOverlayPath, generateRadiusRectanglePath, generateWindowPath } from './generateSvgPath';
-export { getElementXAlignment, getElementYAlignment } from './getElementAlignment';
-export { sToMs } from './sToMs';
+export { addLayoutPadding } from './addLayoutPadding.js';
+export { calculateOffset } from './calculateOffset.js';
+export { generateOverlayPath, generateRadiusRectanglePath, generateWindowPath } from './generateSvgPath.js';
+export { getElementXAlignment, getElementYAlignment } from './getElementAlignment.js';
+export { sToMs } from './sToMs.js';

package/dist/esm/components/highlight/utils/index.js

@@ -1 +1 @@
-"use strict";export{addLayoutPadding}from"./addLayoutPadding";export{calculateOffset}from"./calculateOffset";export{generateOverlayPath,generateRadiusRectanglePath,generateWindowPath}from"./generateSvgPath";export{getElementXAlignment,getElementYAlignment}from"./getElementAlignment";export{sToMs}from"./sToMs";
+"use strict";export{addLayoutPadding}from"./addLayoutPadding.js";export{calculateOffset}from"./calculateOffset.js";export{generateOverlayPath,generateRadiusRectanglePath,generateWindowPath}from"./generateSvgPath.js";export{getElementXAlignment,getElementYAlignment}from"./getElementAlignment.js";export{sToMs}from"./sToMs.js";

package/dist/esm/components/icon/Icon.d.ts

@@ -1,4 +1,5 @@
-import { View, ViewProps } from 'react-native';
+import type { ViewProps } from 'react-native';
+import { View } from 'react-native';
 export interface IconProps extends Pick<ViewProps, 'accessibilityLabel' | 'accessible' | 'style'> {
     size?: number;
     color?: string;

package/dist/esm/components/icon/Icon.js

@@ -1 +1 @@
-"use strict";import{jsx as c,jsxs as x}from"react/jsx-runtime";import{SvgUri as R,SvgXml as _}from"@granite-js/native/react-native-svg";import{forwardRef as y,useMemo as I}from"react";import{View as U}from"react-native";import{useCachedData as $}from"./useCachedData";const A="https://static.toss.im/icons/svg",a={},j=t=>t.includes("<pattern")?{isUnsupported:!0,tagName:"pattern"}:{isUnsupported:!1},k=y(function({name:e,color:s,size:n=24,accessible:f,accessibilityLabel:d,type:p="default",style:i},h){const{data:r,showFallback:g}=$(a,e,u,[e]),o=j(r??"");if(o.isUnsupported&&__DEV__)throw new Error(`\uC544\uC774\uCF58 \uB9AC\uC18C\uC2A4\uC5D0 \uBBF8\uC9C0\uC6D0\uB418\uB294 \uD0DC\uADF8\uAC00 \uC788\uC5B4 \uC548\uC804\uD558\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4. #request-\uADF8\uB798\uD53D \uCC44\uB110\uC5D0 \uB300\uCCB4 \uC544\uC774\uCF58\uC744 \uC694\uCCAD \uD574\uC8FC\uC138\uC694. (\uC544\uC774\uCF58\uBA85: ${e}, \uBBF8\uC9C0\uC6D0 \uD0DC\uADF8: ${o.tagName})`);const m=I(()=>{if(r===void 0)return;const w=/fill="#[0-9a-fA-F]{6}"/g,b=/stroke="#[0-9a-fA-F]{6}"/g;return s!==void 0?r.replace(w,`fill="${s}"`).replace(b,`stroke="${s}"`):r},[r,s]);return x(U,{ref:h,style:[p==="circle"?{borderRadius:n/2,overflow:"hidden"}:void 0,{width:n,aspectRatio:1},...Array.isArray(i)?i:[i]],accessibilityRole:"image",accessibilityLabel:d,accessible:f,children:[c(_,{width:"100%",height:"100%",color:s,fill:s,xml:m??null}),g?c(R,{width:"100%",height:"100%",uri:l(e),style:{backgroundColor:"yellow"}}):null]})});async function u(t){return(await fetch(l(t))).text()}function l(t){const e=t.startsWith("icn-")||t.startsWith("icon-")?t:`icn-${t}`;return`${A}/${e}.svg`}export default Object.assign(k,{prefetchIcon:async t=>{const e=await u(t);a[t]=e}});
+"use strict";import{jsx as c,jsxs as x}from"react/jsx-runtime";import{SvgUri as R,SvgXml as _}from"@granite-js/native/react-native-svg";import{forwardRef as y,useMemo as I}from"react";import{View as U}from"react-native";import{useCachedData as $}from"./useCachedData.js";const A="https://static.toss.im/icons/svg",a={},j=t=>t.includes("<pattern")?{isUnsupported:!0,tagName:"pattern"}:{isUnsupported:!1},k=y(function({name:e,color:s,size:n=24,accessible:f,accessibilityLabel:d,type:p="default",style:i},h){const{data:r,showFallback:g}=$(a,e,u,[e]),o=j(r??"");if(o.isUnsupported&&__DEV__)throw new Error(`\uC544\uC774\uCF58 \uB9AC\uC18C\uC2A4\uC5D0 \uBBF8\uC9C0\uC6D0\uB418\uB294 \uD0DC\uADF8\uAC00 \uC788\uC5B4 \uC548\uC804\uD558\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4. #request-\uADF8\uB798\uD53D \uCC44\uB110\uC5D0 \uB300\uCCB4 \uC544\uC774\uCF58\uC744 \uC694\uCCAD \uD574\uC8FC\uC138\uC694. (\uC544\uC774\uCF58\uBA85: ${e}, \uBBF8\uC9C0\uC6D0 \uD0DC\uADF8: ${o.tagName})`);const m=I(()=>{if(r===void 0)return;const w=/fill="#[0-9a-fA-F]{6}"/g,b=/stroke="#[0-9a-fA-F]{6}"/g;return s!==void 0?r.replace(w,`fill="${s}"`).replace(b,`stroke="${s}"`):r},[r,s]);return x(U,{ref:h,style:[p==="circle"?{borderRadius:n/2,overflow:"hidden"}:void 0,{width:n,aspectRatio:1},...Array.isArray(i)?i:[i]],accessibilityRole:"image",accessibilityLabel:d,accessible:f,children:[c(_,{width:"100%",height:"100%",color:s,fill:s,xml:m??null}),g?c(R,{width:"100%",height:"100%",uri:l(e),style:{backgroundColor:"yellow"}}):null]})});async function u(t){return(await fetch(l(t))).text()}function l(t){const e=t.startsWith("icn-")||t.startsWith("icon-")?t:`icn-${t}`;return`${A}/${e}.svg`}export default Object.assign(k,{prefetchIcon:async t=>{const e=await u(t);a[t]=e}});

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

@@ -1,2 +1,2 @@
-export { default as Icon } from './Icon';
-export type { IconProps } from './Icon';
+export { default as Icon } from './Icon.js';
+export type { IconProps } from './Icon.js';

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

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

package/dist/esm/components/icon/private/SvgIcon.d.ts

@@ -1,4 +1,4 @@
-import { SvgProps } from '@granite-js/native/react-native-svg';
+import type { SvgProps } from '@granite-js/native/react-native-svg';
 import { Component } from 'react';
 export interface SvgIconProps extends SvgProps {
     size?: number;

package/dist/esm/components/icon/private/SvgIcon.js

@@ -1 +1 @@
-"use strict";import{jsx as s,jsxs as d}from"react/jsx-runtime";import{Circle as B,ClipPath as N,Defs as U,G as h,parse as m,Svg as f,SvgUri as W}from"@granite-js/native/react-native-svg";import{Component as $,forwardRef as D,useMemo as g}from"react";import{useCachedData as L}from"../useCachedData";const M="https://static.toss.im/icons/svg",x={},v=/fill="#[0-9a-fA-F]{6}"/g,b=/stroke="#[0-9a-fA-F]{6}"/g,O=D(function({name:e,color:r,size:c=24,accessible:R,accessibilityLabel:j,type:y="default",children:o,...A},l){const{data:n,showFallback:P}=L(x,e,I,[e]),i=g(()=>n===void 0?null:r!==void 0?m(n.replace(v,"").replace(b,"")):m(n),[n,r]),S=g(()=>n===void 0||r===void 0?{}:{fill:n.match(v)?r:void 0,stroke:n.match(b)?r:void 0},[n,r]),a={width:c,height:c,accessibilityRole:"image",accessibilityLabel:j,accessible:R,...S,...A};if(i==null)return s(f,{ref:l,...a,children:o});if(P)return s(W,{uri:w(e),...a,children:o});const[,,u=c,p=c]=(i.props.viewBox??"").split(" ").map(Number);if(y==="circle"){const k=u/2,F=p/2,_=Math.min(u,p)/2;return d(f,{ref:l,...i.props,...a,children:[s(U,{children:s(N,{id:"clip",children:s(B,{cx:k,cy:F,r:_})})}),s(h,{clipPath:"url(#clip)",children:i.children}),o]})}return d(f,{ref:l,...i.props,...a,children:[s(h,{children:i.children}),o]})});async function I(t){return(await fetch(w(t))).text()}function w(t){const e=t.startsWith("icn-")||t.startsWith("icon-")?t:`icn-${t}`;return`${M}/${e}.svg`}class C extends ${render(){return s(O,{...this.props})}}export const SvgIcon=Object.assign(C,{Root:C,prefetchIcon:async t=>{const e=await I(t);x[t]=e}});
+"use strict";import{jsx as s,jsxs as d}from"react/jsx-runtime";import{Circle as B,ClipPath as N,Defs as U,G as h,parse as m,Svg as f,SvgUri as W}from"@granite-js/native/react-native-svg";import{Component as $,forwardRef as D,useMemo as g}from"react";import{useCachedData as L}from"../useCachedData.js";const M="https://static.toss.im/icons/svg",x={},v=/fill="#[0-9a-fA-F]{6}"/g,b=/stroke="#[0-9a-fA-F]{6}"/g,O=D(function({name:e,color:r,size:c=24,accessible:R,accessibilityLabel:j,type:y="default",children:o,...A},l){const{data:n,showFallback:P}=L(x,e,I,[e]),i=g(()=>n===void 0?null:r!==void 0?m(n.replace(v,"").replace(b,"")):m(n),[n,r]),S=g(()=>n===void 0||r===void 0?{}:{fill:n.match(v)?r:void 0,stroke:n.match(b)?r:void 0},[n,r]),a={width:c,height:c,accessibilityRole:"image",accessibilityLabel:j,accessible:R,...S,...A};if(i==null)return s(f,{ref:l,...a,children:o});if(P)return s(W,{uri:w(e),...a,children:o});const[,,u=c,p=c]=(i.props.viewBox??"").split(" ").map(Number);if(y==="circle"){const k=u/2,F=p/2,_=Math.min(u,p)/2;return d(f,{ref:l,...i.props,...a,children:[s(U,{children:s(N,{id:"clip",children:s(B,{cx:k,cy:F,r:_})})}),s(h,{clipPath:"url(#clip)",children:i.children}),o]})}return d(f,{ref:l,...i.props,...a,children:[s(h,{children:i.children}),o]})});async function I(t){return(await fetch(w(t))).text()}function w(t){const e=t.startsWith("icn-")||t.startsWith("icon-")?t:`icn-${t}`;return`${M}/${e}.svg`}class C extends ${render(){return s(O,{...this.props})}}export const SvgIcon=Object.assign(C,{Root:C,prefetchIcon:async t=>{const e=await I(t);x[t]=e}});

package/dist/esm/components/icon/private/index.d.ts

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

package/dist/esm/components/icon/private/index.js

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

package/dist/esm/components/icon-button/IconButton.d.ts

@@ -1,5 +1,5 @@
-import { ImageProps as SvgImageProps } from '@granite-js/native/react-native-svg';
-import { PressableProps, StyleProp, View, ViewStyle } from 'react-native';
+import type { ImageProps as SvgImageProps } from '@granite-js/native/react-native-svg';
+import type { PressableProps, StyleProp, View, ViewStyle } from 'react-native';
 type Variant = 'fill' | 'clear' | 'border';
 type Asset = {
     source: SvgImageProps['href'];

package/dist/esm/components/icon-button/IconButton.js

@@ -1 +1 @@
-"use strict";import{jsx as u,jsxs as w,Fragment as _}from"react/jsx-runtime";import{Mask as W,Rect as Y,Svg as E,Image as H}from"@granite-js/native/react-native-svg";import{getNextColorValue as x}from"@toss/tds-color-utils";import{bezier as I,spring as o}from"@toss/tds-easings";import{forwardRef as L,memo as G,useCallback as p,useRef as g}from"react";import{Easing as V,Pressable as J}from"react-native";import{useAdaptive as Q}from"../../core";import{Animated as e}from"../../interactions/animated";import{generateHapticFeedback as T}from"../../native/generateHapticFeedback";import{SvgIcon as U}from"../icon/private";const X=e.createAnimatedComponent(E),Z=e.createAnimatedComponent(Y),$=e.createAnimatedComponent(J),z=L(function({source:h,name:b,color:i,bgColor:A,variant:r="clear",label:M,iconSize:c=24,children:N,style:D,onPressIn:v,onPressOut:y,...B},P){const C=Q(),m=A??C.greyOpacity100,j={borderWidth:1,borderStyle:"solid",borderColor:C.greyOpacity100},n=g(new e.Value(0)).current,a=g(new e.Value(1)).current,F=n.interpolate({inputRange:[0,1],outputRange:[m,x({color:m})]}),s=g(new e.Value(0)).current,S=s.interpolate({inputRange:[0,1],outputRange:["transparent",m]}),d=i!=null,l=g(new e.Value(0)).current,q=l.interpolate({inputRange:[0,1],outputRange:[i??"grey",i?x({color:i}):"grey"]}),R=p(()=>{e.spring(a,{toValue:.9,useNativeDriver:!1,...o.rapid}).start(),r==="fill"?e.timing(n,{toValue:1,useNativeDriver:!1,easing:V.bezier(...I.out),duration:500}).start():e.spring(s,{toValue:1,useNativeDriver:!1,...o.rapid}).start(),d&&e.spring(l,{toValue:1,useNativeDriver:!1,...o.rapid}).start()},[n,s,l,a,r,d]),k=p(()=>{e.spring(a,{toValue:1,useNativeDriver:!1,...o.quick}).start(),r==="fill"?e.timing(n,{toValue:0,useNativeDriver:!1,easing:V.bezier(...I.out),duration:500}).start():e.spring(s,{toValue:0,useNativeDriver:!1,...o.quick}).start(),d&&e.spring(l,{toValue:0,useNativeDriver:!1,...o.quick}).start()},[n,s,l,a,r,d]),K=p(f=>{R(),v?.(f),T({type:"tickWeak"})},[R,v]),O=p(f=>{k(),y?.(f)},[y,k]);return u($,{ref:P,style:[{borderRadius:te(c),transform:[{scale:a}],padding:ee(c),backgroundColor:r==="fill"?F:S,...r==="border"?j:void 0},D],onPressIn:K,onPressOut:O,accessible:!0,accessibilityRole:"button",accessibilityLabel:M,...B,children:u(X,{height:c,width:c,viewBox:"0 0 100 100",children:w(_,{children:[w(W,{id:"mask",x:"0",y:"0",width:"100",height:"100",children:[h!==void 0&&u(H,{href:h,x:"0",y:"0",height:"100",width:"100",preserveAspectRatio:"xMidYMid meet"}),b!==void 0&&u(U,{name:b,x:"0",y:"0",height:"100",width:"100",preserveAspectRatio:"xMidYMid meet"})]}),u(Z,{x:"0",y:"0",width:"100%",height:"100%",mask:"url(#mask)",fill:i&&q}),N]})})})});export const IconButton=G(z);function ee(t){return 18<=t&&t<=20?9:t/2}function te(t){return t<=16?6:t<=20?8:12}
+"use strict";import{jsx as u,jsxs as w,Fragment as _}from"react/jsx-runtime";import{Mask as W,Rect as Y,Svg as E,Image as H}from"@granite-js/native/react-native-svg";import{getNextColorValue as x}from"@toss/tds-color-utils";import{bezier as I,spring as o}from"@toss/tds-easings";import{forwardRef as L,memo as G,useCallback as p,useRef as g}from"react";import{Easing as V,Pressable as J}from"react-native";import{useAdaptive as Q}from"../../core/index.js";import{Animated as e}from"../../interactions/animated/index.js";import{generateHapticFeedback as T}from"../../native/generateHapticFeedback.js";import{SvgIcon as U}from"../icon/private/index.js";const X=e.createAnimatedComponent(E),Z=e.createAnimatedComponent(Y),$=e.createAnimatedComponent(J),z=L(function({source:h,name:b,color:i,bgColor:A,variant:r="clear",label:M,iconSize:c=24,children:N,style:D,onPressIn:v,onPressOut:y,...B},P){const C=Q(),m=A??C.greyOpacity100,j={borderWidth:1,borderStyle:"solid",borderColor:C.greyOpacity100},n=g(new e.Value(0)).current,a=g(new e.Value(1)).current,F=n.interpolate({inputRange:[0,1],outputRange:[m,x({color:m})]}),s=g(new e.Value(0)).current,S=s.interpolate({inputRange:[0,1],outputRange:["transparent",m]}),d=i!=null,l=g(new e.Value(0)).current,q=l.interpolate({inputRange:[0,1],outputRange:[i??"grey",i?x({color:i}):"grey"]}),R=p(()=>{e.spring(a,{toValue:.9,useNativeDriver:!1,...o.rapid}).start(),r==="fill"?e.timing(n,{toValue:1,useNativeDriver:!1,easing:V.bezier(...I.out),duration:500}).start():e.spring(s,{toValue:1,useNativeDriver:!1,...o.rapid}).start(),d&&e.spring(l,{toValue:1,useNativeDriver:!1,...o.rapid}).start()},[n,s,l,a,r,d]),k=p(()=>{e.spring(a,{toValue:1,useNativeDriver:!1,...o.quick}).start(),r==="fill"?e.timing(n,{toValue:0,useNativeDriver:!1,easing:V.bezier(...I.out),duration:500}).start():e.spring(s,{toValue:0,useNativeDriver:!1,...o.quick}).start(),d&&e.spring(l,{toValue:0,useNativeDriver:!1,...o.quick}).start()},[n,s,l,a,r,d]),K=p(f=>{R(),v?.(f),T({type:"tickWeak"})},[R,v]),O=p(f=>{k(),y?.(f)},[y,k]);return u($,{ref:P,style:[{borderRadius:te(c),transform:[{scale:a}],padding:ee(c),backgroundColor:r==="fill"?F:S,...r==="border"?j:void 0},D],onPressIn:K,onPressOut:O,accessible:!0,accessibilityRole:"button",accessibilityLabel:M,...B,children:u(X,{height:c,width:c,viewBox:"0 0 100 100",children:w(_,{children:[w(W,{id:"mask",x:"0",y:"0",width:"100",height:"100",children:[h!==void 0&&u(H,{href:h,x:"0",y:"0",height:"100",width:"100",preserveAspectRatio:"xMidYMid meet"}),b!==void 0&&u(U,{name:b,x:"0",y:"0",height:"100",width:"100",preserveAspectRatio:"xMidYMid meet"})]}),u(Z,{x:"0",y:"0",width:"100%",height:"100%",mask:"url(#mask)",fill:i&&q}),N]})})})});export const IconButton=G(z);function ee(t){return 18<=t&&t<=20?9:t/2}function te(t){return t<=16?6:t<=20?8:12}

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

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

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

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

package/dist/esm/components/keypad/FullSecureKeypad/BackspaceIcon.js

@@ -1 +1 @@
-"use strict";import{jsx as o}from"react/jsx-runtime";import l,{Path as r}from"@granite-js/native/react-native-svg";import{colors as a}from"@toss/tds-colors";export function BackspaceIcon(){return o(l,{viewBox:"0 0 24 24","aria-label":"\uC9C0\uC6B0\uAE30",children:o(r,{fill:a.white,fillRule:"evenodd",d:"M20.966 10.8H6.93l5.451-5.451a1.2 1.2 0 10-1.697-1.697l-7.5 7.5c-.003.002-.004.006-.007.009a1.2 1.2 0 00-.252 1.298c.06.143.145.27.252.38l.007.01 7.5 7.5c.235.234.542.35.848.35a1.2 1.2 0 00.849-2.048L6.931 13.2h14.036a1.2 1.2 0 100-2.4"})})}
+"use strict";import{jsx as o}from"react/jsx-runtime";import{Svg as l,Path as r}from"@granite-js/native/react-native-svg";import{colors as a}from"@toss/tds-colors";export function BackspaceIcon(){return o(l,{viewBox:"0 0 24 24","aria-label":"\uC9C0\uC6B0\uAE30",children:o(r,{fill:a.white,fillRule:"evenodd",d:"M20.966 10.8H6.93l5.451-5.451a1.2 1.2 0 10-1.697-1.697l-7.5 7.5c-.003.002-.004.006-.007.009a1.2 1.2 0 00-.252 1.298c.06.143.145.27.252.38l.007.01 7.5 7.5c.235.234.542.35.848.35a1.2 1.2 0 00.849-2.048L6.931 13.2h14.036a1.2 1.2 0 100-2.4"})})}

package/dist/esm/components/keypad/FullSecureKeypad/ControlKeyButton.js

@@ -1 +1 @@
-"use strict";import{jsx as e}from"react/jsx-runtime";import{Txt as n}from"../../txt";import{Pressable as s}from"react-native";export function ControlKeyButton({children:t,onPressIn:o,color:r,disabled:i=!1}){return e(s,{onPressIn:o,style:[{borderWidth:0,padding:0,display:"flex",alignItems:"center",justifyContent:"center",width:"100%",height:"100%",backgroundColor:r}],accessibilityRole:"button",disabled:i,children:typeof t=="string"?e(n,{style:{color:"white",fontSize:17},children:t}):t})}
+"use strict";import{jsx as e}from"react/jsx-runtime";import{Txt as n}from"../../txt/index.js";import{Pressable as s}from"react-native";export function ControlKeyButton({children:t,onPressIn:o,color:r,disabled:i=!1}){return e(s,{onPressIn:o,style:[{borderWidth:0,padding:0,display:"flex",alignItems:"center",justifyContent:"center",width:"100%",height:"100%",backgroundColor:r}],accessibilityRole:"button",disabled:i,children:typeof t=="string"?e(n,{style:{color:"white",fontSize:17},children:t}):t})}

package/dist/esm/components/keypad/FullSecureKeypad/GridItem.d.ts

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