sanity-plugin-internationalized-array 1.0.0 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -2,9 +2,7 @@
2
2
 
3
3
  > NOTE This is for the Studio v3 version of the plugin
4
4
 
5
- A helper function that renders a custom input component for writing localised fields of content into an array.
6
-
7
- **This an early proof-of-concept and should not yet be used without thorough testing.**
5
+ A helper function that renders a custom input component for writing localized fields of content into an array.
8
6
 
9
7
  ![2022-07-27 12 26 25](https://user-images.githubusercontent.com/9684022/181235876-45a6a4c5-e6d3-48a2-a6a0-523ee7196184.gif)
10
8
 
@@ -20,35 +18,81 @@ or
20
18
  yarn add sanity-plugin-internationalized-array-v3@studio-v3
21
19
  ```
22
20
 
23
- Add an array to your schema by importing the helper function.
21
+ ## Usage (simple)
24
22
 
25
- ```js
23
+ Add it as a plugin in sanity.config.ts (or .js):
24
+
25
+ ```ts
26
+ import {createConfig} from 'sanity'
26
27
  import {internationalizedArray} from 'sanity-plugin-internationalized-array'
27
28
 
28
- // ./src/schema/person.js
29
- export default {
30
- name: 'person',
31
- title: 'Person',
32
- type: 'document',
33
- fields: [
34
- // ...all your other fields
29
+ export const createConfig({
30
+ // ...
31
+ plugins: [
35
32
  internationalizedArray({
36
- // Required, the `name` of the outer array
37
- name: 'greeting',
38
- // Required, the `type` of the inner field
39
- // One of: string | text | number | boolean
40
- type: 'string',
41
- // Required, must be an array of objects
42
33
  languages: [
43
34
  {id: 'en', title: 'English'},
44
- {id: 'fr', title: 'French'},
35
+ {id: 'fr', title: 'French'}
45
36
  ],
46
- }),
47
- ],
48
- }
37
+ fieldTypes: ['string'],
38
+ })
39
+ ]
40
+ })
49
41
  ```
50
42
 
51
- 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:
43
+ This will register two new fields to the schema, based on the settings passed into `fieldTypes`:
44
+
45
+ - `internationalizedArrayString` an array field of:
46
+ - `internationalizedArrayStringValue` an object field, with a single `string` field inside called `value`
47
+
48
+ You can pass in more registered schema type names to generate more internationalized arrays. Use them in your schema like this:
49
+
50
+ ```ts
51
+ defineField({
52
+ name: 'greeting',
53
+ type: 'internationalizedArrayString',
54
+ }),
55
+ ```
56
+
57
+ ## Usage (advanced)
58
+
59
+ For more control over the `value` field, you can pass a schema definition into the `fieldTypes` array.
60
+
61
+ ```ts
62
+ import {createConfig} from 'sanity'
63
+ import {internationalizedArray} from 'sanity-plugin-internationalized-array'
64
+
65
+ export const createConfig({
66
+ // ...
67
+ plugins: [
68
+ internationalizedArray({
69
+ languages: [
70
+ {id: 'en', title: 'English'},
71
+ {id: 'fr', title: 'French'}
72
+ ],
73
+ fieldTypes: [
74
+ defineField({
75
+ name: 'featuredProduct',
76
+ type: 'reference',
77
+ to: [{type: 'product'}]
78
+ hidden: (({document}) => !document?.title)
79
+ })
80
+ ],
81
+ })
82
+ ]
83
+ })
84
+ ```
85
+
86
+ This would also create two new fields in your schema.
87
+
88
+ - `internationalizedArrayFeaturedProduct` an array field of:
89
+ - `internationalizedArrayFeaturedProductValue` an object field, with a single `string` field inside called `value`
90
+
91
+ Note that the `name` key in the field gets rewritten to `value` and is instead used to name the object field.
92
+
93
+ ## Shape of stored data
94
+
95
+ 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:
52
96
 
53
97
  ```json
54
98
  "greeting": [
@@ -57,6 +101,8 @@ This will create an Array field where `string` fields can be added with the name
57
101
  ]
58
102
  ```
59
103
 
104
+ ## Querying data
105
+
60
106
  Using GROQ filters you can query for a specific language key like so:
61
107
 
62
108
  ```js
@@ -73,7 +119,7 @@ Follow the instructions inside the script and set the `_type` and field name you
73
119
 
74
120
  Please take a backup first!
75
121
 
76
- ### Why store localised field data like this?
122
+ ### Why store localized field data like this?
77
123
 
78
124
  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.
79
125
 
package/lib/cjs/index.js CHANGED
@@ -1,36 +1,41 @@
1
- var $dyHF6$sanity = require("sanity");
2
- var $dyHF6$reactjsxruntime = require("react/jsx-runtime");
3
- var $dyHF6$react = require("react");
4
- var $dyHF6$sanityform = require("sanity/form");
5
- var $dyHF6$sanityui = require("@sanity/ui");
6
- var $dyHF6$sanityicons = require("@sanity/icons");
7
- var $dyHF6$styledcomponents = require("styled-components");
8
-
9
- function $parcel$exportWildcard(dest, source) {
10
- Object.keys(source).forEach(function(key) {
11
- if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
12
- return;
13
- }
14
-
15
- Object.defineProperty(dest, key, {
16
- enumerable: true,
17
- get: function get() {
18
- return source[key];
19
- }
20
- });
21
- });
1
+ var $k7rGe$sanity = require("sanity");
2
+ var $k7rGe$reactjsxruntime = require("react/jsx-runtime");
3
+ var $k7rGe$react = require("react");
4
+ var $k7rGe$sanityform = require("sanity/form");
5
+ var $k7rGe$sanityui = require("@sanity/ui");
6
+ var $k7rGe$sanityicons = require("@sanity/icons");
7
+ var $k7rGe$styledcomponents = require("styled-components");
22
8
 
23
- return dest;
24
- }
25
9
  function $parcel$export(e, n, v, s) {
26
10
  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
27
11
  }
28
12
  function $parcel$interopDefault(a) {
29
13
  return a && a.__esModule ? a.default : a;
30
14
  }
31
- var $7594066088192472$exports = {};
32
15
 
33
- $parcel$export($7594066088192472$exports, "internationalizedArray", () => $7594066088192472$export$bec7eb13daf35f0e);
16
+ $parcel$export(module.exports, "internationalizedArray", () => $45e3093e7de8dca2$export$bec7eb13daf35f0e);
17
+
18
+
19
+ function $a0eca5cb1c058e2c$export$8a7688a96d852767(string) {
20
+ return string.replace(/-([a-z])/g, (g)=>g[1].toUpperCase());
21
+ }
22
+ function $a0eca5cb1c058e2c$export$348afa8c9ff47183(string) {
23
+ return string.split(` `).map((word)=>word.charAt(0).toUpperCase() + word.slice(1)).join(` `);
24
+ }
25
+ function $a0eca5cb1c058e2c$export$26c6f48841fe1a8a(string) {
26
+ return $a0eca5cb1c058e2c$export$348afa8c9ff47183($a0eca5cb1c058e2c$export$8a7688a96d852767(string));
27
+ }
28
+ function $a0eca5cb1c058e2c$export$ab1ce2a474f41f52(name, addValue = false) {
29
+ return addValue ? [
30
+ `internationalizedArray`,
31
+ $a0eca5cb1c058e2c$export$26c6f48841fe1a8a(name),
32
+ `Value`
33
+ ].join(``) : [
34
+ `internationalizedArray`,
35
+ $a0eca5cb1c058e2c$export$26c6f48841fe1a8a(name)
36
+ ].join(``);
37
+ }
38
+
34
39
 
35
40
 
36
41
 
@@ -44,12 +49,12 @@ $parcel$export($7594066088192472$exports, "internationalizedArray", () => $75940
44
49
  // https://github.com/styled-components/styled-components/issues/2449
45
50
  // Table
46
51
  const $acfbfc6ee2363807$var$TableWrapper = (props = {})=>{
47
- return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Box), {
52
+ return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Box), {
48
53
  as: "table",
49
54
  ...props
50
55
  });
51
56
  };
52
- const $acfbfc6ee2363807$var$StyledTable = (0, ($parcel$interopDefault($dyHF6$styledcomponents)))($acfbfc6ee2363807$var$TableWrapper)(()=>(0, $dyHF6$styledcomponents.css)`
57
+ const $acfbfc6ee2363807$var$StyledTable = (0, ($parcel$interopDefault($k7rGe$styledcomponents)))($acfbfc6ee2363807$var$TableWrapper)(()=>(0, $k7rGe$styledcomponents.css)`
53
58
  display: table;
54
59
  width: 100%;
55
60
 
@@ -59,19 +64,19 @@ const $acfbfc6ee2363807$var$StyledTable = (0, ($parcel$interopDefault($dyHF6$sty
59
64
  `);
60
65
  function $acfbfc6ee2363807$export$54ec01a60f47d33d(props) {
61
66
  const { children: children , ...rest } = props;
62
- return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledTable, {
67
+ return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledTable, {
63
68
  ...rest,
64
69
  children: children
65
70
  });
66
71
  }
67
72
  // Row
68
73
  const $acfbfc6ee2363807$var$RowWrapper = (props = {})=>{
69
- return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Card), {
74
+ return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Card), {
70
75
  as: "tr",
71
76
  ...props
72
77
  });
