@electrolux-oss/sanity-plugin-media 5.0.0 → 5.0.1

package/dist/index.d.ts

@@ -43,7 +43,7 @@ declare const createAssetFormSchema: (
 ) => z.ZodObject<
   {
     altText: z.ZodOptional<z.ZodString>
-    altTexts: z.ZodRecord<z.ZodString, z.ZodNullable<z.ZodString>>
+    altTexts: z.ZodRecord<z.ZodString, z.ZodOptional<z.ZodNullable<z.ZodString>>>
     creditLine: z.ZodOptional<z.ZodString>
     description: z.ZodOptional<z.ZodString>
     opt: z.ZodObject<

package/dist/index.js

@@ -465,7 +465,7 @@ const EditIcon = /* @__PURE__ */ forwardRef(function(props, ref) {
 ], GRID_TEMPLATE_COLUMNS = {
   SMALL: "3rem 100px auto 1.5rem",
   LARGE: "3rem 100px auto 5.5rem 5.5rem 3.5rem 8.5rem 4.75rem 2rem"
-}, PANEL_HEIGHT = 32, TAG_DOCUMENT_NAME = "media.tag", TAGS_PANEL_WIDTH = 250, debugThrottle = (throttled) => function(source) {
+}, EDIT_MEDIA_SOURCE_NAME = "edit-media", PANEL_HEIGHT = 32, TAG_DOCUMENT_NAME = "media.tag", TAGS_PANEL_WIDTH = 250, debugThrottle = (throttled) => function(source) {
   return iif(
     () => !!throttled,
     source.pipe(
@@ -1769,23 +1769,15 @@ const customScrollbar = css`
   value: z.string().trim().min(1, { error: "Value cannot be empty" })
 }), tagFormSchema = z.object({
   name: z.string().min(1, { error: "Name cannot be empty" })
-}), createAssetFormSchema = (languages, validateAltTexts = !1) => {
+}), hasText = (text) => !!text?.trim(), createAssetFormSchema = (languages, validateAltTexts = !1) => {
   const defaultLanguage = languages.find((lang) => lang.default), createAltTextsSchema = () => {
-    const baseSchema = z.record(z.string(), z.string().nullable());
-    return validateAltTexts ? baseSchema.refine(
-      (altTexts) => {
-        if (defaultLanguage) {
-          const defaultText = altTexts[defaultLanguage.code];
-          return defaultText != null && defaultText.trim().length > 0;
-        }
-        return Object.values(altTexts).some(
-          (text) => text != null && text.trim().length > 0
-        );
-      },
-      {
-        error: 'The default language must have alt text. Please fill in the default language field and click "Save and close".'
-      }
-    ) : baseSchema;
+    const baseSchema = z.record(z.string(), z.string().nullish());
+    return validateAltTexts ? defaultLanguage ? baseSchema.refine((altTexts) => hasText(altTexts[defaultLanguage.code]), {
+      error: `Alt text is required for the default language (${defaultLanguage.title}).`,
+      path: [defaultLanguage.code]
+    }) : baseSchema.refine((altTexts) => Object.values(altTexts).some(hasText), {
+      error: "At least one language must have alt text."
+    }) : baseSchema;
   };
   return z.object({
     altText: z.string().trim().optional(),
@@ -2139,6 +2131,7 @@ const ButtonAssetCopy = ({ disabled, url }) => {
         ...rest,
         autoComplete: "off",
         autoFocus: !0,
+        customValidity: error,
         defaultValue: value,
         disabled,
         id: name,
@@ -2562,7 +2555,7 @@ const DialogAssetEdit = (props) => {
   useEffect(() => {
     trigger();
   }, [trigger]);
-  const altTextsError = errors?.altTexts?.root?.message || errors?.altTexts?.message, formUpdating = !assetItem || assetItem?.updating, handleClose = useCallback(() => {
+  const defaultLanguageCode = languages.find((language) => language.default)?.code, altTextsError = errors?.altTexts?.root?.message || errors?.altTexts?.message || defaultLanguageCode && errors?.altTexts?.[defaultLanguageCode]?.message, formUpdating = !assetItem || assetItem?.updating, handleClose = useCallback(() => {
     dispatch(dialogActions.remove({ id }));
   }, [dispatch, id]), handleDelete = useCallback(() => {
     assetItem?.asset && dispatch(
@@ -2630,8 +2623,8 @@ const DialogAssetEdit = (props) => {
       setValue("opt.media.tags", updatedTags, { shouldDirty: !0 });
     }
   }, [getValues, lastRemovedTagIds, setValue]), useEffect(() => {
-    assetUpdatedPrev.current !== assetItem?.asset._updatedAt && reset(generateDefaultValues(assetItem?.asset)), assetUpdatedPrev.current = assetItem?.asset._updatedAt;
-  }, [assetItem?.asset, generateDefaultValues, reset]);
+    assetUpdatedPrev.current !== assetItem?.asset._updatedAt && (reset(generateDefaultValues(assetItem?.asset)), trigger()), assetUpdatedPrev.current = assetItem?.asset._updatedAt;
+  }, [assetItem?.asset, generateDefaultValues, reset, trigger]);
   const Footer = () => /* @__PURE__ */ jsx(Box, { padding: 3, children: /* @__PURE__ */ jsxs(Flex, { justify: "space-between", children: [
     /* @__PURE__ */ jsx(
       Button,
@@ -2748,7 +2741,7 @@ const DialogAssetEdit = (props) => {
                     id: "alt-texts",
                     children: [
                       altTextsError && /* @__PURE__ */ jsx(Stack, { marginBottom: 3, children: /* @__PURE__ */ jsx(Card, { padding: [3, 3, 4], radius: 2, shadow: 1, tone: "critical", children: /* @__PURE__ */ jsx(Text, { size: 1, children: altTextsError }) }) }),
-                      /* @__PURE__ */ jsx(Stack, { gap: 2, style: { height: "65dvh", overflowY: "auto" }, children: languages.map((language) => {
+                      /* @__PURE__ */ jsx(Stack, { gap: 2, style: { height: "55dvh", overflowY: "auto" }, children: languages.map((language) => {
                         const label = language.default ? `${language.title} (Default)` : language.title;
                         return /* @__PURE__ */ jsx(
                           FormFieldInputText,
@@ -6058,6 +6051,17 @@ const UploadDropzone = (props) => {
       children: /* @__PURE__ */ jsx(Browser, { document: currentDocument, ...props })
     }
   ) }) });
+}, isAssetSchemaType = (schemaType) => schemaType ? schemaType.name === "image" || schemaType.name === "file" ? !0 : isAssetSchemaType(schemaType.type) : !1, withoutEditMedia = (sources) => sources ? typeof sources == "function" ? (source) => source.name !== EDIT_MEDIA_SOURCE_NAME && sources(source) : sources.filter(
+  (entry) => (typeof entry == "string" ? entry : entry.name) !== EDIT_MEDIA_SOURCE_NAME
+) : (source) => source.name !== EDIT_MEDIA_SOURCE_NAME, AssetSourcesInput = (props) => {
+  const { renderDefault, schemaType, value } = props, hideEditMedia = isAssetSchemaType(schemaType) && !value?.asset?._ref, schemaTypeWithoutEditMedia = useMemo(() => {
+    const options = schemaType.options;
+    return {
+      ...schemaType,
+      options: { ...options, sources: withoutEditMedia(options?.sources) }
+    };
+  }, [schemaType]);
+  return renderDefault(hideEditMedia ? { ...props, schemaType: schemaTypeWithoutEditMedia } : props);
 }, Tool = () => /* @__PURE__ */ jsx(Flex, { direction: "column", height: "fill", flex: 1, children: /* @__PURE__ */ jsx(Browser, {}) }), listeners = /* @__PURE__ */ new Set(), subscribeToUploadRejections = (listener) => (listeners.add(listener), () => {
   listeners.delete(listener);
 }), withMaximumUploadSize = (source, maximumUploadSize) => {
@@ -6150,7 +6154,7 @@ const getUploadedAssetId = (patches) => (Array.isArray(patches) ? patches : [pat
   component: FormBuilderTool
 }, editMediaAssetSource = {
   icon: EditIcon,
-  name: "edit-media",
+  name: EDIT_MEDIA_SOURCE_NAME,
   title: "Edit Media",
   component: EditAssetTool
 }, tool = {
@@ -6183,6 +6187,9 @@ const getUploadedAssetId = (patches) => (Array.isArray(patches) ? patches : [pat
       }
     },
     form: {
+      components: {
+        input: AssetSourcesInput
+      },
       file: {
         assetSources: resolveAssetSources
       },