dune-react 0.0.16 → 0.0.18

package/dist/components/puck-base/core/fields.d.ts

@@ -801,4 +801,27 @@ export declare const form: {
     };
 };
 export declare const formDefaults: CompoundFormProps;
+/** 地图定位的核心数据：地址 + 坐标 */
+export interface MapLocation {
+    /** 用户可读的完整地址（显示 & 搜索用） */
+    address: string;
+    /** 纬度 */
+    lat: number;
+    /** 经度 */
+    lng: number;
+    /** 地图缩放级别，默认 14 */
+    zoom?: number;
+    /** Google Place ID（可选，便于精确定位） */
+    placeId?: string;
+}
+/** 从 MapLocation 生成 Google Maps embed URL */
+export declare function getMapEmbedUrl(loc: MapLocation): string;
+/** 从 MapLocation 生成 Google Maps 导航 URL */
+export declare function getDirectionsUrl(loc: MapLocation): string;
+export declare const locationDefaults: MapLocation;
+export declare const location: {
+    type: "custom";
+    label: string;
+    render: any;
+};
 export * from "./styles";

package/dist/components/puck-base/core/fields.js

@@ -1,7 +1,7 @@
 import { fieldTypes } from "../field.js";
 import { ActionField } from "../fields/action-field.js";
 import { IconPickerField } from "../icon-picker-field.js";
-import { backgroundColor, backgroundImage, bannerStylesDefaults, bannerStylesField, createStylesDefaults, createStylesField, heroStylesDefaults, padding, paddingDefaults, paddingLevel, sectionBaseStyleDefaults, sectionBaseStyleFields, sectionOverlay, sectionStyle } from "./styles.js";
+import { LocationField } from "../fields/location-field.js";
 const formMethods = ["get", "post", "put", "patch", "delete"];
 const icon = {
   type: "custom",
@@ -241,42 +241,51 @@ const formDefaults = {
     icon: "move-right"
   }
 };
+function getMapEmbedUrl(loc) {
+  const { lat, lng, zoom = 14 } = loc;
+  return `https://maps.google.com/maps?q=${lat},${lng}&z=${zoom}&output=embed`;
+}
+function getDirectionsUrl(loc) {
+  return `https://www.google.com/maps/dir/?api=1&destination=${loc.lat},${loc.lng}`;
+}
+const locationDefaults = {
+  address: "San Francisco, CA, USA",
+  lat: 37.7749,
+  lng: -122.4194,
+  zoom: 13
+};
+const location = {
+  type: "custom",
+  label: "Location",
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  render: LocationField
+};
 export {
   action,
   actionDefaults,
-  backgroundColor,
-  backgroundImage,
   badge,
-  bannerStylesDefaults,
-  bannerStylesField,
   button,
   buttons,
   card,
   cards,
   contentFields,
   contentFieldsWithFeatures,
-  createStylesDefaults,
-  createStylesField,
   description,
   features,
   field,
   fieldDefaults,
   form,
   formDefaults,
+  getDirectionsUrl,
+  getMapEmbedUrl,
   getPlaceholderImageUrl,
   heading,
-  heroStylesDefaults,
   icon,
   image,
   image16x9Placeholder,
   image1x1Placeholder,
   image9x16Placeholder,
   images,
-  padding,
-  paddingDefaults,
-  paddingLevel,
-  sectionBaseStyleDefaults,
-  sectionBaseStyleFields,
-  sectionOverlay,
-  sectionStyle
+  location,
+  locationDefaults
 };

package/dist/components/puck-base/core/styles.d.ts

@@ -1394,11 +1394,7 @@ export declare const contactStylesDefaults: {
         readonly bottom: "medium";
     };
 };
-export interface LocationSectionStyles extends SectionBaseStyles {
-    mapHeight?: number;
-    mapFilter?: string;
-    mapTintColor?: string;
-}
+export type LocationSectionStyles = SectionBaseStyles;
 export declare const locationStylesField: {
     type: "object";
     label: string;

package/dist/components/puck-base/core/styles.js

@@ -216,11 +216,7 @@ createStylesField({
   }
 });
 createStylesDefaults();
-createStylesField({
-  mapHeight: { type: "number", label: "Map Height", min: 200, max: 800 },
-  mapFilter: { type: "text", label: "Map Filter (CSS)" },
-  mapTintColor: { type: "text", label: "Map Tint Color" }
-});
+createStylesField();
 createStylesDefaults();
 createStylesField();
 createStylesDefaults();

package/dist/components/puck-base/editor-context.d.ts

@@ -17,6 +17,8 @@ type EditorContextValue = {
     domain?: string;
     /** 站内可选页面列表，用于 url 字段快捷选择 */
     sitePages?: SitePage[];
+    /** Google Maps API Key，用于 LocationField 地址搜索 */
+    googleMapsApiKey?: string;
 };
 export declare const EditorContextProvider: import("react").Provider<EditorContextValue>;
 export declare const useEditorContext: () => EditorContextValue;

package/dist/components/puck-base/fields/index.d.ts

@@ -4,4 +4,5 @@ export { ColorField } from "./color-field";
 export { RadioToggleField } from "./radio-toggle-field";
 export { ObjectField } from "./object-field";
 export { VirtualizedSelectField, LARGE_SELECT_THRESHOLD, } from "./virtualized-select-field";
+export { LocationField } from "./location-field";
 export { ActionField, ACTION_TYPE_FIELD_MAP, ACTION_TYPE_OPTIONS, PageActionFields, ExternalActionFields, EmailActionFields, PhoneActionFields, SectionActionFields, DownloadActionFields, type ActionTypeFieldProps, } from "./action-field";

package/dist/components/puck-base/fields/location-field.d.ts

