triafly-ui-kit 1.0.24 → 1.0.25

package/dist/node_modules/react-paginate/dist/react-paginate.js

@@ -0,0 +1,259 @@
+import { __module as $ } from "../../../_virtual/react-paginate2.js";
+import le from "react";
+var ce = $.exports, ne;
+function de() {
+  return ne ? $.exports : (ne = 1, function(ie, pe) {
+    (function(ee, z) {
+      ie.exports = z(le);
+    })(ce, (ee) => (() => {
+      var z = { 703: (u, g, C) => {
+        var a = C(414);
+        function I() {
+        }
+        function J() {
+        }
+        J.resetWarningCache = I, u.exports = function() {
+          function v(te, E, F, M, re, K) {
+            if (K !== a) {
+              var W = new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");
+              throw W.name = "Invariant Violation", W;
+            }
+          }
+          function N() {
+            return v;
+          }
+          v.isRequired = v;
+          var q = { array: v, bigint: v, bool: v, func: v, number: v, object: v, string: v, symbol: v, any: v, arrayOf: N, element: v, elementType: v, instanceOf: N, node: v, objectOf: N, oneOf: N, oneOfType: N, shape: N, exact: N, checkPropTypes: J, resetWarningCache: I };
+          return q.PropTypes = q, q;
+        };
+      }, 697: (u, g, C) => {
+        u.exports = C(703)();
+      }, 414: (u) => {
+        u.exports = "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";
+      }, 98: (u) => {
+        u.exports = ee;
+      } }, ae = {};
+      function h(u) {
+        var g = ae[u];
+        if (g !== void 0) return g.exports;
+        var C = ae[u] = { exports: {} };
+        return z[u](C, C.exports, h), C.exports;
+      }
+      h.n = (u) => {
+        var g = u && u.__esModule ? () => u.default : () => u;
+        return h.d(g, { a: g }), g;
+      }, h.d = (u, g) => {
+        for (var C in g) h.o(g, C) && !h.o(u, C) && Object.defineProperty(u, C, { enumerable: !0, get: g[C] });
+      }, h.o = (u, g) => Object.prototype.hasOwnProperty.call(u, g), h.r = (u) => {
+        typeof Symbol < "u" && Symbol.toStringTag && Object.defineProperty(u, Symbol.toStringTag, { value: "Module" }), Object.defineProperty(u, "__esModule", { value: !0 });
+      };
+      var G = {};
+      return (() => {
+        h.r(G), h.d(G, { default: () => se });
+        var u = h(98), g = h.n(u), C = h(697), a = h.n(C);
+        function I() {
+          return I = Object.assign ? Object.assign.bind() : function(r) {
+            for (var i = 1; i < arguments.length; i++) {
+              var o = arguments[i];
+              for (var l in o) Object.prototype.hasOwnProperty.call(o, l) && (r[l] = o[l]);
+            }
+            return r;
+          }, I.apply(this, arguments);
+        }
+        var J = function(r) {
+          var i = r.pageClassName, o = r.pageLinkClassName, l = r.page, _ = r.selected, S = r.activeClassName, O = r.activeLinkClassName, t = r.getEventListener, e = r.pageSelectedHandler, p = r.href, n = r.extraAriaContext, s = r.pageLabelBuilder, c = r.rel, f = r.ariaLabel || "Page " + l + (n ? " " + n : ""), m = null;
+          return _ && (m = "page", f = r.ariaLabel || "Page " + l + " is your current page", i = i !== void 0 ? i + " " + S : S, o !== void 0 ? O !== void 0 && (o = o + " " + O) : o = O), g().createElement("li", { className: i }, g().createElement("a", I({ rel: c, role: p ? void 0 : "button", className: o, href: p, tabIndex: _ ? "-1" : "0", "aria-label": f, "aria-current": m, onKeyPress: e }, t(e)), s(l)));
+        };
+        J.propTypes = { pageSelectedHandler: a().func.isRequired, selected: a().bool.isRequired, pageClassName: a().string, pageLinkClassName: a().string, activeClassName: a().string, activeLinkClassName: a().string, extraAriaContext: a().string, href: a().string, ariaLabel: a().string, page: a().number.isRequired, getEventListener: a().func.isRequired, pageLabelBuilder: a().func.isRequired, rel: a().string };
+        const v = J;
+        function N() {
+          return N = Object.assign ? Object.assign.bind() : function(r) {
+            for (var i = 1; i < arguments.length; i++) {
+              var o = arguments[i];
+              for (var l in o) Object.prototype.hasOwnProperty.call(o, l) && (r[l] = o[l]);
+            }
+            return r;
+          }, N.apply(this, arguments);
+        }
+        var q = function(r) {
+          var i = r.breakLabel, o = r.breakAriaLabel, l = r.breakClassName, _ = r.breakLinkClassName, S = r.breakHandler, O = r.getEventListener, t = l || "break";
+          return g().createElement("li", { className: t }, g().createElement("a", N({ className: _, role: "button", tabIndex: "0", "aria-label": o, onKeyPress: S }, O(S)), i));
+        };
+        q.propTypes = { breakLabel: a().oneOfType([a().string, a().node]), breakAriaLabel: a().string, breakClassName: a().string, breakLinkClassName: a().string, breakHandler: a().func.isRequired, getEventListener: a().func.isRequired };
+        const te = q;
+        function E(r) {
+          var i = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "";
+          return r ?? i;
+        }
+        function F(r) {
+          return F = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(i) {
+            return typeof i;
+          } : function(i) {
+            return i && typeof Symbol == "function" && i.constructor === Symbol && i !== Symbol.prototype ? "symbol" : typeof i;
+          }, F(r);
+        }
+        function M() {
+          return M = Object.assign ? Object.assign.bind() : function(r) {
+            for (var i = 1; i < arguments.length; i++) {
+              var o = arguments[i];
+              for (var l in o) Object.prototype.hasOwnProperty.call(o, l) && (r[l] = o[l]);
+            }
+            return r;
+          }, M.apply(this, arguments);
+        }
+        function re(r, i) {
+          for (var o = 0; o < i.length; o++) {
+            var l = i[o];
+            l.enumerable = l.enumerable || !1, l.configurable = !0, "value" in l && (l.writable = !0), Object.defineProperty(r, l.key, l);
+          }
+        }
+        function K(r, i) {
+          return K = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(o, l) {
+            return o.__proto__ = l, o;
+          }, K(r, i);
+        }
+        function W(r, i) {
+          if (i && (F(i) === "object" || typeof i == "function")) return i;
+          if (i !== void 0) throw new TypeError("Derived constructors may only return object or undefined");
+          return k(r);
+        }
+        function k(r) {
+          if (r === void 0) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+          return r;
+        }
+        function Z(r) {
+          return Z = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(i) {
+            return i.__proto__ || Object.getPrototypeOf(i);
+          }, Z(r);
+        }
+        function y(r, i, o) {
+          return i in r ? Object.defineProperty(r, i, { value: o, enumerable: !0, configurable: !0, writable: !0 }) : r[i] = o, r;
+        }
+        var Q = function(r) {
+          (function(t, e) {
+            if (typeof e != "function" && e !== null) throw new TypeError("Super expression must either be null or a function");
+            t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && K(t, e);
+          })(O, r);
+          var i, o, l, _, S = (l = O, _ = function() {
+            if (typeof Reflect > "u" || !Reflect.construct || Reflect.construct.sham) return !1;
+            if (typeof Proxy == "function") return !0;
+            try {
+              return Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {
+              })), !0;
+            } catch {
+              return !1;
+            }
+          }(), function() {
+            var t, e = Z(l);
+            if (_) {
+              var p = Z(this).constructor;
+              t = Reflect.construct(e, arguments, p);
+            } else t = e.apply(this, arguments);
+            return W(this, t);
+          });
+          function O(t) {
+            var e, p;
+            return function(n, s) {
+              if (!(n instanceof s)) throw new TypeError("Cannot call a class as a function");
+            }(this, O), y(k(e = S.call(this, t)), "handlePreviousPage", function(n) {
+              var s = e.state.selected;
+              e.handleClick(n, null, s > 0 ? s - 1 : void 0, { isPrevious: !0 });
+            }), y(k(e), "handleNextPage", function(n) {
+              var s = e.state.selected, c = e.props.pageCount;
+              e.handleClick(n, null, s < c - 1 ? s + 1 : void 0, { isNext: !0 });
+            }), y(k(e), "handlePageSelected", function(n, s) {
+              if (e.state.selected === n) return e.callActiveCallback(n), void e.handleClick(s, null, void 0, { isActive: !0 });
+              e.handleClick(s, null, n);
+            }), y(k(e), "handlePageChange", function(n) {
+              e.state.selected !== n && (e.setState({ selected: n }), e.callCallback(n));
+            }), y(k(e), "getEventListener", function(n) {
+              return y({}, e.props.eventListener, n);
+            }), y(k(e), "handleClick", function(n, s, c) {
+              var f = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : {}, m = f.isPrevious, R = m !== void 0 && m, H = f.isNext, U = H !== void 0 && H, D = f.isBreak, x = D !== void 0 && D, w = f.isActive, A = w !== void 0 && w;
+              n.preventDefault ? n.preventDefault() : n.returnValue = !1;
+              var j = e.state.selected, d = e.props.onClick, L = c;
+              if (d) {
+                var P = d({ index: s, selected: j, nextSelectedPage: c, event: n, isPrevious: R, isNext: U, isBreak: x, isActive: A });
+                if (P === !1) return;
+                Number.isInteger(P) && (L = P);
+              }
+              L !== void 0 && e.handlePageChange(L);
+            }), y(k(e), "handleBreakClick", function(n, s) {
+              var c = e.state.selected;
+              e.handleClick(s, n, c < n ? e.getForwardJump() : e.getBackwardJump(), { isBreak: !0 });
+            }), y(k(e), "callCallback", function(n) {
+              e.props.onPageChange !== void 0 && typeof e.props.onPageChange == "function" && e.props.onPageChange({ selected: n });
+            }), y(k(e), "callActiveCallback", function(n) {
+              e.props.onPageActive !== void 0 && typeof e.props.onPageActive == "function" && e.props.onPageActive({ selected: n });
+            }), y(k(e), "getElementPageRel", function(n) {
+              var s = e.state.selected, c = e.props, f = c.nextPageRel, m = c.prevPageRel, R = c.selectedPageRel;
+              return s - 1 === n ? m : s === n ? R : s + 1 === n ? f : void 0;
+            }), y(k(e), "pagination", function() {
+              var n = [], s = e.props, c = s.pageRangeDisplayed, f = s.pageCount, m = s.marginPagesDisplayed, R = s.breakLabel, H = s.breakClassName, U = s.breakLinkClassName, D = s.breakAriaLabels, x = e.state.selected;
+              if (f <= c) for (var w = 0; w < f; w++) n.push(e.getPageElement(w));
+              else {
+                var A = c / 2, j = c - A;
+                x > f - c / 2 ? A = c - (j = f - x) : x < c / 2 && (j = c - (A = x));
+                var d, L, P = function(T) {
+                  return e.getPageElement(T);
+                }, b = [];
+                for (d = 0; d < f; d++) {
+                  var V = d + 1;
+                  if (V <= m) b.push({ type: "page", index: d, display: P(d) });
+                  else if (V > f - m) b.push({ type: "page", index: d, display: P(d) });
+                  else if (d >= x - A && d <= x + (x === 0 && c > 1 ? j - 1 : j)) b.push({ type: "page", index: d, display: P(d) });
+                  else if (R && b.length > 0 && b[b.length - 1].display !== L && (c > 0 || m > 0)) {
+                    var X = d < x ? D.backward : D.forward;
+                    L = g().createElement(te, { key: d, breakAriaLabel: X, breakLabel: R, breakClassName: H, breakLinkClassName: U, breakHandler: e.handleBreakClick.bind(null, d), getEventListener: e.getEventListener }), b.push({ type: "break", index: d, display: L });
+                  }
+                }
+                b.forEach(function(T, B) {
+                  var Y = T;
+                  T.type === "break" && b[B - 1] && b[B - 1].type === "page" && b[B + 1] && b[B + 1].type === "page" && b[B + 1].index - b[B - 1].index <= 2 && (Y = { type: "page", index: T.index, display: P(T.index) }), n.push(Y.display);
+                });
+              }
+              return n;
+            }), t.initialPage !== void 0 && t.forcePage !== void 0 && console.warn("(react-paginate): Both initialPage (".concat(t.initialPage, ") and forcePage (").concat(t.forcePage, ") props are provided, which is discouraged.") + ` Use exclusively forcePage prop for a controlled component.
+See https://reactjs.org/docs/forms.html#controlled-components`), p = t.initialPage ? t.initialPage : t.forcePage ? t.forcePage : 0, e.state = { selected: p }, e;
+          }
+          return i = O, (o = [{ key: "componentDidMount", value: function() {
+            var t = this.props, e = t.initialPage, p = t.disableInitialCallback, n = t.extraAriaContext, s = t.pageCount, c = t.forcePage;
+            e === void 0 || p || this.callCallback(e), n && console.warn("DEPRECATED (react-paginate): The extraAriaContext prop is deprecated. You should now use the ariaLabelBuilder instead."), Number.isInteger(s) || console.warn("(react-paginate): The pageCount prop value provided is not an integer (".concat(s, "). Did you forget a Math.ceil()?")), e !== void 0 && e > s - 1 && console.warn("(react-paginate): The initialPage prop provided is greater than the maximum page index from pageCount prop (".concat(e, " > ").concat(s - 1, ").")), c !== void 0 && c > s - 1 && console.warn("(react-paginate): The forcePage prop provided is greater than the maximum page index from pageCount prop (".concat(c, " > ").concat(s - 1, ")."));
+          } }, { key: "componentDidUpdate", value: function(t) {
+            this.props.forcePage !== void 0 && this.props.forcePage !== t.forcePage && (this.props.forcePage > this.props.pageCount - 1 && console.warn("(react-paginate): The forcePage prop provided is greater than the maximum page index from pageCount prop (".concat(this.props.forcePage, " > ").concat(this.props.pageCount - 1, ").")), this.setState({ selected: this.props.forcePage })), Number.isInteger(t.pageCount) && !Number.isInteger(this.props.pageCount) && console.warn("(react-paginate): The pageCount prop value provided is not an integer (".concat(this.props.pageCount, "). Did you forget a Math.ceil()?"));
+          } }, { key: "getForwardJump", value: function() {
+            var t = this.state.selected, e = this.props, p = e.pageCount, n = t + e.pageRangeDisplayed;
+            return n >= p ? p - 1 : n;
+          } }, { key: "getBackwardJump", value: function() {
+            var t = this.state.selected - this.props.pageRangeDisplayed;
+            return t < 0 ? 0 : t;
+          } }, { key: "getElementHref", value: function(t) {
+            var e = this.props, p = e.hrefBuilder, n = e.pageCount, s = e.hrefAllControls;
+            if (p) return s || t >= 0 && t < n ? p(t + 1, n, this.state.selected) : void 0;
+          } }, { key: "ariaLabelBuilder", value: function(t) {
+            var e = t === this.state.selected;
+            if (this.props.ariaLabelBuilder && t >= 0 && t < this.props.pageCount) {
+              var p = this.props.ariaLabelBuilder(t + 1, e);
+              return this.props.extraAriaContext && !e && (p = p + " " + this.props.extraAriaContext), p;
+            }
+          } }, { key: "getPageElement", value: function(t) {
+            var e = this.state.selected, p = this.props, n = p.pageClassName, s = p.pageLinkClassName, c = p.activeClassName, f = p.activeLinkClassName, m = p.extraAriaContext, R = p.pageLabelBuilder;
+            return g().createElement(v, { key: t, pageSelectedHandler: this.handlePageSelected.bind(null, t), selected: e === t, rel: this.getElementPageRel(t), pageClassName: n, pageLinkClassName: s, activeClassName: c, activeLinkClassName: f, extraAriaContext: m, href: this.getElementHref(t), ariaLabel: this.ariaLabelBuilder(t), page: t + 1, pageLabelBuilder: R, getEventListener: this.getEventListener });
+          } }, { key: "render", value: function() {
+            var t = this.props.renderOnZeroPageCount;
+            if (this.props.pageCount === 0 && t !== void 0) return t && t(this.props);
+            var e = this.props, p = e.disabledClassName, n = e.disabledLinkClassName, s = e.pageCount, c = e.className, f = e.containerClassName, m = e.previousLabel, R = e.previousClassName, H = e.previousLinkClassName, U = e.previousAriaLabel, D = e.prevRel, x = e.nextLabel, w = e.nextClassName, A = e.nextLinkClassName, j = e.nextAriaLabel, d = e.nextRel, L = this.state.selected, P = L === 0, b = L === s - 1, V = "".concat(E(R)).concat(P ? " ".concat(E(p)) : ""), X = "".concat(E(w)).concat(b ? " ".concat(E(p)) : ""), T = "".concat(E(H)).concat(P ? " ".concat(E(n)) : ""), B = "".concat(E(A)).concat(b ? " ".concat(E(n)) : ""), Y = P ? "true" : "false", oe = b ? "true" : "false";
+            return g().createElement("ul", { className: c || f, role: "navigation", "aria-label": "Pagination" }, g().createElement("li", { className: V }, g().createElement("a", M({ className: T, href: this.getElementHref(L - 1), tabIndex: P ? "-1" : "0", role: "button", onKeyPress: this.handlePreviousPage, "aria-disabled": Y, "aria-label": U, rel: D }, this.getEventListener(this.handlePreviousPage)), m)), this.pagination(), g().createElement("li", { className: X }, g().createElement("a", M({ className: B, href: this.getElementHref(L + 1), tabIndex: b ? "-1" : "0", role: "button", onKeyPress: this.handleNextPage, "aria-disabled": oe, "aria-label": j, rel: d }, this.getEventListener(this.handleNextPage)), x)));
+          } }]) && re(i.prototype, o), Object.defineProperty(i, "prototype", { writable: !1 }), O;
+        }(u.Component);
+        y(Q, "propTypes", { pageCount: a().number.isRequired, pageRangeDisplayed: a().number, marginPagesDisplayed: a().number, previousLabel: a().node, previousAriaLabel: a().string, prevPageRel: a().string, prevRel: a().string, nextLabel: a().node, nextAriaLabel: a().string, nextPageRel: a().string, nextRel: a().string, breakLabel: a().oneOfType([a().string, a().node]), breakAriaLabels: a().shape({ forward: a().string, backward: a().string }), hrefBuilder: a().func, hrefAllControls: a().bool, onPageChange: a().func, onPageActive: a().func, onClick: a().func, initialPage: a().number, forcePage: a().number, disableInitialCallback: a().bool, containerClassName: a().string, className: a().string, pageClassName: a().string, pageLinkClassName: a().string, pageLabelBuilder: a().func, activeClassName: a().string, activeLinkClassName: a().string, previousClassName: a().string, nextClassName: a().string, previousLinkClassName: a().string, nextLinkClassName: a().string, disabledClassName: a().string, disabledLinkClassName: a().string, breakClassName: a().string, breakLinkClassName: a().string, extraAriaContext: a().string, ariaLabelBuilder: a().func, eventListener: a().string, renderOnZeroPageCount: a().func, selectedPageRel: a().string }), y(Q, "defaultProps", { pageRangeDisplayed: 2, marginPagesDisplayed: 3, activeClassName: "selected", previousLabel: "Previous", previousClassName: "previous", previousAriaLabel: "Previous page", prevPageRel: "prev", prevRel: "prev", nextLabel: "Next", nextClassName: "next", nextAriaLabel: "Next page", nextPageRel: "next", nextRel: "next", breakLabel: "...", breakAriaLabels: { forward: "Jump forward", backward: "Jump backward" }, disabledClassName: "disabled", disableInitialCallback: !1, pageLabelBuilder: function(r) {
+          return r;
+        }, eventListener: "onClick", renderOnZeroPageCount: void 0, selectedPageRel: "canonical", hrefAllControls: !1 });
+        const se = Q;
+      })(), G;
+    })());
+  }($), $.exports);
+}
+export {
+  de as __require
+};

