sanity-plugin-markdown 4.1.2 → 5.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sanity-plugin-markdown",
-  "version": "4.1.2",
+  "version": "5.0.0",
   "description": "Markdown fields in Sanity Studio. Supports Github flavored Markdown and image uploads.",
   "keywords": [
     "sanity",
@@ -19,31 +19,29 @@
   },
   "license": "MIT",
   "author": "Sanity.io <hello@sanity.io>",
+  "sideEffects": false,
   "exports": {
     ".": {
-      "types": "./lib/index.d.ts",
       "source": "./src/index.ts",
+      "import": "./lib/index.mjs",
       "require": "./lib/index.js",
-      "import": "./lib/index.esm.js",
-      "default": "./lib/index.esm.js"
+      "default": "./lib/index.js"
     },
     "./next": {
-      "types": "./lib/index.d.ts",
       "source": "./src/indexNext.ts",
+      "import": "./lib/indexNext.mjs",
       "require": "./lib/indexNext.js",
-      "import": "./lib/indexNext.esm.js",
-      "default": "./lib/indexNext.esm.js"
+      "default": "./lib/indexNext.js"
     },
     "./package.json": "./package.json"
   },
   "main": "./lib/index.js",
   "module": "./lib/index.esm.js",
-  "source": "./src/index.ts",
   "types": "./lib/index.d.ts",
   "typesVersions": {
     "*": {
       "next": [
-        "./lib/index.d.ts"
+        "./lib/indexNext.d.ts"
       ]
     }
   },
@@ -54,60 +52,58 @@
     "v2-incompatible.js"
   ],
   "scripts": {
-    "prebuild": "npm run clean && plugin-kit verify-package --silent && pkg-utils",
-    "build": "run-s clean && plugin-kit verify-package --silent && pkg-utils build --strict && pkg-utils --strict",
-    "clean": "rimraf lib",
+    "build": "plugin-kit verify-package --silent && pkg-utils build --strict --check --clean",
     "compile": "tsc --noEmit",
     "format": "prettier --write --cache --ignore-unknown .",
     "link-watch": "plugin-kit link-watch",
     "lint": "eslint .",
     "prepare": "husky install",
-    "prepublishOnly": "run-s build",
+    "prepublishOnly": "npm run build",
     "watch": "pkg-utils watch --strict"
   },
+  "browserslist": "extends @sanity/browserslist-config",
+  "prettier": "@sanity/prettier-config",
   "dependencies": {
     "@sanity/incompatible-plugin": "^1.0.4",
-    "@sanity/ui": "^1.0.0",
+    "@sanity/ui": "^2.8.9",
     "react-simplemde-editor": "^5.2.0"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.2.0",
     "@commitlint/config-conventional": "^17.2.0",
-    "@sanity/pkg-utils": "^2.2.6",
-    "@sanity/plugin-kit": "^3.1.7",
+    "@sanity/pkg-utils": "^6.11.0",
+    "@sanity/plugin-kit": "^4.0.18",
+    "@sanity/prettier-config": "^1.0.3",
     "@sanity/semantic-release-preset": "^2.0.2",
-    "@types/react": "^18.0.26",
-    "@types/styled-components": "^5.1.26",
+    "@types/react": "^18.3.5",
     "@typescript-eslint/eslint-plugin": "^5.48.0",
     "@typescript-eslint/parser": "^5.48.0",
     "easymde": "^2.18.0",
     "eslint": "^8.31.0",
-    "eslint-config-prettier": "^8.6.0",
+    "eslint-config-prettier": "^9.1.0",
     "eslint-config-sanity": "^6.0.0",
-    "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-react": "^7.31.11",
-    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-prettier": "^5.2.1",
+    "eslint-plugin-react": "^7.35.2",
+    "eslint-plugin-react-hooks": "^4.6.2",
     "husky": "^8.0.1",
     "lint-staged": "^13.0.3",
     "npm-run-all": "^4.1.5",
-    "prettier": "^2.8.1",
-    "prettier-plugin-packagejson": "^2.3.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-is": "^18.2.0",
-    "rimraf": "^5.0.0",
-    "sanity": "^3.1.4",
-    "styled-components": "^5.3.6",
-    "typescript": "^5.0.0"
+    "prettier": "^3.3.3",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-is": "^18.3.1",
+    "sanity": "^3.57.1",
+    "styled-components": "^6.1.13",
+    "typescript": "5.5.4"
   },
   "peerDependencies": {
-    "easymde": "^2",
-    "react": "^18",
-    "sanity": "^3",
-    "styled-components": "^5.2 || ^6"
+    "easymde": "^2.18",
+    "react": "^18.3",
+    "sanity": "^3.23",
+    "styled-components": "^6.1"
   },
   "engines": {
-    "node": ">=14"
+    "node": ">=18"
   },
   "sanityExchangeUrl": "https://www.sanity.io/plugins/sanity-plugin-markdown"
 }

package/src/components/MarkdownInput.tsx

@@ -1,20 +1,21 @@
 import {type Options as EasyMdeOptions} from 'easymde'
-import React, {Suspense, useCallback, useMemo} from 'react'
+import {lazy, Suspense, useCallback, useMemo, useSyncExternalStore} from 'react'
 // dont import non-types here, it will break SSR on next
 import type {SimpleMDEReactProps} from 'react-simplemde-editor'
 import {PatchEvent, set, StringInputProps, unset, useClient} from 'sanity'
 import {MarkdownOptions} from '../schema'
 import {MarkdownInputStyles} from './MarkdownInputStyles'
