@flodesk/grain 2.19.0 → 2.19.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/es/components/box.js +0 -3
  2. package/es/components/button.js +1 -1
  3. package/es/components/icon-toggle.js +2 -5
  4. package/es/components/icon.js +2 -3
  5. package/es/components/text-toggle.js +1 -8
  6. package/es/styles/variables.css +3 -4
  7. package/es/variables.js +0 -1
  8. package/package.json +1 -1
package/es/components/box.js CHANGED
@@ -358,9 +358,6 @@ Box.__docgenInfo = {
358
358
  "value": [{
359
359
  "name": "enum",
360
360
  "value": [{
361
- "value": "\"xs\"",
362
- "computed": false
363
- }, {
364
361
  "value": "\"s\"",
365
362
  "computed": false
366
363
  }, {
package/es/components/button.js CHANGED
@@ -35,7 +35,7 @@ var __jsx = _react.default.createElement;
35
35
  var variables = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n --grn-paddingX-m: 16px;\n --grn-borderColor: var(--grn-color-fade4);\n --grn-borderColor-hover: var(--grn-color-fade6);\n --grn-borderColor-active: var(--grn-color-grey8);\n"])));
36
36
  var variants = {
37
37
  neutral: (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n color: inherit;\n background-color: transparent;\n border-color: var(--grn-borderColor);\n\n &:hover {\n border-color: var(--grn-borderColor-hover);\n }\n &:active {\n border-color: var(--grn-borderColor-active);\n }\n "]))),
38
- primary: (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n color: white;\n background-color: ", ";\n border-color: transparent;\n\n &:hover {\n background-color: ", ";\n }\n &:active {\n color: ", ";\n background-color: black;\n }\n "])), (0, _utilities.getColor)('accent'), (0, _utilities.getColor)('grey7'), (0, _utilities.getColor)('grey2'))
38
+ primary: (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n color: white;\n background-color: ", ";\n border-color: transparent;\n\n &:hover {\n background-color: ", ";\n }\n &:active {\n background-color: ", ";\n }\n "])), (0, _utilities.getColor)('accent'), (0, _utilities.getColor)('grey7'), (0, _utilities.getColor)('grey6'))
39
39
  };
40
40
 
41
41
  var Wrapper = _styled.default.button(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n ", ";\n ", ";\n appearance: none;\n border: none;\n font-family: inherit;\n font-size: inherit;\n cursor: pointer;\n border-width: 1px;\n border-style: solid;\n font-weight: ", ";\n border-radius: ", ";\n height: var(--grn-textBoxHeight-m);\n padding: 0 var(--grn-paddingX-m);\n background-color: transparent;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 12px;\n\n ", ";\n ", ";\n \n &:disabled {\n color: ", ";\n background-color: ", ";\n border-color: transparent;\n cursor: default;\n }\n"])), variables, _foundational.transitions, (0, _utilities.getWeight)('medium'), (0, _utilities.getRadius)('s'), function (p) {
package/es/components/icon-toggle.js CHANGED
@@ -27,15 +27,13 @@ var _react2 = require("@emotion/react");
27
27
 
28
28
  var _types = require("../types");
29
29
 
30
- var _foundational = require("../foundational");
31
-
32
30
  var _excluded = ["children", "icon", "isActive", "onClick"],
33
31
  _excluded2 = ["children"];
34
32
 
35
33
  var _templateObject, _templateObject2, _templateObject3;
36
34
 
37
35
  var __jsx = _react.default.createElement;
38
- var variables = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n --grn-borderColor-hover: var(--grn-color-fade4);\n --grn-borderColor-active: var(--grn-color-grey8);\n --grn-width: calc(var(--grn-textBoxHeight-m) + 4px);\n"])));
36
+ var variables = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n --grn-borderColor-hover: var(--grn-color-fade4);\n --grn-borderColor-active: var(--grn-color-grey8);\n --grn-width: calc(var(--grn-textBoxHeight-m) + 2px);\n"])));
39
37
 
40
38
  var Wrapper = _styled.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n border: 1px solid var(--grn-color-border);\n border-radius: var(--grn-radius-s);\n width: fit-content;\n"])));
41
39
 
@@ -91,8 +89,7 @@ IconToggle.__docgenInfo = {
91
89
  },
92
90
  "isActive": {
93
91
  "type": {
94
- "name": "custom",
95
- "raw": "PropTypes.boolean"
92
+ "name": "bool"
96
93
  },
97
94
  "required": false,
98
95
  "description": ""
package/es/components/icon.js CHANGED
@@ -60,7 +60,7 @@ var Icon = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
60
60
  exports.Icon = Icon;
61
61
  Icon.propTypes = {
62
62
  icon: _propTypes.PropTypes.node,
63
- hasEvenBoundary: _propTypes.PropTypes.boolean,
63
+ hasEvenBoundary: _propTypes.PropTypes.bool,
64
64
  size: _types.types.iconSize,
65
65
  color: _types.types.color
66
66
  };
@@ -141,8 +141,7 @@ Icon.__docgenInfo = {
141
141
  },
142
142
  "hasEvenBoundary": {
143
143
  "type": {
144
- "name": "custom",
145
- "raw": "PropTypes.boolean"
144
+ "name": "bool"
146
145
  },
147
146
  "required": false,
148
147
  "description": ""
package/es/components/text-toggle.js CHANGED
@@ -17,16 +17,10 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
17
17
 
18
18
  var _utilities = require("../utilities");
19
19
 
20
- var _ = require(".");
21
-
22
20
  var _react = _interopRequireDefault(require("react"));
23
21
 
24
22
  var _styled = _interopRequireDefault(require("@emotion/styled"));
25
23
 
26
- var _types = require("../types");
27
-
28
- var _foundational = require("../foundational");
29
-
30
24
  var _excluded = ["children", "isActive", "onClick"],
31
25
  _excluded2 = ["children"];
32
26
 
@@ -74,8 +68,7 @@ TextToggle.__docgenInfo = {
74
68
  },
75
69
  "isActive": {
76
70
  "type": {
77
- "name": "custom",
78
- "raw": "PropTypes.boolean"
71
+ "name": "bool"
79
72
  },
80
73
  "required": false,
81
74
  "description": ""
package/es/styles/variables.css CHANGED
@@ -3,8 +3,8 @@
3
3
  }
4
4
 
5
5
  :root {
6
- --grn-text-s: 13px;
7
- --grn-text-m: 15px;
6
+ --grn-text-s: 12px;
7
+ --grn-text-m: 14px;
8
8
  --grn-text-l: 20px;
9
9
  --grn-text-xl: 24px;
10
10
  --grn-text-xxl: 30px;
@@ -35,8 +35,7 @@
35
35
  }
36
36
 
37
37
  :root {
38
- --grn-radius-xs: 3.5px;
39
- --grn-radius-s: 5px;
38
+ --grn-radius-s: 3px;
40
39
  --grn-radius-m: 10px;
41
40
  --grn-radius-l: 15px;
42
41
  }
package/es/variables.js CHANGED
@@ -74,7 +74,6 @@ var vars = (_vars = {}, (0, _defineProperty2.default)(_vars, varNames.textSize.g
74
74
  medium: "medium",
75
75
  semiBold: "semiBold"
76
76
  }), (0, _defineProperty2.default)(_vars, varNames.radius.group, {
77
- xs: "xs",
78
77
  s: "s",
79
78
  m: "m",
80
79
  l: "l"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flodesk/grain",
3
- "version": "2.19.0",
3
+ "version": "2.19.1",
4
4
  "description": "Flodesk design system",
5
5
  "module": "es/index.js",
6
6
  "author": "Flodesk",