@makeswift/runtime 0.23.5 → 0.24.0-canary.1
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/cjs/components/builtin/Carousel/Carousel.js +3 -4
- package/dist/cjs/components/builtin/Carousel/Carousel.js.map +1 -1
- package/dist/cjs/components/page/Page.js +4 -7
- package/dist/cjs/components/page/Page.js.map +1 -1
- package/dist/cjs/components/page/PageHead.js +8 -17
- package/dist/cjs/components/page/PageHead.js.map +1 -1
- package/dist/cjs/components/shared/Link/index.js +1 -3
- package/dist/cjs/components/shared/Link/index.js.map +1 -1
- package/dist/cjs/core/index.js +2 -10
- package/dist/cjs/core/index.js.map +1 -1
- package/dist/cjs/jest-setup.js +0 -3
- package/dist/cjs/jest-setup.js.map +1 -1
- package/dist/cjs/next/api-handler/handlers/manifest.js +1 -1
- package/dist/cjs/next/api-handler/handlers/proxy-draft-mode.js +1 -1
- package/dist/cjs/next/api-handler/handlers/proxy-draft-mode.js.map +1 -1
- package/dist/cjs/next/client.js +2 -2
- package/dist/cjs/next/client.js.map +1 -1
- package/dist/cjs/next/components/page.js +2 -3
- package/dist/cjs/next/components/page.js.map +1 -1
- package/dist/cjs/next/components/tests/controls/page-control-prop-rendering.js +1 -4
- package/dist/cjs/next/components/tests/controls/page-control-prop-rendering.js.map +1 -1
- package/dist/cjs/next/hooks/use-is-pages-router.js.map +1 -1
- package/dist/cjs/runtimes/react/components/ElementData.js +0 -1
- package/dist/cjs/runtimes/react/components/ElementData.js.map +1 -1
- package/dist/cjs/runtimes/react/hooks/use-cache-data.js +2 -2
- package/dist/cjs/runtimes/react/hooks/use-cache-data.js.map +1 -1
- package/dist/esm/components/builtin/Carousel/Carousel.js +3 -4
- package/dist/esm/components/builtin/Carousel/Carousel.js.map +1 -1
- package/dist/esm/components/page/Page.js +2 -5
- package/dist/esm/components/page/Page.js.map +1 -1
- package/dist/esm/components/page/PageHead.js +8 -17
- package/dist/esm/components/page/PageHead.js.map +1 -1
- package/dist/esm/components/shared/Link/index.js +1 -3
- package/dist/esm/components/shared/Link/index.js.map +1 -1
- package/dist/esm/core/index.js +2 -10
- package/dist/esm/core/index.js.map +1 -1
- package/dist/esm/jest-setup.js +1 -4
- package/dist/esm/jest-setup.js.map +1 -1
- package/dist/esm/next/api-handler/handlers/manifest.js +1 -1
- package/dist/esm/next/api-handler/handlers/proxy-draft-mode.js +1 -1
- package/dist/esm/next/api-handler/handlers/proxy-draft-mode.js.map +1 -1
- package/dist/esm/next/client.js +2 -2
- package/dist/esm/next/client.js.map +1 -1
- package/dist/esm/next/components/page.js +2 -3
- package/dist/esm/next/components/page.js.map +1 -1
- package/dist/esm/next/components/tests/controls/page-control-prop-rendering.js +1 -4
- package/dist/esm/next/components/tests/controls/page-control-prop-rendering.js.map +1 -1
- package/dist/esm/next/hooks/use-is-pages-router.js.map +1 -1
- package/dist/esm/runtimes/react/components/ElementData.js +0 -1
- package/dist/esm/runtimes/react/components/ElementData.js.map +1 -1
- package/dist/esm/runtimes/react/hooks/use-cache-data.js +2 -2
- package/dist/esm/runtimes/react/hooks/use-cache-data.js.map +1 -1
- package/dist/types/components/builtin/Carousel/Carousel.d.ts.map +1 -1
- package/dist/types/components/page/Page.d.ts +1 -3
- package/dist/types/components/page/Page.d.ts.map +1 -1
- package/dist/types/components/page/PageHead.d.ts +1 -3
- package/dist/types/components/page/PageHead.d.ts.map +1 -1
- package/dist/types/components/shared/Link/index.d.ts.map +1 -1
- package/dist/types/core/index.d.ts +1 -1
- package/dist/types/core/index.d.ts.map +1 -1
- package/dist/types/next/components/page.d.ts +1 -21
- package/dist/types/next/components/page.d.ts.map +1 -1
- package/dist/types/next/components/tests/controls/color-control.test.d.ts +3 -0
- package/dist/types/next/components/tests/controls/color-control.test.d.ts.map +1 -0
- package/dist/types/next/components/tests/controls/page-control-prop-rendering.d.ts.map +1 -1
- package/dist/types/next/components/tests/controls/rich-text-v2-control.test.d.ts +2 -0
- package/dist/types/next/components/tests/controls/rich-text-v2-control.test.d.ts.map +1 -0
- package/dist/types/next/hooks/use-is-pages-router.d.ts.map +1 -1
- package/dist/types/runtimes/react/components/ElementData.d.ts.map +1 -1
- package/dist/types/runtimes/react/hooks/use-cache-data.d.ts.map +1 -1
- package/package.json +4 -4
- package/dist/cjs/components/page/page-seo-settings.js +0 -43
- package/dist/cjs/components/page/page-seo-settings.js.map +0 -1
- package/dist/cjs/next/components/tests/controls/color-control/fixtures.js +0 -51
- package/dist/cjs/next/components/tests/controls/color-control/fixtures.js.map +0 -1
- package/dist/cjs/next/components/tests/controls/rich-text-v2-control/fixtures.js +0 -91
- package/dist/cjs/next/components/tests/controls/rich-text-v2-control/fixtures.js.map +0 -1
- package/dist/esm/components/page/page-seo-settings.js +0 -19
- package/dist/esm/components/page/page-seo-settings.js.map +0 -1
- package/dist/esm/next/components/tests/controls/color-control/fixtures.js +0 -24
- package/dist/esm/next/components/tests/controls/color-control/fixtures.js.map +0 -1
- package/dist/esm/next/components/tests/controls/rich-text-v2-control/fixtures.js +0 -56
- package/dist/esm/next/components/tests/controls/rich-text-v2-control/fixtures.js.map +0 -1
- package/dist/types/components/page/page-seo-settings.d.ts +0 -11
- package/dist/types/components/page/page-seo-settings.d.ts.map +0 -1
- package/dist/types/next/components/tests/controls/color-control/client.test.d.ts +0 -3
- package/dist/types/next/components/tests/controls/color-control/client.test.d.ts.map +0 -1
- package/dist/types/next/components/tests/controls/color-control/fixtures.d.ts +0 -11
- package/dist/types/next/components/tests/controls/color-control/fixtures.d.ts.map +0 -1
- package/dist/types/next/components/tests/controls/color-control/server.test.d.ts +0 -2
- package/dist/types/next/components/tests/controls/color-control/server.test.d.ts.map +0 -1
- package/dist/types/next/components/tests/controls/rich-text-v2-control/client.test.d.ts +0 -2
- package/dist/types/next/components/tests/controls/rich-text-v2-control/client.test.d.ts.map +0 -1
- package/dist/types/next/components/tests/controls/rich-text-v2-control/fixtures.d.ts +0 -42
- package/dist/types/next/components/tests/controls/rich-text-v2-control/fixtures.d.ts.map +0 -1
- package/dist/types/next/components/tests/controls/rich-text-v2-control/server.test.d.ts +0 -2
- package/dist/types/next/components/tests/controls/rich-text-v2-control/server.test.d.ts.map +0 -1
- package/dist/types/next/components/tests/makeswift-page-metadata-rendering.test.d.ts +0 -3
- package/dist/types/next/components/tests/makeswift-page-metadata-rendering.test.d.ts.map +0 -1
|
@@ -67,7 +67,6 @@ const RightChevron = () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", {
|
|
|
67
67
|
) });
|
|
68
68
|
const SWIPE_THRESHOLD = 20;
|
|
69
69
|
const swipePower = (dx, velocity) => dx * (1 + velocity);
|
|
70
|
-
const classSelector = (classname) => `.${classname.split(" ").join(".")}`;
|
|
71
70
|
const Carousel = (0, import_react.forwardRef)(function Carousel2({
|
|
72
71
|
images = [],
|
|
73
72
|
width,
|
|
@@ -163,7 +162,7 @@ const Carousel = (0, import_react.forwardRef)(function Carousel2({
|
|
|
163
162
|
(0, import_use_style.useStyle)(
|
|
164
163
|
(0, import_responsive_style.useResponsiveStyle)([gap], ([gap2 = { value: 0, unit: "px" }]) => ({
|
|
165
164
|
margin: `0 ${`${-gap2.value / 2}${gap2.unit}`}`,
|
|
166
|
-
[`& >
|
|
165
|
+
[`& > .${slideClassName}`]: {
|
|
167
166
|
padding: `0 ${`${gap2.value / 2}${gap2.unit}`}`
|
|
168
167
|
}
|
|
169
168
|
}))
|
|
@@ -231,7 +230,7 @@ const Carousel = (0, import_react.forwardRef)(function Carousel2({
|
|
|
231
230
|
),
|
|
232
231
|
(0, import_use_style.useStyle)({
|
|
233
232
|
left: 0,
|
|
234
|
-
[`&:hover >
|
|
233
|
+
[`&:hover > .${arrowClassName}`]: {
|
|
235
234
|
"& > svg": {
|
|
236
235
|
transform: "translateX(-2px)"
|
|
237
236
|
}
|
|
@@ -254,7 +253,7 @@ const Carousel = (0, import_react.forwardRef)(function Carousel2({
|
|
|
254
253
|
),
|
|
255
254
|
(0, import_use_style.useStyle)({
|
|
256
255
|
right: 0,
|
|
257
|
-
[`&:hover >
|
|
256
|
+
[`&:hover > .${arrowClassName}`]: {
|
|
258
257
|
"& > svg": {
|
|
259
258
|
transform: "translateX(2px)"
|
|
260
259
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/components/builtin/Carousel/Carousel.tsx"],"sourcesContent":["'use client'\n\nimport {\n useState,\n useRef,\n useEffect,\n useCallback,\n forwardRef,\n Ref,\n ComponentPropsWithoutRef,\n} from 'react'\nimport { motion, useAnimation } from 'framer-motion'\nimport { useGesture } from '@use-gesture/react'\nimport { wrap } from '@popmotion/popcorn'\n\nimport { colorToString } from '../../utils/colorToString'\nimport { type ResponsiveColor } from '../../utils/types'\nimport { useMediaQuery } from '../../hooks'\n\nimport Image from '../Image'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { cx } from '@emotion/css'\nimport { useResponsiveStyle } from '../../utils/responsive-style'\nimport { getBaseBreakpoint } from '../../../state/modules/breakpoints'\nimport { useBreakpoints } from '../../../runtimes/react/hooks/use-breakpoints'\nimport {\n type ResponsiveGapData,\n type ResponsiveNumberValue,\n type ResponsiveIconRadioGroupValue,\n type ImagesData,\n} from '@makeswift/prop-controllers'\n\nconst LeftChevron = () => (\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"14\" viewBox=\"0 0 10 14\">\n <path\n d=\"M7,13,1,7,7,1\"\n fill=\"none\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n />\n </svg>\n)\n\nconst RightChevron = () => (\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"14\" viewBox=\"0 0 10 14\">\n <path\n d=\"M3,1,9,7,3,13\"\n fill=\"none\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n />\n </svg>\n)\n\ntype Props = {\n id?: string\n images?: ImagesData\n width?: string\n margin?: string\n pageSize?: ResponsiveNumberValue\n step?: ResponsiveNumberValue\n slideAlignment?: ResponsiveIconRadioGroupValue<'flex-start' | 'center' | 'flex-end'>\n gap?: ResponsiveGapData\n autoplay?: boolean\n delay?: number\n showArrows?: boolean\n arrowPosition?: ResponsiveIconRadioGroupValue<'inside' | 'center' | 'outside'>\n arrowColor?: ResponsiveColor | null\n arrowBackground?: ResponsiveColor | null\n showDots?: boolean\n dotColor?: ResponsiveColor | null\n slideBorder?: string\n slideBorderRadius?: string\n}\n\nconst SWIPE_THRESHOLD = 20\nconst swipePower = (dx: number, velocity: number) => dx * (1 + velocity)\n\n// constructs a CSS [class selector](https://developer.mozilla.org/en-US/docs/Web/CSS/Class_selectors),\n// returns a compound class selector if the `classname` string includes multiple class names\nconst classSelector = (classname: string) => `.${classname.split(' ').join('.')}`\n\nconst Carousel = forwardRef(function Carousel(\n {\n images = [],\n width,\n margin,\n pageSize: responsivePageSize,\n step: responsiveStep,\n gap,\n slideAlignment,\n showDots,\n showArrows,\n arrowPosition,\n arrowColor,\n arrowBackground,\n dotColor,\n autoplay = false,\n delay = 5,\n slideBorder,\n slideBorderRadius,\n }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n const breakpoints = useBreakpoints()\n const [index, setIndex] = useState(0)\n const swipe = useRef(0)\n const startIndex = wrap(0, images.length, index)\n const pageSize = useMediaQuery(responsivePageSize) || 1\n const step = useMediaQuery(responsiveStep) || 1\n const endIndex = startIndex + pageSize\n const pageCount = Math.ceil((images.length - pageSize) / step + 1)\n const pageIndex = Math.ceil(startIndex / step)\n const isFirstPage = pageIndex === 0\n const isLastPage = pageIndex === pageCount - 1\n const paginate = useCallback(\n (pageDistance: number) => {\n if (pageDistance === 0) return\n\n const direction = pageDistance / Math.abs(pageDistance)\n const remaining = direction > 0 ? images.slice(endIndex) : images.slice(0, startIndex)\n const distance = direction * Math.min(remaining.length, step * Math.abs(pageDistance))\n\n setIndex(index + distance)\n },\n [images, index, startIndex, endIndex, step],\n )\n // @ts-expect-error: `useAnimation` types expect no arguments.\n const animation = useAnimation({ x: 0, transition: { type: 'spring', stiffness: 100 } })\n const bindPage = useGesture(\n {\n onDrag: ({ movement: [mx], delta: [dx], velocity: [vx] }) => {\n animation.start({ x: mx })\n swipe.current = swipePower(dx, vx)\n },\n onDragEnd: () => {\n animation.start({ x: 0 })\n\n if (swipe.current > SWIPE_THRESHOLD) paginate(1)\n else if (swipe.current < -SWIPE_THRESHOLD) paginate(-1)\n },\n },\n {\n drag: {\n axis: 'x',\n bounds: { left: 0, right: 0 },\n rubberband: true,\n },\n },\n )\n\n useEffect(() => {\n if (!autoplay || pageSize !== 0) setIndex(0)\n }, [autoplay, pageSize])\n\n useEffect(() => {\n if (!autoplay) return () => {}\n\n const intervalId = setInterval(() => (isLastPage ? setIndex(0) : paginate(1)), delay * 1000)\n\n return () => clearInterval(intervalId)\n }, [autoplay, delay, paginate, isLastPage])\n\n const clipMaskClassName = useStyle({ overflow: 'hidden' })\n const pageClassName = useStyle({ position: 'relative', width: '100%' })\n const slideClassName = cx(\n useStyle({ display: 'flex' }),\n useStyle(\n useResponsiveStyle([responsivePageSize] as const, ([pageSize = 1]) => ({\n flexBasis: `${100 / pageSize}%`,\n maxWidth: `${100 / pageSize}%`,\n minWidth: `${100 / pageSize}%`,\n })),\n ),\n useStyle(\n useResponsiveStyle([slideAlignment] as const, ([alignItems = 'center']) => ({ alignItems })),\n ),\n )\n\n const reelClassName = cx(\n useStyle({ display: 'flex', position: 'relative', flexWrap: 'nowrap' }),\n useStyle(\n useResponsiveStyle([gap] as const, ([gap = { value: 0, unit: 'px' }]) => ({\n margin: `0 ${`${-gap.value / 2}${gap.unit}`}`,\n [`& > ${classSelector(slideClassName)}`]: {\n padding: `0 ${`${gap.value / 2}${gap.unit}`}`,\n },\n })),\n ),\n )\n\n const arrowClassName = cx(\n useStyle({\n padding: 10,\n borderRadius: '50%',\n outline: 0,\n border: 0,\n width: 40,\n height: 40,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n cursor: 'pointer',\n userSelect: 'none',\n }),\n useStyle(\n useResponsiveStyle(\n [arrowBackground] as const,\n ([background = { swatch: { hue: 0, saturation: 0, lightness: 100 }, alpha: 1 }]) => ({\n background: colorToString(background),\n }),\n ),\n ),\n useStyle({ svg: { transition: 'transform 0.15s', stroke: 'currentcolor' } }),\n )\n\n const slopClassName = cx(\n useStyle({\n position: 'absolute',\n top: 0,\n bottom: 0,\n\n display: 'flex',\n '&[hidden]': {\n display: 'none',\n },\n\n alignItems: 'center',\n cursor: 'pointer',\n zIndex: 2,\n }),\n useStyle(\n useResponsiveStyle(\n [arrowColor] as const,\n ([color = { swatch: { hue: 0, saturation: 0, lightness: 0 }, alpha: 1 }]) => ({\n color: colorToString(color),\n }),\n ),\n ),\n )\n\n const leftSlopClassName = cx(\n slopClassName,\n useStyle(\n useResponsiveStyle([arrowPosition] as const, ([position = 'inside']) => {\n switch (position) {\n case 'inside':\n return { transform: 'translateX(8px)' }\n\n case 'outside':\n return { transform: 'translateX(calc(-100% - 8px))' }\n\n default:\n return { transform: 'translateX(calc(-50%))' }\n }\n }),\n ),\n useStyle({\n left: 0,\n\n [`&:hover > ${classSelector(arrowClassName)}`]: {\n '& > svg': {\n transform: 'translateX(-2px)',\n },\n },\n }),\n )\n\n const rightSlopClassName = cx(\n slopClassName,\n useStyle(\n useResponsiveStyle([arrowPosition] as const, ([position = 'inside']) => {\n switch (position) {\n case 'inside':\n return { transform: 'translateX(-8px)' }\n\n case 'outside':\n return { transform: 'translateX(calc(100% + 8px))' }\n\n default:\n return { transform: 'translateX(calc(50%))' }\n }\n }),\n ),\n useStyle({\n right: 0,\n [`&:hover > ${classSelector(arrowClassName)}`]: {\n '& > svg': {\n transform: 'translateX(2px)',\n },\n },\n }),\n )\n\n const dotsClassName = cx(\n useStyle({ display: showDots ? 'flex' : 'none', justifyContent: 'center', marginTop: 20 }),\n useStyle(\n useResponsiveStyle(\n [dotColor] as const,\n ([color = { swatch: { hue: 0, saturation: 0, lightness: 0 }, alpha: 1 }]) => ({\n color: colorToString(color),\n }),\n ),\n ),\n )\n\n return (\n <div\n ref={ref}\n className={cx(\n useStyle({ position: 'relative', display: 'flex', flexDirection: 'column' }),\n width,\n margin,\n useStyle({ '&:focus': { outline: 0 } }),\n )}\n tabIndex={-1}\n onKeyDown={e => {\n switch (e.key) {\n case 'ArrowRight':\n paginate(1)\n break\n case 'ArrowLeft':\n paginate(-1)\n break\n default:\n }\n }}\n >\n {/* NOTE: We set height to 100% here to fix an issue on IE11 where the child height of a flex column extends too far */}\n <div className={useStyle({ position: 'relative', height: '100%' })}>\n <div className={clipMaskClassName}>\n {/* https://github.com/framer/motion/issues/1723 */}\n {/* @ts-expect-error: React HTMLElement typings conflict with motion components */}\n <motion.div {...bindPage()} className={pageClassName} animate={animation}>\n <motion.div\n className={reelClassName}\n animate={{ x: `${-(100 / pageSize) * startIndex}%` }}\n transition={{\n x: {\n type: 'tween',\n ease: [0.165, 0.84, 0.44, 1],\n duration: 0.5,\n },\n }}\n >\n {images.map(({ props: imageProps, key }) => (\n <motion.div\n id={key}\n key={key}\n className={slideClassName}\n onMouseDown={e => e.preventDefault()}\n onClick={e => {\n if (swipe.current !== 0) e.preventDefault()\n }}\n >\n <Image\n width={[\n {\n deviceId: getBaseBreakpoint(breakpoints).id,\n value: { value: 100, unit: '%' },\n },\n ]}\n file={imageProps.file}\n altText={imageProps.altText}\n link={imageProps.link}\n border={slideBorder}\n borderRadius={slideBorderRadius}\n />\n </motion.div>\n ))}\n </motion.div>\n </motion.div>\n </div>\n <div\n onClick={() => paginate(-1)}\n className={leftSlopClassName}\n hidden={!showArrows || isFirstPage}\n >\n <div className={arrowClassName}>\n <LeftChevron />\n </div>\n </div>\n <div\n onClick={() => paginate(1)}\n className={rightSlopClassName}\n hidden={!showArrows || isLastPage}\n >\n <div className={arrowClassName}>\n <RightChevron />\n </div>\n </div>\n </div>\n <div className={dotsClassName}>\n {Array.from({ length: pageCount }).map((_, i) => (\n <Dot key={i} active={i === pageIndex} onClick={() => paginate(i - pageIndex)} />\n ))}\n </div>\n </div>\n )\n})\n\nexport default Carousel\n\ntype DotBaseProps = {\n className?: string\n active: boolean\n}\n\ntype DotProps = DotBaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof DotBaseProps>\n\nfunction Dot({ className, active, ...restOfProps }: DotProps) {\n return (\n <div\n {...restOfProps}\n className={cx(\n useStyle({\n position: 'relative',\n margin: '0 6px',\n borderRadius: '50%',\n cursor: 'pointer',\n width: 16,\n height: 16,\n\n '&::before, &::after': {\n content: '\"\"',\n position: 'absolute',\n top: '50%',\n left: '50%',\n display: 'block',\n borderRadius: '50%',\n transition: 'all 0.15s cubic-bezier(0.175, 0.885, 0.32, 1.275)',\n },\n\n '&::before': {\n boxShadow: '0 0 0 2px currentColor',\n transform: 'translate3d(-50%, -50%, 0)',\n width: active ? 16 : 10,\n height: active ? 16 : 10,\n },\n\n '&::after': {\n background: 'currentColor',\n transform: `translate3d(-50%, -50%, 0) scale(${active ? 1 : 0})`,\n width: 10,\n height: 10,\n },\n\n '&:hover::after': {\n transform: `translate3d(-50%, -50%, 0) scale(${active ? 1 : 0})`,\n },\n }),\n className,\n )}\n />\n )\n}\n"],"mappings":"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","names":["import_react","Carousel","pageSize","gap","Image"]}
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/builtin/Carousel/Carousel.tsx"],"sourcesContent":["'use client'\n\nimport {\n useState,\n useRef,\n useEffect,\n useCallback,\n forwardRef,\n Ref,\n ComponentPropsWithoutRef,\n} from 'react'\nimport { motion, useAnimation } from 'framer-motion'\nimport { useGesture } from '@use-gesture/react'\nimport { wrap } from '@popmotion/popcorn'\n\nimport { colorToString } from '../../utils/colorToString'\nimport { type ResponsiveColor } from '../../utils/types'\nimport { useMediaQuery } from '../../hooks'\n\nimport Image from '../Image'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { cx } from '@emotion/css'\nimport { useResponsiveStyle } from '../../utils/responsive-style'\nimport { getBaseBreakpoint } from '../../../state/modules/breakpoints'\nimport { useBreakpoints } from '../../../runtimes/react/hooks/use-breakpoints'\nimport {\n type ResponsiveGapData,\n type ResponsiveNumberValue,\n type ResponsiveIconRadioGroupValue,\n type ImagesData,\n} from '@makeswift/prop-controllers'\n\nconst LeftChevron = () => (\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"14\" viewBox=\"0 0 10 14\">\n <path\n d=\"M7,13,1,7,7,1\"\n fill=\"none\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n />\n </svg>\n)\n\nconst RightChevron = () => (\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"14\" viewBox=\"0 0 10 14\">\n <path\n d=\"M3,1,9,7,3,13\"\n fill=\"none\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n />\n </svg>\n)\n\ntype Props = {\n id?: string\n images?: ImagesData\n width?: string\n margin?: string\n pageSize?: ResponsiveNumberValue\n step?: ResponsiveNumberValue\n slideAlignment?: ResponsiveIconRadioGroupValue<'flex-start' | 'center' | 'flex-end'>\n gap?: ResponsiveGapData\n autoplay?: boolean\n delay?: number\n showArrows?: boolean\n arrowPosition?: ResponsiveIconRadioGroupValue<'inside' | 'center' | 'outside'>\n arrowColor?: ResponsiveColor | null\n arrowBackground?: ResponsiveColor | null\n showDots?: boolean\n dotColor?: ResponsiveColor | null\n slideBorder?: string\n slideBorderRadius?: string\n}\n\nconst SWIPE_THRESHOLD = 20\nconst swipePower = (dx: number, velocity: number) => dx * (1 + velocity)\n\nconst Carousel = forwardRef(function Carousel(\n {\n images = [],\n width,\n margin,\n pageSize: responsivePageSize,\n step: responsiveStep,\n gap,\n slideAlignment,\n showDots,\n showArrows,\n arrowPosition,\n arrowColor,\n arrowBackground,\n dotColor,\n autoplay = false,\n delay = 5,\n slideBorder,\n slideBorderRadius,\n }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n const breakpoints = useBreakpoints()\n const [index, setIndex] = useState(0)\n const swipe = useRef(0)\n const startIndex = wrap(0, images.length, index)\n const pageSize = useMediaQuery(responsivePageSize) || 1\n const step = useMediaQuery(responsiveStep) || 1\n const endIndex = startIndex + pageSize\n const pageCount = Math.ceil((images.length - pageSize) / step + 1)\n const pageIndex = Math.ceil(startIndex / step)\n const isFirstPage = pageIndex === 0\n const isLastPage = pageIndex === pageCount - 1\n const paginate = useCallback(\n (pageDistance: number) => {\n if (pageDistance === 0) return\n\n const direction = pageDistance / Math.abs(pageDistance)\n const remaining = direction > 0 ? images.slice(endIndex) : images.slice(0, startIndex)\n const distance = direction * Math.min(remaining.length, step * Math.abs(pageDistance))\n\n setIndex(index + distance)\n },\n [images, index, startIndex, endIndex, step],\n )\n // @ts-expect-error: `useAnimation` types expect no arguments.\n const animation = useAnimation({ x: 0, transition: { type: 'spring', stiffness: 100 } })\n const bindPage = useGesture(\n {\n onDrag: ({ movement: [mx], delta: [dx], velocity: [vx] }) => {\n animation.start({ x: mx })\n swipe.current = swipePower(dx, vx)\n },\n onDragEnd: () => {\n animation.start({ x: 0 })\n\n if (swipe.current > SWIPE_THRESHOLD) paginate(1)\n else if (swipe.current < -SWIPE_THRESHOLD) paginate(-1)\n },\n },\n {\n drag: {\n axis: 'x',\n bounds: { left: 0, right: 0 },\n rubberband: true,\n },\n },\n )\n\n useEffect(() => {\n if (!autoplay || pageSize !== 0) setIndex(0)\n }, [autoplay, pageSize])\n\n useEffect(() => {\n if (!autoplay) return () => {}\n\n const intervalId = setInterval(() => (isLastPage ? setIndex(0) : paginate(1)), delay * 1000)\n\n return () => clearInterval(intervalId)\n }, [autoplay, delay, paginate, isLastPage])\n\n const clipMaskClassName = useStyle({ overflow: 'hidden' })\n const pageClassName = useStyle({ position: 'relative', width: '100%' })\n const slideClassName = cx(\n useStyle({ display: 'flex' }),\n useStyle(\n useResponsiveStyle([responsivePageSize] as const, ([pageSize = 1]) => ({\n flexBasis: `${100 / pageSize}%`,\n maxWidth: `${100 / pageSize}%`,\n minWidth: `${100 / pageSize}%`,\n })),\n ),\n useStyle(\n useResponsiveStyle([slideAlignment] as const, ([alignItems = 'center']) => ({ alignItems })),\n ),\n )\n const reelClassName = cx(\n useStyle({ display: 'flex', position: 'relative', flexWrap: 'nowrap' }),\n useStyle(\n useResponsiveStyle([gap] as const, ([gap = { value: 0, unit: 'px' }]) => ({\n margin: `0 ${`${-gap.value / 2}${gap.unit}`}`,\n [`& > .${slideClassName}`]: {\n padding: `0 ${`${gap.value / 2}${gap.unit}`}`,\n },\n })),\n ),\n )\n const arrowClassName = cx(\n useStyle({\n padding: 10,\n borderRadius: '50%',\n outline: 0,\n border: 0,\n width: 40,\n height: 40,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n cursor: 'pointer',\n userSelect: 'none',\n }),\n useStyle(\n useResponsiveStyle(\n [arrowBackground] as const,\n ([background = { swatch: { hue: 0, saturation: 0, lightness: 100 }, alpha: 1 }]) => ({\n background: colorToString(background),\n }),\n ),\n ),\n useStyle({ svg: { transition: 'transform 0.15s', stroke: 'currentcolor' } }),\n )\n const slopClassName = cx(\n useStyle({\n position: 'absolute',\n top: 0,\n bottom: 0,\n\n display: 'flex',\n '&[hidden]': {\n display: 'none',\n },\n\n alignItems: 'center',\n cursor: 'pointer',\n zIndex: 2,\n }),\n useStyle(\n useResponsiveStyle(\n [arrowColor] as const,\n ([color = { swatch: { hue: 0, saturation: 0, lightness: 0 }, alpha: 1 }]) => ({\n color: colorToString(color),\n }),\n ),\n ),\n )\n const leftSlopClassName = cx(\n slopClassName,\n useStyle(\n useResponsiveStyle([arrowPosition] as const, ([position = 'inside']) => {\n switch (position) {\n case 'inside':\n return { transform: 'translateX(8px)' }\n\n case 'outside':\n return { transform: 'translateX(calc(-100% - 8px))' }\n\n default:\n return { transform: 'translateX(calc(-50%))' }\n }\n }),\n ),\n useStyle({\n left: 0,\n\n [`&:hover > .${arrowClassName}`]: {\n '& > svg': {\n transform: 'translateX(-2px)',\n },\n },\n }),\n )\n const rightSlopClassName = cx(\n slopClassName,\n useStyle(\n useResponsiveStyle([arrowPosition] as const, ([position = 'inside']) => {\n switch (position) {\n case 'inside':\n return { transform: 'translateX(-8px)' }\n\n case 'outside':\n return { transform: 'translateX(calc(100% + 8px))' }\n\n default:\n return { transform: 'translateX(calc(50%))' }\n }\n }),\n ),\n useStyle({\n right: 0,\n\n [`&:hover > .${arrowClassName}`]: {\n '& > svg': {\n transform: 'translateX(2px)',\n },\n },\n }),\n )\n const dotsClassName = cx(\n useStyle({ display: showDots ? 'flex' : 'none', justifyContent: 'center', marginTop: 20 }),\n useStyle(\n useResponsiveStyle(\n [dotColor] as const,\n ([color = { swatch: { hue: 0, saturation: 0, lightness: 0 }, alpha: 1 }]) => ({\n color: colorToString(color),\n }),\n ),\n ),\n )\n\n return (\n <div\n ref={ref}\n className={cx(\n useStyle({ position: 'relative', display: 'flex', flexDirection: 'column' }),\n width,\n margin,\n useStyle({ '&:focus': { outline: 0 } }),\n )}\n tabIndex={-1}\n onKeyDown={e => {\n switch (e.key) {\n case 'ArrowRight':\n paginate(1)\n break\n case 'ArrowLeft':\n paginate(-1)\n break\n default:\n }\n }}\n >\n {/* NOTE: We set height to 100% here to fix an issue on IE11 where the child height of a flex column extends too far */}\n <div className={useStyle({ position: 'relative', height: '100%' })}>\n <div className={clipMaskClassName}>\n {/* https://github.com/framer/motion/issues/1723 */}\n {/* @ts-expect-error: React HTMLElement typings conflict with motion components */}\n <motion.div {...bindPage()} className={pageClassName} animate={animation}>\n <motion.div\n className={reelClassName}\n animate={{ x: `${-(100 / pageSize) * startIndex}%` }}\n transition={{\n x: {\n type: 'tween',\n ease: [0.165, 0.84, 0.44, 1],\n duration: 0.5,\n },\n }}\n >\n {images.map(({ props: imageProps, key }) => (\n <motion.div\n id={key}\n key={key}\n className={slideClassName}\n onMouseDown={e => e.preventDefault()}\n onClick={e => {\n if (swipe.current !== 0) e.preventDefault()\n }}\n >\n <Image\n width={[\n {\n deviceId: getBaseBreakpoint(breakpoints).id,\n value: { value: 100, unit: '%' },\n },\n ]}\n file={imageProps.file}\n altText={imageProps.altText}\n link={imageProps.link}\n border={slideBorder}\n borderRadius={slideBorderRadius}\n />\n </motion.div>\n ))}\n </motion.div>\n </motion.div>\n </div>\n <div\n onClick={() => paginate(-1)}\n className={leftSlopClassName}\n hidden={!showArrows || isFirstPage}\n >\n <div className={arrowClassName}>\n <LeftChevron />\n </div>\n </div>\n <div\n onClick={() => paginate(1)}\n className={rightSlopClassName}\n hidden={!showArrows || isLastPage}\n >\n <div className={arrowClassName}>\n <RightChevron />\n </div>\n </div>\n </div>\n <div className={dotsClassName}>\n {Array.from({ length: pageCount }).map((_, i) => (\n <Dot key={i} active={i === pageIndex} onClick={() => paginate(i - pageIndex)} />\n ))}\n </div>\n </div>\n )\n})\n\nexport default Carousel\n\ntype DotBaseProps = {\n className?: string\n active: boolean\n}\n\ntype DotProps = DotBaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof DotBaseProps>\n\nfunction Dot({ className, active, ...restOfProps }: DotProps) {\n return (\n <div\n {...restOfProps}\n className={cx(\n useStyle({\n position: 'relative',\n margin: '0 6px',\n borderRadius: '50%',\n cursor: 'pointer',\n width: 16,\n height: 16,\n\n '&::before, &::after': {\n content: '\"\"',\n position: 'absolute',\n top: '50%',\n left: '50%',\n display: 'block',\n borderRadius: '50%',\n transition: 'all 0.15s cubic-bezier(0.175, 0.885, 0.32, 1.275)',\n },\n\n '&::before': {\n boxShadow: '0 0 0 2px currentColor',\n transform: 'translate3d(-50%, -50%, 0)',\n width: active ? 16 : 10,\n height: active ? 16 : 10,\n },\n\n '&::after': {\n background: 'currentColor',\n transform: `translate3d(-50%, -50%, 0) scale(${active ? 1 : 0})`,\n width: 10,\n height: 10,\n },\n\n '&:hover::after': {\n transform: `translate3d(-50%, -50%, 0) scale(${active ? 1 : 0})`,\n },\n }),\n className,\n )}\n />\n )\n}\n"],"mappings":"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","names":["import_react","Carousel","pageSize","gap","Image"]}
|
|
@@ -23,20 +23,17 @@ __export(Page_exports, {
|
|
|
23
23
|
});
|
|
24
24
|
module.exports = __toCommonJS(Page_exports);
|
|
25
25
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
26
|
-
var import_react = require("react");
|
|
27
26
|
var import_BodySnippet = require("./BodySnippet");
|
|
28
|
-
var
|
|
27
|
+
var import_react = require("../../runtimes/react");
|
|
29
28
|
var import_useRouterLocaleSync = require("../hooks/useRouterLocaleSync");
|
|
30
29
|
var import_usePageSnippets = require("../hooks/usePageSnippets");
|
|
31
30
|
var import_PageHead = require("./PageHead");
|
|
32
|
-
|
|
33
|
-
function Page({ page, rootDocument, metadata = true }) {
|
|
31
|
+
function Page({ page, rootDocument }) {
|
|
34
32
|
const { bodySnippets } = (0, import_usePageSnippets.usePageSnippets)({ page });
|
|
35
|
-
const pageMetadataSettings = (0, import_react.useMemo)(() => (0, import_page_seo_settings.flattenMetadataSettings)(metadata), [metadata]);
|
|
36
33
|
(0, import_useRouterLocaleSync.useRouterLocaleSync)();
|
|
37
34
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
38
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_PageHead.PageHead, { document: page
|
|
39
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
35
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_PageHead.PageHead, { document: page }),
|
|
36
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.DocumentRoot, { rootDocument }),
|
|
40
37
|
bodySnippets.map((snippet) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_BodySnippet.BodySnippet, { code: snippet.code, cleanup: snippet.cleanup }, snippet.id))
|
|
41
38
|
] });
|
|
42
39
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/page/Page.tsx"],"sourcesContent":["'use client'\n\nimport {
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/page/Page.tsx"],"sourcesContent":["'use client'\n\nimport { BodySnippet } from './BodySnippet'\nimport { DocumentRoot } from '../../runtimes/react'\nimport { type Document } from '../../state/react-page'\nimport { MakeswiftPageDocument } from '../../next'\nimport { useRouterLocaleSync } from '../hooks/useRouterLocaleSync'\nimport { usePageSnippets } from '../hooks/usePageSnippets'\nimport { PageHead } from './PageHead'\n\ntype Props = {\n page: MakeswiftPageDocument\n rootDocument: Document\n}\n\nexport function Page({ page, rootDocument }: Props): JSX.Element {\n const { bodySnippets } = usePageSnippets({ page })\n\n useRouterLocaleSync()\n\n return (\n <>\n <PageHead document={page} />\n\n <DocumentRoot rootDocument={rootDocument} />\n\n {bodySnippets.map(snippet => (\n <BodySnippet key={snippet.id} code={snippet.code} cleanup={snippet.cleanup} />\n ))}\n </>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAqBI;AAnBJ,yBAA4B;AAC5B,mBAA6B;AAG7B,iCAAoC;AACpC,6BAAgC;AAChC,sBAAyB;AAOlB,SAAS,KAAK,EAAE,MAAM,aAAa,GAAuB;AAC/D,QAAM,EAAE,aAAa,QAAI,wCAAgB,EAAE,KAAK,CAAC;AAEjD,sDAAoB;AAEpB,SACE,4EACE;AAAA,gDAAC,4BAAS,UAAU,MAAM;AAAA,IAE1B,4CAAC,6BAAa,cAA4B;AAAA,IAEzC,aAAa,IAAI,aAChB,4CAAC,kCAA6B,MAAM,QAAQ,MAAM,SAAS,QAAQ,WAAjD,QAAQ,EAAkD,CAC7E;AAAA,KACH;AAEJ;","names":[]}
|
|
@@ -35,16 +35,7 @@ const defaultFavicon = {
|
|
|
35
35
|
mimetype: "image/png",
|
|
36
36
|
publicUrl: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAACXBIWXMAABcRAAAXEQHKJvM/AAABjElEQVRYhc2XzU3EMBCFB8TddAAXn6EE6GCpgNABZ1/IXnymBOgAOmA7YM8+ABVsXEHQQFaKQryeN3Yk3ilKJtEnv/nLUd/3pFG0riGi88yrnQn+UfJ5FUi0riWiB2H4nQn+KRd0DFP8agXEfkqCYJBoHdtxIQxfm+DfFgEhoith3NYE30o/qgGR2BJB+xY7kdYEL8oNFUi0jiFMJuxVWrJqEMFxsyUNCsE6AeNztvBp7aJ143vXksoRnwhYtmNdSoIQa6RlO9YXEWW7KgoCleOgxgTf1QZBT+RZ2lXFING6UxCCq+ceeUE8fYdknY599v9sJvzGBP+yCEgC7GPmETc0OJ+0awAlkhe2pAbIXAeFZ8xe2g2Nk3c3ub0xwWt6zY9qbmiqGVMbZK21ZC/YmhlbeBMTzZNDQqcvDb1kM1x32iqZSt1HaqukfKvq34BAOTLsrH+ETNmUkKHHA+428RgeclPVWozeSyAI2EdWB34jtqXNTAySOY3i/KgFIlqOa4GkFmBegorzg4joG07he/M7zl6jAAAAAElFTkSuQmCC"
|
|
37
37
|
};
|
|
38
|
-
function PageHead({ document: page
|
|
39
|
-
const {
|
|
40
|
-
title: useTitle = false,
|
|
41
|
-
favicon: useFavicon = false,
|
|
42
|
-
canonicalUrl: useCanonicalUrl = false,
|
|
43
|
-
indexingBlocked: useIndexingBlocked = false,
|
|
44
|
-
description: useDescription = false,
|
|
45
|
-
keywords: useKeywords = false,
|
|
46
|
-
socialImage: useSocialImage = false
|
|
47
|
-
} = metadata;
|
|
38
|
+
function PageHead({ document: page }) {
|
|
48
39
|
const { headSnippets } = (0, import_usePageSnippets.usePageSnippets)({ page });
|
|
49
40
|
const isInBuilder = (0, import_react2.useIsInBuilder)();
|
|
50
41
|
const site = useCachedSite(isInBuilder ? page.site.id : null);
|
|
@@ -78,17 +69,17 @@ function PageHead({ document: page, metadata = {} }) {
|
|
|
78
69
|
overflow: hidden;
|
|
79
70
|
}
|
|
80
71
|
` }),
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
72
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageTitle, { children: title }),
|
|
73
|
+
favicon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageLink, { rel: "icon", type: favicon.mimetype, href: favicon.publicUrl }),
|
|
74
|
+
canonicalUrl && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageLink, { rel: "canonical", href: canonicalUrl }),
|
|
75
|
+
isIndexingBlocked && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageMeta, { name: "robots", content: "noindex" }),
|
|
76
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
86
77
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageMeta, { name: "description", content: description }),
|
|
87
78
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageMeta, { property: "og:description", content: description }),
|
|
88
79
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageMeta, { name: "twitter:description", content: description })
|
|
89
80
|
] }),
|
|
90
|
-
|
|
91
|
-
|
|
81
|
+
keywords && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageMeta, { name: "keywords", content: keywords }),
|
|
82
|
+
socialImage && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
92
83
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageMeta, { property: "og:image", content: socialImage.publicUrl }),
|
|
93
84
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageMeta, { property: "og:image:type", content: socialImage.mimetype }),
|
|
94
85
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_head_tags.PageMeta, { name: "twitter:image", content: socialImage.publicUrl }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/page/PageHead.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo } from 'react'\nimport { MakeswiftPageDocument } from '../../next'\nimport { usePageSnippets } from '../hooks/usePageSnippets'\nimport { useIsInBuilder } from '../../react'\nimport { useMakeswiftHostApiClient } from '../../runtimes/react/host-api-client'\nimport { useSyncExternalStore } from 'use-sync-external-store/shim'\nimport { Site } from '../../api'\nimport { PageTitle, PageMeta, PageLink, PageStyle } from '../../next/components/head-tags'\nimport { HeadSnippet } from './HeadSnippet'\
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/page/PageHead.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo } from 'react'\nimport { MakeswiftPageDocument } from '../../next'\nimport { usePageSnippets } from '../hooks/usePageSnippets'\nimport { useIsInBuilder } from '../../react'\nimport { useMakeswiftHostApiClient } from '../../runtimes/react/host-api-client'\nimport { useSyncExternalStore } from 'use-sync-external-store/shim'\nimport { Site } from '../../api'\nimport { PageTitle, PageMeta, PageLink, PageStyle } from '../../next/components/head-tags'\nimport { HeadSnippet } from './HeadSnippet'\n\nconst defaultFavicon = {\n id: 'default-favicon',\n mimetype: 'image/png',\n publicUrl:\n 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAACXBIWXMAABcRAAAXEQHKJvM/AAABjElEQVRYhc2XzU3EMBCFB8TddAAXn6EE6GCpgNABZ1/IXnymBOgAOmA7YM8+ABVsXEHQQFaKQryeN3Yk3ilKJtEnv/nLUd/3pFG0riGi88yrnQn+UfJ5FUi0riWiB2H4nQn+KRd0DFP8agXEfkqCYJBoHdtxIQxfm+DfFgEhoith3NYE30o/qgGR2BJB+xY7kdYEL8oNFUi0jiFMJuxVWrJqEMFxsyUNCsE6AeNztvBp7aJ143vXksoRnwhYtmNdSoIQa6RlO9YXEWW7KgoCleOgxgTf1QZBT+RZ2lXFING6UxCCq+ceeUE8fYdknY599v9sJvzGBP+yCEgC7GPmETc0OJ+0awAlkhe2pAbIXAeFZ8xe2g2Nk3c3ub0xwWt6zY9qbmiqGVMbZK21ZC/YmhlbeBMTzZNDQqcvDb1kM1x32iqZSt1HaqukfKvq34BAOTLsrH+ETNmUkKHHA+428RgeclPVWozeSyAI2EdWB34jtqXNTAySOY3i/KgFIlqOa4GkFmBegorzg4joG07he/M7zl6jAAAAAElFTkSuQmCC',\n}\n\ntype Props = {\n document: MakeswiftPageDocument\n}\n\nexport function PageHead({ document: page }: Props): JSX.Element {\n const { headSnippets } = usePageSnippets({ page })\n\n const isInBuilder = useIsInBuilder()\n\n const site = useCachedSite(isInBuilder ? page.site.id : null)\n const baseLocalizedPage = page.localizedPages.find(({ parentId }) => parentId == null)\n\n const favicon = page.meta.favicon ?? defaultFavicon\n const title = baseLocalizedPage?.meta.title ?? page.meta.title\n const description = baseLocalizedPage?.meta.description ?? page.meta.description\n const keywords = baseLocalizedPage?.meta.keywords ?? page.meta.keywords\n const socialImage = baseLocalizedPage?.meta.socialImage ?? page.meta.socialImage\n const canonicalUrl = baseLocalizedPage?.seo.canonicalUrl ?? page.seo.canonicalUrl\n const isIndexingBlocked = baseLocalizedPage?.seo.isIndexingBlocked ?? page.seo.isIndexingBlocked\n\n const fontFamilyParamValue = useMemo(() => {\n if (site == null) {\n return page.fonts\n .map(({ family, variants }) => {\n return `${family.replace(/ /g, '+')}:${variants.join()}`\n })\n .join('|')\n }\n\n return site.googleFonts.edges\n .filter((edge): edge is NonNullable<typeof edge> => edge != null)\n .map(({ activeVariants, node: { family, variants } }) => {\n const activeVariantSpecifiers = variants\n .filter(variant =>\n activeVariants.some(activeVariant => activeVariant.specifier === variant.specifier),\n )\n .map(variant => variant.specifier)\n .join()\n\n return `${family.replace(/ /g, '+')}:${activeVariantSpecifiers}`\n })\n .join('|')\n }, [site, page])\n\n return (\n <>\n <PageStyle precedence=\"high\" href=\"makeswift-base-styles\">\n {`\n html {\n font-family: sans-serif;\n }\n div#__next {\n overflow: hidden;\n }\n `}\n </PageStyle>\n {title && <PageTitle>{title}</PageTitle>}\n {favicon && <PageLink rel=\"icon\" type={favicon.mimetype} href={favicon.publicUrl} />}\n {canonicalUrl && <PageLink rel=\"canonical\" href={canonicalUrl} />}\n {isIndexingBlocked && <PageMeta name=\"robots\" content=\"noindex\" />}\n {description && (\n <>\n <PageMeta name=\"description\" content={description} />\n <PageMeta property=\"og:description\" content={description} />\n <PageMeta name=\"twitter:description\" content={description} />\n </>\n )}\n {keywords && <PageMeta name=\"keywords\" content={keywords} />}\n {socialImage && (\n <>\n <PageMeta property=\"og:image\" content={socialImage.publicUrl} />\n <PageMeta property=\"og:image:type\" content={socialImage.mimetype} />\n <PageMeta name=\"twitter:image\" content={socialImage.publicUrl} />\n <PageMeta name=\"twitter:card\" content=\"summary_large_image\" />\n </>\n )}\n {fontFamilyParamValue !== '' && (\n <PageLink\n precedence=\"medium\"\n rel=\"stylesheet\"\n href={`https://fonts.googleapis.com/css?family=${fontFamilyParamValue}&display=swap`}\n />\n )}\n {headSnippets.map(snippet => (\n <HeadSnippet key={snippet.id} snippet={snippet} />\n ))}\n </>\n )\n}\n\nfunction useCachedSite(siteId: string | null): Site | null {\n const client = useMakeswiftHostApiClient()\n const getSnapshot = () => (siteId == null ? null : client.readSite(siteId))\n\n const site = useSyncExternalStore(client.subscribe, getSnapshot, getSnapshot)\n\n return site\n}\n"],"mappings":"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","names":["import_react"]}
|
|
@@ -36,7 +36,6 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
36
36
|
var import_react = require("react");
|
|
37
37
|
var import_link = __toESM(require("next/link"));
|
|
38
38
|
var import_link2 = require("../../../controls/link");
|
|
39
|
-
var import_use_is_pages_router = require("../../../next/hooks/use-is-pages-router");
|
|
40
39
|
var import_use_resolved_value = require("../../../runtimes/react/hooks/use-resolved-value");
|
|
41
40
|
const isValidHref = (href) => {
|
|
42
41
|
try {
|
|
@@ -66,7 +65,6 @@ const Link = (0, import_react.forwardRef)(function Link2({ link, onClick = () =>
|
|
|
66
65
|
return resolvedOnClick?.(event);
|
|
67
66
|
}
|
|
68
67
|
const useNextLink = href != null && link && (link.type === "OPEN_PAGE" || link.type === "OPEN_URL" && isValidHref(link.payload.url));
|
|
69
|
-
const isPagesRouter = (0, import_use_is_pages_router.useIsPagesRouter)();
|
|
70
68
|
if (useNextLink) {
|
|
71
69
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
72
70
|
import_link.default,
|
|
@@ -76,7 +74,7 @@ const Link = (0, import_react.forwardRef)(function Link2({ link, onClick = () =>
|
|
|
76
74
|
target,
|
|
77
75
|
onClick: handleClick,
|
|
78
76
|
href,
|
|
79
|
-
|
|
77
|
+
locale: false,
|
|
80
78
|
legacyBehavior: false
|
|
81
79
|
}
|
|
82
80
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/components/shared/Link/index.tsx"],"sourcesContent":["'use client'\n\nimport { ComponentPropsWithoutRef, forwardRef, MouseEvent } from 'react'\nimport NextLink from 'next/link'\n\nimport { LinkData } from '@makeswift/prop-controllers'\n\nimport { Link as LinkDef } from '../../../controls/link'\
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/shared/Link/index.tsx"],"sourcesContent":["'use client'\n\nimport { ComponentPropsWithoutRef, forwardRef, MouseEvent } from 'react'\nimport NextLink from 'next/link'\n\nimport { LinkData } from '@makeswift/prop-controllers'\n\nimport { Link as LinkDef } from '../../../controls/link'\nimport { useResolvedValue } from '../../../runtimes/react/hooks/use-resolved-value'\n\ntype BaseProps = {\n link?: LinkData\n onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'a'>, keyof BaseProps>\n\n// workaround for https://github.com/vercel/next.js/issues/66650\nconst isValidHref = (href: string) => {\n try {\n const bases = ['http://n', 'https://n']\n // - if `href` is a relative path, it will be resolved relative to the base URL\n // - if `href` is a full URL, the base URL will be ignored, even if there is a mismatch of protocols\n // - if `href` is an incomplete, protocol-only URL with a protocol that\n // conflicts with one of the base URL, this will throw\n bases.forEach(base => new URL(href, base))\n } catch (_) {\n return false\n }\n return true\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, Props>(function Link(\n { link, onClick = () => {}, ...restOfProps }: Props,\n ref,\n) {\n const {\n href,\n target,\n onClick: resolvedOnClick,\n } = useResolvedValue(link, (link, resourceResolver) =>\n LinkDef().resolveValue(link, resourceResolver),\n ) ?? {}\n\n function handleClick(event: MouseEvent<HTMLAnchorElement>) {\n onClick(event)\n\n if (event.defaultPrevented) return\n\n /**\n * When we introduced `next/link` instead of just `a` element slate no longer prevented link from navigating within\n * content mode. This is a hack to compensate for what would be expected as slate's default behavior.\n * On upgrade of slate this can be reevaluated.\n */\n if (event.currentTarget.isContentEditable) return event.preventDefault()\n\n return resolvedOnClick?.(event)\n }\n\n const useNextLink =\n href != null &&\n link &&\n (link.type === 'OPEN_PAGE' || (link.type === 'OPEN_URL' && isValidHref(link.payload.url)))\n\n if (useNextLink) {\n return (\n <NextLink\n {...restOfProps}\n ref={ref}\n target={target}\n onClick={handleClick}\n href={href}\n locale={false}\n // Next.js v12 has legacyBehavior set to true by default\n legacyBehavior={false}\n />\n )\n }\n\n // eslint-disable-next-line\n return <a {...restOfProps} ref={ref} href={href} target={target} onClick={handleClick} />\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkEM;AAhEN,mBAAiE;AACjE,kBAAqB;AAIrB,IAAAA,eAAgC;AAChC,gCAAiC;AAUjC,MAAM,cAAc,CAAC,SAAiB;AACpC,MAAI;AACF,UAAM,QAAQ,CAAC,YAAY,WAAW;AAKtC,UAAM,QAAQ,UAAQ,IAAI,IAAI,MAAM,IAAI,CAAC;AAAA,EAC3C,SAAS,GAAG;AACV,WAAO;AAAA,EACT;AACA,SAAO;AACT;AAEO,MAAM,WAAO,yBAAqC,SAASC,MAChE,EAAE,MAAM,UAAU,MAAM;AAAC,GAAG,GAAG,YAAY,GAC3C,KACA;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EACX,QAAI;AAAA,IAAiB;AAAA,IAAM,CAACC,OAAM,yBAChC,aAAAC,MAAQ,EAAE,aAAaD,OAAM,gBAAgB;AAAA,EAC/C,KAAK,CAAC;AAEN,WAAS,YAAY,OAAsC;AACzD,YAAQ,KAAK;AAEb,QAAI,MAAM;AAAkB;AAO5B,QAAI,MAAM,cAAc;AAAmB,aAAO,MAAM,eAAe;AAEvE,WAAO,kBAAkB,KAAK;AAAA,EAChC;AAEA,QAAM,cACJ,QAAQ,QACR,SACC,KAAK,SAAS,eAAgB,KAAK,SAAS,cAAc,YAAY,KAAK,QAAQ,GAAG;AAEzF,MAAI,aAAa;AACf,WACE;AAAA,MAAC,YAAAE;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA,SAAS;AAAA,QACT;AAAA,QACA,QAAQ;AAAA,QAER,gBAAgB;AAAA;AAAA,IAClB;AAAA,EAEJ;AAGA,SAAO,4CAAC,OAAG,GAAG,aAAa,KAAU,MAAY,QAAgB,SAAS,aAAa;AACzF,CAAC;","names":["import_link","Link","link","LinkDef","NextLink"]}
|
package/dist/cjs/core/index.js
CHANGED
|
@@ -21,11 +21,7 @@ __export(core_exports, {
|
|
|
21
21
|
ControlDefinition: () => import_controls.ControlDefinition,
|
|
22
22
|
ControlInstance: () => import_controls.ControlInstance,
|
|
23
23
|
DefaultControlInstance: () => import_controls.DefaultControlInstance,
|
|
24
|
-
ShapeV2Control: () => import_controls.ShapeV2Control
|
|
25
|
-
findBreakpointOverride: () => import_controls.findBreakpointOverride,
|
|
26
|
-
mergeOrCoalesceFallbacks: () => import_controls.mergeOrCoalesceFallbacks,
|
|
27
|
-
mergeResponsiveValues: () => import_controls.mergeResponsiveValues,
|
|
28
|
-
shallowMergeFallbacks: () => import_controls.shallowMergeFallbacks
|
|
24
|
+
ShapeV2Control: () => import_controls.ShapeV2Control
|
|
29
25
|
});
|
|
30
26
|
module.exports = __toCommonJS(core_exports);
|
|
31
27
|
var import_controls = require("@makeswift/controls");
|
|
@@ -34,10 +30,6 @@ var import_controls = require("@makeswift/controls");
|
|
|
34
30
|
ControlDefinition,
|
|
35
31
|
ControlInstance,
|
|
36
32
|
DefaultControlInstance,
|
|
37
|
-
ShapeV2Control
|
|
38
|
-
findBreakpointOverride,
|
|
39
|
-
mergeOrCoalesceFallbacks,
|
|
40
|
-
mergeResponsiveValues,
|
|
41
|
-
shallowMergeFallbacks
|
|
33
|
+
ShapeV2Control
|
|
42
34
|
});
|
|
43
35
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/core/index.ts"],"sourcesContent":["export {\n type
|
|
1
|
+
{"version":3,"sources":["../../../src/core/index.ts"],"sourcesContent":["export {\n type ConfigType,\n type Data,\n type DataType,\n type ValueType,\n type ResolvedValueType,\n type ControlMessage,\n type ReplacementContext,\n type SendMessageType,\n ControlDefinition,\n ControlInstance,\n DefaultControlInstance,\n ShapeV2Control,\n} from '@makeswift/controls'\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAaO;","names":[]}
|
package/dist/cjs/jest-setup.js
CHANGED
|
@@ -6,9 +6,6 @@ beforeAll(() => import_server.server.listen());
|
|
|
6
6
|
afterEach(() => import_server.server.resetHandlers());
|
|
7
7
|
afterAll(() => import_server.server.close());
|
|
8
8
|
expect.extend(import_jest.matchers);
|
|
9
|
-
if (typeof window !== "undefined") {
|
|
10
|
-
expect.addSnapshotSerializer((0, import_jest.createSerializer)());
|
|
11
|
-
}
|
|
12
9
|
jest.mock("uuid", () => ({
|
|
13
10
|
v4: jest.fn(() => "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"),
|
|
14
11
|
v5: jest.fn(() => "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx")
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/jest-setup.ts"],"sourcesContent":["import '@testing-library/jest-dom'\nimport { matchers
|
|
1
|
+
{"version":3,"sources":["../../src/jest-setup.ts"],"sourcesContent":["import '@testing-library/jest-dom'\nimport { matchers } from '@emotion/jest'\nimport { server } from './mocks/server'\n\nbeforeAll(() => server.listen())\nafterEach(() => server.resetHandlers())\nafterAll(() => server.close())\n\nexpect.extend(matchers)\n\njest.mock('uuid', () => ({\n v4: jest.fn(() => 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'),\n v5: jest.fn(() => 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'),\n}))\n\nif (typeof window !== 'undefined') {\n Object.defineProperty(window, 'matchMedia', {\n writable: true,\n value: jest.fn().mockImplementation(query => ({\n matches: false,\n media: query,\n onchange: null,\n addListener: jest.fn(), // deprecated\n removeListener: jest.fn(), // deprecated\n addEventListener: jest.fn(),\n removeEventListener: jest.fn(),\n dispatchEvent: jest.fn(),\n })),\n })\n\n Object.defineProperty(window, 'IntersectionObserver', {\n writable: true,\n value: jest.fn().mockImplementation(() => ({\n observe: jest.fn(),\n unobserve: jest.fn(),\n disconnect: jest.fn(),\n })),\n })\n}\n"],"mappings":";AAAA,sBAAO;AACP,kBAAyB;AACzB,oBAAuB;AAEvB,UAAU,MAAM,qBAAO,OAAO,CAAC;AAC/B,UAAU,MAAM,qBAAO,cAAc,CAAC;AACtC,SAAS,MAAM,qBAAO,MAAM,CAAC;AAE7B,OAAO,OAAO,oBAAQ;AAEtB,KAAK,KAAK,QAAQ,OAAO;AAAA,EACvB,IAAI,KAAK,GAAG,MAAM,sCAAsC;AAAA,EACxD,IAAI,KAAK,GAAG,MAAM,sCAAsC;AAC1D,EAAE;AAEF,IAAI,OAAO,WAAW,aAAa;AACjC,SAAO,eAAe,QAAQ,cAAc;AAAA,IAC1C,UAAU;AAAA,IACV,OAAO,KAAK,GAAG,EAAE,mBAAmB,YAAU;AAAA,MAC5C,SAAS;AAAA,MACT,OAAO;AAAA,MACP,UAAU;AAAA,MACV,aAAa,KAAK,GAAG;AAAA;AAAA,MACrB,gBAAgB,KAAK,GAAG;AAAA;AAAA,MACxB,kBAAkB,KAAK,GAAG;AAAA,MAC1B,qBAAqB,KAAK,GAAG;AAAA,MAC7B,eAAe,KAAK,GAAG;AAAA,IACzB,EAAE;AAAA,EACJ,CAAC;AAED,SAAO,eAAe,QAAQ,wBAAwB;AAAA,IACpD,UAAU;AAAA,IACV,OAAO,KAAK,GAAG,EAAE,mBAAmB,OAAO;AAAA,MACzC,SAAS,KAAK,GAAG;AAAA,MACjB,WAAW,KAAK,GAAG;AAAA,MACnB,YAAY,KAAK,GAAG;AAAA,IACtB,EAAE;AAAA,EACJ,CAAC;AACH;","names":[]}
|
|
@@ -37,7 +37,7 @@ async function handler(...args) {
|
|
|
37
37
|
const supportsDraftMode = (0, import_ts_pattern.match)(args).with(routeHandlerPattern, () => true).with(apiRoutePattern, () => false).exhaustive();
|
|
38
38
|
const supportsWebhook = (0, import_ts_pattern.match)(args).with(routeHandlerPattern, () => true).with(apiRoutePattern, () => false).exhaustive();
|
|
39
39
|
const body = {
|
|
40
|
-
version: "0.
|
|
40
|
+
version: "0.24.0-canary.1",
|
|
41
41
|
previewMode: supportsPreviewMode,
|
|
42
42
|
draftMode: supportsDraftMode,
|
|
43
43
|
interactionMode: true,
|
|
@@ -42,7 +42,7 @@ async function proxyDraftModeRouteHandler(request, _context, { apiKey }) {
|
|
|
42
42
|
const draft = await (0, import_headers.draftMode)();
|
|
43
43
|
draft.enable();
|
|
44
44
|
const proxyUrl = request.nextUrl.clone();
|
|
45
|
-
if (process.env.
|
|
45
|
+
if (process.env.FORCE_HTTP == null) {
|
|
46
46
|
proxyUrl.protocol = request.headers.get("x-forwarded-proto") ?? request.nextUrl.protocol;
|
|
47
47
|
} else {
|
|
48
48
|
proxyUrl.protocol = "http";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/next/api-handler/handlers/proxy-draft-mode.ts"],"sourcesContent":["import { NextApiRequest, NextApiResponse } from 'next'\nimport { NextRequest, NextResponse } from 'next/server'\nimport { P, match } from 'ts-pattern'\nimport { cookies, draftMode } from 'next/headers'\n\nimport { MAKESWIFT_DRAFT_MODE_DATA_COOKIE, MakeswiftDraftData } from '../../draft-mode'\nimport { MakeswiftSiteVersion } from '../../preview-mode'\n\ntype Context = { params: { [key: string]: string | string[] } }\n\ntype ProxyDraftModeError = string\n\ntype ProxyResponse = { __brand: 'ProxyResponse' }\n\nexport type ProxyDraftModeResponse = ProxyDraftModeError | ProxyResponse\n\ntype ProxyDraftModeHandlerArgs =\n | [request: NextRequest, context: Context, params: { apiKey: string }]\n | [req: NextApiRequest, res: NextApiResponse<ProxyDraftModeResponse>, params: { apiKey: string }]\n\nconst routeHandlerPattern = [P.instanceOf(Request), P.any, P.any] as const\nconst apiRoutePattern = [P.any, P.any, P.any] as const\n\nexport default async function proxyDraftMode(\n request: NextRequest,\n context: Context,\n { apiKey }: { apiKey: string },\n): Promise<NextResponse<ProxyDraftModeResponse>>\nexport default async function proxyDraftMode(\n req: NextApiRequest,\n res: NextApiResponse<ProxyDraftModeResponse>,\n { apiKey }: { apiKey: string },\n): Promise<void>\nexport default async function proxyDraftMode(\n ...args: ProxyDraftModeHandlerArgs\n): Promise<NextResponse<ProxyDraftModeResponse> | void> {\n return match(args)\n .with(routeHandlerPattern, args => proxyDraftModeRouteHandler(...args))\n .with(apiRoutePattern, args => proxyDraftModeApiRouteHandler(...args))\n .exhaustive()\n}\n\nasync function proxyDraftModeRouteHandler(\n request: NextRequest,\n _context: Context,\n { apiKey }: { apiKey: string },\n): Promise<NextResponse<ProxyDraftModeResponse>> {\n const secret =\n request.nextUrl.searchParams.get('x-makeswift-draft-mode') ??\n request.headers.get('X-Makeswift-Draft-Mode')\n\n if (secret !== apiKey) return new NextResponse('Unauthorized', { status: 401 })\n\n const draftModeData: MakeswiftDraftData = {\n makeswift: true,\n siteVersion: MakeswiftSiteVersion.Working,\n }\n\n const draft = await draftMode()\n draft.enable()\n\n const proxyUrl = request.nextUrl.clone()\n\n if (process.env.
|
|
1
|
+
{"version":3,"sources":["../../../../../src/next/api-handler/handlers/proxy-draft-mode.ts"],"sourcesContent":["import { NextApiRequest, NextApiResponse } from 'next'\nimport { NextRequest, NextResponse } from 'next/server'\nimport { P, match } from 'ts-pattern'\nimport { cookies, draftMode } from 'next/headers'\n\nimport { MAKESWIFT_DRAFT_MODE_DATA_COOKIE, MakeswiftDraftData } from '../../draft-mode'\nimport { MakeswiftSiteVersion } from '../../preview-mode'\n\ntype Context = { params: { [key: string]: string | string[] } }\n\ntype ProxyDraftModeError = string\n\ntype ProxyResponse = { __brand: 'ProxyResponse' }\n\nexport type ProxyDraftModeResponse = ProxyDraftModeError | ProxyResponse\n\ntype ProxyDraftModeHandlerArgs =\n | [request: NextRequest, context: Context, params: { apiKey: string }]\n | [req: NextApiRequest, res: NextApiResponse<ProxyDraftModeResponse>, params: { apiKey: string }]\n\nconst routeHandlerPattern = [P.instanceOf(Request), P.any, P.any] as const\nconst apiRoutePattern = [P.any, P.any, P.any] as const\n\nexport default async function proxyDraftMode(\n request: NextRequest,\n context: Context,\n { apiKey }: { apiKey: string },\n): Promise<NextResponse<ProxyDraftModeResponse>>\nexport default async function proxyDraftMode(\n req: NextApiRequest,\n res: NextApiResponse<ProxyDraftModeResponse>,\n { apiKey }: { apiKey: string },\n): Promise<void>\nexport default async function proxyDraftMode(\n ...args: ProxyDraftModeHandlerArgs\n): Promise<NextResponse<ProxyDraftModeResponse> | void> {\n return match(args)\n .with(routeHandlerPattern, args => proxyDraftModeRouteHandler(...args))\n .with(apiRoutePattern, args => proxyDraftModeApiRouteHandler(...args))\n .exhaustive()\n}\n\nasync function proxyDraftModeRouteHandler(\n request: NextRequest,\n _context: Context,\n { apiKey }: { apiKey: string },\n): Promise<NextResponse<ProxyDraftModeResponse>> {\n const secret =\n request.nextUrl.searchParams.get('x-makeswift-draft-mode') ??\n request.headers.get('X-Makeswift-Draft-Mode')\n\n if (secret !== apiKey) return new NextResponse('Unauthorized', { status: 401 })\n\n const draftModeData: MakeswiftDraftData = {\n makeswift: true,\n siteVersion: MakeswiftSiteVersion.Working,\n }\n\n const draft = await draftMode()\n draft.enable()\n\n const proxyUrl = request.nextUrl.clone() \n \n if (process.env.FORCE_HTTP == null) {\n proxyUrl.protocol = request.headers.get('x-forwarded-proto') ?? request.nextUrl.protocol\n } else {\n proxyUrl.protocol = 'http'\n }\n\n const forwardingHost = request.headers.get('x-forwarded-host') ?? request.headers.get('host') \n if (forwardingHost) {\n proxyUrl.host = forwardingHost\n }\n \n proxyUrl.searchParams.delete('x-makeswift-draft-mode')\n\n const proxyHeaders = new Headers(request.headers)\n proxyHeaders.delete('X-Makeswift-Draft-Mode')\n\n const proxyRequest = new NextRequest(proxyUrl, { headers: proxyHeaders })\n const draftModeCookie = (await cookies()).get('__prerender_bypass')\n if (draftModeCookie) {\n proxyRequest.cookies.set(draftModeCookie)\n proxyRequest.cookies.set(MAKESWIFT_DRAFT_MODE_DATA_COOKIE, JSON.stringify(draftModeData))\n }\n\n draft.disable()\n\n const proxyResponse = await fetch(proxyRequest)\n\n const response = new NextResponse<ProxyResponse>(proxyResponse.body, {\n headers: proxyResponse.headers,\n status: proxyResponse.status,\n })\n\n // `fetch` automatically decompresses the response, but the response headers will keep the\n // `content-encoding` and `content-length` headers. This will cause decoding issues if the client\n // attempts to decompress the response again. To prevent this, we remove these headers.\n //\n // See https://github.com/nodejs/undici/issues/2514.\n if (response.headers.has('content-encoding')) {\n response.headers.delete('content-encoding')\n response.headers.delete('content-length')\n }\n\n return response\n}\n\nasync function proxyDraftModeApiRouteHandler(\n _req: NextApiRequest,\n res: NextApiResponse<ProxyDraftModeResponse>,\n {}: { apiKey: string },\n): Promise<void> {\n const message =\n 'Cannot request draft endpoint from an API handler registered in `pages`. Move your Makeswift API handler to the `app` directory'\n console.error(message)\n return res.status(500).send(message)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,oBAA0C;AAC1C,wBAAyB;AACzB,qBAAmC;AAEnC,wBAAqE;AACrE,0BAAqC;AAcrC,MAAM,sBAAsB,CAAC,oBAAE,WAAW,OAAO,GAAG,oBAAE,KAAK,oBAAE,GAAG;AAChE,MAAM,kBAAkB,CAAC,oBAAE,KAAK,oBAAE,KAAK,oBAAE,GAAG;AAY5C,eAAO,kBACF,MACmD;AACtD,aAAO,yBAAM,IAAI,EACd,KAAK,qBAAqB,CAAAA,UAAQ,2BAA2B,GAAGA,KAAI,CAAC,EACrE,KAAK,iBAAiB,CAAAA,UAAQ,8BAA8B,GAAGA,KAAI,CAAC,EACpE,WAAW;AAChB;AAEA,eAAe,2BACb,SACA,UACA,EAAE,OAAO,GACsC;AAC/C,QAAM,SACJ,QAAQ,QAAQ,aAAa,IAAI,wBAAwB,KACzD,QAAQ,QAAQ,IAAI,wBAAwB;AAE9C,MAAI,WAAW;AAAQ,WAAO,IAAI,2BAAa,gBAAgB,EAAE,QAAQ,IAAI,CAAC;AAE9E,QAAM,gBAAoC;AAAA,IACxC,WAAW;AAAA,IACX,aAAa,yCAAqB;AAAA,EACpC;AAEA,QAAM,QAAQ,UAAM,0BAAU;AAC9B,QAAM,OAAO;AAEb,QAAM,WAAW,QAAQ,QAAQ,MAAM;AAEvC,MAAI,QAAQ,IAAI,cAAc,MAAM;AAClC,aAAS,WAAW,QAAQ,QAAQ,IAAI,mBAAmB,KAAK,QAAQ,QAAQ;AAAA,EAClF,OAAO;AACL,aAAS,WAAW;AAAA,EACtB;AAEA,QAAM,iBAAiB,QAAQ,QAAQ,IAAI,kBAAkB,KAAK,QAAQ,QAAQ,IAAI,MAAM;AAC5F,MAAI,gBAAgB;AAClB,aAAS,OAAO;AAAA,EAClB;AAEA,WAAS,aAAa,OAAO,wBAAwB;AAErD,QAAM,eAAe,IAAI,QAAQ,QAAQ,OAAO;AAChD,eAAa,OAAO,wBAAwB;AAE5C,QAAM,eAAe,IAAI,0BAAY,UAAU,EAAE,SAAS,aAAa,CAAC;AACxE,QAAM,mBAAmB,UAAM,wBAAQ,GAAG,IAAI,oBAAoB;AAClE,MAAI,iBAAiB;AACnB,iBAAa,QAAQ,IAAI,eAAe;AACxC,iBAAa,QAAQ,IAAI,oDAAkC,KAAK,UAAU,aAAa,CAAC;AAAA,EAC1F;AAEA,QAAM,QAAQ;AAEd,QAAM,gBAAgB,MAAM,MAAM,YAAY;AAE9C,QAAM,WAAW,IAAI,2BAA4B,cAAc,MAAM;AAAA,IACnE,SAAS,cAAc;AAAA,IACvB,QAAQ,cAAc;AAAA,EACxB,CAAC;AAOD,MAAI,SAAS,QAAQ,IAAI,kBAAkB,GAAG;AAC5C,aAAS,QAAQ,OAAO,kBAAkB;AAC1C,aAAS,QAAQ,OAAO,gBAAgB;AAAA,EAC1C;AAEA,SAAO;AACT;AAEA,eAAe,8BACb,MACA,KACA,CAAC,GACc;AACf,QAAM,UACJ;AACF,UAAQ,MAAM,OAAO;AACrB,SAAO,IAAI,OAAO,GAAG,EAAE,KAAK,OAAO;AACrC;","names":["args"]}
|
package/dist/cjs/next/client.js
CHANGED
|
@@ -451,11 +451,11 @@ Received "${apiKey}" instead.`
|
|
|
451
451
|
const canAttemptLocaleFallback = !baseLocaleWasRequested && allowLocaleFallback;
|
|
452
452
|
let response;
|
|
453
453
|
const responseForRequestedLocale = await this.fetch(
|
|
454
|
-
`v1/element-trees/${
|
|
454
|
+
`v1/element-trees/${id}?${searchParams.toString()}`,
|
|
455
455
|
siteVersion
|
|
456
456
|
);
|
|
457
457
|
if (responseForRequestedLocale.status === 404 && canAttemptLocaleFallback) {
|
|
458
|
-
response = await this.fetch(`v1/element-trees/${
|
|
458
|
+
response = await this.fetch(`v1/element-trees/${id}`, siteVersion);
|
|
459
459
|
} else {
|
|
460
460
|
response = responseForRequestedLocale;
|
|
461
461
|
}
|