@wistia/ui 0.5.1-beta.4cd1e5cc.3a549dd → 0.5.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 +112 -512
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +1 -32
- package/dist/index.d.ts +1 -32
- package/dist/index.mjs +57 -456
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.5.1
|
|
3
|
+
* @license @wistia/ui v0.5.1
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -92,7 +92,6 @@ __export(index_exports, {
|
|
|
92
92
|
WistiaLogo: () => WistiaLogo,
|
|
93
93
|
colorSchemeOptions: () => colorSchemeOptions,
|
|
94
94
|
copyToClipboard: () => copyToClipboard,
|
|
95
|
-
dateTime: () => dateTime,
|
|
96
95
|
ellipsisFlexParentStyle: () => ellipsisFlexParentStyle,
|
|
97
96
|
ellipsisStyle: () => ellipsisStyle,
|
|
98
97
|
iconSizeMap: () => iconSizeMap,
|
|
@@ -1561,396 +1560,6 @@ var copyToClipboard = async (textToCopy) => {
|
|
|
1561
1560
|
});
|
|
1562
1561
|
};
|
|
1563
1562
|
|
|
1564
|
-
// src/helpers/dateTime/constants.ts
|
|
1565
|
-
var defaultLocales = ["en-US"];
|
|
1566
|
-
var defaultTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone || "UTC";
|
|
1567
|
-
var secondsInMinute = 60;
|
|
1568
|
-
var minutesInHour = 60;
|
|
1569
|
-
var halfAnHourInMinutes = 30;
|
|
1570
|
-
var hoursInDay = 24;
|
|
1571
|
-
var milisecondsInSecond = 1e3;
|
|
1572
|
-
var millisecondsInDay = hoursInDay * minutesInHour * secondsInMinute * milisecondsInSecond;
|
|
1573
|
-
|
|
1574
|
-
// src/helpers/dateTime/buildTimeDuration.ts
|
|
1575
|
-
var buildTimeDuration = (numberOfMilliseconds) => {
|
|
1576
|
-
const numberOfSeconds = Math.floor(numberOfMilliseconds / milisecondsInSecond);
|
|
1577
|
-
const numberOfMinutes = Math.floor(numberOfSeconds / secondsInMinute);
|
|
1578
|
-
const numberOfHours = Math.floor(numberOfMinutes / minutesInHour);
|
|
1579
|
-
const seconds = numberOfSeconds - numberOfMinutes * secondsInMinute;
|
|
1580
|
-
const minutes = numberOfMinutes - numberOfHours * minutesInHour;
|
|
1581
|
-
return { seconds, minutes, hours: numberOfHours };
|
|
1582
|
-
};
|
|
1583
|
-
|
|
1584
|
-
// src/helpers/dateTime/isDate.ts
|
|
1585
|
-
var isDate = (date) => date instanceof Date;
|
|
1586
|
-
|
|
1587
|
-
// src/helpers/dateTime/isInvalidDate.ts
|
|
1588
|
-
var isInvalidDate = (date) => {
|
|
1589
|
-
if (!isDate(date)) {
|
|
1590
|
-
return true;
|
|
1591
|
-
}
|
|
1592
|
-
const time = date.getTime();
|
|
1593
|
-
return time === 0 || Number.isNaN(time);
|
|
1594
|
-
};
|
|
1595
|
-
|
|
1596
|
-
// src/helpers/dateTime/dateOnlyISOString.ts
|
|
1597
|
-
var dateOnlyISOString = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1598
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1599
|
-
return "";
|
|
1600
|
-
}
|
|
1601
|
-
try {
|
|
1602
|
-
const formatter = new Intl.DateTimeFormat(defaultLocales, {
|
|
1603
|
-
year: "numeric",
|
|
1604
|
-
month: "2-digit",
|
|
1605
|
-
day: "2-digit",
|
|
1606
|
-
timeZone
|
|
1607
|
-
});
|
|
1608
|
-
const parts = formatter.formatToParts(date);
|
|
1609
|
-
const partsAsObject = parts.reduce(
|
|
1610
|
-
(map, obj) => {
|
|
1611
|
-
map[obj.type] = obj.value;
|
|
1612
|
-
return map;
|
|
1613
|
-
},
|
|
1614
|
-
{}
|
|
1615
|
-
);
|
|
1616
|
-
return `${partsAsObject.year}-${partsAsObject.month}-${partsAsObject.day}`;
|
|
1617
|
-
} catch (error) {
|
|
1618
|
-
console.error(error);
|
|
1619
|
-
return "";
|
|
1620
|
-
}
|
|
1621
|
-
};
|
|
1622
|
-
|
|
1623
|
-
// src/helpers/dateTime/dateOnlyString.ts
|
|
1624
|
-
var dateOnlyString = (date, { timeZone = defaultTimeZone, omitYear = false } = {}) => {
|
|
1625
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1626
|
-
return "";
|
|
1627
|
-
}
|
|
1628
|
-
const formatOptions = omitYear ? { month: "short", day: "numeric", timeZone } : { dateStyle: "medium", timeZone };
|
|
1629
|
-
try {
|
|
1630
|
-
return new Intl.DateTimeFormat(defaultLocales, formatOptions).format(date);
|
|
1631
|
-
} catch (error) {
|
|
1632
|
-
console.error(error);
|
|
1633
|
-
return "";
|
|
1634
|
-
}
|
|
1635
|
-
};
|
|
1636
|
-
|
|
1637
|
-
// src/helpers/dateTime/dateOnlyStringForSentence.ts
|
|
1638
|
-
var dateOnlyStringForSentence = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1639
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1640
|
-
return "";
|
|
1641
|
-
}
|
|
1642
|
-
try {
|
|
1643
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1644
|
-
dateStyle: "long",
|
|
1645
|
-
timeZone
|
|
1646
|
-
}).format(date);
|
|
1647
|
-
} catch (error) {
|
|
1648
|
-
console.error(error);
|
|
1649
|
-
return "";
|
|
1650
|
-
}
|
|
1651
|
-
};
|
|
1652
|
-
|
|
1653
|
-
// src/helpers/dateTime/dateOnlyStringNumeric.ts
|
|
1654
|
-
var dateOnlyStringNumeric = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1655
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1656
|
-
return "";
|
|
1657
|
-
}
|
|
1658
|
-
try {
|
|
1659
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1660
|
-
year: "numeric",
|
|
1661
|
-
month: "2-digit",
|
|
1662
|
-
day: "2-digit",
|
|
1663
|
-
timeZone
|
|
1664
|
-
}).format(date);
|
|
1665
|
-
} catch (error) {
|
|
1666
|
-
console.error(error);
|
|
1667
|
-
return "";
|
|
1668
|
-
}
|
|
1669
|
-
};
|
|
1670
|
-
|
|
1671
|
-
// src/helpers/dateTime/dateTimeToDate.ts
|
|
1672
|
-
var dateTimeToDate = (dateTime2) => {
|
|
1673
|
-
const { year, month, dayOfMonth, hours, minutes } = dateTime2 ?? {};
|
|
1674
|
-
if (year !== void 0 && month !== void 0 && dayOfMonth !== void 0) {
|
|
1675
|
-
return new Date(year, month, dayOfMonth, hours ?? 0, minutes ?? 0);
|
|
1676
|
-
}
|
|
1677
|
-
return null;
|
|
1678
|
-
};
|
|
1679
|
-
|
|
1680
|
-
// src/helpers/dateTime/dateToDateTime.ts
|
|
1681
|
-
var dateToDateTime = (date) => {
|
|
1682
|
-
if (!isDate(date)) {
|
|
1683
|
-
return null;
|
|
1684
|
-
}
|
|
1685
|
-
return {
|
|
1686
|
-
year: date.getFullYear(),
|
|
1687
|
-
month: date.getMonth(),
|
|
1688
|
-
dayOfMonth: date.getDate(),
|
|
1689
|
-
hours: date.getHours(),
|
|
1690
|
-
minutes: date.getMinutes()
|
|
1691
|
-
};
|
|
1692
|
-
};
|
|
1693
|
-
|
|
1694
|
-
// src/helpers/dateTime/dateTimeToISO.ts
|
|
1695
|
-
var dateTimeToISO = (dateTime2) => dateTimeToDate(dateTime2)?.toISOString() ?? null;
|
|
1696
|
-
|
|
1697
|
-
// src/helpers/dateTime/dateTimeRounded.ts
|
|
1698
|
-
var dateTimeRounded = (dateTime2, toISOString = true) => {
|
|
1699
|
-
const first30Min = dateTime2.getMinutes() <= halfAnHourInMinutes;
|
|
1700
|
-
const hours = first30Min ? dateTime2.getHours() : dateTime2.getHours() + 1;
|
|
1701
|
-
const minutes = first30Min ? halfAnHourInMinutes : 0;
|
|
1702
|
-
const dateWithTime = {
|
|
1703
|
-
...dateToDateTime(dateTime2),
|
|
1704
|
-
hours,
|
|
1705
|
-
minutes
|
|
1706
|
-
};
|
|
1707
|
-
if (toISOString) {
|
|
1708
|
-
return dateTimeToISO(dateWithTime);
|
|
1709
|
-
}
|
|
1710
|
-
return dateTimeToDate(dateWithTime);
|
|
1711
|
-
};
|
|
1712
|
-
|
|
1713
|
-
// src/helpers/dateTime/dateTimeString.ts
|
|
1714
|
-
var import_type_guards3 = require("@wistia/type-guards");
|
|
1715
|
-
var dateTimeString = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1716
|
-
if ((0, import_type_guards3.isNil)(date)) {
|
|
1717
|
-
return "";
|
|
1718
|
-
}
|
|
1719
|
-
const formattedDate = new Date(date);
|
|
1720
|
-
if (isInvalidDate(formattedDate)) {
|
|
1721
|
-
return "";
|
|
1722
|
-
}
|
|
1723
|
-
try {
|
|
1724
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1725
|
-
dateStyle: "medium",
|
|
1726
|
-
timeStyle: "short",
|
|
1727
|
-
timeZone
|
|
1728
|
-
}).format(formattedDate);
|
|
1729
|
-
} catch (error) {
|
|
1730
|
-
console.error(error);
|
|
1731
|
-
return "";
|
|
1732
|
-
}
|
|
1733
|
-
};
|
|
1734
|
-
|
|
1735
|
-
// src/helpers/dateTime/dateTimeStringForSentence.ts
|
|
1736
|
-
var dateTimeStringForSentence = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1737
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1738
|
-
return "";
|
|
1739
|
-
}
|
|
1740
|
-
try {
|
|
1741
|
-
const { year, month, day, hour, minute, dayPeriod } = new Intl.DateTimeFormat(defaultLocales, {
|
|
1742
|
-
month: "long",
|
|
1743
|
-
day: "numeric",
|
|
1744
|
-
year: "numeric",
|
|
1745
|
-
hour: "numeric",
|
|
1746
|
-
minute: "2-digit",
|
|
1747
|
-
timeZone
|
|
1748
|
-
}).formatToParts(date).reduce((acc, part) => {
|
|
1749
|
-
if (part.type !== "literal") {
|
|
1750
|
-
acc[part.type] = part.value;
|
|
1751
|
-
}
|
|
1752
|
-
return acc;
|
|
1753
|
-
}, {});
|
|
1754
|
-
return `${month} ${day}, ${year}, ${hour}:${minute} ${dayPeriod}`;
|
|
1755
|
-
} catch (error) {
|
|
1756
|
-
console.error(error);
|
|
1757
|
-
return "";
|
|
1758
|
-
}
|
|
1759
|
-
};
|
|
1760
|
-
|
|
1761
|
-
// src/helpers/dateTime/dateUTCOffset.ts
|
|
1762
|
-
var dateUTCOffset = (date) => {
|
|
1763
|
-
const offsetInHours = date.getTimezoneOffset() / minutesInHour * -1;
|
|
1764
|
-
const hours = Math.round(offsetInHours);
|
|
1765
|
-
const minutes = (offsetInHours - hours) * minutesInHour;
|
|
1766
|
-
const prefix = hours >= 0 ? "+" : "";
|
|
1767
|
-
const hoursString = `${hours}`.padStart(2, "0");
|
|
1768
|
-
const minutesString = `${minutes}`.padStart(2, "0");
|
|
1769
|
-
return `${prefix}${hoursString}:${minutesString}`;
|
|
1770
|
-
};
|
|
1771
|
-
|
|
1772
|
-
// src/helpers/dateTime/dayOfWeekString.ts
|
|
1773
|
-
var dayOfWeekString = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1774
|
-
if (date === null) {
|
|
1775
|
-
return "";
|
|
1776
|
-
}
|
|
1777
|
-
try {
|
|
1778
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1779
|
-
weekday: "long",
|
|
1780
|
-
timeZone
|
|
1781
|
-
}).format(date);
|
|
1782
|
-
} catch (error) {
|
|
1783
|
-
console.error(error);
|
|
1784
|
-
return "";
|
|
1785
|
-
}
|
|
1786
|
-
};
|
|
1787
|
-
|
|
1788
|
-
// src/helpers/dateTime/padTimeInteger.ts
|
|
1789
|
-
var padTimeInteger = (num) => num.toString().padStart(2, "0");
|
|
1790
|
-
|
|
1791
|
-
// src/helpers/dateTime/mediaDurationString.ts
|
|
1792
|
-
var mediaDurationString = (numberOfMilliseconds) => {
|
|
1793
|
-
const { hours, minutes, seconds } = buildTimeDuration(numberOfMilliseconds);
|
|
1794
|
-
if (hours < 1) {
|
|
1795
|
-
return `${minutes}:${padTimeInteger(seconds)}`;
|
|
1796
|
-
}
|
|
1797
|
-
return `${hours}:${padTimeInteger(minutes)}:${padTimeInteger(seconds)}`;
|
|
1798
|
-
};
|
|
1799
|
-
|
|
1800
|
-
// src/helpers/dateTime/millisecondsToDurationISOString.ts
|
|
1801
|
-
var millisecondsToDurationISOString = (numberOfMilliseconds) => {
|
|
1802
|
-
const { seconds, minutes, hours } = buildTimeDuration(numberOfMilliseconds);
|
|
1803
|
-
let string = "PT";
|
|
1804
|
-
if (hours) {
|
|
1805
|
-
string += `${hours}H`;
|
|
1806
|
-
}
|
|
1807
|
-
if (minutes) {
|
|
1808
|
-
string += `${minutes}M`;
|
|
1809
|
-
}
|
|
1810
|
-
if (seconds) {
|
|
1811
|
-
string += `${seconds}S`;
|
|
1812
|
-
}
|
|
1813
|
-
if (!(seconds || minutes || hours)) {
|
|
1814
|
-
string += "0S";
|
|
1815
|
-
}
|
|
1816
|
-
return string;
|
|
1817
|
-
};
|
|
1818
|
-
|
|
1819
|
-
// src/helpers/dateTime/monthDayStringNumeric.ts
|
|
1820
|
-
var monthDayStringNumeric = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1821
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1822
|
-
return "";
|
|
1823
|
-
}
|
|
1824
|
-
try {
|
|
1825
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1826
|
-
month: "2-digit",
|
|
1827
|
-
day: "2-digit",
|
|
1828
|
-
timeZone
|
|
1829
|
-
}).format(date);
|
|
1830
|
-
} catch (error) {
|
|
1831
|
-
console.error(error);
|
|
1832
|
-
return "";
|
|
1833
|
-
}
|
|
1834
|
-
};
|
|
1835
|
-
|
|
1836
|
-
// src/helpers/dateTime/sessionDurationString.ts
|
|
1837
|
-
var sessionDurationString = (numberOfMilliseconds) => {
|
|
1838
|
-
const { hours, minutes, seconds } = buildTimeDuration(numberOfMilliseconds);
|
|
1839
|
-
return `${hours}:${padTimeInteger(minutes)}:${padTimeInteger(seconds)}`;
|
|
1840
|
-
};
|
|
1841
|
-
|
|
1842
|
-
// src/helpers/dateTime/getLocalDateParts.ts
|
|
1843
|
-
var import_type_guards4 = require("@wistia/type-guards");
|
|
1844
|
-
var getLocalDateParts = (date) => {
|
|
1845
|
-
const parts = new Intl.DateTimeFormat(defaultLocales, {
|
|
1846
|
-
year: "numeric",
|
|
1847
|
-
month: "numeric",
|
|
1848
|
-
day: "numeric",
|
|
1849
|
-
timeZone: defaultTimeZone
|
|
1850
|
-
}).formatToParts(date);
|
|
1851
|
-
const yearPart = parts.find((part) => part.type === "year");
|
|
1852
|
-
const monthPart = parts.find((part) => part.type === "month");
|
|
1853
|
-
const dayPart = parts.find((part) => part.type === "day");
|
|
1854
|
-
if ((0, import_type_guards4.isNil)(yearPart) || (0, import_type_guards4.isNil)(monthPart) || (0, import_type_guards4.isNil)(dayPart)) {
|
|
1855
|
-
throw new Error("Failed to parse date parts");
|
|
1856
|
-
}
|
|
1857
|
-
const year = parseInt(yearPart.value, 10);
|
|
1858
|
-
const month = parseInt(monthPart.value, 10);
|
|
1859
|
-
const day = parseInt(dayPart.value, 10);
|
|
1860
|
-
return { year, month, day };
|
|
1861
|
-
};
|
|
1862
|
-
|
|
1863
|
-
// src/helpers/dateTime/differenceInCalendarDays.ts
|
|
1864
|
-
var differenceInCalendarDays = (dateLeft, dateRight) => {
|
|
1865
|
-
const leftDate = isDate(dateLeft) ? dateLeft : new Date(dateLeft);
|
|
1866
|
-
const rightDate = isDate(dateRight) ? dateRight : new Date(dateRight);
|
|
1867
|
-
if (Number.isNaN(leftDate.getTime()) || Number.isNaN(rightDate.getTime())) {
|
|
1868
|
-
return NaN;
|
|
1869
|
-
}
|
|
1870
|
-
const { year: y1, month: m1, day: d1 } = getLocalDateParts(leftDate);
|
|
1871
|
-
const { year: y2, month: m2, day: d2 } = getLocalDateParts(rightDate);
|
|
1872
|
-
const startOfDayLeft = new Date(y1, m1 - 1, d1).getTime();
|
|
1873
|
-
const startOfDayRight = new Date(y2, m2 - 1, d2).getTime();
|
|
1874
|
-
const msDiff = startOfDayLeft - startOfDayRight;
|
|
1875
|
-
return Math.round(msDiff / millisecondsInDay);
|
|
1876
|
-
};
|
|
1877
|
-
|
|
1878
|
-
// src/helpers/dateTime/timeAgoString.ts
|
|
1879
|
-
var timeAgoString = (date, { nowAnchor = /* @__PURE__ */ new Date() } = {}) => {
|
|
1880
|
-
if (isInvalidDate(date)) {
|
|
1881
|
-
return "";
|
|
1882
|
-
}
|
|
1883
|
-
const minutesAgo = (nowAnchor.valueOf() - date.valueOf()) / (secondsInMinute * milisecondsInSecond);
|
|
1884
|
-
const minutesAgoRounded = Math.round(minutesAgo);
|
|
1885
|
-
const differenceInDays = differenceInCalendarDays(nowAnchor, date);
|
|
1886
|
-
if (minutesAgo < 0) {
|
|
1887
|
-
return dateTimeString(date);
|
|
1888
|
-
}
|
|
1889
|
-
if (minutesAgo < 1) {
|
|
1890
|
-
return "< 1 minute ago";
|
|
1891
|
-
}
|
|
1892
|
-
if (minutesAgoRounded < 2) {
|
|
1893
|
-
return "1 minute ago";
|
|
1894
|
-
}
|
|
1895
|
-
if (minutesAgoRounded <= minutesInHour) {
|
|
1896
|
-
return `${minutesAgoRounded} minutes ago`;
|
|
1897
|
-
}
|
|
1898
|
-
if (differenceInDays === 0) {
|
|
1899
|
-
return `Today, ${Intl.DateTimeFormat(defaultLocales, { timeStyle: "short" }).format(date)}`;
|
|
1900
|
-
}
|
|
1901
|
-
if (differenceInDays === 1) {
|
|
1902
|
-
return `Yesterday, ${Intl.DateTimeFormat(defaultLocales, { timeStyle: "short" }).format(date)}`;
|
|
1903
|
-
}
|
|
1904
|
-
if (date.getFullYear() === nowAnchor.getFullYear()) {
|
|
1905
|
-
return Intl.DateTimeFormat(defaultLocales, {
|
|
1906
|
-
day: "numeric",
|
|
1907
|
-
month: "short",
|
|
1908
|
-
hour: "numeric",
|
|
1909
|
-
minute: "2-digit"
|
|
1910
|
-
}).format(date);
|
|
1911
|
-
}
|
|
1912
|
-
return dateTimeString(date);
|
|
1913
|
-
};
|
|
1914
|
-
|
|
1915
|
-
// src/helpers/dateTime/timeOnlyString.ts
|
|
1916
|
-
var timeOnlyString = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1917
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1918
|
-
return "";
|
|
1919
|
-
}
|
|
1920
|
-
try {
|
|
1921
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1922
|
-
timeStyle: "short",
|
|
1923
|
-
timeZone
|
|
1924
|
-
}).format(date);
|
|
1925
|
-
} catch (error) {
|
|
1926
|
-
console.error(error);
|
|
1927
|
-
return "";
|
|
1928
|
-
}
|
|
1929
|
-
};
|
|
1930
|
-
|
|
1931
|
-
// src/helpers/dateTime/index.ts
|
|
1932
|
-
var dateTime = {
|
|
1933
|
-
buildTimeDuration,
|
|
1934
|
-
dateOnlyISOString,
|
|
1935
|
-
dateOnlyString,
|
|
1936
|
-
dateOnlyStringForSentence,
|
|
1937
|
-
dateOnlyStringNumeric,
|
|
1938
|
-
dateTimeRounded,
|
|
1939
|
-
dateTimeString,
|
|
1940
|
-
dateTimeStringForSentence,
|
|
1941
|
-
dateTimeToDate,
|
|
1942
|
-
dateTimeToISO,
|
|
1943
|
-
dateToDateTime,
|
|
1944
|
-
dateUTCOffset,
|
|
1945
|
-
dayOfWeekString,
|
|
1946
|
-
mediaDurationString,
|
|
1947
|
-
millisecondsToDurationISOString,
|
|
1948
|
-
monthDayStringNumeric,
|
|
1949
|
-
sessionDurationString,
|
|
1950
|
-
timeAgoString,
|
|
1951
|
-
timeOnlyString
|
|
1952
|
-
};
|
|
1953
|
-
|
|
1954
1563
|
// src/helpers/mq/mq.ts
|
|
1955
1564
|
var import_polished = require("polished");
|
|
1956
1565
|
|
|
@@ -2008,7 +1617,7 @@ var useBoolean = (initialValue = false) => {
|
|
|
2008
1617
|
};
|
|
2009
1618
|
|
|
2010
1619
|
// src/hooks/useMq/useMq.ts
|
|
2011
|
-
var
|
|
1620
|
+
var import_type_guards3 = require("@wistia/type-guards");
|
|
2012
1621
|
|
|
2013
1622
|
// src/hooks/useWindowSize/useWindowSize.ts
|
|
2014
1623
|
var import_react4 = require("react");
|
|
@@ -2070,7 +1679,7 @@ var useActiveMq = () => {
|
|
|
2070
1679
|
const keys = Object.keys(mq2);
|
|
2071
1680
|
return keys.filter((key) => {
|
|
2072
1681
|
const value = mq2[key];
|
|
2073
|
-
return (0,
|
|
1682
|
+
return (0, import_type_guards3.isBoolean)(value) && value;
|
|
2074
1683
|
});
|
|
2075
1684
|
};
|
|
2076
1685
|
|
|
@@ -2080,10 +1689,10 @@ var import_react6 = require("react");
|
|
|
2080
1689
|
// src/private/hooks/useEvent/useEvent.ts
|
|
2081
1690
|
var import_react5 = require("react");
|
|
2082
1691
|
|
|
2083
|
-
// src/private/helpers/
|
|
2084
|
-
var
|
|
2085
|
-
var
|
|
2086
|
-
return (0,
|
|
1692
|
+
// src/private/helpers/isObjectRef/isObjectRef.ts
|
|
1693
|
+
var import_type_guards4 = require("@wistia/type-guards");
|
|
1694
|
+
var isObjectRef = (value) => {
|
|
1695
|
+
return (0, import_type_guards4.isNotNil)(value) && (0, import_type_guards4.isRecord)(value) && "current" in value;
|
|
2087
1696
|
};
|
|
2088
1697
|
|
|
2089
1698
|
// src/private/hooks/useEvent/useEvent.ts
|
|
@@ -2102,7 +1711,7 @@ var useEvent = (eventName, eventHandler, eventTarget = window, eventOptions = {}
|
|
|
2102
1711
|
savedEventOptions.current = eventOptions;
|
|
2103
1712
|
}, [eventOptions]);
|
|
2104
1713
|
(0, import_react5.useEffect)(() => {
|
|
2105
|
-
const target =
|
|
1714
|
+
const target = isObjectRef(eventTarget) ? eventTarget.current : eventTarget;
|
|
2106
1715
|
if (!eventName || !isEventTargetSupported(target)) {
|
|
2107
1716
|
return;
|
|
2108
1717
|
}
|
|
@@ -2148,10 +1757,10 @@ var useKey = (key, eventHandler, { eventName = "keydown", eventTarget, eventOpti
|
|
|
2148
1757
|
|
|
2149
1758
|
// src/hooks/useAriaLive/useAriaLive.tsx
|
|
2150
1759
|
var import_react7 = require("react");
|
|
2151
|
-
var
|
|
1760
|
+
var import_type_guards5 = require("@wistia/type-guards");
|
|
2152
1761
|
var useAriaLive = () => {
|
|
2153
1762
|
const context = (0, import_react7.useContext)(AriaLiveContext);
|
|
2154
|
-
if ((0,
|
|
1763
|
+
if ((0, import_type_guards5.isNil)(context)) {
|
|
2155
1764
|
throw new Error("useAriaLive must be used within an AriaLiveProvider");
|
|
2156
1765
|
}
|
|
2157
1766
|
return context;
|
|
@@ -2164,10 +1773,10 @@ var import_sonner2 = require("sonner");
|
|
|
2164
1773
|
// src/private/components/Toast/Toast.tsx
|
|
2165
1774
|
var import_react8 = require("react");
|
|
2166
1775
|
var import_styled_components15 = __toESM(require("styled-components"));
|
|
2167
|
-
var
|
|
1776
|
+
var import_type_guards7 = require("@wistia/type-guards");
|
|
2168
1777
|
|
|
2169
1778
|
// src/components/Ellipsis/Ellipsis.tsx
|
|
2170
|
-
var
|
|
1779
|
+
var import_type_guards6 = require("@wistia/type-guards");
|
|
2171
1780
|
var import_styled_components13 = __toESM(require("styled-components"));
|
|
2172
1781
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
2173
1782
|
var ellipsisStyle = import_styled_components13.css`
|
|
@@ -2199,7 +1808,7 @@ var ellipsisFlexParentStyle = import_styled_components13.css`
|
|
|
2199
1808
|
var EllipsisComponent = import_styled_components13.default.div`
|
|
2200
1809
|
${ellipsisStyle};
|
|
2201
1810
|
${({ $lines }) => {
|
|
2202
|
-
if ((0,
|
|
1811
|
+
if ((0, import_type_guards6.isNotNil)($lines)) {
|
|
2203
1812
|
return import_styled_components13.css`
|
|
2204
1813
|
-webkit-box-orient: vertical;
|
|
2205
1814
|
-webkit-line-clamp: ${$lines};
|
|
@@ -2381,7 +1990,7 @@ var StyledToast = import_styled_components15.default.div`
|
|
|
2381
1990
|
}
|
|
2382
1991
|
`;
|
|
2383
1992
|
var Action = ({ actionButton }) => {
|
|
2384
|
-
if ((0,
|
|
1993
|
+
if ((0, import_type_guards7.isNotNil)(actionButton) && (0, import_react8.isValidElement)(actionButton)) {
|
|
2385
1994
|
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ActionWrapper, { children: (0, import_react8.cloneElement)(actionButton, {
|
|
2386
1995
|
variant: "soft",
|
|
2387
1996
|
// force Button variant
|
|
@@ -2405,7 +2014,7 @@ var Toast = ({
|
|
|
2405
2014
|
$colorScheme: colorScheme,
|
|
2406
2015
|
children: [
|
|
2407
2016
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(MessageWrapper, { children: [
|
|
2408
|
-
(0,
|
|
2017
|
+
(0, import_type_guards7.isNotNil)(icon) ? icon : null,
|
|
2409
2018
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Message, { lines: 3, children: message })
|
|
2410
2019
|
] }),
|
|
2411
2020
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Action, { actionButton: action })
|
|
@@ -2446,7 +2055,7 @@ var import_styled_components21 = __toESM(require("styled-components"));
|
|
|
2446
2055
|
// src/components/Button/Button.tsx
|
|
2447
2056
|
var import_react12 = require("react");
|
|
2448
2057
|
var import_styled_components20 = __toESM(require("styled-components"));
|
|
2449
|
-
var
|
|
2058
|
+
var import_type_guards11 = require("@wistia/type-guards");
|
|
2450
2059
|
|
|
2451
2060
|
// src/css/buttonResetCss.tsx
|
|
2452
2061
|
var import_styled_components16 = require("styled-components");
|
|
@@ -2650,7 +2259,7 @@ var buttonSizeStyles = {
|
|
|
2650
2259
|
};
|
|
2651
2260
|
|
|
2652
2261
|
// src/components/Icon/Icon.tsx
|
|
2653
|
-
var
|
|
2262
|
+
var import_type_guards9 = require("@wistia/type-guards");
|
|
2654
2263
|
var import_styled_components18 = __toESM(require("styled-components"));
|
|
2655
2264
|
|
|
2656
2265
|
// src/components/Icon/icons/AbTestIcon.tsx
|
|
@@ -5811,7 +5420,7 @@ var iconMap = {
|
|
|
5811
5420
|
};
|
|
5812
5421
|
|
|
5813
5422
|
// src/private/hooks/useResponsiveProp/useResponsiveProp.ts
|
|
5814
|
-
var
|
|
5423
|
+
var import_type_guards8 = require("@wistia/type-guards");
|
|
5815
5424
|
var import_react10 = require("react");
|
|
5816
5425
|
var isResponsiveObject = (values) => {
|
|
5817
5426
|
return typeof values === "object" && values !== null && !Array.isArray(values) && "base" in values;
|
|
@@ -5819,9 +5428,9 @@ var isResponsiveObject = (values) => {
|
|
|
5819
5428
|
var useResponsiveProp = (values) => {
|
|
5820
5429
|
const activeMediaQueries = useActiveMq();
|
|
5821
5430
|
return (0, import_react10.useMemo)(() => {
|
|
5822
|
-
if ((0,
|
|
5431
|
+
if ((0, import_type_guards8.isRecord)(values) && isResponsiveObject(values)) {
|
|
5823
5432
|
const mq2 = activeMediaQueries.find((key) => key in values);
|
|
5824
|
-
return (0,
|
|
5433
|
+
return (0, import_type_guards8.isNotUndefined)(mq2) && (0, import_type_guards8.isNotUndefined)(values[mq2]) ? values[mq2] : values.base;
|
|
5825
5434
|
}
|
|
5826
5435
|
return values;
|
|
5827
5436
|
}, [activeMediaQueries, values]);
|
|
@@ -5848,13 +5457,13 @@ var Icon = ({
|
|
|
5848
5457
|
...otherProps
|
|
5849
5458
|
}) => {
|
|
5850
5459
|
const responsiveSize = useResponsiveProp(size);
|
|
5851
|
-
if ((0,
|
|
5460
|
+
if ((0, import_type_guards9.isNil)(type)) {
|
|
5852
5461
|
throw new Error("An Icon component requires a `type` prop to be provided");
|
|
5853
5462
|
}
|
|
5854
|
-
if ((0,
|
|
5463
|
+
if ((0, import_type_guards9.isNil)(iconMap[type])) {
|
|
5855
5464
|
throw new Error(`Type "${type}" does not exist, please update type prop in Icon component.`);
|
|
5856
5465
|
}
|
|
5857
|
-
if ((0,
|
|
5466
|
+
if ((0, import_type_guards9.isNil)(iconSizeMap[responsiveSize])) {
|
|
5858
5467
|
throw new Error(
|
|
5859
5468
|
`Size "${responsiveSize}" does not exist, please update size prop in Icon component.`
|
|
5860
5469
|
);
|
|
@@ -5886,12 +5495,12 @@ Icon.displayName = "Icon";
|
|
|
5886
5495
|
|
|
5887
5496
|
// src/components/Link/Link.tsx
|
|
5888
5497
|
var import_react11 = require("react");
|
|
5889
|
-
var
|
|
5498
|
+
var import_type_guards10 = require("@wistia/type-guards");
|
|
5890
5499
|
var import_styled_components19 = __toESM(require("styled-components"));
|
|
5891
5500
|
var import_react_router_dom = require("react-router-dom");
|
|
5892
5501
|
var import_jsx_runtime161 = require("react/jsx-runtime");
|
|
5893
5502
|
var generateHref = (href, type, disabled) => {
|
|
5894
|
-
if (disabled || (0,
|
|
5503
|
+
if (disabled || (0, import_type_guards10.isNil)(href)) {
|
|
5895
5504
|
return void 0;
|
|
5896
5505
|
}
|
|
5897
5506
|
let to = href;
|
|
@@ -5903,12 +5512,12 @@ var generateHref = (href, type, disabled) => {
|
|
|
5903
5512
|
}
|
|
5904
5513
|
return to;
|
|
5905
5514
|
};
|
|
5906
|
-
var isButton = (props) => (0,
|
|
5907
|
-
var isLink = (props) => (0,
|
|
5515
|
+
var isButton = (props) => (0, import_type_guards10.isUndefined)(props.href);
|
|
5516
|
+
var isLink = (props) => (0, import_type_guards10.isNotUndefined)(props.href);
|
|
5908
5517
|
var StyledLink = import_styled_components19.default.a`
|
|
5909
5518
|
--link-icon-size: 14px;
|
|
5910
5519
|
|
|
5911
|
-
${({ href }) => (0,
|
|
5520
|
+
${({ href }) => (0, import_type_guards10.isNil)(href) && buttonResetCss};
|
|
5912
5521
|
${({ $colorScheme }) => getColorScheme($colorScheme)}
|
|
5913
5522
|
cursor: pointer;
|
|
5914
5523
|
font-family: var(--wui-typography-family-default);
|
|
@@ -5952,7 +5561,7 @@ var Link = (0, import_react11.forwardRef)(
|
|
|
5952
5561
|
} finally {
|
|
5953
5562
|
if (routingCallback !== null) {
|
|
5954
5563
|
routingCallback();
|
|
5955
|
-
} else if ((0,
|
|
5564
|
+
} else if ((0, import_type_guards10.isNotNil)(to)) {
|
|
5956
5565
|
window.location.assign(to);
|
|
5957
5566
|
} else {
|
|
5958
5567
|
}
|
|
@@ -6015,7 +5624,7 @@ Link.displayName = "Link";
|
|
|
6015
5624
|
|
|
6016
5625
|
// src/components/Button/Button.tsx
|
|
6017
5626
|
var import_jsx_runtime162 = require("react/jsx-runtime");
|
|
6018
|
-
var isLink2 = (props) => (0,
|
|
5627
|
+
var isLink2 = (props) => (0, import_type_guards11.isNotUndefined)(props.href);
|
|
6019
5628
|
var StyledButton = import_styled_components20.default.button`
|
|
6020
5629
|
${buttonResetCss}
|
|
6021
5630
|
${({ $colorScheme }) => getColorScheme($colorScheme)}
|
|
@@ -6056,8 +5665,8 @@ var ButtonContent = ({
|
|
|
6056
5665
|
/* @__PURE__ */ (0, import_jsx_runtime162.jsxs)(
|
|
6057
5666
|
StyledButtonContent,
|
|
6058
5667
|
{
|
|
6059
|
-
$hasLeftIcon: (0,
|
|
6060
|
-
$hasRightIcon: (0,
|
|
5668
|
+
$hasLeftIcon: (0, import_type_guards11.isNotNil)(leftIcon),
|
|
5669
|
+
$hasRightIcon: (0, import_type_guards11.isNotNil)(rightIcon),
|
|
6061
5670
|
$isLoading: isLoading,
|
|
6062
5671
|
children: [
|
|
6063
5672
|
leftIcon ?? null,
|
|
@@ -6125,7 +5734,7 @@ var Button = (0, import_react12.forwardRef)(
|
|
|
6125
5734
|
event.preventDefault();
|
|
6126
5735
|
return;
|
|
6127
5736
|
}
|
|
6128
|
-
if ((0,
|
|
5737
|
+
if ((0, import_type_guards11.isNotNil)(onClick)) {
|
|
6129
5738
|
onClick(event);
|
|
6130
5739
|
}
|
|
6131
5740
|
};
|
|
@@ -6286,7 +5895,7 @@ ActionButton.displayName = "ActionButton";
|
|
|
6286
5895
|
|
|
6287
5896
|
// src/components/Avatar/Avatar.tsx
|
|
6288
5897
|
var import_react14 = require("react");
|
|
6289
|
-
var
|
|
5898
|
+
var import_type_guards13 = require("@wistia/type-guards");
|
|
6290
5899
|
var import_styled_components23 = __toESM(require("styled-components"));
|
|
6291
5900
|
|
|
6292
5901
|
// src/components/ColorSchemeWrapper/ColorSchemeWrapper.tsx
|
|
@@ -6329,13 +5938,13 @@ var ColorSchemeWrapper = ({
|
|
|
6329
5938
|
ColorSchemeWrapper.displayName = "ColorSchemeWrapper";
|
|
6330
5939
|
|
|
6331
5940
|
// src/components/Avatar/formatNameForDisplay.tsx
|
|
6332
|
-
var
|
|
5941
|
+
var import_type_guards12 = require("@wistia/type-guards");
|
|
6333
5942
|
var containsEmojiCharacter = (char) => {
|
|
6334
5943
|
const emojiRegex = /<a?:.+?:\d{18}>|\p{Extended_Pictographic}/gu;
|
|
6335
5944
|
return emojiRegex.test(char);
|
|
6336
5945
|
};
|
|
6337
5946
|
var formatNameForDisplay = (name) => {
|
|
6338
|
-
if ((0,
|
|
5947
|
+
if ((0, import_type_guards12.isNil)(name) || !(0, import_type_guards12.isString)(name) || (0, import_type_guards12.isEmptyString)(name) || containsEmojiCharacter(name)) {
|
|
6339
5948
|
return "U";
|
|
6340
5949
|
}
|
|
6341
5950
|
const firstChar = name.trim().substring(0, 1);
|
|
@@ -6398,7 +6007,7 @@ var AvatarWrapper = import_styled_components23.default.div`
|
|
|
6398
6007
|
max-height: ${({ $maxHeight }) => $maxHeight}px;
|
|
6399
6008
|
`;
|
|
6400
6009
|
var chooseColorScheme = (name) => {
|
|
6401
|
-
if ((0,
|
|
6010
|
+
if ((0, import_type_guards13.isNil)(name) || name === "Anonymous") {
|
|
6402
6011
|
return "default";
|
|
6403
6012
|
}
|
|
6404
6013
|
const filteredColors = colorSchemeOptions.filter(
|
|
@@ -6431,7 +6040,7 @@ var Avatar = ({
|
|
|
6431
6040
|
};
|
|
6432
6041
|
const avatarSize = heightAndWidth ?? avatarSizeMap[size];
|
|
6433
6042
|
const avatarColor = (0, import_react14.useMemo)(() => chooseColorScheme(name), [name]);
|
|
6434
|
-
const showInitials = (0,
|
|
6043
|
+
const showInitials = (0, import_type_guards13.isNil)(imageUrl) || imageLoadState === "error";
|
|
6435
6044
|
return /* @__PURE__ */ (0, import_jsx_runtime165.jsx)(
|
|
6436
6045
|
AvatarWrapper,
|
|
6437
6046
|
{
|
|
@@ -6462,7 +6071,7 @@ Avatar.displayName = "Avatar";
|
|
|
6462
6071
|
// src/components/Badge/Badge.tsx
|
|
6463
6072
|
var import_react15 = require("react");
|
|
6464
6073
|
var import_styled_components24 = __toESM(require("styled-components"));
|
|
6465
|
-
var
|
|
6074
|
+
var import_type_guards14 = require("@wistia/type-guards");
|
|
6466
6075
|
var import_jsx_runtime166 = require("react/jsx-runtime");
|
|
6467
6076
|
var StyledBadge = import_styled_components24.default.div`
|
|
6468
6077
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
@@ -6486,7 +6095,7 @@ var StyledBadge = import_styled_components24.default.div`
|
|
|
6486
6095
|
`;
|
|
6487
6096
|
var Badge = (0, import_react15.forwardRef)(
|
|
6488
6097
|
({ colorScheme = "inherit", label, icon, ...otherProps }, ref) => {
|
|
6489
|
-
const hasIcon = (0,
|
|
6098
|
+
const hasIcon = (0, import_type_guards14.isNotNil)(icon);
|
|
6490
6099
|
return /* @__PURE__ */ (0, import_jsx_runtime166.jsxs)(
|
|
6491
6100
|
StyledBadge,
|
|
6492
6101
|
{
|
|
@@ -6507,7 +6116,7 @@ Badge.displayName = "Badge";
|
|
|
6507
6116
|
// src/components/Box/Box.tsx
|
|
6508
6117
|
var import_react16 = require("react");
|
|
6509
6118
|
var import_styled_components25 = __toESM(require("styled-components"));
|
|
6510
|
-
var
|
|
6119
|
+
var import_type_guards15 = require("@wistia/type-guards");
|
|
6511
6120
|
|
|
6512
6121
|
// src/private/helpers/makePolymorphic/makePolymorphic.tsx
|
|
6513
6122
|
var makePolymorphic = (component) => {
|
|
@@ -6518,8 +6127,8 @@ var makePolymorphic = (component) => {
|
|
|
6518
6127
|
var import_jsx_runtime167 = require("react/jsx-runtime");
|
|
6519
6128
|
var isDev = process.env["NODE_ENV"] === "development" || process.env["NODE_ENV"] === "test";
|
|
6520
6129
|
var getGapStyle = (gap) => {
|
|
6521
|
-
if ((0,
|
|
6522
|
-
if ((0,
|
|
6130
|
+
if ((0, import_type_guards15.isNotNil)(gap)) {
|
|
6131
|
+
if ((0, import_type_guards15.isRecord)(gap)) {
|
|
6523
6132
|
return Object.entries(gap).map(([key, value]) => {
|
|
6524
6133
|
return `${key}-gap: var(--wui-${value})};`;
|
|
6525
6134
|
}).join("");
|
|
@@ -6562,25 +6171,25 @@ var StyledBoxComponent = import_styled_components25.default.div`
|
|
|
6562
6171
|
align-content: ${({ $alignContent }) => $alignContent};
|
|
6563
6172
|
align-items: ${({ $alignItems }) => $alignItems};
|
|
6564
6173
|
align-self: ${({ $alignSelf }) => $alignSelf ?? null};
|
|
6565
|
-
display: ${({ $inline }) => (0,
|
|
6566
|
-
flex-basis: ${({ $basis }) => (0,
|
|
6174
|
+
display: ${({ $inline }) => (0, import_type_guards15.isNotNil)($inline) && $inline ? "inline-flex" : "flex"};
|
|
6175
|
+
flex-basis: ${({ $basis }) => (0, import_type_guards15.isNotNil)($basis) ? $basis : null};
|
|
6567
6176
|
flex-direction: ${({ $flexDirection }) => $flexDirection};
|
|
6568
6177
|
${({ $fillBox: fill }) => getFillStyle(fill)};
|
|
6569
6178
|
${({ $fillViewport }) => getFillViewportStyle($fillViewport)};
|
|
6570
6179
|
|
|
6571
6180
|
/* Box children styles */
|
|
6572
|
-
flex-grow: ${({ $grow }) => (0,
|
|
6573
|
-
flex-shrink: ${({ $shrink }) => (0,
|
|
6181
|
+
flex-grow: ${({ $grow }) => (0, import_type_guards15.isNotNil)($grow) ? $grow : null};
|
|
6182
|
+
flex-shrink: ${({ $shrink }) => (0, import_type_guards15.isNotNil)($shrink) ? $shrink : null};
|
|
6574
6183
|
flex-wrap: ${({ $wrapItems }) => $wrapItems ? "wrap" : "nowrap"};
|
|
6575
6184
|
${({ $gap }) => getGapStyle($gap)};
|
|
6576
6185
|
justify-content: ${({ $justifyContent }) => $justifyContent};
|
|
6577
|
-
order: ${({ $order }) => (0,
|
|
6186
|
+
order: ${({ $order }) => (0, import_type_guards15.isNotNil)($order) ? $order : null};
|
|
6578
6187
|
`;
|
|
6579
6188
|
var wrapChildren = (children) => {
|
|
6580
|
-
if ((0,
|
|
6189
|
+
if ((0, import_type_guards15.isNotNil)(children)) {
|
|
6581
6190
|
if (typeof children === "object" && isDev) {
|
|
6582
6191
|
return import_react16.Children.map(children, (child) => {
|
|
6583
|
-
if ((0,
|
|
6192
|
+
if ((0, import_type_guards15.isNil)(child)) return null;
|
|
6584
6193
|
const elementParams = {};
|
|
6585
6194
|
if (child.type?.displayName === "Box" || child.type?.displayName === "Box_UI") {
|
|
6586
6195
|
elementParams.hasBoxParent = true;
|
|
@@ -6727,7 +6336,7 @@ var Breadcrumb = ({ icon, href, children, ...props }) => {
|
|
|
6727
6336
|
|
|
6728
6337
|
// src/components/ButtonGroup/ButtonGroup.tsx
|
|
6729
6338
|
var import_styled_components28 = __toESM(require("styled-components"));
|
|
6730
|
-
var
|
|
6339
|
+
var import_type_guards16 = require("@wistia/type-guards");
|
|
6731
6340
|
var import_jsx_runtime170 = require("react/jsx-runtime");
|
|
6732
6341
|
var getAlignment = (align) => {
|
|
6733
6342
|
if (align === "center") {
|
|
@@ -6767,7 +6376,7 @@ var ButtonGroup = ({
|
|
|
6767
6376
|
fullWidth = false,
|
|
6768
6377
|
...otherProps
|
|
6769
6378
|
}) => {
|
|
6770
|
-
if ((0,
|
|
6379
|
+
if ((0, import_type_guards16.isNil)(children)) {
|
|
6771
6380
|
return null;
|
|
6772
6381
|
}
|
|
6773
6382
|
return /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
|
|
@@ -6837,7 +6446,7 @@ Card.displayName = "Card";
|
|
|
6837
6446
|
var import_react19 = require("react");
|
|
6838
6447
|
var import_react_checkbox = require("@radix-ui/react-checkbox");
|
|
6839
6448
|
var import_styled_components33 = __toESM(require("styled-components"));
|
|
6840
|
-
var
|
|
6449
|
+
var import_type_guards18 = require("@wistia/type-guards");
|
|
6841
6450
|
|
|
6842
6451
|
// src/components/Label/Label.tsx
|
|
6843
6452
|
var import_styled_components31 = __toESM(require("styled-components"));
|
|
@@ -7017,7 +6626,7 @@ Label.displayName = "Label";
|
|
|
7017
6626
|
|
|
7018
6627
|
// src/components/Label/LabelDescription.tsx
|
|
7019
6628
|
var import_styled_components32 = __toESM(require("styled-components"));
|
|
7020
|
-
var
|
|
6629
|
+
var import_type_guards17 = require("@wistia/type-guards");
|
|
7021
6630
|
var import_jsx_runtime174 = require("react/jsx-runtime");
|
|
7022
6631
|
var StyledLabelDescription = import_styled_components32.default.div`
|
|
7023
6632
|
color: var(--wui-color-text-secondary);
|
|
@@ -7029,7 +6638,7 @@ var LabelDescription = ({
|
|
|
7029
6638
|
children,
|
|
7030
6639
|
...props
|
|
7031
6640
|
}) => {
|
|
7032
|
-
if ((0,
|
|
6641
|
+
if ((0, import_type_guards17.isNil)(children)) {
|
|
7033
6642
|
return null;
|
|
7034
6643
|
}
|
|
7035
6644
|
return /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(StyledLabelDescription, { ...props, children });
|
|
@@ -7126,7 +6735,7 @@ var Checkbox = (0, import_react19.forwardRef)(
|
|
|
7126
6735
|
...otherProps
|
|
7127
6736
|
}, ref) => {
|
|
7128
6737
|
const generatedId = (0, import_react19.useId)();
|
|
7129
|
-
const computedId = (0,
|
|
6738
|
+
const computedId = (0, import_type_guards18.isNonEmptyString)(id) ? id : `wistia-ui-checkbox-group-${generatedId}`;
|
|
7130
6739
|
return /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)(StyledCheckboxWrapper, { children: [
|
|
7131
6740
|
/* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
|
|
7132
6741
|
StyledCheckboxRoot,
|
|
@@ -7219,7 +6828,7 @@ Divider.displayName = "Divider";
|
|
|
7219
6828
|
// src/components/Form/Form.tsx
|
|
7220
6829
|
var import_react21 = require("react");
|
|
7221
6830
|
var import_styled_components36 = __toESM(require("styled-components"));
|
|
7222
|
-
var
|
|
6831
|
+
var import_type_guards19 = require("@wistia/type-guards");
|
|
7223
6832
|
|
|
7224
6833
|
// src/components/Stack/Stack.tsx
|
|
7225
6834
|
var import_react20 = require("react");
|
|
@@ -7273,7 +6882,7 @@ var FormComponent = ({ children, action, values = {}, validate, fullWidth = fals
|
|
|
7273
6882
|
const id = props.id ?? autoId;
|
|
7274
6883
|
const handleValidate = (nextFormData) => {
|
|
7275
6884
|
const nextData = Object.fromEntries(nextFormData.entries());
|
|
7276
|
-
if ((0,
|
|
6885
|
+
if ((0, import_type_guards19.isUndefined)(validate)) {
|
|
7277
6886
|
return {};
|
|
7278
6887
|
}
|
|
7279
6888
|
return validate(nextData);
|
|
@@ -7283,7 +6892,7 @@ var FormComponent = ({ children, action, values = {}, validate, fullWidth = fals
|
|
|
7283
6892
|
props.onBlur(event);
|
|
7284
6893
|
}
|
|
7285
6894
|
const formData = new FormData(event.currentTarget);
|
|
7286
|
-
if ((0,
|
|
6895
|
+
if ((0, import_type_guards19.isNotUndefined)(validate)) {
|
|
7287
6896
|
handleValidate(formData);
|
|
7288
6897
|
}
|
|
7289
6898
|
};
|
|
@@ -7379,7 +6988,7 @@ var useFormState = (action, initialData = {}) => {
|
|
|
7379
6988
|
|
|
7380
6989
|
// src/components/Form/FormErrorSummary.tsx
|
|
7381
6990
|
var import_react23 = require("react");
|
|
7382
|
-
var
|
|
6991
|
+
var import_type_guards20 = require("@wistia/type-guards");
|
|
7383
6992
|
var import_jsx_runtime179 = require("react/jsx-runtime");
|
|
7384
6993
|
var ErrorItem = ({ name, error, formId }) => {
|
|
7385
6994
|
return /* @__PURE__ */ (0, import_jsx_runtime179.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(Link, { href: `${formId}-${name}`, children: error }) }, name);
|
|
@@ -7393,8 +7002,8 @@ var FormErrorSummary = ({ description }) => {
|
|
|
7393
7002
|
}
|
|
7394
7003
|
return /* @__PURE__ */ (0, import_jsx_runtime179.jsxs)("div", { ref, children: [
|
|
7395
7004
|
/* @__PURE__ */ (0, import_jsx_runtime179.jsx)("p", { children: description }),
|
|
7396
|
-
/* @__PURE__ */ (0, import_jsx_runtime179.jsx)("ul", { children: Object.entries(errors).filter(([, error]) => (0,
|
|
7397
|
-
([name, error]) => (0,
|
|
7005
|
+
/* @__PURE__ */ (0, import_jsx_runtime179.jsx)("ul", { children: Object.entries(errors).filter(([, error]) => (0, import_type_guards20.isNotUndefined)(error)).map(
|
|
7006
|
+
([name, error]) => (0, import_type_guards20.isArray)(error) ? error.map((err) => /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(
|
|
7398
7007
|
ErrorItem,
|
|
7399
7008
|
{
|
|
7400
7009
|
error: err,
|
|
@@ -7418,7 +7027,7 @@ var FormErrorSummary = ({ description }) => {
|
|
|
7418
7027
|
// src/components/FormField/FormField.tsx
|
|
7419
7028
|
var import_react27 = require("react");
|
|
7420
7029
|
var import_styled_components39 = __toESM(require("styled-components"));
|
|
7421
|
-
var
|
|
7030
|
+
var import_type_guards21 = require("@wistia/type-guards");
|
|
7422
7031
|
|
|
7423
7032
|
// src/components/Text/Text.tsx
|
|
7424
7033
|
var import_react24 = require("react");
|
|
@@ -7673,7 +7282,7 @@ var StyledErrorList = import_styled_components39.default.ul`
|
|
|
7673
7282
|
gap: var(--wui-space-01);
|
|
7674
7283
|
`;
|
|
7675
7284
|
var ErrorMessages = ({ errors, id }) => {
|
|
7676
|
-
const isMultipleErrors = (0,
|
|
7285
|
+
const isMultipleErrors = (0, import_type_guards21.isArray)(errors);
|
|
7677
7286
|
return isMultipleErrors ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(StyledErrorList, { children: errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
|
|
7678
7287
|
Text,
|
|
7679
7288
|
{
|
|
@@ -7716,19 +7325,19 @@ var FormField = ({
|
|
|
7716
7325
|
label: isInlineLabel ? label : void 0,
|
|
7717
7326
|
...props
|
|
7718
7327
|
};
|
|
7719
|
-
if ((0,
|
|
7328
|
+
if ((0, import_type_guards21.isUndefined)(value) && (0, import_type_guards21.isNotUndefined)(defaultValue)) {
|
|
7720
7329
|
childProps = {
|
|
7721
7330
|
...childProps,
|
|
7722
7331
|
defaultValue
|
|
7723
7332
|
};
|
|
7724
7333
|
}
|
|
7725
|
-
if ((0,
|
|
7726
|
-
const computedName = (0,
|
|
7334
|
+
if ((0, import_type_guards21.isNotNil)(checkboxGroup)) {
|
|
7335
|
+
const computedName = (0, import_type_guards21.isNotNil)(checkboxGroup.name) ? `${checkboxGroup.name}[${name}]` : name;
|
|
7727
7336
|
const handleChange = (event) => {
|
|
7728
|
-
if ((0,
|
|
7337
|
+
if ((0, import_type_guards21.isNotUndefined)(props.onChange)) {
|
|
7729
7338
|
props.onChange(event);
|
|
7730
7339
|
}
|
|
7731
|
-
if ((0,
|
|
7340
|
+
if ((0, import_type_guards21.isNotUndefined)(checkboxGroup.onChange)) {
|
|
7732
7341
|
checkboxGroup.onChange(event);
|
|
7733
7342
|
}
|
|
7734
7343
|
};
|
|
@@ -7736,15 +7345,15 @@ var FormField = ({
|
|
|
7736
7345
|
...childProps,
|
|
7737
7346
|
name: computedName,
|
|
7738
7347
|
onChange: handleChange,
|
|
7739
|
-
"aria-invalid": (0,
|
|
7740
|
-
"aria-describedby": (0,
|
|
7348
|
+
"aria-invalid": (0, import_type_guards21.isNotNil)(error),
|
|
7349
|
+
"aria-describedby": (0, import_type_guards21.isNotNil)(error) ? `${id}-error` : void 0
|
|
7741
7350
|
};
|
|
7742
7351
|
}
|
|
7743
7352
|
import_react27.Children.only(children);
|
|
7744
7353
|
return /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)(StyledFormField, { ...props, children: [
|
|
7745
7354
|
!isInlineLabel && /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(Label, { htmlFor: id, children: label }),
|
|
7746
7355
|
(0, import_react27.cloneElement)(children, childProps),
|
|
7747
|
-
(0,
|
|
7356
|
+
(0, import_type_guards21.isNotNil)(computedError) ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
|
|
7748
7357
|
ErrorMessages,
|
|
7749
7358
|
{
|
|
7750
7359
|
errors: computedError,
|
|
@@ -7817,18 +7426,7 @@ IconButton.displayName = "IconButton";
|
|
|
7817
7426
|
// src/components/Input/Input.tsx
|
|
7818
7427
|
var import_react30 = require("react");
|
|
7819
7428
|
var import_styled_components41 = __toESM(require("styled-components"));
|
|
7820
|
-
var
|
|
7821
|
-
|
|
7822
|
-
// src/private/helpers/isReadyRef/isReadyRef.ts
|
|
7823
|
-
var import_type_guards24 = require("@wistia/type-guards");
|
|
7824
|
-
var isReadyRef = (maybeRef) => {
|
|
7825
|
-
if ((0, import_type_guards24.isRecord)(maybeRef) && (0, import_type_guards24.hasKey)(maybeRef, "current")) {
|
|
7826
|
-
return (0, import_type_guards24.isNotNil)(maybeRef.current);
|
|
7827
|
-
}
|
|
7828
|
-
return false;
|
|
7829
|
-
};
|
|
7830
|
-
|
|
7831
|
-
// src/components/Input/Input.tsx
|
|
7429
|
+
var import_type_guards22 = require("@wistia/type-guards");
|
|
7832
7430
|
var import_jsx_runtime186 = require("react/jsx-runtime");
|
|
7833
7431
|
var inputStyles = import_styled_components41.css`
|
|
7834
7432
|
--wui-input-color-bg: var(--wui-color-bg-surface);
|
|
@@ -7915,6 +7513,9 @@ var StyledInputContainer = import_styled_components41.default.div`
|
|
|
7915
7513
|
padding-right: 32px;
|
|
7916
7514
|
}
|
|
7917
7515
|
`;
|
|
7516
|
+
var isValidRef = (ref) => {
|
|
7517
|
+
return typeof ref === "object" && ref !== null && "current" in ref && (0, import_type_guards22.isNotNil)(ref.current);
|
|
7518
|
+
};
|
|
7918
7519
|
var Input = (0, import_react30.forwardRef)(
|
|
7919
7520
|
({
|
|
7920
7521
|
fullWidth = false,
|
|
@@ -7926,26 +7527,26 @@ var Input = (0, import_react30.forwardRef)(
|
|
|
7926
7527
|
...props
|
|
7927
7528
|
}, externalRef) => {
|
|
7928
7529
|
const internalRef = (0, import_react30.useRef)();
|
|
7929
|
-
const ref =
|
|
7530
|
+
const ref = isValidRef(externalRef) ? externalRef : internalRef;
|
|
7930
7531
|
let leftIconToDisplay = leftIcon;
|
|
7931
|
-
if ((0,
|
|
7532
|
+
if ((0, import_type_guards22.isNil)(leftIcon) && type === "search") {
|
|
7932
7533
|
leftIconToDisplay = /* @__PURE__ */ (0, import_jsx_runtime186.jsx)(Icon, { type: "search" });
|
|
7933
7534
|
}
|
|
7934
|
-
if ((0,
|
|
7535
|
+
if ((0, import_type_guards22.isNotNil)(leftIconToDisplay)) {
|
|
7935
7536
|
leftIconToDisplay = (0, import_react30.cloneElement)(leftIconToDisplay, {
|
|
7936
7537
|
size: "md",
|
|
7937
7538
|
className: "wui-input-left-icon"
|
|
7938
7539
|
});
|
|
7939
7540
|
}
|
|
7940
7541
|
let rightIconToDisplay = rightIcon;
|
|
7941
|
-
if ((0,
|
|
7542
|
+
if ((0, import_type_guards22.isNotNil)(rightIconToDisplay)) {
|
|
7942
7543
|
rightIconToDisplay = (0, import_react30.cloneElement)(rightIconToDisplay, {
|
|
7943
7544
|
size: "md",
|
|
7944
7545
|
className: "wui-input-right-icon"
|
|
7945
7546
|
});
|
|
7946
7547
|
}
|
|
7947
7548
|
const handleFocus = (event) => {
|
|
7948
|
-
if ((0,
|
|
7549
|
+
if ((0, import_type_guards22.isNotNil)(props.onFocus)) {
|
|
7949
7550
|
props.onFocus(event);
|
|
7950
7551
|
}
|
|
7951
7552
|
if (autoSelect && ref && "current" in ref) {
|
|
@@ -7988,7 +7589,7 @@ Input.displayName = "Input";
|
|
|
7988
7589
|
// src/components/Menu/Menu.tsx
|
|
7989
7590
|
var import_styled_components42 = __toESM(require("styled-components"));
|
|
7990
7591
|
var import_react_dropdown_menu = require("@radix-ui/react-dropdown-menu");
|
|
7991
|
-
var
|
|
7592
|
+
var import_type_guards23 = require("@wistia/type-guards");
|
|
7992
7593
|
var import_react32 = require("react");
|
|
7993
7594
|
|
|
7994
7595
|
// src/components/Menu/MenuContext.tsx
|
|
@@ -8100,7 +7701,7 @@ var Menu = ({
|
|
|
8100
7701
|
}) => {
|
|
8101
7702
|
const contextValue = (0, import_react32.useMemo)(() => ({ compact }), [compact]);
|
|
8102
7703
|
let controlProps = {
|
|
8103
|
-
...(0,
|
|
7704
|
+
...(0, import_type_guards23.isNotNil)(onOpenChange) && (0, import_type_guards23.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {}
|
|
8104
7705
|
};
|
|
8105
7706
|
if (disabled) {
|
|
8106
7707
|
controlProps = {
|
|
@@ -8114,7 +7715,7 @@ var Menu = ({
|
|
|
8114
7715
|
modal: false,
|
|
8115
7716
|
...controlProps,
|
|
8116
7717
|
children: [
|
|
8117
|
-
/* @__PURE__ */ (0, import_jsx_runtime187.jsx)(import_react_dropdown_menu.DropdownMenuTrigger, { asChild: true, children: (0,
|
|
7718
|
+
/* @__PURE__ */ (0, import_jsx_runtime187.jsx)(import_react_dropdown_menu.DropdownMenuTrigger, { asChild: true, children: (0, import_type_guards23.isNotUndefined)(trigger) ? trigger : /* @__PURE__ */ (0, import_jsx_runtime187.jsx)(
|
|
8118
7719
|
Button,
|
|
8119
7720
|
{
|
|
8120
7721
|
"aria-expanded": isOpen,
|
|
@@ -8175,12 +7776,12 @@ MenuLabel.displayName = "MenuLabel";
|
|
|
8175
7776
|
var import_react34 = require("react");
|
|
8176
7777
|
var import_styled_components46 = __toESM(require("styled-components"));
|
|
8177
7778
|
var import_react_dropdown_menu3 = require("@radix-ui/react-dropdown-menu");
|
|
8178
|
-
var
|
|
7779
|
+
var import_type_guards25 = require("@wistia/type-guards");
|
|
8179
7780
|
|
|
8180
7781
|
// src/components/Menu/MenuItemButton.tsx
|
|
8181
7782
|
var import_react33 = require("react");
|
|
8182
7783
|
var import_styled_components44 = __toESM(require("styled-components"));
|
|
8183
|
-
var
|
|
7784
|
+
var import_type_guards24 = require("@wistia/type-guards");
|
|
8184
7785
|
var import_jsx_runtime189 = require("react/jsx-runtime");
|
|
8185
7786
|
var StyledButton3 = (0, import_styled_components44.default)(Button)`
|
|
8186
7787
|
${({ colorScheme }) => getColorScheme(colorScheme)};
|
|
@@ -8254,7 +7855,7 @@ var StyledBadgeContainer = import_styled_components44.default.div`
|
|
|
8254
7855
|
var MenuItemButton = (0, import_react33.forwardRef)(({ children, appearance, command, icon, ...props }, ref) => {
|
|
8255
7856
|
let { colorScheme, badge } = props;
|
|
8256
7857
|
if (appearance === "dangerous") {
|
|
8257
|
-
if ((0,
|
|
7858
|
+
if ((0, import_type_guards24.isNotUndefined)(colorScheme)) {
|
|
8258
7859
|
console.warn("colorScheme prop is ignored when appearance is dangerous");
|
|
8259
7860
|
}
|
|
8260
7861
|
colorScheme = "error";
|
|
@@ -8284,7 +7885,7 @@ var MenuItemButton = (0, import_react33.forwardRef)(({ children, appearance, com
|
|
|
8284
7885
|
children: [
|
|
8285
7886
|
props.leftIcon ? /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(StyledLeftIconContainer, { children: props.leftIcon }) : null,
|
|
8286
7887
|
/* @__PURE__ */ (0, import_jsx_runtime189.jsx)(StyledLabelAndDescriptionContainer, { children }),
|
|
8287
|
-
(0,
|
|
7888
|
+
(0, import_type_guards24.isNotNil)(badge) || (0, import_type_guards24.isNotNil)(command) ? /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(StyledBadgeContainer, { children: badge ?? command }) : null,
|
|
8288
7889
|
props.rightIcon ? /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(StyledRightIconContainer, { children: props.rightIcon }) : null
|
|
8289
7890
|
]
|
|
8290
7891
|
}
|
|
@@ -8351,7 +7952,7 @@ var SubMenu = ({
|
|
|
8351
7952
|
return isSmAndUp ? /* @__PURE__ */ (0, import_jsx_runtime191.jsxs)(import_react_dropdown_menu3.DropdownMenuSub, { onOpenChange, children: [
|
|
8352
7953
|
/* @__PURE__ */ (0, import_jsx_runtime191.jsxs)(SubMenuTrigger, { ...props, children: [
|
|
8353
7954
|
/* @__PURE__ */ (0, import_jsx_runtime191.jsx)(MenuItemLabel, { children: label }),
|
|
8354
|
-
(0,
|
|
7955
|
+
(0, import_type_guards25.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(MenuItemDescription, { children: description }) : null
|
|
8355
7956
|
] }),
|
|
8356
7957
|
/* @__PURE__ */ (0, import_jsx_runtime191.jsx)(import_react_dropdown_menu3.DropdownMenuPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(SubMenuContent, { $compact: compact, children }) })
|
|
8357
7958
|
] }) : /* @__PURE__ */ (0, import_jsx_runtime191.jsxs)(import_react_dropdown_menu3.DropdownMenuGroup, { children: [
|
|
@@ -8531,7 +8132,7 @@ CheckboxMenuItem.displayName = "CheckboxMenuItem";
|
|
|
8531
8132
|
var import_react39 = require("react");
|
|
8532
8133
|
var import_styled_components52 = __toESM(require("styled-components"));
|
|
8533
8134
|
var import_react_dialog4 = require("@radix-ui/react-dialog");
|
|
8534
|
-
var
|
|
8135
|
+
var import_type_guards28 = require("@wistia/type-guards");
|
|
8535
8136
|
|
|
8536
8137
|
// src/components/Modal/ModalHeader.tsx
|
|
8537
8138
|
var import_styled_components49 = __toESM(require("styled-components"));
|
|
@@ -8558,7 +8159,7 @@ var ModalCloseButton = () => {
|
|
|
8558
8159
|
|
|
8559
8160
|
// src/components/ScreenReaderOnly/ScreenReaderOnly.tsx
|
|
8560
8161
|
var import_styled_components48 = __toESM(require("styled-components"));
|
|
8561
|
-
var
|
|
8162
|
+
var import_type_guards26 = require("@wistia/type-guards");
|
|
8562
8163
|
var import_jsx_runtime197 = require("react/jsx-runtime");
|
|
8563
8164
|
var VisuallyHidden = import_styled_components48.default.div({ ...visuallyHiddenStyle });
|
|
8564
8165
|
var VisuallyHiddenButFocusable = import_styled_components48.default.div({
|
|
@@ -8570,7 +8171,7 @@ var ScreenReaderOnly = ({
|
|
|
8570
8171
|
focusable = false,
|
|
8571
8172
|
...otherProps
|
|
8572
8173
|
}) => {
|
|
8573
|
-
const accessibleText = (0,
|
|
8174
|
+
const accessibleText = (0, import_type_guards26.isNotNil)(text) ? text : children;
|
|
8574
8175
|
if (focusable) {
|
|
8575
8176
|
return /* @__PURE__ */ (0, import_jsx_runtime197.jsx)(VisuallyHiddenButFocusable, { ...otherProps, children: accessibleText });
|
|
8576
8177
|
}
|
|
@@ -8617,7 +8218,7 @@ var import_react_dialog3 = require("@radix-ui/react-dialog");
|
|
|
8617
8218
|
|
|
8618
8219
|
// src/private/hooks/useFocusRestore/useFocusRestore.ts
|
|
8619
8220
|
var import_react36 = require("react");
|
|
8620
|
-
var
|
|
8221
|
+
var import_type_guards27 = require("@wistia/type-guards");
|
|
8621
8222
|
var useFocusRestore = () => {
|
|
8622
8223
|
const previouslyFocusedRef = (0, import_react36.useRef)(null);
|
|
8623
8224
|
(0, import_react36.useEffect)(() => {
|
|
@@ -8625,7 +8226,7 @@ var useFocusRestore = () => {
|
|
|
8625
8226
|
}, []);
|
|
8626
8227
|
(0, import_react36.useEffect)(() => {
|
|
8627
8228
|
return () => {
|
|
8628
|
-
if ((0,
|
|
8229
|
+
if ((0, import_type_guards27.isNotNil)(previouslyFocusedRef.current)) {
|
|
8629
8230
|
setTimeout(() => {
|
|
8630
8231
|
previouslyFocusedRef.current?.focus();
|
|
8631
8232
|
}, 0);
|
|
@@ -8772,7 +8373,7 @@ var Modal = (0, import_react39.forwardRef)(
|
|
|
8772
8373
|
import_react_dialog4.Root,
|
|
8773
8374
|
{
|
|
8774
8375
|
onOpenChange: (open2) => {
|
|
8775
|
-
if (!open2 && (0,
|
|
8376
|
+
if (!open2 && (0, import_type_guards28.isNotNil)(onRequestClose)) {
|
|
8776
8377
|
onRequestClose();
|
|
8777
8378
|
}
|
|
8778
8379
|
},
|
|
@@ -8785,7 +8386,7 @@ var Modal = (0, import_react39.forwardRef)(
|
|
|
8785
8386
|
ref,
|
|
8786
8387
|
fullHeight,
|
|
8787
8388
|
onOpenAutoFocus: (event) => {
|
|
8788
|
-
if ((0,
|
|
8389
|
+
if ((0, import_type_guards28.isNotNil)(initialFocusRef) && initialFocusRef.current) {
|
|
8789
8390
|
event.preventDefault();
|
|
8790
8391
|
requestAnimationFrame(() => {
|
|
8791
8392
|
initialFocusRef.current?.focus();
|
|
@@ -8817,7 +8418,7 @@ Modal.displayName = "Modal";
|
|
|
8817
8418
|
// src/components/Radio/Radio.tsx
|
|
8818
8419
|
var import_react40 = require("react");
|
|
8819
8420
|
var import_styled_components53 = __toESM(require("styled-components"));
|
|
8820
|
-
var
|
|
8421
|
+
var import_type_guards29 = require("@wistia/type-guards");
|
|
8821
8422
|
var import_jsx_runtime202 = require("react/jsx-runtime");
|
|
8822
8423
|
var StyledLabelWrapper2 = import_styled_components53.default.div`
|
|
8823
8424
|
display: flex;
|
|
@@ -8903,7 +8504,7 @@ var Radio = (0, import_react40.forwardRef)(
|
|
|
8903
8504
|
...otherProps
|
|
8904
8505
|
}, ref) => {
|
|
8905
8506
|
const generatedId = (0, import_react40.useId)();
|
|
8906
|
-
const computedId = (0,
|
|
8507
|
+
const computedId = (0, import_type_guards29.isNonEmptyString)(id) ? id : `ui-radio-${generatedId}`;
|
|
8907
8508
|
return /* @__PURE__ */ (0, import_jsx_runtime202.jsxs)(
|
|
8908
8509
|
StyledRadioWrapper,
|
|
8909
8510
|
{
|
|
@@ -8948,7 +8549,7 @@ Radio.displayName = "Radio";
|
|
|
8948
8549
|
var import_react41 = require("react");
|
|
8949
8550
|
var import_styled_components54 = __toESM(require("styled-components"));
|
|
8950
8551
|
var import_react_toggle_group = require("@radix-ui/react-toggle-group");
|
|
8951
|
-
var
|
|
8552
|
+
var import_type_guards30 = require("@wistia/type-guards");
|
|
8952
8553
|
var import_jsx_runtime203 = require("react/jsx-runtime");
|
|
8953
8554
|
var StyledSegmentedControl = (0, import_styled_components54.default)(import_react_toggle_group.Root)`
|
|
8954
8555
|
display: inline-flex;
|
|
@@ -8967,7 +8568,7 @@ var SegmentedControl = (0, import_react41.forwardRef)(
|
|
|
8967
8568
|
onSelectedValueChange,
|
|
8968
8569
|
...props
|
|
8969
8570
|
}, ref) => {
|
|
8970
|
-
if ((0,
|
|
8571
|
+
if ((0, import_type_guards30.isNil)(children)) {
|
|
8971
8572
|
return null;
|
|
8972
8573
|
}
|
|
8973
8574
|
return /* @__PURE__ */ (0, import_jsx_runtime203.jsx)(
|
|
@@ -8993,7 +8594,7 @@ SegmentedControl.displayName = "SegmentedControl";
|
|
|
8993
8594
|
var import_react42 = require("react");
|
|
8994
8595
|
var import_styled_components55 = __toESM(require("styled-components"));
|
|
8995
8596
|
var import_react_toggle_group2 = require("@radix-ui/react-toggle-group");
|
|
8996
|
-
var
|
|
8597
|
+
var import_type_guards31 = require("@wistia/type-guards");
|
|
8997
8598
|
var import_jsx_runtime204 = require("react/jsx-runtime");
|
|
8998
8599
|
var StyledSegmentedControlItem = (0, import_styled_components55.default)(import_react_toggle_group2.Item)`
|
|
8999
8600
|
all: unset; /* ToggleGroupItem is a button element */
|
|
@@ -9060,8 +8661,8 @@ var SegmentedControlItem = (0, import_react42.forwardRef)(
|
|
|
9060
8661
|
StyledSegmentedControlItem,
|
|
9061
8662
|
{
|
|
9062
8663
|
ref,
|
|
9063
|
-
$hasLabel: (0,
|
|
9064
|
-
"aria-label": (0,
|
|
8664
|
+
$hasLabel: (0, import_type_guards31.isNotNil)(label),
|
|
8665
|
+
"aria-label": (0, import_type_guards31.isNotNil)(label) ? void 0 : ariaLabel,
|
|
9065
8666
|
disabled,
|
|
9066
8667
|
onClick: handleClick,
|
|
9067
8668
|
value,
|
|
@@ -9078,7 +8679,7 @@ SegmentedControlItem.displayName = "SegmentedControlItem";
|
|
|
9078
8679
|
// src/components/Tag/Tag.tsx
|
|
9079
8680
|
var import_react43 = require("react");
|
|
9080
8681
|
var import_styled_components56 = __toESM(require("styled-components"));
|
|
9081
|
-
var
|
|
8682
|
+
var import_type_guards32 = require("@wistia/type-guards");
|
|
9082
8683
|
var import_jsx_runtime205 = require("react/jsx-runtime");
|
|
9083
8684
|
var TagLabel = import_styled_components56.default.a`
|
|
9084
8685
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
@@ -9156,10 +8757,10 @@ var StyledTag = import_styled_components56.default.div`
|
|
|
9156
8757
|
}
|
|
9157
8758
|
`;
|
|
9158
8759
|
var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
|
|
9159
|
-
if ((0,
|
|
8760
|
+
if ((0, import_type_guards32.isNil)(onClickRemove)) {
|
|
9160
8761
|
return null;
|
|
9161
8762
|
}
|
|
9162
|
-
if ((0,
|
|
8763
|
+
if ((0, import_type_guards32.isNil)(onClickRemoveLabel)) {
|
|
9163
8764
|
throw new Error(
|
|
9164
8765
|
"for accessibility, onClickRemoveLabel must be provided if onClickRemove is provided"
|
|
9165
8766
|
);
|
|
@@ -9188,7 +8789,7 @@ var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
|
|
|
9188
8789
|
};
|
|
9189
8790
|
var Tag = (0, import_react43.forwardRef)(
|
|
9190
8791
|
({ onClickRemove, colorScheme = "inherit", href, label, onClickRemoveLabel, ...otherProps }, ref) => {
|
|
9191
|
-
const labelProps = (0,
|
|
8792
|
+
const labelProps = (0, import_type_guards32.isNotNil)(href) && (0, import_type_guards32.isNonEmptyString)(href) ? { href, as: "a" } : { as: "span" };
|
|
9192
8793
|
return /* @__PURE__ */ (0, import_jsx_runtime205.jsxs)(
|
|
9193
8794
|
StyledTag,
|
|
9194
8795
|
{
|
|
@@ -9326,7 +8927,7 @@ Tooltip.displayName = "Tooltip";
|
|
|
9326
8927
|
|
|
9327
8928
|
// src/components/WistiaLogo/WistiaLogo.tsx
|
|
9328
8929
|
var import_styled_components58 = __toESM(require("styled-components"));
|
|
9329
|
-
var
|
|
8930
|
+
var import_type_guards33 = require("@wistia/type-guards");
|
|
9330
8931
|
var import_jsx_runtime207 = require("react/jsx-runtime");
|
|
9331
8932
|
var renderBrandmark = (brandmarkColor, iconOnly) => {
|
|
9332
8933
|
if (iconOnly) {
|
|
@@ -9420,7 +9021,7 @@ var WistiaLogo = ({
|
|
|
9420
9021
|
...otherProps,
|
|
9421
9022
|
children: [
|
|
9422
9023
|
/* @__PURE__ */ (0, import_jsx_runtime207.jsx)("title", { children: title }),
|
|
9423
|
-
(0,
|
|
9024
|
+
(0, import_type_guards33.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime207.jsx)("desc", { children: description }) : null,
|
|
9424
9025
|
renderBrandmark(brandmarkColor, iconOnly),
|
|
9425
9026
|
renderLogotype(logotypeColor, iconOnly)
|
|
9426
9027
|
]
|
|
@@ -9616,7 +9217,7 @@ var SelectOptionGroup = ({ children, label, ...props }) => {
|
|
|
9616
9217
|
|
|
9617
9218
|
// src/components/DataCards/DataCard.tsx
|
|
9618
9219
|
var import_styled_components62 = __toESM(require("styled-components"));
|
|
9619
|
-
var
|
|
9220
|
+
var import_type_guards34 = require("@wistia/type-guards");
|
|
9620
9221
|
var import_jsx_runtime211 = require("react/jsx-runtime");
|
|
9621
9222
|
var StyledDataCard = import_styled_components62.default.div`
|
|
9622
9223
|
${({ $colorScheme }) => getColorScheme($colorScheme)}
|
|
@@ -9705,8 +9306,8 @@ var DataCard = ({
|
|
|
9705
9306
|
children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(StyledLoadingValue, {}) : value
|
|
9706
9307
|
}
|
|
9707
9308
|
),
|
|
9708
|
-
(0,
|
|
9709
|
-
(0,
|
|
9309
|
+
(0, import_type_guards34.isNotNull)(upperRightSlot) && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(StyledSlot, { children: upperRightSlot }),
|
|
9310
|
+
(0, import_type_guards34.isNotNull)(trend) && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(StyledDataCardTrendContainer, { children: trend })
|
|
9710
9311
|
]
|
|
9711
9312
|
}
|
|
9712
9313
|
);
|
|
@@ -9838,7 +9439,6 @@ var DataCardTrend = ({
|
|
|
9838
9439
|
WistiaLogo,
|
|
9839
9440
|
colorSchemeOptions,
|
|
9840
9441
|
copyToClipboard,
|
|
9841
|
-
dateTime,
|
|
9842
9442
|
ellipsisFlexParentStyle,
|
|
9843
9443
|
ellipsisStyle,
|
|
9844
9444
|
iconSizeMap,
|