@toss/tds-react-native 1.3.0 → 1.3.1

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

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

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

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

package/dist/cjs/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/cjs/components/fixed-bottom-cta/FixedBottomCTA.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FixedBottomCTAWithoutConsumer=FixedBottomCTAWithoutConsumer,exports.FixedBottomCTADoubleWithoutConsumer=FixedBottomCTADoubleWithoutConsumer,exports.FixedBottomCTA=FixedBottomCTA;const jsx_runtime_1=require("react/jsx-runtime"),bottom_cta_1=require("../bottom-cta"),core_1=require("../../core"),FixedBottomCTAContext_1=require("./providers/FixedBottomCTAContext");function FixedBottomCTAWithoutConsumer(t){const o=(0,core_1.useAdaptive)();return(0,jsx_runtime_1.jsx)(bottom_cta_1.BottomCTA.Single,{keyboardStyleEnabled:!0,gradient:(0,jsx_runtime_1.jsx)(bottom_cta_1.BottomCTAGradient,{stopColor:o.background}),...t})}function FixedBottomCTADoubleWithoutConsumer(t){const o=(0,core_1.useAdaptive)();return(0,jsx_runtime_1.jsx)(bottom_cta_1.BottomCTA.Double,{keyboardStyleEnabled:!0,gradient:(0,jsx_runtime_1.jsx)(bottom_cta_1.BottomCTAGradient,{stopColor:o.background}),...t})}function FixedBottomCTA(t){return(0,jsx_runtime_1.jsx)(FixedBottomCTAContext_1.FixedBottomCTAConsumer,{children:(0,jsx_runtime_1.jsx)(FixedBottomCTAWithoutConsumer,{...t})})}function FixedBottomCTADouble(t){return(0,jsx_runtime_1.jsx)(FixedBottomCTAContext_1.FixedBottomCTAConsumer,{children:(0,jsx_runtime_1.jsx)(FixedBottomCTADoubleWithoutConsumer,{...t})})}FixedBottomCTA.Double=FixedBottomCTADouble;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FixedBottomCTAWithoutConsumer=FixedBottomCTAWithoutConsumer,exports.FixedBottomCTADoubleWithoutConsumer=FixedBottomCTADoubleWithoutConsumer,exports.FixedBottomCTA=FixedBottomCTA;const jsx_runtime_1=require("react/jsx-runtime"),index_js_1=require("../bottom-cta/index.js"),index_js_2=require("../../core/index.js"),FixedBottomCTAContext_js_1=require("./providers/FixedBottomCTAContext.js");function FixedBottomCTAWithoutConsumer(t){const e=(0,index_js_2.useAdaptive)();return(0,jsx_runtime_1.jsx)(index_js_1.BottomCTA.Single,{keyboardStyleEnabled:!0,gradient:(0,jsx_runtime_1.jsx)(index_js_1.BottomCTAGradient,{stopColor:e.background}),...t})}function FixedBottomCTADoubleWithoutConsumer(t){const e=(0,index_js_2.useAdaptive)();return(0,jsx_runtime_1.jsx)(index_js_1.BottomCTA.Double,{keyboardStyleEnabled:!0,gradient:(0,jsx_runtime_1.jsx)(index_js_1.BottomCTAGradient,{stopColor:e.background}),...t})}function FixedBottomCTA(t){return(0,jsx_runtime_1.jsx)(FixedBottomCTAContext_js_1.FixedBottomCTAConsumer,{children:(0,jsx_runtime_1.jsx)(FixedBottomCTAWithoutConsumer,{...t})})}function FixedBottomCTADouble(t){return(0,jsx_runtime_1.jsx)(FixedBottomCTAContext_js_1.FixedBottomCTAConsumer,{children:(0,jsx_runtime_1.jsx)(FixedBottomCTADoubleWithoutConsumer,{...t})})}FixedBottomCTA.Double=FixedBottomCTADouble;

package/dist/cjs/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/cjs/components/fixed-bottom-cta/index.js

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

package/dist/cjs/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/cjs/components/fixed-bottom-cta/providers/FixedBottomCTAContext.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FixedBottomCTAProvider=FixedBottomCTAProvider,exports.FixedBottomCTAConsumer=FixedBottomCTAConsumer;const jsx_runtime_1=require("react/jsx-runtime"),react_native_1=require("@granite-js/react-native"),bottom_cta_1=require("../../bottom-cta"),react_1=require("react"),react_native_2=require("react-native"),FixedBottomCTAContext=(0,react_1.createContext)(null);function FixedBottomCTAProvider({children:e,wrapper:t=react_native_2.ScrollView,wrapperProps:o}){const r=t,[c,n]=(0,react_1.useState)(null),s=(0,react_1.useCallback)(l=>{n(l)},[]),i=(0,react_1.useCallback)(()=>{n(null)},[]),u=(0,react_1.useMemo)(()=>({render:s,cleanup:i}),[s,i]);return(0,jsx_runtime_1.jsxs)(FixedBottomCTAContext.Provider,{value:u,children:[(0,jsx_runtime_1.jsx)(r,{style:{flex:1},...o,children:(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[e,(0,jsx_runtime_1.jsx)(react_native_2.View,{style:{height:bottom_cta_1.BottomCTAGradient.HEIGHT}})]})}),(0,jsx_runtime_1.jsxs)(react_native_1.KeyboardAboveView,{children:[(0,jsx_runtime_1.jsx)(react_native_2.View,{style:{marginTop:-(bottom_cta_1.BottomCTAGradient.HEIGHT-1)}}),c]})]})}function FixedBottomCTAConsumer({children:e}){const t=(0,react_1.useContext)(FixedBottomCTAContext);if(t==null)throw new Error("FixedBottomCTAContext \uB294 FixedBottomCTAProvider \uC5D0\uC11C \uC2E4\uD589\uD574\uC57C\uD569\uB2C8\uB2E4.");const{render:o,cleanup:r}=t;return(0,react_1.useEffect)(()=>(o(e),()=>{r()}),[e,r,o]),null}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FixedBottomCTAProvider=FixedBottomCTAProvider,exports.FixedBottomCTAConsumer=FixedBottomCTAConsumer;const jsx_runtime_1=require("react/jsx-runtime"),react_native_1=require("@granite-js/react-native"),index_js_1=require("../../bottom-cta/index.js"),react_1=require("react"),react_native_2=require("react-native"),FixedBottomCTAContext=(0,react_1.createContext)(null);function FixedBottomCTAProvider({children:e,wrapper:t=react_native_2.ScrollView,wrapperProps:r}){const o=t,[c,n]=(0,react_1.useState)(null),s=(0,react_1.useCallback)(l=>{n(l)},[]),i=(0,react_1.useCallback)(()=>{n(null)},[]),u=(0,react_1.useMemo)(()=>({render:s,cleanup:i}),[s,i]);return(0,jsx_runtime_1.jsxs)(FixedBottomCTAContext.Provider,{value:u,children:[(0,jsx_runtime_1.jsx)(o,{style:{flex:1},...r,children:(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[e,(0,jsx_runtime_1.jsx)(react_native_2.View,{style:{height:index_js_1.BottomCTAGradient.HEIGHT}})]})}),(0,jsx_runtime_1.jsxs)(react_native_1.KeyboardAboveView,{children:[(0,jsx_runtime_1.jsx)(react_native_2.View,{style:{marginTop:-(index_js_1.BottomCTAGradient.HEIGHT-1)}}),c]})]})}function FixedBottomCTAConsumer({children:e}){const t=(0,react_1.useContext)(FixedBottomCTAContext);if(t==null)throw new Error("FixedBottomCTAContext \uB294 FixedBottomCTAProvider \uC5D0\uC11C \uC2E4\uD589\uD574\uC57C\uD569\uB2C8\uB2E4.");const{render:r,cleanup:o}=t;return(0,react_1.useEffect)(()=>(r(e),()=>{o()}),[e,o,r]),null}

package/dist/cjs/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/cjs/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/cjs/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/cjs/components/gradient/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RadialGradient=exports.LinearGradient=void 0;var LinearGradient_1=require("./LinearGradient");Object.defineProperty(exports,"LinearGradient",{enumerable:!0,get:function(){return LinearGradient_1.LinearGradient}});var RadialGradient_1=require("./RadialGradient");Object.defineProperty(exports,"RadialGradient",{enumerable:!0,get:function(){return RadialGradient_1.RadialGradient}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RadialGradient=exports.LinearGradient=void 0;var LinearGradient_js_1=require("./LinearGradient.js");Object.defineProperty(exports,"LinearGradient",{enumerable:!0,get:function(){return LinearGradient_js_1.LinearGradient}});var RadialGradient_js_1=require("./RadialGradient.js");Object.defineProperty(exports,"RadialGradient",{enumerable:!0,get:function(){return RadialGradient_js_1.RadialGradient}});

package/dist/cjs/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/cjs/components/grid-list/GridList.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),react_native_1=require("react-native"),const_1=require("./const"),GridListContext_1=require("./GridListContext"),GridListItem_1=require("./GridListItem");function GridList({children:e,column:t,style:r}){return(0,jsx_runtime_1.jsx)(GridListContext_1.GridListContext.Provider,{value:{column:t},children:(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.container,r],children:e})})}const styles=react_native_1.StyleSheet.create({container:{flexWrap:"wrap",flexDirection:"row",margin:const_1.MARGIN*-1}});GridList.Item=GridListItem_1.GridListItem,exports.default=GridList;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),react_native_1=require("react-native"),const_js_1=require("./const.js"),GridListContext_js_1=require("./GridListContext.js"),GridListItem_js_1=require("./GridListItem.js");function GridList({children:e,column:t,style:r}){return(0,jsx_runtime_1.jsx)(GridListContext_js_1.GridListContext.Provider,{value:{column:t},children:(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[styles.container,r],children:e})})}const styles=react_native_1.StyleSheet.create({container:{flexWrap:"wrap",flexDirection:"row",margin:const_js_1.MARGIN*-1}});GridList.Item=GridListItem_js_1.GridListItem,exports.default=GridList;

