@beequip/hexagon 0.11.0

package/README.md

@@ -0,0 +1,59 @@
+# Hexagon
+
+Component library for digital products of Beequip.
+
+## Getting started
+
+### Installing
+
+Install with yarn.
+
+```shell
+yarn add @beequip/hexagon
+```
+
+Or npm.
+
+```shell
+npm install @beequip/hexagon
+```
+
+### Setting up the provider
+
+Hexagon requires a theme and the `ThemeProvider` from [styled-components](https://styled-components.com/docs/advanced#theming) to work correctly. Import them both and wrap your application component:
+
+```js
+import { theme } from '@beequip/hexagon'
+import { ThemeProvider } from 'styled-components'
+
+function Index() {
+    return (
+        <ThemeProvider theme={theme}>
+           <App />
+        </ThemeProvider>
+    )
+}
+```
+
+## Testing
+For development, this package can be linked into another project. This is useful to test out new features or when trying to debug an issue in Hexagon that manifests itself in another project.
+
+Follow the instructions of [yarn link](https://classic.yarnpkg.com/en/docs/cli/link/) or [npm link](https://docs.npmjs.com/cli/link)
+
+## Storybook
+All components in Hexagon can be previewed in our Storybook. Simply run `yarn storybook` to start the Storybook in your development environment. 
+
+We use [Chromatic](https://www.chromatic.com/) to publish and review our Storybook. The CI is configured to automatically publish the Storybook and run Chromatic’s automation whenever you push code. 
+
+- [Library](http://www.chromatic.com/library?appId=5f7c9ca68ecdf800227af955) at Chromatic
+- Latest published [Storybook](https://develop--5f7c9ca68ecdf800227af955.chromatic.com)
+
+## Publishing
+
+- Make sure everything is merged in develop (check for linting errors)
+- Merge develop into master
+- Run `yarn release` (you have to be a member of the organization and logged in with `npm login` or `yarn login`)
+
+## Contributing
+
+Please see our [contributing.md](./contributing.md).

package/dist/assets/icons/ArrowLeft.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const ArrowLeft: ({ width }: IconProps) => JSX.Element;

package/dist/assets/icons/ArrowLeft.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ArrowLeft = void 0;
+var React = require("react");
+var ArrowLeft = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b;
+    return (React.createElement("svg", { width: width, height: "100%", viewBox: "0 0 48 48", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { d: "M6 24H42M20 38L6 24L20 38ZM6 24L20 10L6 24Z", stroke: "currentColor", strokeWidth: "4", strokeLinecap: "round", strokeLinejoin: "round" })));
+};
+exports.ArrowLeft = ArrowLeft;
+//# sourceMappingURL=ArrowLeft.js.map

package/dist/assets/icons/ArrowLeft.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArrowLeft.js","sourceRoot":"","sources":["../../../src/assets/icons/ArrowLeft.tsx"],"names":[],"mappings":";;;AAAA,6BAA8B;AAGvB,IAAM,SAAS,GAAG,UAAC,EAA6B;QAA3B,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA;IAAkB,OAAA,CACxD,6BACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B;QAElC,8BACI,CAAC,EAAC,6CAA6C,EAC/C,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,GACxB,CACA,CACT;AAf2D,CAe3D,CAAA;AAfY,QAAA,SAAS,aAerB"}

package/dist/assets/icons/ArrowRight.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const ArrowRight: ({ width }: IconProps) => JSX.Element;

package/dist/assets/icons/ArrowRight.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ArrowRight = void 0;
+var React = require("react");
+var ArrowRight = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b;
+    return (React.createElement("svg", { width: width, height: "100%", viewBox: "0 0 48 48", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { d: "M42 24H6M28 10L42 24L28 10ZM42 24L28 38L42 24Z", stroke: "currentColor", strokeWidth: "4", strokeLinecap: "round", strokeLinejoin: "round" })));
+};
+exports.ArrowRight = ArrowRight;
+//# sourceMappingURL=ArrowRight.js.map

package/dist/assets/icons/ArrowRight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArrowRight.js","sourceRoot":"","sources":["../../../src/assets/icons/ArrowRight.tsx"],"names":[],"mappings":";;;AAAA,6BAA8B;AAGvB,IAAM,UAAU,GAAG,UAAC,EAA6B;QAA3B,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA;IAAkB,OAAA,CACzD,6BACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B;QAElC,8BACI,CAAC,EAAC,gDAAgD,EAClD,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,GACxB,CACA,CACT;AAf4D,CAe5D,CAAA;AAfY,QAAA,UAAU,cAetB"}

package/dist/assets/icons/CheckCircle.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const CheckCircle: ({ width }: IconProps) => JSX.Element;

package/dist/assets/icons/CheckCircle.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CheckCircle = void 0;
+var React = require("react");
+var CheckCircle = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b;
+    return (React.createElement("svg", { width: width, height: "100%", viewBox: "0 0 20 20", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0 10C0 4.47733 4.47733 0 10 0C15.5233 0 20 4.47733 20 10C20 15.5233 15.5233 20 10 20C4.47733 20 0 15.5233 0 10ZM13.4047 5.38895C13.6374 5.14955 13.9546 5.0106 14.2886 5.00056L14.2887 5.00053C14.8168 4.98544 15.3015 5.296 15.5083 5.78233C15.7159 6.26948 15.6037 6.83365 15.2262 7.20364C14.1033 8.32891 13.1327 9.35128 12.1565 10.3795C11.1685 11.4202 10.1748 12.4668 9.01188 13.6322C8.53895 14.1068 7.78141 14.1386 7.27081 13.7059L4.48509 11.3487C4.21304 11.1328 4.03977 10.8147 4.00629 10.469C3.97196 10.1225 4.07911 9.77759 4.30428 9.51224C4.52861 9.24689 4.85171 9.08367 5.19826 9.06022C5.5448 9.03678 5.88716 9.15481 6.14581 9.38667L8.01412 10.967C8.77065 10.1926 9.47769 9.45133 10.1877 8.70694C11.2028 7.64269 12.2241 6.57204 13.4047 5.38895Z" })));
+};
+exports.CheckCircle = CheckCircle;
+//# sourceMappingURL=CheckCircle.js.map

package/dist/assets/icons/CheckCircle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckCircle.js","sourceRoot":"","sources":["../../../src/assets/icons/CheckCircle.tsx"],"names":[],"mappings":";;;AAAA,6BAA8B;AAGvB,IAAM,WAAW,GAAG,UAAC,EAA6B;QAA3B,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA;IAAkB,OAAA,CAC1D,6BACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,cAAc,EACnB,KAAK,EAAC,4BAA4B;QAElC,8BACI,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,6uBAA6uB,GACjvB,CACA,CACT;AAd6D,CAc7D,CAAA;AAdY,QAAA,WAAW,eAcvB"}

package/dist/assets/icons/Checkmark.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const Checkmark: ({ width, color }: IconProps) => JSX.Element;

package/dist/assets/icons/Checkmark.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Checkmark = void 0;
+var React = require("react");
+var theme_1 = require("../../theme/theme");
+var Checkmark = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.color, color = _c === void 0 ? theme_1.GREY1 : _c;
+    return (React.createElement("svg", { width: width, height: "100%", viewBox: "0 0 48 48", fill: color, xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { d: "M37.0625 9L19.25 27L10.9375 18.6L5 24.6L19.25 39L43 15L37.0625 9Z" })));
+};
+exports.Checkmark = Checkmark;
+//# sourceMappingURL=Checkmark.js.map

package/dist/assets/icons/Checkmark.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkmark.js","sourceRoot":"","sources":["../../../src/assets/icons/Checkmark.tsx"],"names":[],"mappings":";;;AAAA,6BAA8B;AAE9B,2CAAyC;AAElC,IAAM,SAAS,GAAG,UAAC,EAA4C;QAA1C,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA,EAAE,aAAa,EAAb,KAAK,mBAAG,aAAK,KAAA;IAAkB,OAAA,CACvE,6BACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,KAAK,EACX,KAAK,EAAC,4BAA4B;QAElC,8BAAM,CAAC,EAAC,mEAAmE,GAAG,CAC5E,CACT;AAV0E,CAU1E,CAAA;AAVY,QAAA,SAAS,aAUrB"}

package/dist/assets/icons/ChevronDown.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const ChevronDown: ({ width, color }: IconProps) => JSX.Element;

package/dist/assets/icons/ChevronDown.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChevronDown = void 0;
+var React = require("react");
+var theme_1 = require("../../theme/theme");
+var ChevronDown = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.color, color = _c === void 0 ? theme_1.GREY1 : _c;
+    return (React.createElement("svg", { width: width, height: "100%", viewBox: "0 0 48 48", fill: color, xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { d: "M22.409 35.7634L4.18931 17.5436C3.31059 16.6649 3.31059 15.2403 4.18931 14.3617L6.31434 12.2366C7.19156 11.3594 8.61328 11.3577 9.49256 12.2329L24 26.6723L38.5073 12.2329C39.3866 11.3577 40.8083 11.3594 41.6856 12.2366L43.8106 14.3617C44.6893 15.2404 44.6893 16.665 43.8106 17.5436L25.591 35.7634C24.7123 36.642 23.2877 36.642 22.409 35.7634Z" })));
+};
+exports.ChevronDown = ChevronDown;
+//# sourceMappingURL=ChevronDown.js.map

package/dist/assets/icons/ChevronDown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChevronDown.js","sourceRoot":"","sources":["../../../src/assets/icons/ChevronDown.tsx"],"names":[],"mappings":";;;AAAA,6BAA8B;AAE9B,2CAAyC;AAElC,IAAM,WAAW,GAAG,UAAC,EAA4C;QAA1C,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA,EAAE,aAAa,EAAb,KAAK,mBAAG,aAAK,KAAA;IAAkB,OAAA,CACzE,6BACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,KAAK,EACX,KAAK,EAAC,4BAA4B;QAElC,8BAAM,CAAC,EAAC,wVAAwV,GAAG,CACjW,CACT;AAV4E,CAU5E,CAAA;AAVY,QAAA,WAAW,eAUvB"}

package/dist/assets/icons/ChevronLeft.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const ChevronLeft: ({ width, color }: IconProps) => JSX.Element;

package/dist/assets/icons/ChevronLeft.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChevronLeft = void 0;
+var React = require("react");
+var theme_1 = require("../../theme/theme");
+var ChevronLeft = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.color, color = _c === void 0 ? theme_1.GREY1 : _c;
+    return (React.createElement("svg", { width: width, height: "100%", viewBox: "0 0 48 48", fill: color, xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { d: "M12.2363 22.4091L30.4566 4.18968C31.335 3.31124 32.76 3.31124 33.6384 4.18968L35.7638 6.31499C36.6413 7.19249 36.6422 8.61374 35.7675 9.49312L21.3272 24L35.7666 38.5078C36.6422 39.3872 36.6403 40.8084 35.7628 41.6859L33.6375 43.8112C32.7591 44.6897 31.3341 44.6897 30.4556 43.8112L12.2363 25.5909C11.3578 24.7125 11.3578 23.2875 12.2363 22.4091Z" })));
+};
+exports.ChevronLeft = ChevronLeft;
+//# sourceMappingURL=ChevronLeft.js.map

package/dist/assets/icons/ChevronLeft.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChevronLeft.js","sourceRoot":"","sources":["../../../src/assets/icons/ChevronLeft.tsx"],"names":[],"mappings":";;;AAAA,6BAA8B;AAE9B,2CAAyC;AAElC,IAAM,WAAW,GAAG,UAAC,EAA4C;QAA1C,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA,EAAE,aAAa,EAAb,KAAK,mBAAG,aAAK,KAAA;IAAkB,OAAA,CACzE,6BACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,KAAK,EACX,KAAK,EAAC,4BAA4B;QAElC,8BAAM,CAAC,EAAC,2VAA2V,GAAG,CACpW,CACT;AAV4E,CAU5E,CAAA;AAVY,QAAA,WAAW,eAUvB"}

package/dist/assets/icons/ChevronRight.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const ChevronRight: ({ width, color }: IconProps) => JSX.Element;

package/dist/assets/icons/ChevronRight.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChevronRight = void 0;
+var React = require("react");
+var theme_1 = require("../../theme/theme");
+var ChevronRight = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.color, color = _c === void 0 ? theme_1.GREY1 : _c;
+    return (React.createElement("svg", { width: width, height: "100%", viewBox: "0 0 48 48", fill: color, xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { d: "M35.7634 25.591L17.5436 43.8107C16.6649 44.6894 15.2403 44.6894 14.3617 43.8107L12.2366 41.6857C11.3594 40.8084 11.3577 39.3867 12.2329 38.5074L26.6723 24L12.2329 9.49265C11.3577 8.61337 11.3594 7.19165 12.2366 6.31444L14.3617 4.1894C15.2404 3.31069 16.665 3.31069 17.5436 4.1894L35.7633 22.4091C36.642 23.2877 36.642 24.7123 35.7634 25.591Z" })));
+};
+exports.ChevronRight = ChevronRight;
+//# sourceMappingURL=ChevronRight.js.map

package/dist/assets/icons/ChevronRight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChevronRight.js","sourceRoot":"","sources":["../../../src/assets/icons/ChevronRight.tsx"],"names":[],"mappings":";;;AAAA,6BAA8B;AAE9B,2CAAyC;AAElC,IAAM,YAAY,GAAG,UAAC,EAA4C;QAA1C,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA,EAAE,aAAa,EAAb,KAAK,mBAAG,aAAK,KAAA;IAAkB,OAAA,CAC1E,6BACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,KAAK,EACX,KAAK,EAAC,4BAA4B;QAElC,8BAAM,CAAC,EAAC,uVAAuV,GAAG,CAChW,CACT;AAV6E,CAU7E,CAAA;AAVY,QAAA,YAAY,gBAUxB"}

package/dist/assets/icons/ChevronUp.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const ChevronUp: ({ width, color }: IconProps) => JSX.Element;

package/dist/assets/icons/ChevronUp.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChevronUp = void 0;
+var React = require("react");
+var theme_1 = require("../../theme/theme");
+var ChevronUp = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.color, color = _c === void 0 ? theme_1.GREY1 : _c;
+    return (React.createElement("svg", { width: width, height: "100%", viewBox: "0 0 48 48", fill: color, xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { d: "M25.591 12.2366L43.8107 30.4563C44.6894 31.335 44.6894 32.7596 43.8107 33.6383L41.6857 35.7633C40.8084 36.6405 39.3867 36.6422 38.5074 35.767L24 21.3277L9.49266 35.7671C8.61337 36.6423 7.19166 36.6406 6.31444 35.7634L4.18941 33.6383C3.31069 32.7596 3.31069 31.335 4.18941 30.4564L22.4091 12.2367C23.2877 11.358 24.7123 11.358 25.591 12.2366Z" })));
+};
+exports.ChevronUp = ChevronUp;
+//# sourceMappingURL=ChevronUp.js.map

