@toss/tds-react-native 1.3.0 → 1.3.1

package/dist/esm/interactions/rally/presets/transitions/snapBounce.js

@@ -1 +1 @@
-"use strict";import{bezier as f}from"@toss/tds-easings";import{getPerspectiveOnWidth as o}from"../../constants/perspertive";import{convertSecondsToMilliseconds as r}from"../../utils";import{overrideTransition as p}from"../helper/override";import{DefaultTransitionSpeed as a}from"./default";const c={slow:r(.8),fast:r(.55)},g={in:{perspective:{from:o.strong,to:o.strong},rotateX:{from:"50deg",to:"0deg"},transformOriginX:{from:"50%",to:"50%"},transformOriginY:{from:"0%",to:"0%"},opacity:{from:0,to:1}},out:{perspective:{from:o.strong,to:o.strong},rotateX:{from:"0deg",to:"-50deg"},transformOriginX:{from:"50%",to:"50%"},transformOriginY:{from:"100%",to:"100%"},opacity:{from:1,to:0}}};export function snapBounce({type:t,speed:e=a,override:i}){const n=f.back,s=c[e],m=g[t];return p({...m,easing:n,duration:s},i)}
+"use strict";import{bezier as f}from"@toss/tds-easings";import{getPerspectiveOnWidth as o}from"../../constants/perspertive.js";import{convertSecondsToMilliseconds as r}from"../../utils/index.js";import{overrideTransition as p}from"../helper/override.js";import{DefaultTransitionSpeed as a}from"./default.js";const c={slow:r(.8),fast:r(.55)},g={in:{perspective:{from:o.strong,to:o.strong},rotateX:{from:"50deg",to:"0deg"},transformOriginX:{from:"50%",to:"50%"},transformOriginY:{from:"0%",to:"0%"},opacity:{from:0,to:1}},out:{perspective:{from:o.strong,to:o.strong},rotateX:{from:"0deg",to:"-50deg"},transformOriginX:{from:"50%",to:"50%"},transformOriginY:{from:"100%",to:"100%"},opacity:{from:1,to:0}}};export function snapBounce({type:t,speed:e=a,override:i}){const n=f.back,s=c[e],m=g[t];return p({...m,easing:n,duration:s},i)}

package/dist/esm/interactions/rally/presets/transitions/zoom.d.ts

@@ -1,3 +1,3 @@
-import { MotionInput, TransitionBasicOptions } from '../../types';
+import type { MotionInput, TransitionBasicOptions } from '../../types/index.js';
 export type ZoomOptions = TransitionBasicOptions;
 export declare function zoom({ type, speed, override }: ZoomOptions): MotionInput;

package/dist/esm/interactions/rally/presets/transitions/zoom.js

@@ -1 +1 @@
-"use strict";import{bezier as t}from"@toss/tds-easings";import{convertSecondsToMilliseconds as r}from"../../utils";import{overrideTransition as p}from"../helper/override";import{DefaultTransitionSpeed as c}from"./default";const m={slow:t.out,fast:t.expo},f={slow:r(.6),fast:r(.7)},l={in:{opacity:{from:0,to:1},scale:{from:2,to:1}},out:{opacity:{from:1,to:0},scale:{from:1,to:2}}};export function zoom({type:i,speed:o=c,override:n}){const s=m[o],e=f[o],a=l[i];return p({...a,easing:s,duration:e},n)}
+"use strict";import{bezier as t}from"@toss/tds-easings";import{convertSecondsToMilliseconds as r}from"../../utils/index.js";import{overrideTransition as p}from"../helper/override.js";import{DefaultTransitionSpeed as c}from"./default.js";const m={slow:t.out,fast:t.expo},f={slow:r(.6),fast:r(.7)},l={in:{opacity:{from:0,to:1},scale:{from:2,to:1}},out:{opacity:{from:1,to:0},scale:{from:1,to:2}}};export function zoom({type:i,speed:o=c,override:n}){const s=m[o],e=f[o],a=l[i];return p({...a,easing:s,duration:e},n)}

