@sanity/color-input 2.35.2 → 2.36.0-v2-studio.1

package/.eslintrc.js

@@ -0,0 +1,25 @@
+module.exports = {
+  root: true,
+  parser: '@babel/eslint-parser',
+  globals: {
+    __DEV__: true,
+    JSX: true,
+  },
+  env: {
+    node: true,
+    browser: true,
+  },
+  settings: {
+    react: {version: '16.9.0'},
+  },
+  extends: ['sanity', 'sanity/react', 'plugin:react-hooks/recommended', 'prettier'],
+  rules: {
+    camelcase: ['error', {allow: ['^unstable_', '^Unstable_']}],
+    'prettier/prettier': 'error',
+    'react/prop-types': 'off',
+    'react/forbid-prop-types': 'off',
+    'react/jsx-no-bind': 'off',
+    'react/require-default-props': 'off',
+  },
+  plugins: ['prettier', 'react'],
+}

package/.github/workflows/main.yml

@@ -0,0 +1,133 @@
+---
+name: CI & Release
+
+# Workflow name based on selected inputs. Fallback to default Github naming when expression evaluates to empty string
+run-name: >-
+  ${{
+    inputs.release && inputs.test && format('Build {0} ➤ Test ➤ Publish to NPM', github.ref_name)  ||
+    inputs.release && !inputs.test && format('Build {0} ➤ Skip Tests ➤ Publish to NPM', github.ref_name) ||
+    github.event_name == 'workflow_dispatch' && inputs.test && format('Build {0} ➤ Test', github.ref_name) ||
+    github.event_name == 'workflow_dispatch' && !inputs.test && format('Build {0} ➤ Skip Tests', github.ref_name) ||
+    ''
+  }}
+
+on:
+  # Build on pushes branches that have a PR (including drafts)
+  pull_request:
+  # Build on commits pushed to branches without a PR if it's in the allowlist
+  push:
+    branches: [main,studio-v2]
+  # https://docs.github.com/en/actions/managing-workflow-runs/manually-running-a-workflow
+  workflow_dispatch:
+    inputs:
+      test:
+        description: Run tests
+        required: true
+        default: true
+        type: boolean
+      release:
+        description: Release new version
+        required: true
+        default: false
+        type: boolean
+
+concurrency:
+  # On PRs builds will cancel if new pushes happen before the CI completes, as it defines `github.head_ref` and gives it the name of the branch the PR wants to merge into
+  # Otherwise `github.run_id` ensures that you can quickly merge a queue of PRs without causing tests to auto cancel on any of the commits pushed to main.
+  group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
+  cancel-in-progress: true
+
+jobs:
+  log-the-inputs:
+    name: Log inputs
+    runs-on: ubuntu-latest
+    steps:
+      - run: |
+          echo "Inputs: $INPUTS"
+        env:
+          INPUTS: ${{ toJSON(inputs) }}
+
+  build:
+    runs-on: ubuntu-latest
+    name: Lint & Build
+    steps:
+      - uses: actions/checkout@93ea575cb5d8a053eaa0ac8fa3b40d7e05a33cc8 # tag=v3
+      - uses: actions/setup-node@8c91899e586c5b171469028077307d293428b516 # tag=v3
+        with:
+          cache: npm
+          node-version: lts/*
+      - run: npm ci
+        # Linting can be skipped
+      - run: npm run lint --if-present
+        if: github.event.inputs.test != 'false'
+        # But not the build script, as semantic-release will crash if this command fails so it makes sense to test it early
+      - run: npm run prepublishOnly --if-present
+
+  #  test:
+  #    needs: build
+  #    # The test matrix can be skipped, in case a new release needs to be fast-tracked and tests are already passing on main
+  #    if: github.event.inputs.test != 'false'
+  #    runs-on: ${{ matrix.os }}
+  #    name: Node.js ${{ matrix.node }} / ${{ matrix.os }}
+  #    strategy:
+  #      # A test failing on windows doesn't mean it'll fail on macos. It's useful to let all tests run to its completion to get the full picture
+  #      fail-fast: false
+  #      matrix:
+  #        # Run the testing suite on each major OS with the latest LTS release of Node.js
+  #        os: [macos-latest, ubuntu-latest, windows-latest]
+  #        node: [lts/*]
+  #        # It makes sense to also test the oldest, and latest, versions of Node.js, on ubuntu-only since it's the fastest CI runner
+  #        include:
+  #          - os: ubuntu-latest
+  #            # Test the oldest LTS release of Node that's still receiving bugfixes and security patches, versions older than that have reached End-of-Life
+  #            node: lts/-2
+  #          - os: ubuntu-latest
+  #            # Test the actively developed version that will become the latest LTS release next October
+  #            node: current
+  #    steps:
+  #      # It's only necessary to do this for windows, as mac and ubuntu are sane OS's that already use LF
+  #      - name: Set git to use LF
+  #        if: matrix.os == 'windows-latest'
+  #        run: |
+  #          git config --global core.autocrlf false
+  #          git config --global core.eol lf
+  #      - uses: actions/checkout@93ea575cb5d8a053eaa0ac8fa3b40d7e05a33cc8 # tag=v3
+  #      - uses: actions/setup-node@8c91899e586c5b171469028077307d293428b516 # tag=v3
+  #        with:
+  #          cache: npm
+  #          node-version: ${{ matrix.node }}
+  #      - run: npm i
+  #      - run: npm test --if-present
+
+  release:
+    # needs: [build, test]
+    needs: [build]
+    # only run if opt-in during workflow_dispatch
+    if: always() && github.event.inputs.release == 'true' && needs.build.result != 'failure' && needs.test.result != 'failure' && needs.test.result != 'cancelled'
+    runs-on: ubuntu-latest
+    name: Semantic release
+    steps:
+      - uses: actions/checkout@93ea575cb5d8a053eaa0ac8fa3b40d7e05a33cc8 # tag=v3
+        with:
+          # Need to fetch entire commit history to
+          # analyze every commit since last release
+          fetch-depth: 0
+      - uses: actions/setup-node@8c91899e586c5b171469028077307d293428b516 # tag=v3
+        with:
+          cache: npm
+          node-version: lts/*
+      - run: npm ci
+        # Branches that will release new versions are defined in .releaserc.json
+      - run: npx semantic-release
+        # Don't allow interrupting the release step if the job is cancelled, as it can lead to an inconsistent state
+        # e.g. git tags were pushed but it exited before `npm publish`
+        if: always()
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_PUBLISH_TOKEN }}
+        # Re-run semantic release with rich logs if it failed to publish for easier debugging
+      - run: npx semantic-release --dry-run --debug
+        if: failure()
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_PUBLISH_TOKEN }}

package/.husky/commit-msg

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx --no -- commitlint --edit ""

package/.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx lint-staged

package/.prettierrc

@@ -0,0 +1,8 @@
+{
+  "semi": false,
+  "printWidth": 100,
+  "bracketSpacing": false,
+  "singleQuote": true,
+  "useTabs": false,
+  "endOfLine": "lf"
+}

package/.releaserc.json

@@ -0,0 +1,4 @@
+{
+  "extends": "@sanity/semantic-release-preset",
+  "branches": ["main", {"name": "studio-v2", "channel": "studio-v2", "prerelease": "v2-studio"}]
+}

package/CHANGELOG.md

@@ -0,0 +1,12 @@
+<!-- markdownlint-disable --><!-- textlint-disable -->
+
+# 📓 Changelog
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [2.36.0-v2-studio.1](https://github.com/sanity-io/color-input/compare/v2.35.2...v2.36.0-v2-studio.1) (2022-11-23)
+
+### Features
+
+- @sanity/color-input (standalone) for Sanity Studio v2 ([d3a8655](https://github.com/sanity-io/color-input/commit/d3a8655747e6e52c4f09486ea7970b029f80b860))

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2016 - 2022 Sanity.io
+Copyright (c) 2022 - 2022 Sanity.io
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -1,11 +1,21 @@
 # @sanity/color-input
 
+> This is a **Sanity Studio v2** plugin.
+> For the v3 version, please refer to the [v3-branch](https://github.com/sanity-io/color-input).
+
 Color input for [Sanity](https://sanity.io/) that stores selected colors in hex, hsl, hsv and rgb format.
 
 ## Installation
 
+```sh
+yarn add @sanity/color-input@studio-v2
 ```
-sanity install @sanity/color-input
+
+Next, add `"@sanity/color-input"` to `sanity.json` plugins array:
+```json
+"plugins": [
+@sanity/color-input
+]
 ```
 
 ## Usage

package/commitlint.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  extends: ['@commitlint/config-conventional'],
+}

package/lib/ColorInput.js

@@ -4,17 +4,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _debounce2 = _interopRequireDefault(require("lodash/debounce"));
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _formBuilder = require("part:@sanity/form-builder");
+var _lodash = require("lodash");
 var _ui = require("@sanity/ui");
 var _icons = require("@sanity/icons");
 var _components = require("@sanity/base/components");
 var _ColorPicker = _interopRequireDefault(require("./ColorPicker"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 var set = _formBuilder.patches.set,
   unset = _formBuilder.patches.unset,
@@ -60,7 +60,7 @@ class ColorInput extends _react.PureComponent {
         _type: type.name
       }), set(type.name, ['_type']), set(nextColor.rgb.a, ['alpha']), ...fieldPatches]));
     });
-    _defineProperty(this, "handleColorChange", (0, _debounce2.default)(this.emitSetColor, 100));
+    _defineProperty(this, "handleColorChange", (0, _lodash.debounce)(this.emitSetColor, 100));
     _defineProperty(this, "handleCreateColor", () => {
       this.emitSetColor(DEFAULT_COLOR);
     });
@@ -117,4 +117,5 @@ _defineProperty(ColorInput, "propTypes", {
     hex: _propTypes.default.string,
     alpha: _propTypes.default.number
   })
-});
+});
+//# sourceMappingURL=ColorInput.js.map

package/lib/ColorInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorInput.js","names":["set","patches","unset","setIfMissing","DEFAULT_COLOR","hex","hsl","h","s","l","a","hsv","v","rgb","r","g","b","source","ColorInput","PureComponent","React","createRef","nextColor","props","onChange","type","fieldPatches","fields","filter","field","name","map","nextFieldValue","isObject","jsonType","Object","assign","_type","PatchEvent","from","debounce","emitSetColor","focus","focusRef","current","render","readOnly","value","level","title","description","handleColorChange","options","disableAlpha","handleUnset","AddIcon","Boolean","handleCreateColor","PropTypes","shape","string","arrayOf","isRequired","func","bool","alpha","number"],"sources":["../src/ColorInput.js"],"sourcesContent":["///<reference types=\"@sanity/types/parts\" />\n\n/* eslint-disable id-length */\nimport React, {PureComponent} from 'react'\nimport PropTypes from 'prop-types'\nimport {PatchEvent, patches} from 'part:@sanity/form-builder'\nimport {debounce} from 'lodash'\nimport {Button} from '@sanity/ui'\nimport {AddIcon} from '@sanity/icons'\nimport {FormField} from '@sanity/base/components'\nimport ColorPicker from './ColorPicker'\n\nconst {set, unset, setIfMissing} = patches\n\nconst DEFAULT_COLOR = {\n  hex: '#24a3e3',\n  hsl: {h: 200, s: 0.7732, l: 0.5156, a: 1},\n  hsv: {h: 200, s: 0.8414, v: 0.8901, a: 1},\n  rgb: {r: 46, g: 163, b: 227, a: 1},\n  source: 'hex',\n}\n\nexport default class ColorInput extends PureComponent {\n  focusRef = React.createRef()\n  static propTypes = {\n    type: PropTypes.shape({\n      name: PropTypes.string,\n      title: PropTypes.string,\n      description: PropTypes.string,\n      fields: PropTypes.arrayOf(\n        PropTypes.shape({\n          name: PropTypes.string.isRequired,\n        })\n      ),\n    }).isRequired,\n    onChange: PropTypes.func.isRequired,\n    readOnly: PropTypes.bool,\n    value: PropTypes.shape({\n      hex: PropTypes.string,\n      alpha: PropTypes.number,\n    }),\n  }\n\n  focus() {\n    // todo: make the ColorPicker component support .focus()\n    if (this.focusRef.current && this.focusRef.current.focus) {\n      this.focusRef.current.focus()\n    }\n  }\n\n  emitSetColor = (nextColor) => {\n    const {onChange, type} = this.props\n\n    const fieldPatches = type.fields\n      .filter((field) => field.name in nextColor)\n      .map((field) => {\n        const nextFieldValue = nextColor[field.name]\n        const isObject = field.type.jsonType === 'object'\n        return set(\n          isObject ? Object.assign({_type: field.type.name}, nextFieldValue) : nextFieldValue,\n          [field.name]\n        )\n      })\n\n    onChange(\n      PatchEvent.from([\n        setIfMissing({_type: type.name}),\n        set(type.name, ['_type']),\n        set(nextColor.rgb.a, ['alpha']),\n        ...fieldPatches,\n      ])\n    )\n  }\n\n  // The color picker emits onChange events continuously while the user is sliding the\n  // hue/saturation/alpha selectors. This debounces the event to avoid excessive patches\n  handleColorChange = debounce(this.emitSetColor, 100)\n\n  handleCreateColor = () => {\n    this.emitSetColor(DEFAULT_COLOR)\n  }\n\n  handleUnset = () => {\n    this.props.onChange(PatchEvent.from(unset()))\n  }\n\n  render() {\n    const {type, readOnly, value, level} = this.props\n    return (\n      <FormField title={type.title} description={type.description} level={level}>\n        {value ? (\n          <ColorPicker\n            ref={this.focusRef}\n            color={value.hsl || value.hex}\n            readOnly={readOnly || type.readOnly}\n            onChange={this.handleColorChange}\n            disableAlpha={type.options && type.options.disableAlpha}\n            onUnset={this.handleUnset}\n          />\n        ) : (\n          <Button\n            icon={AddIcon}\n            mode=\"ghost\"\n            text=\"Create color\"\n            ref={this.focusRef}\n            disabled={Boolean(readOnly)}\n            onClick={this.handleCreateColor}\n          />\n        )}\n      </FormField>\n    )\n  }\n}\n"],"mappings":"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"}

package/lib/ColorPicker.js

@@ -141,4 +141,5 @@ ColorPicker.defaultProps = {
   disableAlpha: false
 };
 var _default = (0, _common.ColorWrap)(ColorPicker);
-exports.default = _default;
+exports.default = _default;
+//# sourceMappingURL=ColorPicker.js.map

package/lib/ColorPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker.js","names":["ColorBox","styled","Box","ReadOnlyContainer","Flex","ColorPicker","width","rgb","hex","hsv","hsl","onChange","onUnset","disableAlpha","renderers","readOnly","position","height","minWidth","backgroundColor","r","g","b","a","Math","round","h","s","l","TrashIcon","propTypes","PropTypes","string","object","func","bool","defaultProps","ColorWrap"],"sources":["../src/ColorPicker.js"],"sourcesContent":["import React from 'react'\nimport PropTypes from 'prop-types'\nimport {ColorWrap, Checkboard, Saturation, Hue, Alpha} from 'react-color/lib/components/common'\nimport {Box, Card, Flex, Button, Inline, Stack, Text} from '@sanity/ui'\nimport {TrashIcon} from '@sanity/icons'\nimport styled from 'styled-components'\nimport {ColorPickerFields} from './ColorPickerFields'\n\nconst ColorBox = styled(Box)`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n`\n\nconst ReadOnlyContainer = styled(Flex)`\n  margin-top: 6rem;\n  background-color: var(--card-bg-color);\n  position: relative;\n  width: 100%;\n`\n\nconst ColorPicker = ({\n  width,\n  rgb,\n  hex,\n  hsv,\n  hsl,\n  onChange,\n  onUnset,\n  disableAlpha,\n  renderers,\n  readOnly,\n}) => {\n  return (\n    <div style={{width}}>\n      <Card padding={1} border radius={1}>\n        <Stack space={2}>\n          {!readOnly && (\n            <>\n              <Card overflow=\"hidden\" style={{position: 'relative', height: '5em'}}>\n                <Saturation is=\"Saturation\" onChange={onChange} hsl={hsl} hsv={hsv} />\n              </Card>\n\n              <Card\n                shadow={1}\n                radius={3}\n                overflow=\"hidden\"\n                style={{position: 'relative', height: '10px'}}\n              >\n                <Hue is=\"Hue\" hsl={hsl} onChange={!readOnly && onChange} />\n              </Card>\n\n              {!disableAlpha && (\n                <Card\n                  shadow={1}\n                  radius={3}\n                  overflow=\"hidden\"\n                  style={{position: 'relative', height: '10px'}}\n                >\n                  <Alpha is=\"Alpha\" rgb={rgb} hsl={hsl} renderers={renderers} onChange={onChange} />\n                </Card>\n              )}\n            </>\n          )}\n          <Flex>\n            <Card\n              flex={1}\n              radius={2}\n              overflow=\"hidden\"\n              style={{position: 'relative', minWidth: '4em'}}\n            >\n              <Checkboard />\n              <ColorBox style={{backgroundColor: `rgba(${rgb.r},${rgb.g},${rgb.b},${rgb.a})`}} />\n\n              {readOnly && (\n                <ReadOnlyContainer\n                  padding={2}\n                  paddingBottom={1}\n                  sizing=\"border\"\n                  justify=\"space-between\"\n                >\n                  <Stack space={3} marginTop={1}>\n                    <Text size={3} weight=\"bold\">\n                      {hex}\n                    </Text>\n\n                    <Inline space={3}>\n                      <Text size={1}>\n                        <strong>RGB: </strong>\n                        {rgb.r} {rgb.g} {rgb.b}\n                      </Text>\n                      <Text size={1}>\n                        <strong>HSL: </strong> {Math.round(hsl.h)} {Math.round(hsl.s)}%{' '}\n                        {Math.round(hsl.l)}\n                      </Text>\n                    </Inline>\n                  </Stack>\n                </ReadOnlyContainer>\n              )}\n            </Card>\n\n            {!readOnly && (\n              <Flex align=\"flex-start\" marginLeft={2}>\n                <Box style={{width: 200}}>\n                  <ColorPickerFields\n                    rgb={rgb}\n                    hsl={hsl}\n                    hex={hex}\n                    onChange={onChange}\n                    disableAlpha={disableAlpha}\n                  />\n                </Box>\n                <Box marginLeft={2}>\n                  <Button onClick={onUnset} title=\"Delete color\" icon={TrashIcon} tone=\"critical\" />\n                </Box>\n              </Flex>\n            )}\n          </Flex>\n        </Stack>\n      </Card>\n    </div>\n  )\n}\n\nColorPicker.propTypes = {\n  width: PropTypes.string,\n  hex: PropTypes.string,\n  hsl: PropTypes.object,\n  hsv: PropTypes.object,\n  rgb: PropTypes.object,\n  onChange: PropTypes.func,\n  disableAlpha: PropTypes.bool,\n  readOnly: PropTypes.bool,\n  renderers: PropTypes.func,\n  onUnset: PropTypes.func,\n}\n\nColorPicker.defaultProps = {\n  disableAlpha: false,\n}\n\nexport default ColorWrap(ColorPicker)\n"],"mappings":"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"}

package/lib/ColorPickerFields.js

@@ -121,4 +121,5 @@ var ColorPickerFields = _ref => {
 };
 exports.ColorPickerFields = ColorPickerFields;
 var _default = ColorPickerFields;
-exports.default = _default;
+exports.default = _default;
+//# sourceMappingURL=ColorPickerFields.js.map

package/lib/ColorPickerFields.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPickerFields.js","names":["ColorPickerFields","onChange","rgb","hsl","hex","disableAlpha","useTheme","sanity","inputStyles","input","width","padding","border","boxShadow","color","default","enabled","fg","backgroundColor","bg","fontSize","fonts","text","sizes","textAlign","label","display","base","paddingTop","paddingBottom","textTransform","handleChange","data","e","isValidHex","source","r","g","b","a","h","s","l","replace","Math","round"],"sources":["../src/ColorPickerFields.js"],"sourcesContent":["import React from 'react'\nimport * as color from 'react-color/lib/helpers/color'\nimport {EditableInput} from 'react-color/lib/components/common'\nimport {Box, Flex, useTheme} from '@sanity/ui'\n\nexport const ColorPickerFields = ({onChange, rgb, hsl, hex, disableAlpha}) => {\n  const {sanity} = useTheme()\n\n  const inputStyles = {\n    input: {\n      width: '80%',\n      padding: '4px 10% 3px',\n      border: 'none',\n      boxShadow: `inset 0 0 0 1px ${sanity.color.input.default.enabled.border}`,\n      color: sanity.color.input.default.enabled.fg,\n      backgroundColor: sanity.color.input.default.enabled.bg,\n      fontSize: sanity.fonts.text.sizes[0].fontSize,\n      textAlign: 'center',\n    },\n    label: {\n      display: 'block',\n      textAlign: 'center',\n      fontSize: sanity.fonts.label.sizes[0].fontSize,\n      color: sanity.color.base.fg,\n      paddingTop: '3px',\n      paddingBottom: '4px',\n      textTransform: 'capitalize',\n    },\n  }\n\n  const handleChange = (data, e) => {\n    if (data.hex && color.isValidHex(data.hex)) {\n      onChange(\n        {\n          hex: data.hex,\n          source: 'hex',\n        },\n        e\n      )\n    } else if (data.r || data.g || data.b) {\n      onChange(\n        {\n          r: data.r || rgb.r,\n          g: data.g || rgb.g,\n          b: data.b || rgb.b,\n          a: rgb.a,\n          source: 'rgb',\n        },\n        e\n      )\n    } else if (data.a) {\n      if (data.a < 0) {\n        data.a = 0\n      } else if (data.a > 100) {\n        data.a = 100\n      }\n\n      data.a /= 100\n      onChange(\n        {\n          h: hsl.h,\n          s: hsl.s,\n          l: hsl.l,\n          a: data.a,\n          source: 'rgb',\n        },\n        e\n      )\n    }\n  }\n\n  return (\n    <Flex>\n      <Box flex={2} marginRight={1}>\n        <EditableInput\n          style={inputStyles}\n          label=\"hex\"\n          value={hex.replace('#', '')}\n          onChange={handleChange}\n        />\n      </Box>\n      <Box flex={1} marginRight={1}>\n        <EditableInput\n          style={inputStyles}\n          label=\"r\"\n          value={rgb.r}\n          onChange={handleChange}\n          dragLabel=\"true\"\n          dragMax=\"255\"\n        />\n      </Box>\n      <Box flex={1} marginRight={1}>\n        <EditableInput\n          style={inputStyles}\n          label=\"g\"\n          value={rgb.g}\n          onChange={handleChange}\n          dragLabel=\"true\"\n          dragMax=\"255\"\n        />\n      </Box>\n      <Box flex={1} marginRight={1}>\n        <EditableInput\n          style={inputStyles}\n          label=\"b\"\n          value={rgb.b}\n          onChange={handleChange}\n          dragLabel=\"true\"\n          dragMax=\"255\"\n        />\n      </Box>\n      {!disableAlpha && (\n        <Box flex={1}>\n          <EditableInput\n            style={inputStyles}\n            label=\"a\"\n            value={Math.round(rgb.a * 100)}\n            onChange={handleChange}\n            dragLabel=\"true\"\n            dragMax=\"100\"\n          />\n        </Box>\n      )}\n    </Flex>\n  )\n}\n\nexport default ColorPickerFields\n"],"mappings":"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"}

package/lib/schemas/color.js

@@ -70,4 +70,5 @@ var _default = {
     }
   }
 };
-exports.default = _default;
+exports.default = _default;
+//# sourceMappingURL=color.js.map

package/lib/schemas/color.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"color.js","names":["round","val","Math","name","type","title","inputComponent","ColorInput","fields","preview","select","alpha","hex","hsl","prepare","subtitle","l","media","backgroundColor","opacity","position","height","width","top","left"],"sources":["../../src/schemas/color.js"],"sourcesContent":["/* eslint-disable react/display-name */\nimport React from 'react'\nimport ColorInput from '../ColorInput'\n\nconst round = (val) => Math.round(val * 100)\n\nexport default {\n  name: 'color',\n  type: 'object',\n  title: 'Color',\n  inputComponent: 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({title, hex, hsl, alpha}) {\n      let subtitle = hex || 'No color set'\n      if (hsl) {\n        subtitle = `H:${round(hsl.l)} S:${round(hsl.l)} 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"],"mappings":";;;;;;AACA;AACA;AAAsC;AAFtC;;AAIA,IAAMA,KAAK,GAAIC,GAAG,IAAKC,IAAI,CAACF,KAAK,CAACC,GAAG,GAAG,GAAG,CAAC;AAAA,eAE7B;EACbE,IAAI,EAAE,OAAO;EACbC,IAAI,EAAE,QAAQ;EACdC,KAAK,EAAE,OAAO;EACdC,cAAc,EAAEC,mBAAU;EAC1BC,MAAM,EAAE,CACN;IACEH,KAAK,EAAE,KAAK;IACZF,IAAI,EAAE,KAAK;IACXC,IAAI,EAAE;EACR,CAAC,EACD;IACEC,KAAK,EAAE,OAAO;IACdF,IAAI,EAAE,OAAO;IACbC,IAAI,EAAE;EACR,CAAC,EACD;IACEC,KAAK,EAAE,0BAA0B;IACjCF,IAAI,EAAE,KAAK;IACXC,IAAI,EAAE;EACR,CAAC,EACD;IACEC,KAAK,EAAE,sBAAsB;IAC7BF,IAAI,EAAE,KAAK;IACXC,IAAI,EAAE;EACR,CAAC,EACD;IACEC,KAAK,EAAE,sBAAsB;IAC7BF,IAAI,EAAE,KAAK;IACXC,IAAI,EAAE;EACR,CAAC,CACF;EACDK,OAAO,EAAE;IACPC,MAAM,EAAE;MACNL,KAAK,EAAE,KAAK;MACZM,KAAK,EAAE,OAAO;MACdC,GAAG,EAAE,KAAK;MACVC,GAAG,EAAE;IACP,CAAC;IACDC,OAAO,OAA2B;MAAA,IAAzBT,KAAK,QAALA,KAAK;QAAEO,GAAG,QAAHA,GAAG;QAAEC,GAAG,QAAHA,GAAG;QAAEF,KAAK,QAALA,KAAK;MAC7B,IAAII,QAAQ,GAAGH,GAAG,IAAI,cAAc;MACpC,IAAIC,GAAG,EAAE;QACPE,QAAQ,eAAQf,KAAK,CAACa,GAAG,CAACG,CAAC,CAAC,gBAAMhB,KAAK,CAACa,GAAG,CAACG,CAAC,CAAC,gBAAMhB,KAAK,CAACa,GAAG,CAACG,CAAC,CAAC,gBAAMhB,KAAK,CAACW,KAAK,CAAC,CAAE;MACtF;MACA,OAAO;QACLN,KAAK,EAAEA,KAAK;QACZU,QAAQ,EAAEA,QAAQ;QAClBE,KAAK,EAAE,mBACL;UACE,KAAK,EAAE;YACLC,eAAe,EAAEN,GAAG,IAAI,MAAM;YAC9BO,OAAO,EAAER,KAAK,IAAI,CAAC;YACnBS,QAAQ,EAAE,UAAU;YACpBC,MAAM,EAAE,MAAM;YACdC,KAAK,EAAE,MAAM;YACbC,GAAG,EAAE,GAAG;YACRC,IAAI,EAAE;UACR;QAAE;MAGR,CAAC;IACH;EACF;AACF,CAAC;AAAA"}

package/lib/schemas/hslaColor.js

@@ -26,4 +26,5 @@ var _default = {
     title: 'Alpha'
   }]
 };