package/dist/assets/icons/ChevronUp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChevronUp.js","sourceRoot":"","sources":["../../../src/assets/icons/ChevronUp.tsx"],"names":[],"mappings":";;;AAAA,6BAA8B;AAE9B,2CAAyC;AAElC,IAAM,SAAS,GAAG,UAAC,EAA4C;QAA1C,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA,EAAE,aAAa,EAAb,KAAK,mBAAG,aAAK,KAAA;IAAkB,OAAA,CACvE,6BACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,KAAK,EACX,KAAK,EAAC,4BAA4B;QAElC,8BAAM,CAAC,EAAC,uVAAuV,GAAG,CAChW,CACT;AAV0E,CAU1E,CAAA;AAVY,QAAA,SAAS,aAUrB"}

package/dist/assets/icons/Cross.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const Cross: ({ width, color }: IconProps) => JSX.Element;

package/dist/assets/icons/Cross.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Cross = void 0;
+var React = require("react");
+var theme_1 = require("../../theme/theme");
+var Cross = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.color, color = _c === void 0 ? theme_1.GREY1 : _c;
+    return (React.createElement("svg", { width: width, height: "100%", viewBox: "0 0 48 48", xmlns: "http://www.w3.org/2000/svg", fill: color },
+        React.createElement("path", { d: "M38.7187 32.9062L29.3141 23.5016L38.7187 14.0969C38.8989 13.9145 38.9999 13.6684 38.9999 13.412C38.9999 13.1556 38.8989 12.9095 38.7187 12.7271L34.276 8.28444C34.1862 8.19428 34.0794 8.12275 33.9619 8.07394C33.8444 8.02513 33.7184 8 33.5911 8C33.4638 8 33.3378 8.02513 33.2203 8.07394C33.1028 8.12275 32.996 8.19428 32.9062 8.28444L23.5016 17.6891L14.0969 8.28444C13.9153 8.10283 13.6689 8.0008 13.412 8.0008C13.1552 8.0008 12.9088 8.10283 12.7271 8.28444L8.28444 12.7271C8.19428 12.817 8.12275 12.9237 8.07394 13.0412C8.02513 13.1588 8 13.2848 8 13.412C8 13.5393 8.02513 13.6653 8.07394 13.7828C8.12275 13.9004 8.19428 14.0071 8.28444 14.0969L17.6891 23.5016L8.28444 32.9062C8.10283 33.0879 8.0008 33.3342 8.0008 33.5911C8.0008 33.848 8.10283 34.0943 8.28444 34.276L12.7271 38.7187C12.817 38.8088 12.9237 38.8804 13.0412 38.9292C13.1588 38.978 13.2848 39.0031 13.412 39.0031C13.5393 39.0031 13.6653 38.978 13.7828 38.9292C13.9004 38.8804 14.0071 38.8088 14.0969 38.7187L23.5016 29.3141L32.9062 38.7187C33.0879 38.9003 33.3342 39.0023 33.5911 39.0023C33.848 39.0023 34.0943 38.9003 34.276 38.7187L38.7187 34.276C38.8088 34.1862 38.8804 34.0794 38.9292 33.9619C38.978 33.8444 39.0031 33.7184 39.0031 33.5911C39.0031 33.4638 38.978 33.3378 38.9292 33.2203C38.8804 33.1028 38.8088 32.996 38.7187 32.9062V32.9062Z" })));
+};
+exports.Cross = Cross;
+//# sourceMappingURL=Cross.js.map

