gantri-components 1.7.0 → 1.7.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.cjs.js +111 -27
  2. package/lib/styles/base.d.ts +1 -1
  3. package/package.json +2 -3
package/dist/index.cjs.js CHANGED
@@ -70,6 +70,44 @@ function __rest(s, e) {
70
70
  return t;
71
71
  }
72
72
 
73
+ function __awaiter(thisArg, _arguments, P, generator) {
74
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
75
+ return new (P || (P = Promise))(function (resolve, reject) {
76
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
77
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
78
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
79
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
80
+ });
81
+ }
82
+
83
+ function __generator(thisArg, body) {
84
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
85
+ return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
86
+ function verb(n) { return function (v) { return step([n, v]); }; }
87
+ function step(op) {
88
+ if (f) throw new TypeError("Generator is already executing.");
89
+ while (_) try {
90
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
91
+ if (y = 0, t) op = [op[0] & 2, t.value];
92
+ switch (op[0]) {
93
+ case 0: case 1: t = op; break;
94
+ case 4: _.label++; return { value: op[1], done: false };
95
+ case 5: _.label++; y = op[1]; op = [0]; continue;
96
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
97
+ default:
98
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
99
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
100
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
101
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
102
+ if (t[2]) _.ops.pop();
103
+ _.trys.pop(); continue;
104
+ }
105
+ op = body.call(thisArg, _);
106
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
107
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
108
+ }
109
+ }
110
+
73
111
  function __spreadArray(to, from, pack) {
74
112
  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
75
113
  if (ar || !(i in from)) {
@@ -429,27 +467,9 @@ var combinationsByColor = function (appTheme) {
429
467
  });
430
468
  };
431
469
 
432
- var generateGlobalStyles = function () {
433
- // @ts-ignore
434
- // eslint-disable-next-line @typescript-eslint/no-var-requires,global-require
435
- var SohneBuch = require('../assets/fonts/soehne-web-buch.woff2');
436
- // @ts-ignore
437
- // eslint-disable-next-line @typescript-eslint/no-var-requires,global-require
438
- var SohneExtrafett = require('../assets/fonts/soehne-web-dreiviertelfett.woff2');
439
- // @ts-ignore
440
- // eslint-disable-next-line @typescript-eslint/no-var-requires,global-require
441
- var SohneHalbfett = require('../assets/fonts/soehne-web-halbfett.woff2');
442
- // @ts-ignore
443
- // eslint-disable-next-line @typescript-eslint/no-var-requires,global-require
444
- var SohneKraftig = require('../assets/fonts/soehne-web-kraftig.woff2');
445
- // @ts-ignore
446
- // eslint-disable-next-line @typescript-eslint/no-var-requires,global-require
447
- var SohneKraftigKursiv = require('../assets/fonts/soehne-web-kraftig-kursiv.woff2');
448
- return styled.createGlobalStyle(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n *,\n *::before,\n *::after {\n margin: 0;\n padding: 0;\n box-sizing: inherit;\n outline: none;\n }\n\n html {\n /* defines 1rem = 10px value */\n font-size: 62.5%;\n }\n\n body {\n box-sizing: border-box;\n font-family: 'Sohne Buch', \"Helvetica\", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n }\n\n * {\n font-family: 'Sohne Buch', \"Helvetica\", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n box-sizing: border-box;\n -webkit-font-smoothing: antialiased;\n -moz-font-smoothing: antialiased;\n font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n -webkit-tap-highlight-color: transparent;\n }\n\n a,\n a:active,\n a:visited {\n font-family: \"Sohne Halbfett\", \"Helvetica\", sans-serif;\n text-decoration: none;\n display: inherit;\n cursor: pointer;\n color: ", ";\n\n &.affirm-modal-trigger:hover {\n text-decoration: underline;\n }\n }\n\n svg {\n overflow: visible;\n }\n\n #fb-root {\n z-index: 999;\n display: block;\n }\n\n input, select {\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 30px white inset !important;\n }\n }\n\n @font-face {\n font-family: 'Sohne Buch';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Dreiviertelfett';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Halbfett';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig Kursiv';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Extrafett';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n "], ["\n *,\n *::before,\n *::after {\n margin: 0;\n padding: 0;\n box-sizing: inherit;\n outline: none;\n }\n\n html {\n /* defines 1rem = 10px value */\n font-size: 62.5%;\n }\n\n body {\n box-sizing: border-box;\n font-family: 'Sohne Buch', \"Helvetica\", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n }\n\n * {\n font-family: 'Sohne Buch', \"Helvetica\", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n box-sizing: border-box;\n -webkit-font-smoothing: antialiased;\n -moz-font-smoothing: antialiased;\n font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n -webkit-tap-highlight-color: transparent;\n }\n\n a,\n a:active,\n a:visited {\n font-family: \"Sohne Halbfett\", \"Helvetica\", sans-serif;\n text-decoration: none;\n display: inherit;\n cursor: pointer;\n color: ", ";\n\n &.affirm-modal-trigger:hover {\n text-decoration: underline;\n }\n }\n\n svg {\n overflow: visible;\n }\n\n #fb-root {\n z-index: 999;\n display: block;\n }\n\n input, select {\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 30px white inset !important;\n }\n }\n\n @font-face {\n font-family: 'Sohne Buch';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Dreiviertelfett';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Halbfett';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig Kursiv';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Extrafett';\n src: url(", ") format('woff2');\n font-display: swap;\n }\n "])), getThemeColor('gold_400'), SohneBuch, SohneExtrafett, SohneHalbfett, SohneKraftig, SohneKraftigKursiv, SohneExtrafett);
449
- };
470
+ var GlobalStyle = styled.createGlobalStyle(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n *,\n *::before,\n *::after {\n margin: 0;\n padding: 0;\n box-sizing: inherit;\n outline: none;\n }\n\n html {\n /* defines 1rem = 10px value */\n font-size: 62.5%;\n }\n\n body {\n box-sizing: border-box;\n font-family: 'Sohne Buch', \"Helvetica\", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n }\n\n * {\n font-family: 'Sohne Buch', \"Helvetica\", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n box-sizing: border-box;\n -webkit-font-smoothing: antialiased;\n -moz-font-smoothing: antialiased;\n font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n -webkit-tap-highlight-color: transparent;\n }\n\n a,\n a:active,\n a:visited {\n font-family: \"Sohne Halbfett\", \"Helvetica\", sans-serif;\n text-decoration: none;\n display: inherit;\n cursor: pointer;\n color: ", ";\n\n &.affirm-modal-trigger:hover {\n text-decoration: underline;\n }\n }\n\n svg {\n overflow: visible;\n }\n\n #fb-root {\n z-index: 999;\n display: block;\n }\n\n input, select {\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 30px white inset !important;\n }\n }\n\n @font-face {\n font-family: 'Sohne Buch';\n src: url(https://www.gantri.com/static/fonts/soehne-web-buch.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Dreiviertelfett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-dreiviertelfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Halbfett';\n src: url(https://www.gantri.com/static/fonts/public/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig Kursiv';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig-kursiv.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Extrafett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n"], ["\n *,\n *::before,\n *::after {\n margin: 0;\n padding: 0;\n box-sizing: inherit;\n outline: none;\n }\n\n html {\n /* defines 1rem = 10px value */\n font-size: 62.5%;\n }\n\n body {\n box-sizing: border-box;\n font-family: 'Sohne Buch', \"Helvetica\", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n }\n\n * {\n font-family: 'Sohne Buch', \"Helvetica\", sans-serif;\n line-height: 2.5rem;\n font-size: 1.5rem;\n box-sizing: border-box;\n -webkit-font-smoothing: antialiased;\n -moz-font-smoothing: antialiased;\n font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n -webkit-tap-highlight-color: transparent;\n }\n\n a,\n a:active,\n a:visited {\n font-family: \"Sohne Halbfett\", \"Helvetica\", sans-serif;\n text-decoration: none;\n display: inherit;\n cursor: pointer;\n color: ", ";\n\n &.affirm-modal-trigger:hover {\n text-decoration: underline;\n }\n }\n\n svg {\n overflow: visible;\n }\n\n #fb-root {\n z-index: 999;\n display: block;\n }\n\n input, select {\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 30px white inset !important;\n }\n }\n\n @font-face {\n font-family: 'Sohne Buch';\n src: url(https://www.gantri.com/static/fonts/soehne-web-buch.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Dreiviertelfett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-dreiviertelfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Halbfett';\n src: url(https://www.gantri.com/static/fonts/public/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Kraftig Kursiv';\n src: url(https://www.gantri.com/static/fonts/soehne-web-kraftig-kursiv.woff2) format('woff2');\n font-display: swap;\n }\n\n @font-face {\n font-family: 'Sohne Extrafett';\n src: url(https://www.gantri.com/static/fonts/soehne-web-halbfett.woff2) format('woff2');\n font-display: swap;\n }\n"])), getThemeColor('gold_400'));
450
471
  var templateObject_1$a;
