@wistia/ui 0.18.9 → 0.18.10-beta.1c7d7d81.2b9bb3b

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, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, PropsWithChildren, ReactElement, InputHTMLAttributes, Ref, SyntheticEvent, HTMLAttributes, ForwardRefExoticComponent, RefAttributes, ComponentProps } from 'react';
+import { ReactNode, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, FocusEvent, MouseEvent, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, AnchorHTMLAttributes, ReactElement, ElementType, ChangeEvent, PropsWithChildren, InputHTMLAttributes, Ref, SyntheticEvent, HTMLAttributes, ForwardRefExoticComponent, RefAttributes, TdHTMLAttributes, ThHTMLAttributes, ComponentProps } from 'react';
 import { UseFilePickerConfig, FilePickerReturnTypes, ExtractContentTypeFromConfig, useImperativeFilePickerConfig, ImperativeFilePickerReturnTypes } from 'use-file-picker/types';
 export * from 'use-file-picker/types';
 import { CollapsibleContentProps as CollapsibleContentProps$1 } from '@radix-ui/react-collapsible';
@@ -123,11 +123,11 @@ declare const useFocusTrap: (active?: boolean, options?: UseFocusTrapOptions) =>
 declare const useForceUpdate: () => (() => void);
 
 type HoverProps = {
-    onFocus: (event: React.FocusEvent) => void;
-    onMouseEnter: (event: React.MouseEvent) => void;
-    onBlur: (event: React.FocusEvent) => void;
-    onMouseLeave: (event: React.MouseEvent) => void;
-    onMouseMove?: (event: React.MouseEvent) => void;
+    onFocus: (event: FocusEvent) => void;
+    onMouseEnter: (event: MouseEvent) => void;
+    onBlur: (event: FocusEvent) => void;
+    onMouseLeave: (event: MouseEvent) => void;
+    onMouseMove?: (event: MouseEvent) => void;
 };
 declare const useIsHovered: () => [boolean, HoverProps, (hovered: boolean) => void];
 
