@uiw/react-color-colorful - npm Package Compare versions

Comparing version 1.0.12 to 1.1.0

cjs/index.d.ts

@@ -7,4 +7,5 @@ import React from 'react';
     color?: string | HsvaColor;
+    disableAlpha?: boolean;
 }
 declare const Colorful: React.ForwardRefExoticComponent<ColorfulProps & React.RefAttributes<HTMLDivElement>>;
 export default Colorful;

cjs/index.js

@@ -29,3 +29,3 @@ "use strict";
 var _excluded = ["style", "color"],
-    _excluded2 = ["prefixCls", "className", "onChange", "color", "style"];
+    _excluded2 = ["prefixCls", "className", "onChange", "color", "style", "disableAlpha"];
 
@@ -67,2 +67,3 @@ var Pointer = function Pointer(_ref) {
       style = props.style,
+      disableAlpha = props.disableAlpha,
       other = (0, _objectWithoutProperties2["default"])(props, _excluded2);
@@ -112,2 +113,3 @@ var hsva = typeof color === 'string' && (0, _colorConvert.validHex)(color) ? (0, _colorConvert.hexToHsva)(color) : color || {};
       height: 24,
+      radius: disableAlpha ? '0 0 8px 8px' : 0,
       className: prefixCls,
@@ -126,3 +128,3 @@ onChange: function onChange(newHue) {
       }
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactColorAlpha["default"], {
+    }), !disableAlpha && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactColorAlpha["default"], {
       hsva: hsva,
@@ -129,0 +131,0 @@ height: 24,

esm/index.d.ts

@@ -7,4 +7,5 @@ import React from 'react';
     color?: string | HsvaColor;
+    disableAlpha?: boolean;
 }
 declare const Colorful: React.ForwardRefExoticComponent<ColorfulProps & React.RefAttributes<HTMLDivElement>>;
 export default Colorful;

esm/index.js

 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["style", "color"],
-    _excluded2 = ["prefixCls", "className", "onChange", "color", "style"];
+    _excluded2 = ["prefixCls", "className", "onChange", "color", "style", "disableAlpha"];
 import React from 'react';
@@ -50,3 +50,4 @@ import { validHex, color as handleColor, hexToHsva, hsvaToHex, hsvaToRgbaString } from '@uiw/color-convert';
     color,
-    style
+    style,
+    disableAlpha
   } = props,
@@ -96,2 +97,3 @@ other = _objectWithoutPropertiesLoose(props, _excluded2);
       height: 24,
+      radius: disableAlpha ? '0 0 8px 8px' : 0,
       className: prefixCls,
@@ -110,3 +112,3 @@ onChange: newHue => handleChange(_extends({}, hsva, newHue)),
       }
-    }), /*#__PURE__*/_jsx(Alpha, {
+    }), !disableAlpha && /*#__PURE__*/_jsx(Alpha, {
       hsva: hsva,
@@ -113,0 +115,0 @@ height: 24,

package.json

 {
   "name": "@uiw/react-color-colorful",
-  "version": "1.0.12",
+  "version": "1.1.0",
   "description": "Color Colorful",
@@ -39,7 +39,7 @@ "author": "Kenny Wong <[e-mail]>",
     "@babel/runtime": "~7.18.0",
-    "@uiw/color-convert": "1.0.12",
-    "@uiw/react-color-alpha": "1.0.12",
-    "@uiw/react-color-hue": "1.0.12",
-    "@uiw/react-color-saturation": "1.0.12"
+    "@uiw/color-convert": "1.1.0",
+    "@uiw/react-color-alpha": "1.1.0",
+    "@uiw/react-color-hue": "1.1.0",
+    "@uiw/react-color-saturation": "1.1.0"
   }
 }

README.md

@@ -41,2 +41,36 @@ React Color Colorful
 
+```jsx mdx:preview
+import React, { useState } from 'react';
+import Colorful from '@uiw/react-color-colorful';
+
+function Demo() {
+  const [hex, setHex] = useState("#59c09a");
+  const [disableAlpha, setDisableAlpha] = useState(false);
+  return (
+    <>
+      <label>
+        <input
+          type="checkbox"
+          checked={disableAlpha}
+          onChange={(evn) => setDisableAlpha(evn.target.checked)}
+        />
+        {disableAlpha ? "Hide" : "Show"} Alpha
+      </label>
+      <Colorful
+        color={hex}
+        disableAlpha={disableAlpha}
+        onChange={(color) => {
+          setHex(color.hexa);
+        }}
+      />
+      <div style={{ background: hex, marginTop: 30, padding: 10 }}>
+        {hex}
+      </div>
+    </>
+  );
+}
+export default Demo;
+```
+
+
 ## Props
@@ -51,2 +85,3 @@
   color?: string | HsvaColor;
+  disableAlpha?: boolean;
 }
@@ -53,0 +88,0 @@ ```

No alert changes

Improved metrics

Total package byte prevSize

29232

6.24%

Lines of code

371

2.77%

Number of lines in readme file

93

60.34%

Dependency changes

• + Added

  @uiw/color-convert@1.1.0
  (transitive)

• + Added

  @uiw/react-color-alpha@1.1.0
  (transitive)

• + Added

  @uiw/react-color-hue@1.1.0
  (transitive)

• + Added

  @uiw/react-color-saturation@1.1.0
  (transitive)

• + Added

  @uiw/react-drag-event-interactive@1.1.0
  (transitive)

• - Removed

  @uiw/color-convert@1.0.12
  (transitive)

• - Removed

  @uiw/react-color-alpha@1.0.12
  (transitive)

• - Removed

  @uiw/react-color-hue@1.0.12
  (transitive)

• - Removed

  @uiw/react-color-saturation@1.0.12
  (transitive)

• - Removed

  @uiw/react-drag-event-interactive@1.0.12
  (transitive)

• Updated

  @uiw/color-convert@1.1.0

• Updated

  @uiw/react-color-alpha@1.1.0

• Updated

  @uiw/react-color-hue@1.1.0

• Updated

  @uiw/react-color-saturation@1.1.0