@wistia/ui 0.3.0 → 0.3.2

package/dist/index.d.mts

@@ -474,7 +474,7 @@ type BoxProps = ComponentPropsWithoutRef<'div'> & {
  * Box is a layout container using [CSS Flexbox](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox).
  */
 declare const Box: {
-    ({ alignContent, alignItems, children, direction, hasBoxParent, fill, fillViewport, gap, inline, justifyContent, wrapItems, ...otherProps }: BoxProps): JSX.Element;
+    ({ alignContent, alignItems, alignSelf, basis, children, direction, fill, fillViewport, gap, grow, hasBoxParent, inline, justifyContent, order, shrink, wrapItems, ...otherProps }: BoxProps): JSX.Element;
     displayName: string;
 };
 

package/dist/index.d.ts

@@ -474,7 +474,7 @@ type BoxProps = ComponentPropsWithoutRef<'div'> & {
  * Box is a layout container using [CSS Flexbox](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox).
  */
 declare const Box: {
-    ({ alignContent, alignItems, children, direction, hasBoxParent, fill, fillViewport, gap, inline, justifyContent, wrapItems, ...otherProps }: BoxProps): JSX.Element;
+    ({ alignContent, alignItems, alignSelf, basis, children, direction, fill, fillViewport, gap, grow, hasBoxParent, inline, justifyContent, order, shrink, wrapItems, ...otherProps }: BoxProps): JSX.Element;
     displayName: string;
 };
 

package/dist/index.mjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.3.0
+ * @license @wistia/ui v0.3.2
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -5877,7 +5877,6 @@ import styled10 from "styled-components";
 import { isNotNil as isNotNil6, isNil as isNil7, isRecord as isRecord2 } from "@wistia/type-guards";
 import { jsx as jsx167 } from "react/jsx-runtime";
 var isDev = process.env["NODE_ENV"] === "development" || process.env["NODE_ENV"] === "test";
-var propsForFlexChildren = /* @__PURE__ */ new Set(["alignSelf", "basis", "grow", "order", "shrink"]);
 var getGapStyle = (gap) => {
   if (isNotNil6(gap)) {
     if (isRecord2(gap)) {
@@ -5956,35 +5955,39 @@ var wrapChildren = (children) => {
 var Box = ({
   alignContent = "stretch",
   alignItems = "flex-start",
+  alignSelf,
+  basis,
   children,
   direction = "row",
-  hasBoxParent = false,
   fill = false,
   fillViewport = false,
   gap,
+  grow,
+  hasBoxParent = false,
+  // eslint-disable-line @typescript-eslint/no-unused-vars
   inline = false,
   justifyContent = "flex-start",
+  order,
+  shrink,
   wrapItems = false,
   ...otherProps
 }) => {
-  if (isDev && !hasBoxParent) {
-    Object.keys(otherProps).forEach((prop) => {
-      if (propsForFlexChildren.has(prop)) {
-        console.warn(`${prop} only has an effect on <Box> instances that are children of a <Box>`);
-      }
-    });
-  }
   return /* @__PURE__ */ jsx167(
     BoxComponent,
     {
       $alignContent: alignContent,
       $alignItems: alignItems,
+      $alignSelf: alignSelf,
+      $basis: basis,
       $fillBox: fill,
       $fillViewport: fillViewport,
       $flexDirection: direction,
       $gap: gap,
+      $grow: grow,
       $inline: inline,
       $justifyContent: justifyContent,
+      $order: order,
+      $shrink: shrink,
       $wrapItems: wrapItems,
       as: "div",
       ...otherProps,
@@ -6015,7 +6018,7 @@ var ButtonGroupComponent = styled11.div`
 
   /* this helps ensure that primary buttons appear at the top of the column */
   flex-direction: ${({ $align }) => $align === "right" ? "column-reverse" : "column"};
-  gap: var(--wui-space-04);
+  gap: var(--wui-space-02);
   align-items: center;
   justify-content: ${({ $align }) => getAlignment($align)};
   width: ${({ $fullWidth }) => $fullWidth ? "100%" : "auto"};