package/dist/assets/icons/Cross.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Cross.js","sourceRoot":"","sources":["../../../src/assets/icons/Cross.tsx"],"names":[],"mappings":";;;AAAA,6BAA8B;AAE9B,2CAAyC;AAElC,IAAM,KAAK,GAAG,UAAC,EAA4C;QAA1C,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA,EAAE,aAAa,EAAb,KAAK,mBAAG,aAAK,KAAA;IAAkB,OAAA,CACnE,6BACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B,EAClC,IAAI,EAAE,KAAK;QAEX,8BAAM,CAAC,EAAC,+xCAA+xC,GAAG,CACxyC,CACT;AAVsE,CAUtE,CAAA;AAVY,QAAA,KAAK,SAUjB"}

package/dist/assets/icons/ExclamationCircle.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const ExclamationCircle: ({ width, color, }: IconProps) => JSX.Element;

package/dist/assets/icons/ExclamationCircle.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ExclamationCircle = void 0;
+var React = require("react");
+var ExclamationCircle = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.color, color = _c === void 0 ? 'currentColor' : _c;
+    return (React.createElement("svg", { width: width, height: "100%", viewBox: "0 0 20 20", fill: color, xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M10 0C7.34741 0 4.8047 1.05347 2.92846 2.92846C1.05347 4.80467 0 7.34751 0 10C0 12.6525 1.05347 15.1953 2.92846 17.0715C4.80467 18.9465 7.34751 20 10 20C12.6525 20 15.1953 18.9465 17.0715 17.0715C18.9465 15.1953 20 12.6525 20 10C20 7.34751 18.9465 4.8047 17.0715 2.92846C15.1953 1.05347 12.6525 0 10 0ZM9.99999 15.625C9.49461 15.625 9.03808 15.321 8.84521 14.8535C8.65112 14.386 8.75854 13.8489 9.11621 13.4912C9.47387 13.1335 10.011 13.0261 10.4785 13.2202C10.946 13.4131 11.25 13.8696 11.25 14.375C11.25 14.707 11.1182 15.0244 10.8838 15.2587C10.6494 15.4931 10.332 15.625 10 15.625L9.99999 15.625ZM10 11.25C10.6904 11.25 11.25 10.6903 11.25 9.99998V5.625C11.25 4.93464 10.6904 4.375 10 4.375C9.30964 4.375 8.75 4.93464 8.75 5.62499V9.99998C8.75 10.6903 9.30964 11.25 10 11.25Z" })));
+};
+exports.ExclamationCircle = ExclamationCircle;
+//# sourceMappingURL=ExclamationCircle.js.map

package/dist/assets/icons/ExclamationCircle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExclamationCircle.js","sourceRoot":"","sources":["../../../src/assets/icons/ExclamationCircle.tsx"],"names":[],"mappings":";;;AAAA,6BAA8B;AAGvB,IAAM,iBAAiB,GAAG,UAAC,EAGtB;QAFR,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA,EACd,aAAsB,EAAtB,KAAK,mBAAG,cAAc,KAAA;IACT,OAAA,CACb,6BACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,KAAK,EACX,KAAK,EAAC,4BAA4B;QAElC,8BACI,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,6wBAA6wB,GACjxB,CACA,CACT;AAdgB,CAchB,CAAA;AAjBY,QAAA,iBAAiB,qBAiB7B"}

package/dist/assets/icons/InfoCircle.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const InfoCircle: ({ width, ...rest }: IconProps) => JSX.Element;

package/dist/assets/icons/InfoCircle.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InfoCircle = void 0;
+var tslib_1 = require("tslib");
+var React = require("react");
+var InfoCircle = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b, rest = tslib_1.__rest(_a, ["width"]);
+    return (React.createElement("svg", tslib_1.__assign({ width: width, height: "100%", viewBox: "0 0 48 48", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, rest),
+        React.createElement("path", { d: "M24 0.75C11.1603 0.75 0.75 11.164 0.75 24C0.75 36.8435 11.1603 47.25 24 47.25C36.8397 47.25 47.25 36.8435 47.25 24C47.25 11.164 36.8397 0.75 24 0.75ZM24 11.0625C26.1746 11.0625 27.9375 12.8254 27.9375 15C27.9375 17.1746 26.1746 18.9375 24 18.9375C21.8254 18.9375 20.0625 17.1746 20.0625 15C20.0625 12.8254 21.8254 11.0625 24 11.0625ZM29.25 34.875C29.25 35.4963 28.7463 36 28.125 36H19.875C19.2537 36 18.75 35.4963 18.75 34.875V32.625C18.75 32.0037 19.2537 31.5 19.875 31.5H21V25.5H19.875C19.2537 25.5 18.75 24.9963 18.75 24.375V22.125C18.75 21.5037 19.2537 21 19.875 21H25.875C26.4963 21 27 21.5037 27 22.125V31.5H28.125C28.7463 31.5 29.25 32.0037 29.25 32.625V34.875Z" })));
+};
+exports.InfoCircle = InfoCircle;
+//# sourceMappingURL=InfoCircle.js.map

package/dist/assets/icons/InfoCircle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoCircle.js","sourceRoot":"","sources":["../../../src/assets/icons/InfoCircle.tsx"],"names":[],"mappings":";;;;AAAA,6BAA8B;AAGvB,IAAM,UAAU,GAAG,UAAC,EAAsC;IAApC,IAAA,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA,EAAK,IAAI,sBAAzB,SAA2B,CAAF;IAAkB,OAAA,CAClE,8CACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,cAAc,EACnB,KAAK,EAAC,4BAA4B,IAC9B,IAAI;QAER,8BAAM,CAAC,EAAC,8pBAA8pB,GAAG,CACvqB,CACT,CAAA;CAAA,CAAA;AAXY,QAAA,UAAU,cAWtB"}

package/dist/assets/icons/MinusCircle.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const MinusCircle: ({ width, color, ...rest }: IconProps) => JSX.Element;

package/dist/assets/icons/MinusCircle.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MinusCircle = void 0;
+var tslib_1 = require("tslib");
+var React = require("react");
+var theme_1 = require("../../theme/theme");
+var MinusCircle = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.color, color = _c === void 0 ? theme_1.GREY1 : _c, rest = tslib_1.__rest(_a, ["width", "color"]);
+    return (React.createElement("svg", tslib_1.__assign({ width: width, height: "100%", viewBox: "0 0 48 48", fill: color, xmlns: "http://www.w3.org/2000/svg" }, rest),
+        React.createElement("path", { d: "M24 4C12.972 4 4 12.972 4 24C4 35.028 12.972 44 24 44C35.028 44 44 35.028 44 24C44 12.972 35.028 4 24 4ZM34 26H14V22H34V26Z" })));
+};
+exports.MinusCircle = MinusCircle;
+//# sourceMappingURL=MinusCircle.js.map

package/dist/assets/icons/MinusCircle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MinusCircle.js","sourceRoot":"","sources":["../../../src/assets/icons/MinusCircle.tsx"],"names":[],"mappings":";;;;AAAA,6BAA8B;AAE9B,2CAAyC;AAElC,IAAM,WAAW,GAAG,UAAC,EAIhB;IAHR,IAAA,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA,EACd,aAAa,EAAb,KAAK,mBAAG,aAAK,KAAA,EACV,IAAI,sBAHiB,kBAI3B,CADU;IACM,OAAA,CACb,8CACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,KAAK,EACX,KAAK,EAAC,4BAA4B,IAC9B,IAAI;QAER,8BAAM,CAAC,EAAC,6HAA6H,GAAG,CACtI,CACT,CAAA;CAAA,CAAA;AAfY,QAAA,WAAW,eAevB"}

package/dist/assets/icons/PlusCircle.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IconProps } from '../../theme/types';
+export declare const PlusCircle: ({ width, color, ...rest }: IconProps) => JSX.Element;

