@preprio/prepr-nextjs 1.0.1 → 1.1.0

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/README.md CHANGED
@@ -105,17 +105,9 @@ const getData = async () => {
105
105
  The preview bar component fetches all segments from the Prepr API. So, you need to give it access to do this as follows:
106
106
 
107
107
  1. In your Prepr environment, go to the **Settings → Access tokens** page to view all the access tokens.
108
- 2. Click the **Add access token** button to create a new access token, give it a name and choose the segments scope like in the image below.
108
+ 2. Click the *GraphQL Preview* access token to open it and tick the **Enable edit mode** checkbox and click the **Save** button.
109
109
 
110
- ![Segments access token](https://assets-site.prepr.io//2mcoy87hhmfz-segments-access-token.png)
111
-
112
- 3. Click the **Save** button and copy the generated *Access token*.
113
-
114
- 4. Add a new variable `PREPR_SEGMENTS_ACCESS_TOKEN` to the `.env` file and paste the value you just copied.
115
-
116
- ```bash
117
- PREPR_SEGMENTS_ACCESS_TOKEN=<YOUR-SEGMENTS-ACCESS-TOKEN>
118
- ```
110
+ ![Preview access token](https://assets-site.prepr.io/229kaekn7m96//preview-access-token-enable-edit-mode.png)
119
111
 
120
112
  To implement the *Adaptive Preview Bar* component, navigate to your root layout file, this is usually `layout.tsx`.
121
113
 
@@ -132,7 +124,7 @@ import '@preprio/prepr-nextjs/dist/components.css'
132
124
 
133
125
  export default async function RootLayout({children}: {children: React.ReactNode}) {
134
126
  // Get the props for the PreviewBar component, pass the access token as an argument
135
- const previewBarProps = await getPreviewBarProps(process.env.PREPR_SEGMENTS_ACCESS_TOKEN)
127
+ const previewBarProps = await getPreviewBarProps(process.env.PREPR_GRAPHQL_URL)
136
128
 
137
129
  return (
138
130
  <html>
@@ -1,9 +1,10 @@
1
1
  import React from 'react';
2
+ import { P as PreprSegment } from './types-DmITW6Tn.mjs';
2
3
 
3
4
  declare function PreprPreviewBar(props: {
4
5
  activeSegment?: string | null;
5
6
  activeVariant?: string | null;
6
- data?: any;
7
+ data?: PreprSegment[];
7
8
  }): React.JSX.Element;
8
9
 
9
10
  export { PreprPreviewBar };
@@ -1,9 +1,10 @@
1
1
  import React from 'react';
2
+ import { P as PreprSegment } from './types-DmITW6Tn.js';
2
3
 
3
4
  declare function PreprPreviewBar(props: {
4
5
  activeSegment?: string | null;
5
6
  activeVariant?: string | null;
6
- data?: any;
7
+ data?: PreprSegment[];
7
8
  }): React.JSX.Element;
8
9
 
9
10
  export { PreprPreviewBar };
@@ -133,28 +133,29 @@ function InfoPopover({ title, text }) {
133
133
  var import_clsx = require("clsx");
134
134
  function PreprPreviewBar(props) {
135
135
  const { activeSegment, activeVariant, data } = props;
136
- const [segmentList, setSegmentList] = (0, import_react5.useState)(data == null ? void 0 : data.items);
136
+ const [segmentList, setSegmentList] = (0, import_react5.useState)(data);
137
137
  const [isToggled, setIsToggled] = (0, import_react5.useState)(false);
138
138
  const searchParams = (0, import_navigation.useSearchParams)();
139
+ console.log("SEGMENTS:", segmentList);
139
140
  if (searchParams.get("prepr_hide_bar") === "true") {
140
141
  return null;
141
142
  }
142
143
  if (typeof window !== "undefined" && (window == null ? void 0 : window.parent) !== window.self) {
143
144
  return null;
144
145
  }
145
- if (segmentList && segmentList[0] && segmentList[0].reference_id !== "null") {
146
+ if (segmentList && segmentList[0] && segmentList[0]._id !== "null") {
146
147
  setSegmentList([
147
148
  {
148
- id: "null",
149
- reference_id: "null",
150
- body: "All other users"
149
+ _id: "null",
150
+ name: "All other users"
151
151
  },
152
152
  ...segmentList
153
153
  ]);
154
154
  }
155
155
  const emptyVariant = "A";
156
156
  const emptySegment = {
157
- body: "Choose segment"
157
+ name: "Choose segment",
158
+ _id: "null"
158
159
  };
159
160
  (0, import_react5.useEffect)(() => {
160
161
  if (!window) {
@@ -166,7 +167,7 @@ function PreprPreviewBar(props) {
166
167
  });
167
168
  const [selectedSegment, setSelectedSegment] = (0, import_react5.useState)(
168
169
  segmentList && segmentList.filter(
169
- (segmentData) => segmentData === activeSegment
170
+ (segmentData) => segmentData.name === activeSegment
170
171
  )[0] || emptySegment
171
172
  );
172
173
  const [selectedVariant, setSelectedVariant] = (0, import_react5.useState)(
@@ -182,7 +183,7 @@ function PreprPreviewBar(props) {
182
183
  }
183
184
  if (key === "prepr_preview_segment" && value) {
184
185
  setSelectedSegment(value);
185
- params.set(key, value.reference_id);
186
+ params.set(key, value._id);
186
187
  }
187
188
  for (const [key2, value2] of params.entries()) {
188
189
  if (value2 === "null" || value2 === null || value2 === void 0) {
@@ -226,7 +227,7 @@ function PreprPreviewBar(props) {
226
227
  )), /* @__PURE__ */ import_react5.default.createElement(
227
228
  import_react6.Listbox,
228
229
  {
229
- value: selectedSegment.slug,
230
+ value: selectedSegment._id,
230
231
  onChange: (value) => handleSearchParams(
231
232
  "prepr_preview_segment",
232
233
  value
@@ -248,7 +249,7 @@ function PreprPreviewBar(props) {
248
249
  },
249
250
  className: "prp-w-full prp-overflow-hidden prp-mr-auto"
250
251
  },
251
- segmentList.length > 0 ? selectedSegment.body : "No segments"
252
+ segmentList.length > 0 ? selectedSegment.name : "No segments"
252
253
  ),
253
254
  /* @__PURE__ */ import_react5.default.createElement("div", { className: "prp-text-gray-400" }, /* @__PURE__ */ import_react5.default.createElement(import_fa62.FaCaretDown, { className: "prp-w-3" }))
254
255
  ),
@@ -258,38 +259,40 @@ function PreprPreviewBar(props) {
258
259
  anchor: "top start",
259
260
  className: "prp-z-[9999] prp-rounded-md prp-bg-white prp-h-1/3 prp-mt-2 prp-shadow-xl"
260
261
  },
261
- segmentList == null ? void 0 : segmentList.map((segment) => /* @__PURE__ */ import_react5.default.createElement(
262
- import_react6.ListboxOption,
263
- {
264
- key: segment.id,
265
- value: segment,
266
- className: (0, import_clsx.clsx)(
267
- "prp-flex prp-items-center prp-p-2 prp-regular-text prp-z-[100] hover:prp-cursor-pointer prp-w-full prp-pr-4",
268
- segment.reference_id === selectedSegment.reference_id ? "prp-bg-indigo-50 prp-text-indigo-700" : "hover:prp-bg-gray-100 prp-bg-white prp-text-gray-900"
269
- )
270
- },
271
- /* @__PURE__ */ import_react5.default.createElement(
272
- import_fa62.FaCheck,
262
+ segmentList == null ? void 0 : segmentList.map(
263
+ (segment) => /* @__PURE__ */ import_react5.default.createElement(
264
+ import_react6.ListboxOption,
273
265
  {
266
+ key: segment._id,
267
+ value: segment,
274
268
  className: (0, import_clsx.clsx)(
275
- "prp-size-3 prp-shrink-0 prp-mr-1",
276
- segment.reference_id === selectedSegment.reference_id ? "prp-visible" : "prp-invisible"
269
+ "prp-flex prp-items-center prp-p-2 prp-regular-text prp-z-[100] hover:prp-cursor-pointer prp-w-full prp-pr-4",
270
+ segment._id === selectedSegment._id ? "prp-bg-indigo-50 prp-text-indigo-700" : "hover:prp-bg-gray-100 prp-bg-white prp-text-gray-900"
277
271
  )
278
- }
279
- ),
280
- /* @__PURE__ */ import_react5.default.createElement(
281
- "div",
282
- {
283
- style: {
284
- textWrap: "nowrap",
285
- textOverflow: "ellipsis",
286
- textAlign: "left"
287
- },
288
- className: "prp-w-full prp-overflow-hidden prp-mr-auto"
289
272
  },
290
- segment.body
273
+ /* @__PURE__ */ import_react5.default.createElement(
274
+ import_fa62.FaCheck,
275
+ {
276
+ className: (0, import_clsx.clsx)(
277
+ "prp-size-3 prp-shrink-0 prp-mr-1",
278
+ segment._id === selectedSegment._id ? "prp-visible" : "prp-invisible"
279
+ )
280
+ }
281
+ ),
282
+ /* @__PURE__ */ import_react5.default.createElement(
283
+ "div",
284
+ {
285
+ style: {
286
+ textWrap: "nowrap",
287
+ textOverflow: "ellipsis",
288
+ textAlign: "left"
289
+ },
290
+ className: "prp-w-full prp-overflow-hidden prp-mr-auto"
291
+ },
292
+ segment.name
293
+ )
291
294
  )
292
- ))
295
+ )
293
296
  )
294
297
  )), /* @__PURE__ */ import_react5.default.createElement("div", { className: "prp-flex prp-flex-initial prp-flex-col md:prp-flex-row prp-gap-2 md:prp-gap-4" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "prp-regular-text prp-text-white prp-items-center prp-gap-2 prp-hidden lg:prp-flex" }, /* @__PURE__ */ import_react5.default.createElement("span", { className: "prp-pb-0.5 prp-text-xs md:prp-text-base prp-block md:prp-hidden xl:prp-block" }, "Show A/B variant"), /* @__PURE__ */ import_react5.default.createElement(
295
298
  InfoPopover,
@@ -329,7 +332,7 @@ function PreprPreviewBar(props) {
329
332
  ResetButton,
330
333
  {
331
334
  handleClick: handleReset,
332
- enabled: selectedSegment.reference_id || selectedVariant !== "A"
335
+ enabled: selectedSegment._id !== "null" || selectedVariant !== "A"
333
336
  }
334
337
  ))))
335
338
  ), /* @__PURE__ */ import_react5.default.createElement(
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components.ts","../src/components/PreprPreviewBar.tsx","../src/components/PreprLogo.tsx","../src/components/ResetButton.tsx","../src/components/InfoPopover.tsx"],"sourcesContent":["'use client'\n\nimport \"./main.css\"\nimport {PreprPreviewBar} from './components/PreprPreviewBar'\n\nexport {PreprPreviewBar}","'use client'\n\nimport { usePathname, useRouter, useSearchParams } from 'next/navigation'\nimport React, { useEffect, useState } from 'react'\n\nimport '../main.css'\nimport PreprLogo from './PreprLogo'\nimport ResetButton from './ResetButton'\nimport {\n Listbox,\n ListboxButton,\n ListboxOption,\n ListboxOptions,\n Radio,\n RadioGroup,\n} from '@headlessui/react'\nimport { FaCaretDown, FaCheck } from 'react-icons/fa6'\nimport InfoPopover from './InfoPopover'\nimport { clsx } from 'clsx'\n\nexport function PreprPreviewBar(props: {\n activeSegment?: string | null\n activeVariant?: string | null\n data?: any\n}) {\n const { activeSegment, activeVariant, data } = props\n const [segmentList, setSegmentList] = useState<any>(data?.items)\n const [isToggled, setIsToggled] = useState<boolean>(false)\n const searchParams = useSearchParams()\n\n if (searchParams.get('prepr_hide_bar') === 'true') {\n return null\n }\n\n // Hide the preview bar if not on the client or if the page is in an iframe\n if (typeof window !== 'undefined' && window?.parent !== window.self) {\n return null\n }\n\n if (\n segmentList &&\n segmentList[0] &&\n segmentList[0].reference_id !== 'null'\n ) {\n setSegmentList([\n {\n id: 'null',\n reference_id: 'null',\n body: 'All other users',\n },\n ...segmentList,\n ])\n }\n\n const emptyVariant = 'A'\n const emptySegment = {\n body: 'Choose segment',\n }\n\n useEffect(() => {\n if (!window) {\n return\n }\n\n if (window.localStorage.getItem('isToggled')) {\n setIsToggled(window.localStorage.getItem('isToggled') === 'true')\n }\n })\n\n const [selectedSegment, setSelectedSegment] = useState(\n (segmentList &&\n segmentList.filter(\n (segmentData: any) => segmentData === activeSegment\n )[0]) ||\n emptySegment\n )\n\n const [selectedVariant, setSelectedVariant] = useState<string | null>(\n activeVariant || 'A'\n )\n\n const router = useRouter()\n const pathname = usePathname()\n\n const handleSearchParams = (key: string, value: any) => {\n const params = new URLSearchParams(window.location.search)\n\n if (key === 'prepr_preview_ab') {\n setSelectedVariant(value)\n params.set(key, value as string)\n }\n if (key === 'prepr_preview_segment' && value) {\n setSelectedSegment(value)\n params.set(key, value.reference_id as string)\n }\n\n // Remove parameters with value \"null\"\n for (const [key, value] of params.entries()) {\n if (value === 'null' || value === null || value === undefined) {\n params.delete(key)\n }\n }\n\n router.push(`${pathname}?${params.toString()}`, {\n scroll: false,\n })\n router.refresh()\n }\n\n const handleToggle = () => {\n setIsToggled(!isToggled)\n window.localStorage.setItem('isToggled', String(!isToggled))\n }\n\n const handleReset = () => {\n setSelectedSegment(emptySegment)\n setSelectedVariant(emptyVariant)\n\n const params = new URLSearchParams({})\n params.append('prepr_preview_segment', 'null')\n params.append('prepr_preview_ab', 'null')\n\n router.push(`${pathname}?${params.toString()}`, {\n scroll: false,\n })\n router.refresh()\n }\n\n return (\n <div className=\"prp-z-[999] prp-isolate prp-flex prp-base prp-w-full prp-sticky prp-top-0\">\n <div\n className={clsx(\n 'prp-py-4 prp-px-5 prp-bg-purple-900 prp-w-full prp-overflow-hidden',\n isToggled ? 'prp-sticky prp-top-0' : 'prp-hidden'\n )}\n >\n <div className=\"prp-flex prp-max-w-7xl prp-mx-auto prp-gap-y-4 prp-h-full prp-gap-x-6 prp-flex-col sm:prp-flex-row prp-flex-wrap\">\n <div className=\"prp-flex prp-gap-6 prp-items-center\">\n <div className=\"prp-h-full prp-flex prp-justify-center prp-items-center\">\n <PreprLogo />\n </div>\n <div className=\"prp-hidden lg:prp-block prp-pb-0.5 prp-text-white prp-text-lg prp-text-bold\">\n Adaptive Preview\n </div>\n </div>\n\n <div className=\"prp-flex prp-flex-wrap prp-gap-2 md:prp-gap-4 prp-ml-0 sm:prp-ml-auto md:prp-items-center\">\n <div className=\"prp-flex prp-flex-col md:prp-flex-row prp-gap-2 md:prp-gap-4 prp-flex-1\">\n <div className=\"prp-regular-text prp-text-white prp-items-center prp-gap-2 prp-hidden lg:prp-flex\">\n <span className=\"prp-pb-0.5 prp-text-xs md:prp-text-base prp-block md:prp-hidden xl:prp-block\">\n Apply segment\n </span>\n <InfoPopover\n title={'Adaptive Preview'}\n text={\n \"Choose a segment to see how it's displayed.\"\n }\n />\n </div>\n\n <Listbox\n value={selectedSegment.slug}\n onChange={(value: any) =>\n handleSearchParams(\n 'prepr_preview_segment',\n value\n )\n }\n >\n <ListboxButton\n disabled={!(segmentList.length > 0)}\n className=\"disabled:prp-cursor-not-allowed disabled:prp-text-gray-400 disabled:prp-bg-gray-200 prp-h-10 prp-flex prp-gap-2 prp-w-full md:prp-w-48 prp-flex-nowrap prp-text-nowrap prp-overflow-hidden prp-text-ellipsis prp-rounded-lg data-[open]:prp-border-b-white prp-border prp-border-gray-300 prp-items-center prp-bg-white prp-px-2 md:prp-px-4 prp-regular-text prp-text-gray-500\"\n >\n <div\n style={{\n textWrap: 'nowrap',\n textOverflow: 'ellipsis',\n textAlign: 'left',\n }}\n className=\"prp-w-full prp-overflow-hidden prp-mr-auto\"\n >\n {segmentList.length > 0\n ? selectedSegment.body\n : 'No segments'}\n </div>\n <div className=\"prp-text-gray-400\">\n <FaCaretDown className=\"prp-w-3\" />\n </div>\n </ListboxButton>\n <ListboxOptions\n anchor=\"top start\"\n className=\"prp-z-[9999] prp-rounded-md prp-bg-white prp-h-1/3 prp-mt-2 prp-shadow-xl\"\n >\n {segmentList?.map((segment: any) => (\n <ListboxOption\n key={segment.id}\n value={segment}\n className={clsx(\n 'prp-flex prp-items-center prp-p-2 prp-regular-text prp-z-[100] hover:prp-cursor-pointer prp-w-full prp-pr-4',\n segment.reference_id ===\n selectedSegment.reference_id\n ? 'prp-bg-indigo-50 prp-text-indigo-700'\n : 'hover:prp-bg-gray-100 prp-bg-white prp-text-gray-900'\n )}\n >\n <FaCheck\n className={clsx(\n 'prp-size-3 prp-shrink-0 prp-mr-1',\n segment.reference_id ===\n selectedSegment.reference_id\n ? 'prp-visible'\n : 'prp-invisible'\n )}\n />\n <div\n style={{\n textWrap: 'nowrap',\n textOverflow: 'ellipsis',\n textAlign: 'left',\n }}\n className=\"prp-w-full prp-overflow-hidden prp-mr-auto\"\n >\n {segment.body}\n </div>\n </ListboxOption>\n ))}\n </ListboxOptions>\n </Listbox>\n </div>\n\n <div className=\"prp-flex prp-flex-initial prp-flex-col md:prp-flex-row prp-gap-2 md:prp-gap-4\">\n <div className=\"prp-regular-text prp-text-white prp-items-center prp-gap-2 prp-hidden lg:prp-flex\">\n <span className=\"prp-pb-0.5 prp-text-xs md:prp-text-base prp-block md:prp-hidden xl:prp-block\">\n Show A/B variant\n </span>\n <InfoPopover\n title={'A/B Testing'}\n text={\n 'Choose between two different versions of a page to see which one performs better.'\n }\n />\n </div>\n\n <RadioGroup\n className=\"prp-rounded-lg prp-p-1 prp-mr-auto prp-border prp-border-gray-300 prp-bg-white prp-flex prp-gap-1 prp-h-10 prp-items-center\"\n value={selectedVariant}\n onChange={(value: any) =>\n handleSearchParams(\n 'prepr_preview_ab',\n value\n )\n }\n >\n <Radio\n value={'A'}\n className=\"prp-py-2 prp-px-3 prp-rounded-md prp-text-gray-900 prp-regular-text data-[checked]:prp-dropshadow\n data-[checked]:prp-bg-indigo-600 data-[checked]:prp-text-white prp-h-8 prp-text-center prp-flex prp-items-center hover:prp-cursor-pointer\n \"\n >\n <span className=\"prp-hidden md:prp-inline prp-mr-1\">\n Variant{' '}\n </span>\n A\n </Radio>\n <Radio\n value={'B'}\n className=\"prp-py-2 prp-px-3 prp-rounded-md prp-text-gray-900 prp-regular-text data-[checked]:prp-dropshadow\n data-[checked]:prp-bg-indigo-600 data-[checked]:prp-text-white prp-h-8 prp-text-center prp-flex prp-items-center hover:prp-cursor-pointer\n \"\n >\n <span className=\"prp-hidden md:prp-inline prp-mr-1\">\n Variant{' '}\n </span>\n B\n </Radio>\n </RadioGroup>\n </div>\n\n <div className=\"prp-flex prp-flex-initial prp-mt-auto md:prp-h-full\">\n <ResetButton\n handleClick={handleReset}\n enabled={\n selectedSegment.reference_id ||\n selectedVariant !== 'A'\n }\n />\n </div>\n </div>\n </div>\n </div>\n <div\n className={clsx(\n 'prp-w-full prp-flex',\n isToggled\n ? '-prp-bottom-6 prp-absolute'\n : 'prp-top-0 prp-fixed'\n )}\n >\n <div\n className={clsx(\n 'prp-w-auto prp-mx-auto prp-flex prp-items-center prp-border-t-2 prp-border-purple-900'\n )}\n >\n <div\n className={`prp-relative prp-z-[100] prp-mx-auto prp-bg-purple-900 prp-regular-text prp-text-white prp-px-2 prp-py-0.5 prp-rounded-b-lg prp-flex prp-items-center prp-cursor-pointer`}\n onClick={handleToggle}\n >\n Adaptive Preview\n {isToggled ? (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 512 512\"\n className=\"prp-size-3 prp-fill-white prp-ml-2\"\n >\n <path d=\"M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z\" />\n </svg>\n ) : (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 512 512\"\n className=\"prp-size-3 prp-fill-white prp-ml-2\"\n >\n <path d=\"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z\" />\n </svg>\n )}\n </div>\n </div>\n </div>\n </div>\n )\n}\n","import React from \"react\";\n\nexport default function PreprLogo() {\n return (\n <svg width=\"75\" height=\"20\" viewBox=\"0 0 75 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M28.8527 1.56704C28.8588 1.55728 28.8647 1.54752 28.8701 1.53728L28.872 1.53392C28.872 1.53392 28.8719 1.53376 28.8718 1.5337C28.9044 1.47094 28.9231 1.4001 28.9231 1.32481C28.9231 1.15609 28.8307 1.00899 28.6932 0.928662C28.6918 0.927198 28.6902 0.924705 28.6888 0.923892C25.7969 -0.628737 21.9356 -0.26169 19.3787 2.32725C17.9433 3.78059 17.2104 5.64985 17.1726 7.52828H17.1702V14.903C17.1702 14.9031 17.1702 14.9031 17.1702 14.9031C17.1702 15.1575 17.3798 15.3639 17.6384 15.3639H19.8237C20.0823 15.3639 20.292 15.1575 20.292 14.9031C20.292 14.9031 20.292 14.9031 20.292 14.903V7.68194H20.2932C20.2931 6.52406 20.7324 5.36498 21.617 4.4692C23.1961 2.8704 25.5272 2.75034 27.1344 3.59213C27.1394 3.59484 27.1446 3.59728 27.1496 3.59988C27.1532 3.60178 27.1569 3.60346 27.1605 3.60541L27.161 3.6053C27.2219 3.63376 27.2898 3.65018 27.3617 3.65018C27.5444 3.65018 27.7024 3.54676 27.7796 3.39641L28.8527 1.56704Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M7.80452 0C3.49433 0 0 3.43924 0 7.68195V19.5124C0 19.7667 0.209581 19.9732 0.468282 19.9732H2.65358C2.65363 19.9732 2.65363 19.9732 2.65363 19.9732C2.91222 19.9732 3.12186 19.7667 3.12186 19.5124V13.8279C4.42627 14.7924 6.04758 15.364 7.80457 15.364C12.1147 15.364 15.6094 11.9247 15.6094 7.68206C15.6094 3.4393 12.1147 0 7.80452 0ZM7.80457 12.2912C5.21845 12.2912 3.12186 10.2275 3.12186 7.68195C3.12186 5.13631 5.21845 3.07279 7.80457 3.07279C10.3906 3.07279 12.4874 5.13631 12.4874 7.68195C12.4874 10.2275 10.3906 12.2912 7.80457 12.2912Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M53.8288 0C49.5187 0 46.0243 3.43924 46.0243 7.68195V19.5124C46.0243 19.7667 46.2339 19.9731 46.4926 19.9732H48.6779C48.9365 19.9732 49.1462 19.7667 49.1462 19.5124V13.828C50.4506 14.7924 52.0719 15.364 53.8289 15.364C58.139 15.364 61.6337 11.9247 61.6337 7.68211C61.6337 3.4393 58.139 0 53.8288 0ZM53.8289 12.2912C51.2427 12.2912 49.1462 10.2276 49.1462 7.68195C49.1462 5.13631 51.2427 3.07279 53.8289 3.07279C56.4149 3.07279 58.5117 5.13631 58.5117 7.68195C58.5117 10.2276 56.4149 12.2912 53.8289 12.2912Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M44.4094 7.83561C44.4094 3.59285 40.9148 0 36.6046 0C32.2944 0 28.8 3.4393 28.8 7.68206C28.8 11.9247 32.2944 15.364 36.6046 15.364C39.0444 15.364 41.0568 14.2635 42.3189 12.9136C42.3191 12.9135 42.3193 12.9133 42.3194 12.9132C42.3204 12.9121 42.3214 12.9112 42.3224 12.9101V12.91C42.4051 12.8268 42.4563 12.7131 42.4563 12.5876C42.4563 12.4549 42.3989 12.3357 42.3077 12.2515V12.2509L42.3012 12.2456C42.2893 12.2351 42.2769 12.2251 42.2639 12.2158L40.5942 10.8782C40.5118 10.8069 40.4041 10.7634 40.2857 10.7634C40.1386 10.7634 40.0075 10.8302 39.9217 10.9346C39.1801 11.6777 38.0073 12.2911 36.6047 12.2911C34.0186 12.2911 31.922 10.2275 31.922 7.68184C31.922 5.13621 34.0186 3.07268 36.6047 3.07268C38.6433 3.07268 40.377 4.3555 41.02 6.14547H36.9949C36.7362 6.14553 36.5266 6.35187 36.5266 6.6064L36.5265 8.75734C36.5265 9.01182 36.7361 9.21827 36.9949 9.21827H43.7851C43.7978 9.21827 43.8104 9.21734 43.823 9.21637C43.8356 9.2174 43.8481 9.21827 43.8608 9.21827C44.0687 9.21827 44.2449 9.08466 44.3059 8.90011L44.3113 8.90098C44.314 8.88434 44.3166 8.86829 44.3192 8.85219C44.3225 8.83653 44.325 8.8206 44.3268 8.80434C44.3809 8.46076 44.4094 8.21572 44.4094 7.83561Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M74.8943 1.53668L74.8963 1.53332C74.8963 1.53332 74.8962 1.53316 74.8961 1.53311C74.9287 1.47034 74.9474 1.3995 74.9474 1.32422C74.9474 1.15549 74.855 1.00839 74.7175 0.928067C74.7161 0.926603 74.7145 0.92411 74.7131 0.923297C71.8212 -0.629332 67.9599 -0.26234 65.403 2.32666C63.9676 3.77999 63.2347 5.64926 63.1969 7.52769H63.1945V14.9024C63.1945 14.9025 63.1945 14.9025 63.1945 14.9025C63.1945 15.1569 63.4041 15.3634 63.6627 15.3634H65.8481C66.1066 15.3634 66.3164 15.1569 66.3164 14.9025C66.3164 14.9025 66.3164 14.9025 66.3164 14.9024V7.68135H66.3175C66.3174 6.52346 66.7567 5.36438 67.6414 4.46861C69.2204 2.8698 71.5515 2.74975 73.1587 3.59154C73.1637 3.59425 73.1689 3.59668 73.174 3.59929C73.1776 3.60118 73.1813 3.60286 73.1849 3.60481L73.1854 3.60471C73.2462 3.63316 73.3141 3.64958 73.386 3.64958C73.5688 3.64958 73.7268 3.54617 73.8039 3.39582L74.8769 1.56644C74.8831 1.55668 74.889 1.54687 74.8943 1.53668Z\"\n fill=\"white\"/>\n </svg>\n\n )\n}","import React from 'react'\nimport classNames from 'classnames'\nimport { FaRotate } from 'react-icons/fa6'\n\ninterface ResetButtonProps {\n enabled?: boolean\n handleClick?: () => void\n}\n\nexport default function ResetButton({\n enabled = false,\n handleClick,\n}: ResetButtonProps) {\n const classes = classNames(\n 'prp-py-2 prp-px-3 prp-flex prp-gap-2 prp-items-center rounded-md prp-regular-text prp-h-10',\n enabled &&\n 'prp-bg-orange-400 hover:prp-orange-500 prp-cursor-pointer prp-text-white',\n !enabled && 'prp-bg-grey-400 prp-text-gray-500'\n )\n\n return (\n <button\n onClick={handleClick}\n className={classes}\n disabled={!enabled}\n >\n <FaRotate />\n <span className=\"prp-block sm:prp-hidden lg:prp-block\">Reset</span>\n </button>\n )\n}\n","import { Popover, PopoverButton, PopoverPanel } from '@headlessui/react'\nimport { FaInfoCircle } from 'react-icons/fa'\nimport React from 'react'\n\ninterface InfoPopoverProps {\n title: string\n text: string\n}\n\nexport default function InfoPopover({ title, text }: InfoPopoverProps) {\n return (\n <Popover>\n <PopoverButton className=\"prp-ring-0 focus:prp-ring-0 prp-font-bold prp-text-indigo-300 prp-text-xs hover:prp-text-indigo-400 prp-block\">\n <FaInfoCircle />\n </PopoverButton>\n <PopoverPanel\n transition\n anchor=\"bottom\"\n className=\"prp-z-[1000] prp-p-4\"\n >\n <div className=\" prp-bg-white rounded-lg p-6 prp-dropshadow-popover prp-space-y-3 prp-max-w-[312px]\">\n <span className=\"prp-text-base prp-font-bold prp-leading-tight prp-text-gray-900\">\n {title}\n </span>\n <div className=\"prp-space-y-2\">\n <span className=\"prp-text-sm\">{text}</span>\n </div>\n </div>\n </PopoverPanel>\n </Popover>\n )\n}\n"],"mappings":"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","names":["import_react","React","import_react","classNames","React","import_react","import_fa6","import_react","React","key","value","React"]}
1
+ {"version":3,"sources":["../src/components.ts","../src/components/PreprPreviewBar.tsx","../src/components/PreprLogo.tsx","../src/components/ResetButton.tsx","../src/components/InfoPopover.tsx"],"sourcesContent":["'use client'\n\nimport \"./main.css\"\nimport {PreprPreviewBar} from './components/PreprPreviewBar'\n\nexport {PreprPreviewBar}","'use client'\n\nimport { usePathname, useRouter, useSearchParams } from 'next/navigation'\nimport React, { useEffect, useState } from 'react'\n\nimport '../main.css'\nimport PreprLogo from './PreprLogo'\nimport ResetButton from './ResetButton'\nimport {\n Listbox,\n ListboxButton,\n ListboxOption,\n ListboxOptions,\n Radio,\n RadioGroup,\n} from '@headlessui/react'\nimport { FaCaretDown, FaCheck } from 'react-icons/fa6'\nimport InfoPopover from './InfoPopover'\nimport { clsx } from 'clsx'\nimport { PreprSegment } from '../shared/types'\n\nexport function PreprPreviewBar(props: {\n activeSegment?: string | null\n activeVariant?: string | null\n data?: PreprSegment[]\n}) {\n const { activeSegment, activeVariant, data } = props\n const [segmentList, setSegmentList] = useState<PreprSegment[]>(data)\n const [isToggled, setIsToggled] = useState<boolean>(false)\n const searchParams = useSearchParams()\n\n console.log('SEGMENTS:', segmentList)\n\n if (searchParams.get('prepr_hide_bar') === 'true') {\n return null\n }\n\n // Hide the preview bar if not on the client or if the page is in an iframe\n if (typeof window !== 'undefined' && window?.parent !== window.self) {\n return null\n }\n\n if (segmentList && segmentList[0] && segmentList[0]._id !== 'null') {\n setSegmentList([\n {\n _id: 'null',\n name: 'All other users',\n },\n ...segmentList,\n ])\n }\n\n const emptyVariant = 'A'\n const emptySegment: PreprSegment = {\n name: 'Choose segment',\n _id: 'null',\n }\n\n useEffect(() => {\n if (!window) {\n return\n }\n\n if (window.localStorage.getItem('isToggled')) {\n setIsToggled(window.localStorage.getItem('isToggled') === 'true')\n }\n })\n\n const [selectedSegment, setSelectedSegment] = useState<PreprSegment>(\n (segmentList &&\n segmentList.filter(\n (segmentData: PreprSegment) =>\n segmentData.name === activeSegment\n )[0]) ||\n emptySegment\n )\n\n const [selectedVariant, setSelectedVariant] = useState<string | null>(\n activeVariant || 'A'\n )\n\n const router = useRouter()\n const pathname = usePathname()\n\n const handleSearchParams = (key: string, value: any) => {\n const params = new URLSearchParams(window.location.search)\n\n if (key === 'prepr_preview_ab') {\n setSelectedVariant(value)\n params.set(key, value as string)\n }\n if (key === 'prepr_preview_segment' && value) {\n setSelectedSegment(value)\n params.set(key, value._id as string)\n }\n\n // Remove parameters with value \"null\"\n for (const [key, value] of params.entries()) {\n if (value === 'null' || value === null || value === undefined) {\n params.delete(key)\n }\n }\n\n router.push(`${pathname}?${params.toString()}`, {\n scroll: false,\n })\n router.refresh()\n }\n\n const handleToggle = () => {\n setIsToggled(!isToggled)\n window.localStorage.setItem('isToggled', String(!isToggled))\n }\n\n const handleReset = () => {\n setSelectedSegment(emptySegment)\n setSelectedVariant(emptyVariant)\n\n const params = new URLSearchParams({})\n params.append('prepr_preview_segment', 'null')\n params.append('prepr_preview_ab', 'null')\n\n router.push(`${pathname}?${params.toString()}`, {\n scroll: false,\n })\n router.refresh()\n }\n\n return (\n <div className=\"prp-z-[999] prp-isolate prp-flex prp-base prp-w-full prp-sticky prp-top-0\">\n <div\n className={clsx(\n 'prp-py-4 prp-px-5 prp-bg-purple-900 prp-w-full prp-overflow-hidden',\n isToggled ? 'prp-sticky prp-top-0' : 'prp-hidden'\n )}\n >\n <div className=\"prp-flex prp-max-w-7xl prp-mx-auto prp-gap-y-4 prp-h-full prp-gap-x-6 prp-flex-col sm:prp-flex-row prp-flex-wrap\">\n <div className=\"prp-flex prp-gap-6 prp-items-center\">\n <div className=\"prp-h-full prp-flex prp-justify-center prp-items-center\">\n <PreprLogo />\n </div>\n <div className=\"prp-hidden lg:prp-block prp-pb-0.5 prp-text-white prp-text-lg prp-text-bold\">\n Adaptive Preview\n </div>\n </div>\n\n <div className=\"prp-flex prp-flex-wrap prp-gap-2 md:prp-gap-4 prp-ml-0 sm:prp-ml-auto md:prp-items-center\">\n <div className=\"prp-flex prp-flex-col md:prp-flex-row prp-gap-2 md:prp-gap-4 prp-flex-1\">\n <div className=\"prp-regular-text prp-text-white prp-items-center prp-gap-2 prp-hidden lg:prp-flex\">\n <span className=\"prp-pb-0.5 prp-text-xs md:prp-text-base prp-block md:prp-hidden xl:prp-block\">\n Apply segment\n </span>\n <InfoPopover\n title={'Adaptive Preview'}\n text={\n \"Choose a segment to see how it's displayed.\"\n }\n />\n </div>\n\n <Listbox\n value={selectedSegment._id}\n onChange={(value: any) =>\n handleSearchParams(\n 'prepr_preview_segment',\n value\n )\n }\n >\n <ListboxButton\n disabled={!(segmentList.length > 0)}\n className=\"disabled:prp-cursor-not-allowed disabled:prp-text-gray-400 disabled:prp-bg-gray-200 prp-h-10 prp-flex prp-gap-2 prp-w-full md:prp-w-48 prp-flex-nowrap prp-text-nowrap prp-overflow-hidden prp-text-ellipsis prp-rounded-lg data-[open]:prp-border-b-white prp-border prp-border-gray-300 prp-items-center prp-bg-white prp-px-2 md:prp-px-4 prp-regular-text prp-text-gray-500\"\n >\n <div\n style={{\n textWrap: 'nowrap',\n textOverflow: 'ellipsis',\n textAlign: 'left',\n }}\n className=\"prp-w-full prp-overflow-hidden prp-mr-auto\"\n >\n {segmentList.length > 0\n ? selectedSegment.name\n : 'No segments'}\n </div>\n <div className=\"prp-text-gray-400\">\n <FaCaretDown className=\"prp-w-3\" />\n </div>\n </ListboxButton>\n <ListboxOptions\n anchor=\"top start\"\n className=\"prp-z-[9999] prp-rounded-md prp-bg-white prp-h-1/3 prp-mt-2 prp-shadow-xl\"\n >\n {segmentList?.map(\n (segment: PreprSegment) => (\n <ListboxOption\n key={segment._id}\n value={segment}\n className={clsx(\n 'prp-flex prp-items-center prp-p-2 prp-regular-text prp-z-[100] hover:prp-cursor-pointer prp-w-full prp-pr-4',\n segment._id ===\n selectedSegment._id\n ? 'prp-bg-indigo-50 prp-text-indigo-700'\n : 'hover:prp-bg-gray-100 prp-bg-white prp-text-gray-900'\n )}\n >\n <FaCheck\n className={clsx(\n 'prp-size-3 prp-shrink-0 prp-mr-1',\n segment._id ===\n selectedSegment._id\n ? 'prp-visible'\n : 'prp-invisible'\n )}\n />\n <div\n style={{\n textWrap: 'nowrap',\n textOverflow:\n 'ellipsis',\n textAlign: 'left',\n }}\n className=\"prp-w-full prp-overflow-hidden prp-mr-auto\"\n >\n {segment.name}\n </div>\n </ListboxOption>\n )\n )}\n </ListboxOptions>\n </Listbox>\n </div>\n\n <div className=\"prp-flex prp-flex-initial prp-flex-col md:prp-flex-row prp-gap-2 md:prp-gap-4\">\n <div className=\"prp-regular-text prp-text-white prp-items-center prp-gap-2 prp-hidden lg:prp-flex\">\n <span className=\"prp-pb-0.5 prp-text-xs md:prp-text-base prp-block md:prp-hidden xl:prp-block\">\n Show A/B variant\n </span>\n <InfoPopover\n title={'A/B Testing'}\n text={\n 'Choose between two different versions of a page to see which one performs better.'\n }\n />\n </div>\n\n <RadioGroup\n className=\"prp-rounded-lg prp-p-1 prp-mr-auto prp-border prp-border-gray-300 prp-bg-white prp-flex prp-gap-1 prp-h-10 prp-items-center\"\n value={selectedVariant}\n onChange={(value: any) =>\n handleSearchParams(\n 'prepr_preview_ab',\n value\n )\n }\n >\n <Radio\n value={'A'}\n className=\"prp-py-2 prp-px-3 prp-rounded-md prp-text-gray-900 prp-regular-text data-[checked]:prp-dropshadow\n data-[checked]:prp-bg-indigo-600 data-[checked]:prp-text-white prp-h-8 prp-text-center prp-flex prp-items-center hover:prp-cursor-pointer\n \"\n >\n <span className=\"prp-hidden md:prp-inline prp-mr-1\">\n Variant{' '}\n </span>\n A\n </Radio>\n <Radio\n value={'B'}\n className=\"prp-py-2 prp-px-3 prp-rounded-md prp-text-gray-900 prp-regular-text data-[checked]:prp-dropshadow\n data-[checked]:prp-bg-indigo-600 data-[checked]:prp-text-white prp-h-8 prp-text-center prp-flex prp-items-center hover:prp-cursor-pointer\n \"\n >\n <span className=\"prp-hidden md:prp-inline prp-mr-1\">\n Variant{' '}\n </span>\n B\n </Radio>\n </RadioGroup>\n </div>\n\n <div className=\"prp-flex prp-flex-initial prp-mt-auto md:prp-h-full\">\n <ResetButton\n handleClick={handleReset}\n enabled={\n selectedSegment._id !== 'null' ||\n selectedVariant !== 'A'\n }\n />\n </div>\n </div>\n </div>\n </div>\n <div\n className={clsx(\n 'prp-w-full prp-flex',\n isToggled\n ? '-prp-bottom-6 prp-absolute'\n : 'prp-top-0 prp-fixed'\n )}\n >\n <div\n className={clsx(\n 'prp-w-auto prp-mx-auto prp-flex prp-items-center prp-border-t-2 prp-border-purple-900'\n )}\n >\n <div\n className={`prp-relative prp-z-[100] prp-mx-auto prp-bg-purple-900 prp-regular-text prp-text-white prp-px-2 prp-py-0.5 prp-rounded-b-lg prp-flex prp-items-center prp-cursor-pointer`}\n onClick={handleToggle}\n >\n Adaptive Preview\n {isToggled ? (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 512 512\"\n className=\"prp-size-3 prp-fill-white prp-ml-2\"\n >\n <path d=\"M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z\" />\n </svg>\n ) : (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 512 512\"\n className=\"prp-size-3 prp-fill-white prp-ml-2\"\n >\n <path d=\"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z\" />\n </svg>\n )}\n </div>\n </div>\n </div>\n </div>\n )\n}\n","import React from \"react\";\n\nexport default function PreprLogo() {\n return (\n <svg width=\"75\" height=\"20\" viewBox=\"0 0 75 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M28.8527 1.56704C28.8588 1.55728 28.8647 1.54752 28.8701 1.53728L28.872 1.53392C28.872 1.53392 28.8719 1.53376 28.8718 1.5337C28.9044 1.47094 28.9231 1.4001 28.9231 1.32481C28.9231 1.15609 28.8307 1.00899 28.6932 0.928662C28.6918 0.927198 28.6902 0.924705 28.6888 0.923892C25.7969 -0.628737 21.9356 -0.26169 19.3787 2.32725C17.9433 3.78059 17.2104 5.64985 17.1726 7.52828H17.1702V14.903C17.1702 14.9031 17.1702 14.9031 17.1702 14.9031C17.1702 15.1575 17.3798 15.3639 17.6384 15.3639H19.8237C20.0823 15.3639 20.292 15.1575 20.292 14.9031C20.292 14.9031 20.292 14.9031 20.292 14.903V7.68194H20.2932C20.2931 6.52406 20.7324 5.36498 21.617 4.4692C23.1961 2.8704 25.5272 2.75034 27.1344 3.59213C27.1394 3.59484 27.1446 3.59728 27.1496 3.59988C27.1532 3.60178 27.1569 3.60346 27.1605 3.60541L27.161 3.6053C27.2219 3.63376 27.2898 3.65018 27.3617 3.65018C27.5444 3.65018 27.7024 3.54676 27.7796 3.39641L28.8527 1.56704Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M7.80452 0C3.49433 0 0 3.43924 0 7.68195V19.5124C0 19.7667 0.209581 19.9732 0.468282 19.9732H2.65358C2.65363 19.9732 2.65363 19.9732 2.65363 19.9732C2.91222 19.9732 3.12186 19.7667 3.12186 19.5124V13.8279C4.42627 14.7924 6.04758 15.364 7.80457 15.364C12.1147 15.364 15.6094 11.9247 15.6094 7.68206C15.6094 3.4393 12.1147 0 7.80452 0ZM7.80457 12.2912C5.21845 12.2912 3.12186 10.2275 3.12186 7.68195C3.12186 5.13631 5.21845 3.07279 7.80457 3.07279C10.3906 3.07279 12.4874 5.13631 12.4874 7.68195C12.4874 10.2275 10.3906 12.2912 7.80457 12.2912Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M53.8288 0C49.5187 0 46.0243 3.43924 46.0243 7.68195V19.5124C46.0243 19.7667 46.2339 19.9731 46.4926 19.9732H48.6779C48.9365 19.9732 49.1462 19.7667 49.1462 19.5124V13.828C50.4506 14.7924 52.0719 15.364 53.8289 15.364C58.139 15.364 61.6337 11.9247 61.6337 7.68211C61.6337 3.4393 58.139 0 53.8288 0ZM53.8289 12.2912C51.2427 12.2912 49.1462 10.2276 49.1462 7.68195C49.1462 5.13631 51.2427 3.07279 53.8289 3.07279C56.4149 3.07279 58.5117 5.13631 58.5117 7.68195C58.5117 10.2276 56.4149 12.2912 53.8289 12.2912Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M44.4094 7.83561C44.4094 3.59285 40.9148 0 36.6046 0C32.2944 0 28.8 3.4393 28.8 7.68206C28.8 11.9247 32.2944 15.364 36.6046 15.364C39.0444 15.364 41.0568 14.2635 42.3189 12.9136C42.3191 12.9135 42.3193 12.9133 42.3194 12.9132C42.3204 12.9121 42.3214 12.9112 42.3224 12.9101V12.91C42.4051 12.8268 42.4563 12.7131 42.4563 12.5876C42.4563 12.4549 42.3989 12.3357 42.3077 12.2515V12.2509L42.3012 12.2456C42.2893 12.2351 42.2769 12.2251 42.2639 12.2158L40.5942 10.8782C40.5118 10.8069 40.4041 10.7634 40.2857 10.7634C40.1386 10.7634 40.0075 10.8302 39.9217 10.9346C39.1801 11.6777 38.0073 12.2911 36.6047 12.2911C34.0186 12.2911 31.922 10.2275 31.922 7.68184C31.922 5.13621 34.0186 3.07268 36.6047 3.07268C38.6433 3.07268 40.377 4.3555 41.02 6.14547H36.9949C36.7362 6.14553 36.5266 6.35187 36.5266 6.6064L36.5265 8.75734C36.5265 9.01182 36.7361 9.21827 36.9949 9.21827H43.7851C43.7978 9.21827 43.8104 9.21734 43.823 9.21637C43.8356 9.2174 43.8481 9.21827 43.8608 9.21827C44.0687 9.21827 44.2449 9.08466 44.3059 8.90011L44.3113 8.90098C44.314 8.88434 44.3166 8.86829 44.3192 8.85219C44.3225 8.83653 44.325 8.8206 44.3268 8.80434C44.3809 8.46076 44.4094 8.21572 44.4094 7.83561Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M74.8943 1.53668L74.8963 1.53332C74.8963 1.53332 74.8962 1.53316 74.8961 1.53311C74.9287 1.47034 74.9474 1.3995 74.9474 1.32422C74.9474 1.15549 74.855 1.00839 74.7175 0.928067C74.7161 0.926603 74.7145 0.92411 74.7131 0.923297C71.8212 -0.629332 67.9599 -0.26234 65.403 2.32666C63.9676 3.77999 63.2347 5.64926 63.1969 7.52769H63.1945V14.9024C63.1945 14.9025 63.1945 14.9025 63.1945 14.9025C63.1945 15.1569 63.4041 15.3634 63.6627 15.3634H65.8481C66.1066 15.3634 66.3164 15.1569 66.3164 14.9025C66.3164 14.9025 66.3164 14.9025 66.3164 14.9024V7.68135H66.3175C66.3174 6.52346 66.7567 5.36438 67.6414 4.46861C69.2204 2.8698 71.5515 2.74975 73.1587 3.59154C73.1637 3.59425 73.1689 3.59668 73.174 3.59929C73.1776 3.60118 73.1813 3.60286 73.1849 3.60481L73.1854 3.60471C73.2462 3.63316 73.3141 3.64958 73.386 3.64958C73.5688 3.64958 73.7268 3.54617 73.8039 3.39582L74.8769 1.56644C74.8831 1.55668 74.889 1.54687 74.8943 1.53668Z\"\n fill=\"white\"/>\n </svg>\n\n )\n}","import React from 'react'\nimport classNames from 'classnames'\nimport { FaRotate } from 'react-icons/fa6'\n\ninterface ResetButtonProps {\n enabled?: boolean\n handleClick?: () => void\n}\n\nexport default function ResetButton({\n enabled = false,\n handleClick,\n}: ResetButtonProps) {\n const classes = classNames(\n 'prp-py-2 prp-px-3 prp-flex prp-gap-2 prp-items-center rounded-md prp-regular-text prp-h-10',\n enabled &&\n 'prp-bg-orange-400 hover:prp-orange-500 prp-cursor-pointer prp-text-white',\n !enabled && 'prp-bg-grey-400 prp-text-gray-500'\n )\n\n return (\n <button\n onClick={handleClick}\n className={classes}\n disabled={!enabled}\n >\n <FaRotate />\n <span className=\"prp-block sm:prp-hidden lg:prp-block\">Reset</span>\n </button>\n )\n}\n","import { Popover, PopoverButton, PopoverPanel } from '@headlessui/react'\nimport { FaInfoCircle } from 'react-icons/fa'\nimport React from 'react'\n\ninterface InfoPopoverProps {\n title: string\n text: string\n}\n\nexport default function InfoPopover({ title, text }: InfoPopoverProps) {\n return (\n <Popover>\n <PopoverButton className=\"prp-ring-0 focus:prp-ring-0 prp-font-bold prp-text-indigo-300 prp-text-xs hover:prp-text-indigo-400 prp-block\">\n <FaInfoCircle />\n </PopoverButton>\n <PopoverPanel\n transition\n anchor=\"bottom\"\n className=\"prp-z-[1000] prp-p-4\"\n >\n <div className=\" prp-bg-white rounded-lg p-6 prp-dropshadow-popover prp-space-y-3 prp-max-w-[312px]\">\n <span className=\"prp-text-base prp-font-bold prp-leading-tight prp-text-gray-900\">\n {title}\n </span>\n <div className=\"prp-space-y-2\">\n <span className=\"prp-text-sm\">{text}</span>\n </div>\n </div>\n </PopoverPanel>\n </Popover>\n )\n}\n"],"mappings":"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","names":["import_react","React","import_react","classNames","React","import_react","import_fa6","import_react","React","key","value","React"]}
@@ -107,28 +107,29 @@ function InfoPopover({ title, text }) {
107
107
  import { clsx } from "clsx";
108
108
  function PreprPreviewBar(props) {
109
109
  const { activeSegment, activeVariant, data } = props;
110
- const [segmentList, setSegmentList] = useState(data == null ? void 0 : data.items);
110
+ const [segmentList, setSegmentList] = useState(data);
111
111
  const [isToggled, setIsToggled] = useState(false);
112
112
  const searchParams = useSearchParams();
113
+ console.log("SEGMENTS:", segmentList);
113
114
  if (searchParams.get("prepr_hide_bar") === "true") {
114
115
  return null;
115
116
  }
116
117
  if (typeof window !== "undefined" && (window == null ? void 0 : window.parent) !== window.self) {
117
118
  return null;
118
119
  }
119
- if (segmentList && segmentList[0] && segmentList[0].reference_id !== "null") {
120
+ if (segmentList && segmentList[0] && segmentList[0]._id !== "null") {
120
121
  setSegmentList([
121
122
  {
122
- id: "null",
123
- reference_id: "null",
124
- body: "All other users"
123
+ _id: "null",
124
+ name: "All other users"
125
125
  },
126
126
  ...segmentList
127
127
  ]);
128
128
  }
129
129
  const emptyVariant = "A";
130
130
  const emptySegment = {
131
- body: "Choose segment"
131
+ name: "Choose segment",
132
+ _id: "null"
132
133
  };
133
134
  useEffect(() => {
134
135
  if (!window) {
@@ -140,7 +141,7 @@ function PreprPreviewBar(props) {
140
141
  });
141
142
  const [selectedSegment, setSelectedSegment] = useState(
142
143
  segmentList && segmentList.filter(
143
- (segmentData) => segmentData === activeSegment
144
+ (segmentData) => segmentData.name === activeSegment
144
145
  )[0] || emptySegment
145
146
  );
146
147
  const [selectedVariant, setSelectedVariant] = useState(
@@ -156,7 +157,7 @@ function PreprPreviewBar(props) {
156
157
  }
157
158
  if (key === "prepr_preview_segment" && value) {
158
159
  setSelectedSegment(value);
159
- params.set(key, value.reference_id);
160
+ params.set(key, value._id);
160
161
  }
161
162
  for (const [key2, value2] of params.entries()) {
162
163
  if (value2 === "null" || value2 === null || value2 === void 0) {
@@ -200,7 +201,7 @@ function PreprPreviewBar(props) {
200
201
  )), /* @__PURE__ */ React4.createElement(
201
202
  Listbox,
202
203
  {
203
- value: selectedSegment.slug,
204
+ value: selectedSegment._id,
204
205
  onChange: (value) => handleSearchParams(
205
206
  "prepr_preview_segment",
206
207
  value
@@ -222,7 +223,7 @@ function PreprPreviewBar(props) {
222
223
  },
223
224
  className: "prp-w-full prp-overflow-hidden prp-mr-auto"
224
225
  },
225
- segmentList.length > 0 ? selectedSegment.body : "No segments"
226
+ segmentList.length > 0 ? selectedSegment.name : "No segments"
226
227
  ),
227
228
  /* @__PURE__ */ React4.createElement("div", { className: "prp-text-gray-400" }, /* @__PURE__ */ React4.createElement(FaCaretDown, { className: "prp-w-3" }))
228
229
  ),
@@ -232,38 +233,40 @@ function PreprPreviewBar(props) {
232
233
  anchor: "top start",
233
234
  className: "prp-z-[9999] prp-rounded-md prp-bg-white prp-h-1/3 prp-mt-2 prp-shadow-xl"
234
235
  },
235
- segmentList == null ? void 0 : segmentList.map((segment) => /* @__PURE__ */ React4.createElement(
236
- ListboxOption,
237
- {
238
- key: segment.id,
239
- value: segment,
240
- className: clsx(
241
- "prp-flex prp-items-center prp-p-2 prp-regular-text prp-z-[100] hover:prp-cursor-pointer prp-w-full prp-pr-4",
242
- segment.reference_id === selectedSegment.reference_id ? "prp-bg-indigo-50 prp-text-indigo-700" : "hover:prp-bg-gray-100 prp-bg-white prp-text-gray-900"
243
- )
244
- },
245
- /* @__PURE__ */ React4.createElement(
246
- FaCheck,
236
+ segmentList == null ? void 0 : segmentList.map(
237
+ (segment) => /* @__PURE__ */ React4.createElement(
238
+ ListboxOption,
247
239
  {
240
+ key: segment._id,
241
+ value: segment,
248
242
  className: clsx(
249
- "prp-size-3 prp-shrink-0 prp-mr-1",
250
- segment.reference_id === selectedSegment.reference_id ? "prp-visible" : "prp-invisible"
243
+ "prp-flex prp-items-center prp-p-2 prp-regular-text prp-z-[100] hover:prp-cursor-pointer prp-w-full prp-pr-4",
244
+ segment._id === selectedSegment._id ? "prp-bg-indigo-50 prp-text-indigo-700" : "hover:prp-bg-gray-100 prp-bg-white prp-text-gray-900"
251
245
  )
252
- }
253
- ),
254
- /* @__PURE__ */ React4.createElement(
255
- "div",
256
- {
257
- style: {
258
- textWrap: "nowrap",
259
- textOverflow: "ellipsis",
260
- textAlign: "left"
261
- },
262
- className: "prp-w-full prp-overflow-hidden prp-mr-auto"
263
246
  },
264
- segment.body
247
+ /* @__PURE__ */ React4.createElement(
248
+ FaCheck,
249
+ {
250
+ className: clsx(
251
+ "prp-size-3 prp-shrink-0 prp-mr-1",
252
+ segment._id === selectedSegment._id ? "prp-visible" : "prp-invisible"
253
+ )
254
+ }
255
+ ),
256
+ /* @__PURE__ */ React4.createElement(
257
+ "div",
258
+ {
259
+ style: {
260
+ textWrap: "nowrap",
261
+ textOverflow: "ellipsis",
262
+ textAlign: "left"
263
+ },
264
+ className: "prp-w-full prp-overflow-hidden prp-mr-auto"
265
+ },
266
+ segment.name
267
+ )
265
268
  )
266
- ))
269
+ )
267
270
  )
268
271
  )), /* @__PURE__ */ React4.createElement("div", { className: "prp-flex prp-flex-initial prp-flex-col md:prp-flex-row prp-gap-2 md:prp-gap-4" }, /* @__PURE__ */ React4.createElement("div", { className: "prp-regular-text prp-text-white prp-items-center prp-gap-2 prp-hidden lg:prp-flex" }, /* @__PURE__ */ React4.createElement("span", { className: "prp-pb-0.5 prp-text-xs md:prp-text-base prp-block md:prp-hidden xl:prp-block" }, "Show A/B variant"), /* @__PURE__ */ React4.createElement(
269
272
  InfoPopover,
@@ -303,7 +306,7 @@ function PreprPreviewBar(props) {
303
306
  ResetButton,
304
307
  {
305
308
  handleClick: handleReset,
306
- enabled: selectedSegment.reference_id || selectedVariant !== "A"
309
+ enabled: selectedSegment._id !== "null" || selectedVariant !== "A"
307
310
  }
308
311
  ))))
309
312
  ), /* @__PURE__ */ React4.createElement(
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/PreprPreviewBar.tsx","../src/components/PreprLogo.tsx","../src/components/ResetButton.tsx","../src/components/InfoPopover.tsx"],"sourcesContent":["'use client'\n\nimport { usePathname, useRouter, useSearchParams } from 'next/navigation'\nimport React, { useEffect, useState } from 'react'\n\nimport '../main.css'\nimport PreprLogo from './PreprLogo'\nimport ResetButton from './ResetButton'\nimport {\n Listbox,\n ListboxButton,\n ListboxOption,\n ListboxOptions,\n Radio,\n RadioGroup,\n} from '@headlessui/react'\nimport { FaCaretDown, FaCheck } from 'react-icons/fa6'\nimport InfoPopover from './InfoPopover'\nimport { clsx } from 'clsx'\n\nexport function PreprPreviewBar(props: {\n activeSegment?: string | null\n activeVariant?: string | null\n data?: any\n}) {\n const { activeSegment, activeVariant, data } = props\n const [segmentList, setSegmentList] = useState<any>(data?.items)\n const [isToggled, setIsToggled] = useState<boolean>(false)\n const searchParams = useSearchParams()\n\n if (searchParams.get('prepr_hide_bar') === 'true') {\n return null\n }\n\n // Hide the preview bar if not on the client or if the page is in an iframe\n if (typeof window !== 'undefined' && window?.parent !== window.self) {\n return null\n }\n\n if (\n segmentList &&\n segmentList[0] &&\n segmentList[0].reference_id !== 'null'\n ) {\n setSegmentList([\n {\n id: 'null',\n reference_id: 'null',\n body: 'All other users',\n },\n ...segmentList,\n ])\n }\n\n const emptyVariant = 'A'\n const emptySegment = {\n body: 'Choose segment',\n }\n\n useEffect(() => {\n if (!window) {\n return\n }\n\n if (window.localStorage.getItem('isToggled')) {\n setIsToggled(window.localStorage.getItem('isToggled') === 'true')\n }\n })\n\n const [selectedSegment, setSelectedSegment] = useState(\n (segmentList &&\n segmentList.filter(\n (segmentData: any) => segmentData === activeSegment\n )[0]) ||\n emptySegment\n )\n\n const [selectedVariant, setSelectedVariant] = useState<string | null>(\n activeVariant || 'A'\n )\n\n const router = useRouter()\n const pathname = usePathname()\n\n const handleSearchParams = (key: string, value: any) => {\n const params = new URLSearchParams(window.location.search)\n\n if (key === 'prepr_preview_ab') {\n setSelectedVariant(value)\n params.set(key, value as string)\n }\n if (key === 'prepr_preview_segment' && value) {\n setSelectedSegment(value)\n params.set(key, value.reference_id as string)\n }\n\n // Remove parameters with value \"null\"\n for (const [key, value] of params.entries()) {\n if (value === 'null' || value === null || value === undefined) {\n params.delete(key)\n }\n }\n\n router.push(`${pathname}?${params.toString()}`, {\n scroll: false,\n })\n router.refresh()\n }\n\n const handleToggle = () => {\n setIsToggled(!isToggled)\n window.localStorage.setItem('isToggled', String(!isToggled))\n }\n\n const handleReset = () => {\n setSelectedSegment(emptySegment)\n setSelectedVariant(emptyVariant)\n\n const params = new URLSearchParams({})\n params.append('prepr_preview_segment', 'null')\n params.append('prepr_preview_ab', 'null')\n\n router.push(`${pathname}?${params.toString()}`, {\n scroll: false,\n })\n router.refresh()\n }\n\n return (\n <div className=\"prp-z-[999] prp-isolate prp-flex prp-base prp-w-full prp-sticky prp-top-0\">\n <div\n className={clsx(\n 'prp-py-4 prp-px-5 prp-bg-purple-900 prp-w-full prp-overflow-hidden',\n isToggled ? 'prp-sticky prp-top-0' : 'prp-hidden'\n )}\n >\n <div className=\"prp-flex prp-max-w-7xl prp-mx-auto prp-gap-y-4 prp-h-full prp-gap-x-6 prp-flex-col sm:prp-flex-row prp-flex-wrap\">\n <div className=\"prp-flex prp-gap-6 prp-items-center\">\n <div className=\"prp-h-full prp-flex prp-justify-center prp-items-center\">\n <PreprLogo />\n </div>\n <div className=\"prp-hidden lg:prp-block prp-pb-0.5 prp-text-white prp-text-lg prp-text-bold\">\n Adaptive Preview\n </div>\n </div>\n\n <div className=\"prp-flex prp-flex-wrap prp-gap-2 md:prp-gap-4 prp-ml-0 sm:prp-ml-auto md:prp-items-center\">\n <div className=\"prp-flex prp-flex-col md:prp-flex-row prp-gap-2 md:prp-gap-4 prp-flex-1\">\n <div className=\"prp-regular-text prp-text-white prp-items-center prp-gap-2 prp-hidden lg:prp-flex\">\n <span className=\"prp-pb-0.5 prp-text-xs md:prp-text-base prp-block md:prp-hidden xl:prp-block\">\n Apply segment\n </span>\n <InfoPopover\n title={'Adaptive Preview'}\n text={\n \"Choose a segment to see how it's displayed.\"\n }\n />\n </div>\n\n <Listbox\n value={selectedSegment.slug}\n onChange={(value: any) =>\n handleSearchParams(\n 'prepr_preview_segment',\n value\n )\n }\n >\n <ListboxButton\n disabled={!(segmentList.length > 0)}\n className=\"disabled:prp-cursor-not-allowed disabled:prp-text-gray-400 disabled:prp-bg-gray-200 prp-h-10 prp-flex prp-gap-2 prp-w-full md:prp-w-48 prp-flex-nowrap prp-text-nowrap prp-overflow-hidden prp-text-ellipsis prp-rounded-lg data-[open]:prp-border-b-white prp-border prp-border-gray-300 prp-items-center prp-bg-white prp-px-2 md:prp-px-4 prp-regular-text prp-text-gray-500\"\n >\n <div\n style={{\n textWrap: 'nowrap',\n textOverflow: 'ellipsis',\n textAlign: 'left',\n }}\n className=\"prp-w-full prp-overflow-hidden prp-mr-auto\"\n >\n {segmentList.length > 0\n ? selectedSegment.body\n : 'No segments'}\n </div>\n <div className=\"prp-text-gray-400\">\n <FaCaretDown className=\"prp-w-3\" />\n </div>\n </ListboxButton>\n <ListboxOptions\n anchor=\"top start\"\n className=\"prp-z-[9999] prp-rounded-md prp-bg-white prp-h-1/3 prp-mt-2 prp-shadow-xl\"\n >\n {segmentList?.map((segment: any) => (\n <ListboxOption\n key={segment.id}\n value={segment}\n className={clsx(\n 'prp-flex prp-items-center prp-p-2 prp-regular-text prp-z-[100] hover:prp-cursor-pointer prp-w-full prp-pr-4',\n segment.reference_id ===\n selectedSegment.reference_id\n ? 'prp-bg-indigo-50 prp-text-indigo-700'\n : 'hover:prp-bg-gray-100 prp-bg-white prp-text-gray-900'\n )}\n >\n <FaCheck\n className={clsx(\n 'prp-size-3 prp-shrink-0 prp-mr-1',\n segment.reference_id ===\n selectedSegment.reference_id\n ? 'prp-visible'\n : 'prp-invisible'\n )}\n />\n <div\n style={{\n textWrap: 'nowrap',\n textOverflow: 'ellipsis',\n textAlign: 'left',\n }}\n className=\"prp-w-full prp-overflow-hidden prp-mr-auto\"\n >\n {segment.body}\n </div>\n </ListboxOption>\n ))}\n </ListboxOptions>\n </Listbox>\n </div>\n\n <div className=\"prp-flex prp-flex-initial prp-flex-col md:prp-flex-row prp-gap-2 md:prp-gap-4\">\n <div className=\"prp-regular-text prp-text-white prp-items-center prp-gap-2 prp-hidden lg:prp-flex\">\n <span className=\"prp-pb-0.5 prp-text-xs md:prp-text-base prp-block md:prp-hidden xl:prp-block\">\n Show A/B variant\n </span>\n <InfoPopover\n title={'A/B Testing'}\n text={\n 'Choose between two different versions of a page to see which one performs better.'\n }\n />\n </div>\n\n <RadioGroup\n className=\"prp-rounded-lg prp-p-1 prp-mr-auto prp-border prp-border-gray-300 prp-bg-white prp-flex prp-gap-1 prp-h-10 prp-items-center\"\n value={selectedVariant}\n onChange={(value: any) =>\n handleSearchParams(\n 'prepr_preview_ab',\n value\n )\n }\n >\n <Radio\n value={'A'}\n className=\"prp-py-2 prp-px-3 prp-rounded-md prp-text-gray-900 prp-regular-text data-[checked]:prp-dropshadow\n data-[checked]:prp-bg-indigo-600 data-[checked]:prp-text-white prp-h-8 prp-text-center prp-flex prp-items-center hover:prp-cursor-pointer\n \"\n >\n <span className=\"prp-hidden md:prp-inline prp-mr-1\">\n Variant{' '}\n </span>\n A\n </Radio>\n <Radio\n value={'B'}\n className=\"prp-py-2 prp-px-3 prp-rounded-md prp-text-gray-900 prp-regular-text data-[checked]:prp-dropshadow\n data-[checked]:prp-bg-indigo-600 data-[checked]:prp-text-white prp-h-8 prp-text-center prp-flex prp-items-center hover:prp-cursor-pointer\n \"\n >\n <span className=\"prp-hidden md:prp-inline prp-mr-1\">\n Variant{' '}\n </span>\n B\n </Radio>\n </RadioGroup>\n </div>\n\n <div className=\"prp-flex prp-flex-initial prp-mt-auto md:prp-h-full\">\n <ResetButton\n handleClick={handleReset}\n enabled={\n selectedSegment.reference_id ||\n selectedVariant !== 'A'\n }\n />\n </div>\n </div>\n </div>\n </div>\n <div\n className={clsx(\n 'prp-w-full prp-flex',\n isToggled\n ? '-prp-bottom-6 prp-absolute'\n : 'prp-top-0 prp-fixed'\n )}\n >\n <div\n className={clsx(\n 'prp-w-auto prp-mx-auto prp-flex prp-items-center prp-border-t-2 prp-border-purple-900'\n )}\n >\n <div\n className={`prp-relative prp-z-[100] prp-mx-auto prp-bg-purple-900 prp-regular-text prp-text-white prp-px-2 prp-py-0.5 prp-rounded-b-lg prp-flex prp-items-center prp-cursor-pointer`}\n onClick={handleToggle}\n >\n Adaptive Preview\n {isToggled ? (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 512 512\"\n className=\"prp-size-3 prp-fill-white prp-ml-2\"\n >\n <path d=\"M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z\" />\n </svg>\n ) : (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 512 512\"\n className=\"prp-size-3 prp-fill-white prp-ml-2\"\n >\n <path d=\"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z\" />\n </svg>\n )}\n </div>\n </div>\n </div>\n </div>\n )\n}\n","import React from \"react\";\n\nexport default function PreprLogo() {\n return (\n <svg width=\"75\" height=\"20\" viewBox=\"0 0 75 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M28.8527 1.56704C28.8588 1.55728 28.8647 1.54752 28.8701 1.53728L28.872 1.53392C28.872 1.53392 28.8719 1.53376 28.8718 1.5337C28.9044 1.47094 28.9231 1.4001 28.9231 1.32481C28.9231 1.15609 28.8307 1.00899 28.6932 0.928662C28.6918 0.927198 28.6902 0.924705 28.6888 0.923892C25.7969 -0.628737 21.9356 -0.26169 19.3787 2.32725C17.9433 3.78059 17.2104 5.64985 17.1726 7.52828H17.1702V14.903C17.1702 14.9031 17.1702 14.9031 17.1702 14.9031C17.1702 15.1575 17.3798 15.3639 17.6384 15.3639H19.8237C20.0823 15.3639 20.292 15.1575 20.292 14.9031C20.292 14.9031 20.292 14.9031 20.292 14.903V7.68194H20.2932C20.2931 6.52406 20.7324 5.36498 21.617 4.4692C23.1961 2.8704 25.5272 2.75034 27.1344 3.59213C27.1394 3.59484 27.1446 3.59728 27.1496 3.59988C27.1532 3.60178 27.1569 3.60346 27.1605 3.60541L27.161 3.6053C27.2219 3.63376 27.2898 3.65018 27.3617 3.65018C27.5444 3.65018 27.7024 3.54676 27.7796 3.39641L28.8527 1.56704Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M7.80452 0C3.49433 0 0 3.43924 0 7.68195V19.5124C0 19.7667 0.209581 19.9732 0.468282 19.9732H2.65358C2.65363 19.9732 2.65363 19.9732 2.65363 19.9732C2.91222 19.9732 3.12186 19.7667 3.12186 19.5124V13.8279C4.42627 14.7924 6.04758 15.364 7.80457 15.364C12.1147 15.364 15.6094 11.9247 15.6094 7.68206C15.6094 3.4393 12.1147 0 7.80452 0ZM7.80457 12.2912C5.21845 12.2912 3.12186 10.2275 3.12186 7.68195C3.12186 5.13631 5.21845 3.07279 7.80457 3.07279C10.3906 3.07279 12.4874 5.13631 12.4874 7.68195C12.4874 10.2275 10.3906 12.2912 7.80457 12.2912Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M53.8288 0C49.5187 0 46.0243 3.43924 46.0243 7.68195V19.5124C46.0243 19.7667 46.2339 19.9731 46.4926 19.9732H48.6779C48.9365 19.9732 49.1462 19.7667 49.1462 19.5124V13.828C50.4506 14.7924 52.0719 15.364 53.8289 15.364C58.139 15.364 61.6337 11.9247 61.6337 7.68211C61.6337 3.4393 58.139 0 53.8288 0ZM53.8289 12.2912C51.2427 12.2912 49.1462 10.2276 49.1462 7.68195C49.1462 5.13631 51.2427 3.07279 53.8289 3.07279C56.4149 3.07279 58.5117 5.13631 58.5117 7.68195C58.5117 10.2276 56.4149 12.2912 53.8289 12.2912Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M44.4094 7.83561C44.4094 3.59285 40.9148 0 36.6046 0C32.2944 0 28.8 3.4393 28.8 7.68206C28.8 11.9247 32.2944 15.364 36.6046 15.364C39.0444 15.364 41.0568 14.2635 42.3189 12.9136C42.3191 12.9135 42.3193 12.9133 42.3194 12.9132C42.3204 12.9121 42.3214 12.9112 42.3224 12.9101V12.91C42.4051 12.8268 42.4563 12.7131 42.4563 12.5876C42.4563 12.4549 42.3989 12.3357 42.3077 12.2515V12.2509L42.3012 12.2456C42.2893 12.2351 42.2769 12.2251 42.2639 12.2158L40.5942 10.8782C40.5118 10.8069 40.4041 10.7634 40.2857 10.7634C40.1386 10.7634 40.0075 10.8302 39.9217 10.9346C39.1801 11.6777 38.0073 12.2911 36.6047 12.2911C34.0186 12.2911 31.922 10.2275 31.922 7.68184C31.922 5.13621 34.0186 3.07268 36.6047 3.07268C38.6433 3.07268 40.377 4.3555 41.02 6.14547H36.9949C36.7362 6.14553 36.5266 6.35187 36.5266 6.6064L36.5265 8.75734C36.5265 9.01182 36.7361 9.21827 36.9949 9.21827H43.7851C43.7978 9.21827 43.8104 9.21734 43.823 9.21637C43.8356 9.2174 43.8481 9.21827 43.8608 9.21827C44.0687 9.21827 44.2449 9.08466 44.3059 8.90011L44.3113 8.90098C44.314 8.88434 44.3166 8.86829 44.3192 8.85219C44.3225 8.83653 44.325 8.8206 44.3268 8.80434C44.3809 8.46076 44.4094 8.21572 44.4094 7.83561Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M74.8943 1.53668L74.8963 1.53332C74.8963 1.53332 74.8962 1.53316 74.8961 1.53311C74.9287 1.47034 74.9474 1.3995 74.9474 1.32422C74.9474 1.15549 74.855 1.00839 74.7175 0.928067C74.7161 0.926603 74.7145 0.92411 74.7131 0.923297C71.8212 -0.629332 67.9599 -0.26234 65.403 2.32666C63.9676 3.77999 63.2347 5.64926 63.1969 7.52769H63.1945V14.9024C63.1945 14.9025 63.1945 14.9025 63.1945 14.9025C63.1945 15.1569 63.4041 15.3634 63.6627 15.3634H65.8481C66.1066 15.3634 66.3164 15.1569 66.3164 14.9025C66.3164 14.9025 66.3164 14.9025 66.3164 14.9024V7.68135H66.3175C66.3174 6.52346 66.7567 5.36438 67.6414 4.46861C69.2204 2.8698 71.5515 2.74975 73.1587 3.59154C73.1637 3.59425 73.1689 3.59668 73.174 3.59929C73.1776 3.60118 73.1813 3.60286 73.1849 3.60481L73.1854 3.60471C73.2462 3.63316 73.3141 3.64958 73.386 3.64958C73.5688 3.64958 73.7268 3.54617 73.8039 3.39582L74.8769 1.56644C74.8831 1.55668 74.889 1.54687 74.8943 1.53668Z\"\n fill=\"white\"/>\n </svg>\n\n )\n}","import React from 'react'\nimport classNames from 'classnames'\nimport { FaRotate } from 'react-icons/fa6'\n\ninterface ResetButtonProps {\n enabled?: boolean\n handleClick?: () => void\n}\n\nexport default function ResetButton({\n enabled = false,\n handleClick,\n}: ResetButtonProps) {\n const classes = classNames(\n 'prp-py-2 prp-px-3 prp-flex prp-gap-2 prp-items-center rounded-md prp-regular-text prp-h-10',\n enabled &&\n 'prp-bg-orange-400 hover:prp-orange-500 prp-cursor-pointer prp-text-white',\n !enabled && 'prp-bg-grey-400 prp-text-gray-500'\n )\n\n return (\n <button\n onClick={handleClick}\n className={classes}\n disabled={!enabled}\n >\n <FaRotate />\n <span className=\"prp-block sm:prp-hidden lg:prp-block\">Reset</span>\n </button>\n )\n}\n","import { Popover, PopoverButton, PopoverPanel } from '@headlessui/react'\nimport { FaInfoCircle } from 'react-icons/fa'\nimport React from 'react'\n\ninterface InfoPopoverProps {\n title: string\n text: string\n}\n\nexport default function InfoPopover({ title, text }: InfoPopoverProps) {\n return (\n <Popover>\n <PopoverButton className=\"prp-ring-0 focus:prp-ring-0 prp-font-bold prp-text-indigo-300 prp-text-xs hover:prp-text-indigo-400 prp-block\">\n <FaInfoCircle />\n </PopoverButton>\n <PopoverPanel\n transition\n anchor=\"bottom\"\n className=\"prp-z-[1000] prp-p-4\"\n >\n <div className=\" prp-bg-white rounded-lg p-6 prp-dropshadow-popover prp-space-y-3 prp-max-w-[312px]\">\n <span className=\"prp-text-base prp-font-bold prp-leading-tight prp-text-gray-900\">\n {title}\n </span>\n <div className=\"prp-space-y-2\">\n <span className=\"prp-text-sm\">{text}</span>\n </div>\n </div>\n </PopoverPanel>\n </Popover>\n )\n}\n"],"mappings":"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","names":["React","React","React","key","value","React"]}
1
+ {"version":3,"sources":["../src/components/PreprPreviewBar.tsx","../src/components/PreprLogo.tsx","../src/components/ResetButton.tsx","../src/components/InfoPopover.tsx"],"sourcesContent":["'use client'\n\nimport { usePathname, useRouter, useSearchParams } from 'next/navigation'\nimport React, { useEffect, useState } from 'react'\n\nimport '../main.css'\nimport PreprLogo from './PreprLogo'\nimport ResetButton from './ResetButton'\nimport {\n Listbox,\n ListboxButton,\n ListboxOption,\n ListboxOptions,\n Radio,\n RadioGroup,\n} from '@headlessui/react'\nimport { FaCaretDown, FaCheck } from 'react-icons/fa6'\nimport InfoPopover from './InfoPopover'\nimport { clsx } from 'clsx'\nimport { PreprSegment } from '../shared/types'\n\nexport function PreprPreviewBar(props: {\n activeSegment?: string | null\n activeVariant?: string | null\n data?: PreprSegment[]\n}) {\n const { activeSegment, activeVariant, data } = props\n const [segmentList, setSegmentList] = useState<PreprSegment[]>(data)\n const [isToggled, setIsToggled] = useState<boolean>(false)\n const searchParams = useSearchParams()\n\n console.log('SEGMENTS:', segmentList)\n\n if (searchParams.get('prepr_hide_bar') === 'true') {\n return null\n }\n\n // Hide the preview bar if not on the client or if the page is in an iframe\n if (typeof window !== 'undefined' && window?.parent !== window.self) {\n return null\n }\n\n if (segmentList && segmentList[0] && segmentList[0]._id !== 'null') {\n setSegmentList([\n {\n _id: 'null',\n name: 'All other users',\n },\n ...segmentList,\n ])\n }\n\n const emptyVariant = 'A'\n const emptySegment: PreprSegment = {\n name: 'Choose segment',\n _id: 'null',\n }\n\n useEffect(() => {\n if (!window) {\n return\n }\n\n if (window.localStorage.getItem('isToggled')) {\n setIsToggled(window.localStorage.getItem('isToggled') === 'true')\n }\n })\n\n const [selectedSegment, setSelectedSegment] = useState<PreprSegment>(\n (segmentList &&\n segmentList.filter(\n (segmentData: PreprSegment) =>\n segmentData.name === activeSegment\n )[0]) ||\n emptySegment\n )\n\n const [selectedVariant, setSelectedVariant] = useState<string | null>(\n activeVariant || 'A'\n )\n\n const router = useRouter()\n const pathname = usePathname()\n\n const handleSearchParams = (key: string, value: any) => {\n const params = new URLSearchParams(window.location.search)\n\n if (key === 'prepr_preview_ab') {\n setSelectedVariant(value)\n params.set(key, value as string)\n }\n if (key === 'prepr_preview_segment' && value) {\n setSelectedSegment(value)\n params.set(key, value._id as string)\n }\n\n // Remove parameters with value \"null\"\n for (const [key, value] of params.entries()) {\n if (value === 'null' || value === null || value === undefined) {\n params.delete(key)\n }\n }\n\n router.push(`${pathname}?${params.toString()}`, {\n scroll: false,\n })\n router.refresh()\n }\n\n const handleToggle = () => {\n setIsToggled(!isToggled)\n window.localStorage.setItem('isToggled', String(!isToggled))\n }\n\n const handleReset = () => {\n setSelectedSegment(emptySegment)\n setSelectedVariant(emptyVariant)\n\n const params = new URLSearchParams({})\n params.append('prepr_preview_segment', 'null')\n params.append('prepr_preview_ab', 'null')\n\n router.push(`${pathname}?${params.toString()}`, {\n scroll: false,\n })\n router.refresh()\n }\n\n return (\n <div className=\"prp-z-[999] prp-isolate prp-flex prp-base prp-w-full prp-sticky prp-top-0\">\n <div\n className={clsx(\n 'prp-py-4 prp-px-5 prp-bg-purple-900 prp-w-full prp-overflow-hidden',\n isToggled ? 'prp-sticky prp-top-0' : 'prp-hidden'\n )}\n >\n <div className=\"prp-flex prp-max-w-7xl prp-mx-auto prp-gap-y-4 prp-h-full prp-gap-x-6 prp-flex-col sm:prp-flex-row prp-flex-wrap\">\n <div className=\"prp-flex prp-gap-6 prp-items-center\">\n <div className=\"prp-h-full prp-flex prp-justify-center prp-items-center\">\n <PreprLogo />\n </div>\n <div className=\"prp-hidden lg:prp-block prp-pb-0.5 prp-text-white prp-text-lg prp-text-bold\">\n Adaptive Preview\n </div>\n </div>\n\n <div className=\"prp-flex prp-flex-wrap prp-gap-2 md:prp-gap-4 prp-ml-0 sm:prp-ml-auto md:prp-items-center\">\n <div className=\"prp-flex prp-flex-col md:prp-flex-row prp-gap-2 md:prp-gap-4 prp-flex-1\">\n <div className=\"prp-regular-text prp-text-white prp-items-center prp-gap-2 prp-hidden lg:prp-flex\">\n <span className=\"prp-pb-0.5 prp-text-xs md:prp-text-base prp-block md:prp-hidden xl:prp-block\">\n Apply segment\n </span>\n <InfoPopover\n title={'Adaptive Preview'}\n text={\n \"Choose a segment to see how it's displayed.\"\n }\n />\n </div>\n\n <Listbox\n value={selectedSegment._id}\n onChange={(value: any) =>\n handleSearchParams(\n 'prepr_preview_segment',\n value\n )\n }\n >\n <ListboxButton\n disabled={!(segmentList.length > 0)}\n className=\"disabled:prp-cursor-not-allowed disabled:prp-text-gray-400 disabled:prp-bg-gray-200 prp-h-10 prp-flex prp-gap-2 prp-w-full md:prp-w-48 prp-flex-nowrap prp-text-nowrap prp-overflow-hidden prp-text-ellipsis prp-rounded-lg data-[open]:prp-border-b-white prp-border prp-border-gray-300 prp-items-center prp-bg-white prp-px-2 md:prp-px-4 prp-regular-text prp-text-gray-500\"\n >\n <div\n style={{\n textWrap: 'nowrap',\n textOverflow: 'ellipsis',\n textAlign: 'left',\n }}\n className=\"prp-w-full prp-overflow-hidden prp-mr-auto\"\n >\n {segmentList.length > 0\n ? selectedSegment.name\n : 'No segments'}\n </div>\n <div className=\"prp-text-gray-400\">\n <FaCaretDown className=\"prp-w-3\" />\n </div>\n </ListboxButton>\n <ListboxOptions\n anchor=\"top start\"\n className=\"prp-z-[9999] prp-rounded-md prp-bg-white prp-h-1/3 prp-mt-2 prp-shadow-xl\"\n >\n {segmentList?.map(\n (segment: PreprSegment) => (\n <ListboxOption\n key={segment._id}\n value={segment}\n className={clsx(\n 'prp-flex prp-items-center prp-p-2 prp-regular-text prp-z-[100] hover:prp-cursor-pointer prp-w-full prp-pr-4',\n segment._id ===\n selectedSegment._id\n ? 'prp-bg-indigo-50 prp-text-indigo-700'\n : 'hover:prp-bg-gray-100 prp-bg-white prp-text-gray-900'\n )}\n >\n <FaCheck\n className={clsx(\n 'prp-size-3 prp-shrink-0 prp-mr-1',\n segment._id ===\n selectedSegment._id\n ? 'prp-visible'\n : 'prp-invisible'\n )}\n />\n <div\n style={{\n textWrap: 'nowrap',\n textOverflow:\n 'ellipsis',\n textAlign: 'left',\n }}\n className=\"prp-w-full prp-overflow-hidden prp-mr-auto\"\n >\n {segment.name}\n </div>\n </ListboxOption>\n )\n )}\n </ListboxOptions>\n </Listbox>\n </div>\n\n <div className=\"prp-flex prp-flex-initial prp-flex-col md:prp-flex-row prp-gap-2 md:prp-gap-4\">\n <div className=\"prp-regular-text prp-text-white prp-items-center prp-gap-2 prp-hidden lg:prp-flex\">\n <span className=\"prp-pb-0.5 prp-text-xs md:prp-text-base prp-block md:prp-hidden xl:prp-block\">\n Show A/B variant\n </span>\n <InfoPopover\n title={'A/B Testing'}\n text={\n 'Choose between two different versions of a page to see which one performs better.'\n }\n />\n </div>\n\n <RadioGroup\n className=\"prp-rounded-lg prp-p-1 prp-mr-auto prp-border prp-border-gray-300 prp-bg-white prp-flex prp-gap-1 prp-h-10 prp-items-center\"\n value={selectedVariant}\n onChange={(value: any) =>\n handleSearchParams(\n 'prepr_preview_ab',\n value\n )\n }\n >\n <Radio\n value={'A'}\n className=\"prp-py-2 prp-px-3 prp-rounded-md prp-text-gray-900 prp-regular-text data-[checked]:prp-dropshadow\n data-[checked]:prp-bg-indigo-600 data-[checked]:prp-text-white prp-h-8 prp-text-center prp-flex prp-items-center hover:prp-cursor-pointer\n \"\n >\n <span className=\"prp-hidden md:prp-inline prp-mr-1\">\n Variant{' '}\n </span>\n A\n </Radio>\n <Radio\n value={'B'}\n className=\"prp-py-2 prp-px-3 prp-rounded-md prp-text-gray-900 prp-regular-text data-[checked]:prp-dropshadow\n data-[checked]:prp-bg-indigo-600 data-[checked]:prp-text-white prp-h-8 prp-text-center prp-flex prp-items-center hover:prp-cursor-pointer\n \"\n >\n <span className=\"prp-hidden md:prp-inline prp-mr-1\">\n Variant{' '}\n </span>\n B\n </Radio>\n </RadioGroup>\n </div>\n\n <div className=\"prp-flex prp-flex-initial prp-mt-auto md:prp-h-full\">\n <ResetButton\n handleClick={handleReset}\n enabled={\n selectedSegment._id !== 'null' ||\n selectedVariant !== 'A'\n }\n />\n </div>\n </div>\n </div>\n </div>\n <div\n className={clsx(\n 'prp-w-full prp-flex',\n isToggled\n ? '-prp-bottom-6 prp-absolute'\n : 'prp-top-0 prp-fixed'\n )}\n >\n <div\n className={clsx(\n 'prp-w-auto prp-mx-auto prp-flex prp-items-center prp-border-t-2 prp-border-purple-900'\n )}\n >\n <div\n className={`prp-relative prp-z-[100] prp-mx-auto prp-bg-purple-900 prp-regular-text prp-text-white prp-px-2 prp-py-0.5 prp-rounded-b-lg prp-flex prp-items-center prp-cursor-pointer`}\n onClick={handleToggle}\n >\n Adaptive Preview\n {isToggled ? (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 512 512\"\n className=\"prp-size-3 prp-fill-white prp-ml-2\"\n >\n <path d=\"M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z\" />\n </svg>\n ) : (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 512 512\"\n className=\"prp-size-3 prp-fill-white prp-ml-2\"\n >\n <path d=\"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z\" />\n </svg>\n )}\n </div>\n </div>\n </div>\n </div>\n )\n}\n","import React from \"react\";\n\nexport default function PreprLogo() {\n return (\n <svg width=\"75\" height=\"20\" viewBox=\"0 0 75 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M28.8527 1.56704C28.8588 1.55728 28.8647 1.54752 28.8701 1.53728L28.872 1.53392C28.872 1.53392 28.8719 1.53376 28.8718 1.5337C28.9044 1.47094 28.9231 1.4001 28.9231 1.32481C28.9231 1.15609 28.8307 1.00899 28.6932 0.928662C28.6918 0.927198 28.6902 0.924705 28.6888 0.923892C25.7969 -0.628737 21.9356 -0.26169 19.3787 2.32725C17.9433 3.78059 17.2104 5.64985 17.1726 7.52828H17.1702V14.903C17.1702 14.9031 17.1702 14.9031 17.1702 14.9031C17.1702 15.1575 17.3798 15.3639 17.6384 15.3639H19.8237C20.0823 15.3639 20.292 15.1575 20.292 14.9031C20.292 14.9031 20.292 14.9031 20.292 14.903V7.68194H20.2932C20.2931 6.52406 20.7324 5.36498 21.617 4.4692C23.1961 2.8704 25.5272 2.75034 27.1344 3.59213C27.1394 3.59484 27.1446 3.59728 27.1496 3.59988C27.1532 3.60178 27.1569 3.60346 27.1605 3.60541L27.161 3.6053C27.2219 3.63376 27.2898 3.65018 27.3617 3.65018C27.5444 3.65018 27.7024 3.54676 27.7796 3.39641L28.8527 1.56704Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M7.80452 0C3.49433 0 0 3.43924 0 7.68195V19.5124C0 19.7667 0.209581 19.9732 0.468282 19.9732H2.65358C2.65363 19.9732 2.65363 19.9732 2.65363 19.9732C2.91222 19.9732 3.12186 19.7667 3.12186 19.5124V13.8279C4.42627 14.7924 6.04758 15.364 7.80457 15.364C12.1147 15.364 15.6094 11.9247 15.6094 7.68206C15.6094 3.4393 12.1147 0 7.80452 0ZM7.80457 12.2912C5.21845 12.2912 3.12186 10.2275 3.12186 7.68195C3.12186 5.13631 5.21845 3.07279 7.80457 3.07279C10.3906 3.07279 12.4874 5.13631 12.4874 7.68195C12.4874 10.2275 10.3906 12.2912 7.80457 12.2912Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M53.8288 0C49.5187 0 46.0243 3.43924 46.0243 7.68195V19.5124C46.0243 19.7667 46.2339 19.9731 46.4926 19.9732H48.6779C48.9365 19.9732 49.1462 19.7667 49.1462 19.5124V13.828C50.4506 14.7924 52.0719 15.364 53.8289 15.364C58.139 15.364 61.6337 11.9247 61.6337 7.68211C61.6337 3.4393 58.139 0 53.8288 0ZM53.8289 12.2912C51.2427 12.2912 49.1462 10.2276 49.1462 7.68195C49.1462 5.13631 51.2427 3.07279 53.8289 3.07279C56.4149 3.07279 58.5117 5.13631 58.5117 7.68195C58.5117 10.2276 56.4149 12.2912 53.8289 12.2912Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M44.4094 7.83561C44.4094 3.59285 40.9148 0 36.6046 0C32.2944 0 28.8 3.4393 28.8 7.68206C28.8 11.9247 32.2944 15.364 36.6046 15.364C39.0444 15.364 41.0568 14.2635 42.3189 12.9136C42.3191 12.9135 42.3193 12.9133 42.3194 12.9132C42.3204 12.9121 42.3214 12.9112 42.3224 12.9101V12.91C42.4051 12.8268 42.4563 12.7131 42.4563 12.5876C42.4563 12.4549 42.3989 12.3357 42.3077 12.2515V12.2509L42.3012 12.2456C42.2893 12.2351 42.2769 12.2251 42.2639 12.2158L40.5942 10.8782C40.5118 10.8069 40.4041 10.7634 40.2857 10.7634C40.1386 10.7634 40.0075 10.8302 39.9217 10.9346C39.1801 11.6777 38.0073 12.2911 36.6047 12.2911C34.0186 12.2911 31.922 10.2275 31.922 7.68184C31.922 5.13621 34.0186 3.07268 36.6047 3.07268C38.6433 3.07268 40.377 4.3555 41.02 6.14547H36.9949C36.7362 6.14553 36.5266 6.35187 36.5266 6.6064L36.5265 8.75734C36.5265 9.01182 36.7361 9.21827 36.9949 9.21827H43.7851C43.7978 9.21827 43.8104 9.21734 43.823 9.21637C43.8356 9.2174 43.8481 9.21827 43.8608 9.21827C44.0687 9.21827 44.2449 9.08466 44.3059 8.90011L44.3113 8.90098C44.314 8.88434 44.3166 8.86829 44.3192 8.85219C44.3225 8.83653 44.325 8.8206 44.3268 8.80434C44.3809 8.46076 44.4094 8.21572 44.4094 7.83561Z\"\n fill=\"white\"/>\n <path fillRule=\"evenodd\" clipRule=\"evenodd\"\n d=\"M74.8943 1.53668L74.8963 1.53332C74.8963 1.53332 74.8962 1.53316 74.8961 1.53311C74.9287 1.47034 74.9474 1.3995 74.9474 1.32422C74.9474 1.15549 74.855 1.00839 74.7175 0.928067C74.7161 0.926603 74.7145 0.92411 74.7131 0.923297C71.8212 -0.629332 67.9599 -0.26234 65.403 2.32666C63.9676 3.77999 63.2347 5.64926 63.1969 7.52769H63.1945V14.9024C63.1945 14.9025 63.1945 14.9025 63.1945 14.9025C63.1945 15.1569 63.4041 15.3634 63.6627 15.3634H65.8481C66.1066 15.3634 66.3164 15.1569 66.3164 14.9025C66.3164 14.9025 66.3164 14.9025 66.3164 14.9024V7.68135H66.3175C66.3174 6.52346 66.7567 5.36438 67.6414 4.46861C69.2204 2.8698 71.5515 2.74975 73.1587 3.59154C73.1637 3.59425 73.1689 3.59668 73.174 3.59929C73.1776 3.60118 73.1813 3.60286 73.1849 3.60481L73.1854 3.60471C73.2462 3.63316 73.3141 3.64958 73.386 3.64958C73.5688 3.64958 73.7268 3.54617 73.8039 3.39582L74.8769 1.56644C74.8831 1.55668 74.889 1.54687 74.8943 1.53668Z\"\n fill=\"white\"/>\n </svg>\n\n )\n}","import React from 'react'\nimport classNames from 'classnames'\nimport { FaRotate } from 'react-icons/fa6'\n\ninterface ResetButtonProps {\n enabled?: boolean\n handleClick?: () => void\n}\n\nexport default function ResetButton({\n enabled = false,\n handleClick,\n}: ResetButtonProps) {\n const classes = classNames(\n 'prp-py-2 prp-px-3 prp-flex prp-gap-2 prp-items-center rounded-md prp-regular-text prp-h-10',\n enabled &&\n 'prp-bg-orange-400 hover:prp-orange-500 prp-cursor-pointer prp-text-white',\n !enabled && 'prp-bg-grey-400 prp-text-gray-500'\n )\n\n return (\n <button\n onClick={handleClick}\n className={classes}\n disabled={!enabled}\n >\n <FaRotate />\n <span className=\"prp-block sm:prp-hidden lg:prp-block\">Reset</span>\n </button>\n )\n}\n","import { Popover, PopoverButton, PopoverPanel } from '@headlessui/react'\nimport { FaInfoCircle } from 'react-icons/fa'\nimport React from 'react'\n\ninterface InfoPopoverProps {\n title: string\n text: string\n}\n\nexport default function InfoPopover({ title, text }: InfoPopoverProps) {\n return (\n <Popover>\n <PopoverButton className=\"prp-ring-0 focus:prp-ring-0 prp-font-bold prp-text-indigo-300 prp-text-xs hover:prp-text-indigo-400 prp-block\">\n <FaInfoCircle />\n </PopoverButton>\n <PopoverPanel\n transition\n anchor=\"bottom\"\n className=\"prp-z-[1000] prp-p-4\"\n >\n <div className=\" prp-bg-white rounded-lg p-6 prp-dropshadow-popover prp-space-y-3 prp-max-w-[312px]\">\n <span className=\"prp-text-base prp-font-bold prp-leading-tight prp-text-gray-900\">\n {title}\n </span>\n <div className=\"prp-space-y-2\">\n <span className=\"prp-text-sm\">{text}</span>\n </div>\n </div>\n </PopoverPanel>\n </Popover>\n )\n}\n"],"mappings":"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","names":["React","React","React","key","value","React"]}
package/dist/index.d.mts CHANGED
@@ -1,4 +1,5 @@
1
1
  import { NextResponse } from 'next/server';
2
+ import { P as PreprSegment } from './types-DmITW6Tn.mjs';
2
3
 
3
4
  /**
4
5
  *
@@ -24,29 +25,12 @@ declare function getActiveVariant(): Promise<string>;
24
25
  declare function getPreprHeaders(): Promise<{
25
26
  [key: string]: string;
26
27
  }>;
27
- type PreprSegment = {
28
- id: string;
29
- created_on: string;
30
- changed_on: string;
31
- synced_on: string;
32
- label: string;
33
- reference_id: string;
34
- body: string;
35
- query: string;
36
- count: number;
37
- };
38
- type PreprSegmentsResponse = {
39
- total: number;
40
- skip: number;
41
- limit: number;
42
- items: PreprSegment[];
43
- };
44
28
  /**
45
29
  * Fetches the segments from the Prepr API
46
30
  * @param token Prepr access token with scope 'segments'
47
- * @returns Object with total, skip, limit and items
31
+ * @returns Array of PreprSegmentResponse
48
32
  */
49
- declare function getPreprEnvironmentSegments(token: string): Promise<PreprSegmentsResponse>;
33
+ declare function getPreprEnvironmentSegments(token: string): Promise<PreprSegment[]>;
50
34
  /**
51
35
  * Fetches all the necessary previewbar props
52
36
  * @param token Prepr access token with scope 'segments'
@@ -55,7 +39,7 @@ declare function getPreprEnvironmentSegments(token: string): Promise<PreprSegmen
55
39
  declare function getPreviewBarProps(token: string): Promise<{
56
40
  activeSegment: string | null;
57
41
  activeVariant: string | null;
58
- data: PreprSegmentsResponse;
42
+ data: PreprSegment[];
59
43
  }>;
60
44
 
61
- export { PreprMiddleware, type PreprSegment, type PreprSegmentsResponse, getActiveSegment, getActiveVariant, getPreprEnvironmentSegments, getPreprHeaders, getPreprUUID, getPreviewBarProps };
45
+ export { PreprMiddleware, getActiveSegment, getActiveVariant, getPreprEnvironmentSegments, getPreprHeaders, getPreprUUID, getPreviewBarProps };
package/dist/index.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import { NextResponse } from 'next/server';
2
+ import { P as PreprSegment } from './types-DmITW6Tn.js';
2
3
 
3
4
  /**
4
5
  *
@@ -24,29 +25,12 @@ declare function getActiveVariant(): Promise<string>;
24
25
  declare function getPreprHeaders(): Promise<{
25
26
  [key: string]: string;
26
27
  }>;
27
- type PreprSegment = {
28
- id: string;
29
- created_on: string;
30
- changed_on: string;
31
- synced_on: string;
32
- label: string;
33
- reference_id: string;
34
- body: string;
35
- query: string;
36
- count: number;
37
- };
38
- type PreprSegmentsResponse = {
39
- total: number;
40
- skip: number;
41
- limit: number;
42
- items: PreprSegment[];
43
- };
44
28
  /**
45
29
  * Fetches the segments from the Prepr API
46
30
  * @param token Prepr access token with scope 'segments'
47
- * @returns Object with total, skip, limit and items
31
+ * @returns Array of PreprSegmentResponse
48
32
  */
49
- declare function getPreprEnvironmentSegments(token: string): Promise<PreprSegmentsResponse>;
33
+ declare function getPreprEnvironmentSegments(token: string): Promise<PreprSegment[]>;
50
34
  /**
51
35
  * Fetches all the necessary previewbar props
52
36
  * @param token Prepr access token with scope 'segments'
@@ -55,7 +39,7 @@ declare function getPreprEnvironmentSegments(token: string): Promise<PreprSegmen
55
39
  declare function getPreviewBarProps(token: string): Promise<{
56
40
  activeSegment: string | null;
57
41
  activeVariant: string | null;
58
- data: PreprSegmentsResponse;
42
+ data: PreprSegment[];
59
43
  }>;
60
44
 
61
- export { PreprMiddleware, type PreprSegment, type PreprSegmentsResponse, getActiveSegment, getActiveVariant, getPreprEnvironmentSegments, getPreprHeaders, getPreprUUID, getPreviewBarProps };
45
+ export { PreprMiddleware, getActiveSegment, getActiveVariant, getPreprEnvironmentSegments, getPreprHeaders, getPreprUUID, getPreviewBarProps };
package/dist/index.js CHANGED
@@ -51,6 +51,87 @@ module.exports = __toCommonJS(src_exports);
51
51
  var import_server = require("next/server");
52
52
  var import_functions = require("@vercel/functions");
53
53
  var import_headers = require("next/headers");
54
+
55
+ // package.json
56
+ var package_default = {
57
+ name: "@preprio/prepr-nextjs",
58
+ version: "1.1.0",
59
+ description: "A next.js package containing helper functions and a preview bar to use in combination with Prepr",
60
+ main: "./dist/index.js",
61
+ types: "./dist/index.d.ts",
62
+ module: "./dist/index.mjs",
63
+ files: [
64
+ "dist",
65
+ "package.json"
66
+ ],
67
+ exports: {
68
+ ".": {
69
+ types: "./dist/index.d.ts",
70
+ import: "./dist/index.js",
71
+ require: "./dist/index.js"
72
+ },
73
+ "./components": {
74
+ types: "./dist/components.d.ts",
75
+ import: "./dist/components.js",
76
+ require: "./dist/components.js"
77
+ },
78
+ "./dist/components.css": {
79
+ import: "./dist/components.css",
80
+ require: "./dist/components.css"
81
+ },
82
+ "./dist/main.css": {
83
+ import: "./dist/main.css",
84
+ require: "./dist/main.css"
85
+ }
86
+ },
87
+ scripts: {
88
+ build: "tsup",
89
+ dev: "tsup --watch"
90
+ },
91
+ author: "Prepr",
92
+ license: "ISC",
93
+ devDependencies: {
94
+ "@types/react": "^18.3.3",
95
+ autoprefixer: "^10.4.20",
96
+ postcss: "^8.4.47",
97
+ prettier: "3.3.3",
98
+ tailwindcss: "^3.4.13",
99
+ "ts-node": "^10.9.2",
100
+ tsup: "^8.2.4",
101
+ typescript: "^5.5.4"
102
+ },
103
+ dependencies: {
104
+ "@headlessui/react": "^2.1.8",
105
+ "@vercel/functions": "^1.6.0",
106
+ classnames: "^2.5.1",
107
+ clsx: "^2.1.1",
108
+ micromatch: "^4.0.8",
109
+ next: "^14.2.10",
110
+ react: "^18.3.1",
111
+ "react-dom": "^18.3.1",
112
+ "react-icons": "^5.3.0",
113
+ rollup: "^4.22.4"
114
+ },
115
+ repository: {
116
+ type: "git",
117
+ url: "git+https://github.com/preprio/prepr-nextjs.git"
118
+ },
119
+ keywords: [
120
+ "prepr",
121
+ "nextjs"
122
+ ],
123
+ bugs: {
124
+ url: "https://github.com/preprio/prepr-nextjs/issues"
125
+ },
126
+ homepage: "https://github.com/preprio/prepr-nextjs#readme"
127
+ };
128
+
129
+ // src/utils.ts
130
+ function getPackageVersion() {
131
+ return package_default.version;
132
+ }
133
+
134
+ // src/index.ts
54
135
  function PreprMiddleware(request, response) {
55
136
  var _a, _b, _c, _d;
56
137
  const newResponse = response || import_server.NextResponse.next();
@@ -170,43 +251,51 @@ function getPreprHeaders() {
170
251
  }
171
252
  function getPreprEnvironmentSegments(token) {
172
253
  return __async(this, null, function* () {
254
+ var _a;
255
+ if (!token) {
256
+ console.error(
257
+ "No token provided, make sure you are using your Prepr GraphQL URL"
258
+ );
259
+ return [];
260
+ }
261
+ if (!token.startsWith("https://")) {
262
+ console.error(
263
+ "Invalid token provided, make sure you are using your Prepr GraphQL URL"
264
+ );
265
+ return [];
266
+ }
173
267
  try {
174
- const response = yield fetch("https://api.eu1.prepr.io/segments", {
268
+ const response = yield fetch(token, {
175
269
  headers: {
176
- Authorization: `Bearer ${token}`,
177
- "User-Agent": "Prepr-Preview-Bar/1.0"
178
- }
270
+ "User-Agent": `Prepr-Preview-Bar/${getPackageVersion()}`,
271
+ "Content-Type": "application/json"
272
+ },
273
+ method: "POST",
274
+ body: JSON.stringify({
275
+ query: `{
276
+ _Segments {
277
+ _id
278
+ name
279
+ }
280
+ }`
281
+ })
179
282
  });
180
283
  try {
181
- return yield response.json();
284
+ const json = yield response.json();
285
+ return (_a = json.data) == null ? void 0 : _a._Segments;
182
286
  } catch (jsonError) {
183
287
  console.error("Error parsing JSON, please contact Prepr support");
184
- return {
185
- total: 0,
186
- skip: 0,
187
- limit: 0,
188
- items: []
189
- };
288
+ return [];
190
289
  }
191
290
  } catch (error) {
192
291
  console.error("Error fetching segments:", error);
193
- return {
194
- total: 0,
195
- skip: 0,
196
- limit: 0,
197
- items: []
198
- };
292
+ return [];
199
293
  }
200
294
  });
201
295
  }
202
296
  function getPreviewBarProps(token) {
203
297
  return __async(this, null, function* () {
204
- let data = {
205
- total: 0,
206
- skip: 0,
207
- limit: 0,
208
- items: []
209
- };
298
+ let data = [];
210
299
  let activeSegment, activeVariant;
211
300
  if (process.env.PREPR_ENV === "preview") {
212
301
  data = yield getPreprEnvironmentSegments(token);
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts"],"sourcesContent":["import { NextResponse } from 'next/server'\nimport { ipAddress } from '@vercel/functions'\nimport { headers } from 'next/headers'\n\n/**\n *\n * @param request NextRequest object\n * @param response optional NextResponse object\n */\nexport function PreprMiddleware(request: any, response?: NextResponse) {\n const newResponse = response || NextResponse.next()\n\n const utm_source = request.nextUrl.searchParams.get('utm_source')\n const utm_medium = request.nextUrl.searchParams.get('utm_medium')\n const utm_term = request.nextUrl.searchParams.get('utm_term')\n const utm_content = request.nextUrl.searchParams.get('utm_content')\n const utm_campaign = request.nextUrl.searchParams.get('utm_campaign')\n const initial_referral = request.headers.get('referer')\n\n const ip = ipAddress(request)\n\n if (ip) {\n newResponse.headers.set('Prepr-Visitor-IP', ip)\n }\n\n const hutkCookie = request.cookies.get('hubspotutk')?.value\n\n if (utm_source) {\n newResponse.headers.set('Prepr-Context-utm_source', utm_source)\n }\n\n if (utm_medium) {\n newResponse.headers.set('Prepr-Context-utm_medium', utm_medium)\n }\n\n if (utm_term) {\n newResponse.headers.set('Prepr-Context-utm_term', utm_term)\n }\n\n if (utm_content) {\n newResponse.headers.set('Prepr-Context-utm_content', utm_content)\n }\n\n if (utm_campaign) {\n newResponse.headers.set('Prepr-Context-utm_campaign', utm_campaign)\n }\n\n if (hutkCookie) {\n newResponse.headers.set('Prepr-Hubspot-Id', hutkCookie)\n }\n\n if (initial_referral) {\n newResponse.headers.set(\n 'prepr-context-initial_referral',\n initial_referral\n )\n }\n\n let cookie = request.cookies.get('__prepr_uid')?.value\n\n if (!cookie) {\n cookie = crypto.randomUUID()\n newResponse.cookies.set('__prepr_uid', cookie, {\n maxAge: 1 * 365 * 24 * 60, // Set for one year\n })\n newResponse.headers.set('Prepr-Customer-Id-Created', 'true')\n }\n\n newResponse.headers.set('Prepr-Customer-Id', cookie)\n\n if (process.env.PREPR_ENV === 'preview') {\n newResponse.headers.set('Prepr-Preview-Bar', 'true')\n\n if (request.nextUrl.searchParams.has('prepr_preview_segment')) {\n const segments = request.nextUrl.searchParams.get(\n 'prepr_preview_segment'\n )\n\n if (segments) {\n newResponse.headers.set('Prepr-Segments', segments)\n newResponse.cookies.set('Prepr-Segments', segments, {\n maxAge: 60, // Set for one year\n })\n }\n }\n\n if (request.nextUrl.searchParams.has('prepr_preview_ab')) {\n const ab_testing =\n request.nextUrl.searchParams.get('prepr_preview_ab')\n let value = ab_testing?.toUpperCase()\n if (value === 'B') {\n value = 'B'\n } else {\n value = 'A'\n }\n\n newResponse.headers.set('Prepr-ABtesting', value)\n newResponse.cookies.set('Prepr-ABtesting', value, {\n maxAge: 60, // Set for one year\n })\n }\n\n const segmentCookie = request.cookies.get('Prepr-Segments')?.value\n if (segmentCookie) {\n newResponse.headers.set('Prepr-Segments', segmentCookie)\n }\n\n const abCookie = request.cookies.get('Prepr-ABtesting')?.value\n if (abCookie) {\n newResponse.headers.set('Prepr-ABtesting', abCookie)\n }\n }\n\n return newResponse\n}\n\n/**\n * Returns the Prepr Customer ID from the headers\n */\nexport async function getPreprUUID() {\n const headersList = await headers()\n return headersList.get('prepr-customer-id')\n}\n\n/**\n * Retuns the active segment from the headers\n */\nexport async function getActiveSegment() {\n const headersList = await headers()\n return headersList.get('Prepr-Segments')\n}\n\n/**\n * Returns the active variant from the headers\n */\nexport async function getActiveVariant() {\n const headersList = await headers()\n return headersList.get('Prepr-ABtesting')\n}\n\n/**\n * Helper function to retrieve Prepr headers (will filter out customer ID if in preview mode)\n */\nexport async function getPreprHeaders() {\n let newHeaders: {\n [key: string]: string\n } = {}\n\n const headersList = await headers()\n\n headersList.forEach((value, key) => {\n if (key.startsWith('prepr')) {\n newHeaders[key] = value\n }\n })\n\n return newHeaders\n}\n\nexport type PreprSegment = {\n id: string\n created_on: string\n changed_on: string\n synced_on: string\n label: string\n reference_id: string\n body: string\n query: string\n count: number\n}\n\nexport type PreprSegmentsResponse = {\n total: number\n skip: number\n limit: number\n items: PreprSegment[]\n}\n\n/**\n * Fetches the segments from the Prepr API\n * @param token Prepr access token with scope 'segments'\n * @returns Object with total, skip, limit and items\n */\nexport async function getPreprEnvironmentSegments(\n token: string\n): Promise<PreprSegmentsResponse> {\n try {\n const response = await fetch('https://api.eu1.prepr.io/segments', {\n headers: {\n Authorization: `Bearer ${token}`,\n 'User-Agent': 'Prepr-Preview-Bar/1.0',\n },\n })\n try {\n return await response.json()\n } catch (jsonError) {\n console.error('Error parsing JSON, please contact Prepr support')\n return {\n total: 0,\n skip: 0,\n limit: 0,\n items: [],\n }\n }\n } catch (error) {\n console.error('Error fetching segments:', error)\n return {\n total: 0,\n skip: 0,\n limit: 0,\n items: [],\n }\n }\n}\n\n/**\n * Fetches all the necessary previewbar props\n * @param token Prepr access token with scope 'segments'\n * @returns Object with activeSegment, activeVariant and data\n */\nexport async function getPreviewBarProps(token: string): Promise<{\n activeSegment: string | null\n activeVariant: string | null\n data: PreprSegmentsResponse\n}> {\n let data: PreprSegmentsResponse = {\n total: 0,\n skip: 0,\n limit: 0,\n items: [],\n }\n let activeSegment, activeVariant\n\n // Prevent unnecessary function calling in production\n if (process.env.PREPR_ENV === 'preview') {\n data = await getPreprEnvironmentSegments(token)\n activeSegment = await getActiveSegment()\n activeVariant = await getActiveVariant()\n }\n\n return {\n activeSegment,\n activeVariant,\n data,\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA6B;AAC7B,uBAA0B;AAC1B,qBAAwB;AAOjB,SAAS,gBAAgB,SAAc,UAAyB;AATvE;AAUI,QAAM,cAAc,YAAY,2BAAa,KAAK;AAElD,QAAM,aAAa,QAAQ,QAAQ,aAAa,IAAI,YAAY;AAChE,QAAM,aAAa,QAAQ,QAAQ,aAAa,IAAI,YAAY;AAChE,QAAM,WAAW,QAAQ,QAAQ,aAAa,IAAI,UAAU;AAC5D,QAAM,cAAc,QAAQ,QAAQ,aAAa,IAAI,aAAa;AAClE,QAAM,eAAe,QAAQ,QAAQ,aAAa,IAAI,cAAc;AACpE,QAAM,mBAAmB,QAAQ,QAAQ,IAAI,SAAS;AAEtD,QAAM,SAAK,4BAAU,OAAO;AAE5B,MAAI,IAAI;AACJ,gBAAY,QAAQ,IAAI,oBAAoB,EAAE;AAAA,EAClD;AAEA,QAAM,cAAa,aAAQ,QAAQ,IAAI,YAAY,MAAhC,mBAAmC;AAEtD,MAAI,YAAY;AACZ,gBAAY,QAAQ,IAAI,4BAA4B,UAAU;AAAA,EAClE;AAEA,MAAI,YAAY;AACZ,gBAAY,QAAQ,IAAI,4BAA4B,UAAU;AAAA,EAClE;AAEA,MAAI,UAAU;AACV,gBAAY,QAAQ,IAAI,0BAA0B,QAAQ;AAAA,EAC9D;AAEA,MAAI,aAAa;AACb,gBAAY,QAAQ,IAAI,6BAA6B,WAAW;AAAA,EACpE;AAEA,MAAI,cAAc;AACd,gBAAY,QAAQ,IAAI,8BAA8B,YAAY;AAAA,EACtE;AAEA,MAAI,YAAY;AACZ,gBAAY,QAAQ,IAAI,oBAAoB,UAAU;AAAA,EAC1D;AAEA,MAAI,kBAAkB;AAClB,gBAAY,QAAQ;AAAA,MAChB;AAAA,MACA;AAAA,IACJ;AAAA,EACJ;AAEA,MAAI,UAAS,aAAQ,QAAQ,IAAI,aAAa,MAAjC,mBAAoC;AAEjD,MAAI,CAAC,QAAQ;AACT,aAAS,OAAO,WAAW;AAC3B,gBAAY,QAAQ,IAAI,eAAe,QAAQ;AAAA,MAC3C,QAAQ,IAAI,MAAM,KAAK;AAAA;AAAA,IAC3B,CAAC;AACD,gBAAY,QAAQ,IAAI,6BAA6B,MAAM;AAAA,EAC/D;AAEA,cAAY,QAAQ,IAAI,qBAAqB,MAAM;AAEnD,MAAI,QAAQ,IAAI,cAAc,WAAW;AACrC,gBAAY,QAAQ,IAAI,qBAAqB,MAAM;AAEnD,QAAI,QAAQ,QAAQ,aAAa,IAAI,uBAAuB,GAAG;AAC3D,YAAM,WAAW,QAAQ,QAAQ,aAAa;AAAA,QAC1C;AAAA,MACJ;AAEA,UAAI,UAAU;AACV,oBAAY,QAAQ,IAAI,kBAAkB,QAAQ;AAClD,oBAAY,QAAQ,IAAI,kBAAkB,UAAU;AAAA,UAChD,QAAQ;AAAA;AAAA,QACZ,CAAC;AAAA,MACL;AAAA,IACJ;AAEA,QAAI,QAAQ,QAAQ,aAAa,IAAI,kBAAkB,GAAG;AACtD,YAAM,aACF,QAAQ,QAAQ,aAAa,IAAI,kBAAkB;AACvD,UAAI,QAAQ,yCAAY;AACxB,UAAI,UAAU,KAAK;AACf,gBAAQ;AAAA,MACZ,OAAO;AACH,gBAAQ;AAAA,MACZ;AAEA,kBAAY,QAAQ,IAAI,mBAAmB,KAAK;AAChD,kBAAY,QAAQ,IAAI,mBAAmB,OAAO;AAAA,QAC9C,QAAQ;AAAA;AAAA,MACZ,CAAC;AAAA,IACL;AAEA,UAAM,iBAAgB,aAAQ,QAAQ,IAAI,gBAAgB,MAApC,mBAAuC;AAC7D,QAAI,eAAe;AACf,kBAAY,QAAQ,IAAI,kBAAkB,aAAa;AAAA,IAC3D;AAEA,UAAM,YAAW,aAAQ,QAAQ,IAAI,iBAAiB,MAArC,mBAAwC;AACzD,QAAI,UAAU;AACV,kBAAY,QAAQ,IAAI,mBAAmB,QAAQ;AAAA,IACvD;AAAA,EACJ;AAEA,SAAO;AACX;AAKA,SAAsB,eAAe;AAAA;AACjC,UAAM,cAAc,UAAM,wBAAQ;AAClC,WAAO,YAAY,IAAI,mBAAmB;AAAA,EAC9C;AAAA;AAKA,SAAsB,mBAAmB;AAAA;AACrC,UAAM,cAAc,UAAM,wBAAQ;AAClC,WAAO,YAAY,IAAI,gBAAgB;AAAA,EAC3C;AAAA;AAKA,SAAsB,mBAAmB;AAAA;AACrC,UAAM,cAAc,UAAM,wBAAQ;AAClC,WAAO,YAAY,IAAI,iBAAiB;AAAA,EAC5C;AAAA;AAKA,SAAsB,kBAAkB;AAAA;AACpC,QAAI,aAEA,CAAC;AAEL,UAAM,cAAc,UAAM,wBAAQ;AAElC,gBAAY,QAAQ,CAAC,OAAO,QAAQ;AAChC,UAAI,IAAI,WAAW,OAAO,GAAG;AACzB,mBAAW,GAAG,IAAI;AAAA,MACtB;AAAA,IACJ,CAAC;AAED,WAAO;AAAA,EACX;AAAA;AA0BA,SAAsB,4BAClB,OAC8B;AAAA;AAC9B,QAAI;AACA,YAAM,WAAW,MAAM,MAAM,qCAAqC;AAAA,QAC9D,SAAS;AAAA,UACL,eAAe,UAAU,KAAK;AAAA,UAC9B,cAAc;AAAA,QAClB;AAAA,MACJ,CAAC;AACD,UAAI;AACA,eAAO,MAAM,SAAS,KAAK;AAAA,MAC/B,SAAS,WAAW;AAChB,gBAAQ,MAAM,kDAAkD;AAChE,eAAO;AAAA,UACH,OAAO;AAAA,UACP,MAAM;AAAA,UACN,OAAO;AAAA,UACP,OAAO,CAAC;AAAA,QACZ;AAAA,MACJ;AAAA,IACJ,SAAS,OAAO;AACZ,cAAQ,MAAM,4BAA4B,KAAK;AAC/C,aAAO;AAAA,QACH,OAAO;AAAA,QACP,MAAM;AAAA,QACN,OAAO;AAAA,QACP,OAAO,CAAC;AAAA,MACZ;AAAA,IACJ;AAAA,EACJ;AAAA;AAOA,SAAsB,mBAAmB,OAItC;AAAA;AACC,QAAI,OAA8B;AAAA,MAC9B,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OAAO;AAAA,MACP,OAAO,CAAC;AAAA,IACZ;AACA,QAAI,eAAe;AAGnB,QAAI,QAAQ,IAAI,cAAc,WAAW;AACrC,aAAO,MAAM,4BAA4B,KAAK;AAC9C,sBAAgB,MAAM,iBAAiB;AACvC,sBAAgB,MAAM,iBAAiB;AAAA,IAC3C;AAEA,WAAO;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,IACJ;AAAA,EACJ;AAAA;","names":[]}
1
+ {"version":3,"sources":["../src/index.ts","../package.json","../src/utils.ts"],"sourcesContent":["import { NextResponse } from 'next/server'\nimport { ipAddress } from '@vercel/functions'\nimport { headers } from 'next/headers'\nimport { getPackageVersion } from './utils'\nimport { PreprSegment } from './shared/types'\n\n/**\n *\n * @param request NextRequest object\n * @param response optional NextResponse object\n */\nexport function PreprMiddleware(request: any, response?: NextResponse) {\n const newResponse = response || NextResponse.next()\n\n const utm_source = request.nextUrl.searchParams.get('utm_source')\n const utm_medium = request.nextUrl.searchParams.get('utm_medium')\n const utm_term = request.nextUrl.searchParams.get('utm_term')\n const utm_content = request.nextUrl.searchParams.get('utm_content')\n const utm_campaign = request.nextUrl.searchParams.get('utm_campaign')\n const initial_referral = request.headers.get('referer')\n\n const ip = ipAddress(request)\n\n if (ip) {\n newResponse.headers.set('Prepr-Visitor-IP', ip)\n }\n\n const hutkCookie = request.cookies.get('hubspotutk')?.value\n\n if (utm_source) {\n newResponse.headers.set('Prepr-Context-utm_source', utm_source)\n }\n\n if (utm_medium) {\n newResponse.headers.set('Prepr-Context-utm_medium', utm_medium)\n }\n\n if (utm_term) {\n newResponse.headers.set('Prepr-Context-utm_term', utm_term)\n }\n\n if (utm_content) {\n newResponse.headers.set('Prepr-Context-utm_content', utm_content)\n }\n\n if (utm_campaign) {\n newResponse.headers.set('Prepr-Context-utm_campaign', utm_campaign)\n }\n\n if (hutkCookie) {\n newResponse.headers.set('Prepr-Hubspot-Id', hutkCookie)\n }\n\n if (initial_referral) {\n newResponse.headers.set(\n 'prepr-context-initial_referral',\n initial_referral\n )\n }\n\n let cookie = request.cookies.get('__prepr_uid')?.value\n\n if (!cookie) {\n cookie = crypto.randomUUID()\n newResponse.cookies.set('__prepr_uid', cookie, {\n maxAge: 1 * 365 * 24 * 60, // Set for one year\n })\n newResponse.headers.set('Prepr-Customer-Id-Created', 'true')\n }\n\n newResponse.headers.set('Prepr-Customer-Id', cookie)\n\n if (process.env.PREPR_ENV === 'preview') {\n newResponse.headers.set('Prepr-Preview-Bar', 'true')\n\n if (request.nextUrl.searchParams.has('prepr_preview_segment')) {\n const segments = request.nextUrl.searchParams.get(\n 'prepr_preview_segment'\n )\n\n if (segments) {\n newResponse.headers.set('Prepr-Segments', segments)\n newResponse.cookies.set('Prepr-Segments', segments, {\n maxAge: 60, // Set for one year\n })\n }\n }\n\n if (request.nextUrl.searchParams.has('prepr_preview_ab')) {\n const ab_testing =\n request.nextUrl.searchParams.get('prepr_preview_ab')\n let value = ab_testing?.toUpperCase()\n if (value === 'B') {\n value = 'B'\n } else {\n value = 'A'\n }\n\n newResponse.headers.set('Prepr-ABtesting', value)\n newResponse.cookies.set('Prepr-ABtesting', value, {\n maxAge: 60, // Set for one year\n })\n }\n\n const segmentCookie = request.cookies.get('Prepr-Segments')?.value\n if (segmentCookie) {\n newResponse.headers.set('Prepr-Segments', segmentCookie)\n }\n\n const abCookie = request.cookies.get('Prepr-ABtesting')?.value\n if (abCookie) {\n newResponse.headers.set('Prepr-ABtesting', abCookie)\n }\n }\n\n return newResponse\n}\n\n/**\n * Returns the Prepr Customer ID from the headers\n */\nexport async function getPreprUUID() {\n const headersList = await headers()\n return headersList.get('prepr-customer-id')\n}\n\n/**\n * Retuns the active segment from the headers\n */\nexport async function getActiveSegment() {\n const headersList = await headers()\n return headersList.get('Prepr-Segments')\n}\n\n/**\n * Returns the active variant from the headers\n */\nexport async function getActiveVariant() {\n const headersList = await headers()\n return headersList.get('Prepr-ABtesting')\n}\n\n/**\n * Helper function to retrieve Prepr headers (will filter out customer ID if in preview mode)\n */\nexport async function getPreprHeaders() {\n let newHeaders: {\n [key: string]: string\n } = {}\n\n const headersList = await headers()\n\n headersList.forEach((value, key) => {\n if (key.startsWith('prepr')) {\n newHeaders[key] = value\n }\n })\n\n return newHeaders\n}\n\n/**\n * Fetches the segments from the Prepr API\n * @param token Prepr access token with scope 'segments'\n * @returns Array of PreprSegmentResponse\n */\nexport async function getPreprEnvironmentSegments(\n token: string\n): Promise<PreprSegment[]> {\n if (!token) {\n console.error(\n 'No token provided, make sure you are using your Prepr GraphQL URL'\n )\n return []\n }\n\n if (!token.startsWith('https://')) {\n console.error(\n 'Invalid token provided, make sure you are using your Prepr GraphQL URL'\n )\n return []\n }\n\n try {\n const response = await fetch(token, {\n headers: {\n 'User-Agent': `Prepr-Preview-Bar/${getPackageVersion()}`,\n 'Content-Type': 'application/json',\n },\n method: 'POST',\n body: JSON.stringify({\n query: `{\n _Segments {\n _id\n name\n }\n }`,\n }),\n })\n try {\n const json = await response.json()\n return json.data?._Segments as PreprSegment[]\n } catch (jsonError) {\n console.error('Error parsing JSON, please contact Prepr support')\n return []\n }\n } catch (error) {\n console.error('Error fetching segments:', error)\n return []\n }\n}\n\n/**\n * Fetches all the necessary previewbar props\n * @param token Prepr access token with scope 'segments'\n * @returns Object with activeSegment, activeVariant and data\n */\nexport async function getPreviewBarProps(token: string): Promise<{\n activeSegment: string | null\n activeVariant: string | null\n data: PreprSegment[]\n}> {\n let data: PreprSegment[] = []\n let activeSegment, activeVariant\n\n // Prevent unnecessary function calling in production\n if (process.env.PREPR_ENV === 'preview') {\n data = await getPreprEnvironmentSegments(token)\n activeSegment = await getActiveSegment()\n activeVariant = await getActiveVariant()\n }\n\n return {\n activeSegment,\n activeVariant,\n data,\n }\n}\n","{\n \"name\": \"@preprio/prepr-nextjs\",\n \"version\": \"1.1.0\",\n \"description\": \"A next.js package containing helper functions and a preview bar to use in combination with Prepr\",\n \"main\": \"./dist/index.js\",\n \"types\": \"./dist/index.d.ts\",\n \"module\": \"./dist/index.mjs\",\n \"files\": [\n \"dist\",\n \"package.json\"\n ],\n \"exports\": {\n \".\": {\n \"types\": \"./dist/index.d.ts\",\n \"import\": \"./dist/index.js\",\n \"require\": \"./dist/index.js\"\n },\n \"./components\": {\n \"types\": \"./dist/components.d.ts\",\n \"import\": \"./dist/components.js\",\n \"require\": \"./dist/components.js\"\n },\n \"./dist/components.css\": {\n \"import\": \"./dist/components.css\",\n \"require\": \"./dist/components.css\"\n },\n \"./dist/main.css\": {\n \"import\": \"./dist/main.css\",\n \"require\": \"./dist/main.css\"\n }\n },\n \"scripts\": {\n \"build\": \"tsup\",\n \"dev\": \"tsup --watch\"\n },\n \"author\": \"Prepr\",\n \"license\": \"ISC\",\n \"devDependencies\": {\n \"@types/react\": \"^18.3.3\",\n \"autoprefixer\": \"^10.4.20\",\n \"postcss\": \"^8.4.47\",\n \"prettier\": \"3.3.3\",\n \"tailwindcss\": \"^3.4.13\",\n \"ts-node\": \"^10.9.2\",\n \"tsup\": \"^8.2.4\",\n \"typescript\": \"^5.5.4\"\n },\n \"dependencies\": {\n \"@headlessui/react\": \"^2.1.8\",\n \"@vercel/functions\": \"^1.6.0\",\n \"classnames\": \"^2.5.1\",\n \"clsx\": \"^2.1.1\",\n \"micromatch\": \"^4.0.8\",\n \"next\": \"^14.2.10\",\n \"react\": \"^18.3.1\",\n \"react-dom\": \"^18.3.1\",\n \"react-icons\": \"^5.3.0\",\n \"rollup\": \"^4.22.4\"\n },\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"git+https://github.com/preprio/prepr-nextjs.git\"\n },\n \"keywords\": [\n \"prepr\",\n \"nextjs\"\n ],\n \"bugs\": {\n \"url\": \"https://github.com/preprio/prepr-nextjs/issues\"\n },\n \"homepage\": \"https://github.com/preprio/prepr-nextjs#readme\"\n}\n","import pjson from '../package.json'\n\nexport function getPackageVersion() {\n return pjson.version\n}\n"],"mappings":"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","names":[]}
package/dist/index.mjs CHANGED
@@ -6,6 +6,87 @@ import {
6
6
  import { NextResponse } from "next/server";
7
7
  import { ipAddress } from "@vercel/functions";
8
8
  import { headers } from "next/headers";
9
+
10
+ // package.json
11
+ var package_default = {
12
+ name: "@preprio/prepr-nextjs",
13
+ version: "1.1.0",
14
+ description: "A next.js package containing helper functions and a preview bar to use in combination with Prepr",
15
+ main: "./dist/index.js",
16
+ types: "./dist/index.d.ts",
17
+ module: "./dist/index.mjs",
18
+ files: [
19
+ "dist",
20
+ "package.json"
21
+ ],
22
+ exports: {
23
+ ".": {
24
+ types: "./dist/index.d.ts",
25
+ import: "./dist/index.js",
26
+ require: "./dist/index.js"
27
+ },
28
+ "./components": {
29
+ types: "./dist/components.d.ts",
30
+ import: "./dist/components.js",
31
+ require: "./dist/components.js"
32
+ },
33
+ "./dist/components.css": {
34
+ import: "./dist/components.css",
35
+ require: "./dist/components.css"
36
+ },
37
+ "./dist/main.css": {
38
+ import: "./dist/main.css",
39
+ require: "./dist/main.css"
40
+ }
41
+ },
42
+ scripts: {
43
+ build: "tsup",
44
+ dev: "tsup --watch"
45
+ },
46
+ author: "Prepr",
47
+ license: "ISC",
48
+ devDependencies: {
49
+ "@types/react": "^18.3.3",
50
+ autoprefixer: "^10.4.20",
51
+ postcss: "^8.4.47",
52
+ prettier: "3.3.3",
53
+ tailwindcss: "^3.4.13",
54
+ "ts-node": "^10.9.2",
55
+ tsup: "^8.2.4",
56
+ typescript: "^5.5.4"
57
+ },
58
+ dependencies: {
59
+ "@headlessui/react": "^2.1.8",
60
+ "@vercel/functions": "^1.6.0",
61
+ classnames: "^2.5.1",
62
+ clsx: "^2.1.1",
63
+ micromatch: "^4.0.8",
64
+ next: "^14.2.10",
65
+ react: "^18.3.1",
66
+ "react-dom": "^18.3.1",
67
+ "react-icons": "^5.3.0",
68
+ rollup: "^4.22.4"
69
+ },
70
+ repository: {
71
+ type: "git",
72
+ url: "git+https://github.com/preprio/prepr-nextjs.git"
73
+ },
74
+ keywords: [
75
+ "prepr",
76
+ "nextjs"
77
+ ],
78
+ bugs: {
79
+ url: "https://github.com/preprio/prepr-nextjs/issues"
80
+ },
81
+ homepage: "https://github.com/preprio/prepr-nextjs#readme"
82
+ };
83
+
84
+ // src/utils.ts
85
+ function getPackageVersion() {
86
+ return package_default.version;
87
+ }
88
+
89
+ // src/index.ts
9
90
  function PreprMiddleware(request, response) {
10
91
  var _a, _b, _c, _d;
11
92
  const newResponse = response || NextResponse.next();
@@ -125,43 +206,51 @@ function getPreprHeaders() {
125
206
  }
126
207
  function getPreprEnvironmentSegments(token) {
127
208
  return __async(this, null, function* () {
209
+ var _a;
210
+ if (!token) {
211
+ console.error(
212
+ "No token provided, make sure you are using your Prepr GraphQL URL"
213
+ );
214
+ return [];
215
+ }
216
+ if (!token.startsWith("https://")) {
217
+ console.error(
218
+ "Invalid token provided, make sure you are using your Prepr GraphQL URL"
219
+ );
220
+ return [];
221
+ }
128
222
  try {
129
- const response = yield fetch("https://api.eu1.prepr.io/segments", {
223
+ const response = yield fetch(token, {
130
224
  headers: {
131
- Authorization: `Bearer ${token}`,
132
- "User-Agent": "Prepr-Preview-Bar/1.0"
133
- }
225
+ "User-Agent": `Prepr-Preview-Bar/${getPackageVersion()}`,
226
+ "Content-Type": "application/json"
227
+ },
228
+ method: "POST",
229
+ body: JSON.stringify({
230
+ query: `{
231
+ _Segments {
232
+ _id
233
+ name
234
+ }
235
+ }`
236
+ })
134
237
  });
135
238
  try {
136
- return yield response.json();
239
+ const json = yield response.json();
240
+ return (_a = json.data) == null ? void 0 : _a._Segments;
137
241
  } catch (jsonError) {
138
242
  console.error("Error parsing JSON, please contact Prepr support");
139
- return {
140
- total: 0,
141
- skip: 0,
142
- limit: 0,
143
- items: []
144
- };
243
+ return [];
145
244
  }
146
245
  } catch (error) {
147
246
  console.error("Error fetching segments:", error);
148
- return {
149
- total: 0,
150
- skip: 0,
151
- limit: 0,
152
- items: []
153
- };
247
+ return [];
154
248
  }
155
249
  });
156
250
  }
157
251
  function getPreviewBarProps(token) {
158
252
  return __async(this, null, function* () {
159
- let data = {
160
- total: 0,
161
- skip: 0,
162
- limit: 0,
163
- items: []
164
- };
253
+ let data = [];
165
254
  let activeSegment, activeVariant;
166
255
  if (process.env.PREPR_ENV === "preview") {
167
256
  data = yield getPreprEnvironmentSegments(token);
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts"],"sourcesContent":["import { NextResponse } from 'next/server'\nimport { ipAddress } from '@vercel/functions'\nimport { headers } from 'next/headers'\n\n/**\n *\n * @param request NextRequest object\n * @param response optional NextResponse object\n */\nexport function PreprMiddleware(request: any, response?: NextResponse) {\n const newResponse = response || NextResponse.next()\n\n const utm_source = request.nextUrl.searchParams.get('utm_source')\n const utm_medium = request.nextUrl.searchParams.get('utm_medium')\n const utm_term = request.nextUrl.searchParams.get('utm_term')\n const utm_content = request.nextUrl.searchParams.get('utm_content')\n const utm_campaign = request.nextUrl.searchParams.get('utm_campaign')\n const initial_referral = request.headers.get('referer')\n\n const ip = ipAddress(request)\n\n if (ip) {\n newResponse.headers.set('Prepr-Visitor-IP', ip)\n }\n\n const hutkCookie = request.cookies.get('hubspotutk')?.value\n\n if (utm_source) {\n newResponse.headers.set('Prepr-Context-utm_source', utm_source)\n }\n\n if (utm_medium) {\n newResponse.headers.set('Prepr-Context-utm_medium', utm_medium)\n }\n\n if (utm_term) {\n newResponse.headers.set('Prepr-Context-utm_term', utm_term)\n }\n\n if (utm_content) {\n newResponse.headers.set('Prepr-Context-utm_content', utm_content)\n }\n\n if (utm_campaign) {\n newResponse.headers.set('Prepr-Context-utm_campaign', utm_campaign)\n }\n\n if (hutkCookie) {\n newResponse.headers.set('Prepr-Hubspot-Id', hutkCookie)\n }\n\n if (initial_referral) {\n newResponse.headers.set(\n 'prepr-context-initial_referral',\n initial_referral\n )\n }\n\n let cookie = request.cookies.get('__prepr_uid')?.value\n\n if (!cookie) {\n cookie = crypto.randomUUID()\n newResponse.cookies.set('__prepr_uid', cookie, {\n maxAge: 1 * 365 * 24 * 60, // Set for one year\n })\n newResponse.headers.set('Prepr-Customer-Id-Created', 'true')\n }\n\n newResponse.headers.set('Prepr-Customer-Id', cookie)\n\n if (process.env.PREPR_ENV === 'preview') {\n newResponse.headers.set('Prepr-Preview-Bar', 'true')\n\n if (request.nextUrl.searchParams.has('prepr_preview_segment')) {\n const segments = request.nextUrl.searchParams.get(\n 'prepr_preview_segment'\n )\n\n if (segments) {\n newResponse.headers.set('Prepr-Segments', segments)\n newResponse.cookies.set('Prepr-Segments', segments, {\n maxAge: 60, // Set for one year\n })\n }\n }\n\n if (request.nextUrl.searchParams.has('prepr_preview_ab')) {\n const ab_testing =\n request.nextUrl.searchParams.get('prepr_preview_ab')\n let value = ab_testing?.toUpperCase()\n if (value === 'B') {\n value = 'B'\n } else {\n value = 'A'\n }\n\n newResponse.headers.set('Prepr-ABtesting', value)\n newResponse.cookies.set('Prepr-ABtesting', value, {\n maxAge: 60, // Set for one year\n })\n }\n\n const segmentCookie = request.cookies.get('Prepr-Segments')?.value\n if (segmentCookie) {\n newResponse.headers.set('Prepr-Segments', segmentCookie)\n }\n\n const abCookie = request.cookies.get('Prepr-ABtesting')?.value\n if (abCookie) {\n newResponse.headers.set('Prepr-ABtesting', abCookie)\n }\n }\n\n return newResponse\n}\n\n/**\n * Returns the Prepr Customer ID from the headers\n */\nexport async function getPreprUUID() {\n const headersList = await headers()\n return headersList.get('prepr-customer-id')\n}\n\n/**\n * Retuns the active segment from the headers\n */\nexport async function getActiveSegment() {\n const headersList = await headers()\n return headersList.get('Prepr-Segments')\n}\n\n/**\n * Returns the active variant from the headers\n */\nexport async function getActiveVariant() {\n const headersList = await headers()\n return headersList.get('Prepr-ABtesting')\n}\n\n/**\n * Helper function to retrieve Prepr headers (will filter out customer ID if in preview mode)\n */\nexport async function getPreprHeaders() {\n let newHeaders: {\n [key: string]: string\n } = {}\n\n const headersList = await headers()\n\n headersList.forEach((value, key) => {\n if (key.startsWith('prepr')) {\n newHeaders[key] = value\n }\n })\n\n return newHeaders\n}\n\nexport type PreprSegment = {\n id: string\n created_on: string\n changed_on: string\n synced_on: string\n label: string\n reference_id: string\n body: string\n query: string\n count: number\n}\n\nexport type PreprSegmentsResponse = {\n total: number\n skip: number\n limit: number\n items: PreprSegment[]\n}\n\n/**\n * Fetches the segments from the Prepr API\n * @param token Prepr access token with scope 'segments'\n * @returns Object with total, skip, limit and items\n */\nexport async function getPreprEnvironmentSegments(\n token: string\n): Promise<PreprSegmentsResponse> {\n try {\n const response = await fetch('https://api.eu1.prepr.io/segments', {\n headers: {\n Authorization: `Bearer ${token}`,\n 'User-Agent': 'Prepr-Preview-Bar/1.0',\n },\n })\n try {\n return await response.json()\n } catch (jsonError) {\n console.error('Error parsing JSON, please contact Prepr support')\n return {\n total: 0,\n skip: 0,\n limit: 0,\n items: [],\n }\n }\n } catch (error) {\n console.error('Error fetching segments:', error)\n return {\n total: 0,\n skip: 0,\n limit: 0,\n items: [],\n }\n }\n}\n\n/**\n * Fetches all the necessary previewbar props\n * @param token Prepr access token with scope 'segments'\n * @returns Object with activeSegment, activeVariant and data\n */\nexport async function getPreviewBarProps(token: string): Promise<{\n activeSegment: string | null\n activeVariant: string | null\n data: PreprSegmentsResponse\n}> {\n let data: PreprSegmentsResponse = {\n total: 0,\n skip: 0,\n limit: 0,\n items: [],\n }\n let activeSegment, activeVariant\n\n // Prevent unnecessary function calling in production\n if (process.env.PREPR_ENV === 'preview') {\n data = await getPreprEnvironmentSegments(token)\n activeSegment = await getActiveSegment()\n activeVariant = await getActiveVariant()\n }\n\n return {\n activeSegment,\n activeVariant,\n data,\n }\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/index.ts","../package.json","../src/utils.ts"],"sourcesContent":["import { NextResponse } from 'next/server'\nimport { ipAddress } from '@vercel/functions'\nimport { headers } from 'next/headers'\nimport { getPackageVersion } from './utils'\nimport { PreprSegment } from './shared/types'\n\n/**\n *\n * @param request NextRequest object\n * @param response optional NextResponse object\n */\nexport function PreprMiddleware(request: any, response?: NextResponse) {\n const newResponse = response || NextResponse.next()\n\n const utm_source = request.nextUrl.searchParams.get('utm_source')\n const utm_medium = request.nextUrl.searchParams.get('utm_medium')\n const utm_term = request.nextUrl.searchParams.get('utm_term')\n const utm_content = request.nextUrl.searchParams.get('utm_content')\n const utm_campaign = request.nextUrl.searchParams.get('utm_campaign')\n const initial_referral = request.headers.get('referer')\n\n const ip = ipAddress(request)\n\n if (ip) {\n newResponse.headers.set('Prepr-Visitor-IP', ip)\n }\n\n const hutkCookie = request.cookies.get('hubspotutk')?.value\n\n if (utm_source) {\n newResponse.headers.set('Prepr-Context-utm_source', utm_source)\n }\n\n if (utm_medium) {\n newResponse.headers.set('Prepr-Context-utm_medium', utm_medium)\n }\n\n if (utm_term) {\n newResponse.headers.set('Prepr-Context-utm_term', utm_term)\n }\n\n if (utm_content) {\n newResponse.headers.set('Prepr-Context-utm_content', utm_content)\n }\n\n if (utm_campaign) {\n newResponse.headers.set('Prepr-Context-utm_campaign', utm_campaign)\n }\n\n if (hutkCookie) {\n newResponse.headers.set('Prepr-Hubspot-Id', hutkCookie)\n }\n\n if (initial_referral) {\n newResponse.headers.set(\n 'prepr-context-initial_referral',\n initial_referral\n )\n }\n\n let cookie = request.cookies.get('__prepr_uid')?.value\n\n if (!cookie) {\n cookie = crypto.randomUUID()\n newResponse.cookies.set('__prepr_uid', cookie, {\n maxAge: 1 * 365 * 24 * 60, // Set for one year\n })\n newResponse.headers.set('Prepr-Customer-Id-Created', 'true')\n }\n\n newResponse.headers.set('Prepr-Customer-Id', cookie)\n\n if (process.env.PREPR_ENV === 'preview') {\n newResponse.headers.set('Prepr-Preview-Bar', 'true')\n\n if (request.nextUrl.searchParams.has('prepr_preview_segment')) {\n const segments = request.nextUrl.searchParams.get(\n 'prepr_preview_segment'\n )\n\n if (segments) {\n newResponse.headers.set('Prepr-Segments', segments)\n newResponse.cookies.set('Prepr-Segments', segments, {\n maxAge: 60, // Set for one year\n })\n }\n }\n\n if (request.nextUrl.searchParams.has('prepr_preview_ab')) {\n const ab_testing =\n request.nextUrl.searchParams.get('prepr_preview_ab')\n let value = ab_testing?.toUpperCase()\n if (value === 'B') {\n value = 'B'\n } else {\n value = 'A'\n }\n\n newResponse.headers.set('Prepr-ABtesting', value)\n newResponse.cookies.set('Prepr-ABtesting', value, {\n maxAge: 60, // Set for one year\n })\n }\n\n const segmentCookie = request.cookies.get('Prepr-Segments')?.value\n if (segmentCookie) {\n newResponse.headers.set('Prepr-Segments', segmentCookie)\n }\n\n const abCookie = request.cookies.get('Prepr-ABtesting')?.value\n if (abCookie) {\n newResponse.headers.set('Prepr-ABtesting', abCookie)\n }\n }\n\n return newResponse\n}\n\n/**\n * Returns the Prepr Customer ID from the headers\n */\nexport async function getPreprUUID() {\n const headersList = await headers()\n return headersList.get('prepr-customer-id')\n}\n\n/**\n * Retuns the active segment from the headers\n */\nexport async function getActiveSegment() {\n const headersList = await headers()\n return headersList.get('Prepr-Segments')\n}\n\n/**\n * Returns the active variant from the headers\n */\nexport async function getActiveVariant() {\n const headersList = await headers()\n return headersList.get('Prepr-ABtesting')\n}\n\n/**\n * Helper function to retrieve Prepr headers (will filter out customer ID if in preview mode)\n */\nexport async function getPreprHeaders() {\n let newHeaders: {\n [key: string]: string\n } = {}\n\n const headersList = await headers()\n\n headersList.forEach((value, key) => {\n if (key.startsWith('prepr')) {\n newHeaders[key] = value\n }\n })\n\n return newHeaders\n}\n\n/**\n * Fetches the segments from the Prepr API\n * @param token Prepr access token with scope 'segments'\n * @returns Array of PreprSegmentResponse\n */\nexport async function getPreprEnvironmentSegments(\n token: string\n): Promise<PreprSegment[]> {\n if (!token) {\n console.error(\n 'No token provided, make sure you are using your Prepr GraphQL URL'\n )\n return []\n }\n\n if (!token.startsWith('https://')) {\n console.error(\n 'Invalid token provided, make sure you are using your Prepr GraphQL URL'\n )\n return []\n }\n\n try {\n const response = await fetch(token, {\n headers: {\n 'User-Agent': `Prepr-Preview-Bar/${getPackageVersion()}`,\n 'Content-Type': 'application/json',\n },\n method: 'POST',\n body: JSON.stringify({\n query: `{\n _Segments {\n _id\n name\n }\n }`,\n }),\n })\n try {\n const json = await response.json()\n return json.data?._Segments as PreprSegment[]\n } catch (jsonError) {\n console.error('Error parsing JSON, please contact Prepr support')\n return []\n }\n } catch (error) {\n console.error('Error fetching segments:', error)\n return []\n }\n}\n\n/**\n * Fetches all the necessary previewbar props\n * @param token Prepr access token with scope 'segments'\n * @returns Object with activeSegment, activeVariant and data\n */\nexport async function getPreviewBarProps(token: string): Promise<{\n activeSegment: string | null\n activeVariant: string | null\n data: PreprSegment[]\n}> {\n let data: PreprSegment[] = []\n let activeSegment, activeVariant\n\n // Prevent unnecessary function calling in production\n if (process.env.PREPR_ENV === 'preview') {\n data = await getPreprEnvironmentSegments(token)\n activeSegment = await getActiveSegment()\n activeVariant = await getActiveVariant()\n }\n\n return {\n activeSegment,\n activeVariant,\n data,\n }\n}\n","{\n \"name\": \"@preprio/prepr-nextjs\",\n \"version\": \"1.1.0\",\n \"description\": \"A next.js package containing helper functions and a preview bar to use in combination with Prepr\",\n \"main\": \"./dist/index.js\",\n \"types\": \"./dist/index.d.ts\",\n \"module\": \"./dist/index.mjs\",\n \"files\": [\n \"dist\",\n \"package.json\"\n ],\n \"exports\": {\n \".\": {\n \"types\": \"./dist/index.d.ts\",\n \"import\": \"./dist/index.js\",\n \"require\": \"./dist/index.js\"\n },\n \"./components\": {\n \"types\": \"./dist/components.d.ts\",\n \"import\": \"./dist/components.js\",\n \"require\": \"./dist/components.js\"\n },\n \"./dist/components.css\": {\n \"import\": \"./dist/components.css\",\n \"require\": \"./dist/components.css\"\n },\n \"./dist/main.css\": {\n \"import\": \"./dist/main.css\",\n \"require\": \"./dist/main.css\"\n }\n },\n \"scripts\": {\n \"build\": \"tsup\",\n \"dev\": \"tsup --watch\"\n },\n \"author\": \"Prepr\",\n \"license\": \"ISC\",\n \"devDependencies\": {\n \"@types/react\": \"^18.3.3\",\n \"autoprefixer\": \"^10.4.20\",\n \"postcss\": \"^8.4.47\",\n \"prettier\": \"3.3.3\",\n \"tailwindcss\": \"^3.4.13\",\n \"ts-node\": \"^10.9.2\",\n \"tsup\": \"^8.2.4\",\n \"typescript\": \"^5.5.4\"\n },\n \"dependencies\": {\n \"@headlessui/react\": \"^2.1.8\",\n \"@vercel/functions\": \"^1.6.0\",\n \"classnames\": \"^2.5.1\",\n \"clsx\": \"^2.1.1\",\n \"micromatch\": \"^4.0.8\",\n \"next\": \"^14.2.10\",\n \"react\": \"^18.3.1\",\n \"react-dom\": \"^18.3.1\",\n \"react-icons\": \"^5.3.0\",\n \"rollup\": \"^4.22.4\"\n },\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"git+https://github.com/preprio/prepr-nextjs.git\"\n },\n \"keywords\": [\n \"prepr\",\n \"nextjs\"\n ],\n \"bugs\": {\n \"url\": \"https://github.com/preprio/prepr-nextjs/issues\"\n },\n \"homepage\": \"https://github.com/preprio/prepr-nextjs#readme\"\n}\n","import pjson from '../package.json'\n\nexport function getPackageVersion() {\n return pjson.version\n}\n"],"mappings":"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","names":[]}
@@ -0,0 +1,6 @@
1
+ type PreprSegment = {
2
+ _id: string;
3
+ name: string;
4
+ };
5
+
6
+ export type { PreprSegment as P };
@@ -0,0 +1,6 @@
1
+ type PreprSegment = {
2
+ _id: string;
3
+ name: string;
4
+ };
5
+
6
+ export type { PreprSegment as P };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@preprio/prepr-nextjs",
3
- "version": "1.0.1",
3
+ "version": "1.1.0",
4
4
  "description": "A next.js package containing helper functions and a preview bar to use in combination with Prepr",
5
5
  "main": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",