cpk-ui 0.8.0-beta.5 → 0.8.0-beta.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/components/modals/AlertDialog/AlertDialog.d.ts.map +1 -1
  2. package/components/modals/AlertDialog/AlertDialog.js +1 -1
  3. package/components/uis/EditText/EditText.d.ts +10 -0
  4. package/components/uis/EditText/EditText.d.ts.map +1 -1
  5. package/components/uis/EditText/EditText.js +28 -19
  6. package/components/uis/PinchZoom/PinchZoom.d.ts +38 -34
  7. package/components/uis/PinchZoom/PinchZoom.d.ts.map +1 -1
  8. package/components/uis/PinchZoom/PinchZoom.js +184 -236
  9. package/components/uis/Typography/Typography.d.ts.map +1 -1
  10. package/components/uis/Typography/Typography.js +7 -1
  11. package/package.json +1 -1
package/components/modals/AlertDialog/AlertDialog.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../../../src/components/modals/AlertDialog/AlertDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EASZ,KAAK,YAAY,EAClB,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAC,MAAM,cAAc,CAAC;AA8DlE,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;AAExE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,SAAS,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACjC,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,aAAa,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC5B,eAAe,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CACxC,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,YAAY,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,GAAG,YAAY,CAAC;IAC7B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,iFAAiF;IACjF,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,YAAY,GAAG,IAAI,CAAC;IAC1E,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,YAAY,GAAG,IAAI,CAAC;IACxE,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,YAAY,EAAE,GAAG,IAAI,CAAC;CAC9E,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,GAAG,kBAAkB,CAAC;AAEvB,MAAM,MAAM,kBAAkB,GAAG;IAC/B,IAAI,CAAC,kBAAkB,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACpD,KAAK,IAAI,IAAI,CAAC;CACf,CAAC;AAyVF,eAAO,MAAM,WAAW;YAjWd,SAAS,CAAC,SAAS,CAAC;cAClB,OAAO;cACP,MAAM,IAAI;iEAiWrB,CAAC;AAEF,eAAe,WAAW,CAAC"}
1
+ {"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../../../src/components/modals/AlertDialog/AlertDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EASZ,KAAK,YAAY,EAClB,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAC,MAAM,cAAc,CAAC;AA8DlE,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;AAExE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,SAAS,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACjC,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,aAAa,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC5B,eAAe,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CACxC,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,YAAY,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,GAAG,YAAY,CAAC;IAC7B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,iFAAiF;IACjF,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,YAAY,GAAG,IAAI,CAAC;IAC1E,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,YAAY,GAAG,IAAI,CAAC;IACxE,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,YAAY,EAAE,GAAG,IAAI,CAAC;CAC9E,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,GAAG,kBAAkB,CAAC;AAEvB,MAAM,MAAM,kBAAkB,GAAG;IAC/B,IAAI,CAAC,kBAAkB,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACpD,KAAK,IAAI,IAAI,CAAC;CACf,CAAC;AA4VF,eAAO,MAAM,WAAW;YApWd,SAAS,CAAC,SAAS,CAAC;cAClB,OAAO;cACP,MAAM,IAAI;iEAoWrB,CAAC;AAEF,eAAe,WAAW,CAAC"}
package/components/modals/AlertDialog/AlertDialog.js CHANGED
@@ -212,7 +212,7 @@ function AlertDialogImpl({ actions: actionsProp, backdropOpacity: backdropOpacit
212
212
  ]);
213
213
  return (
214
214
  // https://github.com/facebook/react-native/issues/48526#issuecomment-2579478884
215
- _jsx(View, { style: style, children: _jsx(Modal, { animationType: "fade", onRequestClose: handleClose, transparent: true, visible: visible, children: _jsx(KeyboardAvoidingView, { behavior: Platform.OS === 'ios' ? 'padding' : undefined, style: keyboardAvoidingStyle, children: AlertDialogContent }) }) }));
215
+ _jsx(View, { style: style, children: _jsx(Modal, { animationType: "fade", onRequestClose: handleClose, transparent: true, visible: visible, children: _jsx(KeyboardAvoidingView, { behavior: Platform.OS === 'web' ? undefined : 'padding', style: keyboardAvoidingStyle, children: AlertDialogContent }) }) }));
216
216
  }
217
217
  const keyboardAvoidingStyle = { flex: 1 };
218
218
  export const AlertDialog = React.memo(forwardRef(AlertDialogImpl));
package/components/uis/EditText/EditText.d.ts CHANGED
@@ -18,6 +18,16 @@ type CustomRenderType = (({ color, status }: {
18
18
  color: string;
19
19
  status: EditTextStatus;
20
20
  }) => ReactElement) | null;