package/dist/cjs/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/cjs/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/cjs/components/grid-list/GridListItem.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.GridListItem=GridListItem;const jsx_runtime_1=require("react/jsx-runtime"),core_1=require("../../core"),txt_1=require("../txt"),utils_1=require("../../utils"),react_1=require("react"),react_native_1=require("react-native"),const_1=require("./const"),GridListContext_1=require("./GridListContext");function GridListTitle({children:e}){const t=(0,core_1.useAdaptive)();return(0,jsx_runtime_1.jsx)(txt_1.Txt,{typography:"st11",color:t.grey900,fontWeight:"medium",style:{textAlign:"center"},children:e})}function GridListItem({image:e,title:t,style:n,onPress:s}){const r=(0,core_1.useAdaptive)(),{column:o}=(0,react_1.useContext)(GridListContext_1.GridListContext);return(0,jsx_runtime_1.jsx)(react_native_1.View,{style:{flexBasis:`${100/o}%`},children:(0,jsx_runtime_1.jsx)(react_native_1.TouchableHighlight,{activeOpacity:1,underlayColor:r.grey100,style:[styles.itemContainer,{backgroundColor:r.opacity50},n],onPress:s,children:(0,jsx_runtime_1.jsxs)(react_native_1.View,{children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:styles.itemImageContainer,children:e}),(0,jsx_runtime_1.jsx)(react_native_1.View,{children:react_1.Children.map(t,i=>(0,utils_1.isReactText)(i)?(0,jsx_runtime_1.jsx)(GridListTitle,{children:i}):i)})]})})})}const styles=react_native_1.StyleSheet.create({itemContainer:{margin:const_1.MARGIN,flex:1,paddingVertical:12,paddingHorizontal:8,borderRadius:9},itemImageContainer:{alignItems:"center",justifyContent:"center",maxHeight:28,marginBottom:6}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.GridListItem=GridListItem;const jsx_runtime_1=require("react/jsx-runtime"),index_js_1=require("../../core/index.js"),index_js_2=require("../txt/index.js"),index_js_3=require("../../utils/index.js"),react_1=require("react"),react_native_1=require("react-native"),const_js_1=require("./const.js"),GridListContext_js_1=require("./GridListContext.js");function GridListTitle({children:e}){const t=(0,index_js_1.useAdaptive)();return(0,jsx_runtime_1.jsx)(index_js_2.Txt,{typography:"st11",color:t.grey900,fontWeight:"medium",style:{textAlign:"center"},children:e})}function GridListItem({image:e,title:t,style:n,onPress:s}){const r=(0,index_js_1.useAdaptive)(),{column:o}=(0,react_1.useContext)(GridListContext_js_1.GridListContext);return(0,jsx_runtime_1.jsx)(react_native_1.View,{style:{flexBasis:`${100/o}%`},children:(0,jsx_runtime_1.jsx)(react_native_1.TouchableHighlight,{activeOpacity:1,underlayColor:r.grey100,style:[styles.itemContainer,{backgroundColor:r.opacity50},n],onPress:s,children:(0,jsx_runtime_1.jsxs)(react_native_1.View,{children:[(0,jsx_runtime_1.jsx)(react_native_1.View,{style:styles.itemImageContainer,children:e}),(0,jsx_runtime_1.jsx)(react_native_1.View,{children:react_1.Children.map(t,i=>(0,index_js_3.isReactText)(i)?(0,jsx_runtime_1.jsx)(GridListTitle,{children:i}):i)})]})})})}const styles=react_native_1.StyleSheet.create({itemContainer:{margin:const_js_1.MARGIN,flex:1,paddingVertical:12,paddingHorizontal:8,borderRadius:9},itemImageContainer:{alignItems:"center",justifyContent:"center",maxHeight:28,marginBottom:6}});

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

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

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

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

package/dist/cjs/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/cjs/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/cjs/components/highlight/Highlight.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Highlight=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),tds_colors_1=require("@toss/tds-colors"),core_1=require("../../core"),HighlightUI_1=require("./HighlightUI"),hooks_1=require("./hooks"),useTimestampRef_1=require("./hooks/useTimestampRef"),mergeRefs_1=require("./utils/mergeRefs");exports.Highlight=(0,react_1.forwardRef)(function({open:r,delay:u=0,padding:e=0,paddingLeft:n=e,paddingTop:l=e,paddingRight:h=e,paddingBottom:f=e,message:a,messageColor:m=tds_colors_1.colors.white,messageXAlignment:g,messageYAlignment:_,onPress:t,onExited:R,onTargetPress:q,children:v,closeLockDuration:x=0,...s},w){const j={padding:e,paddingLeft:n,paddingTop:l,paddingRight:h,paddingBottom:f,message:a,messageColor:m,messageXAlignment:g,messageYAlignment:_,onPress:t,onTargetPress:q,...s},i=(0,core_1.useOverlay)(),o=(0,hooks_1.useTimeout)(),c=(0,react_1.useRef)(null),p=(0,useTimestampRef_1.useTimestampRef)({active:r});return(0,react_1.useEffect)(()=>{if(r)return o.set(()=>{c.current?.measureInWindow((H,T,I,d)=>{i.open(({isOpen:U,close:k,exit:y})=>(0,jsx_runtime_1.jsx)(HighlightUI_1.HighlightUI,{...j,x:H,y:T,width:I,height:d,open:U,onPress:()=>{new Date().getTime()-p.current>x*1e3&&(t?.(),k())},onExited:()=>{R?.(),y()}}))})},u*1e3),o.clear;i.close()},[r]),(0,jsx_runtime_1.jsx)(react_native_1.View,{...s,children:(0,jsx_runtime_1.jsx)(react_native_1.View,{ref:(0,mergeRefs_1.mergeRefs)(w,c),removeClippedSubviews:!1,children:v})})});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Highlight=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),tds_colors_1=require("@toss/tds-colors"),index_js_1=require("../../core/index.js"),HighlightUI_js_1=require("./HighlightUI.js"),index_js_2=require("./hooks/index.js"),useTimestampRef_js_1=require("./hooks/useTimestampRef.js"),mergeRefs_js_1=require("./utils/mergeRefs.js");exports.Highlight=(0,react_1.forwardRef)(function({open:s,delay:c=0,padding:e=0,paddingLeft:u=e,paddingTop:l=e,paddingRight:h=e,paddingBottom:f=e,message:_,messageColor:a=tds_colors_1.colors.white,messageXAlignment:m,messageYAlignment:j,onPress:t,onExited:g,onTargetPress:x,children:R,closeLockDuration:q=0,...r},v){const d={padding:e,paddingLeft:u,paddingTop:l,paddingRight:h,paddingBottom:f,message:_,messageColor:a,messageXAlignment:m,messageYAlignment:j,onPress:t,onTargetPress:x,...r},i=(0,index_js_1.useOverlay)(),o=(0,index_js_2.useTimeout)(),n=(0,react_1.useRef)(null),w=(0,useTimestampRef_js_1.useTimestampRef)({active:s});return(0,react_1.useEffect)(()=>{if(s)return o.set(()=>{n.current?.measureInWindow((p,H,T,I)=>{i.open(({isOpen:U,close:y,exit:P})=>(0,jsx_runtime_1.jsx)(HighlightUI_js_1.HighlightUI,{...d,x:p,y:H,width:T,height:I,open:U,onPress:()=>{new Date().getTime()-w.current>q*1e3&&(t?.(),y())},onExited:()=>{g?.(),P()}}))})},c*1e3),o.clear;i.close()},[s]),(0,jsx_runtime_1.jsx)(react_native_1.View,{...r,children:(0,jsx_runtime_1.jsx)(react_native_1.View,{ref:(0,mergeRefs_js_1.mergeRefs)(v,n),removeClippedSubviews:!1,children:R})})});

