analytica-frontend-lib 1.1.77 → 1.1.78
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/NotificationCard/index.js +23 -0
- package/dist/NotificationCard/index.js.map +1 -1
- package/dist/NotificationCard/index.mjs +23 -0
- package/dist/NotificationCard/index.mjs.map +1 -1
- package/dist/VideoPlayer/index.js +262 -118
- package/dist/VideoPlayer/index.js.map +1 -1
- package/dist/VideoPlayer/index.mjs +233 -89
- package/dist/VideoPlayer/index.mjs.map +1 -1
- package/dist/hooks/useMobile/index.d.mts +5 -0
- package/dist/hooks/useMobile/index.d.ts +5 -0
- package/dist/hooks/useMobile/index.js +23 -0
- package/dist/hooks/useMobile/index.js.map +1 -1
- package/dist/hooks/useMobile/index.mjs +23 -0
- package/dist/hooks/useMobile/index.mjs.map +1 -1
- package/dist/index.css +38 -0
- package/dist/index.css.map +1 -1
- package/dist/index.js +153 -66
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +153 -66
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +38 -0
- package/dist/styles.css.map +1 -1
- package/package.json +1 -1
|
@@ -1362,6 +1362,10 @@ var Badge_default = Badge;
|
|
|
1362
1362
|
import { useState as useState3, useEffect as useEffect5 } from "react";
|
|
1363
1363
|
var MOBILE_WIDTH = 500;
|
|
1364
1364
|
var TABLET_WIDTH = 931;
|
|
1365
|
+
var SMALL_MOBILE_WIDTH = 425;
|
|
1366
|
+
var EXTRA_SMALL_MOBILE_WIDTH = 375;
|
|
1367
|
+
var ULTRA_SMALL_MOBILE_WIDTH = 375;
|
|
1368
|
+
var TINY_MOBILE_WIDTH = 320;
|
|
1365
1369
|
var DEFAULT_WIDTH = 1200;
|
|
1366
1370
|
var getWindowWidth = () => {
|
|
1367
1371
|
if (typeof window === "undefined") {
|
|
@@ -1376,11 +1380,19 @@ var getDeviceType = () => {
|
|
|
1376
1380
|
var useMobile = () => {
|
|
1377
1381
|
const [isMobile, setIsMobile] = useState3(false);
|
|
1378
1382
|
const [isTablet, setIsTablet] = useState3(false);
|
|
1383
|
+
const [isSmallMobile, setIsSmallMobile] = useState3(false);
|
|
1384
|
+
const [isExtraSmallMobile, setIsExtraSmallMobile] = useState3(false);
|
|
1385
|
+
const [isUltraSmallMobile, setIsUltraSmallMobile] = useState3(false);
|
|
1386
|
+
const [isTinyMobile, setIsTinyMobile] = useState3(false);
|
|
1379
1387
|
useEffect5(() => {
|
|
1380
1388
|
const checkScreenSize = () => {
|
|
1381
1389
|
const width = getWindowWidth();
|
|
1382
1390
|
setIsMobile(width < MOBILE_WIDTH);
|
|
1383
1391
|
setIsTablet(width < TABLET_WIDTH);
|
|
1392
|
+
setIsSmallMobile(width < SMALL_MOBILE_WIDTH);
|
|
1393
|
+
setIsExtraSmallMobile(width < EXTRA_SMALL_MOBILE_WIDTH);
|
|
1394
|
+
setIsUltraSmallMobile(width < ULTRA_SMALL_MOBILE_WIDTH);
|
|
1395
|
+
setIsTinyMobile(width < TINY_MOBILE_WIDTH);
|
|
1384
1396
|
};
|
|
1385
1397
|
checkScreenSize();
|
|
1386
1398
|
window.addEventListener("resize", checkScreenSize);
|
|
@@ -1404,13 +1416,24 @@ var useMobile = () => {
|
|
|
1404
1416
|
const getHeaderClasses = () => {
|
|
1405
1417
|
return isMobile ? getMobileHeaderClasses() : getDesktopHeaderClasses();
|
|
1406
1418
|
};
|
|
1419
|
+
const getVideoContainerClasses = () => {
|
|
1420
|
+
if (isTinyMobile) return "aspect-square";
|
|
1421
|
+
if (isExtraSmallMobile) return "aspect-[4/3]";
|
|
1422
|
+
if (isSmallMobile) return "aspect-[16/12]";
|
|
1423
|
+
return "aspect-video";
|
|
1424
|
+
};
|
|
1407
1425
|
return {
|
|
1408
1426
|
isMobile,
|
|
1409
1427
|
isTablet,
|
|
1428
|
+
isSmallMobile,
|
|
1429
|
+
isExtraSmallMobile,
|
|
1430
|
+
isUltraSmallMobile,
|
|
1431
|
+
isTinyMobile,
|
|
1410
1432
|
getFormContainerClasses,
|
|
1411
1433
|
getHeaderClasses,
|
|
1412
1434
|
getMobileHeaderClasses,
|
|
1413
1435
|
getDesktopHeaderClasses,
|
|
1436
|
+
getVideoContainerClasses,
|
|
1414
1437
|
getDeviceType
|
|
1415
1438
|
};
|
|
1416
1439
|
};
|