@modular-component/default 0.2.0 → 0.2.2

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 (3) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/README.md +26 -39
  3. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,25 @@
1
1
  # @modular-component/default
2
2
 
3
+ ## 0.2.2
4
+
5
+ ### Patch Changes
6
+
7
+ - 77c46f4: Fix an issue in core rendering system
8
+ - Updated dependencies [77c46f4]
9
+ - @modular-component/core@0.2.2
10
+ - @modular-component/with-default-props@0.2.2
11
+ - @modular-component/with-lifecycle@0.2.2
12
+
13
+ ## 0.2.1
14
+
15
+ ### Patch Changes
16
+
17
+ - 09b9673: Update readmes
18
+ - Updated dependencies [09b9673]
19
+ - @modular-component/core@0.2.1
20
+ - @modular-component/with-default-props@0.2.1
21
+ - @modular-component/with-lifecycle@0.2.1
22
+
3
23
  ## 0.2.0
4
24
 
5
25
  ### Minor Changes
package/README.md CHANGED
@@ -1,48 +1,35 @@
1
- # `@modular-component/with-default`
1
+ # @modular-component/default
2
2
 
3
- Sensible set of default extensions for the `ModularComponent` system.
3
+ Set of sensible defaults for using `ModularComponent`.
4
4
 
5
- Provides two stages:
6
- `withLifecycle` for adding a lifecycle hook, and `withDefaultProps` for
7
- providing default values for props.
5
+ Provides two stages: `with(lifecycle)` for adding a lifecycle hook, and `with(defaultProps)` for
6
+ providing default values for props. It also re-exports `with(render)` from `@modular-component/props` for convenience.
8
7
 
9
- It's also possible to import each of them individually through `@modular-component/with-lifecycle`
10
- and `@modular-component/with-default-props` respectively.
8
+ It's also possible to import each of them individually through [`@modular-component/with-lifecycle`](https://npmjs.com/package/@modular-component/with-lifecycle)
9
+ and <br /> [`@modular-component/with-default-props`](https://npmjs.com/package/@modular-component/with-default-props) respectively.
11
10
 
12
- ## Installation and usage
13
-
14
- ```bash
15
- yarn add @modular-component/core @modular-component/default
16
- ```
11
+ ## Usage
17
12
 
18
13
  ```tsx
19
- import { modularFactory } from '@modular-component/core'
20
- import { WithDefaultStages } from '@modular-component/default'
21
-
22
- const ModularComponent = modularFactory.extend(WithDefaultStages).build()
23
-
24
- const MyModularComponent = ModularComponent<{
25
- someFlag?: boolean
26
- someLabel: string
27
- someValue: number
28
- }>()
29
- .withDefaultProps({ someFlag: false })
30
- .withLifecycle(({ props }) => {
31
- const [someState, setSomeState] = useState(0)
32
-
33
- return { someState }
34
- })
35
- .withRender(({ props, lifecycle }) => (
36
- <>
37
- <h2>
38
- {props.someLabel}: {props.someValue}
39
- </h2>
40
- <p>Value from state: {lifecycle.someState}</p>
41
- <p>Flag from props: {props.someFlag ? 'true' : 'false'}</p>
42
- </>
43
- ))
14
+ import { ModularComponent } from '@modular-component/core'
15
+ import { defaultProps, lifecycle, render } from '@modular-component/default'
16
+
17
+ const MyComponent = ModularComponent()
18
+ .with(defaultProps({
19
+ // Define default props here
20
+ }))
21
+ .with(lifecycle(() => {
22
+ // Write component state & logic here
23
+ }))
24
+ .with(render(({ props, lifecycle }) => (
25
+ // Use generated props and lifecycle in the render phase
26
+ )))
44
27
  ```
45
28
 
46
- ## Learn more
29
+ ## Implementation
30
+
31
+ `@modular-component/default` simply merge together the records from two other packages. To see the implementation
32
+ details, refer to the individual packages:
47
33
 
48
- Read the [`ModularComponent` ReadMe](https://github.com/jvdsande/modular-component/blob/master/README.md) for more information about the `ModularComponent` system.
34
+ - [`@modular-component/with-default-props`](https://npmjs.com/package/@modular-component/with-default-props): powerful default props capabilities
35
+ - [`@modular-component/with-lifecycle`](https://npmjs.com/package/@modular-component/with-lifecycle): isolate component logic in a dedicated hook
package/package.json CHANGED
@@ -8,7 +8,7 @@
8
8
  "Default",
9
9
  "Lifecycle"
10
10
  ],
11
- "version": "0.2.0",
11
+ "version": "0.2.2",
12
12
  "type": "module",
13
13
  "license": "MIT",
14
14
  "publishConfig": {
@@ -27,9 +27,9 @@
27
27
  "license": "cp ../../LICENSE ./LICENSE"
28
28
  },
29
29
  "dependencies": {
30
- "@modular-component/core": "0.2.0",
31
- "@modular-component/with-default-props": "0.2.0",
32
- "@modular-component/with-lifecycle": "0.2.0"
30
+ "@modular-component/core": "0.2.2",
31
+ "@modular-component/with-default-props": "0.2.2",
32
+ "@modular-component/with-lifecycle": "0.2.2"
33
33
  },
34
34
  "devDependencies": {
35
35
  "typescript": "^5.2.2"