package/dist/cjs/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/cjs/components/highlight/HighlightUI.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.HighlightUI=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),tds_colors_1=require("@toss/tds-colors"),utils_1=require("../../utils"),components_1=require("./components"),hooks_1=require("./hooks"),utils_2=require("./utils");exports.HighlightUI=(0,react_1.forwardRef)(function({open:g,x:s,y:o,width:r,height:l,padding:e=0,paddingLeft:h=e,paddingTop:m=e,paddingRight:y=e,paddingBottom:d=e,message:t,messageColor:p=tds_colors_1.colors.white,messageXAlignment:v,messageYAlignment:x,onPress:_,onExited:A,onTargetPress:j,...a},w){const n=(0,utils_2.addLayoutPadding)({layout:{x:s,y:o,width:r,height:l},padding:{paddingLeft:h,paddingTop:m,paddingRight:y,paddingBottom:d}}),{style:i,enter:q,exit:H}=(0,hooks_1.useHighlightUIAnimation)(),{width:f,height:S}=react_native_1.Dimensions.get("window"),E=v??(0,utils_2.getElementXAlignment)({x:s,width:r,parentWidth:f}),c=x??(0,utils_2.getElementYAlignment)({y:o,height:l,parentHeight:S}),{presenceState:u}=(0,utils_1.useAnimatePresence)(g,{enter:q,exit:H,onExited:A});return u==="invisible"?null:(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[(0,jsx_runtime_1.jsxs)(react_native_1.View,{ref:w,...a,style:[react_native_1.StyleSheet.absoluteFill,{pointerEvents:"none"},a.style],children:[(0,jsx_runtime_1.jsx)(components_1.SvgHighlightOverlay,{layout:n,opacity:i.overlayOpacity,holeStep:i.holeStep}),t&&(0,jsx_runtime_1.jsx)(components_1.MessageBox,{layout:n,opacity:i.messageOpacity,yAlignment:c,children:typeof t=="string"?(0,jsx_runtime_1.jsx)(components_1.Message,{layout:n,color:p,xAlignment:E,yAlignment:c,children:t}):t})]}),(0,jsx_runtime_1.jsx)(components_1.PassClickEventThroughHoleOverlay,{layout:n,onPress:_,onTargetPress:j,style:{pointerEvents:u==="invisible-animation"?"none":"auto"}})]})});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.HighlightUI=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),tds_colors_1=require("@toss/tds-colors"),index_js_1=require("../../utils/index.js"),index_js_2=require("./components/index.js"),index_js_3=require("./hooks/index.js"),index_js_4=require("./utils/index.js");exports.HighlightUI=(0,react_1.forwardRef)(function({open:u,x:s,y:o,width:r,height:l,padding:e=0,paddingLeft:h=e,paddingTop:d=e,paddingRight:y=e,paddingBottom:m=e,message:t,messageColor:x=tds_colors_1.colors.white,messageXAlignment:j,messageYAlignment:_,onPress:p,onExited:v,onTargetPress:A,...a},w){const n=(0,index_js_4.addLayoutPadding)({layout:{x:s,y:o,width:r,height:l},padding:{paddingLeft:h,paddingTop:d,paddingRight:y,paddingBottom:m}}),{style:i,enter:q,exit:H}=(0,index_js_3.useHighlightUIAnimation)(),{width:f,height:S}=react_native_1.Dimensions.get("window"),E=j??(0,index_js_4.getElementXAlignment)({x:s,width:r,parentWidth:f}),c=_??(0,index_js_4.getElementYAlignment)({y:o,height:l,parentHeight:S}),{presenceState:g}=(0,index_js_1.useAnimatePresence)(u,{enter:q,exit:H,onExited:v});return g==="invisible"?null:(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[(0,jsx_runtime_1.jsxs)(react_native_1.View,{ref:w,...a,style:[react_native_1.StyleSheet.absoluteFill,{pointerEvents:"none"},a.style],children:[(0,jsx_runtime_1.jsx)(index_js_2.SvgHighlightOverlay,{layout:n,opacity:i.overlayOpacity,holeStep:i.holeStep}),t&&(0,jsx_runtime_1.jsx)(index_js_2.MessageBox,{layout:n,opacity:i.messageOpacity,yAlignment:c,children:typeof t=="string"?(0,jsx_runtime_1.jsx)(index_js_2.Message,{layout:n,color:x,xAlignment:E,yAlignment:c,children:t}):t})]}),(0,jsx_runtime_1.jsx)(index_js_2.PassClickEventThroughHoleOverlay,{layout:n,onPress:p,onTargetPress:A,style:{pointerEvents:g==="invisible-animation"?"none":"auto"}})]})});

package/dist/cjs/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/cjs/components/highlight/components/Message.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Message=void 0;const jsx_runtime_1=require("react/jsx-runtime"),txt_1=require("../../txt"),react_1=require("react"),react_native_1=require("react-native"),Message=({color:s,children:i,layout:e,xAlignment:t,yAlignment:n})=>{const[a,c]=(0,react_1.useState)(null),o=t==="center"?-(a?.width??0)/2+e.x+e.width/2:t==="left"?10:0,r=t==="right"?10:0;return(0,jsx_runtime_1.jsx)(txt_1.Txt,{onLayout:u=>{c(u.nativeEvent.layout)},color:s,typography:"t6",fontWeight:"bold",textAlign:t,style:{position:"absolute",maxWidth:react_native_1.Dimensions.get("window").width-(r+o),left:o,right:r,bottom:n==="top"?0:void 0},children:i})};exports.Message=Message;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Message=void 0;const jsx_runtime_1=require("react/jsx-runtime"),index_js_1=require("../../txt/index.js"),react_1=require("react"),react_native_1=require("react-native"),Message=({color:r,children:i,layout:e,xAlignment:t,yAlignment:n})=>{const[a,c]=(0,react_1.useState)(null),s=t==="center"?-(a?.width??0)/2+e.x+e.width/2:t==="left"?10:0,o=t==="right"?10:0;return(0,jsx_runtime_1.jsx)(index_js_1.Txt,{onLayout:d=>{c(d.nativeEvent.layout)},color:r,typography:"t6",fontWeight:"bold",textAlign:t,style:{position:"absolute",maxWidth:react_native_1.Dimensions.get("window").width-(o+s),left:s,right:o,bottom:n==="top"?0:void 0},children:i})};exports.Message=Message;

package/dist/cjs/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/cjs/components/highlight/components/MessageBox.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.MessageBox=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),tds_easings_1=require("@toss/tds-easings"),animated_1=require("../../../interactions/animated"),asset_1=require("../../asset"),utils_1=require("../utils"),HORIZONTAL_PADDING=12,MessageBox=({layout:{x:i,y:s,width:r,height:n},yAlignment:o,opacity:a,children:u})=>{const{height:c}=react_native_1.Dimensions.get("window"),t=(0,react_1.useRef)(new animated_1.Animated.Value(0)).current,e=o==="top";return(0,react_1.useEffect)(()=>{animated_1.Animated.sequence([animated_1.Animated.timing(t,{toValue:e?5:-5,useNativeDriver:!0,easing:react_native_1.Easing.bezier(...tds_easings_1.bezier.out),duration:(0,utils_1.sToMs)(.6)}),animated_1.Animated.timing(t,{toValue:e?-5:5,useNativeDriver:!0,easing:react_native_1.Easing.bezier(...tds_easings_1.bezier.out),duration:(0,utils_1.sToMs)(.8)}),animated_1.Animated.timing(t,{toValue:e?5:-5,useNativeDriver:!0,easing:react_native_1.Easing.bezier(...tds_easings_1.bezier.out),duration:(0,utils_1.sToMs)(.8)})]).start()},[]),(0,jsx_runtime_1.jsxs)(animated_1.Animated.View,{style:[{position:"absolute",left:0,right:0},e?{bottom:c-s+HORIZONTAL_PADDING,flexDirection:"column-reverse"}:{top:s+n+HORIZONTAL_PADDING,flexDirection:"column"},{transform:[{translateY:t}],opacity:a}],children:[(0,jsx_runtime_1.jsx)(asset_1.Asset.Icon,{style:{left:i+r/2-HORIZONTAL_PADDING,transform:[{rotateX:e?"180deg":"0deg"}]},frameShape:asset_1.Asset.frameShape.CleanW24,name:"icon-arrow-up-sidebar-mono",color:"white"}),(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[{position:"relative",width:"100%"}],children:u})]})};exports.MessageBox=MessageBox;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.MessageBox=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),react_native_1=require("react-native"),tds_easings_1=require("@toss/tds-easings"),index_js_1=require("../../../interactions/animated/index.js"),index_js_2=require("../../asset/index.js"),index_js_3=require("../utils/index.js"),HORIZONTAL_PADDING=12,MessageBox=({layout:{x:i,y:s,width:r,height:n},yAlignment:o,opacity:a,children:u})=>{const{height:c}=react_native_1.Dimensions.get("window"),t=(0,react_1.useRef)(new index_js_1.Animated.Value(0)).current,e=o==="top";return(0,react_1.useEffect)(()=>{index_js_1.Animated.sequence([index_js_1.Animated.timing(t,{toValue:e?5:-5,useNativeDriver:!0,easing:react_native_1.Easing.bezier(...tds_easings_1.bezier.out),duration:(0,index_js_3.sToMs)(.6)}),index_js_1.Animated.timing(t,{toValue:e?-5:5,useNativeDriver:!0,easing:react_native_1.Easing.bezier(...tds_easings_1.bezier.out),duration:(0,index_js_3.sToMs)(.8)}),index_js_1.Animated.timing(t,{toValue:e?5:-5,useNativeDriver:!0,easing:react_native_1.Easing.bezier(...tds_easings_1.bezier.out),duration:(0,index_js_3.sToMs)(.8)})]).start()},[]),(0,jsx_runtime_1.jsxs)(index_js_1.Animated.View,{style:[{position:"absolute",left:0,right:0},e?{bottom:c-s+HORIZONTAL_PADDING,flexDirection:"column-reverse"}:{top:s+n+HORIZONTAL_PADDING,flexDirection:"column"},{transform:[{translateY:t}],opacity:a}],children:[(0,jsx_runtime_1.jsx)(index_js_2.Asset.Icon,{style:{left:i+r/2-HORIZONTAL_PADDING,transform:[{rotateX:e?"180deg":"0deg"}]},frameShape:index_js_2.Asset.frameShape.CleanW24,name:"icon-arrow-up-sidebar-mono",color:"white"}),(0,jsx_runtime_1.jsx)(react_native_1.View,{style:[{position:"relative",width:"100%"}],children:u})]})};exports.MessageBox=MessageBox;

