sanity-plugin-internationalized-array 1.0.0 → 1.1.1

package/README.md

@@ -2,9 +2,7 @@
 
 > NOTE This is for the Studio v3 version of the plugin
 
-A helper function that renders a custom input component for writing localised fields of content into an array.
-
-**This an early proof-of-concept and should not yet be used without thorough testing.**
+A helper function that renders a custom input component for writing localized fields of content into an array.
 
 ![2022-07-27 12 26 25](https://user-images.githubusercontent.com/9684022/181235876-45a6a4c5-e6d3-48a2-a6a0-523ee7196184.gif)
 
@@ -20,35 +18,81 @@ or
 yarn add sanity-plugin-internationalized-array-v3@studio-v3
 ```
 
-Add an array to your schema by importing the helper function.
+## Usage (simple)
 
-```js
+Add it as a plugin in sanity.config.ts (or .js):
+
+```ts
+import {createConfig} from 'sanity'
 import {internationalizedArray} from 'sanity-plugin-internationalized-array'
 
-// ./src/schema/person.js
-export default {
-  name: 'person',
-  title: 'Person',
-  type: 'document',
-  fields: [
-    // ...all your other fields
+ export const createConfig({
+  // ...
+  plugins: [
     internationalizedArray({
-      // Required, the `name` of the outer array
-      name: 'greeting',
-      // Required, the `type` of the inner field
-      // One of: string | text | number | boolean
-      type: 'string',
-      // Required, must be an array of objects
       languages: [
         {id: 'en', title: 'English'},
-        {id: 'fr', title: 'French'},
+        {id: 'fr', title: 'French'}
       ],
-    }),
-  ],
-}
+      fieldTypes: ['string'],
+    })
+  ]
+})
 ```
 
-This will create an Array field where `string` fields can be added with the name `title`. The custom input contains buttons which will add new array items with the language as the `_key` value. Data returned from this array will look like this:
+This will register two new fields to the schema, based on the settings passed into `fieldTypes`:
+
+- `internationalizedArrayString` an array field of:
+- `internationalizedArrayStringValue` an object field, with a single `string` field inside called `value`
+
+You can pass in more registered schema type names to generate more internationalized arrays. Use them in your schema like this:
+
+```ts
+defineField({
+  name: 'greeting',
+  type: 'internationalizedArrayString',
+}),
+```
+
+## Usage (advanced)
+
+For more control over the `value` field, you can pass a schema definition into the `fieldTypes` array.
+
+```ts
+import {createConfig} from 'sanity'
+import {internationalizedArray} from 'sanity-plugin-internationalized-array'
+
+ export const createConfig({
+  // ...
+  plugins: [
+    internationalizedArray({
+      languages: [
+        {id: 'en', title: 'English'},
+        {id: 'fr', title: 'French'}
+      ],
+      fieldTypes: [
+        defineField({
+          name: 'featuredProduct',
+          type: 'reference',
+          to: [{type: 'product'}]
+          hidden: (({document}) => !document?.title)
+        })
+      ],
+    })
+  ]
+})
+```
+
+This would also create two new fields in your schema.
+
+- `internationalizedArrayFeaturedProduct` an array field of:
+- `internationalizedArrayFeaturedProductValue` an object field, with a single `string` field inside called `value`
+
+Note that the `name` key in the field gets rewritten to `value` and is instead used to name the object field.
+
+## Shape of stored data
+
+The custom input contains buttons which will add new array items with the language as the `_key` value. Data returned from this array will look like this:
 
 ```json
 "greeting": [
@@ -57,6 +101,8 @@ This will create an Array field where `string` fields can be added with the name
 ]
 ```
 
+## Querying data
+
 Using GROQ filters you can query for a specific language key like so:
 
 ```js
@@ -73,7 +119,7 @@ Follow the instructions inside the script and set the `_type` and field name you
 
 Please take a backup first!
 
-### Why store localised field data like this?
+### Why store localized field data like this?
 
 The most popular way to store field-level translated content is in an object using the method prescribed in [@sanity/language-filter](https://www.npmjs.com/package/@sanity/language-filter). This works well and creates tidy object structures, but also create a unique field path for every unique field name, multiplied by the number of languages in your dataset.
 

package/lib/cjs/index.js

@@ -1,36 +1,41 @@
-var $dyHF6$sanity = require("sanity");
-var $dyHF6$reactjsxruntime = require("react/jsx-runtime");
-var $dyHF6$react = require("react");
-var $dyHF6$sanityform = require("sanity/form");
-var $dyHF6$sanityui = require("@sanity/ui");
-var $dyHF6$sanityicons = require("@sanity/icons");
-var $dyHF6$styledcomponents = require("styled-components");
-
-function $parcel$exportWildcard(dest, source) {
-  Object.keys(source).forEach(function(key) {
-    if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
-      return;
-    }
-
-    Object.defineProperty(dest, key, {
-      enumerable: true,
-      get: function get() {
-        return source[key];
-      }
-    });
-  });
+var $k7rGe$sanity = require("sanity");
+var $k7rGe$reactjsxruntime = require("react/jsx-runtime");
+var $k7rGe$react = require("react");
+var $k7rGe$sanityform = require("sanity/form");
+var $k7rGe$sanityui = require("@sanity/ui");
+var $k7rGe$sanityicons = require("@sanity/icons");
+var $k7rGe$styledcomponents = require("styled-components");
 
-  return dest;
-}
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
 function $parcel$interopDefault(a) {
   return a && a.__esModule ? a.default : a;
 }
-var $7594066088192472$exports = {};
 
-$parcel$export($7594066088192472$exports, "internationalizedArray", () => $7594066088192472$export$bec7eb13daf35f0e);
+$parcel$export(module.exports, "internationalizedArray", () => $45e3093e7de8dca2$export$bec7eb13daf35f0e);
+
+
+function $a0eca5cb1c058e2c$export$8a7688a96d852767(string) {
+    return string.replace(/-([a-z])/g, (g)=>g[1].toUpperCase());
+}
+function $a0eca5cb1c058e2c$export$348afa8c9ff47183(string) {
+    return string.split(` `).map((word)=>word.charAt(0).toUpperCase() + word.slice(1)).join(` `);
+}
+function $a0eca5cb1c058e2c$export$26c6f48841fe1a8a(string) {
+    return $a0eca5cb1c058e2c$export$348afa8c9ff47183($a0eca5cb1c058e2c$export$8a7688a96d852767(string));
+}
+function $a0eca5cb1c058e2c$export$ab1ce2a474f41f52(name, addValue = false) {
+    return addValue ? [
+        `internationalizedArray`,
+        $a0eca5cb1c058e2c$export$26c6f48841fe1a8a(name),
+        `Value`
+    ].join(``) : [
+        `internationalizedArray`,
+        $a0eca5cb1c058e2c$export$26c6f48841fe1a8a(name)
+    ].join(``);
+}
+
 
 
 
@@ -44,12 +49,12 @@ $parcel$export($7594066088192472$exports, "internationalizedArray", () => $75940
 // https://github.com/styled-components/styled-components/issues/2449
 // Table
 const $acfbfc6ee2363807$var$TableWrapper = (props = {})=>{
-    return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Box), {
+    return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Box), {
         as: "table",
         ...props
     });
 };
-const $acfbfc6ee2363807$var$StyledTable = (0, ($parcel$interopDefault($dyHF6$styledcomponents)))($acfbfc6ee2363807$var$TableWrapper)(()=>(0, $dyHF6$styledcomponents.css)`
+const $acfbfc6ee2363807$var$StyledTable = (0, ($parcel$interopDefault($k7rGe$styledcomponents)))($acfbfc6ee2363807$var$TableWrapper)(()=>(0, $k7rGe$styledcomponents.css)`
       display: table;
       width: 100%;
 
@@ -59,19 +64,19 @@ const $acfbfc6ee2363807$var$StyledTable = (0, ($parcel$interopDefault($dyHF6$sty
     `);
 function $acfbfc6ee2363807$export$54ec01a60f47d33d(props) {
     const { children: children , ...rest } = props;
-    return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledTable, {
+    return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledTable, {
         ...rest,
         children: children
     });
 }
 // Row
 const $acfbfc6ee2363807$var$RowWrapper = (props = {})=>{
-    return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Card), {
+    return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Card), {
         as: "tr",
         ...props
     });
 };