@@ -198,7 +198,7 @@ declare const ColorSchemeWrapper: {
 type ButtonVariants = 'ghost' | 'outline' | 'soft' | 'solid';
 
 type LinkTypes = 'default' | 'email' | 'external' | 'phone';
-type ReactRouterLinkProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> & {
+type ReactRouterLinkProps = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> & {
     reloadDocument?: boolean;
     replace?: boolean;
     state?: any;
@@ -432,7 +432,7 @@ type ToastProps = ComponentPropsWithoutRef<'div'> & {
     /**
      * Action can be undefined (default dismiss button), a Button component or false to hide the dismiss button
      */
-    action?: React.ReactElement<typeof Button> | undefined;
+    action?: ReactElement<typeof Button> | undefined;
     /**
      * Sets the [color scheme](../?path=/docs/docs-color-schemes--docs)
      */
@@ -2195,7 +2195,7 @@ type EditableTextCancelButtonProps = {
      */
     children: ReactElement;
 };
-declare const EditableTextCancelButton: ({ children, }: EditableTextCancelButtonProps) => React.JSX.Element | null;
+declare const EditableTextCancelButton: ({ children, }: EditableTextCancelButtonProps) => JSX.Element | null;
 
 type EditableTextTriggerProps = {
     /**
@@ -3181,7 +3181,7 @@ type ModalCalloutsProps = {
     /**
      * The content to be displayed in the modal callout.
      */
-    children?: React.ReactNode;
+    children?: ReactNode;
 };
 declare const ModalCallouts: {
     ({ children }: ModalCalloutsProps): react_jsx_runtime.JSX.Element;
@@ -3193,7 +3193,7 @@ type ModalCalloutProps = {
     /**
      * The content to be displayed in the modal callout.
      */
-    children?: React.ReactNode;
+    children?: ReactNode;
 };
 declare const ModalCallout: {
     ({ title, image, children }: ModalCalloutProps): react_jsx_runtime.JSX.Element;
@@ -3926,23 +3926,23 @@ declare const Switch: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHT
     hideLabel?: boolean;
 } & react.RefAttributes<HTMLInputElement>>;
 
-type TableBodyProps = react__default.HTMLAttributes<HTMLTableSectionElement> & {
+type TableBodyProps = HTMLAttributes<HTMLTableSectionElement> & {
     children?: ReactNode;
 };
 declare const TableBody: ({ children, ...props }: TableBodyProps) => JSX.Element;
 
-type CellAttrs = Omit<react__default.TdHTMLAttributes<HTMLTableCellElement>, 'ref'> & Omit<react__default.ThHTMLAttributes<HTMLTableCellElement>, 'ref'>;
+type CellAttrs = Omit<TdHTMLAttributes<HTMLTableCellElement>, 'ref'> & Omit<ThHTMLAttributes<HTMLTableCellElement>, 'ref'>;
 type TableCellProps = CellAttrs & {
     children?: ReactNode;
 };
 declare const TableCell: ({ children, ...props }: TableCellProps) => JSX.Element;
 
-type TableFootProps = react__default.HTMLAttributes<HTMLTableSectionElement> & {
+type TableFootProps = HTMLAttributes<HTMLTableSectionElement> & {
     children?: ReactNode;
 };
 declare const TableFoot: ({ children, ...props }: TableFootProps) => JSX.Element;
 
-type TableHeadProps = react__default.HTMLAttributes<HTMLTableSectionElement> & {
+type TableHeadProps = HTMLAttributes<HTMLTableSectionElement> & {
     children?: ReactNode;
 };
 declare const TableHead: ({ children, ...props }: TableHeadProps) => 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, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, PropsWithChildren, ReactElement, InputHTMLAttributes, Ref, SyntheticEvent, HTMLAttributes, ForwardRefExoticComponent, RefAttributes, ComponentProps } from 'react';
+import { ReactNode, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, FocusEvent, MouseEvent, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, AnchorHTMLAttributes, ReactElement, ElementType, ChangeEvent, PropsWithChildren, InputHTMLAttributes, Ref, SyntheticEvent, HTMLAttributes, ForwardRefExoticComponent, RefAttributes, TdHTMLAttributes, ThHTMLAttributes, ComponentProps } from 'react';
 import { UseFilePickerConfig, FilePickerReturnTypes, ExtractContentTypeFromConfig, useImperativeFilePickerConfig, ImperativeFilePickerReturnTypes } from 'use-file-picker/types';
 export * from 'use-file-picker/types';
 import { CollapsibleContentProps as CollapsibleContentProps$1 } from '@radix-ui/react-collapsible';
@@ -123,11 +123,11 @@ declare const useFocusTrap: (active?: boolean, options?: UseFocusTrapOptions) =>
 declare const useForceUpdate: () => (() => void);
 
 type HoverProps = {
-    onFocus: (event: React.FocusEvent) => void;
-    onMouseEnter: (event: React.MouseEvent) => void;
-    onBlur: (event: React.FocusEvent) => void;
-    onMouseLeave: (event: React.MouseEvent) => void;
-    onMouseMove?: (event: React.MouseEvent) => void;
+    onFocus: (event: FocusEvent) => void;
+    onMouseEnter: (event: MouseEvent) => void;
+    onBlur: (event: FocusEvent) => void;
+    onMouseLeave: (event: MouseEvent) => void;
+    onMouseMove?: (event: MouseEvent) => void;
 };
 declare const useIsHovered: () => [boolean, HoverProps, (hovered: boolean) => void];
 
@@ -198,7 +198,7 @@ declare const ColorSchemeWrapper: {
 type ButtonVariants = 'ghost' | 'outline' | 'soft' | 'solid';
 
 type LinkTypes = 'default' | 'email' | 'external' | 'phone';
-type ReactRouterLinkProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> & {
+type ReactRouterLinkProps = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> & {
     reloadDocument?: boolean;
     replace?: boolean;
     state?: any;
@@ -432,7 +432,7 @@ type ToastProps = ComponentPropsWithoutRef<'div'> & {
     /**
      * Action can be undefined (default dismiss button), a Button component or false to hide the dismiss button
      */
-    action?: React.ReactElement<typeof Button> | undefined;
+    action?: ReactElement<typeof Button> | undefined;
     /**
      * Sets the [color scheme](../?path=/docs/docs-color-schemes--docs)
      */
@@ -2195,7 +2195,7 @@ type EditableTextCancelButtonProps = {
      */
     children: ReactElement;
 };
-declare const EditableTextCancelButton: ({ children, }: EditableTextCancelButtonProps) => React.JSX.Element | null;
+declare const EditableTextCancelButton: ({ children, }: EditableTextCancelButtonProps) => JSX.Element | null;
 
 type EditableTextTriggerProps = {
     /**
@@ -3181,7 +3181,7 @@ type ModalCalloutsProps = {
     /**
      * The content to be displayed in the modal callout.
      */
-    children?: React.ReactNode;
+    children?: ReactNode;
 };
 declare const ModalCallouts: {
     ({ children }: ModalCalloutsProps): react_jsx_runtime.JSX.Element;
@@ -3193,7 +3193,7 @@ type ModalCalloutProps = {
     /**
      * The content to be displayed in the modal callout.
      */
-    children?: React.ReactNode;
+    children?: ReactNode;
 };
 declare const ModalCallout: {
     ({ title, image, children }: ModalCalloutProps): react_jsx_runtime.JSX.Element;
@@ -3926,23 +3926,23 @@ declare const Switch: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHT
     hideLabel?: boolean;
 } & react.RefAttributes<HTMLInputElement>>;
 
-type TableBodyProps = react__default.HTMLAttributes<HTMLTableSectionElement> & {
+type TableBodyProps = HTMLAttributes<HTMLTableSectionElement> & {
     children?: ReactNode;
 };
 declare const TableBody: ({ children, ...props }: TableBodyProps) => JSX.Element;
 
-type CellAttrs = Omit<react__default.TdHTMLAttributes<HTMLTableCellElement>, 'ref'> & Omit<react__default.ThHTMLAttributes<HTMLTableCellElement>, 'ref'>;
+type CellAttrs = Omit<TdHTMLAttributes<HTMLTableCellElement>, 'ref'> & Omit<ThHTMLAttributes<HTMLTableCellElement>, 'ref'>;
 type TableCellProps = CellAttrs & {
     children?: ReactNode;
 };
 declare const TableCell: ({ children, ...props }: TableCellProps) => JSX.Element;
 
-type TableFootProps = react__default.HTMLAttributes<HTMLTableSectionElement> & {
+type TableFootProps = HTMLAttributes<HTMLTableSectionElement> & {
     children?: ReactNode;
 };
 declare const TableFoot: ({ children, ...props }: TableFootProps) => JSX.Element;
 
-type TableHeadProps = react__default.HTMLAttributes<HTMLTableSectionElement> & {
+type TableHeadProps = HTMLAttributes<HTMLTableSectionElement> & {
     children?: ReactNode;
 };
 declare const TableHead: ({ children, ...props }: TableHeadProps) => JSX.Element;

package/dist/index.mjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.18.9
+ * @license @wistia/ui v0.18.10-beta.1c7d7d81.2b9bb3b
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -17549,7 +17549,6 @@ var Table = ({
 };
 
 // src/components/Table/TableBody.tsx
-import "react";
 import { styled as styled97 } from "styled-components";
 
 // src/components/Table/TableSectionContext.ts
@@ -17593,7 +17592,6 @@ var TableCell = ({ children, ...props }) => {
 };
 
 // src/components/Table/TableFoot.tsx
-import "react";
 import { styled as styled99 } from "styled-components";
 import { jsx as jsx321 } from "react/jsx-runtime";
 var StyledTableFoot = styled99.tfoot``;
@@ -17602,7 +17600,6 @@ var TableFoot = ({ children, ...props }) => {
 };
 
 // src/components/Table/TableHead.tsx
-import "react";
 import { styled as styled100 } from "styled-components";
 import { jsx as jsx322 } from "react/jsx-runtime";
 var StyledThead = styled100.thead``;
@@ -17803,7 +17800,7 @@ var StyledThumbnailBadge = styled105.div`
   align-items: center;
   background-color: rgb(0 0 0 / 50%);
   border-radius: var(--wui-border-radius-01);
-  bottom: var(--wui-thumbnail-badge-offset);
+  bottom: var(--wui-thumbnail-badge-offset, var(--wui-space-01));
   color: var(--wui-color-text-on-fill);
   display: flex;
   font-size: var(--wui-typography-body-4-size);
@@ -17811,7 +17808,7 @@ var StyledThumbnailBadge = styled105.div`
   gap: var(--wui-space-01);
   padding: 0 var(--wui-space-01);
   position: absolute;
-  right: var(--wui-thumbnail-badge-offset);
+  right: var(--wui-thumbnail-badge-offset, var(--wui-space-01));
   z-index: 1;
 
   svg {
@@ -18173,7 +18170,11 @@ var StyledThumbnail = styled107.div`
   width: 100%;
   overflow: hidden;
   position: relative;
-  border-radius: clamp(var(--wui-border-radius-01), 8cqh, var(--wui-border-radius-05));
+
+  &,
+  img {
+    border-radius: clamp(var(--wui-border-radius-01), 8cqh, var(--wui-border-radius-05));
+  }
 
   @container (min-width: 200px) {
     --wui-thumbnail-badge-offset: var(--wui-space-02);
@@ -18330,7 +18331,7 @@ var Thumbnail = forwardRef37(
 Thumbnail.displayName = "Thumbnail_UI";
 
 // src/components/ThumbnailCollage/ThumbnailCollage.tsx
-import React5 from "react";
+import { cloneElement as cloneElement9, Children as Children11 } from "react";
 import { styled as styled108 } from "styled-components";
 import { isNonEmptyArray } from "@wistia/type-guards";
 import { jsx as jsx331 } from "react/jsx-runtime";
@@ -18389,10 +18390,10 @@ var ThumbnailCollage = ({
   gradientBackground = "defaultMidOne",
   ...props
 }) => {
-  const thumbnailArray = React5.Children.toArray(children);
+  const thumbnailArray = Children11.toArray(children);
   const truncatedThumbnails = thumbnailArray.slice(0, 3);
   const thumbnails = isNonEmptyArray(thumbnailArray) ? truncatedThumbnails.map((child) => {
-    return React5.cloneElement(child, {
+    return cloneElement9(child, {
       ...child.props,
       children: void 0
     });
@@ -18546,7 +18547,7 @@ WistiaLogo.displayName = "WistiaLogo_UI";
 // src/components/SplitButton/SplitButton.tsx
 import { styled as styled110 } from "styled-components";
 import { isNotNil as isNotNil45 } from "@wistia/type-guards";
-import { cloneElement as cloneElement9 } from "react";
+import { cloneElement as cloneElement10 } from "react";
 import { jsx as jsx333, jsxs as jsxs74 } from "react/jsx-runtime";
 var StyledSplitButton = styled110.span`
   ${({ $colorScheme }) => getColorScheme($colorScheme)};
@@ -18611,7 +18612,7 @@ var SplitButton = ({
         children: menuItems
       }
     ),
-    isNotNil45(secondaryAction) && cloneElement9(secondaryAction, { disabled, size, unstyled, variant, colorScheme })
+    isNotNil45(secondaryAction) && cloneElement10(secondaryAction, { disabled, size, unstyled, variant, colorScheme })
   ] });
 };
 SplitButton.displayName = "SplitButton_UI";