package/dist/assets/icons/PlusCircle.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PlusCircle = void 0;
+var tslib_1 = require("tslib");
+var React = require("react");
+var theme_1 = require("../../theme/theme");
+var PlusCircle = function (_a) {
+    var _b = _a.width, width = _b === void 0 ? '100%' : _b, _c = _a.color, color = _c === void 0 ? theme_1.GREY1 : _c, rest = tslib_1.__rest(_a, ["width", "color"]);
+    return (React.createElement("svg", tslib_1.__assign({ width: width, height: "100%", viewBox: "0 0 48 48", fill: color, xmlns: 'http://www.w3.org/2000/svg' }, rest),
+        React.createElement("path", { d: "M24 4C12.972 4 4 12.972 4 24C4 35.028 12.972 44 24 44C35.028 44 44 35.028 44 24C44 12.972 35.028 4 24 4ZM34 26H26V34H22V26H14V22H22V14H26V22H34V26Z" })));
+};
+exports.PlusCircle = PlusCircle;
+//# sourceMappingURL=PlusCircle.js.map

package/dist/assets/icons/PlusCircle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlusCircle.js","sourceRoot":"","sources":["../../../src/assets/icons/PlusCircle.tsx"],"names":[],"mappings":";;;;AAAA,6BAA8B;AAE9B,2CAAyC;AAElC,IAAM,UAAU,GAAG,UAAC,EAIf;IAHR,IAAA,aAAc,EAAd,KAAK,mBAAG,MAAM,KAAA,EACd,aAAa,EAAb,KAAK,mBAAG,aAAK,KAAA,EACV,IAAI,sBAHgB,kBAI1B,CADU;IACM,OAAA,CACb,8CACI,KAAK,EAAE,KAAK,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,KAAK,EACX,KAAK,EAAE,4BAA4B,IAC/B,IAAI;QAER,8BAAM,CAAC,EAAC,qJAAqJ,GAAG,CAC9J,CACT,CAAA;CAAA,CAAA;AAfY,QAAA,UAAU,cAetB"}

