@aivenio/aquarium 0.0.1

package/dist/src/icons/widget.js

@@ -0,0 +1,11 @@
+"use strict";
+const data = {
+    "body": "<path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M18 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2ZM2 16c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2Zm15-1h2V5h-2v10ZM3 5H1v10h2V5ZM2 0C.9 0 0 .9 0 2s.9 2 2 2 2-.9 2-2-.9-2-2-2Zm3 3h10V1H5v2Zm13 13c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2ZM5 19h10v-2H5v2Z\" clip-rule=\"evenodd\"/>",
+    "left": 0,
+    "top": 0,
+    "width": 20,
+    "height": 20
+};
+exports.__esModule = true;
+exports.default = data;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2lkZ2V0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2ljb25zL3dpZGdldC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsTUFBTSxJQUFJLEdBQUc7SUFDWixNQUFNLEVBQUUsZ1ZBQWdWO0lBQ3hWLE1BQU0sRUFBRSxDQUFDO0lBQ1QsS0FBSyxFQUFFLENBQUM7SUFDUixPQUFPLEVBQUUsRUFBRTtJQUNYLFFBQVEsRUFBRSxFQUFFO0NBQ1osQ0FBQztBQUNGLE9BQU8sQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDO0FBQzFCLE9BQU8sQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDIn0=

package/dist/src/icons/widgetButton.d.ts

@@ -0,0 +1,9 @@
+export const __esModule: true;
+export default data;
+declare namespace data {
+    const body: string;
+    const left: number;
+    const top: number;
+    const width: number;
+    const height: number;
+}

package/dist/src/icons/widgetButton.js

@@ -0,0 +1,11 @@
+"use strict";
+const data = {
+    "body": "<path fill=\"currentColor\" d=\"M1 4h18c.55 0 1 .45 1 1v10c0 .55-.45 1-1 1H1c-.55 0-1-.45-1-1V5c0-.55.45-1 1-1Zm1 2v8h16V6H2Zm4 5c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1Zm4 0c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1Zm4 0c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1Z\"/>",
+    "left": 0,
+    "top": 0,
+    "width": 20,
+    "height": 20
+};
+exports.__esModule = true;
+exports.default = data;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2lkZ2V0QnV0dG9uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2ljb25zL3dpZGdldEJ1dHRvbi5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsTUFBTSxJQUFJLEdBQUc7SUFDWixNQUFNLEVBQUUsK1JBQStSO0lBQ3ZTLE1BQU0sRUFBRSxDQUFDO0lBQ1QsS0FBSyxFQUFFLENBQUM7SUFDUixPQUFPLEVBQUUsRUFBRTtJQUNYLFFBQVEsRUFBRSxFQUFFO0NBQ1osQ0FBQztBQUNGLE9BQU8sQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDO0FBQzFCLE9BQU8sQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDIn0=

package/dist/src/icons/widgetFooter.d.ts

@@ -0,0 +1,9 @@
+export const __esModule: true;
+export default data;
+declare namespace data {
+    const body: string;
+    const left: number;
+    const top: number;
+    const width: number;
+    const height: number;
+}

package/dist/src/icons/widgetFooter.js

@@ -0,0 +1,11 @@
+"use strict";
+const data = {
+    "body": "<path fill=\"currentColor\" d=\"M17 0H3c-.55 0-1 .45-1 1v18c0 .55.45 1 1 1h14c.55 0 1-.45 1-1V1c0-.55-.45-1-1-1Zm-1 18H4v-4h12v4Zm0-5H4V2h12v11Z\"/>",
+    "left": 0,
+    "top": 0,
+    "width": 20,
+    "height": 20
+};
+exports.__esModule = true;
+exports.default = data;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2lkZ2V0Rm9vdGVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2ljb25zL3dpZGdldEZvb3Rlci5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsTUFBTSxJQUFJLEdBQUc7SUFDWixNQUFNLEVBQUUsc0pBQXNKO0lBQzlKLE1BQU0sRUFBRSxDQUFDO0lBQ1QsS0FBSyxFQUFFLENBQUM7SUFDUixPQUFPLEVBQUUsRUFBRTtJQUNYLFFBQVEsRUFBRSxFQUFFO0NBQ1osQ0FBQztBQUNGLE9BQU8sQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDO0FBQzFCLE9BQU8sQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDIn0=

package/dist/src/icons/widgetHeader.d.ts

@@ -0,0 +1,9 @@
+export const __esModule: true;
+export default data;
+declare namespace data {
+    const body: string;
+    const left: number;
+    const top: number;
+    const width: number;
+    const height: number;
+}

package/dist/src/icons/widgetHeader.js

@@ -0,0 +1,11 @@
+"use strict";
+const data = {
+    "body": "<path fill=\"currentColor\" d=\"M17 0H3c-.55 0-1 .45-1 1v18c0 .55.45 1 1 1h14c.55 0 1-.45 1-1V1c0-.55-.45-1-1-1Zm-1 18H4V7h12v11Zm0-12H4V2h12v4Z\"/>",
+    "left": 0,
+    "top": 0,
+    "width": 20,
+    "height": 20
+};
+exports.__esModule = true;
+exports.default = data;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2lkZ2V0SGVhZGVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2ljb25zL3dpZGdldEhlYWRlci5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsTUFBTSxJQUFJLEdBQUc7SUFDWixNQUFNLEVBQUUsc0pBQXNKO0lBQzlKLE1BQU0sRUFBRSxDQUFDO0lBQ1QsS0FBSyxFQUFFLENBQUM7SUFDUixPQUFPLEVBQUUsRUFBRTtJQUNYLFFBQVEsRUFBRSxFQUFFO0NBQ1osQ0FBQztBQUNGLE9BQU8sQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDO0FBQzFCLE9BQU8sQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDIn0=

package/dist/src/icons/wrench.d.ts

@@ -0,0 +1,9 @@
+export const __esModule: true;
+export default data;
+declare namespace data {
+    const body: string;
+    const left: number;
+    const top: number;
+    const width: number;
+    const height: number;
+}

package/dist/src/icons/wrench.js

@@ -0,0 +1,11 @@
+"use strict";
+const data = {
+    "body": "<g fill=\"none\"><g clip-path=\"url(#svgIDa)\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M19.8 4.44 16.13 8.1l-3.55-.71-.71-3.53L15.54.21c-2.01-.53-4.23-.03-5.8 1.53-1.86 1.85-2.23 4.6-1.14 6.83L.59 16.59C.22 16.95 0 17.45 0 18a2 2 0 002 2c.55 0 1.05-.22 1.41-.59l8.03-8.04c2.23 1.05 4.97.67 6.82-1.16 1.57-1.56 2.07-3.77 1.54-5.77Z\" clip-rule=\"evenodd\"/></g><defs><clipPath id=\"svgIDa\"><path fill=\"#fff\" d=\"M0 0h20v20H0z\"/></clipPath></defs></g>",
+    "left": 0,
+    "top": 0,
+    "width": 20,
+    "height": 20
+};
+exports.__esModule = true;
+exports.default = data;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid3JlbmNoLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2ljb25zL3dyZW5jaC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsTUFBTSxJQUFJLEdBQUc7SUFDWixNQUFNLEVBQUUscWRBQXFkO0lBQzdkLE1BQU0sRUFBRSxDQUFDO0lBQ1QsS0FBSyxFQUFFLENBQUM7SUFDUixPQUFPLEVBQUUsRUFBRTtJQUNYLFFBQVEsRUFBRSxFQUFFO0NBQ1osQ0FBQztBQUNGLE9BQU8sQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDO0FBQzFCLE9BQU8sQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDIn0=

