sanity-plugin-shopify-assets 1.2.3 → 2.0.0

package/dist/index.js

@@ -1,248 +1,248 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', {
-  value: true
-});
-var sanity = require('sanity');
-var jsxRuntime = require('react/jsx-runtime');
-var icons = require('@sanity/icons');
-var ui = require('@sanity/ui');
-var React = require('react');
-var prettyBytes = require('pretty-bytes');
-var prettyMilliseconds = require('pretty-ms');
-var styledComponents = require('styled-components');
-var videojs = require('video.js');
-var rxjs = require('rxjs');
-var PhotoAlbum = require('react-photo-album');
-var InfiniteScroll = require('react-infinite-scroll-component');
-var operators = require('rxjs/operators');
-var axios = require('axios');
-function _interopDefaultCompat(e) {
-  return e && typeof e === 'object' && 'default' in e ? e : {
-    default: e
-  };
-}
-var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-var prettyBytes__default = /*#__PURE__*/_interopDefaultCompat(prettyBytes);
-var prettyMilliseconds__default = /*#__PURE__*/_interopDefaultCompat(prettyMilliseconds);
-var videojs__default = /*#__PURE__*/_interopDefaultCompat(videojs);
-var PhotoAlbum__default = /*#__PURE__*/_interopDefaultCompat(PhotoAlbum);
-var InfiniteScroll__default = /*#__PURE__*/_interopDefaultCompat(InfiniteScroll);
-var axios__default = /*#__PURE__*/_interopDefaultCompat(axios);
-const Root = styledComponents.styled.div`
-  overflow: hidden;
-  background-origin: content-box;
-  background-repeat: no-repeat;
-  background-clip: border-box;
-  background-size: cover;
-  background-color: ${_ref => {
-  let {
-    theme
-  } = _ref;
-  return theme.sanity.color.card.enabled.bg2;
-}};
-  position: relative;
-  outline: none !important;
-  border: ${_ref2 => {
-  let {
-    theme
-  } = _ref2;
-  return `1px solid ${theme.sanity.color.card.enabled.border}`;
-}};
-  box-sizing: content-box;
-  user-drag: none;
-
-  &:hover {
-    opacity: 0.85;
-  }
-
-  &:focus,
-  &:active {
-    border: 1px solid var(--input-border-color-focus);
-    box-shadow: inset 0 0 0 3px var(--input-border-color-focus);
+import { defineType, defineField, DiffFromTo, useProjectId, useDataset, useClient, PatchEvent, set, unset, definePlugin } from "sanity";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { c } from "react/compiler-runtime";
+import { Flex, Stack, Text, Card, Box, Button, Inline, TextInput, Spinner, Dialog, Grid } from "@sanity/ui";
+import { getTheme_v2 } from "@sanity/ui/theme";
+import prettyBytes from "pretty-bytes";
+import prettyMilliseconds from "pretty-ms";
+import { styled } from "styled-components";
+import { useRef, useEffect, useState } from "react";
+import videojs from "video.js";
+import { LaunchIcon, ErrorOutlineIcon } from "@sanity/icons";
+import InfiniteScroll from "react-infinite-scroll-component";
+import { PhotoAlbum } from "react-photo-album";
+import { concat, defer, BehaviorSubject } from "rxjs";
+import axios from "axios";
+import { withLatestFrom, debounceTime, distinctUntilChanged, switchMap, map } from "rxjs/operators";
+const shopifyAssetMetadataSchema = defineType({
+  type: "object",
+  name: "shopify.assetMetadata",
+  title: "Asset metadata",
+  fields: [defineField({
+    type: "string",
+    name: "alt",
+    title: "Alternative text"
+  }), defineField({
+    type: "number",
+    name: "duration",
+    title: "Duration"
+  }), defineField({
+    type: "number",
+    name: "fileSize",
+    title: "File size"
+  }), defineField({
+    type: "number",
+    name: "height",
+    title: "Height"
+  }), defineField({
+    type: "number",
+    name: "width",
+    title: "Width"
+  })]
+}), shopifyAssetPreviewSchema = defineType({
+  type: "object",
+  name: "shopify.assetPreview",
+  title: "Asset preview",
+  fields: [defineField({
+    type: "number",
+    name: "height",
+    title: "Height"
+  }), defineField({
+    type: "number",
+    name: "width",
+    title: "Width"
+  }), defineField({
+    type: "url",
+    name: "url",
+    title: "URL"
+  })]
+}), ShopifyAssetDiffPreview = (t0) => {
+  const $ = c(11), {
+    value
+  } = t0;
+  if (!value)
+    return null;
+  if (value?.preview?.url) {
+    const t12 = value?.preview?.url;
+    let t2;
+    $[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = {
+      objectFit: "contain",
+      margin: "auto",
+      maxWidth: "100%",
+      maxHeight: "100%"
+    }, $[0] = t2) : t2 = $[0];
+    let t3;
+    $[1] !== t12 ? (t3 = /* @__PURE__ */ jsx("img", { alt: "preview", src: t12, style: t2 }), $[1] = t12, $[2] = t3) : t3 = $[2];
+    let t4;
+    $[3] !== value.type ? (t4 = value.type.charAt(0).toUpperCase(), $[3] = value.type, $[4] = t4) : t4 = $[4];
+    const t5 = t4 + value.type.slice(1);
+    let t6;
+    $[5] !== t5 ? (t6 = /* @__PURE__ */ jsx(Text, { size: 1, children: t5 }), $[5] = t5, $[6] = t6) : t6 = $[6];
+    let t7;
+    return $[7] !== t3 || $[8] !== t6 ? (t7 = /* @__PURE__ */ jsx(Flex, { justify: "center", align: "center", height: "fill", width: "fill", children: /* @__PURE__ */ jsxs(Stack, { gap: 2, children: [
+      t3,
+      t6
+    ] }) }), $[7] = t3, $[8] = t6, $[9] = t7) : t7 = $[9], t7;
   }
-`;
-const InfoLine = styledComponents.styled(ui.Card)`
-  ${_ref3 => {
-  let {
-    theme
-  } = _ref3;
+  let t1;
+  return $[10] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx(Flex, { justify: "center", align: "center", height: "fill", width: "fill", children: /* @__PURE__ */ jsx("div", { children: "(no image)" }) }), $[10] = t1) : t1 = $[10], t1;
+}, AssetDiff = (t0) => {
+  const $ = c(3), {
+    diff,
+    schemaType
+  } = t0;
+  let t1;
+  return $[0] !== diff || $[1] !== schemaType ? (t1 = /* @__PURE__ */ jsx(DiffFromTo, { diff, schemaType, previewComponent: ShopifyAssetDiffPreview, layout: "grid" }), $[0] = diff, $[1] = schemaType, $[2] = t1) : t1 = $[2], t1;
+}, Root = styled.div.withConfig({
+  displayName: "Root",
+  componentId: "sc-1wrh02w-0"
+})`${({
+  theme
+}) => {
+  const v2 = getTheme_v2({
+    sanity: theme.sanity
+  });
   return `
-    --infoline-fg: ${theme.sanity.color.card.enabled.fg};
-    --infoline-bg: ${theme.sanity.color.card.enabled.bg};
-  `;
-}};
-  user-drag: none;
-  position: absolute;
-  background-color: var(--infoline-bg);
-  top: 0;
-  left: 0;
-  max-width: 65%;
-  overflow-wrap: break-word;
-
-  [data-ui='Text'] {
-    color: var(--infoline-fg);
-  }
-`;
-const DurationLine = styledComponents.styled(ui.Card)`
-  ${_ref4 => {
-  let {
-    theme
-  } = _ref4;
+      background-color: ${v2.color.muted.bg};
+      border: 1px solid ${v2.color.border};
+    `;
+}};overflow:hidden;background-origin:content-box;background-repeat:no-repeat;background-clip:border-box;background-size:cover;position:relative;outline:none !important;box-sizing:content-box;user-drag:none;&:hover{opacity:0.85;}&:focus,&:active{border:1px solid var(--input-border-color-focus);box-shadow:inset 0 0 0 3px var(--input-border-color-focus);}`, InfoLine = styled(Card).withConfig({
+  displayName: "InfoLine",
+  componentId: "sc-1wrh02w-1"
+})`${({
+  theme
+}) => {
+  const v2 = getTheme_v2({
+    sanity: theme.sanity
+  });
   return `
-    --durationline-fg: ${theme.sanity.color.card.enabled.bg};
-    --durationline-bg: ${theme.sanity.color.card.enabled.fg};
-  `;
-}};
-  user-drag: none;
-  position: absolute;
-  background-color: var(--durationline-bg);
-  top: 0;
-  right: 0;
-
-  [data-ui='Text'] {
-    color: var(--durationline-fg);
-  }
-`;
-const VideoPlayer = _ref5 => {
-  let {
+      --infoline-fg: ${v2.color.fg};
+      --infoline-bg: ${v2.color.bg};
+    `;
+}};user-drag:none;position:absolute;background-color:var(--infoline-bg);top:0;left:0;max-width:65%;overflow-wrap:break-word;[data-ui='Text']{color:var(--infoline-fg);}`, DurationLine = styled(Card).withConfig({
+  displayName: "DurationLine",
+  componentId: "sc-1wrh02w-2"
+})`${({
+  theme
+}) => {
+  const v2 = getTheme_v2({
+    sanity: theme.sanity
+  });
+  return `
+      --durationline-fg: ${v2.color.bg};
+      --durationline-bg: ${v2.color.fg};
+    `;
+}};user-drag:none;position:absolute;background-color:var(--durationline-bg);top:0;right:0;[data-ui='Text']{color:var(--durationline-fg);}`, VideoPlayer = (t0) => {
+  const $ = c(11), {
     src,
     kind
-  } = _ref5;
-  const videoNode = React__default.default.useRef(null);
-  const player = React__default.default.useRef();
-  React.useEffect(() => {
-    player.current = videojs__default.default(videoNode.current ?? "", {
+  } = t0, videoNode = useRef(null), player = useRef(void 0);
+  let t1, t2;
+  $[0] !== src ? (t1 = () => {
+    player.current = videojs(videoNode.current ?? "", {
       sources: [{
         src
       }],
-      controls: true
-    });
-    player.current.src({
+      controls: !0
+    }), player.current.src({
       src
     });
-  }, [src]);
-  const stopPropagation = React.useCallback(event => {
-    event.stopPropagation();
-  }, []);
-  const className = {
+  }, t2 = [src], $[0] = src, $[1] = t1, $[2] = t2) : (t1 = $[1], t2 = $[2]), useEffect(t1, t2);
+  const stopPropagation = _temp$1;
+  let t3;
+  $[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t3 = {
     player: "video-js vjs-16-9 vjs-big-play-centered",
     diff: "video-js vjs-layout-tiny vjs-fluid"
-  };
-  const style = {
+  }, $[3] = t3) : t3 = $[3];
+  const className = t3;
+  let t4;
+  $[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t4 = {
     position: "relative"
-  };
-  return /* @__PURE__ */jsxRuntime.jsxs("div", {
-    children: [/* @__PURE__ */jsxRuntime.jsx("link", {
-      href: "https://vjs.zencdn.net/7.8.4/video-js.css",
-      rel: "stylesheet"
-    }), /* @__PURE__ */jsxRuntime.jsx("div", {
-      "data-vjs-player": true,
-      children: /* @__PURE__ */jsxRuntime.jsx("video", {
-        onClick: stopPropagation,
-        style: kind === "diff" ? style : {},
-        className: className[kind],
-        ref: videoNode
-      })
-    })]
-  });
+  }, $[4] = t4) : t4 = $[4];
+  const style = t4;
+  let t5;
+  $[5] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t5 = /* @__PURE__ */ jsx("link", { href: "https://vjs.zencdn.net/7.8.4/video-js.css", rel: "stylesheet" }), $[5] = t5) : t5 = $[5];
+  let t6;
+  $[6] !== kind ? (t6 = kind === "diff" ? style : {}, $[6] = kind, $[7] = t6) : t6 = $[7];
+  const t7 = className[kind];
+  let t8;
+  return $[8] !== t6 || $[9] !== t7 ? (t8 = /* @__PURE__ */ jsxs("div", { children: [
+    t5,
+    /* @__PURE__ */ jsx("div", { "data-vjs-player": !0, children: /* @__PURE__ */ jsx("video", { "aria-label": "Video preview", onClick: stopPropagation, style: t6, className: t7, ref: videoNode }) })
+  ] }), $[8] = t6, $[9] = t7, $[10] = t8) : t8 = $[10], t8;
 };
-const StyledBox = styledComponents.styled(ui.Box)`
-  background-color: ${_ref6 => {
-  let {
-    theme
-  } = _ref6;
-  return theme.sanity.color?.card?.enabled?.bg2;
-}};
-  border: ${_ref7 => {
-  let {
-    theme
-  } = _ref7;
-  return `1px solid ${theme.sanity?.color?.card?.enabled?.border}`;
-}};
-  display: flex;
-  justify-content: center;
-  margin-bottom: ${_ref8 => {
-  let {
-    theme
-  } = _ref8;
-  return theme.sanity.space[4];
-}};
-  position: relative;
-`;
-const RenderAsset = _ref9 => {
-  let {
+function _temp$1(event) {
+  event.stopPropagation();
+}
+const StyledBox = styled(Box).withConfig({
+  displayName: "StyledBox",
+  componentId: "sc-s00el7-0"
+})`${({
+  theme
+}) => {
+  const v2 = getTheme_v2({
+    sanity: theme.sanity
+  });
+  return `
+      background-color: ${v2.color.muted.bg};
+      border: 1px solid ${v2.color.border};
+    `;
+}};display:flex;justify-content:center;position:relative;`, RenderAsset = (t0) => {
+  const $ = c(5), {
     value,
     url
-  } = _ref9;
-  switch (value.type) {
-    case "video":
-      return /* @__PURE__ */jsxRuntime.jsx(VideoPlayer, {
-        src: url,
-        kind: "player"
-      });
-    default:
-      return /* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
-        justify: "center",
-        children: /* @__PURE__ */jsxRuntime.jsx("img", {
-          alt: "preview",
-          src: value?.preview?.url,
-          style: {
-            maxWidth: "100%",
-            height: "auto",
-            display: "block",
-            maxHeight: "30vh"
-          }
-        })
-      });
+  } = t0;
+  if (value.type === "video") {
+    let t1;
+    return $[0] !== url ? (t1 = /* @__PURE__ */ jsx(VideoPlayer, { src: url, kind: "player" }), $[0] = url, $[1] = t1) : t1 = $[1], t1;
+  } else {
+    const t1 = value?.preview?.url;
+    let t2;
+    $[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = {
+      maxWidth: "100%",
+      height: "auto",
+      display: "block",
+      maxHeight: "30vh"
+    }, $[2] = t2) : t2 = $[2];
+    let t3;
+    return $[3] !== t1 ? (t3 = /* @__PURE__ */ jsx(Flex, { justify: "center", children: /* @__PURE__ */ jsx("img", { alt: "preview", src: t1, style: t2 }) }), $[3] = t1, $[4] = t3) : t3 = $[4], t3;
   }
-};
-const AssetPreview = _ref0 => {
-  let {
+}, AssetPreview = (t0) => {
+  const $ = c(16), {
     value
-  } = _ref0;
-  const url = value && value.url;
-  if (!value || !url) {
+  } = t0, url = value && value.url;
+  if (!value || !url)
     return null;
-  }
   const {
     filename,
     meta
-  } = value;
-  const {
+  } = value, {
     fileSize,
     duration
   } = meta;
-  return /* @__PURE__ */jsxRuntime.jsxs(StyledBox, {
-    marginBottom: 2,
-    children: [/* @__PURE__ */jsxRuntime.jsx(RenderAsset, {
-      value,
-      url
-    }), /* @__PURE__ */jsxRuntime.jsx(InfoLine, {
-      padding: 2,
-      radius: 2,
-      margin: 2,
-      children: /* @__PURE__ */jsxRuntime.jsxs(ui.Text, {
-        size: 1,
-        title: `Select ${filename}`,
-        children: [filename, " ", fileSize && `(${prettyBytes__default.default(fileSize)})`]
-      })
-    }), duration && /* @__PURE__ */jsxRuntime.jsx(DurationLine, {
-      padding: 2,
-      radius: 2,
-      margin: 2,
-      children: /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
-        size: 1,
-        title: `Video duration: ${filename}`,
-        children: prettyMilliseconds__default.default(duration, {
-          colonNotation: true,
-          secondsDecimalDigits: 0
-        })
-      })
-    })]
-  });
-};
-const fetchSearch = props => {
+  let t1;
+  $[0] !== url || $[1] !== value ? (t1 = /* @__PURE__ */ jsx(RenderAsset, { value, url }), $[0] = url, $[1] = value, $[2] = t1) : t1 = $[2];
+  const t2 = `Select ${filename}`;
+  let t3;
+  $[3] !== fileSize ? (t3 = fileSize && `(${prettyBytes(fileSize)})`, $[3] = fileSize, $[4] = t3) : t3 = $[4];
+  let t4;
+  $[5] !== filename || $[6] !== t2 || $[7] !== t3 ? (t4 = /* @__PURE__ */ jsx(InfoLine, { padding: 2, radius: 2, margin: 2, children: /* @__PURE__ */ jsxs(Text, { size: 1, title: t2, children: [
+    filename,
+    " ",
+    t3
+  ] }) }), $[5] = filename, $[6] = t2, $[7] = t3, $[8] = t4) : t4 = $[8];
+  let t5;
+  $[9] !== duration || $[10] !== filename ? (t5 = duration && /* @__PURE__ */ jsx(DurationLine, { padding: 2, radius: 2, margin: 2, children: /* @__PURE__ */ jsx(Text, { size: 1, title: `Video duration: ${filename}`, children: prettyMilliseconds(duration, {
+    colonNotation: !0,
+    secondsDecimalDigits: 0
+  }) }) }), $[9] = duration, $[10] = filename, $[11] = t5) : t5 = $[11];
+  let t6;
+  return $[12] !== t1 || $[13] !== t4 || $[14] !== t5 ? (t6 = /* @__PURE__ */ jsxs(StyledBox, { marginBottom: 2, children: [
+    t1,
+    t4,
+    t5
+  ] }), $[12] = t1, $[13] = t4, $[14] = t5, $[15] = t6) : t6 = $[15], t6;
+}, fetchSearch = (props) => {
   const {
     projectId,
     dataset,
@@ -252,17 +252,14 @@ const fetchSearch = props => {
     resultsPerPage,
     token
   } = props;
-  return rxjs.defer(() => {
-    return axios__default.default.get(`https://${projectId}.api.sanity.io/v1/shopify/assets/${dataset}?shop=${shop}&query=${encodeURIComponent(query)}${cursor && `&cursor=${cursor}`}&limit=${resultsPerPage}`, {
-      withCredentials: true,
-      method: "GET",
-      headers: token ? {
-        Authorization: `Bearer ${token}`
-      } : {}
-    });
-  }).pipe(operators.map(result => result.data));
-};
-const fetchList = props => {
+  return defer(() => axios.get(`https://${projectId}.api.sanity.io/v1/shopify/assets/${dataset}?shop=${shop}&query=${encodeURIComponent(query)}${cursor && `&cursor=${cursor}`}&limit=${resultsPerPage}`, {
+    withCredentials: !0,
+    method: "GET",
+    headers: token ? {
+      Authorization: `Bearer ${token}`
+    } : {}
+  })).pipe(map((result) => result.data));
+}, fetchList = (props) => {
   const {
     projectId,
     dataset,
@@ -271,15 +268,14 @@ const fetchList = props => {
     resultsPerPage,
     token
   } = props;
-  return rxjs.defer(() => axios__default.default.get(`https://${projectId}.api.sanity.io/v1/shopify/assets/${dataset}?shop=${shop}${cursor && `&cursor=${cursor}`}&limit=${resultsPerPage}`, {
-    withCredentials: true,
+  return defer(() => axios.get(`https://${projectId}.api.sanity.io/v1/shopify/assets/${dataset}?shop=${shop}${cursor && `&cursor=${cursor}`}&limit=${resultsPerPage}`, {
+    withCredentials: !0,
     method: "GET",
     headers: token ? {
       Authorization: `Bearer ${token}`
     } : {}
-  })).pipe(operators.map(result => result.data));
-};
-const search = props => {
+  })).pipe(map((result) => result.data));
+}, search = (props) => {
   const {
     projectId,
     dataset,
@@ -289,155 +285,129 @@ const search = props => {
     resultsPerPage,
     token
   } = props;
-  return rxjs.concat(query.pipe(operators.withLatestFrom(cursor), operators.debounceTime(500), operators.distinctUntilChanged(), operators.switchMap(_ref1 => {
-    let [q, c] = _ref1;
-    if (q) {
-      return fetchSearch({
-        projectId,
-        dataset,
-        shop,
-        query: q,
-        cursor: c,
-        resultsPerPage,
-        token
-      }).pipe(operators.distinctUntilChanged());
-    }
-    return fetchList({
-      projectId,
-      dataset,
-      shop,
-      cursor: c,
-      resultsPerPage,
-      token
-    });
-  })));
-};
-const DialogHeader = props => {
-  const {
+  return concat(query.pipe(withLatestFrom(cursor), debounceTime(500), distinctUntilChanged(), switchMap(([q, c2]) => q ? fetchSearch({
+    projectId,
+    dataset,
+    shop,
+    query: q,
+    cursor: c2,
+    resultsPerPage,
+    token
+  }).pipe(distinctUntilChanged()) : fetchList({
+    projectId,
+    dataset,
+    shop,
+    cursor: c2,
+    resultsPerPage,
+    token
+  }))));
+}, DialogHeader = (props) => {
+  const $ = c(9), {
     title,
     shopifyDomain
   } = props;
-  const handleOpenInNewTab = React.useCallback(() => {
+  let t0;
+  $[0] !== shopifyDomain ? (t0 = () => {
     window.open(`https://${shopifyDomain}/admin/content/files`, "_blank");
-  }, [shopifyDomain]);
-  return /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
-    align: "center",
-    children: [title, /* @__PURE__ */jsxRuntime.jsx("input", {
-      style: {
-        opacity: 0
-      },
-      tabIndex: -1,
-      type: "button"
-    }), /* @__PURE__ */jsxRuntime.jsx(ui.Box, {
-      style: {
-        position: "absolute",
-        right: "-1.5em"
-      },
-      children: /* @__PURE__ */jsxRuntime.jsx(ui.Box, {
-        className: "button-large",
-        children: /* @__PURE__ */jsxRuntime.jsx(ui.Button, {
-          fontSize: 1,
-          icon: icons.LaunchIcon,
-          mode: "bleed",
-          onClick: handleOpenInNewTab,
-          text: "Add New"
-        })
-      })
-    })]
-  });
-};
-const extractName = name => name?.split("/")?.pop()?.split("?")[0] ?? "";
+  }, $[0] = shopifyDomain, $[1] = t0) : t0 = $[1];
+  const handleOpenInNewTab = t0;
+  let t1;
+  $[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx("input", { "aria-hidden": "true", "aria-label": "Focus trap", style: {
+    opacity: 0
+  }, tabIndex: -1, type: "button" }), $[2] = t1) : t1 = $[2];
+  let t2;
+  $[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = {
+    position: "absolute",
+    right: "-1.5em"
+  }, $[3] = t2) : t2 = $[3];
+  let t3;
+  $[4] !== handleOpenInNewTab ? (t3 = /* @__PURE__ */ jsx(Box, { style: t2, children: /* @__PURE__ */ jsx(Box, { className: "button-large", children: /* @__PURE__ */ jsx(Button, { fontSize: 1, icon: LaunchIcon, mode: "bleed", onClick: handleOpenInNewTab, text: "Add New" }) }) }), $[4] = handleOpenInNewTab, $[5] = t3) : t3 = $[5];
+  let t4;
+  return $[6] !== t3 || $[7] !== title ? (t4 = /* @__PURE__ */ jsxs(Flex, { align: "center", children: [
+    title,
+    t1,
+    t3
+  ] }), $[6] = t3, $[7] = title, $[8] = t4) : t4 = $[8], t4;
+}, extractName = (name) => name?.split("/")?.pop()?.split("?")[0] ?? "";
 function File(props) {
-  const {
+  const $ = c(25), {
     onClick,
     data,
     width,
     height
-  } = props;
-  const rootElm = React.useRef(null);
-  const {
+  } = props, rootElm = useRef(null), {
     preview,
     meta
   } = data;
-  const filename = extractName(data.url);
-  const handleClick = React.useCallback(() => {
+  let t0;
+  $[0] !== data.url ? (t0 = extractName(data.url), $[0] = data.url, $[1] = t0) : t0 = $[1];
+  const filename = t0;
+  let t1;
+  $[2] !== data || $[3] !== filename || $[4] !== onClick ? (t1 = () => {
     onClick({
       ...data,
       filename
     });
-  }, [onClick, data, filename]);
-  return /* @__PURE__ */jsxRuntime.jsxs(Root, {
-    ref: rootElm,
-    title: `${filename}`,
-    tabIndex: 0,
-    style: {
-      width: `${width}px`,
-      height: `${height}px`,
-      backgroundImage: `url("${preview?.url}")`
-    },
-    onClick: handleClick,
-    children: [/* @__PURE__ */jsxRuntime.jsx(InfoLine, {
-      padding: 2,
-      radius: 2,
-      margin: 2,
-      children: /* @__PURE__ */jsxRuntime.jsxs(ui.Text, {
-        size: 1,
-        title: `Select ${filename}`,
-        children: [filename, " ", meta.fileSize && `(${prettyBytes__default.default(meta.fileSize)})`]
-      })
-    }), meta.duration && /* @__PURE__ */jsxRuntime.jsx(DurationLine, {
-      padding: 2,
-      radius: 2,
-      margin: 2,
-      children: /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
-        size: 1,
-        title: `Video duration: ${filename}`,
-        children: prettyMilliseconds__default.default(meta.duration, {
-          colonNotation: true,
-          secondsDecimalDigits: 0
-        })
-      })
-    })]
-  });
+  }, $[2] = data, $[3] = filename, $[4] = onClick, $[5] = t1) : t1 = $[5];
+  const handleClick = t1, t2 = `${width}px`, t3 = `${height}px`, t4 = `url("${preview?.url}")`;
+  let t5;
+  $[6] !== t2 || $[7] !== t3 || $[8] !== t4 ? (t5 = {
+    width: t2,
+    height: t3,
+    backgroundImage: t4
+  }, $[6] = t2, $[7] = t3, $[8] = t4, $[9] = t5) : t5 = $[9];
+  const t6 = `Select ${filename}`;
+  let t7;
+  $[10] !== meta.fileSize ? (t7 = meta.fileSize && `(${prettyBytes(meta.fileSize)})`, $[10] = meta.fileSize, $[11] = t7) : t7 = $[11];
+  let t8;
+  $[12] !== filename || $[13] !== t6 || $[14] !== t7 ? (t8 = /* @__PURE__ */ jsx(InfoLine, { padding: 2, radius: 2, margin: 2, children: /* @__PURE__ */ jsxs(Text, { size: 1, title: t6, children: [
+    filename,
+    " ",
+    t7
+  ] }) }), $[12] = filename, $[13] = t6, $[14] = t7, $[15] = t8) : t8 = $[15];
+  let t9;
+  $[16] !== filename || $[17] !== meta.duration ? (t9 = meta.duration && /* @__PURE__ */ jsx(DurationLine, { padding: 2, radius: 2, margin: 2, children: /* @__PURE__ */ jsx(Text, { size: 1, title: `Video duration: ${filename}`, children: prettyMilliseconds(meta.duration, {
+    colonNotation: !0,
+    secondsDecimalDigits: 0
+  }) }) }), $[16] = filename, $[17] = meta.duration, $[18] = t9) : t9 = $[18];
+  let t10;
+  return $[19] !== filename || $[20] !== handleClick || $[21] !== t5 || $[22] !== t8 || $[23] !== t9 ? (t10 = /* @__PURE__ */ jsxs(Root, { ref: rootElm, title: filename, tabIndex: 0, style: t5, onClick: handleClick, children: [
+    t8,
+    t9
+  ] }), $[19] = filename, $[20] = handleClick, $[21] = t5, $[22] = t8, $[23] = t9, $[24] = t10) : t10 = $[24], t10;
 }
-const Search = styledComponents.styled(ui.Stack)`
-  position: sticky;
-  top: 0;
-  z-index: 1;
-`;
-styledComponents.styled.div`
-  overflow-y: auto;
-  max-height: 80vh;
-`;
-const RESULTS_PER_PAGE = 42;
-const PHOTO_SPACING = 2;
-const PHOTO_PADDING = 1;
+const Search = styled(Stack).withConfig({
+  displayName: "Search",
+  componentId: "sc-1qdoq6k-0"
+})`position:sticky;top:0;z-index:1;`, RESULTS_PER_PAGE = 42, PHOTO_SPACING = 2, PHOTO_PADDING = 1;
 function ShopifyAssetPicker(props) {
-  const {
+  const $ = c(38), {
     isOpen,
     onClose,
     shopifyDomain,
     onChange,
     schemaType,
     value
-  } = props;
-  const projectId = sanity.useProjectId();
-  const dataset = sanity.useDataset();
-  const client = sanity.useClient({
+  } = props, projectId = useProjectId(), dataset = useDataset();
+  let t0;
+  $[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t0 = {
     apiVersion: "2021-06-07"
-  });
-  const token = client.config().token;
-  const [error, setError] = React.useState("");
-  const [query, setQuery] = React.useState("");
-  const [searchResults, setSearchResults] = React.useState([]);
-  const [pageInfo, setPageInfo] = React.useState();
-  const [isLoading, setIsLoading] = React.useState(true);
-  const searchSubject$ = React.useMemo(() => new rxjs.BehaviorSubject(""), []);
-  const cursorSubject$ = React.useMemo(() => new rxjs.BehaviorSubject(""), []);
-  React.useEffect(() => {
-    if (!shopifyDomain) setError("Please configure your Shopify domain in the plugin config");
-  }, [shopifyDomain]);
-  React.useEffect(() => {
+  }, $[0] = t0) : t0 = $[0];
+  const client = useClient(t0);
+  let t1;
+  $[1] !== client ? (t1 = client.config(), $[1] = client, $[2] = t1) : t1 = $[2];
+  const token = t1.token, [apiError, setApiError] = useState(""), [query, setQuery] = useState("");
+  let t2;
+  $[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = [], $[3] = t2) : t2 = $[3];
+  const [searchResults, setSearchResults] = useState(t2), [pageInfo, setPageInfo] = useState(), [isLoading, setIsLoading] = useState(!0), error = shopifyDomain ? apiError : "Please configure your Shopify domain in the plugin config";
+  let t3;
+  $[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t3 = new BehaviorSubject(""), $[4] = t3) : t3 = $[4];
+  const searchSubject$ = t3;
+  let t4;
+  $[5] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t4 = new BehaviorSubject(""), $[5] = t4) : t4 = $[5];
+  const cursorSubject$ = t4;
+  let t5, t6;
+  $[6] !== dataset || $[7] !== projectId || $[8] !== shopifyDomain || $[9] !== token ? (t5 = () => {
     const searchSubscription = search({
       projectId,
       dataset,
@@ -447,348 +417,188 @@ function ShopifyAssetPicker(props) {
       resultsPerPage: RESULTS_PER_PAGE,
       token
     }).subscribe({
-      next: results => {
-        setSearchResults(prevResults => [...prevResults, ...results.assets]);
-        setPageInfo(results.pageInfo);
-        setIsLoading(false);
+      next: (results) => {
+        setSearchResults((prevResults) => [...prevResults, ...results.assets]), setPageInfo(results.pageInfo), setIsLoading(!1);
       },
-      error: err => {
-        setError(`${err.response?.data?.message || err.message || "An error occurred"} - check plugin configuration`);
+      error: (err) => {
+        setApiError(`${err.response?.data?.message || err.message || "An error occurred"} - check plugin configuration`);
       }
     });
     return () => searchSubscription.unsubscribe();
-  }, [searchSubject$, cursorSubject$, shopifyDomain, projectId, dataset, token]);
-  const handleSearchTermChanged = React.useCallback(event => {
+  }, t6 = [searchSubject$, cursorSubject$, shopifyDomain, projectId, dataset, token], $[6] = dataset, $[7] = projectId, $[8] = shopifyDomain, $[9] = token, $[10] = t5, $[11] = t6) : (t5 = $[10], t6 = $[11]), useEffect(t5, t6);
+  let t7;
+  $[12] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t7 = (event) => {
     const newQuery = event.currentTarget.value;
-    setQuery(newQuery);
-    setSearchResults([]);
-    setPageInfo(void 0);
-    setIsLoading(true);
-    cursorSubject$.next("");
-    searchSubject$.next(newQuery);
-  }, [cursorSubject$, searchSubject$]);
-  const handleScollerLoadMore = React.useCallback(() => {
-    setIsLoading(true);
-    if (pageInfo) cursorSubject$.next(pageInfo.cursor);
-    searchSubject$.next(query);
-  }, [cursorSubject$, pageInfo, searchSubject$, query]);
-  const handleSelect = React.useCallback(file => {
-    file._key = value?._key;
-    file._type = schemaType.name;
-    onChange(sanity.PatchEvent.from([sanity.set(file)]));
-    onClose();
-  }, [onChange, onClose, schemaType.name, value?._key]);
-  const renderFile = React.useCallback(fileProps => {
+    setQuery(newQuery), setSearchResults([]), setPageInfo(void 0), setIsLoading(!0), cursorSubject$.next(""), searchSubject$.next(newQuery);
+  }, $[12] = t7) : t7 = $[12];
+  const handleSearchTermChanged = t7;
+  let t8;
+  $[13] !== pageInfo || $[14] !== query ? (t8 = () => {
+    setIsLoading(!0), pageInfo && cursorSubject$.next(pageInfo.cursor), searchSubject$.next(query);
+  }, $[13] = pageInfo, $[14] = query, $[15] = t8) : t8 = $[15];
+  const handleScollerLoadMore = t8;
+  let t9;
+  $[16] !== onChange || $[17] !== onClose || $[18] !== schemaType.name || $[19] !== value?._key ? (t9 = (file) => {
+    file._key = value?._key, file._type = schemaType.name, onChange(PatchEvent.from([set(file)])), onClose();
+  }, $[16] = onChange, $[17] = onClose, $[18] = schemaType.name, $[19] = value?._key, $[20] = t9) : t9 = $[20];
+  const handleSelect = t9;
+  let t10;
+  $[21] !== handleSelect ? (t10 = (fileProps) => {
     const {
       photo,
       layout
     } = fileProps;
-    return /* @__PURE__ */jsxRuntime.jsx(File, {
-      onClick: handleSelect,
-      data: photo.data,
-      width: layout.width,
-      height: layout.height
-    });
-  }, [handleSelect]);
-  const handleWidth = React.useCallback(width => {
-    if (width < 300) return 150;else if (width < 600) return 200;
-    return 300;
-  }, []);
-  return /* @__PURE__ */jsxRuntime.jsx(ui.Dialog, {
-    id: "shopify-asset-source",
-    header: /* @__PURE__ */jsxRuntime.jsx(DialogHeader, {
-      title: "Shopify Assets",
-      shopifyDomain
-    }),
-    onClose,
-    open: isOpen,
-    width: 4,
-    children: /* @__PURE__ */jsxRuntime.jsx(ui.Stack, {
-      space: 3,
-      padding: 4,
-      children: error ? /* @__PURE__ */jsxRuntime.jsx(ui.Card, {
-        overflow: "hidden",
-        padding: 4,
-        radius: 2,
-        shadow: 1,
-        tone: "critical",
-        children: /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
-          align: "center",
-          gap: 3,
-          children: [/* @__PURE__ */jsxRuntime.jsx(ui.Text, {
-            size: 2,
-            children: /* @__PURE__ */jsxRuntime.jsx(icons.ErrorOutlineIcon, {})
-          }), /* @__PURE__ */jsxRuntime.jsx(ui.Inline, {
-            space: 2,
-            children: /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
-              size: 1,
-              children: error
-            })
-          })]
-        })
-      }) : /* @__PURE__ */jsxRuntime.jsxs(jsxRuntime.Fragment, {
-        children: [/* @__PURE__ */jsxRuntime.jsx(ui.Card, {
-          children: /* @__PURE__ */jsxRuntime.jsxs(Search, {
-            space: 3,
-            children: [/* @__PURE__ */jsxRuntime.jsx(ui.Text, {
-              size: 1,
-              weight: "semibold",
-              children: "Search Shopify for assets"
-            }), /* @__PURE__ */jsxRuntime.jsx(ui.TextInput, {
-              label: "Search Images",
-              placeholder: "filename.jpg",
-              value: query,
-              onChange: handleSearchTermChanged
-            })]
-          })
-        }), !isLoading && searchResults.length === 0 && /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
-          size: 1,
-          muted: true,
-          children: "No results found"
-        }), /* @__PURE__ */jsxRuntime.jsx(InfiniteScroll__default.default, {
-          dataLength: searchResults.length,
-          next: handleScollerLoadMore,
-          hasMore: pageInfo ? pageInfo?.hasNextPage : true,
-          scrollThreshold: 0.99,
-          height: "60vh",
-          loader: /* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
-            align: "center",
-            justify: "center",
-            padding: 3,
-            children: /* @__PURE__ */jsxRuntime.jsx(ui.Spinner, {
-              muted: true
-            })
-          }),
-          endMessage: /* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
-            align: "center",
-            justify: "center",
-            padding: 3,
-            children: /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
-              size: 1,
-              muted: true,
-              children: "No more results"
-            })
-          }),
-          children: searchResults && /* @__PURE__ */jsxRuntime.jsx(PhotoAlbum__default.default, {
-            layout: "rows",
-            spacing: PHOTO_SPACING,
-            padding: PHOTO_PADDING,
-            targetRowHeight: handleWidth,
-            photos: searchResults.map(file => ({
-              src: file?.preview?.url,
-              width: file?.preview?.width || 2048,
-              height: file?.preview?.height || 2048,
-              key: file.id,
-              data: file
-            })),
-            renderPhoto: renderFile,
-            componentsProps: {
-              containerProps: {
-                style: {
-                  marginBottom: `${PHOTO_SPACING}px`
-                }
-              }
-            }
-          })
-        })]
-      })
-    })
-  });
+    return /* @__PURE__ */ jsx(File, { onClick: handleSelect, data: photo.data, width: layout.width, height: layout.height });
+  }, $[21] = handleSelect, $[22] = t10) : t10 = $[22];
+  const renderFile = t10, handleWidth = _temp;
+  let t11;
+  $[23] !== shopifyDomain ? (t11 = /* @__PURE__ */ jsx(DialogHeader, { title: "Shopify Assets", shopifyDomain }), $[23] = shopifyDomain, $[24] = t11) : t11 = $[24];
+  let t12;
+  $[25] !== error || $[26] !== handleScollerLoadMore || $[27] !== isLoading || $[28] !== pageInfo || $[29] !== query || $[30] !== renderFile || $[31] !== searchResults ? (t12 = /* @__PURE__ */ jsx(Stack, { gap: 3, padding: 4, children: error ? /* @__PURE__ */ jsx(Card, { overflow: "hidden", padding: 4, radius: 2, shadow: 1, tone: "critical", children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 3, children: [
+    /* @__PURE__ */ jsx(Text, { size: 2, children: /* @__PURE__ */ jsx(ErrorOutlineIcon, {}) }),
+    /* @__PURE__ */ jsx(Inline, { gap: 2, children: /* @__PURE__ */ jsx(Text, { size: 1, children: error }) })
+  ] }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(Search, { gap: 3, children: [
+      /* @__PURE__ */ jsx(Text, { size: 1, weight: "semibold", children: "Search Shopify for assets" }),
+      /* @__PURE__ */ jsx(TextInput, { label: "Search Images", placeholder: "filename.jpg", value: query, onChange: handleSearchTermChanged })
+    ] }) }),
+    !isLoading && searchResults.length === 0 && /* @__PURE__ */ jsx(Text, { size: 1, muted: !0, children: "No results found" }),
+    /* @__PURE__ */ jsx(InfiniteScroll, { dataLength: searchResults.length, next: handleScollerLoadMore, hasMore: pageInfo ? pageInfo?.hasNextPage : !0, scrollThreshold: 0.99, height: "60vh", loader: /* @__PURE__ */ jsx(Flex, { align: "center", justify: "center", padding: 3, children: /* @__PURE__ */ jsx(Spinner, { muted: !0 }) }), endMessage: /* @__PURE__ */ jsx(Flex, { align: "center", justify: "center", padding: 3, children: /* @__PURE__ */ jsx(Text, { size: 1, muted: !0, children: "No more results" }) }), children: searchResults && /* @__PURE__ */ jsx(PhotoAlbum, { layout: "rows", spacing: PHOTO_SPACING, padding: PHOTO_PADDING, targetRowHeight: handleWidth, photos: searchResults.map(_temp2), renderPhoto: renderFile, componentsProps: {
+      containerProps: {
+        style: {
+          marginBottom: `${PHOTO_SPACING}px`
+        }
+      }
+    } }) })
+  ] }) }), $[25] = error, $[26] = handleScollerLoadMore, $[27] = isLoading, $[28] = pageInfo, $[29] = query, $[30] = renderFile, $[31] = searchResults, $[32] = t12) : t12 = $[32];
+  let t13;
+  return $[33] !== isOpen || $[34] !== onClose || $[35] !== t11 || $[36] !== t12 ? (t13 = /* @__PURE__ */ jsx(Dialog, { id: "shopify-asset-source", header: t11, onClose, open: isOpen, width: 4, children: t12 }), $[33] = isOpen, $[34] = onClose, $[35] = t11, $[36] = t12, $[37] = t13) : t13 = $[37], t13;
+}
+function _temp2(file_0) {
+  return {
+    src: file_0?.preview?.url,
+    width: file_0?.preview?.width || 2048,
+    height: file_0?.preview?.height || 2048,
+    key: file_0.id,
+    data: file_0
+  };
+}
+function _temp(width) {
+  return width < 300 ? 150 : width < 600 ? 200 : 300;
 }
 const ShopifyIcon = () => {
-  return /* @__PURE__ */jsxRuntime.jsxs("svg", {
-    width: "18",
-    height: "20",
-    viewBox: "0 0 18 20",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: [/* @__PURE__ */jsxRuntime.jsx("path", {
-      d: "M15.3269 3.85113C15.3132 3.75015 15.2258 3.69411 15.1531 3.688C15.081 3.6819 13.6693 3.66026 13.6693 3.66026C13.6693 3.66026 12.4887 2.50392 12.3722 2.38628C12.2555 2.26865 12.0277 2.30417 11.9392 2.3308C11.9381 2.33135 11.7175 2.40016 11.3461 2.51612C11.2839 2.31304 11.1927 2.06335 11.0622 1.81255C10.6419 1.00356 10.0263 0.575752 9.2825 0.574642C9.28142 0.574642 9.28092 0.574642 9.27975 0.574642C9.22808 0.574642 9.17692 0.579636 9.12517 0.584074C9.10317 0.557441 9.08117 0.531362 9.05808 0.505838C8.73408 0.156272 8.31869 -0.0140727 7.82082 0.000908712C6.86027 0.0286521 5.90357 0.72834 5.12787 1.97124C4.58212 2.84572 4.16677 3.94435 4.04904 4.79497C2.94601 5.13953 2.17471 5.38035 2.15766 5.3859C1.60091 5.56235 1.58331 5.57955 1.51069 6.10889C1.45677 6.50895 0 17.8704 0 17.8704L12.2082 20L17.4994 18.6733C17.4994 18.6733 15.3407 3.95212 15.3269 3.85113ZM10.7349 2.707C10.4537 2.79467 10.1342 2.89454 9.78758 3.00274C9.78042 2.51224 9.72267 1.82975 9.496 1.23992C10.2249 1.3792 10.5836 2.21095 10.7349 2.707ZM9.14883 3.20249C8.509 3.40225 7.81091 3.62031 7.11058 3.83892C7.30753 3.0782 7.68107 2.32081 8.13989 1.8242C8.31044 1.63943 8.54917 1.43358 8.832 1.31594C9.09767 1.87525 9.15542 2.66705 9.14883 3.20249ZM7.84007 0.645665C8.06562 0.640671 8.25542 0.690609 8.41775 0.798253C8.15805 0.9342 7.90718 1.12951 7.67172 1.38419C7.06162 2.04448 6.594 3.06932 6.4075 4.0581C5.826 4.23954 5.25715 4.41766 4.73342 4.58078C5.06405 3.02438 6.35743 0.688944 7.84007 0.645665Z",
-      fill: "#95BF47"
-    }), /* @__PURE__ */jsxRuntime.jsx("path", {
-      d: "M9.276 6.43238L8.66142 8.75117C8.66142 8.75117 7.97598 8.43658 7.16342 8.48817C5.97181 8.56417 5.95916 9.32217 5.97126 9.51242C6.03618 10.5495 8.74125 10.7759 8.89308 13.2051C9.01242 15.1161 7.88796 16.4233 6.26779 16.5265C4.32303 16.6502 3.25246 15.4933 3.25246 15.4933L3.66452 13.7256C3.66452 13.7256 4.74224 14.5457 5.60487 14.4907C6.16821 14.4547 6.36957 13.9924 6.34921 13.6657C6.26448 12.3128 4.06172 12.3927 3.92253 10.17C3.80536 8.29951 5.02337 6.40408 7.71081 6.23318C8.74617 6.16604 9.276 6.43238 9.276 6.43238Z",
-      fill: "white"
-    }), /* @__PURE__ */jsxRuntime.jsx("path", {
-      d: "M15.1536 3.68853C15.0815 3.68243 13.6698 3.66078 13.6698 3.66078C13.6698 3.66078 12.4893 2.50444 12.3726 2.38681C12.3292 2.34298 12.2703 2.32023 12.2087 2.31079L12.2093 19.9994L17.4999 18.6733C17.4999 18.6733 15.3412 3.95264 15.3274 3.85166C15.3137 3.75068 15.2257 3.69463 15.1536 3.68853Z",
-      fill: "#5E8E3E"
-    })]
-  });
+  const $ = c(1);
+  let t0;
+  return $[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsxs("svg", { width: "18", height: "20", viewBox: "0 0 18 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ jsx("path", { d: "M15.3269 3.85113C15.3132 3.75015 15.2258 3.69411 15.1531 3.688C15.081 3.6819 13.6693 3.66026 13.6693 3.66026C13.6693 3.66026 12.4887 2.50392 12.3722 2.38628C12.2555 2.26865 12.0277 2.30417 11.9392 2.3308C11.9381 2.33135 11.7175 2.40016 11.3461 2.51612C11.2839 2.31304 11.1927 2.06335 11.0622 1.81255C10.6419 1.00356 10.0263 0.575752 9.2825 0.574642C9.28142 0.574642 9.28092 0.574642 9.27975 0.574642C9.22808 0.574642 9.17692 0.579636 9.12517 0.584074C9.10317 0.557441 9.08117 0.531362 9.05808 0.505838C8.73408 0.156272 8.31869 -0.0140727 7.82082 0.000908712C6.86027 0.0286521 5.90357 0.72834 5.12787 1.97124C4.58212 2.84572 4.16677 3.94435 4.04904 4.79497C2.94601 5.13953 2.17471 5.38035 2.15766 5.3859C1.60091 5.56235 1.58331 5.57955 1.51069 6.10889C1.45677 6.50895 0 17.8704 0 17.8704L12.2082 20L17.4994 18.6733C17.4994 18.6733 15.3407 3.95212 15.3269 3.85113ZM10.7349 2.707C10.4537 2.79467 10.1342 2.89454 9.78758 3.00274C9.78042 2.51224 9.72267 1.82975 9.496 1.23992C10.2249 1.3792 10.5836 2.21095 10.7349 2.707ZM9.14883 3.20249C8.509 3.40225 7.81091 3.62031 7.11058 3.83892C7.30753 3.0782 7.68107 2.32081 8.13989 1.8242C8.31044 1.63943 8.54917 1.43358 8.832 1.31594C9.09767 1.87525 9.15542 2.66705 9.14883 3.20249ZM7.84007 0.645665C8.06562 0.640671 8.25542 0.690609 8.41775 0.798253C8.15805 0.9342 7.90718 1.12951 7.67172 1.38419C7.06162 2.04448 6.594 3.06932 6.4075 4.0581C5.826 4.23954 5.25715 4.41766 4.73342 4.58078C5.06405 3.02438 6.35743 0.688944 7.84007 0.645665Z", fill: "#95BF47" }),
+    /* @__PURE__ */ jsx("path", { d: "M9.276 6.43238L8.66142 8.75117C8.66142 8.75117 7.97598 8.43658 7.16342 8.48817C5.97181 8.56417 5.95916 9.32217 5.97126 9.51242C6.03618 10.5495 8.74125 10.7759 8.89308 13.2051C9.01242 15.1161 7.88796 16.4233 6.26779 16.5265C4.32303 16.6502 3.25246 15.4933 3.25246 15.4933L3.66452 13.7256C3.66452 13.7256 4.74224 14.5457 5.60487 14.4907C6.16821 14.4547 6.36957 13.9924 6.34921 13.6657C6.26448 12.3128 4.06172 12.3927 3.92253 10.17C3.80536 8.29951 5.02337 6.40408 7.71081 6.23318C8.74617 6.16604 9.276 6.43238 9.276 6.43238Z", fill: "white" }),
+    /* @__PURE__ */ jsx("path", { d: "M15.1536 3.68853C15.0815 3.68243 13.6698 3.66078 13.6698 3.66078C13.6698 3.66078 12.4893 2.50444 12.3726 2.38681C12.3292 2.34298 12.2703 2.32023 12.2087 2.31079L12.2093 19.9994L17.4999 18.6733C17.4999 18.6733 15.3412 3.95264 15.3274 3.85166C15.3137 3.75068 15.2257 3.69463 15.1536 3.68853Z", fill: "#5E8E3E" })
+  ] }), $[0] = t0) : t0 = $[0], t0;
 };
 function ShopifyAssetInput(props) {
-  const {
+  const $ = c(28), {
     onChange,
     readOnly,
     value,
     schemaType
-  } = props;
-  const {
+  } = props, {
     options
-  } = schemaType;
-  const {
+  } = schemaType, {
     shopifyDomain
-  } = options;
-  const [dialogOpen, setDialogOpen] = React.useState(false);
-  const removeValue = React.useCallback(() => {
-    onChange(sanity.PatchEvent.from([sanity.unset()]));
-  }, [onChange]);
-  const onOpen = React.useCallback(() => {
-    setDialogOpen(true);
-  }, [setDialogOpen]);
-  const onClose = React.useCallback(() => {
-    setDialogOpen(false);
-  }, [setDialogOpen]);
+  } = options, [dialogOpen, setDialogOpen] = useState(!1);
+  let t0;
+  $[0] !== onChange ? (t0 = () => {
+    onChange(PatchEvent.from([unset()]));
+  }, $[0] = onChange, $[1] = t0) : t0 = $[1];
+  const removeValue = t0;
+  let t1;
+  $[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t1 = () => {
+    setDialogOpen(!0);
+  }, $[2] = t1) : t1 = $[2];
+  const onOpen = t1;
+  let t2;
+  $[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = () => {
+    setDialogOpen(!1);
+  }, $[3] = t2) : t2 = $[3];
+  const onClose = t2;
   if (!shopifyDomain) {
-    return /* @__PURE__ */jsxRuntime.jsx(ui.Card, {
-      overflow: "hidden",
-      padding: 4,
-      radius: 2,
-      shadow: 1,
-      tone: "critical",
-      children: /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
-        align: "center",
-        gap: 3,
-        children: [/* @__PURE__ */jsxRuntime.jsx(ui.Text, {
-          size: 2,
-          children: /* @__PURE__ */jsxRuntime.jsx(icons.ErrorOutlineIcon, {})
-        }), /* @__PURE__ */jsxRuntime.jsx(ui.Inline, {
-          space: 2,
-          children: /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
-            size: 1,
-            children: "You need to configure your *.myshopify.com domain in the plugin / field options to enable Shopify Assets."
-          })
-        })]
-      })
-    });
+    let t32;
+    $[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t32 = /* @__PURE__ */ jsx(Text, { size: 2, children: /* @__PURE__ */ jsx(ErrorOutlineIcon, {}) }), $[4] = t32) : t32 = $[4];
+    let t42;
+    return $[5] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t42 = /* @__PURE__ */ jsx(Card, { overflow: "hidden", padding: 4, radius: 2, shadow: 1, tone: "critical", children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 3, children: [
+      t32,
+      /* @__PURE__ */ jsx(Inline, { gap: 2, children: /* @__PURE__ */ jsx(Text, { size: 1, children: "You need to configure your *.myshopify.com domain in the plugin / field options to enable Shopify Assets." }) })
+    ] }) }), $[5] = t42) : t42 = $[5], t42;
   }