package/dist/components/Autocomplete/Item/index.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+export interface AutocompleteItemProps {
+    selected?: boolean;
+    highlighted?: boolean;
+    isLabel?: boolean;
+    children: React.ReactNode;
+    noResults?: boolean;
+}
+export declare const AutocompleteItem: (props: AutocompleteItemProps) => JSX.Element;

package/dist/components/Autocomplete/Item/index.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AutocompleteItem = void 0;
+var tslib_1 = require("tslib");
+var React = require("react");
+var styles_1 = require("./styles");
+var AutocompleteItem = function (props) {
+    return (React.createElement(styles_1.StyledAutocompleteItem, tslib_1.__assign({}, props), props.children));
+};
+exports.AutocompleteItem = AutocompleteItem;
+//# sourceMappingURL=index.js.map

package/dist/components/Autocomplete/Item/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Autocomplete/Item/index.tsx"],"names":[],"mappings":";;;;AAAA,6BAA8B;AAC9B,mCAAiD;AAU1C,IAAM,gBAAgB,GAAG,UAAC,KAA4B;IACzD,OAAO,CACH,oBAAC,+BAAsB,uBAAK,KAAK,GAC5B,KAAK,CAAC,QAAQ,CACM,CAC5B,CAAA;AACL,CAAC,CAAA;AANY,QAAA,gBAAgB,oBAM5B"}

