@wistia/ui 0.18.14-beta.7f8dcba7.4f6efd8 → 0.18.14-beta.cbf59204.be0f801
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +46 -9
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +14 -1
- package/dist/index.d.ts +14 -1
- package/dist/index.mjs +45 -9
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -4367,4 +4367,17 @@ declare const SplitButton: {
|
|
|
4367
4367
|
displayName: string;
|
|
4368
4368
|
};
|
|
4369
4369
|
|
|
4370
|
-
|
|
4370
|
+
type CustomizableTokens = '--wui-color-backdrop' | '--wui-color-bg-fill-active' | '--wui-color-bg-fill-hover' | '--wui-color-bg-fill-white ' | '--wui-color-bg-fill' | '--wui-color-bg-surface-active' | '--wui-color-bg-surface-disabled' | '--wui-color-bg-surface-hover' | '--wui-color-bg-surface-secondary-active' | '--wui-color-bg-surface-secondary-hover' | '--wui-color-bg-surface-secondary' | '--wui-color-bg-surface-selected-active' | '--wui-color-bg-surface-selected-hover' | '--wui-color-bg-surface-selected' | '--wui-color-bg-surface-tertiary' | '--wui-color-bg-surface' | '--wui-color-bg-tooltip' | '--wui-color-border-active-selected' | '--wui-color-border-active' | '--wui-color-border-disabled' | '--wui-color-border-hover-selected' | '--wui-color-border-hover' | '--wui-color-border-secondary-active' | '--wui-color-border-secondary-hover' | '--wui-color-border-secondary' | '--wui-color-border-selected' | '--wui-color-border' | '--wui-color-drop-shadow' | '--wui-color-focus-color' | '--wui-color-focus-ring-disabled' | '--wui-color-focus-ring' | '--wui-color-icon-disabled' | '--wui-color-icon-on-fill' | '--wui-color-icon-selected' | '--wui-color-icon' | '--wui-color-invalid-indicator' | '--wui-color-notification-pill-color' | '--wui-color-segmented-control-checked-background' | '--wui-color-text-button' | '--wui-color-text-disabled' | '--wui-color-text-link' | '--wui-color-text-on-fill-white-selected' | '--wui-color-text-on-fill' | '--wui-color-text-secondary' | '--wui-color-text-selected' | '--wui-color-text';
|
|
4371
|
+
type CustomizableThemeWrapperProps = ComponentPropsWithoutRef<'div'> & {
|
|
4372
|
+
children: ReactNode;
|
|
4373
|
+
overrides: Partial<Record<CustomizableTokens, number | string>>;
|
|
4374
|
+
};
|
|
4375
|
+
/**
|
|
4376
|
+
* Component description goes here
|
|
4377
|
+
*/
|
|
4378
|
+
declare const CustomizableThemeWrapper: {
|
|
4379
|
+
({ children, overrides, ...props }: CustomizableThemeWrapperProps): JSX.Element;
|
|
4380
|
+
displayName: string;
|
|
4381
|
+
};
|
|
4382
|
+
|
|
4383
|
+
export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Banner, BannerImage, type BannerProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Center, type CenterProps, Checkbox, CheckboxGroup, CheckboxMenuItem, ClickRegion, type ClickRegionProps, Collapsible, CollapsibleContent, type CollapsibleProps, CollapsibleTrigger, CollapsibleTriggerIcon, ColorGrid, ColorGridOption, type ColorGridOptionProps, type ColorGridProps, ColorList, ColorListGroup, type ColorListGroupProps, ColorListOption, type ColorListOptionProps, type ColorListProps, ColorPicker, ColorPickerPopoverContent, type ColorPickerPopoverContentProps, type ColorPickerProps, ColorPickerSection, type ColorPickerSectionProps, ColorPickerTrigger, type ColorPickerTriggerProps, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Combobox, ComboboxOption, type ComboboxOptionProps, type ComboboxProps, ContextMenu, type ContextMenuProps, ContrastControls, CustomizableThemeWrapper, type CustomizableThemeWrapperProps, DataCard, DataCardHoverArrow, type DataCardProps, DataCardTrend, type DataCardTrendProps, DataCards, type DataCardsProps, DataList, DataListItem, DataListItemLabel, DataListItemValue, type DataListProps, Divider, EditableHeading, type EditableHeadingProps, EditableText, EditableTextCancelButton, EditableTextContext, EditableTextDisplay, EditableTextInput, EditableTextLabel, type EditableTextProps, EditableTextRoot, type EditableTextRootProps, EditableTextSubmitButton, EditableTextTrigger, Ellipsis, type EllipsisProps, FilterMenu, FilterMenuItem, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Grid, type GridProps, Heading, type HeadingProps, HexColorInput, type HexColorInputProps, HueSlider, Icon, IconButton, type IconButtonProps, type IconNameType, Image, type ImageProps, Input, InputClickToCopy, type InputClickToCopyProps, InputPassword, type InputPasswordProps, type InputProps, type KeyboardKeys, KeyboardShortcut, Label, type LabelProps, Link, type LinkProps, List, ListItem, type ListItemProps, type ListProps, Mark, type MarkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, ModalCallout, ModalCallouts, type ModalProps, Popover, type PopoverProps, ProgressBar, type ProgressBarProps, Radio, RadioCard, RadioCardImage, type RadioCardImageProps, type RadioCardProps, RadioGroup, RadioMenuItem, type RadioProps, SaturationAndValuePicker, ScreenReaderOnly, ScrollArea, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Slider, type SliderProps, SplitButton, type SplitButtonProps, Stack, SubMenu, Switch, type SwitchProps, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableFoot, type TableFootProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tabs, TabsContent, TabsList, TabsTrigger, Tag, type TagProps, Text, type TextProps, Thumbnail, ThumbnailBadge, type ThumbnailBadgeProps, ThumbnailCollage, type ThumbnailCollageProps, type ThumbnailProps, Tooltip, type TooltipProps, UIProvider, type UseActiveMqReturnType, type UseIsHoveredReturnType, type UseMqReturnType, type UseToastProps, ValueNameOrHexCode, ValueSwatch, WistiaLogo, calculateContrast, colorSchemeOptions, copyToClipboard, dateTime, iconSizeMap, mergeRefs, mq, useActiveMq, useAriaLive, useBoolean, useClipboard, useElementObserver, useFilePicker, useFocusTrap, useForceUpdate, useFormState, useImperativeFilePicker, useIsHovered, useKey, useLocalStorage, useLockBodyScroll, useMq, useOnClickOutside, usePreviousValue, useToast, useWindowSize };
|
package/dist/index.d.ts
CHANGED
|
@@ -4367,4 +4367,17 @@ declare const SplitButton: {
|
|
|
4367
4367
|
displayName: string;
|
|
4368
4368
|
};
|
|
4369
4369
|
|
|
4370
|
-
|
|
4370
|
+
type CustomizableTokens = '--wui-color-backdrop' | '--wui-color-bg-fill-active' | '--wui-color-bg-fill-hover' | '--wui-color-bg-fill-white ' | '--wui-color-bg-fill' | '--wui-color-bg-surface-active' | '--wui-color-bg-surface-disabled' | '--wui-color-bg-surface-hover' | '--wui-color-bg-surface-secondary-active' | '--wui-color-bg-surface-secondary-hover' | '--wui-color-bg-surface-secondary' | '--wui-color-bg-surface-selected-active' | '--wui-color-bg-surface-selected-hover' | '--wui-color-bg-surface-selected' | '--wui-color-bg-surface-tertiary' | '--wui-color-bg-surface' | '--wui-color-bg-tooltip' | '--wui-color-border-active-selected' | '--wui-color-border-active' | '--wui-color-border-disabled' | '--wui-color-border-hover-selected' | '--wui-color-border-hover' | '--wui-color-border-secondary-active' | '--wui-color-border-secondary-hover' | '--wui-color-border-secondary' | '--wui-color-border-selected' | '--wui-color-border' | '--wui-color-drop-shadow' | '--wui-color-focus-color' | '--wui-color-focus-ring-disabled' | '--wui-color-focus-ring' | '--wui-color-icon-disabled' | '--wui-color-icon-on-fill' | '--wui-color-icon-selected' | '--wui-color-icon' | '--wui-color-invalid-indicator' | '--wui-color-notification-pill-color' | '--wui-color-segmented-control-checked-background' | '--wui-color-text-button' | '--wui-color-text-disabled' | '--wui-color-text-link' | '--wui-color-text-on-fill-white-selected' | '--wui-color-text-on-fill' | '--wui-color-text-secondary' | '--wui-color-text-selected' | '--wui-color-text';
|
|
4371
|
+
type CustomizableThemeWrapperProps = ComponentPropsWithoutRef<'div'> & {
|
|
4372
|
+
children: ReactNode;
|
|
4373
|
+
overrides: Partial<Record<CustomizableTokens, number | string>>;
|
|
4374
|
+
};
|
|
4375
|
+
/**
|
|
4376
|
+
* Component description goes here
|
|
4377
|
+
*/
|
|
4378
|
+
declare const CustomizableThemeWrapper: {
|
|
4379
|
+
({ children, overrides, ...props }: CustomizableThemeWrapperProps): JSX.Element;
|
|
4380
|
+
displayName: string;
|
|
4381
|
+
};
|
|
4382
|
+
|
|
4383
|
+
export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Banner, BannerImage, type BannerProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Center, type CenterProps, Checkbox, CheckboxGroup, CheckboxMenuItem, ClickRegion, type ClickRegionProps, Collapsible, CollapsibleContent, type CollapsibleProps, CollapsibleTrigger, CollapsibleTriggerIcon, ColorGrid, ColorGridOption, type ColorGridOptionProps, type ColorGridProps, ColorList, ColorListGroup, type ColorListGroupProps, ColorListOption, type ColorListOptionProps, type ColorListProps, ColorPicker, ColorPickerPopoverContent, type ColorPickerPopoverContentProps, type ColorPickerProps, ColorPickerSection, type ColorPickerSectionProps, ColorPickerTrigger, type ColorPickerTriggerProps, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Combobox, ComboboxOption, type ComboboxOptionProps, type ComboboxProps, ContextMenu, type ContextMenuProps, ContrastControls, CustomizableThemeWrapper, type CustomizableThemeWrapperProps, DataCard, DataCardHoverArrow, type DataCardProps, DataCardTrend, type DataCardTrendProps, DataCards, type DataCardsProps, DataList, DataListItem, DataListItemLabel, DataListItemValue, type DataListProps, Divider, EditableHeading, type EditableHeadingProps, EditableText, EditableTextCancelButton, EditableTextContext, EditableTextDisplay, EditableTextInput, EditableTextLabel, type EditableTextProps, EditableTextRoot, type EditableTextRootProps, EditableTextSubmitButton, EditableTextTrigger, Ellipsis, type EllipsisProps, FilterMenu, FilterMenuItem, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Grid, type GridProps, Heading, type HeadingProps, HexColorInput, type HexColorInputProps, HueSlider, Icon, IconButton, type IconButtonProps, type IconNameType, Image, type ImageProps, Input, InputClickToCopy, type InputClickToCopyProps, InputPassword, type InputPasswordProps, type InputProps, type KeyboardKeys, KeyboardShortcut, Label, type LabelProps, Link, type LinkProps, List, ListItem, type ListItemProps, type ListProps, Mark, type MarkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, ModalCallout, ModalCallouts, type ModalProps, Popover, type PopoverProps, ProgressBar, type ProgressBarProps, Radio, RadioCard, RadioCardImage, type RadioCardImageProps, type RadioCardProps, RadioGroup, RadioMenuItem, type RadioProps, SaturationAndValuePicker, ScreenReaderOnly, ScrollArea, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Slider, type SliderProps, SplitButton, type SplitButtonProps, Stack, SubMenu, Switch, type SwitchProps, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableFoot, type TableFootProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tabs, TabsContent, TabsList, TabsTrigger, Tag, type TagProps, Text, type TextProps, Thumbnail, ThumbnailBadge, type ThumbnailBadgeProps, ThumbnailCollage, type ThumbnailCollageProps, type ThumbnailProps, Tooltip, type TooltipProps, UIProvider, type UseActiveMqReturnType, type UseIsHoveredReturnType, type UseMqReturnType, type UseToastProps, ValueNameOrHexCode, ValueSwatch, WistiaLogo, calculateContrast, colorSchemeOptions, copyToClipboard, dateTime, iconSizeMap, mergeRefs, mq, useActiveMq, useAriaLive, useBoolean, useClipboard, useElementObserver, useFilePicker, useFocusTrap, useForceUpdate, useFormState, useImperativeFilePicker, useIsHovered, useKey, useLocalStorage, useLockBodyScroll, useMq, useOnClickOutside, usePreviousValue, useToast, useWindowSize };
|
package/dist/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.18.14-beta.
|
|
3
|
+
* @license @wistia/ui v0.18.14-beta.cbf59204.be0f801
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -12292,7 +12292,9 @@ var Root = styled48(SliderRoot)`
|
|
|
12292
12292
|
var Track = styled48(SliderTrack)`
|
|
12293
12293
|
width: 100%;
|
|
12294
12294
|
`;
|
|
12295
|
-
var Thumb = styled48(SliderThumb)
|
|
12295
|
+
var Thumb = styled48(SliderThumb)`
|
|
12296
|
+
position: relative;
|
|
12297
|
+
`;
|
|
12296
12298
|
var ThumbInner = styled48.div`
|
|
12297
12299
|
cursor: pointer;
|
|
12298
12300
|
display: block;
|
|
@@ -13530,8 +13532,12 @@ MenuItemButton.displayName = "MenuItemButton_UI";
|
|
|
13530
13532
|
// src/components/Menu/MenuItemLabelDescription.tsx
|
|
13531
13533
|
import { styled as styled56 } from "styled-components";
|
|
13532
13534
|
import { jsx as jsx269 } from "react/jsx-runtime";
|
|
13533
|
-
var StyledMenuItemLabel = styled56.span
|
|
13534
|
-
|
|
13535
|
+
var StyledMenuItemLabel = styled56.span`
|
|
13536
|
+
/* avoid no-empty-source rule */
|
|
13537
|
+
`;
|
|
13538
|
+
var StyledMenuItemDescription = styled56(Text)`
|
|
13539
|
+
/* avoid no-empty-source rule */
|
|
13540
|
+
`;
|
|
13535
13541
|
var MenuItemLabel = ({ children }) => {
|
|
13536
13542
|
return /* @__PURE__ */ jsx269(StyledMenuItemLabel, { children });
|
|
13537
13543
|
};
|
|
@@ -14663,7 +14669,8 @@ var StyledEditableTextDisplay = styled66.div`
|
|
|
14663
14669
|
${({ $minLines }) => isNotNil26($minLines) && css35`
|
|
14664
14670
|
min-height: calc(${$minLines}lh + calc(var(--wui-editable-text-padding) * 2));
|
|
14665
14671
|
`}
|
|
14666
|
-
|
|
14672
|
+
word-break: normal;
|
|
14673
|
+
overflow-wrap: anywhere;
|
|
14667
14674
|
|
|
14668
14675
|
&[data-wui-editable-text-display='placeholder'] {
|
|
14669
14676
|
color: var(--wui-color-text-secondary);
|
|
@@ -17616,7 +17623,9 @@ var TableSectionContext = createContext11(null);
|
|
|
17616
17623
|
|
|
17617
17624
|
// src/components/Table/TableBody.tsx
|
|
17618
17625
|
import { jsx as jsx323 } from "react/jsx-runtime";
|
|
17619
|
-
var StyledTableBody = styled98.tbody
|
|
17626
|
+
var StyledTableBody = styled98.tbody`
|
|
17627
|
+
width: 100%;
|
|
17628
|
+
`;
|
|
17620
17629
|
var TableBody = ({ children, ...props }) => {
|
|
17621
17630
|
return /* @__PURE__ */ jsx323(TableSectionContext.Provider, { value: "body", children: /* @__PURE__ */ jsx323(StyledTableBody, { ...props, children }) });
|
|
17622
17631
|
};
|
|
@@ -17653,7 +17662,9 @@ var TableCell = ({ children, ...props }) => {
|
|
|
17653
17662
|
// src/components/Table/TableFoot.tsx
|
|
17654
17663
|
import { styled as styled100 } from "styled-components";
|
|
17655
17664
|
import { jsx as jsx325 } from "react/jsx-runtime";
|
|
17656
|
-
var StyledTableFoot = styled100.tfoot
|
|
17665
|
+
var StyledTableFoot = styled100.tfoot`
|
|
17666
|
+
width: 100%;
|
|
17667
|
+
`;
|
|
17657
17668
|
var TableFoot = ({ children, ...props }) => {
|
|
17658
17669
|
return /* @__PURE__ */ jsx325(TableSectionContext.Provider, { value: "footer", children: /* @__PURE__ */ jsx325(StyledTableFoot, { ...props, children }) });
|
|
17659
17670
|
};
|
|
@@ -17661,7 +17672,9 @@ var TableFoot = ({ children, ...props }) => {
|
|
|
17661
17672
|
// src/components/Table/TableHead.tsx
|
|
17662
17673
|
import { styled as styled101 } from "styled-components";
|
|
17663
17674
|
import { jsx as jsx326 } from "react/jsx-runtime";
|
|
17664
|
-
var StyledThead = styled101.thead
|
|
17675
|
+
var StyledThead = styled101.thead`
|
|
17676
|
+
width: 100%;
|
|
17677
|
+
`;
|
|
17665
17678
|
var TableHead = ({ children, ...props }) => {
|
|
17666
17679
|
return /* @__PURE__ */ jsx326(TableSectionContext.Provider, { value: "head", children: /* @__PURE__ */ jsx326(StyledThead, { ...props, children }) });
|
|
17667
17680
|
};
|
|
@@ -17669,7 +17682,9 @@ var TableHead = ({ children, ...props }) => {
|
|
|
17669
17682
|
// src/components/Table/TableRow.tsx
|
|
17670
17683
|
import { styled as styled102 } from "styled-components";
|
|
17671
17684
|
import { jsx as jsx327 } from "react/jsx-runtime";
|
|
17672
|
-
var StyledTableRow = styled102.tr
|
|
17685
|
+
var StyledTableRow = styled102.tr`
|
|
17686
|
+
width: 100%;
|
|
17687
|
+
`;
|
|
17673
17688
|
var TableRow = ({ children, ...props }) => {
|
|
17674
17689
|
return /* @__PURE__ */ jsx327(StyledTableRow, { ...props, children });
|
|
17675
17690
|
};
|
|
@@ -18675,6 +18690,26 @@ var SplitButton = ({
|
|
|
18675
18690
|
] });
|
|
18676
18691
|
};
|
|
18677
18692
|
SplitButton.displayName = "SplitButton_UI";
|
|
18693
|
+
|
|
18694
|
+
// src/components/CustomizableThemeWrapper/CustomizableThemeWrapper.tsx
|
|
18695
|
+
import { styled as styled112 } from "styled-components";
|
|
18696
|
+
import { jsx as jsx338 } from "react/jsx-runtime";
|
|
18697
|
+
var StyledCustomizableThemeWrapper = styled112.div(
|
|
18698
|
+
(props) => props.$overrides
|
|
18699
|
+
);
|
|
18700
|
+
var CustomizableThemeWrapper = ({
|
|
18701
|
+
children,
|
|
18702
|
+
overrides,
|
|
18703
|
+
...props
|
|
18704
|
+
}) => /* @__PURE__ */ jsx338(
|
|
18705
|
+
StyledCustomizableThemeWrapper,
|
|
18706
|
+
{
|
|
18707
|
+
...props,
|
|
18708
|
+
$overrides: overrides,
|
|
18709
|
+
children
|
|
18710
|
+
}
|
|
18711
|
+
);
|
|
18712
|
+
CustomizableThemeWrapper.displayName = "CustomizableThemeWrapper_UI";
|
|
18678
18713
|
export {
|
|
18679
18714
|
ActionButton,
|
|
18680
18715
|
Avatar,
|
|
@@ -18710,6 +18745,7 @@ export {
|
|
|
18710
18745
|
ComboboxOption,
|
|
18711
18746
|
ContextMenu,
|
|
18712
18747
|
ContrastControls,
|
|
18748
|
+
CustomizableThemeWrapper,
|
|
18713
18749
|
DataCard,
|
|
18714
18750
|
DataCardHoverArrow,
|
|
18715
18751
|
DataCardTrend,
|