package/dist/src/icons/zoomIn.d.ts

@@ -0,0 +1,9 @@
+export const __esModule: true;
+export default data;
+declare namespace data {
+    const body: string;
+    const left: number;
+    const top: number;
+    const width: number;
+    const height: number;
+}

package/dist/src/icons/zoomIn.js

@@ -0,0 +1,11 @@
+"use strict";
+const data = {
+    "body": "<path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"m19.56 17.44-4.94-4.94A8.004 8.004 0 0016 8c0-4.42-3.58-8-8-8S0 3.58 0 8s3.58 8 8 8c1.67 0 3.21-.51 4.5-1.38l4.94 4.94a1.498 1.498 0 102.12-2.12ZM8 14c-3.31 0-6-2.69-6-6s2.69-6 6-6 6 2.69 6 6-2.69 6-6 6Zm3-7H9V5c0-.55-.45-1-1-1s-1 .45-1 1v2H5c-.55 0-1 .45-1 1s.45 1 1 1h2v2c0 .55.45 1 1 1s1-.45 1-1V9h2c.55 0 1-.45 1-1s-.45-1-1-1Z\" clip-rule=\"evenodd\"/>",
+    "left": 0,
+    "top": 0,
+    "width": 20,
+    "height": 20
+};
+exports.__esModule = true;
+exports.default = data;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiem9vbUluLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2ljb25zL3pvb21Jbi5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsTUFBTSxJQUFJLEdBQUc7SUFDWixNQUFNLEVBQUUsNFpBQTRaO0lBQ3BhLE1BQU0sRUFBRSxDQUFDO0lBQ1QsS0FBSyxFQUFFLENBQUM7SUFDUixPQUFPLEVBQUUsRUFBRTtJQUNYLFFBQVEsRUFBRSxFQUFFO0NBQ1osQ0FBQztBQUNGLE9BQU8sQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDO0FBQzFCLE9BQU8sQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDIn0=

package/dist/src/icons/zoomOut.d.ts

@@ -0,0 +1,9 @@
+export const __esModule: true;
+export default data;
+declare namespace data {
+    const body: string;
+    const left: number;
+    const top: number;
+    const width: number;
+    const height: number;
+}

package/dist/src/icons/zoomOut.js

@@ -0,0 +1,11 @@
+"use strict";
+const data = {
+    "body": "<path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M11 7H5c-.55 0-1 .45-1 1s.45 1 1 1h6c.55 0 1-.45 1-1s-.45-1-1-1Zm8.56 10.44-4.94-4.94A8.004 8.004 0 0016 8c0-4.42-3.58-8-8-8S0 3.58 0 8s3.58 8 8 8c1.67 0 3.21-.51 4.5-1.38l4.94 4.94a1.498 1.498 0 102.12-2.12ZM8 14c-3.31 0-6-2.69-6-6s2.69-6 6-6 6 2.69 6 6-2.69 6-6 6Z\" clip-rule=\"evenodd\"/>",
+    "left": 0,
+    "top": 0,
+    "width": 20,
+    "height": 20
+};
+exports.__esModule = true;
+exports.default = data;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiem9vbU91dC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9pY29ucy96b29tT3V0LmpzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxNQUFNLElBQUksR0FBRztJQUNaLE1BQU0sRUFBRSw0VkFBNFY7SUFDcFcsTUFBTSxFQUFFLENBQUM7SUFDVCxLQUFLLEVBQUUsQ0FBQztJQUNSLE9BQU8sRUFBRSxFQUFFO0lBQ1gsUUFBUSxFQUFFLEVBQUU7Q0FDWixDQUFDO0FBQ0YsT0FBTyxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUM7QUFDMUIsT0FBTyxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUMifQ==

package/dist/src/icons/zoomToFit.d.ts

@@ -0,0 +1,9 @@
+export const __esModule: true;
+export default data;
+declare namespace data {
+    const body: string;
+    const left: number;
+    const top: number;
+    const width: number;
+    const height: number;
+}

package/dist/src/icons/zoomToFit.js

@@ -0,0 +1,11 @@
+"use strict";
+const data = {
+    "body": "<path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M1 7c.55 0 1-.45 1-1V2h4c.55 0 1-.45 1-1s-.45-1-1-1H1C.45 0 0 .45 0 1v5c0 .55.45 1 1 1Zm5 1a1.003 1.003 0 00-1.71-.71l-2 2c-.18.18-.29.43-.29.71 0 .28.11.53.29.71l2 2a1.003 1.003 0 001.42-1.42L4.41 10 5.7 8.71c.19-.18.3-.43.3-.71Zm2-2c.28 0 .53-.11.71-.29L10 4.41l1.29 1.29c.18.19.43.3.71.3a1.003 1.003 0 00.71-1.71l-2-2A.997.997 0 0010 2c-.28 0-.53.11-.71.29l-2 2A1.003 1.003 0 008 6ZM6 18H2v-4c0-.55-.45-1-1-1s-1 .45-1 1v5c0 .55.45 1 1 1h5c.55 0 1-.45 1-1s-.45-1-1-1Zm8-6a1.003 1.003 0 001.71.71l2-2c.18-.18.29-.43.29-.71 0-.28-.11-.53-.29-.71l-2-2a1.003 1.003 0 00-1.42 1.42l1.3 1.29-1.29 1.29c-.19.18-.3.43-.3.71Zm5-12h-5c-.55 0-1 .45-1 1s.45 1 1 1h4v4c0 .55.45 1 1 1s1-.45 1-1V1c0-.55-.45-1-1-1Zm-7 14c-.28 0-.53.11-.71.29L10 15.59 8.71 14.3A.965.965 0 008 14a1.003 1.003 0 00-.71 1.71l2 2c.18.18.43.29.71.29.28 0 .53-.11.71-.29l2-2A1.003 1.003 0 0012 14Zm7-1c-.55 0-1 .45-1 1v4h-4c-.55 0-1 .45-1 1s.45 1 1 1h5c.55 0 1-.45 1-1v-5c0-.55-.45-1-1-1Z\" clip-rule=\"evenodd\"/>",
+    "left": 0,
+    "top": 0,
+    "width": 20,
+    "height": 20
+};
+exports.__esModule = true;
+exports.default = data;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiem9vbVRvRml0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2ljb25zL3pvb21Ub0ZpdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsTUFBTSxJQUFJLEdBQUc7SUFDWixNQUFNLEVBQUUseWdDQUF5Z0M7SUFDamhDLE1BQU0sRUFBRSxDQUFDO0lBQ1QsS0FBSyxFQUFFLENBQUM7SUFDUixPQUFPLEVBQUUsRUFBRTtJQUNYLFFBQVEsRUFBRSxFQUFFO0NBQ1osQ0FBQztBQUNGLE9BQU8sQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDO0FBQzFCLE9BQU8sQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDIn0=