-import {useSimpleMdeReact} from './useSimpleMdeReact'
 import {Box, Text} from '@sanity/ui'
 
+const SimpleMdeReact = lazy(() => import('react-simplemde-editor'))
+
 export interface MarkdownInputProps extends StringInputProps {
   /**
    * These are passed along directly to
    *
    * Note: MarkdownInput sets certain reactMdeProps.options by default.
    * These will be merged with any custom options.
-   * */
+   */
   reactMdeProps?: Omit<SimpleMDEReactProps, 'value' | 'onChange'>
 }
 
@@ -56,7 +57,7 @@ export function MarkdownInput(props: MarkdownInputProps) {
           onError(e.message)
         })
     },
-    [client, imageUrl]
+    [client, imageUrl],
   )
 
   const mdeOptions: EasyMdeOptions = useMemo(() => {
@@ -76,33 +77,42 @@ export function MarkdownInput(props: MarkdownInputProps) {
     (newValue: string) => {
       onChange(PatchEvent.from(newValue ? set(newValue) : unset()))
     },
-    [onChange]
+    [onChange],
+  )
+
+  const mounted = useSyncExternalStore(
+    noop,
+    () => true,
+    () => false,
   )
 
-  const SimpleMdeReact = useSimpleMdeReact()
+  if (!mounted) {
+    return <MarkdownInputStyles>{fallback}</MarkdownInputStyles>
+  }
 
   return (
     <MarkdownInputStyles>
-      {SimpleMdeReact && (
-        <Suspense
-          fallback={
-            <Box padding={3}>
-              <Text>Loading editor...</Text>
-            </Box>
-          }
-        >
-          <SimpleMdeReact
-            {...reactMdeProps}
-            ref={ref}
-            value={value}
-            onChange={handleChange}
-            onBlur={onBlur}
-            onFocus={onFocus}
-            options={mdeOptions}
-            spellCheck={false}
-          />
-        </Suspense>
-      )}
+      <Suspense fallback={fallback}>
+        <SimpleMdeReact
+          {...reactMdeProps}
+          ref={ref}
+          value={value}
+          onChange={handleChange}
+          onBlur={onBlur}
+          onFocus={onFocus}
+          options={mdeOptions}
+          spellCheck={false}
+        />
+      </Suspense>
     </MarkdownInputStyles>
   )
 }
+
+// eslint-disable-next-line no-empty-function
+const noop = () => () => {}
+
+const fallback = (
+  <Box padding={3}>
+    <Text>Loading editor...</Text>
+  </Box>
+)

package/src/components/MarkdownInputStyles.tsx

@@ -1,63 +1,61 @@
-import {Box, type Theme} from '@sanity/ui'
-import styled, {css} from 'styled-components'
-
-export const MarkdownInputStyles = styled(Box)(({theme}: {theme: Theme}) => {
-  return css`
-    & .CodeMirror.CodeMirror {
-      color: ${theme.sanity.color.card.enabled.fg};
-      border-color: ${theme.sanity.color.card.enabled.border};
-      background-color: inherit;
-    }
-
-    & .cm-s-easymde .CodeMirror-cursor {
-      border-color: ${theme.sanity.color.card.enabled.fg};
-    }
-
-    & .editor-toolbar,
-    .editor-preview-side {
-      border-color: ${theme.sanity.color.card.enabled.border};
-    }
-
-    & .CodeMirror-focused .CodeMirror-selected.CodeMirror-selected.CodeMirror-selected {
-      background-color: ${theme.sanity.color.selectable?.primary?.hovered?.bg};
-    }
-
-    & .CodeMirror-selected.CodeMirror-selected.CodeMirror-selected {
-      background-color: ${theme.sanity.color.card.enabled.bg};
-    }
-
-    & .editor-toolbar > * {
-      color: ${theme.sanity.color.card.enabled.fg};
-    }
-
-    & .editor-toolbar > .active,
-    .editor-toolbar > button:hover,
-    .editor-preview pre,
-    .cm-s-easymde .cm-comment {
-      background-color: ${theme.sanity.color.card.enabled.bg};
-    }
-
-    & .editor-preview {
-      background-color: ${theme.sanity.color.card.enabled.bg};
-
-      & h1,
-      h2,
-      h3,
-      h4,
-      h5,
-      h6 {
-        font-size: revert;
-      }
-
-      & ul,
-      li {
-        list-style: revert;
-        padding: revert;
-      }
-
-      & a {
-        text-decoration: revert;
-      }
-    }
-  `
-})
+import {Box} from '@sanity/ui'
+import {styled} from 'styled-components'
+
+export const MarkdownInputStyles = styled(Box)`
+  & .CodeMirror.CodeMirror {
+    color: ${({theme}) => theme.sanity.color.card.enabled.fg};
+    border-color: ${({theme}) => theme.sanity.color.card.enabled.border};
+    background-color: inherit;
+  }
+
+  & .cm-s-easymde .CodeMirror-cursor {
+    border-color: ${({theme}) => theme.sanity.color.card.enabled.fg};
+  }
+
+  & .editor-toolbar,
+  .editor-preview-side {
+    border-color: ${({theme}) => theme.sanity.color.card.enabled.border};
+  }
+
+  & .CodeMirror-focused .CodeMirror-selected.CodeMirror-selected.CodeMirror-selected {
+    background-color: ${({theme}) => theme.sanity.color.selectable?.primary?.hovered?.bg};
+  }
+
+  & .CodeMirror-selected.CodeMirror-selected.CodeMirror-selected {
+    background-color: ${({theme}) => theme.sanity.color.card.enabled.bg};
+  }
+
+  & .editor-toolbar > * {
+    color: ${({theme}) => theme.sanity.color.card.enabled.fg};
+  }
+
+  & .editor-toolbar > .active,
+  .editor-toolbar > button:hover,
+  .editor-preview pre,
+  .cm-s-easymde .cm-comment {
+    background-color: ${({theme}) => theme.sanity.color.card.enabled.bg};
+  }
+
+  & .editor-preview {
+    background-color: ${({theme}) => theme.sanity.color.card.enabled.bg};
+
+    & h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+      font-size: revert;
+    }
+
+    & ul,
+    li {
+      list-style: revert;
+      padding: revert;
+    }
+
+    & a {
+      text-decoration: revert;
+    }
+  }
+`

package/lib/_chunks/plugin-0fd9aa65.js

@@ -1,112 +0,0 @@
-var _templateObject;
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-import { useClient, PatchEvent, set, unset, defineType, definePlugin } from 'sanity';
-import { jsx } from 'react/jsx-runtime';
-import { lazy, useState, useEffect, useCallback, useMemo, Suspense } from 'react';
-import { Box, Text } from '@sanity/ui';
-import styled, { css } from 'styled-components';
-const MarkdownInputStyles = styled(Box)(_ref => {
-  let {
-    theme
-  } = _ref;
-  var _a, _b, _c;
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    & .CodeMirror.CodeMirror {\n      color: ", ";\n      border-color: ", ";\n      background-color: inherit;\n    }\n\n    & .cm-s-easymde .CodeMirror-cursor {\n      border-color: ", ";\n    }\n\n    & .editor-toolbar,\n    .editor-preview-side {\n      border-color: ", ";\n    }\n\n    & .CodeMirror-focused .CodeMirror-selected.CodeMirror-selected.CodeMirror-selected {\n      background-color: ", ";\n    }\n\n    & .CodeMirror-selected.CodeMirror-selected.CodeMirror-selected {\n      background-color: ", ";\n    }\n\n    & .editor-toolbar > * {\n      color: ", ";\n    }\n\n    & .editor-toolbar > .active,\n    .editor-toolbar > button:hover,\n    .editor-preview pre,\n    .cm-s-easymde .cm-comment {\n      background-color: ", ";\n    }\n\n    & .editor-preview {\n      background-color: ", ";\n\n      & h1,\n      h2,\n      h3,\n      h4,\n      h5,\n      h6 {\n        font-size: revert;\n      }\n\n      & ul,\n      li {\n        list-style: revert;\n        padding: revert;\n      }\n\n      & a {\n        text-decoration: revert;\n      }\n    }\n  "])), theme.sanity.color.card.enabled.fg, theme.sanity.color.card.enabled.border, theme.sanity.color.card.enabled.fg, theme.sanity.color.card.enabled.border, (_c = (_b = (_a = theme.sanity.color.selectable) == null ? void 0 : _a.primary) == null ? void 0 : _b.hovered) == null ? void 0 : _c.bg, theme.sanity.color.card.enabled.bg, theme.sanity.color.card.enabled.fg, theme.sanity.color.card.enabled.bg, theme.sanity.color.card.enabled.bg);
-});
-const SimpleMdeReact = lazy(() => import('react-simplemde-editor'));
-function useSimpleMdeReact() {
-  const [mounted, setMounted] = useState(false);
-  useEffect(() => {
-    requestAnimationFrame(() => setMounted(true));
-  }, []);
-  return mounted ? SimpleMdeReact : null;
-}
-const defaultMdeTools = ["heading", "bold", "italic", "|", "quote", "unordered-list", "ordered-list", "|", "link", "image", "code", "|", "preview", "side-by-side"];
-function MarkdownInput(props) {
-  var _a;
-  const {
-    value = "",
-    onChange,
-    elementProps: {
-      onBlur,
-      onFocus,
-      ref
-    },
-    reactMdeProps: {
-      options: mdeCustomOptions,
-      ...reactMdeProps
-    } = {},
-    schemaType
-  } = props;
-  const client = useClient({
-    apiVersion: "2022-01-01"
-  });
-  const {
-    imageUrl
-  } = (_a = schemaType.options) != null ? _a : {};
-  const imageUpload = useCallback((file, onSuccess, onError) => {
-    client.assets.upload("image", file).then(doc => onSuccess(imageUrl ? imageUrl(doc) : "".concat(doc.url, "?w=450"))).catch(e => {
-      console.error(e);
-      onError(e.message);
-    });
-  }, [client, imageUrl]);
-  const mdeOptions = useMemo(() => {
-    return {
-      autofocus: false,
-      spellChecker: false,
-      sideBySideFullscreen: false,
-      uploadImage: true,
-      imageUploadFunction: imageUpload,
-      toolbar: defaultMdeTools,
-      status: false,
-      ...mdeCustomOptions
-    };
-  }, [imageUpload, mdeCustomOptions]);
-  const handleChange = useCallback(newValue => {
-    onChange(PatchEvent.from(newValue ? set(newValue) : unset()));
-  }, [onChange]);
-  const SimpleMdeReact = useSimpleMdeReact();
-  return /* @__PURE__ */jsx(MarkdownInputStyles, {
-    children: SimpleMdeReact && /* @__PURE__ */jsx(Suspense, {
-      fallback: /* @__PURE__ */jsx(Box, {
-        padding: 3,
-        children: /* @__PURE__ */jsx(Text, {
-          children: "Loading editor..."
-        })
-      }),
-      children: /* @__PURE__ */jsx(SimpleMdeReact, {
-        ...reactMdeProps,
-        ref,
-        value,
-        onChange: handleChange,
-        onBlur,
-        onFocus,
-        options: mdeOptions,
-        spellCheck: false
-      })
-    })
-  });
-}
-const markdownTypeName = "markdown";
-const markdownSchemaType = defineType({
-  type: "string",
-  name: markdownTypeName,
-  title: "Markdown",
-  components: {
-    input: MarkdownInput
-  }
-});
-const markdownSchema = definePlugin(config => {
-  return {
-    name: "markdown-editor",
-    schema: {
-      types: [config && config.input ? {
-        ...markdownSchemaType,
-        components: {
-          input: config.input
-        }
-      } : markdownSchemaType]
-    }
-  };
-});
-export { MarkdownInput, defaultMdeTools, markdownSchema, markdownSchemaType };
-//# sourceMappingURL=plugin-0fd9aa65.js.map

package/lib/_chunks/plugin-0fd9aa65.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"plugin-0fd9aa65.js","sources":["../../src/components/MarkdownInputStyles.tsx","../../src/components/useSimpleMdeReact.tsx","../../src/components/MarkdownInput.tsx","../../src/schema.ts","../../src/plugin.tsx"],"sourcesContent":["import {Box, type Theme} from '@sanity/ui'\nimport styled, {css} from 'styled-components'\n\nexport const MarkdownInputStyles = styled(Box)(({theme}: {theme: Theme}) => {\n  return css`\n    & .CodeMirror.CodeMirror {\n      color: ${theme.sanity.color.card.enabled.fg};\n      border-color: ${theme.sanity.color.card.enabled.border};\n      background-color: inherit;\n    }\n\n    & .cm-s-easymde .CodeMirror-cursor {\n      border-color: ${theme.sanity.color.card.enabled.fg};\n    }\n\n    & .editor-toolbar,\n    .editor-preview-side {\n      border-color: ${theme.sanity.color.card.enabled.border};\n    }\n\n    & .CodeMirror-focused .CodeMirror-selected.CodeMirror-selected.CodeMirror-selected {\n      background-color: ${theme.sanity.color.selectable?.primary?.hovered?.bg};\n    }\n\n    & .CodeMirror-selected.CodeMirror-selected.CodeMirror-selected {\n      background-color: ${theme.sanity.color.card.enabled.bg};\n    }\n\n    & .editor-toolbar > * {\n      color: ${theme.sanity.color.card.enabled.fg};\n    }\n\n    & .editor-toolbar > .active,\n    .editor-toolbar > button:hover,\n    .editor-preview pre,\n    .cm-s-easymde .cm-comment {\n      background-color: ${theme.sanity.color.card.enabled.bg};\n    }\n\n    & .editor-preview {\n      background-color: ${theme.sanity.color.card.enabled.bg};\n\n      & h1,\n      h2,\n      h3,\n      h4,\n      h5,\n      h6 {\n        font-size: revert;\n      }\n\n      & ul,\n      li {\n        list-style: revert;\n        padding: revert;\n      }\n\n      & a {\n        text-decoration: revert;\n      }\n    }\n  `\n})\n","import {lazy, useEffect, useState} from 'react'\n\nexport const SimpleMdeReact = lazy(() => import('react-simplemde-editor'))\n\nexport function useSimpleMdeReact() {\n  const [mounted, setMounted] = useState(false)\n  useEffect(() => {\n    requestAnimationFrame(() => setMounted(true))\n  }, [])\n\n  return mounted ? SimpleMdeReact : null\n}\n","import {type Options as EasyMdeOptions} from 'easymde'\nimport React, {Suspense, useCallback, useMemo} from 'react'\n// dont import non-types here, it will break SSR on next\nimport type {SimpleMDEReactProps} from 'react-simplemde-editor'\nimport {PatchEvent, set, StringInputProps, unset, useClient} from 'sanity'\nimport {MarkdownOptions} from '../schema'\nimport {MarkdownInputStyles} from './MarkdownInputStyles'\nimport {useSimpleMdeReact} from './useSimpleMdeReact'\nimport {Box, Text} from '@sanity/ui'\n\nexport interface MarkdownInputProps extends StringInputProps {\n  /**\n   * These are passed along directly to\n   *\n   * Note: MarkdownInput sets certain reactMdeProps.options by default.\n   * These will be merged with any custom options.\n   * */\n  reactMdeProps?: Omit<SimpleMDEReactProps, 'value' | 'onChange'>\n}\n\nexport const defaultMdeTools: EasyMdeOptions['toolbar'] = [\n  'heading',\n  'bold',\n  'italic',\n  '|',\n  'quote',\n  'unordered-list',\n  'ordered-list',\n  '|',\n  'link',\n  'image',\n  'code',\n  '|',\n  'preview',\n  'side-by-side',\n]\n\nexport function MarkdownInput(props: MarkdownInputProps) {\n  const {\n    value = '',\n    onChange,\n    elementProps: {onBlur, onFocus, ref},\n    reactMdeProps: {options: mdeCustomOptions, ...reactMdeProps} = {},\n    schemaType,\n  } = props\n  const client = useClient({apiVersion: '2022-01-01'})\n  const {imageUrl} = (schemaType.options as MarkdownOptions | undefined) ?? {}\n\n  const imageUpload = useCallback(\n    (file: File, onSuccess: (url: string) => void, onError: (error: string) => void) => {\n      client.assets\n        .upload('image', file)\n        .then((doc) => onSuccess(imageUrl ? imageUrl(doc) : `${doc.url}?w=450`))\n        .catch((e) => {\n          console.error(e)\n          onError(e.message)\n        })\n    },\n    [client, imageUrl]\n  )\n\n  const mdeOptions: EasyMdeOptions = useMemo(() => {\n    return {\n      autofocus: false,\n      spellChecker: false,\n      sideBySideFullscreen: false,\n      uploadImage: true,\n      imageUploadFunction: imageUpload,\n      toolbar: defaultMdeTools,\n      status: false,\n      ...mdeCustomOptions,\n    }\n  }, [imageUpload, mdeCustomOptions])\n\n  const handleChange = useCallback(\n    (newValue: string) => {\n      onChange(PatchEvent.from(newValue ? set(newValue) : unset()))\n    },\n    [onChange]\n  )\n\n  const SimpleMdeReact = useSimpleMdeReact()\n\n  return (\n    <MarkdownInputStyles>\n      {SimpleMdeReact && (\n        <Suspense\n          fallback={\n            <Box padding={3}>\n              <Text>Loading editor...</Text>\n            </Box>\n          }\n        >\n          <SimpleMdeReact\n            {...reactMdeProps}\n            ref={ref}\n            value={value}\n            onChange={handleChange}\n            onBlur={onBlur}\n            onFocus={onFocus}\n            options={mdeOptions}\n            spellCheck={false}\n          />\n        </Suspense>\n      )}\n    </MarkdownInputStyles>\n  )\n}\n","import {defineType, StringDefinition} from 'sanity'\nimport {MarkdownInput} from './components/MarkdownInput'\nimport {SanityImageAssetDocument} from '@sanity/client'\n\nexport const markdownTypeName = 'markdown' as const\n\nexport interface MarkdownOptions {\n  /**\n   * Used to create image url for any uploaded image.\n   * The function will be invoked whenever an image is pasted or dragged into the\n   * markdown editor, after upload completes.\n   *\n   * The default implementation uses\n   * ```js\n   * imageAsset => `${imageAsset.url}?w=450`\n   * ```\n   * ## Example\n   * ```js\n   * {\n   *   imageUrl: imageAsset => `${imageAsset.url}?w=400&h=400`\n   * }\n   * ```\n   * @param imageAsset\n   */\n  imageUrl?: (imageAsset: SanityImageAssetDocument) => string\n}\n\n/**\n * @public\n */\nexport interface MarkdownDefinition extends Omit<StringDefinition, 'type' | 'fields' | 'options'> {\n  type: typeof markdownTypeName\n  options?: MarkdownOptions\n}\n\ndeclare module '@sanity/types' {\n  // makes type: 'markdown' narrow correctly when using defineType/defineField/defineArrayMember\n  export interface IntrinsicDefinitions {\n    markdown: MarkdownDefinition\n  }\n}\n\nexport const markdownSchemaType = defineType({\n  type: 'string',\n  name: markdownTypeName,\n  title: 'Markdown',\n  components: {input: MarkdownInput},\n})\n","import {definePlugin, StringInputProps} from 'sanity'\nimport {markdownSchemaType} from './schema'\nimport {ReactElement} from 'react'\n\nexport interface MarkdownConfig {\n  /**\n   * When provided, will replace the default input component.\n   *\n   * Use this to customize MarkdownInput by wrapping it in a custom component,\n   * and provide any custom props for https://github.com/RIP21/react-simplemde-editor#react-simplemde-easymde-markdown-editor\n   * via the `reactMdeProps` prop.\n   *\n   * ### Example\n   *\n   * ```tsx\n   * // CustomMarkdownInput.tsx\n   * import { MarkdownInput, MarkdownInputProps } from 'sanity-plugin-markdown'\n   *\n   * export function CustomMarkdownInput(props) {\n   *   const reactMdeProps: MarkdownInputProps['reactMdeProps'] =\n   *     useMemo(() => {\n   *       return {\n   *         options: {\n   *           toolbar: ['bold', 'italic'],\n   *           // more options available, see:\n   *           // https://github.com/Ionaru/easy-markdown-editor#options-list\n   *         },\n   *         // more props available, see:\n   *         // https://github.com/RIP21/react-simplemde-editor#react-simplemde-easymde-markdown-editor\n   *       }\n   *     }, [])\n   *\n   *   return <MarkdownInput {...props} reactMdeProps={reactMdeProps} />\n   * }\n   *\n   * // studio.config.ts\n   * markdownSchema({input: CustomMarkdownInput})\n   * ```\n   */\n  input?: (props: StringInputProps) => ReactElement\n}\n\nexport const markdownSchema = definePlugin((config: MarkdownConfig | void) => {\n  return {\n    name: 'markdown-editor',\n    schema: {\n      types: [\n        config && config.input\n          ? {...markdownSchemaType, components: {input: config.input}}\n          : markdownSchemaType,\n      ],\n    },\n  }\n})\n"],"names":["MarkdownInputStyles","styled","Box","_ref","theme","_a","_b","_c","css","_templateObject","_taggedTemplateLiteral","sanity","color","card","enabled","fg","border","selectable","primary","hovered","bg","SimpleMdeReact","lazy","useSimpleMdeReact","mounted","setMounted","useState","useEffect","requestAnimationFrame","defaultMdeTools","MarkdownInput","props","value","onChange","elementProps","onBlur","onFocus","ref","reactMdeProps","options","mdeCustomOptions","schemaType","client","useClient","apiVersion","imageUrl","imageUpload","useCallback","file","onSuccess","onError","assets","upload","then","doc","concat","url","catch","e","console","error","message","mdeOptions","useMemo","autofocus","spellChecker","sideBySideFullscreen","uploadImage","imageUploadFunction","toolbar","status","handleChange","newValue","PatchEvent","from","set","unset","jsx","children","Suspense","fallback","padding","Text","spellCheck","markdownTypeName","markdownSchemaType","defineType","type","name","title","components","input","markdownSchema","definePlugin","config","schema","types"],"mappings":";;;;;;;AAGO,MAAMA,sBAAsBC,MAAO,CAAAC,GAAG,EAAEC,IAAA,IAA6B;EAAA,IAA5B;IAACC;GAA2B,GAAAD,IAAA;EAH5E,IAAAE,EAAA,EAAAC,EAAA,EAAAC,EAAA;EAIS,OAAAC,GAAA,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,ikCAEMN,KAAM,CAAAO,MAAA,CAAOC,KAAM,CAAAC,IAAA,CAAKC,OAAQ,CAAAC,EAAA,EACzBX,KAAM,CAAAO,MAAA,CAAOC,KAAM,CAAAC,IAAA,CAAKC,OAAQ,CAAAE,MAAA,EAKhCZ,KAAM,CAAAO,MAAA,CAAOC,KAAM,CAAAC,IAAA,CAAKC,OAAQ,CAAAC,EAAA,EAKhCX,KAAM,CAAAO,MAAA,CAAOC,KAAM,CAAAC,IAAA,CAAKC,OAAQ,CAAAE,MAAA,EAI5B,CAAAT,EAAA,GAAA,CAAAD,EAAA,GAAA,CAAAD,EAAA,GAAAD,KAAA,CAAMO,OAAOC,KAAM,CAAAK,UAAA,KAAnB,mBAA+BC,OAA/B,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAZ,EAAA,CAAwCa,YAAxC,IAAiD,GAAA,KAAA,CAAA,GAAAZ,EAAA,CAAAa,EAAA,EAIjDhB,KAAM,CAAAO,MAAA,CAAOC,KAAM,CAAAC,IAAA,CAAKC,OAAQ,CAAAM,EAAA,EAI3ChB,KAAM,CAAAO,MAAA,CAAOC,KAAM,CAAAC,IAAA,CAAKC,OAAQ,CAAAC,EAAA,EAOrBX,KAAM,CAAAO,MAAA,CAAOC,KAAM,CAAAC,IAAA,CAAKC,OAAQ,CAAAM,EAAA,EAIhChB,KAAM,CAAAO,MAAA,CAAOC,KAAM,CAAAC,IAAA,CAAKC,OAAQ,CAAAM,EAAA;AAsB1D,CAAC,CAAA;AC5DM,MAAMC,cAAiB,GAAAC,IAAA,CAAK,MAAM,MAAO,CAAA,wBAAyB,CAAA,CAAA;AAElE,SAASC,iBAAoBA,CAAA,EAAA;EAClC,MAAM,CAACC,OAAA,EAASC,UAAU,CAAA,GAAIC,SAAS,KAAK,CAAA;EAC5CC,SAAA,CAAU,MAAM;IACQC,qBAAA,CAAA,MAAMH,UAAW,CAAA,IAAI,CAAC,CAAA;EAC9C,CAAA,EAAG,EAAE,CAAA;EAEL,OAAOD,UAAUH,cAAiB,GAAA,IAAA;AACpC;ACSO,MAAMQ,eAA6C,GAAA,CACxD,SAAA,EACA,MAAA,EACA,QAAA,EACA,GAAA,EACA,OAAA,EACA,gBAAA,EACA,cAAA,EACA,GAAA,EACA,MAAA,EACA,OAAA,EACA,MAAA,EACA,GAAA,EACA,SAAA,EACA,cAAA,CACF;AAEO,SAASC,cAAcC,KAA2B,EAAA;EArCzD,IAAA1B,EAAA;EAsCQ,MAAA;IACJ2B,KAAQ,GAAA,EAAA;IACRC,QAAA;IACAC,YAAc,EAAA;MAACC,MAAQ;MAAAC,OAAA;MAASC;IAAG,CAAA;IACnCC,eAAe;MAACC,OAAA,EAASC,gBAAqB;MAAA,GAAAF;QAAiB,CAAC,CAAA;IAChEG;EACE,CAAA,GAAAV,KAAA;EACJ,MAAMW,MAAS,GAAAC,SAAA,CAAU;IAACC,UAAA,EAAY;EAAa,CAAA,CAAA;EACnD,MAAM;IAACC;EAAQ,CAAA,GAAA,CAAKxC,EAAW,GAAAoC,UAAA,CAAAF,OAAA,KAAX,YAAsD,EAAC;EAE3E,MAAMO,WAAc,GAAAC,WAAA,CAClB,CAACC,IAAY,EAAAC,SAAA,EAAkCC,OAAqC,KAAA;IAC3ER,MAAA,CAAAS,MAAA,CACJC,OAAO,OAAS,EAAAJ,IAAI,EACpBK,IAAK,CAACC,OAAQL,SAAU,CAAAJ,QAAA,GAAWA,SAASS,GAAG,CAAA,MAAAC,MAAA,CAAOD,GAAI,CAAAE,GAAA,WAAW,CAAC,CACtE,CAAAC,KAAA,CAAOC,CAAM,IAAA;MACZC,OAAA,CAAQC,MAAMF,CAAC,CAAA;MACfR,OAAA,CAAQQ,EAAEG,OAAO,CAAA;IAAA,CAClB,CAAA;EACL,CAAA,EACA,CAACnB,QAAQG,QAAQ,CAAA,CACnB;EAEM,MAAAiB,UAAA,GAA6BC,QAAQ,MAAM;IACxC,OAAA;MACLC,SAAW,EAAA,KAAA;MACXC,YAAc,EAAA,KAAA;MACdC,oBAAsB,EAAA,KAAA;MACtBC,WAAa,EAAA,IAAA;MACbC,mBAAqB,EAAAtB,WAAA;MACrBuB,OAAS,EAAAxC,eAAA;MACTyC,MAAQ,EAAA,KAAA;MACR,GAAG9B;IAAA,CACL;EAAA,CACC,EAAA,CAACM,WAAa,EAAAN,gBAAgB,CAAC,CAAA;EAElC,MAAM+B,YAAe,GAAAxB,WAAA,CAClByB,QAAqB,IAAA;IACXvC,QAAA,CAAAwC,UAAA,CAAWC,KAAKF,QAAW,GAAAG,GAAA,CAAIH,QAAQ,CAAI,GAAAI,KAAA,EAAO,CAAC,CAAA;EAC9D,CAAA,EACA,CAAC3C,QAAQ,CAAA,CACX;EAEA,MAAMZ,iBAAiBE,iBAAkB,EAAA;EAEzC,OACG,eAAAsD,GAAA,CAAA7E,mBAAA,EAAA;IACE8E,2CACED,GAAA,CAAAE,QAAA,EAAA;MACCC,yBACGH,GAAA,CAAA3E,GAAA,EAAA;QAAI+E,OAAS,EAAA,CAAA;QACZH,QAAC,EAAA,eAAAD,GAAA,CAAAK,IAAA,EAAA;UAAKJ,QAAA,EAAA;QAAA,CAAiB;MAAA,CACzB,CAAA;MAGFA,QAAC,EAAA,eAAAD,GAAA,CAAAxD,cAAA,EAAA;QACE,GAAGiB,aAAA;QACJD,GAAA;QACAL,KAAA;QACAC,QAAU,EAAAsC,YAAA;QACVpC,MAAA;QACAC,OAAA;QACAG,OAAS,EAAAuB,UAAA;QACTqB,UAAY,EAAA;MAAA,CACd;IAAA,CACF;EAAA,CAEJ,CAAA;AAEJ;ACvGO,MAAMC,gBAAmB,GAAA,UAAA;AAsCzB,MAAMC,qBAAqBC,UAAW,CAAA;EAC3CC,IAAM,EAAA,QAAA;EACNC,IAAM,EAAAJ,gBAAA;EACNK,KAAO,EAAA,UAAA;EACPC,UAAA,EAAY;IAACC,KAAA,EAAO7D;EAAa;AACnC,CAAC,CAAA;ACLY,MAAA8D,cAAA,GAAiBC,YAAa,CAACC,MAAkC,IAAA;EACrE,OAAA;IACLN,IAAM,EAAA,iBAAA;IACNO,MAAQ,EAAA;MACNC,KAAO,EAAA,CACLF,MAAU,IAAAA,MAAA,CAAOH,KACb,GAAA;QAAC,GAAGN,kBAAA;QAAoBK,UAAY,EAAA;UAACC,KAAO,EAAAG,MAAA,CAAOH;QAAK;MACxD,CAAA,GAAAN,kBAAA;IAER;EAAA,CACF;AACF,CAAC,CAAA;"}

