@hhgtech/hhg-components 1.28.91 → 1.29.0

package/build/vaccination.js

@@ -2,45 +2,47 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-29b65c9b.js');
+var tslib_es6 = require('./tslib.es6-abc4f50e.js');
 var React = require('react');
 var core = require('@mantine/core');
-var index = require('./index-9aef26c3.js');
+var index = require('./index-91363ba0.js');
 require('@mantine/dates');
-require('./index-9bd23d0b.js');
-var Subot = require('./Subot-0e90b908.js');
-require('./index-1840623c.js');
-var index$1 = require('./index-f788027e.js');
-var theme = require('./theme-8f20fc74.js');
-var useTranslations = require('./useTranslations-fe55a872.js');
+require('./index-2522521c.js');
+var Subot = require('./Subot-ee808a83.js');
+require('./index-f60d0cbf.js');
+require('./useMantineLocale-d09b55c5.js');
+var index$1 = require('./index-d0f305cc.js');
+var theme = require('./theme-8f3eba82.js');
+var useTranslations = require('./useTranslations-cd50ad36.js');
 var hooks = require('@mantine/hooks');
-var styled = require('styled-components');
-var utils = require('./utils-6404c93f.js');
-var index$2 = require('./index-e077413d.js');
-require('./translationsContext-a147c1d0.js');
+var utils = require('./utils-2531ee99.js');
+var styled = require('@emotion/styled');
+var index$2 = require('./index-b6cdae14.js');
+require('./translationsContext-2fd3cf64.js');
 require('string-format');
 var other = require('@hhgtech/icons/other');
-var index$3 = require('./index-730e3477.js');
+var index$3 = require('./index-e934833c.js');
 var form = require('@mantine/form');
 var dayjs = require('dayjs');
 var customParseFormat = require('dayjs/plugin/customParseFormat');
-var index$5 = require('./index-ea866031.js');
-require('./index.styles-115951e8.js');
-var index$4 = require('./index-17ae2899.js');
-require('./constants-271d01dc.js');
-require('./utils-b47071e1.js');
-require('./utils-2565131e.js');
-require('./index.styled-100a6f0e.js');
-require('./index-d058ca0c.js');
+var index$5 = require('./index-b9d06b41.js');
+require('./index.styles-51873031.js');
+var index$4 = require('./index-1c00b6e4.js');
+require('./constants-250b719a.js');
+require('./utils-070de1e1.js');
+require('./utils-7bb4dfac.js');
+require('./index.styled-25f0011d.js');
+require('./index-f9ec4525.js');
 require('@mantine/carousel');
 require('classnames');
-require('./useUniqueId-2d25434a.js');
+require('./useUniqueId-e48ff5bb.js');
 require('@hhgtech/icons/core');
 require('date-fns/locale');
-require('./isProduction-47f8d310.js');
-require('./animation-1f323e92.js');
+require('./isProduction-f02c8ad3.js');
+require('@emotion/react');
+require('./animation-31a5b706.js');
 require('react-keyed-flatten-children');
-require('./cookieHelper-a1a89728.js');
+require('./cookieHelper-fa491ff1.js');
 require('slugify');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hhgtech/hhg-components",