-  return /* @__PURE__ */jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [dialogOpen && /* @__PURE__ */jsxRuntime.jsx(ShopifyAssetPicker, {
-      ...props,
-      shopifyDomain,
-      isOpen: dialogOpen,
-      onClose,
-      value
-    }), /* @__PURE__ */jsxRuntime.jsxs(ui.Stack, {
-      children: [/* @__PURE__ */jsxRuntime.jsx(AssetPreview, {
-        value
-      }), /* @__PURE__ */jsxRuntime.jsxs(ui.Grid, {
-        gap: 1,
-        style: {
-          gridTemplateColumns: "repeat(auto-fit, minmax(100px, 1fr))"
-        },
-        children: [/* @__PURE__ */jsxRuntime.jsx(ui.Button, {
-          disabled: readOnly,
-          mode: "ghost",
-          icon: ShopifyIcon,
-          title: "Select an asset",
-          onClick: onOpen,
-          text: "Select\u2026"
-        }), /* @__PURE__ */jsxRuntime.jsx(ui.Button, {
-          disabled: readOnly || !value,
-          tone: "critical",
-          mode: "ghost",
-          title: "Remove asset",
-          text: "Remove",
-          onClick: removeValue
-        })]
-      })]
-    })]
-  });
+  let t3;
+  $[6] !== dialogOpen || $[7] !== props || $[8] !== shopifyDomain || $[9] !== value ? (t3 = dialogOpen && /* @__PURE__ */ jsx(ShopifyAssetPicker, { ...props, shopifyDomain, isOpen: dialogOpen, onClose, value }), $[6] = dialogOpen, $[7] = props, $[8] = shopifyDomain, $[9] = value, $[10] = t3) : t3 = $[10];
+  let t4;
+  $[11] !== value ? (t4 = /* @__PURE__ */ jsx(AssetPreview, { value }), $[11] = value, $[12] = t4) : t4 = $[12];
+  let t5;
+  $[13] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t5 = {
+    gridTemplateColumns: "repeat(auto-fit, minmax(100px, 1fr))"
+  }, $[13] = t5) : t5 = $[13];
+  let t6;
+  $[14] !== readOnly ? (t6 = /* @__PURE__ */ jsx(Button, { disabled: readOnly, mode: "ghost", icon: ShopifyIcon, title: "Select an asset", onClick: onOpen, text: "Select\u2026" }), $[14] = readOnly, $[15] = t6) : t6 = $[15];
+  const t7 = readOnly || !value;
+  let t8;
+  $[16] !== removeValue || $[17] !== t7 ? (t8 = /* @__PURE__ */ jsx(Button, { disabled: t7, tone: "critical", mode: "ghost", title: "Remove asset", text: "Remove", onClick: removeValue }), $[16] = removeValue, $[17] = t7, $[18] = t8) : t8 = $[18];
+  let t9;
+  $[19] !== t6 || $[20] !== t8 ? (t9 = /* @__PURE__ */ jsxs(Grid, { gap: 1, style: t5, children: [
+    t6,
+    t8
+  ] }), $[19] = t6, $[20] = t8, $[21] = t9) : t9 = $[21];
+  let t10;
+  $[22] !== t4 || $[23] !== t9 ? (t10 = /* @__PURE__ */ jsxs(Stack, { children: [
+    t4,
+    t9
+  ] }), $[22] = t4, $[23] = t9, $[24] = t10) : t10 = $[24];
+  let t11;
+  return $[25] !== t10 || $[26] !== t3 ? (t11 = /* @__PURE__ */ jsxs(Fragment, { children: [
+    t3,
+    t10
+  ] }), $[25] = t10, $[26] = t3, $[27] = t11) : t11 = $[27], t11;
 }
