@wistia/ui 0.9.1-beta.e028a78e.bb9fef4 → 0.9.1
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 +281 -385
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +5 -34
- package/dist/index.d.ts +5 -34
- package/dist/index.mjs +243 -345
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.9.1
|
|
3
|
+
* @license @wistia/ui v0.9.1
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -10208,7 +10208,6 @@ var KeyboardShortcut = ({
|
|
|
10208
10208
|
KeyboardShortcut.displayName = "KeyboardShortcut";
|
|
10209
10209
|
|
|
10210
10210
|
// src/components/Menu/Menu.tsx
|
|
10211
|
-
import { forwardRef as forwardRef15, useMemo as useMemo7 } from "react";
|
|
10212
10211
|
import styled40, { css as css29, keyframes as keyframes3 } from "styled-components";
|
|
10213
10212
|
import {
|
|
10214
10213
|
DropdownMenu,
|
|
@@ -10217,6 +10216,7 @@ import {
|
|
|
10217
10216
|
DropdownMenuContent
|
|
10218
10217
|
} from "@radix-ui/react-dropdown-menu";
|
|
10219
10218
|
import { isNotNil as isNotNil19, isNotUndefined as isNotUndefined10 } from "@wistia/type-guards";
|
|
10219
|
+
import { useMemo as useMemo7 } from "react";
|
|
10220
10220
|
|
|
10221
10221
|
// src/components/Menu/MenuContext.tsx
|
|
10222
10222
|
import { createContext as createContext6, useContext as useContext5 } from "react";
|
|
@@ -10311,70 +10311,65 @@ var menuContentCss = css29`
|
|
|
10311
10311
|
`;
|
|
10312
10312
|
var MenuContent = styled40(DropdownMenuContent)`
|
|
10313
10313
|
${menuContentCss}
|
|
10314
|
-
min-width: var(--radix-dropdown-menu-trigger-width);
|
|
10315
10314
|
`;
|
|
10316
|
-
var Menu =
|
|
10317
|
-
|
|
10318
|
-
|
|
10319
|
-
|
|
10320
|
-
|
|
10321
|
-
|
|
10322
|
-
|
|
10323
|
-
|
|
10324
|
-
|
|
10325
|
-
|
|
10326
|
-
|
|
10327
|
-
|
|
10328
|
-
|
|
10329
|
-
|
|
10330
|
-
|
|
10331
|
-
|
|
10332
|
-
|
|
10315
|
+
var Menu = ({
|
|
10316
|
+
align = "start",
|
|
10317
|
+
children,
|
|
10318
|
+
disabled = false,
|
|
10319
|
+
compact = false,
|
|
10320
|
+
trigger,
|
|
10321
|
+
label,
|
|
10322
|
+
isOpen,
|
|
10323
|
+
triggerProps = {},
|
|
10324
|
+
onOpenChange,
|
|
10325
|
+
onInteractOutside,
|
|
10326
|
+
...props
|
|
10327
|
+
}) => {
|
|
10328
|
+
const contextValue = useMemo7(() => ({ compact }), [compact]);
|
|
10329
|
+
let controlProps = {
|
|
10330
|
+
...isNotNil19(onOpenChange) && isNotNil19(isOpen) ? { open: isOpen, onOpenChange } : {}
|
|
10331
|
+
};
|
|
10332
|
+
if (disabled) {
|
|
10333
|
+
controlProps = {
|
|
10334
|
+
open: false,
|
|
10335
|
+
onOpenChange: () => null
|
|
10333
10336
|
};
|
|
10334
|
-
if (disabled) {
|
|
10335
|
-
controlProps = {
|
|
10336
|
-
open: false,
|
|
10337
|
-
onOpenChange: () => null
|
|
10338
|
-
};
|
|
10339
|
-
}
|
|
10340
|
-
return /* @__PURE__ */ jsx232(MenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs26(
|
|
10341
|
-
DropdownMenu,
|
|
10342
|
-
{
|
|
10343
|
-
modal: false,
|
|
10344
|
-
...controlProps,
|
|
10345
|
-
children: [
|
|
10346
|
-
/* @__PURE__ */ jsx232(DropdownMenuTrigger, { asChild: true, children: isNotUndefined10(trigger) ? trigger : /* @__PURE__ */ jsx232(
|
|
10347
|
-
Button,
|
|
10348
|
-
{
|
|
10349
|
-
ref,
|
|
10350
|
-
"aria-expanded": isOpen,
|
|
10351
|
-
disabled,
|
|
10352
|
-
forceState: isOpen ? "active" : void 0,
|
|
10353
|
-
rightIcon: /* @__PURE__ */ jsx232(Icon, { type: "caret-down" }),
|
|
10354
|
-
...triggerProps,
|
|
10355
|
-
children: label
|
|
10356
|
-
}
|
|
10357
|
-
) }),
|
|
10358
|
-
/* @__PURE__ */ jsx232(DropdownMenuPortal, { children: /* @__PURE__ */ jsx232(
|
|
10359
|
-
MenuContent,
|
|
10360
|
-
{
|
|
10361
|
-
...props,
|
|
10362
|
-
$compact: compact,
|
|
10363
|
-
align,
|
|
10364
|
-
collisionPadding: 8,
|
|
10365
|
-
sideOffset: 6,
|
|
10366
|
-
onFocusOutside: (event) => {
|
|
10367
|
-
event.preventDefault();
|
|
10368
|
-
},
|
|
10369
|
-
children
|
|
10370
|
-
}
|
|
10371
|
-
) })
|
|
10372
|
-
]
|
|
10373
|
-
}
|
|
10374
|
-
) });
|
|
10375
10337
|
}
|
|
10376
|
-
|
|
10377
|
-
|
|
10338
|
+
return /* @__PURE__ */ jsx232(MenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs26(
|
|
10339
|
+
DropdownMenu,
|
|
10340
|
+
{
|
|
10341
|
+
modal: false,
|
|
10342
|
+
...controlProps,
|
|
10343
|
+
children: [
|
|
10344
|
+
/* @__PURE__ */ jsx232(DropdownMenuTrigger, { asChild: true, children: isNotUndefined10(trigger) ? trigger : /* @__PURE__ */ jsx232(
|
|
10345
|
+
Button,
|
|
10346
|
+
{
|
|
10347
|
+
"aria-expanded": isOpen,
|
|
10348
|
+
disabled,
|
|
10349
|
+
forceState: isOpen ? "active" : void 0,
|
|
10350
|
+
rightIcon: /* @__PURE__ */ jsx232(Icon, { type: "caret-down" }),
|
|
10351
|
+
...triggerProps,
|
|
10352
|
+
children: label
|
|
10353
|
+
}
|
|
10354
|
+
) }),
|
|
10355
|
+
/* @__PURE__ */ jsx232(DropdownMenuPortal, { children: /* @__PURE__ */ jsx232(
|
|
10356
|
+
MenuContent,
|
|
10357
|
+
{
|
|
10358
|
+
...props,
|
|
10359
|
+
$compact: compact,
|
|
10360
|
+
align,
|
|
10361
|
+
collisionPadding: 8,
|
|
10362
|
+
sideOffset: 6,
|
|
10363
|
+
onFocusOutside: (event) => {
|
|
10364
|
+
event.preventDefault();
|
|
10365
|
+
},
|
|
10366
|
+
children
|
|
10367
|
+
}
|
|
10368
|
+
) })
|
|
10369
|
+
]
|
|
10370
|
+
}
|
|
10371
|
+
) });
|
|
10372
|
+
};
|
|
10378
10373
|
Menu.displayName = "Menu";
|
|
10379
10374
|
|
|
10380
10375
|
// src/components/Menu/MenuLabel.tsx
|
|
@@ -10418,7 +10413,7 @@ import {
|
|
|
10418
10413
|
import { isNotNil as isNotNil21 } from "@wistia/type-guards";
|
|
10419
10414
|
|
|
10420
10415
|
// src/components/Menu/MenuItemButton.tsx
|
|
10421
|
-
import { forwardRef as
|
|
10416
|
+
import { forwardRef as forwardRef15 } from "react";
|
|
10422
10417
|
import styled42 from "styled-components";
|
|
10423
10418
|
import { isNotNil as isNotNil20, isNotUndefined as isNotUndefined11 } from "@wistia/type-guards";
|
|
10424
10419
|
import { jsx as jsx234, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
@@ -10495,7 +10490,7 @@ var StyledBadgeContainer = styled42.div`
|
|
|
10495
10490
|
font-size: var(--wui-typography-label-4-size);
|
|
10496
10491
|
color: var(--wui-color-text-secondary);
|
|
10497
10492
|
`;
|
|
10498
|
-
var MenuItemButton =
|
|
10493
|
+
var MenuItemButton = forwardRef15(({ children, appearance, command, icon, ...props }, ref) => {
|
|
10499
10494
|
let { colorScheme, badge } = props;
|
|
10500
10495
|
if (appearance === "dangerous") {
|
|
10501
10496
|
if (isNotUndefined11(colorScheme)) {
|
|
@@ -10624,10 +10619,10 @@ var SubMenu = ({
|
|
|
10624
10619
|
SubMenu.displayName = "SubMenu";
|
|
10625
10620
|
|
|
10626
10621
|
// src/components/Menu/MenuItem.tsx
|
|
10627
|
-
import { forwardRef as
|
|
10622
|
+
import { forwardRef as forwardRef16 } from "react";
|
|
10628
10623
|
import { DropdownMenuItem as DropdownMenuItem2 } from "@radix-ui/react-dropdown-menu";
|
|
10629
10624
|
import { jsx as jsx237 } from "react/jsx-runtime";
|
|
10630
|
-
var MenuItem =
|
|
10625
|
+
var MenuItem = forwardRef16(
|
|
10631
10626
|
({ onSelect = () => null, ...props }, ref) => {
|
|
10632
10627
|
return /* @__PURE__ */ jsx237(
|
|
10633
10628
|
DropdownMenuItem2,
|
|
@@ -10783,103 +10778,8 @@ var CheckboxMenuItem = ({
|
|
|
10783
10778
|
};
|
|
10784
10779
|
CheckboxMenuItem.displayName = "CheckboxMenuItem";
|
|
10785
10780
|
|
|
10786
|
-
// src/components/Menu/FilterMenu.tsx
|
|
10787
|
-
import { Children as Children6, forwardRef as forwardRef18 } from "react";
|
|
10788
|
-
import { jsx as jsx241, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
10789
|
-
var FilterMenuItem = CheckboxMenuItem;
|
|
10790
|
-
var FilterMenu = forwardRef18(
|
|
10791
|
-
({ value, onChange, searchValue, onSearchValueChange, children, ...props }, ref) => {
|
|
10792
|
-
return /* @__PURE__ */ jsxs30(
|
|
10793
|
-
Menu,
|
|
10794
|
-
{
|
|
10795
|
-
...props,
|
|
10796
|
-
ref,
|
|
10797
|
-
isOpen: true,
|
|
10798
|
-
children: [
|
|
10799
|
-
/* @__PURE__ */ jsx241(
|
|
10800
|
-
Card,
|
|
10801
|
-
{
|
|
10802
|
-
alignItems: "flex-end",
|
|
10803
|
-
border: false,
|
|
10804
|
-
borderRadius: "border-radius-02",
|
|
10805
|
-
paddingSize: "space-01",
|
|
10806
|
-
prominence: "default",
|
|
10807
|
-
style: {
|
|
10808
|
-
position: "absolute",
|
|
10809
|
-
top: 0,
|
|
10810
|
-
left: 0,
|
|
10811
|
-
right: 0,
|
|
10812
|
-
margin: "1px"
|
|
10813
|
-
},
|
|
10814
|
-
children: /* @__PURE__ */ jsx241(
|
|
10815
|
-
Input,
|
|
10816
|
-
{
|
|
10817
|
-
autoFocus: true,
|
|
10818
|
-
onChange: (event) => {
|
|
10819
|
-
onSearchValueChange(event.target.value);
|
|
10820
|
-
},
|
|
10821
|
-
onClick: (event) => event.preventDefault(),
|
|
10822
|
-
onKeyDown: (event) => {
|
|
10823
|
-
if (event.key === "ArrowDown") {
|
|
10824
|
-
event.preventDefault();
|
|
10825
|
-
const menu = document.querySelector('[role="menu"]');
|
|
10826
|
-
const firstMenuItem = menu?.querySelector('[role="menuitemcheckbox"]');
|
|
10827
|
-
if (firstMenuItem) {
|
|
10828
|
-
firstMenuItem.focus();
|
|
10829
|
-
}
|
|
10830
|
-
}
|
|
10831
|
-
event.stopPropagation();
|
|
10832
|
-
},
|
|
10833
|
-
placeholder: "Search...",
|
|
10834
|
-
tabIndex: 0,
|
|
10835
|
-
type: "search"
|
|
10836
|
-
}
|
|
10837
|
-
)
|
|
10838
|
-
}
|
|
10839
|
-
),
|
|
10840
|
-
/* @__PURE__ */ jsx241(
|
|
10841
|
-
MenuItem,
|
|
10842
|
-
{
|
|
10843
|
-
disabled: true,
|
|
10844
|
-
style: { padding: "16px" },
|
|
10845
|
-
children: " "
|
|
10846
|
-
}
|
|
10847
|
-
),
|
|
10848
|
-
Children6.toArray(children).length > 0 ? children : /* @__PURE__ */ jsx241(MenuItem, { disabled: true, children: "No results found" }),
|
|
10849
|
-
value.length > 0 && /* @__PURE__ */ jsx241(MenuItem, { disabled: true, children: /* @__PURE__ */ jsx241(
|
|
10850
|
-
Card,
|
|
10851
|
-
{
|
|
10852
|
-
alignItems: "flex-end",
|
|
10853
|
-
border: false,
|
|
10854
|
-
borderRadius: "border-radius-02",
|
|
10855
|
-
paddingSize: "space-01",
|
|
10856
|
-
prominence: "default",
|
|
10857
|
-
style: {
|
|
10858
|
-
position: "absolute",
|
|
10859
|
-
bottom: 0,
|
|
10860
|
-
left: 0,
|
|
10861
|
-
right: 0,
|
|
10862
|
-
margin: "1px"
|
|
10863
|
-
},
|
|
10864
|
-
children: /* @__PURE__ */ jsx241(
|
|
10865
|
-
Button,
|
|
10866
|
-
{
|
|
10867
|
-
onClick: () => onChange([]),
|
|
10868
|
-
size: "sm",
|
|
10869
|
-
children: "Clear"
|
|
10870
|
-
}
|
|
10871
|
-
)
|
|
10872
|
-
}
|
|
10873
|
-
) })
|
|
10874
|
-
]
|
|
10875
|
-
}
|
|
10876
|
-
);
|
|
10877
|
-
}
|
|
10878
|
-
);
|
|
10879
|
-
FilterMenu.displayName = "FilterMenu";
|
|
10880
|
-
|
|
10881
10781
|
// src/components/Modal/Modal.tsx
|
|
10882
|
-
import { forwardRef as
|
|
10782
|
+
import { forwardRef as forwardRef19 } from "react";
|
|
10883
10783
|
import styled49 from "styled-components";
|
|
10884
10784
|
import { Root as DialogRoot, Portal as DialogPortal } from "@radix-ui/react-dialog";
|
|
10885
10785
|
import { isNotNil as isNotNil24 } from "@wistia/type-guards";
|
|
@@ -10891,24 +10791,24 @@ import { Title as DialogTitle } from "@radix-ui/react-dialog";
|
|
|
10891
10791
|
// src/components/Modal/ModalCloseButton.tsx
|
|
10892
10792
|
import styled45 from "styled-components";
|
|
10893
10793
|
import { Close as DialogClose } from "@radix-ui/react-dialog";
|
|
10894
|
-
import { jsx as
|
|
10794
|
+
import { jsx as jsx241 } from "react/jsx-runtime";
|
|
10895
10795
|
var CloseButton = styled45(DialogClose)`
|
|
10896
10796
|
align-self: start;
|
|
10897
10797
|
`;
|
|
10898
10798
|
var ModalCloseButton = () => {
|
|
10899
|
-
return /* @__PURE__ */
|
|
10799
|
+
return /* @__PURE__ */ jsx241(CloseButton, { asChild: true, children: /* @__PURE__ */ jsx241(
|
|
10900
10800
|
IconButton,
|
|
10901
10801
|
{
|
|
10902
10802
|
label: "Dismiss modal",
|
|
10903
10803
|
size: "sm",
|
|
10904
10804
|
variant: "ghost",
|
|
10905
|
-
children: /* @__PURE__ */
|
|
10805
|
+
children: /* @__PURE__ */ jsx241(Icon, { type: "close" })
|
|
10906
10806
|
}
|
|
10907
10807
|
) });
|
|
10908
10808
|
};
|
|
10909
10809
|
|
|
10910
10810
|
// src/components/Modal/ModalHeader.tsx
|
|
10911
|
-
import { jsx as
|
|
10811
|
+
import { jsx as jsx242, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
10912
10812
|
var Header = styled46.header`
|
|
10913
10813
|
display: flex;
|
|
10914
10814
|
order: 1;
|
|
@@ -10931,15 +10831,15 @@ var ModalHeader = ({
|
|
|
10931
10831
|
hideTitle,
|
|
10932
10832
|
hideCloseButton
|
|
10933
10833
|
}) => {
|
|
10934
|
-
const TitleComponent = hideTitle ? /* @__PURE__ */
|
|
10935
|
-
return /* @__PURE__ */
|
|
10834
|
+
const TitleComponent = hideTitle ? /* @__PURE__ */ jsx242(ScreenReaderOnly, { children: /* @__PURE__ */ jsx242(Title, { children: title }) }) : /* @__PURE__ */ jsx242(Title, { children: title });
|
|
10835
|
+
return /* @__PURE__ */ jsxs30(Header, { $hideTitle: hideTitle, children: [
|
|
10936
10836
|
TitleComponent,
|
|
10937
|
-
hideCloseButton ? null : /* @__PURE__ */
|
|
10837
|
+
hideCloseButton ? null : /* @__PURE__ */ jsx242(ModalCloseButton, {})
|
|
10938
10838
|
] });
|
|
10939
10839
|
};
|
|
10940
10840
|
|
|
10941
10841
|
// src/components/Modal/ModalContent.tsx
|
|
10942
|
-
import { forwardRef as
|
|
10842
|
+
import { forwardRef as forwardRef17 } from "react";
|
|
10943
10843
|
import styled47, { css as css30 } from "styled-components";
|
|
10944
10844
|
import { Content as DialogContent } from "@radix-ui/react-dialog";
|
|
10945
10845
|
|
|
@@ -10963,7 +10863,7 @@ var useFocusRestore = () => {
|
|
|
10963
10863
|
};
|
|
10964
10864
|
|
|
10965
10865
|
// src/components/Modal/ModalContent.tsx
|
|
10966
|
-
import { jsx as
|
|
10866
|
+
import { jsx as jsx243 } from "react/jsx-runtime";
|
|
10967
10867
|
var alignTopStyles = css30`
|
|
10968
10868
|
--wui-modal-translate-y: 0;
|
|
10969
10869
|
|
|
@@ -11042,10 +10942,10 @@ var StyledModalContent = styled47(DialogContent)`
|
|
|
11042
10942
|
}
|
|
11043
10943
|
}
|
|
11044
10944
|
`;
|
|
11045
|
-
var ModalContent =
|
|
10945
|
+
var ModalContent = forwardRef17(
|
|
11046
10946
|
({ fullHeight, width, alignHorizontal, alignVertical, children, ...props }, ref) => {
|
|
11047
10947
|
useFocusRestore();
|
|
11048
|
-
return /* @__PURE__ */
|
|
10948
|
+
return /* @__PURE__ */ jsx243(
|
|
11049
10949
|
StyledModalContent,
|
|
11050
10950
|
{
|
|
11051
10951
|
ref,
|
|
@@ -11062,9 +10962,9 @@ var ModalContent = forwardRef19(
|
|
|
11062
10962
|
);
|
|
11063
10963
|
|
|
11064
10964
|
// src/private/components/Backdrop/Backdrop.tsx
|
|
11065
|
-
import { forwardRef as
|
|
10965
|
+
import { forwardRef as forwardRef18 } from "react";
|
|
11066
10966
|
import styled48 from "styled-components";
|
|
11067
|
-
import { jsx as
|
|
10967
|
+
import { jsx as jsx244 } from "react/jsx-runtime";
|
|
11068
10968
|
var alignVerticalMap = {
|
|
11069
10969
|
stretch: "normal",
|
|
11070
10970
|
top: "start",
|
|
@@ -11102,8 +11002,8 @@ var BackdropComponent = styled48.div`
|
|
|
11102
11002
|
}
|
|
11103
11003
|
}
|
|
11104
11004
|
`;
|
|
11105
|
-
var Backdrop =
|
|
11106
|
-
({ alignHorizontal = "center", alignVertical = "center", children, ...otherProps }, ref) => /* @__PURE__ */
|
|
11005
|
+
var Backdrop = forwardRef18(
|
|
11006
|
+
({ alignHorizontal = "center", alignVertical = "center", children, ...otherProps }, ref) => /* @__PURE__ */ jsx244(
|
|
11107
11007
|
BackdropComponent,
|
|
11108
11008
|
{
|
|
11109
11009
|
ref,
|
|
@@ -11117,7 +11017,7 @@ var Backdrop = forwardRef20(
|
|
|
11117
11017
|
Backdrop.displayName = "Backdrop";
|
|
11118
11018
|
|
|
11119
11019
|
// src/components/Modal/Modal.tsx
|
|
11120
|
-
import { jsx as
|
|
11020
|
+
import { jsx as jsx245, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
11121
11021
|
var DEFAULT_MODAL_WIDTH = "532px";
|
|
11122
11022
|
var ModalBody = styled49.div`
|
|
11123
11023
|
flex-direction: column;
|
|
@@ -11125,7 +11025,7 @@ var ModalBody = styled49.div`
|
|
|
11125
11025
|
flex: 1 0 0;
|
|
11126
11026
|
order: 2;
|
|
11127
11027
|
`;
|
|
11128
|
-
var Modal =
|
|
11028
|
+
var Modal = forwardRef19(
|
|
11129
11029
|
({
|
|
11130
11030
|
children,
|
|
11131
11031
|
fullHeight = false,
|
|
@@ -11140,7 +11040,7 @@ var Modal = forwardRef21(
|
|
|
11140
11040
|
alignVertical = "center",
|
|
11141
11041
|
...props
|
|
11142
11042
|
}, ref) => {
|
|
11143
|
-
return /* @__PURE__ */
|
|
11043
|
+
return /* @__PURE__ */ jsx245(
|
|
11144
11044
|
DialogRoot,
|
|
11145
11045
|
{
|
|
11146
11046
|
onOpenChange: (open2) => {
|
|
@@ -11149,9 +11049,9 @@ var Modal = forwardRef21(
|
|
|
11149
11049
|
}
|
|
11150
11050
|
},
|
|
11151
11051
|
open: isOpen,
|
|
11152
|
-
children: /* @__PURE__ */
|
|
11153
|
-
/* @__PURE__ */
|
|
11154
|
-
/* @__PURE__ */
|
|
11052
|
+
children: /* @__PURE__ */ jsxs31(DialogPortal, { children: [
|
|
11053
|
+
/* @__PURE__ */ jsx245(Backdrop, {}),
|
|
11054
|
+
/* @__PURE__ */ jsxs31(
|
|
11155
11055
|
ModalContent,
|
|
11156
11056
|
{
|
|
11157
11057
|
ref,
|
|
@@ -11169,8 +11069,8 @@ var Modal = forwardRef21(
|
|
|
11169
11069
|
width,
|
|
11170
11070
|
...props,
|
|
11171
11071
|
children: [
|
|
11172
|
-
/* @__PURE__ */
|
|
11173
|
-
/* @__PURE__ */
|
|
11072
|
+
/* @__PURE__ */ jsx245(ModalBody, { children }),
|
|
11073
|
+
/* @__PURE__ */ jsx245(
|
|
11174
11074
|
ModalHeader,
|
|
11175
11075
|
{
|
|
11176
11076
|
hideCloseButton,
|
|
@@ -11201,7 +11101,7 @@ var getControlProps = (isOpen, onOpenChange) => {
|
|
|
11201
11101
|
// src/components/Popover/PopoverArrow.tsx
|
|
11202
11102
|
import { PopoverArrow as RadixPopoverArrow } from "@radix-ui/react-popover";
|
|
11203
11103
|
import styled50, { css as css31, keyframes as keyframes4 } from "styled-components";
|
|
11204
|
-
import { jsx as
|
|
11104
|
+
import { jsx as jsx246, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
11205
11105
|
var StyledPath = styled50.path`
|
|
11206
11106
|
fill: var(--wui-color-border-secondary);
|
|
11207
11107
|
`;
|
|
@@ -11240,7 +11140,7 @@ var StyledCircle = styled50.circle`
|
|
|
11240
11140
|
}
|
|
11241
11141
|
`;
|
|
11242
11142
|
var PopoverArrow = ({ isAnimated }) => {
|
|
11243
|
-
return /* @__PURE__ */
|
|
11143
|
+
return /* @__PURE__ */ jsx246(RadixPopoverArrow, { asChild: true, children: /* @__PURE__ */ jsxs32(
|
|
11244
11144
|
"svg",
|
|
11245
11145
|
{
|
|
11246
11146
|
fill: "none",
|
|
@@ -11249,8 +11149,8 @@ var PopoverArrow = ({ isAnimated }) => {
|
|
|
11249
11149
|
width: "48",
|
|
11250
11150
|
xmlns: "http://www.w3.org/2000/svg",
|
|
11251
11151
|
children: [
|
|
11252
|
-
/* @__PURE__ */
|
|
11253
|
-
/* @__PURE__ */
|
|
11152
|
+
/* @__PURE__ */ jsx246(StyledPath, { d: "M24 26.6667C21.0545 26.6667 18.6667 29.0545 18.6667 32C18.6667 34.9455 21.0545 37.3333 24 37.3333C26.9455 37.3333 29.3333 34.9455 29.3333 32C29.3333 29.0545 26.9455 26.6667 24 26.6667ZM23 0V32H25V0H23Z" }),
|
|
11153
|
+
/* @__PURE__ */ jsx246(
|
|
11254
11154
|
StyledCircle,
|
|
11255
11155
|
{
|
|
11256
11156
|
$isAnimated: isAnimated,
|
|
@@ -11261,7 +11161,7 @@ var PopoverArrow = ({ isAnimated }) => {
|
|
|
11261
11161
|
strokeWidth: "4"
|
|
11262
11162
|
}
|
|
11263
11163
|
),
|
|
11264
|
-
/* @__PURE__ */
|
|
11164
|
+
/* @__PURE__ */ jsx246(
|
|
11265
11165
|
StyledCircle,
|
|
11266
11166
|
{
|
|
11267
11167
|
$isAnimated: isAnimated,
|
|
@@ -11279,7 +11179,7 @@ var PopoverArrow = ({ isAnimated }) => {
|
|
|
11279
11179
|
PopoverArrow.displayName = "PopoverArrow";
|
|
11280
11180
|
|
|
11281
11181
|
// src/components/Popover/Popover.tsx
|
|
11282
|
-
import { jsx as
|
|
11182
|
+
import { jsx as jsx247, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
11283
11183
|
var StyledContent2 = styled51(Content2)`
|
|
11284
11184
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
11285
11185
|
${({ $unstyled }) => !$unstyled && css32`
|
|
@@ -11318,9 +11218,9 @@ var Popover = ({
|
|
|
11318
11218
|
"--wui-popover-max-width": maxWidth,
|
|
11319
11219
|
"--wui-popover-max-height": maxHeight
|
|
11320
11220
|
};
|
|
11321
|
-
return /* @__PURE__ */
|
|
11322
|
-
/* @__PURE__ */
|
|
11323
|
-
/* @__PURE__ */
|
|
11221
|
+
return /* @__PURE__ */ jsxs33(Root, { ...getControlProps(isOpen, onOpenChange), children: [
|
|
11222
|
+
/* @__PURE__ */ jsx247(Trigger2, { asChild: true, children: trigger }),
|
|
11223
|
+
/* @__PURE__ */ jsx247(Portal, { children: /* @__PURE__ */ jsxs33(
|
|
11324
11224
|
StyledContent2,
|
|
11325
11225
|
{
|
|
11326
11226
|
$colorScheme: colorScheme,
|
|
@@ -11329,17 +11229,17 @@ var Popover = ({
|
|
|
11329
11229
|
$unstyled: unstyled,
|
|
11330
11230
|
style,
|
|
11331
11231
|
children: [
|
|
11332
|
-
!hideCloseButton && /* @__PURE__ */
|
|
11232
|
+
!hideCloseButton && /* @__PURE__ */ jsx247(Close, { asChild: true, children: /* @__PURE__ */ jsx247(
|
|
11333
11233
|
IconButton,
|
|
11334
11234
|
{
|
|
11335
11235
|
"data-wui-popover-close": true,
|
|
11336
11236
|
label: "Close",
|
|
11337
11237
|
variant: "ghost",
|
|
11338
|
-
children: /* @__PURE__ */
|
|
11238
|
+
children: /* @__PURE__ */ jsx247(Icon, { type: "close" })
|
|
11339
11239
|
}
|
|
11340
11240
|
) }),
|
|
11341
|
-
withArrow ? /* @__PURE__ */
|
|
11342
|
-
/* @__PURE__ */
|
|
11241
|
+
withArrow ? /* @__PURE__ */ jsx247(PopoverArrow, { isAnimated }) : null,
|
|
11242
|
+
/* @__PURE__ */ jsx247("div", { children })
|
|
11343
11243
|
]
|
|
11344
11244
|
}
|
|
11345
11245
|
) })
|
|
@@ -11351,7 +11251,7 @@ Popover.displayName = "Popover";
|
|
|
11351
11251
|
import styled52 from "styled-components";
|
|
11352
11252
|
import { Root as ProgressRoot, Indicator as ProgressIndicator } from "@radix-ui/react-progress";
|
|
11353
11253
|
import { isNotNil as isNotNil26 } from "@wistia/type-guards";
|
|
11354
|
-
import { jsx as
|
|
11254
|
+
import { jsx as jsx248, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
11355
11255
|
var ProgressBarWrapper = styled52.div`
|
|
11356
11256
|
--progress-bar-height: 8px;
|
|
11357
11257
|
--progress-bar-indicator-color: var(--wui-color-bg-fill);
|
|
@@ -11404,15 +11304,15 @@ var ProgressBar = ({
|
|
|
11404
11304
|
labelRight,
|
|
11405
11305
|
...props
|
|
11406
11306
|
}) => {
|
|
11407
|
-
return /* @__PURE__ */
|
|
11408
|
-
isNotNil26(labelLeft) ? /* @__PURE__ */
|
|
11409
|
-
/* @__PURE__ */
|
|
11307
|
+
return /* @__PURE__ */ jsxs34(ProgressBarWrapper, { children: [
|
|
11308
|
+
isNotNil26(labelLeft) ? /* @__PURE__ */ jsx248(ProgressBarLabel, { children: labelLeft }) : null,
|
|
11309
|
+
/* @__PURE__ */ jsx248(
|
|
11410
11310
|
StyledProgressBar,
|
|
11411
11311
|
{
|
|
11412
11312
|
max,
|
|
11413
11313
|
value: progress,
|
|
11414
11314
|
...props,
|
|
11415
|
-
children: /* @__PURE__ */
|
|
11315
|
+
children: /* @__PURE__ */ jsx248(
|
|
11416
11316
|
StyledProgressIndicator,
|
|
11417
11317
|
{
|
|
11418
11318
|
$max: max,
|
|
@@ -11421,17 +11321,17 @@ var ProgressBar = ({
|
|
|
11421
11321
|
)
|
|
11422
11322
|
}
|
|
11423
11323
|
),
|
|
11424
|
-
isNotNil26(labelRight) ? /* @__PURE__ */
|
|
11324
|
+
isNotNil26(labelRight) ? /* @__PURE__ */ jsx248(ProgressBarLabel, { children: labelRight }) : null
|
|
11425
11325
|
] });
|
|
11426
11326
|
};
|
|
11427
11327
|
ProgressBar.displayName = "ProgressBar";
|
|
11428
11328
|
|
|
11429
11329
|
// src/components/Radio/Radio.tsx
|
|
11430
|
-
import { forwardRef as
|
|
11330
|
+
import { forwardRef as forwardRef20, useId as useId3 } from "react";
|
|
11431
11331
|
import styled53, { css as css33 } from "styled-components";
|
|
11432
11332
|
import { isNonEmptyString as isNonEmptyString3 } from "@wistia/type-guards";
|
|
11433
|
-
import { jsx as
|
|
11434
|
-
var RadioIcon = () => /* @__PURE__ */
|
|
11333
|
+
import { jsx as jsx249, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
11334
|
+
var RadioIcon = () => /* @__PURE__ */ jsx249(
|
|
11435
11335
|
"svg",
|
|
11436
11336
|
{
|
|
11437
11337
|
fill: "inherit",
|
|
@@ -11439,7 +11339,7 @@ var RadioIcon = () => /* @__PURE__ */ jsx250(
|
|
|
11439
11339
|
viewBox: "0 0 1 1",
|
|
11440
11340
|
width: "1",
|
|
11441
11341
|
xmlns: "http://www.w3.org/2000/svg",
|
|
11442
|
-
children: /* @__PURE__ */
|
|
11342
|
+
children: /* @__PURE__ */ jsx249(
|
|
11443
11343
|
"circle",
|
|
11444
11344
|
{
|
|
11445
11345
|
cx: "0.5",
|
|
@@ -11530,7 +11430,7 @@ var StyledHiddenRadioInput = styled53.input`
|
|
|
11530
11430
|
display: block;
|
|
11531
11431
|
}
|
|
11532
11432
|
`;
|
|
11533
|
-
var Radio =
|
|
11433
|
+
var Radio = forwardRef20(
|
|
11534
11434
|
({
|
|
11535
11435
|
checked,
|
|
11536
11436
|
disabled = false,
|
|
@@ -11547,13 +11447,13 @@ var Radio = forwardRef22(
|
|
|
11547
11447
|
}, ref) => {
|
|
11548
11448
|
const generatedId = useId3();
|
|
11549
11449
|
const computedId = isNonEmptyString3(id) ? id : `wistia-ui-radio-${generatedId}`;
|
|
11550
|
-
return /* @__PURE__ */
|
|
11450
|
+
return /* @__PURE__ */ jsxs35(
|
|
11551
11451
|
StyledRadioWrapper,
|
|
11552
11452
|
{
|
|
11553
11453
|
$disabled: disabled,
|
|
11554
11454
|
"aria-invalid": props["aria-invalid"],
|
|
11555
11455
|
children: [
|
|
11556
|
-
/* @__PURE__ */
|
|
11456
|
+
/* @__PURE__ */ jsx249(
|
|
11557
11457
|
StyledHiddenRadioInput,
|
|
11558
11458
|
{
|
|
11559
11459
|
...props,
|
|
@@ -11568,16 +11468,16 @@ var Radio = forwardRef22(
|
|
|
11568
11468
|
value
|
|
11569
11469
|
}
|
|
11570
11470
|
),
|
|
11571
|
-
/* @__PURE__ */
|
|
11471
|
+
/* @__PURE__ */ jsx249(
|
|
11572
11472
|
FormControlLabel,
|
|
11573
11473
|
{
|
|
11574
|
-
controlSlot: /* @__PURE__ */
|
|
11474
|
+
controlSlot: /* @__PURE__ */ jsx249(
|
|
11575
11475
|
StyledRadioInput,
|
|
11576
11476
|
{
|
|
11577
11477
|
$disabled: disabled,
|
|
11578
11478
|
$size: size,
|
|
11579
11479
|
"data-wui-faux-input": "true",
|
|
11580
|
-
children: /* @__PURE__ */
|
|
11480
|
+
children: /* @__PURE__ */ jsx249(RadioIcon, {})
|
|
11581
11481
|
}
|
|
11582
11482
|
),
|
|
11583
11483
|
description,
|
|
@@ -11595,14 +11495,14 @@ var Radio = forwardRef22(
|
|
|
11595
11495
|
Radio.displayName = "Radio";
|
|
11596
11496
|
|
|
11597
11497
|
// src/components/SegmentedControl/SegmentedControl.tsx
|
|
11598
|
-
import { forwardRef as
|
|
11498
|
+
import { forwardRef as forwardRef21 } from "react";
|
|
11599
11499
|
import styled55, { css as css34 } from "styled-components";
|
|
11600
11500
|
import { Root as ToggleGroupRoot } from "@radix-ui/react-toggle-group";
|
|
11601
11501
|
import { isNil as isNil13 } from "@wistia/type-guards";
|
|
11602
11502
|
|
|
11603
11503
|
// src/components/SegmentedControl/useSelectedItemStyle.tsx
|
|
11604
11504
|
import { createContext as createContext7, useContext as useContext6, useMemo as useMemo8, useState as useState14 } from "react";
|
|
11605
|
-
import { jsx as
|
|
11505
|
+
import { jsx as jsx250 } from "react/jsx-runtime";
|
|
11606
11506
|
var SelectedItemStyleContext = createContext7(null);
|
|
11607
11507
|
var SelectedItemStyleProvider = ({
|
|
11608
11508
|
children
|
|
@@ -11625,7 +11525,7 @@ var SelectedItemStyleProvider = ({
|
|
|
11625
11525
|
}),
|
|
11626
11526
|
[selectedItemIndicatorStyle]
|
|
11627
11527
|
);
|
|
11628
|
-
return /* @__PURE__ */
|
|
11528
|
+
return /* @__PURE__ */ jsx250(SelectedItemStyleContext.Provider, { value: contextValue, children });
|
|
11629
11529
|
};
|
|
11630
11530
|
var useSelectedItemStyle = () => {
|
|
11631
11531
|
const context = useContext6(SelectedItemStyleContext);
|
|
@@ -11651,7 +11551,7 @@ var useSegmentedControlValue = () => {
|
|
|
11651
11551
|
};
|
|
11652
11552
|
|
|
11653
11553
|
// src/components/SegmentedControl/SelectedItemIndicator.tsx
|
|
11654
|
-
import { jsx as
|
|
11554
|
+
import { jsx as jsx251 } from "react/jsx-runtime";
|
|
11655
11555
|
var SelectedItemIndicatorDiv = styled54.div`
|
|
11656
11556
|
background-color: var(--wui-color-bg-fill-white);
|
|
11657
11557
|
border-radius: var(--wui-border-radius-rounded);
|
|
@@ -11670,11 +11570,11 @@ var SelectedItemIndicator = () => {
|
|
|
11670
11570
|
if (!selectedValue) {
|
|
11671
11571
|
return null;
|
|
11672
11572
|
}
|
|
11673
|
-
return /* @__PURE__ */
|
|
11573
|
+
return /* @__PURE__ */ jsx251(SelectedItemIndicatorDiv, { style: selectedItemIndicatorStyle });
|
|
11674
11574
|
};
|
|
11675
11575
|
|
|
11676
11576
|
// src/components/SegmentedControl/SegmentedControl.tsx
|
|
11677
|
-
import { jsx as
|
|
11577
|
+
import { jsx as jsx252, jsxs as jsxs36 } from "react/jsx-runtime";
|
|
11678
11578
|
var segmentedControlStyles = css34`
|
|
11679
11579
|
display: inline-flex;
|
|
11680
11580
|
background-color: var(--wui-color-bg-surface-secondary);
|
|
@@ -11689,7 +11589,7 @@ var segmentedControlStyles = css34`
|
|
|
11689
11589
|
var StyledSegmentedControl = styled55(ToggleGroupRoot)`
|
|
11690
11590
|
${segmentedControlStyles}
|
|
11691
11591
|
`;
|
|
11692
|
-
var SegmentedControl =
|
|
11592
|
+
var SegmentedControl = forwardRef21(
|
|
11693
11593
|
({
|
|
11694
11594
|
children,
|
|
11695
11595
|
disabled = false,
|
|
@@ -11701,7 +11601,7 @@ var SegmentedControl = forwardRef23(
|
|
|
11701
11601
|
if (isNil13(children)) {
|
|
11702
11602
|
return null;
|
|
11703
11603
|
}
|
|
11704
|
-
return /* @__PURE__ */
|
|
11604
|
+
return /* @__PURE__ */ jsx252(
|
|
11705
11605
|
StyledSegmentedControl,
|
|
11706
11606
|
{
|
|
11707
11607
|
ref,
|
|
@@ -11713,8 +11613,8 @@ var SegmentedControl = forwardRef23(
|
|
|
11713
11613
|
type: "single",
|
|
11714
11614
|
value: selectedValue,
|
|
11715
11615
|
...props,
|
|
11716
|
-
children: /* @__PURE__ */
|
|
11717
|
-
/* @__PURE__ */
|
|
11616
|
+
children: /* @__PURE__ */ jsx252(SegmentedControlValueProvider, { value: selectedValue, children: /* @__PURE__ */ jsxs36(SelectedItemStyleProvider, { children: [
|
|
11617
|
+
/* @__PURE__ */ jsx252(SelectedItemIndicator, {}),
|
|
11718
11618
|
children
|
|
11719
11619
|
] }) })
|
|
11720
11620
|
}
|
|
@@ -11724,11 +11624,11 @@ var SegmentedControl = forwardRef23(
|
|
|
11724
11624
|
SegmentedControl.displayName = "SegmentedControl";
|
|
11725
11625
|
|
|
11726
11626
|
// src/components/SegmentedControl/SegmentedControlItem.tsx
|
|
11727
|
-
import { forwardRef as
|
|
11627
|
+
import { forwardRef as forwardRef22, useEffect as useEffect11, useRef as useRef12 } from "react";
|
|
11728
11628
|
import styled56, { css as css35 } from "styled-components";
|
|
11729
11629
|
import { Item as ToggleGroupItem } from "@radix-ui/react-toggle-group";
|
|
11730
11630
|
import { isNotNil as isNotNil27 } from "@wistia/type-guards";
|
|
11731
|
-
import { jsxs as
|
|
11631
|
+
import { jsxs as jsxs37 } from "react/jsx-runtime";
|
|
11732
11632
|
var segmentedControlItemStyles = css35`
|
|
11733
11633
|
all: unset; /* ToggleGroupItem is a button element */
|
|
11734
11634
|
align-items: center;
|
|
@@ -11792,7 +11692,7 @@ var segmentedControlItemStyles = css35`
|
|
|
11792
11692
|
var StyledSegmentedControlItem = styled56(ToggleGroupItem)`
|
|
11793
11693
|
${segmentedControlItemStyles}
|
|
11794
11694
|
`;
|
|
11795
|
-
var SegmentedControlItem =
|
|
11695
|
+
var SegmentedControlItem = forwardRef22(
|
|
11796
11696
|
({ disabled, icon, label, "aria-label": ariaLabel, value }, forwardedRef) => {
|
|
11797
11697
|
const selectedValue = useSegmentedControlValue();
|
|
11798
11698
|
const { setSelectedItemMeasurements } = useSelectedItemStyle();
|
|
@@ -11830,7 +11730,7 @@ var SegmentedControlItem = forwardRef24(
|
|
|
11830
11730
|
resizeObserver.disconnect();
|
|
11831
11731
|
};
|
|
11832
11732
|
}, [selectedValue, setSelectedItemMeasurements, value]);
|
|
11833
|
-
return /* @__PURE__ */
|
|
11733
|
+
return /* @__PURE__ */ jsxs37(
|
|
11834
11734
|
StyledSegmentedControlItem,
|
|
11835
11735
|
{
|
|
11836
11736
|
ref: combinedRef,
|
|
@@ -11860,9 +11760,9 @@ import {
|
|
|
11860
11760
|
Value,
|
|
11861
11761
|
ScrollDownButton
|
|
11862
11762
|
} from "@radix-ui/react-select";
|
|
11863
|
-
import { forwardRef as
|
|
11763
|
+
import { forwardRef as forwardRef23 } from "react";
|
|
11864
11764
|
import styled57 from "styled-components";
|
|
11865
|
-
import { jsx as
|
|
11765
|
+
import { jsx as jsx253, jsxs as jsxs38 } from "react/jsx-runtime";
|
|
11866
11766
|
var StyledTrigger = styled57(Trigger3)`
|
|
11867
11767
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
11868
11768
|
${inputCssVariables};
|
|
@@ -11925,7 +11825,7 @@ var StyledContent3 = styled57(Content3)`
|
|
|
11925
11825
|
max-height: var(--radix-select-content-available-height);
|
|
11926
11826
|
z-index: var(--wui-zindex-select);
|
|
11927
11827
|
`;
|
|
11928
|
-
var Select =
|
|
11828
|
+
var Select = forwardRef23(
|
|
11929
11829
|
({
|
|
11930
11830
|
colorScheme = "inherit",
|
|
11931
11831
|
children,
|
|
@@ -11935,13 +11835,13 @@ var Select = forwardRef25(
|
|
|
11935
11835
|
...props
|
|
11936
11836
|
}, forwardedRef) => {
|
|
11937
11837
|
const responsiveFullWidth = useResponsiveProp(fullWidth);
|
|
11938
|
-
return /* @__PURE__ */
|
|
11838
|
+
return /* @__PURE__ */ jsxs38(
|
|
11939
11839
|
Root2,
|
|
11940
11840
|
{
|
|
11941
11841
|
...props,
|
|
11942
11842
|
onValueChange: onChange,
|
|
11943
11843
|
children: [
|
|
11944
|
-
/* @__PURE__ */
|
|
11844
|
+
/* @__PURE__ */ jsxs38(
|
|
11945
11845
|
StyledTrigger,
|
|
11946
11846
|
{
|
|
11947
11847
|
ref: forwardedRef,
|
|
@@ -11949,8 +11849,8 @@ var Select = forwardRef25(
|
|
|
11949
11849
|
$fullWidth: responsiveFullWidth,
|
|
11950
11850
|
...props,
|
|
11951
11851
|
children: [
|
|
11952
|
-
/* @__PURE__ */
|
|
11953
|
-
/* @__PURE__ */
|
|
11852
|
+
/* @__PURE__ */ jsx253(Value, { placeholder }),
|
|
11853
|
+
/* @__PURE__ */ jsx253(
|
|
11954
11854
|
Icon,
|
|
11955
11855
|
{
|
|
11956
11856
|
size: "md",
|
|
@@ -11960,10 +11860,10 @@ var Select = forwardRef25(
|
|
|
11960
11860
|
]
|
|
11961
11861
|
}
|
|
11962
11862
|
),
|
|
11963
|
-
/* @__PURE__ */
|
|
11964
|
-
/* @__PURE__ */
|
|
11965
|
-
/* @__PURE__ */
|
|
11966
|
-
/* @__PURE__ */
|
|
11863
|
+
/* @__PURE__ */ jsx253(Portal2, { children: /* @__PURE__ */ jsxs38(StyledContent3, { position: "popper", children: [
|
|
11864
|
+
/* @__PURE__ */ jsx253(ScrollUpButton, { children: /* @__PURE__ */ jsx253(Icon, { type: "caret-up" }) }),
|
|
11865
|
+
/* @__PURE__ */ jsx253(Viewport, { children }),
|
|
11866
|
+
/* @__PURE__ */ jsx253(ScrollDownButton, { children: /* @__PURE__ */ jsx253(Icon, { type: "caret-down" }) })
|
|
11967
11867
|
] }) })
|
|
11968
11868
|
]
|
|
11969
11869
|
}
|
|
@@ -11974,10 +11874,10 @@ Select.displayName = "Select";
|
|
|
11974
11874
|
|
|
11975
11875
|
// src/components/Select/SelectOption.tsx
|
|
11976
11876
|
import { Item, ItemText, ItemIndicator } from "@radix-ui/react-select";
|
|
11977
|
-
import { forwardRef as
|
|
11877
|
+
import { forwardRef as forwardRef24 } from "react";
|
|
11978
11878
|
import styled58 from "styled-components";
|
|
11979
11879
|
import { isNotNil as isNotNil28 } from "@wistia/type-guards";
|
|
11980
|
-
import { jsx as
|
|
11880
|
+
import { jsx as jsx254, jsxs as jsxs39 } from "react/jsx-runtime";
|
|
11981
11881
|
var StyledItem = styled58(Item)`
|
|
11982
11882
|
${variantStyleMap2.body3};
|
|
11983
11883
|
display: flex;
|
|
@@ -12005,25 +11905,25 @@ var StyledItem = styled58(Item)`
|
|
|
12005
11905
|
var StyledIconContainer = styled58.span`
|
|
12006
11906
|
width: 12px;
|
|
12007
11907
|
`;
|
|
12008
|
-
var SelectOption =
|
|
11908
|
+
var SelectOption = forwardRef24(
|
|
12009
11909
|
({ children, selectedDisplayValue, ...props }, forwardedRef) => {
|
|
12010
|
-
return /* @__PURE__ */
|
|
11910
|
+
return /* @__PURE__ */ jsxs39(
|
|
12011
11911
|
StyledItem,
|
|
12012
11912
|
{
|
|
12013
11913
|
...props,
|
|
12014
11914
|
ref: forwardedRef,
|
|
12015
11915
|
children: [
|
|
12016
|
-
/* @__PURE__ */
|
|
11916
|
+
/* @__PURE__ */ jsx254(StyledIconContainer, { "data-indicator": true, children: /* @__PURE__ */ jsx254(ItemIndicator, { children: /* @__PURE__ */ jsx254(
|
|
12017
11917
|
Icon,
|
|
12018
11918
|
{
|
|
12019
11919
|
size: "sm",
|
|
12020
11920
|
type: "checkmark"
|
|
12021
11921
|
}
|
|
12022
11922
|
) }) }),
|
|
12023
|
-
isNotNil28(selectedDisplayValue) ? /* @__PURE__ */
|
|
11923
|
+
isNotNil28(selectedDisplayValue) ? /* @__PURE__ */ jsxs39("div", { children: [
|
|
12024
11924
|
children,
|
|
12025
|
-
/* @__PURE__ */
|
|
12026
|
-
] }) : /* @__PURE__ */
|
|
11925
|
+
/* @__PURE__ */ jsx254("div", { style: { display: "none" }, children: /* @__PURE__ */ jsx254(ItemText, { children: selectedDisplayValue }) })
|
|
11926
|
+
] }) : /* @__PURE__ */ jsx254(ItemText, { children })
|
|
12027
11927
|
]
|
|
12028
11928
|
}
|
|
12029
11929
|
);
|
|
@@ -12034,13 +11934,13 @@ SelectOption.displayName = "SelectOption";
|
|
|
12034
11934
|
// src/components/Select/SelectOptionGroup.tsx
|
|
12035
11935
|
import { Group, Label as Label3 } from "@radix-ui/react-select";
|
|
12036
11936
|
import styled59 from "styled-components";
|
|
12037
|
-
import { jsx as
|
|
11937
|
+
import { jsx as jsx255, jsxs as jsxs40 } from "react/jsx-runtime";
|
|
12038
11938
|
var StyledLabel4 = styled59(Label3)`
|
|
12039
11939
|
padding: var(--wui-select-option-padding);
|
|
12040
11940
|
`;
|
|
12041
11941
|
var SelectOptionGroup = ({ children, label, ...props }) => {
|
|
12042
|
-
return /* @__PURE__ */
|
|
12043
|
-
/* @__PURE__ */
|
|
11942
|
+
return /* @__PURE__ */ jsxs40(Group, { ...props, children: [
|
|
11943
|
+
/* @__PURE__ */ jsx255(StyledLabel4, { children: /* @__PURE__ */ jsx255(
|
|
12044
11944
|
Text,
|
|
12045
11945
|
{
|
|
12046
11946
|
prominence: "secondary",
|
|
@@ -12053,10 +11953,10 @@ var SelectOptionGroup = ({ children, label, ...props }) => {
|
|
|
12053
11953
|
};
|
|
12054
11954
|
|
|
12055
11955
|
// src/components/Switch/Switch.tsx
|
|
12056
|
-
import { forwardRef as
|
|
11956
|
+
import { forwardRef as forwardRef25, useId as useId4 } from "react";
|
|
12057
11957
|
import styled60, { css as css36 } from "styled-components";
|
|
12058
11958
|
import { isNonEmptyString as isNonEmptyString4 } from "@wistia/type-guards";
|
|
12059
|
-
import { jsx as
|
|
11959
|
+
import { jsx as jsx256, jsxs as jsxs41 } from "react/jsx-runtime";
|
|
12060
11960
|
var sizeSmall3 = css36`
|
|
12061
11961
|
--wui-size-small-width: 24px;
|
|
12062
11962
|
--wui-size-small-height: 14px;
|
|
@@ -12158,7 +12058,7 @@ var StyledHiddenSwitchInput = styled60.input`
|
|
|
12158
12058
|
}
|
|
12159
12059
|
}
|
|
12160
12060
|
`;
|
|
12161
|
-
var Switch =
|
|
12061
|
+
var Switch = forwardRef25(
|
|
12162
12062
|
({
|
|
12163
12063
|
checked,
|
|
12164
12064
|
disabled = false,
|
|
@@ -12175,8 +12075,8 @@ var Switch = forwardRef27(
|
|
|
12175
12075
|
}, ref) => {
|
|
12176
12076
|
const generatedId = useId4();
|
|
12177
12077
|
const computedId = isNonEmptyString4(id) ? id : `wistia-ui-switch-${generatedId}`;
|
|
12178
|
-
return /* @__PURE__ */
|
|
12179
|
-
/* @__PURE__ */
|
|
12078
|
+
return /* @__PURE__ */ jsxs41(StyledSwitchWrapper, { $disabled: disabled, children: [
|
|
12079
|
+
/* @__PURE__ */ jsx256(
|
|
12180
12080
|
StyledHiddenSwitchInput,
|
|
12181
12081
|
{
|
|
12182
12082
|
...props,
|
|
@@ -12191,10 +12091,10 @@ var Switch = forwardRef27(
|
|
|
12191
12091
|
value
|
|
12192
12092
|
}
|
|
12193
12093
|
),
|
|
12194
|
-
/* @__PURE__ */
|
|
12094
|
+
/* @__PURE__ */ jsx256(
|
|
12195
12095
|
FormControlLabel,
|
|
12196
12096
|
{
|
|
12197
|
-
controlSlot: /* @__PURE__ */
|
|
12097
|
+
controlSlot: /* @__PURE__ */ jsx256(
|
|
12198
12098
|
StyledSwitchInput,
|
|
12199
12099
|
{
|
|
12200
12100
|
$disabled: disabled,
|
|
@@ -12217,7 +12117,7 @@ Switch.displayName = "Switch";
|
|
|
12217
12117
|
|
|
12218
12118
|
// src/components/Table/Table.tsx
|
|
12219
12119
|
import styled61, { css as css37 } from "styled-components";
|
|
12220
|
-
import { jsx as
|
|
12120
|
+
import { jsx as jsx257 } from "react/jsx-runtime";
|
|
12221
12121
|
var StyledTable = styled61.table`
|
|
12222
12122
|
width: 100%;
|
|
12223
12123
|
border-collapse: collapse;
|
|
@@ -12247,7 +12147,7 @@ var Table = ({
|
|
|
12247
12147
|
visuallyHiddenHeader = false,
|
|
12248
12148
|
...props
|
|
12249
12149
|
}) => {
|
|
12250
|
-
return /* @__PURE__ */
|
|
12150
|
+
return /* @__PURE__ */ jsx257(
|
|
12251
12151
|
StyledTable,
|
|
12252
12152
|
{
|
|
12253
12153
|
$divided: divided,
|
|
@@ -12267,16 +12167,16 @@ import { createContext as createContext9 } from "react";
|
|
|
12267
12167
|
var TableSectionContext = createContext9(null);
|
|
12268
12168
|
|
|
12269
12169
|
// src/components/Table/TableBody.tsx
|
|
12270
|
-
import { jsx as
|
|
12170
|
+
import { jsx as jsx258 } from "react/jsx-runtime";
|
|
12271
12171
|
var StyledTableBody = styled62.tbody``;
|
|
12272
12172
|
var TableBody = ({ children, ...props }) => {
|
|
12273
|
-
return /* @__PURE__ */
|
|
12173
|
+
return /* @__PURE__ */ jsx258(TableSectionContext.Provider, { value: "body", children: /* @__PURE__ */ jsx258(StyledTableBody, { ...props, children }) });
|
|
12274
12174
|
};
|
|
12275
12175
|
|
|
12276
12176
|
// src/components/Table/TableCell.tsx
|
|
12277
12177
|
import { useContext as useContext8 } from "react";
|
|
12278
12178
|
import styled63, { css as css38 } from "styled-components";
|
|
12279
|
-
import { jsx as
|
|
12179
|
+
import { jsx as jsx259 } from "react/jsx-runtime";
|
|
12280
12180
|
var sharedStyles = css38`
|
|
12281
12181
|
color: var(--wui-color-text);
|
|
12282
12182
|
padding: var(--wui-space-02);
|
|
@@ -12297,37 +12197,37 @@ var StyledTd = styled63.td`
|
|
|
12297
12197
|
var TableCell = ({ children, ...props }) => {
|
|
12298
12198
|
const section = useContext8(TableSectionContext);
|
|
12299
12199
|
if (section === "head") {
|
|
12300
|
-
return /* @__PURE__ */
|
|
12200
|
+
return /* @__PURE__ */ jsx259(StyledTh, { ...props, children });
|
|
12301
12201
|
}
|
|
12302
|
-
return /* @__PURE__ */
|
|
12202
|
+
return /* @__PURE__ */ jsx259(StyledTd, { ...props, children });
|
|
12303
12203
|
};
|
|
12304
12204
|
|
|
12305
12205
|
// src/components/Table/TableFoot.tsx
|
|
12306
12206
|
import styled64 from "styled-components";
|
|
12307
|
-
import { jsx as
|
|
12207
|
+
import { jsx as jsx260 } from "react/jsx-runtime";
|
|
12308
12208
|
var StyledTableFoot = styled64.tfoot``;
|
|
12309
12209
|
var TableFoot = ({ children, ...props }) => {
|
|
12310
|
-
return /* @__PURE__ */
|
|
12210
|
+
return /* @__PURE__ */ jsx260(TableSectionContext.Provider, { value: "footer", children: /* @__PURE__ */ jsx260(StyledTableFoot, { ...props, children }) });
|
|
12311
12211
|
};
|
|
12312
12212
|
|
|
12313
12213
|
// src/components/Table/TableHead.tsx
|
|
12314
12214
|
import styled65 from "styled-components";
|
|
12315
|
-
import { jsx as
|
|
12215
|
+
import { jsx as jsx261 } from "react/jsx-runtime";
|
|
12316
12216
|
var StyledThead = styled65.thead``;
|
|
12317
12217
|
var TableHead = ({ children, ...props }) => {
|
|
12318
|
-
return /* @__PURE__ */
|
|
12218
|
+
return /* @__PURE__ */ jsx261(TableSectionContext.Provider, { value: "head", children: /* @__PURE__ */ jsx261(StyledThead, { ...props, children }) });
|
|
12319
12219
|
};
|
|
12320
12220
|
|
|
12321
12221
|
// src/components/Table/TableRow.tsx
|
|
12322
12222
|
import styled66 from "styled-components";
|
|
12323
|
-
import { jsx as
|
|
12223
|
+
import { jsx as jsx262 } from "react/jsx-runtime";
|
|
12324
12224
|
var StyledTableRow = styled66.tr``;
|
|
12325
12225
|
var TableRow = ({ children, ...props }) => {
|
|
12326
|
-
return /* @__PURE__ */
|
|
12226
|
+
return /* @__PURE__ */ jsx262(StyledTableRow, { ...props, children });
|
|
12327
12227
|
};
|
|
12328
12228
|
|
|
12329
12229
|
// src/components/Tabs/Tabs.tsx
|
|
12330
|
-
import { forwardRef as
|
|
12230
|
+
import { forwardRef as forwardRef27, useState as useState15 } from "react";
|
|
12331
12231
|
import { Root as TabsRoot } from "@radix-ui/react-tabs";
|
|
12332
12232
|
import { isNotNil as isNotNil30, isNil as isNil14 } from "@wistia/type-guards";
|
|
12333
12233
|
import styled71 from "styled-components";
|
|
@@ -12335,13 +12235,13 @@ import styled71 from "styled-components";
|
|
|
12335
12235
|
// src/components/Tabs/TabPanel.tsx
|
|
12336
12236
|
import styled67 from "styled-components";
|
|
12337
12237
|
import { Content as TabsContent } from "@radix-ui/react-tabs";
|
|
12338
|
-
import { jsx as
|
|
12238
|
+
import { jsx as jsx263 } from "react/jsx-runtime";
|
|
12339
12239
|
var StyledTabPanel = styled67(TabsContent)`
|
|
12340
12240
|
display: flex;
|
|
12341
12241
|
flex-direction: column;
|
|
12342
12242
|
`;
|
|
12343
12243
|
var TabPanel = ({ children, value, ...props }) => {
|
|
12344
|
-
return /* @__PURE__ */
|
|
12244
|
+
return /* @__PURE__ */ jsx263(
|
|
12345
12245
|
StyledTabPanel,
|
|
12346
12246
|
{
|
|
12347
12247
|
value,
|
|
@@ -12355,7 +12255,7 @@ TabPanel.displayName = "TabPanel";
|
|
|
12355
12255
|
// src/components/Tabs/TabList.tsx
|
|
12356
12256
|
import styled68 from "styled-components";
|
|
12357
12257
|
import { List as RadixTabList } from "@radix-ui/react-tabs";
|
|
12358
|
-
import { jsx as
|
|
12258
|
+
import { jsx as jsx264 } from "react/jsx-runtime";
|
|
12359
12259
|
var StyledTabList = styled68(RadixTabList)`
|
|
12360
12260
|
${segmentedControlStyles}
|
|
12361
12261
|
|
|
@@ -12369,7 +12269,7 @@ var TabList = ({
|
|
|
12369
12269
|
ariaLabel,
|
|
12370
12270
|
...props
|
|
12371
12271
|
}) => {
|
|
12372
|
-
return /* @__PURE__ */
|
|
12272
|
+
return /* @__PURE__ */ jsx264(
|
|
12373
12273
|
StyledTabList,
|
|
12374
12274
|
{
|
|
12375
12275
|
$fullWidth: fullWidth,
|
|
@@ -12382,7 +12282,7 @@ var TabList = ({
|
|
|
12382
12282
|
TabList.displayName = "TabList";
|
|
12383
12283
|
|
|
12384
12284
|
// src/components/Tabs/TabItem.tsx
|
|
12385
|
-
import { forwardRef as
|
|
12285
|
+
import { forwardRef as forwardRef26, useEffect as useEffect12, useRef as useRef13 } from "react";
|
|
12386
12286
|
import styled69 from "styled-components";
|
|
12387
12287
|
import { Trigger as RadixTab } from "@radix-ui/react-tabs";
|
|
12388
12288
|
import { isNotNil as isNotNil29 } from "@wistia/type-guards";
|
|
@@ -12400,7 +12300,7 @@ var useTabsValue = () => {
|
|
|
12400
12300
|
};
|
|
12401
12301
|
|
|
12402
12302
|
// src/components/Tabs/TabItem.tsx
|
|
12403
|
-
import { jsxs as
|
|
12303
|
+
import { jsxs as jsxs42 } from "react/jsx-runtime";
|
|
12404
12304
|
var StyledTabItem = styled69(RadixTab)`
|
|
12405
12305
|
${segmentedControlItemStyles}
|
|
12406
12306
|
|
|
@@ -12408,7 +12308,7 @@ var StyledTabItem = styled69(RadixTab)`
|
|
|
12408
12308
|
outline: none;
|
|
12409
12309
|
}
|
|
12410
12310
|
`;
|
|
12411
|
-
var TabItem =
|
|
12311
|
+
var TabItem = forwardRef26(
|
|
12412
12312
|
({ disabled = false, icon, label, "aria-label": ariaLabel, value }, forwardedRef) => {
|
|
12413
12313
|
const selectedValue = useTabsValue();
|
|
12414
12314
|
const { setSelectedItemMeasurements } = useSelectedItemStyle();
|
|
@@ -12439,7 +12339,7 @@ var TabItem = forwardRef28(
|
|
|
12439
12339
|
resizeObserver.disconnect();
|
|
12440
12340
|
};
|
|
12441
12341
|
}, [selectedValue, setSelectedItemMeasurements, value]);
|
|
12442
|
-
return /* @__PURE__ */
|
|
12342
|
+
return /* @__PURE__ */ jsxs42(
|
|
12443
12343
|
StyledTabItem,
|
|
12444
12344
|
{
|
|
12445
12345
|
ref: combinedRef,
|
|
@@ -12458,10 +12358,10 @@ var TabItem = forwardRef28(
|
|
|
12458
12358
|
TabItem.displayName = "TabItem";
|
|
12459
12359
|
|
|
12460
12360
|
// src/components/Tabs/extractTabItems.ts
|
|
12461
|
-
import { Children as
|
|
12361
|
+
import { Children as Children6, Fragment as Fragment7, isValidElement as isValidElement2 } from "react";
|
|
12462
12362
|
var extractTabItems = (children) => {
|
|
12463
12363
|
const tabItems = [];
|
|
12464
|
-
|
|
12364
|
+
Children6.forEach(children, (child) => {
|
|
12465
12365
|
if (!isValidElement2(child)) {
|
|
12466
12366
|
return;
|
|
12467
12367
|
}
|
|
@@ -12481,7 +12381,7 @@ var extractTabItems = (children) => {
|
|
|
12481
12381
|
|
|
12482
12382
|
// src/components/Tabs/SelectedItemIndicator.tsx
|
|
12483
12383
|
import styled70 from "styled-components";
|
|
12484
|
-
import { jsx as
|
|
12384
|
+
import { jsx as jsx265 } from "react/jsx-runtime";
|
|
12485
12385
|
var TabsSelectedItemIndicatorDiv = styled70(SelectedItemIndicatorDiv)`
|
|
12486
12386
|
&:has(~ ${StyledTabItem}:focus-visible) {
|
|
12487
12387
|
outline: 2px solid var(--wui-color-focus-ring);
|
|
@@ -12493,11 +12393,11 @@ var SelectedItemIndicator2 = () => {
|
|
|
12493
12393
|
if (selectedValue == null) {
|
|
12494
12394
|
return null;
|
|
12495
12395
|
}
|
|
12496
|
-
return /* @__PURE__ */
|
|
12396
|
+
return /* @__PURE__ */ jsx265(TabsSelectedItemIndicatorDiv, { style: selectedItemIndicatorStyle });
|
|
12497
12397
|
};
|
|
12498
12398
|
|
|
12499
12399
|
// src/components/Tabs/Tabs.tsx
|
|
12500
|
-
import { jsx as
|
|
12400
|
+
import { jsx as jsx266, jsxs as jsxs43 } from "react/jsx-runtime";
|
|
12501
12401
|
var TabsContainer = styled71.div`
|
|
12502
12402
|
display: flex;
|
|
12503
12403
|
flex-direction: column;
|
|
@@ -12514,7 +12414,7 @@ var StyledTabsRoot = styled71(TabsRoot)`
|
|
|
12514
12414
|
flex-direction: column;
|
|
12515
12415
|
height: ${({ $stickyHeaders }) => $stickyHeaders ? "100%" : "auto"};
|
|
12516
12416
|
`;
|
|
12517
|
-
var Tabs =
|
|
12417
|
+
var Tabs = forwardRef27(
|
|
12518
12418
|
({
|
|
12519
12419
|
children,
|
|
12520
12420
|
fullWidth = true,
|
|
@@ -12532,7 +12432,7 @@ var Tabs = forwardRef29(
|
|
|
12532
12432
|
onValueChange: setInternalSelectedValue
|
|
12533
12433
|
} : { value: selectedValue, onValueChange: onSelectedValueChange };
|
|
12534
12434
|
const currentValue = defaultSelectedValue !== void 0 ? internalSelectedValue : selectedValue;
|
|
12535
|
-
return /* @__PURE__ */
|
|
12435
|
+
return /* @__PURE__ */ jsx266(TabsContainer, { $stickyHeaders: stickyHeaders, children: /* @__PURE__ */ jsx266(
|
|
12536
12436
|
StyledTabsRoot,
|
|
12537
12437
|
{
|
|
12538
12438
|
ref,
|
|
@@ -12540,14 +12440,14 @@ var Tabs = forwardRef29(
|
|
|
12540
12440
|
activationMode: "automatic",
|
|
12541
12441
|
...props,
|
|
12542
12442
|
...modeProps,
|
|
12543
|
-
children: /* @__PURE__ */
|
|
12544
|
-
/* @__PURE__ */
|
|
12443
|
+
children: /* @__PURE__ */ jsx266(TabsValueProvider, { value: currentValue, children: /* @__PURE__ */ jsxs43(SelectedItemStyleProvider, { children: [
|
|
12444
|
+
/* @__PURE__ */ jsxs43(
|
|
12545
12445
|
TabList,
|
|
12546
12446
|
{
|
|
12547
12447
|
ariaLabel,
|
|
12548
12448
|
fullWidth,
|
|
12549
12449
|
children: [
|
|
12550
|
-
/* @__PURE__ */
|
|
12450
|
+
/* @__PURE__ */ jsx266(SelectedItemIndicator2, {}),
|
|
12551
12451
|
tabItems.map((tab) => {
|
|
12552
12452
|
const {
|
|
12553
12453
|
value,
|
|
@@ -12557,7 +12457,7 @@ var Tabs = forwardRef29(
|
|
|
12557
12457
|
"aria-label": ariaLabelForTab
|
|
12558
12458
|
} = tab.props;
|
|
12559
12459
|
if (isNil14(icon)) {
|
|
12560
|
-
return /* @__PURE__ */
|
|
12460
|
+
return /* @__PURE__ */ jsx266(
|
|
12561
12461
|
TabItem,
|
|
12562
12462
|
{
|
|
12563
12463
|
disabled,
|
|
@@ -12568,7 +12468,7 @@ var Tabs = forwardRef29(
|
|
|
12568
12468
|
);
|
|
12569
12469
|
}
|
|
12570
12470
|
if (isNotNil30(label)) {
|
|
12571
|
-
return /* @__PURE__ */
|
|
12471
|
+
return /* @__PURE__ */ jsx266(
|
|
12572
12472
|
TabItem,
|
|
12573
12473
|
{
|
|
12574
12474
|
disabled,
|
|
@@ -12580,7 +12480,7 @@ var Tabs = forwardRef29(
|
|
|
12580
12480
|
);
|
|
12581
12481
|
}
|
|
12582
12482
|
if (isNotNil30(ariaLabelForTab)) {
|
|
12583
|
-
return /* @__PURE__ */
|
|
12483
|
+
return /* @__PURE__ */ jsx266(
|
|
12584
12484
|
TabItem,
|
|
12585
12485
|
{
|
|
12586
12486
|
"aria-label": ariaLabelForTab,
|
|
@@ -12596,7 +12496,7 @@ var Tabs = forwardRef29(
|
|
|
12596
12496
|
]
|
|
12597
12497
|
}
|
|
12598
12498
|
),
|
|
12599
|
-
/* @__PURE__ */
|
|
12499
|
+
/* @__PURE__ */ jsx266(StickyTabContent, { $stickyHeaders: stickyHeaders, children: tabItems.map((tab) => /* @__PURE__ */ jsx266(
|
|
12600
12500
|
TabPanel,
|
|
12601
12501
|
{
|
|
12602
12502
|
value: tab.props.value,
|
|
@@ -12612,18 +12512,18 @@ var Tabs = forwardRef29(
|
|
|
12612
12512
|
Tabs.displayName = "Tabs";
|
|
12613
12513
|
|
|
12614
12514
|
// src/components/Tabs/Tab.tsx
|
|
12615
|
-
import { forwardRef as
|
|
12616
|
-
import { jsx as
|
|
12617
|
-
var Tab =
|
|
12618
|
-
return /* @__PURE__ */
|
|
12515
|
+
import { forwardRef as forwardRef28 } from "react";
|
|
12516
|
+
import { jsx as jsx267 } from "react/jsx-runtime";
|
|
12517
|
+
var Tab = forwardRef28(({ children }, ref) => {
|
|
12518
|
+
return /* @__PURE__ */ jsx267("div", { ref, children });
|
|
12619
12519
|
});
|
|
12620
12520
|
Tab.displayName = "Tab";
|
|
12621
12521
|
|
|
12622
12522
|
// src/components/Tag/Tag.tsx
|
|
12623
|
-
import { forwardRef as
|
|
12523
|
+
import { forwardRef as forwardRef29 } from "react";
|
|
12624
12524
|
import styled72 from "styled-components";
|
|
12625
12525
|
import { isNil as isNil15, isNotNil as isNotNil31, isNonEmptyString as isNonEmptyString5 } from "@wistia/type-guards";
|
|
12626
|
-
import { Fragment as Fragment8, jsx as
|
|
12526
|
+
import { Fragment as Fragment8, jsx as jsx268, jsxs as jsxs44 } from "react/jsx-runtime";
|
|
12627
12527
|
var TagLabel = styled72.a`
|
|
12628
12528
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
12629
12529
|
font-size: var(--wui-typography-label-4-size);
|
|
@@ -12715,40 +12615,40 @@ var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
|
|
|
12715
12615
|
"for accessibility, onClickRemoveLabel must be provided if onClickRemove is provided"
|
|
12716
12616
|
);
|
|
12717
12617
|
}
|
|
12718
|
-
return /* @__PURE__ */
|
|
12719
|
-
/* @__PURE__ */
|
|
12720
|
-
/* @__PURE__ */
|
|
12618
|
+
return /* @__PURE__ */ jsxs44(Fragment8, { children: [
|
|
12619
|
+
/* @__PURE__ */ jsx268(TagDivider, { $colorScheme: colorScheme }),
|
|
12620
|
+
/* @__PURE__ */ jsxs44(
|
|
12721
12621
|
StyledRemoveButton,
|
|
12722
12622
|
{
|
|
12723
12623
|
$colorScheme: colorScheme,
|
|
12724
12624
|
onClick: onClickRemove,
|
|
12725
12625
|
type: "button",
|
|
12726
12626
|
children: [
|
|
12727
|
-
/* @__PURE__ */
|
|
12627
|
+
/* @__PURE__ */ jsx268(
|
|
12728
12628
|
Icon,
|
|
12729
12629
|
{
|
|
12730
12630
|
size: "sm",
|
|
12731
12631
|
type: "close"
|
|
12732
12632
|
}
|
|
12733
12633
|
),
|
|
12734
|
-
/* @__PURE__ */
|
|
12634
|
+
/* @__PURE__ */ jsx268(ScreenReaderOnly, { children: onClickRemoveLabel })
|
|
12735
12635
|
]
|
|
12736
12636
|
}
|
|
12737
12637
|
)
|
|
12738
12638
|
] });
|
|
12739
12639
|
};
|
|
12740
|
-
var Tag =
|
|
12640
|
+
var Tag = forwardRef29(
|
|
12741
12641
|
({ onClickRemove, colorScheme = "inherit", href, icon, label, onClickRemoveLabel, ...props }, ref) => {
|
|
12742
12642
|
const hasIcon = isNotNil31(icon);
|
|
12743
12643
|
const labelProps = isNotNil31(href) && isNonEmptyString5(href) ? { href, as: "a" } : { as: "span" };
|
|
12744
|
-
return /* @__PURE__ */
|
|
12644
|
+
return /* @__PURE__ */ jsxs44(
|
|
12745
12645
|
StyledTag,
|
|
12746
12646
|
{
|
|
12747
12647
|
ref,
|
|
12748
12648
|
$colorScheme: colorScheme,
|
|
12749
12649
|
...props,
|
|
12750
12650
|
children: [
|
|
12751
|
-
/* @__PURE__ */
|
|
12651
|
+
/* @__PURE__ */ jsxs44(
|
|
12752
12652
|
TagLabel,
|
|
12753
12653
|
{
|
|
12754
12654
|
...labelProps,
|
|
@@ -12759,7 +12659,7 @@ var Tag = forwardRef31(
|
|
|
12759
12659
|
]
|
|
12760
12660
|
}
|
|
12761
12661
|
),
|
|
12762
|
-
/* @__PURE__ */
|
|
12662
|
+
/* @__PURE__ */ jsx268(
|
|
12763
12663
|
RemoveButton,
|
|
12764
12664
|
{
|
|
12765
12665
|
colorScheme,
|
|
@@ -12777,7 +12677,7 @@ Tag.displayName = "Tag";
|
|
|
12777
12677
|
// src/components/Thumbnail/ThumbnailBadge.tsx
|
|
12778
12678
|
import styled73 from "styled-components";
|
|
12779
12679
|
import { isNotNil as isNotNil32 } from "@wistia/type-guards";
|
|
12780
|
-
import { jsx as
|
|
12680
|
+
import { jsx as jsx269, jsxs as jsxs45 } from "react/jsx-runtime";
|
|
12781
12681
|
var StyledThumbnailBadge = styled73.div`
|
|
12782
12682
|
align-items: center;
|
|
12783
12683
|
background-color: rgb(0 0 0 / 50%);
|
|
@@ -12803,15 +12703,15 @@ var StyledThumbnailBadge = styled73.div`
|
|
|
12803
12703
|
}
|
|
12804
12704
|
`;
|
|
12805
12705
|
var ThumbnailBadge = ({ icon, label, ...props }) => {
|
|
12806
|
-
return /* @__PURE__ */
|
|
12706
|
+
return /* @__PURE__ */ jsxs45(StyledThumbnailBadge, { ...props, children: [
|
|
12807
12707
|
isNotNil32(icon) && icon,
|
|
12808
|
-
/* @__PURE__ */
|
|
12708
|
+
/* @__PURE__ */ jsx269("span", { children: label })
|
|
12809
12709
|
] });
|
|
12810
12710
|
};
|
|
12811
12711
|
ThumbnailBadge.displayName = "ThumbnailBadge";
|
|
12812
12712
|
|
|
12813
12713
|
// src/components/Thumbnail/Thumbnail.tsx
|
|
12814
|
-
import { forwardRef as
|
|
12714
|
+
import { forwardRef as forwardRef30, useState as useState16, useRef as useRef14, useCallback as useCallback10, useMemo as useMemo9 } from "react";
|
|
12815
12715
|
import styled74 from "styled-components";
|
|
12816
12716
|
import { isNil as isNil16, isNotNil as isNotNil34, isUndefined as isUndefined5, isEmptyString as isEmptyString2, isString as isString2 } from "@wistia/type-guards";
|
|
12817
12717
|
|
|
@@ -12948,7 +12848,7 @@ var getBackgroundGradient = (gradientName = void 0) => {
|
|
|
12948
12848
|
};
|
|
12949
12849
|
|
|
12950
12850
|
// src/components/Thumbnail/ThumbnailStoryboardViewer.tsx
|
|
12951
|
-
import { jsx as
|
|
12851
|
+
import { jsx as jsx270 } from "react/jsx-runtime";
|
|
12952
12852
|
var getScaledDimensions = (originalAspectRatio, targetAspectRatio, viewerWidth, viewerHeight) => {
|
|
12953
12853
|
let scaledHeight = viewerHeight;
|
|
12954
12854
|
let scaledWidth = viewerWidth;
|
|
@@ -13041,18 +12941,18 @@ var ThumbnailStoryboardViewer = ({
|
|
|
13041
12941
|
backgroundPosition,
|
|
13042
12942
|
backgroundSize
|
|
13043
12943
|
};
|
|
13044
|
-
return /* @__PURE__ */
|
|
12944
|
+
return /* @__PURE__ */ jsx270(
|
|
13045
12945
|
"div",
|
|
13046
12946
|
{
|
|
13047
12947
|
...props,
|
|
13048
12948
|
style: viewerStyles,
|
|
13049
|
-
children: /* @__PURE__ */
|
|
12949
|
+
children: /* @__PURE__ */ jsx270("div", { style: storyboardStyles })
|
|
13050
12950
|
}
|
|
13051
12951
|
);
|
|
13052
12952
|
};
|
|
13053
12953
|
|
|
13054
12954
|
// src/components/Thumbnail/Thumbnail.tsx
|
|
13055
|
-
import { jsx as
|
|
12955
|
+
import { jsx as jsx271, jsxs as jsxs46 } from "react/jsx-runtime";
|
|
13056
12956
|
var WideThumbnailImage = styled74.img`
|
|
13057
12957
|
height: 100%;
|
|
13058
12958
|
object-fit: cover;
|
|
@@ -13065,7 +12965,7 @@ var SquareThumbnailImage = styled74.img`
|
|
|
13065
12965
|
`;
|
|
13066
12966
|
var ThumbnailImage = ({ thumbnailImageType, thumbnailUrl }) => {
|
|
13067
12967
|
if (thumbnailImageType === "wide") {
|
|
13068
|
-
return /* @__PURE__ */
|
|
12968
|
+
return /* @__PURE__ */ jsx271(
|
|
13069
12969
|
WideThumbnailImage,
|
|
13070
12970
|
{
|
|
13071
12971
|
alt: "",
|
|
@@ -13074,7 +12974,7 @@ var ThumbnailImage = ({ thumbnailImageType, thumbnailUrl }) => {
|
|
|
13074
12974
|
}
|
|
13075
12975
|
);
|
|
13076
12976
|
}
|
|
13077
|
-
return /* @__PURE__ */
|
|
12977
|
+
return /* @__PURE__ */ jsx271(
|
|
13078
12978
|
SquareThumbnailImage,
|
|
13079
12979
|
{
|
|
13080
12980
|
alt: "",
|
|
@@ -13112,7 +13012,7 @@ var getRelativeMousePosition = (elem, mouseEvent) => {
|
|
|
13112
13012
|
left: relativeLeft
|
|
13113
13013
|
};
|
|
13114
13014
|
};
|
|
13115
|
-
var Thumbnail =
|
|
13015
|
+
var Thumbnail = forwardRef30(
|
|
13116
13016
|
({
|
|
13117
13017
|
gradientBackground = "defaultMidOne",
|
|
13118
13018
|
thumbnailImageType = "square",
|
|
@@ -13173,7 +13073,7 @@ var Thumbnail = forwardRef32(
|
|
|
13173
13073
|
aspectRatio
|
|
13174
13074
|
} = storyboard;
|
|
13175
13075
|
const targetWidth = isString2(width) ? parseInt(width, 10) : Number(width);
|
|
13176
|
-
return /* @__PURE__ */
|
|
13076
|
+
return /* @__PURE__ */ jsx271(
|
|
13177
13077
|
ThumbnailStoryboardViewer,
|
|
13178
13078
|
{
|
|
13179
13079
|
frameCount,
|
|
@@ -13192,7 +13092,7 @@ var Thumbnail = forwardRef32(
|
|
|
13192
13092
|
if (shouldRenderStoryboard) {
|
|
13193
13093
|
thumbnailContent = renderStoryboard();
|
|
13194
13094
|
} else if (isNotNil34(thumbnailUrl)) {
|
|
13195
|
-
thumbnailContent = /* @__PURE__ */
|
|
13095
|
+
thumbnailContent = /* @__PURE__ */ jsx271(
|
|
13196
13096
|
ThumbnailImage,
|
|
13197
13097
|
{
|
|
13198
13098
|
thumbnailImageType,
|
|
@@ -13202,7 +13102,7 @@ var Thumbnail = forwardRef32(
|
|
|
13202
13102
|
} else {
|
|
13203
13103
|
thumbnailContent = null;
|
|
13204
13104
|
}
|
|
13205
|
-
return /* @__PURE__ */
|
|
13105
|
+
return /* @__PURE__ */ jsxs46(
|
|
13206
13106
|
StyledThumbnail,
|
|
13207
13107
|
{
|
|
13208
13108
|
ref,
|
|
@@ -13229,7 +13129,7 @@ Thumbnail.displayName = "Thumbnail";
|
|
|
13229
13129
|
import React2 from "react";
|
|
13230
13130
|
import styled75 from "styled-components";
|
|
13231
13131
|
import { isNonEmptyArray } from "@wistia/type-guards";
|
|
13232
|
-
import { jsx as
|
|
13132
|
+
import { jsx as jsx272 } from "react/jsx-runtime";
|
|
13233
13133
|
var StyledThumbnailCollage = styled75.div`
|
|
13234
13134
|
display: grid;
|
|
13235
13135
|
gap: var(--wui-space-01);
|
|
@@ -13312,7 +13212,7 @@ var ThumbnailCollage = ({
|
|
|
13312
13212
|
});
|
|
13313
13213
|
}) : [
|
|
13314
13214
|
// ThumbnailCollage will fallback to a Thumbnail with a gradient background if no children are provided
|
|
13315
|
-
/* @__PURE__ */
|
|
13215
|
+
/* @__PURE__ */ jsx272(
|
|
13316
13216
|
Thumbnail,
|
|
13317
13217
|
{
|
|
13318
13218
|
gradientBackground,
|
|
@@ -13321,7 +13221,7 @@ var ThumbnailCollage = ({
|
|
|
13321
13221
|
"fallback"
|
|
13322
13222
|
)
|
|
13323
13223
|
];
|
|
13324
|
-
return /* @__PURE__ */
|
|
13224
|
+
return /* @__PURE__ */ jsx272(
|
|
13325
13225
|
StyledThumbnailCollage,
|
|
13326
13226
|
{
|
|
13327
13227
|
$gradientBackground: gradientBackground,
|
|
@@ -13335,24 +13235,24 @@ var ThumbnailCollage = ({
|
|
|
13335
13235
|
// src/components/WistiaLogo/WistiaLogo.tsx
|
|
13336
13236
|
import styled76, { css as css40 } from "styled-components";
|
|
13337
13237
|
import { isNotNil as isNotNil35 } from "@wistia/type-guards";
|
|
13338
|
-
import { jsx as
|
|
13238
|
+
import { jsx as jsx273, jsxs as jsxs47 } from "react/jsx-runtime";
|
|
13339
13239
|
var renderBrandmark = (brandmarkColor, iconOnly) => {
|
|
13340
13240
|
if (iconOnly) {
|
|
13341
|
-
return /* @__PURE__ */
|
|
13241
|
+
return /* @__PURE__ */ jsx273(
|
|
13342
13242
|
"g",
|
|
13343
13243
|
{
|
|
13344
13244
|
"data-testid": "ui-wistia-logo-brandmark",
|
|
13345
13245
|
fill: brandmarkColor,
|
|
13346
|
-
children: /* @__PURE__ */
|
|
13246
|
+
children: /* @__PURE__ */ jsx273("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" })
|
|
13347
13247
|
}
|
|
13348
13248
|
);
|
|
13349
13249
|
}
|
|
13350
|
-
return /* @__PURE__ */
|
|
13250
|
+
return /* @__PURE__ */ jsx273(
|
|
13351
13251
|
"g",
|
|
13352
13252
|
{
|
|
13353
13253
|
"data-testid": "ui-wistia-logo-brandmark",
|
|
13354
13254
|
fill: brandmarkColor,
|
|
13355
|
-
children: /* @__PURE__ */
|
|
13255
|
+
children: /* @__PURE__ */ jsx273("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" })
|
|
13356
13256
|
}
|
|
13357
13257
|
);
|
|
13358
13258
|
};
|
|
@@ -13360,12 +13260,12 @@ var renderLogotype = (logotypeColor, iconOnly) => {
|
|
|
13360
13260
|
if (iconOnly) {
|
|
13361
13261
|
return null;
|
|
13362
13262
|
}
|
|
13363
|
-
return /* @__PURE__ */
|
|
13263
|
+
return /* @__PURE__ */ jsx273(
|
|
13364
13264
|
"g",
|
|
13365
13265
|
{
|
|
13366
13266
|
"data-testid": "ui-wistia-logo-logotype",
|
|
13367
13267
|
fill: logotypeColor,
|
|
13368
|
-
children: /* @__PURE__ */
|
|
13268
|
+
children: /* @__PURE__ */ jsx273("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" })
|
|
13369
13269
|
}
|
|
13370
13270
|
);
|
|
13371
13271
|
};
|
|
@@ -13433,7 +13333,7 @@ var WistiaLogo = ({
|
|
|
13433
13333
|
};
|
|
13434
13334
|
const brandmarkColor = VARIANT_COLORS[variant].brandmark;
|
|
13435
13335
|
const logotypeColor = VARIANT_COLORS[variant].logotype;
|
|
13436
|
-
const Logo = /* @__PURE__ */
|
|
13336
|
+
const Logo = /* @__PURE__ */ jsxs47(
|
|
13437
13337
|
WistiaLogoComponent,
|
|
13438
13338
|
{
|
|
13439
13339
|
$hoverColor: hoverColor,
|
|
@@ -13446,14 +13346,14 @@ var WistiaLogo = ({
|
|
|
13446
13346
|
xmlns: "http://www.w3.org/2000/svg",
|
|
13447
13347
|
...props,
|
|
13448
13348
|
children: [
|
|
13449
|
-
/* @__PURE__ */
|
|
13450
|
-
isNotNil35(description) ? /* @__PURE__ */
|
|
13349
|
+
/* @__PURE__ */ jsx273("title", { children: title }),
|
|
13350
|
+
isNotNil35(description) ? /* @__PURE__ */ jsx273("desc", { children: description }) : null,
|
|
13451
13351
|
renderBrandmark(brandmarkColor, iconOnly),
|
|
13452
13352
|
renderLogotype(logotypeColor, iconOnly)
|
|
13453
13353
|
]
|
|
13454
13354
|
}
|
|
13455
13355
|
);
|
|
13456
|
-
return href !== void 0 ? /* @__PURE__ */
|
|
13356
|
+
return href !== void 0 ? /* @__PURE__ */ jsx273("a", { href, children: Logo }) : Logo;
|
|
13457
13357
|
};
|
|
13458
13358
|
WistiaLogo.displayName = "WistiaLogo";
|
|
13459
13359
|
|
|
@@ -13464,7 +13364,7 @@ import styled78, { css as css41 } from "styled-components";
|
|
|
13464
13364
|
// src/components/List/ListItem.tsx
|
|
13465
13365
|
import styled77 from "styled-components";
|
|
13466
13366
|
import { isNil as isNil17 } from "@wistia/type-guards";
|
|
13467
|
-
import { jsx as
|
|
13367
|
+
import { jsx as jsx274 } from "react/jsx-runtime";
|
|
13468
13368
|
var ListItemComponent = styled77.li`
|
|
13469
13369
|
margin-bottom: var(--wui-space-02);
|
|
13470
13370
|
`;
|
|
@@ -13472,12 +13372,12 @@ var ListItem = ({ children }) => {
|
|
|
13472
13372
|
if (isNil17(children)) {
|
|
13473
13373
|
return null;
|
|
13474
13374
|
}
|
|
13475
|
-
return /* @__PURE__ */
|
|
13375
|
+
return /* @__PURE__ */ jsx274(ListItemComponent, { children });
|
|
13476
13376
|
};
|
|
13477
13377
|
ListItem.displayName = "ListItem";
|
|
13478
13378
|
|
|
13479
13379
|
// src/components/List/List.tsx
|
|
13480
|
-
import { jsx as
|
|
13380
|
+
import { jsx as jsx275, jsxs as jsxs48 } from "react/jsx-runtime";
|
|
13481
13381
|
var spacesStyle = css41`
|
|
13482
13382
|
overflow: hidden;
|
|
13483
13383
|
padding-left: 0;
|
|
@@ -13563,7 +13463,7 @@ var ListComponent = styled78.ul`
|
|
|
13563
13463
|
`;
|
|
13564
13464
|
var renderListComponent = (listItems, variant, { ...otherProps }) => {
|
|
13565
13465
|
const elementType = variant === "ordered" ? "ol" : "ul";
|
|
13566
|
-
return /* @__PURE__ */
|
|
13466
|
+
return /* @__PURE__ */ jsx275(
|
|
13567
13467
|
ListComponent,
|
|
13568
13468
|
{
|
|
13569
13469
|
as: elementType,
|
|
@@ -13580,7 +13480,7 @@ var renderListFromArray = (listItems, variant, otherProps) => {
|
|
|
13580
13480
|
const nextItem = listItems[i + 1];
|
|
13581
13481
|
const key = `item-${itemCount += 1}`;
|
|
13582
13482
|
if (Array.isArray(nextItem)) {
|
|
13583
|
-
return /* @__PURE__ */
|
|
13483
|
+
return /* @__PURE__ */ jsxs48(ListItem, { children: [
|
|
13584
13484
|
item,
|
|
13585
13485
|
renderListFromArray(nextItem, variant, otherProps)
|
|
13586
13486
|
] }, key);
|
|
@@ -13588,7 +13488,7 @@ var renderListFromArray = (listItems, variant, otherProps) => {
|
|
|
13588
13488
|
if (Array.isArray(item)) {
|
|
13589
13489
|
return null;
|
|
13590
13490
|
}
|
|
13591
|
-
return /* @__PURE__ */
|
|
13491
|
+
return /* @__PURE__ */ jsx275(ListItem, { children: item }, key);
|
|
13592
13492
|
});
|
|
13593
13493
|
return renderListComponent(items, variant, otherProps);
|
|
13594
13494
|
};
|
|
@@ -13642,8 +13542,6 @@ export {
|
|
|
13642
13542
|
FileAmountLimitValidator,
|
|
13643
13543
|
FileSizeValidator,
|
|
13644
13544
|
FileTypeValidator,
|
|
13645
|
-
FilterMenu,
|
|
13646
|
-
FilterMenuItem,
|
|
13647
13545
|
Form,
|
|
13648
13546
|
FormErrorSummary,
|
|
13649
13547
|
FormField,
|