From 5a8080a09c1ead44df774f6549a2381152e19454 Mon Sep 17 00:00:00 2001 From: Cody Olsen Date: Fri, 13 Sep 2024 11:25:51 +0200 Subject: [PATCH] chore: add back the `@sanity/color-input` plugin to test studio --- dev/test-studio/package.json | 1 + dev/test-studio/sanity.config.ts | 2 + dev/test-studio/schema/plugins/color.tsx | 146 +++++++++++++---------- pnpm-lock.yaml | 70 +++++++++++ 4 files changed, 155 insertions(+), 64 deletions(-) diff --git a/dev/test-studio/package.json b/dev/test-studio/package.json index 04390f24cd1..44bd63ff4e8 100644 --- a/dev/test-studio/package.json +++ b/dev/test-studio/package.json @@ -22,6 +22,7 @@ "@sanity/block-tools": "3.57.3", "@sanity/client": "^6.21.3", "@sanity/color": "^3.0.0", + "@sanity/color-input": "^4.0.1", "@sanity/google-maps-input": "^4.0.0", "@sanity/icons": "^3.4.0", "@sanity/image-url": "^1.0.2", diff --git a/dev/test-studio/sanity.config.ts b/dev/test-studio/sanity.config.ts index 43eefde3dc4..6fa01bdf630 100644 --- a/dev/test-studio/sanity.config.ts +++ b/dev/test-studio/sanity.config.ts @@ -1,4 +1,5 @@ import {assist} from '@sanity/assist' +import {colorInput} from '@sanity/color-input' import {googleMapsInput} from '@sanity/google-maps-input' import {BookIcon} from '@sanity/icons' import {koKRLocale} from '@sanity/locale-ko-kr' @@ -127,6 +128,7 @@ const sharedSettings = definePlugin({ lng: -74.1180863, }, }), + colorInput(), workshopTool({ collections: [ {name: 'sanity', title: 'sanity'}, diff --git a/dev/test-studio/schema/plugins/color.tsx b/dev/test-studio/schema/plugins/color.tsx index 69f6109cdbd..9d72f9ac838 100644 --- a/dev/test-studio/schema/plugins/color.tsx +++ b/dev/test-studio/schema/plugins/color.tsx @@ -50,69 +50,87 @@ export default defineType({ title: 'Title', type: 'string', }, - // { - // name: 'testColor1', - // title: 'Color to be used in preview', - // description: 'A color input', - // type: 'color', - // }, - // { - // name: 'testColor2', - // title: 'Color with no alpha', - // description: 'A color input with no alpha', - // type: 'color', - // options: { - // disableAlpha: true, - // }, - // }, - // { - // name: 'colorList', - // title: 'List of colors', - // description: 'An array of colors with the built in color preview', - // type: 'array', - // of: [ - // { - // type: 'color', - // }, - // ], - // }, - // { - // name: 'readOnlyColor', - // title: 'Read-only color', - // description: 'Color input in readOnly mode', - // readOnly: true, - // type: 'color', - // }, - // { - // name: 'colorGrid', - // title: 'Grid of colors', - // description: 'An grid of colors with the built in color preview', - // type: 'array', - // options: { - // layout: 'grid', - // }, - // of: [ - // { - // type: 'color', - // }, - // ], - // }, - // { - // name: 'objectWithObjectWithColors', - // title: 'Object with object with colors', - // type: 'object', - // fields: [ - // { - // name: 'objectWithColors', - // title: 'Object with colors', - // type: 'object', - // fields: [ - // {name: 'primaryColor', title: 'Primary color', type: 'color'}, - // {name: 'secondaryColor', title: 'Secondary color', type: 'color'}, - // {name: 'extraColor', title: 'Extra color', type: 'color'}, - // ], - // }, - // ], - // }, + { + name: 'testColor1', + title: 'Color to be used in preview', + description: 'A color input', + type: 'color', + }, + { + name: 'testColor2', + title: 'Color with no alpha', + description: 'A color input with no alpha', + type: 'color', + options: { + disableAlpha: true, + }, + }, + { + name: 'testColor3', + title: 'Color with presets', + description: 'A color input with a list of preset colors', + type: 'color', + options: { + colorList: [ + '#FF6900', + {hex: '#FCB900'}, + {r: 123, g: 220, b: 181}, + {r: 0, g: 208, b: 132, a: 0.5}, + {h: 203, s: 95, l: 77, a: 1}, + {h: 202, s: 95, l: 46, a: 0.5}, + {h: 345, s: 43, v: 97}, + {h: 344, s: 91, v: 92, a: 0.5}, + ], + }, + }, + { + name: 'colorList', + title: 'List of colors', + description: 'An array of colors with the built in color preview', + type: 'array', + of: [ + { + type: 'color', + }, + ], + }, + { + name: 'readOnlyColor', + title: 'Read-only color', + description: 'Color input in readOnly mode', + readOnly: true, + type: 'color', + }, + { + name: 'colorGrid', + title: 'Grid of colors', + description: 'An grid of colors with the built in color preview', + type: 'array', + options: { + layout: 'grid', + }, + of: [ + { + type: 'color', + }, + ], + }, + { + name: 'objectWithObjectWithColors', + title: 'Object with object with colors', + type: 'object', + fields: [ + { + name: 'objectWithColors', + title: 'Object with colors', + type: 'object', + fields: [ + {name: 'primaryColor', title: 'Primary color', type: 'color'}, + {name: 'secondaryColor', title: 'Secondary color', type: 'color'}, + {name: 'extraColor', title: 'Extra color', type: 'color'}, + ], + }, + ], + }, ], }) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index ff5739d9a4f..c9e31aab210 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -453,6 +453,9 @@ importers: '@sanity/color': specifier: ^3.0.0 version: 3.0.6 + '@sanity/color-input': + specifier: ^4.0.1 + version: 4.0.1(react-dom@18.3.1(react@18.3.1))(react-is@19.0.0-rc-a7d1240c-20240731)(react@18.3.1)(sanity@packages+sanity)(styled-components@6.1.13(react-dom@18.3.1(react@18.3.1))(react@18.3.1)) '@sanity/google-maps-input': specifier: ^4.0.0 version: 4.0.1(react-dom@18.3.1(react@18.3.1))(react-is@19.0.0-rc-a7d1240c-20240731)(react@18.3.1)(sanity@packages+sanity)(styled-components@6.1.13(react-dom@18.3.1(react@18.3.1))(react@18.3.1)) @@ -3397,6 +3400,11 @@ packages: '@iarna/toml@2.2.3': resolution: {integrity: sha512-FmuxfCuolpLl0AnQ2NHSzoUKWEJDFl63qXjzdoWBVyFCXzMGm1spBzk7LeHNoVCiWCF7mRVms9e6jEV9+MoPbg==} + '@icons/material@0.2.4': + resolution: {integrity: sha512-QPcGmICAPbGLGb6F/yNf/KzKqvFx8z5qx3D1yFqVAjoFmXK35EgyW+cJ57Te3CNsmzblwtzakLGFqHPqrfb4Tw==} + peerDependencies: + react: '*' + '@img/sharp-darwin-arm64@0.33.5': resolution: {integrity: sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==} engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} @@ -4309,6 +4317,14 @@ packages: resolution: {integrity: sha512-oE2+4kKRTZhFCc4IIsojkzKF0jIhsSYSRxkPZjScZ1k/EQ3Y2tEcQYiKwvvotzaXoaWsIL3RTpulE+R4iBYiBw==} engines: {node: '>=14.18'} + '@sanity/color-input@4.0.1': + resolution: {integrity: sha512-Ra/IZO7j5vsx5VIF1OGIoeVfgwZu74tii8qOLuLQIRYbd6Av8si1mQFl6MOBu/kzWKWURE6JEN8+Ac1K2fi8Ww==} + engines: {node: '>=18'} + peerDependencies: + react: ^18.3 + sanity: ^3.23.0 + styled-components: ^6.1 + '@sanity/color@3.0.6': resolution: {integrity: sha512-2TjYEvOftD0v7ukx3Csdh9QIu44P2z7NDJtlC3qITJRYV36J7R6Vfd3trVhFnN77/7CZrGjqngrtohv8VqO5nw==} engines: {node: '>=18.0.0'} @@ -8570,6 +8586,9 @@ packages: resolution: {integrity: sha512-4y7uGv8bd2WdM9vpQsiQNo41Ln1NvhvDRuVt0k2JZQ+ezN2uaQes7lZeZ+QQUHOLQAtDaBJ+7wCbi+ab/KFs+w==} engines: {node: '>=0.10.0'} + material-colors@1.2.6: + resolution: {integrity: sha512-6qE4B9deFBIa9YSpOc9O0Sgc43zTeVYbgDT5veRKSlB2+ZuHNoVVxA1L/ckMUayV9Ay9y7Z/SZCLcGteW9i7bg==} + math-random@1.0.4: resolution: {integrity: sha512-rUxjysqif/BZQH2yhd5Aaq7vXMSx9NdEsQcyA07uEzIvxgI7zIr33gGsh+RU0/XjmQpCW7RsVof1vlkvQVCK5A==} @@ -9675,6 +9694,11 @@ packages: peerDependencies: react: ^15.3.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 + react-color@2.19.3: + resolution: {integrity: sha512-LEeGE/ZzNLIsFWa1TMe8y5VYqr7bibneWmvJwm1pCn/eNmrabWDh659JSPn9BuaMpEfU83WTOJfnCcjDZwNQTA==} + peerDependencies: + react: '*' + react-copy-to-clipboard@5.1.0: resolution: {integrity: sha512-k61RsNgAayIJNoy9yDsYzDe/yAZAzEbEgcz3DZMhF686LEyukcE1hzurxe85JandPUG+yTfGVFzuEw3xt8WP/A==} peerDependencies: @@ -9825,6 +9849,11 @@ packages: resolution: {integrity: sha512-SeU2v5Xy6FotVhKz0pMS2gvYP7HlkF0qgTskj3JzA1vlxcb3dQjxlm9t0ZlJqcgoyI3VFAw7bomuDMdgy1nBuw==} engines: {node: '>=0.10.0'} + reactcss@1.2.3: + resolution: {integrity: sha512-KiwVUcFu1RErkI97ywr8nvx8dNOpT03rbnma0SSalTYjkrPYaEajR4a/MRt6DZ46K6arDRbWMNHF+xH7G7n/8A==} + peerDependencies: + react: '*' + read-cmd-shim@4.0.0: resolution: {integrity: sha512-yILWifhaSEEytfXI76kB9xEEiG1AiozaCJZ83A87ytjRiN+jVibXjedjCRNjoZviinhG+4UkalO3mWTd8u5O0Q==} engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0} @@ -10778,6 +10807,9 @@ packages: tiny-warning@1.0.3: resolution: {integrity: sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==} + tinycolor2@1.6.0: + resolution: {integrity: sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==} + tmp@0.0.33: resolution: {integrity: sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==} engines: {node: '>=0.6.0'} @@ -13106,6 +13138,10 @@ snapshots: '@iarna/toml@2.2.3': {} + '@icons/material@0.2.4(react@18.3.1)': + dependencies: + react: 18.3.1 + '@img/sharp-darwin-arm64@0.33.5': optionalDependencies: '@img/sharp-libvips-darwin-arm64': 1.0.4 @@ -14311,6 +14347,20 @@ snapshots: transitivePeerDependencies: - debug + '@sanity/color-input@4.0.1(react-dom@18.3.1(react@18.3.1))(react-is@19.0.0-rc-a7d1240c-20240731)(react@18.3.1)(sanity@packages+sanity)(styled-components@6.1.13(react-dom@18.3.1(react@18.3.1))(react@18.3.1))': + dependencies: + '@sanity/icons': 3.4.0(react@18.3.1) + '@sanity/incompatible-plugin': 1.0.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@sanity/ui': 2.8.9(react-dom@18.3.1(react@18.3.1))(react-is@19.0.0-rc-a7d1240c-20240731)(react@18.3.1)(styled-components@6.1.13(react-dom@18.3.1(react@18.3.1))(react@18.3.1)) + react: 18.3.1 + react-color: 2.19.3(react@18.3.1) + sanity: link:packages/sanity + styled-components: 6.1.13(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + use-effect-event: 1.0.2(react@18.3.1) + transitivePeerDependencies: + - react-dom + - react-is + '@sanity/color@3.0.6': {} '@sanity/core-loader@1.6.23(@sanity/client@6.21.3)': @@ -20220,6 +20270,8 @@ snapshots: dependencies: object-visit: 1.0.1 + material-colors@1.2.6: {} + math-random@1.0.4: {} md5-o-matic@0.1.1: {} @@ -21452,6 +21504,17 @@ snapshots: '@babel/runtime': 7.25.6 react: 18.3.1 + react-color@2.19.3(react@18.3.1): + dependencies: + '@icons/material': 0.2.4(react@18.3.1) + lodash: 4.17.21 + lodash-es: 4.17.21 + material-colors: 1.2.6 + prop-types: 15.8.1 + react: 18.3.1 + reactcss: 1.2.3(react@18.3.1) + tinycolor2: 1.6.0 + react-copy-to-clipboard@5.1.0(react@18.3.1): dependencies: copy-to-clipboard: 3.3.3 @@ -21619,6 +21682,11 @@ snapshots: react@19.0.0-rc-f994737d14-20240522: {} + reactcss@1.2.3(react@18.3.1): + dependencies: + lodash: 4.17.21 + react: 18.3.1 + read-cmd-shim@4.0.0: {} read-package-json-fast@3.0.2: @@ -22853,6 +22921,8 @@ snapshots: tiny-warning@1.0.3: {} + tinycolor2@1.6.0: {} + tmp@0.0.33: dependencies: os-tmpdir: 1.0.2