package/dist/components/Autocomplete/Item/styles.d.ts

@@ -0,0 +1,3 @@
+import { AutocompleteItemProps } from './index';
+export declare const StyledAutocompleteItem: import("styled-components").StyledComponent<"div", any, AutocompleteItemProps, never>;
+export declare const StyledAutocompleteItemTitle: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/Autocomplete/Item/styles.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledAutocompleteItemTitle = exports.StyledAutocompleteItem = void 0;
+var tslib_1 = require("tslib");
+var index_1 = require("../../../theme/index");
+var styled_components_1 = require("styled-components");
+exports.StyledAutocompleteItem = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n    font-family: ", ";\n    font-size: ", ";\n    line-height: ", "px;\n    color: ", ";\n    padding: ", "px ", "px;\n    background: ", ";\n\n    &:hover {\n        cursor: ", ";\n    }\n"], ["\n    font-family: ", ";\n    font-size: ", ";\n    line-height: ", "px;\n    color: ", ";\n    padding: ", "px ", "px;\n    background: ", ";\n\n    &:hover {\n        cursor: ", ";\n    }\n"])), function (props) { return props.theme.font.default; }, function (props) { return props.theme.font.sizes.s; }, function (props) { return props.theme.baseline * 3; }, function (props) {
+    return props.noResults ? props.theme.colors.text.light : 'inherit';
+}, index_1.baseline * 1.5, index_1.baseline, function (props) {
+    return props.highlighted ? props.theme.colors.grey[5] : 'white';
+}, function (props) { return (props.noResults ? 'default' : 'pointer'); });
+exports.StyledAutocompleteItemTitle = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n    font-family: ", ";\n    font-size: ", ";\n    font-weight: 500;\n    padding: 10px ", "px;\n    border-bottom: 1px solid ", ";\n    user-select: none;\n    text-transform: uppercase;\n    color: ", ";\n"], ["\n    font-family: ", ";\n    font-size: ", ";\n    font-weight: 500;\n    padding: 10px ", "px;\n    border-bottom: 1px solid ", ";\n    user-select: none;\n    text-transform: uppercase;\n    color: ", ";\n"])), function (props) { return props.theme.font.default; }, function (props) { return props.theme.font.sizes.s; }, index_1.baseline, function (props) { return props.theme.borderColor; }, function (props) { return props.theme.colors.grey[3]; });
+var templateObject_1, templateObject_2;
+//# sourceMappingURL=styles.js.map

package/dist/components/Autocomplete/Item/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/components/Autocomplete/Item/styles.ts"],"names":[],"mappings":";;;;AAAA,8CAA+C;AAC/C,uDAAsC;AAGzB,QAAA,sBAAsB,GAAG,2BAAM,CAAC,GAAG,4QAAuB,qBACpD,EAAiC,oBACnC,EAAiC,sBAC/B,EAAiC,kBACvC,EACsD,kBACpD,EAAc,KAAM,EAAQ,uBACzB,EAC8C,sCAG9C,EAAkD,YAEnE,KAZkB,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,EAAxB,CAAwB,EACnC,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAxB,CAAwB,EAC/B,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,KAAK,CAAC,QAAQ,GAAG,CAAC,EAAxB,CAAwB,EACvC,UAAA,KAAK;IACV,OAAA,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;AAA3D,CAA2D,EACpD,gBAAQ,GAAG,GAAG,EAAM,gBAAQ,EACzB,UAAA,KAAK;IACf,OAAA,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO;AAAxD,CAAwD,EAG9C,UAAA,KAAK,IAAI,OAAA,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,EAAzC,CAAyC,EAEnE;AAEY,QAAA,2BAA2B,GAAG,2BAAM,CAAC,GAAG,6RAAA,qBAClC,EAAiC,oBACnC,EAAiC,8CAE9B,EAAQ,oCACG,EAAgC,wEAGlD,EAAmC,KAC/C,KARkB,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,EAAxB,CAAwB,EACnC,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAxB,CAAwB,EAE9B,gBAAQ,EACG,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,KAAK,CAAC,WAAW,EAAvB,CAAuB,EAGlD,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAA1B,CAA0B,EAC/C"}

package/dist/components/Autocomplete/index.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+export interface AutocompleteProps {
+    loading: boolean;
+    children: React.ReactNode;
+    error?: boolean;
+    hook: string;
+    suggestionMode?: boolean;
+    suggestionItem?: React.ReactNode;
+    results?: number;
+}
+export declare const Autocomplete: React.FC<AutocompleteProps>;

package/dist/components/Autocomplete/index.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Autocomplete = void 0;
+var React = require("react");
+var styles_1 = require("./Item/styles");
+var styles_2 = require("./styles");
+var Autocomplete = function (_a) {
+    var hook = _a.hook, loading = _a.loading, error = _a.error, children = _a.children, suggestionMode = _a.suggestionMode, suggestionItem = _a.suggestionItem, results = _a.results;
+    return (React.createElement(styles_2.StyledAutocomplete, { "data-hook": hook },
+        loading ? (React.createElement(styles_1.StyledAutocompleteItemTitle, null, "Aan het zoeken")) : error ? (React.createElement(styles_1.StyledAutocompleteItemTitle, null, "Er ging iets mis")) : null,
+        React.Children.toArray(children).length > 0 ? (React.createElement(React.Fragment, null,
+            !loading && (React.createElement(styles_1.StyledAutocompleteItemTitle, null, suggestionMode ? 'Suggesties' : 'Resultaten')),
+            children)) : null,
+        results === 0 && suggestionItem));
+};
+exports.Autocomplete = Autocomplete;
+//# sourceMappingURL=index.js.map

