diff --git a/CHANGELOG.md b/CHANGELOG.md index e744bf1..601726d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,12 @@ All the log of changes on the project/repository The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/). +## 2023-08-18 + +### Modified + +- Improved typing and compound component examples + ## 2023-08-08 ### Added diff --git a/examples/compound-components/src/main.tsx b/examples/compound-components/src/main.tsx index 42321e6..56c61b4 100644 --- a/examples/compound-components/src/main.tsx +++ b/examples/compound-components/src/main.tsx @@ -21,7 +21,8 @@ type ParentProps = PropsWithChildren<{ }>; type ParentType = FC & { - NestedChild: FC; + // NestedChild: FC; + NestedChild: typeof NestedChild; // safer option }; const Parent: ParentType = ({ children, subCode }) => { @@ -45,54 +46,58 @@ const Parent: ParentType = ({ children, subCode }) => { }; Parent.NestedChild = NestedChild; -type CompoundParentProps = PropsWithChildren<{ - code: string; +type CompoundParentProps = PropsWithChildren<{ + code: TCode; }>; -const CompoundParent: FC & { - Parent: ParentType; -} = ({ code, children }) => { +const CompoundParent = ({ + code, + children, +}: CompoundParentProps) => { return {children}; }; -CompoundParent.Parent = Parent; + +const Group = Object.assign(CompoundParent, { + Parent, +}); function App() { return (
- - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + {/* ERROR, no parent nor compound parent */} - + {/* ERROR, no compound parent */} - - - + + + {/* ERROR, no parent */} - - - + + +
); }