@react-md/typography - npm Package Compare versions

Comparing version 2.0.0-alpha.1 to 2.0.0-alpha.3

dist/scssVariables.d.ts

@@ -8,3 +8,2 @@ declare const _default: {
         "font-family": string;
-        "overflow-wrap": string;
         "-moz-osx-font-smoothing": string;
@@ -46,3 +45,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -59,3 +57,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -72,3 +69,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -85,3 +81,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -98,3 +93,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -111,3 +105,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -124,3 +117,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -137,3 +129,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -150,3 +141,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -163,3 +153,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -176,3 +165,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -189,3 +177,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -202,3 +189,2 @@ "-webkit-font-smoothing": string;
             "font-family": string;
-            "overflow-wrap": string;
             "-moz-osx-font-smoothing": string;
@@ -205,0 +191,0 @@ "-webkit-font-smoothing": string;

dist/scssVariables.js

@@ -11,3 +11,2 @@ "use strict";
         "font-family": "Roboto, sans-serif",
-        "overflow-wrap": "break-word",
         "-moz-osx-font-smoothing": "grayscale",
@@ -49,3 +48,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -62,3 +60,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -75,3 +72,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -88,3 +84,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -101,3 +96,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -114,3 +108,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -127,3 +120,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -140,3 +132,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -153,3 +144,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -166,3 +156,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -179,3 +168,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -192,3 +180,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -205,3 +192,2 @@ "-webkit-font-smoothing": "antialiased",
             "font-family": "Roboto, sans-serif",
-            "overflow-wrap": "break-word",
             "-moz-osx-font-smoothing": "grayscale",
@@ -208,0 +194,0 @@ "-webkit-font-smoothing": "antialiased",

es/Text.js

@@ -80,6 +80,8 @@ var __assign = (this && this.__assign) || function () {
     var _a;
-    var _b = providedProps, propClassName = _b.className, children = _b.children, type = _b.type, component = _b.component, forwardedRef = _b.forwardedRef, noMargin = _b.noMargin, align = _b.align, color = _b.color, decoration = _b.decoration, transform = _b.transform, weight = _b.weight, props = __rest(_b, ["className", "children", "type", "component", "forwardedRef", "noMargin", "align", "color", "decoration", "transform", "weight"]);
+    var _b = providedProps, propClassName = _b.className, children = _b.children, type = _b.type, component = _b.component, forwardedRef = _b.forwardedRef, align = _b.align, color = _b.color, decoration = _b.decoration, transform = _b.transform, weight = _b.weight, margin = _b.margin, props = __rest(_b, ["className", "children", "type", "component", "forwardedRef", "align", "color", "decoration", "transform", "weight", "margin"]);
     var className = cn(block((_a = {},
         _a[type] = true,
-        _a["no-margin"] = noMargin,
+        _a["no-margin"] = margin === "none",
+        _a["no-margin-top"] = margin === "bottom",
+        _a["no-margin-bottom"] = margin === "top",
         _a[align] = align,
@@ -106,3 +108,3 @@ _a[decoration] = decoration && decoration !== "overline",
     component: null,
-    noMargin: false,
+    margin: "initial",
 };
@@ -168,2 +170,3 @@ Text.defaultProps = defaultProps;
             ]),
+            margin: PropTypes.oneOf(["initial", "none", "top", "bottom"]),
         };
@@ -170,0 +173,0 @@ }

lib/Text.js

@@ -92,6 +92,8 @@ "use strict";
     var _a;
-    var _b = providedProps, propClassName = _b.className, children = _b.children, type = _b.type, component = _b.component, forwardedRef = _b.forwardedRef, noMargin = _b.noMargin, align = _b.align, color = _b.color, decoration = _b.decoration, transform = _b.transform, weight = _b.weight, props = __rest(_b, ["className", "children", "type", "component", "forwardedRef", "noMargin", "align", "color", "decoration", "transform", "weight"]);
+    var _b = providedProps, propClassName = _b.className, children = _b.children, type = _b.type, component = _b.component, forwardedRef = _b.forwardedRef, align = _b.align, color = _b.color, decoration = _b.decoration, transform = _b.transform, weight = _b.weight, margin = _b.margin, props = __rest(_b, ["className", "children", "type", "component", "forwardedRef", "align", "color", "decoration", "transform", "weight", "margin"]);
     var className = classnames_1.default(block((_a = {},
         _a[type] = true,
-        _a["no-margin"] = noMargin,
+        _a["no-margin"] = margin === "none",
+        _a["no-margin-top"] = margin === "bottom",
+        _a["no-margin-bottom"] = margin === "top",
         _a[align] = align,
@@ -118,3 +120,3 @@ _a[decoration] = decoration && decoration !== "overline",
     component: null,
-    noMargin: false,
+    margin: "initial",
 };
@@ -180,2 +182,3 @@ Text.defaultProps = defaultProps;
             ]),
