@impulse-ui-native/modal 9.1.2 → 11.0.0

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 (17) hide show
  1. package/dist/components/close.d.mts +1 -2
  2. package/dist/components/content.d.mts +1 -2
  3. package/dist/components/description.d.mts +1 -2
  4. package/dist/components/footer.d.mts +1 -2
  5. package/dist/components/header.d.mts +1 -2
  6. package/dist/components/index.d.mts +9 -10
  7. package/dist/components/modal.d.mts +1 -2
  8. package/dist/components/provider.d.mts +1 -2
  9. package/dist/components/root.d.mts +1 -2
  10. package/dist/components/surface.d.mts +1 -2
  11. package/dist/components/title.d.mts +1 -2
  12. package/dist/constants/modal-close.constants.d.mts +2 -2
  13. package/dist/hooks/use-modal-lifecycle.hook.js +3 -37
  14. package/dist/hooks/use-modal-lifecycle.hook.js.map +1 -1
  15. package/dist/index.d.mts +0 -1
  16. package/dist/types/modal.types.d.mts +1 -1
  17. package/package.json +15 -15
package/dist/components/close.d.mts CHANGED
@@ -1,11 +1,10 @@
1
1
  import * as react from 'react';
2
- import * as react_jsx_runtime from 'react/jsx-runtime';
3
2
  import { ModalCloseProps } from '../types/modal.types.mjs';
4
3
  import 'react-native-reanimated';
5
4
  import '@impulse-ui-native/overlay';
6
5
  import '@impulse-ui-native/primitives';
7
6
  import '@impulse-ui-native/theme';
8
7
 
9
- declare const ModalClose: react.MemoExoticComponent<({ disabled, loading, style, onPress, ...props }: ModalCloseProps) => react_jsx_runtime.JSX.Element>;
8
+ declare const ModalClose: react.MemoExoticComponent<({ disabled, loading, style, onPress, ...props }: ModalCloseProps) => react.JSX.Element>;
10
9
 
11
10
  export { ModalClose };
package/dist/components/content.d.mts CHANGED
@@ -1,11 +1,10 @@
1
1
  import * as react from 'react';
2
- import * as react_jsx_runtime from 'react/jsx-runtime';
3
2
  import { ModalContentProps } from '../types/modal.types.mjs';
4
3
  import 'react-native-reanimated';
5
4
  import '@impulse-ui-native/overlay';
6
5
  import '@impulse-ui-native/primitives';
7
6
  import '@impulse-ui-native/theme';
8
7
 
9
- declare const ModalContent: react.MemoExoticComponent<({ style, ...props }: ModalContentProps) => react_jsx_runtime.JSX.Element>;
8
+ declare const ModalContent: react.MemoExoticComponent<({ style, ...props }: ModalContentProps) => react.JSX.Element>;
10
9
 
11
10
  export { ModalContent };
package/dist/components/description.d.mts CHANGED
@@ -1,11 +1,10 @@
1
1
  import * as react from 'react';
2
- import * as react_jsx_runtime from 'react/jsx-runtime';
3
2
  import { ModalDescriptionProps } from '../types/modal.types.mjs';
4
3
  import 'react-native-reanimated';
5
4
  import '@impulse-ui-native/overlay';
6
5
  import '@impulse-ui-native/primitives';
7
6
  import '@impulse-ui-native/theme';
8
7
 
9
- declare const ModalDescription: react.MemoExoticComponent<(props: ModalDescriptionProps) => react_jsx_runtime.JSX.Element>;
8
+ declare const ModalDescription: react.MemoExoticComponent<(props: ModalDescriptionProps) => react.JSX.Element>;
10
9
 
11
10
  export { ModalDescription };
package/dist/components/footer.d.mts CHANGED
@@ -1,11 +1,10 @@
1
1
  import * as react from 'react';
2
- import * as react_jsx_runtime from 'react/jsx-runtime';
3
2
  import { ModalFooterProps } from '../types/modal.types.mjs';
4
3
  import 'react-native-reanimated';
5
4
  import '@impulse-ui-native/overlay';
