@wistia/ui 0.4.6-beta.d6308289.9117adf → 0.4.6
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 +42 -164
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +9 -49
- package/dist/index.d.ts +9 -49
- package/dist/index.mjs +43 -163
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -4
package/dist/index.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.4.6
|
|
3
|
+
* @license @wistia/ui v0.4.6
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -75,8 +75,6 @@ __export(index_exports, {
|
|
|
75
75
|
RadioGroup: () => RadioGroup,
|
|
76
76
|
RadioMenuItem: () => RadioMenuItem,
|
|
77
77
|
ScreenReaderOnly: () => ScreenReaderOnly,
|
|
78
|
-
SegmentedControl: () => SegmentedControl,
|
|
79
|
-
SegmentedControlItem: () => SegmentedControlItem,
|
|
80
78
|
Stack: () => Stack,
|
|
81
79
|
SubMenu: () => SubMenu,
|
|
82
80
|
Tag: () => Tag,
|
|
@@ -6022,7 +6020,7 @@ var StyledBadge = import_styled_components22.default.div`
|
|
|
6022
6020
|
padding: var(--wui-space-01) var(--wui-space-02);
|
|
6023
6021
|
width: fit-content;
|
|
6024
6022
|
|
|
6025
|
-
/*
|
|
6023
|
+
/* TODO should these be a token? */
|
|
6026
6024
|
svg {
|
|
6027
6025
|
height: 12px;
|
|
6028
6026
|
width: 12px;
|
|
@@ -8426,130 +8424,12 @@ var Radio = (0, import_react37.forwardRef)(
|
|
|
8426
8424
|
);
|
|
8427
8425
|
Radio.displayName = "Radio";
|
|
8428
8426
|
|
|
8429
|
-
// src/components/
|
|
8427
|
+
// src/components/Tag/Tag.tsx
|
|
8430
8428
|
var import_react38 = require("react");
|
|
8431
8429
|
var import_styled_components51 = __toESM(require("styled-components"));
|
|
8432
|
-
var import_react_toggle_group = require("@radix-ui/react-toggle-group");
|
|
8433
8430
|
var import_type_guards30 = require("@wistia/type-guards");
|
|
8434
8431
|
var import_jsx_runtime203 = require("react/jsx-runtime");
|
|
8435
|
-
var
|
|
8436
|
-
display: inline-flex;
|
|
8437
|
-
background-color: var(--wui-color-bg-surface-secondary);
|
|
8438
|
-
border-radius: var(--wui-border-radius-rounded);
|
|
8439
|
-
border: 2px solid var(--wui-color-bg-surface-secondary);
|
|
8440
|
-
gap: var(--wui-space-01);
|
|
8441
|
-
width: ${({ $fullWidth }) => $fullWidth ? "100%" : "auto"};
|
|
8442
|
-
`;
|
|
8443
|
-
var SegmentedControl = (0, import_react38.forwardRef)(
|
|
8444
|
-
({
|
|
8445
|
-
children,
|
|
8446
|
-
fullWidth = false,
|
|
8447
|
-
selectedValue,
|
|
8448
|
-
onSelectedValueChange,
|
|
8449
|
-
...props
|
|
8450
|
-
}, ref) => {
|
|
8451
|
-
if ((0, import_type_guards30.isNil)(children)) {
|
|
8452
|
-
return null;
|
|
8453
|
-
}
|
|
8454
|
-
return /* @__PURE__ */ (0, import_jsx_runtime203.jsx)(
|
|
8455
|
-
StyledSegmentedControl,
|
|
8456
|
-
{
|
|
8457
|
-
ref,
|
|
8458
|
-
$fullWidth: fullWidth,
|
|
8459
|
-
loop: true,
|
|
8460
|
-
onValueChange: onSelectedValueChange,
|
|
8461
|
-
rovingFocus: true,
|
|
8462
|
-
type: "single",
|
|
8463
|
-
value: selectedValue,
|
|
8464
|
-
...props,
|
|
8465
|
-
children
|
|
8466
|
-
}
|
|
8467
|
-
);
|
|
8468
|
-
}
|
|
8469
|
-
);
|
|
8470
|
-
SegmentedControl.displayName = "SegmentedControl";
|
|
8471
|
-
|
|
8472
|
-
// src/components/SegmentedControl/SegmentedControlItem.tsx
|
|
8473
|
-
var import_styled_components52 = __toESM(require("styled-components"));
|
|
8474
|
-
var import_react_toggle_group2 = require("@radix-ui/react-toggle-group");
|
|
8475
|
-
var import_type_guards31 = require("@wistia/type-guards");
|
|
8476
|
-
var import_jsx_runtime204 = require("react/jsx-runtime");
|
|
8477
|
-
var StyledSegmentedControlItem = (0, import_styled_components52.default)(import_react_toggle_group2.Item)`
|
|
8478
|
-
all: unset; /* ToggleGroupItem is a button element */
|
|
8479
|
-
align-items: center;
|
|
8480
|
-
border-radius: var(--wui-border-radius-rounded);
|
|
8481
|
-
color: var(--wui-color-text-secondary);
|
|
8482
|
-
cursor: pointer;
|
|
8483
|
-
display: flex;
|
|
8484
|
-
flex-grow: 1;
|
|
8485
|
-
flex-shrink: 1;
|
|
8486
|
-
font-size: var(--wui-typography-label-3-size);
|
|
8487
|
-
justify-content: center;
|
|
8488
|
-
padding: 6px 8px;
|
|
8489
|
-
user-select: none;
|
|
8490
|
-
|
|
8491
|
-
/* Icon component */
|
|
8492
|
-
svg {
|
|
8493
|
-
height: 16px;
|
|
8494
|
-
width: 16px;
|
|
8495
|
-
|
|
8496
|
-
/* add right margin if there's a label and an icon */
|
|
8497
|
-
${({ $hasLabel }) => $hasLabel ? "margin-right: var(--wui-space-01)" : ""}
|
|
8498
|
-
}
|
|
8499
|
-
|
|
8500
|
-
&:hover {
|
|
8501
|
-
background-color: var(--wui-color-bg-surface-secondary-hover);
|
|
8502
|
-
}
|
|
8503
|
-
|
|
8504
|
-
&:focus-visible {
|
|
8505
|
-
outline: 2px solid var(--wui-color-focus-ring);
|
|
8506
|
-
}
|
|
8507
|
-
|
|
8508
|
-
&[data-state='on'] {
|
|
8509
|
-
background-color: var(--wui-color-bg-fill-white);
|
|
8510
|
-
color: var(--wui-color-text-selected);
|
|
8511
|
-
cursor: default;
|
|
8512
|
-
}
|
|
8513
|
-
|
|
8514
|
-
&:focus-visible,
|
|
8515
|
-
&[data-state='on'] {
|
|
8516
|
-
svg path {
|
|
8517
|
-
fill: var(--wui-color-focus-ring);
|
|
8518
|
-
}
|
|
8519
|
-
}
|
|
8520
|
-
`;
|
|
8521
|
-
var SegmentedControlItem = ({
|
|
8522
|
-
icon,
|
|
8523
|
-
label,
|
|
8524
|
-
value
|
|
8525
|
-
}) => {
|
|
8526
|
-
const handleClick = (event) => {
|
|
8527
|
-
const target = event.target;
|
|
8528
|
-
const { state } = target.dataset;
|
|
8529
|
-
if (state === "on") {
|
|
8530
|
-
event.preventDefault();
|
|
8531
|
-
}
|
|
8532
|
-
};
|
|
8533
|
-
return /* @__PURE__ */ (0, import_jsx_runtime204.jsxs)(
|
|
8534
|
-
StyledSegmentedControlItem,
|
|
8535
|
-
{
|
|
8536
|
-
$hasLabel: (0, import_type_guards31.isNotNil)(label),
|
|
8537
|
-
onClick: handleClick,
|
|
8538
|
-
value,
|
|
8539
|
-
children: [
|
|
8540
|
-
icon,
|
|
8541
|
-
label
|
|
8542
|
-
]
|
|
8543
|
-
}
|
|
8544
|
-
);
|
|
8545
|
-
};
|
|
8546
|
-
|
|
8547
|
-
// src/components/Tag/Tag.tsx
|
|
8548
|
-
var import_react39 = require("react");
|
|
8549
|
-
var import_styled_components53 = __toESM(require("styled-components"));
|
|
8550
|
-
var import_type_guards32 = require("@wistia/type-guards");
|
|
8551
|
-
var import_jsx_runtime205 = require("react/jsx-runtime");
|
|
8552
|
-
var TagLabel = import_styled_components53.default.a`
|
|
8432
|
+
var TagLabel = import_styled_components51.default.a`
|
|
8553
8433
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
8554
8434
|
font-size: var(--wui-typography-label-4-size);
|
|
8555
8435
|
font-weight: var(--wui-typography-label-4-weight);
|
|
@@ -8577,14 +8457,14 @@ var TagLabel = import_styled_components53.default.a`
|
|
|
8577
8457
|
box-shadow: inset 0 0 0 2px var(--wui-color-border-secondary);
|
|
8578
8458
|
}
|
|
8579
8459
|
`;
|
|
8580
|
-
var TagDivider =
|
|
8460
|
+
var TagDivider = import_styled_components51.default.div`
|
|
8581
8461
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
8582
8462
|
border-left: 1px solid var(--wui-color-border);
|
|
8583
8463
|
display: flex;
|
|
8584
8464
|
height: 14px;
|
|
8585
8465
|
width: 1px;
|
|
8586
8466
|
`;
|
|
8587
|
-
var StyledRemoveButton =
|
|
8467
|
+
var StyledRemoveButton = import_styled_components51.default.button`
|
|
8588
8468
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
8589
8469
|
all: unset;
|
|
8590
8470
|
cursor: pointer;
|
|
@@ -8612,7 +8492,7 @@ var StyledRemoveButton = import_styled_components53.default.button`
|
|
|
8612
8492
|
box-shadow: inset 0 0 0 2px var(--wui-color-border-secondary);
|
|
8613
8493
|
}
|
|
8614
8494
|
`;
|
|
8615
|
-
var StyledTag =
|
|
8495
|
+
var StyledTag = import_styled_components51.default.div`
|
|
8616
8496
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
8617
8497
|
align-items: center;
|
|
8618
8498
|
background-color: var(--wui-color-bg-surface-secondary);
|
|
@@ -8621,47 +8501,47 @@ var StyledTag = import_styled_components53.default.div`
|
|
|
8621
8501
|
overflow: hidden;
|
|
8622
8502
|
`;
|
|
8623
8503
|
var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
|
|
8624
|
-
if ((0,
|
|
8504
|
+
if ((0, import_type_guards30.isNil)(onClickRemove)) {
|
|
8625
8505
|
return null;
|
|
8626
8506
|
}
|
|
8627
|
-
if ((0,
|
|
8507
|
+
if ((0, import_type_guards30.isNil)(onClickRemoveLabel)) {
|
|
8628
8508
|
throw new Error(
|
|
8629
8509
|
"for accessibility, onClickRemoveLabel must be provided if onClickRemove is provided"
|
|
8630
8510
|
);
|
|
8631
8511
|
}
|
|
8632
|
-
return /* @__PURE__ */ (0,
|
|
8633
|
-
/* @__PURE__ */ (0,
|
|
8634
|
-
/* @__PURE__ */ (0,
|
|
8512
|
+
return /* @__PURE__ */ (0, import_jsx_runtime203.jsxs)(import_jsx_runtime203.Fragment, { children: [
|
|
8513
|
+
/* @__PURE__ */ (0, import_jsx_runtime203.jsx)(TagDivider, { $colorScheme: colorScheme }),
|
|
8514
|
+
/* @__PURE__ */ (0, import_jsx_runtime203.jsxs)(
|
|
8635
8515
|
StyledRemoveButton,
|
|
8636
8516
|
{
|
|
8637
8517
|
$colorScheme: colorScheme,
|
|
8638
8518
|
onClick: onClickRemove,
|
|
8639
8519
|
type: "button",
|
|
8640
8520
|
children: [
|
|
8641
|
-
/* @__PURE__ */ (0,
|
|
8521
|
+
/* @__PURE__ */ (0, import_jsx_runtime203.jsx)(
|
|
8642
8522
|
Icon,
|
|
8643
8523
|
{
|
|
8644
8524
|
size: "sm",
|
|
8645
8525
|
type: "close"
|
|
8646
8526
|
}
|
|
8647
8527
|
),
|
|
8648
|
-
/* @__PURE__ */ (0,
|
|
8528
|
+
/* @__PURE__ */ (0, import_jsx_runtime203.jsx)(ScreenReaderOnly, { children: onClickRemoveLabel })
|
|
8649
8529
|
]
|
|
8650
8530
|
}
|
|
8651
8531
|
)
|
|
8652
8532
|
] });
|
|
8653
8533
|
};
|
|
8654
|
-
var Tag = (0,
|
|
8534
|
+
var Tag = (0, import_react38.forwardRef)(
|
|
8655
8535
|
({ onClickRemove, colorScheme = "inherit", href, label, onClickRemoveLabel, ...otherProps }, ref) => {
|
|
8656
|
-
const labelProps = (0,
|
|
8657
|
-
return /* @__PURE__ */ (0,
|
|
8536
|
+
const labelProps = (0, import_type_guards30.isNotNil)(href) && (0, import_type_guards30.isNonEmptyString)(href) ? { href, as: "a" } : { as: "span" };
|
|
8537
|
+
return /* @__PURE__ */ (0, import_jsx_runtime203.jsxs)(
|
|
8658
8538
|
StyledTag,
|
|
8659
8539
|
{
|
|
8660
8540
|
ref,
|
|
8661
8541
|
$colorScheme: colorScheme,
|
|
8662
8542
|
...otherProps,
|
|
8663
8543
|
children: [
|
|
8664
|
-
/* @__PURE__ */ (0,
|
|
8544
|
+
/* @__PURE__ */ (0, import_jsx_runtime203.jsx)(
|
|
8665
8545
|
TagLabel,
|
|
8666
8546
|
{
|
|
8667
8547
|
...labelProps,
|
|
@@ -8669,7 +8549,7 @@ var Tag = (0, import_react39.forwardRef)(
|
|
|
8669
8549
|
children: label
|
|
8670
8550
|
}
|
|
8671
8551
|
),
|
|
8672
|
-
/* @__PURE__ */ (0,
|
|
8552
|
+
/* @__PURE__ */ (0, import_jsx_runtime203.jsx)(
|
|
8673
8553
|
RemoveButton,
|
|
8674
8554
|
{
|
|
8675
8555
|
colorScheme,
|
|
@@ -8686,16 +8566,16 @@ Tag.displayName = "Tag";
|
|
|
8686
8566
|
|
|
8687
8567
|
// src/components/Tooltip/Tooltip.tsx
|
|
8688
8568
|
var import_react_tooltip2 = require("@radix-ui/react-tooltip");
|
|
8689
|
-
var
|
|
8690
|
-
var
|
|
8691
|
-
var CompactTooltipStyles =
|
|
8569
|
+
var import_styled_components52 = __toESM(require("styled-components"));
|
|
8570
|
+
var import_jsx_runtime204 = require("react/jsx-runtime");
|
|
8571
|
+
var CompactTooltipStyles = import_styled_components52.css`
|
|
8692
8572
|
--tooltip-font-size: var(--wui-typography-label-4-size);
|
|
8693
8573
|
--tooltip-line-height: var(--wui-typography-label-4-line-height);
|
|
8694
8574
|
--tooltip-font-weight: var(--wui-typography-label-4-weight);
|
|
8695
8575
|
--tooltip-horizontal-padding: var(--wui-space-02);
|
|
8696
8576
|
--tooltip-vertical-padding: var(--wui-space-03);
|
|
8697
8577
|
`;
|
|
8698
|
-
var StyledContent = (0,
|
|
8578
|
+
var StyledContent = (0, import_styled_components52.default)(import_react_tooltip2.Content)`
|
|
8699
8579
|
--tooltip-font-family: var(--wui-typography-family-default);
|
|
8700
8580
|
--tooltip-border-radius: var(--wui-border-radius-05);
|
|
8701
8581
|
--tooltip-bg: var(--wui-color-bg-tooltip);
|
|
@@ -8753,14 +8633,14 @@ var Tooltip = ({
|
|
|
8753
8633
|
if (forceOpen === true) {
|
|
8754
8634
|
rootProps.open = true;
|
|
8755
8635
|
}
|
|
8756
|
-
return /* @__PURE__ */ (0,
|
|
8636
|
+
return /* @__PURE__ */ (0, import_jsx_runtime204.jsxs)(
|
|
8757
8637
|
import_react_tooltip2.Root,
|
|
8758
8638
|
{
|
|
8759
8639
|
delayDuration: delay,
|
|
8760
8640
|
...rootProps,
|
|
8761
8641
|
children: [
|
|
8762
|
-
/* @__PURE__ */ (0,
|
|
8763
|
-
/* @__PURE__ */ (0,
|
|
8642
|
+
/* @__PURE__ */ (0, import_jsx_runtime204.jsx)(import_react_tooltip2.Trigger, { asChild: true, children }),
|
|
8643
|
+
/* @__PURE__ */ (0, import_jsx_runtime204.jsx)(import_react_tooltip2.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime204.jsxs)(
|
|
8764
8644
|
StyledContent,
|
|
8765
8645
|
{
|
|
8766
8646
|
$compact: compact,
|
|
@@ -8768,7 +8648,7 @@ var Tooltip = ({
|
|
|
8768
8648
|
sideOffset: hideArrow ? VISUAL_OFFSET : VISUAL_OFFSET - 2,
|
|
8769
8649
|
children: [
|
|
8770
8650
|
content,
|
|
8771
|
-
!hideArrow ? /* @__PURE__ */ (0,
|
|
8651
|
+
!hideArrow ? /* @__PURE__ */ (0, import_jsx_runtime204.jsx)(import_react_tooltip2.Arrow, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime204.jsx)(
|
|
8772
8652
|
"svg",
|
|
8773
8653
|
{
|
|
8774
8654
|
fill: "var(--tooltip-bg)",
|
|
@@ -8777,7 +8657,7 @@ var Tooltip = ({
|
|
|
8777
8657
|
viewBox: "0 0 12 8",
|
|
8778
8658
|
width: "12",
|
|
8779
8659
|
xmlns: "http://www.w3.org/2000/svg",
|
|
8780
|
-
children: /* @__PURE__ */ (0,
|
|
8660
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime204.jsx)("path", { d: "M6.8 6.93333C6.4 7.46667 5.6 7.46667 5.2 6.93333L-2.54292e-07 -1.04907e-06L12 0L6.8 6.93333Z" })
|
|
8781
8661
|
}
|
|
8782
8662
|
) }) : null
|
|
8783
8663
|
]
|
|
@@ -8790,26 +8670,26 @@ var Tooltip = ({
|
|
|
8790
8670
|
Tooltip.displayName = "Tooltip";
|
|
8791
8671
|
|
|
8792
8672
|
// src/components/WistiaLogo/WistiaLogo.tsx
|
|
8793
|
-
var
|
|
8794
|
-
var
|
|
8795
|
-
var
|
|
8673
|
+
var import_styled_components53 = __toESM(require("styled-components"));
|
|
8674
|
+
var import_type_guards31 = require("@wistia/type-guards");
|
|
8675
|
+
var import_jsx_runtime205 = require("react/jsx-runtime");
|
|
8796
8676
|
var renderBrandmark = (brandmarkColor, iconOnly) => {
|
|
8797
8677
|
if (iconOnly) {
|
|
8798
|
-
return /* @__PURE__ */ (0,
|
|
8678
|
+
return /* @__PURE__ */ (0, import_jsx_runtime205.jsx)(
|
|
8799
8679
|
"g",
|
|
8800
8680
|
{
|
|
8801
8681
|
"data-testid": "ui-wistia-logo-brandmark",
|
|
8802
8682
|
fill: brandmarkColor,
|
|
8803
|
-
children: /* @__PURE__ */ (0,
|
|
8683
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime205.jsx)("path", { d: "M16.09 17.1h-5.2c-1.58 0-3.08.68-4.11 1.87L.21 26.53c4.78.25 9.78.25 13.3.25 18.31 0 20.89-11.27 20.89-16.55-1.59 1.93-6.06 6.87-18.32 6.87ZM32.14 0c-.08.92-.59 4.69-11.31 4.69-8.72 0-12.24 0-20.83-.17l6.44 7.4a6.657 6.657 0 0 0 4.96 2.3c2.13.03 5.05.06 5.53.06 11.01 0 17.19-5.05 17.19-9.89 0-2.01-.67-3.44-1.97-4.4Z" })
|
|
8804
8684
|
}
|
|
8805
8685
|
);
|
|
8806
8686
|
}
|
|
8807
|
-
return /* @__PURE__ */ (0,
|
|
8687
|
+
return /* @__PURE__ */ (0, import_jsx_runtime205.jsx)(
|
|
8808
8688
|
"g",
|
|
8809
8689
|
{
|
|
8810
8690
|
"data-testid": "ui-wistia-logo-brandmark",
|
|
8811
8691
|
fill: brandmarkColor,
|
|
8812
|
-
children: /* @__PURE__ */ (0,
|
|
8692
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime205.jsx)("path", { d: "M16.09 21.37h-5.2c-1.58 0-3.08.68-4.11 1.87L.21 30.8c4.78.25 9.78.25 13.3.25 18.31 0 20.89-11.27 20.89-16.55-1.59 1.93-6.06 6.87-18.32 6.87Zm16.05-17.1c-.08.92-.59 4.69-11.31 4.69-8.72 0-12.24 0-20.83-.17l6.44 7.4a6.657 6.657 0 0 0 4.96 2.3c2.13.03 5.05.06 5.53.06 11.01 0 17.19-5.05 17.19-9.89 0-2.01-.67-3.44-1.97-4.4Z" })
|
|
8813
8693
|
}
|
|
8814
8694
|
);
|
|
8815
8695
|
};
|
|
@@ -8817,12 +8697,12 @@ var renderLogotype = (logotypeColor, iconOnly) => {
|
|
|
8817
8697
|
if (iconOnly) {
|
|
8818
8698
|
return null;
|
|
8819
8699
|
}
|
|
8820
|
-
return /* @__PURE__ */ (0,
|
|
8700
|
+
return /* @__PURE__ */ (0, import_jsx_runtime205.jsx)(
|
|
8821
8701
|
"g",
|
|
8822
8702
|
{
|
|
8823
8703
|
"data-testid": "ui-wistia-logo-logotype",
|
|
8824
8704
|
fill: logotypeColor,
|
|
8825
|
-
children: /* @__PURE__ */ (0,
|
|
8705
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime205.jsx)("path", { d: "M70.16 8.66v15.18c0 1.68-.35 3.09-1.05 4.23a6.612 6.612 0 0 1-2.85 2.54c-1.19.55-2.52.82-4.01.82s-2.8-.28-4.01-.85a6.655 6.655 0 0 1-3.11-2.96c-.08.15-.16.29-.24.42a6.552 6.552 0 0 1-2.87 2.54c-1.2.56-2.54.85-4.01.85s-2.8-.27-3.94-.82a6.214 6.214 0 0 1-2.71-2.52c-.67-1.14-1.01-2.56-1.02-4.25l-.22-15.18h7.34V22.3c0 .82.19 1.37.56 1.67.39.28.85.42 1.38.42s1.02-.15 1.45-.45c.43-.3.65-.85.65-1.65V8.65h7.3v13.64c0 .8.22 1.35.65 1.65.43.3.91.45 1.45.45s.99-.14 1.36-.42c.39-.3.58-.85.58-1.67V8.66h7.34Zm2.45 0v22.26h7.34V8.66h-7.34Zm5.67-1.87c.61-.3 1.08-.71 1.42-1.25.36-.55.53-1.19.53-1.94s-.18-1.34-.53-1.89A3.43 3.43 0 0 0 78.28.44c-.59-.3-1.25-.45-1.98-.45s-1.42.15-2.02.45c-.59.3-1.07.72-1.42 1.27-.36.55-.53 1.18-.53 1.89 0 1.1.38 1.97 1.13 2.63.76.65 1.71.98 2.85.98.73 0 1.39-.14 1.98-.42Zm8.86 1.96c-1.42.4-2.6 1.11-3.54 2.14-.93 1.02-1.4 2.4-1.4 4.12 0 1.11.17 2.09.51 2.94.36.85.82 1.62 1.38 2.34.22.28.55.65.98 1.11.37.4.64.72.8.96.18.24.27.47.27.69 0 .5-.4.87-1.2 1.09-.8.21-1.62.31-2.47.31-.1-.01-.22-.02-.33-.02l1.02 6.94c.42.07.92.11 1.51.11 1.9 0 3.6-.28 5.1-.85 1.5-.56 2.68-1.42 3.54-2.56.88-1.14 1.31-2.55 1.31-4.23 0-.68-.07-1.31-.22-1.87-.13-.58-.32-1.09-.56-1.54a6.64 6.64 0 0 0-.8-1.27c-.3-.37-.74-.82-1.34-1.36-.39-.33-.67-.59-.85-.8-.18-.22-.27-.45-.27-.67 0-.46.26-.79.78-.98.53-.19 1.17-.29 1.91-.29.25 0 .51.01.78.04l-.71-6.88a10.4 10.4 0 0 0-1.56-.11c-1.66 0-3.21.21-4.65.62Zm19.54 15.71c-.99 0-1.71-.23-2.14-.69-.42-.47-.62-1.18-.62-2.11v-6.57h4.21V8.66h-4.21V3.38l-7.34 1.85V24.1c0 2.45.47 4.29 1.4 5.52.95 1.22 2.45 1.83 4.49 1.83.95 0 1.86-.07 2.74-.22.88-.13 1.62-.34 2.25-.62l1.38-6.3c-.55.1-1.27.16-2.16.16Zm4.13-15.8v22.26h7.34V8.66h-7.34Zm5.67-1.87c.61-.3 1.08-.71 1.42-1.25.36-.55.53-1.19.53-1.94s-.18-1.34-.53-1.89a3.43 3.43 0 0 0-1.42-1.27c-.59-.3-1.25-.45-1.98-.45s-1.42.15-2.02.45c-.59.3-1.07.72-1.42 1.27-.36.55-.53 1.18-.53 1.89 0 1.1.38 1.97 1.14 2.63.76.65 1.71.98 2.85.98.73 0 1.39-.14 1.98-.42Zm27.51 1.87v22.26h-7.34v-2.28c-.41.43-.85.83-1.34 1.19-1.44 1.07-3.12 1.6-5.05 1.6s-3.61-.52-5.1-1.56c-1.48-1.05-2.63-2.47-3.45-4.25-.82-1.78-1.22-3.73-1.22-5.85s.41-4.07 1.22-5.83c.82-1.78 1.97-3.19 3.45-4.23 1.48-1.05 3.18-1.58 5.1-1.58s3.61.53 5.05 1.6c.48.36.93.75 1.34 1.19V8.66h7.34Zm-7.1 11.11c0-.8-.19-1.53-.56-2.18-.37-.67-.88-1.19-1.54-1.58-.64-.39-1.34-.58-2.09-.58s-1.45.19-2.09.58c-.64.39-1.15.91-1.54 1.58-.37.67-.56 1.39-.56 2.18s.19 1.51.56 2.18c.39.67.9 1.19 1.54 1.58.64.39 1.34.58 2.09.58s1.45-.19 2.09-.58c.65-.39 1.16-.91 1.54-1.56.37-.67.56-1.4.56-2.2Z" })
|
|
8826
8706
|
}
|
|
8827
8707
|
);
|
|
8828
8708
|
};
|
|
@@ -8832,7 +8712,7 @@ var computedViewBox = (iconOnly) => {
|
|
|
8832
8712
|
}
|
|
8833
8713
|
return "0 0 144 31.47";
|
|
8834
8714
|
};
|
|
8835
|
-
var WistiaLogoComponent =
|
|
8715
|
+
var WistiaLogoComponent = import_styled_components53.default.svg`
|
|
8836
8716
|
height: ${({ height }) => `${height}px`};
|
|
8837
8717
|
|
|
8838
8718
|
/* ensure it will always fit on mobile */
|
|
@@ -8874,7 +8754,7 @@ var WistiaLogo = ({
|
|
|
8874
8754
|
};
|
|
8875
8755
|
const brandmarkColor = VARIANT_COLORS[variant].brandmark;
|
|
8876
8756
|
const logotypeColor = VARIANT_COLORS[variant].logotype;
|
|
8877
|
-
const Logo = /* @__PURE__ */ (0,
|
|
8757
|
+
const Logo = /* @__PURE__ */ (0, import_jsx_runtime205.jsxs)(
|
|
8878
8758
|
WistiaLogoComponent,
|
|
8879
8759
|
{
|
|
8880
8760
|
$hoverColor: hoverColor,
|
|
@@ -8884,14 +8764,14 @@ var WistiaLogo = ({
|
|
|
8884
8764
|
xmlns: "http://www.w3.org/2000/svg",
|
|
8885
8765
|
...otherProps,
|
|
8886
8766
|
children: [
|
|
8887
|
-
/* @__PURE__ */ (0,
|
|
8888
|
-
(0,
|
|
8767
|
+
/* @__PURE__ */ (0, import_jsx_runtime205.jsx)("title", { children: title }),
|
|
8768
|
+
(0, import_type_guards31.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime205.jsx)("desc", { children: description }) : null,
|
|
8889
8769
|
renderBrandmark(brandmarkColor, iconOnly),
|
|
8890
8770
|
renderLogotype(logotypeColor, iconOnly)
|
|
8891
8771
|
]
|
|
8892
8772
|
}
|
|
8893
8773
|
);
|
|
8894
|
-
return href !== void 0 ? /* @__PURE__ */ (0,
|
|
8774
|
+
return href !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime205.jsx)("a", { href, children: Logo }) : Logo;
|
|
8895
8775
|
};
|
|
8896
8776
|
WistiaLogo.displayName = "WistiaLogo";
|
|
8897
8777
|
// Annotate the CommonJS export names for ESM import in node:
|
|
@@ -8932,8 +8812,6 @@ WistiaLogo.displayName = "WistiaLogo";
|
|
|
8932
8812
|
RadioGroup,
|
|
8933
8813
|
RadioMenuItem,
|
|
8934
8814
|
ScreenReaderOnly,
|
|
8935
|
-
SegmentedControl,
|
|
8936
|
-
SegmentedControlItem,
|
|
8937
8815
|
Stack,
|
|
8938
8816
|
SubMenu,
|
|
8939
8817
|
Tag,
|