-const $acfbfc6ee2363807$var$StyledRow = (0, ($parcel$interopDefault($dyHF6$styledcomponents)))($acfbfc6ee2363807$var$RowWrapper)(()=>(0, $dyHF6$styledcomponents.css)`
+const $acfbfc6ee2363807$var$StyledRow = (0, ($parcel$interopDefault($k7rGe$styledcomponents)))($acfbfc6ee2363807$var$RowWrapper)(()=>(0, $k7rGe$styledcomponents.css)`
       display: table-row;
 
       &:not([hidden]) {
@@ -80,19 +85,19 @@ const $acfbfc6ee2363807$var$StyledRow = (0, ($parcel$interopDefault($dyHF6$style
     `);
 function $acfbfc6ee2363807$export$b05581f4e764e162(props) {
     const { children: children , ...rest } = props;
-    return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledRow, {
+    return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledRow, {
         ...rest,
         children: children
     });
 }
 // Cell
 const $acfbfc6ee2363807$var$CellWrapper = (props = {})=>{
-    return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Box), {
+    return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Box), {
         as: "td",
         ...props
     });
 };
-const $acfbfc6ee2363807$var$StyledCell = (0, ($parcel$interopDefault($dyHF6$styledcomponents)))($acfbfc6ee2363807$var$CellWrapper)(()=>(0, $dyHF6$styledcomponents.css)`
+const $acfbfc6ee2363807$var$StyledCell = (0, ($parcel$interopDefault($k7rGe$styledcomponents)))($acfbfc6ee2363807$var$CellWrapper)(()=>(0, $k7rGe$styledcomponents.css)`
       display: table-cell;
 
       &:not([hidden]) {
@@ -101,7 +106,7 @@ const $acfbfc6ee2363807$var$StyledCell = (0, ($parcel$interopDefault($dyHF6$styl
     `);
 function $acfbfc6ee2363807$export$1e4baea7053fc0e3(props) {
     const { children: children , ...rest } = props;
-    return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledCell, {
+    return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledCell, {
         ...rest,
         children: children
     });
@@ -125,37 +130,37 @@ const $aaf4d804384afd00$var$schemaExample = {
     ]
 };
 function $aaf4d804384afd00$export$2e2bcd8739ae039() {
-    return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Card), {
+    return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Card), {
         tone: "caution",
         border: true,
         radius: 2,
         padding: 3,
-        children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $dyHF6$sanityui.Stack), {
+        children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$sanityui.Stack), {
             space: 4,
             children: [
-                /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $dyHF6$sanityui.Text), {
+                /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$sanityui.Text), {
                     children: [
                         "An array of language objects must be passed into the ",
-                        /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)("code", {
+                        /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)("code", {
                             children: "internationalizedArray"
                         }),
                         " ",
                         "helper function, each with an ",
-                        /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)("code", {
+                        /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)("code", {
                             children: "id"
                         }),
                         " and ",
-                        /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)("code", {
+                        /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)("code", {
                             children: "title"
                         }),
                         " field. Example:"
                     ]
                 }),
-                /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Card), {
+                /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Card), {
                     padding: 2,
                     border: true,
                     radius: 2,
-                    children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Code), {
+                    children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Code), {
                         size: 1,
                         language: "javascript",
                         children: JSON.stringify($aaf4d804384afd00$var$schemaExample, null, 2)
@@ -180,10 +185,11 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
     const { members: members , value: value , schemaType: schemaType , onChange: onChange  } = props;
     const readOnly = typeof schemaType.readOnly === "boolean" ? schemaType.readOnly : false;
     const { options: options  } = schemaType;
-    const languages = (0, $dyHF6$react.useMemo)(()=>options?.languages ?? [], [
+    const toast = (0, $k7rGe$sanityui.useToast)();
+    const languages = (0, $k7rGe$react.useMemo)(()=>options?.languages ?? [], [
         options
     ]);
-    const handleAddLanguage = (0, $dyHF6$react.useCallback)((languageId)=>{
+    const handleAddLanguage = (0, $k7rGe$react.useCallback)((languageId)=>{
         // Create new items
         const newItems = languageId ? [
             {
@@ -200,22 +206,23 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
             // What languages are there beyond that index?
             const remainingLanguages = languages.slice(languageIndex + 1);
             // So what is the index in the current value array of the next language in the language array?
-            const nextLanguageIndex = languagesInUse.findIndex((l)=>remainingLanguages.find((r)=>r.id === l._key));
+            const nextLanguageIndex = languagesInUse.findIndex((l)=>// eslint-disable-next-line max-nested-callbacks
+                remainingLanguages.find((r)=>r.id === l._key));
             // Keep local state up to date incase multiple insertions are being made
             if (nextLanguageIndex < 0) languagesInUse.push(item);
             else languagesInUse.splice(nextLanguageIndex, 0, item);
-            return nextLanguageIndex < 0 ? (0, $dyHF6$sanityform.insert)([
+            return nextLanguageIndex < 0 ? (0, $k7rGe$sanityform.insert)([
                 item
             ], "after", [
                 nextLanguageIndex
-            ]) : (0, $dyHF6$sanityform.insert)([
+            ]) : (0, $k7rGe$sanityform.insert)([
                 item
             ], "before", [
                 nextLanguageIndex
             ]);
         });
         onChange([
-            (0, $dyHF6$sanityform.setIfMissing)([]),
+            (0, $k7rGe$sanityform.setIfMissing)([]),
             ...insertions
         ]);
     }, [
@@ -223,8 +230,8 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
         onChange,
         value
     ]);
-    const handleUnsetByKey = (0, $dyHF6$react.useCallback)((_key)=>{
-        onChange((0, $dyHF6$sanityform.unset)([
+    const handleUnsetByKey = (0, $k7rGe$react.useCallback)((_key)=>{
+        onChange((0, $k7rGe$sanityform.unset)([
             {
                 _key: _key
             }
@@ -233,29 +240,35 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
         onChange
     ]);
     // TODO: This is lazy, reordering and re-setting the whole array – it could be surgical
-    const handleRestoreOrder = (0, $dyHF6$react.useCallback)(()=>{
+    const handleRestoreOrder = (0, $k7rGe$react.useCallback)(()=>{
         if (!value?.length) return;
+        console.log(value);
         // Create a new value array in the correct order
         // This would also strip out values that don't have a language as the key
         const updatedValue = value.reduce((acc, v)=>{
             const newIndex = languages.findIndex((l)=>l.id === v?._key);
-            if (newIndex) acc[newIndex] = v;
+            if (newIndex > -1) acc[newIndex] = v;
             return acc;
         }, []).filter(Boolean);
-        onChange((0, $dyHF6$sanityform.set)(updatedValue));
+        if (value.length !== updatedValue.length) toast.push({
+            title: "There was an error reordering languages",
+            status: "warning"
+        });
+        onChange((0, $k7rGe$sanityform.set)(updatedValue));
     }, [
+        toast,
         languages,
         onChange,
         value
     ]);
-    const allKeysAreLanguages = (0, $dyHF6$react.useMemo)(()=>{
+    const allKeysAreLanguages = (0, $k7rGe$react.useMemo)(()=>{
         return value?.every((v)=>languages.find((l)=>l?.id === v?._key));
     }, [
         value,
         languages
     ]);
     // Check languages are in the correct order
-    const languagesOutOfOrder = (0, $dyHF6$react.useMemo)(()=>{
+    const languagesOutOfOrder = (0, $k7rGe$react.useMemo)(()=>{
         if (!value?.length) return [];
         const languagesInUse = languages.filter((l)=>value.find((v)=>v._key === l.id));
         return value.map((v, vIndex)=>vIndex === languagesInUse.findIndex((l)=>l.id === v._key) ? null : v).filter(Boolean);
@@ -263,60 +276,60 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
         value,
         languages
     ]);
-    const languagesAreValid = (0, $dyHF6$react.useMemo)(()=>languages?.length && languages.every((item)=>item.id && item.title), [
+    const languagesAreValid = (0, $k7rGe$react.useMemo)(()=>!languages?.length || languages?.length && languages.every((item)=>item.id && item.title), [
         languages
     ]);
-    if (!languagesAreValid) return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $aaf4d804384afd00$export$2e2bcd8739ae039), {});
-    return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $dyHF6$sanityui.Stack), {
+    if (!languagesAreValid) return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $aaf4d804384afd00$export$2e2bcd8739ae039), {});
+    return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$sanityui.Stack), {
         space: 2,
         children: [
-            members?.length > 0 ? /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$54ec01a60f47d33d), {
-                children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)("tbody", {
-                    children: members.map((member)=>/*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $acfbfc6ee2363807$export$b05581f4e764e162), {
+            members?.length > 0 ? /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$54ec01a60f47d33d), {
+                children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)("tbody", {
+                    children: members.map((member)=>/*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $acfbfc6ee2363807$export$b05581f4e764e162), {
                             tone: member?.item?.validation?.length > 0 ? (0, $6a9b28384eb7074d$export$16423358d6ebe294)(member.item.validation) : undefined,
                             children: [
-                                /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
+                                /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
                                     style: {
                                         verticalAlign: "bottom"
                                     },
-                                    children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Box), {
+                                    children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Box), {
                                         paddingY: 3,
                                         paddingRight: 2,
-                                        children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Label), {
+                                        children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Label), {
                                             muted: true,
                                             size: 1,
                                             children: member.key
                                         })
                                     })
                                 }),
-                                /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
+                                /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
                                     paddingRight: 2,
                                     style: {
                                         width: `100%`
                                     },
-                                    children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityform.MemberItem), {
+                                    children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityform.MemberItem), {
                                         ...props,
                                         member: member
                                     })
                                 }),
-                                /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
+                                /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
                                     style: {
                                         verticalAlign: "bottom"
                                     },
-                                    children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $dyHF6$sanityui.Flex), {
+                                    children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$sanityui.Flex), {
                                         align: "center",
                                         justify: "flex-end",
                                         gap: 3,
                                         children: [
-                                            member.item.validation.length > 0 ? /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Box), {
+                                            member?.item?.validation?.length > 0 ? /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Box), {
                                                 paddingLeft: 2,
-                                                children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityform.FormFieldValidationStatus), {
+                                                children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityform.FormFieldValidationStatus), {
                                                     validation: member.item.validation
                                                 })
                                             }) : null,
-                                            /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Button), {
+                                            /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Button), {
                                                 mode: "ghost",
-                                                icon: (0, $dyHF6$sanityicons.RemoveIcon),
+                                                icon: (0, $k7rGe$sanityicons.RemoveIcon),
                                                 tone: "critical",
                                                 disabled: typeof readOnly === "boolean" ? readOnly : false,
                                                 onClick: ()=>handleUnsetByKey(member.key)
@@ -328,33 +341,33 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
                         }, member.key))
                 })
             }) : null,
-            languagesOutOfOrder.length > 0 && allKeysAreLanguages ? /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Button), {
+            languagesOutOfOrder.length > 0 && allKeysAreLanguages ? /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Button), {
                 tone: "caution",
-                icon: (0, $dyHF6$sanityicons.RestoreIcon),
+                icon: (0, $k7rGe$sanityicons.RestoreIcon),
                 onClick: ()=>handleRestoreOrder(),
                 text: "Restore order of languages"
             }) : null,
-            value && value.length < languages.length ? /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $dyHF6$sanityui.Stack), {
+            languages?.length > 0 ? /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$sanityui.Stack), {
                 space: 2,
                 children: [
-                    /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Grid), {
+                    /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Grid), {
                         columns: Math.min(languages.length, 5),
                         gap: 2,
-                        children: languages.map((language)=>/*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Button), {
+                        children: languages.map((language)=>/*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Button), {
                                 tone: "primary",
                                 mode: "ghost",
                                 fontSize: 1,
                                 disabled: readOnly || Boolean(value?.find((item)=>item._key === language.id)),
                                 text: language.id.toUpperCase(),
-                                icon: (0, $dyHF6$sanityicons.AddIcon),
+                                icon: (0, $k7rGe$sanityicons.AddIcon),
                                 onClick: ()=>handleAddLanguage(language.id)
                             }, language.id))
                     }),
-                    /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Button), {
+                    /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Button), {
                         tone: "primary",
                         mode: "ghost",
                         disabled: readOnly || value && value?.length >= languages?.length,
-                        icon: (0, $dyHF6$sanityicons.AddIcon),
+                        icon: (0, $k7rGe$sanityicons.AddIcon),
                         text: value?.length ? `Add missing languages` : `Add all languages`,
                         onClick: ()=>handleAddLanguage()
                     })
@@ -365,22 +378,14 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
 }
 
 
-const $7594066088192472$var$CONFIG_DEFAULT = {
-    name: `title`,
-    type: `string`,
-    languages: []
-};
-function $7594066088192472$export$bec7eb13daf35f0e(config = $7594066088192472$var$CONFIG_DEFAULT) {
-    const { name: name , type: type , languages: languages  } = config;
-    const configValidation = Array.isArray(config?.validation) ? config.validation : [
-        config?.validation
-    ];
-    return (0, $dyHF6$sanity.defineField)({
-        name: name,
-        title: config?.title ?? undefined,
-        group: config?.group ?? undefined,
-        hidden: config?.hidden ?? undefined,
-        readOnly: config?.readOnly ?? undefined,
+var $0437df2e2e149362$export$2e2bcd8739ae039 = (config)=>{
+    const { languages: languages , type: type  } = config;
+    const typeName = typeof type === `string` ? type : type.name;
+    const arrayName = (0, $a0eca5cb1c058e2c$export$ab1ce2a474f41f52)(typeName);
+    const objectName = (0, $a0eca5cb1c058e2c$export$ab1ce2a474f41f52)(typeName, true);
+    return (0, $k7rGe$sanity.defineField)({
+        name: arrayName,
+        title: "Internationalized array",
         type: "array",
         components: {
             input: (0, $7e790a73eaf2b445$export$2e2bcd8739ae039)
@@ -389,33 +394,12 @@ function $7594066088192472$export$bec7eb13daf35f0e(config = $7594066088192472$va
             languages: languages
         },
         of: [
-            {
-                type: "object",
-                fields: [
-                    {
-                        name: "value",
-                        type: type
-                    }, 
-                ],
-                preview: {
-                    select: {
-                        title: "value",
-                        key: "_key"
-                    },
-                    prepare (select) {
-                        const { title: title , key: key  } = select;
-                        return {
-                            title: title,
-                            subtitle: key.toUpperCase()
-                        };
-                    }
-                }
-            }, 
+            (0, $k7rGe$sanity.defineField)({
+                name: objectName,
+                type: objectName
+            })
         ],
-        // @ts-ignore
-        validation: (rule)=>{
-            const rules = [];
-            rules.push(rule.custom((value, context)=>{
+        validation: (rule)=>rule.max(languages?.length).custom((value, context)=>{
                 const { languages: contextLanguages  } = context?.type?.options ?? {};
                 const nonLanguageKeys = value?.length ? value.filter((item)=>!contextLanguages.find((language)=>item._key === language.id)) : [];
                 if (nonLanguageKeys.length) return {
@@ -451,18 +435,60 @@ function $7594066088192472$export$bec7eb13daf35f0e(config = $7594066088192472$va
                         ])
                 };
                 return true;
-            }));
-            if (languages?.length) rules.push(rule.max(languages.length));
-            return [
-                ...rules,
-                ...configValidation
-            ].filter(Boolean);
-        }
+            })
     });
-}
+};
+
+
+
+
+var $f727fb16d5d00f8f$export$2e2bcd8739ae039 = (config)=>{
+    const { type: type  } = config;
+    const typeName = typeof type === `string` ? type : type.name;
+    const objectName = (0, $a0eca5cb1c058e2c$export$ab1ce2a474f41f52)(typeName, true);
+    return (0, $k7rGe$sanity.defineField)({
+        name: objectName,
+        title: `Internationalized array ${type}`,
+        type: "object",
+        fields: [
+            typeof type === `string` ? (0, $k7rGe$sanity.defineField)({
+                name: "value",
+                type: type
+            }) : {
+                ...type,
+                name: "value"
+            }, 
+        ]
+    });
+};
+
+
+const $45e3093e7de8dca2$var$CONFIG_DEFAULT = {
+    languages: [],
+    fieldTypes: []
+};
+const $45e3093e7de8dca2$export$bec7eb13daf35f0e = (0, $k7rGe$sanity.createPlugin)((config = $45e3093e7de8dca2$var$CONFIG_DEFAULT)=>{
+    const { languages: languages , fieldTypes: fieldTypes  } = {
+        ...$45e3093e7de8dca2$var$CONFIG_DEFAULT,
+        ...config
+    };
+    return {
+        name: "sanity-plugin-internationalized-array",
+        schema: {
+            types: [
+                ...fieldTypes.map((type)=>(0, $0437df2e2e149362$export$2e2bcd8739ae039)({
+                        type: type,
+                        languages: languages
+                    })),
+                ...fieldTypes.map((type)=>(0, $f727fb16d5d00f8f$export$2e2bcd8739ae039)({
+                        type: type
+                    })), 
+            ]
+        }
+    };
+});
 
 
-$parcel$exportWildcard(module.exports, $7594066088192472$exports);
 
 
 //# sourceMappingURL=index.js.map