6
5
  import '@impulse-ui-native/primitives';
7
6
  import '@impulse-ui-native/theme';
8
7
 
9
- declare const ModalFooter: react.MemoExoticComponent<({ style, ...props }: ModalFooterProps) => react_jsx_runtime.JSX.Element>;
8
+ declare const ModalFooter: react.MemoExoticComponent<({ style, ...props }: ModalFooterProps) => react.JSX.Element>;
10
9
 
11
10
  export { ModalFooter };
package/dist/components/header.d.mts CHANGED
@@ -1,11 +1,10 @@
1
1
  import * as react from 'react';
2
- import * as react_jsx_runtime from 'react/jsx-runtime';
3
2
  import { ModalHeaderProps } from '../types/modal.types.mjs';
4
3
  import 'react-native-reanimated';
5
4
  import '@impulse-ui-native/overlay';
6
5
  import '@impulse-ui-native/primitives';
7
6
  import '@impulse-ui-native/theme';
8
7
 
9
- declare const ModalHeader: react.MemoExoticComponent<({ style, ...props }: ModalHeaderProps) => react_jsx_runtime.JSX.Element>;
8
+ declare const ModalHeader: react.MemoExoticComponent<({ style, ...props }: ModalHeaderProps) => react.JSX.Element>;
10
9
 
11
10
  export { ModalHeader };
package/dist/components/index.d.mts CHANGED
@@ -1,4 +1,3 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
1
  import * as react from 'react';
3
2
  import { ModalProps, ModalProviderProps, ModalRootProps, ModalHeaderProps, ModalCloseProps, ModalContentProps, ModalFooterProps, ModalTitleProps, ModalDescriptionProps } from '../types/modal.types.mjs';
4
3
  import 'react-native-reanimated';
@@ -7,16 +6,16 @@ import '@impulse-ui-native/primitives';
7
6
  import '@impulse-ui-native/theme';
8
7
 
9
8
  declare const Modal: react.NamedExoticComponent<ModalProps> & {
10
- readonly type: ({ id, open, layer, onOpen, onOpenFinished, onStatusChange, onClose, onCloseFinished, header, title, footer, hideClose, children, ...props }: ModalProps) => react_jsx_runtime.JSX.Element;
9
+ readonly type: ({ id, open, layer, onOpen, onOpenFinished, onStatusChange, onClose, onCloseFinished, header, title, footer, hideClose, children, ...props }: ModalProps) => react.JSX.Element;
11
10
  } & {
12
- Provider: react.MemoExoticComponent<({ children, layer, ...props }: ModalProviderProps) => react_jsx_runtime.JSX.Element>;
13
- Root: react.MemoExoticComponent<({ children, ...props }: ModalRootProps) => react_jsx_runtime.JSX.Element | null>;
14
- Header: react.MemoExoticComponent<({ style, ...props }: ModalHeaderProps) => react_jsx_runtime.JSX.Element>;
15
- Close: react.MemoExoticComponent<({ disabled, loading, style, onPress, ...props }: ModalCloseProps) => react_jsx_runtime.JSX.Element>;
16
- Content: react.MemoExoticComponent<({ style, ...props }: ModalContentProps) => react_jsx_runtime.JSX.Element>;
17
- Footer: react.MemoExoticComponent<({ style, ...props }: ModalFooterProps) => react_jsx_runtime.JSX.Element>;
18
- Title: react.MemoExoticComponent<(props: ModalTitleProps) => react_jsx_runtime.JSX.Element>;
19
- Description: react.MemoExoticComponent<(props: ModalDescriptionProps) => react_jsx_runtime.JSX.Element>;
11
+ Provider: react.MemoExoticComponent<({ children, layer, ...props }: ModalProviderProps) => react.JSX.Element>;
12
+ Root: react.MemoExoticComponent<({ children, ...props }: ModalRootProps) => react.JSX.Element | null>;
13
+ Header: react.MemoExoticComponent<({ style, ...props }: ModalHeaderProps) => react.JSX.Element>;
14
+ Close: react.MemoExoticComponent<({ disabled, loading, style, onPress, ...props }: ModalCloseProps) => react.JSX.Element>;
15
+ Content: react.MemoExoticComponent<({ style, ...props }: ModalContentProps) => react.JSX.Element>;
16
+ Footer: react.MemoExoticComponent<({ style, ...props }: ModalFooterProps) => react.JSX.Element>;
17
+ Title: react.MemoExoticComponent<(props: ModalTitleProps) => react.JSX.Element>;
18
+ Description: react.MemoExoticComponent<(props: ModalDescriptionProps) => react.JSX.Element>;
20
19
  };
