diff --git a/packages/ui-extensions-react/src/surfaces/customer-account/components/PolicyModal/PolicyModal.ts b/packages/ui-extensions-react/src/surfaces/customer-account/components/PolicyModal/PolicyModal.ts index b72d531f7..1cce4a687 100644 --- a/packages/ui-extensions-react/src/surfaces/customer-account/components/PolicyModal/PolicyModal.ts +++ b/packages/ui-extensions-react/src/surfaces/customer-account/components/PolicyModal/PolicyModal.ts @@ -1,11 +1,30 @@ -import {PolicyModal as BasePolicyModal} from '@shopify/ui-extensions/customer-account'; -import { - createRemoteReactComponent, - ReactPropsFromRemoteComponentType, -} from '@remote-ui/react'; +import {createRemoteReactComponent} from '@remote-ui/react'; -export type PolicyModalProps = ReactPropsFromRemoteComponentType< - typeof BasePolicyModal ->; +type PolicyType = 'refund'; -export const PolicyModal = createRemoteReactComponent(BasePolicyModal); +// The interface was duplicated from the `ui-extensions` package because it no longer can be imported +// More on the PR: https://github.com/Shopify/ui-extensions/pull/1399 +export interface PolicyModalProps { + /** + * Whether the modal should be rendered. + * Modal is a controlled component, so you must keep the state of the `open` prop yourself. + */ + open: boolean; + /** + * Callback when either the close button, the backdrop, or the `escape` key is pressed. + * `onClose` is only called while the modal is open and attempts to be closed, + * not when it exits the viewport. + * You’ll usually want to use this callback to set the `open` prop to `false`. + */ + onClose: () => void; + /** + * A title rendered as a `Heading` at the top of the modal. + */ + title: string; + /** + * Type of policy to render. + */ + type: PolicyType; +} + +export const PolicyModal = createRemoteReactComponent('PolicyModal'); diff --git a/packages/ui-extensions-react/src/surfaces/customer-account/components/index.ts b/packages/ui-extensions-react/src/surfaces/customer-account/components/index.ts index 9048aa2dd..6271be50c 100644 --- a/packages/ui-extensions-react/src/surfaces/customer-account/components/index.ts +++ b/packages/ui-extensions-react/src/surfaces/customer-account/components/index.ts @@ -1,5 +1,6 @@ export * from './Card'; export * from './CustomerAccountAction'; export * from './Page'; +/* @internal */ export * from './PolicyModal'; export * from './shared-checkout-components'; diff --git a/packages/ui-extensions-react/tsconfig.json b/packages/ui-extensions-react/tsconfig.json index 1bf56a7f9..bac9bf684 100644 --- a/packages/ui-extensions-react/tsconfig.json +++ b/packages/ui-extensions-react/tsconfig.json @@ -3,7 +3,8 @@ "compilerOptions": { "outDir": "build/ts", "rootDir": "src", - "jsx": "react-jsx" + "jsx": "react-jsx", + "stripInternal": true }, "include": ["config/typescript/faker.d.ts", "src/**/*.ts", "src/**/*.tsx"], "exclude": ["src/**/*.example.tsx", "src/**/tests/**"], diff --git a/packages/ui-extensions/src/surfaces/customer-account/components/PolicyModal/PolicyModal.ts b/packages/ui-extensions/src/surfaces/customer-account/components/PolicyModal/PolicyModal.ts index d52b1f67f..785b55645 100644 --- a/packages/ui-extensions/src/surfaces/customer-account/components/PolicyModal/PolicyModal.ts +++ b/packages/ui-extensions/src/surfaces/customer-account/components/PolicyModal/PolicyModal.ts @@ -2,6 +2,8 @@ import {createRemoteComponent} from '@remote-ui/core'; type PolicyType = 'refund'; +// The interface is duplicated in the `ui-extensions-react` package because it no longer can be imported +// More on the PR: https://github.com/Shopify/ui-extensions/pull/1399 export interface PolicyModalProps { /** * Whether the modal should be rendered. diff --git a/packages/ui-extensions/src/surfaces/customer-account/components/index.ts b/packages/ui-extensions/src/surfaces/customer-account/components/index.ts index 9048aa2dd..6271be50c 100644 --- a/packages/ui-extensions/src/surfaces/customer-account/components/index.ts +++ b/packages/ui-extensions/src/surfaces/customer-account/components/index.ts @@ -1,5 +1,6 @@ export * from './Card'; export * from './CustomerAccountAction'; export * from './Page'; +/* @internal */ export * from './PolicyModal'; export * from './shared-checkout-components'; diff --git a/packages/ui-extensions/tsconfig.json b/packages/ui-extensions/tsconfig.json index 0e97221b3..707d3d8df 100644 --- a/packages/ui-extensions/tsconfig.json +++ b/packages/ui-extensions/tsconfig.json @@ -2,7 +2,8 @@ "extends": "../../config/typescript/tsconfig.base.json", "compilerOptions": { "rootDir": "src", - "outDir": "build/ts" + "outDir": "build/ts", + "stripInternal": true }, "include": ["src/**/*.ts", "src/**/*.tsx"], "exclude": ["src/**/*.example.*", "src/**/tests/**"]