package/dist/components/Autocomplete/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Autocomplete/index.tsx"],"names":[],"mappings":";;;AAAA,6BAA8B;AAC9B,wCAA2D;AAC3D,mCAA6C;AAYtC,IAAM,YAAY,GAAgC,UAAC,EAQzD;QAPG,IAAI,UAAA,EACJ,OAAO,aAAA,EACP,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,cAAc,oBAAA,EACd,cAAc,oBAAA,EACd,OAAO,aAAA;IAEP,OAAO,CACH,oBAAC,2BAAkB,iBAAY,IAAI;QAC9B,OAAO,CAAC,CAAC,CAAC,CACP,oBAAC,oCAA2B,yBAEE,CACjC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CACR,oBAAC,oCAA2B,2BAEE,CACjC,CAAC,CAAC,CAAC,IAAI;QACP,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAC3C;YACK,CAAC,OAAO,IAAI,CACT,oBAAC,oCAA2B,QACvB,cAAc,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,CACnB,CACjC;YACA,QAAQ,CACV,CACN,CAAC,CAAC,CAAC,IAAI;QACP,OAAO,KAAK,CAAC,IAAI,cAAc,CACf,CACxB,CAAA;AACL,CAAC,CAAA;AAjCY,QAAA,YAAY,gBAiCxB"}

package/dist/components/Autocomplete/index.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, Story } from '@storybook/react';
+import { AutocompleteProps } from './index';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Default: Story<AutocompleteProps>;

package/dist/components/Autocomplete/index.stories.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = void 0;
+var tslib_1 = require("tslib");
+var downshift_1 = require("downshift");
+var React = require("react");
+var Input_1 = require("../Input");
+var index_1 = require("./index");
+var Item_1 = require("./Item");
+var items = ['Caterpillar', 'John Deere', 'Takeuchi'];
+exports.default = {
+    title: 'Hexagon/Autocomplete',
+    component: index_1.Autocomplete,
+    decorators: [function (Story) { return React.createElement(Story, null); }],
+};
+var Template = function (_a) {
+    var args = tslib_1.__rest(_a, []);
+    return (React.createElement(downshift_1.default, null, function (_a) {
+        var getInputProps = _a.getInputProps, getItemProps = _a.getItemProps, highlightedIndex = _a.highlightedIndex, selectedItem = _a.selectedItem, isOpen = _a.isOpen;
+        return (
+        // Downshift doesn't like non-DOM elements
+        React.createElement("div", { style: { position: 'relative' } },
+            React.createElement(Input_1.Input, tslib_1.__assign({ name: "input-name", placeholder: "Zoeken...", error: false }, getInputProps())),
+            isOpen && (React.createElement(index_1.Autocomplete, tslib_1.__assign({}, args, { loading: false, error: false, hook: 'equipment-brand-search-autocomplete' }), items.map(function (item, index) { return (React.createElement(Item_1.AutocompleteItem, tslib_1.__assign({ key: index, selected: selectedItem === item, highlighted: highlightedIndex === index }, getItemProps({ item: item })), item)); })))));
+    }));
+};
+exports.Default = Template.bind({});
+exports.Default.args = {};
+//# sourceMappingURL=index.stories.js.map

package/dist/components/Autocomplete/index.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../src/components/Autocomplete/index.stories.tsx"],"names":[],"mappings":";;;;AACA,uCAAiC;AACjC,6BAA8B;AAC9B,kCAAgC;AAChC,iCAAyD;AACzD,+BAAyC;AAEzC,IAAM,KAAK,GAAa,CAAC,aAAa,EAAE,YAAY,EAAE,UAAU,CAAC,CAAA;AAEjE,kBAAe;IACX,KAAK,EAAE,sBAAsB;IAC7B,SAAS,EAAE,oBAAY;IACvB,UAAU,EAAE,CAAC,UAAA,KAAK,IAAI,OAAA,oBAAC,KAAK,OAAG,EAAT,CAAS,CAAC;CAC3B,CAAA;AAET,IAAM,QAAQ,GAA6B,UAAC,EAAW;QAAN,IAAI,sBAAT,EAAW,CAAF;IAAO,OAAA,CACxD,oBAAC,mBAAS,QACL,UAAC,EAMD;YALG,aAAa,mBAAA,EACb,YAAY,kBAAA,EACZ,gBAAgB,sBAAA,EAChB,YAAY,kBAAA,EACZ,MAAM,YAAA;QAEN,OAAO;QACH,0CAA0C;QAC1C,6BAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE;YAChC,oBAAC,aAAK,qBACF,IAAI,EAAC,YAAY,EACjB,WAAW,EAAC,WAAW,EACvB,KAAK,EAAE,KAAK,IACR,aAAa,EAAE,EACrB;YACD,MAAM,IAAI,CACP,oBAAC,oBAAY,uBACL,IAAI,IACR,OAAO,EAAE,KAAK,EACd,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,qCAAqC,KAE1C,KAAK,CAAC,GAAG,CAAC,UAAC,IAAY,EAAE,KAAa,IAAK,OAAA,CACxC,oBAAC,uBAAgB,qBACb,GAAG,EAAE,KAAK,EACV,QAAQ,EAAE,YAAY,KAAK,IAAI,EAC/B,WAAW,EAAE,gBAAgB,KAAK,KAAK,IACnC,YAAY,CAAC,EAAE,IAAI,MAAA,EAAE,CAAC,GAEzB,IAAI,CACU,CACtB,EAT2C,CAS3C,CAAC,CACS,CAClB,CACC,CACT,CAAA;IACL,CAAC,CACO,CACf,CAAA;CAAA,CAAA;AAEY,QAAA,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,eAAO,CAAC,IAAI,GAAG,EAAE,CAAA"}

