@madebywild/sanity-icon-field 0.0.9 → 0.2.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 +0 -2
- package/dist/index.cjs +14 -15
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +3 -4
- package/dist/index.d.ts +3 -4
- package/dist/index.js +13 -14
- package/dist/index.js.map +1 -1
- package/package.json +11 -12
- package/src/index.tsx +2 -2
- package/src/input.tsx +11 -12
- package/src/{types.ts → types.tsx} +4 -5
package/README.md
CHANGED
package/dist/index.cjs
CHANGED
|
@@ -1,26 +1,25 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: !0 });
|
|
3
|
-
var jsxRuntime = require("react/jsx-runtime"), sanity = require("sanity"),
|
|
3
|
+
var jsxRuntime = require("react/jsx-runtime"), sanity = require("sanity"), asyncAutocomplete = require("@madebywild/sanity-utils/async-autocomplete"), ui = require("@sanity/ui");
|
|
4
4
|
function IconInput({
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
onChange,
|
|
8
|
-
value
|
|
5
|
+
pluginConfig,
|
|
6
|
+
...props
|
|
9
7
|
}) {
|
|
10
|
-
const options = schemaType.options, iconList = options?.iconList ??
|
|
8
|
+
const options = props.schemaType.options, iconList = options?.iconList ?? pluginConfig.iconList, renderOption = options?.renderOption ?? pluginConfig.renderOption, renderSelected = options?.renderSelected ?? pluginConfig.renderSelected;
|
|
11
9
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
12
|
-
|
|
10
|
+
asyncAutocomplete.AsyncAutocomplete,
|
|
13
11
|
{
|
|
14
|
-
defaultValue: value,
|
|
15
12
|
placeholder: "Select icon",
|
|
13
|
+
noOptionsPlaceholder: "No icons found",
|
|
16
14
|
listItems: iconList,
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
15
|
+
value: props.value,
|
|
16
|
+
renderValue: (value, opt) => opt?.label ?? value,
|
|
17
|
+
onChange: (value) => {
|
|
18
|
+
const next = value ? sanity.set(value) : sanity.unset();
|
|
19
|
+
return props.onChange(next);
|
|
21
20
|
},
|
|
22
|
-
renderSelected: (
|
|
23
|
-
renderOption: ({ label, value
|
|
21
|
+
renderSelected: (value) => renderSelected ? renderSelected(value) : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, children: value }),
|
|
22
|
+
renderOption: ({ label, value }) => renderOption ? renderOption({ label, value }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { as: "button", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", padding: 2, children: [
|
|
24
23
|
/* @__PURE__ */ jsxRuntime.jsx("span", { children: "\u{1F9FF}" }),
|
|
25
24
|
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { flex: 1, padding: 2, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, children: label }) })
|
|
26
25
|
] }) })
|
|
@@ -38,7 +37,7 @@ const typeName = "wild.icon", wildSanityIconFieldPlugin = sanity.definePlugin((c
|
|
|
38
37
|
description: "Select an icon.",
|
|
39
38
|
icon: () => /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: "\u{1F9FF}" }),
|
|
40
39
|
components: {
|
|
41
|
-
input: (props) => /* @__PURE__ */ jsxRuntime.jsx(IconInput, { config, ...props })
|
|
40
|
+
input: (props) => /* @__PURE__ */ jsxRuntime.jsx(IconInput, { pluginConfig: config, ...props })
|
|
42
41
|
}
|
|
43
42
|
})
|
|
44
43
|
]
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../src/input.tsx","../src/types.
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../src/input.tsx","../src/types.tsx","../src/index.tsx"],"sourcesContent":["import { AsyncAutocomplete } from \"@madebywild/sanity-utils/async-autocomplete\";\nimport { Box, Card, Flex, Text } from \"@sanity/ui\";\nimport { type StringInputProps, set, unset } from \"sanity\";\nimport type { FieldOptions, PluginConfig } from \"./types\";\n\nfunction IconInput({\n pluginConfig,\n ...props\n}: StringInputProps & {\n pluginConfig: PluginConfig;\n}) {\n const options = props.schemaType.options as FieldOptions | undefined;\n const iconList = options?.iconList ?? pluginConfig.iconList;\n const renderOption = options?.renderOption ?? pluginConfig.renderOption;\n const renderSelected = options?.renderSelected ?? pluginConfig.renderSelected;\n\n return (\n <AsyncAutocomplete\n placeholder=\"Select icon\"\n noOptionsPlaceholder=\"No icons found\"\n listItems={iconList}\n value={props.value}\n renderValue={(value, opt) => opt?.label ?? value}\n onChange={(value) => {\n const next = value ? set(value) : unset();\n return props.onChange(next);\n }}\n renderSelected={(value) => {\n if (renderSelected) return renderSelected(value);\n return <Text size={2}>{value}</Text>;\n }}\n renderOption={({ label, value }) => {\n if (renderOption) return renderOption({ label, value });\n return (\n <Card as=\"button\">\n <Flex align=\"center\" padding={2}>\n <span>🧿</span>\n <Box flex={1} padding={2}>\n <Text size={2}>{label}</Text>\n </Box>\n </Flex>\n </Card>\n );\n }}\n />\n );\n}\n\nexport { IconInput };\n","import type { ListItems } from \"@madebywild/sanity-utils/async-autocomplete\";\nimport type { StringDefinition, StringOptions } from \"sanity\";\n\n/** @public */\nexport const typeName = \"wild.icon\" as const;\n\n/** @public */\nexport type PluginConfig = {\n iconList: ListItems;\n renderSelected?: (value: string) => React.JSX.Element;\n renderOption?: (item: { label?: string; value: string }) => React.JSX.Element;\n};\n\n/** @public */\nexport type FieldOptions = StringOptions & {\n iconList?: ListItems;\n renderSelected?: (value: string) => React.JSX.Element;\n renderOption?: (item: { label?: string; value: string }) => React.JSX.Element;\n};\n\n// Add the custom field definition to Sanity's intrinsic definitions\n// so that type checking works correctly when using this field type.\ndeclare module \"sanity\" {\n export interface IntrinsicDefinitions {\n [typeName]: Omit<StringDefinition, \"type\" | \"fields\"> & {\n type: typeof typeName;\n };\n }\n}\n","import { definePlugin, defineType } from \"sanity\";\nimport { IconInput } from \"./input\";\nimport { type FieldOptions, type PluginConfig, typeName } from \"./types\";\n\n/** @public */\nconst wildSanityIconFieldPlugin = definePlugin<PluginConfig>((config) => {\n return {\n name: \"@madebywild/sanity-icon-field\",\n schema: {\n types: [\n defineType({\n name: typeName,\n type: \"string\",\n title: \"Icon\",\n description: \"Select an icon.\",\n icon: () => <>🧿</>,\n components: {\n input: (props) => <IconInput pluginConfig={config} {...props} />,\n },\n }),\n ],\n },\n };\n});\n\nexport { wildSanityIconFieldPlugin, typeName, type PluginConfig, type FieldOptions };\n"],"names":["jsx","AsyncAutocomplete","set","unset","Text","Card","Flex","Box","definePlugin","defineType","Fragment"],"mappings":";;;AAKA,SAAS,UAAU;AAAA,EACjB;AAAA,EACA,GAAG;AACL,GAEG;AACD,QAAM,UAAU,MAAM,WAAW,SAC3B,WAAW,SAAS,YAAY,aAAa,UAC7C,eAAe,SAAS,gBAAgB,aAAa,cACrD,iBAAiB,SAAS,kBAAkB,aAAa;AAE/D,SACEA,2BAAAA;AAAAA,IAACC,kBAAAA;AAAAA,IAAA;AAAA,MACC,aAAY;AAAA,MACZ,sBAAqB;AAAA,MACrB,WAAW;AAAA,MACX,OAAO,MAAM;AAAA,MACb,aAAa,CAAC,OAAO,QAAQ,KAAK,SAAS;AAAA,MAC3C,UAAU,CAAC,UAAU;AACnB,cAAM,OAAO,QAAQC,OAAAA,IAAI,KAAK,IAAIC,OAAAA,MAAA;AAClC,eAAO,MAAM,SAAS,IAAI;AAAA,MAC5B;AAAA,MACA,gBAAgB,CAAC,UACX,iBAAuB,eAAe,KAAK,IACxCH,+BAACI,GAAAA,MAAA,EAAK,MAAM,GAAI,UAAA,MAAA,CAAM;AAAA,MAE/B,cAAc,CAAC,EAAE,OAAO,YAClB,eAAqB,aAAa,EAAE,OAAO,MAAA,CAAO,IAEpDJ,2BAAAA,IAACK,WAAK,IAAG,UACP,0CAACC,GAAAA,MAAA,EAAK,OAAM,UAAS,SAAS,GAC5B,UAAA;AAAA,QAAAN,2BAAAA,IAAC,UAAK,UAAA,YAAA,CAAE;AAAA,QACRA,2BAAAA,IAACO,GAAAA,KAAA,EAAI,MAAM,GAAG,SAAS,GACrB,UAAAP,2BAAAA,IAACI,GAAAA,MAAA,EAAK,MAAM,GAAI,UAAA,MAAA,CAAM,EAAA,CACxB;AAAA,MAAA,EAAA,CACF,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAKV;AC1CO,MAAM,WAAW,aCClB,4BAA4BI,OAAAA,aAA2B,CAAC,YACrD;AAAA,EACL,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,OAAO;AAAA,MACLC,kBAAW;AAAA,QACT,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,QACP,aAAa;AAAA,QACb,MAAM,MAAMT,2BAAAA,IAAAU,WAAAA,UAAA,EAAE,UAAA,YAAA,CAAE;AAAA,QAChB,YAAY;AAAA,UACV,OAAO,CAAC,UAAUV,+BAAC,aAAU,cAAc,QAAS,GAAG,MAAA,CAAO;AAAA,QAAA;AAAA,MAChE,CACD;AAAA,IAAA;AAAA,EACH;AAEJ,EACD;;;"}
|
package/dist/index.d.cts
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import * as sanity0 from "sanity";
|
|
2
2
|
import { StringDefinition, StringOptions } from "sanity";
|
|
3
|
-
import { ListItems } from "@madebywild/sanity-utils";
|
|
3
|
+
import { ListItems } from "@madebywild/sanity-utils/async-autocomplete";
|
|
4
|
+
/** @public */
|
|
5
|
+
declare const typeName: "wild.icon";
|
|
4
6
|
/** @public */
|
|
5
7
|
type PluginConfig = {
|
|
6
8
|
iconList: ListItems;
|
|
@@ -19,13 +21,10 @@ type FieldOptions = StringOptions & {
|
|
|
19
21
|
value: string;
|
|
20
22
|
}) => React.JSX.Element;
|
|
21
23
|
};
|
|
22
|
-
/** @public */
|
|
23
|
-
declare const typeName: "wild.icon";
|
|
24
24
|
declare module "sanity" {
|
|
25
25
|
interface IntrinsicDefinitions {
|
|
26
26
|
[typeName]: Omit<StringDefinition, "type" | "fields"> & {
|
|
27
27
|
type: typeof typeName;
|
|
28
|
-
options?: FieldOptions;
|
|
29
28
|
};
|
|
30
29
|
}
|
|
31
30
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import * as sanity0 from "sanity";
|
|
2
2
|
import { StringDefinition, StringOptions } from "sanity";
|
|
3
|
-
import { ListItems } from "@madebywild/sanity-utils";
|
|
3
|
+
import { ListItems } from "@madebywild/sanity-utils/async-autocomplete";
|
|
4
|
+
/** @public */
|
|
5
|
+
declare const typeName: "wild.icon";
|
|
4
6
|
/** @public */
|
|
5
7
|
type PluginConfig = {
|
|
6
8
|
iconList: ListItems;
|
|
@@ -19,13 +21,10 @@ type FieldOptions = StringOptions & {
|
|
|
19
21
|
value: string;
|
|
20
22
|
}) => React.JSX.Element;
|
|
21
23
|
};
|
|
22
|
-
/** @public */
|
|
23
|
-
declare const typeName: "wild.icon";
|
|
24
24
|
declare module "sanity" {
|
|
25
25
|
interface IntrinsicDefinitions {
|
|
26
26
|
[typeName]: Omit<StringDefinition, "type" | "fields"> & {
|
|
27
27
|
type: typeof typeName;
|
|
28
|
-
options?: FieldOptions;
|
|
29
28
|
};
|
|
30
29
|
}
|
|
31
30
|
}
|
package/dist/index.js
CHANGED
|
@@ -1,27 +1,26 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { set, unset, definePlugin, defineType } from "sanity";
|
|
3
|
-
import { AsyncAutocomplete } from "@madebywild/sanity-utils";
|
|
3
|
+
import { AsyncAutocomplete } from "@madebywild/sanity-utils/async-autocomplete";
|
|
4
4
|
import { Card, Flex, Box, Text } from "@sanity/ui";
|
|
5
5
|
function IconInput({
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
onChange,
|
|
9
|
-
value
|
|
6
|
+
pluginConfig,
|
|
7
|
+
...props
|
|
10
8
|
}) {
|
|
11
|
-
const options = schemaType.options, iconList = options?.iconList ??
|
|
9
|
+
const options = props.schemaType.options, iconList = options?.iconList ?? pluginConfig.iconList, renderOption = options?.renderOption ?? pluginConfig.renderOption, renderSelected = options?.renderSelected ?? pluginConfig.renderSelected;
|
|
12
10
|
return /* @__PURE__ */ jsx(
|
|
13
11
|
AsyncAutocomplete,
|
|
14
12
|
{
|
|
15
|
-
defaultValue: value,
|
|
16
13
|
placeholder: "Select icon",
|
|
14
|
+
noOptionsPlaceholder: "No icons found",
|
|
17
15
|
listItems: iconList,
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
16
|
+
value: props.value,
|
|
17
|
+
renderValue: (value, opt) => opt?.label ?? value,
|
|
18
|
+
onChange: (value) => {
|
|
19
|
+
const next = value ? set(value) : unset();
|
|
20
|
+
return props.onChange(next);
|
|
22
21
|
},
|
|
23
|
-
renderSelected: (
|
|
24
|
-
renderOption: ({ label, value
|
|
22
|
+
renderSelected: (value) => renderSelected ? renderSelected(value) : /* @__PURE__ */ jsx(Text, { size: 2, children: value }),
|
|
23
|
+
renderOption: ({ label, value }) => renderOption ? renderOption({ label, value }) : /* @__PURE__ */ jsx(Card, { as: "button", children: /* @__PURE__ */ jsxs(Flex, { align: "center", padding: 2, children: [
|
|
25
24
|
/* @__PURE__ */ jsx("span", { children: "\u{1F9FF}" }),
|
|
26
25
|
/* @__PURE__ */ jsx(Box, { flex: 1, padding: 2, children: /* @__PURE__ */ jsx(Text, { size: 2, children: label }) })
|
|
27
26
|
] }) })
|
|
@@ -39,7 +38,7 @@ const typeName = "wild.icon", wildSanityIconFieldPlugin = definePlugin((config)
|
|
|
39
38
|
description: "Select an icon.",
|
|
40
39
|
icon: () => /* @__PURE__ */ jsx(Fragment, { children: "\u{1F9FF}" }),
|
|
41
40
|
components: {
|
|
42
|
-
input: (props) => /* @__PURE__ */ jsx(IconInput, { config, ...props })
|
|
41
|
+
input: (props) => /* @__PURE__ */ jsx(IconInput, { pluginConfig: config, ...props })
|
|
43
42
|
}
|
|
44
43
|
})
|
|
45
44
|
]
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../src/input.tsx","../src/types.
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/input.tsx","../src/types.tsx","../src/index.tsx"],"sourcesContent":["import { AsyncAutocomplete } from \"@madebywild/sanity-utils/async-autocomplete\";\nimport { Box, Card, Flex, Text } from \"@sanity/ui\";\nimport { type StringInputProps, set, unset } from \"sanity\";\nimport type { FieldOptions, PluginConfig } from \"./types\";\n\nfunction IconInput({\n pluginConfig,\n ...props\n}: StringInputProps & {\n pluginConfig: PluginConfig;\n}) {\n const options = props.schemaType.options as FieldOptions | undefined;\n const iconList = options?.iconList ?? pluginConfig.iconList;\n const renderOption = options?.renderOption ?? pluginConfig.renderOption;\n const renderSelected = options?.renderSelected ?? pluginConfig.renderSelected;\n\n return (\n <AsyncAutocomplete\n placeholder=\"Select icon\"\n noOptionsPlaceholder=\"No icons found\"\n listItems={iconList}\n value={props.value}\n renderValue={(value, opt) => opt?.label ?? value}\n onChange={(value) => {\n const next = value ? set(value) : unset();\n return props.onChange(next);\n }}\n renderSelected={(value) => {\n if (renderSelected) return renderSelected(value);\n return <Text size={2}>{value}</Text>;\n }}\n renderOption={({ label, value }) => {\n if (renderOption) return renderOption({ label, value });\n return (\n <Card as=\"button\">\n <Flex align=\"center\" padding={2}>\n <span>🧿</span>\n <Box flex={1} padding={2}>\n <Text size={2}>{label}</Text>\n </Box>\n </Flex>\n </Card>\n );\n }}\n />\n );\n}\n\nexport { IconInput };\n","import type { ListItems } from \"@madebywild/sanity-utils/async-autocomplete\";\nimport type { StringDefinition, StringOptions } from \"sanity\";\n\n/** @public */\nexport const typeName = \"wild.icon\" as const;\n\n/** @public */\nexport type PluginConfig = {\n iconList: ListItems;\n renderSelected?: (value: string) => React.JSX.Element;\n renderOption?: (item: { label?: string; value: string }) => React.JSX.Element;\n};\n\n/** @public */\nexport type FieldOptions = StringOptions & {\n iconList?: ListItems;\n renderSelected?: (value: string) => React.JSX.Element;\n renderOption?: (item: { label?: string; value: string }) => React.JSX.Element;\n};\n\n// Add the custom field definition to Sanity's intrinsic definitions\n// so that type checking works correctly when using this field type.\ndeclare module \"sanity\" {\n export interface IntrinsicDefinitions {\n [typeName]: Omit<StringDefinition, \"type\" | \"fields\"> & {\n type: typeof typeName;\n };\n }\n}\n","import { definePlugin, defineType } from \"sanity\";\nimport { IconInput } from \"./input\";\nimport { type FieldOptions, type PluginConfig, typeName } from \"./types\";\n\n/** @public */\nconst wildSanityIconFieldPlugin = definePlugin<PluginConfig>((config) => {\n return {\n name: \"@madebywild/sanity-icon-field\",\n schema: {\n types: [\n defineType({\n name: typeName,\n type: \"string\",\n title: \"Icon\",\n description: \"Select an icon.\",\n icon: () => <>🧿</>,\n components: {\n input: (props) => <IconInput pluginConfig={config} {...props} />,\n },\n }),\n ],\n },\n };\n});\n\nexport { wildSanityIconFieldPlugin, typeName, type PluginConfig, type FieldOptions };\n"],"names":[],"mappings":";;;;AAKA,SAAS,UAAU;AAAA,EACjB;AAAA,EACA,GAAG;AACL,GAEG;AACD,QAAM,UAAU,MAAM,WAAW,SAC3B,WAAW,SAAS,YAAY,aAAa,UAC7C,eAAe,SAAS,gBAAgB,aAAa,cACrD,iBAAiB,SAAS,kBAAkB,aAAa;AAE/D,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAY;AAAA,MACZ,sBAAqB;AAAA,MACrB,WAAW;AAAA,MACX,OAAO,MAAM;AAAA,MACb,aAAa,CAAC,OAAO,QAAQ,KAAK,SAAS;AAAA,MAC3C,UAAU,CAAC,UAAU;AACnB,cAAM,OAAO,QAAQ,IAAI,KAAK,IAAI,MAAA;AAClC,eAAO,MAAM,SAAS,IAAI;AAAA,MAC5B;AAAA,MACA,gBAAgB,CAAC,UACX,iBAAuB,eAAe,KAAK,IACxC,oBAAC,MAAA,EAAK,MAAM,GAAI,UAAA,MAAA,CAAM;AAAA,MAE/B,cAAc,CAAC,EAAE,OAAO,YAClB,eAAqB,aAAa,EAAE,OAAO,MAAA,CAAO,IAEpD,oBAAC,QAAK,IAAG,UACP,+BAAC,MAAA,EAAK,OAAM,UAAS,SAAS,GAC5B,UAAA;AAAA,QAAA,oBAAC,UAAK,UAAA,YAAA,CAAE;AAAA,QACR,oBAAC,KAAA,EAAI,MAAM,GAAG,SAAS,GACrB,UAAA,oBAAC,MAAA,EAAK,MAAM,GAAI,UAAA,MAAA,CAAM,EAAA,CACxB;AAAA,MAAA,EAAA,CACF,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAKV;AC1CO,MAAM,WAAW,aCClB,4BAA4B,aAA2B,CAAC,YACrD;AAAA,EACL,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,OAAO;AAAA,MACL,WAAW;AAAA,QACT,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,QACP,aAAa;AAAA,QACb,MAAM,MAAM,oBAAA,UAAA,EAAE,UAAA,YAAA,CAAE;AAAA,QAChB,YAAY;AAAA,UACV,OAAO,CAAC,UAAU,oBAAC,aAAU,cAAc,QAAS,GAAG,MAAA,CAAO;AAAA,QAAA;AAAA,MAChE,CACD;AAAA,IAAA;AAAA,EACH;AAEJ,EACD;"}
|
package/package.json
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@madebywild/sanity-icon-field",
|
|
3
|
-
"
|
|
3
|
+
"version": "0.2.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"sideEffects": false,
|
|
6
|
+
"license": "UNLICENSED",
|
|
6
7
|
"browserslist": "extends @sanity/browserslist-config",
|
|
7
|
-
"version": "0.0.9",
|
|
8
8
|
"exports": {
|
|
9
9
|
"./package.json": "./package.json",
|
|
10
10
|
".": {
|
|
@@ -20,28 +20,27 @@
|
|
|
20
20
|
"publishConfig": {
|
|
21
21
|
"access": "restricted"
|
|
22
22
|
},
|
|
23
|
-
"scripts": {
|
|
24
|
-
"compile": "tsc",
|
|
25
|
-
"build": "pkg-utils build --strict --clean --check",
|
|
26
|
-
"clear": "rm -rf dist",
|
|
27
|
-
"typecheck": "tsc --noEmit"
|
|
28
|
-
},
|
|
29
23
|
"dependencies": {
|
|
30
|
-
"@madebywild/sanity-utils": "
|
|
24
|
+
"@madebywild/sanity-utils": "latest"
|
|
31
25
|
},
|
|
32
26
|
"peerDependencies": {
|
|
33
|
-
"@sanity/ui": "^3.1
|
|
27
|
+
"@sanity/ui": "^3.1",
|
|
34
28
|
"sanity": "^4.17",
|
|
35
29
|
"react": "^19",
|
|
36
30
|
"react-dom": "^19"
|
|
37
31
|
},
|
|
38
32
|
"devDependencies": {
|
|
39
|
-
"@sanity/pkg-utils": "^9.
|
|
33
|
+
"@sanity/pkg-utils": "^9.2",
|
|
40
34
|
"sanity": "^4.17",
|
|
41
35
|
"react": "^19",
|
|
42
36
|
"react-dom": "^19",
|
|
43
37
|
"typescript": "^5",
|
|
44
38
|
"@types/react": "^19",
|
|
45
39
|
"@types/react-dom": "^19"
|
|
40
|
+
},
|
|
41
|
+
"scripts": {
|
|
42
|
+
"build": "pkg-utils build --strict",
|
|
43
|
+
"clear": "rm -rf dist && rm -rf node_modules",
|
|
44
|
+
"check": "tsc --noEmit && pkg-utils check"
|
|
46
45
|
}
|
|
47
|
-
}
|
|
46
|
+
}
|
package/src/index.tsx
CHANGED
|
@@ -15,7 +15,7 @@ const wildSanityIconFieldPlugin = definePlugin<PluginConfig>((config) => {
|
|
|
15
15
|
description: "Select an icon.",
|
|
16
16
|
icon: () => <>🧿</>,
|
|
17
17
|
components: {
|
|
18
|
-
input: (props) => <IconInput
|
|
18
|
+
input: (props) => <IconInput pluginConfig={config} {...props} />,
|
|
19
19
|
},
|
|
20
20
|
}),
|
|
21
21
|
],
|
|
@@ -23,4 +23,4 @@ const wildSanityIconFieldPlugin = definePlugin<PluginConfig>((config) => {
|
|
|
23
23
|
};
|
|
24
24
|
});
|
|
25
25
|
|
|
26
|
-
export { wildSanityIconFieldPlugin, type PluginConfig, type FieldOptions
|
|
26
|
+
export { wildSanityIconFieldPlugin, typeName, type PluginConfig, type FieldOptions };
|
package/src/input.tsx
CHANGED
|
@@ -1,30 +1,29 @@
|
|
|
1
|
-
import { AsyncAutocomplete } from "@madebywild/sanity-utils";
|
|
1
|
+
import { AsyncAutocomplete } from "@madebywild/sanity-utils/async-autocomplete";
|
|
2
2
|
import { Box, Card, Flex, Text } from "@sanity/ui";
|
|
3
3
|
import { type StringInputProps, set, unset } from "sanity";
|
|
4
4
|
import type { FieldOptions, PluginConfig } from "./types";
|
|
5
5
|
|
|
6
6
|
function IconInput({
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
onChange,
|
|
10
|
-
value,
|
|
7
|
+
pluginConfig,
|
|
8
|
+
...props
|
|
11
9
|
}: StringInputProps & {
|
|
12
|
-
|
|
10
|
+
pluginConfig: PluginConfig;
|
|
13
11
|
}) {
|
|
14
|
-
const options = schemaType.options as FieldOptions | undefined;
|
|
15
|
-
const iconList = options?.iconList ??
|
|
16
|
-
const renderOption = options?.renderOption ??
|
|
17
|
-
const renderSelected = options?.renderSelected ??
|
|
12
|
+
const options = props.schemaType.options as FieldOptions | undefined;
|
|
13
|
+
const iconList = options?.iconList ?? pluginConfig.iconList;
|
|
14
|
+
const renderOption = options?.renderOption ?? pluginConfig.renderOption;
|
|
15
|
+
const renderSelected = options?.renderSelected ?? pluginConfig.renderSelected;
|
|
18
16
|
|
|
19
17
|
return (
|
|
20
18
|
<AsyncAutocomplete
|
|
21
|
-
defaultValue={value}
|
|
22
19
|
placeholder="Select icon"
|
|
20
|
+
noOptionsPlaceholder="No icons found"
|
|
23
21
|
listItems={iconList}
|
|
22
|
+
value={props.value}
|
|
24
23
|
renderValue={(value, opt) => opt?.label ?? value}
|
|
25
24
|
onChange={(value) => {
|
|
26
25
|
const next = value ? set(value) : unset();
|
|
27
|
-
return onChange(next);
|
|
26
|
+
return props.onChange(next);
|
|
28
27
|
}}
|
|
29
28
|
renderSelected={(value) => {
|
|
30
29
|
if (renderSelected) return renderSelected(value);
|
|
@@ -1,6 +1,9 @@
|
|
|
1
|
-
import type { ListItems } from "@madebywild/sanity-utils";
|
|
1
|
+
import type { ListItems } from "@madebywild/sanity-utils/async-autocomplete";
|
|
2
2
|
import type { StringDefinition, StringOptions } from "sanity";
|
|
3
3
|
|
|
4
|
+
/** @public */
|
|
5
|
+
export const typeName = "wild.icon" as const;
|
|
6
|
+
|
|
4
7
|
/** @public */
|
|
5
8
|
export type PluginConfig = {
|
|
6
9
|
iconList: ListItems;
|
|
@@ -15,16 +18,12 @@ export type FieldOptions = StringOptions & {
|
|
|
15
18
|
renderOption?: (item: { label?: string; value: string }) => React.JSX.Element;
|
|
16
19
|
};
|
|
17
20
|
|
|
18
|
-
/** @public */
|
|
19
|
-
export const typeName = "wild.icon" as const;
|
|
20
|
-
|
|
21
21
|
// Add the custom field definition to Sanity's intrinsic definitions
|
|
22
22
|
// so that type checking works correctly when using this field type.
|
|
23
23
|
declare module "sanity" {
|
|
24
24
|
export interface IntrinsicDefinitions {
|
|
25
25
|
[typeName]: Omit<StringDefinition, "type" | "fields"> & {
|
|
26
26
|
type: typeof typeName;
|
|
27
|
-
options?: FieldOptions;
|
|
28
27
|
};
|
|
29
28
|
}
|
|
30
29
|
}
|