tabler-react-2 0.1.79 → 0.1.81

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 (52) hide show
  1. package/dist/input/dropdown.js +73 -51
  2. package/docs/package.json +1 -1
  3. package/docs/public/404/index.html +28 -3
  4. package/docs/public/404.html +28 -3
  5. package/docs/public/43-fefb8f9ac0916caa5d53.js +3 -0
  6. package/docs/public/43-fefb8f9ac0916caa5d53.js.LICENSE.txt +27 -0
  7. package/docs/public/43-fefb8f9ac0916caa5d53.js.map +1 -0
  8. package/docs/public/636d0422accc1b73b69c17fa2245f392cc216983-92df54b79642d63d0aab.js +17 -0
  9. package/docs/public/636d0422accc1b73b69c17fa2245f392cc216983-92df54b79642d63d0aab.js.map +1 -0
  10. package/docs/public/6b4e03e10a4cc45fc40862990c75a85581b44570-488770a0c049e6f42bb5.js +2 -0
  11. package/docs/public/6b4e03e10a4cc45fc40862990c75a85581b44570-488770a0c049e6f42bb5.js.map +1 -0
  12. package/docs/public/_gatsby/slices/_gatsby-scripts-1.html +2 -2
  13. package/docs/public/a9e892f1f7cc09861f3ab90c891dca98a59e5648-144c40a516b1c300aae8.js +2 -0
  14. package/docs/public/a9e892f1f7cc09861f3ab90c891dca98a59e5648-144c40a516b1c300aae8.js.map +1 -0
  15. package/docs/public/app-d61e1c7b50762c49d313.js +3 -0
  16. package/docs/public/app-d61e1c7b50762c49d313.js.LICENSE.txt +31 -0
  17. package/docs/public/app-d61e1c7b50762c49d313.js.map +1 -0
  18. package/docs/public/chunk-map.json +1 -1
  19. package/docs/public/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-cards-mdx-033bf6626c64caa0fd31.js +2 -0
  20. package/docs/public/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-cards-mdx-033bf6626c64caa0fd31.js.map +1 -0
  21. package/docs/public/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-input-mdx-14afd07baa693163cd95.js +2 -0
  22. package/docs/public/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-input-mdx-14afd07baa693163cd95.js.map +1 -0
  23. package/docs/public/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-mdx-69cfd409ce468da592cf.js +2 -0
  24. package/docs/public/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-mdx-69cfd409ce468da592cf.js.map +1 -0
  25. package/docs/public/components/alerts/index.html +28 -3
  26. package/docs/public/components/avatar/index.html +28 -3
  27. package/docs/public/components/badges/index.html +28 -3
  28. package/docs/public/components/buttons/index.html +29 -4
  29. package/docs/public/components/cards/index.html +29 -4
  30. package/docs/public/components/dropdown/index.html +45 -5
  31. package/docs/public/components/dropdown-input/index.html +107 -0
  32. package/docs/public/components/hr/index.html +28 -3
  33. package/docs/public/components/typography/index.html +28 -3
  34. package/docs/public/faq/index.html +28 -3
  35. package/docs/public/getting-started/index.html +28 -3
  36. package/docs/public/index.html +28 -3
  37. package/docs/public/offline-plugin-app-shell-fallback/index.html +2 -2
  38. package/docs/public/page-data/app-data.json +1 -1
  39. package/docs/public/page-data/components/dropdown-input/page-data.json +1 -1
  40. package/docs/public/page-data/dev-404-page/page-data.json +1 -1
  41. package/docs/public/sitemap-0.xml +1 -1
  42. package/docs/public/sw.js +4 -4
  43. package/docs/public/todo/index.html +28 -3
  44. package/docs/public/utilities/colors/index.html +29 -4
  45. package/docs/public/utilities/margins/index.html +28 -3
  46. package/docs/public/webpack-runtime-9a0f4fdd5a171a24255d.js +2 -0
  47. package/docs/public/webpack-runtime-9a0f4fdd5a171a24255d.js.map +1 -0
  48. package/docs/public/webpack.stats.json +1 -1
  49. package/docs/src/@rocketseat/gatsby-theme-docs/components/Logo.js +2 -8
  50. package/docs/src/@rocketseat/gatsby-theme-docs/styles/theme.js +3 -0
  51. package/docs/src/docs/components/dropdown-input.mdx +101 -7
  52. package/package.json +1 -1
@@ -3,12 +3,13 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.LoadableDropdownInput = exports.DropdownInput = void 0;
6
+ exports.DropdownInput = void 0;
7
7
  var _react = _interopRequireWildcard(require("react"));
8
8
  var _propTypes = _interopRequireDefault(require("prop-types"));
9
9
  var _input = require("./input");
10
- var _excluded = ["prompt", "values", "items", "value", "onChange", "aprops"],
11
- _excluded2 = ["values", "value", "onChange", "prompt", "loading", "label", "showLabel", "disabled", "disabledText"];
10
+ var _button = require("./button");
11
+ var _util = _interopRequireDefault(require("./util"));
12
+ var _excluded = ["prompt", "values", "items", "value", "onChange", "aprops", "showSearch", "loading", "disabled", "disabledText", "label", "showLabel", "color", "outline"];
12
13
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
13
14
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
14
15
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
@@ -29,11 +30,47 @@ var DropdownInput = exports.DropdownInput = function DropdownInput(_ref) {
29
30
  value = _ref.value,
30
31
  onChange = _ref.onChange,
31
32
  aprops = _ref.aprops,
33
+ _ref$showSearch = _ref.showSearch,
34
+ showSearch = _ref$showSearch === void 0 ? true : _ref$showSearch,
35
+ _ref$loading = _ref.loading,
36
+ loading = _ref$loading === void 0 ? false : _ref$loading,
37
+ _ref$disabled = _ref.disabled,
38
+ disabled = _ref$disabled === void 0 ? false : _ref$disabled,
39
+ disabledText = _ref.disabledText,
40
+ label = _ref.label,
41
+ _ref$showLabel = _ref.showLabel,
42
+ showLabel = _ref$showLabel === void 0 ? true : _ref$showLabel,
43
+ color = _ref.color,
44
+ outline = _ref.outline,
32
45
  props = _objectWithoutProperties(_ref, _excluded);
33
- var values = ivalues || items;
46
+ // Allow aliasing: pass either `values` or `items`
47
+ var values = ivalues || items || [];
48
+
49
+ // When loading, show a Button in a container with an optional label.
50
+ if (loading) {
51
+ return /*#__PURE__*/_react["default"].createElement(_util["default"].Col, null, showLabel && label && /*#__PURE__*/_react["default"].createElement("label", {
52
+ className: "form-label"
53
+ }, label), /*#__PURE__*/_react["default"].createElement(_button.Button, {
54
+ loading: true,
55
+ disabled: true
56
+ }, prompt));
57
+ }
58
+
59
+ // When disabled, show a disabled Button (with alternate text if provided).
60
+ if (disabled) {
61
+ return /*#__PURE__*/_react["default"].createElement(_util["default"].Col, null, showLabel && label && /*#__PURE__*/_react["default"].createElement("label", {
62
+ className: "form-label"
63
+ }, label), /*#__PURE__*/_react["default"].createElement(_button.Button, {
64
+ disabled: true
65
+ }, disabledText || prompt));
66
+ }
67
+
68
+ // Helper: if value is an object, use its id; otherwise, assume the value itself is the id.
34
69
  var getId = function getId(val) {
35
70
  return _typeof(val) === "object" && val !== null ? val.id : val;
36
71
  };
72
+
73
+ // Set up state for the selected value and search/filtering.
37
74
  var _useState = (0, _react.useState)(values.find(function (val) {
38
75
  return val.id === getId(value);
39
76
  }) || null),
@@ -49,7 +86,7 @@ var DropdownInput = exports.DropdownInput = function DropdownInput(_ref) {
49
86
  filteredValues = _useState6[0],
50
87
  setFilteredValues = _useState6[1];
51
88
 
52
- // Update selected value if the `value` prop changes
89
+ // Update the selected value if the prop changes.
53
90
  (0, _react.useEffect)(function () {
54
91
  var matchedValue = values.find(function (val) {
55
92
  return val.id === getId(value);
@@ -57,27 +94,29 @@ var DropdownInput = exports.DropdownInput = function DropdownInput(_ref) {
57
94
  setSelectedValue(matchedValue);
58
95
  }, [value, values]);
59
96
 
60
- // Filter the dropdown values based on the search query
97
+ // Filter values based on the search query.
61
98
  (0, _react.useEffect)(function () {
62
99
  setFilteredValues(values.filter(function (val) {
63
100
  return JSON.stringify(val).toLowerCase().includes(searchQuery.toLowerCase());
64
101
  }));
65
102
  }, [searchQuery, values]);
66
- var handleSelection = function handleSelection(value) {
67
- setSelectedValue(value);
103
+ var handleSelection = function handleSelection(val) {
104
+ setSelectedValue(val);
68
105
  if (onChange) {
69
- onChange(value); // Return the full object
106
+ onChange(val);
70
107
  }
71
108
  };
72
- return /*#__PURE__*/_react["default"].createElement("div", _extends({
109
+
110
+ // The main dropdown markup.
111
+ var dropdownContent = /*#__PURE__*/_react["default"].createElement("div", _extends({
73
112
  className: "dropdown"
74
113
  }, props), /*#__PURE__*/_react["default"].createElement("a", _extends({
75
114
  href: "#",
76
- className: "btn dropdown-toggle ".concat(props.disabled ? "disabled" : "", " ").concat(props.color ? "btn-".concat(props.outline && "outline-").concat(props.color) : ""),
115
+ className: "btn dropdown-toggle ".concat(props.disabled ? "disabled" : "", " ").concat(color ? "btn-".concat(outline ? "outline-" : "").concat(color) : ""),
77
116
  "data-bs-toggle": "dropdown"
78
117
  }, aprops), selectedValue ? selectedValue.label : prompt), /*#__PURE__*/_react["default"].createElement("div", {
79
118
  className: "dropdown-menu"
80
- }, /*#__PURE__*/_react["default"].createElement("div", {
119
+ }, showSearch && /*#__PURE__*/_react["default"].createElement("div", {
81
120
  className: "px-2 py-1"
82
121
  }, /*#__PURE__*/_react["default"].createElement(_input.Input, {
83
122
  placeholder: "Search...",
@@ -85,20 +124,25 @@ var DropdownInput = exports.DropdownInput = function DropdownInput(_ref) {
85
124
  onChange: function onChange(value) {
86
125
  return setSearchQuery(value);
87
126
  }
88
- })), filteredValues.map(function (value, index) {
127
+ })), filteredValues.map(function (val, index) {
89
128
  return /*#__PURE__*/_react["default"].createElement("a", {
90
129
  key: index,
91
- className: "dropdown-item".concat(selectedValue && selectedValue.id === value.id ? " active" : ""),
130
+ className: "dropdown-item".concat(selectedValue && selectedValue.id === val.id ? " active" : ""),
92
131
  onClick: function onClick() {
93
- return handleSelection(value);
132
+ return handleSelection(val);
94
133
  },
95
134
  style: {
96
135
  cursor: "pointer"
97
136
  }
98
- }, value.dropdownText || value.label);
137
+ }, val.dropdownText || val.label);
99
138
  }), filteredValues.length === 0 && /*#__PURE__*/_react["default"].createElement("div", {
100
139
  className: "dropdown-item text-muted"
101
140
  }, "No results found")));
141
+
142
+ // If a label is provided, wrap the dropdown with the label inside a container.
143
+ return label && showLabel ? /*#__PURE__*/_react["default"].createElement(_util["default"].Col, null, /*#__PURE__*/_react["default"].createElement("label", {
144
+ className: "form-label"
145
+ }, label), dropdownContent) : dropdownContent;
102
146
  };
103
147
  DropdownInput.propTypes = {
104
148
  prompt: _propTypes["default"].string.isRequired,
@@ -106,45 +150,23 @@ DropdownInput.propTypes = {
106
150
  id: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]).isRequired,
107
151
  label: _propTypes["default"].string.isRequired,
108
152
  dropdownText: _propTypes["default"].string
109
- })).isRequired,
153
+ })),
154
+ items: _propTypes["default"].arrayOf(_propTypes["default"].shape({
155
+ id: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]).isRequired,
156
+ label: _propTypes["default"].string.isRequired,
157
+ dropdownText: _propTypes["default"].string
158
+ })),
110
159
  value: _propTypes["default"].oneOfType([_propTypes["default"].shape({
111
160
  id: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]).isRequired
112
161
  }), _propTypes["default"].string, _propTypes["default"].number]),