package/lib/_chunks/plugin-fb6e236d.js

@@ -1,123 +0,0 @@
-'use strict';
-
-var _templateObject;
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-var sanity = require('sanity');
-var jsxRuntime = require('react/jsx-runtime');
-var react = require('react');
-var ui = require('@sanity/ui');
-var styled = require('styled-components');
-function _interopDefaultCompat(e) {
-  return e && typeof e === 'object' && 'default' in e ? e : {
-    default: e
-  };
-}
-var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
-const MarkdownInputStyles = styled__default.default(ui.Box)(_ref => {
-  let {
-    theme
-  } = _ref;
-  var _a, _b, _c;
-  return styled.css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    & .CodeMirror.CodeMirror {\n      color: ", ";\n      border-color: ", ";\n      background-color: inherit;\n    }\n\n    & .cm-s-easymde .CodeMirror-cursor {\n      border-color: ", ";\n    }\n\n    & .editor-toolbar,\n    .editor-preview-side {\n      border-color: ", ";\n    }\n\n    & .CodeMirror-focused .CodeMirror-selected.CodeMirror-selected.CodeMirror-selected {\n      background-color: ", ";\n    }\n\n    & .CodeMirror-selected.CodeMirror-selected.CodeMirror-selected {\n      background-color: ", ";\n    }\n\n    & .editor-toolbar > * {\n      color: ", ";\n    }\n\n    & .editor-toolbar > .active,\n    .editor-toolbar > button:hover,\n    .editor-preview pre,\n    .cm-s-easymde .cm-comment {\n      background-color: ", ";\n    }\n\n    & .editor-preview {\n      background-color: ", ";\n\n      & h1,\n      h2,\n      h3,\n      h4,\n      h5,\n      h6 {\n        font-size: revert;\n      }\n\n      & ul,\n      li {\n        list-style: revert;\n        padding: revert;\n      }\n\n      & a {\n        text-decoration: revert;\n      }\n    }\n  "])), theme.sanity.color.card.enabled.fg, theme.sanity.color.card.enabled.border, theme.sanity.color.card.enabled.fg, theme.sanity.color.card.enabled.border, (_c = (_b = (_a = theme.sanity.color.selectable) == null ? void 0 : _a.primary) == null ? void 0 : _b.hovered) == null ? void 0 : _c.bg, theme.sanity.color.card.enabled.bg, theme.sanity.color.card.enabled.fg, theme.sanity.color.card.enabled.bg, theme.sanity.color.card.enabled.bg);
-});
-const SimpleMdeReact = react.lazy(() => import('react-simplemde-editor'));
-function useSimpleMdeReact() {
-  const [mounted, setMounted] = react.useState(false);
-  react.useEffect(() => {
-    requestAnimationFrame(() => setMounted(true));
-  }, []);
-  return mounted ? SimpleMdeReact : null;
-}
-const defaultMdeTools = ["heading", "bold", "italic", "|", "quote", "unordered-list", "ordered-list", "|", "link", "image", "code", "|", "preview", "side-by-side"];
-function MarkdownInput(props) {
-  var _a;
-  const {
-    value = "",
-    onChange,
-    elementProps: {
-      onBlur,
-      onFocus,
-      ref
-    },
-    reactMdeProps: {
-      options: mdeCustomOptions,
-      ...reactMdeProps
-    } = {},
-    schemaType
-  } = props;
-  const client = sanity.useClient({
-    apiVersion: "2022-01-01"
-  });
-  const {
-    imageUrl
-  } = (_a = schemaType.options) != null ? _a : {};
-  const imageUpload = react.useCallback((file, onSuccess, onError) => {
-    client.assets.upload("image", file).then(doc => onSuccess(imageUrl ? imageUrl(doc) : "".concat(doc.url, "?w=450"))).catch(e => {
-      console.error(e);
-      onError(e.message);
-    });
-  }, [client, imageUrl]);
-  const mdeOptions = react.useMemo(() => {
-    return {
-      autofocus: false,
-      spellChecker: false,
-      sideBySideFullscreen: false,
-      uploadImage: true,
-      imageUploadFunction: imageUpload,
-      toolbar: defaultMdeTools,
-      status: false,
-      ...mdeCustomOptions
-    };
-  }, [imageUpload, mdeCustomOptions]);
-  const handleChange = react.useCallback(newValue => {
-    onChange(sanity.PatchEvent.from(newValue ? sanity.set(newValue) : sanity.unset()));
-  }, [onChange]);
-  const SimpleMdeReact = useSimpleMdeReact();
-  return /* @__PURE__ */jsxRuntime.jsx(MarkdownInputStyles, {
-    children: SimpleMdeReact && /* @__PURE__ */jsxRuntime.jsx(react.Suspense, {
-      fallback: /* @__PURE__ */jsxRuntime.jsx(ui.Box, {
-        padding: 3,
-        children: /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
-          children: "Loading editor..."
-        })
-      }),
-      children: /* @__PURE__ */jsxRuntime.jsx(SimpleMdeReact, {
-        ...reactMdeProps,
-        ref,
-        value,
-        onChange: handleChange,
-        onBlur,
-        onFocus,
-        options: mdeOptions,
-        spellCheck: false
-      })
-    })
-  });
-}
-const markdownTypeName = "markdown";
-const markdownSchemaType = sanity.defineType({
-  type: "string",
-  name: markdownTypeName,
-  title: "Markdown",
-  components: {
-    input: MarkdownInput
-  }
-});
-const markdownSchema = sanity.definePlugin(config => {
-  return {
-    name: "markdown-editor",
-    schema: {
-      types: [config && config.input ? {
-        ...markdownSchemaType,
-        components: {
-          input: config.input
-        }
-      } : markdownSchemaType]
-    }
-  };
-});
-exports.MarkdownInput = MarkdownInput;
-exports.defaultMdeTools = defaultMdeTools;
-exports.markdownSchema = markdownSchema;
-exports.markdownSchemaType = markdownSchemaType;
-//# sourceMappingURL=plugin-fb6e236d.js.map