@wistia/ui 0.15.14-beta.50e89a95.396fb5b → 0.15.14-beta.701deb7c.dd1faf8
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 +68 -77
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +2 -10
- package/dist/index.d.ts +2 -10
- package/dist/index.mjs +67 -76
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -589,7 +589,7 @@ type BadgeProps = ComponentPropsWithoutRef<'div'> & {
|
|
|
589
589
|
/**
|
|
590
590
|
* The text to display in the `Badge`
|
|
591
591
|
*/
|
|
592
|
-
label
|
|
592
|
+
label?: ReactNode;
|
|
593
593
|
/**
|
|
594
594
|
* The variant of the `Badge`
|
|
595
595
|
*/
|
|
@@ -610,7 +610,7 @@ declare const Badge: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProp
|
|
|
610
610
|
/**
|
|
611
611
|
* The text to display in the `Badge`
|
|
612
612
|
*/
|
|
613
|
-
label
|
|
613
|
+
label?: ReactNode;
|
|
614
614
|
/**
|
|
615
615
|
* The variant of the `Badge`
|
|
616
616
|
*/
|
|
@@ -3083,10 +3083,6 @@ type ModalProps = ComponentPropsWithoutRef<'div'> & {
|
|
|
3083
3083
|
* Determines if the title is visible
|
|
3084
3084
|
*/
|
|
3085
3085
|
hideTitle?: boolean;
|
|
3086
|
-
/**
|
|
3087
|
-
* The maximum width the modal can be
|
|
3088
|
-
*/
|
|
3089
|
-
maxWidth?: string;
|
|
3090
3086
|
/**
|
|
3091
3087
|
* When the Modal is dismissed, this function will be called. You'll typically want to set the
|
|
3092
3088
|
* state of `isOpen` to false here
|
|
@@ -3135,10 +3131,6 @@ declare const Modal: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProp
|
|
|
3135
3131
|
* Determines if the title is visible
|
|
3136
3132
|
*/
|
|
3137
3133
|
hideTitle?: boolean;
|
|
3138
|
-
/**
|
|
3139
|
-
* The maximum width the modal can be
|
|
3140
|
-
*/
|
|
3141
|
-
maxWidth?: string;
|
|
3142
3134
|
/**
|
|
3143
3135
|
* When the Modal is dismissed, this function will be called. You'll typically want to set the
|
|
3144
3136
|
* state of `isOpen` to false here
|
package/dist/index.d.ts
CHANGED
|
@@ -589,7 +589,7 @@ type BadgeProps = ComponentPropsWithoutRef<'div'> & {
|
|
|
589
589
|
/**
|
|
590
590
|
* The text to display in the `Badge`
|
|
591
591
|
*/
|
|
592
|
-
label
|
|
592
|
+
label?: ReactNode;
|
|
593
593
|
/**
|
|
594
594
|
* The variant of the `Badge`
|
|
595
595
|
*/
|
|
@@ -610,7 +610,7 @@ declare const Badge: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProp
|
|
|
610
610
|
/**
|
|
611
611
|
* The text to display in the `Badge`
|
|
612
612
|
*/
|
|
613
|
-
label
|
|
613
|
+
label?: ReactNode;
|
|
614
614
|
/**
|
|
615
615
|
* The variant of the `Badge`
|
|
616
616
|
*/
|
|
@@ -3083,10 +3083,6 @@ type ModalProps = ComponentPropsWithoutRef<'div'> & {
|
|
|
3083
3083
|
* Determines if the title is visible
|
|
3084
3084
|
*/
|
|
3085
3085
|
hideTitle?: boolean;
|
|
3086
|
-
/**
|
|
3087
|
-
* The maximum width the modal can be
|
|
3088
|
-
*/
|
|
3089
|
-
maxWidth?: string;
|
|
3090
3086
|
/**
|
|
3091
3087
|
* When the Modal is dismissed, this function will be called. You'll typically want to set the
|
|
3092
3088
|
* state of `isOpen` to false here
|
|
@@ -3135,10 +3131,6 @@ declare const Modal: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProp
|
|
|
3135
3131
|
* Determines if the title is visible
|
|
3136
3132
|
*/
|
|
3137
3133
|
hideTitle?: boolean;
|
|
3138
|
-
/**
|
|
3139
|
-
* The maximum width the modal can be
|
|
3140
|
-
*/
|
|
3141
|
-
maxWidth?: string;
|
|
3142
3134
|
/**
|
|
3143
3135
|
* When the Modal is dismissed, this function will be called. You'll typically want to set the
|
|
3144
3136
|
* state of `isOpen` to false here
|
package/dist/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.15.14-beta.
|
|
3
|
+
* @license @wistia/ui v0.15.14-beta.701deb7c.dd1faf8
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -8255,7 +8255,7 @@ Avatar.displayName = "Avatar_UI";
|
|
|
8255
8255
|
// src/components/Badge/Badge.tsx
|
|
8256
8256
|
import { forwardRef as forwardRef4 } from "react";
|
|
8257
8257
|
import styled10 from "styled-components";
|
|
8258
|
-
import { isNotNil as isNotNil9 } from "@wistia/type-guards";
|
|
8258
|
+
import { isNonEmptyString as isNonEmptyString2, isNotNil as isNotNil9 } from "@wistia/type-guards";
|
|
8259
8259
|
import { jsx as jsx205, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
8260
8260
|
var StyledBadge = styled10.div`
|
|
8261
8261
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
@@ -8296,7 +8296,7 @@ var Badge = forwardRef4(
|
|
|
8296
8296
|
$variant: variant,
|
|
8297
8297
|
children: [
|
|
8298
8298
|
hasIcon ? icon : null,
|
|
8299
|
-
/* @__PURE__ */ jsx205("span", { children: label })
|
|
8299
|
+
isNonEmptyString2(label) && /* @__PURE__ */ jsx205("span", { children: label })
|
|
8300
8300
|
]
|
|
8301
8301
|
}
|
|
8302
8302
|
);
|
|
@@ -9361,7 +9361,7 @@ var Center = forwardRef9(
|
|
|
9361
9361
|
Center.displayName = "Center_UI";
|
|
9362
9362
|
|
|
9363
9363
|
// src/components/Checkbox/Checkbox.tsx
|
|
9364
|
-
import { isNonEmptyString as
|
|
9364
|
+
import { isNonEmptyString as isNonEmptyString4, isNotUndefined as isNotUndefined7 } from "@wistia/type-guards";
|
|
9365
9365
|
import { forwardRef as forwardRef12, useId as useId2 } from "react";
|
|
9366
9366
|
import styled27, { css as css26 } from "styled-components";
|
|
9367
9367
|
|
|
@@ -9491,7 +9491,7 @@ import { isArray } from "@wistia/type-guards";
|
|
|
9491
9491
|
// src/components/FormGroup/FormGroup.tsx
|
|
9492
9492
|
import styled25 from "styled-components";
|
|
9493
9493
|
import { useRef as useRef7 } from "react";
|
|
9494
|
-
import { isNonEmptyString as
|
|
9494
|
+
import { isNonEmptyString as isNonEmptyString3, isNotNil as isNotNil16 } from "@wistia/type-guards";
|
|
9495
9495
|
|
|
9496
9496
|
// src/components/Stack/Stack.tsx
|
|
9497
9497
|
import { forwardRef as forwardRef10 } from "react";
|
|
@@ -9546,8 +9546,8 @@ var FormGroup = ({
|
|
|
9546
9546
|
...props
|
|
9547
9547
|
}) => {
|
|
9548
9548
|
const ref = useRef7(null);
|
|
9549
|
-
const hasLabel = isNotNil16(label) &&
|
|
9550
|
-
const hasDescription = isNotNil16(description) &&
|
|
9549
|
+
const hasLabel = isNotNil16(label) && isNonEmptyString3(label);
|
|
9550
|
+
const hasDescription = isNotNil16(description) && isNonEmptyString3(description);
|
|
9551
9551
|
return /* @__PURE__ */ jsxs17(
|
|
9552
9552
|
Stack,
|
|
9553
9553
|
{
|
|
@@ -9849,7 +9849,7 @@ var Checkbox = forwardRef12(
|
|
|
9849
9849
|
...props
|
|
9850
9850
|
}, ref) => {
|
|
9851
9851
|
const generatedId = useId2();
|
|
9852
|
-
const computedId =
|
|
9852
|
+
const computedId = isNonEmptyString4(id) ? id : `wistia-ui-checkbox-${generatedId}`;
|
|
9853
9853
|
const checkboxGroupContext = useCheckboxGroup();
|
|
9854
9854
|
const contextName = checkboxGroupContext?.name;
|
|
9855
9855
|
const contextOnChange = checkboxGroupContext?.onChange;
|
|
@@ -11318,7 +11318,7 @@ import { useCallback as useCallback12 } from "react";
|
|
|
11318
11318
|
// src/components/Switch/Switch.tsx
|
|
11319
11319
|
import { forwardRef as forwardRef14, useId as useId3 } from "react";
|
|
11320
11320
|
import styled43, { css as css28 } from "styled-components";
|
|
11321
|
-
import { isNonEmptyString as
|
|
11321
|
+
import { isNonEmptyString as isNonEmptyString5 } from "@wistia/type-guards";
|
|
11322
11322
|
import { jsx as jsx245, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
11323
11323
|
var switchHeightMap = {
|
|
11324
11324
|
sm: 16,
|
|
@@ -11410,7 +11410,7 @@ var Switch = forwardRef14(
|
|
|
11410
11410
|
...props
|
|
11411
11411
|
}, ref) => {
|
|
11412
11412
|
const generatedId = useId3();
|
|
11413
|
-
const computedId =
|
|
11413
|
+
const computedId = isNonEmptyString5(id) ? id : `wistia-ui-switch-${generatedId}`;
|
|
11414
11414
|
return /* @__PURE__ */ jsxs28(
|
|
11415
11415
|
StyledSwitchWrapper,
|
|
11416
11416
|
{
|
|
@@ -12433,7 +12433,7 @@ import { isArray as isArray2, isString as isString3 } from "@wistia/type-guards"
|
|
|
12433
12433
|
// src/components/Tag/Tag.tsx
|
|
12434
12434
|
import { forwardRef as forwardRef16 } from "react";
|
|
12435
12435
|
import styled49 from "styled-components";
|
|
12436
|
-
import { isNil as isNil15, isNotNil as isNotNil19, isNonEmptyString as
|
|
12436
|
+
import { isNil as isNil15, isNotNil as isNotNil19, isNonEmptyString as isNonEmptyString6 } from "@wistia/type-guards";
|
|
12437
12437
|
import { Fragment as Fragment7, jsx as jsx255, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
12438
12438
|
var TagLabel = styled49.a`
|
|
12439
12439
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
@@ -12552,7 +12552,7 @@ var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
|
|
|
12552
12552
|
var Tag = forwardRef16(
|
|
12553
12553
|
({ onClickRemove, colorScheme = "inherit", href, icon, label, onClickRemoveLabel, ...props }, ref) => {
|
|
12554
12554
|
const hasIcon = isNotNil19(icon);
|
|
12555
|
-
const labelProps = isNotNil19(href) &&
|
|
12555
|
+
const labelProps = isNotNil19(href) && isNonEmptyString6(href) ? { href, as: "a" } : { as: "span" };
|
|
12556
12556
|
return /* @__PURE__ */ jsxs33(
|
|
12557
12557
|
StyledTag,
|
|
12558
12558
|
{
|
|
@@ -14175,7 +14175,7 @@ import { isNotNil as isNotNil26 } from "@wistia/type-guards";
|
|
|
14175
14175
|
|
|
14176
14176
|
// src/components/EditableText/EditableTextRoot.tsx
|
|
14177
14177
|
import { createContext as createContext7, useMemo as useMemo13, useState as useState19, useCallback as useCallback16, useId as useId4 } from "react";
|
|
14178
|
-
import { isNonEmptyString as
|
|
14178
|
+
import { isNonEmptyString as isNonEmptyString7 } from "@wistia/type-guards";
|
|
14179
14179
|
import styled63 from "styled-components";
|
|
14180
14180
|
import { jsx as jsx277 } from "react/jsx-runtime";
|
|
14181
14181
|
var StyledEditableTextRoot = styled63.div`
|
|
@@ -14210,7 +14210,7 @@ var EditableTextRoot = ({
|
|
|
14210
14210
|
const [isEditing, setIsEditing] = useState19(false);
|
|
14211
14211
|
const value = isControlled ? controlledValue : internalValue;
|
|
14212
14212
|
const generatedId = useId4();
|
|
14213
|
-
const computedId =
|
|
14213
|
+
const computedId = isNonEmptyString7(id) ? id : `wistia-ui-editable-text-${generatedId}`;
|
|
14214
14214
|
const handleSetIsEditing = useCallback16(
|
|
14215
14215
|
(editing) => {
|
|
14216
14216
|
if (editing && !isEditing) {
|
|
@@ -15374,7 +15374,7 @@ Mark.displayName = "Mark_UI";
|
|
|
15374
15374
|
import { forwardRef as forwardRef26 } from "react";
|
|
15375
15375
|
import styled78 from "styled-components";
|
|
15376
15376
|
import { Root as DialogRoot, Portal as DialogPortal } from "@radix-ui/react-dialog";
|
|
15377
|
-
import { isNotNil as
|
|
15377
|
+
import { isNotNil as isNotNil32 } from "@wistia/type-guards";
|
|
15378
15378
|
|
|
15379
15379
|
// src/components/Modal/ModalHeader.tsx
|
|
15380
15380
|
import styled75 from "styled-components";
|
|
@@ -15450,7 +15450,6 @@ var ModalHeader = ({
|
|
|
15450
15450
|
import { forwardRef as forwardRef25 } from "react";
|
|
15451
15451
|
import styled76, { css as css38, keyframes as keyframes4 } from "styled-components";
|
|
15452
15452
|
import { Content as DialogContent } from "@radix-ui/react-dialog";
|
|
15453
|
-
import { isNotNil as isNotNil32 } from "@wistia/type-guards";
|
|
15454
15453
|
|
|
15455
15454
|
// src/private/hooks/useFocusRestore/useFocusRestore.ts
|
|
15456
15455
|
import { useRef as useRef20, useEffect as useEffect19 } from "react";
|
|
@@ -15588,14 +15587,9 @@ var StyledModalContent = styled76(DialogContent)`
|
|
|
15588
15587
|
position: fixed;
|
|
15589
15588
|
top: unset;
|
|
15590
15589
|
left: unset;
|
|
15591
|
-
width: ${({ $width
|
|
15592
|
-
if (isNotNil32($maxWidth)) {
|
|
15593
|
-
return "auto";
|
|
15594
|
-
}
|
|
15595
|
-
return $width ?? DEFAULT_MODAL_WIDTH;
|
|
15596
|
-
}};
|
|
15590
|
+
width: ${({ $width }) => $width ?? DEFAULT_MODAL_WIDTH};
|
|
15597
15591
|
min-width: ${({ $width }) => $width ?? DEFAULT_MODAL_WIDTH};
|
|
15598
|
-
max-width:
|
|
15592
|
+
max-width: var(--wui-modal-max-width);
|
|
15599
15593
|
border-radius: var(--wui-border-radius-03);
|
|
15600
15594
|
animation-duration: var(--wui-motion-duration-03);
|
|
15601
15595
|
animation-timing-function: var(--wui-motion-ease-out);
|
|
@@ -15604,13 +15598,12 @@ var StyledModalContent = styled76(DialogContent)`
|
|
|
15604
15598
|
}
|
|
15605
15599
|
`;
|
|
15606
15600
|
var ModalContent = forwardRef25(
|
|
15607
|
-
({ width, positionVariant = "fixed-top",
|
|
15601
|
+
({ width, positionVariant = "fixed-top", children, ...props }, ref) => {
|
|
15608
15602
|
useFocusRestore();
|
|
15609
15603
|
return /* @__PURE__ */ jsx294(
|
|
15610
15604
|
StyledModalContent,
|
|
15611
15605
|
{
|
|
15612
15606
|
ref,
|
|
15613
|
-
$maxWidth: maxWidth,
|
|
15614
15607
|
$positionVariant: positionVariant,
|
|
15615
15608
|
$width: width,
|
|
15616
15609
|
"aria-describedby": void 0,
|
|
@@ -15680,7 +15673,6 @@ var Modal = forwardRef26(
|
|
|
15680
15673
|
hideTitle = false,
|
|
15681
15674
|
initialFocusRef,
|
|
15682
15675
|
isOpen,
|
|
15683
|
-
maxWidth,
|
|
15684
15676
|
onRequestClose,
|
|
15685
15677
|
positionVariant = "centered",
|
|
15686
15678
|
title,
|
|
@@ -15691,7 +15683,7 @@ var Modal = forwardRef26(
|
|
|
15691
15683
|
DialogRoot,
|
|
15692
15684
|
{
|
|
15693
15685
|
onOpenChange: (open2) => {
|
|
15694
|
-
if (!open2 &&
|
|
15686
|
+
if (!open2 && isNotNil32(onRequestClose)) {
|
|
15695
15687
|
onRequestClose();
|
|
15696
15688
|
}
|
|
15697
15689
|
},
|
|
@@ -15702,9 +15694,8 @@ var Modal = forwardRef26(
|
|
|
15702
15694
|
ModalContent,
|
|
15703
15695
|
{
|
|
15704
15696
|
ref,
|
|
15705
|
-
maxWidth,
|
|
15706
15697
|
onOpenAutoFocus: (event) => {
|
|
15707
|
-
if (
|
|
15698
|
+
if (isNotNil32(initialFocusRef) && initialFocusRef.current) {
|
|
15708
15699
|
event.preventDefault();
|
|
15709
15700
|
requestAnimationFrame(() => {
|
|
15710
15701
|
initialFocusRef.current?.focus();
|
|
@@ -15716,7 +15707,7 @@ var Modal = forwardRef26(
|
|
|
15716
15707
|
...props,
|
|
15717
15708
|
children: [
|
|
15718
15709
|
/* @__PURE__ */ jsx295(ModalScrollArea, { children: /* @__PURE__ */ jsx295(ModalBody, { children }) }),
|
|
15719
|
-
|
|
15710
|
+
isNotNil32(footer) ? /* @__PURE__ */ jsx295(ModalFooter, { children: footer }) : null,
|
|
15720
15711
|
hideCloseButton && hideTitle ? null : /* @__PURE__ */ jsx295(
|
|
15721
15712
|
ModalHeader,
|
|
15722
15713
|
{
|
|
@@ -15762,9 +15753,9 @@ import { Root as Root2, Trigger as Trigger2, Portal, Content as Content2, Close
|
|
|
15762
15753
|
import styled80, { css as css40 } from "styled-components";
|
|
15763
15754
|
|
|
15764
15755
|
// src/private/helpers/getControls/getControlProps.tsx
|
|
15765
|
-
import { isNotNil as
|
|
15756
|
+
import { isNotNil as isNotNil33 } from "@wistia/type-guards";
|
|
15766
15757
|
var getControlProps = (isOpen, onOpenChange) => {
|
|
15767
|
-
return
|
|
15758
|
+
return isNotNil33(onOpenChange) && isNotNil33(isOpen) ? { open: isOpen, onOpenChange } : {};
|
|
15768
15759
|
};
|
|
15769
15760
|
|
|
15770
15761
|
// src/components/Popover/PopoverArrow.tsx
|
|
@@ -15920,7 +15911,7 @@ Popover.displayName = "Popover_UI";
|
|
|
15920
15911
|
// src/components/ProgressBar/ProgressBar.tsx
|
|
15921
15912
|
import styled81 from "styled-components";
|
|
15922
15913
|
import { Root as ProgressRoot, Indicator as ProgressIndicator } from "@radix-ui/react-progress";
|
|
15923
|
-
import { isNotNil as
|
|
15914
|
+
import { isNotNil as isNotNil34 } from "@wistia/type-guards";
|
|
15924
15915
|
import { jsx as jsx299, jsxs as jsxs54 } from "react/jsx-runtime";
|
|
15925
15916
|
var ProgressBarWrapper = styled81.div`
|
|
15926
15917
|
--progress-bar-height: 8px;
|
|
@@ -15976,7 +15967,7 @@ var ProgressBar = ({
|
|
|
15976
15967
|
...props
|
|
15977
15968
|
}) => {
|
|
15978
15969
|
return /* @__PURE__ */ jsxs54(ProgressBarWrapper, { children: [
|
|
15979
|
-
|
|
15970
|
+
isNotNil34(labelLeft) ? /* @__PURE__ */ jsx299(ProgressBarLabel, { children: labelLeft }) : null,
|
|
15980
15971
|
/* @__PURE__ */ jsx299(
|
|
15981
15972
|
StyledProgressBar,
|
|
15982
15973
|
{
|
|
@@ -15994,13 +15985,13 @@ var ProgressBar = ({
|
|
|
15994
15985
|
)
|
|
15995
15986
|
}
|
|
15996
15987
|
),
|
|
15997
|
-
|
|
15988
|
+
isNotNil34(labelRight) ? /* @__PURE__ */ jsx299(ProgressBarLabel, { children: labelRight }) : null
|
|
15998
15989
|
] });
|
|
15999
15990
|
};
|
|
16000
15991
|
ProgressBar.displayName = "ProgressBar_UI";
|
|
16001
15992
|
|
|
16002
15993
|
// src/components/Radio/Radio.tsx
|
|
16003
|
-
import { isNonEmptyString as
|
|
15994
|
+
import { isNonEmptyString as isNonEmptyString8, isNotUndefined as isNotUndefined13 } from "@wistia/type-guards";
|
|
16004
15995
|
import { forwardRef as forwardRef27, useId as useId5 } from "react";
|
|
16005
15996
|
import styled82, { css as css41 } from "styled-components";
|
|
16006
15997
|
import { jsx as jsx300, jsxs as jsxs55 } from "react/jsx-runtime";
|
|
@@ -16100,7 +16091,7 @@ var Radio = forwardRef27(
|
|
|
16100
16091
|
...props
|
|
16101
16092
|
}, ref) => {
|
|
16102
16093
|
const generatedId = useId5();
|
|
16103
|
-
const computedId =
|
|
16094
|
+
const computedId = isNonEmptyString8(id) ? id : `wistia-ui-radio-${generatedId}`;
|
|
16104
16095
|
const radioGroupContext = useRadioGroup();
|
|
16105
16096
|
const contextName = radioGroupContext?.name;
|
|
16106
16097
|
const contextOnChange = radioGroupContext?.onChange;
|
|
@@ -16154,7 +16145,7 @@ import { forwardRef as forwardRef29 } from "react";
|
|
|
16154
16145
|
// src/components/RadioCard/RadioCardRoot.tsx
|
|
16155
16146
|
import { forwardRef as forwardRef28, useId as useId6 } from "react";
|
|
16156
16147
|
import styled83, { css as css42 } from "styled-components";
|
|
16157
|
-
import { isNonEmptyString as
|
|
16148
|
+
import { isNonEmptyString as isNonEmptyString9, isNotUndefined as isNotUndefined14 } from "@wistia/type-guards";
|
|
16158
16149
|
import { jsx as jsx301, jsxs as jsxs56 } from "react/jsx-runtime";
|
|
16159
16150
|
var checkedStyles = css42`
|
|
16160
16151
|
--wui-radio-card-border-color: var(--wui-color-focus-ring);
|
|
@@ -16276,7 +16267,7 @@ var RadioCardRoot = forwardRef28(
|
|
|
16276
16267
|
...props
|
|
16277
16268
|
}, ref) => {
|
|
16278
16269
|
const generatedId = useId6();
|
|
16279
|
-
const computedId =
|
|
16270
|
+
const computedId = isNonEmptyString9(id) ? id : `wistia-ui-radio-${generatedId}`;
|
|
16280
16271
|
const radioGroupContext = useRadioGroup();
|
|
16281
16272
|
const contextName = radioGroupContext?.name;
|
|
16282
16273
|
const contextOnChange = radioGroupContext?.onChange;
|
|
@@ -16315,7 +16306,7 @@ RadioCardRoot.displayName = "RadioCardRoot_UI";
|
|
|
16315
16306
|
|
|
16316
16307
|
// src/components/RadioCard/RadioCardDefaultLayout.tsx
|
|
16317
16308
|
import styled85 from "styled-components";
|
|
16318
|
-
import { isNotNil as
|
|
16309
|
+
import { isNotNil as isNotNil35 } from "@wistia/type-guards";
|
|
16319
16310
|
|
|
16320
16311
|
// src/components/RadioCard/RadioCardIndicator.tsx
|
|
16321
16312
|
import styled84 from "styled-components";
|
|
@@ -16389,17 +16380,17 @@ var RadioCardDefaultLayout = ({
|
|
|
16389
16380
|
showIndicator = true
|
|
16390
16381
|
}) => {
|
|
16391
16382
|
return /* @__PURE__ */ jsxs57(StyledCardContent, { children: [
|
|
16392
|
-
showIndicator ? /* @__PURE__ */ jsx302(StyledIndicatorContainer, { $hasIcon:
|
|
16383
|
+
showIndicator ? /* @__PURE__ */ jsx302(StyledIndicatorContainer, { $hasIcon: isNotNil35(icon), children: /* @__PURE__ */ jsx302(RadioCardIndicator, { "data-testid": "wui-radio-card-indicator" }) }) : null,
|
|
16393
16384
|
/* @__PURE__ */ jsxs57(Stack, { gap: "space-02", children: [
|
|
16394
|
-
|
|
16385
|
+
isNotNil35(icon) && /* @__PURE__ */ jsx302(StyledCardIcon, { "data-wui-radio-card-icon": true, children: icon }),
|
|
16395
16386
|
/* @__PURE__ */ jsxs57(
|
|
16396
16387
|
Stack,
|
|
16397
16388
|
{
|
|
16398
16389
|
gap: "space-01",
|
|
16399
|
-
style:
|
|
16390
|
+
style: isNotNil35(icon) ? { paddingLeft: 2 } : void 0,
|
|
16400
16391
|
children: [
|
|
16401
|
-
|
|
16402
|
-
|
|
16392
|
+
isNotNil35(label) && /* @__PURE__ */ jsx302(Text, { variant: "label3", children: /* @__PURE__ */ jsx302("strong", { children: label }) }),
|
|
16393
|
+
isNotNil35(description) && /* @__PURE__ */ jsx302(
|
|
16403
16394
|
Text,
|
|
16404
16395
|
{
|
|
16405
16396
|
prominence: "secondary",
|
|
@@ -16719,7 +16710,7 @@ SegmentedControl.displayName = "SegmentedControl_UI";
|
|
|
16719
16710
|
import { forwardRef as forwardRef33, useEffect as useEffect21, useRef as useRef22 } from "react";
|
|
16720
16711
|
import styled90, { css as css45 } from "styled-components";
|
|
16721
16712
|
import { Item as ToggleGroupItem2 } from "@radix-ui/react-toggle-group";
|
|
16722
|
-
import { isNotNil as
|
|
16713
|
+
import { isNotNil as isNotNil36 } from "@wistia/type-guards";
|
|
16723
16714
|
import { jsxs as jsxs60 } from "react/jsx-runtime";
|
|
16724
16715
|
var segmentedControlItemStyles = css45`
|
|
16725
16716
|
all: unset; /* ToggleGroupItem is a button element */
|
|
@@ -16835,8 +16826,8 @@ var SegmentedControlItem = forwardRef33(
|
|
|
16835
16826
|
{
|
|
16836
16827
|
ref: combinedRef,
|
|
16837
16828
|
...otherProps,
|
|
16838
|
-
$hasLabel:
|
|
16839
|
-
"aria-label":
|
|
16829
|
+
$hasLabel: isNotNil36(label),
|
|
16830
|
+
"aria-label": isNotNil36(label) ? void 0 : ariaLabel,
|
|
16840
16831
|
disabled,
|
|
16841
16832
|
onClick: handleClick,
|
|
16842
16833
|
value,
|
|
@@ -17010,7 +17001,7 @@ Select.displayName = "Select_UI";
|
|
|
17010
17001
|
import { Item, ItemText, ItemIndicator } from "@radix-ui/react-select";
|
|
17011
17002
|
import { forwardRef as forwardRef35 } from "react";
|
|
17012
17003
|
import styled92 from "styled-components";
|
|
17013
|
-
import { isNotNil as
|
|
17004
|
+
import { isNotNil as isNotNil37 } from "@wistia/type-guards";
|
|
17014
17005
|
import { jsx as jsx310, jsxs as jsxs62 } from "react/jsx-runtime";
|
|
17015
17006
|
var StyledItem = styled92(Item)`
|
|
17016
17007
|
${getTypographicStyles("label3")}
|
|
@@ -17047,7 +17038,7 @@ var SelectOption = forwardRef35(
|
|
|
17047
17038
|
ref: forwardedRef,
|
|
17048
17039
|
$checkmarkVerticalAlign: checkmarkVerticalAlign,
|
|
17049
17040
|
children: [
|
|
17050
|
-
|
|
17041
|
+
isNotNil37(selectedDisplayValue) ? /* @__PURE__ */ jsxs62("div", { children: [
|
|
17051
17042
|
children,
|
|
17052
17043
|
/* @__PURE__ */ jsx310("div", { style: { display: "none" }, children: /* @__PURE__ */ jsx310(ItemText, { children: selectedDisplayValue }) })
|
|
17053
17044
|
] }) : /* @__PURE__ */ jsx310(ItemText, { children }),
|
|
@@ -17094,7 +17085,7 @@ import {
|
|
|
17094
17085
|
Thumb as RadixSliderThumb
|
|
17095
17086
|
} from "@radix-ui/react-slider";
|
|
17096
17087
|
import styled94 from "styled-components";
|
|
17097
|
-
import { isNonEmptyString as
|
|
17088
|
+
import { isNonEmptyString as isNonEmptyString10 } from "@wistia/type-guards";
|
|
17098
17089
|
import { jsx as jsx312, jsxs as jsxs64 } from "react/jsx-runtime";
|
|
17099
17090
|
var SliderContainer = styled94.div`
|
|
17100
17091
|
--wui-slider-track-color: var(--wui-gray-6);
|
|
@@ -17173,7 +17164,7 @@ var Slider = ({
|
|
|
17173
17164
|
"data-testid": dataTestId = "ui-slider",
|
|
17174
17165
|
...otherProps
|
|
17175
17166
|
}) => {
|
|
17176
|
-
if (!(
|
|
17167
|
+
if (!(isNonEmptyString10(ariaLabel) || isNonEmptyString10(ariaLabelledby))) {
|
|
17177
17168
|
throw new Error(
|
|
17178
17169
|
"UI Slider: Sliders should have an accessible name. Add a label using the aria-label or aria-labelledby prop."
|
|
17179
17170
|
);
|
|
@@ -17335,7 +17326,7 @@ var TableRow = ({ children, ...props }) => {
|
|
|
17335
17326
|
// src/components/Tabs/Tabs.tsx
|
|
17336
17327
|
import { Root as RadixTabsRoot } from "@radix-ui/react-tabs";
|
|
17337
17328
|
import { useCallback as useCallback19, useState as useState25 } from "react";
|
|
17338
|
-
import { isNotNil as
|
|
17329
|
+
import { isNotNil as isNotNil38 } from "@wistia/type-guards";
|
|
17339
17330
|
|
|
17340
17331
|
// src/components/Tabs/useTabsValue.tsx
|
|
17341
17332
|
import { createContext as createContext12, useContext as useContext18 } from "react";
|
|
@@ -17372,10 +17363,10 @@ var Tabs = ({
|
|
|
17372
17363
|
...props,
|
|
17373
17364
|
onValueChange
|
|
17374
17365
|
};
|
|
17375
|
-
if (
|
|
17366
|
+
if (isNotNil38(value)) {
|
|
17376
17367
|
rootProps.value = value;
|
|
17377
17368
|
}
|
|
17378
|
-
if (
|
|
17369
|
+
if (isNotNil38(defaultValue)) {
|
|
17379
17370
|
rootProps.defaultValue = defaultValue;
|
|
17380
17371
|
}
|
|
17381
17372
|
return /* @__PURE__ */ jsx319(RadixTabsRoot, { ...rootProps, children: /* @__PURE__ */ jsx319(TabsValueProvider, { value: value ?? defaultValue, children: /* @__PURE__ */ jsx319(SelectedItemStyleProvider, { children }) }) });
|
|
@@ -17444,7 +17435,7 @@ TabsList.displayName = "TabsList_UI";
|
|
|
17444
17435
|
|
|
17445
17436
|
// src/components/Tabs/TabsTrigger.tsx
|
|
17446
17437
|
import { forwardRef as forwardRef36, useEffect as useEffect22, useRef as useRef23 } from "react";
|
|
17447
|
-
import { isNotNil as
|
|
17438
|
+
import { isNotNil as isNotNil39 } from "@wistia/type-guards";
|
|
17448
17439
|
|
|
17449
17440
|
// src/components/Tabs/StyledRadixTabsTrigger.tsx
|
|
17450
17441
|
import styled103 from "styled-components";
|
|
@@ -17495,8 +17486,8 @@ var TabsTrigger = forwardRef36(
|
|
|
17495
17486
|
{
|
|
17496
17487
|
...otherProps,
|
|
17497
17488
|
ref: combinedRef,
|
|
17498
|
-
$hasLabel:
|
|
17499
|
-
"aria-label":
|
|
17489
|
+
$hasLabel: isNotNil39(label),
|
|
17490
|
+
"aria-label": isNotNil39(label) ? void 0 : ariaLabel,
|
|
17500
17491
|
disabled,
|
|
17501
17492
|
value,
|
|
17502
17493
|
children: [
|
|
@@ -17511,7 +17502,7 @@ TabsTrigger.displayName = "TabsTrigger_UI";
|
|
|
17511
17502
|
|
|
17512
17503
|
// src/components/Thumbnail/ThumbnailBadge.tsx
|
|
17513
17504
|
import styled104 from "styled-components";
|
|
17514
|
-
import { isNotNil as
|
|
17505
|
+
import { isNotNil as isNotNil40 } from "@wistia/type-guards";
|
|
17515
17506
|
import { jsx as jsx323, jsxs as jsxs67 } from "react/jsx-runtime";
|
|
17516
17507
|
var StyledThumbnailBadge = styled104.div`
|
|
17517
17508
|
align-items: center;
|
|
@@ -17540,7 +17531,7 @@ var StyledThumbnailBadge = styled104.div`
|
|
|
17540
17531
|
`;
|
|
17541
17532
|
var ThumbnailBadge = ({ icon, label, ...props }) => {
|
|
17542
17533
|
return /* @__PURE__ */ jsxs67(StyledThumbnailBadge, { ...props, children: [
|
|
17543
|
-
|
|
17534
|
+
isNotNil40(icon) && icon,
|
|
17544
17535
|
/* @__PURE__ */ jsx323("span", { children: label })
|
|
17545
17536
|
] });
|
|
17546
17537
|
};
|
|
@@ -17549,10 +17540,10 @@ ThumbnailBadge.displayName = "ThumbnailBadge_UI";
|
|
|
17549
17540
|
// src/components/Thumbnail/Thumbnail.tsx
|
|
17550
17541
|
import { forwardRef as forwardRef37, useState as useState26, useRef as useRef24, useCallback as useCallback20, useMemo as useMemo17 } from "react";
|
|
17551
17542
|
import styled106 from "styled-components";
|
|
17552
|
-
import { isNil as isNil19, isNotNil as
|
|
17543
|
+
import { isNil as isNil19, isNotNil as isNotNil43, isUndefined as isUndefined7, isEmptyString as isEmptyString2, isString as isString4 } from "@wistia/type-guards";
|
|
17553
17544
|
|
|
17554
17545
|
// src/private/helpers/getBackgroundGradient/getBackgroundGradient.ts
|
|
17555
|
-
import { isNotNil as
|
|
17546
|
+
import { isNotNil as isNotNil41 } from "@wistia/type-guards";
|
|
17556
17547
|
import { css as css49 } from "styled-components";
|
|
17557
17548
|
var gradients = {
|
|
17558
17549
|
defaultDarkOne: css49`
|
|
@@ -17680,12 +17671,12 @@ var gradients = {
|
|
|
17680
17671
|
};
|
|
17681
17672
|
var gradientMap = Object.keys(gradients);
|
|
17682
17673
|
var getBackgroundGradient = (gradientName = void 0) => {
|
|
17683
|
-
return
|
|
17674
|
+
return isNotNil41(gradientName) ? gradients[gradientName] : gradients.defaultDarkOne;
|
|
17684
17675
|
};
|
|
17685
17676
|
|
|
17686
17677
|
// src/components/Thumbnail/ThumbnailStoryboardViewer.tsx
|
|
17687
17678
|
import styled105 from "styled-components";
|
|
17688
|
-
import { isNotNil as
|
|
17679
|
+
import { isNotNil as isNotNil42 } from "@wistia/type-guards";
|
|
17689
17680
|
import { jsx as jsx324, jsxs as jsxs68 } from "react/jsx-runtime";
|
|
17690
17681
|
var ScrubLine = styled105.div`
|
|
17691
17682
|
position: absolute;
|
|
@@ -17779,8 +17770,8 @@ var ThumbnailStoryboardViewer = ({
|
|
|
17779
17770
|
);
|
|
17780
17771
|
const backgroundSize = `${scaledStoryboardWidth}px ${scaledStoryboardHeight}px`;
|
|
17781
17772
|
const backgroundImage = `url(${storyboardUrl})`;
|
|
17782
|
-
const showScrubLine =
|
|
17783
|
-
const scrubLinePosition =
|
|
17773
|
+
const showScrubLine = isNotNil42(cursorPosition);
|
|
17774
|
+
const scrubLinePosition = isNotNil42(cursorPosition) ? `${cursorPosition - 1}px` : "0";
|
|
17784
17775
|
const viewerStyles = {
|
|
17785
17776
|
position: "relative",
|
|
17786
17777
|
overflow: "hidden",
|
|
@@ -17851,7 +17842,7 @@ var ThumbnailImage = ({ thumbnailImageType, thumbnailUrl }) => {
|
|
|
17851
17842
|
);
|
|
17852
17843
|
};
|
|
17853
17844
|
var StyledThumbnail = styled106.div`
|
|
17854
|
-
background-image: ${({ $backgroundUrl }) =>
|
|
17845
|
+
background-image: ${({ $backgroundUrl }) => isNotNil43($backgroundUrl) ? `url('${$backgroundUrl}')` : void 0};
|
|
17855
17846
|
${({ $backgroundUrl, $gradientBackground }) => (
|
|
17856
17847
|
// if we don't have $backgroundUrl show a gradient
|
|
17857
17848
|
isNil19($backgroundUrl) ? getBackgroundGradient($gradientBackground) : void 0
|
|
@@ -17930,10 +17921,10 @@ var Thumbnail = forwardRef37(
|
|
|
17930
17921
|
const storyboardElementRef = useRef24(null);
|
|
17931
17922
|
const [cursorPosition, setCursorPosition] = useState26(null);
|
|
17932
17923
|
const backgroundUrl = useMemo17(
|
|
17933
|
-
() => thumbnailImageType === "square" &&
|
|
17924
|
+
() => thumbnailImageType === "square" && isNotNil43(thumbnailUrl) ? thumbnailUrl : void 0,
|
|
17934
17925
|
[thumbnailImageType, thumbnailUrl]
|
|
17935
17926
|
);
|
|
17936
|
-
const isScrubbable =
|
|
17927
|
+
const isScrubbable = isNotNil43(storyboard);
|
|
17937
17928
|
const trackStoryboardLoadStatus = useCallback20(() => {
|
|
17938
17929
|
if (storyboardElementRef.current || !storyboard) {
|
|
17939
17930
|
return storyboardElementRef.current;
|
|
@@ -17980,7 +17971,7 @@ var Thumbnail = forwardRef37(
|
|
|
17980
17971
|
width
|
|
17981
17972
|
}
|
|
17982
17973
|
);
|
|
17983
|
-
} else if (
|
|
17974
|
+
} else if (isNotNil43(thumbnailUrl)) {
|
|
17984
17975
|
thumbnailContent = /* @__PURE__ */ jsx325(
|
|
17985
17976
|
ThumbnailImage,
|
|
17986
17977
|
{
|
|
@@ -18005,7 +17996,7 @@ var Thumbnail = forwardRef37(
|
|
|
18005
17996
|
onMouseOut: handleMouseOut,
|
|
18006
17997
|
role: "presentation",
|
|
18007
17998
|
children: [
|
|
18008
|
-
|
|
17999
|
+
isNotNil43(children) ? children : null,
|
|
18009
18000
|
thumbnailContent
|
|
18010
18001
|
]
|
|
18011
18002
|
}
|
|
@@ -18123,7 +18114,7 @@ var ThumbnailCollage = ({
|
|
|
18123
18114
|
|
|
18124
18115
|
// src/components/WistiaLogo/WistiaLogo.tsx
|
|
18125
18116
|
import styled108, { css as css50 } from "styled-components";
|
|
18126
|
-
import { isNotNil as
|
|
18117
|
+
import { isNotNil as isNotNil44 } from "@wistia/type-guards";
|
|
18127
18118
|
import { jsx as jsx327, jsxs as jsxs70 } from "react/jsx-runtime";
|
|
18128
18119
|
var renderBrandmark = (brandmarkColor, iconOnly) => {
|
|
18129
18120
|
if (iconOnly) {
|
|
@@ -18236,7 +18227,7 @@ var WistiaLogo = ({
|
|
|
18236
18227
|
...props,
|
|
18237
18228
|
children: [
|
|
18238
18229
|
/* @__PURE__ */ jsx327("title", { children: title }),
|
|
18239
|
-
|
|
18230
|
+
isNotNil44(description) ? /* @__PURE__ */ jsx327("desc", { children: description }) : null,
|
|
18240
18231
|
renderBrandmark(brandmarkColor, iconOnly),
|
|
18241
18232
|
renderLogotype(logotypeColor, iconOnly)
|
|
18242
18233
|
]
|
|
@@ -18248,7 +18239,7 @@ WistiaLogo.displayName = "WistiaLogo_UI";
|
|
|
18248
18239
|
|
|
18249
18240
|
// src/components/SplitButton/SplitButton.tsx
|
|
18250
18241
|
import styled109 from "styled-components";
|
|
18251
|
-
import { isNotNil as
|
|
18242
|
+
import { isNotNil as isNotNil45 } from "@wistia/type-guards";
|
|
18252
18243
|
import { cloneElement as cloneElement9 } from "react";
|
|
18253
18244
|
import { jsx as jsx328, jsxs as jsxs71 } from "react/jsx-runtime";
|
|
18254
18245
|
var StyledSplitButton = styled109.span`
|
|
@@ -18295,7 +18286,7 @@ var SplitButton = ({
|
|
|
18295
18286
|
children
|
|
18296
18287
|
}
|
|
18297
18288
|
),
|
|
18298
|
-
|
|
18289
|
+
isNotNil45(menuItems) && /* @__PURE__ */ jsx328(
|
|
18299
18290
|
Menu,
|
|
18300
18291
|
{
|
|
18301
18292
|
...menuProps,
|
|
@@ -18314,7 +18305,7 @@ var SplitButton = ({
|
|
|
18314
18305
|
children: menuItems
|
|
18315
18306
|
}
|
|
18316
18307
|
),
|
|
18317
|
-
|
|
18308
|
+
isNotNil45(secondaryAction) && cloneElement9(secondaryAction, { disabled, size, unstyled, variant, colorScheme })
|
|
18318
18309
|
] });
|
|
18319
18310
|
};
|
|
18320
18311
|
SplitButton.displayName = "SplitButton_UI";
|