113
162
  onChange: _propTypes["default"].func.isRequired,
163
+ aprops: _propTypes["default"].object,
164
+ showSearch: _propTypes["default"].bool,
165
+ loading: _propTypes["default"].bool,
166
+ disabled: _propTypes["default"].bool,
167
+ disabledText: _propTypes["default"].string,
168
+ label: _propTypes["default"].string,
169
+ showLabel: _propTypes["default"].bool,
114
170
  color: _propTypes["default"].string,
115
171
  outline: _propTypes["default"].bool
116
- };
117
- var LoadableDropdownInput = exports.LoadableDropdownInput = function LoadableDropdownInput(_ref2) {
118
- var values = _ref2.values,
119
- value = _ref2.value,
120
- onChange = _ref2.onChange,
121
- prompt = _ref2.prompt,
122
- loading = _ref2.loading,
123
- label = _ref2.label,
124
- _ref2$showLabel = _ref2.showLabel,
125
- showLabel = _ref2$showLabel === void 0 ? true : _ref2$showLabel,
126
- _ref2$disabled = _ref2.disabled,
127
- disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
128
- disabledText = _ref2.disabledText,
129
- props = _objectWithoutProperties(_ref2, _excluded2);
130
- if (loading) return /*#__PURE__*/_react["default"].createElement(Util.Col, null, showLabel && /*#__PURE__*/_react["default"].createElement("label", {
131
- className: "form-label"
132
- }, label), /*#__PURE__*/_react["default"].createElement(Button, {
133
- loading: true,
134
- disabled: true
135
- }, prompt));
136
- if (disabled) return /*#__PURE__*/_react["default"].createElement(Util.Col, null, showLabel && /*#__PURE__*/_react["default"].createElement("label", {
137
- className: "form-label"
138
- }, label), /*#__PURE__*/_react["default"].createElement(Button, {
139
- disabled: true
140
- }, disabledText || prompt));
141
- return /*#__PURE__*/_react["default"].createElement(Util.Col, null, showLabel && /*#__PURE__*/_react["default"].createElement("label", {
142
- className: "form-label"
143
- }, label), /*#__PURE__*/_react["default"].createElement(DropdownInput, _extends({
144
- values: values,
145
- value: value,
146
- onChange: onChange,
147
- prompt: prompt,
148
- "data-value": value
149
- }, props)));
150
172
  };
package/docs/package.json CHANGED
@@ -21,7 +21,7 @@
21
21
  "react": "^18.2.0",
22
22
  "react-dom": "^18.2.0",
23
23
  "styled-components": "^6.1.15",
24
- "tabler-react-2": "^0.1.78"
24
+ "tabler-react-2": "^0.1.80"
25
25
  },
26
26
  "devDependencies": {},