@@ -0,0 +1,44 @@
+import type { MapLocation } from "../core/fields";
+interface GLatLng {
+    lat(): number;
+    lng(): number;
+}
+interface GGeometry {
+    location?: GLatLng;
+}
+interface GPlaceResult {
+    formatted_address?: string;
+    geometry?: GGeometry;
+    place_id?: string;
+    address_components?: unknown[];
+}
+interface GAutocomplete {
+    getPlace(): GPlaceResult;
+    addListener(event: string, handler: () => void): void;
+}
+interface GAutocompleteConstructor {
+    new (input: HTMLInputElement, opts?: Record<string, unknown>): GAutocomplete;
+}
+interface GGoogleMaps {
+    places: {
+        Autocomplete: GAutocompleteConstructor;
+    };
+    event: {
+        clearInstanceListeners(instance: unknown): void;
+    };
+}
+interface GGoogle {
+    maps: GGoogleMaps;
+}
+declare global {
+    interface Window {
+        google?: GGoogle;
+    }
+}
+export interface LocationFieldProps {
+    name: string;
+    value: MapLocation | undefined;
+    onChange: (value: MapLocation) => void;
+}
+export declare const LocationField: import("react").NamedExoticComponent<LocationFieldProps>;
+export {};

package/dist/components/puck-base/fields/location-field.js

@@ -0,0 +1,207 @@
+"use client";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { memo, useState, useRef, useEffect, useCallback } from "react";
+import { Input } from "../../shadcn/input.js";
+import { Label } from "../../shadcn/label.js";
+import { Loader2, Search, X, MapPin } from "lucide-react";
+import { useEditorContext } from "../editor-context.js";
+let googleLoadPromise = null;
+function loadGooglePlaces(apiKey) {
+  var _a, _b;
+  if (googleLoadPromise) return googleLoadPromise;
+  if (typeof window !== "undefined" && ((_b = (_a = window.google) == null ? void 0 : _a.maps) == null ? void 0 : _b.places)) {
+    return Promise.resolve();
+  }
+  googleLoadPromise = new Promise((resolve, reject) => {
+    const script = document.createElement("script");
+    script.src = `https://maps.googleapis.com/maps/api/js?key=${apiKey}&libraries=places`;
+    script.async = true;
+    script.onload = () => resolve();
+    script.onerror = () => {
+      googleLoadPromise = null;
+      reject(new Error("Failed to load Google Maps API"));
+    };
+    document.head.appendChild(script);
+  });
+  return googleLoadPromise;
+}
+const LocationField = memo(function LocationField2({
+  value,
+  onChange
+}) {
+  const { googleMapsApiKey } = useEditorContext();
+  const apiKey = googleMapsApiKey || "";
+  const [inputValue, setInputValue] = useState((value == null ? void 0 : value.address) || "");
+  const [isLoaded, setIsLoaded] = useState(false);
+  const [loadError, setLoadError] = useState(false);
+  const inputRef = useRef(null);
+  const autocompleteRef = useRef(null);
+  useEffect(() => {
+    if ((value == null ? void 0 : value.address) && value.address !== inputValue) {
+      setInputValue(value.address);
+    }
+  }, [value == null ? void 0 : value.address]);
+  useEffect(() => {
+    if (!apiKey) {
+      setLoadError(true);
+      return;
+    }
+    loadGooglePlaces(apiKey).then(() => setIsLoaded(true)).catch(() => setLoadError(true));
+  }, [apiKey]);
+  useEffect(() => {
+    if (!isLoaded || !inputRef.current || autocompleteRef.current) return;
+    const G = window.google;
+    const autocomplete = new G.maps.places.Autocomplete(inputRef.current, {
+      fields: [
+        "formatted_address",
+        "geometry",
+        "place_id",
+        "address_components"
+      ]
+    });
+    autocomplete.addListener("place_changed", () => {
+      var _a;
+      const place = autocomplete.getPlace();
+      if (!((_a = place.geometry) == null ? void 0 : _a.location)) return;
+      const lat = place.geometry.location.lat();
+      const lng = place.geometry.location.lng();
+      const address = place.formatted_address || "";
+      const newLocation = {
+        address,
+        lat,
+        lng,
+        zoom: (value == null ? void 0 : value.zoom) ?? 14,
+        placeId: place.place_id || ""
+      };
+      setInputValue(address);
+      onChange(newLocation);
+    });
+    autocompleteRef.current = autocomplete;
+    return () => {
+      var _a;
+      (_a = window.google) == null ? void 0 : _a.maps.event.clearInstanceListeners(autocomplete);
+      autocompleteRef.current = null;
+    };
+  }, [isLoaded]);
+  const handleClear = useCallback(() => {
+    var _a;
+    setInputValue("");
+    onChange({
+      address: "",
+      lat: 0,
+      lng: 0,
+      zoom: 14,
+      placeId: ""
+    });
+    (_a = inputRef.current) == null ? void 0 : _a.focus();
+  }, [onChange]);
+  const handleZoomChange = useCallback(
+    (e) => {
+      if (!value) return;
+      onChange({ ...value, zoom: Number(e.target.value) });
+    },
+    [value, onChange]
+  );
+  const embedUrl = value && value.lat !== 0 ? `https://maps.google.com/maps?q=${value.lat},${value.lng}&z=${value.zoom ?? 14}&output=embed` : null;
+  return /* @__PURE__ */ jsxs("div", { className: "mb-4 space-y-3", children: [
+    /* @__PURE__ */ jsx(Label, { children: "Location" }),
+    /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3", children: !isLoaded && !loadError ? /* @__PURE__ */ jsx(Loader2, { className: "text-muted-foreground size-4 animate-spin" }) : /* @__PURE__ */ jsx(Search, { className: "text-muted-foreground size-4" }) }),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          ref: inputRef,
+          value: inputValue,
+          onChange: (e) => setInputValue(e.target.value),
+          placeholder: loadError ? "Enter address manually..." : "Search address or place...",
+          className: "pl-9 pr-8"
+        }
+      ),
+      inputValue && /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: handleClear,
+          className: "text-muted-foreground hover:text-foreground absolute inset-y-0 right-0 flex items-center pr-3",
+          children: /* @__PURE__ */ jsx(X, { className: "size-3.5" })
+        }
+      )
+    ] }),
+    loadError && /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+        /* @__PURE__ */ jsx(Label, { className: "text-xs", children: "Latitude" }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            type: "number",
+            step: "any",
+            value: (value == null ? void 0 : value.lat) ?? "",
+            onChange: (e) => onChange({
+              ...value || { address: "", lng: 0, zoom: 14 },
+              lat: Number(e.target.value)
+            }),
+            placeholder: "37.7749",
+            className: "h-8 text-xs"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+        /* @__PURE__ */ jsx(Label, { className: "text-xs", children: "Longitude" }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            type: "number",
+            step: "any",
+            value: (value == null ? void 0 : value.lng) ?? "",
+            onChange: (e) => onChange({
+              ...value || { address: "", lat: 0, zoom: 14 },
+              lng: Number(e.target.value)
+            }),
+            placeholder: "-122.4194",
+            className: "h-8 text-xs"
+          }
+        )
+      ] })
+    ] }),
+    value && value.lat !== 0 && /* @__PURE__ */ jsxs("div", { className: "border-border bg-muted/50 space-y-2 rounded-lg border p-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2", children: [
+        /* @__PURE__ */ jsx(MapPin, { className: "text-primary mt-0.5 size-3.5 shrink-0" }),
+        /* @__PURE__ */ jsx("span", { className: "text-foreground text-sm font-medium leading-tight", children: value.address })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground pl-5.5 text-xs", children: [
+        value.lat.toFixed(4),
+        ", ",
+        value.lng.toFixed(4)
+      ] })
+    ] }),
+    embedUrl && /* @__PURE__ */ jsx("div", { className: "overflow-hidden rounded-lg border", children: /* @__PURE__ */ jsx(
+      "iframe",
+      {
+        src: embedUrl,
+        title: "Location preview",
+        className: "h-[160px] w-full border-0",
+        loading: "lazy",
+        referrerPolicy: "no-referrer-when-downgrade"
+      }
+    ) }),
+    value && value.lat !== 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsx(Label, { className: "shrink-0 text-xs", children: "Zoom" }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "range",
+          min: 1,
+          max: 20,
+          step: 1,
+          value: value.zoom ?? 14,
+          onChange: handleZoomChange,
+          className: "h-1.5 flex-1 cursor-pointer appearance-none rounded-full bg-gray-200 accent-current"
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "text-muted-foreground w-6 text-right text-xs tabular-nums", children: value.zoom ?? 14 })
+    ] })
+  ] });
+});
+export {
+  LocationField
+};

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

