@wistia/ui 0.13.2-beta.cdcff85c.693df52 → 0.13.2-beta.daefada2.65ffee6
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 +1234 -2878
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +16 -52
- package/dist/index.d.ts +16 -52
- package/dist/index.mjs +1198 -2845
- package/dist/index.mjs.map +1 -1
- package/package.json +12 -14
package/dist/index.d.mts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as react from 'react';
|
|
3
|
-
import react__default, { ReactNode, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent,
|
|
3
|
+
import react__default, { ReactNode, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, Ref, SyntheticEvent, InputHTMLAttributes, ForwardRefExoticComponent, RefAttributes, HTMLAttributes, PropsWithChildren, ReactElement } from 'react';
|
|
4
4
|
import { UseFilePickerConfig, FilePickerReturnTypes, ExtractContentTypeFromConfig, useImperativeFilePickerConfig, ImperativeFilePickerReturnTypes } from 'use-file-picker/types';
|
|
5
5
|
export * from 'use-file-picker/types';
|
|
6
6
|
import * as react_router from 'react-router';
|
|
@@ -1362,12 +1362,17 @@ type IconProps = ComponentPropsWithoutRef<'svg'> & {
|
|
|
1362
1362
|
* Sets the [color scheme](../?path=/docs/docs-color-schemes--docs)
|
|
1363
1363
|
*/
|
|
1364
1364
|
colorScheme?: ColorSchemeTypes;
|
|
1365
|
+
/**
|
|
1366
|
+
* Determines if the icon should use inline styles when used with [Text]() and [Heading]() components
|
|
1367
|
+
*/
|
|
1368
|
+
useInlineStyles?: boolean;
|
|
1365
1369
|
/**
|
|
1366
1370
|
* Is Icon on a filled background?
|
|
1367
1371
|
*/
|
|
1368
1372
|
invertColor?: boolean;
|
|
1369
1373
|
/**
|
|
1370
1374
|
* The size of the icon to display
|
|
1375
|
+
*
|
|
1371
1376
|
*/
|
|
1372
1377
|
size?: ResponsiveObject<keyof typeof iconSizeMap> | keyof typeof iconSizeMap;
|
|
1373
1378
|
/**
|
|
@@ -1380,11 +1385,17 @@ type IconProps = ComponentPropsWithoutRef<'svg'> & {
|
|
|
1380
1385
|
type: IconNameType;
|
|
1381
1386
|
};
|
|
1382
1387
|
/**
|
|
1383
|
-
* A component that renders any of our available icons.
|
|
1384
|
-
*
|
|
1388
|
+
* A component that renders any of our available icons.
|
|
1389
|
+
*
|
|
1390
|
+
* For inline usage with text, wrap the Icon within a Text component
|
|
1391
|
+
* and set inline=true. The icon will automatically align with the text
|
|
1392
|
+
* using the typography-specific positioning.
|
|
1393
|
+
*
|
|
1394
|
+
* Note that icons should not be used directly for interactivity.
|
|
1395
|
+
* If you need an interactive element, use IconButton.
|
|
1385
1396
|
*/
|
|
1386
1397
|
declare const Icon: {
|
|
1387
|
-
({ invertColor, colorScheme, size, style, type, ...props }: IconProps): JSX.Element;
|
|
1398
|
+
({ useInlineStyles, invertColor, colorScheme, size, style, type, ...props }: IconProps): JSX.Element;
|
|
1388
1399
|
displayName: string;
|
|
1389
1400
|
};
|
|
1390
1401
|
|
|
@@ -1408,53 +1419,6 @@ type CollapsibleContentProps = {
|
|
|
1408
1419
|
};
|
|
1409
1420
|
declare const CollapsibleContent: ({ clamp, children }: CollapsibleContentProps) => react_jsx_runtime.JSX.Element;
|
|
1410
1421
|
|
|
1411
|
-
type ColorItemProps = {
|
|
1412
|
-
value: string;
|
|
1413
|
-
name?: string;
|
|
1414
|
-
};
|
|
1415
|
-
declare const ColorItem: ({ value, name }: ColorItemProps) => JSX.Element;
|
|
1416
|
-
|
|
1417
|
-
type ColorListProps = PropsWithChildren;
|
|
1418
|
-
declare const ColorList: ({ children }: ColorListProps) => JSX.Element;
|
|
1419
|
-
|
|
1420
|
-
type ColorListGroupProps = PropsWithChildren<{
|
|
1421
|
-
label: string;
|
|
1422
|
-
}>;
|
|
1423
|
-
declare const ColorListGroup: ({ label, children }: ColorListGroupProps) => JSX.Element;
|
|
1424
|
-
|
|
1425
|
-
type ColorPickerProps = PropsWithChildren<{
|
|
1426
|
-
value: string;
|
|
1427
|
-
onValueChange: (value: string) => void;
|
|
1428
|
-
shouldEnforceMinContrast?: boolean;
|
|
1429
|
-
minimumContrastRatio?: number;
|
|
1430
|
-
colorForComparison?: string;
|
|
1431
|
-
}>;
|
|
1432
|
-
declare const ColorPicker: ({ value, onValueChange, children, shouldEnforceMinContrast, minimumContrastRatio, colorForComparison, }: ColorPickerProps) => JSX.Element;
|
|
1433
|
-
|
|
1434
|
-
type ColorPickerPopoverContentProps = PropsWithChildren;
|
|
1435
|
-
declare const ColorPickerPopoverContent: ({ children, }: ColorPickerPopoverContentProps) => JSX.Element;
|
|
1436
|
-
|
|
1437
|
-
declare const ColorPickerSection: ({ children }: PropsWithChildren) => JSX.Element;
|
|
1438
|
-
|
|
1439
|
-
declare const ColorPickerTrigger: react.ForwardRefExoticComponent<{
|
|
1440
|
-
children?: react.ReactNode | undefined;
|
|
1441
|
-
} & react.RefAttributes<HTMLButtonElement>>;
|
|
1442
|
-
|
|
1443
|
-
declare const ContrastControls: () => JSX.Element;
|
|
1444
|
-
|
|
1445
|
-
declare const HexColorInput: () => JSX.Element;
|
|
1446
|
-
|
|
1447
|
-
declare const HueSlider: () => JSX.Element;
|
|
1448
|
-
|
|
1449
|
-
type SaturationAndValuePickerProps = {
|
|
1450
|
-
dataTestId?: string;
|
|
1451
|
-
};
|
|
1452
|
-
declare const SaturationAndValuePicker: ({ dataTestId, }: SaturationAndValuePickerProps) => JSX.Element;
|
|
1453
|
-
|
|
1454
|
-
declare const ValueNameOrHexCode: () => JSX.Element;
|
|
1455
|
-
|
|
1456
|
-
declare const ValueSwatch: () => JSX.Element;
|
|
1457
|
-
|
|
1458
1422
|
type ComboboxOptionProps = {
|
|
1459
1423
|
value: string;
|
|
1460
1424
|
children: ReactNode;
|
|
@@ -3790,4 +3754,4 @@ type ContextMenuProps = {
|
|
|
3790
3754
|
*/
|
|
3791
3755
|
declare const ContextMenu: ({ position, triggerRef, children, onRequestClose, }: ContextMenuProps) => react_jsx_runtime.JSX.Element | null;
|
|
3792
3756
|
|
|
3793
|
-
export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Banner, 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,
|
|
3757
|
+
export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Banner, 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, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Combobox, ComboboxOption, type ComboboxOptionProps, type ComboboxProps, ContextMenu, type ContextMenuProps, DataCard, type DataCardProps, DataCardTrend, type DataCardTrendProps, DataCards, type DataCardsProps, Divider, EditableHeading, type EditableHeadingProps, Ellipsis, type EllipsisProps, FilterMenu, FilterMenuItem, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Grid, type GridProps, Heading, type HeadingProps, 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, type ListProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Popover, type PopoverProps, ProgressBar, type ProgressBarProps, Radio, RadioCard, RadioCardImage, type RadioCardImageProps, type RadioCardProps, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Slider, type SliderProps, 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 UseToastProps, WistiaLogo, 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
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as react from 'react';
|
|
3
|
-
import react__default, { ReactNode, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent,
|
|
3
|
+
import react__default, { ReactNode, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, Ref, SyntheticEvent, InputHTMLAttributes, ForwardRefExoticComponent, RefAttributes, HTMLAttributes, PropsWithChildren, ReactElement } from 'react';
|
|
4
4
|
import { UseFilePickerConfig, FilePickerReturnTypes, ExtractContentTypeFromConfig, useImperativeFilePickerConfig, ImperativeFilePickerReturnTypes } from 'use-file-picker/types';
|
|
5
5
|
export * from 'use-file-picker/types';
|
|
6
6
|
import * as react_router from 'react-router';
|
|
@@ -1362,12 +1362,17 @@ type IconProps = ComponentPropsWithoutRef<'svg'> & {
|
|
|
1362
1362
|
* Sets the [color scheme](../?path=/docs/docs-color-schemes--docs)
|
|
1363
1363
|
*/
|
|
1364
1364
|
colorScheme?: ColorSchemeTypes;
|
|
1365
|
+
/**
|
|
1366
|
+
* Determines if the icon should use inline styles when used with [Text]() and [Heading]() components
|
|
1367
|
+
*/
|
|
1368
|
+
useInlineStyles?: boolean;
|
|
1365
1369
|
/**
|
|
1366
1370
|
* Is Icon on a filled background?
|
|
1367
1371
|
*/
|
|
1368
1372
|
invertColor?: boolean;
|
|
1369
1373
|
/**
|
|
1370
1374
|
* The size of the icon to display
|
|
1375
|
+
*
|
|
1371
1376
|
*/
|
|
1372
1377
|
size?: ResponsiveObject<keyof typeof iconSizeMap> | keyof typeof iconSizeMap;
|
|
1373
1378
|
/**
|
|
@@ -1380,11 +1385,17 @@ type IconProps = ComponentPropsWithoutRef<'svg'> & {
|
|
|
1380
1385
|
type: IconNameType;
|
|
1381
1386
|
};
|
|
1382
1387
|
/**
|
|
1383
|
-
* A component that renders any of our available icons.
|
|
1384
|
-
*
|
|
1388
|
+
* A component that renders any of our available icons.
|
|
1389
|
+
*
|
|
1390
|
+
* For inline usage with text, wrap the Icon within a Text component
|
|
1391
|
+
* and set inline=true. The icon will automatically align with the text
|
|
1392
|
+
* using the typography-specific positioning.
|
|
1393
|
+
*
|
|
1394
|
+
* Note that icons should not be used directly for interactivity.
|
|
1395
|
+
* If you need an interactive element, use IconButton.
|
|
1385
1396
|
*/
|
|
1386
1397
|
declare const Icon: {
|
|
1387
|
-
({ invertColor, colorScheme, size, style, type, ...props }: IconProps): JSX.Element;
|
|
1398
|
+
({ useInlineStyles, invertColor, colorScheme, size, style, type, ...props }: IconProps): JSX.Element;
|
|
1388
1399
|
displayName: string;
|
|
1389
1400
|
};
|
|
1390
1401
|
|
|
@@ -1408,53 +1419,6 @@ type CollapsibleContentProps = {
|
|
|
1408
1419
|
};
|
|
1409
1420
|
declare const CollapsibleContent: ({ clamp, children }: CollapsibleContentProps) => react_jsx_runtime.JSX.Element;
|
|
1410
1421
|
|
|
1411
|
-
type ColorItemProps = {
|
|
1412
|
-
value: string;
|
|
1413
|
-
name?: string;
|
|
1414
|
-
};
|
|
1415
|
-
declare const ColorItem: ({ value, name }: ColorItemProps) => JSX.Element;
|
|
1416
|
-
|
|
1417
|
-
type ColorListProps = PropsWithChildren;
|
|
1418
|
-
declare const ColorList: ({ children }: ColorListProps) => JSX.Element;
|
|
1419
|
-
|
|
1420
|
-
type ColorListGroupProps = PropsWithChildren<{
|
|
1421
|
-
label: string;
|
|
1422
|
-
}>;
|
|
1423
|
-
declare const ColorListGroup: ({ label, children }: ColorListGroupProps) => JSX.Element;
|
|
1424
|
-
|
|
1425
|
-
type ColorPickerProps = PropsWithChildren<{
|
|
1426
|
-
value: string;
|
|
1427
|
-
onValueChange: (value: string) => void;
|
|
1428
|
-
shouldEnforceMinContrast?: boolean;
|
|
1429
|
-
minimumContrastRatio?: number;
|
|
1430
|
-
colorForComparison?: string;
|
|
1431
|
-
}>;
|
|
1432
|
-
declare const ColorPicker: ({ value, onValueChange, children, shouldEnforceMinContrast, minimumContrastRatio, colorForComparison, }: ColorPickerProps) => JSX.Element;
|
|
1433
|
-
|
|
1434
|
-
type ColorPickerPopoverContentProps = PropsWithChildren;
|
|
1435
|
-
declare const ColorPickerPopoverContent: ({ children, }: ColorPickerPopoverContentProps) => JSX.Element;
|
|
1436
|
-
|
|
1437
|
-
declare const ColorPickerSection: ({ children }: PropsWithChildren) => JSX.Element;
|
|
1438
|
-
|
|
1439
|
-
declare const ColorPickerTrigger: react.ForwardRefExoticComponent<{
|
|
1440
|
-
children?: react.ReactNode | undefined;
|
|
1441
|
-
} & react.RefAttributes<HTMLButtonElement>>;
|
|
1442
|
-
|
|
1443
|
-
declare const ContrastControls: () => JSX.Element;
|
|
1444
|
-
|
|
1445
|
-
declare const HexColorInput: () => JSX.Element;
|
|
1446
|
-
|
|
1447
|
-
declare const HueSlider: () => JSX.Element;
|
|
1448
|
-
|
|
1449
|
-
type SaturationAndValuePickerProps = {
|
|
1450
|
-
dataTestId?: string;
|
|
1451
|
-
};
|
|
1452
|
-
declare const SaturationAndValuePicker: ({ dataTestId, }: SaturationAndValuePickerProps) => JSX.Element;
|
|
1453
|
-
|
|
1454
|
-
declare const ValueNameOrHexCode: () => JSX.Element;
|
|
1455
|
-
|
|
1456
|
-
declare const ValueSwatch: () => JSX.Element;
|
|
1457
|
-
|
|
1458
1422
|
type ComboboxOptionProps = {
|
|
1459
1423
|
value: string;
|
|
1460
1424
|
children: ReactNode;
|
|
@@ -3790,4 +3754,4 @@ type ContextMenuProps = {
|
|
|
3790
3754
|
*/
|
|
3791
3755
|
declare const ContextMenu: ({ position, triggerRef, children, onRequestClose, }: ContextMenuProps) => react_jsx_runtime.JSX.Element | null;
|
|
3792
3756
|
|
|
3793
|
-
export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Banner, 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,
|
|
3757
|
+
export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Banner, 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, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Combobox, ComboboxOption, type ComboboxOptionProps, type ComboboxProps, ContextMenu, type ContextMenuProps, DataCard, type DataCardProps, DataCardTrend, type DataCardTrendProps, DataCards, type DataCardsProps, Divider, EditableHeading, type EditableHeadingProps, Ellipsis, type EllipsisProps, FilterMenu, FilterMenuItem, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Grid, type GridProps, Heading, type HeadingProps, 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, type ListProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Popover, type PopoverProps, ProgressBar, type ProgressBarProps, Radio, RadioCard, RadioCardImage, type RadioCardImageProps, type RadioCardProps, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Slider, type SliderProps, 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 UseToastProps, WistiaLogo, 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 };
|