-exports.default = _default;
+exports.default = _default;
+//# sourceMappingURL=hslaColor.js.map

package/lib/schemas/hslaColor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hslaColor.js","names":["title","name","type","fields"],"sources":["../../src/schemas/hslaColor.js"],"sourcesContent":["export default {\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"],"mappings":";;;;;;eAAe;EACbA,KAAK,EAAE,0BAA0B;EACjCC,IAAI,EAAE,WAAW;EACjBC,IAAI,EAAE,QAAQ;EACdC,MAAM,EAAE,CACN;IAACF,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAK,CAAC,EACzC;IAACC,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAY,CAAC,EAChD;IAACC,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAW,CAAC,EAC/C;IAACC,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAO,CAAC;AAE/C,CAAC;AAAA"}

package/lib/schemas/hsvaColor.js

@@ -26,4 +26,5 @@ var _default = {
     title: 'Alpha'
   }]
 };
-exports.default = _default;
+exports.default = _default;
+//# sourceMappingURL=hsvaColor.js.map

package/lib/schemas/hsvaColor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hsvaColor.js","names":["title","name","type","fields"],"sources":["../../src/schemas/hsvaColor.js"],"sourcesContent":["export default {\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"],"mappings":";;;;;;eAAe;EACbA,KAAK,EAAE,sBAAsB;EAC7BC,IAAI,EAAE,WAAW;EACjBC,IAAI,EAAE,QAAQ;EACdC,MAAM,EAAE,CACN;IAACF,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAK,CAAC,EACzC;IAACC,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAY,CAAC,EAChD;IAACC,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAO,CAAC,EAC3C;IAACC,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAO,CAAC;AAE/C,CAAC;AAAA"}

package/lib/schemas/rgbaColor.js

@@ -26,4 +26,5 @@ var _default = {
     title: 'Alpha'
   }]
 };
