dune-react 0.0.10 → 0.0.12

package/dist/components/puck-block/text-sections/rich-text-1/index.js

@@ -22,7 +22,7 @@ const conf = {
     })
   },
   defaultProps: {
-    content: "<h2>About Us</h2><p>We are a team of passionate builders creating tools that empower everyone to build beautiful websites.</p><p>Our mission is to make web design accessible to everyone.</p>",
+    content: "<h2>About Our Mission</h2><p>We started with a simple belief: developers deserve better tools. Our platform is built by engineers, for engineers — eliminating the grunt work so you can focus on what you do best.</p><p>Every feature we ship is guided by one question: does this make our users faster? If it doesn't, it doesn't ship.</p>",
     styles: createStylesDefaults({ maxWidth: "md" })
   },
   render: RichText

package/dist/components/puck-block/text-sections/rich-text-1/rich-text.js

@@ -1,4 +1,5 @@
 import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
 import { CompoundContainer } from "../../../puck-base/container.js";
 const MAX_WIDTH_MAP = {
   sm: "max-w-xl",
@@ -6,16 +7,20 @@ const MAX_WIDTH_MAP = {
   lg: "max-w-4xl",
   full: "max-w-none"
 };
+function sanitizeHtml(html) {
+  return html.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, "").replace(/<iframe\b[^>]*>/gi, "").replace(/\bon\w+\s*=/gi, "data-removed=");
+}
 const RichText = ({
   content = "",
   styles
 }) => {
   const maxWidth = (styles == null ? void 0 : styles.maxWidth) ?? "md";
+  const safeContent = useMemo(() => sanitizeHtml(content), [content]);
   return /* @__PURE__ */ jsx(CompoundContainer, { padding: styles == null ? void 0 : styles.padding, sectionStyle: styles == null ? void 0 : styles.sectionStyle, backgroundColor: styles == null ? void 0 : styles.backgroundColor, children: /* @__PURE__ */ jsx(
     "div",
     {
       className: `${MAX_WIDTH_MAP[maxWidth]} prose prose-neutral dark:prose-invert mx-auto`,
-      dangerouslySetInnerHTML: { __html: content }
+      dangerouslySetInnerHTML: { __html: safeContent }
     }
   ) });
 };

package/dist/components/puck-block/text-sections/tab-section-1/index.js