-const CloudinaryDiffPreview = _ref10 => {
-  let {
-    value
-  } = _ref10;
-  if (!value) {
-    return null;
-  }
-  if (value?.preview?.url) {
-    return /* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
-      justify: "center",
-      align: "center",
-      height: "fill",
-      width: "fill",
-      children: /* @__PURE__ */jsxRuntime.jsxs(ui.Stack, {
-        space: 2,
-        children: [/* @__PURE__ */jsxRuntime.jsx("img", {
-          alt: "preview",
-          src: value?.preview?.url,
-          style: {
-            objectFit: "contain",
-            margin: "auto",
-            maxWidth: "100%",
-            maxHeight: "100%"
-          }
-        }), /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
-          size: 1,
-          children: value.type.charAt(0).toUpperCase() + value.type.slice(1)
-        })]
-      })
-    });
-  }
-  return /* @__PURE__ */jsxRuntime.jsx(ui.Flex, {
-    justify: "center",
-    align: "center",
-    height: "fill",
-    width: "fill",
-    children: /* @__PURE__ */jsxRuntime.jsx("div", {
-      children: "(no image)"
-    })
-  });
-};
-const AssetDiff = _ref11 => {
-  let {
-    diff,
-    schemaType
-  } = _ref11;
-  return /* @__PURE__ */jsxRuntime.jsx(sanity.DiffFromTo, {
-    diff,
-    schemaType,
-    previewComponent: CloudinaryDiffPreview,
-    layout: "grid"
-  });
-};
-const shopifyAssetSchema = config => {
+const shopifyAssetSchema = (config) => {
   const {
     shopifyDomain
   } = config;
-  return sanity.defineType({
+  return defineType({
     type: "object",
     name: "shopify.asset",
     title: "Shopify Asset",
     options: {
       shopifyDomain
     },
-    fields: [sanity.defineField({
+    fields: [defineField({
       type: "string",
       name: "filename",
       title: "Filename"
-    }), sanity.defineField({
+    }), defineField({
       type: "string",
       name: "id",
       title: "ID"
-    }), sanity.defineField({
+    }), defineField({
       type: "shopify.assetMetadata",
       name: "meta",
       title: "Metadata"
-    }), sanity.defineField({
+    }), defineField({
       type: "shopify.assetPreview",
       name: "preview",
       title: "Preview"
-    }), sanity.defineField({
+    }), defineField({
       type: "string",
       name: "type",
       title: "Type"
-    }), sanity.defineField({
+    }), defineField({
       type: "url",
       name: "url",
       title: "URL"
     })],
-    ...{
-      components: {
-        input: ShopifyAssetInput,
-        diff: AssetDiff,
-        preview: AssetPreview
-      }
+    components: {
+      input: ShopifyAssetInput,
+      diff: AssetDiff,
+      preview: AssetPreview
     },
     preview: {
       select: {
@@ -798,14 +608,13 @@ const shopifyAssetSchema = config => {
         filename: "filename",
         type: "type"
       },
-      prepare(_ref12) {
-        let {
-          url,
-          meta,
-          preview,
-          filename,
-          type
-        } = _ref12;
+      prepare({
+        url,
+        meta,
+        preview,
+        filename,
+        type
+      }) {
         return {
           title: filename,
           subtitle: type,
@@ -819,58 +628,13 @@ const shopifyAssetSchema = config => {
       }
     }
   });
+}, shopifyAssets = definePlugin((config) => ({
+  name: "shopify-asset-schema",
+  schema: {
+    types: [shopifyAssetPreviewSchema, shopifyAssetMetadataSchema, shopifyAssetSchema(config)]
+  }
+}));
+export {
+  shopifyAssets
 };
-const shopifyAssetPreviewSchema = sanity.defineType({
-  type: "object",
-  name: "shopify.assetPreview",
-  title: "Asset preview",
-  fields: [sanity.defineField({
-    type: "number",
-    name: "height",
-    title: "Height"
-  }), sanity.defineField({
-    type: "number",
-    name: "width",
-    title: "Width"
-  }), sanity.defineField({
-    type: "url",
-    name: "url",
-    title: "URL"
-  })]
-});
-const shopifyAssetMetadataSchema = sanity.defineType({
-  type: "object",
-  name: "shopify.assetMetadata",
-  title: "Asset metadata",
-  fields: [sanity.defineField({
-    type: "string",
-    name: "alt",
-    title: "Alternative text"
-  }), sanity.defineField({
-    type: "number",
-    name: "duration",
-    title: "Duration"
-  }), sanity.defineField({
-    type: "number",
-    name: "fileSize",
-    title: "File size"
-  }), sanity.defineField({
-    type: "number",
-    name: "height",
-    title: "Height"
-  }), sanity.defineField({
-    type: "number",
-    name: "width",
-    title: "Width"
-  })]
-});
-const shopifyAssets = sanity.definePlugin(config => {
-  return {
-    name: "shopify-asset-schema",
-    schema: {
-      types: [shopifyAssetPreviewSchema, shopifyAssetMetadataSchema, shopifyAssetSchema(config)]
-    }
-  };
-});
-exports.shopifyAssets = shopifyAssets;
 //# sourceMappingURL=index.js.map