+            margin: PropTypes.oneOf(["initial", "none", "top", "bottom"]),
         };
@@ -182,0 +185,0 @@ }

package.json

 {
   "name": "@react-md/typography",
-  "version": "2.0.0-alpha.1",
+  "version": "2.0.0-alpha.3",
   "description": "The base package for including typography for react-md.",
   "scripts": {
     "build": "dev-utils build",
-    "clean": "dev-utils clean",
-    "test": "dev-utils test"
+    "clean": "dev-utils clean"
   },
@@ -32,4 +31,4 @@ "main": "./lib/index.js",
   "dependencies": {
-    "@react-md/theme": "^2.0.0-alpha.1",
-    "@react-md/utils": "^2.0.0-alpha.1",
+    "@react-md/theme": "^2.0.0-alpha.3",
+    "@react-md/utils": "^2.0.0-alpha.3",
     "classnames": "^2.2.6"
@@ -46,3 +45,3 @@ },
   },
-  "gitHead": "9197bcdf38df3cff304499431696dc8e950b4b17"
+  "gitHead": "ff38fa4bd502c527ffb8847eae71b471456e0355"
 }

src/scssVariables.ts

@@ -9,3 +9,2 @@ /** this is an auto-generated file from @react-md/dev-utils */
     "font-family": "Roboto, sans-serif",
-    "overflow-wrap": "break-word",
     "-moz-osx-font-smoothing": "grayscale",
@@ -47,3 +46,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -60,3 +58,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -73,3 +70,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -86,3 +82,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -99,3 +94,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -112,3 +106,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -125,3 +118,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -138,3 +130,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -151,3 +142,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -164,3 +154,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -177,3 +166,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -190,3 +178,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -203,3 +190,2 @@ "-webkit-font-smoothing": "antialiased",
       "font-family": "Roboto, sans-serif",
-      "overflow-wrap": "break-word",
       "-moz-osx-font-smoothing": "grayscale",
@@ -206,0 +192,0 @@ "-webkit-font-smoothing": "antialiased",

types/Text.d.ts

@@ -1,2 +0,2 @@
-import React, { HTMLAttributes, ReactElement, ReactType, ReactNode } from "react";
+import React, { HTMLAttributes, ReactElement, ElementType, ReactNode } from "react";
 /**
@@ -44,3 +44,3 @@ * A union of all the material design provided typography styles. When used with the Text
      */
-    component?: ReactType | null;
+    component?: ElementType | null;
     /**
@@ -57,8 +57,2 @@ * One of the material design typography text styles. This is used to generate a className
     /**
-     * Boolean if the browser default margin's should be removed. This is generally disabled
-     * by default since it is helpful to have the default margins in place when using this
-     * component to create text pages.
-     */
-    noMargin?: boolean;
-    /**
      * An optional text alignment to apply.
@@ -85,4 +79,14 @@ */
     weight?: TextWeight;
+    /**
+     * Since the typography within react-md tries to not modify base elements, the default
+     * margin applied to heading tags (h1-h6) and paragraph (p) might have large margin that
+     * you don't want applied when using this component. You can disable:
+     * - only the top margin by setting this prop to `"bottom"`
+     * - only the bottom margin by setting this prop to `"top"`
+     * - top and bottom margin by setting this prop to `"none"`
+     * - or keep the initial behavior: `"initial"`
+     */
+    margin?: "initial" | "none" | "top" | "bottom";
 }
 declare const _default: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<TextElement>>;
 export default _default;

types/TextContainer.d.ts

@@ -1,2 +0,2 @@
-import React, { HTMLAttributes, ReactElement, ReactType, ReactNode } from "react";
+import React, { HTMLAttributes, ReactElement, ElementType, ReactNode } from "react";
 /**
@@ -31,3 +31,3 @@ * A union of the available text container sizes. One of these values must be chosen
      */
-    component?: ReactType;
+    component?: ElementType;
     /**
@@ -34,0 +34,0 @@ * Either a child render function or a react node. If this is not the child render function, a

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

188236

increased by17.14%

Number of package files

45

increased by9.76%

Worsened metrics

Lines of code

2032

decreased by-1.55%

Dependency changes

• Updated@react-md/theme@^2.0.0-alpha.3

• Updated@react-md/utils@^2.0.0-alpha.3