21
20
 
22
21
  export { Modal };
package/dist/components/modal.d.mts CHANGED
@@ -1,11 +1,10 @@
1
1
  import * as react from 'react';
2
- import * as react_jsx_runtime from 'react/jsx-runtime';
3
2
  import { ModalProps } from '../types/modal.types.mjs';
4
3
  import 'react-native-reanimated';
5
4
  import '@impulse-ui-native/overlay';
6
5
  import '@impulse-ui-native/primitives';
7
6
  import '@impulse-ui-native/theme';
8
7
 
9
- declare const ModalComponent: react.MemoExoticComponent<({ id, open, layer, onOpen, onOpenFinished, onStatusChange, onClose, onCloseFinished, header, title, footer, hideClose, children, ...props }: ModalProps) => react_jsx_runtime.JSX.Element>;
8
+ declare const ModalComponent: react.MemoExoticComponent<({ id, open, layer, onOpen, onOpenFinished, onStatusChange, onClose, onCloseFinished, header, title, footer, hideClose, children, ...props }: ModalProps) => react.JSX.Element>;
10
9
 
11
10
  export { ModalComponent };
package/dist/components/provider.d.mts CHANGED
@@ -1,11 +1,10 @@
1
1
  import * as react from 'react';
2
- import * as react_jsx_runtime from 'react/jsx-runtime';
3
2
  import { ModalProviderProps } from '../types/modal.types.mjs';
4
3
  import 'react-native-reanimated';
5
4
  import '@impulse-ui-native/overlay';
6
5
  import '@impulse-ui-native/primitives';
7
6
  import '@impulse-ui-native/theme';
8
7
 
9
- declare const ModalProvider: react.MemoExoticComponent<({ children, layer, ...props }: ModalProviderProps) => react_jsx_runtime.JSX.Element>;
8
+ declare const ModalProvider: react.MemoExoticComponent<({ children, layer, ...props }: ModalProviderProps) => react.JSX.Element>;
10
9
 
11
10
  export { ModalProvider };
package/dist/components/root.d.mts CHANGED
@@ -1,11 +1,10 @@
1
1
  import * as react from 'react';
2
- import * as react_jsx_runtime from 'react/jsx-runtime';
3
2
  import { ModalRootProps } from '../types/modal.types.mjs';
4
3
  import 'react-native-reanimated';
5
4
  import '@impulse-ui-native/overlay';
6
5
  import '@impulse-ui-native/primitives';
7
6
  import '@impulse-ui-native/theme';
8
7
 
9
- declare const ModalRoot: react.MemoExoticComponent<({ children, ...props }: ModalRootProps) => react_jsx_runtime.JSX.Element | null>;
8
+ declare const ModalRoot: react.MemoExoticComponent<({ children, ...props }: ModalRootProps) => react.JSX.Element | null>;
10
9
 
11
10
  export { ModalRoot };
package/dist/components/surface.d.mts CHANGED
@@ -1,11 +1,10 @@
1
1
  import * as react from 'react';
2
- import * as react_jsx_runtime from 'react/jsx-runtime';
3
2
  import { ModalSurfaceProps } from '../types/modal.types.mjs';
4
3
  import 'react-native-reanimated';
5
4
  import '@impulse-ui-native/overlay';
6
5
  import '@impulse-ui-native/primitives';
7
6
  import '@impulse-ui-native/theme';
8
7
 
