@sanity/color-input 4.0.3 → 4.0.5

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/LazyColorInput.tsx","../src/schemas/color.tsx","../src/schemas/hslaColor.ts","../src/schemas/hsvaColor.ts","../src/schemas/rgbaColor.ts","../src/index.ts"],"sourcesContent":["import {lazy} from 'react'\n\nexport const ColorInput = lazy(() => import('./ColorInput'))\n","import {defineType, type ObjectDefinition} from 'sanity'\n\nimport {ColorInput} from '../LazyColorInput'\nimport {type ColorOptions} from '../types'\n\nconst round = (val: number = 1) => Math.round(val * 100)\n\nconst colorTypeName = 'color' as const\n\n/**\n * @public\n */\nexport interface ColorDefinition extends Omit<ObjectDefinition, 'type' | 'fields' | 'options'> {\n  type: typeof colorTypeName\n  options?: ColorOptions\n}\n\ndeclare module '@sanity/types' {\n  // makes type: 'color' narrow correctly when using defineTyp/defineField/defineArrayMember\n  export interface IntrinsicDefinitions {\n    color: ColorDefinition\n  }\n}\n\nexport const color = defineType({\n  name: colorTypeName,\n  type: 'object',\n  title: 'Color',\n  components: {input: ColorInput},\n  fields: [\n    {\n      title: 'Hex',\n      name: 'hex',\n      type: 'string',\n    },\n    {\n      title: 'Alpha',\n      name: 'alpha',\n      type: 'number',\n    },\n    {\n      title: 'Hue Saturation Lightness',\n      name: 'hsl',\n      type: 'hslaColor',\n    },\n    {\n      title: 'Hue Saturation Value',\n      name: 'hsv',\n      type: 'hsvaColor',\n    },\n    {\n      title: 'Red Green Blue (rgb)',\n      name: 'rgb',\n      type: 'rgbaColor',\n    },\n  ],\n  preview: {\n    select: {\n      title: 'hex',\n      alpha: 'alpha',\n      hex: 'hex',\n      hsl: 'hsl',\n    },\n    prepare({\n      title,\n      hex,\n      hsl,\n      alpha,\n    }: {\n      title?: string\n      alpha?: number\n      hex?: string\n      hsl?: {h: number; s: number; l: number}\n    }) {\n      let subtitle = hex || 'No color set'\n      if (hsl) {\n        subtitle = `H:${round(hsl.h)} S:${round(hsl.s)} L:${round(hsl.l)} A:${round(alpha)}`\n      }\n      return {\n        title: title,\n        subtitle: subtitle,\n        media: () => (\n          <div\n            style={{\n              backgroundColor: hex ?? '#000',\n              opacity: alpha ?? 1,\n              position: 'absolute',\n              height: '100%',\n              width: '100%',\n              top: '0',\n              left: '0',\n            }}\n          />\n        ),\n      }\n    },\n  },\n})\n","import {defineType} from 'sanity'\n\nexport const hslaColor = defineType({\n  title: 'Hue Saturation Lightness',\n  name: 'hslaColor',\n  type: 'object',\n  fields: [\n    {name: 'h', type: 'number', title: 'Hue'},\n    {name: 's', type: 'number', title: 'Saturation'},\n    {name: 'l', type: 'number', title: 'Lightness'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {defineType} from 'sanity'\n\nexport const hsvaColor = defineType({\n  title: 'Hue Saturation Value',\n  name: 'hsvaColor',\n  type: 'object',\n  fields: [\n    {name: 'h', type: 'number', title: 'Hue'},\n    {name: 's', type: 'number', title: 'Saturation'},\n    {name: 'v', type: 'number', title: 'Value'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {defineType} from 'sanity'\n\nexport const rgbaColor = defineType({\n  title: 'Red Green Blue (rgb)',\n  name: 'rgbaColor',\n  type: 'object',\n  fields: [\n    {name: 'r', type: 'number', title: 'Red'},\n    {name: 'g', type: 'number', title: 'Green'},\n    {name: 'b', type: 'number', title: 'Blue'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {definePlugin} from 'sanity'\n\nimport {color, type ColorDefinition} from './schemas/color'\nimport {hslaColor} from './schemas/hslaColor'\nimport {hsvaColor} from './schemas/hsvaColor'\nimport {rgbaColor} from './schemas/rgbaColor'\n\nexport const colorInput = definePlugin({\n  name: '@sanity/color-input',\n  schema: {\n    types: [hslaColor, hsvaColor, rgbaColor, color],\n  },\n})\n\nexport {color, hslaColor, hsvaColor, rgbaColor}\nexport {ColorInput} from './LazyColorInput'\nexport type {ColorDefinition}\nexport type {ColorInputProps, ColorOptions, ColorSchemaType, ColorValue} from './types'\n"],"names":["lazy","defineType","jsx","definePlugin"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/LazyColorInput.tsx","../src/schemas/color.tsx","../src/schemas/hslaColor.ts","../src/schemas/hsvaColor.ts","../src/schemas/rgbaColor.ts","../src/index.ts"],"sourcesContent":["import {lazy} from 'react'\n\nexport const ColorInput = lazy(() => import('./ColorInput'))\n","import {defineType, type ObjectDefinition} from 'sanity'\n\nimport {ColorInput} from '../LazyColorInput'\nimport {type ColorOptions} from '../types'\n\nconst round = (val: number = 1) => Math.round(val * 100)\n\nconst colorTypeName = 'color' as const\n\n/**\n * @public\n */\nexport interface ColorDefinition extends Omit<ObjectDefinition, 'type' | 'fields' | 'options'> {\n  type: typeof colorTypeName\n  options?: ColorOptions\n}\n\ndeclare module '@sanity/types' {\n  // makes type: 'color' narrow correctly when using defineTyp/defineField/defineArrayMember\n  export interface IntrinsicDefinitions {\n    color: ColorDefinition\n  }\n}\n\nexport const color = defineType({\n  name: colorTypeName,\n  type: 'object',\n  title: 'Color',\n  components: {input: ColorInput},\n  fields: [\n    {\n      title: 'Hex',\n      name: 'hex',\n      type: 'string',\n    },\n    {\n      title: 'Alpha',\n      name: 'alpha',\n      type: 'number',\n    },\n    {\n      title: 'Hue Saturation Lightness',\n      name: 'hsl',\n      type: 'hslaColor',\n    },\n    {\n      title: 'Hue Saturation Value',\n      name: 'hsv',\n      type: 'hsvaColor',\n    },\n    {\n      title: 'Red Green Blue (rgb)',\n      name: 'rgb',\n      type: 'rgbaColor',\n    },\n  ],\n  preview: {\n    select: {\n      title: 'hex',\n      alpha: 'alpha',\n      hex: 'hex',\n      hsl: 'hsl',\n    },\n    prepare({\n      title,\n      hex,\n      hsl,\n      alpha,\n    }: {\n      title?: string\n      alpha?: number\n      hex?: string\n      hsl?: {h: number; s: number; l: number}\n    }) {\n      let subtitle = hex || 'No color set'\n      if (hsl) {\n        subtitle = `H:${round(hsl.h)} S:${round(hsl.s)} L:${round(hsl.l)} A:${round(alpha)}`\n      }\n      return {\n        title: title,\n        subtitle: subtitle,\n        media: () => (\n          <div\n            style={{\n              backgroundColor: hex ?? '#000',\n              opacity: alpha ?? 1,\n              position: 'absolute',\n              height: '100%',\n              width: '100%',\n              top: '0',\n              left: '0',\n            }}\n          />\n        ),\n      }\n    },\n  },\n})\n","import {defineType} from 'sanity'\n\nexport const hslaColor = defineType({\n  title: 'Hue Saturation Lightness',\n  name: 'hslaColor',\n  type: 'object',\n  fields: [\n    {name: 'h', type: 'number', title: 'Hue'},\n    {name: 's', type: 'number', title: 'Saturation'},\n    {name: 'l', type: 'number', title: 'Lightness'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {defineType} from 'sanity'\n\nexport const hsvaColor = defineType({\n  title: 'Hue Saturation Value',\n  name: 'hsvaColor',\n  type: 'object',\n  fields: [\n    {name: 'h', type: 'number', title: 'Hue'},\n    {name: 's', type: 'number', title: 'Saturation'},\n    {name: 'v', type: 'number', title: 'Value'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {defineType} from 'sanity'\n\nexport const rgbaColor = defineType({\n  title: 'Red Green Blue (rgb)',\n  name: 'rgbaColor',\n  type: 'object',\n  fields: [\n    {name: 'r', type: 'number', title: 'Red'},\n    {name: 'g', type: 'number', title: 'Green'},\n    {name: 'b', type: 'number', title: 'Blue'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {definePlugin} from 'sanity'\n\nimport {color, type ColorDefinition} from './schemas/color'\nimport {hslaColor} from './schemas/hslaColor'\nimport {hsvaColor} from './schemas/hsvaColor'\nimport {rgbaColor} from './schemas/rgbaColor'\n\nexport const colorInput = definePlugin({\n  name: '@sanity/color-input',\n  schema: {\n    types: [hslaColor, hsvaColor, rgbaColor, color],\n  },\n})\n\nexport {color, hslaColor, hsvaColor, rgbaColor}\nexport {ColorInput} from './LazyColorInput'\nexport type {ColorDefinition}\nexport type {ColorInputProps, ColorOptions, ColorSchemaType, ColorValue} from './types'\n"],"names":["lazy","defineType","jsx","definePlugin"],"mappings":"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"}

package/lib/index.mjs

@@ -54,8 +54,8 @@ const ColorInput = lazy(() => import("./_chunks-es/ColorInput.mjs")), round = (v
           "div",
           {
             style: {
-              backgroundColor: hex != null ? hex : "#000",
-              opacity: alpha != null ? alpha : 1,
+              backgroundColor: hex ?? "#000",
+              opacity: alpha ?? 1,
               position: "absolute",
               height: "100%",
               width: "100%",

package/lib/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../src/LazyColorInput.tsx","../src/schemas/color.tsx","../src/schemas/hslaColor.ts","../src/schemas/hsvaColor.ts","../src/schemas/rgbaColor.ts","../src/index.ts"],"sourcesContent":["import {lazy} from 'react'\n\nexport const ColorInput = lazy(() => import('./ColorInput'))\n","import {defineType, type ObjectDefinition} from 'sanity'\n\nimport {ColorInput} from '../LazyColorInput'\nimport {type ColorOptions} from '../types'\n\nconst round = (val: number = 1) => Math.round(val * 100)\n\nconst colorTypeName = 'color' as const\n\n/**\n * @public\n */\nexport interface ColorDefinition extends Omit<ObjectDefinition, 'type' | 'fields' | 'options'> {\n  type: typeof colorTypeName\n  options?: ColorOptions\n}\n\ndeclare module '@sanity/types' {\n  // makes type: 'color' narrow correctly when using defineTyp/defineField/defineArrayMember\n  export interface IntrinsicDefinitions {\n    color: ColorDefinition\n  }\n}\n\nexport const color = defineType({\n  name: colorTypeName,\n  type: 'object',\n  title: 'Color',\n  components: {input: ColorInput},\n  fields: [\n    {\n      title: 'Hex',\n      name: 'hex',\n      type: 'string',\n    },\n    {\n      title: 'Alpha',\n      name: 'alpha',\n      type: 'number',\n    },\n    {\n      title: 'Hue Saturation Lightness',\n      name: 'hsl',\n      type: 'hslaColor',\n    },\n    {\n      title: 'Hue Saturation Value',\n      name: 'hsv',\n      type: 'hsvaColor',\n    },\n    {\n      title: 'Red Green Blue (rgb)',\n      name: 'rgb',\n      type: 'rgbaColor',\n    },\n  ],\n  preview: {\n    select: {\n      title: 'hex',\n      alpha: 'alpha',\n      hex: 'hex',\n      hsl: 'hsl',\n    },\n    prepare({\n      title,\n      hex,\n      hsl,\n      alpha,\n    }: {\n      title?: string\n      alpha?: number\n      hex?: string\n      hsl?: {h: number; s: number; l: number}\n    }) {\n      let subtitle = hex || 'No color set'\n      if (hsl) {\n        subtitle = `H:${round(hsl.h)} S:${round(hsl.s)} L:${round(hsl.l)} A:${round(alpha)}`\n      }\n      return {\n        title: title,\n        subtitle: subtitle,\n        media: () => (\n          <div\n            style={{\n              backgroundColor: hex ?? '#000',\n              opacity: alpha ?? 1,\n              position: 'absolute',\n              height: '100%',\n              width: '100%',\n              top: '0',\n              left: '0',\n            }}\n          />\n        ),\n      }\n    },\n  },\n})\n","import {defineType} from 'sanity'\n\nexport const hslaColor = defineType({\n  title: 'Hue Saturation Lightness',\n  name: 'hslaColor',\n  type: 'object',\n  fields: [\n    {name: 'h', type: 'number', title: 'Hue'},\n    {name: 's', type: 'number', title: 'Saturation'},\n    {name: 'l', type: 'number', title: 'Lightness'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {defineType} from 'sanity'\n\nexport const hsvaColor = defineType({\n  title: 'Hue Saturation Value',\n  name: 'hsvaColor',\n  type: 'object',\n  fields: [\n    {name: 'h', type: 'number', title: 'Hue'},\n    {name: 's', type: 'number', title: 'Saturation'},\n    {name: 'v', type: 'number', title: 'Value'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {defineType} from 'sanity'\n\nexport const rgbaColor = defineType({\n  title: 'Red Green Blue (rgb)',\n  name: 'rgbaColor',\n  type: 'object',\n  fields: [\n    {name: 'r', type: 'number', title: 'Red'},\n    {name: 'g', type: 'number', title: 'Green'},\n    {name: 'b', type: 'number', title: 'Blue'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {definePlugin} from 'sanity'\n\nimport {color, type ColorDefinition} from './schemas/color'\nimport {hslaColor} from './schemas/hslaColor'\nimport {hsvaColor} from './schemas/hsvaColor'\nimport {rgbaColor} from './schemas/rgbaColor'\n\nexport const colorInput = definePlugin({\n  name: '@sanity/color-input',\n  schema: {\n    types: [hslaColor, hsvaColor, rgbaColor, color],\n  },\n})\n\nexport {color, hslaColor, hsvaColor, rgbaColor}\nexport {ColorInput} from './LazyColorInput'\nexport type {ColorDefinition}\nexport type {ColorInputProps, ColorOptions, ColorSchemaType, ColorValue} from './types'\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../src/LazyColorInput.tsx","../src/schemas/color.tsx","../src/schemas/hslaColor.ts","../src/schemas/hsvaColor.ts","../src/schemas/rgbaColor.ts","../src/index.ts"],"sourcesContent":["import {lazy} from 'react'\n\nexport const ColorInput = lazy(() => import('./ColorInput'))\n","import {defineType, type ObjectDefinition} from 'sanity'\n\nimport {ColorInput} from '../LazyColorInput'\nimport {type ColorOptions} from '../types'\n\nconst round = (val: number = 1) => Math.round(val * 100)\n\nconst colorTypeName = 'color' as const\n\n/**\n * @public\n */\nexport interface ColorDefinition extends Omit<ObjectDefinition, 'type' | 'fields' | 'options'> {\n  type: typeof colorTypeName\n  options?: ColorOptions\n}\n\ndeclare module '@sanity/types' {\n  // makes type: 'color' narrow correctly when using defineTyp/defineField/defineArrayMember\n  export interface IntrinsicDefinitions {\n    color: ColorDefinition\n  }\n}\n\nexport const color = defineType({\n  name: colorTypeName,\n  type: 'object',\n  title: 'Color',\n  components: {input: ColorInput},\n  fields: [\n    {\n      title: 'Hex',\n      name: 'hex',\n      type: 'string',\n    },\n    {\n      title: 'Alpha',\n      name: 'alpha',\n      type: 'number',\n    },\n    {\n      title: 'Hue Saturation Lightness',\n      name: 'hsl',\n      type: 'hslaColor',\n    },\n    {\n      title: 'Hue Saturation Value',\n      name: 'hsv',\n      type: 'hsvaColor',\n    },\n    {\n      title: 'Red Green Blue (rgb)',\n      name: 'rgb',\n      type: 'rgbaColor',\n    },\n  ],\n  preview: {\n    select: {\n      title: 'hex',\n      alpha: 'alpha',\n      hex: 'hex',\n      hsl: 'hsl',\n    },\n    prepare({\n      title,\n      hex,\n      hsl,\n      alpha,\n    }: {\n      title?: string\n      alpha?: number\n      hex?: string\n      hsl?: {h: number; s: number; l: number}\n    }) {\n      let subtitle = hex || 'No color set'\n      if (hsl) {\n        subtitle = `H:${round(hsl.h)} S:${round(hsl.s)} L:${round(hsl.l)} A:${round(alpha)}`\n      }\n      return {\n        title: title,\n        subtitle: subtitle,\n        media: () => (\n          <div\n            style={{\n              backgroundColor: hex ?? '#000',\n              opacity: alpha ?? 1,\n              position: 'absolute',\n              height: '100%',\n              width: '100%',\n              top: '0',\n              left: '0',\n            }}\n          />\n        ),\n      }\n    },\n  },\n})\n","import {defineType} from 'sanity'\n\nexport const hslaColor = defineType({\n  title: 'Hue Saturation Lightness',\n  name: 'hslaColor',\n  type: 'object',\n  fields: [\n    {name: 'h', type: 'number', title: 'Hue'},\n    {name: 's', type: 'number', title: 'Saturation'},\n    {name: 'l', type: 'number', title: 'Lightness'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {defineType} from 'sanity'\n\nexport const hsvaColor = defineType({\n  title: 'Hue Saturation Value',\n  name: 'hsvaColor',\n  type: 'object',\n  fields: [\n    {name: 'h', type: 'number', title: 'Hue'},\n    {name: 's', type: 'number', title: 'Saturation'},\n    {name: 'v', type: 'number', title: 'Value'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {defineType} from 'sanity'\n\nexport const rgbaColor = defineType({\n  title: 'Red Green Blue (rgb)',\n  name: 'rgbaColor',\n  type: 'object',\n  fields: [\n    {name: 'r', type: 'number', title: 'Red'},\n    {name: 'g', type: 'number', title: 'Green'},\n    {name: 'b', type: 'number', title: 'Blue'},\n    {name: 'a', type: 'number', title: 'Alpha'},\n  ],\n})\n","import {definePlugin} from 'sanity'\n\nimport {color, type ColorDefinition} from './schemas/color'\nimport {hslaColor} from './schemas/hslaColor'\nimport {hsvaColor} from './schemas/hsvaColor'\nimport {rgbaColor} from './schemas/rgbaColor'\n\nexport const colorInput = definePlugin({\n  name: '@sanity/color-input',\n  schema: {\n    types: [hslaColor, hsvaColor, rgbaColor, color],\n  },\n})\n\nexport {color, hslaColor, hsvaColor, rgbaColor}\nexport {ColorInput} from './LazyColorInput'\nexport type {ColorDefinition}\nexport type {ColorInputProps, ColorOptions, ColorSchemaType, ColorValue} from './types'\n"],"names":[],"mappings":";;;AAEO,MAAM,aAAa,KAAK,MAAM,OAAO,6BAAc,CAAC,GCGrD,QAAQ,CAAC,MAAc,MAAM,KAAK,MAAM,MAAM,GAAG,GAEjD,gBAAgB,SAiBT,QAAQ,WAAW;AAAA,EAC9B,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AAAA,EACP,YAAY,EAAC,OAAO,WAAU;AAAA,EAC9B,QAAQ;AAAA,IACN;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,MAAM;AAAA,IACR;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,MAAM;AAAA,IACR;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,MAAM;AAAA,IACR;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,MAAM;AAAA,IACR;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,MAAM;AAAA,MACN,MAAM;AAAA,IAAA;AAAA,EAEV;AAAA,EACA,SAAS;AAAA,IACP,QAAQ;AAAA,MACN,OAAO;AAAA,MACP,OAAO;AAAA,MACP,KAAK;AAAA,MACL,KAAK;AAAA,IACP;AAAA,IACA,QAAQ;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA,GAMC;AACD,UAAI,WAAW,OAAO;AAClB,aAAA,QACF,WAAW,KAAK,MAAM,IAAI,CAAC,CAAC,MAAM,MAAM,IAAI,CAAC,CAAC,MAAM,MAAM,IAAI,CAAC,CAAC,MAAM,MAAM,KAAK,CAAC,KAE7E;AAAA,QACL;AAAA,QACA;AAAA,QACA,OAAO,MACL;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAO;AAAA,cACL,iBAAiB,OAAO;AAAA,cACxB,SAAS,SAAS;AAAA,cAClB,UAAU;AAAA,cACV,QAAQ;AAAA,cACR,OAAO;AAAA,cACP,KAAK;AAAA,cACL,MAAM;AAAA,YAAA;AAAA,UACR;AAAA,QAAA;AAAA,MAGN;AAAA,IAAA;AAAA,EACF;AAEJ,CAAC,GC/FY,YAAY,WAAW;AAAA,EAClC,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,MAAK;AAAA,IACxC,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,aAAY;AAAA,IAC/C,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,YAAW;AAAA,IAC9C,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,QAAO;AAAA,EAAA;AAE9C,CAAC,GCVY,YAAY,WAAW;AAAA,EAClC,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,MAAK;AAAA,IACxC,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,aAAY;AAAA,IAC/C,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,QAAO;AAAA,IAC1C,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,QAAO;AAAA,EAAA;AAE9C,CAAC,GCVY,YAAY,WAAW;AAAA,EAClC,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,MAAK;AAAA,IACxC,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,QAAO;AAAA,IAC1C,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,OAAM;AAAA,IACzC,EAAC,MAAM,KAAK,MAAM,UAAU,OAAO,QAAO;AAAA,EAAA;AAE9C,CAAC,GCLY,aAAa,aAAa;AAAA,EACrC,MAAM;AAAA,EACN,QAAQ;AAAA,IACN,OAAO,CAAC,WAAW,WAAW,WAAW,KAAK;AAAA,EAAA;AAElD,CAAC;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sanity/color-input",
-  "version": "4.0.3",
+  "version": "4.0.5",
   "description": "Color input",
   "keywords": [
     "sanity",
@@ -57,7 +57,7 @@
     "@sanity/incompatible-plugin": "^1.0.5",
     "@sanity/ui": "^2.10.10",
     "react-color": "^2.19.3",
-    "use-effect-event": "^1.0.2"
+    "use-effect-event": "^2.0.3"
   },
   "devDependencies": {
     "@commitlint/cli": "^19.5.0",
@@ -69,14 +69,13 @@
     "@types/react": "^18.3.5",
     "@types/react-color": "^2.17.11",
     "@types/tinycolor2": "^1.4.6",
-    "@typescript-eslint/eslint-plugin": "^7.18.0",
-    "@typescript-eslint/parser": "^7.18.0",
-    "eslint": "^8.57.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-config-sanity": "^7.1.2",
-    "eslint-plugin-prettier": "^5.2.1",
-    "eslint-plugin-react": "^7.36.1",
-    "eslint-plugin-react-hooks": "^4.6.2",
+    "@typescript-eslint/eslint-plugin": "^8.37.0",
+    "@typescript-eslint/parser": "^8.37.0",
+    "eslint": "^9.31.0",
+    "eslint-config-prettier": "^10.1.5",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "0.0.0-experimental-dffacc7b-20250717",
+    "eslint-plugin-simple-import-sort": "^12.1.1",
     "husky": "^8.0.1",
     "lint-staged": "^13.0.3",
     "npm-run-all2": "^5.0.0",
@@ -86,11 +85,12 @@
     "sanity": "^3.67.1",
     "semantic-release": "^24.1.1",
     "styled-components": "^6.1",
-    "typescript": "^5.6.2"
+    "typescript": "^5.6.2",
+    "typescript-eslint": "^8.37.0"
   },
   "peerDependencies": {
     "react": "^18.3 || ^19",
-    "sanity": "^3.23.0",
+    "sanity": "^3.23.0 || ^4.0.0-0",
     "styled-components": "^6.1"
   },
   "engines": {
@@ -102,5 +102,10 @@
   "overrides": {
     "conventional-changelog-conventionalcommits": ">= 8.0.0"
   },
-  "sanityExchangeUrl": "https://www.sanity.io/plugins/color-input"
+  "sanityExchangeUrl": "https://www.sanity.io/plugins/color-input",
+  "sanityPlugin": {
+    "verifyPackage": {
+      "eslintImports": false
+    }
+  }
 }

package/src/ColorInput.tsx

@@ -54,7 +54,7 @@ export default function ColorInput(props: ObjectInputProps) {
     if (!debouncedColor) return undefined
     const raf = requestAnimationFrame(() => handleChange(debouncedColor))
     return () => cancelAnimationFrame(raf)
-  }, [debouncedColor, handleChange])
+  }, [debouncedColor])
 
   const handleCreateColor = useCallback(() => {
     setColor(DEFAULT_COLOR)