-  "version": "1.28.91",
+  "version": "1.29.0",
   "main": "build/index.js",
   "module": "build/esm/index.js",
   "files": [
@@ -77,14 +77,14 @@
     "react": "^17.0.1",
     "react-day-picker": "^7.4.10",
     "react-dom": "^17.0.1",
-    "react-loading-skeleton": "^3.1.0",
-    "styled-components": ">=5.3.0"
+    "react-loading-skeleton": "^3.1.0"
   },
   "devDependencies": {
     "@babel/core": "^7.12.10",
     "@babel/preset-env": "^7.21.4",
     "@babel/preset-react": "^7.18.6",
     "@babel/preset-typescript": "^7.21.4",
+    "@emotion/babel-plugin": "^11.11.0",
     "@faker-js/faker": "^7.3.0",
     "@rollup/plugin-commonjs": "^17.0.0",
     "@rollup/plugin-image": "^2.1.1",
@@ -114,7 +114,6 @@
     "@types/react-dom": "^17.0.0",
     "@types/recharts": "1.8.24",
     "@types/string-format": "^2.0.0",
-    "@types/styled-components": "5.1.9",
     "@typescript-eslint/eslint-plugin": "^4.11.0",
     "@typescript-eslint/parser": "^4.11.0",
     "autoprefixer": "^10.4.13",
@@ -137,7 +136,6 @@
     "identity-obj-proxy": "^3.0.0",
     "inquirer": "^8.2.5",
     "jest": "^26.6.3",
-    "jest-styled-components": "7.0.3",
     "lodash": "^4.17.21",
     "ora": "^6.1.2",
     "plop": "^3.1.1",
@@ -160,7 +158,6 @@
     "sass-loader": "^13.2.0",
     "storybook": "^7.0.5",
     "style-loader": "^2.0.0",
-    "styled-components": "5.3.6",
     "stylelint": "^13.7.2",
     "stylelint-config-idiomatic-order": "^8.1.0",
     "stylelint-config-prettier": "^8.0.2",
@@ -175,7 +172,8 @@
     "xlsx": "^0.18.5"
   },
   "dependencies": {
-    "@emotion/react": "^11.11.1",
+    "@emotion/react": "^11.11.4",
+    "@emotion/styled": "^11.11.5",
     "@hhgtech/icons": "^0.0.26",
     "@hookform/resolvers": "^2.9.10",
     "@mantine/carousel": "6.0.21",

package/build/index-f788027e.js

@@ -1,156 +0,0 @@
-'use strict';
-
-var tslib_es6 = require('./tslib.es6-29b65c9b.js');
-var React = require('react');
-var core = require('@mantine/core');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-var FontWeight;
-(function (FontWeight) {
-    FontWeight[FontWeight["regular"] = 400] = "regular";
-    FontWeight[FontWeight["semiBold"] = 600] = "semiBold";
-    FontWeight[FontWeight["bold"] = 700] = "bold";
-})(FontWeight || (FontWeight = {}));
-const GlobalTextStyle = {
-    fontSize: {
-        base: [core.rem(16), core.rem(16)],
-        lg: [core.rem(18), core.rem(16)],
-        md: [core.rem(18), core.rem(16)],
-        sm: [core.rem(16), core.rem(14)],
-        xs: [core.rem(14), core.rem(12)],
-        s1: [core.rem(22), core.rem(18)],
-        s2: [core.rem(18), core.rem(16)],
-        s3: [core.rem(16), core.rem(14)],
-        s4: [core.rem(14), core.rem(12)],
-        s5: [core.rem(12), core.rem(12)],
-        p1: [core.rem(18), core.rem(16)],
-        p2: [core.rem(16), core.rem(16)],
-        p3: [core.rem(16), core.rem(14)],
-        p4: [core.rem(14), core.rem(12)],
-        p5: [core.rem(12), core.rem(12)],
-        c1: [core.rem(16), core.rem(14)],
-        c2: [core.rem(14), core.rem(12)],
-        n1: [core.rem(12), core.rem(12)],
-        label1: [core.rem(14), core.rem(14)],
-        label2: [core.rem(12), core.rem(12)],
-        h1: [core.rem(40), core.rem(26)],
-        h2: [core.rem(32), core.rem(24)],
-        h3: [core.rem(26), core.rem(20)],
-        h4: [core.rem(22), core.rem(18)],
-        h5: [core.rem(18), core.rem(16)],
-        h6: [core.rem(16), core.rem(14)],
-    },
-    lineHeight: {
-        base: [core.rem(24), core.rem(24)],
-        lg: [core.rem(32), core.rem(28)],
-        md: [core.rem(32), core.rem(28)],
-        sm: [core.rem(24), core.rem(22)],
-        xs: [core.rem(24), core.rem(18)],
-        s1: [core.rem(32), core.rem(26)],
-        s2: [core.rem(28), core.rem(24)],
-        s3: [core.rem(24), core.rem(24)],
-        s4: [core.rem(22), core.rem(18)],
-        s5: [core.rem(18), core.rem(18)],
-        p1: [core.rem(28), core.rem(28)],
-        p2: [core.rem(24), core.rem(24)],
-        p3: [core.rem(24), core.rem(22)],
-        p4: [core.rem(22), core.rem(18)],
-        c1: [core.rem(24), core.rem(22)],
-        c2: [core.rem(22), core.rem(18)],
-        n1: [core.rem(18), core.rem(18)],
-        label1: [core.rem(22), core.rem(22)],
-        label2: [core.rem(18), core.rem(18)],
-        h1: [core.rem(52), core.rem(34)],
-        h2: [core.rem(42), core.rem(32)],
-        h3: [core.rem(36), core.rem(26)],
-        h4: [core.rem(32), core.rem(26)],
-        h5: [core.rem(28), core.rem(24)],
-        h6: [core.rem(24), core.rem(22)],
-    },
-    letterSpacing: {
-        lg: [-0.2, 0],
-        md: [-0.2, 0],
-        sm: [0, -0.2],
-        s1: [-0.6, -0.6],
-        s2: [-0.4, -0.2],
-        s3: [0, -0.2],
-        s4: [0, -0.2],
-        p1: [-0.2, -0.2],
-        p2: [0, -0.2],
-        p3: [0, -0.2],
-        p4: [-0.2, 0],
-        label1: [0, -0.2],
-        h1: [-1.2, -0.9],
-        h2: [-1, -0.8],
-        h3: [-0.8, -0.7],
-        h4: [-0.6, -0.6],
-        h5: [-0.2, -0.2],
-        h6: [0, -0.2],
-    },
-    fontWeightBySize: {
-        s1: FontWeight.semiBold,
-        s2: FontWeight.semiBold,
-        s3: FontWeight.semiBold,
-        s4: FontWeight.semiBold,
-        h1: FontWeight.bold,
-        h2: FontWeight.bold,
-        h3: FontWeight.bold,
-        h4: FontWeight.bold,
-        h5: FontWeight.bold,
-        h6: FontWeight.bold,
-    },
-    fontWeight: FontWeight,
-};
-
-const OTHER_THEME_CONFIG = Object.assign({}, GlobalTextStyle);
-
-var useStyles = core.createStyles((theme, _params) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-    const TextConfig = Object.assign({}, OTHER_THEME_CONFIG);
-    const getFontSize = (_a = TextConfig.fontSize[_params === null || _params === void 0 ? void 0 : _params.size]) === null || _a === void 0 ? void 0 : _a[0];
-    const getLineHeight = (_b = TextConfig.lineHeight[_params === null || _params === void 0 ? void 0 : _params.size]) === null || _b === void 0 ? void 0 : _b[0];
-    const getLetterSpacing = (_e = (_d = (_c = TextConfig.letterSpacing) === null || _c === void 0 ? void 0 : _c[_params === null || _params === void 0 ? void 0 : _params.size]) === null || _d === void 0 ? void 0 : _d[0]) !== null && _e !== void 0 ? _e : 0;
-    const getFontSizeMbDown = (_f = TextConfig.fontSize[_params === null || _params === void 0 ? void 0 : _params.size]) === null || _f === void 0 ? void 0 : _f[1];
-    const getLineHeightMbDown = (_g = TextConfig.lineHeight[_params === null || _params === void 0 ? void 0 : _params.size]) === null || _g === void 0 ? void 0 : _g[1];
-    const getLetterSpacingMbDown = (_k = (_j = (_h = TextConfig.letterSpacing) === null || _h === void 0 ? void 0 : _h[_params === null || _params === void 0 ? void 0 : _params.size]) === null || _j === void 0 ? void 0 : _j[1]) !== null && _k !== void 0 ? _k : 0;
-    return {
-        root: Object.assign(Object.assign({}, ((_params === null || _params === void 0 ? void 0 : _params.size) && {
-            fontWeight: (_params === null || _params === void 0 ? void 0 : _params.as) === 'label'
-                ? FontWeight.semiBold
-                : TextConfig.fontWeightBySize[_params === null || _params === void 0 ? void 0 : _params.size] ||
-                    TextConfig.fontWeight[_params.weight],
-            fontSize: `${getFontSize}`,
-            lineHeight: `${getLineHeight}`,
-            letterSpacing: getLetterSpacing,
-            [theme.fn.smallerThan('sm')]: {
-                fontSize: `${getFontSizeMbDown}`,
-                lineHeight: `${getLineHeightMbDown}`,
-                letterSpacing: getLetterSpacingMbDown,
-            },
-        })), { '&[data-event-category] > *': {
-                pointerEvents: 'none',
-            } }),
-    };
-});
-
-const Text = (_a) => {
-    var _b;
-    var { size, color, weight = 'regular', as = 'p', styles, className, dataEventCategory, dataEventAction, dataEventLabel } = _a, rest = tslib_es6.__rest(_a, ["size", "color", "weight", "as", "styles", "className", "dataEventCategory", "dataEventAction", "dataEventLabel"]);
-    const { theme, classes, cx } = useStyles({ size, weight: weight === 'caption' ? 'bold' : weight, as }, { name: 'Text', styles });
-    return (React__default["default"].createElement(core.Text, Object.assign({ className: cx(classes.root, className), color: color ||
-            (as === 'label'
-                ? theme.colors.gray[6]
-                : ((_b = theme === null || theme === void 0 ? void 0 : theme.other) === null || _b === void 0 ? void 0 : _b.template) === 'mb'
-                    ? theme.colors.delftGray[7]
-                    : theme.colors.gray[7]), component: as, "data-event-category": dataEventCategory, "data-event-action": dataEventAction, "data-event-label": dataEventLabel, classNames: {
-            root: Object.assign(Object.assign({}, (rest.wordWrap ? { 'word-wrap': rest.wordWrap } : undefined)), (rest.isUppercase || weight === 'caption'
-                ? { 'text-transform': 'uppercase' }
-                : undefined)),
-        } }, rest)));
-};
-
-exports.OTHER_THEME_CONFIG = OTHER_THEME_CONFIG;
-exports.Text = Text;