@wistia/ui 0.5.0-beta.4e01027d.1af5149 → 0.5.0
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 +106 -498
- 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 +28 -419
- 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.0
|
|
3
|
+
* @license @wistia/ui v0.5.0
|
|
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
|
|
|
@@ -2081,9 +1690,9 @@ var import_react6 = require("react");
|
|
|
2081
1690
|
var import_react5 = require("react");
|
|
2082
1691
|
|
|
2083
1692
|
// src/private/helpers/isObjectRef/isObjectRef.ts
|
|
2084
|
-
var
|
|
1693
|
+
var import_type_guards4 = require("@wistia/type-guards");
|
|
2085
1694
|
var isObjectRef = (value) => {
|
|
2086
|
-
return (0,
|
|
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
|
|
@@ -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,7 +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
|
|
7429
|
+
var import_type_guards22 = require("@wistia/type-guards");
|
|
7821
7430
|
var import_jsx_runtime186 = require("react/jsx-runtime");
|
|
7822
7431
|
var inputStyles = import_styled_components41.css`
|
|
7823
7432
|
--wui-input-color-bg: var(--wui-color-bg-surface);
|
|
@@ -7905,7 +7514,7 @@ var StyledInputContainer = import_styled_components41.default.div`
|
|
|
7905
7514
|
}
|
|
7906
7515
|
`;
|
|
7907
7516
|
var isValidRef = (ref) => {
|
|
7908
|
-
return typeof ref === "object" && ref !== null && "current" in ref && (0,
|
|
7517
|
+
return typeof ref === "object" && ref !== null && "current" in ref && (0, import_type_guards22.isNotNil)(ref.current);
|
|
7909
7518
|
};
|
|
7910
7519
|
var Input = (0, import_react30.forwardRef)(
|
|
7911
7520
|
({
|
|
@@ -7920,24 +7529,24 @@ var Input = (0, import_react30.forwardRef)(
|
|
|
7920
7529
|
const internalRef = (0, import_react30.useRef)();
|
|
7921
7530
|
const ref = isValidRef(externalRef) ? externalRef : internalRef;
|
|
7922
7531
|
let leftIconToDisplay = leftIcon;
|
|
7923
|
-
if ((0,
|
|
7532
|
+
if ((0, import_type_guards22.isNil)(leftIcon) && type === "search") {
|
|
7924
7533
|
leftIconToDisplay = /* @__PURE__ */ (0, import_jsx_runtime186.jsx)(Icon, { type: "search" });
|
|
7925
7534
|
}
|
|
7926
|
-
if ((0,
|
|
7535
|
+
if ((0, import_type_guards22.isNotNil)(leftIconToDisplay)) {
|
|
7927
7536
|
leftIconToDisplay = (0, import_react30.cloneElement)(leftIconToDisplay, {
|
|
7928
7537
|
size: "md",
|
|
7929
7538
|
className: "wui-input-left-icon"
|
|
7930
7539
|
});
|
|
7931
7540
|
}
|
|
7932
7541
|
let rightIconToDisplay = rightIcon;
|
|
7933
|
-
if ((0,
|
|
7542
|
+
if ((0, import_type_guards22.isNotNil)(rightIconToDisplay)) {
|
|
7934
7543
|
rightIconToDisplay = (0, import_react30.cloneElement)(rightIconToDisplay, {
|
|
7935
7544
|
size: "md",
|
|
7936
7545
|
className: "wui-input-right-icon"
|
|
7937
7546
|
});
|
|
7938
7547
|
}
|
|
7939
7548
|
const handleFocus = (event) => {
|
|
7940
|
-
if ((0,
|
|
7549
|
+
if ((0, import_type_guards22.isNotNil)(props.onFocus)) {
|
|
7941
7550
|
props.onFocus(event);
|
|
7942
7551
|
}
|
|
7943
7552
|
if (autoSelect && ref && "current" in ref) {
|
|
@@ -7980,7 +7589,7 @@ Input.displayName = "Input";
|
|
|
7980
7589
|
// src/components/Menu/Menu.tsx
|
|
7981
7590
|
var import_styled_components42 = __toESM(require("styled-components"));
|
|
7982
7591
|
var import_react_dropdown_menu = require("@radix-ui/react-dropdown-menu");
|
|
7983
|
-
var
|
|
7592
|
+
var import_type_guards23 = require("@wistia/type-guards");
|
|
7984
7593
|
var import_react32 = require("react");
|
|
7985
7594
|
|
|
7986
7595
|
// src/components/Menu/MenuContext.tsx
|
|
@@ -8092,7 +7701,7 @@ var Menu = ({
|
|
|
8092
7701
|
}) => {
|
|
8093
7702
|
const contextValue = (0, import_react32.useMemo)(() => ({ compact }), [compact]);
|
|
8094
7703
|
let controlProps = {
|
|
8095
|
-
...(0,
|
|
7704
|
+
...(0, import_type_guards23.isNotNil)(onOpenChange) && (0, import_type_guards23.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {}
|
|
8096
7705
|
};
|
|
8097
7706
|
if (disabled) {
|
|
8098
7707
|
controlProps = {
|
|
@@ -8106,7 +7715,7 @@ var Menu = ({
|
|
|
8106
7715
|
modal: false,
|
|
8107
7716
|
...controlProps,
|
|
8108
7717
|
children: [
|
|
8109
|
-
/* @__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)(
|
|
8110
7719
|
Button,
|
|
8111
7720
|
{
|
|
8112
7721
|
"aria-expanded": isOpen,
|
|
@@ -8167,12 +7776,12 @@ MenuLabel.displayName = "MenuLabel";
|
|
|
8167
7776
|
var import_react34 = require("react");
|
|
8168
7777
|
var import_styled_components46 = __toESM(require("styled-components"));
|
|
8169
7778
|
var import_react_dropdown_menu3 = require("@radix-ui/react-dropdown-menu");
|
|
8170
|
-
var
|
|
7779
|
+
var import_type_guards25 = require("@wistia/type-guards");
|
|
8171
7780
|
|
|
8172
7781
|
// src/components/Menu/MenuItemButton.tsx
|
|
8173
7782
|
var import_react33 = require("react");
|
|
8174
7783
|
var import_styled_components44 = __toESM(require("styled-components"));
|
|
8175
|
-
var
|
|
7784
|
+
var import_type_guards24 = require("@wistia/type-guards");
|
|
8176
7785
|
var import_jsx_runtime189 = require("react/jsx-runtime");
|
|
8177
7786
|
var StyledButton3 = (0, import_styled_components44.default)(Button)`
|
|
8178
7787
|
${({ colorScheme }) => getColorScheme(colorScheme)};
|
|
@@ -8246,7 +7855,7 @@ var StyledBadgeContainer = import_styled_components44.default.div`
|
|
|
8246
7855
|
var MenuItemButton = (0, import_react33.forwardRef)(({ children, appearance, command, icon, ...props }, ref) => {
|
|
8247
7856
|
let { colorScheme, badge } = props;
|
|
8248
7857
|
if (appearance === "dangerous") {
|
|
8249
|
-
if ((0,
|
|
7858
|
+
if ((0, import_type_guards24.isNotUndefined)(colorScheme)) {
|
|
8250
7859
|
console.warn("colorScheme prop is ignored when appearance is dangerous");
|
|
8251
7860
|
}
|
|
8252
7861
|
colorScheme = "error";
|
|
@@ -8276,7 +7885,7 @@ var MenuItemButton = (0, import_react33.forwardRef)(({ children, appearance, com
|
|
|
8276
7885
|
children: [
|
|
8277
7886
|
props.leftIcon ? /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(StyledLeftIconContainer, { children: props.leftIcon }) : null,
|
|
8278
7887
|
/* @__PURE__ */ (0, import_jsx_runtime189.jsx)(StyledLabelAndDescriptionContainer, { children }),
|
|
8279
|
-
(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,
|
|
8280
7889
|
props.rightIcon ? /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(StyledRightIconContainer, { children: props.rightIcon }) : null
|
|
8281
7890
|
]
|
|
8282
7891
|
}
|
|
@@ -8343,7 +7952,7 @@ var SubMenu = ({
|
|
|
8343
7952
|
return isSmAndUp ? /* @__PURE__ */ (0, import_jsx_runtime191.jsxs)(import_react_dropdown_menu3.DropdownMenuSub, { onOpenChange, children: [
|
|
8344
7953
|
/* @__PURE__ */ (0, import_jsx_runtime191.jsxs)(SubMenuTrigger, { ...props, children: [
|
|
8345
7954
|
/* @__PURE__ */ (0, import_jsx_runtime191.jsx)(MenuItemLabel, { children: label }),
|
|
8346
|
-
(0,
|
|
7955
|
+
(0, import_type_guards25.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(MenuItemDescription, { children: description }) : null
|
|
8347
7956
|
] }),
|
|
8348
7957
|
/* @__PURE__ */ (0, import_jsx_runtime191.jsx)(import_react_dropdown_menu3.DropdownMenuPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(SubMenuContent, { $compact: compact, children }) })
|
|
8349
7958
|
] }) : /* @__PURE__ */ (0, import_jsx_runtime191.jsxs)(import_react_dropdown_menu3.DropdownMenuGroup, { children: [
|
|
@@ -8523,7 +8132,7 @@ CheckboxMenuItem.displayName = "CheckboxMenuItem";
|
|
|
8523
8132
|
var import_react39 = require("react");
|
|
8524
8133
|
var import_styled_components52 = __toESM(require("styled-components"));
|
|
8525
8134
|
var import_react_dialog4 = require("@radix-ui/react-dialog");
|
|
8526
|
-
var
|
|
8135
|
+
var import_type_guards28 = require("@wistia/type-guards");
|
|
8527
8136
|
|
|
8528
8137
|
// src/components/Modal/ModalHeader.tsx
|
|
8529
8138
|
var import_styled_components49 = __toESM(require("styled-components"));
|
|
@@ -8550,7 +8159,7 @@ var ModalCloseButton = () => {
|
|
|
8550
8159
|
|
|
8551
8160
|
// src/components/ScreenReaderOnly/ScreenReaderOnly.tsx
|
|
8552
8161
|
var import_styled_components48 = __toESM(require("styled-components"));
|
|
8553
|
-
var
|
|
8162
|
+
var import_type_guards26 = require("@wistia/type-guards");
|
|
8554
8163
|
var import_jsx_runtime197 = require("react/jsx-runtime");
|
|
8555
8164
|
var VisuallyHidden = import_styled_components48.default.div({ ...visuallyHiddenStyle });
|
|
8556
8165
|
var VisuallyHiddenButFocusable = import_styled_components48.default.div({
|
|
@@ -8562,7 +8171,7 @@ var ScreenReaderOnly = ({
|
|
|
8562
8171
|
focusable = false,
|
|
8563
8172
|
...otherProps
|
|
8564
8173
|
}) => {
|
|
8565
|
-
const accessibleText = (0,
|
|
8174
|
+
const accessibleText = (0, import_type_guards26.isNotNil)(text) ? text : children;
|
|
8566
8175
|
if (focusable) {
|
|
8567
8176
|
return /* @__PURE__ */ (0, import_jsx_runtime197.jsx)(VisuallyHiddenButFocusable, { ...otherProps, children: accessibleText });
|
|
8568
8177
|
}
|
|
@@ -8609,7 +8218,7 @@ var import_react_dialog3 = require("@radix-ui/react-dialog");
|
|
|
8609
8218
|
|
|
8610
8219
|
// src/private/hooks/useFocusRestore/useFocusRestore.ts
|
|
8611
8220
|
var import_react36 = require("react");
|
|
8612
|
-
var
|
|
8221
|
+
var import_type_guards27 = require("@wistia/type-guards");
|
|
8613
8222
|
var useFocusRestore = () => {
|
|
8614
8223
|
const previouslyFocusedRef = (0, import_react36.useRef)(null);
|
|
8615
8224
|
(0, import_react36.useEffect)(() => {
|
|
@@ -8617,7 +8226,7 @@ var useFocusRestore = () => {
|
|
|
8617
8226
|
}, []);
|
|
8618
8227
|
(0, import_react36.useEffect)(() => {
|
|
8619
8228
|
return () => {
|
|
8620
|
-
if ((0,
|
|
8229
|
+
if ((0, import_type_guards27.isNotNil)(previouslyFocusedRef.current)) {
|
|
8621
8230
|
setTimeout(() => {
|
|
8622
8231
|
previouslyFocusedRef.current?.focus();
|
|
8623
8232
|
}, 0);
|
|
@@ -8762,7 +8371,7 @@ var Modal = (0, import_react39.forwardRef)(
|
|
|
8762
8371
|
import_react_dialog4.Root,
|
|
8763
8372
|
{
|
|
8764
8373
|
onOpenChange: (open2) => {
|
|
8765
|
-
if (!open2 && (0,
|
|
8374
|
+
if (!open2 && (0, import_type_guards28.isNotNil)(onRequestClose)) {
|
|
8766
8375
|
onRequestClose();
|
|
8767
8376
|
}
|
|
8768
8377
|
},
|
|
@@ -8775,7 +8384,7 @@ var Modal = (0, import_react39.forwardRef)(
|
|
|
8775
8384
|
ref,
|
|
8776
8385
|
fullHeight,
|
|
8777
8386
|
onOpenAutoFocus: (event) => {
|
|
8778
|
-
if ((0,
|
|
8387
|
+
if ((0, import_type_guards28.isNotNil)(initialFocusRef) && initialFocusRef.current) {
|
|
8779
8388
|
event.preventDefault();
|
|
8780
8389
|
requestAnimationFrame(() => {
|
|
8781
8390
|
initialFocusRef.current?.focus();
|
|
@@ -8807,7 +8416,7 @@ Modal.displayName = "Modal";
|
|
|
8807
8416
|
// src/components/Radio/Radio.tsx
|
|
8808
8417
|
var import_react40 = require("react");
|
|
8809
8418
|
var import_styled_components53 = __toESM(require("styled-components"));
|
|
8810
|
-
var
|
|
8419
|
+
var import_type_guards29 = require("@wistia/type-guards");
|
|
8811
8420
|
var import_jsx_runtime202 = require("react/jsx-runtime");
|
|
8812
8421
|
var StyledLabelWrapper2 = import_styled_components53.default.div`
|
|
8813
8422
|
display: flex;
|
|
@@ -8893,7 +8502,7 @@ var Radio = (0, import_react40.forwardRef)(
|
|
|
8893
8502
|
...otherProps
|
|
8894
8503
|
}, ref) => {
|
|
8895
8504
|
const generatedId = (0, import_react40.useId)();
|
|
8896
|
-
const computedId = (0,
|
|
8505
|
+
const computedId = (0, import_type_guards29.isNonEmptyString)(id) ? id : `ui-radio-${generatedId}`;
|
|
8897
8506
|
return /* @__PURE__ */ (0, import_jsx_runtime202.jsxs)(
|
|
8898
8507
|
StyledRadioWrapper,
|
|
8899
8508
|
{
|
|
@@ -8938,7 +8547,7 @@ Radio.displayName = "Radio";
|
|
|
8938
8547
|
var import_react41 = require("react");
|
|
8939
8548
|
var import_styled_components54 = __toESM(require("styled-components"));
|
|
8940
8549
|
var import_react_toggle_group = require("@radix-ui/react-toggle-group");
|
|
8941
|
-
var
|
|
8550
|
+
var import_type_guards30 = require("@wistia/type-guards");
|
|
8942
8551
|
var import_jsx_runtime203 = require("react/jsx-runtime");
|
|
8943
8552
|
var StyledSegmentedControl = (0, import_styled_components54.default)(import_react_toggle_group.Root)`
|
|
8944
8553
|
display: inline-flex;
|
|
@@ -8957,7 +8566,7 @@ var SegmentedControl = (0, import_react41.forwardRef)(
|
|
|
8957
8566
|
onSelectedValueChange,
|
|
8958
8567
|
...props
|
|
8959
8568
|
}, ref) => {
|
|
8960
|
-
if ((0,
|
|
8569
|
+
if ((0, import_type_guards30.isNil)(children)) {
|
|
8961
8570
|
return null;
|
|
8962
8571
|
}
|
|
8963
8572
|
return /* @__PURE__ */ (0, import_jsx_runtime203.jsx)(
|
|
@@ -8983,7 +8592,7 @@ SegmentedControl.displayName = "SegmentedControl";
|
|
|
8983
8592
|
var import_react42 = require("react");
|
|
8984
8593
|
var import_styled_components55 = __toESM(require("styled-components"));
|
|
8985
8594
|
var import_react_toggle_group2 = require("@radix-ui/react-toggle-group");
|
|
8986
|
-
var
|
|
8595
|
+
var import_type_guards31 = require("@wistia/type-guards");
|
|
8987
8596
|
var import_jsx_runtime204 = require("react/jsx-runtime");
|
|
8988
8597
|
var StyledSegmentedControlItem = (0, import_styled_components55.default)(import_react_toggle_group2.Item)`
|
|
8989
8598
|
all: unset; /* ToggleGroupItem is a button element */
|
|
@@ -9050,8 +8659,8 @@ var SegmentedControlItem = (0, import_react42.forwardRef)(
|
|
|
9050
8659
|
StyledSegmentedControlItem,
|
|
9051
8660
|
{
|
|
9052
8661
|
ref,
|
|
9053
|
-
$hasLabel: (0,
|
|
9054
|
-
"aria-label": (0,
|
|
8662
|
+
$hasLabel: (0, import_type_guards31.isNotNil)(label),
|
|
8663
|
+
"aria-label": (0, import_type_guards31.isNotNil)(label) ? void 0 : ariaLabel,
|
|
9055
8664
|
disabled,
|
|
9056
8665
|
onClick: handleClick,
|
|
9057
8666
|
value,
|
|
@@ -9068,7 +8677,7 @@ SegmentedControlItem.displayName = "SegmentedControlItem";
|
|
|
9068
8677
|
// src/components/Tag/Tag.tsx
|
|
9069
8678
|
var import_react43 = require("react");
|
|
9070
8679
|
var import_styled_components56 = __toESM(require("styled-components"));
|
|
9071
|
-
var
|
|
8680
|
+
var import_type_guards32 = require("@wistia/type-guards");
|
|
9072
8681
|
var import_jsx_runtime205 = require("react/jsx-runtime");
|
|
9073
8682
|
var TagLabel = import_styled_components56.default.a`
|
|
9074
8683
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
@@ -9146,10 +8755,10 @@ var StyledTag = import_styled_components56.default.div`
|
|
|
9146
8755
|
}
|
|
9147
8756
|
`;
|
|
9148
8757
|
var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
|
|
9149
|
-
if ((0,
|
|
8758
|
+
if ((0, import_type_guards32.isNil)(onClickRemove)) {
|
|
9150
8759
|
return null;
|
|
9151
8760
|
}
|
|
9152
|
-
if ((0,
|
|
8761
|
+
if ((0, import_type_guards32.isNil)(onClickRemoveLabel)) {
|
|
9153
8762
|
throw new Error(
|
|
9154
8763
|
"for accessibility, onClickRemoveLabel must be provided if onClickRemove is provided"
|
|
9155
8764
|
);
|
|
@@ -9178,7 +8787,7 @@ var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
|
|
|
9178
8787
|
};
|
|
9179
8788
|
var Tag = (0, import_react43.forwardRef)(
|
|
9180
8789
|
({ onClickRemove, colorScheme = "inherit", href, label, onClickRemoveLabel, ...otherProps }, ref) => {
|
|
9181
|
-
const labelProps = (0,
|
|
8790
|
+
const labelProps = (0, import_type_guards32.isNotNil)(href) && (0, import_type_guards32.isNonEmptyString)(href) ? { href, as: "a" } : { as: "span" };
|
|
9182
8791
|
return /* @__PURE__ */ (0, import_jsx_runtime205.jsxs)(
|
|
9183
8792
|
StyledTag,
|
|
9184
8793
|
{
|
|
@@ -9316,7 +8925,7 @@ Tooltip.displayName = "Tooltip";
|
|
|
9316
8925
|
|
|
9317
8926
|
// src/components/WistiaLogo/WistiaLogo.tsx
|
|
9318
8927
|
var import_styled_components58 = __toESM(require("styled-components"));
|
|
9319
|
-
var
|
|
8928
|
+
var import_type_guards33 = require("@wistia/type-guards");
|
|
9320
8929
|
var import_jsx_runtime207 = require("react/jsx-runtime");
|
|
9321
8930
|
var renderBrandmark = (brandmarkColor, iconOnly) => {
|
|
9322
8931
|
if (iconOnly) {
|
|
@@ -9410,7 +9019,7 @@ var WistiaLogo = ({
|
|
|
9410
9019
|
...otherProps,
|
|
9411
9020
|
children: [
|
|
9412
9021
|
/* @__PURE__ */ (0, import_jsx_runtime207.jsx)("title", { children: title }),
|
|
9413
|
-
(0,
|
|
9022
|
+
(0, import_type_guards33.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime207.jsx)("desc", { children: description }) : null,
|
|
9414
9023
|
renderBrandmark(brandmarkColor, iconOnly),
|
|
9415
9024
|
renderLogotype(logotypeColor, iconOnly)
|
|
9416
9025
|
]
|
|
@@ -9606,7 +9215,7 @@ var SelectOptionGroup = ({ children, label, ...props }) => {
|
|
|
9606
9215
|
|
|
9607
9216
|
// src/components/DataCards/DataCard.tsx
|
|
9608
9217
|
var import_styled_components62 = __toESM(require("styled-components"));
|
|
9609
|
-
var
|
|
9218
|
+
var import_type_guards34 = require("@wistia/type-guards");
|
|
9610
9219
|
var import_jsx_runtime211 = require("react/jsx-runtime");
|
|
9611
9220
|
var StyledDataCard = import_styled_components62.default.div`
|
|
9612
9221
|
${({ $colorScheme }) => getColorScheme($colorScheme)}
|
|
@@ -9695,8 +9304,8 @@ var DataCard = ({
|
|
|
9695
9304
|
children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(StyledLoadingValue, {}) : value
|
|
9696
9305
|
}
|
|
9697
9306
|
),
|
|
9698
|
-
(0,
|
|
9699
|
-
(0,
|
|
9307
|
+
(0, import_type_guards34.isNotNull)(upperRightSlot) && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(StyledSlot, { children: upperRightSlot }),
|
|
9308
|
+
(0, import_type_guards34.isNotNull)(trend) && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(StyledDataCardTrendContainer, { children: trend })
|
|
9700
9309
|
]
|
|
9701
9310
|
}
|
|
9702
9311
|
);
|
|
@@ -9828,7 +9437,6 @@ var DataCardTrend = ({
|
|
|
9828
9437
|
WistiaLogo,
|
|
9829
9438
|
colorSchemeOptions,
|
|
9830
9439
|
copyToClipboard,
|
|
9831
|
-
dateTime,
|
|
9832
9440
|
ellipsisFlexParentStyle,
|
|
9833
9441
|
ellipsisStyle,
|
|
9834
9442
|
iconSizeMap,
|