@@ -1,4 +1,4 @@
-import { button } from "../../../puck-base/core/fields.js";
+import { locationDefaults, button, location } from "../../../puck-base/core/fields.js";
 import { LocationSection } from "./location.js";
 import { createStylesDefaults, createStylesField } from "../../../puck-base/core/styles.js";
 const locationButtonFields = {
@@ -40,26 +40,24 @@ const conf = {
         { label: "Map Left / Text Right", value: "right" }
       ]
     },
-    mapEmbedUrl: { type: "text", label: "Google Map Embed URL" },
-    mapTitle: { type: "text", label: "Map Title" },
-    mapFilter: { type: "text", label: "Map Filter (CSS)" },
-    mapTintMode: {
-      type: "select",
-      label: "Map Tint Mode",
+    location,
+    mapStyle: {
+      type: "radio",
+      label: "Map Style",
+      options: [
+        { label: "Default", value: "default" },
+        { label: "Grayscale", value: "grayscale" },
+        { label: "Dark", value: "dark" }
+      ]
+    },
+    mapTint: {
+      type: "radio",
+      label: "Map Tint",
       options: [
         { label: "Theme", value: "theme" },
-        { label: "Custom", value: "custom" },
         { label: "None", value: "none" }
       ]
     },
-    mapTintColor: { type: "text", label: "Map Tint Color" },
-    mapTintOpacity: {
-      type: "number",
-      label: "Map Tint Opacity",
-      min: 0,
-      max: 1,
-      step: 0.01
-    },
     buttons: {
       type: "array",
       max: 3,
@@ -74,12 +72,9 @@ const conf = {
     description: "We have offices around the globe. Visit us or get in touch with a local team near you.",
     contentAlign: "left",
     contentPosition: "left",
-    mapEmbedUrl: "https://maps.google.com/maps?q=San%20Francisco%2C%20California%2C%20United%20States&z=13&t=m&output=embed",
-    mapTitle: "Google Maps",
-    mapFilter: "grayscale(45%) contrast(1.06) brightness(0.98) saturate(0.9)",
-    mapTintMode: "theme",
-    mapTintColor: "var(--primary)",
-    mapTintOpacity: 0.21,
+    location: locationDefaults,
+    mapStyle: "grayscale",
+    mapTint: "theme",
     buttons: [
       {
         label: "Contact us",

package/dist/components/puck-block/location-sections/location-1/location.d.ts

@@ -1,5 +1,6 @@
 import { CompoundContainerProps } from "@/components/puck-base/container";
 import { CompoundButtonProps } from "@/components/puck-base/button";
+import type { MapLocation } from "@/components/puck-base/core/fields";
 interface LocationButton extends Omit<CompoundButtonProps, "label"> {
     label?: string;
     url?: string;
@@ -12,12 +13,9 @@ export interface LocationSectionProps {
     description?: string;
     contentAlign?: "left" | "right";
     contentPosition?: "left" | "right";
-    mapEmbedUrl?: string;
-    mapTitle?: string;
-    mapFilter?: string;
-    mapTintMode?: "theme" | "custom" | "none";
-    mapTintColor?: string;
-    mapTintOpacity?: number;
+    location?: MapLocation;
+    mapStyle?: "default" | "grayscale" | "dark";
+    mapTint?: "none" | "theme";
     buttons?: LocationButton[];
     styles?: {
         padding?: CompoundContainerProps["padding"];
@@ -25,5 +23,5 @@ export interface LocationSectionProps {
         backgroundColor?: string;
     };
 }
-export declare const LocationSection: ({ heading, description, contentAlign, contentPosition, mapEmbedUrl, mapTitle, mapFilter, mapTintMode, mapTintColor, mapTintOpacity, buttons, styles, }: LocationSectionProps) => import("react/jsx-runtime").JSX.Element;
+export declare const LocationSection: ({ heading, description, contentAlign, contentPosition, location: loc, mapStyle, mapTint, buttons, styles, }: LocationSectionProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/puck-block/location-sections/location-1/location.js

@@ -2,6 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { CompoundContainer } from "../../../puck-base/container.js";
 import { CompoundButton } from "../../../puck-base/button.js";
 import { cn } from "../../../../utils/css-utils.js";
+import { getMapEmbedUrl } from "../../../puck-base/core/fields.js";
 const LocationActionButton = ({
   label,
   url,
@@ -35,24 +36,27 @@ const LocationActionButton = ({
     }
   ) });
 };
+const MAP_STYLE_FILTERS = {
+  default: "",
+  grayscale: "grayscale(45%) contrast(1.06) brightness(0.98) saturate(0.9)",
+  dark: "grayscale(100%) invert(1) contrast(1.1) brightness(0.8)"
+};
 const LocationSection = ({
   heading,
   description,
   contentAlign = "left",
   contentPosition = "left",
-  mapEmbedUrl,
-  mapTitle = "Google Maps",
-  mapFilter,
-  mapTintMode = "theme",
-  mapTintColor,
-  mapTintOpacity = 0.2,
+  location: loc,
+  mapStyle = "default",
+  mapTint = "theme",
   buttons = [],
   styles
 }) => {
   const isTextRight = contentAlign === "right";
   const isContentRight = contentPosition === "right";
-  const showMapTint = mapTintMode !== "none" && mapTintOpacity > 0;
-  const mapTintBackgroundColor = mapTintMode === "custom" ? mapTintColor || void 0 : void 0;
+  const showMapTint = mapTint === "theme";
+  const mapEmbedUrl = loc && loc.lat !== 0 ? getMapEmbedUrl(loc) : void 0;
+  const mapFilter = MAP_STYLE_FILTERS[mapStyle] || "";
   return /* @__PURE__ */ jsx(
     CompoundContainer,
     {
@@ -105,12 +109,12 @@ const LocationSection = ({
                 "iframe",
                 {
                   src: mapEmbedUrl,
-                  title: mapTitle,
+                  title: (loc == null ? void 0 : loc.address) || "Google Maps",
                   className: "h-full w-full border-0",
                   loading: "lazy",
                   referrerPolicy: "no-referrer-when-downgrade",
                   allowFullScreen: true,
-                  style: { filter: mapFilter }
+                  style: mapFilter ? { filter: mapFilter } : void 0
                 }
               ) : /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center justify-center bg-muted text-muted-foreground", children: "Map address not configured" }),
               showMapTint ? /* @__PURE__ */ jsx(
@@ -118,8 +122,7 @@ const LocationSection = ({
                 {
                   className: "bg-primary pointer-events-none absolute inset-0",
                   style: {
-                    backgroundColor: mapTintBackgroundColor,
-                    opacity: mapTintOpacity,
+                    opacity: 0.2,
                     mixBlendMode: "color"
                   }
                 }

package/dist/components/puck-block/location-sections/location-2/index.js

@@ -1,4 +1,4 @@
-import { button } from "../../../puck-base/core/fields.js";
+import { button, location } from "../../../puck-base/core/fields.js";
 import { Location2 } from "./location.js";
 import { createStylesDefaults, createStylesField } from "../../../puck-base/core/styles.js";
 const locationButtonFields = {
@@ -43,7 +43,11 @@ const conf = {
   fields: {
     heading: { type: "textarea", contentEditable: true },
     description: { type: "textarea", contentEditable: true },
-    address: { type: "textarea", label: "Address", contentEditable: true },
+    displayAddress: {
+      type: "textarea",
+      label: "Display Address",
+      contentEditable: true
+    },
     contentPosition: {
       type: "radio",
       label: "Card Position",
@@ -52,26 +56,24 @@ const conf = {
         { label: "Right", value: "right" }
       ]
     },
-    mapEmbedUrl: { type: "text", label: "Google Map Embed URL" },
-    mapTitle: { type: "text", label: "Map Title" },
-    mapFilter: { type: "text", label: "Map Filter (CSS)" },
-    mapTintMode: {
-      type: "select",
+    location,
+    mapStyle: {
+      type: "radio",
+      label: "Map Style",
+      options: [
+        { label: "Default", value: "default" },
+        { label: "Grayscale", value: "grayscale" },
+        { label: "Dark", value: "dark" }
+      ]
+    },
+    mapTint: {
+      type: "radio",
       label: "Map Tint",
       options: [
         { label: "None", value: "none" },
-        { label: "Theme", value: "theme" },
-        { label: "Custom", value: "custom" }
+        { label: "Theme", value: "theme" }
       ]
     },
-    mapTintColor: { type: "text", label: "Map Tint Color" },
-    mapTintOpacity: {
-      type: "number",
-      label: "Map Tint Opacity",
-      min: 0,
-      max: 1,
-      step: 0.01
-    },
     buttons: {
       type: "array",
       max: 3,
@@ -84,14 +86,16 @@ const conf = {
   defaultProps: {
     heading: "Our Offices",
     description: "Visit our headquarters in London or reach out to one of our regional offices worldwide.",
-    address: "10 Finsbury Square\nLondon, UK EC2A 1AF",
+    displayAddress: "10 Finsbury Square\nLondon, UK EC2A 1AF",
     contentPosition: "left",
-    mapEmbedUrl: "https://maps.google.com/maps?q=London%2C%20United%20Kingdom&z=13&t=m&output=embed",
-    mapTitle: "Google Maps",
-    mapFilter: "grayscale(40%) contrast(1.05) brightness(1.0) saturate(0.85)",
-    mapTintMode: "none",
-    mapTintColor: "var(--primary)",
-    mapTintOpacity: 0.15,
+    location: {
+      address: "London, United Kingdom",
+      lat: 51.5074,
+      lng: -0.1278,
+      zoom: 13
+    },
+    mapStyle: "grayscale",
+    mapTint: "none",
     buttons: [
       {
         label: "Get Directions",

package/dist/components/puck-block/location-sections/location-2/location.d.ts

@@ -1,5 +1,6 @@
 import { CompoundContainerProps } from "@/components/puck-base/container";
 import { CompoundButtonProps } from "@/components/puck-base/button";
+import type { MapLocation } from "@/components/puck-base/core/fields";
 interface LocationButton extends Omit<CompoundButtonProps, "label"> {
     label?: string;
     url?: string;
@@ -10,14 +11,11 @@ interface LocationButton extends Omit<CompoundButtonProps, "label"> {
 export interface Location2Props {
     heading?: string;
     description?: string;
-    address?: string;
+    displayAddress?: string;
     contentPosition?: "left" | "right";
-    mapEmbedUrl?: string;
-    mapTitle?: string;
-    mapFilter?: string;
-    mapTintMode?: "none" | "theme" | "custom";
-    mapTintColor?: string;
-    mapTintOpacity?: number;
+    location?: MapLocation;
+    mapStyle?: "default" | "grayscale" | "dark";
+    mapTint?: "none" | "theme";
     buttons?: LocationButton[];
     styles?: {
         padding?: CompoundContainerProps["padding"];
@@ -27,5 +25,5 @@ export interface Location2Props {
         sectionHeight?: "sm" | "md" | "lg";
     };
 }
-export declare const Location2: ({ heading, description, address, contentPosition, mapEmbedUrl, mapTitle, mapFilter, mapTintMode, mapTintColor, mapTintOpacity, buttons, styles, }: Location2Props) => import("react/jsx-runtime").JSX.Element;
+export declare const Location2: ({ heading, description, displayAddress, contentPosition, location: loc, mapStyle, mapTint, buttons, styles, }: Location2Props) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/puck-block/location-sections/location-2/location.js

@@ -1,6 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { CompoundButton } from "../../../puck-base/button.js";
 import { cn } from "../../../../utils/css-utils.js";
+import { getMapEmbedUrl } from "../../../puck-base/core/fields.js";
 const ActionButton = ({
   label,
   url,
@@ -34,24 +35,27 @@ const ActionButton = ({
     }
   ) });
 };
+const MAP_STYLE_FILTERS = {
+  default: "",
+  grayscale: "grayscale(40%) contrast(1.05) brightness(1.0) saturate(0.85)",
+  dark: "grayscale(100%) invert(1) contrast(1.1) brightness(0.8)"
+};
 const Location2 = ({
   heading,
   description,
-  address,
+  displayAddress,
   contentPosition = "left",
-  mapEmbedUrl,
-  mapTitle = "Google Maps",
-  mapFilter,
-  mapTintMode = "none",
-  mapTintColor,
-  mapTintOpacity = 0.15,
+  location: loc,
+  mapStyle = "default",
+  mapTint = "none",
   buttons = [],
   styles
 }) => {
   const isRight = contentPosition === "right";
   const isGlass = (styles == null ? void 0 : styles.cardStyle) === "glass";
-  const showMapTint = mapTintMode !== "none" && mapTintOpacity > 0;
-  const tintColor = mapTintMode === "custom" ? mapTintColor || void 0 : void 0;
+  const showMapTint = mapTint === "theme";
+  const mapEmbedUrl = loc && loc.lat !== 0 ? getMapEmbedUrl(loc) : void 0;
+  const mapFilter = MAP_STYLE_FILTERS[mapStyle] || "";
   const heightClass = (styles == null ? void 0 : styles.sectionHeight) === "sm" ? "h-[480px]" : (styles == null ? void 0 : styles.sectionHeight) === "lg" ? "h-[75vh] min-h-[520px]" : "h-[600px]";
   return /* @__PURE__ */ jsxs("div", { className: cn("relative w-full overflow-hidden", heightClass), children: [
     /* @__PURE__ */ jsxs("div", { className: "absolute inset-0", children: [
@@ -59,12 +63,12 @@ const Location2 = ({
         "iframe",
         {
           src: mapEmbedUrl,
-          title: mapTitle,
+          title: (loc == null ? void 0 : loc.address) || "Google Maps",
           className: "h-full w-full border-0",
           loading: "lazy",
           referrerPolicy: "no-referrer-when-downgrade",
           allowFullScreen: true,
-          style: { filter: mapFilter }
+          style: mapFilter ? { filter: mapFilter } : void 0
         }
       ) : /* @__PURE__ */ jsx("div", { className: "bg-muted text-muted-foreground flex h-full w-full items-center justify-center text-sm", children: "Map address not configured" }),
       showMapTint && /* @__PURE__ */ jsx(
@@ -72,8 +76,7 @@ const Location2 = ({
         {
           className: "bg-primary pointer-events-none absolute inset-0",
           style: {
-            backgroundColor: tintColor,
-            opacity: mapTintOpacity,
+            opacity: 0.15,
             mixBlendMode: "color"
           }
         }
@@ -96,7 +99,7 @@ const Location2 = ({
             children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5", children: [
               heading && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: /* @__PURE__ */ jsx("h2", { className: "text-foreground whitespace-pre-line font-serif text-3xl leading-tight tracking-tighter md:text-4xl", children: heading }) }),
               description && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm leading-relaxed", children: description }),
-              address && /* @__PURE__ */ jsxs("div", { className: "text-foreground flex items-start gap-2 text-sm", children: [
+              displayAddress && /* @__PURE__ */ jsxs("div", { className: "text-foreground flex items-start gap-2 text-sm", children: [
                 /* @__PURE__ */ jsxs(
                   "svg",
                   {
@@ -115,7 +118,7 @@ const Location2 = ({
                     ]
                   }
                 ),
-                /* @__PURE__ */ jsx("span", { className: "whitespace-pre-line", children: address })
+                /* @__PURE__ */ jsx("span", { className: "whitespace-pre-line", children: displayAddress })
               ] }),
               buttons.some((button) => button == null ? void 0 : button.label) && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-3 pt-1", children: buttons.map((button, index) => /* @__PURE__ */ jsx(ActionButton, { ...button }, index)) })
             ] })

package/dist/components/puck-block/location-sections/location-3/index.js

@@ -1,11 +1,16 @@
+import { location } from "../../../puck-base/core/fields.js";
 import { Location3 } from "./location.js";
 import { createStylesDefaults, createStylesField } from "../../../puck-base/core/styles.js";
-const defaultLocation = {
+const defaultLocationEntry = {
   name: "San Francisco, CA",
-  address: "123 Market Street\nSan Francisco, CA 94105",
+  location: {
+    address: "123 Market Street, San Francisco, CA 94105",
+    lat: 37.7749,
+    lng: -122.4194,
+    zoom: 14
+  },
   phone: "+1 (415) 555-0100",
-  hours: "Mon–Fri: 9am–6pm\nSat: 10am–4pm",
-  directionsUrl: "https://maps.google.com"
+  hours: "Mon–Fri: 9am–6pm\nSat: 10am–4pm"
 };
 const location3ExtraStyleFields = {
   mapHeight: {
@@ -30,9 +35,16 @@ const conf = {
   fields: {
     heading: { type: "textarea", contentEditable: true },
     description: { type: "textarea", contentEditable: true },
-    mapEmbedUrl: { type: "text", label: "Google Map Embed URL" },
-    mapTitle: { type: "text", label: "Map Title" },
-    mapFilter: { type: "text", label: "Map Filter (CSS)" },
+    mapLocation: { ...location, label: "Map Location" },
+    mapStyle: {
+      type: "radio",
+      label: "Map Style",
+      options: [
+        { label: "Default", value: "default" },
+        { label: "Grayscale", value: "grayscale" },
+        { label: "Dark", value: "dark" }
+      ]
+    },
     locations: {
       type: "array",
       min: 1,
@@ -40,37 +52,48 @@ const conf = {
       getItemSummary: (item, index = 0) => item.name || `Location ${index + 1}`,
       arrayFields: {
         name: { type: "text", contentEditable: true },
-        address: { type: "textarea", contentEditable: true },
+        location,
         phone: { type: "text" },
         hours: { type: "textarea", label: "Business Hours" },
-        directionsUrl: { type: "text", label: "Directions URL" },
         directionsLabel: { type: "text", label: "Directions Button Label" }
       },
-      defaultItemProps: defaultLocation
+      defaultItemProps: defaultLocationEntry
     },
     styles: createStylesField(location3ExtraStyleFields)
   },
   defaultProps: {
     heading: "Our Offices",
     description: "We have teams around the world ready to help you succeed.",
-    mapEmbedUrl: "https://maps.google.com/maps?q=New%20York%2C%20NY%2C%20United%20States&z=11&t=m&output=embed",
-    mapTitle: "Google Maps",
-    mapFilter: "grayscale(35%) contrast(1.05) brightness(1.0)",
+    mapLocation: {
+      address: "New York, NY, United States",
+      lat: 40.7128,
+      lng: -74.006,
+      zoom: 11
+    },
+    mapStyle: "grayscale",
     locations: [
-      defaultLocation,
+      defaultLocationEntry,
       {
         name: "London, UK",
-        address: "10 Finsbury Square\nLondon, EC2A 1AF",
+        location: {
+          address: "10 Finsbury Square, London, EC2A 1AF",
+          lat: 51.5207,
+          lng: -0.0876,
+          zoom: 14
+        },
         phone: "+44 20 7946 0200",
-        hours: "Mon–Fri: 9am–6pm\nSat: 10am–3pm",
-        directionsUrl: "https://maps.google.com"
+        hours: "Mon–Fri: 9am–6pm\nSat: 10am–3pm"
       },
       {
         name: "Tokyo, Japan",
-        address: "1-1-2 Marunouchi\nChiyoda-ku, Tokyo 100-0005",
+        location: {
+          address: "1-1-2 Marunouchi, Chiyoda-ku, Tokyo 100-0005",
+          lat: 35.6812,
+          lng: 139.7671,
+          zoom: 14
+        },
         phone: "+81 3-1234-5678",
-        hours: "Mon–Fri: 9am–6pm",
-        directionsUrl: "https://maps.google.com"
+        hours: "Mon–Fri: 9am–6pm"
       }
     ],
     styles: createStylesDefaults({

package/dist/components/puck-block/location-sections/location-3/location.d.ts

@@ -1,20 +1,19 @@
 import { CompoundContainerProps } from "@/components/puck-base/container";
 import type { Action } from "@/components/puck-base/core/types";
+import type { MapLocation } from "@/components/puck-base/core/fields";
 export interface LocationEntry {
     name: string;
-    address?: string;
+    location?: MapLocation;
     phone?: string;
     hours?: string;
-    directionsUrl?: string;
     directionsLabel?: string;
     directionsAction?: Action;
 }
 export interface Location3Props {
     heading?: string;
     description?: string;
-    mapEmbedUrl?: string;
-    mapTitle?: string;
-    mapFilter?: string;
+    mapLocation?: MapLocation;
+    mapStyle?: "default" | "grayscale" | "dark";
     locations: LocationEntry[];
     styles?: {
         padding?: CompoundContainerProps["padding"];
@@ -24,4 +23,4 @@ export interface Location3Props {
         columns?: "2" | "3";
     };
 }
-export declare const Location3: ({ heading, description, mapEmbedUrl, mapTitle, mapFilter, locations, styles, }: Location3Props) => import("react/jsx-runtime").JSX.Element;
+export declare const Location3: ({ heading, description, mapLocation, mapStyle, locations, styles, }: Location3Props) => import("react/jsx-runtime").JSX.Element;

package/dist/components/puck-block/location-sections/location-3/location.js

@@ -2,15 +2,22 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { CompoundContainer } from "../../../puck-base/container.js";
 import { CompoundButton } from "../../../puck-base/button.js";
 import { cn } from "../../../../utils/css-utils.js";
+import { getMapEmbedUrl, getDirectionsUrl } from "../../../puck-base/core/fields.js";
+const MAP_STYLE_FILTERS = {
+  default: "",
+  grayscale: "grayscale(35%) contrast(1.05) brightness(1.0)",
+  dark: "grayscale(100%) invert(1) contrast(1.1) brightness(0.8)"
+};
 const Location3 = ({
   heading,
   description,
-  mapEmbedUrl,
-  mapTitle = "Google Maps",
-  mapFilter,
+  mapLocation,
+  mapStyle = "default",
   locations = [],
   styles
 }) => {
+  const mapEmbedUrl = mapLocation && mapLocation.lat !== 0 ? getMapEmbedUrl(mapLocation) : void 0;
+  const mapFilter = MAP_STYLE_FILTERS[mapStyle] || "";
   const mapHeight = (styles == null ? void 0 : styles.mapHeight) ?? "md";
   const columns = (styles == null ? void 0 : styles.columns) ?? "3";
   const mapHeightClass = mapHeight === "sm" ? "h-[220px] md:h-[260px]" : mapHeight === "lg" ? "h-[360px] md:h-[440px]" : "h-[280px] md:h-[340px]";
@@ -30,97 +37,100 @@ const Location3 = ({
           "iframe",
           {
             src: mapEmbedUrl,
-            title: mapTitle,
+            title: (mapLocation == null ? void 0 : mapLocation.address) || "Google Maps",
             className: "h-full w-full border-0",
             loading: "lazy",
             referrerPolicy: "no-referrer-when-downgrade",
             allowFullScreen: true,
-            style: { filter: mapFilter }
+            style: mapFilter ? { filter: mapFilter } : void 0
           }
         ) : /* @__PURE__ */ jsx("div", { className: "bg-muted text-muted-foreground flex h-full w-full items-center justify-center text-sm", children: "Map address not configured" }) }),
-        locations.length > 0 && /* @__PURE__ */ jsx("div", { className: cn("grid grid-cols-1 gap-5", colClass), children: locations.map((loc, i) => /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: "bg-card border-border flex flex-col gap-3 rounded-xl border p-6",
-            children: [
-              /* @__PURE__ */ jsx("h3", { className: "text-foreground text-lg font-semibold", children: loc.name }),
-              loc.address && /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground flex items-start gap-2 text-sm", children: [
-                /* @__PURE__ */ jsxs(
-                  "svg",
-                  {
-                    className: "text-primary mt-0.5 shrink-0",
-                    width: "14",
-                    height: "14",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: [
-                      /* @__PURE__ */ jsx("path", { d: "M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z" }),
-                      /* @__PURE__ */ jsx("circle", { cx: "12", cy: "10", r: "3" })
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ jsx("span", { className: "whitespace-pre-line", children: loc.address })
-              ] }),
-              loc.phone && /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground flex items-center gap-2 text-sm", children: [
-                /* @__PURE__ */ jsx(
-                  "svg",
-                  {
-                    className: "text-primary shrink-0",
-                    width: "14",
-                    height: "14",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: /* @__PURE__ */ jsx("path", { d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 14a19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 3.62 3h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 10.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 17.92Z" })
-                  }
-                ),
-                /* @__PURE__ */ jsx("span", { children: loc.phone })
-              ] }),
-              loc.hours && /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground flex items-start gap-2 text-sm", children: [
-                /* @__PURE__ */ jsxs(
-                  "svg",
+        locations.length > 0 && /* @__PURE__ */ jsx("div", { className: cn("grid grid-cols-1 gap-5", colClass), children: locations.map((loc, i) => {
+          var _a;
+          return /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "bg-card border-border flex flex-col gap-3 rounded-xl border p-6",
+              children: [
+                /* @__PURE__ */ jsx("h3", { className: "text-foreground text-lg font-semibold", children: loc.name }),
+                ((_a = loc.location) == null ? void 0 : _a.address) && /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground flex items-start gap-2 text-sm", children: [
+                  /* @__PURE__ */ jsxs(
+                    "svg",
+                    {
+                      className: "text-primary mt-0.5 shrink-0",
+                      width: "14",
+                      height: "14",
+                      viewBox: "0 0 24 24",
+                      fill: "none",
+                      stroke: "currentColor",
+                      strokeWidth: "2",
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      children: [
+                        /* @__PURE__ */ jsx("path", { d: "M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z" }),
+                        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "10", r: "3" })
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { className: "whitespace-pre-line", children: loc.location.address })
+                ] }),
+                loc.phone && /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground flex items-center gap-2 text-sm", children: [
+                  /* @__PURE__ */ jsx(
+                    "svg",
+                    {
+                      className: "text-primary shrink-0",
+                      width: "14",
+                      height: "14",
+                      viewBox: "0 0 24 24",
+                      fill: "none",
+                      stroke: "currentColor",
+                      strokeWidth: "2",
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      children: /* @__PURE__ */ jsx("path", { d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 14a19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 3.62 3h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 10.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 17.92Z" })
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { children: loc.phone })
+                ] }),
+                loc.hours && /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground flex items-start gap-2 text-sm", children: [
+                  /* @__PURE__ */ jsxs(
+                    "svg",
+                    {
+                      className: "text-primary mt-0.5 shrink-0",
+                      width: "14",
+                      height: "14",
+                      viewBox: "0 0 24 24",
+                      fill: "none",
+                      stroke: "currentColor",
+                      strokeWidth: "2",
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      children: [
+                        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+                        /* @__PURE__ */ jsx("polyline", { points: "12 6 12 12 16 14" })
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { className: "whitespace-pre-line", children: loc.hours })
+                ] }),
+                (loc.directionsAction || loc.location && loc.location.lat !== 0) && /* @__PURE__ */ jsx("div", { className: "mt-auto pt-2", children: /* @__PURE__ */ jsx(
+                  CompoundButton,
                   {
-                    className: "text-primary mt-0.5 shrink-0",
-                    width: "14",
-                    height: "14",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: [
-                      /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
-                      /* @__PURE__ */ jsx("polyline", { points: "12 6 12 12 16 14" })
-                    ]
+                    label: loc.directionsLabel || "Get Directions",
+                    action: loc.directionsAction ?? (loc.location ? {
+                      type: "external",
+                      externalUrl: getDirectionsUrl(loc.location)
+                    } : void 0),
+                    variant: "outline",
+                    size: "sm",
+                    icon: "map-pin"
                   }
-                ),
-                /* @__PURE__ */ jsx("span", { className: "whitespace-pre-line", children: loc.hours })
-              ] }),
-              (loc.directionsAction || loc.directionsUrl) && /* @__PURE__ */ jsx("div", { className: "mt-auto pt-2", children: /* @__PURE__ */ jsx(
-                CompoundButton,
-                {
-                  label: loc.directionsLabel || "Get Directions",
-                  action: loc.directionsAction ?? (loc.directionsUrl ? {
-                    type: "external",
-                    externalUrl: loc.directionsUrl
-                  } : void 0),
-                  variant: "outline",
-                  size: "sm",
-                  icon: "map-pin"
-                }
-              ) })
-            ]
-          },
-          i
-        )) })
+                ) })
+              ]
+            },
+            i
+          );
+        }) })
       ] })
     }
   );

package/dist/components/puck-block/location-sections/props.d.ts

@@ -1,3 +1,4 @@
+import type { MapLocation } from "@/components/puck-base/core/fields";
 type LocationVariant = "location-1" | "location-2" | "location-3";
 type LocationPadding = {
     top?: "none" | "small" | "medium" | "large";
@@ -13,22 +14,19 @@ type LocationButton = {
 };
 type LocationItem = {
     name: string;
-    address?: string;
+    location?: MapLocation;
     phone?: string;
     hours?: string;
-    directionsUrl?: string;
 };
-type LocationSectionProps = {
+export type LocationSectionProps = {
     variant?: LocationVariant;
     heading?: string;
     description?: string;
-    address?: string;
-    mapEmbedUrl?: string;
-    mapTitle?: string;
-    mapFilter?: string;
-    mapTintMode?: "none" | "theme" | "custom";
-    mapTintColor?: string;
-    mapTintOpacity?: number;
+    displayAddress?: string;
+    location?: MapLocation;
+    mapLocation?: MapLocation;
+    mapStyle?: "default" | "grayscale" | "dark";
+    mapTint?: "none" | "theme";
     buttons?: LocationButton[];
     locations?: LocationItem[];
     contentPosition?: "left" | "right";
@@ -43,3 +41,4 @@ type LocationSectionProps = {
         sectionHeight?: "sm" | "md" | "lg";
     };
 };
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dune-react",
-  "version": "0.0.16",
+  "version": "0.0.18",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -16,7 +16,8 @@
     "build-storybook": "storybook build && cp -r skills storybook-static/skills",
     "deploy-storybook": "storybook-to-ghpages -- --existing-output-dir=storybook-static",
     "ondeploy": "pnpm build-storybook && pnpm deploy-storybook",
-    "postpublish": "bash scripts/postpublish.sh"
+    "postpublish": "bash scripts/postpublish.sh",
+    "upload:previews": "tsx scripts/upload-previews-r2.ts"
   },
   "sideEffects": [
     "*.css"