@gympass/yoga 7.114.7 → 7.114.8

package/cjs/Divider/web/Divider.js

@@ -72,8 +72,9 @@ const StyledDivider = import_styled_components.default.hr`
       ${vertical ? "height: auto" : "width: 100%"};
       border-width: 0px;
       border-left-width: ${vertical ? borders.small : 0}px;
-      border-bottom-width: ${vertical ? 0 : borders.small}px;
+      border-top-width: ${vertical ? 0 : borders.small}px;
       border-color: ${colors.text.disabled};
+      border-style: solid;
     `;
 }}
 `;

package/cjs/NavigationMenu/web/Item/styles.js

@@ -73,7 +73,7 @@ const StyledTag = (0, import_styled_components.default)(import_Tag.default)`
     border-radius: ${border.radius.tag}px;
   `}
 `;
-const StyledText = (0, import_styled_components.default)(import_Text.default)`
+const StyledText = (0, import_styled_components.default)(import_Text.default.Body1)`
   ${({
   theme: {
     yoga: {

package/cjs/NavigationMenu/web/Menu/Menu.js

@@ -34,7 +34,7 @@ module.exports = __toCommonJS(Menu_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_styled_components = __toESM(require("styled-components"));
 var import_yoga_icons = require("@gympass/yoga-icons");
-var import_yoga = require("@gympass/yoga");
+var import_Text = __toESM(require("../../../Text"));
 var import_Icon = __toESM(require("../../../Icon"));
 const StyledMenu = import_styled_components.default.div`
   ${({
@@ -91,7 +91,7 @@ const StyledTextContainer = import_styled_components.default.div`
       overflow: hidden;
     `}
 `;
-const StyledTitle = (0, import_styled_components.default)(import_yoga.Text.H4)`
+const StyledTitle = (0, import_styled_components.default)(import_Text.default.Display4)`
   ${({
   theme: {
     yoga: {
@@ -110,7 +110,7 @@ const StyledTitle = (0, import_styled_components.default)(import_yoga.Text.H4)`
       overflow: hidden;
     `}
 `;
-const StyledSubtitle = (0, import_styled_components.default)(import_yoga.Text.Small)`
+const StyledSubtitle = (0, import_styled_components.default)(import_Text.default.Body2)`
   ${({
   theme: {
     yoga: {

package/cjs/NavigationMenu/web/Switcher/Switcher.js

@@ -60,6 +60,7 @@ module.exports = __toCommonJS(Switcher_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_styled_components = __toESM(require("styled-components"));
 var import_yoga = require("@gympass/yoga");
+var import_Text = __toESM(require("../../../Text"));
 var import_Actions = __toESM(require("./Actions"));
 var import_Box = __toESM(require("../../../Box"));
 const StyledSwitcher = (0, import_styled_components.default)(import_Box.default)`
@@ -93,7 +94,7 @@ const StyledTextContainer = import_styled_components.default.div`
   flex: 1;
   overflow: hidden;
 `;
-const StyledTitle = (0, import_styled_components.default)(import_yoga.Text.Small)`
+const StyledTitle = (0, import_styled_components.default)(import_Text.default.Body2)`
   ${({
   theme: {
     yoga: {
@@ -110,6 +111,19 @@ const StyledTitle = (0, import_styled_components.default)(import_yoga.Text.Small
       overflow: hidden;
     `}
 `;
+const StyledSubtitle = (0, import_styled_components.default)(import_Text.default.Tiny)`
+  ${({
+  theme: {
+    yoga: {
+      components: {
+        navigationmenu: { font }
+      }
+    }
+  }
+}) => import_styled_components.css`
+      color: ${font.color.default};
+    `}
+`;
 const Switcher = (_a) => {
   var _b = _a, {
     actions,
@@ -142,7 +156,7 @@ const Switcher = (_a) => {
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_yoga.Skeleton, { type: "text", variant: "overline", width: "100%" })
     ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
       title && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledTitle, { children: title }),
-      subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_yoga.Text.Tiny, { color: "deep", children: subtitle })
+      subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledSubtitle, { children: subtitle })
     ] }) }),
     hasActions && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Actions.default, __spreadValues({ actions }, actionsProps))
   ] });

package/esm/Divider/web/Divider.js

@@ -41,8 +41,9 @@ const StyledDivider = styled.hr`
       ${vertical ? "height: auto" : "width: 100%"};
       border-width: 0px;
       border-left-width: ${vertical ? borders.small : 0}px;
-      border-bottom-width: ${vertical ? 0 : borders.small}px;
+      border-top-width: ${vertical ? 0 : borders.small}px;
       border-color: ${colors.text.disabled};
+      border-style: solid;
     `;
 }}
 `;

package/esm/NavigationMenu/web/Item/styles.js

@@ -37,7 +37,7 @@ const StyledTag = styled(Tag)`
     border-radius: ${border.radius.tag}px;
   `}
 `;
-const StyledText = styled(Text)`
+const StyledText = styled(Text.Body1)`
   ${({
   theme: {
     yoga: {

package/esm/NavigationMenu/web/Menu/Menu.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import styled, { css } from "styled-components";
 import { ChevronDown } from "@gympass/yoga-icons";
-import { Text } from "@gympass/yoga";
+import Text from "../../../Text";
 import Icon from "../../../Icon";
 const StyledMenu = styled.div`
   ${({
@@ -58,7 +58,7 @@ const StyledTextContainer = styled.div`
       overflow: hidden;
     `}
 `;
-const StyledTitle = styled(Text.H4)`
+const StyledTitle = styled(Text.Display4)`
   ${({
   theme: {
     yoga: {
@@ -77,7 +77,7 @@ const StyledTitle = styled(Text.H4)`
       overflow: hidden;
     `}
 `;
-const StyledSubtitle = styled(Text.Small)`
+const StyledSubtitle = styled(Text.Body2)`
   ${({
   theme: {
     yoga: {

package/esm/NavigationMenu/web/Switcher/Switcher.js

@@ -28,7 +28,8 @@ var __objRest = (source, exclude) => {
 };
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import styled, { css } from "styled-components";
-import { Text, Skeleton } from "@gympass/yoga";
+import { Skeleton } from "@gympass/yoga";
+import Text from "../../../Text";
 import Actions from "./Actions";
 import Box from "../../../Box";
 const StyledSwitcher = styled(Box)`
@@ -62,7 +63,7 @@ const StyledTextContainer = styled.div`
   flex: 1;
   overflow: hidden;
 `;
-const StyledTitle = styled(Text.Small)`
+const StyledTitle = styled(Text.Body2)`
   ${({
   theme: {
     yoga: {
@@ -79,6 +80,19 @@ const StyledTitle = styled(Text.Small)`
       overflow: hidden;
     `}
 `;
+const StyledSubtitle = styled(Text.Tiny)`
+  ${({
+  theme: {
+    yoga: {
+      components: {
+        navigationmenu: { font }
+      }
+    }
+  }
+}) => css`
+      color: ${font.color.default};
+    `}
+`;
 const Switcher = (_a) => {
   var _b = _a, {
     actions,
@@ -111,7 +125,7 @@ const Switcher = (_a) => {
       /* @__PURE__ */ jsx(Skeleton, { type: "text", variant: "overline", width: "100%" })
     ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
       title && /* @__PURE__ */ jsx(StyledTitle, { children: title }),
-      subtitle && /* @__PURE__ */ jsx(Text.Tiny, { color: "deep", children: subtitle })
+      subtitle && /* @__PURE__ */ jsx(StyledSubtitle, { children: subtitle })
     ] }) }),
     hasActions && /* @__PURE__ */ jsx(Actions, __spreadValues({ actions }, actionsProps))
   ] });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gympass/yoga",
-  "version": "7.114.7",
+  "version": "7.114.8",
   "description": "Gympass component library",
   "main": "./cjs",
   "types": "./typings/index.d.ts",
@@ -30,7 +30,7 @@
     "@gympass/yoga-helpers": "^1.0.4",
     "@gympass/yoga-icons": "^1.21.0",
     "@gympass/yoga-illustrations": "^0.5.2",
-    "@gympass/yoga-system": "^0.11.1",
+    "@gympass/yoga-system": "^0.12.0",
     "@gympass/yoga-tokens": "^3.5.0",
     "@ptomasroos/react-native-multi-slider": "^2.1.1",
     "@radix-ui/react-dropdown-menu": "^2.0.1",
@@ -57,7 +57,7 @@
     "react-native": "0.72.3",
     "styled-components": "^4.4.0"
   },
-  "gitHead": "3f79de70b5d468af507b099e77fd6b8944fc2e42",
+  "gitHead": "d3f2f169c2684aabae3565b6cc7ceb901825696f",
   "module": "./esm",
   "private": false,
   "react-native": "./cjs/index.native.js"

package/typings/NavigationMenu/web/Item/styles.d.ts

@@ -25,51 +25,7 @@ declare const StyledTag: styled_components.StyledComponent<{
         ellipsis: boolean;
     };
 }, any, {}, never>;
-declare const StyledText: styled_components.StyledComponent<{
-    (props: any): JSX.Element;
-    displayName: string;
-    Display1: styled_components.StyledComponent<string, any, {}, never>;
-    Display2: styled_components.StyledComponent<string, any, {}, never>;
-    Display3: styled_components.StyledComponent<string, any, {}, never>;
-    Display4: styled_components.StyledComponent<string, any, {}, never>;
-    DisplayNumber: styled_components.StyledComponent<string, any, {}, never>;
-    H1: styled_components.StyledComponent<string, any, {}, never>;
-    H2: styled_components.StyledComponent<string, any, {}, never>;
-    H3: styled_components.StyledComponent<string, any, {}, never>;
-    H4: styled_components.StyledComponent<string, any, {}, never>;
-    H5: styled_components.StyledComponent<string, any, {}, never>;
-    Body1: styled_components.StyledComponent<string, any, {}, never>;
-    Body2: styled_components.StyledComponent<string, any, {}, never>;
-    Caption: styled_components.StyledComponent<string, any, {}, never>;
-    Overline: styled_components.StyledComponent<string, any, {}, never>;
-    SectionTitle: styled_components.StyledComponent<string, any, {}, never>;
-    SmallestException: styled_components.StyledComponent<string, any, {}, never>;
-    Small: styled_components.StyledComponent<string, any, {}, never>;
-    Tiny: styled_components.StyledComponent<string, any, {}, never>;
-    Light: styled_components.StyledComponent<string, any, {}, never>;
-    Regular: styled_components.StyledComponent<string, any, {}, never>;
-    Medium: styled_components.StyledComponent<string, any, {}, never>;
-    Bold: styled_components.StyledComponent<string, any, {}, never>;
-    Black: styled_components.StyledComponent<string, any, {}, never>;
-    propTypes: {
-        inverted: prop_types.Requireable<boolean>;
-        numberOfLines: prop_types.Requireable<number>;
-        variant: (props: any, propName: any, componentName: any, ...rest: any[]) => any;
-        size: (props: any, propName: any, componentName: any, ...rest: any[]) => any;
-        light: prop_types.Requireable<boolean>;
-        bold: prop_types.Requireable<boolean>;
-        fontSize: prop_types.Requireable<string>;
-    };
-    defaultProps: {
-        inverted: boolean;
-        variant: undefined;
-        size: undefined;
-        fontSize: string;
-        numberOfLines: undefined;
-        light: boolean;
-        bold: boolean;
-    };
-}, any, {}, never>;
+declare const StyledText: styled_components.StyledComponent<string, any, {}, never>;
 declare const StyledItem: styled_components.StyledComponent<string, any, {
     isActive: boolean;
     isResponsive?: boolean | undefined;