package/dist/src/components/Ui/Badge/Badge.module.scss.js

@@ -0,0 +1,30 @@
+import '../../../../assets/src/components/Ui/Badge/Badge.module.css';const _ = "_badge_mb34a_3", c = "_outline_mb34a_20", e = "_solid_mb34a_25", o = "_subtle_mb34a_30", s = "_done_mb34a_40", a = "_success_mb34a_41", n = "_warning_mb34a_46", t = "_error_mb34a_51", b = "_active_mb34a_56", l = "_blocked_mb34a_61", i = "_icon_mb34a_66", d = "_clickable_mb34a_73", m = {
+  badge: _,
+  outline: c,
+  solid: e,
+  subtle: o,
+  default: "_default_mb34a_35",
+  done: s,
+  success: a,
+  warning: n,
+  error: t,
+  active: b,
+  blocked: l,
+  icon: i,
+  clickable: d
+};
+export {
+  b as active,
+  _ as badge,
+  l as blocked,
+  d as clickable,
+  m as default,
+  s as done,
+  t as error,
+  i as icon,
+  c as outline,
+  e as solid,
+  o as subtle,
+  a as success,
+  n as warning
+};

package/dist/src/components/Ui/Skeleton/Skeleton.module.scss.js

@@ -0,0 +1,9 @@
+import '../../../../assets/src/components/Ui/Skeleton/Skeleton.module.css';const t = "_skeleton_yatxz_1", e = "_animated_yatxz_6", a = {
+  skeleton: t,
+  animated: e
+};
+export {
+  e as animated,
+  a as default,
+  t as skeleton
+};