9
- declare const ModalSurface: react.MemoExoticComponent<({ size, style, ...props }: ModalSurfaceProps) => react_jsx_runtime.JSX.Element>;
8
+ declare const ModalSurface: react.MemoExoticComponent<({ size, style, ...props }: ModalSurfaceProps) => react.JSX.Element>;
10
9
 
11
10
  export { ModalSurface };
package/dist/components/title.d.mts CHANGED
@@ -1,11 +1,10 @@
1
1
  import * as react from 'react';
2
- import * as react_jsx_runtime from 'react/jsx-runtime';
3
2
  import { ModalTitleProps } from '../types/modal.types.mjs';
4
3
  import 'react-native-reanimated';
5
4
  import '@impulse-ui-native/overlay';
6
5
  import '@impulse-ui-native/primitives';
7
6
  import '@impulse-ui-native/theme';
8
7
 
9
- declare const ModalTitle: react.MemoExoticComponent<(props: ModalTitleProps) => react_jsx_runtime.JSX.Element>;
8
+ declare const ModalTitle: react.MemoExoticComponent<(props: ModalTitleProps) => react.JSX.Element>;
10
9
 
11
10
  export { ModalTitle };
package/dist/constants/modal-close.constants.d.mts CHANGED
@@ -1,8 +1,8 @@
1
- declare const ModalCloseStyles: {
1
+ declare const ModalCloseStyles: Readonly<{
2
2
  close: {
3
3
  alignItems: "center";
4
4
  justifyContent: "center";
5
5
  };
6
- };
6
+ }>;
7
7
 
8
8
  export { ModalCloseStyles };
package/dist/hooks/use-modal-lifecycle.hook.js CHANGED
@@ -1,44 +1,10 @@
1
- import { useEffect, useMemo } from "react";
2
- import {
3
- cancelAnimation,
4
- useSharedValue,
5
- withTiming
6
- } from "react-native-reanimated";
7
- import { scheduleOnRN } from "react-native-worklets";
8
- import { useEventCallback } from "@impulse-ui-native/core";
9
- import { useOverlayLifecycle } from "@impulse-ui-native/overlay";
1
+ import { useMemo } from "react";
2
+ import { useOverlayLifecycle, useOverlayTiming } from "@impulse-ui-native/overlay";
10
3
  import { useComponentsTokens } from "@impulse-ui-native/theme";
11
4
  function useModalLifecycle(props) {
12
5
  const tokens = useComponentsTokens().modal;
13
- const progress = useSharedValue(0);
14
- const enter = useEventCallback(
15
- (transitionId, complete) => {
16
- progress.set(
17
- withTiming(1, { duration: tokens.enterDuration }, (finished) => {
18
- if (finished) {
19
- scheduleOnRN(complete, transitionId);
20
- }
21
- })
22
- );
23
- }
24
- );
25
- const exit = useEventCallback(
26
- (transitionId, complete) => {
27
- progress.set(
28
- withTiming(0, { duration: tokens.exitDuration }, (finished) => {
29
- if (finished) {
30
- scheduleOnRN(complete, transitionId);
31
- }
32
- })
33
- );
34
- }
35
- );
36
- const options = useMemo(
37
- () => ({ onEnter: enter, onExit: exit }),
38
- [enter, exit]
39
- );
6
+ const { options, progress } = useOverlayTiming(tokens);
40
7
  const lifecycle = useOverlayLifecycle(props, options);
41
- useEffect(() => () => cancelAnimation(progress), [progress]);
42
8
  return useMemo(() => ({ ...lifecycle, progress }), [lifecycle, progress]);
43
9
  }