-exports.default = _default;
+exports.default = _default;
+//# sourceMappingURL=rgbaColor.js.map

package/lib/schemas/rgbaColor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rgbaColor.js","names":["title","name","type","fields"],"sources":["../../src/schemas/rgbaColor.js"],"sourcesContent":["export default {\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"],"mappings":";;;;;;eAAe;EACbA,KAAK,EAAE,sBAAsB;EAC7BC,IAAI,EAAE,WAAW;EACjBC,IAAI,EAAE,QAAQ;EACdC,MAAM,EAAE,CACN;IAACF,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAK,CAAC,EACzC;IAACC,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAO,CAAC,EAC3C;IAACC,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAM,CAAC,EAC1C;IAACC,IAAI,EAAE,GAAG;IAAEC,IAAI,EAAE,QAAQ;IAAEF,KAAK,EAAE;EAAO,CAAC;AAE/C,CAAC;AAAA"}

package/lint-staged.config.js

@@ -0,0 +1,4 @@
+module.exports = {
+  '**/*.{js,jsx}': ['eslint'],
+  '**/*.{ts,tsx}': ['eslint', () => 'tsc --noEmit'],
+}

package/package.json

@@ -1,13 +1,7 @@
 {
   "name": "@sanity/color-input",
-  "version": "2.35.2",
-  "description": "Color input",
-  "main": "lib/index.js",
-  "author": "Sanity.io <hello@sanity.io>",
-  "license": "MIT",
-  "scripts": {
-    "clean": "rimraf lib dest"
-  },
+  "version": "2.36.0-v2-studio.1",
+  "description": "Color input for Sanity Studio",
   "keywords": [
     "sanity",
     "cms",
@@ -17,6 +11,26 @@
     "color-input",
     "sanity-plugin"
   ],
+  "homepage": "https://www.sanity.io/",
+  "bugs": {
+    "url": "git@github.com:sanity-io//issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git@github.com:sanity-io/color-input.git"
+  },
+  "license": "MIT",
+  "author": "Sanity.io <hello@sanity.io>",
+  "main": "lib/schemas/color.js",
+  "scripts": {
+    "prebuild": "npm run clean",
+    "build": "sanipack build",
+    "clean": "rimraf lib",
+    "lint": "eslint .",
+    "prepare": "husky install",
+    "prepublishOnly": "sanipack build",
+    "watch": "sanipack build --watch"
+  },
   "dependencies": {
     "@sanity/icons": "^1.3.4",
     "@sanity/ui": "^0.37.22",
@@ -24,10 +38,24 @@
     "react-color": "^2.13.8"
   },
   "devDependencies": {
+    "@commitlint/cli": "^17.3.0",
+    "@commitlint/config-conventional": "^17.3.0",
     "@sanity/base": "2.35.2",
+    "@sanity/semantic-release-preset": "^2.0.1",
     "@sanity/types": "2.35.0",
+    "eslint": "^8.27.0",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-config-sanity": "^6.0.0",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-react": "^7.31.10",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "husky": "^8.0.1",
+    "lint-staged": "^13.0.3",
+    "prettier": "^2.7.1",
+    "prettier-plugin-packagejson": "^2.3.0",
     "react": "17.0.1",
-    "rimraf": "^2.7.1"
+    "rimraf": "^2.7.1",
+    "sanipack": "^2.1.0"
   },
   "peerDependencies": {
     "@sanity/base": "^2.14",
@@ -36,17 +64,7 @@
     "react": "^16.9 || ^17",
     "styled-components": "^5.2.0"
   },
-  "bugs": {
-    "url": "https://github.com/sanity-io/sanity/issues"
-  },
-  "homepage": "https://www.sanity.io/",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/sanity-io/sanity.git",
-    "directory": "packages/@sanity/color-input"
-  },
   "publishConfig": {
     "access": "public"
-  },
-  "gitHead": "9bf408d4cc8b3e14bac0bf94d3305d6960181d3c"
+  }
 }

package/sanity.json

@@ -5,11 +5,11 @@
   },
   "parts": [
     {
-      "name": "part:@sanity/form-builder/input/color",
+      "name": "part:@sanity/color-input/input/color",
       "description": "Color input"
     },
     {
-      "implements": "part:@sanity/form-builder/input/color",
+      "implements": "part:@sanity/color-input/input/color",
       "path": "ColorInput"
     },
     {