451
472
 
452
- var GlobalStyle = generateGlobalStyles();
453
473
  var ThemeProvider = function (_a) {
454
474
  var children = _a.children, theme = _a.theme;
455
475
  return (
@@ -1701,6 +1721,55 @@ var startCase = createCompounder(function(result, word, index) {
1701
1721
 
1702
1722
  var startCase_1 = startCase;
1703
1723
 
1724
+ function useMountedState() {
1725
+ var mountedRef = React.useRef(false);
1726
+ var get = React.useCallback(function () { return mountedRef.current; }, []);
1727
+ React.useEffect(function () {
1728
+ mountedRef.current = true;
1729
+ return function () {
1730
+ mountedRef.current = false;
1731
+ };
1732
+ }, []);
1733
+ return get;
1734
+ }
1735
+
1736
+ function useAsyncFn(fn, deps, initialState) {
1737
+ if (deps === void 0) { deps = []; }
1738
+ if (initialState === void 0) { initialState = { loading: false }; }
1739
+ var lastCallId = React.useRef(0);
1740
+ var isMounted = useMountedState();
1741
+ var _a = React.useState(initialState), state = _a[0], set = _a[1];
1742
+ var callback = React.useCallback(function () {
1743
+ var args = [];
1744
+ for (var _i = 0; _i < arguments.length; _i++) {
1745
+ args[_i] = arguments[_i];
1746
+ }
1747
+ var callId = ++lastCallId.current;
1748
+ if (!state.loading) {
1749
+ set(function (prevState) { return (__assign(__assign({}, prevState), { loading: true })); });
1750
+ }
1751
+ return fn.apply(void 0, args).then(function (value) {
1752
+ isMounted() && callId === lastCallId.current && set({ value: value, loading: false });
1753
+ return value;
1754
+ }, function (error) {
1755
+ isMounted() && callId === lastCallId.current && set({ error: error, loading: false });
1756
+ return error;
1757
+ });
1758
+ }, deps);
1759
+ return [state, callback];
1760
+ }
1761
+
1762
+ function useAsync(fn, deps) {
1763
+ if (deps === void 0) { deps = []; }
1764
+ var _a = useAsyncFn(fn, deps, {
1765
+ loading: true,
1766
+ }), state = _a[0], callback = _a[1];
1767
+ React.useEffect(function () {
1768
+ callback();
1769
+ }, [callback]);
1770
+ return state;
1771
+ }
1772
+
1704
1773
  var StyledSvgIcon = styled__default$1["default"].svg(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
1705
1774
  var size = _a.size, nwidth = _a.nwidth, nheight = _a.nheight, cursor = _a.cursor, top = _a.top, bottom = _a.bottom, right = _a.right, left = _a.left;
1706
1775
  var entries = [
@@ -1726,14 +1795,29 @@ var IconPresets = {
1726
1795
 
1727
1796
  var Icon = function (props) {
1728
1797
  var name = props.name, width = props.width, height = props.height, others = __rest(props, ["name", "width", "height"]);
1729
- var fileName = React.useMemo(function () {
1730
- var parts = name.split(':');
1731
- return "".concat(parts[0], "/").concat(startCase_1(parts[1]))
1732
- .replace('_', '')
1733
- .replace(/ /g, '');
1734
- }, [name]);
1735
- // eslint-disable-next-line @typescript-eslint/no-var-requires,import/no-dynamic-require,global-require
1736
- var svgIcon = require("./generated/".concat(fileName, ".tsx")).default;
1798
+ var _a = React.useState(null), svgIcon = _a[0], setSvgIcon = _a[1];
1799
+ useAsync(function () { return __awaiter(void 0, void 0, void 0, function () {
1800
+ var parts, fileName, svg;
1801
+ return __generator(this, function (_a) {
1802
+ switch (_a.label) {
1803
+ case 0:
1804
+ if (!name) return [3 /*break*/, 2];
1805
+ parts = name.split(':');
1806
+ fileName = "".concat(parts[0], "/").concat(startCase_1(parts[1]))
1807
+ .replace('_', '')
1808
+ .replace(/ /g, '');
1809
+ return [4 /*yield*/, (function (t) { return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(t)); }); })("./generated/".concat(fileName, ".tsx"))];
1810
+ case 1:
1811
+ svg = _a.sent();
1812
+ setSvgIcon(svg.default);
1813
+ _a.label = 2;
1814
+ case 2: return [2 /*return*/];
1815
+ }
1816
+ });
1817
+ }); }, [name]);
1818
+ if (!svgIcon) {
1819
+ return null;
1820
+ }
1737
1821
  return (React__default["default"].createElement(StyledSvgIcon, __assign({ as: svgIcon, nheight: height, nwidth: width }, others)));
1738
1822
  };
1739
1823
  Icon.defaultProps = IconPresets;
package/lib/styles/base.d.ts CHANGED
@@ -1 +1 @@
1
- export declare const generateGlobalStyles: () => import("styled-components").GlobalStyleComponent<{}, import("styled-components").DefaultTheme>;
1
+ export declare const GlobalStyle: import("styled-components").GlobalStyleComponent<{}, import("styled-components").DefaultTheme>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gantri-components",
3
- "version": "1.7.0",
3
+ "version": "1.7.3",
4
4
  "main": "dist/index.cjs.js",
5
5
  "module": "dist/src/index.js",
6
6
  "types": "lib/index.d.ts",
@@ -20,7 +20,7 @@
20
20
  "formik": "^2.2.9",
21
21
  "react": "^17.0.2",
22
22
  "react-dom": "^17.0.2",
23
- "styled-components": "^5.3.3"
23
+ "styled-components": "^5.3.5"
24
24
  },
25
25
  "devDependencies": {
26
26
  "@babel/core": "^7.17.5",
@@ -90,7 +90,6 @@
90
90
  "react-i18next": "^11.16.1",
91
91
  "react-input-mask": "^2.0.4",
92
92
  "react-spring": "^9.4.4",
93
- "styled-components": "^5.3.3",
94
93
  "styled-media-query": "^2.1.2"
95
94
  },
96
95
  "files": [