@flodesk/grain 5.19.1 → 5.20.0

package/es/components/icon-toggle.js

@@ -12,7 +12,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-import { getBorder, getTransition } from '../utilities';
+import { getColor, getTransition } from '../utilities';
 import { Icon } from '.';
 import React from 'react';
 import PropTypes from 'prop-types';
@@ -26,7 +26,7 @@ var Wrapper = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production"
 } : {
   target: "e9umpvt1",
   label: "Wrapper"
-})("display:flex;", getBorder('all'), ";border-radius:var(--grn-radius-s);width:fit-content;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL2ljb24tdG9nZ2xlLmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVMEIiLCJmaWxlIjoiLi4vLi4vc3JjL2NvbXBvbmVudHMvaWNvbi10b2dnbGUuanN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgZ2V0Qm9yZGVyLCBnZXRUcmFuc2l0aW9uIH0gZnJvbSAnLi4vdXRpbGl0aWVzJztcbmltcG9ydCB7IEljb24gfSBmcm9tICcuJztcbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUHJvcFR5cGVzIGZyb20gJ3Byb3AtdHlwZXMnO1xuaW1wb3J0IHsgdHlwZXMgfSBmcm9tICcuLi90eXBlcyc7XG5pbXBvcnQgeyBzdHlsZXMsIGNvbXBvbmVudFZhcnMgfSBmcm9tICcuLi9mb3VuZGF0aW9uYWwnO1xuXG5jb25zdCB3aWR0aCA9IGBjYWxjKCR7Y29tcG9uZW50VmFycy50ZXh0Qm94SGVpZ2h0fSArIDJweClgO1xuXG5jb25zdCBXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgJHtnZXRCb3JkZXIoJ2FsbCcpfTtcbiAgYm9yZGVyLXJhZGl1czogdmFyKC0tZ3JuLXJhZGl1cy1zKTtcbiAgd2lkdGg6IGZpdC1jb250ZW50O1xuYDtcblxuY29uc3QgSXRlbVdyYXBwZXIgPSBzdHlsZWQuYnV0dG9uYFxuICAke3N0eWxlcy5idXR0b25SZXNldH07XG5cbiAgYm9yZGVyOiBub25lO1xuICBib3JkZXItbGVmdDogMXB4IHNvbGlkIHRyYW5zcGFyZW50O1xuICBwYWRkaW5nOiAwO1xuICBtaW4td2lkdGg6ICR7d2lkdGh9O1xuICBoZWlnaHQ6IGNhbGMoJHtjb21wb25lbnRWYXJzLnRleHRCb3hIZWlnaHR9IC0gMnB4KTtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGNvbG9yOiB2YXIoLS1ncm4tY29sb3ItY29udGVudDIpO1xuICB0cmFuc2l0aW9uOiBjb2xvciAke2dldFRyYW5zaXRpb24oJ2Zhc3QnKX07XG5cbiAgJHtwID0+XG4gICAgcC5pc0FjdGl2ZSAmJlxuICAgIGBcbiAgICBjb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWNvbnRlbnQpO1xuICBgfTtcblxuICAmICsgLkljb25Ub2dnbGUge1xuICAgIGJvcmRlci1jb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWJvcmRlcik7XG4gIH1cblxuICAmOmFmdGVyIHtcbiAgICBjb250ZW50OiAnJztcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgdG9wOiAwO1xuICAgIGxlZnQ6IDA7XG4gICAgd2lkdGg6IDEwMCU7XG4gICAgaGVpZ2h0OiAxMDAlO1xuICAgIHRyYW5zaXRpb246ICR7Z2V0VHJhbnNpdGlvbigneEZhc3QnKX07XG4gICAgJHtwID0+IHAuaXNBY3RpdmUgJiYgYGJveC1zaGFkb3c6IDAgMCAwIDFweCAke2NvbXBvbmVudFZhcnMuYWN0aXZlQm9yZGVyQ29sb3J9YH07XG4gIH1cblxuICAmOmZpcnN0LW9mLXR5cGUge1xuICAgIG1pbi13aWR0aDogY2FsYygke3dpZHRofSAtIDFweCk7XG4gIH1cblxuICAmOmZpcnN0LW9mLXR5cGU6YWZ0ZXIge1xuICAgIHdpZHRoOiBjYWxjKDEwMCUgKyAxcHgpO1xuICAgIGxlZnQ6IC0xcHg7XG4gICAgYm9yZGVyLXJhZGl1czogdmFyKC0tZ3JuLXJhZGl1cy1zKSAwIDAgdmFyKC0tZ3JuLXJhZGl1cy1zKTtcbiAgfVxuXG4gICY6bGFzdC1jaGlsZDphZnRlciB7XG4gICAgYm9yZGVyLXJhZGl1czogMCB2YXIoLS1ncm4tcmFkaXVzLXMpIHZhcigtLWdybi1yYWRpdXMtcykgMDtcbiAgfVxuXG4gICY6aG92ZXIge1xuICAgIGNvbG9yOiB2YXIoLS1ncm4tY29sb3ItY29udGVudCk7XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBJY29uVG9nZ2xlID0gKHsgY2hpbGRyZW4sIGljb24sIGlzQWN0aXZlLCBvbkNsaWNrLCAuLi5wcm9wcyB9KSA9PiB7XG4gIHJldHVybiAoXG4gICAgPEl0ZW1XcmFwcGVyIGNsYXNzTmFtZT1cIkljb25Ub2dnbGVcIiBpc0FjdGl2ZT17aXNBY3RpdmV9IG9uQ2xpY2s9e29uQ2xpY2t9IHsuLi5wcm9wc30+XG4gICAgICB7aWNvbiAmJiA8SWNvbiBpY29uPXtpY29ufSBjb2xvcj1cImN1cnJlbnRDb2xvclwiIC8+fVxuICAgICAge2NoaWxkcmVuICYmIGNoaWxkcmVufVxuICAgIDwvSXRlbVdyYXBwZXI+XG4gICk7XG59O1xuXG5leHBvcnQgY29uc3QgSWNvblRvZ2dsZUdyb3VwID0gKHsgY2hpbGRyZW4sIC4uLnByb3BzIH0pID0+IDxXcmFwcGVyIHsuLi5wcm9wc30+e2NoaWxkcmVufTwvV3JhcHBlcj47XG5cbkljb25Ub2dnbGVHcm91cC5wcm9wVHlwZXMgPSB7XG4gIGNoaWxkcmVuOiBQcm9wVHlwZXMubm9kZSxcbn07XG5cbkljb25Ub2dnbGUucHJvcFR5cGVzID0ge1xuICBjaGlsZHJlbjogUHJvcFR5cGVzLm5vZGUsXG4gIGljb246IHR5cGVzLmljb24sXG4gIGlzQWN0aXZlOiBQcm9wVHlwZXMuYm9vbCxcbiAgb25DbGljazogUHJvcFR5cGVzLmZ1bmMsXG59O1xuIl19 */"));
+})("display:flex;border:1px solid ", getColor('border2'), ";border-radius:var(--grn-radius-s);width:fit-content;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL2ljb24tdG9nZ2xlLmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVMEIiLCJmaWxlIjoiLi4vLi4vc3JjL2NvbXBvbmVudHMvaWNvbi10b2dnbGUuanN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgZ2V0Q29sb3IsIGdldFRyYW5zaXRpb24gfSBmcm9tICcuLi91dGlsaXRpZXMnO1xuaW1wb3J0IHsgSWNvbiB9IGZyb20gJy4nO1xuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBQcm9wVHlwZXMgZnJvbSAncHJvcC10eXBlcyc7XG5pbXBvcnQgeyB0eXBlcyB9IGZyb20gJy4uL3R5cGVzJztcbmltcG9ydCB7IHN0eWxlcywgY29tcG9uZW50VmFycyB9IGZyb20gJy4uL2ZvdW5kYXRpb25hbCc7XG5cbmNvbnN0IHdpZHRoID0gYGNhbGMoJHtjb21wb25lbnRWYXJzLnRleHRCb3hIZWlnaHR9ICsgMnB4KWA7XG5cbmNvbnN0IFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBib3JkZXI6IDFweCBzb2xpZCAke2dldENvbG9yKCdib3JkZXIyJyl9O1xuICBib3JkZXItcmFkaXVzOiB2YXIoLS1ncm4tcmFkaXVzLXMpO1xuICB3aWR0aDogZml0LWNvbnRlbnQ7XG5gO1xuXG5jb25zdCBJdGVtV3JhcHBlciA9IHN0eWxlZC5idXR0b25gXG4gICR7c3R5bGVzLmJ1dHRvblJlc2V0fTtcblxuICBib3JkZXI6IG5vbmU7XG4gIGJvcmRlci1sZWZ0OiAxcHggc29saWQgdHJhbnNwYXJlbnQ7XG4gIHBhZGRpbmc6IDA7XG4gIG1pbi13aWR0aDogJHt3aWR0aH07XG4gIGhlaWdodDogY2FsYygke2NvbXBvbmVudFZhcnMudGV4dEJveEhlaWdodH0gLSAycHgpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgY29sb3I6IHZhcigtLWdybi1jb2xvci1jb250ZW50Mik7XG4gIHRyYW5zaXRpb246IGNvbG9yICR7Z2V0VHJhbnNpdGlvbignZmFzdCcpfTtcblxuICAke3AgPT5cbiAgICBwLmlzQWN0aXZlICYmXG4gICAgYFxuICAgIGNvbG9yOiB2YXIoLS1ncm4tY29sb3ItY29udGVudCk7XG4gIGB9O1xuXG4gICYgKyAuSWNvblRvZ2dsZSB7XG4gICAgYm9yZGVyLWNvbG9yOiB2YXIoLS1ncm4tY29sb3ItYm9yZGVyMik7XG4gIH1cblxuICAmOmFmdGVyIHtcbiAgICBjb250ZW50OiAnJztcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgdG9wOiAwO1xuICAgIGxlZnQ6IDA7XG4gICAgd2lkdGg6IDEwMCU7XG4gICAgaGVpZ2h0OiAxMDAlO1xuICAgIHRyYW5zaXRpb246ICR7Z2V0VHJhbnNpdGlvbigneEZhc3QnKX07XG4gICAgJHtwID0+IHAuaXNBY3RpdmUgJiYgYGJveC1zaGFkb3c6IDAgMCAwIDFweCAke2NvbXBvbmVudFZhcnMuYWN0aXZlQm9yZGVyQ29sb3J9YH07XG4gIH1cblxuICAmOmZpcnN0LW9mLXR5cGUge1xuICAgIG1pbi13aWR0aDogY2FsYygke3dpZHRofSAtIDFweCk7XG4gIH1cblxuICAmOmZpcnN0LW9mLXR5cGU6YWZ0ZXIge1xuICAgIHdpZHRoOiBjYWxjKDEwMCUgKyAxcHgpO1xuICAgIGxlZnQ6IC0xcHg7XG4gICAgYm9yZGVyLXJhZGl1czogdmFyKC0tZ3JuLXJhZGl1cy1zKSAwIDAgdmFyKC0tZ3JuLXJhZGl1cy1zKTtcbiAgfVxuXG4gICY6bGFzdC1jaGlsZDphZnRlciB7XG4gICAgYm9yZGVyLXJhZGl1czogMCB2YXIoLS1ncm4tcmFkaXVzLXMpIHZhcigtLWdybi1yYWRpdXMtcykgMDtcbiAgfVxuXG4gICY6aG92ZXIge1xuICAgIGNvbG9yOiB2YXIoLS1ncm4tY29sb3ItY29udGVudCk7XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBJY29uVG9nZ2xlID0gKHsgY2hpbGRyZW4sIGljb24sIGlzQWN0aXZlLCBvbkNsaWNrLCAuLi5wcm9wcyB9KSA9PiB7XG4gIHJldHVybiAoXG4gICAgPEl0ZW1XcmFwcGVyIGNsYXNzTmFtZT1cIkljb25Ub2dnbGVcIiBpc0FjdGl2ZT17aXNBY3RpdmV9IG9uQ2xpY2s9e29uQ2xpY2t9IHsuLi5wcm9wc30+XG4gICAgICB7aWNvbiAmJiA8SWNvbiBpY29uPXtpY29ufSBjb2xvcj1cImN1cnJlbnRDb2xvclwiIC8+fVxuICAgICAge2NoaWxkcmVuICYmIGNoaWxkcmVufVxuICAgIDwvSXRlbVdyYXBwZXI+XG4gICk7XG59O1xuXG5leHBvcnQgY29uc3QgSWNvblRvZ2dsZUdyb3VwID0gKHsgY2hpbGRyZW4sIC4uLnByb3BzIH0pID0+IDxXcmFwcGVyIHsuLi5wcm9wc30+e2NoaWxkcmVufTwvV3JhcHBlcj47XG5cbkljb25Ub2dnbGVHcm91cC5wcm9wVHlwZXMgPSB7XG4gIGNoaWxkcmVuOiBQcm9wVHlwZXMubm9kZSxcbn07XG5cbkljb25Ub2dnbGUucHJvcFR5cGVzID0ge1xuICBjaGlsZHJlbjogUHJvcFR5cGVzLm5vZGUsXG4gIGljb246IHR5cGVzLmljb24sXG4gIGlzQWN0aXZlOiBQcm9wVHlwZXMuYm9vbCxcbiAgb25DbGljazogUHJvcFR5cGVzLmZ1bmMsXG59O1xuIl19 */"));
 
 var ItemWrapper = /*#__PURE__*/_styled("button", process.env.NODE_ENV === "production" ? {
   target: "e9umpvt0"
@@ -35,9 +35,9 @@ var ItemWrapper = /*#__PURE__*/_styled("button", process.env.NODE_ENV === "produ
   label: "ItemWrapper"
 })(styles.buttonReset, ";border:none;border-left:1px solid transparent;padding:0;min-width:", width, ";height:calc(", componentVars.textBoxHeight, " - 2px);background-color:transparent;display:flex;align-items:center;justify-content:center;position:relative;color:var(--grn-color-content2);transition:color ", getTransition('fast'), ";", function (p) {
   return p.isActive && "\n    color: var(--grn-color-content);\n  ";
-}, ";&+.IconToggle{border-color:var(--grn-color-border);}&:after{content:'';pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;transition:", getTransition('xFast'), ";", function (p) {
+}, ";&+.IconToggle{border-color:var(--grn-color-border2);}&:after{content:'';pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;transition:", getTransition('xFast'), ";", function (p) {
   return p.isActive && "box-shadow: 0 0 0 1px ".concat(componentVars.activeBorderColor);
-}, ";}&:first-of-type{min-width:calc(", width, " - 1px);}&:first-of-type:after{width:calc(100% + 1px);left:-1px;border-radius:var(--grn-radius-s) 0 0 var(--grn-radius-s);}&:last-child:after{border-radius:0 var(--grn-radius-s) var(--grn-radius-s) 0;}&:hover{color:var(--grn-color-content);}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL2ljb24tdG9nZ2xlLmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQmlDIiwiZmlsZSI6Ii4uLy4uL3NyYy9jb21wb25lbnRzL2ljb24tdG9nZ2xlLmpzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGdldEJvcmRlciwgZ2V0VHJhbnNpdGlvbiB9IGZyb20gJy4uL3V0aWxpdGllcyc7XG5pbXBvcnQgeyBJY29uIH0gZnJvbSAnLic7XG5pbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IFByb3BUeXBlcyBmcm9tICdwcm9wLXR5cGVzJztcbmltcG9ydCB7IHR5cGVzIH0gZnJvbSAnLi4vdHlwZXMnO1xuaW1wb3J0IHsgc3R5bGVzLCBjb21wb25lbnRWYXJzIH0gZnJvbSAnLi4vZm91bmRhdGlvbmFsJztcblxuY29uc3Qgd2lkdGggPSBgY2FsYygke2NvbXBvbmVudFZhcnMudGV4dEJveEhlaWdodH0gKyAycHgpYDtcblxuY29uc3QgV3JhcHBlciA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gICR7Z2V0Qm9yZGVyKCdhbGwnKX07XG4gIGJvcmRlci1yYWRpdXM6IHZhcigtLWdybi1yYWRpdXMtcyk7XG4gIHdpZHRoOiBmaXQtY29udGVudDtcbmA7XG5cbmNvbnN0IEl0ZW1XcmFwcGVyID0gc3R5bGVkLmJ1dHRvbmBcbiAgJHtzdHlsZXMuYnV0dG9uUmVzZXR9O1xuXG4gIGJvcmRlcjogbm9uZTtcbiAgYm9yZGVyLWxlZnQ6IDFweCBzb2xpZCB0cmFuc3BhcmVudDtcbiAgcGFkZGluZzogMDtcbiAgbWluLXdpZHRoOiAke3dpZHRofTtcbiAgaGVpZ2h0OiBjYWxjKCR7Y29tcG9uZW50VmFycy50ZXh0Qm94SGVpZ2h0fSAtIDJweCk7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBjb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWNvbnRlbnQyKTtcbiAgdHJhbnNpdGlvbjogY29sb3IgJHtnZXRUcmFuc2l0aW9uKCdmYXN0Jyl9O1xuXG4gICR7cCA9PlxuICAgIHAuaXNBY3RpdmUgJiZcbiAgICBgXG4gICAgY29sb3I6IHZhcigtLWdybi1jb2xvci1jb250ZW50KTtcbiAgYH07XG5cbiAgJiArIC5JY29uVG9nZ2xlIHtcbiAgICBib3JkZXItY29sb3I6IHZhcigtLWdybi1jb2xvci1ib3JkZXIpO1xuICB9XG5cbiAgJjphZnRlciB7XG4gICAgY29udGVudDogJyc7XG4gICAgcG9pbnRlci1ldmVudHM6IG5vbmU7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHRvcDogMDtcbiAgICBsZWZ0OiAwO1xuICAgIHdpZHRoOiAxMDAlO1xuICAgIGhlaWdodDogMTAwJTtcbiAgICB0cmFuc2l0aW9uOiAke2dldFRyYW5zaXRpb24oJ3hGYXN0Jyl9O1xuICAgICR7cCA9PiBwLmlzQWN0aXZlICYmIGBib3gtc2hhZG93OiAwIDAgMCAxcHggJHtjb21wb25lbnRWYXJzLmFjdGl2ZUJvcmRlckNvbG9yfWB9O1xuICB9XG5cbiAgJjpmaXJzdC1vZi10eXBlIHtcbiAgICBtaW4td2lkdGg6IGNhbGMoJHt3aWR0aH0gLSAxcHgpO1xuICB9XG5cbiAgJjpmaXJzdC1vZi10eXBlOmFmdGVyIHtcbiAgICB3aWR0aDogY2FsYygxMDAlICsgMXB4KTtcbiAgICBsZWZ0OiAtMXB4O1xuICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWdybi1yYWRpdXMtcykgMCAwIHZhcigtLWdybi1yYWRpdXMtcyk7XG4gIH1cblxuICAmOmxhc3QtY2hpbGQ6YWZ0ZXIge1xuICAgIGJvcmRlci1yYWRpdXM6IDAgdmFyKC0tZ3JuLXJhZGl1cy1zKSB2YXIoLS1ncm4tcmFkaXVzLXMpIDA7XG4gIH1cblxuICAmOmhvdmVyIHtcbiAgICBjb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWNvbnRlbnQpO1xuICB9XG5gO1xuXG5leHBvcnQgY29uc3QgSWNvblRvZ2dsZSA9ICh7IGNoaWxkcmVuLCBpY29uLCBpc0FjdGl2ZSwgb25DbGljaywgLi4ucHJvcHMgfSkgPT4ge1xuICByZXR1cm4gKFxuICAgIDxJdGVtV3JhcHBlciBjbGFzc05hbWU9XCJJY29uVG9nZ2xlXCIgaXNBY3RpdmU9e2lzQWN0aXZlfSBvbkNsaWNrPXtvbkNsaWNrfSB7Li4ucHJvcHN9PlxuICAgICAge2ljb24gJiYgPEljb24gaWNvbj17aWNvbn0gY29sb3I9XCJjdXJyZW50Q29sb3JcIiAvPn1cbiAgICAgIHtjaGlsZHJlbiAmJiBjaGlsZHJlbn1cbiAgICA8L0l0ZW1XcmFwcGVyPlxuICApO1xufTtcblxuZXhwb3J0IGNvbnN0IEljb25Ub2dnbGVHcm91cCA9ICh7IGNoaWxkcmVuLCAuLi5wcm9wcyB9KSA9PiA8V3JhcHBlciB7Li4ucHJvcHN9PntjaGlsZHJlbn08L1dyYXBwZXI+O1xuXG5JY29uVG9nZ2xlR3JvdXAucHJvcFR5cGVzID0ge1xuICBjaGlsZHJlbjogUHJvcFR5cGVzLm5vZGUsXG59O1xuXG5JY29uVG9nZ2xlLnByb3BUeXBlcyA9IHtcbiAgY2hpbGRyZW46IFByb3BUeXBlcy5ub2RlLFxuICBpY29uOiB0eXBlcy5pY29uLFxuICBpc0FjdGl2ZTogUHJvcFR5cGVzLmJvb2wsXG4gIG9uQ2xpY2s6IFByb3BUeXBlcy5mdW5jLFxufTtcbiJdfQ== */"));
+}, ";}&:first-of-type{min-width:calc(", width, " - 1px);}&:first-of-type:after{width:calc(100% + 1px);left:-1px;border-radius:var(--grn-radius-s) 0 0 var(--grn-radius-s);}&:last-child:after{border-radius:0 var(--grn-radius-s) var(--grn-radius-s) 0;}&:hover{color:var(--grn-color-content);}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL2ljb24tdG9nZ2xlLmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQmlDIiwiZmlsZSI6Ii4uLy4uL3NyYy9jb21wb25lbnRzL2ljb24tdG9nZ2xlLmpzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGdldENvbG9yLCBnZXRUcmFuc2l0aW9uIH0gZnJvbSAnLi4vdXRpbGl0aWVzJztcbmltcG9ydCB7IEljb24gfSBmcm9tICcuJztcbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUHJvcFR5cGVzIGZyb20gJ3Byb3AtdHlwZXMnO1xuaW1wb3J0IHsgdHlwZXMgfSBmcm9tICcuLi90eXBlcyc7XG5pbXBvcnQgeyBzdHlsZXMsIGNvbXBvbmVudFZhcnMgfSBmcm9tICcuLi9mb3VuZGF0aW9uYWwnO1xuXG5jb25zdCB3aWR0aCA9IGBjYWxjKCR7Y29tcG9uZW50VmFycy50ZXh0Qm94SGVpZ2h0fSArIDJweClgO1xuXG5jb25zdCBXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgYm9yZGVyOiAxcHggc29saWQgJHtnZXRDb2xvcignYm9yZGVyMicpfTtcbiAgYm9yZGVyLXJhZGl1czogdmFyKC0tZ3JuLXJhZGl1cy1zKTtcbiAgd2lkdGg6IGZpdC1jb250ZW50O1xuYDtcblxuY29uc3QgSXRlbVdyYXBwZXIgPSBzdHlsZWQuYnV0dG9uYFxuICAke3N0eWxlcy5idXR0b25SZXNldH07XG5cbiAgYm9yZGVyOiBub25lO1xuICBib3JkZXItbGVmdDogMXB4IHNvbGlkIHRyYW5zcGFyZW50O1xuICBwYWRkaW5nOiAwO1xuICBtaW4td2lkdGg6ICR7d2lkdGh9O1xuICBoZWlnaHQ6IGNhbGMoJHtjb21wb25lbnRWYXJzLnRleHRCb3hIZWlnaHR9IC0gMnB4KTtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGNvbG9yOiB2YXIoLS1ncm4tY29sb3ItY29udGVudDIpO1xuICB0cmFuc2l0aW9uOiBjb2xvciAke2dldFRyYW5zaXRpb24oJ2Zhc3QnKX07XG5cbiAgJHtwID0+XG4gICAgcC5pc0FjdGl2ZSAmJlxuICAgIGBcbiAgICBjb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWNvbnRlbnQpO1xuICBgfTtcblxuICAmICsgLkljb25Ub2dnbGUge1xuICAgIGJvcmRlci1jb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWJvcmRlcjIpO1xuICB9XG5cbiAgJjphZnRlciB7XG4gICAgY29udGVudDogJyc7XG4gICAgcG9pbnRlci1ldmVudHM6IG5vbmU7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIHRvcDogMDtcbiAgICBsZWZ0OiAwO1xuICAgIHdpZHRoOiAxMDAlO1xuICAgIGhlaWdodDogMTAwJTtcbiAgICB0cmFuc2l0aW9uOiAke2dldFRyYW5zaXRpb24oJ3hGYXN0Jyl9O1xuICAgICR7cCA9PiBwLmlzQWN0aXZlICYmIGBib3gtc2hhZG93OiAwIDAgMCAxcHggJHtjb21wb25lbnRWYXJzLmFjdGl2ZUJvcmRlckNvbG9yfWB9O1xuICB9XG5cbiAgJjpmaXJzdC1vZi10eXBlIHtcbiAgICBtaW4td2lkdGg6IGNhbGMoJHt3aWR0aH0gLSAxcHgpO1xuICB9XG5cbiAgJjpmaXJzdC1vZi10eXBlOmFmdGVyIHtcbiAgICB3aWR0aDogY2FsYygxMDAlICsgMXB4KTtcbiAgICBsZWZ0OiAtMXB4O1xuICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWdybi1yYWRpdXMtcykgMCAwIHZhcigtLWdybi1yYWRpdXMtcyk7XG4gIH1cblxuICAmOmxhc3QtY2hpbGQ6YWZ0ZXIge1xuICAgIGJvcmRlci1yYWRpdXM6IDAgdmFyKC0tZ3JuLXJhZGl1cy1zKSB2YXIoLS1ncm4tcmFkaXVzLXMpIDA7XG4gIH1cblxuICAmOmhvdmVyIHtcbiAgICBjb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWNvbnRlbnQpO1xuICB9XG5gO1xuXG5leHBvcnQgY29uc3QgSWNvblRvZ2dsZSA9ICh7IGNoaWxkcmVuLCBpY29uLCBpc0FjdGl2ZSwgb25DbGljaywgLi4ucHJvcHMgfSkgPT4ge1xuICByZXR1cm4gKFxuICAgIDxJdGVtV3JhcHBlciBjbGFzc05hbWU9XCJJY29uVG9nZ2xlXCIgaXNBY3RpdmU9e2lzQWN0aXZlfSBvbkNsaWNrPXtvbkNsaWNrfSB7Li4ucHJvcHN9PlxuICAgICAge2ljb24gJiYgPEljb24gaWNvbj17aWNvbn0gY29sb3I9XCJjdXJyZW50Q29sb3JcIiAvPn1cbiAgICAgIHtjaGlsZHJlbiAmJiBjaGlsZHJlbn1cbiAgICA8L0l0ZW1XcmFwcGVyPlxuICApO1xufTtcblxuZXhwb3J0IGNvbnN0IEljb25Ub2dnbGVHcm91cCA9ICh7IGNoaWxkcmVuLCAuLi5wcm9wcyB9KSA9PiA8V3JhcHBlciB7Li4ucHJvcHN9PntjaGlsZHJlbn08L1dyYXBwZXI+O1xuXG5JY29uVG9nZ2xlR3JvdXAucHJvcFR5cGVzID0ge1xuICBjaGlsZHJlbjogUHJvcFR5cGVzLm5vZGUsXG59O1xuXG5JY29uVG9nZ2xlLnByb3BUeXBlcyA9IHtcbiAgY2hpbGRyZW46IFByb3BUeXBlcy5ub2RlLFxuICBpY29uOiB0eXBlcy5pY29uLFxuICBpc0FjdGl2ZTogUHJvcFR5cGVzLmJvb2wsXG4gIG9uQ2xpY2s6IFByb3BUeXBlcy5mdW5jLFxufTtcbiJdfQ== */"));
 
 export var IconToggle = function IconToggle(_ref) {
   var children = _ref.children,

package/es/components/text-toggle.js

@@ -12,7 +12,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-import { getBorder, getTransition } from '../utilities';
+import { getColor, getTransition } from '../utilities';
 import React from 'react';
 import PropTypes from 'prop-types';
 import { styles, componentVars } from '../foundational';
@@ -23,11 +23,11 @@ var Wrapper = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production"
 } : {
   target: "e1fb3cwm1",
   label: "Wrapper"
-})("display:flex;", getBorder('all'), ";border-radius:1000px;", function (p) {
+})("display:flex;border:1px solid ", getColor('border2'), ";border-radius:1000px;", function (p) {
   return !p.hasFullWidth && "width: fit-content";
 }, ";", function (p) {
   return p.hasFullWidth && "\n    .TextToggle {\n      flex: 1 0 0;\n    }\n  ";
-}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL3RleHQtdG9nZ2xlLmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNMEIiLCJmaWxlIjoiLi4vLi4vc3JjL2NvbXBvbmVudHMvdGV4dC10b2dnbGUuanN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgZ2V0Qm9yZGVyLCBnZXRUcmFuc2l0aW9uIH0gZnJvbSAnLi4vdXRpbGl0aWVzJztcbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUHJvcFR5cGVzIGZyb20gJ3Byb3AtdHlwZXMnO1xuaW1wb3J0IHsgc3R5bGVzLCBjb21wb25lbnRWYXJzIH0gZnJvbSAnLi4vZm91bmRhdGlvbmFsJztcblxuY29uc3QgV3JhcHBlciA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gICR7Z2V0Qm9yZGVyKCdhbGwnKX07XG4gIGJvcmRlci1yYWRpdXM6IDEwMDBweDtcblxuICAke3AgPT4gIXAuaGFzRnVsbFdpZHRoICYmIGB3aWR0aDogZml0LWNvbnRlbnRgfTtcbiAgJHtwID0+XG4gICAgcC5oYXNGdWxsV2lkdGggJiZcbiAgICBgXG4gICAgLlRleHRUb2dnbGUge1xuICAgICAgZmxleDogMSAwIDA7XG4gICAgfVxuICBgfVxuYDtcblxuY29uc3QgSXRlbVdyYXBwZXIgPSBzdHlsZWQuYnV0dG9uYFxuICAke3N0eWxlcy5idXR0b25SZXNldH07XG5cbiAgYm9yZGVyOiBub25lO1xuICBwYWRkaW5nOiAwIDE2cHg7XG4gIGhlaWdodDogY2FsYygke2NvbXBvbmVudFZhcnMudGV4dEJveEhlaWdodH0gLSAycHgpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBjb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWNvbnRlbnQyKTtcbiAgYm9yZGVyLXJhZGl1czogMTAwMHB4O1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICB0cmFuc2l0aW9uOiBjb2xvciAke2dldFRyYW5zaXRpb24oJ2Zhc3QnKX0sIGJveC1zaGFkb3cgJHtnZXRUcmFuc2l0aW9uKCd4RmFzdCcpfTtcblxuICAmOmhvdmVyIHtcbiAgICBjb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWNvbnRlbnQpO1xuICB9XG5cbiAgJHtwID0+XG4gICAgcC5pc0FjdGl2ZSAmJlxuICAgIGBcbiAgICBib3gtc2hhZG93OiAwIDAgMCAxcHggJHtjb21wb25lbnRWYXJzLmFjdGl2ZUJvcmRlckNvbG9yfTtcbiAgICBjb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWNvbnRlbnQpO1xuICBgfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBUZXh0VG9nZ2xlID0gKHsgY2hpbGRyZW4sIGlzQWN0aXZlLCBvbkNsaWNrLCAuLi5wcm9wcyB9KSA9PiB7XG4gIHJldHVybiAoXG4gICAgPEl0ZW1XcmFwcGVyIGlzQWN0aXZlPXtpc0FjdGl2ZX0gb25DbGljaz17b25DbGlja30gY2xhc3NOYW1lPVwiVGV4dFRvZ2dsZVwiIHsuLi5wcm9wc30+XG4gICAgICB7Y2hpbGRyZW59XG4gICAgPC9JdGVtV3JhcHBlcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBjb25zdCBUZXh0VG9nZ2xlR3JvdXAgPSAoeyBjaGlsZHJlbiwgaGFzRnVsbFdpZHRoLCAuLi5wcm9wcyB9KSA9PiAoXG4gIDxXcmFwcGVyIGhhc0Z1bGxXaWR0aD17aGFzRnVsbFdpZHRofSB7Li4ucHJvcHN9PlxuICAgIHtjaGlsZHJlbn1cbiAgPC9XcmFwcGVyPlxuKTtcblxuVGV4dFRvZ2dsZUdyb3VwLnByb3BUeXBlcyA9IHtcbiAgY2hpbGRyZW46IFByb3BUeXBlcy5ub2RlLFxuICBoYXNGdWxsV2lkdGg6IFByb3BUeXBlcy5ib29sLFxufTtcblxuVGV4dFRvZ2dsZS5wcm9wVHlwZXMgPSB7XG4gIGNoaWxkcmVuOiBQcm9wVHlwZXMubm9kZSxcbiAgaXNBY3RpdmU6IFByb3BUeXBlcy5ib29sLFxuICBvbkNsaWNrOiBQcm9wVHlwZXMuZnVuYyxcbn07XG4iXX0= */"));
+}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL3RleHQtdG9nZ2xlLmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNMEIiLCJmaWxlIjoiLi4vLi4vc3JjL2NvbXBvbmVudHMvdGV4dC10b2dnbGUuanN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgZ2V0Q29sb3IsIGdldFRyYW5zaXRpb24gfSBmcm9tICcuLi91dGlsaXRpZXMnO1xuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBQcm9wVHlwZXMgZnJvbSAncHJvcC10eXBlcyc7XG5pbXBvcnQgeyBzdHlsZXMsIGNvbXBvbmVudFZhcnMgfSBmcm9tICcuLi9mb3VuZGF0aW9uYWwnO1xuXG5jb25zdCBXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgYm9yZGVyOiAxcHggc29saWQgJHtnZXRDb2xvcignYm9yZGVyMicpfTtcbiAgYm9yZGVyLXJhZGl1czogMTAwMHB4O1xuXG4gICR7cCA9PiAhcC5oYXNGdWxsV2lkdGggJiYgYHdpZHRoOiBmaXQtY29udGVudGB9O1xuICAke3AgPT5cbiAgICBwLmhhc0Z1bGxXaWR0aCAmJlxuICAgIGBcbiAgICAuVGV4dFRvZ2dsZSB7XG4gICAgICBmbGV4OiAxIDAgMDtcbiAgICB9XG4gIGB9XG5gO1xuXG5jb25zdCBJdGVtV3JhcHBlciA9IHN0eWxlZC5idXR0b25gXG4gICR7c3R5bGVzLmJ1dHRvblJlc2V0fTtcblxuICBib3JkZXI6IG5vbmU7XG4gIHBhZGRpbmc6IDAgMTZweDtcbiAgaGVpZ2h0OiBjYWxjKCR7Y29tcG9uZW50VmFycy50ZXh0Qm94SGVpZ2h0fSAtIDJweCk7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGNvbG9yOiB2YXIoLS1ncm4tY29sb3ItY29udGVudDIpO1xuICBib3JkZXItcmFkaXVzOiAxMDAwcHg7XG4gIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gIHRyYW5zaXRpb246IGNvbG9yICR7Z2V0VHJhbnNpdGlvbignZmFzdCcpfSwgYm94LXNoYWRvdyAke2dldFRyYW5zaXRpb24oJ3hGYXN0Jyl9O1xuXG4gICY6aG92ZXIge1xuICAgIGNvbG9yOiB2YXIoLS1ncm4tY29sb3ItY29udGVudCk7XG4gIH1cblxuICAke3AgPT5cbiAgICBwLmlzQWN0aXZlICYmXG4gICAgYFxuICAgIGJveC1zaGFkb3c6IDAgMCAwIDFweCAke2NvbXBvbmVudFZhcnMuYWN0aXZlQm9yZGVyQ29sb3J9O1xuICAgIGNvbG9yOiB2YXIoLS1ncm4tY29sb3ItY29udGVudCk7XG4gIGB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IFRleHRUb2dnbGUgPSAoeyBjaGlsZHJlbiwgaXNBY3RpdmUsIG9uQ2xpY2ssIC4uLnByb3BzIH0pID0+IHtcbiAgcmV0dXJuIChcbiAgICA8SXRlbVdyYXBwZXIgaXNBY3RpdmU9e2lzQWN0aXZlfSBvbkNsaWNrPXtvbkNsaWNrfSBjbGFzc05hbWU9XCJUZXh0VG9nZ2xlXCIgey4uLnByb3BzfT5cbiAgICAgIHtjaGlsZHJlbn1cbiAgICA8L0l0ZW1XcmFwcGVyPlxuICApO1xufTtcblxuZXhwb3J0IGNvbnN0IFRleHRUb2dnbGVHcm91cCA9ICh7IGNoaWxkcmVuLCBoYXNGdWxsV2lkdGgsIC4uLnByb3BzIH0pID0+IChcbiAgPFdyYXBwZXIgaGFzRnVsbFdpZHRoPXtoYXNGdWxsV2lkdGh9IHsuLi5wcm9wc30+XG4gICAge2NoaWxkcmVufVxuICA8L1dyYXBwZXI+XG4pO1xuXG5UZXh0VG9nZ2xlR3JvdXAucHJvcFR5cGVzID0ge1xuICBjaGlsZHJlbjogUHJvcFR5cGVzLm5vZGUsXG4gIGhhc0Z1bGxXaWR0aDogUHJvcFR5cGVzLmJvb2wsXG59O1xuXG5UZXh0VG9nZ2xlLnByb3BUeXBlcyA9IHtcbiAgY2hpbGRyZW46IFByb3BUeXBlcy5ub2RlLFxuICBpc0FjdGl2ZTogUHJvcFR5cGVzLmJvb2wsXG4gIG9uQ2xpY2s6IFByb3BUeXBlcy5mdW5jLFxufTtcbiJdfQ== */"));
 
 var ItemWrapper = /*#__PURE__*/_styled("button", process.env.NODE_ENV === "production" ? {
   target: "e1fb3cwm0"
@@ -36,7 +36,7 @@ var ItemWrapper = /*#__PURE__*/_styled("button", process.env.NODE_ENV === "produ
   label: "ItemWrapper"
 })(styles.buttonReset, ";border:none;padding:0 16px;height:calc(", componentVars.textBoxHeight, " - 2px);background-color:transparent;position:relative;color:var(--grn-color-content2);border-radius:1000px;white-space:nowrap;transition:color ", getTransition('fast'), ",box-shadow ", getTransition('xFast'), ";&:hover{color:var(--grn-color-content);}", function (p) {
   return p.isActive && "\n    box-shadow: 0 0 0 1px ".concat(componentVars.activeBorderColor, ";\n    color: var(--grn-color-content);\n  ");
-}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL3RleHQtdG9nZ2xlLmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxQmlDIiwiZmlsZSI6Ii4uLy4uL3NyYy9jb21wb25lbnRzL3RleHQtdG9nZ2xlLmpzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGdldEJvcmRlciwgZ2V0VHJhbnNpdGlvbiB9IGZyb20gJy4uL3V0aWxpdGllcyc7XG5pbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IFByb3BUeXBlcyBmcm9tICdwcm9wLXR5cGVzJztcbmltcG9ydCB7IHN0eWxlcywgY29tcG9uZW50VmFycyB9IGZyb20gJy4uL2ZvdW5kYXRpb25hbCc7XG5cbmNvbnN0IFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICAke2dldEJvcmRlcignYWxsJyl9O1xuICBib3JkZXItcmFkaXVzOiAxMDAwcHg7XG5cbiAgJHtwID0+ICFwLmhhc0Z1bGxXaWR0aCAmJiBgd2lkdGg6IGZpdC1jb250ZW50YH07XG4gICR7cCA9PlxuICAgIHAuaGFzRnVsbFdpZHRoICYmXG4gICAgYFxuICAgIC5UZXh0VG9nZ2xlIHtcbiAgICAgIGZsZXg6IDEgMCAwO1xuICAgIH1cbiAgYH1cbmA7XG5cbmNvbnN0IEl0ZW1XcmFwcGVyID0gc3R5bGVkLmJ1dHRvbmBcbiAgJHtzdHlsZXMuYnV0dG9uUmVzZXR9O1xuXG4gIGJvcmRlcjogbm9uZTtcbiAgcGFkZGluZzogMCAxNnB4O1xuICBoZWlnaHQ6IGNhbGMoJHtjb21wb25lbnRWYXJzLnRleHRCb3hIZWlnaHR9IC0gMnB4KTtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgY29sb3I6IHZhcigtLWdybi1jb2xvci1jb250ZW50Mik7XG4gIGJvcmRlci1yYWRpdXM6IDEwMDBweDtcbiAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgdHJhbnNpdGlvbjogY29sb3IgJHtnZXRUcmFuc2l0aW9uKCdmYXN0Jyl9LCBib3gtc2hhZG93ICR7Z2V0VHJhbnNpdGlvbigneEZhc3QnKX07XG5cbiAgJjpob3ZlciB7XG4gICAgY29sb3I6IHZhcigtLWdybi1jb2xvci1jb250ZW50KTtcbiAgfVxuXG4gICR7cCA9PlxuICAgIHAuaXNBY3RpdmUgJiZcbiAgICBgXG4gICAgYm94LXNoYWRvdzogMCAwIDAgMXB4ICR7Y29tcG9uZW50VmFycy5hY3RpdmVCb3JkZXJDb2xvcn07XG4gICAgY29sb3I6IHZhcigtLWdybi1jb2xvci1jb250ZW50KTtcbiAgYH07XG5gO1xuXG5leHBvcnQgY29uc3QgVGV4dFRvZ2dsZSA9ICh7IGNoaWxkcmVuLCBpc0FjdGl2ZSwgb25DbGljaywgLi4ucHJvcHMgfSkgPT4ge1xuICByZXR1cm4gKFxuICAgIDxJdGVtV3JhcHBlciBpc0FjdGl2ZT17aXNBY3RpdmV9IG9uQ2xpY2s9e29uQ2xpY2t9IGNsYXNzTmFtZT1cIlRleHRUb2dnbGVcIiB7Li4ucHJvcHN9PlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvSXRlbVdyYXBwZXI+XG4gICk7XG59O1xuXG5leHBvcnQgY29uc3QgVGV4dFRvZ2dsZUdyb3VwID0gKHsgY2hpbGRyZW4sIGhhc0Z1bGxXaWR0aCwgLi4ucHJvcHMgfSkgPT4gKFxuICA8V3JhcHBlciBoYXNGdWxsV2lkdGg9e2hhc0Z1bGxXaWR0aH0gey4uLnByb3BzfT5cbiAgICB7Y2hpbGRyZW59XG4gIDwvV3JhcHBlcj5cbik7XG5cblRleHRUb2dnbGVHcm91cC5wcm9wVHlwZXMgPSB7XG4gIGNoaWxkcmVuOiBQcm9wVHlwZXMubm9kZSxcbiAgaGFzRnVsbFdpZHRoOiBQcm9wVHlwZXMuYm9vbCxcbn07XG5cblRleHRUb2dnbGUucHJvcFR5cGVzID0ge1xuICBjaGlsZHJlbjogUHJvcFR5cGVzLm5vZGUsXG4gIGlzQWN0aXZlOiBQcm9wVHlwZXMuYm9vbCxcbiAgb25DbGljazogUHJvcFR5cGVzLmZ1bmMsXG59O1xuIl19 */"));
+}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL3RleHQtdG9nZ2xlLmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxQmlDIiwiZmlsZSI6Ii4uLy4uL3NyYy9jb21wb25lbnRzL3RleHQtdG9nZ2xlLmpzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGdldENvbG9yLCBnZXRUcmFuc2l0aW9uIH0gZnJvbSAnLi4vdXRpbGl0aWVzJztcbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUHJvcFR5cGVzIGZyb20gJ3Byb3AtdHlwZXMnO1xuaW1wb3J0IHsgc3R5bGVzLCBjb21wb25lbnRWYXJzIH0gZnJvbSAnLi4vZm91bmRhdGlvbmFsJztcblxuY29uc3QgV3JhcHBlciA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIGJvcmRlcjogMXB4IHNvbGlkICR7Z2V0Q29sb3IoJ2JvcmRlcjInKX07XG4gIGJvcmRlci1yYWRpdXM6IDEwMDBweDtcblxuICAke3AgPT4gIXAuaGFzRnVsbFdpZHRoICYmIGB3aWR0aDogZml0LWNvbnRlbnRgfTtcbiAgJHtwID0+XG4gICAgcC5oYXNGdWxsV2lkdGggJiZcbiAgICBgXG4gICAgLlRleHRUb2dnbGUge1xuICAgICAgZmxleDogMSAwIDA7XG4gICAgfVxuICBgfVxuYDtcblxuY29uc3QgSXRlbVdyYXBwZXIgPSBzdHlsZWQuYnV0dG9uYFxuICAke3N0eWxlcy5idXR0b25SZXNldH07XG5cbiAgYm9yZGVyOiBub25lO1xuICBwYWRkaW5nOiAwIDE2cHg7XG4gIGhlaWdodDogY2FsYygke2NvbXBvbmVudFZhcnMudGV4dEJveEhlaWdodH0gLSAycHgpO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBjb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWNvbnRlbnQyKTtcbiAgYm9yZGVyLXJhZGl1czogMTAwMHB4O1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICB0cmFuc2l0aW9uOiBjb2xvciAke2dldFRyYW5zaXRpb24oJ2Zhc3QnKX0sIGJveC1zaGFkb3cgJHtnZXRUcmFuc2l0aW9uKCd4RmFzdCcpfTtcblxuICAmOmhvdmVyIHtcbiAgICBjb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWNvbnRlbnQpO1xuICB9XG5cbiAgJHtwID0+XG4gICAgcC5pc0FjdGl2ZSAmJlxuICAgIGBcbiAgICBib3gtc2hhZG93OiAwIDAgMCAxcHggJHtjb21wb25lbnRWYXJzLmFjdGl2ZUJvcmRlckNvbG9yfTtcbiAgICBjb2xvcjogdmFyKC0tZ3JuLWNvbG9yLWNvbnRlbnQpO1xuICBgfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBUZXh0VG9nZ2xlID0gKHsgY2hpbGRyZW4sIGlzQWN0aXZlLCBvbkNsaWNrLCAuLi5wcm9wcyB9KSA9PiB7XG4gIHJldHVybiAoXG4gICAgPEl0ZW1XcmFwcGVyIGlzQWN0aXZlPXtpc0FjdGl2ZX0gb25DbGljaz17b25DbGlja30gY2xhc3NOYW1lPVwiVGV4dFRvZ2dsZVwiIHsuLi5wcm9wc30+XG4gICAgICB7Y2hpbGRyZW59XG4gICAgPC9JdGVtV3JhcHBlcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBjb25zdCBUZXh0VG9nZ2xlR3JvdXAgPSAoeyBjaGlsZHJlbiwgaGFzRnVsbFdpZHRoLCAuLi5wcm9wcyB9KSA9PiAoXG4gIDxXcmFwcGVyIGhhc0Z1bGxXaWR0aD17aGFzRnVsbFdpZHRofSB7Li4ucHJvcHN9PlxuICAgIHtjaGlsZHJlbn1cbiAgPC9XcmFwcGVyPlxuKTtcblxuVGV4dFRvZ2dsZUdyb3VwLnByb3BUeXBlcyA9IHtcbiAgY2hpbGRyZW46IFByb3BUeXBlcy5ub2RlLFxuICBoYXNGdWxsV2lkdGg6IFByb3BUeXBlcy5ib29sLFxufTtcblxuVGV4dFRvZ2dsZS5wcm9wVHlwZXMgPSB7XG4gIGNoaWxkcmVuOiBQcm9wVHlwZXMubm9kZSxcbiAgaXNBY3RpdmU6IFByb3BUeXBlcy5ib29sLFxuICBvbkNsaWNrOiBQcm9wVHlwZXMuZnVuYyxcbn07XG4iXX0= */"));
 
 export var TextToggle = function TextToggle(_ref) {
   var children = _ref.children,

package/es/styles/variables.css

@@ -92,12 +92,13 @@
   --grn-color-content3: var(--grn-color-fade5);
 
   /* background */
-  --grn-color-background: white;
+  --grn-color-background: hsl(0 0% 100% / 100%);;
   --grn-color-background2: var(--grn-color-grey1);
   --grn-color-background3: var(--grn-color-grey2);
 
   /* border */
-  --grn-color-border: var(--grn-color-fade2);
+  --grn-color-border: hsl(var(--grn-color-grey8-HS) 0% / 10%);
+  --grn-color-border2: hsl(var(--grn-color-grey8-HS) 0% / 16%);
 }
 
 :root {

package/es/variables.js

@@ -61,7 +61,8 @@ export var colors = {
       background3: 'background3'
     },
     border: {
-      border: 'border'
+      border: 'border',
+      border2: 'border2'
     }
   }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flodesk/grain",
-  "version": "5.19.1",
+  "version": "5.20.0",
   "description": "Flodesk design system",
   "module": "es/index.js",
   "author": "Flodesk",