@measured/puck 0.14.1-canary.bef3303 → 0.14.2-canary.3f7fc52
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 +37 -33
- package/dist/index.js +87 -84
- package/package.json +1 -1
package/dist/index.css
CHANGED
@@ -676,70 +676,74 @@
|
|
676
676
|
}
|
677
677
|
|
678
678
|
/* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/styles.module.css/#css-module-data */
|
679
|
-
.
|
680
|
-
--puck-frame-width: auto;
|
681
|
-
--puck-side-bar-width: 0px;
|
679
|
+
._Puck_mowzv_19 {
|
682
680
|
--puck-space-px: 16px;
|
683
681
|
bottom: 0;
|
684
|
-
display: grid;
|
685
682
|
font-family: var(--puck-font-family);
|
686
|
-
grid-template-areas: "header header header" "left editor right";
|
687
|
-
grid-template-columns: 0 var(--puck-frame-width) 0;
|
688
|
-
grid-template-rows: min-content auto;
|
689
|
-
height: 100dvh;
|
690
683
|
left: 0;
|
691
684
|
position: fixed;
|
692
685
|
right: 0;
|
693
686
|
top: 0;
|
694
687
|
}
|
695
|
-
._Puck
|
688
|
+
._Puck-layout_mowzv_29 {
|
689
|
+
--puck-frame-width: auto;
|
690
|
+
--puck-side-bar-width: 0px;
|
691
|
+
display: grid;
|
692
|
+
grid-template-areas: "header header header" "left editor right";
|
693
|
+
grid-template-columns: 0 var(--puck-frame-width) 0;
|
694
|
+
grid-template-rows: min-content auto;
|
695
|
+
height: 100dvh;
|
696
|
+
position: relative;
|
697
|
+
z-index: 0;
|
698
|
+
}
|
699
|
+
._Puck--mounted_mowzv_41 ._Puck-layout_mowzv_29 {
|
696
700
|
--puck-side-bar-width: 186px;
|
697
701
|
}
|
698
|
-
._Puck--
|
702
|
+
._Puck--leftSideBarVisible_mowzv_45 ._Puck-layout_mowzv_29 {
|
699
703
|
grid-template-columns: var(--puck-side-bar-width) var(--puck-frame-width) 0;
|
700
704
|
}
|
701
|
-
._Puck--
|
705
|
+
._Puck--rightSideBarVisible_mowzv_51 ._Puck-layout_mowzv_29 {
|
702
706
|
grid-template-columns: 0 var(--puck-frame-width) var(--puck-side-bar-width);
|
703
707
|
}
|
704
|
-
._Puck--
|
708
|
+
._Puck--leftSideBarVisible_mowzv_45._Puck--rightSideBarVisible_mowzv_51 ._Puck-layout_mowzv_29 {
|
705
709
|
grid-template-columns: var(--puck-side-bar-width) var(--puck-frame-width) var(--puck-side-bar-width);
|
706
710
|
}
|
707
711
|
@media (min-width: 458px) {
|
708
|
-
._Puck-
|
712
|
+
._Puck-mounted_mowzv_64 ._Puck-layout_mowzv_29 {
|
709
713
|
--puck-frame-width: minmax(266px, auto);
|
710
714
|
}
|
711
715
|
}
|
712
716
|
@media (min-width: 638px) {
|
713
|
-
.
|
717
|
+
._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
|
714
718
|
--puck-side-bar-width: minmax(186px, 250px);
|
715
719
|
}
|
716
720
|
}
|
717
721
|
@media (min-width: 766px) {
|
718
|
-
.
|
722
|
+
._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
|
719
723
|
--puck-frame-width: auto;
|
720
724
|
}
|
721
725
|
}
|
722
726
|
@media (min-width: 990px) {
|
723
|
-
.
|
727
|
+
._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
|
724
728
|
--puck-side-bar-width: 256px;
|
725
729
|
}
|
726
730
|
}
|
727
731
|
@media (min-width: 1198px) {
|
728
|
-
.
|
732
|
+
._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
|
729
733
|
--puck-side-bar-width: 274px;
|
730
734
|
}
|
731
735
|
}
|
732
736
|
@media (min-width: 1398px) {
|
733
|
-
.
|
737
|
+
._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
|
734
738
|
--puck-side-bar-width: 290px;
|
735
739
|
}
|
736
740
|
}
|
737
741
|
@media (min-width: 1598px) {
|
738
|
-
.
|
742
|
+
._Puck_mowzv_19 ._Puck-layout_mowzv_29 {
|
739
743
|
--puck-side-bar-width: 320px;
|
740
744
|
}
|
741
745
|
}
|
742
|
-
._Puck-
|
746
|
+
._Puck-header_mowzv_105 {
|
743
747
|
background: var(--puck-color-white);
|
744
748
|
border-bottom: 1px solid var(--puck-color-grey-09);
|
745
749
|
color: var(--puck-color-black);
|
@@ -747,7 +751,7 @@
|
|
747
751
|
position: relative;
|
748
752
|
max-width: 100vw;
|
749
753
|
}
|
750
|
-
._Puck-
|
754
|
+
._Puck-headerInner_mowzv_114 {
|
751
755
|
align-items: end;
|
752
756
|
display: grid;
|
753
757
|
gap: var(--puck-space-px);
|
@@ -756,43 +760,43 @@
|
|
756
760
|
grid-template-rows: auto;
|
757
761
|
padding: var(--puck-space-px);
|
758
762
|
}
|
759
|
-
._Puck-
|
763
|
+
._Puck-headerToggle_mowzv_124 {
|
760
764
|
color: var(--puck-color-grey-05);
|
761
765
|
display: flex;
|
762
766
|
margin-left: -4px;
|
763
767
|
padding-top: 2px;
|
764
768
|
}
|
765
|
-
._Puck--
|
766
|
-
._Puck--
|
769
|
+
._Puck--rightSideBarVisible_mowzv_51 ._Puck-rightSideBarToggle_mowzv_131,
|
770
|
+
._Puck--leftSideBarVisible_mowzv_45 ._Puck-leftSideBarToggle_mowzv_132 {
|
767
771
|
color: var(--puck-color-black);
|
768
772
|
}
|
769
|
-
._Puck-
|
773
|
+
._Puck-headerTitle_mowzv_136 {
|
770
774
|
align-self: center;
|
771
775
|
}
|
772
|
-
._Puck-
|
776
|
+
._Puck-headerPath_mowzv_140 {
|
773
777
|
font-family: var(--puck-font-family-monospaced);
|
774
778
|
font-size: var(--puck-font-size-xxs);
|
775
779
|
font-weight: normal;
|
776
780
|
word-break: break-all;
|
777
781
|
}
|
778
|
-
._Puck-
|
782
|
+
._Puck-headerTools_mowzv_147 {
|
779
783
|
display: flex;
|
780
784
|
gap: 16px;
|
781
785
|
justify-content: flex-end;
|
782
786
|
}
|
783
|
-
._Puck-
|
787
|
+
._Puck-menuButton_mowzv_153 {
|
784
788
|
color: var(--puck-color-grey-05);
|
785
789
|
margin-left: -4px;
|
786
790
|
}
|
787
|
-
._Puck--
|
791
|
+
._Puck--menuOpen_mowzv_158 ._Puck-menuButton_mowzv_153 {
|
788
792
|
color: var(--puck-color-black);
|
789
793
|
}
|
790
794
|
@media (min-width: 638px) {
|
791
|
-
._Puck-
|
795
|
+
._Puck-menuButton_mowzv_153 {
|
792
796
|
display: none;
|
793
797
|
}
|
794
798
|
}
|
795
|
-
._Puck-
|
799
|
+
._Puck-leftSideBar_mowzv_132 {
|
796
800
|
background: var(--puck-color-grey-12);
|
797
801
|
border-right: 1px solid var(--puck-color-grey-09);
|
798
802
|
display: flex;
|
@@ -800,7 +804,7 @@
|
|
800
804
|
grid-area: left;
|
801
805
|
overflow-y: auto;
|
802
806
|
}
|
803
|
-
._Puck-
|
807
|
+
._Puck-rightSideBar_mowzv_131 {
|
804
808
|
background: var(--puck-color-white);
|
805
809
|
border-left: 1px solid var(--puck-color-grey-09);
|
806
810
|
display: flex;
|
@@ -808,7 +812,7 @@
|
|
808
812
|
grid-area: right;
|
809
813
|
overflow-y: auto;
|
810
814
|
}
|
811
|
-
._Puck-
|
815
|
+
._Puck-portal_mowzv_186 {
|
812
816
|
z-index: 2;
|
813
817
|
}
|
814
818
|
|
package/dist/index.js
CHANGED
@@ -31342,7 +31342,7 @@ var MenuBar = ({
|
|
31342
31342
|
|
31343
31343
|
// css-module:/home/runner/work/puck/puck/packages/core/components/Puck/styles.module.css#css-module
|
31344
31344
|
init_react_import();
|
31345
|
-
var styles_module_default8 = { "Puck": "
|
31345
|
+
var styles_module_default8 = { "Puck": "_Puck_mowzv_19", "Puck-layout": "_Puck-layout_mowzv_29", "Puck--mounted": "_Puck--mounted_mowzv_41", "Puck--leftSideBarVisible": "_Puck--leftSideBarVisible_mowzv_45", "Puck--rightSideBarVisible": "_Puck--rightSideBarVisible_mowzv_51", "Puck-mounted": "_Puck-mounted_mowzv_64", "Puck-header": "_Puck-header_mowzv_105", "Puck-headerInner": "_Puck-headerInner_mowzv_114", "Puck-headerToggle": "_Puck-headerToggle_mowzv_124", "Puck-rightSideBarToggle": "_Puck-rightSideBarToggle_mowzv_131", "Puck-leftSideBarToggle": "_Puck-leftSideBarToggle_mowzv_132", "Puck-headerTitle": "_Puck-headerTitle_mowzv_136", "Puck-headerPath": "_Puck-headerPath_mowzv_140", "Puck-headerTools": "_Puck-headerTools_mowzv_147", "Puck-menuButton": "_Puck-menuButton_mowzv_153", "Puck--menuOpen": "_Puck--menuOpen_mowzv_158", "Puck-leftSideBar": "_Puck-leftSideBar_mowzv_132", "Puck-rightSideBar": "_Puck-rightSideBar_mowzv_131", "Puck-portal": "_Puck-portal_mowzv_186" };
|
31346
31346
|
|
31347
31347
|
// components/Puck/components/Fields/index.tsx
|
31348
31348
|
init_react_import();
|
@@ -33158,6 +33158,7 @@ var ViewportControls = ({
|
|
33158
33158
|
onViewportChange,
|
33159
33159
|
onZoom
|
33160
33160
|
}) => {
|
33161
|
+
var _a, _b;
|
33161
33162
|
const { viewports } = useAppContext();
|
33162
33163
|
const defaultsContainAutoZoom = defaultZoomOptions.find(
|
33163
33164
|
(option) => option.value === autoZoom
|
@@ -33191,7 +33192,7 @@ var ViewportControls = ({
|
|
33191
33192
|
IconButton,
|
33192
33193
|
{
|
33193
33194
|
title: "Zoom viewport out",
|
33194
|
-
disabled: zoom <= zoomOptions[0].value,
|
33195
|
+
disabled: zoom <= ((_a = zoomOptions[0]) == null ? void 0 : _a.value),
|
33195
33196
|
onClick: (e) => {
|
33196
33197
|
e.stopPropagation();
|
33197
33198
|
onZoom(
|
@@ -33208,7 +33209,7 @@ var ViewportControls = ({
|
|
33208
33209
|
IconButton,
|
33209
33210
|
{
|
33210
33211
|
title: "Zoom viewport in",
|
33211
|
-
disabled: zoom >= zoomOptions[zoomOptions.length - 1].value,
|
33212
|
+
disabled: zoom >= ((_b = zoomOptions[zoomOptions.length - 1]) == null ? void 0 : _b.value),
|
33212
33213
|
onClick: (e) => {
|
33213
33214
|
e.stopPropagation();
|
33214
33215
|
onZoom(
|
@@ -33689,94 +33690,96 @@ function Puck({
|
|
33689
33690
|
rightSideBarVisible
|
33690
33691
|
}),
|
33691
33692
|
children: [
|
33692
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.
|
33693
|
-
|
33694
|
-
|
33695
|
-
|
33696
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.
|
33697
|
-
|
33698
|
-
|
33699
|
-
|
33700
|
-
onClick: () => {
|
33701
|
-
onPublish && onPublish(data);
|
33702
|
-
},
|
33703
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Globe, { size: "14px" }),
|
33704
|
-
children: "Publish"
|
33705
|
-
}
|
33706
|
-
)
|
33707
|
-
] }),
|
33708
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("header", { className: getClassName25("header"), children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: getClassName25("headerInner"), children: [
|
33709
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: getClassName25("headerToggle"), children: [
|
33710
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: getClassName25("leftSideBarToggle"), children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
33711
|
-
IconButton,
|
33712
|
-
{
|
33713
|
-
onClick: () => {
|
33714
|
-
toggleSidebars("left");
|
33715
|
-
},
|
33716
|
-
title: "Toggle left sidebar",
|
33717
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(PanelLeft, { focusable: "false" })
|
33718
|
-
}
|
33719
|
-
) }),
|
33720
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: getClassName25("rightSideBarToggle"), children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
33721
|
-
IconButton,
|
33693
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: getClassName25("layout"), children: [
|
33694
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
33695
|
+
CustomHeader,
|
33696
|
+
{
|
33697
|
+
actions: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_jsx_runtime34.Fragment, { children: [
|
33698
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(CustomHeaderActions, {}),
|
33699
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
33700
|
+
Button,
|
33722
33701
|
{
|
33723
33702
|
onClick: () => {
|
33724
|
-
|
33703
|
+
onPublish && onPublish(data);
|
33725
33704
|
},
|
33726
|
-
|
33727
|
-
children:
|
33705
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Globe, { size: "14px" }),
|
33706
|
+
children: "Publish"
|
33728
33707
|
}
|
33729
|
-
)
|
33708
|
+
)
|
33730
33709
|
] }),
|
33731
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("
|
33732
|
-
|
33733
|
-
|
33734
|
-
|
33735
|
-
|
33710
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("header", { className: getClassName25("header"), children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: getClassName25("headerInner"), children: [
|
33711
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: getClassName25("headerToggle"), children: [
|
33712
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: getClassName25("leftSideBarToggle"), children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
33713
|
+
IconButton,
|
33714
|
+
{
|
33715
|
+
onClick: () => {
|
33716
|
+
toggleSidebars("left");
|
33717
|
+
},
|
33718
|
+
title: "Toggle left sidebar",
|
33719
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(PanelLeft, { focusable: "false" })
|
33720
|
+
}
|
33721
|
+
) }),
|
33722
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: getClassName25("rightSideBarToggle"), children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
33723
|
+
IconButton,
|
33724
|
+
{
|
33725
|
+
onClick: () => {
|
33726
|
+
toggleSidebars("right");
|
33727
|
+
},
|
33728
|
+
title: "Toggle right sidebar",
|
33729
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(PanelRight, { focusable: "false" })
|
33730
|
+
}
|
33731
|
+
) })
|
33732
|
+
] }),
|
33733
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: getClassName25("headerTitle"), children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(Heading, { rank: 2, size: "xs", children: [
|
33734
|
+
headerTitle || rootProps.title || "Page",
|
33735
|
+
headerPath && /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_jsx_runtime34.Fragment, { children: [
|
33736
|
+
" ",
|
33737
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("code", { className: getClassName25("headerPath"), children: headerPath })
|
33738
|
+
] })
|
33739
|
+
] }) }),
|
33740
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: getClassName25("headerTools"), children: [
|
33741
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: getClassName25("menuButton"), children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
33742
|
+
IconButton,
|
33743
|
+
{
|
33744
|
+
onClick: () => {
|
33745
|
+
return setMenuOpen(!menuOpen);
|
33746
|
+
},
|
33747
|
+
title: "Toggle menu bar",
|
33748
|
+
children: menuOpen ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ChevronUp, { focusable: "false" }) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ChevronDown, { focusable: "false" })
|
33749
|
+
}
|
33750
|
+
) }),
|
33751
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
33752
|
+
MenuBar,
|
33753
|
+
{
|
33754
|
+
appState,
|
33755
|
+
data,
|
33756
|
+
dispatch,
|
33757
|
+
onPublish,
|
33758
|
+
menuOpen,
|
33759
|
+
renderHeaderActions: () => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(CustomHeaderActions, {}),
|
33760
|
+
setMenuOpen
|
33761
|
+
}
|
33762
|
+
)
|
33736
33763
|
] })
|
33737
|
-
] }) })
|
33738
|
-
|
33739
|
-
|
33740
|
-
|
33741
|
-
|
33742
|
-
|
33743
|
-
|
33744
|
-
|
33745
|
-
|
33746
|
-
|
33747
|
-
|
33748
|
-
|
33749
|
-
|
33750
|
-
|
33751
|
-
|
33752
|
-
|
33753
|
-
|
33754
|
-
|
33755
|
-
onPublish,
|
33756
|
-
menuOpen,
|
33757
|
-
renderHeaderActions: () => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(CustomHeaderActions, {}),
|
33758
|
-
setMenuOpen
|
33759
|
-
}
|
33760
|
-
)
|
33761
|
-
] })
|
33762
|
-
] }) })
|
33763
|
-
}
|
33764
|
-
),
|
33765
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: getClassName25("leftSideBar"), children: [
|
33766
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(SidebarSection, { title: "Components", noBorderTop: true, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Components, {}) }),
|
33767
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(SidebarSection, { title: "Outline", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Outline, {}) })
|
33764
|
+
] }) })
|
33765
|
+
}
|
33766
|
+
),
|
33767
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: getClassName25("leftSideBar"), children: [
|
33768
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(SidebarSection, { title: "Components", noBorderTop: true, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Components, {}) }),
|
33769
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(SidebarSection, { title: "Outline", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Outline, {}) })
|
33770
|
+
] }),
|
33771
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Canvas, {}),
|
33772
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: getClassName25("rightSideBar"), children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
33773
|
+
SidebarSection,
|
33774
|
+
{
|
33775
|
+
noPadding: true,
|
33776
|
+
noBorderTop: true,
|
33777
|
+
showBreadcrumbs: true,
|
33778
|
+
title: selectedItem ? (_a = config.components[selectedItem.type]["label"]) != null ? _a : selectedItem.type : "Page",
|
33779
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Fields, {})
|
33780
|
+
}
|
33781
|
+
) })
|
33768
33782
|
] }),
|
33769
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Canvas, {}),
|
33770
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: getClassName25("rightSideBar"), children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
33771
|
-
SidebarSection,
|
33772
|
-
{
|
33773
|
-
noPadding: true,
|
33774
|
-
noBorderTop: true,
|
33775
|
-
showBreadcrumbs: true,
|
33776
|
-
title: selectedItem ? (_a = config.components[selectedItem.type]["label"]) != null ? _a : selectedItem.type : "Page",
|
33777
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Fields, {})
|
33778
|
-
}
|
33779
|
-
) }),
|
33780
33783
|
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
33781
33784
|
"div",
|
33782
33785
|
{
|
package/package.json
CHANGED