@wistia/ui 0.6.16 → 0.6.17

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
-import react__default, { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, MutableRefObject, ForwardedRef, Ref, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes } from 'react';
+import react__default, { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, MutableRefObject, ForwardedRef, Ref, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes, HTMLAttributes } from 'react';
 export * from 'use-file-picker/types';
 export { useFilePicker, useImperativeFilePicker } from 'use-file-picker';
 export { FileAmountLimitValidator, FileSizeValidator, FileTypeValidator, ImageDimensionsValidator, PersistentFileAmountLimitValidator } from 'use-file-picker/validators';
@@ -2525,7 +2525,7 @@ type TableProps = ComponentPropsWithoutRef<'table'> & {
  */
 declare const Table: ({ children, striped, divided, ...props }: TableProps) => JSX.Element;
 
-type TableRowProps = react__default.HTMLAttributes<HTMLTableRowElement> & {
+type TableRowProps = HTMLAttributes<HTMLTableRowElement> & {
     children?: ReactNode;
 };
 declare const TableRow: ({ children, ...props }: TableRowProps) => JSX.Element;

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
-import react__default, { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, MutableRefObject, ForwardedRef, Ref, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes } from 'react';
+import react__default, { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, MutableRefObject, ForwardedRef, Ref, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes, HTMLAttributes } from 'react';
 export * from 'use-file-picker/types';
 export { useFilePicker, useImperativeFilePicker } from 'use-file-picker';
 export { FileAmountLimitValidator, FileSizeValidator, FileTypeValidator, ImageDimensionsValidator, PersistentFileAmountLimitValidator } from 'use-file-picker/validators';
@@ -2525,7 +2525,7 @@ type TableProps = ComponentPropsWithoutRef<'table'> & {
  */
 declare const Table: ({ children, striped, divided, ...props }: TableProps) => JSX.Element;
 
-type TableRowProps = react__default.HTMLAttributes<HTMLTableRowElement> & {
+type TableRowProps = HTMLAttributes<HTMLTableRowElement> & {
     children?: ReactNode;
 };
 declare const TableRow: ({ children, ...props }: TableRowProps) => JSX.Element;

package/dist/index.mjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.6.16
+ * @license @wistia/ui v0.6.17
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -9771,12 +9771,11 @@ var Header = styled42.header`
   display: flex;
   order: 1;
   gap: var(--wui-space-01);
-  margin-bottom: var(--wui-space-03);
-  justify-content: space-between;
+  justify-content: ${({ $hideTitle }) => $hideTitle ? "flex-end" : "space-between"}; /* ensure ModalCloseButton is right-aligned */
 
   /* DialogTitle creates an h2 element which inherits some margin */
   h2 {
-    margin-top: 0;
+    margin: 0 0 var(--wui-space-03);
   }
 `;
 var Title = styled42(DialogTitle)`
@@ -9791,7 +9790,7 @@ var ModalHeader = ({
   hideCloseButton
 }) => {
   const TitleComponent = hideTitle ? /* @__PURE__ */ jsx234(ScreenReaderOnly, { children: /* @__PURE__ */ jsx234(Title, { children: title }) }) : /* @__PURE__ */ jsx234(Title, { children: title });
-  return /* @__PURE__ */ jsxs27(Header, { children: [
+  return /* @__PURE__ */ jsxs27(Header, { $hideTitle: hideTitle, children: [
     TitleComponent,
     hideCloseButton ? null : /* @__PURE__ */ jsx234(ModalCloseButton, {})
   ] });
@@ -10757,14 +10756,7 @@ var SelectOptionGroup = ({ children, label, ...props }) => {
 };
 
 // src/components/Table/Table.tsx
-import { useMemo as useMemo10 } from "react";
 import styled55, { css as css30 } from "styled-components";
-
-// src/components/Table/TableContext.tsx
-import React from "react";
-var TableContext = React.createContext({ divided: false });
-
-// src/components/Table/Table.tsx
 import { jsx as jsx247 } from "react/jsx-runtime";
 var StyledTable = styled55.table`
   width: 100%;
@@ -10775,6 +10767,12 @@ var StyledTable = styled55.table`
         background-color: var(--wui-color-bg-surface-secondary);
       }
     `}
+
+  ${({ $divided }) => $divided && css30`
+      tr {
+        border-bottom: 1px solid var(--wui-color-border);
+      }
+    `}
 `;
 var Table = ({
   children,
@@ -10782,15 +10780,15 @@ var Table = ({
   divided = false,
   ...props
 }) => {
-  const contextValue = useMemo10(() => ({ divided }), [divided]);
-  return /* @__PURE__ */ jsx247(TableContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx247(
+  return /* @__PURE__ */ jsx247(
     StyledTable,
     {
+      $divided: divided,
       $striped: striped,
       ...props,
       children
     }
-  ) });
+  );
 };
 
 // src/components/Table/TableBody.tsx
@@ -10853,22 +10851,11 @@ var TableHead = ({ children, ...props }) => {
 };
 
 // src/components/Table/TableRow.tsx
-import { useContext as useContext8 } from "react";
 import styled60 from "styled-components";
 import { jsx as jsx252 } from "react/jsx-runtime";
-var StyledTr = styled60.tr`
-  ${({ $divided }) => $divided && `border-bottom: 1px solid var(--wui-color-border);`}
-`;
+var StyledTr = styled60.tr``;
 var TableRow = ({ children, ...props }) => {
-  const { divided = false } = useContext8(TableContext);
-  return /* @__PURE__ */ jsx252(
-    StyledTr,
-    {
-      $divided: divided,
-      ...props,
-      children
-    }
-  );
+  return /* @__PURE__ */ jsx252(StyledTr, { ...props, children });
 };
 
 // src/components/Tabs/Tabs.tsx
@@ -10933,11 +10920,11 @@ import { Trigger as RadixTab } from "@radix-ui/react-tabs";
 import { isNotNil as isNotNil22 } from "@wistia/type-guards";
 
 // src/components/Tabs/useTabsValue.tsx
-import { createContext as createContext9, useContext as useContext9 } from "react";
+import { createContext as createContext9, useContext as useContext8 } from "react";
 var TabsValueContext = createContext9(null);
 var TabsValueProvider = TabsValueContext.Provider;
 var useTabsValue = () => {
-  const context = useContext9(TabsValueContext);
+  const context = useContext8(TabsValueContext);
   if (context === null) {
     throw new Error("useTabsValue must be used within a TabsValueProvider");
   }
@@ -11025,7 +11012,7 @@ var extractTabItems = (children) => {
 };
 
 // src/components/Tabs/SelectedItemIndicator.tsx
-import { useMemo as useMemo11 } from "react";
+import { useMemo as useMemo10 } from "react";
 import styled64 from "styled-components";
 import { jsx as jsx255 } from "react/jsx-runtime";
 var TabsSelectedItemIndicatorDiv = styled64(SelectedItemIndicatorDiv)`
@@ -11036,7 +11023,7 @@ var TabsSelectedItemIndicatorDiv = styled64(SelectedItemIndicatorDiv)`
 var SelectedItemIndicator2 = () => {
   const { selectedItemMeasurements } = useSelectedItemMeasurements();
   const selectedValue = useTabsValue();
-  const selectedItemIndicatorStyle = useMemo11(
+  const selectedItemIndicatorStyle = useMemo10(
     () => selectedItemMeasurements != null ? {
       height: `${selectedItemMeasurements.offsetHeight}px`,
       transform: `translateX(${selectedItemMeasurements.offsetLeft}px)`,