@wistia/ui 0.8.5-beta.7902c369.c4c8fbc → 0.8.5
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 +50 -52
- package/dist/index.cjs.map +1 -1
- package/dist/index.mjs +38 -41
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.8.5
|
|
3
|
+
* @license @wistia/ui v0.8.5
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -10469,7 +10469,6 @@ RadioMenuItem.displayName = "RadioMenuItem";
|
|
|
10469
10469
|
|
|
10470
10470
|
// src/components/Menu/CheckboxMenuItem.tsx
|
|
10471
10471
|
var import_react_dropdown_menu7 = require("@radix-ui/react-dropdown-menu");
|
|
10472
|
-
var import_type_guards38 = require("@wistia/type-guards");
|
|
10473
10472
|
var import_jsx_runtime238 = require("react/jsx-runtime");
|
|
10474
10473
|
var CheckboxIndicator = ({ checked, ...props }) => {
|
|
10475
10474
|
return checked ? /* @__PURE__ */ (0, import_jsx_runtime238.jsxs)(
|
|
@@ -10543,8 +10542,7 @@ var CheckboxMenuItem = ({
|
|
|
10543
10542
|
MenuItemButton,
|
|
10544
10543
|
{
|
|
10545
10544
|
...props,
|
|
10546
|
-
leftIcon:
|
|
10547
|
-
rightIcon: (0, import_type_guards38.isNotNil)(props.icon) ? /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(import_react_dropdown_menu7.DropdownMenuItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(Icon, { type: "checkmark" }) }) : void 0
|
|
10545
|
+
leftIcon: /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(CheckboxIndicator, { checked })
|
|
10548
10546
|
}
|
|
10549
10547
|
)
|
|
10550
10548
|
}
|
|
@@ -10556,7 +10554,7 @@ CheckboxMenuItem.displayName = "CheckboxMenuItem";
|
|
|
10556
10554
|
var import_react47 = require("react");
|
|
10557
10555
|
var import_styled_components63 = __toESM(require("styled-components"));
|
|
10558
10556
|
var import_react_dialog4 = require("@radix-ui/react-dialog");
|
|
10559
|
-
var
|
|
10557
|
+
var import_type_guards39 = require("@wistia/type-guards");
|
|
10560
10558
|
|
|
10561
10559
|
// src/components/Modal/ModalHeader.tsx
|
|
10562
10560
|
var import_styled_components60 = __toESM(require("styled-components"));
|
|
@@ -10619,7 +10617,7 @@ var import_react_dialog3 = require("@radix-ui/react-dialog");
|
|
|
10619
10617
|
|
|
10620
10618
|
// src/private/hooks/useFocusRestore/useFocusRestore.ts
|
|
10621
10619
|
var import_react44 = require("react");
|
|
10622
|
-
var
|
|
10620
|
+
var import_type_guards38 = require("@wistia/type-guards");
|
|
10623
10621
|
var useFocusRestore = () => {
|
|
10624
10622
|
const previouslyFocusedRef = (0, import_react44.useRef)(null);
|
|
10625
10623
|
(0, import_react44.useEffect)(() => {
|
|
@@ -10627,7 +10625,7 @@ var useFocusRestore = () => {
|
|
|
10627
10625
|
}, []);
|
|
10628
10626
|
(0, import_react44.useEffect)(() => {
|
|
10629
10627
|
return () => {
|
|
10630
|
-
if ((0,
|
|
10628
|
+
if ((0, import_type_guards38.isNotNil)(previouslyFocusedRef.current)) {
|
|
10631
10629
|
setTimeout(() => {
|
|
10632
10630
|
previouslyFocusedRef.current?.focus();
|
|
10633
10631
|
}, 0);
|
|
@@ -10774,7 +10772,7 @@ var Modal = (0, import_react47.forwardRef)(
|
|
|
10774
10772
|
import_react_dialog4.Root,
|
|
10775
10773
|
{
|
|
10776
10774
|
onOpenChange: (open2) => {
|
|
10777
|
-
if (!open2 && (0,
|
|
10775
|
+
if (!open2 && (0, import_type_guards39.isNotNil)(onRequestClose)) {
|
|
10778
10776
|
onRequestClose();
|
|
10779
10777
|
}
|
|
10780
10778
|
},
|
|
@@ -10787,7 +10785,7 @@ var Modal = (0, import_react47.forwardRef)(
|
|
|
10787
10785
|
ref,
|
|
10788
10786
|
fullHeight,
|
|
10789
10787
|
onOpenAutoFocus: (event) => {
|
|
10790
|
-
if ((0,
|
|
10788
|
+
if ((0, import_type_guards39.isNotNil)(initialFocusRef) && initialFocusRef.current) {
|
|
10791
10789
|
event.preventDefault();
|
|
10792
10790
|
requestAnimationFrame(() => {
|
|
10793
10791
|
initialFocusRef.current?.focus();
|
|
@@ -10821,9 +10819,9 @@ var import_react_popover = require("@radix-ui/react-popover");
|
|
|
10821
10819
|
var import_styled_components64 = __toESM(require("styled-components"));
|
|
10822
10820
|
|
|
10823
10821
|
// src/private/helpers/getControls/getControlProps.tsx
|
|
10824
|
-
var
|
|
10822
|
+
var import_type_guards40 = require("@wistia/type-guards");
|
|
10825
10823
|
var getControlProps = (isOpen, onOpenChange) => {
|
|
10826
|
-
return (0,
|
|
10824
|
+
return (0, import_type_guards40.isNotNil)(onOpenChange) && (0, import_type_guards40.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {};
|
|
10827
10825
|
};
|
|
10828
10826
|
|
|
10829
10827
|
// src/components/Popover/Popover.tsx
|
|
@@ -10894,7 +10892,7 @@ Popover.displayName = "Popover";
|
|
|
10894
10892
|
// src/components/ProgressBar/ProgressBar.tsx
|
|
10895
10893
|
var import_styled_components65 = __toESM(require("styled-components"));
|
|
10896
10894
|
var import_react_progress = require("@radix-ui/react-progress");
|
|
10897
|
-
var
|
|
10895
|
+
var import_type_guards41 = require("@wistia/type-guards");
|
|
10898
10896
|
var import_jsx_runtime245 = require("react/jsx-runtime");
|
|
10899
10897
|
var ProgressBarWrapper = import_styled_components65.default.div`
|
|
10900
10898
|
--progress-bar-height: 8px;
|
|
@@ -10949,7 +10947,7 @@ var ProgressBar = ({
|
|
|
10949
10947
|
...props
|
|
10950
10948
|
}) => {
|
|
10951
10949
|
return /* @__PURE__ */ (0, import_jsx_runtime245.jsxs)(ProgressBarWrapper, { children: [
|
|
10952
|
-
(0,
|
|
10950
|
+
(0, import_type_guards41.isNotNil)(labelLeft) ? /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(ProgressBarLabel, { children: labelLeft }) : null,
|
|
10953
10951
|
/* @__PURE__ */ (0, import_jsx_runtime245.jsx)(
|
|
10954
10952
|
StyledProgressBar,
|
|
10955
10953
|
{
|
|
@@ -10965,7 +10963,7 @@ var ProgressBar = ({
|
|
|
10965
10963
|
)
|
|
10966
10964
|
}
|
|
10967
10965
|
),
|
|
10968
|
-
(0,
|
|
10966
|
+
(0, import_type_guards41.isNotNil)(labelRight) ? /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(ProgressBarLabel, { children: labelRight }) : null
|
|
10969
10967
|
] });
|
|
10970
10968
|
};
|
|
10971
10969
|
ProgressBar.displayName = "ProgressBar";
|
|
@@ -10973,7 +10971,7 @@ ProgressBar.displayName = "ProgressBar";
|
|
|
10973
10971
|
// src/components/Radio/Radio.tsx
|
|
10974
10972
|
var import_react48 = require("react");
|
|
10975
10973
|
var import_styled_components66 = __toESM(require("styled-components"));
|
|
10976
|
-
var
|
|
10974
|
+
var import_type_guards42 = require("@wistia/type-guards");
|
|
10977
10975
|
var import_jsx_runtime246 = require("react/jsx-runtime");
|
|
10978
10976
|
var RadioIcon = () => /* @__PURE__ */ (0, import_jsx_runtime246.jsx)(
|
|
10979
10977
|
"svg",
|
|
@@ -11090,7 +11088,7 @@ var Radio = (0, import_react48.forwardRef)(
|
|
|
11090
11088
|
...props
|
|
11091
11089
|
}, ref) => {
|
|
11092
11090
|
const generatedId = (0, import_react48.useId)();
|
|
11093
|
-
const computedId = (0,
|
|
11091
|
+
const computedId = (0, import_type_guards42.isNonEmptyString)(id) ? id : `wistia-ui-radio-${generatedId}`;
|
|
11094
11092
|
return /* @__PURE__ */ (0, import_jsx_runtime246.jsxs)(
|
|
11095
11093
|
StyledRadioWrapper,
|
|
11096
11094
|
{
|
|
@@ -11142,7 +11140,7 @@ Radio.displayName = "Radio";
|
|
|
11142
11140
|
var import_react52 = require("react");
|
|
11143
11141
|
var import_styled_components68 = __toESM(require("styled-components"));
|
|
11144
11142
|
var import_react_toggle_group = require("@radix-ui/react-toggle-group");
|
|
11145
|
-
var
|
|
11143
|
+
var import_type_guards43 = require("@wistia/type-guards");
|
|
11146
11144
|
|
|
11147
11145
|
// src/components/SegmentedControl/useSelectedItemMeasurements.tsx
|
|
11148
11146
|
var import_react49 = require("react");
|
|
@@ -11253,7 +11251,7 @@ var SegmentedControl = (0, import_react52.forwardRef)(
|
|
|
11253
11251
|
onSelectedValueChange,
|
|
11254
11252
|
...props
|
|
11255
11253
|
}, ref) => {
|
|
11256
|
-
if ((0,
|
|
11254
|
+
if ((0, import_type_guards43.isNil)(children)) {
|
|
11257
11255
|
return null;
|
|
11258
11256
|
}
|
|
11259
11257
|
return /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
|
|
@@ -11282,7 +11280,7 @@ SegmentedControl.displayName = "SegmentedControl";
|
|
|
11282
11280
|
var import_react53 = require("react");
|
|
11283
11281
|
var import_styled_components69 = __toESM(require("styled-components"));
|
|
11284
11282
|
var import_react_toggle_group2 = require("@radix-ui/react-toggle-group");
|
|
11285
|
-
var
|
|
11283
|
+
var import_type_guards44 = require("@wistia/type-guards");
|
|
11286
11284
|
var import_jsx_runtime250 = require("react/jsx-runtime");
|
|
11287
11285
|
var segmentedControlItemStyles = import_styled_components69.css`
|
|
11288
11286
|
all: unset; /* ToggleGroupItem is a button element */
|
|
@@ -11389,8 +11387,8 @@ var SegmentedControlItem = (0, import_react53.forwardRef)(
|
|
|
11389
11387
|
StyledSegmentedControlItem,
|
|
11390
11388
|
{
|
|
11391
11389
|
ref: combinedRef,
|
|
11392
|
-
$hasLabel: (0,
|
|
11393
|
-
"aria-label": (0,
|
|
11390
|
+
$hasLabel: (0, import_type_guards44.isNotNil)(label),
|
|
11391
|
+
"aria-label": (0, import_type_guards44.isNotNil)(label) ? void 0 : ariaLabel,
|
|
11394
11392
|
disabled,
|
|
11395
11393
|
onClick: handleClick,
|
|
11396
11394
|
value,
|
|
@@ -11522,7 +11520,7 @@ Select.displayName = "Select";
|
|
|
11522
11520
|
var import_react_select2 = require("@radix-ui/react-select");
|
|
11523
11521
|
var import_react55 = require("react");
|
|
11524
11522
|
var import_styled_components71 = __toESM(require("styled-components"));
|
|
11525
|
-
var
|
|
11523
|
+
var import_type_guards45 = require("@wistia/type-guards");
|
|
11526
11524
|
var import_jsx_runtime252 = require("react/jsx-runtime");
|
|
11527
11525
|
var StyledItem = (0, import_styled_components71.default)(import_react_select2.Item)`
|
|
11528
11526
|
${variantStyleMap2.body3};
|
|
@@ -11566,7 +11564,7 @@ var SelectOption = (0, import_react55.forwardRef)(
|
|
|
11566
11564
|
type: "checkmark"
|
|
11567
11565
|
}
|
|
11568
11566
|
) }) }),
|
|
11569
|
-
(0,
|
|
11567
|
+
(0, import_type_guards45.isNotNil)(selectedDisplayValue) ? /* @__PURE__ */ (0, import_jsx_runtime252.jsxs)("div", { children: [
|
|
11570
11568
|
children,
|
|
11571
11569
|
/* @__PURE__ */ (0, import_jsx_runtime252.jsx)("div", { style: { display: "none" }, children: /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(import_react_select2.ItemText, { children: selectedDisplayValue }) })
|
|
11572
11570
|
] }) : /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(import_react_select2.ItemText, { children })
|
|
@@ -11601,7 +11599,7 @@ var SelectOptionGroup = ({ children, label, ...props }) => {
|
|
|
11601
11599
|
// src/components/Switch/Switch.tsx
|
|
11602
11600
|
var import_react56 = require("react");
|
|
11603
11601
|
var import_styled_components73 = __toESM(require("styled-components"));
|
|
11604
|
-
var
|
|
11602
|
+
var import_type_guards46 = require("@wistia/type-guards");
|
|
11605
11603
|
var import_jsx_runtime254 = require("react/jsx-runtime");
|
|
11606
11604
|
var sizeSmall3 = import_styled_components73.css`
|
|
11607
11605
|
--wui-size-small-width: 24px;
|
|
@@ -11720,7 +11718,7 @@ var Switch = (0, import_react56.forwardRef)(
|
|
|
11720
11718
|
...props
|
|
11721
11719
|
}, ref) => {
|
|
11722
11720
|
const generatedId = (0, import_react56.useId)();
|
|
11723
|
-
const computedId = (0,
|
|
11721
|
+
const computedId = (0, import_type_guards46.isNonEmptyString)(id) ? id : `wistia-ui-switch-${generatedId}`;
|
|
11724
11722
|
return /* @__PURE__ */ (0, import_jsx_runtime254.jsxs)(StyledSwitchWrapper, { $disabled: disabled, children: [
|
|
11725
11723
|
/* @__PURE__ */ (0, import_jsx_runtime254.jsx)(
|
|
11726
11724
|
StyledHiddenSwitchInput,
|
|
@@ -11867,7 +11865,7 @@ var TableRow = ({ children, ...props }) => {
|
|
|
11867
11865
|
// src/components/Tabs/Tabs.tsx
|
|
11868
11866
|
var import_react63 = require("react");
|
|
11869
11867
|
var import_react_tabs4 = require("@radix-ui/react-tabs");
|
|
11870
|
-
var
|
|
11868
|
+
var import_type_guards48 = require("@wistia/type-guards");
|
|
11871
11869
|
var import_styled_components84 = __toESM(require("styled-components"));
|
|
11872
11870
|
|
|
11873
11871
|
// src/components/Tabs/TabPanel.tsx
|
|
@@ -11923,7 +11921,7 @@ TabList.displayName = "TabList";
|
|
|
11923
11921
|
var import_react60 = require("react");
|
|
11924
11922
|
var import_styled_components82 = __toESM(require("styled-components"));
|
|
11925
11923
|
var import_react_tabs3 = require("@radix-ui/react-tabs");
|
|
11926
|
-
var
|
|
11924
|
+
var import_type_guards47 = require("@wistia/type-guards");
|
|
11927
11925
|
|
|
11928
11926
|
// src/components/Tabs/useTabsValue.tsx
|
|
11929
11927
|
var import_react59 = require("react");
|
|
@@ -11981,8 +11979,8 @@ var TabItem = (0, import_react60.forwardRef)(
|
|
|
11981
11979
|
StyledTabItem,
|
|
11982
11980
|
{
|
|
11983
11981
|
ref: combinedRef,
|
|
11984
|
-
$hasLabel: (0,
|
|
11985
|
-
"aria-label": (0,
|
|
11982
|
+
$hasLabel: (0, import_type_guards47.isNotNil)(label),
|
|
11983
|
+
"aria-label": (0, import_type_guards47.isNotNil)(label) ? void 0 : ariaLabel,
|
|
11986
11984
|
disabled,
|
|
11987
11985
|
value,
|
|
11988
11986
|
children: [
|
|
@@ -12112,7 +12110,7 @@ var Tabs = (0, import_react63.forwardRef)(
|
|
|
12112
12110
|
label,
|
|
12113
12111
|
"aria-label": ariaLabelForTab
|
|
12114
12112
|
} = tab.props;
|
|
12115
|
-
if ((0,
|
|
12113
|
+
if ((0, import_type_guards48.isNil)(icon)) {
|
|
12116
12114
|
return /* @__PURE__ */ (0, import_jsx_runtime265.jsx)(
|
|
12117
12115
|
TabItem,
|
|
12118
12116
|
{
|
|
@@ -12123,7 +12121,7 @@ var Tabs = (0, import_react63.forwardRef)(
|
|
|
12123
12121
|
value
|
|
12124
12122
|
);
|
|
12125
12123
|
}
|
|
12126
|
-
if ((0,
|
|
12124
|
+
if ((0, import_type_guards48.isNotNil)(label)) {
|
|
12127
12125
|
return /* @__PURE__ */ (0, import_jsx_runtime265.jsx)(
|
|
12128
12126
|
TabItem,
|
|
12129
12127
|
{
|
|
@@ -12135,7 +12133,7 @@ var Tabs = (0, import_react63.forwardRef)(
|
|
|
12135
12133
|
value
|
|
12136
12134
|
);
|
|
12137
12135
|
}
|
|
12138
|
-
if ((0,
|
|
12136
|
+
if ((0, import_type_guards48.isNotNil)(ariaLabelForTab)) {
|
|
12139
12137
|
return /* @__PURE__ */ (0, import_jsx_runtime265.jsx)(
|
|
12140
12138
|
TabItem,
|
|
12141
12139
|
{
|
|
@@ -12178,7 +12176,7 @@ Tab.displayName = "Tab";
|
|
|
12178
12176
|
// src/components/Tag/Tag.tsx
|
|
12179
12177
|
var import_react65 = require("react");
|
|
12180
12178
|
var import_styled_components85 = __toESM(require("styled-components"));
|
|
12181
|
-
var
|
|
12179
|
+
var import_type_guards49 = require("@wistia/type-guards");
|
|
12182
12180
|
var import_jsx_runtime267 = require("react/jsx-runtime");
|
|
12183
12181
|
var TagLabel = import_styled_components85.default.a`
|
|
12184
12182
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
@@ -12263,10 +12261,10 @@ var StyledTag = import_styled_components85.default.div`
|
|
|
12263
12261
|
}
|
|
12264
12262
|
`;
|
|
12265
12263
|
var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
|
|
12266
|
-
if ((0,
|
|
12264
|
+
if ((0, import_type_guards49.isNil)(onClickRemove)) {
|
|
12267
12265
|
return null;
|
|
12268
12266
|
}
|
|
12269
|
-
if ((0,
|
|
12267
|
+
if ((0, import_type_guards49.isNil)(onClickRemoveLabel)) {
|
|
12270
12268
|
throw new Error(
|
|
12271
12269
|
"for accessibility, onClickRemoveLabel must be provided if onClickRemove is provided"
|
|
12272
12270
|
);
|
|
@@ -12295,8 +12293,8 @@ var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
|
|
|
12295
12293
|
};
|
|
12296
12294
|
var Tag = (0, import_react65.forwardRef)(
|
|
12297
12295
|
({ onClickRemove, colorScheme = "inherit", href, icon, label, onClickRemoveLabel, ...props }, ref) => {
|
|
12298
|
-
const hasIcon = (0,
|
|
12299
|
-
const labelProps = (0,
|
|
12296
|
+
const hasIcon = (0, import_type_guards49.isNotNil)(icon);
|
|
12297
|
+
const labelProps = (0, import_type_guards49.isNotNil)(href) && (0, import_type_guards49.isNonEmptyString)(href) ? { href, as: "a" } : { as: "span" };
|
|
12300
12298
|
return /* @__PURE__ */ (0, import_jsx_runtime267.jsxs)(
|
|
12301
12299
|
StyledTag,
|
|
12302
12300
|
{
|
|
@@ -12332,7 +12330,7 @@ Tag.displayName = "Tag";
|
|
|
12332
12330
|
|
|
12333
12331
|
// src/components/WistiaLogo/WistiaLogo.tsx
|
|
12334
12332
|
var import_styled_components86 = __toESM(require("styled-components"));
|
|
12335
|
-
var
|
|
12333
|
+
var import_type_guards50 = require("@wistia/type-guards");
|
|
12336
12334
|
var import_jsx_runtime268 = require("react/jsx-runtime");
|
|
12337
12335
|
var renderBrandmark = (brandmarkColor, iconOnly) => {
|
|
12338
12336
|
if (iconOnly) {
|
|
@@ -12445,7 +12443,7 @@ var WistiaLogo = ({
|
|
|
12445
12443
|
...props,
|
|
12446
12444
|
children: [
|
|
12447
12445
|
/* @__PURE__ */ (0, import_jsx_runtime268.jsx)("title", { children: title }),
|
|
12448
|
-
(0,
|
|
12446
|
+
(0, import_type_guards50.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime268.jsx)("desc", { children: description }) : null,
|
|
12449
12447
|
renderBrandmark(brandmarkColor, iconOnly),
|
|
12450
12448
|
renderLogotype(logotypeColor, iconOnly)
|
|
12451
12449
|
]
|
|
@@ -12457,7 +12455,7 @@ WistiaLogo.displayName = "WistiaLogo";
|
|
|
12457
12455
|
|
|
12458
12456
|
// src/components/Thumbnail/ThumbnailBadge.tsx
|
|
12459
12457
|
var import_styled_components87 = __toESM(require("styled-components"));
|
|
12460
|
-
var
|
|
12458
|
+
var import_type_guards51 = require("@wistia/type-guards");
|
|
12461
12459
|
var import_jsx_runtime269 = require("react/jsx-runtime");
|
|
12462
12460
|
var StyledThumbnailBadge = import_styled_components87.default.div`
|
|
12463
12461
|
align-items: center;
|
|
@@ -12485,7 +12483,7 @@ var StyledThumbnailBadge = import_styled_components87.default.div`
|
|
|
12485
12483
|
`;
|
|
12486
12484
|
var ThumbnailBadge = ({ icon, label, ...props }) => {
|
|
12487
12485
|
return /* @__PURE__ */ (0, import_jsx_runtime269.jsxs)(StyledThumbnailBadge, { ...props, children: [
|
|
12488
|
-
(0,
|
|
12486
|
+
(0, import_type_guards51.isNotNil)(icon) && icon,
|
|
12489
12487
|
/* @__PURE__ */ (0, import_jsx_runtime269.jsx)("span", { children: label })
|
|
12490
12488
|
] });
|
|
12491
12489
|
};
|
|
@@ -12494,10 +12492,10 @@ ThumbnailBadge.displayName = "ThumbnailBadge";
|
|
|
12494
12492
|
// src/components/Thumbnail/Thumbnail.tsx
|
|
12495
12493
|
var import_react66 = require("react");
|
|
12496
12494
|
var import_styled_components89 = __toESM(require("styled-components"));
|
|
12497
|
-
var
|
|
12495
|
+
var import_type_guards53 = require("@wistia/type-guards");
|
|
12498
12496
|
|
|
12499
12497
|
// src/private/helpers/getBackgroundGradient/getBackgroundGradient.ts
|
|
12500
|
-
var
|
|
12498
|
+
var import_type_guards52 = require("@wistia/type-guards");
|
|
12501
12499
|
var import_styled_components88 = require("styled-components");
|
|
12502
12500
|
var gradients = {
|
|
12503
12501
|
defaultDarkOne: import_styled_components88.css`
|
|
@@ -12625,7 +12623,7 @@ var gradients = {
|
|
|
12625
12623
|
};
|
|
12626
12624
|
var gradientMap = Object.keys(gradients);
|
|
12627
12625
|
var getBackgroundGradient = (gradientName = void 0) => {
|
|
12628
|
-
return (0,
|
|
12626
|
+
return (0, import_type_guards52.isNotNil)(gradientName) ? gradients[gradientName] : gradients.defaultDarkOne;
|
|
12629
12627
|
};
|
|
12630
12628
|
|
|
12631
12629
|
// src/components/Thumbnail/Thumbnail.tsx
|
|
@@ -12659,10 +12657,10 @@ var ThumbnailImage = ({ thumbnailImageType, thumbnailUrl }) => {
|
|
|
12659
12657
|
);
|
|
12660
12658
|
};
|
|
12661
12659
|
var StyledThumbnail = import_styled_components89.default.div`
|
|
12662
|
-
background-image: ${({ $backgroundUrl }) => (0,
|
|
12660
|
+
background-image: ${({ $backgroundUrl }) => (0, import_type_guards53.isNotNil)($backgroundUrl) ? `url('${$backgroundUrl}')` : void 0};
|
|
12663
12661
|
${({ $backgroundUrl, $gradientBackground }) => (
|
|
12664
12662
|
// if we don't have $backgroundUrl show a gradient
|
|
12665
|
-
(0,
|
|
12663
|
+
(0, import_type_guards53.isNil)($backgroundUrl) ? getBackgroundGradient($gradientBackground) : void 0
|
|
12666
12664
|
)};
|
|
12667
12665
|
background-position: center center;
|
|
12668
12666
|
background-size: cover;
|
|
@@ -12686,7 +12684,7 @@ var Thumbnail = (0, import_react66.forwardRef)(
|
|
|
12686
12684
|
children,
|
|
12687
12685
|
...props
|
|
12688
12686
|
}, ref) => {
|
|
12689
|
-
const backgroundUrl = thumbnailImageType === "square" && (0,
|
|
12687
|
+
const backgroundUrl = thumbnailImageType === "square" && (0, import_type_guards53.isNotNil)(thumbnailUrl) ? thumbnailUrl : void 0;
|
|
12690
12688
|
return /* @__PURE__ */ (0, import_jsx_runtime270.jsxs)(
|
|
12691
12689
|
StyledThumbnail,
|
|
12692
12690
|
{
|
|
@@ -12696,8 +12694,8 @@ var Thumbnail = (0, import_react66.forwardRef)(
|
|
|
12696
12694
|
$width: width,
|
|
12697
12695
|
...props,
|
|
12698
12696
|
children: [
|
|
12699
|
-
(0,
|
|
12700
|
-
(0,
|
|
12697
|
+
(0, import_type_guards53.isNotNil)(children) ? children : null,
|
|
12698
|
+
(0, import_type_guards53.isNotNil)(thumbnailUrl) ? /* @__PURE__ */ (0, import_jsx_runtime270.jsx)(
|
|
12701
12699
|
ThumbnailImage,
|
|
12702
12700
|
{
|
|
12703
12701
|
thumbnailImageType,
|
|
@@ -12714,7 +12712,7 @@ Thumbnail.displayName = "Thumbnail";
|
|
|
12714
12712
|
// src/components/InputClickToCopy/InputClickToCopy.tsx
|
|
12715
12713
|
var import_styled_components90 = __toESM(require("styled-components"));
|
|
12716
12714
|
var import_react67 = require("react");
|
|
12717
|
-
var
|
|
12715
|
+
var import_type_guards54 = require("@wistia/type-guards");
|
|
12718
12716
|
var import_jsx_runtime271 = require("react/jsx-runtime");
|
|
12719
12717
|
var StyledInput2 = (0, import_styled_components90.default)(Input)`
|
|
12720
12718
|
&:not([aria-disabled='true']) {
|
|
@@ -12742,12 +12740,12 @@ var InputClickToCopy = (0, import_react67.forwardRef)(
|
|
|
12742
12740
|
}, [isCopied]);
|
|
12743
12741
|
const handleClick = (event) => {
|
|
12744
12742
|
event.preventDefault();
|
|
12745
|
-
if ((0,
|
|
12743
|
+
if ((0, import_type_guards54.isFunction)(props.onClick)) {
|
|
12746
12744
|
props.onClick(event);
|
|
12747
12745
|
}
|
|
12748
12746
|
void copyToClipboard(value).then(() => {
|
|
12749
12747
|
setIsCopied(true);
|
|
12750
|
-
if ((0,
|
|
12748
|
+
if ((0, import_type_guards54.isFunction)(onCopy)) {
|
|
12751
12749
|
onCopy(value);
|
|
12752
12750
|
}
|
|
12753
12751
|
return value;
|