package/dist/src/components/Ui/Tooltip/Tooltip.stories.module.css.js

@@ -0,0 +1,15 @@
+import '../../../../assets/src/components/Ui/Tooltip/Tooltip.stories.module.css';const i = "_container_x4z3a_1", o = "_trigger_x4z3a_27", t = "_clickTrigger_x4z3a_57 _trigger_x4z3a_27", n = "_positionsContainer_x4z3a_75", r = "_positionGroup_x4z3a_83", s = {
+  container: i,
+  trigger: o,
+  clickTrigger: t,
+  positionsContainer: n,
+  positionGroup: r
+};
+export {
+  t as clickTrigger,
+  i as container,
+  s as default,
+  r as positionGroup,
+  n as positionsContainer,
+  o as trigger
+};

package/dist/src/context/ToastContext/ToastContext.module.scss.js

@@ -0,0 +1,9 @@
+import '../../../assets/src/context/ToastContext/ToastContext.module.css';const s = "_Wrapper_12sk9_1", t = "_Toast_12sk9_11", a = {
+  Wrapper: s,
+  Toast: t
+};
+export {
+  t as Toast,
+  s as Wrapper,
+  a as default
+};

package/dist/styles/_mixins.scss

@@ -0,0 +1,22 @@
+@mixin wrapper($bg-color: var(--color-bg-island-default), $padding: 20px 24px 20px 24px) {
+    background-color: $bg-color;
+    padding: $padding;
+    border-radius: 16px;
+  }
+  
+  @mixin outlinedColorScheme ($borderColor, $textColor) { //NOTE: дублирование стилей UI-кита изза модулей?
+    background-color: transparent !important;
+    border: 1px solid $borderColor;
+    color: $textColor;
+    &[disabled] {
+        pointer-events: none;
+    }
+    &:hover {
+        background-color: transparent;
+        box-shadow: inset 0 0 0 1px $borderColor;
+    }
+  
+    svg * {
+        fill: $textColor;
+    }
+  }

