@wistia/ui 0.4.14-beta.e86c32fa.64ed100 → 0.4.14
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 +108 -467
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +1 -23
- package/dist/index.d.ts +1 -23
- package/dist/index.mjs +28 -386
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -2
package/dist/index.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.4.14
|
|
3
|
+
* @license @wistia/ui v0.4.14
|
|
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,363 +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 } = {}) => {
|
|
1625
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1626
|
-
return "";
|
|
1627
|
-
}
|
|
1628
|
-
try {
|
|
1629
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1630
|
-
dateStyle: "medium",
|
|
1631
|
-
timeZone
|
|
1632
|
-
}).format(date);
|
|
1633
|
-
} catch (error) {
|
|
1634
|
-
console.error(error);
|
|
1635
|
-
return "";
|
|
1636
|
-
}
|
|
1637
|
-
};
|
|
1638
|
-
|
|
1639
|
-
// src/helpers/dateTime/dateOnlyStringForSentence.ts
|
|
1640
|
-
var dateOnlyStringForSentence = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1641
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1642
|
-
return "";
|
|
1643
|
-
}
|
|
1644
|
-
try {
|
|
1645
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1646
|
-
dateStyle: "long",
|
|
1647
|
-
timeZone
|
|
1648
|
-
}).format(date);
|
|
1649
|
-
} catch (error) {
|
|
1650
|
-
console.error(error);
|
|
1651
|
-
return "";
|
|
1652
|
-
}
|
|
1653
|
-
};
|
|
1654
|
-
|
|
1655
|
-
// src/helpers/dateTime/dateOnlyStringNumeric.ts
|
|
1656
|
-
var dateOnlyStringNumeric = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1657
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1658
|
-
return "";
|
|
1659
|
-
}
|
|
1660
|
-
try {
|
|
1661
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1662
|
-
year: "numeric",
|
|
1663
|
-
month: "2-digit",
|
|
1664
|
-
day: "2-digit",
|
|
1665
|
-
timeZone
|
|
1666
|
-
}).format(date);
|
|
1667
|
-
} catch (error) {
|
|
1668
|
-
console.error(error);
|
|
1669
|
-
return "";
|
|
1670
|
-
}
|
|
1671
|
-
};
|
|
1672
|
-
|
|
1673
|
-
// src/helpers/dateTime/dateTimeToDate.ts
|
|
1674
|
-
var dateTimeToDate = (dateTime2) => {
|
|
1675
|
-
const { year, month, dayOfMonth, hours, minutes } = dateTime2 ?? {};
|
|
1676
|
-
if (year !== void 0 && month !== void 0 && dayOfMonth !== void 0) {
|
|
1677
|
-
return new Date(year, month, dayOfMonth, hours ?? 0, minutes ?? 0);
|
|
1678
|
-
}
|
|
1679
|
-
return null;
|
|
1680
|
-
};
|
|
1681
|
-
|
|
1682
|
-
// src/helpers/dateTime/dateToDateTime.ts
|
|
1683
|
-
var dateToDateTime = (date) => {
|
|
1684
|
-
if (!isDate(date)) {
|
|
1685
|
-
return null;
|
|
1686
|
-
}
|
|
1687
|
-
return {
|
|
1688
|
-
year: date.getFullYear(),
|
|
1689
|
-
month: date.getMonth(),
|
|
1690
|
-
dayOfMonth: date.getDate(),
|
|
1691
|
-
hours: date.getHours(),
|
|
1692
|
-
minutes: date.getMinutes()
|
|
1693
|
-
};
|
|
1694
|
-
};
|
|
1695
|
-
|
|
1696
|
-
// src/helpers/dateTime/dateTimeToISO.ts
|
|
1697
|
-
var dateTimeToISO = (dateTime2) => dateTimeToDate(dateTime2)?.toISOString() ?? null;
|
|
1698
|
-
|
|
1699
|
-
// src/helpers/dateTime/dateTimeRounded.ts
|
|
1700
|
-
var dateTimeRounded = (dateTime2, toISOString = true) => {
|
|
1701
|
-
const first30Min = dateTime2.getMinutes() <= halfAnHourInMinutes;
|
|
1702
|
-
const hours = first30Min ? dateTime2.getHours() : dateTime2.getHours() + 1;
|
|
1703
|
-
const minutes = first30Min ? halfAnHourInMinutes : 0;
|
|
1704
|
-
const dateWithTime = {
|
|
1705
|
-
...dateToDateTime(dateTime2),
|
|
1706
|
-
hours,
|
|
1707
|
-
minutes
|
|
1708
|
-
};
|
|
1709
|
-
if (toISOString) {
|
|
1710
|
-
return dateTimeToISO(dateWithTime);
|
|
1711
|
-
}
|
|
1712
|
-
return dateTimeToDate(dateWithTime);
|
|
1713
|
-
};
|
|
1714
|
-
|
|
1715
|
-
// src/helpers/dateTime/dateTimeString.ts
|
|
1716
|
-
var import_type_guards3 = require("@wistia/type-guards");
|
|
1717
|
-
var dateTimeString = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1718
|
-
if ((0, import_type_guards3.isNil)(date)) {
|
|
1719
|
-
return "";
|
|
1720
|
-
}
|
|
1721
|
-
const formattedDate = new Date(date);
|
|
1722
|
-
if (isInvalidDate(formattedDate)) {
|
|
1723
|
-
return "";
|
|
1724
|
-
}
|
|
1725
|
-
try {
|
|
1726
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1727
|
-
dateStyle: "medium",
|
|
1728
|
-
timeStyle: "short",
|
|
1729
|
-
timeZone
|
|
1730
|
-
}).format(formattedDate);
|
|
1731
|
-
} catch (error) {
|
|
1732
|
-
console.error(error);
|
|
1733
|
-
return "";
|
|
1734
|
-
}
|
|
1735
|
-
};
|
|
1736
|
-
|
|
1737
|
-
// src/helpers/dateTime/dateTimeStringForSentence.ts
|
|
1738
|
-
var dateTimeStringForSentence = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1739
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1740
|
-
return "";
|
|
1741
|
-
}
|
|
1742
|
-
try {
|
|
1743
|
-
const { year, month, day, hour, minute, dayPeriod } = new Intl.DateTimeFormat(defaultLocales, {
|
|
1744
|
-
month: "long",
|
|
1745
|
-
day: "numeric",
|
|
1746
|
-
year: "numeric",
|
|
1747
|
-
hour: "numeric",
|
|
1748
|
-
minute: "2-digit",
|
|
1749
|
-
timeZone
|
|
1750
|
-
}).formatToParts(date).reduce((acc, part) => {
|
|
1751
|
-
if (part.type !== "literal") {
|
|
1752
|
-
acc[part.type] = part.value;
|
|
1753
|
-
}
|
|
1754
|
-
return acc;
|
|
1755
|
-
}, {});
|
|
1756
|
-
return `${month} ${day}, ${year}, ${hour}:${minute} ${dayPeriod}`;
|
|
1757
|
-
} catch (error) {
|
|
1758
|
-
console.error(error);
|
|
1759
|
-
return "";
|
|
1760
|
-
}
|
|
1761
|
-
};
|
|
1762
|
-
|
|
1763
|
-
// src/helpers/dateTime/dateUTCOffset.ts
|
|
1764
|
-
var dateUTCOffset = (date) => {
|
|
1765
|
-
const offsetInHours = date.getTimezoneOffset() / minutesInHour * -1;
|
|
1766
|
-
const hours = Math.round(offsetInHours);
|
|
1767
|
-
const minutes = (offsetInHours - hours) * minutesInHour;
|
|
1768
|
-
const prefix = hours >= 0 ? "+" : "";
|
|
1769
|
-
const hoursString = `${hours}`.padStart(2, "0");
|
|
1770
|
-
const minutesString = `${minutes}`.padStart(2, "0");
|
|
1771
|
-
return `${prefix}${hoursString}:${minutesString}`;
|
|
1772
|
-
};
|
|
1773
|
-
|
|
1774
|
-
// src/helpers/dateTime/dayOfWeekString.ts
|
|
1775
|
-
var dayOfWeekString = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1776
|
-
if (date === null) {
|
|
1777
|
-
return "";
|
|
1778
|
-
}
|
|
1779
|
-
try {
|
|
1780
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1781
|
-
weekday: "long",
|
|
1782
|
-
timeZone
|
|
1783
|
-
}).format(date);
|
|
1784
|
-
} catch (error) {
|
|
1785
|
-
console.error(error);
|
|
1786
|
-
return "";
|
|
1787
|
-
}
|
|
1788
|
-
};
|
|
1789
|
-
|
|
1790
|
-
// src/helpers/dateTime/padTimeInteger.ts
|
|
1791
|
-
var padTimeInteger = (num) => num.toString().padStart(2, "0");
|
|
1792
|
-
|
|
1793
|
-
// src/helpers/dateTime/mediaDurationString.ts
|
|
1794
|
-
var mediaDurationString = (numberOfMilliseconds) => {
|
|
1795
|
-
const { hours, minutes, seconds } = buildTimeDuration(numberOfMilliseconds);
|
|
1796
|
-
if (hours < 1) {
|
|
1797
|
-
return `${minutes}:${padTimeInteger(seconds)}`;
|
|
1798
|
-
}
|
|
1799
|
-
return `${hours}:${padTimeInteger(minutes)}:${padTimeInteger(seconds)}`;
|
|
1800
|
-
};
|
|
1801
|
-
|
|
1802
|
-
// src/helpers/dateTime/millisecondsToDurationISOString.ts
|
|
1803
|
-
var millisecondsToDurationISOString = (numberOfMilliseconds) => {
|
|
1804
|
-
const { seconds, minutes, hours } = buildTimeDuration(numberOfMilliseconds);
|
|
1805
|
-
let string = "PT";
|
|
1806
|
-
if (hours) {
|
|
1807
|
-
string += `${hours}H`;
|
|
1808
|
-
}
|
|
1809
|
-
if (minutes) {
|
|
1810
|
-
string += `${minutes}M`;
|
|
1811
|
-
}
|
|
1812
|
-
if (seconds) {
|
|
1813
|
-
string += `${seconds}S`;
|
|
1814
|
-
}
|
|
1815
|
-
if (!(seconds || minutes || hours)) {
|
|
1816
|
-
string += "0S";
|
|
1817
|
-
}
|
|
1818
|
-
return string;
|
|
1819
|
-
};
|
|
1820
|
-
|
|
1821
|
-
// src/helpers/dateTime/monthDayStringNumeric.ts
|
|
1822
|
-
var monthDayStringNumeric = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1823
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1824
|
-
return "";
|
|
1825
|
-
}
|
|
1826
|
-
try {
|
|
1827
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1828
|
-
month: "2-digit",
|
|
1829
|
-
day: "2-digit",
|
|
1830
|
-
timeZone
|
|
1831
|
-
}).format(date);
|
|
1832
|
-
} catch (error) {
|
|
1833
|
-
console.error(error);
|
|
1834
|
-
return "";
|
|
1835
|
-
}
|
|
1836
|
-
};
|
|
1837
|
-
|
|
1838
|
-
// src/helpers/dateTime/sessionDurationString.ts
|
|
1839
|
-
var sessionDurationString = (numberOfMilliseconds) => {
|
|
1840
|
-
const { hours, minutes, seconds } = buildTimeDuration(numberOfMilliseconds);
|
|
1841
|
-
return `${hours}:${padTimeInteger(minutes)}:${padTimeInteger(seconds)}`;
|
|
1842
|
-
};
|
|
1843
|
-
|
|
1844
|
-
// src/helpers/dateTime/timeAgoString.ts
|
|
1845
|
-
var import_date_fns = require("date-fns");
|
|
1846
|
-
var timeAgoString = (date, { nowAnchor = /* @__PURE__ */ new Date() } = {}) => {
|
|
1847
|
-
if (isInvalidDate(date)) {
|
|
1848
|
-
return "";
|
|
1849
|
-
}
|
|
1850
|
-
const minutesAgo = (nowAnchor.valueOf() - date.valueOf()) / (secondsInMinute * milisecondsInSecond);
|
|
1851
|
-
const minutesAgoRounded = Math.round(minutesAgo);
|
|
1852
|
-
const differenceInDays = (0, import_date_fns.differenceInCalendarDays)(nowAnchor, date);
|
|
1853
|
-
if (minutesAgo < 0) {
|
|
1854
|
-
return dateTimeString(date);
|
|
1855
|
-
}
|
|
1856
|
-
if (minutesAgo < 1) {
|
|
1857
|
-
return "< 1 minute ago";
|
|
1858
|
-
}
|
|
1859
|
-
if (minutesAgoRounded < 2) {
|
|
1860
|
-
return "1 minute ago";
|
|
1861
|
-
}
|
|
1862
|
-
if (minutesAgoRounded <= minutesInHour) {
|
|
1863
|
-
return `${minutesAgoRounded} minutes ago`;
|
|
1864
|
-
}
|
|
1865
|
-
if (differenceInDays === 0) {
|
|
1866
|
-
return `Today, ${Intl.DateTimeFormat(defaultLocales, { timeStyle: "short" }).format(date)}`;
|
|
1867
|
-
}
|
|
1868
|
-
if (differenceInDays === 1) {
|
|
1869
|
-
return `Yesterday, ${Intl.DateTimeFormat(defaultLocales, { timeStyle: "short" }).format(date)}`;
|
|
1870
|
-
}
|
|
1871
|
-
if (date.getFullYear() === nowAnchor.getFullYear()) {
|
|
1872
|
-
return Intl.DateTimeFormat(defaultLocales, {
|
|
1873
|
-
day: "numeric",
|
|
1874
|
-
month: "short",
|
|
1875
|
-
hour: "numeric",
|
|
1876
|
-
minute: "2-digit"
|
|
1877
|
-
}).format(date);
|
|
1878
|
-
}
|
|
1879
|
-
return dateTimeString(date);
|
|
1880
|
-
};
|
|
1881
|
-
|
|
1882
|
-
// src/helpers/dateTime/timeOnlyString.ts
|
|
1883
|
-
var timeOnlyString = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
1884
|
-
if (!isDate(date) || isInvalidDate(date)) {
|
|
1885
|
-
return "";
|
|
1886
|
-
}
|
|
1887
|
-
try {
|
|
1888
|
-
return new Intl.DateTimeFormat(defaultLocales, {
|
|
1889
|
-
timeStyle: "short",
|
|
1890
|
-
timeZone
|
|
1891
|
-
}).format(date);
|
|
1892
|
-
} catch (error) {
|
|
1893
|
-
console.error(error);
|
|
1894
|
-
return "";
|
|
1895
|
-
}
|
|
1896
|
-
};
|
|
1897
|
-
|
|
1898
|
-
// src/helpers/dateTime/index.ts
|
|
1899
|
-
var dateTime = {
|
|
1900
|
-
buildTimeDuration,
|
|
1901
|
-
dateOnlyISOString,
|
|
1902
|
-
dateOnlyString,
|
|
1903
|
-
dateOnlyStringForSentence,
|
|
1904
|
-
dateOnlyStringNumeric,
|
|
1905
|
-
dateTimeRounded,
|
|
1906
|
-
dateTimeString,
|
|
1907
|
-
dateTimeStringForSentence,
|
|
1908
|
-
dateTimeToDate,
|
|
1909
|
-
dateTimeToISO,
|
|
1910
|
-
dateToDateTime,
|
|
1911
|
-
dateUTCOffset,
|
|
1912
|
-
dayOfWeekString,
|
|
1913
|
-
mediaDurationString,
|
|
1914
|
-
millisecondsToDurationISOString,
|
|
1915
|
-
monthDayStringNumeric,
|
|
1916
|
-
sessionDurationString,
|
|
1917
|
-
timeAgoString,
|
|
1918
|
-
timeOnlyString
|
|
1919
|
-
};
|
|
1920
|
-
|
|
1921
1563
|
// src/helpers/mq/mq.ts
|
|
1922
1564
|
var import_polished = require("polished");
|
|
1923
1565
|
|
|
@@ -1975,7 +1617,7 @@ var useBoolean = (initialValue = false) => {
|
|
|
1975
1617
|
};
|
|
1976
1618
|
|
|
1977
1619
|
// src/hooks/useMq/useMq.ts
|
|
1978
|
-
var
|
|
1620
|
+
var import_type_guards3 = require("@wistia/type-guards");
|
|
1979
1621
|
|
|
1980
1622
|
// src/hooks/useWindowSize/useWindowSize.ts
|
|
1981
1623
|
var import_react4 = require("react");
|
|
@@ -2037,7 +1679,7 @@ var useActiveMq = () => {
|
|
|
2037
1679
|
const keys = Object.keys(mq2);
|
|
2038
1680
|
return keys.filter((key) => {
|
|
2039
1681
|
const value = mq2[key];
|
|
2040
|
-
return (0,
|
|
1682
|
+
return (0, import_type_guards3.isBoolean)(value) && value;
|
|
2041
1683
|
});
|
|
2042
1684
|
};
|
|
2043
1685
|
|
|
@@ -2048,9 +1690,9 @@ var import_react6 = require("react");
|
|
|
2048
1690
|
var import_react5 = require("react");
|
|
2049
1691
|
|
|
2050
1692
|
// src/private/helpers/isObjectRef/isObjectRef.ts
|
|
2051
|
-
var
|
|
1693
|
+
var import_type_guards4 = require("@wistia/type-guards");
|
|
2052
1694
|
var isObjectRef = (value) => {
|
|
2053
|
-
return (0,
|
|
1695
|
+
return (0, import_type_guards4.isNotNil)(value) && (0, import_type_guards4.isRecord)(value) && "current" in value;
|
|
2054
1696
|
};
|
|
2055
1697
|
|
|
2056
1698
|
// src/private/hooks/useEvent/useEvent.ts
|
|
@@ -2115,10 +1757,10 @@ var useKey = (key, eventHandler, { eventName = "keydown", eventTarget, eventOpti
|
|
|
2115
1757
|
|
|
2116
1758
|
// src/hooks/useAriaLive/useAriaLive.tsx
|
|
2117
1759
|
var import_react7 = require("react");
|
|
2118
|
-
var
|
|
1760
|
+
var import_type_guards5 = require("@wistia/type-guards");
|
|
2119
1761
|
var useAriaLive = () => {
|
|
2120
1762
|
const context = (0, import_react7.useContext)(AriaLiveContext);
|
|
2121
|
-
if ((0,
|
|
1763
|
+
if ((0, import_type_guards5.isNil)(context)) {
|
|
2122
1764
|
throw new Error("useAriaLive must be used within an AriaLiveProvider");
|
|
2123
1765
|
}
|
|
2124
1766
|
return context;
|
|
@@ -2131,10 +1773,10 @@ var import_sonner2 = require("sonner");
|
|
|
2131
1773
|
// src/private/components/Toast/Toast.tsx
|
|
2132
1774
|
var import_react8 = require("react");
|
|
2133
1775
|
var import_styled_components15 = __toESM(require("styled-components"));
|
|
2134
|
-
var
|
|
1776
|
+
var import_type_guards7 = require("@wistia/type-guards");
|
|
2135
1777
|
|
|
2136
1778
|
// src/components/Ellipsis/Ellipsis.tsx
|
|
2137
|
-
var
|
|
1779
|
+
var import_type_guards6 = require("@wistia/type-guards");
|
|
2138
1780
|
var import_styled_components13 = __toESM(require("styled-components"));
|
|
2139
1781
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
2140
1782
|
var ellipsisStyle = import_styled_components13.css`
|
|
@@ -2166,7 +1808,7 @@ var ellipsisFlexParentStyle = import_styled_components13.css`
|
|
|
2166
1808
|
var EllipsisComponent = import_styled_components13.default.div`
|
|
2167
1809
|
${ellipsisStyle};
|
|
2168
1810
|
${({ $lines }) => {
|
|
2169
|
-
if ((0,
|
|
1811
|
+
if ((0, import_type_guards6.isNotNil)($lines)) {
|
|
2170
1812
|
return import_styled_components13.css`
|
|
2171
1813
|
-webkit-box-orient: vertical;
|
|
2172
1814
|
-webkit-line-clamp: ${$lines};
|
|
@@ -2348,7 +1990,7 @@ var StyledToast = import_styled_components15.default.div`
|
|
|
2348
1990
|
}
|
|
2349
1991
|
`;
|
|
2350
1992
|
var Action = ({ actionButton }) => {
|
|
2351
|
-
if ((0,
|
|
1993
|
+
if ((0, import_type_guards7.isNotNil)(actionButton) && (0, import_react8.isValidElement)(actionButton)) {
|
|
2352
1994
|
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ActionWrapper, { children: (0, import_react8.cloneElement)(actionButton, {
|
|
2353
1995
|
variant: "soft",
|
|
2354
1996
|
// force Button variant
|
|
@@ -2372,7 +2014,7 @@ var Toast = ({
|
|
|
2372
2014
|
$colorScheme: colorScheme,
|
|
2373
2015
|
children: [
|
|
2374
2016
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(MessageWrapper, { children: [
|
|
2375
|
-
(0,
|
|
2017
|
+
(0, import_type_guards7.isNotNil)(icon) ? icon : null,
|
|
2376
2018
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Message, { lines: 3, children: message })
|
|
2377
2019
|
] }),
|
|
2378
2020
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Action, { actionButton: action })
|
|
@@ -2413,7 +2055,7 @@ var import_styled_components21 = __toESM(require("styled-components"));
|
|
|
2413
2055
|
// src/components/Button/Button.tsx
|
|
2414
2056
|
var import_react12 = require("react");
|
|
2415
2057
|
var import_styled_components20 = __toESM(require("styled-components"));
|
|
2416
|
-
var
|
|
2058
|
+
var import_type_guards11 = require("@wistia/type-guards");
|
|
2417
2059
|
|
|
2418
2060
|
// src/css/buttonResetCss.tsx
|
|
2419
2061
|
var import_styled_components16 = require("styled-components");
|
|
@@ -2617,7 +2259,7 @@ var buttonSizeStyles = {
|
|
|
2617
2259
|
};
|
|
2618
2260
|
|
|
2619
2261
|
// src/components/Icon/Icon.tsx
|
|
2620
|
-
var
|
|
2262
|
+
var import_type_guards9 = require("@wistia/type-guards");
|
|
2621
2263
|
var import_styled_components18 = __toESM(require("styled-components"));
|
|
2622
2264
|
|
|
2623
2265
|
// src/components/Icon/icons/AbTestIcon.tsx
|
|
@@ -5778,7 +5420,7 @@ var iconMap = {
|
|
|
5778
5420
|
};
|
|
5779
5421
|
|
|
5780
5422
|
// src/private/hooks/useResponsiveProp/useResponsiveProp.ts
|
|
5781
|
-
var
|
|
5423
|
+
var import_type_guards8 = require("@wistia/type-guards");
|
|
5782
5424
|
var import_react10 = require("react");
|
|
5783
5425
|
var isResponsiveObject = (values) => {
|
|
5784
5426
|
return typeof values === "object" && values !== null && !Array.isArray(values) && "base" in values;
|
|
@@ -5786,9 +5428,9 @@ var isResponsiveObject = (values) => {
|
|
|
5786
5428
|
var useResponsiveProp = (values) => {
|
|
5787
5429
|
const activeMediaQueries = useActiveMq();
|
|
5788
5430
|
return (0, import_react10.useMemo)(() => {
|
|
5789
|
-
if ((0,
|
|
5431
|
+
if ((0, import_type_guards8.isRecord)(values) && isResponsiveObject(values)) {
|
|
5790
5432
|
const mq2 = activeMediaQueries.find((key) => key in values);
|
|
5791
|
-
return (0,
|
|
5433
|
+
return (0, import_type_guards8.isNotUndefined)(mq2) && (0, import_type_guards8.isNotUndefined)(values[mq2]) ? values[mq2] : values.base;
|
|
5792
5434
|
}
|
|
5793
5435
|
return values;
|
|
5794
5436
|
}, [activeMediaQueries, values]);
|
|
@@ -5815,13 +5457,13 @@ var Icon = ({
|
|
|
5815
5457
|
...otherProps
|
|
5816
5458
|
}) => {
|
|
5817
5459
|
const responsiveSize = useResponsiveProp(size);
|
|
5818
|
-
if ((0,
|
|
5460
|
+
if ((0, import_type_guards9.isNil)(type)) {
|
|
5819
5461
|
throw new Error("An Icon component requires a `type` prop to be provided");
|
|
5820
5462
|
}
|
|
5821
|
-
if ((0,
|
|
5463
|
+
if ((0, import_type_guards9.isNil)(iconMap[type])) {
|
|
5822
5464
|
throw new Error(`Type "${type}" does not exist, please update type prop in Icon component.`);
|
|
5823
5465
|
}
|
|
5824
|
-
if ((0,
|
|
5466
|
+
if ((0, import_type_guards9.isNil)(iconSizeMap[responsiveSize])) {
|
|
5825
5467
|
throw new Error(
|
|
5826
5468
|
`Size "${responsiveSize}" does not exist, please update size prop in Icon component.`
|
|
5827
5469
|
);
|
|
@@ -5853,12 +5495,12 @@ Icon.displayName = "Icon";
|
|
|
5853
5495
|
|
|
5854
5496
|
// src/components/Link/Link.tsx
|
|
5855
5497
|
var import_react11 = require("react");
|
|
5856
|
-
var
|
|
5498
|
+
var import_type_guards10 = require("@wistia/type-guards");
|
|
5857
5499
|
var import_styled_components19 = __toESM(require("styled-components"));
|
|
5858
5500
|
var import_react_router_dom = require("react-router-dom");
|
|
5859
5501
|
var import_jsx_runtime161 = require("react/jsx-runtime");
|
|
5860
5502
|
var generateHref = (href, type, disabled) => {
|
|
5861
|
-
if (disabled || (0,
|
|
5503
|
+
if (disabled || (0, import_type_guards10.isNil)(href)) {
|
|
5862
5504
|
return void 0;
|
|
5863
5505
|
}
|
|
5864
5506
|
let to = href;
|
|
@@ -5870,12 +5512,12 @@ var generateHref = (href, type, disabled) => {
|
|
|
5870
5512
|
}
|
|
5871
5513
|
return to;
|
|
5872
5514
|
};
|
|
5873
|
-
var isButton = (props) => (0,
|
|
5874
|
-
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);
|
|
5875
5517
|
var StyledLink = import_styled_components19.default.a`
|
|
5876
5518
|
--link-icon-size: 14px;
|
|
5877
5519
|
|
|
5878
|
-
${({ href }) => (0,
|
|
5520
|
+
${({ href }) => (0, import_type_guards10.isNil)(href) && buttonResetCss};
|
|
5879
5521
|
${({ $colorScheme }) => getColorScheme($colorScheme)}
|
|
5880
5522
|
cursor: pointer;
|
|
5881
5523
|
font-family: var(--wui-typography-family-default);
|
|
@@ -5919,7 +5561,7 @@ var Link = (0, import_react11.forwardRef)(
|
|
|
5919
5561
|
} finally {
|
|
5920
5562
|
if (routingCallback !== null) {
|
|
5921
5563
|
routingCallback();
|
|
5922
|
-
} else if ((0,
|
|
5564
|
+
} else if ((0, import_type_guards10.isNotNil)(to)) {
|
|
5923
5565
|
window.location.assign(to);
|
|
5924
5566
|
} else {
|
|
5925
5567
|
}
|
|
@@ -5982,7 +5624,7 @@ Link.displayName = "Link";
|
|
|
5982
5624
|
|
|
5983
5625
|
// src/components/Button/Button.tsx
|
|
5984
5626
|
var import_jsx_runtime162 = require("react/jsx-runtime");
|
|
5985
|
-
var isLink2 = (props) => (0,
|
|
5627
|
+
var isLink2 = (props) => (0, import_type_guards11.isNotUndefined)(props.href);
|
|
5986
5628
|
var StyledButton = import_styled_components20.default.button`
|
|
5987
5629
|
${buttonResetCss}
|
|
5988
5630
|
${({ $colorScheme }) => getColorScheme($colorScheme)}
|
|
@@ -6023,8 +5665,8 @@ var ButtonContent = ({
|
|
|
6023
5665
|
/* @__PURE__ */ (0, import_jsx_runtime162.jsxs)(
|
|
6024
5666
|
StyledButtonContent,
|
|
6025
5667
|
{
|
|
6026
|
-
$hasLeftIcon: (0,
|
|
6027
|
-
$hasRightIcon: (0,
|
|
5668
|
+
$hasLeftIcon: (0, import_type_guards11.isNotNil)(leftIcon),
|
|
5669
|
+
$hasRightIcon: (0, import_type_guards11.isNotNil)(rightIcon),
|
|
6028
5670
|
$isLoading: isLoading,
|
|
6029
5671
|
children: [
|
|
6030
5672
|
leftIcon ?? null,
|
|
@@ -6092,7 +5734,7 @@ var Button = (0, import_react12.forwardRef)(
|
|
|
6092
5734
|
event.preventDefault();
|
|
6093
5735
|
return;
|
|
6094
5736
|
}
|
|
6095
|
-
if ((0,
|
|
5737
|
+
if ((0, import_type_guards11.isNotNil)(onClick)) {
|
|
6096
5738
|
onClick(event);
|
|
6097
5739
|
}
|
|
6098
5740
|
};
|
|
@@ -6253,7 +5895,7 @@ ActionButton.displayName = "ActionButton";
|
|
|
6253
5895
|
|
|
6254
5896
|
// src/components/Avatar/Avatar.tsx
|
|
6255
5897
|
var import_react14 = require("react");
|
|
6256
|
-
var
|
|
5898
|
+
var import_type_guards13 = require("@wistia/type-guards");
|
|
6257
5899
|
var import_styled_components23 = __toESM(require("styled-components"));
|
|
6258
5900
|
|
|
6259
5901
|
// src/components/ColorSchemeWrapper/ColorSchemeWrapper.tsx
|
|
@@ -6296,13 +5938,13 @@ var ColorSchemeWrapper = ({
|
|
|
6296
5938
|
ColorSchemeWrapper.displayName = "ColorSchemeWrapper";
|
|
6297
5939
|
|
|
6298
5940
|
// src/components/Avatar/formatNameForDisplay.tsx
|
|
6299
|
-
var
|
|
5941
|
+
var import_type_guards12 = require("@wistia/type-guards");
|
|
6300
5942
|
var containsEmojiCharacter = (char) => {
|
|
6301
5943
|
const emojiRegex = /<a?:.+?:\d{18}>|\p{Extended_Pictographic}/gu;
|
|
6302
5944
|
return emojiRegex.test(char);
|
|
6303
5945
|
};
|
|
6304
5946
|
var formatNameForDisplay = (name) => {
|
|
6305
|
-
if ((0,
|
|
5947
|
+
if ((0, import_type_guards12.isNil)(name) || !(0, import_type_guards12.isString)(name) || (0, import_type_guards12.isEmptyString)(name) || containsEmojiCharacter(name)) {
|
|
6306
5948
|
return "U";
|
|
6307
5949
|
}
|
|
6308
5950
|
const firstChar = name.trim().substring(0, 1);
|
|
@@ -6365,7 +6007,7 @@ var AvatarWrapper = import_styled_components23.default.div`
|
|
|
6365
6007
|
max-height: ${({ $maxHeight }) => $maxHeight}px;
|
|
6366
6008
|
`;
|
|
6367
6009
|
var chooseColorScheme = (name) => {
|
|
6368
|
-
if ((0,
|
|
6010
|
+
if ((0, import_type_guards13.isNil)(name) || name === "Anonymous") {
|
|
6369
6011
|
return "default";
|
|
6370
6012
|
}
|
|
6371
6013
|
const filteredColors = colorSchemeOptions.filter(
|
|
@@ -6398,7 +6040,7 @@ var Avatar = ({
|
|
|
6398
6040
|
};
|
|
6399
6041
|
const avatarSize = heightAndWidth ?? avatarSizeMap[size];
|
|
6400
6042
|
const avatarColor = (0, import_react14.useMemo)(() => chooseColorScheme(name), [name]);
|
|
6401
|
-
const showInitials = (0,
|
|
6043
|
+
const showInitials = (0, import_type_guards13.isNil)(imageUrl) || imageLoadState === "error";
|
|
6402
6044
|
return /* @__PURE__ */ (0, import_jsx_runtime165.jsx)(
|
|
6403
6045
|
AvatarWrapper,
|
|
6404
6046
|
{
|
|
@@ -6429,7 +6071,7 @@ Avatar.displayName = "Avatar";
|
|
|
6429
6071
|
// src/components/Badge/Badge.tsx
|
|
6430
6072
|
var import_react15 = require("react");
|
|
6431
6073
|
var import_styled_components24 = __toESM(require("styled-components"));
|
|
6432
|
-
var
|
|
6074
|
+
var import_type_guards14 = require("@wistia/type-guards");
|
|
6433
6075
|
var import_jsx_runtime166 = require("react/jsx-runtime");
|
|
6434
6076
|
var StyledBadge = import_styled_components24.default.div`
|
|
6435
6077
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
@@ -6453,7 +6095,7 @@ var StyledBadge = import_styled_components24.default.div`
|
|
|
6453
6095
|
`;
|
|
6454
6096
|
var Badge = (0, import_react15.forwardRef)(
|
|
6455
6097
|
({ colorScheme = "inherit", label, icon, ...otherProps }, ref) => {
|
|
6456
|
-
const hasIcon = (0,
|
|
6098
|
+
const hasIcon = (0, import_type_guards14.isNotNil)(icon);
|
|
6457
6099
|
return /* @__PURE__ */ (0, import_jsx_runtime166.jsxs)(
|
|
6458
6100
|
StyledBadge,
|
|
6459
6101
|
{
|
|
@@ -6474,7 +6116,7 @@ Badge.displayName = "Badge";
|
|
|
6474
6116
|
// src/components/Box/Box.tsx
|
|
6475
6117
|
var import_react16 = require("react");
|
|
6476
6118
|
var import_styled_components25 = __toESM(require("styled-components"));
|
|
6477
|
-
var
|
|
6119
|
+
var import_type_guards15 = require("@wistia/type-guards");
|
|
6478
6120
|
|
|
6479
6121
|
// src/private/helpers/makePolymorphic/makePolymorphic.tsx
|
|
6480
6122
|
var makePolymorphic = (component) => {
|
|
@@ -6485,8 +6127,8 @@ var makePolymorphic = (component) => {
|
|
|
6485
6127
|
var import_jsx_runtime167 = require("react/jsx-runtime");
|
|
6486
6128
|
var isDev = process.env["NODE_ENV"] === "development" || process.env["NODE_ENV"] === "test";
|
|
6487
6129
|
var getGapStyle = (gap) => {
|
|
6488
|
-
if ((0,
|
|
6489
|
-
if ((0,
|
|
6130
|
+
if ((0, import_type_guards15.isNotNil)(gap)) {
|
|
6131
|
+
if ((0, import_type_guards15.isRecord)(gap)) {
|
|
6490
6132
|
return Object.entries(gap).map(([key, value]) => {
|
|
6491
6133
|
return `${key}-gap: var(--wui-${value})};`;
|
|
6492
6134
|
}).join("");
|
|
@@ -6529,25 +6171,25 @@ var StyledBoxComponent = import_styled_components25.default.div`
|
|
|
6529
6171
|
align-content: ${({ $alignContent }) => $alignContent};
|
|
6530
6172
|
align-items: ${({ $alignItems }) => $alignItems};
|
|
6531
6173
|
align-self: ${({ $alignSelf }) => $alignSelf ?? null};
|
|
6532
|
-
display: ${({ $inline }) => (0,
|
|
6533
|
-
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};
|
|
6534
6176
|
flex-direction: ${({ $flexDirection }) => $flexDirection};
|
|
6535
6177
|
${({ $fillBox: fill }) => getFillStyle(fill)};
|
|
6536
6178
|
${({ $fillViewport }) => getFillViewportStyle($fillViewport)};
|
|
6537
6179
|
|
|
6538
6180
|
/* Box children styles */
|
|
6539
|
-
flex-grow: ${({ $grow }) => (0,
|
|
6540
|
-
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};
|
|
6541
6183
|
flex-wrap: ${({ $wrapItems }) => $wrapItems ? "wrap" : "nowrap"};
|
|
6542
6184
|
${({ $gap }) => getGapStyle($gap)};
|
|
6543
6185
|
justify-content: ${({ $justifyContent }) => $justifyContent};
|
|
6544
|
-
order: ${({ $order }) => (0,
|
|
6186
|
+
order: ${({ $order }) => (0, import_type_guards15.isNotNil)($order) ? $order : null};
|
|
6545
6187
|
`;
|
|
6546
6188
|
var wrapChildren = (children) => {
|
|
6547
|
-
if ((0,
|
|
6189
|
+
if ((0, import_type_guards15.isNotNil)(children)) {
|
|
6548
6190
|
if (typeof children === "object" && isDev) {
|
|
6549
6191
|
return import_react16.Children.map(children, (child) => {
|
|
6550
|
-
if ((0,
|
|
6192
|
+
if ((0, import_type_guards15.isNil)(child)) return null;
|
|
6551
6193
|
const elementParams = {};
|
|
6552
6194
|
if (child.type?.displayName === "Box" || child.type?.displayName === "Box_UI") {
|
|
6553
6195
|
elementParams.hasBoxParent = true;
|
|
@@ -6694,7 +6336,7 @@ var Breadcrumb = ({ icon, href, children, ...props }) => {
|
|
|
6694
6336
|
|
|
6695
6337
|
// src/components/ButtonGroup/ButtonGroup.tsx
|
|
6696
6338
|
var import_styled_components28 = __toESM(require("styled-components"));
|
|
6697
|
-
var
|
|
6339
|
+
var import_type_guards16 = require("@wistia/type-guards");
|
|
6698
6340
|
var import_jsx_runtime170 = require("react/jsx-runtime");
|
|
6699
6341
|
var getAlignment = (align) => {
|
|
6700
6342
|
if (align === "center") {
|
|
@@ -6734,7 +6376,7 @@ var ButtonGroup = ({
|
|
|
6734
6376
|
fullWidth = false,
|
|
6735
6377
|
...otherProps
|
|
6736
6378
|
}) => {
|
|
6737
|
-
if ((0,
|
|
6379
|
+
if ((0, import_type_guards16.isNil)(children)) {
|
|
6738
6380
|
return null;
|
|
6739
6381
|
}
|
|
6740
6382
|
return /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
|
|
@@ -6804,7 +6446,7 @@ Card.displayName = "Card";
|
|
|
6804
6446
|
var import_react19 = require("react");
|
|
6805
6447
|
var import_react_checkbox = require("@radix-ui/react-checkbox");
|
|
6806
6448
|
var import_styled_components33 = __toESM(require("styled-components"));
|
|
6807
|
-
var
|
|
6449
|
+
var import_type_guards18 = require("@wistia/type-guards");
|
|
6808
6450
|
|
|
6809
6451
|
// src/components/Label/Label.tsx
|
|
6810
6452
|
var import_styled_components31 = __toESM(require("styled-components"));
|
|
@@ -6984,7 +6626,7 @@ Label.displayName = "Label";
|
|
|
6984
6626
|
|
|
6985
6627
|
// src/components/Label/LabelDescription.tsx
|
|
6986
6628
|
var import_styled_components32 = __toESM(require("styled-components"));
|
|
6987
|
-
var
|
|
6629
|
+
var import_type_guards17 = require("@wistia/type-guards");
|
|
6988
6630
|
var import_jsx_runtime174 = require("react/jsx-runtime");
|
|
6989
6631
|
var StyledLabelDescription = import_styled_components32.default.div`
|
|
6990
6632
|
color: var(--wui-color-text-secondary);
|
|
@@ -6996,7 +6638,7 @@ var LabelDescription = ({
|
|
|
6996
6638
|
children,
|
|
6997
6639
|
...props
|
|
6998
6640
|
}) => {
|
|
6999
|
-
if ((0,
|
|
6641
|
+
if ((0, import_type_guards17.isNil)(children)) {
|
|
7000
6642
|
return null;
|
|
7001
6643
|
}
|
|
7002
6644
|
return /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(StyledLabelDescription, { ...props, children });
|
|
@@ -7093,7 +6735,7 @@ var Checkbox = (0, import_react19.forwardRef)(
|
|
|
7093
6735
|
...otherProps
|
|
7094
6736
|
}, ref) => {
|
|
7095
6737
|
const generatedId = (0, import_react19.useId)();
|
|
7096
|
-
const computedId = (0,
|
|
6738
|
+
const computedId = (0, import_type_guards18.isNonEmptyString)(id) ? id : `wistia-ui-checkbox-group-${generatedId}`;
|
|
7097
6739
|
return /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)(StyledCheckboxWrapper, { children: [
|
|
7098
6740
|
/* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
|
|
7099
6741
|
StyledCheckboxRoot,
|
|
@@ -7186,7 +6828,7 @@ Divider.displayName = "Divider";
|
|
|
7186
6828
|
// src/components/Form/Form.tsx
|
|
7187
6829
|
var import_react21 = require("react");
|
|
7188
6830
|
var import_styled_components36 = __toESM(require("styled-components"));
|
|
7189
|
-
var
|
|
6831
|
+
var import_type_guards19 = require("@wistia/type-guards");
|
|
7190
6832
|
|
|
7191
6833
|
// src/components/Stack/Stack.tsx
|
|
7192
6834
|
var import_react20 = require("react");
|
|
@@ -7240,7 +6882,7 @@ var FormComponent = ({ children, action, values = {}, validate, fullWidth = fals
|
|
|
7240
6882
|
const id = props.id ?? autoId;
|
|
7241
6883
|
const handleValidate = (nextFormData) => {
|
|
7242
6884
|
const nextData = Object.fromEntries(nextFormData.entries());
|
|
7243
|
-
if ((0,
|
|
6885
|
+
if ((0, import_type_guards19.isUndefined)(validate)) {
|
|
7244
6886
|
return {};
|
|
7245
6887
|
}
|
|
7246
6888
|
return validate(nextData);
|
|
@@ -7250,7 +6892,7 @@ var FormComponent = ({ children, action, values = {}, validate, fullWidth = fals
|
|
|
7250
6892
|
props.onBlur(event);
|
|
7251
6893
|
}
|
|
7252
6894
|
const formData = new FormData(event.currentTarget);
|
|
7253
|
-
if ((0,
|
|
6895
|
+
if ((0, import_type_guards19.isNotUndefined)(validate)) {
|
|
7254
6896
|
handleValidate(formData);
|
|
7255
6897
|
}
|
|
7256
6898
|
};
|
|
@@ -7346,7 +6988,7 @@ var useFormState = (action, initialData = {}) => {
|
|
|
7346
6988
|
|
|
7347
6989
|
// src/components/Form/FormErrorSummary.tsx
|
|
7348
6990
|
var import_react23 = require("react");
|
|
7349
|
-
var
|
|
6991
|
+
var import_type_guards20 = require("@wistia/type-guards");
|
|
7350
6992
|
var import_jsx_runtime179 = require("react/jsx-runtime");
|
|
7351
6993
|
var ErrorItem = ({ name, error, formId }) => {
|
|
7352
6994
|
return /* @__PURE__ */ (0, import_jsx_runtime179.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(Link, { href: `${formId}-${name}`, children: error }) }, name);
|
|
@@ -7360,8 +7002,8 @@ var FormErrorSummary = ({ description }) => {
|
|
|
7360
7002
|
}
|
|
7361
7003
|
return /* @__PURE__ */ (0, import_jsx_runtime179.jsxs)("div", { ref, children: [
|
|
7362
7004
|
/* @__PURE__ */ (0, import_jsx_runtime179.jsx)("p", { children: description }),
|
|
7363
|
-
/* @__PURE__ */ (0, import_jsx_runtime179.jsx)("ul", { children: Object.entries(errors).filter(([, error]) => (0,
|
|
7364
|
-
([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)(
|
|
7365
7007
|
ErrorItem,
|
|
7366
7008
|
{
|
|
7367
7009
|
error: err,
|
|
@@ -7385,7 +7027,7 @@ var FormErrorSummary = ({ description }) => {
|
|
|
7385
7027
|
// src/components/FormField/FormField.tsx
|
|
7386
7028
|
var import_react27 = require("react");
|
|
7387
7029
|
var import_styled_components39 = __toESM(require("styled-components"));
|
|
7388
|
-
var
|
|
7030
|
+
var import_type_guards21 = require("@wistia/type-guards");
|
|
7389
7031
|
|
|
7390
7032
|
// src/components/Text/Text.tsx
|
|
7391
7033
|
var import_react24 = require("react");
|
|
@@ -7640,7 +7282,7 @@ var StyledErrorList = import_styled_components39.default.ul`
|
|
|
7640
7282
|
gap: var(--wui-space-01);
|
|
7641
7283
|
`;
|
|
7642
7284
|
var ErrorMessages = ({ errors, id }) => {
|
|
7643
|
-
const isMultipleErrors = (0,
|
|
7285
|
+
const isMultipleErrors = (0, import_type_guards21.isArray)(errors);
|
|
7644
7286
|
return isMultipleErrors ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(StyledErrorList, { children: errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
|
|
7645
7287
|
Text,
|
|
7646
7288
|
{
|
|
@@ -7683,19 +7325,19 @@ var FormField = ({
|
|
|
7683
7325
|
label: isInlineLabel ? label : void 0,
|
|
7684
7326
|
...props
|
|
7685
7327
|
};
|
|
7686
|
-
if ((0,
|
|
7328
|
+
if ((0, import_type_guards21.isUndefined)(value) && (0, import_type_guards21.isNotUndefined)(defaultValue)) {
|
|
7687
7329
|
childProps = {
|
|
7688
7330
|
...childProps,
|
|
7689
7331
|
defaultValue
|
|
7690
7332
|
};
|
|
7691
7333
|
}
|
|
7692
|
-
if ((0,
|
|
7693
|
-
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;
|
|
7694
7336
|
const handleChange = (event) => {
|
|
7695
|
-
if ((0,
|
|
7337
|
+
if ((0, import_type_guards21.isNotUndefined)(props.onChange)) {
|
|
7696
7338
|
props.onChange(event);
|
|
7697
7339
|
}
|
|
7698
|
-
if ((0,
|
|
7340
|
+
if ((0, import_type_guards21.isNotUndefined)(checkboxGroup.onChange)) {
|
|
7699
7341
|
checkboxGroup.onChange(event);
|
|
7700
7342
|
}
|
|
7701
7343
|
};
|
|
@@ -7703,15 +7345,15 @@ var FormField = ({
|
|
|
7703
7345
|
...childProps,
|
|
7704
7346
|
name: computedName,
|
|
7705
7347
|
onChange: handleChange,
|
|
7706
|
-
"aria-invalid": (0,
|
|
7707
|
-
"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
|
|
7708
7350
|
};
|
|
7709
7351
|
}
|
|
7710
7352
|
import_react27.Children.only(children);
|
|
7711
7353
|
return /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)(StyledFormField, { ...props, children: [
|
|
7712
7354
|
!isInlineLabel && /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(Label, { htmlFor: id, children: label }),
|
|
7713
7355
|
(0, import_react27.cloneElement)(children, childProps),
|
|
7714
|
-
(0,
|
|
7356
|
+
(0, import_type_guards21.isNotNil)(computedError) ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
|
|
7715
7357
|
ErrorMessages,
|
|
7716
7358
|
{
|
|
7717
7359
|
errors: computedError,
|
|
@@ -7784,7 +7426,7 @@ IconButton.displayName = "IconButton";
|
|
|
7784
7426
|
// src/components/Input/Input.tsx
|
|
7785
7427
|
var import_react30 = require("react");
|
|
7786
7428
|
var import_styled_components41 = __toESM(require("styled-components"));
|
|
7787
|
-
var
|
|
7429
|
+
var import_type_guards22 = require("@wistia/type-guards");
|
|
7788
7430
|
var import_jsx_runtime186 = require("react/jsx-runtime");
|
|
7789
7431
|
var inputStyles = import_styled_components41.css`
|
|
7790
7432
|
--wui-input-color-bg: var(--wui-color-bg-surface);
|
|
@@ -7872,7 +7514,7 @@ var StyledInputContainer = import_styled_components41.default.div`
|
|
|
7872
7514
|
}
|
|
7873
7515
|
`;
|
|
7874
7516
|
var isValidRef = (ref) => {
|
|
7875
|
-
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);
|
|
7876
7518
|
};
|
|
7877
7519
|
var Input = (0, import_react30.forwardRef)(
|
|
7878
7520
|
({
|
|
@@ -7887,24 +7529,24 @@ var Input = (0, import_react30.forwardRef)(
|
|
|
7887
7529
|
const internalRef = (0, import_react30.useRef)();
|
|
7888
7530
|
const ref = isValidRef(externalRef) ? externalRef : internalRef;
|
|
7889
7531
|
let leftIconToDisplay = leftIcon;
|
|
7890
|
-
if ((0,
|
|
7532
|
+
if ((0, import_type_guards22.isNil)(leftIcon) && type === "search") {
|
|
7891
7533
|
leftIconToDisplay = /* @__PURE__ */ (0, import_jsx_runtime186.jsx)(Icon, { type: "search" });
|
|
7892
7534
|
}
|
|
7893
|
-
if ((0,
|
|
7535
|
+
if ((0, import_type_guards22.isNotNil)(leftIconToDisplay)) {
|
|
7894
7536
|
leftIconToDisplay = (0, import_react30.cloneElement)(leftIconToDisplay, {
|
|
7895
7537
|
size: "md",
|
|
7896
7538
|
className: "wui-input-left-icon"
|
|
7897
7539
|
});
|
|
7898
7540
|
}
|
|
7899
7541
|
let rightIconToDisplay = rightIcon;
|
|
7900
|
-
if ((0,
|
|
7542
|
+
if ((0, import_type_guards22.isNotNil)(rightIconToDisplay)) {
|
|
7901
7543
|
rightIconToDisplay = (0, import_react30.cloneElement)(rightIconToDisplay, {
|
|
7902
7544
|
size: "md",
|
|
7903
7545
|
className: "wui-input-right-icon"
|
|
7904
7546
|
});
|
|
7905
7547
|
}
|
|
7906
7548
|
const handleFocus = (event) => {
|
|
7907
|
-
if ((0,
|
|
7549
|
+
if ((0, import_type_guards22.isNotNil)(props.onFocus)) {
|
|
7908
7550
|
props.onFocus(event);
|
|
7909
7551
|
}
|
|
7910
7552
|
if (autoSelect && ref && "current" in ref) {
|
|
@@ -7947,7 +7589,7 @@ Input.displayName = "Input";
|
|
|
7947
7589
|
// src/components/Menu/Menu.tsx
|
|
7948
7590
|
var import_styled_components42 = __toESM(require("styled-components"));
|
|
7949
7591
|
var import_react_dropdown_menu = require("@radix-ui/react-dropdown-menu");
|
|
7950
|
-
var
|
|
7592
|
+
var import_type_guards23 = require("@wistia/type-guards");
|
|
7951
7593
|
var import_react32 = require("react");
|
|
7952
7594
|
|
|
7953
7595
|
// src/components/Menu/MenuContext.tsx
|
|
@@ -8059,7 +7701,7 @@ var Menu = ({
|
|
|
8059
7701
|
}) => {
|
|
8060
7702
|
const contextValue = (0, import_react32.useMemo)(() => ({ compact }), [compact]);
|
|
8061
7703
|
let controlProps = {
|
|
8062
|
-
...(0,
|
|
7704
|
+
...(0, import_type_guards23.isNotNil)(onOpenChange) && (0, import_type_guards23.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {}
|
|
8063
7705
|
};
|
|
8064
7706
|
if (disabled) {
|
|
8065
7707
|
controlProps = {
|
|
@@ -8073,7 +7715,7 @@ var Menu = ({
|
|
|
8073
7715
|
modal: false,
|
|
8074
7716
|
...controlProps,
|
|
8075
7717
|
children: [
|
|
8076
|
-
/* @__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)(
|
|
8077
7719
|
Button,
|
|
8078
7720
|
{
|
|
8079
7721
|
"aria-expanded": isOpen,
|
|
@@ -8134,12 +7776,12 @@ MenuLabel.displayName = "MenuLabel";
|
|
|
8134
7776
|
var import_react34 = require("react");
|
|
8135
7777
|
var import_styled_components46 = __toESM(require("styled-components"));
|
|
8136
7778
|
var import_react_dropdown_menu3 = require("@radix-ui/react-dropdown-menu");
|
|
8137
|
-
var
|
|
7779
|
+
var import_type_guards25 = require("@wistia/type-guards");
|
|
8138
7780
|
|
|
8139
7781
|
// src/components/Menu/MenuItemButton.tsx
|
|
8140
7782
|
var import_react33 = require("react");
|
|
8141
7783
|
var import_styled_components44 = __toESM(require("styled-components"));
|
|
8142
|
-
var
|
|
7784
|
+
var import_type_guards24 = require("@wistia/type-guards");
|
|
8143
7785
|
var import_jsx_runtime189 = require("react/jsx-runtime");
|
|
8144
7786
|
var StyledButton3 = (0, import_styled_components44.default)(Button)`
|
|
8145
7787
|
${({ colorScheme }) => getColorScheme(colorScheme)};
|
|
@@ -8213,7 +7855,7 @@ var StyledBadgeContainer = import_styled_components44.default.div`
|
|
|
8213
7855
|
var MenuItemButton = (0, import_react33.forwardRef)(({ children, appearance, command, icon, ...props }, ref) => {
|
|
8214
7856
|
let { colorScheme, badge } = props;
|
|
8215
7857
|
if (appearance === "dangerous") {
|
|
8216
|
-
if ((0,
|
|
7858
|
+
if ((0, import_type_guards24.isNotUndefined)(colorScheme)) {
|
|
8217
7859
|
console.warn("colorScheme prop is ignored when appearance is dangerous");
|
|
8218
7860
|
}
|
|
8219
7861
|
colorScheme = "error";
|
|
@@ -8243,7 +7885,7 @@ var MenuItemButton = (0, import_react33.forwardRef)(({ children, appearance, com
|
|
|
8243
7885
|
children: [
|
|
8244
7886
|
props.leftIcon ? /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(StyledLeftIconContainer, { children: props.leftIcon }) : null,
|
|
8245
7887
|
/* @__PURE__ */ (0, import_jsx_runtime189.jsx)(StyledLabelAndDescriptionContainer, { children }),
|
|
8246
|
-
(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,
|
|
8247
7889
|
props.rightIcon ? /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(StyledRightIconContainer, { children: props.rightIcon }) : null
|
|
8248
7890
|
]
|
|
8249
7891
|
}
|
|
@@ -8310,7 +7952,7 @@ var SubMenu = ({
|
|
|
8310
7952
|
return isSmAndUp ? /* @__PURE__ */ (0, import_jsx_runtime191.jsxs)(import_react_dropdown_menu3.DropdownMenuSub, { onOpenChange, children: [
|
|
8311
7953
|
/* @__PURE__ */ (0, import_jsx_runtime191.jsxs)(SubMenuTrigger, { ...props, children: [
|
|
8312
7954
|
/* @__PURE__ */ (0, import_jsx_runtime191.jsx)(MenuItemLabel, { children: label }),
|
|
8313
|
-
(0,
|
|
7955
|
+
(0, import_type_guards25.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(MenuItemDescription, { children: description }) : null
|
|
8314
7956
|
] }),
|
|
8315
7957
|
/* @__PURE__ */ (0, import_jsx_runtime191.jsx)(import_react_dropdown_menu3.DropdownMenuPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(SubMenuContent, { $compact: compact, children }) })
|
|
8316
7958
|
] }) : /* @__PURE__ */ (0, import_jsx_runtime191.jsxs)(import_react_dropdown_menu3.DropdownMenuGroup, { children: [
|
|
@@ -8490,7 +8132,7 @@ CheckboxMenuItem.displayName = "CheckboxMenuItem";
|
|
|
8490
8132
|
var import_react39 = require("react");
|
|
8491
8133
|
var import_styled_components52 = __toESM(require("styled-components"));
|
|
8492
8134
|
var import_react_dialog4 = require("@radix-ui/react-dialog");
|
|
8493
|
-
var
|
|
8135
|
+
var import_type_guards28 = require("@wistia/type-guards");
|
|
8494
8136
|
|
|
8495
8137
|
// src/components/Modal/ModalHeader.tsx
|
|
8496
8138
|
var import_styled_components49 = __toESM(require("styled-components"));
|
|
@@ -8517,7 +8159,7 @@ var ModalCloseButton = () => {
|
|
|
8517
8159
|
|
|
8518
8160
|
// src/components/ScreenReaderOnly/ScreenReaderOnly.tsx
|
|
8519
8161
|
var import_styled_components48 = __toESM(require("styled-components"));
|
|
8520
|
-
var
|
|
8162
|
+
var import_type_guards26 = require("@wistia/type-guards");
|
|
8521
8163
|
var import_jsx_runtime197 = require("react/jsx-runtime");
|
|
8522
8164
|
var VisuallyHidden = import_styled_components48.default.div({ ...visuallyHiddenStyle });
|
|
8523
8165
|
var VisuallyHiddenButFocusable = import_styled_components48.default.div({
|
|
@@ -8529,7 +8171,7 @@ var ScreenReaderOnly = ({
|
|
|
8529
8171
|
focusable = false,
|
|
8530
8172
|
...otherProps
|
|
8531
8173
|
}) => {
|
|
8532
|
-
const accessibleText = (0,
|
|
8174
|
+
const accessibleText = (0, import_type_guards26.isNotNil)(text) ? text : children;
|
|
8533
8175
|
if (focusable) {
|
|
8534
8176
|
return /* @__PURE__ */ (0, import_jsx_runtime197.jsx)(VisuallyHiddenButFocusable, { ...otherProps, children: accessibleText });
|
|
8535
8177
|
}
|
|
@@ -8576,7 +8218,7 @@ var import_react_dialog3 = require("@radix-ui/react-dialog");
|
|
|
8576
8218
|
|
|
8577
8219
|
// src/private/hooks/useFocusRestore/useFocusRestore.ts
|
|
8578
8220
|
var import_react36 = require("react");
|
|
8579
|
-
var
|
|
8221
|
+
var import_type_guards27 = require("@wistia/type-guards");
|
|
8580
8222
|
var useFocusRestore = () => {
|
|
8581
8223
|
const previouslyFocusedRef = (0, import_react36.useRef)(null);
|
|
8582
8224
|
(0, import_react36.useEffect)(() => {
|
|
@@ -8584,7 +8226,7 @@ var useFocusRestore = () => {
|
|
|
8584
8226
|
}, []);
|
|
8585
8227
|
(0, import_react36.useEffect)(() => {
|
|
8586
8228
|
return () => {
|
|
8587
|
-
if ((0,
|
|
8229
|
+
if ((0, import_type_guards27.isNotNil)(previouslyFocusedRef.current)) {
|
|
8588
8230
|
setTimeout(() => {
|
|
8589
8231
|
previouslyFocusedRef.current?.focus();
|
|
8590
8232
|
}, 0);
|
|
@@ -8729,7 +8371,7 @@ var Modal = (0, import_react39.forwardRef)(
|
|
|
8729
8371
|
import_react_dialog4.Root,
|
|
8730
8372
|
{
|
|
8731
8373
|
onOpenChange: (open2) => {
|
|
8732
|
-
if (!open2 && (0,
|
|
8374
|
+
if (!open2 && (0, import_type_guards28.isNotNil)(onRequestClose)) {
|
|
8733
8375
|
onRequestClose();
|
|
8734
8376
|
}
|
|
8735
8377
|
},
|
|
@@ -8742,7 +8384,7 @@ var Modal = (0, import_react39.forwardRef)(
|
|
|
8742
8384
|
ref,
|
|
8743
8385
|
fullHeight,
|
|
8744
8386
|
onOpenAutoFocus: (event) => {
|
|
8745
|
-
if ((0,
|
|
8387
|
+
if ((0, import_type_guards28.isNotNil)(initialFocusRef) && initialFocusRef.current) {
|
|
8746
8388
|
event.preventDefault();
|
|
8747
8389
|
requestAnimationFrame(() => {
|
|
8748
8390
|
initialFocusRef.current?.focus();
|
|
@@ -8774,7 +8416,7 @@ Modal.displayName = "Modal";
|
|
|
8774
8416
|
// src/components/Radio/Radio.tsx
|
|
8775
8417
|
var import_react40 = require("react");
|
|
8776
8418
|
var import_styled_components53 = __toESM(require("styled-components"));
|
|
8777
|
-
var
|
|
8419
|
+
var import_type_guards29 = require("@wistia/type-guards");
|
|
8778
8420
|
var import_jsx_runtime202 = require("react/jsx-runtime");
|
|
8779
8421
|
var StyledLabelWrapper2 = import_styled_components53.default.div`
|
|
8780
8422
|
display: flex;
|
|
@@ -8860,7 +8502,7 @@ var Radio = (0, import_react40.forwardRef)(
|
|
|
8860
8502
|
...otherProps
|
|
8861
8503
|
}, ref) => {
|
|
8862
8504
|
const generatedId = (0, import_react40.useId)();
|
|
8863
|
-
const computedId = (0,
|
|
8505
|
+
const computedId = (0, import_type_guards29.isNonEmptyString)(id) ? id : `ui-radio-${generatedId}`;
|
|
8864
8506
|
return /* @__PURE__ */ (0, import_jsx_runtime202.jsxs)(
|
|
8865
8507
|
StyledRadioWrapper,
|
|
8866
8508
|
{
|
|
@@ -8905,7 +8547,7 @@ Radio.displayName = "Radio";
|
|
|
8905
8547
|
var import_react41 = require("react");
|
|
8906
8548
|
var import_styled_components54 = __toESM(require("styled-components"));
|
|
8907
8549
|
var import_react_toggle_group = require("@radix-ui/react-toggle-group");
|
|
8908
|
-
var
|
|
8550
|
+
var import_type_guards30 = require("@wistia/type-guards");
|
|
8909
8551
|
var import_jsx_runtime203 = require("react/jsx-runtime");
|
|
8910
8552
|
var StyledSegmentedControl = (0, import_styled_components54.default)(import_react_toggle_group.Root)`
|
|
8911
8553
|
display: inline-flex;
|
|
@@ -8924,7 +8566,7 @@ var SegmentedControl = (0, import_react41.forwardRef)(
|
|
|
8924
8566
|
onSelectedValueChange,
|
|
8925
8567
|
...props
|
|
8926
8568
|
}, ref) => {
|
|
8927
|
-
if ((0,
|
|
8569
|
+
if ((0, import_type_guards30.isNil)(children)) {
|
|
8928
8570
|
return null;
|
|
8929
8571
|
}
|
|
8930
8572
|
return /* @__PURE__ */ (0, import_jsx_runtime203.jsx)(
|
|
@@ -8950,7 +8592,7 @@ SegmentedControl.displayName = "SegmentedControl";
|
|
|
8950
8592
|
var import_react42 = require("react");
|
|
8951
8593
|
var import_styled_components55 = __toESM(require("styled-components"));
|
|
8952
8594
|
var import_react_toggle_group2 = require("@radix-ui/react-toggle-group");
|
|
8953
|
-
var
|
|
8595
|
+
var import_type_guards31 = require("@wistia/type-guards");
|
|
8954
8596
|
var import_jsx_runtime204 = require("react/jsx-runtime");
|
|
8955
8597
|
var StyledSegmentedControlItem = (0, import_styled_components55.default)(import_react_toggle_group2.Item)`
|
|
8956
8598
|
all: unset; /* ToggleGroupItem is a button element */
|
|
@@ -9017,8 +8659,8 @@ var SegmentedControlItem = (0, import_react42.forwardRef)(
|
|
|
9017
8659
|
StyledSegmentedControlItem,
|
|
9018
8660
|
{
|
|
9019
8661
|
ref,
|
|
9020
|
-
$hasLabel: (0,
|
|
9021
|
-
"aria-label": (0,
|
|
8662
|
+
$hasLabel: (0, import_type_guards31.isNotNil)(label),
|
|
8663
|
+
"aria-label": (0, import_type_guards31.isNotNil)(label) ? void 0 : ariaLabel,
|
|
9022
8664
|
disabled,
|
|
9023
8665
|
onClick: handleClick,
|
|
9024
8666
|
value,
|
|
@@ -9035,7 +8677,7 @@ SegmentedControlItem.displayName = "SegmentedControlItem";
|
|
|
9035
8677
|
// src/components/Tag/Tag.tsx
|
|
9036
8678
|
var import_react43 = require("react");
|
|
9037
8679
|
var import_styled_components56 = __toESM(require("styled-components"));
|
|
9038
|
-
var
|
|
8680
|
+
var import_type_guards32 = require("@wistia/type-guards");
|
|
9039
8681
|
var import_jsx_runtime205 = require("react/jsx-runtime");
|
|
9040
8682
|
var TagLabel = import_styled_components56.default.a`
|
|
9041
8683
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
@@ -9113,10 +8755,10 @@ var StyledTag = import_styled_components56.default.div`
|
|
|
9113
8755
|
}
|
|
9114
8756
|
`;
|
|
9115
8757
|
var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
|
|
9116
|
-
if ((0,
|
|
8758
|
+
if ((0, import_type_guards32.isNil)(onClickRemove)) {
|
|
9117
8759
|
return null;
|
|
9118
8760
|
}
|
|
9119
|
-
if ((0,
|
|
8761
|
+
if ((0, import_type_guards32.isNil)(onClickRemoveLabel)) {
|
|
9120
8762
|
throw new Error(
|
|
9121
8763
|
"for accessibility, onClickRemoveLabel must be provided if onClickRemove is provided"
|
|
9122
8764
|
);
|
|
@@ -9145,7 +8787,7 @@ var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
|
|
|
9145
8787
|
};
|
|
9146
8788
|
var Tag = (0, import_react43.forwardRef)(
|
|
9147
8789
|
({ onClickRemove, colorScheme = "inherit", href, label, onClickRemoveLabel, ...otherProps }, ref) => {
|
|
9148
|
-
const labelProps = (0,
|
|
8790
|
+
const labelProps = (0, import_type_guards32.isNotNil)(href) && (0, import_type_guards32.isNonEmptyString)(href) ? { href, as: "a" } : { as: "span" };
|
|
9149
8791
|
return /* @__PURE__ */ (0, import_jsx_runtime205.jsxs)(
|
|
9150
8792
|
StyledTag,
|
|
9151
8793
|
{
|
|
@@ -9283,7 +8925,7 @@ Tooltip.displayName = "Tooltip";
|
|
|
9283
8925
|
|
|
9284
8926
|
// src/components/WistiaLogo/WistiaLogo.tsx
|
|
9285
8927
|
var import_styled_components58 = __toESM(require("styled-components"));
|
|
9286
|
-
var
|
|
8928
|
+
var import_type_guards33 = require("@wistia/type-guards");
|
|
9287
8929
|
var import_jsx_runtime207 = require("react/jsx-runtime");
|
|
9288
8930
|
var renderBrandmark = (brandmarkColor, iconOnly) => {
|
|
9289
8931
|
if (iconOnly) {
|
|
@@ -9377,7 +9019,7 @@ var WistiaLogo = ({
|
|
|
9377
9019
|
...otherProps,
|
|
9378
9020
|
children: [
|
|
9379
9021
|
/* @__PURE__ */ (0, import_jsx_runtime207.jsx)("title", { children: title }),
|
|
9380
|
-
(0,
|
|
9022
|
+
(0, import_type_guards33.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime207.jsx)("desc", { children: description }) : null,
|
|
9381
9023
|
renderBrandmark(brandmarkColor, iconOnly),
|
|
9382
9024
|
renderLogotype(logotypeColor, iconOnly)
|
|
9383
9025
|
]
|
|
@@ -9573,7 +9215,7 @@ var SelectOptionGroup = ({ children, label, ...props }) => {
|
|
|
9573
9215
|
|
|
9574
9216
|
// src/components/DataCards/DataCard.tsx
|
|
9575
9217
|
var import_styled_components62 = __toESM(require("styled-components"));
|
|
9576
|
-
var
|
|
9218
|
+
var import_type_guards34 = require("@wistia/type-guards");
|
|
9577
9219
|
var import_jsx_runtime211 = require("react/jsx-runtime");
|
|
9578
9220
|
var StyledDataCard = import_styled_components62.default.div`
|
|
9579
9221
|
${({ $colorScheme }) => getColorScheme($colorScheme)}
|
|
@@ -9662,8 +9304,8 @@ var DataCard = ({
|
|
|
9662
9304
|
children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(StyledLoadingValue, {}) : value
|
|
9663
9305
|
}
|
|
9664
9306
|
),
|
|
9665
|
-
(0,
|
|
9666
|
-
(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 })
|
|
9667
9309
|
]
|
|
9668
9310
|
}
|
|
9669
9311
|
);
|
|
@@ -9671,13 +9313,13 @@ DataCard.displayName = "DataCard";
|
|
|
9671
9313
|
|
|
9672
9314
|
// src/components/DataCards/DataCards.tsx
|
|
9673
9315
|
var import_styled_components63 = __toESM(require("styled-components"));
|
|
9674
|
-
var
|
|
9316
|
+
var import_type_guards35 = require("@wistia/type-guards");
|
|
9675
9317
|
var import_jsx_runtime212 = require("react/jsx-runtime");
|
|
9676
9318
|
var StyledDataCards = (0, import_styled_components63.default)(Box)`
|
|
9677
9319
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
9678
9320
|
> * {
|
|
9679
9321
|
min-width: 120px;
|
|
9680
|
-
max-width: ${({ $cardMaxWidth }) => (0,
|
|
9322
|
+
max-width: ${({ $cardMaxWidth }) => (0, import_type_guards35.isNotUndefined)($cardMaxWidth) ? `${$cardMaxWidth}px` : "none"};
|
|
9681
9323
|
}
|
|
9682
9324
|
`;
|
|
9683
9325
|
var DataCards = ({
|
|
@@ -9795,7 +9437,6 @@ var DataCardTrend = ({
|
|
|
9795
9437
|
WistiaLogo,
|
|
9796
9438
|
colorSchemeOptions,
|
|
9797
9439
|
copyToClipboard,
|
|
9798
|
-
dateTime,
|
|
9799
9440
|
ellipsisFlexParentStyle,
|
|
9800
9441
|
ellipsisStyle,
|
|
9801
9442
|
iconSizeMap,
|