package/dist/cjs/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/cjs/components/highlight/components/PassClickEventThroughHoleOverlay.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PassClickEventThroughHoleOverlay=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_1=require("react-native"),getHoleAnimateVariants_1=require("./getHoleAnimateVariants"),PassClickEventThroughHoleOverlay=({layout:t,onPress:s,onTargetPress:r,style:a})=>{const{default:e}=(0,getHoleAnimateVariants_1.getHoleAnimateVariants)(t);return(0,jsx_runtime_1.jsx)(react_native_1.Pressable,{onPress:s,style:[react_native_1.StyleSheet.absoluteFill,a],children:(0,jsx_runtime_1.jsx)(react_native_1.Pressable,{onPress:r,style:[{position:"absolute",left:e.x,top:e.y,width:e.width,height:e.height,borderRadius:e.radius}]})})};exports.PassClickEventThroughHoleOverlay=PassClickEventThroughHoleOverlay;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PassClickEventThroughHoleOverlay=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_1=require("react-native"),getHoleAnimateVariants_js_1=require("./getHoleAnimateVariants.js"),PassClickEventThroughHoleOverlay=({layout:t,onPress:s,onTargetPress:r,style:a})=>{const{default:e}=(0,getHoleAnimateVariants_js_1.getHoleAnimateVariants)(t);return(0,jsx_runtime_1.jsx)(react_native_1.Pressable,{onPress:s,style:[react_native_1.StyleSheet.absoluteFill,a],children:(0,jsx_runtime_1.jsx)(react_native_1.Pressable,{onPress:r,style:[{position:"absolute",left:e.x,top:e.y,width:e.width,height:e.height,borderRadius:e.radius}]})})};exports.PassClickEventThroughHoleOverlay=PassClickEventThroughHoleOverlay;

package/dist/cjs/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/cjs/components/highlight/components/SvgHighlightOverlay.js

@@ -1 +1 @@
-"use strict";var __createBinding=Object.create?function(i,e,n,t){t===void 0&&(t=n);var r=Object.getOwnPropertyDescriptor(e,n);(!r||("get"in r?!e.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return e[n]}}),Object.defineProperty(i,t,r)}:function(i,e,n,t){t===void 0&&(t=n),i[t]=e[n]},__setModuleDefault=Object.create?function(i,e){Object.defineProperty(i,"default",{enumerable:!0,value:e})}:function(i,e){i.default=e},__importStar=function(){var i=function(e){return i=Object.getOwnPropertyNames||function(n){var t=[];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[t.length]=r);return t},i(e)};return function(e){if(e&&e.__esModule)return e;var n={};if(e!=null)for(var t=i(e),r=0;r<t.length;r++)t[r]!=="default"&&__createBinding(n,e,t[r]);return __setModuleDefault(n,e),n}}();Object.defineProperty(exports,"__esModule",{value:!0}),exports.SvgHighlightOverlay=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=__importStar(require("@granite-js/native/react-native-svg")),react_native_1=require("react-native"),animated_1=require("../../../interactions/animated"),core_1=require("../../../core"),SvgHolePath_1=require("./SvgHolePath"),AnimatedSvg=animated_1.Animated.createAnimatedComponent(react_native_svg_1.default),AnimatedRect=animated_1.Animated.createAnimatedComponent(react_native_svg_1.Rect),SVG_HOLE_CLIP_PATH_ID="HIGHLIGHT_SVG_HOLE_CLIP_PATH_ID",SvgHighlightOverlay=({layout:i,opacity:e,holeStep:n})=>{const{colorPreference:t}=(0,core_1.useColorPreference)(),r=(0,core_1.useAdaptive)(),a=t==="dark"?"rgba(33, 33, 38, 0.87)":r.greyOpacity700;return(0,jsx_runtime_1.jsxs)(AnimatedSvg,{width:"100%",height:"100%",style:react_native_1.StyleSheet.absoluteFill,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Defs,{children:(0,jsx_runtime_1.jsx)(react_native_svg_1.ClipPath,{id:SVG_HOLE_CLIP_PATH_ID,children:(0,jsx_runtime_1.jsx)(SvgHolePath_1.SvgHolePath,{step:n,layout:i})})}),(0,jsx_runtime_1.jsx)(AnimatedRect,{x:"0",y:"0",width:"100%",height:"100%",fillOpacity:e,fill:a,clipPath:`url(#${SVG_HOLE_CLIP_PATH_ID})`})]})};exports.SvgHighlightOverlay=SvgHighlightOverlay;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SvgHighlightOverlay=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),react_native_1=require("react-native"),index_js_1=require("../../../interactions/animated/index.js"),index_js_2=require("../../../core/index.js"),SvgHolePath_js_1=require("./SvgHolePath.js"),AnimatedSvg=index_js_1.Animated.createAnimatedComponent(react_native_svg_1.Svg),AnimatedRect=index_js_1.Animated.createAnimatedComponent(react_native_svg_1.Rect),SVG_HOLE_CLIP_PATH_ID="HIGHLIGHT_SVG_HOLE_CLIP_PATH_ID",SvgHighlightOverlay=({layout:e,opacity:t,holeStep:i})=>{const{colorPreference:r}=(0,index_js_2.useColorPreference)(),n=(0,index_js_2.useAdaptive)(),s=r==="dark"?"rgba(33, 33, 38, 0.87)":n.greyOpacity700;return(0,jsx_runtime_1.jsxs)(AnimatedSvg,{width:"100%",height:"100%",style:react_native_1.StyleSheet.absoluteFill,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Defs,{children:(0,jsx_runtime_1.jsx)(react_native_svg_1.ClipPath,{id:SVG_HOLE_CLIP_PATH_ID,children:(0,jsx_runtime_1.jsx)(SvgHolePath_js_1.SvgHolePath,{step:i,layout:e})})}),(0,jsx_runtime_1.jsx)(AnimatedRect,{x:"0",y:"0",width:"100%",height:"100%",fillOpacity:t,fill:s,clipPath:`url(#${SVG_HOLE_CLIP_PATH_ID})`})]})};exports.SvgHighlightOverlay=SvgHighlightOverlay;