package/dist/styles/fix.scss

@@ -0,0 +1,4 @@
+// Скрываем браузерный крестик в полях поиска
+input[type="search"]::-webkit-search-cancel-button {
+    display: none;
+}

package/dist/styles/main.scss

@@ -0,0 +1,27 @@
+@import "./reset.scss";
+@import "./variables.scss";
+@import "./fix.scss";
+@import './_mixins.scss';
+@import './typography.scss';
+
+// Пока не трогать, тестовая подсветка блоков
+// html {
+//     border: 4px solid red;
+//     padding: 1px;
+// }
+
+// body {
+//     border: 2px dashed;
+//     margin: 1px;
+// }
+
+// div {
+//     border: 1px dotted;
+//     margin: 1px;
+// }
+
+
+//layout.module.scss не позволяет дочерним компонентам наследовать стили почему то. Сделать нормальный
+.page-content {
+    border-radius: 16px;
+}

package/dist/styles/reset.scss

@@ -0,0 +1,106 @@
+* {
+    margin: 0;
+    padding: 0;
+    border: 0;
+  
+    /*color: #1a2026;*/
+  }
+  
+  *,
+  *::before,
+  *::after {
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+  }
+  
+  :focus,
+  :active {
+    outline: none;
+  }
+  
+  nav,
+  footer,
+  header,
+  aside {
+    display: block;
+  }
+  
+  html,
+  body {
+    width: 100%;
+    height: 100%;
+  
+    font-size: 100%;
+    font-size: 14px;
+    line-height: 1;
+    -ms-text-size-adjust: 100%;
+    -moz-text-size-adjust: 100%;
+    -webkit-text-size-adjust: 100%;
+  }
+  
+  input,
+  button,
+  textarea {
+    font-family: inherit;
+  }
+  
+  input::-ms-clear {
+    display: none;
+  }
+  
+  button {
+    cursor: pointer;
+  }
+  
+  button::-moz-focus-inner {
+    padding: 0;
+  
+    border: 0;
+  }
+  
+  a,
+  a:visited {
+    text-decoration: none;
+  }
+  
+  a:focus,
+  a:active {
+    outline: none;
+  }
+  
+  a:hover {
+    text-decoration: none;
+  }
+  
+  ul li {
+    list-style: none;
+  }
+  
+  img {
+    vertical-align: top;
+  }
+  
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    font-size: inherit;
+    font-weight: 400;
+  }
+  
+  #root {
+    background-color: var(--color-bg-island-default);
+  }
+  
+  .page-wrapper {
+    width: 100%;
+    max-width: 1920px;
+    min-height: 100vh;
+    margin: 0 auto;
+    display: flex;
+    flex-direction: column;
+    background-color: var(--color-bg-island-default);
+  }

