diff --git a/.changeset/proud-poets-tan.md b/.changeset/proud-poets-tan.md new file mode 100644 index 000000000..1f724aa7d --- /dev/null +++ b/.changeset/proud-poets-tan.md @@ -0,0 +1,5 @@ +--- +"@tonightpass/kitchen": patch +--- + +Fix `Container` flex diff --git a/.changeset/thick-games-sit.md b/.changeset/thick-games-sit.md new file mode 100644 index 000000000..d305e4981 --- /dev/null +++ b/.changeset/thick-games-sit.md @@ -0,0 +1,5 @@ +--- +"@tonightpass/kitchen": minor +--- + +Add `Box` HOC diff --git a/packages/kitchen/src/components/Container/index.tsx b/packages/kitchen/src/components/Container/index.tsx index f36b00f4a..485b9e60a 100644 --- a/packages/kitchen/src/components/Container/index.tsx +++ b/packages/kitchen/src/components/Container/index.tsx @@ -36,11 +36,10 @@ const Container = styled( flex-direction: ${(props) => (props.direction && props.direction[props.direction.length - 1]) || (props.row ? "row" : "column")}; - position: relative; - max-width: 100%; - flex: ${(props) => (props.flex !== undefined ? props.flex : 1)}; + ${(props) => props.flex && `flex: ${props.flex};`} justify-content: ${(props) => props.justify || "flex-start"}; align-items: ${(props) => props.align || "stretch"}; + ${(props) => props.gap && `gap: ${props.theme.gap[props.gap as keyof Gap] || `${props.gap}px`};`}