package/dist/cjs/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/cjs/components/highlight/components/SvgHolePath.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SvgHolePath=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),animated_1=require("../../../interactions/animated"),utils_1=require("../utils"),getHoleAnimateVariants_1=require("./getHoleAnimateVariants"),AnimatedPath=animated_1.Animated.createAnimatedComponent(react_native_svg_1.Path),SvgHolePath=({step:e,layout:a})=>{const t=(0,getHoleAnimateVariants_1.getHoleAnimateVariants)(a),n=generateHolePath(t.initial),i=generateHolePath(t.default),r=generateHolePath(t.exit);return(0,jsx_runtime_1.jsx)(AnimatedPath,{clipRule:"evenodd",d:e.interpolate({inputRange:[0,1,2],outputRange:[n,i,r]})})};exports.SvgHolePath=SvgHolePath;const generateHolePath=e=>{const a=(0,utils_1.generateRadiusRectanglePath)(e);return`
-  ${(0,utils_1.generateWindowPath)()}
-  ${a}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SvgHolePath=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),index_js_1=require("../../../interactions/animated/index.js"),index_js_2=require("../utils/index.js"),getHoleAnimateVariants_js_1=require("./getHoleAnimateVariants.js"),AnimatedPath=index_js_1.Animated.createAnimatedComponent(react_native_svg_1.Path),SvgHolePath=({step:t,layout:n})=>{const e=(0,getHoleAnimateVariants_js_1.getHoleAnimateVariants)(n),a=generateHolePath(e.initial),i=generateHolePath(e.default),s=generateHolePath(e.exit);return(0,jsx_runtime_1.jsx)(AnimatedPath,{clipRule:"evenodd",d:t.interpolate({inputRange:[0,1,2],outputRange:[a,i,s]})})};exports.SvgHolePath=SvgHolePath;const generateHolePath=t=>{const n=(0,index_js_2.generateRadiusRectanglePath)(t);return`
+  ${(0,index_js_2.generateWindowPath)()}
+  ${n}
   `};

package/dist/cjs/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/cjs/components/highlight/components/getHoleAnimateVariants.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.getHoleAnimateVariants=void 0;const react_native_1=require("react-native"),utils_1=require("../utils"),getHoleAnimateVariants=({x:i,y:a,width:e,height:t})=>{const{width:c,height:l}=react_native_1.Dimensions.get("window"),s=e*.9,n=t*.9,r=c*2.5,o=l*1.5;return{initial:{x:(0,utils_1.calculateOffset)({base:i,prevSize:e,nextSize:s}),y:(0,utils_1.calculateOffset)({base:a,prevSize:t,nextSize:n}),width:s,height:n,radius:16},default:{x:i,y:a,width:e,height:t,radius:16},exit:{x:(0,utils_1.calculateOffset)({base:i,prevSize:e,nextSize:r}),y:(0,utils_1.calculateOffset)({base:a,prevSize:t,nextSize:o}),width:r,height:o,radius:1e3}}};exports.getHoleAnimateVariants=getHoleAnimateVariants;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.getHoleAnimateVariants=void 0;const react_native_1=require("react-native"),index_js_1=require("../utils/index.js"),getHoleAnimateVariants=({x:i,y:a,width:e,height:t})=>{const{width:c,height:l}=react_native_1.Dimensions.get("window"),s=e*.9,n=t*.9,r=c*2.5,o=l*1.5;return{initial:{x:(0,index_js_1.calculateOffset)({base:i,prevSize:e,nextSize:s}),y:(0,index_js_1.calculateOffset)({base:a,prevSize:t,nextSize:n}),width:s,height:n,radius:16},default:{x:i,y:a,width:e,height:t,radius:16},exit:{x:(0,index_js_1.calculateOffset)({base:i,prevSize:e,nextSize:r}),y:(0,index_js_1.calculateOffset)({base:a,prevSize:t,nextSize:o}),width:r,height:o,radius:1e3}}};exports.getHoleAnimateVariants=getHoleAnimateVariants;

package/dist/cjs/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/cjs/components/highlight/components/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SvgHighlightOverlay=exports.PassClickEventThroughHoleOverlay=exports.MessageBox=exports.Message=void 0;var Message_1=require("./Message");Object.defineProperty(exports,"Message",{enumerable:!0,get:function(){return Message_1.Message}});var MessageBox_1=require("./MessageBox");Object.defineProperty(exports,"MessageBox",{enumerable:!0,get:function(){return MessageBox_1.MessageBox}});var PassClickEventThroughHoleOverlay_1=require("./PassClickEventThroughHoleOverlay");Object.defineProperty(exports,"PassClickEventThroughHoleOverlay",{enumerable:!0,get:function(){return PassClickEventThroughHoleOverlay_1.PassClickEventThroughHoleOverlay}});var SvgHighlightOverlay_1=require("./SvgHighlightOverlay");Object.defineProperty(exports,"SvgHighlightOverlay",{enumerable:!0,get:function(){return SvgHighlightOverlay_1.SvgHighlightOverlay}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SvgHighlightOverlay=exports.PassClickEventThroughHoleOverlay=exports.MessageBox=exports.Message=void 0;var Message_js_1=require("./Message.js");Object.defineProperty(exports,"Message",{enumerable:!0,get:function(){return Message_js_1.Message}});var MessageBox_js_1=require("./MessageBox.js");Object.defineProperty(exports,"MessageBox",{enumerable:!0,get:function(){return MessageBox_js_1.MessageBox}});var PassClickEventThroughHoleOverlay_js_1=require("./PassClickEventThroughHoleOverlay.js");Object.defineProperty(exports,"PassClickEventThroughHoleOverlay",{enumerable:!0,get:function(){return PassClickEventThroughHoleOverlay_js_1.PassClickEventThroughHoleOverlay}});var SvgHighlightOverlay_js_1=require("./SvgHighlightOverlay.js");Object.defineProperty(exports,"SvgHighlightOverlay",{enumerable:!0,get:function(){return SvgHighlightOverlay_js_1.SvgHighlightOverlay}});

package/dist/cjs/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/cjs/components/highlight/hooks/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useTimeout=exports.useHighlightUIAnimation=void 0;var useHighlightUIAnimation_1=require("./useHighlightUIAnimation");Object.defineProperty(exports,"useHighlightUIAnimation",{enumerable:!0,get:function(){return useHighlightUIAnimation_1.useHighlightUIAnimation}});var useTimeout_1=require("./useTimeout");Object.defineProperty(exports,"useTimeout",{enumerable:!0,get:function(){return useTimeout_1.useTimeout}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useTimeout=exports.useHighlightUIAnimation=void 0;var useHighlightUIAnimation_js_1=require("./useHighlightUIAnimation.js");Object.defineProperty(exports,"useHighlightUIAnimation",{enumerable:!0,get:function(){return useHighlightUIAnimation_js_1.useHighlightUIAnimation}});var useTimeout_js_1=require("./useTimeout.js");Object.defineProperty(exports,"useTimeout",{enumerable:!0,get:function(){return useTimeout_js_1.useTimeout}});

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useHighlightUIAnimation=void 0;const react_1=require("react"),react_native_1=require("react-native"),tds_easings_1=require("@toss/tds-easings"),animated_1=require("../../../interactions/animated"),useHighlightUIAnimation=()=>{const e=react_native_1.Platform.OS==="android",t=(0,react_1.useRef)(new animated_1.Animated.Value(e?1:0)).current,i=(0,react_1.useRef)(new animated_1.Animated.Value(0)).current,r=(0,react_1.useRef)(new animated_1.Animated.Value(0)).current;return{style:{overlayOpacity:i,holeStep:t,messageOpacity:r},enter:()=>new Promise(n=>animated_1.Animated.parallel([...e?[]:[animated_1.Animated.spring(t,{...tds_easings_1.spring.basic,toValue:1,useNativeDriver:!0})],animated_1.Animated.spring(i,{...tds_easings_1.spring.basic,toValue:1,useNativeDriver:!0}),animated_1.Animated.spring(r,{...tds_easings_1.spring.quick,toValue:1,useNativeDriver:!0})]).start(()=>{n()})),exit:()=>new Promise(n=>{animated_1.Animated.parallel([...e?[]:[animated_1.Animated.spring(t,{...tds_easings_1.spring.slow,toValue:2,useNativeDriver:!0})],animated_1.Animated.spring(i,{...tds_easings_1.spring.basic,toValue:0,useNativeDriver:!0}),animated_1.Animated.spring(r,{...tds_easings_1.spring.rapid,toValue:0,useNativeDriver:!0})]).start(()=>{n()})})}};exports.useHighlightUIAnimation=useHighlightUIAnimation;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useHighlightUIAnimation=void 0;const react_1=require("react"),react_native_1=require("react-native"),tds_easings_1=require("@toss/tds-easings"),index_js_1=require("../../../interactions/animated/index.js"),useHighlightUIAnimation=()=>{const e=react_native_1.Platform.OS==="android",t=(0,react_1.useRef)(new index_js_1.Animated.Value(e?1:0)).current,i=(0,react_1.useRef)(new index_js_1.Animated.Value(0)).current,r=(0,react_1.useRef)(new index_js_1.Animated.Value(0)).current;return{style:{overlayOpacity:i,holeStep:t,messageOpacity:r},enter:()=>new Promise(n=>index_js_1.Animated.parallel([...e?[]:[index_js_1.Animated.spring(t,{...tds_easings_1.spring.basic,toValue:1,useNativeDriver:!0})],index_js_1.Animated.spring(i,{...tds_easings_1.spring.basic,toValue:1,useNativeDriver:!0}),index_js_1.Animated.spring(r,{...tds_easings_1.spring.quick,toValue:1,useNativeDriver:!0})]).start(()=>{n()})),exit:()=>new Promise(n=>{index_js_1.Animated.parallel([...e?[]:[index_js_1.Animated.spring(t,{...tds_easings_1.spring.slow,toValue:2,useNativeDriver:!0})],index_js_1.Animated.spring(i,{...tds_easings_1.spring.basic,toValue:0,useNativeDriver:!0}),index_js_1.Animated.spring(r,{...tds_easings_1.spring.rapid,toValue:0,useNativeDriver:!0})]).start(()=>{n()})})}};exports.useHighlightUIAnimation=useHighlightUIAnimation;

package/dist/cjs/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/cjs/components/highlight/index.js

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

package/dist/cjs/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/cjs/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/cjs/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/cjs/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/cjs/components/highlight/utils/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.sToMs=exports.getElementYAlignment=exports.getElementXAlignment=exports.generateWindowPath=exports.generateRadiusRectanglePath=exports.generateOverlayPath=exports.calculateOffset=exports.addLayoutPadding=void 0;var addLayoutPadding_1=require("./addLayoutPadding");Object.defineProperty(exports,"addLayoutPadding",{enumerable:!0,get:function(){return addLayoutPadding_1.addLayoutPadding}});var calculateOffset_1=require("./calculateOffset");Object.defineProperty(exports,"calculateOffset",{enumerable:!0,get:function(){return calculateOffset_1.calculateOffset}});var generateSvgPath_1=require("./generateSvgPath");Object.defineProperty(exports,"generateOverlayPath",{enumerable:!0,get:function(){return generateSvgPath_1.generateOverlayPath}}),Object.defineProperty(exports,"generateRadiusRectanglePath",{enumerable:!0,get:function(){return generateSvgPath_1.generateRadiusRectanglePath}}),Object.defineProperty(exports,"generateWindowPath",{enumerable:!0,get:function(){return generateSvgPath_1.generateWindowPath}});var getElementAlignment_1=require("./getElementAlignment");Object.defineProperty(exports,"getElementXAlignment",{enumerable:!0,get:function(){return getElementAlignment_1.getElementXAlignment}}),Object.defineProperty(exports,"getElementYAlignment",{enumerable:!0,get:function(){return getElementAlignment_1.getElementYAlignment}});var sToMs_1=require("./sToMs");Object.defineProperty(exports,"sToMs",{enumerable:!0,get:function(){return sToMs_1.sToMs}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.sToMs=exports.getElementYAlignment=exports.getElementXAlignment=exports.generateWindowPath=exports.generateRadiusRectanglePath=exports.generateOverlayPath=exports.calculateOffset=exports.addLayoutPadding=void 0;var addLayoutPadding_js_1=require("./addLayoutPadding.js");Object.defineProperty(exports,"addLayoutPadding",{enumerable:!0,get:function(){return addLayoutPadding_js_1.addLayoutPadding}});var calculateOffset_js_1=require("./calculateOffset.js");Object.defineProperty(exports,"calculateOffset",{enumerable:!0,get:function(){return calculateOffset_js_1.calculateOffset}});var generateSvgPath_js_1=require("./generateSvgPath.js");Object.defineProperty(exports,"generateOverlayPath",{enumerable:!0,get:function(){return generateSvgPath_js_1.generateOverlayPath}}),Object.defineProperty(exports,"generateRadiusRectanglePath",{enumerable:!0,get:function(){return generateSvgPath_js_1.generateRadiusRectanglePath}}),Object.defineProperty(exports,"generateWindowPath",{enumerable:!0,get:function(){return generateSvgPath_js_1.generateWindowPath}});var getElementAlignment_js_1=require("./getElementAlignment.js");Object.defineProperty(exports,"getElementXAlignment",{enumerable:!0,get:function(){return getElementAlignment_js_1.getElementXAlignment}}),Object.defineProperty(exports,"getElementYAlignment",{enumerable:!0,get:function(){return getElementAlignment_js_1.getElementYAlignment}});var sToMs_js_1=require("./sToMs.js");Object.defineProperty(exports,"sToMs",{enumerable:!0,get:function(){return sToMs_js_1.sToMs}});

package/dist/cjs/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/cjs/components/icon/Icon.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),react_1=require("react"),react_native_1=require("react-native"),useCachedData_1=require("./useCachedData"),ICON_URL_PREFIX="https://static.toss.im/icons/svg",cache={},isUnsupportedTag=e=>e.includes("<pattern")?{isUnsupported:!0,tagName:"pattern"}:{isUnsupported:!1},Icon=(0,react_1.forwardRef)(function({name:t,color:r,size:n=24,accessible:a,accessibilityLabel:o,type:u="default",style:i},l){const{data:s,showFallback:d}=(0,useCachedData_1.useCachedData)(cache,t,fetchIcon,[t]),c=isUnsupportedTag(s??"");if(c.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: ${t}, \uBBF8\uC9C0\uC6D0 \uD0DC\uADF8: ${c.tagName})`);const f=(0,react_1.useMemo)(()=>{if(s===void 0)return;const p=/fill="#[0-9a-fA-F]{6}"/g,h=/stroke="#[0-9a-fA-F]{6}"/g;return r!==void 0?s.replace(p,`fill="${r}"`).replace(h,`stroke="${r}"`):s},[s,r]);return(0,jsx_runtime_1.jsxs)(react_native_1.View,{ref:l,style:[u==="circle"?{borderRadius:n/2,overflow:"hidden"}:void 0,{width:n,aspectRatio:1},...Array.isArray(i)?i:[i]],accessibilityRole:"image",accessibilityLabel:o,accessible:a,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.SvgXml,{width:"100%",height:"100%",color:r,fill:r,xml:f??null}),d?(0,jsx_runtime_1.jsx)(react_native_svg_1.SvgUri,{width:"100%",height:"100%",uri:getIconUrl(t),style:{backgroundColor:"yellow"}}):null]})});async function fetchIcon(e){return(await fetch(getIconUrl(e))).text()}function getIconUrl(e){const t=e.startsWith("icn-")||e.startsWith("icon-")?e:`icn-${e}`;return`${ICON_URL_PREFIX}/${t}.svg`}exports.default=Object.assign(Icon,{prefetchIcon:async e=>{const t=await fetchIcon(e);cache[e]=t}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),react_1=require("react"),react_native_1=require("react-native"),useCachedData_js_1=require("./useCachedData.js"),ICON_URL_PREFIX="https://static.toss.im/icons/svg",cache={},isUnsupportedTag=e=>e.includes("<pattern")?{isUnsupported:!0,tagName:"pattern"}:{isUnsupported:!1},Icon=(0,react_1.forwardRef)(function({name:t,color:s,size:n=24,accessible:a,accessibilityLabel:o,type:u="default",style:i},l){const{data:r,showFallback:d}=(0,useCachedData_js_1.useCachedData)(cache,t,fetchIcon,[t]),c=isUnsupportedTag(r??"");if(c.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: ${t}, \uBBF8\uC9C0\uC6D0 \uD0DC\uADF8: ${c.tagName})`);const f=(0,react_1.useMemo)(()=>{if(r===void 0)return;const p=/fill="#[0-9a-fA-F]{6}"/g,h=/stroke="#[0-9a-fA-F]{6}"/g;return s!==void 0?r.replace(p,`fill="${s}"`).replace(h,`stroke="${s}"`):r},[r,s]);return(0,jsx_runtime_1.jsxs)(react_native_1.View,{ref:l,style:[u==="circle"?{borderRadius:n/2,overflow:"hidden"}:void 0,{width:n,aspectRatio:1},...Array.isArray(i)?i:[i]],accessibilityRole:"image",accessibilityLabel:o,accessible:a,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.SvgXml,{width:"100%",height:"100%",color:s,fill:s,xml:f??null}),d?(0,jsx_runtime_1.jsx)(react_native_svg_1.SvgUri,{width:"100%",height:"100%",uri:getIconUrl(t),style:{backgroundColor:"yellow"}}):null]})});async function fetchIcon(e){return(await fetch(getIconUrl(e))).text()}function getIconUrl(e){const t=e.startsWith("icn-")||e.startsWith("icon-")?e:`icn-${e}`;return`${ICON_URL_PREFIX}/${t}.svg`}exports.default=Object.assign(Icon,{prefetchIcon:async e=>{const t=await fetchIcon(e);cache[e]=t}});

package/dist/cjs/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/cjs/components/icon/index.js

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

package/dist/cjs/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/cjs/components/icon/private/SvgIcon.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SvgIcon=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),react_1=require("react"),useCachedData_1=require("../useCachedData"),ICON_URL_PREFIX="https://static.toss.im/icons/svg",cache={},fillAttributesRe=/fill="#[0-9a-fA-F]{6}"/g,strokeAttributesRe=/stroke="#[0-9a-fA-F]{6}"/g,Icon=(0,react_1.forwardRef)(function({name:t,color:n,size:c=24,accessible:d,accessibilityLabel:f,type:p="default",children:i,...h},a){const{data:s,showFallback:x}=(0,useCachedData_1.useCachedData)(cache,t,fetchIcon,[t]),r=(0,react_1.useMemo)(()=>s===void 0?null:n!==void 0?(0,react_native_svg_1.parse)(s.replace(fillAttributesRe,"").replace(strokeAttributesRe,"")):(0,react_native_svg_1.parse)(s),[s,n]),g=(0,react_1.useMemo)(()=>s===void 0||n===void 0?{}:{fill:s.match(fillAttributesRe)?n:void 0,stroke:s.match(strokeAttributesRe)?n:void 0},[s,n]),o={width:c,height:c,accessibilityRole:"image",accessibilityLabel:f,accessible:d,...g,...h};if(r==null)return(0,jsx_runtime_1.jsx)(react_native_svg_1.Svg,{ref:a,...o,children:i});if(x)return(0,jsx_runtime_1.jsx)(react_native_svg_1.SvgUri,{uri:getIconUrl(t),...o,children:i});const[,,u=c,l=c]=(r.props.viewBox??"").split(" ").map(Number);if(p==="circle"){const v=u/2,j=l/2,_=Math.min(u,l)/2;return(0,jsx_runtime_1.jsxs)(react_native_svg_1.Svg,{ref:a,...r.props,...o,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Defs,{children:(0,jsx_runtime_1.jsx)(react_native_svg_1.ClipPath,{id:"clip",children:(0,jsx_runtime_1.jsx)(react_native_svg_1.Circle,{cx:v,cy:j,r:_})})}),(0,jsx_runtime_1.jsx)(react_native_svg_1.G,{clipPath:"url(#clip)",children:r.children}),i]})}return(0,jsx_runtime_1.jsxs)(react_native_svg_1.Svg,{ref:a,...r.props,...o,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.G,{children:r.children}),i]})});async function fetchIcon(e){return(await fetch(getIconUrl(e))).text()}function getIconUrl(e){const t=e.startsWith("icn-")||e.startsWith("icon-")?e:`icn-${e}`;return`${ICON_URL_PREFIX}/${t}.svg`}class SvgIconClass extends react_1.Component{render(){return(0,jsx_runtime_1.jsx)(Icon,{...this.props})}}exports.SvgIcon=Object.assign(SvgIconClass,{Root:SvgIconClass,prefetchIcon:async e=>{const t=await fetchIcon(e);cache[e]=t}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SvgIcon=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),react_1=require("react"),useCachedData_js_1=require("../useCachedData.js"),ICON_URL_PREFIX="https://static.toss.im/icons/svg",cache={},fillAttributesRe=/fill="#[0-9a-fA-F]{6}"/g,strokeAttributesRe=/stroke="#[0-9a-fA-F]{6}"/g,Icon=(0,react_1.forwardRef)(function({name:t,color:n,size:c=24,accessible:d,accessibilityLabel:f,type:p="default",children:i,...h},a){const{data:s,showFallback:x}=(0,useCachedData_js_1.useCachedData)(cache,t,fetchIcon,[t]),r=(0,react_1.useMemo)(()=>s===void 0?null:n!==void 0?(0,react_native_svg_1.parse)(s.replace(fillAttributesRe,"").replace(strokeAttributesRe,"")):(0,react_native_svg_1.parse)(s),[s,n]),g=(0,react_1.useMemo)(()=>s===void 0||n===void 0?{}:{fill:s.match(fillAttributesRe)?n:void 0,stroke:s.match(strokeAttributesRe)?n:void 0},[s,n]),o={width:c,height:c,accessibilityRole:"image",accessibilityLabel:f,accessible:d,...g,...h};if(r==null)return(0,jsx_runtime_1.jsx)(react_native_svg_1.Svg,{ref:a,...o,children:i});if(x)return(0,jsx_runtime_1.jsx)(react_native_svg_1.SvgUri,{uri:getIconUrl(t),...o,children:i});const[,,u=c,l=c]=(r.props.viewBox??"").split(" ").map(Number);if(p==="circle"){const v=u/2,j=l/2,_=Math.min(u,l)/2;return(0,jsx_runtime_1.jsxs)(react_native_svg_1.Svg,{ref:a,...r.props,...o,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.Defs,{children:(0,jsx_runtime_1.jsx)(react_native_svg_1.ClipPath,{id:"clip",children:(0,jsx_runtime_1.jsx)(react_native_svg_1.Circle,{cx:v,cy:j,r:_})})}),(0,jsx_runtime_1.jsx)(react_native_svg_1.G,{clipPath:"url(#clip)",children:r.children}),i]})}return(0,jsx_runtime_1.jsxs)(react_native_svg_1.Svg,{ref:a,...r.props,...o,children:[(0,jsx_runtime_1.jsx)(react_native_svg_1.G,{children:r.children}),i]})});async function fetchIcon(e){return(await fetch(getIconUrl(e))).text()}function getIconUrl(e){const t=e.startsWith("icn-")||e.startsWith("icon-")?e:`icn-${e}`;return`${ICON_URL_PREFIX}/${t}.svg`}class SvgIconClass extends react_1.Component{render(){return(0,jsx_runtime_1.jsx)(Icon,{...this.props})}}exports.SvgIcon=Object.assign(SvgIconClass,{Root:SvgIconClass,prefetchIcon:async e=>{const t=await fetchIcon(e);cache[e]=t}});

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

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

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

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

package/dist/cjs/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/cjs/components/icon-button/IconButton.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.IconButton=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),tds_color_utils_1=require("@toss/tds-color-utils"),tds_easings_1=require("@toss/tds-easings"),react_1=require("react"),react_native_1=require("react-native"),core_1=require("../../core"),animated_1=require("../../interactions/animated"),generateHapticFeedback_1=require("../../native/generateHapticFeedback"),private_1=require("../icon/private"),AnimatedSvg=animated_1.Animated.createAnimatedComponent(react_native_svg_1.Svg),AnimatedRect=animated_1.Animated.createAnimatedComponent(react_native_svg_1.Rect),AnimatedPressable=animated_1.Animated.createAnimatedComponent(react_native_1.Pressable),IconButtonImpl=(0,react_1.forwardRef)(function({source:d,name:g,color:r,bgColor:h,variant:t="clear",label:A,iconSize:o=24,children:x,style:y,onPressIn:p,onPressOut:m,...C},k){const f=(0,core_1.useAdaptive)(),c=h??f.greyOpacity100,_={borderWidth:1,borderStyle:"solid",borderColor:f.greyOpacity100},n=(0,react_1.useRef)(new animated_1.Animated.Value(0)).current,i=(0,react_1.useRef)(new animated_1.Animated.Value(1)).current,R=n.interpolate({inputRange:[0,1],outputRange:[c,(0,tds_color_utils_1.getNextColorValue)({color:c})]}),a=(0,react_1.useRef)(new animated_1.Animated.Value(0)).current,V=a.interpolate({inputRange:[0,1],outputRange:["transparent",c]}),u=r!=null,s=(0,react_1.useRef)(new animated_1.Animated.Value(0)).current,q=s.interpolate({inputRange:[0,1],outputRange:[r??"grey",r?(0,tds_color_utils_1.getNextColorValue)({color:r}):"grey"]}),v=(0,react_1.useCallback)(()=>{animated_1.Animated.spring(i,{toValue:.9,useNativeDriver:!1,...tds_easings_1.spring.rapid}).start(),t==="fill"?animated_1.Animated.timing(n,{toValue:1,useNativeDriver:!1,easing:react_native_1.Easing.bezier(...tds_easings_1.bezier.out),duration:500}).start():animated_1.Animated.spring(a,{toValue:1,useNativeDriver:!1,...tds_easings_1.spring.rapid}).start(),u&&animated_1.Animated.spring(s,{toValue:1,useNativeDriver:!1,...tds_easings_1.spring.rapid}).start()},[n,a,s,i,t,u]),b=(0,react_1.useCallback)(()=>{animated_1.Animated.spring(i,{toValue:1,useNativeDriver:!1,...tds_easings_1.spring.quick}).start(),t==="fill"?animated_1.Animated.timing(n,{toValue:0,useNativeDriver:!1,easing:react_native_1.Easing.bezier(...tds_easings_1.bezier.out),duration:500}).start():animated_1.Animated.spring(a,{toValue:0,useNativeDriver:!1,...tds_easings_1.spring.quick}).start(),u&&animated_1.Animated.spring(s,{toValue:0,useNativeDriver:!1,...tds_easings_1.spring.quick}).start()},[n,a,s,i,t,u]),w=(0,react_1.useCallback)(l=>{v(),p?.(l),(0,generateHapticFeedback_1.generateHapticFeedback)({type:"tickWeak"})},[v,p]),I=(0,react_1.useCallback)(l=>{b(),m?.(l)},[m,b]);return(0,jsx_runtime_1.jsx)(AnimatedPressable,{ref:k,style:[{borderRadius:getRadius(o),transform:[{scale:i}],padding:getPaddingFromSize(o),backgroundColor:t==="fill"?R:V,...t==="border"?_:void 0},y],onPressIn:w,onPressOut:I,accessible:!0,accessibilityRole:"button",accessibilityLabel:A,...C,children:(0,jsx_runtime_1.jsx)(AnimatedSvg,{height:o,width:o,viewBox:"0 0 100 100",children:(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[(0,jsx_runtime_1.jsxs)(react_native_svg_1.Mask,{id:"mask",x:"0",y:"0",width:"100",height:"100",children:[d!==void 0&&(0,jsx_runtime_1.jsx)(react_native_svg_1.Image,{href:d,x:"0",y:"0",height:"100",width:"100",preserveAspectRatio:"xMidYMid meet"}),g!==void 0&&(0,jsx_runtime_1.jsx)(private_1.SvgIcon,{name:g,x:"0",y:"0",height:"100",width:"100",preserveAspectRatio:"xMidYMid meet"})]}),(0,jsx_runtime_1.jsx)(AnimatedRect,{x:"0",y:"0",width:"100%",height:"100%",mask:"url(#mask)",fill:r&&q}),x]})})})});exports.IconButton=(0,react_1.memo)(IconButtonImpl);function getPaddingFromSize(e){return 18<=e&&e<=20?9:e/2}function getRadius(e){return e<=16?6:e<=20?8:12}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.IconButton=void 0;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),tds_color_utils_1=require("@toss/tds-color-utils"),tds_easings_1=require("@toss/tds-easings"),react_1=require("react"),react_native_1=require("react-native"),index_js_1=require("../../core/index.js"),index_js_2=require("../../interactions/animated/index.js"),generateHapticFeedback_js_1=require("../../native/generateHapticFeedback.js"),index_js_3=require("../icon/private/index.js"),AnimatedSvg=index_js_2.Animated.createAnimatedComponent(react_native_svg_1.Svg),AnimatedRect=index_js_2.Animated.createAnimatedComponent(react_native_svg_1.Rect),AnimatedPressable=index_js_2.Animated.createAnimatedComponent(react_native_1.Pressable),IconButtonImpl=(0,react_1.forwardRef)(function({source:d,name:g,color:n,bgColor:x,variant:t="clear",label:h,iconSize:o=24,children:A,style:_,onPressIn:p,onPressOut:m,...y},C){const f=(0,index_js_1.useAdaptive)(),c=x??f.greyOpacity100,j={borderWidth:1,borderStyle:"solid",borderColor:f.greyOpacity100},r=(0,react_1.useRef)(new index_js_2.Animated.Value(0)).current,i=(0,react_1.useRef)(new index_js_2.Animated.Value(1)).current,k=r.interpolate({inputRange:[0,1],outputRange:[c,(0,tds_color_utils_1.getNextColorValue)({color:c})]}),a=(0,react_1.useRef)(new index_js_2.Animated.Value(0)).current,R=a.interpolate({inputRange:[0,1],outputRange:["transparent",c]}),u=n!=null,s=(0,react_1.useRef)(new index_js_2.Animated.Value(0)).current,V=s.interpolate({inputRange:[0,1],outputRange:[n??"grey",n?(0,tds_color_utils_1.getNextColorValue)({color:n}):"grey"]}),b=(0,react_1.useCallback)(()=>{index_js_2.Animated.spring(i,{toValue:.9,useNativeDriver:!1,...tds_easings_1.spring.rapid}).start(),t==="fill"?index_js_2.Animated.timing(r,{toValue:1,useNativeDriver:!1,easing:react_native_1.Easing.bezier(...tds_easings_1.bezier.out),duration:500}).start():index_js_2.Animated.spring(a,{toValue:1,useNativeDriver:!1,...tds_easings_1.spring.rapid}).start(),u&&index_js_2.Animated.spring(s,{toValue:1,useNativeDriver:!1,...tds_easings_1.spring.rapid}).start()},[r,a,s,i,t,u]),v=(0,react_1.useCallback)(()=>{index_js_2.Animated.spring(i,{toValue:1,useNativeDriver:!1,...tds_easings_1.spring.quick}).start(),t==="fill"?index_js_2.Animated.timing(r,{toValue:0,useNativeDriver:!1,easing:react_native_1.Easing.bezier(...tds_easings_1.bezier.out),duration:500}).start():index_js_2.Animated.spring(a,{toValue:0,useNativeDriver:!1,...tds_easings_1.spring.quick}).start(),u&&index_js_2.Animated.spring(s,{toValue:0,useNativeDriver:!1,...tds_easings_1.spring.quick}).start()},[r,a,s,i,t,u]),q=(0,react_1.useCallback)(l=>{b(),p?.(l),(0,generateHapticFeedback_js_1.generateHapticFeedback)({type:"tickWeak"})},[b,p]),w=(0,react_1.useCallback)(l=>{v(),m?.(l)},[m,v]);return(0,jsx_runtime_1.jsx)(AnimatedPressable,{ref:C,style:[{borderRadius:getRadius(o),transform:[{scale:i}],padding:getPaddingFromSize(o),backgroundColor:t==="fill"?k:R,...t==="border"?j:void 0},_],onPressIn:q,onPressOut:w,accessible:!0,accessibilityRole:"button",accessibilityLabel:h,...y,children:(0,jsx_runtime_1.jsx)(AnimatedSvg,{height:o,width:o,viewBox:"0 0 100 100",children:(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[(0,jsx_runtime_1.jsxs)(react_native_svg_1.Mask,{id:"mask",x:"0",y:"0",width:"100",height:"100",children:[d!==void 0&&(0,jsx_runtime_1.jsx)(react_native_svg_1.Image,{href:d,x:"0",y:"0",height:"100",width:"100",preserveAspectRatio:"xMidYMid meet"}),g!==void 0&&(0,jsx_runtime_1.jsx)(index_js_3.SvgIcon,{name:g,x:"0",y:"0",height:"100",width:"100",preserveAspectRatio:"xMidYMid meet"})]}),(0,jsx_runtime_1.jsx)(AnimatedRect,{x:"0",y:"0",width:"100%",height:"100%",mask:"url(#mask)",fill:n&&V}),A]})})})});exports.IconButton=(0,react_1.memo)(IconButtonImpl);function getPaddingFromSize(e){return 18<=e&&e<=20?9:e/2}function getRadius(e){return e<=16?6:e<=20?8:12}

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

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

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

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

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

@@ -1 +1 @@
-"use strict";var __createBinding=Object.create?function(i,e,n,t){t===void 0&&(t=n);var r=Object.getOwnPropertyDescriptor(e,n);(!r||("get"in r?!e.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return e[n]}}),Object.defineProperty(i,t,r)}:function(i,e,n,t){t===void 0&&(t=n),i[t]=e[n]},__setModuleDefault=Object.create?function(i,e){Object.defineProperty(i,"default",{enumerable:!0,value:e})}:function(i,e){i.default=e},__importStar=function(){var i=function(e){return i=Object.getOwnPropertyNames||function(n){var t=[];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[t.length]=r);return t},i(e)};return function(e){if(e&&e.__esModule)return e;var n={};if(e!=null)for(var t=i(e),r=0;r<t.length;r++)t[r]!=="default"&&__createBinding(n,e,t[r]);return __setModuleDefault(n,e),n}}();Object.defineProperty(exports,"__esModule",{value:!0}),exports.BackspaceIcon=BackspaceIcon;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=__importStar(require("@granite-js/native/react-native-svg")),tds_colors_1=require("@toss/tds-colors");function BackspaceIcon(){return(0,jsx_runtime_1.jsx)(react_native_svg_1.default,{viewBox:"0 0 24 24","aria-label":"\uC9C0\uC6B0\uAE30",children:(0,jsx_runtime_1.jsx)(react_native_svg_1.Path,{fill:tds_colors_1.colors.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";Object.defineProperty(exports,"__esModule",{value:!0}),exports.BackspaceIcon=BackspaceIcon;const jsx_runtime_1=require("react/jsx-runtime"),react_native_svg_1=require("@granite-js/native/react-native-svg"),tds_colors_1=require("@toss/tds-colors");function BackspaceIcon(){return(0,jsx_runtime_1.jsx)(react_native_svg_1.Svg,{viewBox:"0 0 24 24","aria-label":"\uC9C0\uC6B0\uAE30",children:(0,jsx_runtime_1.jsx)(react_native_svg_1.Path,{fill:tds_colors_1.colors.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/cjs/components/keypad/FullSecureKeypad/ControlKeyButton.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ControlKeyButton=ControlKeyButton;const jsx_runtime_1=require("react/jsx-runtime"),txt_1=require("../../txt"),react_native_1=require("react-native");function ControlKeyButton({children:e,onPressIn:t,color:r,disabled:n=!1}){return(0,jsx_runtime_1.jsx)(react_native_1.Pressable,{onPressIn:t,style:[{borderWidth:0,padding:0,display:"flex",alignItems:"center",justifyContent:"center",width:"100%",height:"100%",backgroundColor:r}],accessibilityRole:"button",disabled:n,children:typeof e=="string"?(0,jsx_runtime_1.jsx)(txt_1.Txt,{style:{color:"white",fontSize:17},children:e}):e})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ControlKeyButton=ControlKeyButton;const jsx_runtime_1=require("react/jsx-runtime"),index_js_1=require("../../txt/index.js"),react_native_1=require("react-native");function ControlKeyButton({children:e,onPressIn:t,color:r,disabled:n=!1}){return(0,jsx_runtime_1.jsx)(react_native_1.Pressable,{onPressIn:t,style:[{borderWidth:0,padding:0,display:"flex",alignItems:"center",justifyContent:"center",width:"100%",height:"100%",backgroundColor:r}],accessibilityRole:"button",disabled:n,children:typeof e=="string"?(0,jsx_runtime_1.jsx)(index_js_1.Txt,{style:{color:"white",fontSize:17},children:e}):e})}

package/dist/cjs/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>;

package/dist/cjs/components/keypad/FullSecureKeypad/SecureKeyButton.d.ts

@@ -1,4 +1,4 @@
-import type { RequiredExcept, SecureKey } from './keys';
+import type { RequiredExcept, SecureKey } from './keys.js';
 type Props = {
     secureKey: RequiredExcept<SecureKey, 'subText'>;
     onPressIn: (value: string) => void;