Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
terra-disclosure-manager
Advanced tools
terra-disclosure-manager - npm Package Compare versions
Comparing version 4.6.0 to 4.7.0
@@ -7,2 +7,7 @@ ChangeLog | ||
| 4.7.0 - (April 2, 2019) | ||
| ------------------ | ||
| ### Changed | ||
| * Doc Updates | ||
| 4.6.0 - (March 26, 2019) | ||
@@ -9,0 +14,0 @@ ------------------ |
@@ -7,3 +7,3 @@ # Dependency Information | ||
| | prop-types | ^15.5.8 | -- | Runtime type checking for React props and similar objects. | | ||
| | terra-doc-template | ^2.2.0 | ^16.4.2 | Provides an adjustable template for documentation pages. | | ||
| | terra-doc-template | ^2.2.0 | ^16.8.5 | Provides an adjustable template for documentation pages. | | ||
@@ -13,3 +13,3 @@ ## peerDependencies | ||
| |-|-|-|-| | ||
| | react | ^16.4.2 | -- | React is a JavaScript library for building user interfaces. | | ||
| | react-dom | ^16.4.2 | ^16.0.0 | React package for working with the DOM. | | ||
| | react | ^16.8.5 | -- | React is a JavaScript library for building user interfaces. | | ||
| | react-dom | ^16.8.5 | ^16.0.0 | React package for working with the DOM. | |
@@ -13,94 +13,59 @@ # Upgrade Guide - v2 to v3 | ||
| ## v2 | ||
| ```jsx | ||
| import Base from 'terra-base'; | ||
| import ModalManager from 'terra-modal-manager'; | ||
| import AppDelegate from 'terra-app-delegate'; | ||
| const MyDisclosureComponent = ({ app }) => ( | ||
| <Button | ||
| text="Close Modal" | ||
| onClick={() => { | ||
| app.closeDisclosure(); | ||
| }} | ||
| /> | ||
| ); | ||
| ```diff | ||
| /** | ||
| * v2.x to v3.x | ||
| */ | ||
| import Base from 'terra-base'; | ||
| import ModalManager from 'terra-modal-manager'; | ||
| - import AppDelegate from 'terra-app-delegate'; | ||
| + import { withDisclosureManager, disclosureManagerShape } from 'terra-disclosure-manager'; | ||
| MyDisclosureComponent.propType = { | ||
| app: AppDelegate.propType, | ||
| } | ||
| - const MyDisclosureComponent = ({ app }) => ( | ||
| + const MyDisclosureComponent = withDisclosureManager(({ disclosureManager }) => ( | ||
| <Button | ||
| text="Close Modal" | ||
| onClick={() => { | ||
| - app.closeDisclosure(); | ||
| + disclosureManager.closeDisclosure(); | ||
| }} | ||
| /> | ||
| - ); | ||
| + )); | ||
| const MyComponent = ({ app }) => ( | ||
| <Button | ||
| text="Launch Modal" | ||
| onClick={() => { | ||
| app.disclose({ | ||
| preferredType: 'modal', | ||
| content: { | ||
| key: 'MY-MODAL-DISCLOSURE', | ||
| component: <MyDisclosureComponent />, | ||
| } | ||
| }); | ||
| }} | ||
| /> | ||
| ); | ||
| MyDisclosureComponent.propType = { | ||
| - app: AppDelegate.propType, | ||
| + disclosureManager: disclosureManagerShape, | ||
| }; | ||
| MyComponent.propType = { | ||
| app: AppDelegate.propType, | ||
| } | ||
| - const MyComponent = ({ app }) => ( | ||
| + const MyComponent = withDisclosureManager(({ disclosureManager }) => ( | ||
| <Button | ||
| text="Launch Modal" | ||
| onClick={() => { | ||
| - app.disclose({ | ||
| + disclosureManager.disclose({ | ||
| preferredType: 'modal', | ||
| content: { | ||
| key: 'MY-MODAL-DISCLOSURE', | ||
| component: <MyDisclosureComponent />, | ||
| } | ||
| }); | ||
| }} | ||
| /> | ||
| - ); | ||
| + )); | ||
| MyComponent.propType = { | ||
| - app: AppDelegate.propType, | ||
| + disclosureManager: disclosureManagerShape, | ||
| }; | ||
| const MyApp = () => ( | ||
| <Base locale="en"> | ||
| <ModalManager> | ||
| <MyComponent /> | ||
| </ModalManager> | ||
| </Base> | ||
| ) | ||
| const MyApp = () => ( | ||
| <Base locale="en"> | ||
| <ModalManager> | ||
| <MyComponent /> | ||
| </ModalManager> | ||
| </Base> | ||
| ); | ||
| ``` | ||
| ### v3 | ||
| ```jsx | ||
| import Base from 'terra-base'; | ||
| import ModalManager from 'terra-modal-manager'; | ||
| import { withDisclosureManager, disclosureManagerShape } from 'terra-disclosure-manager'; | ||
| const MyDisclosureComponent = withDisclosureManager(({ disclosureManager }) => ( | ||
| <Button | ||
| text="Close Modal" | ||
| onClick={() => { | ||
| disclosureManager.closeDisclosure(); | ||
| }} | ||
| /> | ||
| )); | ||
| MyDisclosureComponent.propTypes = { | ||
| disclosureManager: disclosureManagerShape, | ||
| } | ||
| const MyComponent = withDisclosureManager(({ disclosureManager }) => ( | ||
| <Button | ||
| text="Launch Modal" | ||
| onClick={() => { | ||
| disclosureManager.disclose({ | ||
| preferredType: 'modal', | ||
| content: { | ||
| key: 'MY-MODAL-DISCLOSURE', | ||
| component: <MyDisclosureComponent />, | ||
| } | ||
| }); | ||
| }} | ||
| /> | ||
| )); | ||
| MyComponent.propTypes = { | ||
| disclosureManager: disclosureManagerShape, | ||
| } | ||
| const MyApp = () => ( | ||
| <Base locale="en"> | ||
| <ModalManager> | ||
| <MyComponent /> | ||
| </ModalManager> | ||
| </Base> | ||
| ) | ||
| ``` |
| { | ||
| "name": "terra-disclosure-manager", | ||
| "main": "lib/DisclosureManager.js", | ||
| "version": "4.6.0", | ||
| "version": "4.7.0", | ||
| "description": "A stateful component used to manage disclosure presentation.", | ||
@@ -6,0 +6,0 @@ "repository": { |
@@ -13,94 +13,59 @@ # Upgrade Guide - v2 to v3 | ||
| ## v2 | ||
| ```jsx | ||
| import Base from 'terra-base'; | ||
| import ModalManager from 'terra-modal-manager'; | ||
| import AppDelegate from 'terra-app-delegate'; | ||
| const MyDisclosureComponent = ({ app }) => ( | ||
| <Button | ||
| text="Close Modal" | ||
| onClick={() => { | ||
| app.closeDisclosure(); | ||
| }} | ||
| /> | ||
| ); | ||
| ```diff | ||
| /** | ||
| * v2.x to v3.x | ||
| */ | ||
| import Base from 'terra-base'; | ||
| import ModalManager from 'terra-modal-manager'; | ||
| - import AppDelegate from 'terra-app-delegate'; | ||
| + import { withDisclosureManager, disclosureManagerShape } from 'terra-disclosure-manager'; | ||
| MyDisclosureComponent.propType = { | ||
| app: AppDelegate.propType, | ||
| } | ||
| - const MyDisclosureComponent = ({ app }) => ( | ||
| + const MyDisclosureComponent = withDisclosureManager(({ disclosureManager }) => ( | ||
| <Button | ||
| text="Close Modal" | ||
| onClick={() => { | ||
| - app.closeDisclosure(); | ||
| + disclosureManager.closeDisclosure(); | ||
| }} | ||
| /> | ||
| - ); | ||
| + )); | ||
| const MyComponent = ({ app }) => ( | ||
| <Button | ||
| text="Launch Modal" | ||
| onClick={() => { | ||
| app.disclose({ | ||
| preferredType: 'modal', | ||
| content: { | ||
| key: 'MY-MODAL-DISCLOSURE', | ||
| component: <MyDisclosureComponent />, | ||
| } | ||
| }); | ||
| }} | ||
| /> | ||
| ); | ||
| MyDisclosureComponent.propType = { | ||
| - app: AppDelegate.propType, | ||
| + disclosureManager: disclosureManagerShape, | ||
| }; | ||
| MyComponent.propType = { | ||
| app: AppDelegate.propType, | ||
| } | ||
| - const MyComponent = ({ app }) => ( | ||
| + const MyComponent = withDisclosureManager(({ disclosureManager }) => ( | ||
| <Button | ||
| text="Launch Modal" | ||
| onClick={() => { | ||
| - app.disclose({ | ||
| + disclosureManager.disclose({ | ||
| preferredType: 'modal', | ||
| content: { | ||
| key: 'MY-MODAL-DISCLOSURE', | ||
| component: <MyDisclosureComponent />, | ||
| } | ||
| }); | ||
| }} | ||
| /> | ||
| - ); | ||
| + )); | ||
| MyComponent.propType = { | ||
| - app: AppDelegate.propType, | ||
| + disclosureManager: disclosureManagerShape, | ||
| }; | ||
| const MyApp = () => ( | ||
| <Base locale="en"> | ||
| <ModalManager> | ||
| <MyComponent /> | ||
| </ModalManager> | ||
| </Base> | ||
| ) | ||
| const MyApp = () => ( | ||
| <Base locale="en"> | ||
| <ModalManager> | ||
| <MyComponent /> | ||
| </ModalManager> | ||
| </Base> | ||
| ); | ||
| ``` | ||
| ### v3 | ||
| ```jsx | ||
| import Base from 'terra-base'; | ||
| import ModalManager from 'terra-modal-manager'; | ||
| import { withDisclosureManager, disclosureManagerShape } from 'terra-disclosure-manager'; | ||
| const MyDisclosureComponent = withDisclosureManager(({ disclosureManager }) => ( | ||
| <Button | ||
| text="Close Modal" | ||
| onClick={() => { | ||
| disclosureManager.closeDisclosure(); | ||
| }} | ||
| /> | ||
| )); | ||
| MyDisclosureComponent.propTypes = { | ||
| disclosureManager: disclosureManagerShape, | ||
| } | ||
| const MyComponent = withDisclosureManager(({ disclosureManager }) => ( | ||
| <Button | ||
| text="Launch Modal" | ||
| onClick={() => { | ||
| disclosureManager.disclose({ | ||
| preferredType: 'modal', | ||
| content: { | ||
| key: 'MY-MODAL-DISCLOSURE', | ||
| component: <MyDisclosureComponent />, | ||
| } | ||
| }); | ||
| }} | ||
| /> | ||
| )); | ||
| MyComponent.propTypes = { | ||
| disclosureManager: disclosureManagerShape, | ||
| } | ||
| const MyApp = () => ( | ||
| <Base locale="en"> | ||
| <ModalManager> | ||
| <MyComponent /> | ||
| </ModalManager> | ||
| </Base> | ||
| ) | ||
| ``` |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Worsened metrics
- Total package byte prevSize
- decreased by-0.71%
124822
No dependency changes