package/dist/src/js/resolveTheme.d.ts

@@ -0,0 +1,6 @@
+// Relative path required here
+import { Theme } from '../../types/designTokens';
+
+// Note: this doesn't verify that resolveTheme.js does the right thing
+//       it is just a "forced" type signature
+export const theme: Theme;

package/dist/src/js/resolveTheme.js

@@ -0,0 +1,22 @@
+"use strict";
+// We want to share this logic between Aquarium design system Typescript code and
+// Tailwind config that is JavaScript. tailwind.config.js is expecting
+// CommonJS modules.
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const tokensJson = require('../../tokens.json');
+// Aim of no-process-env is to specify process variables in a single place
+// so that the input variables to app is not scattered around the code base.
+// In this it makes more sense to just refer to env variable directly.
+//
+//  For storybook, we need to prefix the env var with STORYBOOK_, see:
+//  https://storybook.js.org/docs/react/configure/environment-variables
+//
+// eslint-disable-next-line
+const themeName = process.env.THEME || process.env.STORYBOOK_THEME || 'aiven';
+if (!(themeName in tokensJson.themes)) {
+    throw new Error(`Could not find theme '${themeName}' from tokens.json`);
+}
+module.exports = {
+    theme: tokensJson.themes[themeName],
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmVzb2x2ZVRoZW1lLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2pzL3Jlc29sdmVUaGVtZS5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsaUZBQWlGO0FBQ2pGLHNFQUFzRTtBQUN0RSxvQkFBb0I7QUFDcEIsOERBQThEO0FBQzlELE1BQU0sVUFBVSxHQUFHLE9BQU8sQ0FBQyxtQkFBbUIsQ0FBQyxDQUFDO0FBRWhELDBFQUEwRTtBQUMxRSw0RUFBNEU7QUFDNUUsc0VBQXNFO0FBQ3RFLEVBQUU7QUFDRixzRUFBc0U7QUFDdEUsdUVBQXVFO0FBQ3ZFLEVBQUU7QUFDRiwyQkFBMkI7QUFDM0IsTUFBTSxTQUFTLEdBQUcsT0FBTyxDQUFDLEdBQUcsQ0FBQyxLQUFLLElBQUksT0FBTyxDQUFDLEdBQUcsQ0FBQyxlQUFlLElBQUksT0FBTyxDQUFDO0FBRTlFLElBQUksQ0FBQyxDQUFDLFNBQVMsSUFBSSxVQUFVLENBQUMsTUFBTSxDQUFDLEVBQUU7SUFDckMsTUFBTSxJQUFJLEtBQUssQ0FBQyx5QkFBeUIsU0FBUyxvQkFBb0IsQ0FBQyxDQUFDO0NBQ3pFO0FBRUQsTUFBTSxDQUFDLE9BQU8sR0FBRztJQUNmLEtBQUssRUFBRSxVQUFVLENBQUMsTUFBTSxDQUFDLFNBQVMsQ0FBQztDQUNwQyxDQUFDIn0=

package/dist/src/system.d.ts

@@ -0,0 +1,15 @@
+import { Theme } from '../types/designTokens';
+import { theme } from '../src/js/resolveTheme.js';
+export * from './components';
+export * from './utils/positioner';
+export * from './utils/form/Label/Label';
+export * from './utils/form/CharCounter/CharCounter';
+export * from './utils/form/HelperText/HelperText';
+export * from './utils/form/FormControl/FormControl';
+export * from './utils/createComponent';
+export { theme };
+import * as components from './components';
+declare const _default: typeof components & {
+    theme: Theme;
+};
+export default _default;

package/dist/src/system.js

@@ -0,0 +1,19 @@
+import tokensJson from '../tokens.json';
+import { theme } from '../src/js/resolveTheme.js';
+// The main entrypoint for building CSS
+// import 'src/main.css';
+// This type check is important to verify that tokens.json is matching
+// the expected type
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const typeCheckedTokensJson = tokensJson;
+export * from './components';
+export * from './utils/positioner';
+export * from './utils/form/Label/Label';
+export * from './utils/form/CharCounter/CharCounter';
+export * from './utils/form/HelperText/HelperText';
+export * from './utils/form/FormControl/FormControl';
+export * from './utils/createComponent';
+export { theme };
+import * as components from './components';
+export default Object.assign(Object.assign({}, components), { theme });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3lzdGVtLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL3N5c3RlbS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFDQSxPQUFPLFVBQVUsTUFBTSxhQUFhLENBQUM7QUFDckMsT0FBTyxFQUFFLEtBQUssRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQy9DLHVDQUF1QztBQUN2Qyx5QkFBeUI7QUFFekIsc0VBQXNFO0FBQ3RFLG9CQUFvQjtBQUNwQiw2REFBNkQ7QUFDN0QsTUFBTSxxQkFBcUIsR0FBRyxVQUFvQixDQUFDO0FBRW5ELGNBQWMsY0FBYyxDQUFDO0FBQzdCLGNBQWMsb0JBQW9CLENBQUM7QUFDbkMsY0FBYywwQkFBMEIsQ0FBQztBQUN6QyxjQUFjLHNDQUFzQyxDQUFDO0FBQ3JELGNBQWMsb0NBQW9DLENBQUM7QUFDbkQsY0FBYyxzQ0FBc0MsQ0FBQztBQUNyRCxjQUFjLHlCQUF5QixDQUFDO0FBRXhDLE9BQU8sRUFBRSxLQUFLLEVBQUUsQ0FBQztBQUVqQixPQUFPLEtBQUssVUFBVSxNQUFNLGNBQWMsQ0FBQztBQUMzQyxlQUFlLGdDQUNWLFVBQVUsS0FDYixLQUFLLEdBQ2tDLENBQUMifQ==

package/dist/src/utils/breakpoints.d.ts

@@ -0,0 +1,11 @@
+import { BreakpointsObject, Breakpoint, Breakpointable } from '../../types/tailwind';
+import { WindowSize } from '../../src/utils/useWindowSize';
+export declare type BreakpointMatches = {
+    [key in Breakpoint]: boolean;
+};
+export declare type ScreenToPxMapping = {
+    [key in Breakpoint]: number;
+};
+export declare function getPxMapping(breakpoints: BreakpointsObject): ScreenToPxMapping;
+export declare function getMatches(windowSize: WindowSize): BreakpointMatches;
+export declare function selectBreakpointValue(value: Breakpointable<any>, matches: BreakpointMatches): any;

package/dist/src/utils/breakpoints.js

@@ -0,0 +1,45 @@
+import isUndefined from 'lodash/isUndefined';
+import orderBy from 'lodash/orderBy';
+import isPlainObject from 'lodash/isPlainObject';
+import theme from '../../tailwind.theme.json';
+const { screens: allBreakpoints } = theme;
+// Make this a constant to avoid ordering the screens from each window resize
+const SCREEN_TO_PX_MAPPING = getPxMapping(allBreakpoints);
+const BREAKPOINT_PRIORITY = orderBy(Object.keys(SCREEN_TO_PX_MAPPING).map((key) => {
+    return {
+        breakpoint: key,
+        pxValue: SCREEN_TO_PX_MAPPING[key],
+    };
+}), (bp) => bp.pxValue, 'desc');
+export function getPxMapping(breakpoints) {
+    return Object.keys(breakpoints).reduce((acc, key) => {
+        const minWidthInPx = breakpoints[key];
+        if (!minWidthInPx.endsWith('px')) {
+            throw new Error(`Unexpected breakpoint value found: '${minWidthInPx}'. Expecting it to be in px unit.`);
+        }
+        return Object.assign(Object.assign({}, acc), { [key]: parseInt(minWidthInPx, 10) });
+    }, {});
+}
+export function getMatches(windowSize) {
+    const mapping = getPxMapping(allBreakpoints);
+    return Object.keys(allBreakpoints).reduce((acc, key) => {
+        // If window is undefined or width is under 1px, set default breakpoint as true, and everything else as false
+        const isMatch = !isUndefined(windowSize) && windowSize.width > 0
+            ? windowSize.width > mapping[key]
+            : key === 'default'
+                ? true
+                : false;
+        return Object.assign(Object.assign({}, acc), { [key]: isMatch });
+    }, {});
+}
+export function selectBreakpointValue(value, matches) {
+    const bp = BREAKPOINT_PRIORITY.find((bp) => {
+        const pickBreakpoint = isPlainObject(value) && bp.breakpoint in value ? bp.breakpoint : undefined;
+        return !isUndefined(pickBreakpoint) && matches[bp.breakpoint];
+    });
+    if (!isUndefined(bp)) {
+        return value[bp.breakpoint];
+    }
+    return value;
+}
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnJlYWtwb2ludHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvdXRpbHMvYnJlYWtwb2ludHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxXQUFXLE1BQU0sb0JBQW9CLENBQUM7QUFDN0MsT0FBTyxPQUFPLE1BQU0sZ0JBQWdCLENBQUM7QUFDckMsT0FBTyxhQUFhLE1BQU0sc0JBQXNCLENBQUM7QUFHakQsT0FBTyxLQUFLLE1BQU0scUJBQXFCLENBQUM7QUFDeEMsTUFBTSxFQUFFLE9BQU8sRUFBRSxjQUFjLEVBQUUsR0FBRyxLQUFLLENBQUM7QUFRMUMsNkVBQTZFO0FBQzdFLE1BQU0sb0JBQW9CLEdBQUcsWUFBWSxDQUFDLGNBQWMsQ0FBQyxDQUFDO0FBQzFELE1BQU0sbUJBQW1CLEdBQUcsT0FBTyxDQUNqQyxNQUFNLENBQUMsSUFBSSxDQUFDLG9CQUFvQixDQUFDLENBQUMsR0FBRyxDQUFDLENBQUMsR0FBRyxFQUFFLEVBQUU7SUFDNUMsT0FBTztRQUNMLFVBQVUsRUFBRSxHQUFpQjtRQUM3QixPQUFPLEVBQUUsb0JBQW9CLENBQUMsR0FBaUIsQ0FBQztLQUNqRCxDQUFDO0FBQ0osQ0FBQyxDQUFDLEVBQ0YsQ0FBQyxFQUFFLEVBQUUsRUFBRSxDQUFDLEVBQUUsQ0FBQyxPQUFPLEVBQ2xCLE1BQU0sQ0FDUCxDQUFDO0FBRUYsTUFBTSxVQUFVLFlBQVksQ0FBQyxXQUE4QjtJQUN6RCxPQUFPLE1BQU0sQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxFQUFFO1FBQ2xELE1BQU0sWUFBWSxHQUFHLFdBQVcsQ0FBQyxHQUFpQixDQUFDLENBQUM7UUFDcEQsSUFBSSxDQUFDLFlBQVksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEVBQUU7WUFDaEMsTUFBTSxJQUFJLEtBQUssQ0FBQyx1Q0FBdUMsWUFBWSxtQ0FBbUMsQ0FBQyxDQUFDO1NBQ3pHO1FBRUQsdUNBQ0ssR0FBRyxLQUNOLENBQUMsR0FBRyxDQUFDLEVBQUUsUUFBUSxDQUFDLFlBQVksRUFBRSxFQUFFLENBQUMsSUFDakM7SUFDSixDQUFDLEVBQUUsRUFBdUIsQ0FBQyxDQUFDO0FBQzlCLENBQUM7QUFFRCxNQUFNLFVBQVUsVUFBVSxDQUFDLFVBQXNCO0lBQy9DLE1BQU0sT0FBTyxHQUFHLFlBQVksQ0FBQyxjQUFjLENBQUMsQ0FBQztJQUU3QyxPQUFPLE1BQU0sQ0FBQyxJQUFJLENBQUMsY0FBYyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxFQUFFO1FBQ3JELDZHQUE2RztRQUM3RyxNQUFNLE9BQU8sR0FDWCxDQUFDLFdBQVcsQ0FBQyxVQUFVLENBQUMsSUFBSSxVQUFVLENBQUMsS0FBSyxHQUFHLENBQUM7WUFDOUMsQ0FBQyxDQUFDLFVBQVUsQ0FBQyxLQUFLLEdBQUcsT0FBTyxDQUFDLEdBQWlCLENBQUM7WUFDL0MsQ0FBQyxDQUFDLEdBQUcsS0FBSyxTQUFTO2dCQUNuQixDQUFDLENBQUMsSUFBSTtnQkFDTixDQUFDLENBQUMsS0FBSyxDQUFDO1FBRVosdUNBQ0ssR0FBRyxLQUNOLENBQUMsR0FBRyxDQUFDLEVBQUUsT0FBTyxJQUNkO0lBQ0osQ0FBQyxFQUFFLEVBQXVCLENBQUMsQ0FBQztBQUM5QixDQUFDO0FBRUQsTUFBTSxVQUFVLHFCQUFxQixDQUFDLEtBQTBCLEVBQUUsT0FBMEI7SUFDMUYsTUFBTSxFQUFFLEdBQUcsbUJBQW1CLENBQUMsSUFBSSxDQUFDLENBQUMsRUFBRSxFQUFFLEVBQUU7UUFDekMsTUFBTSxjQUFjLEdBQUcsYUFBYSxDQUFDLEtBQUssQ0FBQyxJQUFJLEVBQUUsQ0FBQyxVQUFVLElBQUksS0FBSyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUM7UUFDbEcsT0FBTyxDQUFDLFdBQVcsQ0FBQyxjQUFjLENBQUMsSUFBSSxPQUFPLENBQUMsRUFBRSxDQUFDLFVBQVUsQ0FBQyxDQUFDO0lBQ2hFLENBQUMsQ0FBQyxDQUFDO0lBRUgsSUFBSSxDQUFDLFdBQVcsQ0FBQyxFQUFFLENBQUMsRUFBRTtRQUNwQixPQUFPLEtBQUssQ0FBQyxFQUFFLENBQUMsVUFBVSxDQUFDLENBQUM7S0FDN0I7SUFFRCxPQUFPLEtBQUssQ0FBQztBQUNmLENBQUMifQ==

package/dist/src/utils/constants.d.ts

@@ -0,0 +1,4 @@
+export declare const getCommonInputStyles: ({ readOnly, valid }: {
+    readOnly: boolean;
+    valid: boolean;
+}) => string;

package/dist/src/utils/constants.js

@@ -0,0 +1,8 @@
+import { tw } from '../../src/utils/tailwind';
+export const getCommonInputStyles = ({ readOnly, valid }) => tw('block w-full rounded-sm disabled:cursor-not-allowed disabled:border-grey-20 disabled:bg-grey-5 typography-body-small text-grey-70 disabled:text-grey-40 placeholder:text-grey-40 focus:outline-none', {
+    'px-3 py-3': !readOnly,
+    'border-none resize-none cursor-default': readOnly,
+    'border border-error-50': !valid && !readOnly,
+    'border border-grey-20 hover:border-grey-50 focus:border-info-70': valid && !readOnly,
+});
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29uc3RhbnRzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL3V0aWxzL2NvbnN0YW50cy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFFeEMsTUFBTSxDQUFDLE1BQU0sb0JBQW9CLEdBQUcsQ0FBQyxFQUFFLFFBQVEsRUFBRSxLQUFLLEVBQXlDLEVBQVUsRUFBRSxDQUN6RyxFQUFFLENBQ0EscU1BQXFNLEVBQ3JNO0lBQ0UsV0FBVyxFQUFFLENBQUMsUUFBUTtJQUN0Qix3Q0FBd0MsRUFBRSxRQUFRO0lBQ2xELHdCQUF3QixFQUFFLENBQUMsS0FBSyxJQUFJLENBQUMsUUFBUTtJQUM3QyxpRUFBaUUsRUFBRSxLQUFLLElBQUksQ0FBQyxRQUFRO0NBQ3RGLENBQ0YsQ0FBQyJ9

package/dist/src/utils/createComponent.d.ts

@@ -0,0 +1,3 @@
+import React, { ComponentType } from 'react';
+export declare const createComponent: <T extends Record<string, unknown>, E = unknown>(Component: React.ComponentType<T>, freezedProps: Partial<E>, defaultProps: Partial<T>, displayName: string) => React.ComponentType<Omit<T, keyof E>>;
+export declare const createSimpleComponent: <T extends Record<string, unknown>>(Component: React.ComponentType<T>, defaultProps: Partial<T>, displayName: string) => React.ComponentType<T>;

package/dist/src/utils/createComponent.js

@@ -0,0 +1,29 @@
+import { classNames } from '../../src/utils/tailwind';
+import React from 'react';
+const hasClassName = (val) => {
+    return val.className !== undefined;
+};
+export const createComponent = (Component, freezedProps, // use this for pre-set values that can NOT be modified anymore when use the component.
+defaultProps, // use this for pre-set values that can still be modified when use the component.
+displayName) => {
+    const defaultClassName = hasClassName(defaultProps) ? defaultProps.className : '';
+    const Curried = (props) => {
+        const combinedProps = Object.assign(Object.assign(Object.assign({}, defaultProps), freezedProps), props);
+        const propsClassName = hasClassName(props) ? props.className : '';
+        const className = defaultClassName || propsClassName ? classNames(defaultClassName, propsClassName) : undefined;
+        return React.createElement(Component, Object.assign({}, combinedProps, { className: className }));
+    };
+    Curried.displayName = displayName;
+    return Curried;
+};
+export const createSimpleComponent = (Component, defaultProps, displayName) => {
+    const defaultClassName = hasClassName(defaultProps) ? defaultProps.className : '';
+    const Curried = (props) => {
+        const propsClassName = hasClassName(props) ? props.className : '';
+        const className = defaultClassName || propsClassName ? classNames(defaultClassName, propsClassName) : undefined;
+        return React.createElement(Component, Object.assign({}, defaultProps, props, { className: className }));
+    };
+    Curried.displayName = displayName;
+    return Curried;
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3JlYXRlQ29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL3V0aWxzL2NyZWF0ZUNvbXBvbmVudC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLG9CQUFvQixDQUFDO0FBQ2hELE9BQU8sS0FBd0IsTUFBTSxPQUFPLENBQUM7QUFFN0MsTUFBTSxZQUFZLEdBQUcsQ0FBb0MsR0FBTSxFQUFvQyxFQUFFO0lBQ25HLE9BQVEsR0FBVyxDQUFDLFNBQVMsS0FBSyxTQUFTLENBQUM7QUFDOUMsQ0FBQyxDQUFDO0FBQ0YsTUFBTSxDQUFDLE1BQU0sZUFBZSxHQUFHLENBQzdCLFNBQTJCLEVBQzNCLFlBQXdCLEVBQUUsdUZBQXVGO0FBQ2pILFlBQXdCLEVBQUUsaUZBQWlGO0FBQzNHLFdBQW1CLEVBQ2MsRUFBRTtJQUNuQyxNQUFNLGdCQUFnQixHQUFHLFlBQVksQ0FBQyxZQUFZLENBQUMsQ0FBQyxDQUFDLENBQUMsWUFBWSxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDO0lBRWxGLE1BQU0sT0FBTyxHQUErQixDQUFDLEtBQUssRUFBRSxFQUFFO1FBQ3BELE1BQU0sYUFBYSxHQUFNLDhDQUFLLFlBQVksR0FBSyxZQUFZLEdBQUssS0FBSyxDQUFPLENBQUM7UUFDN0UsTUFBTSxjQUFjLEdBQUcsWUFBWSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUM7UUFDbEUsTUFBTSxTQUFTLEdBQUcsZ0JBQWdCLElBQUksY0FBYyxDQUFDLENBQUMsQ0FBQyxVQUFVLENBQUMsZ0JBQWdCLEVBQUUsY0FBYyxDQUFDLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQztRQUNoSCxPQUFPLG9CQUFDLFNBQVMsb0JBQUssYUFBYSxJQUFFLFNBQVMsRUFBRSxTQUFTLElBQUksQ0FBQztJQUNoRSxDQUFDLENBQUM7SUFFRixPQUFPLENBQUMsV0FBVyxHQUFHLFdBQVcsQ0FBQztJQUNsQyxPQUFPLE9BQU8sQ0FBQztBQUNqQixDQUFDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxxQkFBcUIsR0FBRyxDQUNuQyxTQUEyQixFQUMzQixZQUF3QixFQUN4QixXQUFtQixFQUNELEVBQUU7SUFDcEIsTUFBTSxnQkFBZ0IsR0FBRyxZQUFZLENBQUMsWUFBWSxDQUFDLENBQUMsQ0FBQyxDQUFDLFlBQVksQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQztJQUVsRixNQUFNLE9BQU8sR0FBZ0IsQ0FBQyxLQUFRLEVBQUUsRUFBRTtRQUN4QyxNQUFNLGNBQWMsR0FBRyxZQUFZLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQztRQUNsRSxNQUFNLFNBQVMsR0FBRyxnQkFBZ0IsSUFBSSxjQUFjLENBQUMsQ0FBQyxDQUFDLFVBQVUsQ0FBQyxnQkFBZ0IsRUFBRSxjQUFjLENBQUMsQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDO1FBQ2hILE9BQU8sb0JBQUMsU0FBUyxvQkFBSyxZQUFZLEVBQU0sS0FBSyxJQUFFLFNBQVMsRUFBRSxTQUFTLElBQUksQ0FBQztJQUMxRSxDQUFDLENBQUM7SUFFRixPQUFPLENBQUMsV0FBVyxHQUFHLFdBQVcsQ0FBQztJQUNsQyxPQUFPLE9BQU8sQ0FBQztBQUNqQixDQUFDLENBQUMifQ==

package/dist/src/utils/form/CharCounter/CharCounter.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare type CharCounterProps = {
+    dense?: boolean;
+    length: number;
+    maxLength: number;
+    valid?: boolean;
+};
+export declare const CharCounter: React.FC<CharCounterProps>;

package/dist/src/utils/form/CharCounter/CharCounter.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import { tw } from '../../../../src/utils/tailwind';
+export const CharCounter = ({ dense = true, length, maxLength, valid = true }) => {
+    return (React.createElement("span", { className: tw(`whitespace-nowrap`, valid ? 'text-grey-50' : 'text-error-70', dense ? 'typography-caption-default' : 'typography-body-small') }, `${length} / ${maxLength}`));
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2hhckNvdW50ZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvdXRpbHMvZm9ybS9DaGFyQ291bnRlci9DaGFyQ291bnRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQVN4QyxNQUFNLENBQUMsTUFBTSxXQUFXLEdBQStCLENBQUMsRUFBRSxLQUFLLEdBQUcsSUFBSSxFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQUUsS0FBSyxHQUFHLElBQUksRUFBRSxFQUFFLEVBQUU7SUFDM0csT0FBTyxDQUNMLDhCQUNFLFNBQVMsRUFBRSxFQUFFLENBQ1gsbUJBQW1CLEVBQ25CLEtBQUssQ0FBQyxDQUFDLENBQUMsY0FBYyxDQUFDLENBQUMsQ0FBQyxlQUFlLEVBQ3hDLEtBQUssQ0FBQyxDQUFDLENBQUMsNEJBQTRCLENBQUMsQ0FBQyxDQUFDLHVCQUF1QixDQUMvRCxJQUVBLEdBQUcsTUFBTSxNQUFNLFNBQVMsRUFBRSxDQUN0QixDQUNSLENBQUM7QUFDSixDQUFDLENBQUMifQ==

package/dist/src/utils/form/FormControl/FormControl.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+declare type Props = {
+    className?: string;
+    inline?: boolean;
+};
+export declare const FormControl: React.FC<Props>;
+export {};

package/dist/src/utils/form/FormControl/FormControl.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import { Flexbox } from '../../../../src/components';
+export const FormControl = ({ className, inline, children }) => {
+    return (React.createElement(Flexbox, { direction: 'column', display: inline ? 'inline-flex' : 'flex', className: className }, children));
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRm9ybUNvbnRyb2wuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvdXRpbHMvZm9ybS9Gb3JtQ29udHJvbC9Gb3JtQ29udHJvbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQU96QyxNQUFNLENBQUMsTUFBTSxXQUFXLEdBQW9CLENBQUMsRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLFFBQVEsRUFBRSxFQUFFLEVBQUU7SUFDOUUsT0FBTyxDQUNMLG9CQUFDLE9BQU8sSUFBQyxTQUFTLEVBQUUsUUFBUSxFQUFFLE9BQU8sRUFBRSxNQUFNLENBQUMsQ0FBQyxDQUFDLGFBQWEsQ0FBQyxDQUFDLENBQUMsTUFBTSxFQUFFLFNBQVMsRUFBRSxTQUFTLElBQ3pGLFFBQVEsQ0FDRCxDQUNYLENBQUM7QUFDSixDQUFDLENBQUMifQ==

package/dist/src/utils/form/HelperText/HelperText.d.ts

@@ -0,0 +1,39 @@
+import React from 'react';
+export declare type HelperTextProps = {
+    /**
+     * An unique ID to be used for an accessible connection between the input and its error message
+     */
+    messageId?: string;
+    /**
+     * If false, help text will be displayed as an error message.
+     */
+    error?: boolean | undefined;
+    /**
+     * Help text content.
+     */
+    helperText?: string;
+    /**
+     * Current length of the input value.
+     */
+    length?: number;
+    /**
+     * Max length of the input value.
+     *
+     * If no value is given, no count is shown.
+     */
+    maxLength?: number;
+    /**
+     * True, if helper text should always reserve vertical space to prevent
+     * jitter in UI when there are multiple input components visible
+     * at the same time and their validity changes.
+     * @deprecated There should not be be need to use labeled controls without reserving space for the helper text.
+     */
+    reserveSpaceForError?: boolean;
+};
+export declare const HelperText: React.FC<HelperTextProps> & {
+    Skeleton: typeof Skeleton;
+};
+declare const Skeleton: React.FC<{
+    className?: string;
+}>;
+export {};

package/dist/src/utils/form/HelperText/HelperText.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import isNumber from 'lodash/isNumber';
+import { tw } from '../../../../src/utils/tailwind';
+import { Grid, GridItem } from '../../../../src/components';
+import { CharCounter } from '../../../../src/utils/form/CharCounter/CharCounter';
+import classNames from 'classnames';
+export const HelperText = ({ messageId, error = false, helperText, length, maxLength, reserveSpaceForError = true, }) => {
+    const hasError = error && helperText;
+    const hasMaxLength = isNumber(maxLength) && maxLength > 0;
+    const showMessage = hasError || hasMaxLength;
+    if (!showMessage) {
+        return reserveSpaceForError ? React.createElement("p", { className: tw('block mt-1 mb-3 typography-caption-default') }, "\u00A0") : null;
+    }
+    return (React.createElement(Grid, { cols: '1', rows: '1', colGap: '3', alignItems: 'start', autoCols: 'min', className: tw('mt-1 mb-3') },
+        React.createElement(GridItem, { colStart: '1', colEnd: '2' }, hasError && (React.createElement("p", { id: messageId, className: tw('text-error-50 block typography-caption-default') }, helperText))),
+        React.createElement(GridItem, { colStart: '2', colEnd: '3', display: "flex" }, isNumber(length) && hasMaxLength && React.createElement(CharCounter, { length: length, maxLength: maxLength, valid: !error }))));
+};
+const Skeleton = ({ className, children }) => (React.createElement("div", { className: classNames(className, 'h-[25px]') }, children));
+HelperText.Skeleton = Skeleton;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSGVscGVyVGV4dC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy91dGlscy9mb3JtL0hlbHBlclRleHQvSGVscGVyVGV4dC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sUUFBUSxNQUFNLGlCQUFpQixDQUFDO0FBQ3ZDLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUN4QyxPQUFPLEVBQUUsSUFBSSxFQUFFLFFBQVEsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ2hELE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSx3Q0FBd0MsQ0FBQztBQUNyRSxPQUFPLFVBQVUsTUFBTSxZQUFZLENBQUM7QUF1Q3BDLE1BQU0sQ0FBQyxNQUFNLFVBQVUsR0FBOEQsQ0FBQyxFQUNwRixTQUFTLEVBQ1QsS0FBSyxHQUFHLEtBQUssRUFDYixVQUFVLEVBQ1YsTUFBTSxFQUNOLFNBQVMsRUFDVCxvQkFBb0IsR0FBRyxJQUFJLEdBQzVCLEVBQUUsRUFBRTtJQUNILE1BQU0sUUFBUSxHQUFHLEtBQUssSUFBSSxVQUFVLENBQUM7SUFDckMsTUFBTSxZQUFZLEdBQUcsUUFBUSxDQUFDLFNBQVMsQ0FBQyxJQUFJLFNBQVMsR0FBRyxDQUFDLENBQUM7SUFDMUQsTUFBTSxXQUFXLEdBQUcsUUFBUSxJQUFJLFlBQVksQ0FBQztJQUU3QyxJQUFJLENBQUMsV0FBVyxFQUFFO1FBQ2hCLE9BQU8sb0JBQW9CLENBQUMsQ0FBQyxDQUFDLDJCQUFHLFNBQVMsRUFBRSxFQUFFLENBQUMsNENBQTRDLENBQUMsYUFBWSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUM7S0FDakg7SUFFRCxPQUFPLENBQ0wsb0JBQUMsSUFBSSxJQUFDLElBQUksRUFBRSxHQUFHLEVBQUUsSUFBSSxFQUFFLEdBQUcsRUFBRSxNQUFNLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxPQUFPLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUUsRUFBRSxDQUFDLFdBQVcsQ0FBQztRQUN2RyxvQkFBQyxRQUFRLElBQUMsUUFBUSxFQUFFLEdBQUcsRUFBRSxNQUFNLEVBQUUsR0FBRyxJQUNqQyxRQUFRLElBQUksQ0FDWCwyQkFBRyxFQUFFLEVBQUUsU0FBUyxFQUFFLFNBQVMsRUFBRSxFQUFFLENBQUMsZ0RBQWdELENBQUMsSUFDOUUsVUFBVSxDQUNULENBQ0wsQ0FDUTtRQUNYLG9CQUFDLFFBQVEsSUFBQyxRQUFRLEVBQUUsR0FBRyxFQUFFLE1BQU0sRUFBRSxHQUFHLEVBQUUsT0FBTyxFQUFDLE1BQU0sSUFFakQsUUFBUSxDQUFDLE1BQU0sQ0FBQyxJQUFJLFlBQVksSUFBSSxvQkFBQyxXQUFXLElBQUMsTUFBTSxFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxDQUFDLEtBQUssR0FBSSxDQUNoRyxDQUNOLENBQ1IsQ0FBQztBQUNKLENBQUMsQ0FBQztBQUVGLE1BQU0sUUFBUSxHQUFxQyxDQUFDLEVBQUUsU0FBUyxFQUFFLFFBQVEsRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUM5RSw2QkFBSyxTQUFTLEVBQUUsVUFBVSxDQUFDLFNBQVMsRUFBRSxVQUFVLENBQUMsSUFBRyxRQUFRLENBQU8sQ0FDcEUsQ0FBQztBQUVGLFVBQVUsQ0FBQyxRQUFRLEdBQUcsUUFBUSxDQUFDIn0=

package/dist/src/utils/form/InputAdornment/InputAdornment.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { IconProps } from '../../../../src/components';
+declare type AdornmentProps = {
+    placement?: 'left' | 'right';
+    className?: string;
+    dense?: boolean;
+};
+export declare const InputAdornment: React.FC<AdornmentProps>;
+declare type Props = Pick<IconProps, 'onClick'>;
+export declare const ValidIcon: React.FC<Props>;
+export declare const ErrorIcon: React.FC<Props>;
+export declare const SearchIcon: React.FC<Props>;
+export declare const ResetIcon: React.FC<Props>;
+export {};

package/dist/src/utils/form/InputAdornment/InputAdornment.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import { classNames } from '../../../../src/utils/tailwind';
+import tickIcon from '../../../../src/icons/tick';
+import errorIcon from '../../../../src/icons/error';
+import searchIcon from '../../../../src/icons/search';
+import crossIcon from '../../../../src/icons/cross';
+import { Icon, Flexbox } from '../../../../src/components';
+export const InputAdornment = ({ placement = 'right', className, dense, children }) => {
+    return (React.createElement("span", { className: classNames(className, 'absolute inset-y-0 grow-0 text-grey-40 flex items-center mx-3', {
+            'right-0': placement === 'right',
+            'left-0': placement === 'left',
+            'typography-body-small': dense,
+            'typography-body-default-medium': !dense,
+        }) },
+        React.createElement(Flexbox, { gap: '3', wrap: 'wrap' }, children)));
+};
+export const ValidIcon = ({ onClick }) => (React.createElement(Icon, { icon: tickIcon, color: 'success-50', "data-testid": 'icon-valid', onClick: onClick }));
+export const ErrorIcon = ({ onClick }) => (React.createElement(Icon, { icon: errorIcon, color: 'error-70', "data-testid": 'icon-invalid', onClick: onClick }));
+export const SearchIcon = ({ onClick }) => (React.createElement(Icon, { icon: searchIcon, color: 'grey-30', "data-testid": 'icon-search', onClick: onClick }));
+export const ResetIcon = ({ onClick }) => (React.createElement(Icon, { className: "hover:cursor-pointer", icon: crossIcon, color: 'grey-30', "data-testid": 'icon-reset', onClick: onClick }));
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW5wdXRBZG9ybm1lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvdXRpbHMvZm9ybS9JbnB1dEFkb3JubWVudC9JbnB1dEFkb3JubWVudC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUNoRCxPQUFPLFFBQVEsTUFBTSxnQkFBZ0IsQ0FBQztBQUN0QyxPQUFPLFNBQVMsTUFBTSxpQkFBaUIsQ0FBQztBQUN4QyxPQUFPLFVBQVUsTUFBTSxrQkFBa0IsQ0FBQztBQUMxQyxPQUFPLFNBQVMsTUFBTSxpQkFBaUIsQ0FBQztBQUN4QyxPQUFPLEVBQUUsSUFBSSxFQUFhLE9BQU8sRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBUTFELE1BQU0sQ0FBQyxNQUFNLGNBQWMsR0FBNkIsQ0FBQyxFQUFFLFNBQVMsR0FBRyxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxRQUFRLEVBQUUsRUFBRSxFQUFFO0lBQzlHLE9BQU8sQ0FDTCw4QkFDRSxTQUFTLEVBQUUsVUFBVSxDQUFDLFNBQVMsRUFBRSwrREFBK0QsRUFBRTtZQUNoRyxTQUFTLEVBQUUsU0FBUyxLQUFLLE9BQU87WUFDaEMsUUFBUSxFQUFFLFNBQVMsS0FBSyxNQUFNO1lBQzlCLHVCQUF1QixFQUFFLEtBQUs7WUFDOUIsZ0NBQWdDLEVBQUUsQ0FBQyxLQUFLO1NBQ3pDLENBQUM7UUFFRixvQkFBQyxPQUFPLElBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxJQUFJLEVBQUUsTUFBTSxJQUM1QixRQUFRLENBQ0QsQ0FDTCxDQUNSLENBQUM7QUFDSixDQUFDLENBQUM7QUFJRixNQUFNLENBQUMsTUFBTSxTQUFTLEdBQW9CLENBQUMsRUFBRSxPQUFPLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FDekQsb0JBQUMsSUFBSSxJQUFDLElBQUksRUFBRSxRQUFRLEVBQUUsS0FBSyxFQUFFLFlBQVksaUJBQWUsWUFBWSxFQUFFLE9BQU8sRUFBRSxPQUFPLEdBQUksQ0FDM0YsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLFNBQVMsR0FBb0IsQ0FBQyxFQUFFLE9BQU8sRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUN6RCxvQkFBQyxJQUFJLElBQUMsSUFBSSxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsVUFBVSxpQkFBZSxjQUFjLEVBQUUsT0FBTyxFQUFFLE9BQU8sR0FBSSxDQUM1RixDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sVUFBVSxHQUFvQixDQUFDLEVBQUUsT0FBTyxFQUFFLEVBQUUsRUFBRSxDQUFDLENBQzFELG9CQUFDLElBQUksSUFBQyxJQUFJLEVBQUUsVUFBVSxFQUFFLEtBQUssRUFBRSxTQUFTLGlCQUFlLGFBQWEsRUFBRSxPQUFPLEVBQUUsT0FBTyxHQUFJLENBQzNGLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxTQUFTLEdBQW9CLENBQUMsRUFBRSxPQUFPLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FDekQsb0JBQUMsSUFBSSxJQUNILFNBQVMsRUFBQyxzQkFBc0IsRUFDaEMsSUFBSSxFQUFFLFNBQVMsRUFDZixLQUFLLEVBQUUsU0FBUyxpQkFDSCxZQUFZLEVBQ3pCLE9BQU8sRUFBRSxPQUFPLEdBQ2hCLENBQ0gsQ0FBQyJ9

package/dist/src/utils/form/Label/Label.d.ts

@@ -0,0 +1,80 @@
+import React from 'react';
+import type { PopoverPlacement } from '../../../../src/components/Popover/Popover';
+import { HelperTextProps } from '../../../../src/utils/form/HelperText/HelperText';
+declare type LabelVariant = 'default' | 'error' | 'disabled';
+export declare type LabelProps = {
+    /**
+     * Optional label text.
+     * TODO: This might be something we'd like to deprecate at some point and make the label non-optional.
+     * We could also thing about renaming this one to `label`. That way we could do the change so that we
+     * would keep deprecated, optional `labelText` support for some time before removing it completely.
+     */
+    'labelText'?: string;
+    /**
+     * Optional id.
+     */
+    'id'?: string;
+    /**
+     * Optional `for` attribute for the `<label>` element.
+     */
+    'htmlFor'?: string;
+    /**
+     * If true, control will be marked as required.
+     */
+    'required'?: boolean;
+    /**
+     * Label state - `default`, `error` or `disabled`.
+     */
+    'variant'?: LabelVariant;
+    /**
+     * Optional help tooltip content. If provided, tooltip will be attached to the label.
+     */
+    'helpTooltip'?: string | React.ReactNode;
+    /**
+     * Optional placement suggestion for the help tooltip.
+     */
+    'helpTooltipPlacement'?: PopoverPlacement;
+    /**
+     * This allows to further configure the surrounding label of the input.
+     * @deprecated Label component should be self sufficient and using custom props for the label is not anymore encouraged.
+     */
+    'labelProps'?: React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>;
+    /**
+     * Optional `data-testid` property for the label wrapper.
+     */
+    'data-testid'?: string;
+};
+export declare const Label: React.FC<LabelProps> & {
+    Skeleton: typeof LabelSkeleton;
+};
+declare const LabelSkeleton: React.FC;
+export declare type LabelControlProps = Omit<LabelProps, 'variant'> & Omit<HelperTextProps, 'error'> & {
+    /**
+     * If true, label control will be rendered using <fieldset> and <legend>.
+     */
+    fieldset?: boolean;
+    /**
+     * If false, label will be highlighted as an error.
+     */
+    valid?: boolean;
+    /**
+     * If true, label will rendered as disabled.
+     */
+    disabled?: boolean;
+    /**
+     * @deprecated `error` property has been deprecated in favor of `helperText`.
+     */
+    error?: string;
+    /**
+     * Indicator if the input should always reserve space for error message.
+     *
+     * If no value is given, defaults to true.
+     * @deprecated
+     */
+    reserveSpaceForError?: boolean;
+};
+export declare const LabelControl: React.FC<LabelControlProps> & {
+    Skeleton: React.FC;
+};
+export declare const getLabelControlProps: <T extends LabelControlProps>({ labelText, required, valid, disabled, "labelProps": { ...labelProps }, helpTooltip, helpTooltipPlacement, maxLength, error, helperText, reserveSpaceForError, "data-testid": dataTestId, }: T) => LabelControlProps;
+export {};