73
78
  };
74
- const $acfbfc6ee2363807$var$StyledRow = (0, ($parcel$interopDefault($dyHF6$styledcomponents)))($acfbfc6ee2363807$var$RowWrapper)(()=>(0, $dyHF6$styledcomponents.css)`
79
+ const $acfbfc6ee2363807$var$StyledRow = (0, ($parcel$interopDefault($k7rGe$styledcomponents)))($acfbfc6ee2363807$var$RowWrapper)(()=>(0, $k7rGe$styledcomponents.css)`
75
80
  display: table-row;
76
81
 
77
82
  &:not([hidden]) {
@@ -80,19 +85,19 @@ const $acfbfc6ee2363807$var$StyledRow = (0, ($parcel$interopDefault($dyHF6$style
80
85
  `);
81
86
  function $acfbfc6ee2363807$export$b05581f4e764e162(props) {
82
87
  const { children: children , ...rest } = props;
83
- return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledRow, {
88
+ return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledRow, {
84
89
  ...rest,
85
90
  children: children
86
91
  });
87
92
  }
88
93
  // Cell
89
94
  const $acfbfc6ee2363807$var$CellWrapper = (props = {})=>{
90
- return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Box), {
95
+ return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Box), {
91
96
  as: "td",
92
97
  ...props
93
98
  });
94
99
  };
95
- const $acfbfc6ee2363807$var$StyledCell = (0, ($parcel$interopDefault($dyHF6$styledcomponents)))($acfbfc6ee2363807$var$CellWrapper)(()=>(0, $dyHF6$styledcomponents.css)`
100
+ const $acfbfc6ee2363807$var$StyledCell = (0, ($parcel$interopDefault($k7rGe$styledcomponents)))($acfbfc6ee2363807$var$CellWrapper)(()=>(0, $k7rGe$styledcomponents.css)`
96
101
  display: table-cell;
97
102
 
98
103
  &:not([hidden]) {
@@ -101,7 +106,7 @@ const $acfbfc6ee2363807$var$StyledCell = (0, ($parcel$interopDefault($dyHF6$styl
101
106
  `);
102
107
  function $acfbfc6ee2363807$export$1e4baea7053fc0e3(props) {
103
108
  const { children: children , ...rest } = props;
104
- return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledCell, {
109
+ return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)($acfbfc6ee2363807$var$StyledCell, {
105
110
  ...rest,
106
111
  children: children
107
112
  });
@@ -125,37 +130,37 @@ const $aaf4d804384afd00$var$schemaExample = {
125
130
  ]
126
131
  };
127
132
  function $aaf4d804384afd00$export$2e2bcd8739ae039() {
128
- return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Card), {
133
+ return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Card), {
129
134
  tone: "caution",
130
135
  border: true,
131
136
  radius: 2,
132
137
  padding: 3,
133
- children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $dyHF6$sanityui.Stack), {
138
+ children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$sanityui.Stack), {
134
139
  space: 4,
135
140
  children: [
136
- /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $dyHF6$sanityui.Text), {
141
+ /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$sanityui.Text), {
137
142
  children: [
138
143
  "An array of language objects must be passed into the ",
139
- /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)("code", {
144
+ /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)("code", {
140
145
  children: "internationalizedArray"
141
146
  }),
142
147
  " ",
143
148
  "helper function, each with an ",
144
- /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)("code", {
149
+ /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)("code", {
145
150
  children: "id"
146
151
  }),
147
152
  " and ",
148
- /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)("code", {
153
+ /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)("code", {
149
154
  children: "title"
150
155
  }),
151
156
  " field. Example:"
152
157
  ]
153
158
  }),
154
- /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Card), {
159
+ /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Card), {
155
160
  padding: 2,
156
161
  border: true,
157
162
  radius: 2,
158
- children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Code), {
163
+ children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Code), {
159
164
  size: 1,
160
165
  language: "javascript",
161
166
  children: JSON.stringify($aaf4d804384afd00$var$schemaExample, null, 2)
@@ -180,10 +185,10 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
180
185
  const { members: members , value: value , schemaType: schemaType , onChange: onChange } = props;
181
186
  const readOnly = typeof schemaType.readOnly === "boolean" ? schemaType.readOnly : false;
182
187
  const { options: options } = schemaType;
183
- const languages = (0, $dyHF6$react.useMemo)(()=>options?.languages ?? [], [
188
+ const languages = (0, $k7rGe$react.useMemo)(()=>options?.languages ?? [], [
184
189
  options
185
190
  ]);
186
- const handleAddLanguage = (0, $dyHF6$react.useCallback)((languageId)=>{
191
+ const handleAddLanguage = (0, $k7rGe$react.useCallback)((languageId)=>{
187
192
  // Create new items
188
193
  const newItems = languageId ? [
189
194
  {
@@ -200,22 +205,23 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
200
205
  // What languages are there beyond that index?
201
206
  const remainingLanguages = languages.slice(languageIndex + 1);
202
207
  // So what is the index in the current value array of the next language in the language array?
203
- const nextLanguageIndex = languagesInUse.findIndex((l)=>remainingLanguages.find((r)=>r.id === l._key));
208
+ const nextLanguageIndex = languagesInUse.findIndex((l)=>// eslint-disable-next-line max-nested-callbacks
209
+ remainingLanguages.find((r)=>r.id === l._key));
204
210
  // Keep local state up to date incase multiple insertions are being made
205
211
  if (nextLanguageIndex < 0) languagesInUse.push(item);
206
212
  else languagesInUse.splice(nextLanguageIndex, 0, item);
207
- return nextLanguageIndex < 0 ? (0, $dyHF6$sanityform.insert)([
213
+ return nextLanguageIndex < 0 ? (0, $k7rGe$sanityform.insert)([
208
214
  item
209
215
  ], "after", [
210
216
  nextLanguageIndex
211
- ]) : (0, $dyHF6$sanityform.insert)([
217
+ ]) : (0, $k7rGe$sanityform.insert)([
212
218
  item
213
219
  ], "before", [
214
220
  nextLanguageIndex
215
221
  ]);
216
222
  });
217
223
  onChange([
218
- (0, $dyHF6$sanityform.setIfMissing)([]),
224
+ (0, $k7rGe$sanityform.setIfMissing)([]),
219
225
  ...insertions
220
226
  ]);
221
227
  }, [
@@ -223,8 +229,8 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
223
229
  onChange,
224
230
  value
225
231
  ]);
226
- const handleUnsetByKey = (0, $dyHF6$react.useCallback)((_key)=>{
227
- onChange((0, $dyHF6$sanityform.unset)([
232
+ const handleUnsetByKey = (0, $k7rGe$react.useCallback)((_key)=>{
233
+ onChange((0, $k7rGe$sanityform.unset)([
228
234
  {
229
235
  _key: _key
230
236
  }
@@ -233,7 +239,7 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
233
239
  onChange
234
240
  ]);
235
241
  // TODO: This is lazy, reordering and re-setting the whole array – it could be surgical
236
- const handleRestoreOrder = (0, $dyHF6$react.useCallback)(()=>{
242
+ const handleRestoreOrder = (0, $k7rGe$react.useCallback)(()=>{
237
243
  if (!value?.length) return;
238
244
  // Create a new value array in the correct order
239
245
  // This would also strip out values that don't have a language as the key
@@ -242,20 +248,20 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
242
248
  if (newIndex) acc[newIndex] = v;
243
249
  return acc;
244
250
  }, []).filter(Boolean);
245
- onChange((0, $dyHF6$sanityform.set)(updatedValue));
251
+ onChange((0, $k7rGe$sanityform.set)(updatedValue));
246
252
  }, [
247
253
  languages,
248
254
  onChange,
249
255
  value
250
256
  ]);
251
- const allKeysAreLanguages = (0, $dyHF6$react.useMemo)(()=>{
257
+ const allKeysAreLanguages = (0, $k7rGe$react.useMemo)(()=>{
252
258
  return value?.every((v)=>languages.find((l)=>l?.id === v?._key));
253
259
  }, [
254
260
  value,
255
261
  languages
256
262
  ]);
257
263
  // Check languages are in the correct order
258
- const languagesOutOfOrder = (0, $dyHF6$react.useMemo)(()=>{
264
+ const languagesOutOfOrder = (0, $k7rGe$react.useMemo)(()=>{
259
265
  if (!value?.length) return [];
260
266
  const languagesInUse = languages.filter((l)=>value.find((v)=>v._key === l.id));
261
267
  return value.map((v, vIndex)=>vIndex === languagesInUse.findIndex((l)=>l.id === v._key) ? null : v).filter(Boolean);
@@ -263,60 +269,60 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
263
269
  value,
264
270
  languages
265
271
  ]);
266
- const languagesAreValid = (0, $dyHF6$react.useMemo)(()=>languages?.length && languages.every((item)=>item.id && item.title), [
272
+ const languagesAreValid = (0, $k7rGe$react.useMemo)(()=>!languages?.length || languages?.length && languages.every((item)=>item.id && item.title), [
267
273
  languages
268
274
  ]);
269
- if (!languagesAreValid) return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $aaf4d804384afd00$export$2e2bcd8739ae039), {});
270
- return /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $dyHF6$sanityui.Stack), {
275
+ if (!languagesAreValid) return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $aaf4d804384afd00$export$2e2bcd8739ae039), {});
276
+ return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$sanityui.Stack), {
271
277
  space: 2,
272
278
  children: [
273
- members?.length > 0 ? /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$54ec01a60f47d33d), {
274
- children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)("tbody", {
275
- children: members.map((member)=>/*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $acfbfc6ee2363807$export$b05581f4e764e162), {
279
+ members?.length > 0 ? /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$54ec01a60f47d33d), {
280
+ children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)("tbody", {
281
+ children: members.map((member)=>/*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $acfbfc6ee2363807$export$b05581f4e764e162), {
276
282
  tone: member?.item?.validation?.length > 0 ? (0, $6a9b28384eb7074d$export$16423358d6ebe294)(member.item.validation) : undefined,
277
283
  children: [
278
- /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
284
+ /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
279
285
  style: {
280
286
  verticalAlign: "bottom"
281
287
  },
282
- children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Box), {
288
+ children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Box), {
283
289
  paddingY: 3,
284
290
  paddingRight: 2,
285
- children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Label), {
291
+ children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Label), {
286
292
  muted: true,
287
293
  size: 1,
288
294
  children: member.key
289
295
  })
290
296
  })
291
297
  }),
292
- /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
298
+ /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
293
299
  paddingRight: 2,
294
300
  style: {
295
301
  width: `100%`
296
302
  },
297
- children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityform.MemberItem), {
303
+ children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityform.MemberItem), {
298
304
  ...props,
299
305
  member: member
300
306
  })
301
307
  }),
302
- /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
308
+ /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $acfbfc6ee2363807$export$1e4baea7053fc0e3), {
303
309
  style: {
304
310
  verticalAlign: "bottom"
305
311
  },
306
- children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $dyHF6$sanityui.Flex), {
312
+ children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$sanityui.Flex), {
307
313
  align: "center",
308
314
  justify: "flex-end",
309
315
  gap: 3,
310
316
  children: [
311
- member.item.validation.length > 0 ? /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Box), {
317
+ member?.item?.validation?.length > 0 ? /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Box), {
312
318
  paddingLeft: 2,
313
- children: /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityform.FormFieldValidationStatus), {
319
+ children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityform.FormFieldValidationStatus), {
314
320
  validation: member.item.validation
315
321
  })
316
322
  }) : null,
317
- /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Button), {
323
+ /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Button), {
318
324
  mode: "ghost",
319
- icon: (0, $dyHF6$sanityicons.RemoveIcon),
325
+ icon: (0, $k7rGe$sanityicons.RemoveIcon),
320
326
  tone: "critical",
321
327
  disabled: typeof readOnly === "boolean" ? readOnly : false,
322
328
  onClick: ()=>handleUnsetByKey(member.key)
@@ -328,33 +334,33 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
328
334
  }, member.key))
329
335
  })
330
336
  }) : null,
331
- languagesOutOfOrder.length > 0 && allKeysAreLanguages ? /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Button), {
337
+ languagesOutOfOrder.length > 0 && allKeysAreLanguages ? /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Button), {
332
338
  tone: "caution",
333
- icon: (0, $dyHF6$sanityicons.RestoreIcon),
339
+ icon: (0, $k7rGe$sanityicons.RestoreIcon),
334
340
  onClick: ()=>handleRestoreOrder(),
335
341
  text: "Restore order of languages"
336
342
  }) : null,
337
- value && value.length < languages.length ? /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsxs)((0, $dyHF6$sanityui.Stack), {
343
+ languages?.length > 0 ? /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$sanityui.Stack), {
338
344
  space: 2,
339
345
  children: [
340
- /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Grid), {
346
+ /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Grid), {
341
347
  columns: Math.min(languages.length, 5),
342
348
  gap: 2,
343
- children: languages.map((language)=>/*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Button), {
349
+ children: languages.map((language)=>/*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Button), {
344
350
  tone: "primary",
345
351
  mode: "ghost",
346
352
  fontSize: 1,
347
353
  disabled: readOnly || Boolean(value?.find((item)=>item._key === language.id)),
348
354
  text: language.id.toUpperCase(),
349
- icon: (0, $dyHF6$sanityicons.AddIcon),
355
+ icon: (0, $k7rGe$sanityicons.AddIcon),
350
356
  onClick: ()=>handleAddLanguage(language.id)
351
357
  }, language.id))
352
358
  }),
353
- /*#__PURE__*/ (0, $dyHF6$reactjsxruntime.jsx)((0, $dyHF6$sanityui.Button), {
359
+ /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)((0, $k7rGe$sanityui.Button), {
354
360
  tone: "primary",
355
361
  mode: "ghost",
356
362
  disabled: readOnly || value && value?.length >= languages?.length,
357
- icon: (0, $dyHF6$sanityicons.AddIcon),
363
+ icon: (0, $k7rGe$sanityicons.AddIcon),
358
364
  text: value?.length ? `Add missing languages` : `Add all languages`,
359
365
  onClick: ()=>handleAddLanguage()
360
366
  })
@@ -365,22 +371,14 @@ function $7e790a73eaf2b445$export$2e2bcd8739ae039(props) {
365
371
  }
366
372
 
367
373
 
368
- const $7594066088192472$var$CONFIG_DEFAULT = {
369
- name: `title`,
370
- type: `string`,
371
- languages: []
372
- };
373
- function $7594066088192472$export$bec7eb13daf35f0e(config = $7594066088192472$var$CONFIG_DEFAULT) {
374
- const { name: name , type: type , languages: languages } = config;
375
- const configValidation = Array.isArray(config?.validation) ? config.validation : [
376
- config?.validation
377
- ];
378
- return (0, $dyHF6$sanity.defineField)({
379
- name: name,
380
- title: config?.title ?? undefined,
381
- group: config?.group ?? undefined,
382
- hidden: config?.hidden ?? undefined,
383
- readOnly: config?.readOnly ?? undefined,
374
+ var $0437df2e2e149362$export$2e2bcd8739ae039 = (config)=>{
375
+ const { languages: languages , type: type } = config;
376
+ const typeName = typeof type === `string` ? type : type.name;
377
+ const arrayName = (0, $a0eca5cb1c058e2c$export$ab1ce2a474f41f52)(typeName);
378
+ const objectName = (0, $a0eca5cb1c058e2c$export$ab1ce2a474f41f52)(typeName, true);
379
+ return (0, $k7rGe$sanity.defineField)({
380
+ name: arrayName,
381
+ title: "Internationalized array",
384
382
  type: "array",
385
383
  components: {
386
384
  input: (0, $7e790a73eaf2b445$export$2e2bcd8739ae039)
@@ -389,33 +387,12 @@ function $7594066088192472$export$bec7eb13daf35f0e(config = $7594066088192472$va
389
387
  languages: languages
390
388
  },
391
389
  of: [
392
- {
393
- type: "object",
394
- fields: [
395
- {
396
- name: "value",
397
- type: type
398
- },
399
- ],
400
- preview: {
401
- select: {
402
- title: "value",
403
- key: "_key"
404
- },
405
- prepare (select) {
406
- const { title: title , key: key } = select;
407
- return {
408
- title: title,
409
- subtitle: key.toUpperCase()
410
- };
411
- }
412
- }
413
- },
390
+ (0, $k7rGe$sanity.defineField)({
391
+ name: objectName,
392
+ type: objectName
393
+ })
414
394
  ],
415
- // @ts-ignore
416
- validation: (rule)=>{
417
- const rules = [];
418
- rules.push(rule.custom((value, context)=>{
395
+ validation: (rule)=>rule.max(languages?.length).custom((value, context)=>{
419
396
  const { languages: contextLanguages } = context?.type?.options ?? {};
420
397
  const nonLanguageKeys = value?.length ? value.filter((item)=>!contextLanguages.find((language)=>item._key === language.id)) : [];
421
398
  if (nonLanguageKeys.length) return {
@@ -451,18 +428,60 @@ function $7594066088192472$export$bec7eb13daf35f0e(config = $7594066088192472$va
451
428
  ])
452
429
  };
453
430
  return true;
454
- }));
455
- if (languages?.length) rules.push(rule.max(languages.length));
456
- return [
457
- ...rules,
458
- ...configValidation
459
- ].filter(Boolean);
460
- }
431
+ })
461
432
  });
462
- }
433
+ };
434
+
435
+
436
+
437
+
438
+ var $f727fb16d5d00f8f$export$2e2bcd8739ae039 = (config)=>{
439
+ const { type: type } = config;
440
+ const typeName = typeof type === `string` ? type : type.name;
441
+ const objectName = (0, $a0eca5cb1c058e2c$export$ab1ce2a474f41f52)(typeName, true);
442
+ return (0, $k7rGe$sanity.defineField)({
443
+ name: objectName,
444
+ title: `Internationalized array ${type}`,
445
+ type: "object",
446
+ fields: [
447
+ typeof type === `string` ? (0, $k7rGe$sanity.defineField)({
448
+ name: "value",
449
+ type: type
450
+ }) : {
451
+ ...type,
452
+ name: "value"
453
+ },
454
+ ]
455
+ });
456
+ };
457
+
458
+
459
+ const $45e3093e7de8dca2$var$CONFIG_DEFAULT = {
460
+ languages: [],
461
+ fieldTypes: []
462
+ };
463
+ const $45e3093e7de8dca2$export$bec7eb13daf35f0e = (0, $k7rGe$sanity.createPlugin)((config = $45e3093e7de8dca2$var$CONFIG_DEFAULT)=>{
464
+ const { languages: languages , fieldTypes: fieldTypes } = {
465
+ ...$45e3093e7de8dca2$var$CONFIG_DEFAULT,
466
+ ...config
467
+ };
468
+ return {
469
+ name: "sanity-plugin-internationalized-array",
470
+ schema: {
471
+ types: [
472
+ ...fieldTypes.map((type)=>(0, $0437df2e2e149362$export$2e2bcd8739ae039)({
473
+ type: type,
474
+ languages: languages
475
+ })),
476
+ ...fieldTypes.map((type)=>(0, $f727fb16d5d00f8f$export$2e2bcd8739ae039)({
477
+ type: type
478
+ })),
479
+ ]
480
+ }
481
+ };
482
+ });
463
483
 
464
484
 
465
- $parcel$exportWildcard(module.exports, $7594066088192472$exports);
466
485
 
467
486
 
468
487
  //# sourceMappingURL=index.js.map