44
10
  export {
package/dist/hooks/use-modal-lifecycle.hook.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/hooks/use-modal-lifecycle.hook.ts"],"sourcesContent":["import { useEffect, useMemo } from \"react\";\nimport {\n cancelAnimation,\n useSharedValue,\n withTiming,\n} from \"react-native-reanimated\";\nimport { scheduleOnRN } from \"react-native-worklets\";\n\nimport type { OverlayTransitionHandler } from \"@impulse-ui-native/overlay\";\nimport { useEventCallback } from \"@impulse-ui-native/core\";\nimport { useOverlayLifecycle } from \"@impulse-ui-native/overlay\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport type { ModalLifecycleProps } from \"../types\";\n\nexport function useModalLifecycle(props: ModalLifecycleProps) {\n const tokens = useComponentsTokens().modal;\n const progress = useSharedValue(0);\n\n const enter = useEventCallback<OverlayTransitionHandler>(\n (transitionId, complete) => {\n progress.set(\n withTiming(1, { duration: tokens.enterDuration }, (finished) => {\n if (finished) {\n scheduleOnRN(complete, transitionId);\n }\n }),\n );\n },\n );\n const exit = useEventCallback<OverlayTransitionHandler>(\n (transitionId, complete) => {\n progress.set(\n withTiming(0, { duration: tokens.exitDuration }, (finished) => {\n if (finished) {\n scheduleOnRN(complete, transitionId);\n }\n }),\n );\n },\n );\n\n const options = useMemo(\n () => ({ onEnter: enter, onExit: exit }),\n [enter, exit],\n );\n const lifecycle = useOverlayLifecycle(props, options);\n\n useEffect(() => () => cancelAnimation(progress), [progress]);\n\n return useMemo(() => ({ ...lifecycle, progress }), [lifecycle, progress]);\n}\n"],"mappings":"AAAA,SAAS,WAAW,eAAe;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,oBAAoB;AAG7B,SAAS,wBAAwB;AACjC,SAAS,2BAA2B;AACpC,SAAS,2BAA2B;AAI7B,SAAS,kBAAkB,OAA4B;AAC5D,QAAM,SAAS,oBAAoB,EAAE;AACrC,QAAM,WAAW,eAAe,CAAC;AAEjC,QAAM,QAAQ;AAAA,IACZ,CAAC,cAAc,aAAa;AAC1B,eAAS;AAAA,QACP,WAAW,GAAG,EAAE,UAAU,OAAO,cAAc,GAAG,CAAC,aAAa;AAC9D,cAAI,UAAU;AACZ,yBAAa,UAAU,YAAY;AAAA,UACrC;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF;AACA,QAAM,OAAO;AAAA,IACX,CAAC,cAAc,aAAa;AAC1B,eAAS;AAAA,QACP,WAAW,GAAG,EAAE,UAAU,OAAO,aAAa,GAAG,CAAC,aAAa;AAC7D,cAAI,UAAU;AACZ,yBAAa,UAAU,YAAY;AAAA,UACrC;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF;AAEA,QAAM,UAAU;AAAA,IACd,OAAO,EAAE,SAAS,OAAO,QAAQ,KAAK;AAAA,IACtC,CAAC,OAAO,IAAI;AAAA,EACd;AACA,QAAM,YAAY,oBAAoB,OAAO,OAAO;AAEpD,YAAU,MAAM,MAAM,gBAAgB,QAAQ,GAAG,CAAC,QAAQ,CAAC;AAE3D,SAAO,QAAQ,OAAO,EAAE,GAAG,WAAW,SAAS,IAAI,CAAC,WAAW,QAAQ,CAAC;AAC1E;","names":[]}
1
+ {"version":3,"sources":["../../src/hooks/use-modal-lifecycle.hook.ts"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { useOverlayLifecycle, useOverlayTiming } from \"@impulse-ui-native/overlay\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport type { ModalLifecycleProps } from \"../types\";\n\nexport function useModalLifecycle(props: ModalLifecycleProps) {\n const tokens = useComponentsTokens().modal;\n const { options, progress } = useOverlayTiming(tokens);\n const lifecycle = useOverlayLifecycle(props, options);\n\n return useMemo(() => ({ ...lifecycle, progress }), [lifecycle, progress]);\n}\n"],"mappings":"AAAA,SAAS,eAAe;AAExB,SAAS,qBAAqB,wBAAwB;AACtD,SAAS,2BAA2B;AAI7B,SAAS,kBAAkB,OAA4B;AAC5D,QAAM,SAAS,oBAAoB,EAAE;AACrC,QAAM,EAAE,SAAS,SAAS,IAAI,iBAAiB,MAAM;AACrD,QAAM,YAAY,oBAAoB,OAAO,OAAO;AAEpD,SAAO,QAAQ,OAAO,EAAE,GAAG,WAAW,SAAS,IAAI,CAAC,WAAW,QAAQ,CAAC;AAC1E;","names":[]}
package/dist/index.d.mts CHANGED
@@ -1,7 +1,6 @@
1
1
  export { Modal } from './components/index.mjs';
