@measured/puck 0.21.0-canary.e9d5c0ea → 0.21.0-canary.ec77dd9f

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.css CHANGED
@@ -1345,6 +1345,168 @@ body:has(._DropZone--isAnimating_1i2sv_68:empty) [data-puck-overlay] {
1345
1345
  display: none;
1346
1346
  }
1347
1347
 
1348
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/SidebarSection/styles.module.css/#css-module-data */
1349
+ ._SidebarSection_8boj8_1 {
1350
+ display: flex;
1351
+ position: relative;
1352
+ flex-direction: column;
1353
+ color: var(--puck-color-black);
1354
+ }
1355
+ ._SidebarSection_8boj8_1:last-of-type {
1356
+ flex-grow: 1;
1357
+ }
1358
+ ._SidebarSection-title_8boj8_12 {
1359
+ background: var(--puck-color-white);
1360
+ padding: 16px;
1361
+ border-bottom: 1px solid var(--puck-color-grey-09);
1362
+ border-top: 1px solid var(--puck-color-grey-09);
1363
+ overflow-x: auto;
1364
+ }
1365
+ ._SidebarSection--noBorderTop_8boj8_20 > ._SidebarSection-title_8boj8_12 {
1366
+ border-top: 0px;
1367
+ }
1368
+ ._SidebarSection-content_8boj8_24 {
1369
+ padding: 16px;
1370
+ }
1371
+ ._SidebarSection--noPadding_8boj8_28 > ._SidebarSection-content_8boj8_24 {
1372
+ padding: 0px;
1373
+ }
1374
+ ._SidebarSection--noPadding_8boj8_28 > ._SidebarSection-content_8boj8_24:last-child {
1375
+ padding-bottom: 4px;
1376
+ }
1377
+ ._SidebarSection_8boj8_1:last-of-type ._SidebarSection-content_8boj8_24 {
1378
+ border-bottom: none;
1379
+ flex-grow: 1;
1380
+ }
1381
+ ._SidebarSection-breadcrumbLabel_8boj8_41 {
1382
+ background: none;
1383
+ border: 0;
1384
+ border-radius: 2px;
1385
+ color: var(--puck-color-azure-04);
1386
+ cursor: pointer;
1387
+ font: inherit;
1388
+ flex-shrink: 0;
1389
+ padding: 0;
1390
+ transition: color 50ms ease-in;
1391
+ }
1392
+ ._SidebarSection-breadcrumbLabel_8boj8_41:focus-visible {
1393
+ outline: 2px solid var(--puck-color-azure-05);
1394
+ outline-offset: 2px;
1395
+ }
1396
+ @media (hover: hover) and (pointer: fine) {
1397
+ ._SidebarSection-breadcrumbLabel_8boj8_41:hover {
1398
+ color: var(--puck-color-azure-03);
1399
+ transition: none;
1400
+ }
1401
+ }
1402
+ ._SidebarSection-breadcrumbLabel_8boj8_41:active {
1403
+ color: var(--puck-color-azure-02);
1404
+ transition: none;
1405
+ }
1406
+ ._SidebarSection-breadcrumbs_8boj8_70 {
1407
+ align-items: center;
1408
+ display: flex;
1409
+ gap: 4px;
1410
+ }
1411
+ ._SidebarSection-breadcrumb_8boj8_41 {
1412
+ align-items: center;
1413
+ display: flex;
1414
+ gap: 4px;
1415
+ }
1416
+ ._SidebarSection-heading_8boj8_82 {
1417
+ padding-inline-end: 16px;
1418
+ }
1419
+ ._SidebarSection-loadingOverlay_8boj8_86 {
1420
+ background: var(--puck-color-white);
1421
+ display: flex;
1422
+ justify-content: center;
1423
+ align-items: center;
1424
+ height: 100%;
1425
+ width: 100%;
1426
+ top: 0;
1427
+ position: absolute;
1428
+ z-index: 1;
1429
+ pointer-events: all;
1430
+ box-sizing: border-box;
1431
+ opacity: 0.8;
1432
+ }
1433
+
1434
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/styles.module.css/#css-module-data */
1435
+ ._Puck_1yxlw_19 {
1436
+ --puck-space-px: 16px;
1437
+ font-family: var(--puck-font-family);
1438
+ overflow-x: hidden;
1439
+ }
1440
+ @media (min-width: 766px) {
1441
+ ._Puck_1yxlw_19 {
1442
+ overflow-x: auto;
1443
+ }
1444
+ }
1445
+ ._Puck-portal_1yxlw_31 {
1446
+ position: relative;
1447
+ z-index: 2;
1448
+ }
1449
+ ._PuckLayout-inner_1yxlw_38 {
1450
+ --puck-frame-width: auto;
1451
+ --puck-side-bar-width: 0px;
1452
+ --puck-left-side-bar-width: var( --puck-user-left-side-bar-width, var(--puck-side-bar-width) );
1453
+ --puck-right-side-bar-width: var( --puck-user-right-side-bar-width, var(--puck-side-bar-width) );
1454
+ display: grid;
1455
+ grid-template-areas: "header header header" "left editor right";
1456
+ grid-template-columns: 0 var(--puck-frame-width) 0;
1457
+ grid-template-rows: min-content auto;
1458
+ height: 100dvh;
1459
+ position: relative;
1460
+ z-index: 0;
1461
+ }
1462
+ ._PuckLayout--mounted_1yxlw_59 ._PuckLayout-inner_1yxlw_38 {
1463
+ --puck-side-bar-width: 186px;
1464
+ }
1465
+ ._PuckLayout--leftSideBarVisible_1yxlw_63 ._PuckLayout-inner_1yxlw_38 {
1466
+ grid-template-columns: var(--puck-left-side-bar-width) var(--puck-frame-width) 0;
1467
+ }
1468
+ ._PuckLayout--rightSideBarVisible_1yxlw_69 ._PuckLayout-inner_1yxlw_38 {
1469
+ grid-template-columns: 0 var(--puck-frame-width) var(--puck-right-side-bar-width);
1470
+ }
1471
+ ._PuckLayout--leftSideBarVisible_1yxlw_63._PuckLayout--rightSideBarVisible_1yxlw_69 ._PuckLayout-inner_1yxlw_38 {
1472
+ grid-template-columns: var(--puck-left-side-bar-width) var(--puck-frame-width) var(--puck-right-side-bar-width);
1473
+ }
1474
+ @media (min-width: 458px) {
1475
+ ._PuckLayout-mounted_1yxlw_83 ._PuckLayout-inner_1yxlw_38 {
1476
+ --puck-frame-width: minmax(266px, auto);
1477
+ }
1478
+ }
1479
+ @media (min-width: 638px) {
1480
+ ._PuckLayout_1yxlw_38 ._PuckLayout-inner_1yxlw_38 {
1481
+ --puck-side-bar-width: minmax(186px, 250px);
1482
+ }
1483
+ }
1484
+ @media (min-width: 766px) {
1485
+ ._PuckLayout_1yxlw_38 ._PuckLayout-inner_1yxlw_38 {
1486
+ --puck-frame-width: auto;
1487
+ }
1488
+ }
1489
+ @media (min-width: 990px) {
1490
+ ._PuckLayout_1yxlw_38 ._PuckLayout-inner_1yxlw_38 {
1491
+ --puck-side-bar-width: 256px;
1492
+ }
1493
+ }
1494
+ @media (min-width: 1198px) {
1495
+ ._PuckLayout_1yxlw_38 ._PuckLayout-inner_1yxlw_38 {
1496
+ --puck-side-bar-width: 274px;
1497
+ }
1498
+ }
1499
+ @media (min-width: 1398px) {
1500
+ ._PuckLayout_1yxlw_38 ._PuckLayout-inner_1yxlw_38 {
1501
+ --puck-side-bar-width: 290px;
1502
+ }
1503
+ }
1504
+ @media (min-width: 1598px) {
1505
+ ._PuckLayout_1yxlw_38 ._PuckLayout-inner_1yxlw_38 {
1506
+ --puck-side-bar-width: 320px;
1507
+ }
1508
+ }
1509
+
1348
1510
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Fields/styles.module.css/#css-module-data */
1349
1511
  ._PuckFields_10bh7_1 {
1350
1512
  position: relative;
@@ -1436,14 +1598,6 @@ body:has(._DropZone--isAnimating_1i2sv_68:empty) [data-puck-overlay] {
1436
1598
  margin-inline-start: auto;
1437
1599
  }
1438
1600
 
1439
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Components/styles.module.css/#css-module-data */
1440
- ._Components_3pbdy_1 {
1441
- padding: 16px;
1442
- height: 100%;
1443
- overflow-y: auto;
1444
- box-sizing: border-box;
1445
- }
1446
-
1447
1601
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Preview/styles.module.css/#css-module-data */
1448
1602
  ._PuckPreview_z2rgu_1 {
1449
1603
  position: relative;
@@ -1558,167 +1712,111 @@ body:has(._DropZone--isAnimating_1i2sv_68:empty) [data-puck-overlay] {
1558
1712
  margin-top: 4px;
1559
1713
  }
1560
1714
 
1561
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Outline/styles.module.css/#css-module-data */
1562
- ._Outline_cvjlj_1 {
1563
- padding: 16px;
1564
- height: 100%;
1565
- overflow-y: auto;
1715
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/ViewportControls/styles.module.css/#css-module-data */
1716
+ ._ViewportControls_gejzr_1 {
1717
+ display: flex;
1718
+ background: var(--puck-color-grey-11);
1566
1719
  box-sizing: border-box;
1720
+ border-inline-start: 2px solid var(--puck-color-grey-11);
1721
+ justify-content: center;
1722
+ gap: 8px;
1723
+ min-width: 358px;
1724
+ padding-bottom: 16px;
1725
+ padding-inline-start: var(--puck-space-px);
1726
+ padding-inline-end: var(--puck-space-px);
1727
+ z-index: 1;
1567
1728
  }
1568
-
1569
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Layout/styles.module.css/#css-module-data */
1570
- ._Puck_hv23j_19 {
1571
- --puck-space-px: 16px;
1572
- font-family: var(--puck-font-family);
1573
- overflow-x: hidden;
1729
+ ._ViewportControls-divider_gejzr_15 {
1730
+ border-inline-end: 1px solid var(--puck-color-grey-09);
1731
+ margin-inline-start: 8px;
1732
+ margin-inline-end: 8px;
1574
1733
  }
1575
- @media (min-width: 766px) {
1576
- ._Puck_hv23j_19 {
1577
- overflow-x: auto;
1578
- }
1734
+ ._ViewportControls-zoomSelect_gejzr_21 {
1735
+ appearance: none;
1736
+ background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23c3c3c3'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat;
1737
+ background-size: 10px;
1738
+ background-position: calc(100% - 12px) calc(50% + 3px);
1739
+ background-repeat: no-repeat;
1740
+ border: 0;
1741
+ font-size: var(--puck-font-size-xxxs);
1742
+ padding: 0;
1743
+ width: 96px;
1579
1744
  }
1580
- ._Puck-portal_hv23j_31 {
1581
- position: relative;
1582
- z-index: 2;
1745
+ ._ViewportControls-zoomSelect_gejzr_21:dir(rtl) {
1746
+ background-position: 12px calc(50% + 3px);
1583
1747
  }
1584
- ._PuckLayout_hv23j_36 {
1585
- height: 100%;
1748
+ ._ViewportButton--isActive_gejzr_38 ._ViewportButton-inner_gejzr_38 {
1749
+ color: var(--puck-color-azure-04);
1586
1750
  }
1587
- ._PuckLayout-inner_hv23j_40 {
1588
- --puck-frame-width: auto;
1589
- --puck-side-nav-width: min-content;
1590
- --puck-side-bar-width: 0px;
1591
- --puck-left-side-bar-width: var( --puck-user-left-side-bar-width, var(--puck-side-bar-width) );
1592
- --puck-right-side-bar-width: var( --puck-user-right-side-bar-width, var(--puck-side-bar-width) );
1593
- background-color: var(--puck-color-grey-12);
1594
- display: grid;
1595
- grid-template-areas: "header" "editor" "left" "right" "sidenav";
1596
- grid-template-columns: var(--puck-frame-width);
1597
- grid-template-rows: min-content auto 0 0 var(--puck-side-nav-width);
1598
- height: 100%;
1599
- position: relative;
1600
- transition: grid-template-rows 150ms ease-in;
1601
- z-index: 0;
1602
- overflow: hidden;
1751
+
1752
+ /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Canvas/styles.module.css/#css-module-data */
1753
+ ._PuckCanvas_18jay_1 {
1754
+ background: var(--puck-color-grey-11);
1755
+ display: flex;
1756
+ grid-area: editor;
1757
+ flex-direction: column;
1758
+ padding: var(--puck-space-px);
1759
+ overflow: auto;
1603
1760
  }
1604
- @media (min-width: 638px) {
1605
- ._PuckLayout-inner_hv23j_40 {
1606
- --puck-side-nav-width: 68px;
1607
- grid-template-areas: "header header header header" "sidenav left editor right";
1608
- grid-template-columns: var(--puck-side-nav-width) 0 var(--puck-frame-width) 0;
1609
- grid-template-rows: min-content auto;
1761
+ @media (min-width: 1198px) {
1762
+ ._PuckCanvas_18jay_1 {
1763
+ padding: calc(var(--puck-space-px) * 1.5);
1764
+ padding-top: var(--puck-space-px);
1610
1765
  }
1611
- }
1612
- ._PuckLayout--mounted_hv23j_73 ._PuckLayout-inner_hv23j_40 {
1613
- --puck-side-bar-width: 186px;
1614
- }
1615
- ._PuckLayout--mobilePanelHeightToggle_hv23j_77._PuckLayout--leftSideBarVisible_hv23j_77 ._PuckLayout-inner_hv23j_40 {
1616
- grid-template-rows: 0 auto 30% 0 var(--puck-side-nav-width);
1617
- }
1618
- ._PuckLayout--mobilePanelHeightToggle_hv23j_77._PuckLayout--leftSideBarVisible_hv23j_77._PuckLayout--isExpanded_hv23j_83 ._PuckLayout-inner_hv23j_40 {
1619
- grid-template-rows: 0 auto 55% 0 var(--puck-side-nav-width);
1620
- }
1621
- @media (min-width: 638px) {
1622
- ._PuckLayout--mobilePanelHeightToggle_hv23j_77._PuckLayout--leftSideBarVisible_hv23j_77 ._PuckLayout-inner_hv23j_40 {
1623
- grid-template-columns: var(--puck-side-nav-width) var(--puck-left-side-bar-width) var( --puck-frame-width ) 0;
1624
- grid-template-rows: min-content auto;
1766
+ ._PuckCanvas_18jay_1:not(._PuckCanvas_18jay_1:has(._PuckCanvas-controls_18jay_16)) {
1767
+ padding-top: calc(var(--puck-space-px) * 1.5);
1625
1768
  }
1626
1769
  }
1627
- ._PuckLayout--mobilePanelHeightMinContent_hv23j_101._PuckLayout--leftSideBarVisible_hv23j_77 ._PuckLayout-inner_hv23j_40,
1628
- ._PuckLayout--mobilePanelHeightMinContent_hv23j_101._PuckLayout--leftSideBarVisible_hv23j_77._PuckLayout--isExpanded_hv23j_83 ._PuckLayout-inner_hv23j_40 {
1629
- grid-template-rows: 0 auto min-content 0 var(--puck-side-nav-width);
1630
- }
1631
- @media (min-width: 638px) {
1632
- ._PuckLayout--mobilePanelHeightToggle_hv23j_77._PuckLayout--leftSideBarVisible_hv23j_77 ._PuckLayout-inner_hv23j_40,
1633
- ._PuckLayout--mobilePanelHeightToggle_hv23j_77._PuckLayout--leftSideBarVisible_hv23j_77._PuckLayout--isExpanded_hv23j_83 ._PuckLayout-inner_hv23j_40,
1634
- ._PuckLayout--mobilePanelHeightMinContent_hv23j_101._PuckLayout--leftSideBarVisible_hv23j_77 ._PuckLayout-inner_hv23j_40,
1635
- ._PuckLayout--mobilePanelHeightMinContent_hv23j_101._PuckLayout--leftSideBarVisible_hv23j_77._PuckLayout--isExpanded_hv23j_83 ._PuckLayout-inner_hv23j_40 {
1636
- grid-template-columns: var(--puck-side-nav-width) var(--puck-left-side-bar-width) var( --puck-frame-width ) 0;
1637
- grid-template-rows: min-content auto;
1638
- }
1770
+ ._PuckCanvas-inner_18jay_21 {
1771
+ display: flex;
1772
+ height: 100%;
1773
+ justify-content: center;
1774
+ min-width: 358px;
1775
+ position: relative;
1776
+ width: 100%;
1639
1777
  }
1640
- @media (min-width: 638px) {
1641
- ._PuckLayout--rightSideBarVisible_hv23j_128 ._PuckLayout-inner_hv23j_40 {
1642
- grid-template-columns: var(--puck-side-nav-width) 0 var(--puck-frame-width) var(--puck-right-side-bar-width);
1643
- }
1778
+ ._PuckCanvas-root_18jay_30 {
1779
+ background: white;
1780
+ border: 1px solid var(--puck-color-grey-09);
1781
+ box-sizing: content-box;
1782
+ min-width: 321px;
1783
+ position: absolute;
1784
+ pointer-events: none;
1785
+ transform-origin: top;
1786
+ top: 0;
1787
+ bottom: 0;
1788
+ opacity: 0;
1644
1789
  }
1645
- @media (min-width: 638px) {
1646
- ._PuckLayout--leftSideBarVisible_hv23j_77._PuckLayout--rightSideBarVisible_hv23j_128 ._PuckLayout-inner_hv23j_40 {
1647
- grid-template-columns: var(--puck-side-nav-width) var(--puck-left-side-bar-width) var( --puck-frame-width ) var(--puck-right-side-bar-width);
1790
+ @media (min-width: 1198px) {
1791
+ ._PuckCanvas-root_18jay_30 {
1792
+ min-width: unset;
1648
1793
  }
1649
1794
  }
1650
- @media (min-width: 458px) {
1651
- ._PuckLayout-mounted_hv23j_147 ._PuckLayout-inner_hv23j_40 {
1652
- --puck-frame-width: minmax(266px, auto);
1795
+ @media (prefers-reduced-motion: reduce) {
1796
+ ._PuckCanvas-root_18jay_30 {
1797
+ transition: none !important;
1653
1798
  }
1654
1799
  }
1655
- @media (min-width: 638px) {
1656
- ._PuckLayout_hv23j_36 ._PuckLayout-inner_hv23j_40 {
1657
- --puck-side-bar-width: minmax(186px, 250px);
1658
- }
1800
+ ._PuckCanvas--ready_18jay_55 ._PuckCanvas-root_18jay_30 {
1801
+ pointer-events: unset;
1802
+ opacity: 1;
1659
1803
  }
1660
- @media (min-width: 766px) {
1661
- ._PuckLayout_hv23j_36 ._PuckLayout-inner_hv23j_40 {
1662
- --puck-frame-width: auto;
1663
- }
1804
+ ._PuckCanvas-loader_18jay_60 {
1805
+ align-items: center;
1806
+ color: var(--puck-color-grey-06);
1807
+ display: flex;
1808
+ height: 100%;
1809
+ justify-content: center;
1810
+ transition: opacity 250ms ease-out;
1811
+ opacity: 0;
1664
1812
  }
1665
- @media (min-width: 990px) {
1666
- ._PuckLayout_hv23j_36 ._PuckLayout-inner_hv23j_40 {
1667
- --puck-side-bar-width: 256px;
1668
- }
1813
+ ._PuckCanvas--showLoader_18jay_70 ._PuckCanvas-loader_18jay_60 {
1814
+ opacity: 1;
1669
1815
  }
1670
- @media (min-width: 1198px) {
1671
- ._PuckLayout_hv23j_36 ._PuckLayout-inner_hv23j_40 {
1672
- --puck-side-bar-width: 274px;
1673
- }
1674
- }
1675
- @media (min-width: 1398px) {
1676
- ._PuckLayout_hv23j_36 ._PuckLayout-inner_hv23j_40 {
1677
- --puck-side-bar-width: 290px;
1678
- }
1679
- }
1680
- @media (min-width: 1598px) {
1681
- ._PuckLayout_hv23j_36 ._PuckLayout-inner_hv23j_40 {
1682
- --puck-side-bar-width: 320px;
1683
- }
1684
- }
1685
- ._PuckLayout-nav_hv23j_188 {
1686
- border-top: 1px solid var(--puck-color-grey-09);
1687
- background-color: var(--puck-color-grey-12);
1688
- grid-area: sidenav;
1689
- overflow: hidden;
1690
- width: 100%;
1691
- }
1692
- @media (min-width: 638px) {
1693
- ._PuckLayout-nav_hv23j_188 {
1694
- border-top: 0;
1695
- border-right: 1px solid var(--puck-color-grey-09);
1696
- box-sizing: border-box;
1697
- }
1698
- }
1699
- ._PuckLayout-header_hv23j_204 {
1700
- grid-area: header;
1701
- }
1702
- ._PuckLayout--leftSideBarVisible_hv23j_77 ._PuckLayout-header_hv23j_204 {
1703
- overflow: hidden;
1704
- }
1705
- @media (min-width: 638px) {
1706
- ._PuckLayout--leftSideBarVisible_hv23j_77 ._PuckLayout-header_hv23j_204 {
1707
- overflow: auto;
1708
- }
1709
- }
1710
- ._PuckPluginTab_hv23j_218 {
1711
- display: none;
1712
- flex-grow: 1;
1713
- overflow: hidden;
1714
- }
1715
- ._PuckPluginTab--visible_hv23j_224 {
1716
- display: flex;
1717
- flex-direction: column;
1718
- }
1719
- ._PuckPluginTab-body_hv23j_229 {
1720
- flex-grow: 1;
1721
- overflow: hidden;
1816
+ ._PuckCanvas--showLoader_18jay_70._PuckCanvas--ready_18jay_55 ._PuckCanvas-loader_18jay_60 {
1817
+ opacity: 0;
1818
+ height: 0;
1819
+ transition: none;
1722
1820
  }
1723
1821
 
1724
1822
  /* css-module:/home/runner/work/puck/puck/packages/core/components/MenuBar/styles.module.css/#css-module-data */
@@ -1766,7 +1864,7 @@ body:has(._DropZone--isAnimating_1i2sv_68:empty) [data-puck-overlay] {
1766
1864
  }
1767
1865
 
1768
1866
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Header/styles.module.css/#css-module-data */
1769
- ._PuckHeader_1bhmt_1 {
1867
+ ._PuckHeader_15xnq_1 {
1770
1868
  background: var(--puck-color-white);
1771
1869
  border-bottom: 1px solid var(--puck-color-grey-09);
1772
1870
  color: var(--puck-color-black);
@@ -1774,12 +1872,7 @@ body:has(._DropZone--isAnimating_1i2sv_68:empty) [data-puck-overlay] {
1774
1872
  position: relative;
1775
1873
  max-width: 100vw;
1776
1874
  }
1777
- @media (min-width: 638px) {
1778
- ._PuckHeader_1bhmt_1 {
1779
- padding-left: 67px;
1780
- }
1781
- }
1782
- ._PuckHeader-inner_1bhmt_16 {
1875
+ ._PuckHeader-inner_15xnq_10 {
1783
1876
  align-items: end;
1784
1877
  display: grid;
1785
1878
  gap: var(--puck-space-px);
@@ -1788,372 +1881,43 @@ body:has(._DropZone--isAnimating_1i2sv_68:empty) [data-puck-overlay] {
1788
1881
  grid-template-rows: auto;
1789
1882
  padding: var(--puck-space-px);
1790
1883
  }
1791
- @media (min-width: 638px) {
1792
- ._PuckHeader-inner_1bhmt_16 {
1793
- border-left: 1px solid var(--puck-color-grey-09);
1794
- }
1795
- }
1796
- ._PuckHeader-toggle_1bhmt_32 {
1884
+ ._PuckHeader-toggle_15xnq_20 {
1797
1885
  color: var(--puck-color-grey-05);
1798
1886
  display: flex;
1799
1887
  margin-inline-start: -4px;
1800
1888
  padding-top: 2px;
1801
1889
  }
1802
- ._PuckHeader--rightSideBarVisible_1bhmt_39 ._PuckHeader-rightSideBarToggle_1bhmt_39,
1803
- ._PuckHeader--leftSideBarVisible_1bhmt_40 ._PuckHeader-leftSideBarToggle_1bhmt_40 {
1890
+ ._PuckHeader--rightSideBarVisible_15xnq_27 ._PuckHeader-rightSideBarToggle_15xnq_27,
1891
+ ._PuckHeader--leftSideBarVisible_15xnq_28 ._PuckHeader-leftSideBarToggle_15xnq_28 {
1804
1892
  color: var(--puck-color-black);
1805
1893
  }
1806
- ._PuckHeader-rightSideBarToggle_1bhmt_39,
1807
- ._PuckHeader-leftSideBarToggle_1bhmt_40 {
1808
- display: none;
1809
- }
1810
- @media (min-width: 638px) {
1811
- ._PuckHeader-rightSideBarToggle_1bhmt_39,
1812
- ._PuckHeader-leftSideBarToggle_1bhmt_40 {
1813
- display: block;
1814
- }
1815
- }
1816
- ._PuckHeader-title_1bhmt_56 {
1894
+ ._PuckHeader-title_15xnq_32 {
1817
1895
  align-self: center;
1818
1896
  }
1819
- ._PuckHeader-path_1bhmt_60 {
1897
+ ._PuckHeader-path_15xnq_36 {
1820
1898
  font-family: var(--puck-font-family-monospaced);
1821
1899
  font-size: var(--puck-font-size-xxs);
1822
1900
  font-weight: normal;
1823
1901
  word-break: break-all;
1824
1902
  }
1825
- ._PuckHeader-tools_1bhmt_67 {
1903
+ ._PuckHeader-tools_15xnq_43 {
1826
1904
  display: flex;
1827
1905
  gap: 16px;
1828
1906
  justify-content: flex-end;
1829
1907
  }
1830
- ._PuckHeader-menuButton_1bhmt_73 {
1908
+ ._PuckHeader-menuButton_15xnq_49 {
1831
1909
  color: var(--puck-color-grey-05);
1832
1910
  margin-inline-start: -4px;
1833
1911
  }
1834
- ._PuckHeader--menuOpen_1bhmt_78 ._PuckHeader-menuButton_1bhmt_73 {
1912
+ ._PuckHeader--menuOpen_15xnq_54 ._PuckHeader-menuButton_15xnq_49 {
1835
1913
  color: var(--puck-color-black);
1836
1914
  }
1837
1915
  @media (min-width: 638px) {
1838
- ._PuckHeader-menuButton_1bhmt_73 {
1916
+ ._PuckHeader-menuButton_15xnq_49 {
1839
1917
  display: none;
1840
1918
  }
1841
1919
  }
1842
1920
 
1843
- /* css-module:/home/runner/work/puck/puck/packages/core/components/SidebarSection/styles.module.css/#css-module-data */
1844
- ._SidebarSection_8boj8_1 {
1845
- display: flex;
1846
- position: relative;
1847
- flex-direction: column;
1848
- color: var(--puck-color-black);
1849
- }
1850
- ._SidebarSection_8boj8_1:last-of-type {
1851
- flex-grow: 1;
1852
- }
1853
- ._SidebarSection-title_8boj8_12 {
1854
- background: var(--puck-color-white);
1855
- padding: 16px;
1856
- border-bottom: 1px solid var(--puck-color-grey-09);
1857
- border-top: 1px solid var(--puck-color-grey-09);
1858
- overflow-x: auto;
1859
- }
1860
- ._SidebarSection--noBorderTop_8boj8_20 > ._SidebarSection-title_8boj8_12 {
1861
- border-top: 0px;
1862
- }
1863
- ._SidebarSection-content_8boj8_24 {
1864
- padding: 16px;
1865
- }
1866
- ._SidebarSection--noPadding_8boj8_28 > ._SidebarSection-content_8boj8_24 {
1867
- padding: 0px;
1868
- }
1869
- ._SidebarSection--noPadding_8boj8_28 > ._SidebarSection-content_8boj8_24:last-child {
1870
- padding-bottom: 4px;
1871
- }
1872
- ._SidebarSection_8boj8_1:last-of-type ._SidebarSection-content_8boj8_24 {
1873
- border-bottom: none;
1874
- flex-grow: 1;
1875
- }
1876
- ._SidebarSection-breadcrumbLabel_8boj8_41 {
1877
- background: none;
1878
- border: 0;
1879
- border-radius: 2px;
1880
- color: var(--puck-color-azure-04);
1881
- cursor: pointer;
1882
- font: inherit;
1883
- flex-shrink: 0;
1884
- padding: 0;
1885
- transition: color 50ms ease-in;
1886
- }
1887
- ._SidebarSection-breadcrumbLabel_8boj8_41:focus-visible {
1888
- outline: 2px solid var(--puck-color-azure-05);
1889
- outline-offset: 2px;
1890
- }
1891
- @media (hover: hover) and (pointer: fine) {
1892
- ._SidebarSection-breadcrumbLabel_8boj8_41:hover {
1893
- color: var(--puck-color-azure-03);
1894
- transition: none;
1895
- }
1896
- }
1897
- ._SidebarSection-breadcrumbLabel_8boj8_41:active {
1898
- color: var(--puck-color-azure-02);
1899
- transition: none;
1900
- }
1901
- ._SidebarSection-breadcrumbs_8boj8_70 {
1902
- align-items: center;
1903
- display: flex;
1904
- gap: 4px;
1905
- }
1906
- ._SidebarSection-breadcrumb_8boj8_41 {
1907
- align-items: center;
1908
- display: flex;
1909
- gap: 4px;
1910
- }
1911
- ._SidebarSection-heading_8boj8_82 {
1912
- padding-inline-end: 16px;
1913
- }
1914
- ._SidebarSection-loadingOverlay_8boj8_86 {
1915
- background: var(--puck-color-white);
1916
- display: flex;
1917
- justify-content: center;
1918
- align-items: center;
1919
- height: 100%;
1920
- width: 100%;
1921
- top: 0;
1922
- position: absolute;
1923
- z-index: 1;
1924
- pointer-events: all;
1925
- box-sizing: border-box;
1926
- opacity: 0.8;
1927
- }
1928
-
1929
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Breadcrumbs/styles.module.css/#css-module-data */
1930
- ._Breadcrumbs_1c9yh_1 {
1931
- align-items: center;
1932
- display: flex;
1933
- gap: 4px;
1934
- }
1935
- ._Breadcrumbs-breadcrumbLabel_1c9yh_7 {
1936
- background: none;
1937
- border: 0;
1938
- border-radius: 2px;
1939
- color: var(--puck-color-azure-04);
1940
- cursor: pointer;
1941
- font: inherit;
1942
- flex-shrink: 0;
1943
- padding: 0;
1944
- transition: color 50ms ease-in;
1945
- }
1946
- ._Breadcrumbs-breadcrumbLabel_1c9yh_7:focus-visible {
1947
- outline: 2px solid var(--puck-color-azure-05);
1948
- outline-offset: 2px;
1949
- }
1950
- @media (hover: hover) and (pointer: fine) {
1951
- ._Breadcrumbs-breadcrumbLabel_1c9yh_7:hover {
1952
- color: var(--puck-color-azure-03);
1953
- transition: none;
1954
- }
1955
- }
1956
- ._Breadcrumbs-breadcrumbLabel_1c9yh_7:active {
1957
- color: var(--puck-color-azure-02);
1958
- transition: none;
1959
- }
1960
- ._Breadcrumbs-breadcrumb_1c9yh_7 {
1961
- align-items: center;
1962
- display: flex;
1963
- gap: 4px;
1964
- }
1965
-
1966
- /* css-module:/home/runner/work/puck/puck/packages/core/components/ViewportControls/styles.module.css/#css-module-data */
1967
- ._ViewportControls_e3unb_1 {
1968
- position: relative;
1969
- }
1970
- ._ViewportControls--fullScreen_e3unb_5 {
1971
- border-radius: 32px;
1972
- display: flex;
1973
- position: absolute;
1974
- bottom: 12px;
1975
- right: 12px;
1976
- overflow: hidden;
1977
- }
1978
- ._ViewportControls-toggleButton_e3unb_14 {
1979
- display: none;
1980
- }
1981
- ._ViewportControls--fullScreen_e3unb_5 ._ViewportControls-toggleButton_e3unb_14 {
1982
- align-items: center;
1983
- background-color: var(--puck-color-grey-02);
1984
- border: 1px solid var(--puck-color-grey-04);
1985
- border-radius: 30px;
1986
- cursor: pointer;
1987
- color: var(--puck-color-grey-11);
1988
- display: flex;
1989
- justify-content: center;
1990
- width: 42px;
1991
- height: 42px;
1992
- z-index: 1;
1993
- }
1994
- ._ViewportControls--fullScreen_e3unb_5 ._ViewportControls-toggleButton_e3unb_14:hover {
1995
- background-color: var(--puck-color-grey-02);
1996
- border: 1px solid var(--puck-color-azure-04);
1997
- color: var(--puck-color-azure-07);
1998
- }
1999
- ._ViewportControls--isExpanded_e3unb_38 ._ViewportControls-toggleButton_e3unb_14 {
2000
- background-color: var(--puck-color-grey-03);
2001
- }
2002
- ._ViewportControls-actions_e3unb_42 {
2003
- display: flex;
2004
- }
2005
- ._ViewportControls-actionsInner_e3unb_46 {
2006
- display: flex;
2007
- box-sizing: border-box;
2008
- justify-content: center;
2009
- margin-left: auto;
2010
- margin-right: auto;
2011
- z-index: 0;
2012
- overflow: hidden;
2013
- }
2014
- ._ViewportControls--fullScreen_e3unb_5 ._ViewportControls-actionsInner_e3unb_46 {
2015
- background: var(--puck-color-grey-11);
2016
- border: 1px solid var(--puck-color-grey-09);
2017
- border-radius: 30px;
2018
- margin-left: none;
2019
- margin-right: none;
2020
- padding-right: 42px;
2021
- }
2022
- ._ViewportControls--fullScreen_e3unb_5 ._ViewportControls-actionsInner_e3unb_46 {
2023
- transform: translateX(100%);
2024
- transition: transform 150ms ease-in-out;
2025
- }
2026
- ._ViewportControls--fullScreen_e3unb_5._ViewportControls--isExpanded_e3unb_38 ._ViewportControls-actionsInner_e3unb_46 {
2027
- transform: translateX(42px);
2028
- }
2029
- ._ViewportControls-divider_e3unb_75 {
2030
- border-inline-end: 1px solid var(--puck-color-grey-09);
2031
- margin-bottom: 8px;
2032
- margin-top: 8px;
2033
- }
2034
- ._ViewportControls-zoomSelect_e3unb_81 {
2035
- appearance: none;
2036
- background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23c3c3c3'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat;
2037
- background-size: 10px;
2038
- background-position: calc(100% - 12px) calc(50% + 3px);
2039
- background-repeat: no-repeat;
2040
- border: 0;
2041
- font-size: var(--puck-font-size-xxxs);
2042
- padding: 0;
2043
- padding-left: 8px;
2044
- width: 96px;
2045
- }
2046
- ._ViewportControls--fullScreen_e3unb_5 ._ViewportControls-zoom_e3unb_81 {
2047
- display: none;
2048
- }
2049
- @media (min-width: 638px) {
2050
- ._ViewportControls-zoom_e3unb_81,
2051
- ._ViewportControls--fullScreen_e3unb_5 ._ViewportControls-zoom_e3unb_81 {
2052
- display: flex;
2053
- justify-content: center;
2054
- }
2055
- }
2056
- ._ViewportControls-zoomSelect_e3unb_81:dir(rtl) {
2057
- background-position: 12px calc(50% + 3px);
2058
- }
2059
- ._ViewportButton-inner_e3unb_111 {
2060
- align-items: center;
2061
- display: flex;
2062
- justify-content: center;
2063
- height: 32px;
2064
- width: 32px;
2065
- }
2066
- ._ViewportButton--isActive_e3unb_119 ._ViewportButton-inner_e3unb_111 {
2067
- color: var(--puck-color-azure-04);
2068
- }
2069
-
2070
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Canvas/styles.module.css/#css-module-data */
2071
- ._PuckCanvas_t6s9b_1 {
2072
- background: var(--puck-color-grey-11);
2073
- display: flex;
2074
- grid-area: editor;
2075
- flex-direction: column;
2076
- padding: var(--puck-space-px);
2077
- position: relative;
2078
- overflow: auto;
2079
- }
2080
- @media (min-width: 1198px) {
2081
- ._PuckCanvas_t6s9b_1 {
2082
- padding: calc(var(--puck-space-px) * 1.5);
2083
- padding-top: calc(var(--puck-space-px) * 0.5);
2084
- }
2085
- ._PuckCanvas_t6s9b_1:not(._PuckCanvas_t6s9b_1:has(._PuckCanvas-controls_t6s9b_17)) {
2086
- padding-top: calc(var(--puck-space-px) * 1.5);
2087
- }
2088
- }
2089
- ._PuckCanvas--fullScreen_t6s9b_22 {
2090
- padding: 0;
2091
- overflow: hidden;
2092
- }
2093
- @media (min-width: 1198px) {
2094
- ._PuckCanvas--fullScreen_t6s9b_22 {
2095
- padding: 0;
2096
- }
2097
- }
2098
- ._PuckCanvas-inner_t6s9b_33 {
2099
- display: flex;
2100
- height: 100%;
2101
- justify-content: center;
2102
- min-width: 288px;
2103
- position: relative;
2104
- width: 100%;
2105
- }
2106
- ._PuckCanvas-root_t6s9b_42 {
2107
- background: white;
2108
- outline: 1px solid var(--puck-color-grey-09);
2109
- box-sizing: content-box;
2110
- min-width: 321px;
2111
- position: absolute;
2112
- pointer-events: none;
2113
- transform-origin: top;
2114
- top: 0;
2115
- bottom: 0;
2116
- opacity: 0;
2117
- }
2118
- @media (min-width: 1198px) {
2119
- ._PuckCanvas-root_t6s9b_42 {
2120
- min-width: unset;
2121
- }
2122
- }
2123
- @media (prefers-reduced-motion: reduce) {
2124
- ._PuckCanvas-root_t6s9b_42 {
2125
- transition: none !important;
2126
- }
2127
- }
2128
- ._PuckCanvas--ready_t6s9b_67 ._PuckCanvas-root_t6s9b_42 {
2129
- pointer-events: unset;
2130
- opacity: 1;
2131
- }
2132
- ._PuckCanvas-loader_t6s9b_72 {
2133
- align-items: center;
2134
- color: var(--puck-color-grey-06);
2135
- display: flex;
2136
- height: 100%;
2137
- justify-content: center;
2138
- transition: opacity 250ms ease-out;
2139
- opacity: 0;
2140
- }
2141
- ._PuckCanvas--showLoader_t6s9b_82 ._PuckCanvas-loader_t6s9b_72 {
2142
- opacity: 1;
2143
- }
2144
- ._PuckCanvas--showLoader_t6s9b_82._PuckCanvas--ready_t6s9b_67 ._PuckCanvas-loader_t6s9b_72 {
2145
- opacity: 0;
2146
- height: 0;
2147
- transition: none;
2148
- }
2149
- ._PuckCanvas-controls_t6s9b_17 {
2150
- padding-bottom: calc(var(--puck-space-px) * 0.5);
2151
- }
2152
- ._PuckCanvas--fullScreen_t6s9b_22 ._PuckCanvas-controls_t6s9b_17 {
2153
- padding-bottom: 0;
2154
- z-index: 1;
2155
- }
2156
-
2157
1921
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/ResizeHandle/styles.module.css/#css-module-data */
2158
1922
  @media (min-width: 766px) {
2159
1923
  ._ResizeHandle_144bf_2 {
@@ -2188,173 +1952,31 @@ body:has(._DropZone--isAnimating_1i2sv_68:empty) [data-puck-overlay] {
2188
1952
  }
2189
1953
 
2190
1954
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Sidebar/styles.module.css/#css-module-data */
2191
- ._Sidebar_o396p_1 {
2192
- border-block-start: 1px solid var(--puck-color-grey-09);
1955
+ ._Sidebar_1xksb_1 {
2193
1956
  position: relative;
2194
- display: none;
1957
+ display: flex;
2195
1958
  flex-direction: column;
2196
1959
  overflow-y: auto;
2197
1960
  }
2198
- ._Sidebar--isVisible_o396p_9 {
2199
- display: flex;
2200
- }
2201
- ._Sidebar--left_o396p_13 {
1961
+ ._Sidebar--left_1xksb_8 {
2202
1962
  background: var(--puck-color-grey-12);
1963
+ border-inline-end: 1px solid var(--puck-color-grey-09);
2203
1964
  grid-area: left;
2204
1965
  }
2205
- @media (min-width: 766px) {
2206
- ._Sidebar--left_o396p_13 {
2207
- border-block-start: 0;
2208
- border-inline-end: 1px solid var(--puck-color-grey-09);
2209
- }
2210
- }
2211
- ._Sidebar--right_o396p_25 {
1966
+ ._Sidebar--right_1xksb_14 {
2212
1967
  background: var(--puck-color-white);
1968
+ border-inline-start: 1px solid var(--puck-color-grey-09);
2213
1969
  grid-area: right;
2214
1970
  }
2215
- @media (min-width: 766px) {
2216
- ._Sidebar--right_o396p_25 {
2217
- border-block-start: 0;
2218
- border-inline-start: 1px solid var(--puck-color-grey-09);
2219
- }
2220
- }
2221
- ._Sidebar-resizeHandle_o396p_37 {
1971
+ ._Sidebar-resizeHandle_1xksb_20 {
2222
1972
  position: absolute;
2223
1973
  height: 100%;
2224
1974
  }
2225
- ._Sidebar--left_o396p_13 + ._Sidebar-resizeHandle_o396p_37 {
1975
+ ._Sidebar--left_1xksb_8 + ._Sidebar-resizeHandle_1xksb_20 {
2226
1976
  grid-area: left;
2227
1977
  justify-self: end;
2228
1978
  }
2229
- ._Sidebar--right_o396p_25 + ._Sidebar-resizeHandle_o396p_37 {
1979
+ ._Sidebar--right_1xksb_14 + ._Sidebar-resizeHandle_1xksb_20 {
2230
1980
  grid-area: right;
2231
1981
  justify-self: start;
2232
1982
  }
2233
-
2234
- /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Nav/styles.module.css/#css-module-data */
2235
- ._Nav_3nnxc_1 {
2236
- display: flex;
2237
- }
2238
- ._Nav-list_3nnxc_5 {
2239
- display: flex;
2240
- list-style: none;
2241
- margin: 0;
2242
- padding: 0;
2243
- overflow-x: auto;
2244
- gap: 8px;
2245
- }
2246
- @media (min-width: 638px) {
2247
- ._Nav-list_3nnxc_5 {
2248
- padding-top: 32px;
2249
- flex-direction: column;
2250
- gap: 16px;
2251
- width: 100%;
2252
- }
2253
- }
2254
- ._Nav-mobileActions_3nnxc_23 {
2255
- align-items: center;
2256
- display: flex;
2257
- justify-content: center;
2258
- margin-inline-start: auto;
2259
- padding: 4px 16px;
2260
- border-inline-start: 1px solid var(--puck-color-grey-09);
2261
- }
2262
- @media (min-width: 638px) {
2263
- ._Nav-mobileActions_3nnxc_23 {
2264
- display: none;
2265
- }
2266
- }
2267
- ._NavItem-link_3nnxc_38 {
2268
- align-items: center;
2269
- color: var(--puck-color-grey-03);
2270
- display: flex;
2271
- gap: 8px;
2272
- text-decoration: none;
2273
- cursor: pointer;
2274
- border-radius: 4px;
2275
- padding: 8px 4px;
2276
- width: 64px;
2277
- box-sizing: border-box;
2278
- }
2279
- @media (min-width: 638px) {
2280
- ._NavItem-link_3nnxc_38 {
2281
- width: auto;
2282
- }
2283
- }
2284
- ._NavItem_3nnxc_38:first-of-type {
2285
- padding-left: 16px;
2286
- }
2287
- ._NavItem_3nnxc_38:last-of-type {
2288
- padding-right: 16px;
2289
- }
2290
- @media (min-width: 638px) {
2291
- ._NavItem_3nnxc_38:first-of-type,
2292
- ._NavItem_3nnxc_38:last-of-type {
2293
- padding: 0;
2294
- }
2295
- }
2296
- ._NavItem-link_3nnxc_38 {
2297
- border-top: 4px solid transparent;
2298
- border-bottom: 4px solid transparent;
2299
- border-radius: 0;
2300
- flex-direction: column;
2301
- font-size: var(--puck-font-size-xxxs);
2302
- }
2303
- @media (min-width: 638px) {
2304
- ._NavItem-link_3nnxc_38 {
2305
- border: 0;
2306
- border-left: 4px solid transparent;
2307
- border-right: 4px solid transparent;
2308
- }
2309
- }
2310
- ._NavItem-linkIcon_3nnxc_88 {
2311
- height: 24px;
2312
- width: 24px;
2313
- }
2314
- ._NavItem--active_3nnxc_93 > ._NavItem-link_3nnxc_38 {
2315
- background-color: var(--puck-color-azure-10);
2316
- color: var(--puck-color-azure-04);
2317
- font-weight: 600;
2318
- }
2319
- ._NavItem--active_3nnxc_93 > ._NavItem-link_3nnxc_38 {
2320
- background-color: transparent;
2321
- border-top-color: var(--puck-color-azure-04);
2322
- border-top-right-radius: 0;
2323
- border-bottom-right-radius: 0;
2324
- font-weight: 600;
2325
- }
2326
- @media (min-width: 638px) {
2327
- ._NavItem--active_3nnxc_93 > ._NavItem-link_3nnxc_38 {
2328
- border-top-color: transparent;
2329
- border-right-color: var(--puck-color-azure-04);
2330
- }
2331
- }
2332
- ._NavItem_3nnxc_38:not(._NavItem--active_3nnxc_93) > ._NavItem-link_3nnxc_38:hover {
2333
- background-color: var(--puck-color-azure-11);
2334
- color: var(--puck-color-azure-04);
2335
- }
2336
- @media (min-width: 638px) {
2337
- ._NavItem--mobileOnly_3nnxc_120 {
2338
- display: none;
2339
- }
2340
- }
2341
-
2342
- /* css-module:/home/runner/work/puck/puck/packages/core/plugins/fields/styles.module.css/#css-module-data */
2343
- ._FieldsPlugin_nd930_1 {
2344
- background: white;
2345
- height: 100%;
2346
- overflow-y: auto;
2347
- }
2348
- ._FieldsPlugin-header_nd930_7 {
2349
- border-bottom: 1px solid var(--puck-color-grey-09);
2350
- font-weight: 600;
2351
- padding-bottom: 8px;
2352
- padding-left: 16px;
2353
- padding-right: 16px;
2354
- padding-top: 8px;
2355
- }
2356
- @media (min-width: 638px) {
2357
- ._FieldsPlugin-header_nd930_7 {
2358
- padding: 16px;
2359
- }
2360
- }