@arch-ui/controls - npm Package Compare versions

Comparing version 0.1.9 to 0.1.10

CHANGELOG.md

 # @arch-ui/controls
 
+## 0.1.10
+
+### Patch Changes
+
+- [`04bf1e4bb`](https://github.com/keystonejs/keystone-5/commit/04bf1e4bb0223f4e2e06664bbc9e95c51118eb84) [#2](https://github.com/keystonejs/keystone-5/pull/2) Thanks [@bladey](https://github.com/bladey)! - Updated repository URL in package.json.
+
+- Updated dependencies [[`04bf1e4bb`](https://github.com/keystonejs/keystone-5/commit/04bf1e4bb0223f4e2e06664bbc9e95c51118eb84)]:
+  - @arch-ui/input@0.1.12
+  - @arch-ui/theme@0.0.12
+
 ## 0.1.9
@@ -7,9 +17,9 @@
 
-- [`5935b89f8`](https://github.com/keystonejs/keystone/commit/5935b89f8862b36f14d09da68f056f759a860f3e) [#3477](https://github.com/keystonejs/keystone/pull/3477) Thanks [@Noviny](https://github.com/Noviny)! - Updating dependencies:
+- [`5935b89f8`](https://github.com/keystonejs/keystone-5/commit/5935b89f8862b36f14d09da68f056f759a860f3e) [#3477](https://github.com/keystonejs/keystone-5/pull/3477) Thanks [@Noviny](https://github.com/Noviny)! - Updating dependencies:
 
   These changes bring the keystone dev experience inline with installing keystone from npm :D
 
-* [`0fc878fa9`](https://github.com/keystonejs/keystone/commit/0fc878fa918c3196196f943f195ffaa62fce504b) [#3439](https://github.com/keystonejs/keystone/pull/3439) Thanks [@renovate](https://github.com/apps/renovate)! - Updated babel dependencies.
+* [`0fc878fa9`](https://github.com/keystonejs/keystone-5/commit/0fc878fa918c3196196f943f195ffaa62fce504b) [#3439](https://github.com/keystonejs/keystone-5/pull/3439) Thanks [@renovate](https://github.com/apps/renovate)! - Updated babel dependencies.
 
-* Updated dependencies [[`5935b89f8`](https://github.com/keystonejs/keystone/commit/5935b89f8862b36f14d09da68f056f759a860f3e), [`0fc878fa9`](https://github.com/keystonejs/keystone/commit/0fc878fa918c3196196f943f195ffaa62fce504b)]:
+* Updated dependencies [[`5935b89f8`](https://github.com/keystonejs/keystone-5/commit/5935b89f8862b36f14d09da68f056f759a860f3e), [`0fc878fa9`](https://github.com/keystonejs/keystone-5/commit/0fc878fa918c3196196f943f195ffaa62fce504b)]:
   - @arch-ui/input@0.1.11
@@ -22,5 +32,5 @@ - @arch-ui/theme@0.0.11
 
-- [`577b5e69`](https://github.com/keystonejs/keystone/commit/577b5e69ac4f949d1be2a80d8f391cb0a4b1333a) [#2799](https://github.com/keystonejs/keystone/pull/2799) Thanks [@MadeByMike](https://github.com/MadeByMike)! - Upgraded React and Emotion packages.
+- [`577b5e69`](https://github.com/keystonejs/keystone-5/commit/577b5e69ac4f949d1be2a80d8f391cb0a4b1333a) [#2799](https://github.com/keystonejs/keystone-5/pull/2799) Thanks [@MadeByMike](https://github.com/MadeByMike)! - Upgraded React and Emotion packages.
 
-- Updated dependencies [[`577b5e69`](https://github.com/keystonejs/keystone/commit/577b5e69ac4f949d1be2a80d8f391cb0a4b1333a)]:
+- Updated dependencies [[`577b5e69`](https://github.com/keystonejs/keystone-5/commit/577b5e69ac4f949d1be2a80d8f391cb0a4b1333a)]:
   - @arch-ui/input@0.1.9
@@ -32,3 +42,3 @@
 
-- [`81822d67`](https://github.com/keystonejs/keystone/commit/81822d67822bdc77b360b709f2e824cc43d88f15) [#2731](https://github.com/keystonejs/keystone/pull/2731) Thanks [@Vultraz](https://github.com/Vultraz)! - Cleaned up Control component implementation.
+- [`81822d67`](https://github.com/keystonejs/keystone-5/commit/81822d67822bdc77b360b709f2e824cc43d88f15) [#2731](https://github.com/keystonejs/keystone-5/pull/2731) Thanks [@Vultraz](https://github.com/Vultraz)! - Cleaned up Control component implementation.
 
@@ -39,3 +49,3 @@ ## 0.1.6
 
-- Updated dependencies [[`0de5f232`](https://github.com/keystonejs/keystone/commit/0de5f2321ef8f9fe6dd247c3201372a4156e61e9)]:
+- Updated dependencies [[`0de5f232`](https://github.com/keystonejs/keystone-5/commit/0de5f2321ef8f9fe6dd247c3201372a4156e61e9)]:
   - @arch-ui/theme@0.0.10
@@ -48,7 +58,7 @@ - @arch-ui/input@0.1.7
 
-- [`6b353eff`](https://github.com/keystonejs/keystone/commit/6b353effc8b617137a3978b2c845e01403889722) Thanks [@timleslie](https://github.com/timleslie)! - Upgraded React to 16.13.0.
+- [`6b353eff`](https://github.com/keystonejs/keystone-5/commit/6b353effc8b617137a3978b2c845e01403889722) Thanks [@timleslie](https://github.com/timleslie)! - Upgraded React to 16.13.0.
 
-* [`5ba330b8`](https://github.com/keystonejs/keystone/commit/5ba330b8b2609ea0033a636daf9a215a5a192c20) [#2487](https://github.com/keystonejs/keystone/pull/2487) Thanks [@Noviny](https://github.com/Noviny)! - Small changes to package.json (mostly adding a repository field)
+* [`5ba330b8`](https://github.com/keystonejs/keystone-5/commit/5ba330b8b2609ea0033a636daf9a215a5a192c20) [#2487](https://github.com/keystonejs/keystone-5/pull/2487) Thanks [@Noviny](https://github.com/Noviny)! - Small changes to package.json (mostly adding a repository field)
 
-* Updated dependencies [[`6b353eff`](https://github.com/keystonejs/keystone/commit/6b353effc8b617137a3978b2c845e01403889722), [`5ba330b8`](https://github.com/keystonejs/keystone/commit/5ba330b8b2609ea0033a636daf9a215a5a192c20)]:
+* Updated dependencies [[`6b353eff`](https://github.com/keystonejs/keystone-5/commit/6b353effc8b617137a3978b2c845e01403889722), [`5ba330b8`](https://github.com/keystonejs/keystone-5/commit/5ba330b8b2609ea0033a636daf9a215a5a192c20)]:
   - @arch-ui/input@0.1.6
@@ -61,7 +71,7 @@ - @arch-ui/theme@0.0.9
 
-- [`d8a7b8a2`](https://github.com/keystonejs/keystone/commit/d8a7b8a23b4c3e1545d101a92323be165ad362e2) [#2395](https://github.com/keystonejs/keystone/pull/2395) Thanks [@timleslie](https://github.com/timleslie)! - Upgraded all `@emotion.*` dependencies.
+- [`d8a7b8a2`](https://github.com/keystonejs/keystone-5/commit/d8a7b8a23b4c3e1545d101a92323be165ad362e2) [#2395](https://github.com/keystonejs/keystone-5/pull/2395) Thanks [@timleslie](https://github.com/timleslie)! - Upgraded all `@emotion.*` dependencies.
 
-* [`dcdd8ed9`](https://github.com/keystonejs/keystone/commit/dcdd8ed9142cf3328a7af80bc167ef93c7669b09) [#2381](https://github.com/keystonejs/keystone/pull/2381) Thanks [@timleslie](https://github.com/timleslie)! - Updated `@babel/*` dependency packages to latest versions.
+* [`dcdd8ed9`](https://github.com/keystonejs/keystone-5/commit/dcdd8ed9142cf3328a7af80bc167ef93c7669b09) [#2381](https://github.com/keystonejs/keystone-5/pull/2381) Thanks [@timleslie](https://github.com/timleslie)! - Updated `@babel/*` dependency packages to latest versions.
 
-* Updated dependencies [[`d8a7b8a2`](https://github.com/keystonejs/keystone/commit/d8a7b8a23b4c3e1545d101a92323be165ad362e2), [`dcdd8ed9`](https://github.com/keystonejs/keystone/commit/dcdd8ed9142cf3328a7af80bc167ef93c7669b09)]:
+* Updated dependencies [[`d8a7b8a2`](https://github.com/keystonejs/keystone-5/commit/d8a7b8a23b4c3e1545d101a92323be165ad362e2), [`dcdd8ed9`](https://github.com/keystonejs/keystone-5/commit/dcdd8ed9142cf3328a7af80bc167ef93c7669b09)]:
   - @arch-ui/input@0.1.5
@@ -74,4 +84,4 @@ - @arch-ui/theme@0.0.8
 
-- [`38f88b62`](https://github.com/keystonejs/keystone/commit/38f88b62d9592d91b56528d4d9c40e9399440c4a) [#2144](https://github.com/keystonejs/keystone/pull/2144) - Upgraded all @babel/\* dependencies.
-- Updated dependencies [[`38f88b62`](https://github.com/keystonejs/keystone/commit/38f88b62d9592d91b56528d4d9c40e9399440c4a)]:
+- [`38f88b62`](https://github.com/keystonejs/keystone-5/commit/38f88b62d9592d91b56528d4d9c40e9399440c4a) [#2144](https://github.com/keystonejs/keystone-5/pull/2144) - Upgraded all @babel/\* dependencies.
+- Updated dependencies [[`38f88b62`](https://github.com/keystonejs/keystone-5/commit/38f88b62d9592d91b56528d4d9c40e9399440c4a)]:
   - @arch-ui/input@0.1.4
@@ -84,4 +94,4 @@ - @arch-ui/theme@0.0.7
 
-- [`129b0f6`](https://github.com/keystonejs/keystone/commit/129b0f61f34adb7482901d2da4ddb14ce1aedd62) [#2092](https://github.com/keystonejs/keystone/pull/2092) - Upgrade all Babel deps to the same version (7.7.4)
-- Updated dependencies [[`129b0f6`](https://github.com/keystonejs/keystone/commit/129b0f61f34adb7482901d2da4ddb14ce1aedd62)]:
+- [`129b0f6`](https://github.com/keystonejs/keystone-5/commit/129b0f61f34adb7482901d2da4ddb14ce1aedd62) [#2092](https://github.com/keystonejs/keystone-5/pull/2092) - Upgrade all Babel deps to the same version (7.7.4)
+- Updated dependencies [[`129b0f6`](https://github.com/keystonejs/keystone-5/commit/129b0f61f34adb7482901d2da4ddb14ce1aedd62)]:
   - @arch-ui/input@0.1.3
@@ -94,4 +104,4 @@ - @arch-ui/theme@0.0.6
 
-- [`946a52fd`](https://github.com/keystonejs/keystone/commit/946a52fd7057bb73f4ffd465ef51498172926866) [#1995](https://github.com/keystonejs/keystone/pull/1995) Thanks [@Vultraz](https://github.com/Vultraz)! - Updated `react` and `react-dom` to 16.12.0.
-- Updated dependencies [[`946a52fd`](https://github.com/keystonejs/keystone/commit/946a52fd7057bb73f4ffd465ef51498172926866)]:
+- [`946a52fd`](https://github.com/keystonejs/keystone-5/commit/946a52fd7057bb73f4ffd465ef51498172926866) [#1995](https://github.com/keystonejs/keystone-5/pull/1995) Thanks [@Vultraz](https://github.com/Vultraz)! - Updated `react` and `react-dom` to 16.12.0.
+- Updated dependencies [[`946a52fd`](https://github.com/keystonejs/keystone-5/commit/946a52fd7057bb73f4ffd465ef51498172926866)]:
   - @arch-ui/input@0.1.2
@@ -103,10 +113,10 @@
 
-- [`3138013c`](https://github.com/keystonejs/keystone/commit/3138013c49205bd7f9b05833ae6158ebeb281dc0) [#1913](https://github.com/keystonejs/keystone/pull/1913) Thanks [@jordanoverbye](https://github.com/jordanoverbye)! - Improved a11y for the `Checkbox` field.
+- [`3138013c`](https://github.com/keystonejs/keystone-5/commit/3138013c49205bd7f9b05833ae6158ebeb281dc0) [#1913](https://github.com/keystonejs/keystone-5/pull/1913) Thanks [@jordanoverbye](https://github.com/jordanoverbye)! - Improved a11y for the `Checkbox` field.
 
 ### Patch Changes
 
-- [`8226eb47`](https://github.com/keystonejs/keystone/commit/8226eb4709ea8ad5773c900eaaa96068d3cb6bad) [#1819](https://github.com/keystonejs/keystone/pull/1819) Thanks [@w01fgang](https://github.com/w01fgang)! - Upgraded `flow` and fixed flow errors and (probably) bugs.
+- [`8226eb47`](https://github.com/keystonejs/keystone-5/commit/8226eb4709ea8ad5773c900eaaa96068d3cb6bad) [#1819](https://github.com/keystonejs/keystone-5/pull/1819) Thanks [@w01fgang](https://github.com/w01fgang)! - Upgraded `flow` and fixed flow errors and (probably) bugs.
 
-* [`8226eb47`](https://github.com/keystonejs/keystone/commit/8226eb4709ea8ad5773c900eaaa96068d3cb6bad) [#1819](https://github.com/keystonejs/keystone/pull/1819) Thanks [@w01fgang](https://github.com/w01fgang)! - Upgraded `@emotion/core` and `@emotion/styled`.
-* Updated dependencies [[`8226eb47`](https://github.com/keystonejs/keystone/commit/8226eb4709ea8ad5773c900eaaa96068d3cb6bad)]:
+* [`8226eb47`](https://github.com/keystonejs/keystone-5/commit/8226eb4709ea8ad5773c900eaaa96068d3cb6bad) [#1819](https://github.com/keystonejs/keystone-5/pull/1819) Thanks [@w01fgang](https://github.com/w01fgang)! - Upgraded `@emotion/core` and `@emotion/styled`.
+* Updated dependencies [[`8226eb47`](https://github.com/keystonejs/keystone-5/commit/8226eb4709ea8ad5773c900eaaa96068d3cb6bad)]:
   - @arch-ui/input@0.1.1
@@ -116,3 +126,3 @@
 
-- Updated dependencies [7689753c](https://github.com/keystonejs/keystone/commit/7689753c):
+- Updated dependencies [7689753c](https://github.com/keystonejs/keystone-5/commit/7689753c):
   - @arch-ui/input@0.1.0
@@ -124,7 +134,7 @@
 
-- [42c3fbc9](https://github.com/keystonejs/keystone/commit/42c3fbc9): Upgrade emotion to 10.0.14
+- [42c3fbc9](https://github.com/keystonejs/keystone-5/commit/42c3fbc9): Upgrade emotion to 10.0.14
 
 ## 0.0.8
 
-- Updated dependencies [91fffa1e](https://github.com/keystonejs/keystone/commit/91fffa1e):
+- Updated dependencies [91fffa1e](https://github.com/keystonejs/keystone-5/commit/91fffa1e):
   - @arch-ui/input@0.0.8
@@ -136,3 +146,3 @@
 
-- [19fe6c1b](https://github.com/keystonejs/keystone/commit/19fe6c1b):
+- [19fe6c1b](https://github.com/keystonejs/keystone-5/commit/19fe6c1b):
 
@@ -143,3 +153,3 @@ Move frontmatter in docs into comments
 
-- Updated dependencies [d580c298](https://github.com/keystonejs/keystone/commit/d580c298):
+- Updated dependencies [d580c298](https://github.com/keystonejs/keystone-5/commit/d580c298):
   - @arch-ui/input@0.0.6
@@ -151,7 +161,7 @@
 
-- [81dc0be5](https://github.com/keystonejs/keystone/commit/81dc0be5):
+- [81dc0be5](https://github.com/keystonejs/keystone-5/commit/81dc0be5):
 
   - Update dependencies
 
-* Updated dependencies [81b481d0](https://github.com/keystonejs/keystone/commit/81b481d0):
+* Updated dependencies [81b481d0](https://github.com/keystonejs/keystone-5/commit/81b481d0):
   - @arch-ui/input@0.0.5
@@ -161,3 +171,3 @@
 
-- [patch][e75c105c](https://github.com/keystonejs/keystone/commit/e75c105c):
+- [patch][e75c105c](https://github.com/keystonejs/keystone-5/commit/e75c105c):
 
@@ -168,3 +178,3 @@ - admin revamp
 
-- [patch][7417ea3a](https://github.com/keystonejs/keystone/commit/7417ea3a):
+- [patch][7417ea3a](https://github.com/keystonejs/keystone-5/commit/7417ea3a):
 
@@ -171,0 +181,0 @@ - Update patch-level dependencies

dist/controls.cjs.dev.js

@@ -8,3 +8,3 @@ 'use strict';
 var reactRadios = require('react-radios');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
@@ -18,11 +18,5 @@ var reactPseudoState = require('react-pseudo-state');
 
-var _extends__default = /*#__PURE__*/_interopDefault(_extends);
 var React__default = /*#__PURE__*/_interopDefault(React);
-var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty);
-var _objectWithoutProperties__default = /*#__PURE__*/_interopDefault(_objectWithoutProperties);
 var styled__default = /*#__PURE__*/_interopDefault(styled);
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 const Wrapper = styled__default['default'].div({
@@ -120,3 +114,3 @@ display: 'flex',
   } = _ref,
-      wrapperProps = _objectWithoutProperties__default['default'](_ref, ["checked", "children", "components", "isDisabled", "isRequired", "name", "onChange", "icon", "tabIndex", "type", "value", "id"]);
+      wrapperProps = _objectWithoutProperties(_ref, ["checked", "children", "components", "isDisabled", "isRequired", "name", "onChange", "icon", "tabIndex", "type", "value", "id"]);
 
@@ -157,6 +151,6 @@ const components = React.useMemo(() => _objectSpread(_objectSpread({}, defaultComponents), propComponents), [propComponents]);
 
-    return /*#__PURE__*/React__default['default'].createElement(components.Label, _extends__default['default']({
+    return /*#__PURE__*/React__default['default'].createElement(components.Label, _extends({
       isChecked: checked,
       isDisabled: isDisabled
-    }, labelHandlers), /*#__PURE__*/React__default['default'].createElement(input.HiddenInput, _extends__default['default']({}, inputHandlers, {
+    }, labelHandlers), /*#__PURE__*/React__default['default'].createElement(input.HiddenInput, _extends({}, inputHandlers, {
       checked: checked,
@@ -174,3 +168,3 @@ disabled: isDisabled,
 
-const CheckboxIcon = /*#__PURE__*/React.memo(props => /*#__PURE__*/React.createElement("svg", _extends__default['default']({
+const CheckboxIcon = /*#__PURE__*/React.memo(props => /*#__PURE__*/React.createElement("svg", _extends({
   focusable: "false",
@@ -203,3 +197,3 @@ height: "24",
 }))));
-const RadioIcon = /*#__PURE__*/React.memo(props => /*#__PURE__*/React.createElement("svg", _extends__default['default']({
+const RadioIcon = /*#__PURE__*/React.memo(props => /*#__PURE__*/React.createElement("svg", _extends({
   focusable: "false",
@@ -230,7 +224,7 @@ height: "24",
 }))));
-const CheckboxPrimitive = props => /*#__PURE__*/React.createElement(Control, _extends__default['default']({
+const CheckboxPrimitive = props => /*#__PURE__*/React.createElement(Control, _extends({
   icon: CheckboxIcon,
   type: "checkbox"
 }, props));
-const RadioPrimitive = props => /*#__PURE__*/React.createElement(Control, _extends__default['default']({
+const RadioPrimitive = props => /*#__PURE__*/React.createElement(Control, _extends({
   icon: RadioIcon,
@@ -240,7 +234,7 @@ type: "radio"
 
-const Checkbox = props => /*#__PURE__*/React__default['default'].createElement(reactRadios.Checkbox, _extends__default['default']({
+const Checkbox = props => /*#__PURE__*/React__default['default'].createElement(reactRadios.Checkbox, _extends({
   component: CheckboxPrimitive
 }, props));
 const CheckboxGroup = props => /*#__PURE__*/React__default['default'].createElement(reactRadios.CheckboxGroup, props);
-const Radio = props => /*#__PURE__*/React__default['default'].createElement(reactRadios.Radio, _extends__default['default']({
+const Radio = props => /*#__PURE__*/React__default['default'].createElement(reactRadios.Radio, _extends({
   component: RadioPrimitive
@@ -247,0 +241,0 @@ }, props));

dist/controls.cjs.prod.js

@@ -1,100 +0,152 @@
-"use strict";
+'use strict';
 
-Object.defineProperty(exports, "__esModule", {
-  value: !0
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _extends = require('@babel/runtime/helpers/extends');
+var React = require('react');
+var reactRadios = require('react-radios');
+var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var reactPseudoState = require('react-pseudo-state');
+var styled = require('@emotion/styled');
+var theme = require('@arch-ui/theme');
+var input = require('@arch-ui/input');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var styled__default = /*#__PURE__*/_interopDefault(styled);
+
+const Wrapper = styled__default['default'].div({
+  display: 'flex',
+  alignItems: 'center'
 });
+const Label = styled__default['default'].label({
+  alignItems: 'center',
+  display: 'flex',
+  lineHeight: 1
+});
+const Text = 'span';
+const Icon = styled__default['default'].div(({
+  checked,
+  isDisabled,
+  isFocus,
+  isActive,
+  isHover
+}) => {
+  // background
+  let bg = theme.colors.N10;
 
-var _extends = require("@babel/runtime/helpers/extends"), React = require("react"), reactRadios = require("react-radios"), _defineProperty = require("@babel/runtime/helpers/defineProperty"), _objectWithoutProperties = require("@babel/runtime/helpers/objectWithoutProperties"), reactPseudoState = require("react-pseudo-state"), styled = require("@emotion/styled"), theme = require("@arch-ui/theme"), input = require("@arch-ui/input");
+  if (isDisabled && checked) {
+    bg = theme.colors.N30;
+  } else if (isActive) {
+    bg = checked ? theme.colors.B.D10 : theme.colors.N20;
+  } else if ((isFocus || isHover) && !checked) {
+    bg = theme.colors.N15;
+  } else if (checked) {
+    bg = theme.colors.B.base;
+  } // fill
 
-function _interopDefault(e) {
-  return e && e.__esModule ? e : {
-    default: e
-  };
-}
 
-var _extends__default = _interopDefault(_extends), React__default = _interopDefault(React), _defineProperty__default = _interopDefault(_defineProperty), _objectWithoutProperties__default = _interopDefault(_objectWithoutProperties), styled__default = _interopDefault(styled);
+  let fill = 'white';
 
-function ownKeys(object, enumerableOnly) {
-  var keys = Object.keys(object);
-  if (Object.getOwnPropertySymbols) {
-    var symbols = Object.getOwnPropertySymbols(object);
-    enumerableOnly && (symbols = symbols.filter((function(sym) {
-      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-    }))), keys.push.apply(keys, symbols);
+  if (isDisabled && checked) {
+    fill = theme.colors.N70;
+  } else if (!checked) {
+    fill = 'transparent';
+  } // stroke
+
+
+  let innerStroke = isFocus ? theme.colors.B.L20 : bg;
+  let innerStrokeWidth = 1;
+
+  if (checked && !isDisabled) {
+    innerStroke = isActive ? theme.colors.B.D20 : theme.colors.B.base;
   }
-  return keys;
-}
 
-function _objectSpread(target) {
-  for (var i = 1; i < arguments.length; i++) {
-    var source = null != arguments[i] ? arguments[i] : {};
-    i % 2 ? ownKeys(Object(source), !0).forEach((function(key) {
-      _defineProperty__default.default(target, key, source[key]);
-    })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach((function(key) {
-      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-    }));
+  let outerStroke = 'transparent';
+  let outerStrokeWidth = 1;
+
+  if (isFocus && !isActive) {
+    outerStroke = theme.colors.B.A20;
+    outerStrokeWidth = 5;
   }
-  return target;
-}
 
-const Wrapper = styled__default.default.div({
-  display: "flex",
-  alignItems: "center"
-}), Label = styled__default.default.label({
-  alignItems: "center",
-  display: "flex",
-  lineHeight: 1
-}), Text = "span", Icon = styled__default.default.div(({checked: checked, isDisabled: isDisabled, isFocus: isFocus, isActive: isActive, isHover: isHover}) => {
-  let bg = theme.colors.N10;
-  isDisabled && checked ? bg = theme.colors.N30 : isActive ? bg = checked ? theme.colors.B.D10 : theme.colors.N20 : !isFocus && !isHover || checked ? checked && (bg = theme.colors.B.base) : bg = theme.colors.N15;
-  let fill = "white";
-  isDisabled && checked ? fill = theme.colors.N70 : checked || (fill = "transparent");
-  let innerStroke = isFocus ? theme.colors.B.L20 : bg;
-  checked && !isDisabled && (innerStroke = isActive ? theme.colors.B.D20 : theme.colors.B.base);
-  let outerStroke = "transparent", outerStrokeWidth = 1;
-  return isFocus && !isActive && (outerStroke = theme.colors.B.A20, outerStrokeWidth = 5), 
-  {
+  return {
     color: bg,
-    fill: fill,
+    fill,
     lineHeight: 0,
-    cursor: isDisabled ? "not-allowed" : null,
-    "& .outer-stroke": {
-      transition: "stroke 0.2s ease-in-out",
+    cursor: isDisabled ? 'not-allowed' : null,
+    // awkwardly apply the focus ring
+    '& .outer-stroke': {
+      transition: 'stroke 0.2s ease-in-out',
       stroke: outerStroke,
       strokeWidth: outerStrokeWidth
     },
-    "& .inner-stroke": {
+    '& .inner-stroke': {
       stroke: innerStroke,
-      strokeWidth: 1
+      strokeWidth: innerStrokeWidth
     }
   };
-}), defaultComponents = {
-  Wrapper: Wrapper,
-  Label: Label,
-  Text: Text
-}, Control = _ref => {
-  let {checked: checked = !1, children: children, components: propComponents = {}, isDisabled: isDisabled = !1, isRequired: isRequired, name: name, onChange: onChange, icon: IconContent, tabIndex: tabIndex, type: type, value: value, id: id} = _ref, wrapperProps = _objectWithoutProperties__default.default(_ref, [ "checked", "children", "components", "isDisabled", "isRequired", "name", "onChange", "icon", "tabIndex", "type", "value", "id" ]);
-  const components = React.useMemo(() => _objectSpread(_objectSpread({}, defaultComponents), propComponents), [ propComponents ]);
-  return React__default.default.createElement(components.Wrapper, wrapperProps, React__default.default.createElement(reactPseudoState.PseudoState, null, ({onBlur: onBlur, onFocus: onFocus, onKeyDown: onKeyDown, onKeyUp: onKeyUp, onMouseDown: onMouseDown, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onMouseUp: onMouseUp, onTouchEnd: onTouchEnd, onTouchStart: onTouchStart}, snapshot) => {
+});
+const defaultComponents = {
+  Wrapper,
+  Label,
+  Text
+};
+const Control = (_ref) => {
+  let {
+    checked = false,
+    children,
+    components: propComponents = {},
+    isDisabled = false,
+    isRequired,
+    name,
+    onChange,
+    icon: IconContent,
+    tabIndex,
+    type,
+    value,
+    id
+  } = _ref,
+      wrapperProps = _objectWithoutProperties(_ref, ["checked", "children", "components", "isDisabled", "isRequired", "name", "onChange", "icon", "tabIndex", "type", "value", "id"]);
+
+  const components = React.useMemo(() => _objectSpread(_objectSpread({}, defaultComponents), propComponents), [propComponents]);
+  return /*#__PURE__*/React__default['default'].createElement(components.Wrapper, wrapperProps, /*#__PURE__*/React__default['default'].createElement(reactPseudoState.PseudoState, null, ({
+    onBlur,
+    onFocus,
+    onKeyDown,
+    onKeyUp,
+    onMouseDown,
+    onMouseEnter,
+    onMouseLeave,
+    onMouseUp,
+    onTouchEnd,
+    onTouchStart
+  }, snapshot) => {
     const labelHandlers = {
-      onMouseDown: onMouseDown,
-      onMouseUp: onMouseUp,
-      onMouseEnter: onMouseEnter,
-      onMouseLeave: onMouseLeave,
-      onTouchEnd: onTouchEnd,
-      onTouchStart: onTouchStart
-    }, inputHandlers = {
-      onBlur: onBlur,
-      onChange: onChange,
-      onFocus: onFocus,
-      onKeyDown: onKeyDown,
-      onKeyUp: onKeyUp
-    }, iconProps = _objectSpread(_objectSpread({}, snapshot), {}, {
-      checked: checked,
-      isDisabled: isDisabled
+      onMouseDown,
+      onMouseUp,
+      onMouseEnter,
+      onMouseLeave,
+      onTouchEnd,
+      onTouchStart
+    };
+    const inputHandlers = {
+      onBlur,
+      onChange,
+      onFocus,
+      onKeyDown,
+      onKeyUp
+    };
+
+    const iconProps = _objectSpread(_objectSpread({}, snapshot), {}, {
+      checked,
+      isDisabled
     });
-    return React__default.default.createElement(components.Label, _extends__default.default({
+
+    return /*#__PURE__*/React__default['default'].createElement(components.Label, _extends({
       isChecked: checked,
       isDisabled: isDisabled
-    }, labelHandlers), React__default.default.createElement(input.HiddenInput, _extends__default.default({}, inputHandlers, {
+    }, labelHandlers), /*#__PURE__*/React__default['default'].createElement(input.HiddenInput, _extends({}, inputHandlers, {
       checked: checked,
@@ -108,5 +160,7 @@ disabled: isDisabled,
       id: id
-    })), React__default.default.createElement(Icon, iconProps, React__default.default.createElement(IconContent, null)), children ? React__default.default.createElement(components.Text, null, children) : null);
+    })), /*#__PURE__*/React__default['default'].createElement(Icon, iconProps, /*#__PURE__*/React__default['default'].createElement(IconContent, null)), children ? /*#__PURE__*/React__default['default'].createElement(components.Text, null, children) : null);
   }));
-}, CheckboxIcon = React.memo(props => React.createElement("svg", _extends__default.default({
+};
+
+const CheckboxIcon = /*#__PURE__*/React.memo(props => /*#__PURE__*/React.createElement("svg", _extends({
   focusable: "false",
@@ -117,5 +171,5 @@ height: "24",
   width: "24"
-}, props), React.createElement("g", {
+}, props), /*#__PURE__*/React.createElement("g", {
   fillRule: "evenodd"
-}, React.createElement("rect", {
+}, /*#__PURE__*/React.createElement("rect", {
   className: "outer-stroke",
@@ -128,3 +182,3 @@ fill: "transparent",
   rx: "2"
-}), React.createElement("rect", {
+}), /*#__PURE__*/React.createElement("rect", {
   className: "inner-stroke",
@@ -137,6 +191,7 @@ fill: "currentColor",
   rx: "2"
-}), React.createElement("path", {
+}), /*#__PURE__*/React.createElement("path", {
   d: "M9.707 11.293a1 1 0 1 0-1.414 1.414l2 2a1 1 0 0 0 1.414 0l4-4a1 1 0 1 0-1.414-1.414L11 12.586l-1.293-1.293z",
   fill: "inherit"
-})))), RadioIcon = React.memo(props => React.createElement("svg", _extends__default.default({
+}))));
+const RadioIcon = /*#__PURE__*/React.memo(props => /*#__PURE__*/React.createElement("svg", _extends({
   focusable: "false",
@@ -147,5 +202,5 @@ height: "24",
   width: "24"
-}, props), React.createElement("g", {
+}, props), /*#__PURE__*/React.createElement("g", {
   fillRule: "evenodd"
-}, React.createElement("circle", {
+}, /*#__PURE__*/React.createElement("circle", {
   className: "outer-stroke",
@@ -156,3 +211,3 @@ fill: "transparent",
   r: "7"
-}), React.createElement("circle", {
+}), /*#__PURE__*/React.createElement("circle", {
   className: "inner-stroke",
@@ -163,3 +218,3 @@ fill: "currentColor",
   r: "7"
-}), React.createElement("circle", {
+}), /*#__PURE__*/React.createElement("circle", {
   fill: "inherit",
@@ -169,15 +224,26 @@ cx: "12",
   r: "2"
-})))), CheckboxPrimitive = props => React.createElement(Control, _extends__default.default({
+}))));
+const CheckboxPrimitive = props => /*#__PURE__*/React.createElement(Control, _extends({
   icon: CheckboxIcon,
   type: "checkbox"
-}, props)), RadioPrimitive = props => React.createElement(Control, _extends__default.default({
+}, props));
+const RadioPrimitive = props => /*#__PURE__*/React.createElement(Control, _extends({
   icon: RadioIcon,
   type: "radio"
-}, props)), Checkbox = props => React__default.default.createElement(reactRadios.Checkbox, _extends__default.default({
+}, props));
+
+const Checkbox = props => /*#__PURE__*/React__default['default'].createElement(reactRadios.Checkbox, _extends({
   component: CheckboxPrimitive
-}, props)), CheckboxGroup = props => React__default.default.createElement(reactRadios.CheckboxGroup, props), Radio = props => React__default.default.createElement(reactRadios.Radio, _extends__default.default({
+}, props));
+const CheckboxGroup = props => /*#__PURE__*/React__default['default'].createElement(reactRadios.CheckboxGroup, props);
+const Radio = props => /*#__PURE__*/React__default['default'].createElement(reactRadios.Radio, _extends({
   component: RadioPrimitive
-}, props)), RadioGroup = props => React__default.default.createElement(reactRadios.RadioGroup, props);
+}, props));
+const RadioGroup = props => /*#__PURE__*/React__default['default'].createElement(reactRadios.RadioGroup, props);
 
-exports.Checkbox = Checkbox, exports.CheckboxGroup = CheckboxGroup, exports.CheckboxPrimitive = CheckboxPrimitive, 
-exports.Radio = Radio, exports.RadioGroup = RadioGroup, exports.RadioPrimitive = RadioPrimitive;
+exports.Checkbox = Checkbox;
+exports.CheckboxGroup = CheckboxGroup;
+exports.CheckboxPrimitive = CheckboxPrimitive;
+exports.Radio = Radio;
+exports.RadioGroup = RadioGroup;
+exports.RadioPrimitive = RadioPrimitive;

dist/controls.esm.js

 import _extends from '@babel/runtime/helpers/esm/extends';
-import React, { useMemo, createElement, memo } from 'react';
+import React, { useMemo, memo, createElement } from 'react';
 import { Checkbox as Checkbox$1, CheckboxGroup as CheckboxGroup$1, Radio as Radio$1, RadioGroup as RadioGroup$1 } from 'react-radios';
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
 import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
@@ -11,5 +11,2 @@ import { PseudoState } from 'react-pseudo-state';
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 const Wrapper = styled.div({
@@ -16,0 +13,0 @@ display: 'flex',

package.json

 {
   "name": "@arch-ui/controls",
   "description": "Form Controls as used in @keystonejs Admin UI.",
-  "version": "0.1.9",
+  "version": "0.1.10",
   "author": "Jed Watson",
@@ -9,12 +9,12 @@ "license": "MIT",
   "peerDependencies": {
-    "react": "^16.13.1"
+    "react": "^17.0.1"
   },
   "devDependencies": {
-    "react": "^16.13.1"
+    "react": "^17.0.1"
   },
   "dependencies": {
-    "@arch-ui/input": "^0.1.11",
-    "@arch-ui/theme": "^0.0.11",
-    "@babel/runtime": "^7.11.2",
-    "@emotion/core": "^10.0.35",
+    "@arch-ui/input": "^0.1.12",
+    "@arch-ui/theme": "^0.0.12",
+    "@babel/runtime": "^7.12.13",
+    "@emotion/core": "^10.1.1",
     "@emotion/styled": "^10.0.27",
@@ -25,3 +25,3 @@ "react-pseudo-state": "^2.2.2",
   "module": "dist/controls.esm.js",
-  "repository": "https://github.com/keystonejs/keystone/tree/master/packages/arch/packages/controls"
+  "repository": "https://github.com/keystonejs/keystone-5/tree/master/packages/arch/packages/controls"
 }

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

Fixed alerts

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

Improved metrics

Lines of code

842

4.73%

Worsened metrics

Total package byte prevSize

33652

-6.79%

Number of medium supply chain risk alerts

1

Infinity%

Dependency changes

• + Added

  @arch-ui/color-utils@0.0.3
  (transitive)

• + Added

  @arch-ui/theme@0.0.12
  (transitive)

• - Removed

  @arch-ui/color-utils@0.0.2
  (transitive)

• - Removed

  @arch-ui/theme@0.0.11
  (transitive)

• Updated

  @arch-ui/input@^0.1.12

• Updated

  @arch-ui/theme@^0.0.12

• Updated

  @babel/runtime@^7.12.13

• Updated

  @emotion/core@^10.1.1