package/dist/esm/interactions/rally/test/utils.d.ts

@@ -1,4 +1,4 @@
-import { Layout } from '../types';
+import type { Layout } from '../types/index.js';
 export declare const MOCK_LAYOUT: Layout;
 export declare function toTestMotion(motion: any, playConfig?: {
     delay: number;

package/dist/esm/interactions/rally/types/index.d.ts

@@ -1,7 +1,7 @@
-export * from './animation';
-export * from './layout';
-export * from './presets';
-export * from './props';
-export * from './motion-input';
-export * from './motion';
-export * from './transitions';
+export * from './animation.js';
+export * from './layout.js';
+export * from './presets/index.js';
+export * from './props.js';
+export * from './motion-input/index.js';
+export * from './motion/index.js';
+export * from './transitions/index.js';

package/dist/esm/interactions/rally/types/index.js

@@ -1 +1 @@
-"use strict";export*from"./animation";export*from"./layout";export*from"./presets";export*from"./props";export*from"./motion-input";export*from"./motion";export*from"./transitions";
+"use strict";export*from"./animation.js";export*from"./layout.js";export*from"./presets/index.js";export*from"./props.js";export*from"./motion-input/index.js";export*from"./motion/index.js";export*from"./transitions/index.js";

package/dist/esm/interactions/rally/types/motion/index.d.ts

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

package/dist/esm/interactions/rally/types/motion/index.js

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

package/dist/esm/interactions/rally/types/motion/motion.d.ts

@@ -1,5 +1,5 @@
-import { Color } from '../motion-input/motion-input-values';
-import { Transition } from '../transitions';
+import type { Color } from '../motion-input/motion-input-values.js';
+import type { Transition } from '../transitions/index.js';
 type InterpolationNumberValue = {
     from: number;
     to: number;

package/dist/esm/interactions/rally/types/motion-input/index.d.ts

@@ -1,2 +1,2 @@
-export * from './motion-input-values';
-export * from './motion-input';
+export * from './motion-input-values.js';
+export * from './motion-input.js';

package/dist/esm/interactions/rally/types/motion-input/index.js

@@ -1 +1 @@
-"use strict";export*from"./motion-input-values";export*from"./motion-input";
+"use strict";export*from"./motion-input-values.js";export*from"./motion-input.js";

package/dist/esm/interactions/rally/types/motion-input/motion-input.d.ts

@@ -1,6 +1,6 @@
-import { TimeControl } from '../transitions/time';
-import { BezierTransition, SpringTransition, Transition } from '../transitions/transition';
-import { MotionInputValues, PropertyKey } from './motion-input-values';
+import type { TimeControl } from '../transitions/time.js';
+import type { BezierTransition, SpringTransition, Transition } from '../transitions/transition.js';
+import type { MotionInputValues, PropertyKey } from './motion-input-values.js';
 export type MotionInputProperty<V = number> = {
     from?: V;
     to?: V;

package/dist/esm/interactions/rally/types/presets/effect.d.ts

@@ -1,4 +1,4 @@
-import { MotionInputProperties } from '../motion-input/motion-input';
+import type { MotionInputProperties } from '../motion-input/motion-input.js';
 export type EffectType = 'small' | 'big';
 export type EffectTypeOption = {
     /** @default 'big' */

package/dist/esm/interactions/rally/types/presets/index.d.ts

@@ -1,2 +1,2 @@
-export * from './effect';
-export * from './transition';
+export * from './effect.js';
+export * from './transition.js';

package/dist/esm/interactions/rally/types/presets/index.js

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

package/dist/esm/interactions/rally/types/presets/transition.d.ts

@@ -1,4 +1,4 @@
-import { MotionInputProperties } from '../motion-input/motion-input';
+import type { MotionInputProperties } from '../motion-input/motion-input.js';
 export type TransitionType = 'in' | 'out';
 export type TransitionSpeed = 'slow' | 'fast';
 export type TransitionTypeOption = {

package/dist/esm/interactions/rally/types/props.d.ts

@@ -1,5 +1,5 @@
-import { MotionInput } from './motion-input/motion-input';
-import { Easing } from './transitions';
+import type { MotionInput } from './motion-input/motion-input.js';
+import type { Easing } from './transitions/index.js';
 export type RallyPlayConfig = {
     playCount?: number | 'infinite';
     /**

package/dist/esm/interactions/rally/types/transitions/ease.d.ts

@@ -1,4 +1,4 @@
-import { Spring } from './spring';
+import type { Spring } from './spring.js';
 export type BezierArray = [number, number, number, number];
 export type EasingFn = (t: number) => number;
 export type Easing = EasingFn | Spring | BezierArray;

package/dist/esm/interactions/rally/types/transitions/index.d.ts

@@ -1,4 +1,4 @@
-export * from './ease';
-export * from './spring';
-export * from './time';
-export * from './transition';
+export * from './ease.js';
+export * from './spring.js';
+export * from './time.js';
+export * from './transition.js';

package/dist/esm/interactions/rally/types/transitions/index.js

@@ -1 +1 @@
-"use strict";export*from"./ease";export*from"./spring";export*from"./time";export*from"./transition";
+"use strict";export*from"./ease.js";export*from"./spring.js";export*from"./time.js";export*from"./transition.js";

package/dist/esm/interactions/rally/types/transitions/transition.d.ts

@@ -1,5 +1,5 @@
-import { BezierArray, EasingFn } from './ease';
-import { Spring } from './spring';
+import type { BezierArray, EasingFn } from './ease.js';
+import type { Spring } from './spring.js';
 export interface SpringTransition {
     easing: Spring;
     duration?: never;

package/dist/esm/interactions/rally/utils/index.d.ts

@@ -1,3 +1,3 @@
-export * from './repeat';
-export * from './repeatCycle';
-export * from './timeUtils';
+export * from './repeat.js';
+export * from './repeatCycle.js';
+export * from './timeUtils.js';

package/dist/esm/interactions/rally/utils/index.js

@@ -1 +1 @@
-"use strict";export*from"./repeat";export*from"./repeatCycle";export*from"./timeUtils";
+"use strict";export*from"./repeat.js";export*from"./repeatCycle.js";export*from"./timeUtils.js";

package/dist/esm/interactions/rally/utils/repeatCycle.d.ts

@@ -9,6 +9,6 @@
  *  // [1, 0, 2, 0, 1]
  * ```
  */
-export declare function repeatCycle<T>(items: Array<T>, count: number, { gutter }?: {
+export declare function repeatCycle<T>(items: T[], count: number, { gutter }?: {
     gutter?: T;
 }): Generator<T | undefined, void, unknown>;

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

@@ -1,8 +1,8 @@
-export * from '../components/icon/private';
-export * as Paragraph from '../components/paragraph';
-export * from '../core';
-export { NavigationBackButton, NavigationLeft } from '../extensions/navigation';
-export * from '../extensions/prevent-font-scaling';
-export { NavigationRightContent, TopNavigation, useTopNavigation } from '../extensions/top-navigation';
-export type { NavigationRightContentProps, TopNavigationProps } from '../extensions/top-navigation';
-export * from '../utils';
+export * from '../components/icon/private/index.js';
+export * as Paragraph from '../components/paragraph/index.js';
+export * from '../core/index.js';
+export { NavigationBackButton, NavigationLeft } from '../extensions/navigation/index.js';
+export * from '../extensions/prevent-font-scaling/index.js';
+export { NavigationRightContent, TopNavigation, useTopNavigation } from '../extensions/top-navigation/index.js';
+export type { NavigationRightContentProps, TopNavigationProps } from '../extensions/top-navigation/index.js';
+export * from '../utils/index.js';

package/dist/esm/private/index.js

@@ -1 +1 @@
-"use strict";export*from"../components/icon/private";export*as Paragraph from"../components/paragraph";export*from"../core";export{NavigationBackButton,NavigationLeft}from"../extensions/navigation";export*from"../extensions/prevent-font-scaling";export{NavigationRightContent,TopNavigation,useTopNavigation}from"../extensions/top-navigation";export*from"../utils";
+"use strict";export*from"../components/icon/private/index.js";export*as Paragraph from"../components/paragraph/index.js";export*from"../core/index.js";export{NavigationBackButton,NavigationLeft}from"../extensions/navigation/index.js";export*from"../extensions/prevent-font-scaling/index.js";export{NavigationRightContent,TopNavigation,useTopNavigation}from"../extensions/top-navigation/index.js";export*from"../utils/index.js";

package/dist/esm/tokens/token.d.ts

@@ -0,0 +1,11 @@
+/**
+ * NOTE: 웹 토큰 통합 전 임시 매핑이에요. 추후 var 연동 예정.
+ */
+declare const tokenMap: {
+    readonly 'line-height-xs': 1.252;
+    readonly 'line-height-s': 1.35;
+    readonly 'line-height-m': 1.5;
+};
+export type TokenName = keyof typeof tokenMap;
+export declare function token(name: TokenName): number;
+export {};

package/dist/esm/tokens/token.js

@@ -0,0 +1 @@
+"use strict";const n={"line-height-xs":1.252,"line-height-s":1.35,"line-height-m":1.5};export function token(e){return n[e]}

package/dist/esm/utils/ColorManager.d.ts

@@ -1,4 +1,4 @@
-import { Rgb } from 'culori';
+import type { Rgb } from 'culori';
 export interface Oklch {
     mode: 'oklch';
     l: number;

package/dist/esm/utils/KeyboardAccessoryView.d.ts

@@ -1,4 +1,4 @@
-import { StyleProp, ViewProps, ViewStyle } from 'react-native';
+import type { StyleProp, ViewProps, ViewStyle } from 'react-native';
 interface Props extends ViewProps {
     contentContainerStyle?: StyleProp<ViewStyle>;
     enabled?: boolean;

package/dist/esm/utils/SafeArea.d.ts

@@ -1,5 +1,5 @@
 import { SafeAreaView } from '@granite-js/native/react-native-safe-area-context';
-import { ComponentProps } from 'react';
+import type { ComponentProps } from 'react';
 export declare const SafeArea: {
     Top: typeof SafeAreaTop;
     Right: typeof SafeAreaRight;

package/dist/esm/utils/a11y.d.ts

@@ -0,0 +1,23 @@
+import { AccessibilityProps, AccessibilityRole, AccessibilityState, AccessibilityValue } from 'react-native';
+interface A11yProps {
+    role?: AccessibilityRole;
+    label?: string;
+    checked?: AccessibilityState['checked'];
+    busy?: AccessibilityState['busy'];
+    disabled?: AccessibilityState['disabled'];
+    expanded?: AccessibilityState['expanded'];
+    selected?: AccessibilityState['selected'];
+    hidden?: boolean;
+    valueMax?: AccessibilityValue['max'];
+    valueMin?: AccessibilityValue['min'];
+    valueNow?: AccessibilityValue['now'];
+    valueText?: AccessibilityValue['text'];
+}
+/**
+ * react-native에서 role과 accessibilityRole와 같이 차이가 발생하는 속성을 모두 지원해주기 위한 훅입니다.
+ * @param restProps 사용처에서 넘겨주는 접근성 속성을 포함한 나머지 속성들
+ * @param defaultProps 기본 접근성 속성
+ * @returns T
+ */
+export declare function generateA11yRestProps<T extends AccessibilityProps>(restProps: T, defaultProps: A11yProps): T & AccessibilityProps;
+export {};

package/dist/esm/utils/a11y.js

@@ -0,0 +1 @@
+"use strict";export function generateA11yRestProps(a,i){const e=a.role??a.accessibilityRole??i.role,c=a["aria-checked"]??a.accessibilityState?.checked??i.checked,l=a["aria-busy"]??a.accessibilityState?.busy??i.busy,n=a["aria-disabled"]??a.accessibilityState?.disabled??i.disabled,b=a["aria-expanded"]??a.accessibilityState?.expanded??i.expanded,d=a["aria-selected"]??a.accessibilityState?.selected??i.selected,t=a["aria-hidden"]??a.accessible==null?i.hidden:!a.accessible,y=a["aria-valuemax"]??a.accessibilityValue?.max??i.valueMax,u=a["aria-valuemin"]??a.accessibilityValue?.min??i.valueMin,x=a["aria-valuenow"]??a.accessibilityValue?.now??i.valueNow,v=a["aria-valuetext"]??a.accessibilityValue?.text??i.valueText;return{...a,role:e==="heading"?"header":e,accessibilityRole:e,"aria-checked":c,"aria-busy":l,"aria-disabled":n,"aria-expanded":b,"aria-selected":d,"aria-hidden":t,accessibilityLabel:i.label,accessibilityState:{...a.accessibilityState,checked:c,busy:l,disabled:n,expanded:b,selected:d},accessible:!t,"aria-valuemax":y,"aria-valuemin":u,"aria-valuenow":x,"aria-valuetext":v,accessibilityValue:{max:y,min:u,now:x,text:v}}}

package/dist/esm/utils/childrens.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 export declare const Childrens: {
     /**
      * @name Childrens.Gap

package/dist/esm/utils/extractTextFromReactElement.d.ts

@@ -1,2 +1,2 @@
-import { ReactElement } from 'react';
+import type { ReactElement } from 'react';
 export declare function extractTextFromReactElement(element: ReactElement): string;

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

@@ -1,13 +1,13 @@
-export * from './childrens';
-export * from './isReactText';
-export * from './extractTextFromReactElement';
-export * from './Keyboard';
-export * from './KeyboardAccessoryView';
-export * from './SafeArea';
-export * from './useAccessibilityInfo';
-export * from './useAnimatePresence';
-export * from './useControlled';
-export * from './useSafeAreaBottom';
-export * from './useSafeAreaTop';
-export * from './useWiggleAnim';
-export * from './deepMerge';
+export * from './childrens.js';
+export * from './isReactText.js';
+export * from './extractTextFromReactElement.js';
+export * from './Keyboard.js';
+export * from './KeyboardAccessoryView.js';
+export * from './SafeArea.js';
+export * from './useAccessibilityInfo.js';
+export * from './useAnimatePresence.js';
+export * from './useControlled.js';
+export * from './useSafeAreaBottom.js';
+export * from './useSafeAreaTop.js';
+export * from './useWiggleAnim.js';
+export * from './deepMerge.js';

package/dist/esm/utils/index.js

@@ -1 +1 @@
-"use strict";export*from"./childrens";export*from"./isReactText";export*from"./extractTextFromReactElement";export*from"./Keyboard";export*from"./KeyboardAccessoryView";export*from"./SafeArea";export*from"./useAccessibilityInfo";export*from"./useAnimatePresence";export*from"./useControlled";export*from"./useSafeAreaBottom";export*from"./useSafeAreaTop";export*from"./useWiggleAnim";export*from"./deepMerge";
+"use strict";export*from"./childrens.js";export*from"./isReactText.js";export*from"./extractTextFromReactElement.js";export*from"./Keyboard.js";export*from"./KeyboardAccessoryView.js";export*from"./SafeArea.js";export*from"./useAccessibilityInfo.js";export*from"./useAnimatePresence.js";export*from"./useControlled.js";export*from"./useSafeAreaBottom.js";export*from"./useSafeAreaTop.js";export*from"./useWiggleAnim.js";export*from"./deepMerge.js";

package/dist/esm/utils/isReactText.d.ts

@@ -1,2 +1,2 @@
-import { ReactNode, ReactText } from 'react';
+import type { ReactNode, ReactText } from 'react';
 export declare function isReactText(node: ReactNode): node is ReactText;

package/dist/esm/utils/testing/index.d.ts

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

package/dist/esm/utils/testing/index.js

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

package/dist/esm/utils/useAnnounce.d.ts

@@ -1,4 +1,4 @@
-import { ReactElement } from 'react';
+import type { ReactElement } from 'react';
 export interface UseAnnounceOptions {
     /** 큐에 추가할지 여부 (기본값: false) */
     queue?: boolean;

package/dist/esm/utils/useAnnounce.js

@@ -1 +1 @@
-"use strict";import{useCallback as a}from"react";import{AccessibilityInfo as e}from"react-native";import{extractTextFromReactElement as l}from"./extractTextFromReactElement";export function useAnnounce(){return{announce:a(async(n,o={})=>{const{queue:s=!1,delay:i=0,onlyWhenScreenReaderEnabled:r=!0}=o;if(r&&!await e.isScreenReaderEnabled())return;const t=typeof n=="string"?n:l(n),c=()=>{e.announceForAccessibilityWithOptions?e.announceForAccessibilityWithOptions(t,{queue:s}):e.announceForAccessibility&&e.announceForAccessibility(t)};i>0?setTimeout(c,i):c()},[])}}
+"use strict";import{useCallback as a}from"react";import{AccessibilityInfo as e}from"react-native";import{extractTextFromReactElement as l}from"./extractTextFromReactElement.js";export function useAnnounce(){return{announce:a(async(n,o={})=>{const{queue:s=!1,delay:i=0,onlyWhenScreenReaderEnabled:r=!0}=o;if(r&&!await e.isScreenReaderEnabled())return;const t=typeof n=="string"?n:l(n),c=()=>{e.announceForAccessibilityWithOptions?e.announceForAccessibilityWithOptions(t,{queue:s}):e.announceForAccessibility&&e.announceForAccessibility(t)};i>0?setTimeout(c,i):c()},[])}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toss/tds-react-native",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "type": "module",
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",
@@ -34,7 +34,8 @@
     "string-obfuscate": "yarn obfuscate dist",
     "build": "./scripts/build.sh",
     "test": "jest",
-    "typecheck": "tsc --noEmit"
+    "typecheck": "tsc --noEmit",
+    "lint": "eslint ./src/**/*.{js,jsx,ts,tsx}"
   },
   "devDependencies": {
     "@babel/core": "^7.18.13",
@@ -46,8 +47,8 @@
     "@babel/preset-react": "^7.16.7",
     "@babel/preset-typescript": "^7.16.7",
     "@babel/runtime": "7.18.9",
-    "@granite-js/native": "0.1.22",
-    "@granite-js/react-native": "0.1.22",
+    "@granite-js/native": "0.1.28",
+    "@granite-js/react-native": "0.1.28",
     "@jest/globals": "^28",
     "@testing-library/react-native": "^0.0.4",
     "@tools/javascript-obfuscator": "0.0.0",
@@ -65,7 +66,7 @@
     "typescript": "5.9.2"
   },
   "peerDependencies": {
-    "@granite-js/native": "*",
+    "@granite-js/native": ">=0.1.28",
     "@granite-js/react-native": "*",
     "react": "*",
     "react-native": "*"
@@ -73,11 +74,11 @@
   "dependencies": {
     "@react-spring/native": "9.5.2",
     "@react-stately/radio": "^3.6.0",
-    "@toss/tds-color-utils": "^0.0.1",
+    "@toss/tds-color-utils": "0.0.2",
     "@toss/tds-colors": "^0.1.0",
     "@toss/tds-easings": "^0.0.1",
     "@toss/tds-spring-easing": "^0.0.1",
-    "@toss/tds-typography": "^0.0.1",
+    "@toss/tds-typography": "0.0.2",
     "@toss/utils": "^1.6.1",
     "culori": "^4.0.1",
     "es-hangul": "^2.3.0",