2
2
  export { ModalCloseProps, ModalContentProps, ModalContextValue, ModalDescriptionProps, ModalFooterProps, ModalHeaderProps, ModalLifecycleProps, ModalProps, ModalProviderProps, ModalRootProps, ModalSurfaceProps, ModalTitleProps } from './types/modal.types.mjs';
3
3
  export { useModalContext } from './hooks/use-modal-context.hook.mjs';
4
- import 'react/jsx-runtime';
5
4
  import 'react';
6
5
  import 'react-native-reanimated';
7
6
  import '@impulse-ui-native/overlay';
package/dist/types/modal.types.d.mts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { PropsWithChildren, ReactNode } from 'react';
2
2
  import { SharedValue } from 'react-native-reanimated';
3
3
  import { OverlayLifecycleProps, OverlayComponentProps, OverlayLifecycleStatus } from '@impulse-ui-native/overlay';
4
- import { ViewProps, PressableCoreProps, TextProps } from '@impulse-ui-native/primitives';
4
+ import { PressableCoreProps, ViewProps, TextProps } from '@impulse-ui-native/primitives';
5
5
  import { ComponentSize } from '@impulse-ui-native/theme';
6
6
 
7
7
  interface ModalSurfaceProps extends ViewProps {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@impulse-ui-native/modal",
3
- "version": "9.1.2",
3
+ "version": "11.0.0",
4
4
  "description": "Compound modal dialogs with local and OverlayHost lifecycle support.",
5
5
  "keywords": [
6
6
  "react-native",
@@ -27,25 +27,25 @@
27
27
  ],
28
28
  "sideEffects": false,
29
29
  "dependencies": {
30
- "@impulse-ui-native/primitives": "9.1.2",
31
- "@impulse-ui-native/theme": "9.1.2",
32
- "@impulse-ui-native/overlay": "9.1.2",
33
- "@impulse-ui-native/icon": "9.1.2",
34
- "@impulse-ui-native/core": "9.1.2"
30
+ "@impulse-ui-native/icon": "11.0.0",
31
+ "@impulse-ui-native/theme": "11.0.0",
32
+ "@impulse-ui-native/primitives": "11.0.0",
33
+ "@impulse-ui-native/core": "11.0.0",
34
+ "@impulse-ui-native/overlay": "11.0.0"
35
35
  },
36
36
  "devDependencies": {
37
- "@types/react": "~19.2.14",
37
+ "@impulse-ui-native/eslint-config": "1.0.0",
38
+ "@impulse-ui-native/prettier-config": "1.0.0",
39
+ "@impulse-ui-native/tsconfig": "1.0.0",
40
+ "@types/react": "~19.3.0",
38
41
  "eslint": "^9.38.0",
39
42
  "prettier": "^3.6.2",
40
- "react": "19.2.3",
41
- "react-native": "0.86.2",
43
+ "react": "19.3.0",
44
+ "react-native": "0.88.0",
42
45
  "typescript": "~6.0.3",
43
- "react-native-reanimated": "4.5.1",
44
- "react-native-safe-area-context": "~5.7.0",
45
- "react-native-worklets": "0.10.1",
46
- "@impulse-ui-native/eslint-config": "1.0.0",
47
- "@impulse-ui-native/prettier-config": "1.0.0",
48
- "@impulse-ui-native/tsconfig": "1.0.0"
46
+ "react-native-reanimated": "4.7.1",
47
+ "react-native-safe-area-context": "~5.10.1",
48
+ "react-native-worklets": "0.13.0"
49
49
  },
50
50
  "peerDependencies": {
51
51
  "react": ">=18",