21
+ /** One native line box for the given EditText size. Use longhands; axis padding does not replace edges. */
22
+ export declare function editTextInputMetrics(sizeConfig: {
23
+ fontSize: number;
24
+ padding: number;
25
+ }): {
26
+ fontSize: number;
27
+ lineHeight: number;
28
+ paddingTop: number;
29
+ paddingBottom: number;
30
+ };
21
31
  export type EditTextProps = {
22
32
  testID?: TextInputProps['testID'];
23
33
  inputRef?: MutableRefObject<TextInput | undefined> | RefObject<TextInput>;
package/components/uis/EditText/EditText.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"EditText.d.ts","sourceRoot":"","sources":["../../../../src/components/uis/EditText/EditText.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"EditText.d.ts","sourceRoot":"","sources":["../../../../src/components/uis/EditText/EditText.tsx"],"names":[],"mappings":"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"}
package/components/uis/EditText/EditText.js CHANGED
@@ -8,6 +8,15 @@ import { useTheme } from '../../../providers/ThemeProvider';
8
8
  import { Typography } from '../Typography/Typography';
9
9
  import { isWeb } from '../../../utils/platform';
10
10
  import { useHoverState } from '../../../hooks/useHoverState';
11
+ /** One native line box for the given EditText size. Use longhands; axis padding does not replace edges. */
12
+ export function editTextInputMetrics(sizeConfig) {
13
+ return {
14
+ fontSize: sizeConfig.fontSize,
15
+ lineHeight: Math.round(sizeConfig.fontSize * 1.25),
16
+ paddingTop: sizeConfig.padding,
17
+ paddingBottom: Math.round(sizeConfig.padding * 1.2),
18
+ };
19
+ }
11
20
  export const EditText = forwardRef(({ testID, textInputProps, style, styles, size = 'medium', label, error, startElement, endElement, multiline = false, value = '', placeholder, placeholderColor, onChange, onChangeText, onFocus, onBlur, onSubmitEditing, numberOfLines, maxLength, hideCounter = false, autoComplete, autoCapitalize = 'none', secureTextEntry = false, editable = true, direction = 'column', decoration = 'underline', colors = {}, required = false, accessibilityLabel, }, ref) => {
12
21
  EditText.displayName = 'EditText';
13
22
  const { theme } = useTheme();
@@ -189,6 +198,7 @@ export const EditText = forwardRef(({ testID, textInputProps, style, styles, siz
189
198
  sizeConfig,
190
199
  styles?.container,
191
200
  ]);
201
+ const inputMetrics = useMemo(() => editTextInputMetrics(sizeConfig), [sizeConfig]);
192
202
  // Memoize render input function
193
203
  const renderInput = useCallback(() => {
194
204
  return (_jsx(View, { style: [
@@ -207,6 +217,7 @@ export const EditText = forwardRef(({ testID, textInputProps, style, styles, siz
207
217
  flex-direction: row;
208
218
  align-items: center;
209
219
  justify-content: space-between;
220
+ overflow: visible;
210
221
  `,
211
222
  styles?.inputContainer,
212
223
  ], children: _jsxs(_Fragment, { children: [isValidElement(startElement)
@@ -226,29 +237,24 @@ export const EditText = forwardRef(({ testID, textInputProps, style, styles, siz
226
237
  setFocused(true);
227
238
  onFocus?.(e);
228
239
  }, onSubmitEditing: onSubmitEditing, placeholder: placeholder, placeholderTextColor: placeholderColor || theme.text.placeholder, ref: inputRef, secureTextEntry: secureTextEntry, selectionColor: theme.role.underlay, style: [
229
- // Stretch input in order to make remaining space clickable
230
- css `
231
- font-family: Pretendard;
232
- flex: 1;
233
- font-size: ${sizeConfig.fontSize}px;
234
- text-align-vertical: ${multiline ? 'top' : 'center'};
235
- `,
240
+ {
241
+ color: defaultColor,
242
+ flex: 1,
243
+ fontFamily: 'Pretendard',
244
+ fontSize: inputMetrics.fontSize,
245
+ includeFontPadding: false,
246
+ lineHeight: inputMetrics.lineHeight,
247
+ overflow: 'visible',
248
+ paddingBottom: inputMetrics.paddingBottom,
249
+ paddingLeft: direction === 'row' ? sizeConfig.padding : 0,
250
+ paddingRight: 0,
251
+ paddingTop: inputMetrics.paddingTop,
252
+ textAlignVertical: multiline ? 'top' : 'center',
253
+ },
236
254
  isWeb() &&
237
255
  css `
238
256
  outline-width: 0;
239
257
  `,
240
- direction === 'column'
241
- ? css `
242
- padding-top: ${sizeConfig.padding}px;
243
- `
244
- : css `
245
- padding-left: ${sizeConfig.padding}px;
246
- `,
247
- css `
248
- color: ${defaultColor};
249
- padding: ${sizeConfig.padding}px 0
250
- ${sizeConfig.padding * 1.2}px 0;
251
- `,
252
258
  styles?.input,
253
259
  ], testID: testID, value: value, ...textInputProps }), isValidElement(endElement)
254
260
  ? cloneElemWithDefaultColors({
@@ -261,6 +267,7 @@ export const EditText = forwardRef(({ testID, textInputProps, style, styles, siz
261
267
  })
262
268
  : endElement] }) }));
263
269
  }, [
270
+ accessibilityLabel,
264
271
  autoCapitalize,
265
272
  autoComplete,
266
273
  decoration,
@@ -268,7 +275,9 @@ export const EditText = forwardRef(({ testID, textInputProps, style, styles, siz
268
275
  direction,
269
276
  editable,
270
277
  endElement,
278
+ inputMetrics,
271
279
  inputRef,
280
+ label,
272
281
  maxLength,
273
282
  multiline,
274
283
  numberOfLines,
package/components/uis/PinchZoom/PinchZoom.d.ts CHANGED
@@ -1,44 +1,47 @@
1
- import type { PropsWithChildren } from 'react';
2
- import React from 'react';
3
- import type { ViewStyle } from 'react-native';
4
- import { Animated } from 'react-native';
1
+ import React, { type PropsWithChildren } from 'react';
2
+ import { type StyleProp, type ViewStyle } from 'react-native';
3
+ import { type SharedValue } from 'react-native-reanimated';
5
4
  export type PinchZoomProps = PropsWithChildren<{
6
5
  /**
7
6
  * Custom view style.
8
7
  * @warning Passing `transform` in style will disable pinch-zoom functionality.
9
8
  * Use a wrapper View for custom transforms instead.
10
9
  */
11
- style?: ViewStyle;
12
- children?: any;
13
- /** Callback fired when zoom scale changes */
10
+ style?: StyleProp<ViewStyle>;
11
+ /** Callback fired when a settled zoom scale changes. */
14
12
  onScaleChanged?(value: number): void;
15
- /** Callback fired when content position changes */
13
+ /** Callback fired when a settled content position changes. */
16
14
  onTranslateChanged?(valueXY: {
17
15
  x: number;
18
16
  y: number;
19
17
  }): void;
20
- /** Callback fired after gesture animation completes (decay or snap-back) */
18
+ /** Callback fired when a pinch or pan starts. */
19
+ onInteractionStart?(): void;
20
+ /** Callback fired when a pinch or pan settles. */
21
+ onInteractionEnd?(): void;
22
+ /** Callback fired after the release correction completes. */
21
23
  onRelease?(): void;
22
- /**
23
- * Allow unrestricted overflow on specific axes.
24
- * When true, allows overflow. When false/undefined, clamps to bounds.
25
- */
24
+ /** Allow unrestricted overflow on a specific axis. */
26
25
  allowEmpty?: {
27
26
  x?: boolean;
28
27
  y?: boolean;
29
28
  };
30
- /**
31
- * Auto-snap to bounds after release.
32
- * @default true
33
- */
29
+ /** Auto-snap content to the viewport bounds after release. @default true */
34
30
  fixOverflowAfterRelease?: boolean;
35
- /** Test ID for component testing */
31
+ /** Smallest allowed scale. @default 1 */
32
+ minScale?: number;
33
+ /** Largest allowed scale. @default 4 */
34
+ maxScale?: number;
35
+ /** Test ID for component testing. */
36
36
  testID?: string;
37
37
  }>;
38
38
  export interface PinchZoomRef {
39
39
  animatedValue: {
40
- scale: Animated.Value;
41
- translate: Animated.ValueXY;
40
+ scale: SharedValue<number>;
41
+ translate: {
42
+ x: SharedValue<number>;
43
+ y: SharedValue<number>;
44
+ };
42
45
  };
43
46
  setValues(_: {
44
47
  scale?: number;
@@ -54,31 +57,32 @@ declare const PinchZoomRoot: React.ForwardRefExoticComponent<{
54
57
  * @warning Passing `transform` in style will disable pinch-zoom functionality.
55
58
  * Use a wrapper View for custom transforms instead.
56
59
  */
57
- style?: ViewStyle;
58
- children?: any;
59
- /** Callback fired when zoom scale changes */
60
+ style?: StyleProp<ViewStyle>;
61
+ /** Callback fired when a settled zoom scale changes. */
60
62
  onScaleChanged?(value: number): void;
61
- /** Callback fired when content position changes */
63
+ /** Callback fired when a settled content position changes. */
62
64
  onTranslateChanged?(valueXY: {
63
65
  x: number;
64
66
  y: number;
65
67
  }): void;
66
- /** Callback fired after gesture animation completes (decay or snap-back) */
68
+ /** Callback fired when a pinch or pan starts. */
69
+ onInteractionStart?(): void;
70
+ /** Callback fired when a pinch or pan settles. */
71
+ onInteractionEnd?(): void;
72
+ /** Callback fired after the release correction completes. */
67
73
  onRelease?(): void;
68
- /**
69
- * Allow unrestricted overflow on specific axes.
70
- * When true, allows overflow. When false/undefined, clamps to bounds.
71
- */
74
+ /** Allow unrestricted overflow on a specific axis. */
72
75
  allowEmpty?: {
73
76
  x?: boolean;
74
77
  y?: boolean;
75
78
  };
76
- /**
77
- * Auto-snap to bounds after release.
78
- * @default true
79
- */
79
+ /** Auto-snap content to the viewport bounds after release. @default true */
80
80
  fixOverflowAfterRelease?: boolean;
81
- /** Test ID for component testing */
81
+ /** Smallest allowed scale. @default 1 */
82
+ minScale?: number;
83
+ /** Largest allowed scale. @default 4 */
84
+ maxScale?: number;
85
+ /** Test ID for component testing. */
82
86
  testID?: string;
83
87
  } & {
84
88
  children?: React.ReactNode | undefined;
package/components/uis/PinchZoom/PinchZoom.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PinchZoom.d.ts","sourceRoot":"","sources":["../../../../src/components/uis/PinchZoom/PinchZoom.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,iBAAiB,EAAM,MAAM,OAAO,CAAC;AAClD,OAAO,KAMN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAIV,SAAS,EACV,MAAM,cAAc,CAAC;AACtB,OAAO,EAAC,QAAQ,EAAe,MAAM,cAAc,CAAC;AAEpD,MAAM,MAAM,cAAc,GAAG,iBAAiB,CAAC;IAC7C;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,6CAA6C;IAC7C,cAAc,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,mDAAmD;IACnD,kBAAkB,CAAC,CAAC,OAAO,EAAE;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IAC3D,4EAA4E;IAC5E,SAAS,CAAC,IAAI,IAAI,CAAC;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE;QAAC,CAAC,CAAC,EAAE,OAAO,CAAC;QAAC,CAAC,CAAC,EAAE,OAAO,CAAA;KAAC,CAAC;IACxC;;;OAGG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC,CAAC;AAEH,MAAM,WAAW,YAAY;IAC3B,aAAa,EAAE;QAAC,KAAK,EAAE,QAAQ,CAAC,KAAK,CAAC;QAAC,SAAS,EAAE,QAAQ,CAAC,OAAO,CAAA;KAAC,CAAC;IACpE,SAAS,CAAC,CAAC,EAAE;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE;YAAC,CAAC,EAAE,MAAM,CAAC;YAAC,CAAC,EAAE,MAAM,CAAA;SAAC,CAAA;KAAC,GAAG,IAAI,CAAC;CAC1E;AAsXD,QAAA,MAAM,aAAa;IApZjB;;;;OAIG;YACK,SAAS;eACN,GAAG;IACd,6CAA6C;2BACtB,MAAM,GAAG,IAAI;IACpC,mDAAmD;iCACtB;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI;IAC1D,4EAA4E;kBAC9D,IAAI;IAClB;;;OAGG;iBACU;QAAC,CAAC,CAAC,EAAE,OAAO,CAAC;QAAC,CAAC,CAAC,EAAE,OAAO,CAAA;KAAC;IACvC;;;OAGG;8BACuB,OAAO;IACjC,oCAAoC;aAC3B,MAAM;;;sCA4XwD,CAAC;AAE1E,OAAO,EAAC,aAAa,IAAI,SAAS,EAAC,CAAC"}
1
+ {"version":3,"file":"PinchZoom.d.ts","sourceRoot":"","sources":["../../../../src/components/uis/PinchZoom/PinchZoom.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAKZ,KAAK,iBAAiB,EAGvB,MAAM,OAAO,CAAC;AACf,OAAO,EAGL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAEtB,OAAiB,EAMf,KAAK,WAAW,EACjB,MAAM,yBAAyB,CAAC;AAEjC,MAAM,MAAM,cAAc,GAAG,iBAAiB,CAAC;IAC7C;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,wDAAwD;IACxD,cAAc,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,8DAA8D;IAC9D,kBAAkB,CAAC,CAAC,OAAO,EAAE;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC;IAC3D,iDAAiD;IACjD,kBAAkB,CAAC,IAAI,IAAI,CAAC;IAC5B,kDAAkD;IAClD,gBAAgB,CAAC,IAAI,IAAI,CAAC;IAC1B,6DAA6D;IAC7D,SAAS,CAAC,IAAI,IAAI,CAAC;IACnB,sDAAsD;IACtD,UAAU,CAAC,EAAE;QAAC,CAAC,CAAC,EAAE,OAAO,CAAC;QAAC,CAAC,CAAC,EAAE,OAAO,CAAA;KAAC,CAAC;IACxC,4EAA4E;IAC5E,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,yCAAyC;IACzC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,wCAAwC;IACxC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qCAAqC;IACrC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC,CAAC;AAEH,MAAM,WAAW,YAAY;IAC3B,aAAa,EAAE;QACb,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;QAC3B,SAAS,EAAE;YAAC,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;YAAC,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;SAAC,CAAC;KAC7D,CAAC;IACF,SAAS,CAAC,CAAC,EAAE;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE;YAAC,CAAC,EAAE,MAAM,CAAC;YAAC,CAAC,EAAE,MAAM,CAAA;SAAC,CAAA;KAAC,GAAG,IAAI,CAAC;CAC1E;AAiRD,QAAA,MAAM,aAAa;IAnTjB;;;;OAIG;YACK,SAAS,CAAC,SAAS,CAAC;IAC5B,wDAAwD;2BACjC,MAAM,GAAG,IAAI;IACpC,8DAA8D;iCACjC;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI;IAC1D,iDAAiD;2BAC1B,IAAI;IAC3B,kDAAkD;yBAC7B,IAAI;IACzB,6DAA6D;kBAC/C,IAAI;IAClB,sDAAsD;iBACzC;QAAC,CAAC,CAAC,EAAE,OAAO,CAAC;QAAC,CAAC,CAAC,EAAE,OAAO,CAAA;KAAC;IACvC,4EAA4E;8BAClD,OAAO;IACjC,yCAAyC;eAC9B,MAAM;IACjB,wCAAwC;eAC7B,MAAM;IACjB,qCAAqC;aAC5B,MAAM;;;sCA4RhB,CAAC;AAEF,OAAO,EAAC,aAAa,IAAI,SAAS,EAAC,CAAC"}
package/components/uis/PinchZoom/PinchZoom.js CHANGED
@@ -1,255 +1,203 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { forwardRef, useEffect, useImperativeHandle, useRef, useState, } from 'react';
3
- import { Animated, PanResponder } from 'react-native';
4
- function getDistanceFromTouches(touches) {
5
- const [touch1, touch2] = touches;
6
- return Math.sqrt((touch1.pageX - touch2.pageX) ** 2 + (touch1.pageY - touch2.pageY) ** 2);
2
+ import { useCallback, forwardRef, useImperativeHandle, useMemo, } from 'react';
3
+ import { StyleSheet, } from 'react-native';
4
+ import { Gesture, GestureDetector } from 'react-native-gesture-handler';
5
+ import Animated, { ReduceMotion, runOnJS, useAnimatedStyle, useSharedValue, withSpring, } from 'react-native-reanimated';
6
+ const spring = {
7
+ damping: 22,
8
+ mass: 0.75,
9
+ reduceMotion: ReduceMotion.System,
10
+ stiffness: 240,
11
+ };
12
+ function clampValue(value, min, max) {
13
+ 'worklet';
14
+ return Math.min(Math.max(value, min), max);
7
15
  }
8
- function getRelativeTouchesCenterPosition(touches, layout, transformCache) {
9
- const pageX = (touches[0].pageX + touches[1].pageX) / 2 - layout.width / 2 - layout.pageX;
10
- const pageY = (touches[0].pageY + touches[1].pageY) / 2 -
11
- layout.height / 2 -
12
- layout.pageY;
13
- return {
14
- locationX: (pageX - transformCache.translateX) / transformCache.scale,
15
- locationY: (pageY - transformCache.translateY) / transformCache.scale,
16
- pageX,
17
- pageY,
18
- };
16
+ function axisBoundary(scale, size) {
17
+ 'worklet';
18
+ return Math.max(0, ((scale - 1) * size) / 2);
19
19
  }
20
- function PinchZoom({ style, children, onScaleChanged, onRelease, onTranslateChanged, allowEmpty, fixOverflowAfterRelease = true, testID = 'pinch-zoom-container', }, ref) {
21
- const containerView = useRef(null);
22
- const scale = useRef(new Animated.Value(1)).current;
23
- const translate = useRef(new Animated.ValueXY({ x: 0, y: 0 })).current;
24
- const transformCache = useRef({
25
- scale: 1,
26
- translateX: 0,
27
- translateY: 0,
28
- }).current;
29
- const lastTransform = useRef({ scale: 1, translateX: 0, translateY: 0 });
30
- const initialDistance = useRef(undefined);
31
- const initialTouchesCenter = useRef(undefined);
32
- const layout = useRef(undefined);
33
- const decayingTranslateAnimation = useRef(undefined);
34
- const isResponderActive = useRef(false);
35
- const movingVelocity = useRef(undefined);
36
- containerView.current?.measure((x, y, width, height, pageX, pageY) => {
37
- layout.current = { width, height, pageX, pageY };
38
- });
39
- useEffect(() => {
40
- scale.addListener(({ value }) => {
41
- transformCache.scale = value;
42
- onScaleChanged?.(value);
43
- });
44
- const id = translate.addListener(({ x, y }) => {
45
- if (decayingTranslateAnimation.current &&
46
- layout.current &&
47
- !isResponderActive.current) {
48
- const overflowX = !allowEmpty?.x &&
49
- Math.abs(x) > ((transformCache.scale - 1) * layout.current.width) / 2;
50
- const overflowY = !allowEmpty?.y &&
51
- Math.abs(y) >
52
- ((transformCache.scale - 1) * layout.current.height) / 2;
53
- if (overflowX || overflowY) {
54
- decayingTranslateAnimation.current?.stop();
55
- decayingTranslateAnimation.current = undefined;
56
- translate.setValue({
57
- x: overflowX
58
- ? (Math.sign(x) *
59
- (transformCache.scale - 1) *
60
- layout.current.width) /
61
- 2
62
- : x,
63
- y: overflowY
64
- ? (Math.sign(y) *
65
- (transformCache.scale - 1) *
66
- layout.current.height) /
67
- 2
68
- : y,
69
- });
70
- }
71
- }
72
- transformCache.translateX = x;
73
- transformCache.translateY = y;
74
- onTranslateChanged?.({ x, y });
75
- });
76
- return () => {
77
- scale.removeAllListeners();
78
- translate.removeListener(id);
79
- };
80
- }, [
81
- onScaleChanged,
82
- onTranslateChanged,
83
- scale,
84
- transformCache,
85
- translate,
20
+ function PinchZoomContainer({ style, children, onScaleChanged, onTranslateChanged, onInteractionStart, onInteractionEnd, onRelease, allowEmpty, fixOverflowAfterRelease = true, minScale = 1, maxScale = 4, testID = 'pinch-zoom-container', }, ref) {
21
+ const lowerScale = Math.max(0.1, minScale);
22
+ const upperScale = Math.max(lowerScale, maxScale);
23
+ const width = useSharedValue(0);
24
+ const height = useSharedValue(0);
25
+ const scale = useSharedValue(lowerScale);
26
+ const translateX = useSharedValue(0);
27
+ const translateY = useSharedValue(0);
28
+ const startScale = useSharedValue(lowerScale);
29
+ const startTranslateX = useSharedValue(0);
30
+ const startTranslateY = useSharedValue(0);
31
+ const notifySettled = useCallback((nextScale, x, y) => {
32
+ onScaleChanged?.(nextScale);
33
+ onTranslateChanged?.({ x, y });
34
+ onInteractionEnd?.();
35
+ onRelease?.();
36
+ }, [onInteractionEnd, onRelease, onScaleChanged, onTranslateChanged]);
37
+ const pinch = useMemo(() => Gesture.Pinch()
38
+ .onStart(() => {
39
+ startScale.set(scale.get());
40
+ startTranslateX.set(translateX.get());
41
+ startTranslateY.set(translateY.get());
42
+ if (onInteractionStart)
43
+ runOnJS(onInteractionStart)();
44
+ })
45
+ .onUpdate((event) => {
46
+ const previousScale = Math.max(startScale.get(), 0.1);
47
+ const nextScale = clampValue(previousScale * event.scale, lowerScale, upperScale);
48
+ const ratio = nextScale / previousScale;
49
+ const originX = event.focalX - width.get() / 2;
50
+ const originY = event.focalY - height.get() / 2;
51
+ const nextX = startTranslateX.get() +
52
+ (1 - ratio) * (originX - startTranslateX.get());
53
+ const nextY = startTranslateY.get() +
54
+ (1 - ratio) * (originY - startTranslateY.get());
55
+ const boundX = axisBoundary(nextScale, width.get());
56
+ const boundY = axisBoundary(nextScale, height.get());
57
+ scale.set(nextScale);
58
+ translateX.set(allowEmpty?.x ? nextX : clampValue(nextX, -boundX, boundX));
59
+ translateY.set(allowEmpty?.y ? nextY : clampValue(nextY, -boundY, boundY));
60
+ })
61
+ .onEnd(() => {
62
+ const nextScale = scale.get();
63
+ const shouldReset = nextScale <= lowerScale + 0.001;
64
+ const settledScale = shouldReset ? lowerScale : nextScale;
65
+ const boundX = axisBoundary(settledScale, width.get());
66
+ const boundY = axisBoundary(settledScale, height.get());
67
+ const settledX = shouldReset
68
+ ? 0
69
+ : allowEmpty?.x
70
+ ? translateX.get()
71
+ : clampValue(translateX.get(), -boundX, boundX);
72
+ const settledY = shouldReset
73
+ ? 0
74
+ : allowEmpty?.y
75
+ ? translateY.get()
76
+ : clampValue(translateY.get(), -boundY, boundY);
77
+ if (fixOverflowAfterRelease) {
78
+ scale.set(withSpring(settledScale, spring));
79
+ translateX.set(withSpring(settledX, spring));
80
+ translateY.set(withSpring(settledY, spring));
81
+ }
82
+ runOnJS(notifySettled)(settledScale, settledX, settledY);
83
+ }), [
86
84
  allowEmpty?.x,
87
85
  allowEmpty?.y,
86
+ fixOverflowAfterRelease,
87
+ height,
88
+ lowerScale,
89
+ notifySettled,
90
+ onInteractionStart,
91
+ scale,
92
+ startScale,
93
+ startTranslateX,
94
+ startTranslateY,
95
+ translateX,
96
+ translateY,
97
+ upperScale,
98
+ width,
88
99
  ]);
89
- const [panResponder, setPanResponder] = useState();
90
- useEffect(() => {
91
- setPanResponder(PanResponder.create({
92
- onMoveShouldSetPanResponder: () => true,
93
- onPanResponderGrant: ({ nativeEvent }) => {
94
- isResponderActive.current = true;
95
- movingVelocity.current = undefined;
96
- if (decayingTranslateAnimation.current) {
97
- decayingTranslateAnimation.current.stop();
98
- }
99
- const { touches } = nativeEvent;
100
- lastTransform.current = { ...transformCache };
101
- initialDistance.current = undefined;
102
- if (layout.current != null) {
103
- if (touches.length === 2) {
104
- initialDistance.current = getDistanceFromTouches(touches);
105
- initialTouchesCenter.current = getRelativeTouchesCenterPosition(touches, layout.current, transformCache);
106
- }
107
- else {
108
- initialDistance.current = undefined;
109
- }
110
- }
111
- },
112
- onPanResponderMove: ({ nativeEvent }, gestureState) => {
113
- const { touches } = nativeEvent;
114
- if (layout.current == null) {
115
- return;
116
- }
117
- if (movingVelocity.current) {
118
- movingVelocity.current = {
119
- x: (movingVelocity.current.x + gestureState.vx) / 2,
120
- y: (movingVelocity.current.y + gestureState.vy) / 2,
121
- };
122
- }
123
- else {
124
- movingVelocity.current = { x: gestureState.vx, y: gestureState.vy };
125
- }
126
- if (touches.length === 2) {
127
- if (initialDistance.current &&
128
- initialTouchesCenter.current &&
129
- layout.current) {
130
- const newScale = Math.max(1, (getDistanceFromTouches(touches) / initialDistance.current) *
131
- lastTransform.current.scale);
132
- const { pageX, pageY } = getRelativeTouchesCenterPosition(touches, layout.current, transformCache);
133
- scale.setValue(newScale);
134
- const newTranslateX = pageX - initialTouchesCenter.current.locationX * newScale;
135
- const newTranslateY = pageY - initialTouchesCenter.current.locationY * newScale;
136
- translate.setValue({
137
- x: allowEmpty?.x
138
- ? newTranslateX
139
- : Math.min(Math.abs(newTranslateX), ((newScale - 1) * layout.current.width) / 2) * Math.sign(newTranslateX),
140
- y: allowEmpty?.y
141
- ? newTranslateY
142
- : Math.min(Math.abs(newTranslateY), ((newScale - 1) * layout.current.height) / 2) * Math.sign(newTranslateY),
143
- });
144
- }
145
- else {
146
- initialDistance.current = getDistanceFromTouches(touches);
147
- initialTouchesCenter.current = getRelativeTouchesCenterPosition(touches, layout.current, transformCache);
148
- }
149
- }
150
- else if (touches.length === 1) {
151
- if (initialDistance.current) {
152
- return;
153
- }
154
- const newTranslateX = lastTransform.current.translateX + gestureState.dx;
155
- const newTranslateY = lastTransform.current.translateY + gestureState.dy;
156
- translate.setValue({
157
- x: newTranslateX,
158
- y: newTranslateY,
159
- });
160
- }
161
- },
162
- onPanResponderRelease: () => {
163
- isResponderActive.current = false;
164
- if (layout.current == null) {
165
- return;
166
- }
167
- const overflowX = !allowEmpty?.x &&
168
- Math.abs(transformCache.translateX) >
169
- ((transformCache.scale - 1) * layout.current.width) / 2;
170
- const overflowY = !allowEmpty?.y &&
171
- Math.abs(transformCache.translateY) >
172
- ((transformCache.scale - 1) * layout.current.height) / 2;
173
- if (overflowX || overflowY) {
174
- if (!fixOverflowAfterRelease) {
175
- onRelease?.();
176
- return;
177
- }
178
- decayingTranslateAnimation.current?.stop();
179
- decayingTranslateAnimation.current = undefined;
180
- const toValue = {
181
- x: overflowX
182
- ? (Math.sign(transformCache.translateX) *
183
- (transformCache.scale - 1) *
184
- layout.current.width) /
185
- 2
186
- : transformCache.translateX,
187
- y: overflowY
188
- ? (Math.sign(transformCache.translateY) *
189
- (transformCache.scale - 1) *
190
- layout.current.height) /
191
- 2
192
- : transformCache.translateY,
193
- };
194
- Animated.timing(translate, {
195
- toValue,
196
- duration: 100,
197
- useNativeDriver: true,
198
- }).start(() => {
199
- onRelease?.();
200
- });
201
- }
202
- else {
203
- decayingTranslateAnimation.current = Animated.decay(translate, {
204
- velocity: movingVelocity.current ?? { x: 0, y: 0 },
205
- useNativeDriver: true,
206
- });
207
- decayingTranslateAnimation.current.start(() => {
208
- decayingTranslateAnimation.current = undefined;
209
- onRelease?.();
210
- });
211
- }
212
- },
213
- }));
214
- }, [
100
+ const pan = useMemo(() => Gesture.Pan()
101
+ .withTestId(`${testID}-pan`)
102
+ .maxPointers(1)
103
+ .manualActivation(true)
104
+ .onTouchesMove((event, manager) => {
105
+ // Ignoring movement after activation still steals a native pager's
106
+ // touch stream. Yield before activation while the image is at rest.
107
+ if (event.numberOfTouches !== 1 ||
108
+ scale.get() <= lowerScale + 0.001) {
109
+ manager.fail();
110
+ return;
111
+ }
112
+ manager.activate();
113
+ })
114
+ .onStart(() => {
115
+ startTranslateX.set(translateX.get());
116
+ startTranslateY.set(translateY.get());
117
+ if (scale.get() > lowerScale + 0.001 && onInteractionStart)
118
+ runOnJS(onInteractionStart)();
119
+ })
120
+ .onUpdate((event) => {
121
+ if (scale.get() <= lowerScale + 0.001)
122
+ return;
123
+ const boundX = axisBoundary(scale.get(), width.get());
124
+ const boundY = axisBoundary(scale.get(), height.get());
125
+ const nextX = startTranslateX.get() + event.translationX;
126
+ const nextY = startTranslateY.get() + event.translationY;
127
+ translateX.set(allowEmpty?.x ? nextX : clampValue(nextX, -boundX, boundX));
128
+ translateY.set(allowEmpty?.y ? nextY : clampValue(nextY, -boundY, boundY));
129
+ })
130
+ .onEnd(() => {
131
+ const nextScale = scale.get();
132
+ const boundX = axisBoundary(nextScale, width.get());
133
+ const boundY = axisBoundary(nextScale, height.get());
134
+ const settledX = allowEmpty?.x
135
+ ? translateX.get()
136
+ : clampValue(translateX.get(), -boundX, boundX);
137
+ const settledY = allowEmpty?.y
138
+ ? translateY.get()
139
+ : clampValue(translateY.get(), -boundY, boundY);
140
+ if (fixOverflowAfterRelease) {
141
+ translateX.set(withSpring(settledX, spring));
142
+ translateY.set(withSpring(settledY, spring));
143
+ }
144
+ runOnJS(notifySettled)(nextScale, settledX, settledY);
145
+ }), [
215
146
  allowEmpty?.x,
216
147
  allowEmpty?.y,
217
148
  fixOverflowAfterRelease,
218
- onRelease,
149
+ height,
150
+ lowerScale,
151
+ notifySettled,
152
+ onInteractionStart,
219
153
  scale,
220
- transformCache,
221
- translate,
154
+ startTranslateX,
155
+ startTranslateY,
156
+ testID,
157
+ translateX,
158
+ translateY,
159
+ width,
222
160
  ]);
161
+ const gesture = useMemo(() => Gesture.Simultaneous(pinch, pan), [pan, pinch]);
162
+ const animatedStyle = useAnimatedStyle(() => ({
163
+ transform: [
164
+ { translateX: translateX.get() },
165
+ { translateY: translateY.get() },
166
+ { scale: scale.get() },
167
+ ],
168
+ }));
223
169
  useImperativeHandle(ref, () => ({
224
- animatedValue: { scale, translate },
170
+ animatedValue: { scale, translate: { x: translateX, y: translateY } },
225
171
  setValues: (values) => {
226
- values.scale != null && scale.setValue(values.scale);
227
- values.translate != null && translate.setValue(values.translate);
172
+ const nextScale = clampValue(values.scale ?? scale.get(), lowerScale, upperScale);
173
+ scale.set(nextScale);
174
+ if (values.translate) {
175
+ translateX.set(values.translate.x);
176
+ translateY.set(values.translate.y);
177
+ }
178
+ onScaleChanged?.(nextScale);
179
+ if (values.translate)
180
+ onTranslateChanged?.(values.translate);
228
181
  },
229
- }));
230
- // Warn if style.transform is provided, as it will disable pinch-zoom
231
- if (__DEV__ && style?.transform) {
182
+ }), [
183
+ lowerScale,
184
+ onScaleChanged,
185
+ onTranslateChanged,
186
+ scale,
187
+ translateX,
188
+ translateY,
189
+ upperScale,
190
+ ]);
191
+ const flattenedStyle = StyleSheet.flatten(style);
192
+ if (__DEV__ && flattenedStyle?.transform) {
232
193
  console.warn('PinchZoom: passing transform in style prop will disable pinch-zoom functionality. ' +
233
194
  'Use a wrapper View for custom transforms instead.');
234
195
  }
235
- return (_jsx(Animated.View
236
- // @ts-ignore - ref type issue with NativeMethods
237
- , {
238
- // @ts-ignore - ref type issue with NativeMethods
239
- ref: (pinchViewRef) => {
240
- containerView.current = pinchViewRef;
241
- }, style: [
242
- style,
243
- style?.transform
244
- ? {}
245
- : {
246
- transform: [
247
- { translateX: translate.x },
248
- { translateY: translate.y },
249
- { scale },
250
- ],
251
- },
252
- ], testID: testID, ...(panResponder?.panHandlers || {}), children: children }));
196
+ const onLayout = ({ nativeEvent }) => {
197
+ width.set(nativeEvent.layout.width);
198
+ height.set(nativeEvent.layout.height);
199
+ };
200
+ return (_jsx(GestureDetector, { gesture: gesture, children: _jsx(Animated.View, { onLayout: onLayout, style: [style, flattenedStyle?.transform ? undefined : animatedStyle], testID: testID, children: children }) }));
253
201
  }
254
- const PinchZoomRoot = forwardRef(PinchZoom);
202
+ const PinchZoomRoot = forwardRef(PinchZoomContainer);
255
203
  export { PinchZoomRoot as PinchZoom };
package/components/uis/Typography/Typography.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Typography.d.ts","sourceRoot":"","sources":["../../../../src/components/uis/Typography/Typography.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,IAAI,EAAkC,MAAM,cAAc,CAAC;AAC9E,OAAO,EAAC,QAAQ,EAAgB,MAAM,sBAAsB,CAAC;AAK7D,KAAK,iBAAiB,GAAG;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B,CAAC;AAmPF,eAAO,MAAM,UAAU;;gBA7OI,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;CAwP5E,CAAC;AAEF,eAAO,MAAM,kBAAkB;;gBA1PJ,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;CAqQ5E,CAAC;AAeF,eAAO,MAAM,aAAa,GAAI,cAAc,gBAAgB,KAAG,IA6E9D,CAAC;AAGF,eAAO,MAAM,eAAe,GAAI,WAAW,OAAO,KAAG,iBAOpD,CAAC"}
1
+ {"version":3,"file":"Typography.d.ts","sourceRoot":"","sources":["../../../../src/components/uis/Typography/Typography.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,IAAI,EAAkC,MAAM,cAAc,CAAC;AAC9E,OAAO,EAAC,QAAQ,EAAgB,MAAM,sBAAsB,CAAC;AAK7D,KAAK,iBAAiB,GAAG;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B,CAAC;AAsPF,eAAO,MAAM,UAAU;;gBAhPI,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;CA2P5E,CAAC;AAEF,eAAO,MAAM,kBAAkB;;gBA7PJ,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;CAwQ5E,CAAC;AAeF,eAAO,MAAM,aAAa,GAAI,cAAc,gBAAgB,KAAG,IA6E9D,CAAC;AAGF,eAAO,MAAM,eAAe,GAAI,WAAW,OAAO,KAAG,iBAOpD,CAAC"}
package/components/uis/Typography/Typography.js CHANGED
@@ -39,7 +39,13 @@ const createTextComponent = ({ BaseText, fontSize, lineHeight, fontWeight, isHea
39
39
  { includeFontPadding: false },
40
40
  style,
41
41
  ], [style, effectiveFontWeight]);
42
- return (_jsx(BaseText, { ...props, "$fontWeight": effectiveFontWeight, style: textStyle, children: children }));
42
+ return (_jsx(BaseText
43
+ // React Native's iOS default breaks Hangul between any two syllables
44
+ // ("있어 / 요"); native labels keep Korean words whole.
45
+ , {
46
+ // React Native's iOS default breaks Hangul between any two syllables
47
+ // ("있어 / 요"); native labels keep Korean words whole.
48
+ lineBreakStrategyIOS: "hangul-word", ...props, "$fontWeight": effectiveFontWeight, style: textStyle, children: children }));
43
49
  });
44
50
  const StandardHeadingBaseText = createBaseText((theme) => theme.text.basic, 'gray', true);
45
51
  const StandardBodyBaseText = createBaseText((theme) => theme.text.basic, 'gray', false);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cpk-ui",
3
- "version": "0.8.0-beta.5",
3
+ "version": "0.8.0-beta.6",
4
4
  "main": "index",
5
5
  "react-native": "index",
6
6
  "module": "index",