@@ -1,4 +1,4 @@
-import { image16x9Placeholder, image } from "../../../puck-base/core/fields.js";
+import { image } from "../../../puck-base/core/fields.js";
 import { TabSection } from "./tab-section.js";
 import { createStylesDefaults, createStylesField } from "../../../puck-base/core/styles.js";
 const conf = {
@@ -17,29 +17,29 @@ const conf = {
       defaultItemProps: {
         label: "Tab",
         content: "Content for this tab.",
-        image: image16x9Placeholder
+        image: { src: "https://images.pexels.com/photos/3888151/pexels-photo-3888151.jpeg?auto=compress&cs=tinysrgb&w=1200", alt: "Developer workspace with laptop showing code" }
       }
     },
     styles: createStylesField()
   },
   defaultProps: {
     heading: "How it works",
-    description: "A simple three-step process to get started.",
+    description: "Get up and running in three simple steps.",
     tabs: [
       {
-        label: "Step 1",
-        content: "Sign up and create your account in seconds.",
-        image: image16x9Placeholder
+        label: "Connect",
+        content: "Link your repository and configure your project in under a minute.",
+        image: { src: "https://images.pexels.com/photos/4218883/pexels-photo-4218883.jpeg?auto=compress&cs=tinysrgb&w=1200", alt: "Computer displaying code editor with project repository connected" }
       },
       {
-        label: "Step 2",
-        content: "Configure your workspace and invite your team.",
-        image: image16x9Placeholder
+        label: "Build",
+        content: "Push your code and let our platform handle testing, building, and optimization.",
+        image: { src: "https://images.pexels.com/photos/574071/pexels-photo-574071.jpeg?auto=compress&cs=tinysrgb&w=1200", alt: "Monitor showing colorful code during build process" }
       },
       {
-        label: "Step 3",
-        content: "Start building and shipping faster than ever.",
-        image: image16x9Placeholder
+        label: "Deploy",
+        content: "Go live instantly with automatic SSL, CDN, and monitoring.",
+        image: { src: "https://images.pexels.com/photos/270404/pexels-photo-270404.jpeg?auto=compress&cs=tinysrgb&w=1200", alt: "Source code and deployment terminal on computer screen" }
       }
     ],
     styles: createStylesDefaults()

package/dist/components/puck-block/text-sections/tab-section-1/tab-section.js

@@ -21,12 +21,16 @@ const TabSection = ({
       /* @__PURE__ */ jsx("div", { className: "border-border mb-8 flex gap-1 border-b", children: tabs.map((tab, i) => /* @__PURE__ */ jsx(
         "button",
         {
-          onClick: () => setActive(i),
+          onClick: (e) => {
+            e.stopPropagation();
+            setActive(i);
+          },
+          style: { pointerEvents: "auto" },
           className: cn(
-            "-mb-px border-b-2 px-4 py-2 text-sm font-medium transition-colors",
+            "-mb-px border-b-2 px-4 py-2 text-sm font-medium transition-colors cursor-pointer",
             active === i ? "border-primary text-foreground" : "text-muted-foreground hover:text-foreground border-transparent"
           ),
-          children: tab.label
+          children: /* @__PURE__ */ jsx("span", { style: { pointerEvents: "none" }, children: tab.label })
         },
         i
       )) }),

package/dist/components/puck-block/text-sections/timeline-1/index.js

@@ -27,18 +27,28 @@ const conf = {
     items: [
       {
         title: "Founded",
-        description: "Started with a bold vision.",
-        date: "2020"
+        description: "Started with a vision to simplify developer workflows.",
+        date: "2021"
       },
       {
-        title: "First 1000 Users",
-        description: "Reached product-market fit.",
-        date: "2021"
+        title: "Public Beta",
+        description: "Opened the platform to early adopters and gathered feedback.",
+        date: "2022"
       },
       {
-        title: "Series A",
-        description: "Raised funding to scale.",
+        title: "10,000 Teams",
+        description: "Crossed 10,000 teams building on the platform.",
         date: "2023"
+      },
+      {
+        title: "Series A",
+        description: "Raised funding to accelerate product development.",
+        date: "2024"
+      },
+      {
+        title: "Enterprise Launch",
+        description: "Launched enterprise tier with SSO, audit logs, and dedicated support.",
+        date: "2025"
       }
     ],
     styles: createStylesDefaults()

package/dist/components/puck-block/text-sections/two-column-1/index.js

@@ -1,4 +1,4 @@
-import { images, contentFieldsWithFeatures, getPlaceholderImageUrl } from "../../../puck-base/core/fields.js";
+import { images, contentFieldsWithFeatures } from "../../../puck-base/core/fields.js";
 import { TwoColumn } from "./two-column.js";
 import { createStylesDefaults, createStylesField } from "../../../puck-base/core/styles.js";
 const conf = {
@@ -51,10 +51,10 @@ const conf = {
     styles: createStylesField()
   },
   defaultProps: {
-    heading: "This is the start of something new",
-    description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
+    heading: "Why leading teams trust us",
+    description: "We handle the infrastructure so you can focus on your product. From startups to enterprises, teams rely on our platform to ship with confidence.",
     badge: {
-      label: "Platform",
+      label: "About Us",
       url: "",
       variant: "default"
     },
@@ -63,18 +63,18 @@ const conf = {
     border: "false",
     images: [
       {
-        alt: "1: 16/9 aspect ratio accessible description of the image",
-        src: getPlaceholderImageUrl("1920x1080", "Feature 1"),
+        alt: "Developer working at desk with dual monitors displaying code",
+        src: "https://images.pexels.com/photos/3861969/pexels-photo-3861969.jpeg?auto=compress&cs=tinysrgb&w=1200",
         aspectRatio: "16x9"
       },
       {
-        alt: "2: 16/9 aspect ratio accessible description of the image",
-        src: getPlaceholderImageUrl("1920x1080", "Feature 2"),
+        alt: "Two developers collaborating on code at a shared workspace",
+        src: "https://images.pexels.com/photos/1181677/pexels-photo-1181677.jpeg?auto=compress&cs=tinysrgb&w=1200",
         aspectRatio: "16x9"
       },
       {
-        alt: "3: 16/9 aspect ratio accessible description of the image",
-        src: getPlaceholderImageUrl("1920x1080", "Feature 3"),
+        alt: "Tech team working together at a modern office",
+        src: "https://images.pexels.com/photos/3183150/pexels-photo-3183150.jpeg?auto=compress&cs=tinysrgb&w=1200",
         aspectRatio: "16x9"
       }
     ],

package/dist/components/shadcn/navigation-menu.js

@@ -1,10 +1,8 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { useState, useCallback } from "react";
 import { NavigationMenu as NavigationMenu$1 } from "@base-ui/react/navigation-menu";
 import { cva } from "class-variance-authority";
 import { cn } from "../../utils/css-utils.js";
 import { ChevronDownIcon } from "lucide-react";
-import { useEditorContext } from "../puck-base/editor-context.js";
 function NavigationMenu({
   align = "start",
   className,
@@ -12,34 +10,6 @@ function NavigationMenu({
   onValueChange,
   ...props
 }) {
-  const { isEditor } = useEditorContext();
-  const [value, setValue] = useState(props.defaultValue ?? null);
-  const handleValueChange = useCallback(
-    (newValue, details) => {
-      if (newValue === null && details.reason === "focus-out") return;
-      setValue(newValue);
-      onValueChange == null ? void 0 : onValueChange(newValue, details);
-    },
-    [onValueChange]
-  );
-  if (!isEditor) {
-    return /* @__PURE__ */ jsxs(
-      NavigationMenu$1.Root,
-      {
-        "data-slot": "navigation-menu",
-        className: cn(
-          "group/navigation-menu relative flex max-w-max flex-1 items-center justify-center",
-          className
-        ),
-        onValueChange,
-        ...props,
-        children: [
-          children,
-          /* @__PURE__ */ jsx(NavigationMenuPositioner, { align })
-        ]
-      }
-    );
-  }
   return /* @__PURE__ */ jsxs(
     NavigationMenu$1.Root,
     {
@@ -48,8 +18,7 @@ function NavigationMenu({
         "group/navigation-menu relative flex max-w-max flex-1 items-center justify-center",
         className
       ),
-      value,
-      onValueChange: handleValueChange,
+      onValueChange,
       ...props,
       children: [
         children,
@@ -104,7 +73,13 @@ function NavigationMenuTrigger({
       children: [
         children,
         " ",
-        /* @__PURE__ */ jsx(ChevronDownIcon, { className: "relative top-px ml-1 size-3 transition duration-300 group-data-popup-open/navigation-menu-trigger:rotate-180 group-data-open/navigation-menu-trigger:rotate-180", "aria-hidden": "true" })
+        /* @__PURE__ */ jsx(
+          ChevronDownIcon,
+          {
+            className: "relative top-px ml-1 size-3 transition duration-300 group-data-popup-open/navigation-menu-trigger:rotate-180 group-data-open/navigation-menu-trigger:rotate-180",
+            "aria-hidden": "true"
+          }
+        )
       ]
     }
   );

package/dist/index.js

@@ -2,9 +2,9 @@ import { default as default2 } from "./components/ui-block/background/index.js";
 import { default as default3 } from "./components/puck-block/header-sections/header-1/index.js";
 import { default as default4 } from "./components/shadcn/badge-promo.js";
 import { default as default5 } from "./components/puck-base/use-upload.js";
+import { ACTION_TYPE_FIELD_MAP, ACTION_TYPE_OPTIONS, ActionField, DownloadActionFields, EmailActionFields, ExternalActionFields, PageActionFields, PhoneActionFields, SectionActionFields } from "./components/puck-base/fields/action-field.js";
 import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "./components/shadcn/accordion.js";
 import { conf } from "./components/puck-block/faq-sections/accordion-1/index.js";
-import { ActionField } from "./components/puck-base/action-field.js";
 import { Alert, AlertAction, AlertDescription, AlertTitle } from "./components/shadcn/alert.js";
 import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger } from "./components/shadcn/alert-dialog.js";
 import { AnimatedThemeToggler } from "./components/shadcn/animated-theme-toggler.js";
@@ -152,6 +152,8 @@ import { resolveActionUrl } from "./components/puck-base/core/types.js";
 import { usePuckAppState, usePuckConfig, usePuckDispatch, usePuckGetSelectorForId, usePuckHistory } from "./components/puck-base/core/hooks.js";
 import { withEditable } from "./components/puck-base/core/with-editable.js";
 export {
+  ACTION_TYPE_FIELD_MAP,
+  ACTION_TYPE_OPTIONS,
   Accordion,
   conf as AccordionConf,
   AccordionContent,
@@ -293,6 +295,7 @@ export {
   DialogTitle,
   DialogTrigger,
   DirectionProvider,
+  DownloadActionFields,
   Drawer,
   DrawerClose,
   DrawerContent,
@@ -319,6 +322,7 @@ export {
   DropdownMenuSubTrigger,
   DropdownMenuTrigger,
   EditorContextProvider,
+  EmailActionFields,
   Empty,
   EmptyContent,
   EmptyDescription,
@@ -326,6 +330,7 @@ export {
   EmptyMedia,
   EmptyTitle,
   ErrorBoundary,
+  ExternalActionFields,
   conf15 as Faq2Conf,
   conf16 as FaqConf,
   conf17 as FeatureCardsConf,
@@ -433,6 +438,7 @@ export {
   NavigationMenuPositioner,
   NavigationMenuTrigger,
   conf36 as NewsletterSignupConf,
+  PageActionFields,
   Pagination,
   PaginationContent,
   PaginationEllipsis,
@@ -440,6 +446,7 @@ export {
   PaginationLink,
   PaginationNext,
   PaginationPrevious,
+  PhoneActionFields,
   Popover,
   PopoverContent,
   PopoverDescription,
@@ -464,6 +471,7 @@ export {
   conf42 as RichTextConf,
   ScrollArea,
   ScrollBar,
+  SectionActionFields,
   Select,
   SelectContent,
   SelectGroup,

package/dist/node_modules/.pnpm/lucide-react@0.540.0_react@19.2.4/node_modules/lucide-react/dist/esm/DynamicIcon.js

@@ -3,7 +3,6 @@
 import { forwardRef, useState, useEffect, createElement } from "react";
 import dynamicIconImports from "./dynamicIconImports.js";
 import Icon from "./Icon.js";
-const iconNames = Object.keys(dynamicIconImports);
 async function getIconNode(name) {
   if (!(name in dynamicIconImports)) {
     throw new Error("[lucide-react]: Name in Lucide DynamicIcon not found");
@@ -33,6 +32,5 @@ const DynamicIcon = forwardRef(
   }
 );
 export {
-  DynamicIcon as default,
-  iconNames
+  DynamicIcon as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dune-react",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -8,7 +8,7 @@
     "gen:meta": "node --import ./scripts/register-mocks.mjs --import tsx/esm scripts/generate-component-meta.ts",
     "build": "pnpm gen:meta && vite build && tsc --project tsconfig.build.json",
     "watch": "vite build --watch & tsc --project tsconfig.build.json --watch --preserveWatchOutput &",
-    "build:sync": "pnpm build && cd /Volumes/code/magent && pnpm sync:dune",
+    "build:sync": "pnpm build && cd ../magent && pnpm sync:dune && cd ../canvas-editor && pnpm sync:dune",
     "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview",
     "storybook": "storybook dev -p 8080",
@@ -69,6 +69,7 @@
     "eslint-plugin-react-refresh": "^0.4.3",
     "eslint-plugin-storybook": "^10.2.19",
     "motion": "12.23.12",
+    "playwright": "1.58.2",
     "react-easy-crop": "5.5.6",
     "rollup-plugin-preserve-directives": "0.4.0",
     "sass": "^1.90.0",

package/dist/components/puck-base/action-field.d.ts

@@ -1,8 +0,0 @@
-import { Action } from "./core/types";
-interface ActionFieldProps {
-    name: string;
-    value: Action | undefined;
-    onChange: (value: Action) => void;
-}
-export declare function ActionField({ name, value, onChange }: ActionFieldProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/puck-base/action-field.js

@@ -1,170 +0,0 @@
-"use client";
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { Input } from "../shadcn/input.js";
-import { Label } from "../shadcn/label.js";
-import { Tabs, TabsList, TabsTrigger } from "../shadcn/tabs.js";
-const ACTION_TYPE_OPTIONS = [
-  { label: "Page Link", value: "page" },
-  { label: "External Link", value: "external" },
-  { label: "Email", value: "email" },
-  { label: "Phone", value: "phone" },
-  { label: "Page Section", value: "section" },
-  { label: "Download", value: "download" },
-  { label: "None", value: "none" }
-];
-function ActionField({ name, value, onChange }) {
-  const current = value ?? { type: "none" };
-  const update = (patch) => {
-    onChange({ ...current, ...patch });
-  };
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx(Label, { children: "Action Type" }),
-      /* @__PURE__ */ jsx(
-        Tabs,
-        {
-          value: current.type,
-          onValueChange: (val) => update({ type: val }),
-          children: /* @__PURE__ */ jsx(TabsList, { className: "h-auto w-full flex-wrap justify-start gap-1 p-1 group-data-[orientation=horizontal]/tabs:h-auto", children: ACTION_TYPE_OPTIONS.map((opt) => /* @__PURE__ */ jsx(
-            TabsTrigger,
-            {
-              value: opt.value,
-              className: "h-7 flex-none text-xs",
-              children: opt.label
-            },
-            opt.value
-          )) })
-        }
-      )
-    ] }),
-    current.type === "page" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx(Label, { children: "Page URL" }),
-      /* @__PURE__ */ jsx(
-        Input,
-        {
-          name: `${name}.pageUrl`,
-          className: "h-8 text-sm",
-          value: current.pageUrl ?? "",
-          onChange: (e) => update({ pageUrl: e.target.value }),
-          placeholder: "/about"
-        }
-      )
-    ] }),
-    current.type === "external" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-        /* @__PURE__ */ jsx(Label, { children: "External URL" }),
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            name: `${name}.externalUrl`,
-            className: "h-8 text-sm",
-            value: current.externalUrl ?? "",
-            onChange: (e) => update({ externalUrl: e.target.value }),
-            placeholder: "https://example.com"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxs("fieldset", { className: "flex flex-col gap-1.5", children: [
-        /* @__PURE__ */ jsx(Label, { children: "Open in new tab" }),
-        /* @__PURE__ */ jsxs("div", { className: "flex gap-3", children: [
-          /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-1.5 text-sm", children: [
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                type: "radio",
-                name: `${name}.openInNewTab`,
-                value: "true",
-                checked: current.openInNewTab === "true",
-                onChange: () => update({ openInNewTab: "true" })
-              }
-            ),
-            "Yes"
-          ] }),
-          /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-1.5 text-sm", children: [
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                type: "radio",
-                name: `${name}.openInNewTab`,
-                value: "false",
-                checked: current.openInNewTab !== "true",
-                onChange: () => update({ openInNewTab: "false" })
-              }
-            ),
-            "No"
-          ] })
-        ] })
-      ] })
-    ] }),
-    current.type === "email" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-        /* @__PURE__ */ jsx(Label, { children: "Email" }),
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            name: `${name}.email`,
-            className: "h-8 text-sm",
-            value: current.email ?? "",
-            onChange: (e) => update({ email: e.target.value }),
-            placeholder: "hello@example.com"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-        /* @__PURE__ */ jsx(Label, { children: "Subject" }),
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            name: `${name}.subject`,
-            className: "h-8 text-sm",
-            value: current.subject ?? "",
-            onChange: (e) => update({ subject: e.target.value }),
-            placeholder: "Optional email subject"
-          }
-        )
-      ] })
-    ] }),
-    current.type === "phone" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx(Label, { children: "Phone" }),
-      /* @__PURE__ */ jsx(
-        Input,
-        {
-          name: `${name}.phone`,
-          className: "h-8 text-sm",
-          value: current.phone ?? "",
-          onChange: (e) => update({ phone: e.target.value }),
-          placeholder: "+1 234 567 890"
-        }
-      )
-    ] }),
-    current.type === "section" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx(Label, { children: "Section ID" }),
-      /* @__PURE__ */ jsx(
-        Input,
-        {
-          name: `${name}.sectionId`,
-          className: "h-8 text-sm",
-          value: current.sectionId ?? "",
-          onChange: (e) => update({ sectionId: e.target.value }),
-          placeholder: "#section-id"
-        }
-      )
-    ] }),
-    current.type === "download" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx(Label, { children: "Download URL" }),
-      /* @__PURE__ */ jsx(
-        Input,
-        {
-          name: `${name}.downloadUrl`,
-          className: "h-8 text-sm",
-          value: current.downloadUrl ?? "",
-          onChange: (e) => update({ downloadUrl: e.target.value }),
-          placeholder: "https://example.com/file.pdf"
-        }
-      )
-    ] })
-  ] });
-}
-export {
-  ActionField
-};