package/dist/components/Autocomplete/styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledAutocomplete: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/Autocomplete/styles.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledAutocomplete = void 0;
+var tslib_1 = require("tslib");
+var styled_components_1 = require("styled-components");
+exports.StyledAutocomplete = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n    position: absolute;\n    background: white;\n    width: 100%;\n    max-height: 300px;\n    overflow-y: scroll;\n    z-index: 100;\n    margin-top: ", "px;\n    border-radius: ", "px;\n    border: 1px solid ", ";\n    box-shadow: 0px 0px 20px rgba(90, 94, 101, 0.1);\n"], ["\n    position: absolute;\n    background: white;\n    width: 100%;\n    max-height: 300px;\n    overflow-y: scroll;\n    z-index: 100;\n    margin-top: ", "px;\n    border-radius: ", "px;\n    border: 1px solid ", ";\n    box-shadow: 0px 0px 20px rgba(90, 94, 101, 0.1);\n"])), function (props) { return props.theme.spacing[1]; }, function (props) { return props.theme.borderRadius.default; }, function (props) { return props.theme.colors.grey[4]; });
+var templateObject_1;
+//# sourceMappingURL=styles.js.map

package/dist/components/Autocomplete/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/Autocomplete/styles.ts"],"names":[],"mappings":";;;;AAAA,uDAAsC;AAEzB,QAAA,kBAAkB,GAAG,2BAAM,CAAC,GAAG,8VAAA,2JAO1B,EAA+B,0BAC5B,EAAyC,6BACtC,EAAmC,2DAE1D,KAJiB,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAtB,CAAsB,EAC5B,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,KAAK,CAAC,YAAY,CAAC,OAAO,EAAhC,CAAgC,EACtC,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAA1B,CAA0B,EAE1D"}

package/dist/components/Badge/index.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+export interface BadgeProps {
+    kind?: 'action' | 'stale' | 'disabled';
+}
+export declare const Badge: React.FC<BadgeProps>;

package/dist/components/Badge/index.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Badge = void 0;
+var tslib_1 = require("tslib");
+var React = require("react");
+var styles_1 = require("./styles");
+var Badge = function (_a) {
+    var children = _a.children, kind = _a.kind, props = tslib_1.__rest(_a, ["children", "kind"]);
+    return (React.createElement(styles_1.StyledBadge, tslib_1.__assign({ kind: kind }, props), children));
+};
+exports.Badge = Badge;
+//# sourceMappingURL=index.js.map

package/dist/components/Badge/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Badge/index.tsx"],"names":[],"mappings":";;;;AAAA,6BAA8B;AAC9B,mCAAsC;AAM/B,IAAM,KAAK,GAAyB,UAAC,EAA4B;IAA1B,IAAA,QAAQ,cAAA,EAAE,IAAI,UAAA,EAAK,KAAK,sBAA1B,oBAA4B,CAAF;IAAO,OAAA,CACzE,oBAAC,oBAAW,qBAAC,IAAI,EAAE,IAAI,IAAM,KAAK,GAC7B,QAAQ,CACC,CACjB,CAAA;CAAA,CAAA;AAJY,QAAA,KAAK,SAIjB"}

package/dist/components/Badge/index.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, Story } from '@storybook/react/types-6-0';
+import { BadgeProps } from '.';
+declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
+export default _default;
+export declare const Default: Story<BadgeProps>;
+export declare const Action: Story<BadgeProps>;
+export declare const Disabled: Story<BadgeProps>;
+export declare const Stale: Story<BadgeProps>;

package/dist/components/Badge/index.stories.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Stale = exports.Disabled = exports.Action = exports.Default = void 0;
+var tslib_1 = require("tslib");
+var react_1 = require("react");
+var _1 = require(".");
+exports.default = {
+    title: 'Hexagon/Badge',
+    component: _1.Badge,
+    decorators: [function (Story) { return react_1.default.createElement(Story, null); }],
+};
+var Template = function (_a) {
+    var args = tslib_1.__rest(_a, []);
+    return react_1.default.createElement(_1.Badge, tslib_1.__assign({}, args), "4");
+};
+exports.Default = Template.bind({});
+exports.Action = Template.bind({});
+exports.Action.args = {
+    kind: 'action',
+};
+exports.Disabled = Template.bind({});
+exports.Disabled.args = {
+    kind: 'disabled',
+};
+exports.Stale = Template.bind({});
+exports.Stale.args = {
+    kind: 'stale',
+};
+//# sourceMappingURL=index.stories.js.map

package/dist/components/Badge/index.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../src/components/Badge/index.stories.tsx"],"names":[],"mappings":";;;;AACA,+BAAyB;AACzB,sBAAqC;AAErC,kBAAe;IACX,KAAK,EAAE,eAAe;IACtB,SAAS,EAAE,QAAK;IAChB,UAAU,EAAE,CAAC,UAAA,KAAK,IAAI,OAAA,8BAAC,KAAK,OAAG,EAAT,CAAS,CAAC;CAC3B,CAAA;AAET,IAAM,QAAQ,GAAsB,UAAC,EAAW;QAAN,IAAI,sBAAT,EAAW,CAAF;IAAO,OAAA,8BAAC,QAAK,uBAAK,IAAI,OAAW,CAAA;CAAA,CAAA;AAElE,QAAA,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE3B,QAAA,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACvC,cAAM,CAAC,IAAI,GAAG;IACV,IAAI,EAAE,QAAQ;CACjB,CAAA;AAEY,QAAA,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACzC,gBAAQ,CAAC,IAAI,GAAG;IACZ,IAAI,EAAE,UAAU;CACnB,CAAA;AAEY,QAAA,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACtC,aAAK,CAAC,IAAI,GAAG;IACT,IAAI,EAAE,OAAO;CAChB,CAAA"}

package/dist/components/Badge/styles.d.ts

@@ -0,0 +1,2 @@
+import { BadgeProps } from '.';
+export declare const StyledBadge: import("styled-components").StyledComponent<"div", any, BadgeProps, never>;