package/dist/styles/typography.scss

@@ -0,0 +1,102 @@
+//Подключение шрифтов
+@font-face {
+  font-family: "Roboto Slab";
+  src: url("../assets/fonts/RobotoSlab-SemiBold.ttf") format("truetype");
+  font-weight: 600;
+}
+
+@font-face {
+  font-family: "Manrope";
+  src: url("../assets/fonts/Manrope-Regular.ttf") format("truetype");
+  font-weight: 400;
+}
+
+@font-face {
+  font-family: "Manrope";
+  src: url("../assets/fonts/Manrope-Semibold.ttf") format("truetype");
+  font-weight: 600;
+}
+
+@font-face {
+  font-family: "Manrope";
+  src: url("../assets/fonts/Manrope-Bold.ttf") format("truetype");
+  font-weight: 700;
+}
+
+@font-face {
+  font-family: "Fira Code";
+  src: url("../assets/fonts/FiraCode-Regular.ttf") format("truetype");
+  font-weight: 400;
+}
+
+//Глобальные свойства шрифтов
+* {
+  font-family: "Manrope", sans-serif;
+  font-size: 14px;
+  line-height: 1.2em;
+  letter-spacing: 0.02em;
+  font-weight: 400;
+  color: var(--color-text-primary-default);
+}
+
+//Заголовки
+
+//NOTE:
+//по макетам у нас 8 уровней заголовков, JSX понимает только шесть.
+//AI: Использовать уровни заголовков начиная с h1 в контексте страницы,
+//как это принято общей практикой вёрстки,
+//а для указания размеров и начертания использовать миксин.
+//В противном случае основными хедерами будут h4-h8 + варнинги JSX
+
+//Дефолтные значения font-size и font-weight = 14 и 400
+//При необходимости кастомизации текста в компоненте импортируется данные миксины
+//с указанием необходимых значений согласно макету
+//TODO: подготовить переменные для стандартизаии размеров
+
+//Акцидентная гарнитура для заголовков
+@mixin accidental($size, $margin) {
+  font-family: "Roboto Slab", sans-serif;
+  font-size: $size;
+  margin: 0 0 $margin 0;
+}
+
+//Гротескная гарнитура для заголовков и регулярного текста
+@mixin grotesque($size, $weight) {
+  font-size: $size;
+  font-weight: $weight;
+}
+
+//сброс дефолтных отступов в заголовках
+@for $i from 1 through 6 {
+  h#{$i} {
+    margin: 0;
+  }
+}
+
+//Ссылки
+a {
+  color: var(--color-text-brand-default);
+  text-decoration: none;
+  &:hover {
+    color: var(--color-text-brand-hover);
+  }
+  &[href=""] {
+    //стили неактивной ссылки
+    opacity: 40%;
+    cursor: default;
+    pointer-events: none;
+    //не совсем понятно зачем она нам
+    //+ линтер неадекватно реагирует на пустой href
+    //добавить .disabled с JS-логикой?
+  }
+}
+
+//Параграфы
+
+//TODO: недостаточно кейсов в моках, запросить для уточнения
+p {
+  // font-size: 12px;
+  &:not(:last-child) {
+    margin: 0 0 8px 0;
+  }
+}