27
27
  "keywords": [
@@ -64,10 +64,35 @@
64
64
  -100%,
65
65
  0,
66
66
  0
67
- );}}</style><aside class="css-9tjo13 e1wh78ri5"><style data-emotion="css 2yrou">.css-2yrou{width:100%;}.css-2yrou a{width:100%;padding-left:30px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}</style><div class="css-2yrou e1wh78ri4"><a aria-label="Go to home page" href="/"><svg width="120" height="32" viewBox="0 0 120 32" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="M78.2632 10.9573C79.4211 10.9573 80.4737 11.2731 81.4211 11.8521C82.3684 12.4837 83.1579 13.3258 83.6316 14.3258C84.2105 15.431 84.4737 16.6942 84.4737 17.9573C84.4737 19.3258 84.2105 20.4837 83.6842 21.5889C83.2105 22.5889 82.4211 23.4837 81.4737 24.1152C80.5263 24.6942 79.4737 25.01 78.3684 25.01C77.5789 25.01 76.7895 24.8521 76.1053 24.5363C75.4211 24.2205 74.8421 23.8521 74.3158 23.3258V23.4837C74.3158 23.9047 74.1579 24.2731 73.8947 24.5889C73.6316 24.9047 73.2632 25.01 72.7895 25.01C72 25.01 71.3158 24.3784 71.2632 23.5889V7.53629C71.2632 7.11524 71.4211 6.74682 71.6842 6.43103C71.9474 6.11524 72.3684 5.95734 72.7895 6.00997C73.2105 6.00997 73.5789 6.16787 73.8947 6.43103C74.1579 6.74682 74.3158 7.11524 74.3158 7.53629V12.7994C74.7895 12.2205 75.3684 11.7994 76 11.4837C76.6842 11.1152 77.4737 10.9573 78.2632 10.9573ZM51.7368 21.8521C51.9474 21.8521 52.2105 21.9573 52.3684 22.1679C52.5789 22.3784 52.6842 22.6942 52.6842 23.0626C52.6842 23.5363 52.4211 23.9047 51.9474 24.2205C51.4737 24.5363 50.8947 24.6942 50.2632 24.6942C49.3158 24.7468 48.4211 24.4837 47.6316 24.01C46.8947 23.5889 46.5789 22.5889 46.5789 21.1679V14.2205H45.4211C44.6842 14.2731 44.0526 13.6416 44 12.9047V12.7994C44 12.431 44.1579 12.0626 44.4211 11.7994C44.6842 11.5363 45.0526 11.431 45.4211 11.431H46.5789V9.79945C46.5789 9.37839 46.7368 9.00997 47 8.69418C47.2632 8.37839 47.6842 8.2205 48.1053 8.27313C48.5263 8.27313 48.8947 8.43103 49.1579 8.69418C49.4211 9.00997 49.5789 9.37839 49.5789 9.79945V11.431H51.3684C52.1053 11.3784 52.7368 12.01 52.7895 12.7468V12.8521C52.7895 13.5889 52.1579 14.2205 51.4211 14.2205H49.5789V21.0626C49.5789 21.431 49.6842 21.6942 49.8421 21.8521C50.0526 22.01 50.2632 22.1152 50.5789 22.1152C50.6873 22.1152 50.7956 22.0905 50.938 22.0579C51.0031 22.043 51.0753 22.0265 51.1579 22.01C51.3684 21.9047 51.5263 21.8521 51.7368 21.8521ZM66.4737 10.9573C67.2632 10.9573 67.9474 11.5889 68 12.3784V23.1679C68 23.5889 67.8421 23.9573 67.5789 24.2731C67.3158 24.5889 66.9474 24.6942 66.4737 24.6942C66.0526 24.6942 65.6842 24.5363 65.4211 24.2731C65.1579 23.9573 65 23.5889 65 23.1679C64.5263 23.6942 63.9474 24.1152 63.3158 24.431C62.6316 24.7468 61.8421 24.9573 61.0526 24.9573C59.8947 24.9573 58.8421 24.6416 57.8947 24.0626C56.9474 23.431 56.1579 22.5889 55.6842 21.5889C55.1157 20.4637 54.8268 19.218 54.8421 17.9573C54.8421 16.5889 55.1053 15.431 55.6316 14.3258C56.1053 13.3258 56.8947 12.431 57.8421 11.7994C58.7895 11.2205 59.8421 10.9047 60.9474 10.9047C62.4737 10.9047 63.8947 11.431 65 12.4837C65 12.0626 65.1579 11.6942 65.4211 11.3784C65.6842 11.0626 66.0526 10.9047 66.4737 10.9573ZM64.0526 20.9573C64.7386 20.1085 65.1105 19.0487 65.1053 17.9573C65.1053 16.7468 64.7368 15.7468 64.0526 14.9047C63.396 14.1043 62.4031 13.6565 61.3684 13.6942C60.2632 13.6942 59.4211 14.1152 58.7368 14.9047C58.0526 15.7468 57.6842 16.8521 57.6842 17.9573C57.6842 19.1679 58.0526 20.1679 58.6842 20.9573C59.3684 21.7468 60.3684 22.2205 61.3684 22.1679C62.4737 22.1679 63.3684 21.7468 64.0526 20.9573ZM80.5263 20.9573C81.2105 20.1152 81.5789 19.01 81.5789 17.9047C81.5789 16.6942 81.2632 15.6942 80.5789 14.9047C79.9139 14.1152 78.9267 13.67 77.8947 13.6942C76.7895 13.6942 75.8947 14.1152 75.2105 14.9047C74.532 15.7577 74.1611 16.8147 74.1579 17.9047C74.1579 19.1152 74.4737 20.1152 75.2105 20.9573C75.8947 21.7468 76.8947 22.2205 77.8947 22.1679C79 22.1679 79.8421 21.7468 80.5263 20.9573ZM90.3158 23.1679C90.3158 23.5889 90.1579 23.9573 89.8947 24.2731C89.6316 24.5889 89.2105 24.6942 88.7895 24.6942C88.3684 24.6942 88 24.5363 87.7368 24.2731C87.4737 23.9573 87.3158 23.5889 87.3158 23.1679V7.53629C87.3158 7.11524 87.4737 6.74682 87.7368 6.43103C88.0526 6.11524 88.4211 5.95734 88.8421 6.00997C89.2632 6.00997 89.6316 6.16787 89.8947 6.43103C90.2105 6.74682 90.3158 7.11524 90.3158 7.53629V23.1679ZM105.263 18.6416C105.579 18.3784 105.737 18.0626 105.737 17.6416C105.737 15.2731 104.474 13.0626 102.632 11.7994C101.632 11.2205 100.579 10.9047 99.4737 10.9047C98.3158 10.9047 97.2632 11.2205 96.2632 11.7994C95.2105 12.431 94.4211 13.2731 93.8421 14.3258C93.2632 15.3784 92.9474 16.6416 92.9474 18.1152C92.8947 19.3784 93.2105 20.5889 93.7895 21.6416C94.3684 22.6416 95.1579 23.4837 96.2105 24.0626C97.2632 24.6416 98.4737 24.9573 99.8947 24.9573C100.737 24.9573 101.526 24.7994 102.316 24.5363C103.105 24.2731 103.737 23.9047 104.211 23.5363C104.684 23.2205 104.895 22.7994 104.895 22.3258C104.895 21.9573 104.789 21.6942 104.526 21.431C104.263 21.1679 104 21.0626 103.632 21.0626C103.368 21.0626 103.053 21.1152 102.789 21.2731L102.316 21.5363C102 21.7468 101.684 21.8521 101.368 21.9573C100.947 22.1152 100.421 22.1679 99.7368 22.1679C97.8421 22.2205 96.2105 20.8521 95.8947 19.01H104.211C104.632 19.01 104.947 18.9047 105.263 18.6416ZM99.3158 13.6942C100.105 13.6942 100.842 13.9573 101.421 14.431C102 14.9047 102.421 15.5363 102.474 16.2731V16.431H95.8421C96.2105 14.5889 97.3684 13.6942 99.3158 13.6942ZM116.526 11.3784C116.211 11.1152 115.789 10.9573 115.263 10.9573C114.474 10.9573 113.684 11.1152 113 11.4837C112.263 11.8521 111.684 12.3784 111.316 13.0626V12.7468C111.316 12.3258 111.211 11.9573 110.895 11.6416C110.579 11.3784 110.211 11.2205 109.789 11.2205C109.368 11.1679 108.947 11.3258 108.684 11.6416C108.421 11.9573 108.263 12.3258 108.263 12.7468V23.1152C108.263 23.5363 108.421 23.9047 108.684 24.2205C109 24.4837 109.316 24.6416 109.789 24.6416C110.263 24.6416 110.632 24.5363 110.895 24.2205C111.158 23.9047 111.316 23.5363 111.316 23.1152V17.1152C111.263 16.431 111.421 15.7994 111.684 15.1679C111.895 14.6942 112.263 14.2731 112.684 13.9573C113.211 13.5889 113.895 13.4837 114.526 13.6416L114.842 13.7468C115.158 13.8521 115.421 13.9047 115.684 13.9047C116.053 13.9573 116.368 13.7994 116.632 13.5363C116.947 13.2731 117.053 12.9047 117.053 12.3784C117.053 12.01 116.842 11.6416 116.526 11.3784Z" fill="#000427"></path><path d="M31.2881 7.10695C30.4887 3.95941 28.0406 1.51132 24.8931 0.711944C18.9977 -0.237315 13.0023 -0.237315 7.10695 0.711944C3.95941 1.51132 1.51132 3.95941 0.711944 7.10695C-0.237315 13.0023 -0.237315 18.9977 0.711944 24.8931C1.51132 28.0406 3.95941 30.4887 7.10695 31.2881C13.0023 32.2373 18.9977 32.2373 24.8931 31.2881C28.0406 30.4887 30.4887 28.0406 31.2881 24.8931C32.2373 18.9977 32.2373 13.0023 31.2881 7.10695Z" fill="#066FD1"></path><path d="M10.0186 22.452C12.2477 21.065 14.13 19.1827 15.517 17.0031C15.9628 16.3096 15.9628 15.3684 15.517 14.6749C14.0805 12.4954 12.2477 10.6625 10.0186 9.27555C8.92878 8.58205 7.49225 8.97834 6.79875 10.0681C6.74922 10.0681 6.74922 10.1177 6.74922 10.1177C6.44515 10.6427 6.36306 11.2674 6.52113 11.8532C6.67921 12.439 7.06439 12.9376 7.59132 13.2384C8.73064 13.9814 9.72135 14.8235 10.613 15.8638C9.77089 16.904 8.73064 17.7957 7.59132 18.4892C6.84829 18.8855 6.40247 19.678 6.40247 20.5201C6.44817 21.3569 6.9275 22.1091 7.66667 22.504C8.40585 22.8989 9.29757 22.8792 10.0186 22.452Z" fill="white"></path><path d="M17.7461 21.8081H23.3932C24.4334 21.8081 25.2755 21.3127 25.2755 20.322C25.2755 19.3313 24.4334 18.8359 23.3932 18.8359H17.7461C16.7059 18.8359 15.8638 19.3313 15.8638 20.322C15.8638 21.3127 16.7059 21.8081 17.7461 21.8081Z" fill="white"></path></svg></a></div><nav><style data-emotion="css qmhqz9">.css-qmhqz9{list-style:none;width:100%;padding-left:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}</style><ul class="css-qmhqz9 e1wh78ri3"><style data-emotion="css why3vc">.css-why3vc{font-size:15px;width:100%;-webkit-transition:all 200ms ease-in-out;transition:all 200ms ease-in-out;padding:0 20px;cursor:pointer;}.css-why3vc a,.css-why3vc span{display:block;font-size:15px;color:#6C6C80;background-color:#FFFFFF;padding:4px 10px;margin:4px 0;border-radius:4px;font-weight:normal;-webkit-text-decoration:none;text-decoration:none;width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:pointer;margin:0 auto;-webkit-transition:all 0.2s ease;transition:all 0.2s ease;}.css-why3vc a svg,.css-why3vc span svg{width:20px;height:20px;margin-right:10px;}.css-why3vc a:not(.active-link):hover,.css-why3vc span:not(.active-link):hover{color:#8257E6;}.css-why3vc a.active-link,.css-why3vc span.active-link{color:#8257E6;background-color:#F2F2FA;}@media (max-width: 780px){.css-why3vc a.active-link,.css-why3vc span.active-link{background:#F2F2FA;}}</style><li class="css-why3vc e1wh78ri1"><a href="/">Introduction</a></li><li class="css-why3vc e1wh78ri1"><a href="/getting-started/">Getting started</a></li><style data-emotion="css mximbs">.css-mximbs{padding-left:30px;width:100%;text-transform:uppercase;font-size:14px;font-weight:bold;margin-top:20px;color:#3D3D4D;letter-spacing:0.142em;}</style><li class="css-mximbs e1wh78ri2">Components</li><style data-emotion="css 1cgn8l4">.css-1cgn8l4{list-style:none;width:100%;padding-left:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin:5px 0 0 0;}</style><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/components/typography/">Typography</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/cards/">Cards</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/hr/">Horizontal Rule</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/alerts/">Alerts</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/avatar/">Avatars</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/badges/">Badges</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/buttons/">Buttons</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/dropdown/">Dropdowns</a></li></ul><li class="css-mximbs e1wh78ri2">Utilities</li><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/utilities/colors/">Colors</a></li><li class="css-why3vc e1wh78ri1"><a href="/utilities/margins/">Margins</a></li></ul><li class="css-mximbs e1wh78ri2">More</li><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/todo/">To do list</a></li></ul></ul></nav></aside><style data-emotion="css u8hwp7">.css-u8hwp7{height:100%;padding-top:36px;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;position:relative;}@media (max-width: 1200px){.css-u8hwp7{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}}@media (max-width: 780px){.css-u8hwp7{padding-top:0;}}</style><main class="css-u8hwp7 eees1d51"><style data-emotion="css 1p24zom">.css-1p24zom{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:40px;margin-bottom:24px;}.css-1p24zom h2{margin:0;border:none;padding:0;font-size:18px;}@media (max-width: 359px){.css-1p24zom h2{font-size:14px;}}.css-1p24zom button{border:none;background:none;cursor:pointer;margin-right:16px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media (min-width: 780px){.css-1p24zom{display:none;}}</style><header class="css-1p24zom esnpb7p0"><button aria-label="Open sidebar" type="button"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" aria-hidden="true" height="23" width="23" xmlns="http://www.w3.org/2000/svg"><path d="M32 96v64h448V96H32zm0 128v64h448v-64H32zm0 128v64h448v-64H32z"></path></svg></button><h2>Tabler React 2 Docs</h2></header><style data-emotion="css 1j7nlw4">.css-1j7nlw4{display:none;}@media (max-width: 1200px){.css-1j7nlw4{display:block;}}</style><h1 class="css-1j7nlw4">Page not found!</h1><style data-emotion="css 1h97cat">.css-1h97cat{width:100%;max-width:calc(75% - 64px);padding-right:64px;}@media (max-width: 1200px){.css-1h97cat{max-width:100%;padding-right:0;-webkit-order:3;-ms-flex-order:3;order:3;}}.css-1h97cat h1,.css-1h97cat h2,.css-1h97cat h3,.css-1h97cat h4,.css-1h97cat h5,.css-1h97cat h6{overflow-wrap:break-word;}</style><div class="css-1h97cat eees1d50"><style data-emotion="css 1fdmakl">@media (max-width: 1200px){.css-1fdmakl{display:none;}}</style><h1 class="css-1fdmakl">Page not found!</h1><p>You just hit a route that doesn&#x27;t exist... the sadness.</p><p>If you&#x27;d like to go back to homepage, <a href="/">click here</a>.</p></div><style data-emotion="css 106zi9a">.css-106zi9a{position:-webkit-sticky;position:sticky;top:0;-webkit-order:2;-ms-flex-order:2;order:2;padding-top:72px;max-height:calc(100vh - 72px);overflow-y:auto;overflow-x:hidden;width:100%;max-width:200px;}@media (max-width: 1200px){.css-106zi9a{position:relative;top:auto;-webkit-order:0;-ms-flex-order:0;order:0;max-width:100%;margin-left:0;padding-top:0;}}</style><div class="css-106zi9a e10o0eax1"></div></main></div></div><div id="gatsby-announcer" style="position:absolute;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0" aria-live="assertive" aria-atomic="true"></div></div><script id="gatsby-script-loader">/*<![CDATA[*/window.pagePath="/404/";/*]]>*/</script><!-- slice-start id="_gatsby-scripts-1" -->
67
+ );}}</style><aside class="css-9tjo13 e1wh78ri5"><style data-emotion="css 2yrou">.css-2yrou{width:100%;}.css-2yrou a{width:100%;padding-left:30px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}</style><div class="css-2yrou e1wh78ri4"><a aria-label="Go to home page" href="/"><svg width="120" height="32" viewBox="0 0 120 32" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="M78.2632 10.9573C79.4211 10.9573 80.4737 11.2731 81.4211 11.8521C82.3684 12.4837 83.1579 13.3258 83.6316 14.3258C84.2105 15.431 84.4737 16.6942 84.4737 17.9573C84.4737 19.3258 84.2105 20.4837 83.6842 21.5889C83.2105 22.5889 82.4211 23.4837 81.4737 24.1152C80.5263 24.6942 79.4737 25.01 78.3684 25.01C77.5789 25.01 76.7895 24.8521 76.1053 24.5363C75.4211 24.2205 74.8421 23.8521 74.3158 23.3258V23.4837C74.3158 23.9047 74.1579 24.2731 73.8947 24.5889C73.6316 24.9047 73.2632 25.01 72.7895 25.01C72 25.01 71.3158 24.3784 71.2632 23.5889V7.53629C71.2632 7.11524 71.4211 6.74682 71.6842 6.43103C71.9474 6.11524 72.3684 5.95734 72.7895 6.00997C73.2105 6.00997 73.5789 6.16787 73.8947 6.43103C74.1579 6.74682 74.3158 7.11524 74.3158 7.53629V12.7994C74.7895 12.2205 75.3684 11.7994 76 11.4837C76.6842 11.1152 77.4737 10.9573 78.2632 10.9573ZM51.7368 21.8521C51.9474 21.8521 52.2105 21.9573 52.3684 22.1679C52.5789 22.3784 52.6842 22.6942 52.6842 23.0626C52.6842 23.5363 52.4211 23.9047 51.9474 24.2205C51.4737 24.5363 50.8947 24.6942 50.2632 24.6942C49.3158 24.7468 48.4211 24.4837 47.6316 24.01C46.8947 23.5889 46.5789 22.5889 46.5789 21.1679V14.2205H45.4211C44.6842 14.2731 44.0526 13.6416 44 12.9047V12.7994C44 12.431 44.1579 12.0626 44.4211 11.7994C44.6842 11.5363 45.0526 11.431 45.4211 11.431H46.5789V9.79945C46.5789 9.37839 46.7368 9.00997 47 8.69418C47.2632 8.37839 47.6842 8.2205 48.1053 8.27313C48.5263 8.27313 48.8947 8.43103 49.1579 8.69418C49.4211 9.00997 49.5789 9.37839 49.5789 9.79945V11.431H51.3684C52.1053 11.3784 52.7368 12.01 52.7895 12.7468V12.8521C52.7895 13.5889 52.1579 14.2205 51.4211 14.2205H49.5789V21.0626C49.5789 21.431 49.6842 21.6942 49.8421 21.8521C50.0526 22.01 50.2632 22.1152 50.5789 22.1152C50.6873 22.1152 50.7956 22.0905 50.938 22.0579C51.0031 22.043 51.0753 22.0265 51.1579 22.01C51.3684 21.9047 51.5263 21.8521 51.7368 21.8521ZM66.4737 10.9573C67.2632 10.9573 67.9474 11.5889 68 12.3784V23.1679C68 23.5889 67.8421 23.9573 67.5789 24.2731C67.3158 24.5889 66.9474 24.6942 66.4737 24.6942C66.0526 24.6942 65.6842 24.5363 65.4211 24.2731C65.1579 23.9573 65 23.5889 65 23.1679C64.5263 23.6942 63.9474 24.1152 63.3158 24.431C62.6316 24.7468 61.8421 24.9573 61.0526 24.9573C59.8947 24.9573 58.8421 24.6416 57.8947 24.0626C56.9474 23.431 56.1579 22.5889 55.6842 21.5889C55.1157 20.4637 54.8268 19.218 54.8421 17.9573C54.8421 16.5889 55.1053 15.431 55.6316 14.3258C56.1053 13.3258 56.8947 12.431 57.8421 11.7994C58.7895 11.2205 59.8421 10.9047 60.9474 10.9047C62.4737 10.9047 63.8947 11.431 65 12.4837C65 12.0626 65.1579 11.6942 65.4211 11.3784C65.6842 11.0626 66.0526 10.9047 66.4737 10.9573ZM64.0526 20.9573C64.7386 20.1085 65.1105 19.0487 65.1053 17.9573C65.1053 16.7468 64.7368 15.7468 64.0526 14.9047C63.396 14.1043 62.4031 13.6565 61.3684 13.6942C60.2632 13.6942 59.4211 14.1152 58.7368 14.9047C58.0526 15.7468 57.6842 16.8521 57.6842 17.9573C57.6842 19.1679 58.0526 20.1679 58.6842 20.9573C59.3684 21.7468 60.3684 22.2205 61.3684 22.1679C62.4737 22.1679 63.3684 21.7468 64.0526 20.9573ZM80.5263 20.9573C81.2105 20.1152 81.5789 19.01 81.5789 17.9047C81.5789 16.6942 81.2632 15.6942 80.5789 14.9047C79.9139 14.1152 78.9267 13.67 77.8947 13.6942C76.7895 13.6942 75.8947 14.1152 75.2105 14.9047C74.532 15.7577 74.1611 16.8147 74.1579 17.9047C74.1579 19.1152 74.4737 20.1152 75.2105 20.9573C75.8947 21.7468 76.8947 22.2205 77.8947 22.1679C79 22.1679 79.8421 21.7468 80.5263 20.9573ZM90.3158 23.1679C90.3158 23.5889 90.1579 23.9573 89.8947 24.2731C89.6316 24.5889 89.2105 24.6942 88.7895 24.6942C88.3684 24.6942 88 24.5363 87.7368 24.2731C87.4737 23.9573 87.3158 23.5889 87.3158 23.1679V7.53629C87.3158 7.11524 87.4737 6.74682 87.7368 6.43103C88.0526 6.11524 88.4211 5.95734 88.8421 6.00997C89.2632 6.00997 89.6316 6.16787 89.8947 6.43103C90.2105 6.74682 90.3158 7.11524 90.3158 7.53629V23.1679ZM105.263 18.6416C105.579 18.3784 105.737 18.0626 105.737 17.6416C105.737 15.2731 104.474 13.0626 102.632 11.7994C101.632 11.2205 100.579 10.9047 99.4737 10.9047C98.3158 10.9047 97.2632 11.2205 96.2632 11.7994C95.2105 12.431 94.4211 13.2731 93.8421 14.3258C93.2632 15.3784 92.9474 16.6416 92.9474 18.1152C92.8947 19.3784 93.2105 20.5889 93.7895 21.6416C94.3684 22.6416 95.1579 23.4837 96.2105 24.0626C97.2632 24.6416 98.4737 24.9573 99.8947 24.9573C100.737 24.9573 101.526 24.7994 102.316 24.5363C103.105 24.2731 103.737 23.9047 104.211 23.5363C104.684 23.2205 104.895 22.7994 104.895 22.3258C104.895 21.9573 104.789 21.6942 104.526 21.431C104.263 21.1679 104 21.0626 103.632 21.0626C103.368 21.0626 103.053 21.1152 102.789 21.2731L102.316 21.5363C102 21.7468 101.684 21.8521 101.368 21.9573C100.947 22.1152 100.421 22.1679 99.7368 22.1679C97.8421 22.2205 96.2105 20.8521 95.8947 19.01H104.211C104.632 19.01 104.947 18.9047 105.263 18.6416ZM99.3158 13.6942C100.105 13.6942 100.842 13.9573 101.421 14.431C102 14.9047 102.421 15.5363 102.474 16.2731V16.431H95.8421C96.2105 14.5889 97.3684 13.6942 99.3158 13.6942ZM116.526 11.3784C116.211 11.1152 115.789 10.9573 115.263 10.9573C114.474 10.9573 113.684 11.1152 113 11.4837C112.263 11.8521 111.684 12.3784 111.316 13.0626V12.7468C111.316 12.3258 111.211 11.9573 110.895 11.6416C110.579 11.3784 110.211 11.2205 109.789 11.2205C109.368 11.1679 108.947 11.3258 108.684 11.6416C108.421 11.9573 108.263 12.3258 108.263 12.7468V23.1152C108.263 23.5363 108.421 23.9047 108.684 24.2205C109 24.4837 109.316 24.6416 109.789 24.6416C110.263 24.6416 110.632 24.5363 110.895 24.2205C111.158 23.9047 111.316 23.5363 111.316 23.1152V17.1152C111.263 16.431 111.421 15.7994 111.684 15.1679C111.895 14.6942 112.263 14.2731 112.684 13.9573C113.211 13.5889 113.895 13.4837 114.526 13.6416L114.842 13.7468C115.158 13.8521 115.421 13.9047 115.684 13.9047C116.053 13.9573 116.368 13.7994 116.632 13.5363C116.947 13.2731 117.053 12.9047 117.053 12.3784C117.053 12.01 116.842 11.6416 116.526 11.3784Z" fill="#000427"></path><path d="M31.2881 7.10695C30.4887 3.95941 28.0406 1.51132 24.8931 0.711944C18.9977 -0.237315 13.0023 -0.237315 7.10695 0.711944C3.95941 1.51132 1.51132 3.95941 0.711944 7.10695C-0.237315 13.0023 -0.237315 18.9977 0.711944 24.8931C1.51132 28.0406 3.95941 30.4887 7.10695 31.2881C13.0023 32.2373 18.9977 32.2373 24.8931 31.2881C28.0406 30.4887 30.4887 28.0406 31.2881 24.8931C32.2373 18.9977 32.2373 13.0023 31.2881 7.10695Z" fill="#066FD1"></path><path d="M10.0186 22.452C12.2477 21.065 14.13 19.1827 15.517 17.0031C15.9628 16.3096 15.9628 15.3684 15.517 14.6749C14.0805 12.4954 12.2477 10.6625 10.0186 9.27555C8.92878 8.58205 7.49225 8.97834 6.79875 10.0681C6.74922 10.0681 6.74922 10.1177 6.74922 10.1177C6.44515 10.6427 6.36306 11.2674 6.52113 11.8532C6.67921 12.439 7.06439 12.9376 7.59132 13.2384C8.73064 13.9814 9.72135 14.8235 10.613 15.8638C9.77089 16.904 8.73064 17.7957 7.59132 18.4892C6.84829 18.8855 6.40247 19.678 6.40247 20.5201C6.44817 21.3569 6.9275 22.1091 7.66667 22.504C8.40585 22.8989 9.29757 22.8792 10.0186 22.452Z" fill="white"></path><path d="M17.7461 21.8081H23.3932C24.4334 21.8081 25.2755 21.3127 25.2755 20.322C25.2755 19.3313 24.4334 18.8359 23.3932 18.8359H17.7461C16.7059 18.8359 15.8638 19.3313 15.8638 20.322C15.8638 21.3127 16.7059 21.8081 17.7461 21.8081Z" fill="white"></path></svg><div>
68
+ <style>
69
+ main a:not(section a):not(nav a) {
70
+ color: #066fd1!important;
71
+ text-decoration: underline!important;
72
+ }
73
+ main a:not(section a):not(nav a) code {
74
+ text-decoration: underline!important;
75
+ }
76
+ html {
77
+ scroll-behavior: smooth;
78
+ }
79
+ blockquote>p {
80
+ background-color:rgba(6, 111, 209, 0.08)!important;
81
+ border-left: 4px solid #066fd1!important;
82
+ }
83
+ blockquote>p p {
84
+ background-color: unset!important;
85
+ padding: 0!important;
86
+ padding-bottom: 1rem!important;
87
+ }
88
+ blockquote>p strong {
89
+ color: #066fd1!important;
90
+ }
91
+ </style>
92
+ </div></a></div><nav><style data-emotion="css qmhqz9">.css-qmhqz9{list-style:none;width:100%;padding-left:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}</style><ul class="css-qmhqz9 e1wh78ri3"><style data-emotion="css why3vc">.css-why3vc{font-size:15px;width:100%;-webkit-transition:all 200ms ease-in-out;transition:all 200ms ease-in-out;padding:0 20px;cursor:pointer;}.css-why3vc a,.css-why3vc span{display:block;font-size:15px;color:#6C6C80;background-color:#FFFFFF;padding:4px 10px;margin:4px 0;border-radius:4px;font-weight:normal;-webkit-text-decoration:none;text-decoration:none;width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:pointer;margin:0 auto;-webkit-transition:all 0.2s ease;transition:all 0.2s ease;}.css-why3vc a svg,.css-why3vc span svg{width:20px;height:20px;margin-right:10px;}.css-why3vc a:not(.active-link):hover,.css-why3vc span:not(.active-link):hover{color:#8257E6;}.css-why3vc a.active-link,.css-why3vc span.active-link{color:#8257E6;background-color:#F2F2FA;}@media (max-width: 780px){.css-why3vc a.active-link,.css-why3vc span.active-link{background:#F2F2FA;}}</style><li class="css-why3vc e1wh78ri1"><a href="/">Introduction</a></li><li class="css-why3vc e1wh78ri1"><a href="/getting-started/">Getting started</a></li><style data-emotion="css mximbs">.css-mximbs{padding-left:30px;width:100%;text-transform:uppercase;font-size:14px;font-weight:bold;margin-top:20px;color:#3D3D4D;letter-spacing:0.142em;}</style><li class="css-mximbs e1wh78ri2">Components</li><style data-emotion="css 1cgn8l4">.css-1cgn8l4{list-style:none;width:100%;padding-left:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin:5px 0 0 0;}</style><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/components/typography/">Typography</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/cards/">Cards</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/hr/">Horizontal Rule</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/alerts/">Alerts</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/avatar/">Avatars</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/badges/">Badges</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/buttons/">Buttons</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/dropdown/">Dropdown</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/dropdown-input/">Dropdown Input</a></li></ul><li class="css-mximbs e1wh78ri2">Utilities</li><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/utilities/colors/">Colors</a></li><li class="css-why3vc e1wh78ri1"><a href="/utilities/margins/">Margins</a></li></ul><li class="css-mximbs e1wh78ri2">More</li><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/todo/">To do list</a></li></ul></ul></nav></aside><style data-emotion="css u8hwp7">.css-u8hwp7{height:100%;padding-top:36px;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;position:relative;}@media (max-width: 1200px){.css-u8hwp7{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}}@media (max-width: 780px){.css-u8hwp7{padding-top:0;}}</style><main class="css-u8hwp7 eees1d51"><style data-emotion="css 1p24zom">.css-1p24zom{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:40px;margin-bottom:24px;}.css-1p24zom h2{margin:0;border:none;padding:0;font-size:18px;}@media (max-width: 359px){.css-1p24zom h2{font-size:14px;}}.css-1p24zom button{border:none;background:none;cursor:pointer;margin-right:16px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media (min-width: 780px){.css-1p24zom{display:none;}}</style><header class="css-1p24zom esnpb7p0"><button aria-label="Open sidebar" type="button"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" aria-hidden="true" height="23" width="23" xmlns="http://www.w3.org/2000/svg"><path d="M32 96v64h448V96H32zm0 128v64h448v-64H32zm0 128v64h448v-64H32z"></path></svg></button><h2>Tabler React 2 Docs</h2></header><style data-emotion="css 1j7nlw4">.css-1j7nlw4{display:none;}@media (max-width: 1200px){.css-1j7nlw4{display:block;}}</style><h1 class="css-1j7nlw4">Page not found!</h1><style data-emotion="css 1h97cat">.css-1h97cat{width:100%;max-width:calc(75% - 64px);padding-right:64px;}@media (max-width: 1200px){.css-1h97cat{max-width:100%;padding-right:0;-webkit-order:3;-ms-flex-order:3;order:3;}}.css-1h97cat h1,.css-1h97cat h2,.css-1h97cat h3,.css-1h97cat h4,.css-1h97cat h5,.css-1h97cat h6{overflow-wrap:break-word;}</style><div class="css-1h97cat eees1d50"><style data-emotion="css 1fdmakl">@media (max-width: 1200px){.css-1fdmakl{display:none;}}</style><h1 class="css-1fdmakl">Page not found!</h1><p>You just hit a route that doesn&#x27;t exist... the sadness.</p><p>If you&#x27;d like to go back to homepage, <a href="/">click here</a>.</p></div><style data-emotion="css 106zi9a">.css-106zi9a{position:-webkit-sticky;position:sticky;top:0;-webkit-order:2;-ms-flex-order:2;order:2;padding-top:72px;max-height:calc(100vh - 72px);overflow-y:auto;overflow-x:hidden;width:100%;max-width:200px;}@media (max-width: 1200px){.css-106zi9a{position:relative;top:auto;-webkit-order:0;-ms-flex-order:0;order:0;max-width:100%;margin-left:0;padding-top:0;}}</style><div class="css-106zi9a e10o0eax1"></div></main></div></div><div id="gatsby-announcer" style="position:absolute;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0" aria-live="assertive" aria-atomic="true"></div></div><script id="gatsby-script-loader">/*<![CDATA[*/window.pagePath="/404/";/*]]>*/</script><!-- slice-start id="_gatsby-scripts-1" -->
68
93
  <script
69
94
  id="gatsby-chunk-mapping"
70
95
  >
71
- window.___chunkMapping="{\"app\":[\"/app-1ecd51cf2b5ceab2a3fd.js\"],\"component---cache-caches-gatsby-plugin-offline-app-shell-js\":[\"/component---cache-caches-gatsby-plugin-offline-app-shell-js-a92b01a914bf7250611d.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-alerts-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-alerts-mdx-23ff7b1e278fa0bf73a9.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-avatar-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-avatar-mdx-1b09f3e73d6a16322dc6.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-badges-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-badges-mdx-50aa321477b71e498a65.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-buttons-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-buttons-mdx-4f32426e35802d85bcd4.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-cards-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-cards-mdx-4b597b8778c92e462990.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-mdx-7f2033be6f9ea53d5b77.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-hr-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-hr-mdx-3e0e30684aa2ade2a4aa.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-typography-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-typography-mdx-135a0ced9d62e55bd56a.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-faq-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-faq-mdx-efb5bdd15d83268422e6.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-getting-started-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-getting-started-mdx-acc2e0cfab89ea7e9d12.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-todo-md\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-todo-md-4a75674d05b1fa999d30.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-colors-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-colors-mdx-3a6dc0f3815386265abb.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-margins-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-margins-mdx-f0ec237cf90904c24e33.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-homepage-query-js-content-file-path-src-home-index-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-homepage-query-js-content-file-path-src-home-index-mdx-944d7b2c3ca472c24e78.js\"],\"component---src-pages-404-js\":[\"/component---src-pages-404-js-d8f42bed124f0abce764.js\"]}";
96
+ window.___chunkMapping="{\"app\":[\"/app-d61e1c7b50762c49d313.js\"],\"component---cache-caches-gatsby-plugin-offline-app-shell-js\":[\"/component---cache-caches-gatsby-plugin-offline-app-shell-js-a92b01a914bf7250611d.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-alerts-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-alerts-mdx-23ff7b1e278fa0bf73a9.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-avatar-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-avatar-mdx-1b09f3e73d6a16322dc6.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-badges-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-badges-mdx-50aa321477b71e498a65.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-buttons-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-buttons-mdx-4f32426e35802d85bcd4.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-cards-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-cards-mdx-033bf6626c64caa0fd31.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-input-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-input-mdx-14afd07baa693163cd95.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-mdx-69cfd409ce468da592cf.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-hr-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-hr-mdx-3e0e30684aa2ade2a4aa.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-typography-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-typography-mdx-6c8c5413b8d65e5a0e3a.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-faq-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-faq-mdx-efb5bdd15d83268422e6.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-getting-started-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-getting-started-mdx-acc2e0cfab89ea7e9d12.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-todo-md\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-todo-md-4a75674d05b1fa999d30.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-colors-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-colors-mdx-3a6dc0f3815386265abb.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-margins-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-margins-mdx-f0ec237cf90904c24e33.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-homepage-query-js-content-file-path-src-home-index-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-homepage-query-js-content-file-path-src-home-index-mdx-944d7b2c3ca472c24e78.js\"],\"component---src-pages-404-js\":[\"/component---src-pages-404-js-d8f42bed124f0abce764.js\"]}";
72
97
  </script>
73
- <script>window.___webpackCompilationHash="986351a7385188069906";</script><script src="/webpack-runtime-e087b17efa58b03ae513.js" async></script><script src="/framework-c8b57e0b7ea450f0f3f9.js" async></script><script src="/app-1ecd51cf2b5ceab2a3fd.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
98
+ <script>window.___webpackCompilationHash="c4764ef249680e096e32";</script><script src="/webpack-runtime-9a0f4fdd5a171a24255d.js" async></script><script src="/framework-c8b57e0b7ea450f0f3f9.js" async></script><script src="/app-d61e1c7b50762c49d313.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
@@ -64,10 +64,35 @@
64
64
  -100%,
65
65
  0,
66
66
  0
67
- );}}</style><aside class="css-9tjo13 e1wh78ri5"><style data-emotion="css 2yrou">.css-2yrou{width:100%;}.css-2yrou a{width:100%;padding-left:30px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}</style><div class="css-2yrou e1wh78ri4"><a aria-label="Go to home page" href="/"><svg width="120" height="32" viewBox="0 0 120 32" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="M78.2632 10.9573C79.4211 10.9573 80.4737 11.2731 81.4211 11.8521C82.3684 12.4837 83.1579 13.3258 83.6316 14.3258C84.2105 15.431 84.4737 16.6942 84.4737 17.9573C84.4737 19.3258 84.2105 20.4837 83.6842 21.5889C83.2105 22.5889 82.4211 23.4837 81.4737 24.1152C80.5263 24.6942 79.4737 25.01 78.3684 25.01C77.5789 25.01 76.7895 24.8521 76.1053 24.5363C75.4211 24.2205 74.8421 23.8521 74.3158 23.3258V23.4837C74.3158 23.9047 74.1579 24.2731 73.8947 24.5889C73.6316 24.9047 73.2632 25.01 72.7895 25.01C72 25.01 71.3158 24.3784 71.2632 23.5889V7.53629C71.2632 7.11524 71.4211 6.74682 71.6842 6.43103C71.9474 6.11524 72.3684 5.95734 72.7895 6.00997C73.2105 6.00997 73.5789 6.16787 73.8947 6.43103C74.1579 6.74682 74.3158 7.11524 74.3158 7.53629V12.7994C74.7895 12.2205 75.3684 11.7994 76 11.4837C76.6842 11.1152 77.4737 10.9573 78.2632 10.9573ZM51.7368 21.8521C51.9474 21.8521 52.2105 21.9573 52.3684 22.1679C52.5789 22.3784 52.6842 22.6942 52.6842 23.0626C52.6842 23.5363 52.4211 23.9047 51.9474 24.2205C51.4737 24.5363 50.8947 24.6942 50.2632 24.6942C49.3158 24.7468 48.4211 24.4837 47.6316 24.01C46.8947 23.5889 46.5789 22.5889 46.5789 21.1679V14.2205H45.4211C44.6842 14.2731 44.0526 13.6416 44 12.9047V12.7994C44 12.431 44.1579 12.0626 44.4211 11.7994C44.6842 11.5363 45.0526 11.431 45.4211 11.431H46.5789V9.79945C46.5789 9.37839 46.7368 9.00997 47 8.69418C47.2632 8.37839 47.6842 8.2205 48.1053 8.27313C48.5263 8.27313 48.8947 8.43103 49.1579 8.69418C49.4211 9.00997 49.5789 9.37839 49.5789 9.79945V11.431H51.3684C52.1053 11.3784 52.7368 12.01 52.7895 12.7468V12.8521C52.7895 13.5889 52.1579 14.2205 51.4211 14.2205H49.5789V21.0626C49.5789 21.431 49.6842 21.6942 49.8421 21.8521C50.0526 22.01 50.2632 22.1152 50.5789 22.1152C50.6873 22.1152 50.7956 22.0905 50.938 22.0579C51.0031 22.043 51.0753 22.0265 51.1579 22.01C51.3684 21.9047 51.5263 21.8521 51.7368 21.8521ZM66.4737 10.9573C67.2632 10.9573 67.9474 11.5889 68 12.3784V23.1679C68 23.5889 67.8421 23.9573 67.5789 24.2731C67.3158 24.5889 66.9474 24.6942 66.4737 24.6942C66.0526 24.6942 65.6842 24.5363 65.4211 24.2731C65.1579 23.9573 65 23.5889 65 23.1679C64.5263 23.6942 63.9474 24.1152 63.3158 24.431C62.6316 24.7468 61.8421 24.9573 61.0526 24.9573C59.8947 24.9573 58.8421 24.6416 57.8947 24.0626C56.9474 23.431 56.1579 22.5889 55.6842 21.5889C55.1157 20.4637 54.8268 19.218 54.8421 17.9573C54.8421 16.5889 55.1053 15.431 55.6316 14.3258C56.1053 13.3258 56.8947 12.431 57.8421 11.7994C58.7895 11.2205 59.8421 10.9047 60.9474 10.9047C62.4737 10.9047 63.8947 11.431 65 12.4837C65 12.0626 65.1579 11.6942 65.4211 11.3784C65.6842 11.0626 66.0526 10.9047 66.4737 10.9573ZM64.0526 20.9573C64.7386 20.1085 65.1105 19.0487 65.1053 17.9573C65.1053 16.7468 64.7368 15.7468 64.0526 14.9047C63.396 14.1043 62.4031 13.6565 61.3684 13.6942C60.2632 13.6942 59.4211 14.1152 58.7368 14.9047C58.0526 15.7468 57.6842 16.8521 57.6842 17.9573C57.6842 19.1679 58.0526 20.1679 58.6842 20.9573C59.3684 21.7468 60.3684 22.2205 61.3684 22.1679C62.4737 22.1679 63.3684 21.7468 64.0526 20.9573ZM80.5263 20.9573C81.2105 20.1152 81.5789 19.01 81.5789 17.9047C81.5789 16.6942 81.2632 15.6942 80.5789 14.9047C79.9139 14.1152 78.9267 13.67 77.8947 13.6942C76.7895 13.6942 75.8947 14.1152 75.2105 14.9047C74.532 15.7577 74.1611 16.8147 74.1579 17.9047C74.1579 19.1152 74.4737 20.1152 75.2105 20.9573C75.8947 21.7468 76.8947 22.2205 77.8947 22.1679C79 22.1679 79.8421 21.7468 80.5263 20.9573ZM90.3158 23.1679C90.3158 23.5889 90.1579 23.9573 89.8947 24.2731C89.6316 24.5889 89.2105 24.6942 88.7895 24.6942C88.3684 24.6942 88 24.5363 87.7368 24.2731C87.4737 23.9573 87.3158 23.5889 87.3158 23.1679V7.53629C87.3158 7.11524 87.4737 6.74682 87.7368 6.43103C88.0526 6.11524 88.4211 5.95734 88.8421 6.00997C89.2632 6.00997 89.6316 6.16787 89.8947 6.43103C90.2105 6.74682 90.3158 7.11524 90.3158 7.53629V23.1679ZM105.263 18.6416C105.579 18.3784 105.737 18.0626 105.737 17.6416C105.737 15.2731 104.474 13.0626 102.632 11.7994C101.632 11.2205 100.579 10.9047 99.4737 10.9047C98.3158 10.9047 97.2632 11.2205 96.2632 11.7994C95.2105 12.431 94.4211 13.2731 93.8421 14.3258C93.2632 15.3784 92.9474 16.6416 92.9474 18.1152C92.8947 19.3784 93.2105 20.5889 93.7895 21.6416C94.3684 22.6416 95.1579 23.4837 96.2105 24.0626C97.2632 24.6416 98.4737 24.9573 99.8947 24.9573C100.737 24.9573 101.526 24.7994 102.316 24.5363C103.105 24.2731 103.737 23.9047 104.211 23.5363C104.684 23.2205 104.895 22.7994 104.895 22.3258C104.895 21.9573 104.789 21.6942 104.526 21.431C104.263 21.1679 104 21.0626 103.632 21.0626C103.368 21.0626 103.053 21.1152 102.789 21.2731L102.316 21.5363C102 21.7468 101.684 21.8521 101.368 21.9573C100.947 22.1152 100.421 22.1679 99.7368 22.1679C97.8421 22.2205 96.2105 20.8521 95.8947 19.01H104.211C104.632 19.01 104.947 18.9047 105.263 18.6416ZM99.3158 13.6942C100.105 13.6942 100.842 13.9573 101.421 14.431C102 14.9047 102.421 15.5363 102.474 16.2731V16.431H95.8421C96.2105 14.5889 97.3684 13.6942 99.3158 13.6942ZM116.526 11.3784C116.211 11.1152 115.789 10.9573 115.263 10.9573C114.474 10.9573 113.684 11.1152 113 11.4837C112.263 11.8521 111.684 12.3784 111.316 13.0626V12.7468C111.316 12.3258 111.211 11.9573 110.895 11.6416C110.579 11.3784 110.211 11.2205 109.789 11.2205C109.368 11.1679 108.947 11.3258 108.684 11.6416C108.421 11.9573 108.263 12.3258 108.263 12.7468V23.1152C108.263 23.5363 108.421 23.9047 108.684 24.2205C109 24.4837 109.316 24.6416 109.789 24.6416C110.263 24.6416 110.632 24.5363 110.895 24.2205C111.158 23.9047 111.316 23.5363 111.316 23.1152V17.1152C111.263 16.431 111.421 15.7994 111.684 15.1679C111.895 14.6942 112.263 14.2731 112.684 13.9573C113.211 13.5889 113.895 13.4837 114.526 13.6416L114.842 13.7468C115.158 13.8521 115.421 13.9047 115.684 13.9047C116.053 13.9573 116.368 13.7994 116.632 13.5363C116.947 13.2731 117.053 12.9047 117.053 12.3784C117.053 12.01 116.842 11.6416 116.526 11.3784Z" fill="#000427"></path><path d="M31.2881 7.10695C30.4887 3.95941 28.0406 1.51132 24.8931 0.711944C18.9977 -0.237315 13.0023 -0.237315 7.10695 0.711944C3.95941 1.51132 1.51132 3.95941 0.711944 7.10695C-0.237315 13.0023 -0.237315 18.9977 0.711944 24.8931C1.51132 28.0406 3.95941 30.4887 7.10695 31.2881C13.0023 32.2373 18.9977 32.2373 24.8931 31.2881C28.0406 30.4887 30.4887 28.0406 31.2881 24.8931C32.2373 18.9977 32.2373 13.0023 31.2881 7.10695Z" fill="#066FD1"></path><path d="M10.0186 22.452C12.2477 21.065 14.13 19.1827 15.517 17.0031C15.9628 16.3096 15.9628 15.3684 15.517 14.6749C14.0805 12.4954 12.2477 10.6625 10.0186 9.27555C8.92878 8.58205 7.49225 8.97834 6.79875 10.0681C6.74922 10.0681 6.74922 10.1177 6.74922 10.1177C6.44515 10.6427 6.36306 11.2674 6.52113 11.8532C6.67921 12.439 7.06439 12.9376 7.59132 13.2384C8.73064 13.9814 9.72135 14.8235 10.613 15.8638C9.77089 16.904 8.73064 17.7957 7.59132 18.4892C6.84829 18.8855 6.40247 19.678 6.40247 20.5201C6.44817 21.3569 6.9275 22.1091 7.66667 22.504C8.40585 22.8989 9.29757 22.8792 10.0186 22.452Z" fill="white"></path><path d="M17.7461 21.8081H23.3932C24.4334 21.8081 25.2755 21.3127 25.2755 20.322C25.2755 19.3313 24.4334 18.8359 23.3932 18.8359H17.7461C16.7059 18.8359 15.8638 19.3313 15.8638 20.322C15.8638 21.3127 16.7059 21.8081 17.7461 21.8081Z" fill="white"></path></svg></a></div><nav><style data-emotion="css qmhqz9">.css-qmhqz9{list-style:none;width:100%;padding-left:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}</style><ul class="css-qmhqz9 e1wh78ri3"><style data-emotion="css why3vc">.css-why3vc{font-size:15px;width:100%;-webkit-transition:all 200ms ease-in-out;transition:all 200ms ease-in-out;padding:0 20px;cursor:pointer;}.css-why3vc a,.css-why3vc span{display:block;font-size:15px;color:#6C6C80;background-color:#FFFFFF;padding:4px 10px;margin:4px 0;border-radius:4px;font-weight:normal;-webkit-text-decoration:none;text-decoration:none;width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:pointer;margin:0 auto;-webkit-transition:all 0.2s ease;transition:all 0.2s ease;}.css-why3vc a svg,.css-why3vc span svg{width:20px;height:20px;margin-right:10px;}.css-why3vc a:not(.active-link):hover,.css-why3vc span:not(.active-link):hover{color:#8257E6;}.css-why3vc a.active-link,.css-why3vc span.active-link{color:#8257E6;background-color:#F2F2FA;}@media (max-width: 780px){.css-why3vc a.active-link,.css-why3vc span.active-link{background:#F2F2FA;}}</style><li class="css-why3vc e1wh78ri1"><a href="/">Introduction</a></li><li class="css-why3vc e1wh78ri1"><a href="/getting-started/">Getting started</a></li><style data-emotion="css mximbs">.css-mximbs{padding-left:30px;width:100%;text-transform:uppercase;font-size:14px;font-weight:bold;margin-top:20px;color:#3D3D4D;letter-spacing:0.142em;}</style><li class="css-mximbs e1wh78ri2">Components</li><style data-emotion="css 1cgn8l4">.css-1cgn8l4{list-style:none;width:100%;padding-left:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin:5px 0 0 0;}</style><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/components/typography/">Typography</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/cards/">Cards</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/hr/">Horizontal Rule</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/alerts/">Alerts</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/avatar/">Avatars</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/badges/">Badges</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/buttons/">Buttons</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/dropdown/">Dropdowns</a></li></ul><li class="css-mximbs e1wh78ri2">Utilities</li><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/utilities/colors/">Colors</a></li><li class="css-why3vc e1wh78ri1"><a href="/utilities/margins/">Margins</a></li></ul><li class="css-mximbs e1wh78ri2">More</li><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/todo/">To do list</a></li></ul></ul></nav></aside><style data-emotion="css u8hwp7">.css-u8hwp7{height:100%;padding-top:36px;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;position:relative;}@media (max-width: 1200px){.css-u8hwp7{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}}@media (max-width: 780px){.css-u8hwp7{padding-top:0;}}</style><main class="css-u8hwp7 eees1d51"><style data-emotion="css 1p24zom">.css-1p24zom{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:40px;margin-bottom:24px;}.css-1p24zom h2{margin:0;border:none;padding:0;font-size:18px;}@media (max-width: 359px){.css-1p24zom h2{font-size:14px;}}.css-1p24zom button{border:none;background:none;cursor:pointer;margin-right:16px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media (min-width: 780px){.css-1p24zom{display:none;}}</style><header class="css-1p24zom esnpb7p0"><button aria-label="Open sidebar" type="button"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" aria-hidden="true" height="23" width="23" xmlns="http://www.w3.org/2000/svg"><path d="M32 96v64h448V96H32zm0 128v64h448v-64H32zm0 128v64h448v-64H32z"></path></svg></button><h2>Tabler React 2 Docs</h2></header><style data-emotion="css 1j7nlw4">.css-1j7nlw4{display:none;}@media (max-width: 1200px){.css-1j7nlw4{display:block;}}</style><h1 class="css-1j7nlw4">Page not found!</h1><style data-emotion="css 1h97cat">.css-1h97cat{width:100%;max-width:calc(75% - 64px);padding-right:64px;}@media (max-width: 1200px){.css-1h97cat{max-width:100%;padding-right:0;-webkit-order:3;-ms-flex-order:3;order:3;}}.css-1h97cat h1,.css-1h97cat h2,.css-1h97cat h3,.css-1h97cat h4,.css-1h97cat h5,.css-1h97cat h6{overflow-wrap:break-word;}</style><div class="css-1h97cat eees1d50"><style data-emotion="css 1fdmakl">@media (max-width: 1200px){.css-1fdmakl{display:none;}}</style><h1 class="css-1fdmakl">Page not found!</h1><p>You just hit a route that doesn&#x27;t exist... the sadness.</p><p>If you&#x27;d like to go back to homepage, <a href="/">click here</a>.</p></div><style data-emotion="css 106zi9a">.css-106zi9a{position:-webkit-sticky;position:sticky;top:0;-webkit-order:2;-ms-flex-order:2;order:2;padding-top:72px;max-height:calc(100vh - 72px);overflow-y:auto;overflow-x:hidden;width:100%;max-width:200px;}@media (max-width: 1200px){.css-106zi9a{position:relative;top:auto;-webkit-order:0;-ms-flex-order:0;order:0;max-width:100%;margin-left:0;padding-top:0;}}</style><div class="css-106zi9a e10o0eax1"></div></main></div></div><div id="gatsby-announcer" style="position:absolute;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0" aria-live="assertive" aria-atomic="true"></div></div><script id="gatsby-script-loader">/*<![CDATA[*/window.pagePath="/404.html";/*]]>*/</script><!-- slice-start id="_gatsby-scripts-1" -->
67
+ );}}</style><aside class="css-9tjo13 e1wh78ri5"><style data-emotion="css 2yrou">.css-2yrou{width:100%;}.css-2yrou a{width:100%;padding-left:30px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}</style><div class="css-2yrou e1wh78ri4"><a aria-label="Go to home page" href="/"><svg width="120" height="32" viewBox="0 0 120 32" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><path d="M78.2632 10.9573C79.4211 10.9573 80.4737 11.2731 81.4211 11.8521C82.3684 12.4837 83.1579 13.3258 83.6316 14.3258C84.2105 15.431 84.4737 16.6942 84.4737 17.9573C84.4737 19.3258 84.2105 20.4837 83.6842 21.5889C83.2105 22.5889 82.4211 23.4837 81.4737 24.1152C80.5263 24.6942 79.4737 25.01 78.3684 25.01C77.5789 25.01 76.7895 24.8521 76.1053 24.5363C75.4211 24.2205 74.8421 23.8521 74.3158 23.3258V23.4837C74.3158 23.9047 74.1579 24.2731 73.8947 24.5889C73.6316 24.9047 73.2632 25.01 72.7895 25.01C72 25.01 71.3158 24.3784 71.2632 23.5889V7.53629C71.2632 7.11524 71.4211 6.74682 71.6842 6.43103C71.9474 6.11524 72.3684 5.95734 72.7895 6.00997C73.2105 6.00997 73.5789 6.16787 73.8947 6.43103C74.1579 6.74682 74.3158 7.11524 74.3158 7.53629V12.7994C74.7895 12.2205 75.3684 11.7994 76 11.4837C76.6842 11.1152 77.4737 10.9573 78.2632 10.9573ZM51.7368 21.8521C51.9474 21.8521 52.2105 21.9573 52.3684 22.1679C52.5789 22.3784 52.6842 22.6942 52.6842 23.0626C52.6842 23.5363 52.4211 23.9047 51.9474 24.2205C51.4737 24.5363 50.8947 24.6942 50.2632 24.6942C49.3158 24.7468 48.4211 24.4837 47.6316 24.01C46.8947 23.5889 46.5789 22.5889 46.5789 21.1679V14.2205H45.4211C44.6842 14.2731 44.0526 13.6416 44 12.9047V12.7994C44 12.431 44.1579 12.0626 44.4211 11.7994C44.6842 11.5363 45.0526 11.431 45.4211 11.431H46.5789V9.79945C46.5789 9.37839 46.7368 9.00997 47 8.69418C47.2632 8.37839 47.6842 8.2205 48.1053 8.27313C48.5263 8.27313 48.8947 8.43103 49.1579 8.69418C49.4211 9.00997 49.5789 9.37839 49.5789 9.79945V11.431H51.3684C52.1053 11.3784 52.7368 12.01 52.7895 12.7468V12.8521C52.7895 13.5889 52.1579 14.2205 51.4211 14.2205H49.5789V21.0626C49.5789 21.431 49.6842 21.6942 49.8421 21.8521C50.0526 22.01 50.2632 22.1152 50.5789 22.1152C50.6873 22.1152 50.7956 22.0905 50.938 22.0579C51.0031 22.043 51.0753 22.0265 51.1579 22.01C51.3684 21.9047 51.5263 21.8521 51.7368 21.8521ZM66.4737 10.9573C67.2632 10.9573 67.9474 11.5889 68 12.3784V23.1679C68 23.5889 67.8421 23.9573 67.5789 24.2731C67.3158 24.5889 66.9474 24.6942 66.4737 24.6942C66.0526 24.6942 65.6842 24.5363 65.4211 24.2731C65.1579 23.9573 65 23.5889 65 23.1679C64.5263 23.6942 63.9474 24.1152 63.3158 24.431C62.6316 24.7468 61.8421 24.9573 61.0526 24.9573C59.8947 24.9573 58.8421 24.6416 57.8947 24.0626C56.9474 23.431 56.1579 22.5889 55.6842 21.5889C55.1157 20.4637 54.8268 19.218 54.8421 17.9573C54.8421 16.5889 55.1053 15.431 55.6316 14.3258C56.1053 13.3258 56.8947 12.431 57.8421 11.7994C58.7895 11.2205 59.8421 10.9047 60.9474 10.9047C62.4737 10.9047 63.8947 11.431 65 12.4837C65 12.0626 65.1579 11.6942 65.4211 11.3784C65.6842 11.0626 66.0526 10.9047 66.4737 10.9573ZM64.0526 20.9573C64.7386 20.1085 65.1105 19.0487 65.1053 17.9573C65.1053 16.7468 64.7368 15.7468 64.0526 14.9047C63.396 14.1043 62.4031 13.6565 61.3684 13.6942C60.2632 13.6942 59.4211 14.1152 58.7368 14.9047C58.0526 15.7468 57.6842 16.8521 57.6842 17.9573C57.6842 19.1679 58.0526 20.1679 58.6842 20.9573C59.3684 21.7468 60.3684 22.2205 61.3684 22.1679C62.4737 22.1679 63.3684 21.7468 64.0526 20.9573ZM80.5263 20.9573C81.2105 20.1152 81.5789 19.01 81.5789 17.9047C81.5789 16.6942 81.2632 15.6942 80.5789 14.9047C79.9139 14.1152 78.9267 13.67 77.8947 13.6942C76.7895 13.6942 75.8947 14.1152 75.2105 14.9047C74.532 15.7577 74.1611 16.8147 74.1579 17.9047C74.1579 19.1152 74.4737 20.1152 75.2105 20.9573C75.8947 21.7468 76.8947 22.2205 77.8947 22.1679C79 22.1679 79.8421 21.7468 80.5263 20.9573ZM90.3158 23.1679C90.3158 23.5889 90.1579 23.9573 89.8947 24.2731C89.6316 24.5889 89.2105 24.6942 88.7895 24.6942C88.3684 24.6942 88 24.5363 87.7368 24.2731C87.4737 23.9573 87.3158 23.5889 87.3158 23.1679V7.53629C87.3158 7.11524 87.4737 6.74682 87.7368 6.43103C88.0526 6.11524 88.4211 5.95734 88.8421 6.00997C89.2632 6.00997 89.6316 6.16787 89.8947 6.43103C90.2105 6.74682 90.3158 7.11524 90.3158 7.53629V23.1679ZM105.263 18.6416C105.579 18.3784 105.737 18.0626 105.737 17.6416C105.737 15.2731 104.474 13.0626 102.632 11.7994C101.632 11.2205 100.579 10.9047 99.4737 10.9047C98.3158 10.9047 97.2632 11.2205 96.2632 11.7994C95.2105 12.431 94.4211 13.2731 93.8421 14.3258C93.2632 15.3784 92.9474 16.6416 92.9474 18.1152C92.8947 19.3784 93.2105 20.5889 93.7895 21.6416C94.3684 22.6416 95.1579 23.4837 96.2105 24.0626C97.2632 24.6416 98.4737 24.9573 99.8947 24.9573C100.737 24.9573 101.526 24.7994 102.316 24.5363C103.105 24.2731 103.737 23.9047 104.211 23.5363C104.684 23.2205 104.895 22.7994 104.895 22.3258C104.895 21.9573 104.789 21.6942 104.526 21.431C104.263 21.1679 104 21.0626 103.632 21.0626C103.368 21.0626 103.053 21.1152 102.789 21.2731L102.316 21.5363C102 21.7468 101.684 21.8521 101.368 21.9573C100.947 22.1152 100.421 22.1679 99.7368 22.1679C97.8421 22.2205 96.2105 20.8521 95.8947 19.01H104.211C104.632 19.01 104.947 18.9047 105.263 18.6416ZM99.3158 13.6942C100.105 13.6942 100.842 13.9573 101.421 14.431C102 14.9047 102.421 15.5363 102.474 16.2731V16.431H95.8421C96.2105 14.5889 97.3684 13.6942 99.3158 13.6942ZM116.526 11.3784C116.211 11.1152 115.789 10.9573 115.263 10.9573C114.474 10.9573 113.684 11.1152 113 11.4837C112.263 11.8521 111.684 12.3784 111.316 13.0626V12.7468C111.316 12.3258 111.211 11.9573 110.895 11.6416C110.579 11.3784 110.211 11.2205 109.789 11.2205C109.368 11.1679 108.947 11.3258 108.684 11.6416C108.421 11.9573 108.263 12.3258 108.263 12.7468V23.1152C108.263 23.5363 108.421 23.9047 108.684 24.2205C109 24.4837 109.316 24.6416 109.789 24.6416C110.263 24.6416 110.632 24.5363 110.895 24.2205C111.158 23.9047 111.316 23.5363 111.316 23.1152V17.1152C111.263 16.431 111.421 15.7994 111.684 15.1679C111.895 14.6942 112.263 14.2731 112.684 13.9573C113.211 13.5889 113.895 13.4837 114.526 13.6416L114.842 13.7468C115.158 13.8521 115.421 13.9047 115.684 13.9047C116.053 13.9573 116.368 13.7994 116.632 13.5363C116.947 13.2731 117.053 12.9047 117.053 12.3784C117.053 12.01 116.842 11.6416 116.526 11.3784Z" fill="#000427"></path><path d="M31.2881 7.10695C30.4887 3.95941 28.0406 1.51132 24.8931 0.711944C18.9977 -0.237315 13.0023 -0.237315 7.10695 0.711944C3.95941 1.51132 1.51132 3.95941 0.711944 7.10695C-0.237315 13.0023 -0.237315 18.9977 0.711944 24.8931C1.51132 28.0406 3.95941 30.4887 7.10695 31.2881C13.0023 32.2373 18.9977 32.2373 24.8931 31.2881C28.0406 30.4887 30.4887 28.0406 31.2881 24.8931C32.2373 18.9977 32.2373 13.0023 31.2881 7.10695Z" fill="#066FD1"></path><path d="M10.0186 22.452C12.2477 21.065 14.13 19.1827 15.517 17.0031C15.9628 16.3096 15.9628 15.3684 15.517 14.6749C14.0805 12.4954 12.2477 10.6625 10.0186 9.27555C8.92878 8.58205 7.49225 8.97834 6.79875 10.0681C6.74922 10.0681 6.74922 10.1177 6.74922 10.1177C6.44515 10.6427 6.36306 11.2674 6.52113 11.8532C6.67921 12.439 7.06439 12.9376 7.59132 13.2384C8.73064 13.9814 9.72135 14.8235 10.613 15.8638C9.77089 16.904 8.73064 17.7957 7.59132 18.4892C6.84829 18.8855 6.40247 19.678 6.40247 20.5201C6.44817 21.3569 6.9275 22.1091 7.66667 22.504C8.40585 22.8989 9.29757 22.8792 10.0186 22.452Z" fill="white"></path><path d="M17.7461 21.8081H23.3932C24.4334 21.8081 25.2755 21.3127 25.2755 20.322C25.2755 19.3313 24.4334 18.8359 23.3932 18.8359H17.7461C16.7059 18.8359 15.8638 19.3313 15.8638 20.322C15.8638 21.3127 16.7059 21.8081 17.7461 21.8081Z" fill="white"></path></svg><div>
68
+ <style>
69
+ main a:not(section a):not(nav a) {
70
+ color: #066fd1!important;
71
+ text-decoration: underline!important;
72
+ }
73
+ main a:not(section a):not(nav a) code {
74
+ text-decoration: underline!important;
75
+ }
76
+ html {
77
+ scroll-behavior: smooth;
78
+ }
79
+ blockquote>p {
80
+ background-color:rgba(6, 111, 209, 0.08)!important;
81
+ border-left: 4px solid #066fd1!important;
82
+ }
83
+ blockquote>p p {
84
+ background-color: unset!important;
85
+ padding: 0!important;
86
+ padding-bottom: 1rem!important;
87
+ }
88
+ blockquote>p strong {
89
+ color: #066fd1!important;
90
+ }
91
+ </style>
92
+ </div></a></div><nav><style data-emotion="css qmhqz9">.css-qmhqz9{list-style:none;width:100%;padding-left:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}</style><ul class="css-qmhqz9 e1wh78ri3"><style data-emotion="css why3vc">.css-why3vc{font-size:15px;width:100%;-webkit-transition:all 200ms ease-in-out;transition:all 200ms ease-in-out;padding:0 20px;cursor:pointer;}.css-why3vc a,.css-why3vc span{display:block;font-size:15px;color:#6C6C80;background-color:#FFFFFF;padding:4px 10px;margin:4px 0;border-radius:4px;font-weight:normal;-webkit-text-decoration:none;text-decoration:none;width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:pointer;margin:0 auto;-webkit-transition:all 0.2s ease;transition:all 0.2s ease;}.css-why3vc a svg,.css-why3vc span svg{width:20px;height:20px;margin-right:10px;}.css-why3vc a:not(.active-link):hover,.css-why3vc span:not(.active-link):hover{color:#8257E6;}.css-why3vc a.active-link,.css-why3vc span.active-link{color:#8257E6;background-color:#F2F2FA;}@media (max-width: 780px){.css-why3vc a.active-link,.css-why3vc span.active-link{background:#F2F2FA;}}</style><li class="css-why3vc e1wh78ri1"><a href="/">Introduction</a></li><li class="css-why3vc e1wh78ri1"><a href="/getting-started/">Getting started</a></li><style data-emotion="css mximbs">.css-mximbs{padding-left:30px;width:100%;text-transform:uppercase;font-size:14px;font-weight:bold;margin-top:20px;color:#3D3D4D;letter-spacing:0.142em;}</style><li class="css-mximbs e1wh78ri2">Components</li><style data-emotion="css 1cgn8l4">.css-1cgn8l4{list-style:none;width:100%;padding-left:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin:5px 0 0 0;}</style><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/components/typography/">Typography</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/cards/">Cards</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/hr/">Horizontal Rule</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/alerts/">Alerts</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/avatar/">Avatars</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/badges/">Badges</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/buttons/">Buttons</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/dropdown/">Dropdown</a></li><li class="css-why3vc e1wh78ri1"><a href="/components/dropdown-input/">Dropdown Input</a></li></ul><li class="css-mximbs e1wh78ri2">Utilities</li><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/utilities/colors/">Colors</a></li><li class="css-why3vc e1wh78ri1"><a href="/utilities/margins/">Margins</a></li></ul><li class="css-mximbs e1wh78ri2">More</li><ul class="css-1cgn8l4 e1wh78ri0"><li class="css-why3vc e1wh78ri1"><a href="/todo/">To do list</a></li></ul></ul></nav></aside><style data-emotion="css u8hwp7">.css-u8hwp7{height:100%;padding-top:36px;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;position:relative;}@media (max-width: 1200px){.css-u8hwp7{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}}@media (max-width: 780px){.css-u8hwp7{padding-top:0;}}</style><main class="css-u8hwp7 eees1d51"><style data-emotion="css 1p24zom">.css-1p24zom{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:40px;margin-bottom:24px;}.css-1p24zom h2{margin:0;border:none;padding:0;font-size:18px;}@media (max-width: 359px){.css-1p24zom h2{font-size:14px;}}.css-1p24zom button{border:none;background:none;cursor:pointer;margin-right:16px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media (min-width: 780px){.css-1p24zom{display:none;}}</style><header class="css-1p24zom esnpb7p0"><button aria-label="Open sidebar" type="button"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" aria-hidden="true" height="23" width="23" xmlns="http://www.w3.org/2000/svg"><path d="M32 96v64h448V96H32zm0 128v64h448v-64H32zm0 128v64h448v-64H32z"></path></svg></button><h2>Tabler React 2 Docs</h2></header><style data-emotion="css 1j7nlw4">.css-1j7nlw4{display:none;}@media (max-width: 1200px){.css-1j7nlw4{display:block;}}</style><h1 class="css-1j7nlw4">Page not found!</h1><style data-emotion="css 1h97cat">.css-1h97cat{width:100%;max-width:calc(75% - 64px);padding-right:64px;}@media (max-width: 1200px){.css-1h97cat{max-width:100%;padding-right:0;-webkit-order:3;-ms-flex-order:3;order:3;}}.css-1h97cat h1,.css-1h97cat h2,.css-1h97cat h3,.css-1h97cat h4,.css-1h97cat h5,.css-1h97cat h6{overflow-wrap:break-word;}</style><div class="css-1h97cat eees1d50"><style data-emotion="css 1fdmakl">@media (max-width: 1200px){.css-1fdmakl{display:none;}}</style><h1 class="css-1fdmakl">Page not found!</h1><p>You just hit a route that doesn&#x27;t exist... the sadness.</p><p>If you&#x27;d like to go back to homepage, <a href="/">click here</a>.</p></div><style data-emotion="css 106zi9a">.css-106zi9a{position:-webkit-sticky;position:sticky;top:0;-webkit-order:2;-ms-flex-order:2;order:2;padding-top:72px;max-height:calc(100vh - 72px);overflow-y:auto;overflow-x:hidden;width:100%;max-width:200px;}@media (max-width: 1200px){.css-106zi9a{position:relative;top:auto;-webkit-order:0;-ms-flex-order:0;order:0;max-width:100%;margin-left:0;padding-top:0;}}</style><div class="css-106zi9a e10o0eax1"></div></main></div></div><div id="gatsby-announcer" style="position:absolute;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0" aria-live="assertive" aria-atomic="true"></div></div><script id="gatsby-script-loader">/*<![CDATA[*/window.pagePath="/404.html";/*]]>*/</script><!-- slice-start id="_gatsby-scripts-1" -->
68
93
  <script
69
94
  id="gatsby-chunk-mapping"
70
95
  >
71
- window.___chunkMapping="{\"app\":[\"/app-1ecd51cf2b5ceab2a3fd.js\"],\"component---cache-caches-gatsby-plugin-offline-app-shell-js\":[\"/component---cache-caches-gatsby-plugin-offline-app-shell-js-a92b01a914bf7250611d.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-alerts-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-alerts-mdx-23ff7b1e278fa0bf73a9.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-avatar-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-avatar-mdx-1b09f3e73d6a16322dc6.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-badges-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-badges-mdx-50aa321477b71e498a65.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-buttons-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-buttons-mdx-4f32426e35802d85bcd4.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-cards-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-cards-mdx-4b597b8778c92e462990.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-mdx-7f2033be6f9ea53d5b77.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-hr-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-hr-mdx-3e0e30684aa2ade2a4aa.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-typography-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-typography-mdx-135a0ced9d62e55bd56a.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-faq-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-faq-mdx-efb5bdd15d83268422e6.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-getting-started-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-getting-started-mdx-acc2e0cfab89ea7e9d12.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-todo-md\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-todo-md-4a75674d05b1fa999d30.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-colors-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-colors-mdx-3a6dc0f3815386265abb.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-margins-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-margins-mdx-f0ec237cf90904c24e33.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-homepage-query-js-content-file-path-src-home-index-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-homepage-query-js-content-file-path-src-home-index-mdx-944d7b2c3ca472c24e78.js\"],\"component---src-pages-404-js\":[\"/component---src-pages-404-js-d8f42bed124f0abce764.js\"]}";
96
+ window.___chunkMapping="{\"app\":[\"/app-d61e1c7b50762c49d313.js\"],\"component---cache-caches-gatsby-plugin-offline-app-shell-js\":[\"/component---cache-caches-gatsby-plugin-offline-app-shell-js-a92b01a914bf7250611d.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-alerts-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-alerts-mdx-23ff7b1e278fa0bf73a9.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-avatar-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-avatar-mdx-1b09f3e73d6a16322dc6.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-badges-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-badges-mdx-50aa321477b71e498a65.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-buttons-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-buttons-mdx-4f32426e35802d85bcd4.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-cards-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-cards-mdx-033bf6626c64caa0fd31.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-input-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-input-mdx-14afd07baa693163cd95.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-dropdown-mdx-69cfd409ce468da592cf.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-hr-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-hr-mdx-3e0e30684aa2ade2a4aa.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-typography-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-components-typography-mdx-6c8c5413b8d65e5a0e3a.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-faq-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-faq-mdx-efb5bdd15d83268422e6.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-getting-started-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-getting-started-mdx-acc2e0cfab89ea7e9d12.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-todo-md\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-todo-md-4a75674d05b1fa999d30.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-colors-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-colors-mdx-3a6dc0f3815386265abb.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-margins-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js-content-file-path-src-docs-utilities-margins-mdx-f0ec237cf90904c24e33.js\"],\"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-homepage-query-js-content-file-path-src-home-index-mdx\":[\"/component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-homepage-query-js-content-file-path-src-home-index-mdx-944d7b2c3ca472c24e78.js\"],\"component---src-pages-404-js\":[\"/component---src-pages-404-js-d8f42bed124f0abce764.js\"]}";
72
97
  </script>
73
- <script>window.___webpackCompilationHash="986351a7385188069906";</script><script src="/webpack-runtime-e087b17efa58b03ae513.js" async></script><script src="/framework-c8b57e0b7ea450f0f3f9.js" async></script><script src="/app-1ecd51cf2b5ceab2a3fd.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>
98
+ <script>window.___webpackCompilationHash="c4764ef249680e096e32";</script><script src="/webpack-runtime-9a0f4fdd5a171a24255d.js" async></script><script src="/framework-c8b57e0b7ea450f0f3f9.js" async></script><script src="/app-d61e1c7b50762c49d313.js" async></script><!-- slice-end id="_gatsby-scripts-1" --></body></html>