@navikt/ds-react 0.7.7 → 0.8.0

package/cjs/modal/ModalContent.js

@@ -0,0 +1,42 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const ModalContent = react_1.forwardRef((_a, ref) => {
+    var { className } = _a, rest = __rest(_a, ["className"]);
+    return (react_1.default.createElement("div", Object.assign({}, rest, { ref: ref, className: classnames_1.default("navds-modal__content", className) })));
+});
+exports.default = ModalContent;

package/cjs/modal/index.js

@@ -7,9 +7,13 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
     o[k2] = m[k];
 }));
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Modal = void 0;
 var Modal_1 = require("./Modal");
-Object.defineProperty(exports, "Modal", { enumerable: true, get: function () { return Modal_1.default; } });
+Object.defineProperty(exports, "Modal", { enumerable: true, get: function () { return __importDefault(Modal_1).default; } });
 __exportStar(require("./Modal"), exports);

package/cjs/{header/Header.js → page-header/PageHeader.js}

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -35,12 +35,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
-const Header = react_1.forwardRef((_a, ref) => {
-    var { children, className, illustration, description, theme = "guide", variant = "left" } = _a, rest = __rest(_a, ["children", "className", "illustration", "description", "theme", "variant"]);
-    return (react_1.default.createElement("div", Object.assign({ ref: ref, className: classnames_1.default("navds-header", className, `navds-header--${theme}`, `navds-header--${variant}`) }, rest),
-        illustration && (react_1.default.createElement("div", { className: "navds-header__illustration" }, illustration)),
-        react_1.default.createElement("div", { className: "navds-header__wrapper" },
-            react_1.default.createElement("h1", { className: "navds-header__title navds-title navds-title--2xl" }, children),
-            description && (react_1.default.createElement("p", { className: "navds-body-short navds-body--s" }, description)))));
+const __1 = require("..");
+const PageHeader = react_1.forwardRef((_a, ref) => {
+    var { children, className, illustration, description, variant = "guide", align = "left" } = _a, rest = __rest(_a, ["children", "className", "illustration", "description", "variant", "align"]);
+    return (react_1.default.createElement("div", Object.assign({ ref: ref, className: classnames_1.default("navds-page-header", className, `navds-page-header--${variant}`, `navds-page-header--${align}`) }, rest),
+        illustration && (react_1.default.createElement("div", { className: "navds-page-header__illustration" }, illustration)),
+        react_1.default.createElement("div", { className: "navds-page-header__wrapper" },
+            react_1.default.createElement(__1.Heading, { className: "navds-page-header__title", size: "2xlarge", level: "1" }, children),
+            description && (react_1.default.createElement(__1.BodyShort, { className: "navds-page-header__description" }, description)))));
 });
-exports.default = Header;
+exports.default = PageHeader;

package/cjs/page-header/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PageHeader = void 0;
+var PageHeader_1 = require("./PageHeader");
+Object.defineProperty(exports, "PageHeader", { enumerable: true, get: function () { return __importDefault(PageHeader_1).default; } });
+__exportStar(require("./PageHeader"), exports);

package/cjs/page-header/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "main": "./index.js",
+  "module": "../../esm/page-header/index.js",
+  "types": "../../esm/page-header/index.d.ts"
+}

package/cjs/panel/Panel.js

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -36,7 +36,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const Panel = react_1.forwardRef((_a, ref) => {
-    var { children, className, border = false, component: Component = "div" } = _a, rest = __rest(_a, ["children", "className", "border", "component"]);
+    var { children, className, border = false, as: Component = "div" } = _a, rest = __rest(_a, ["children", "className", "border", "as"]);
     return (react_1.default.createElement(Component, Object.assign({ ref: ref, className: classnames_1.default("navds-panel", className, {
             "navds-panel--border": border,
         }) }, rest), children));

package/cjs/panel/index.js

@@ -7,9 +7,13 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
     o[k2] = m[k];
 }));
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Panel = void 0;
 var Panel_1 = require("./Panel");
-Object.defineProperty(exports, "Panel", { enumerable: true, get: function () { return Panel_1.default; } });
+Object.defineProperty(exports, "Panel", { enumerable: true, get: function () { return __importDefault(Panel_1).default; } });
 __exportStar(require("./Panel"), exports);

package/cjs/popover/Popover.js

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -33,10 +33,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const classnames_1 = __importDefault(require("classnames"));
 const react_1 = __importStar(require("react"));
-const react_popper_1 = require("react-popper");
 const react_merge_refs_1 = __importDefault(require("react-merge-refs"));
-const classnames_1 = __importDefault(require("classnames"));
+const react_popper_1 = require("react-popper");
+const __1 = require("..");
+const PopoverContent_1 = __importDefault(require("./PopoverContent"));
 const useEventLister = (event, callback) => react_1.useEffect(() => {
     document.addEventListener(event, callback);
     return () => {
@@ -68,9 +70,15 @@ const Popover = react_1.forwardRef((_a, ref) => {
                     offset: [0, offset !== null && offset !== void 0 ? offset : (arrow ? 16 : 4)],
                 },
             },
+            {
+                name: "arrow",
+                options: {
+                    padding: 8,
+                },
+            },
         ],
     });
-    react_1.useEffect(() => {
+    __1.useClientLayoutEffect(() => {
         open && update && update();
     }, [open, update]);
     return (react_1.default.createElement("div", Object.assign({ ref: mergedRef, className: classnames_1.default("navds-popover", className, {
@@ -79,4 +87,5 @@ const Popover = react_1.forwardRef((_a, ref) => {
         children,
         arrow && (react_1.default.createElement("div", { "data-popper-arrow": true, style: styles.arrow, className: "navds-popover__arrow" }))));
 });
+Popover.Content = PopoverContent_1.default;
 exports.default = Popover;

package/cjs/popover/PopoverContent.js

@@ -0,0 +1,42 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const PopoverContent = react_1.forwardRef((_a, ref) => {
+    var { className } = _a, rest = __rest(_a, ["className"]);
+    return (react_1.default.createElement("div", Object.assign({}, rest, { ref: ref, className: classnames_1.default("navds-popover__content", className) })));
+});
+exports.default = PopoverContent;

package/cjs/popover/index.js

@@ -7,9 +7,13 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
     o[k2] = m[k];
 }));
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Popover = void 0;
 var Popover_1 = require("./Popover");
-Object.defineProperty(exports, "Popover", { enumerable: true, get: function () { return Popover_1.default; } });
+Object.defineProperty(exports, "Popover", { enumerable: true, get: function () { return __importDefault(Popover_1).default; } });
 __exportStar(require("./Popover"), exports);

package/cjs/speech-bubble/Bubble.js

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };

package/cjs/speech-bubble/SpeechBubble.js

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };

package/cjs/speech-bubble/index.js

@@ -7,12 +7,16 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
     o[k2] = m[k];
 }));
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Bubble = exports.SpeechBubble = void 0;
 var SpeechBubble_1 = require("./SpeechBubble");
-Object.defineProperty(exports, "SpeechBubble", { enumerable: true, get: function () { return SpeechBubble_1.default; } });
+Object.defineProperty(exports, "SpeechBubble", { enumerable: true, get: function () { return __importDefault(SpeechBubble_1).default; } });
 __exportStar(require("./SpeechBubble"), exports);
 var Bubble_1 = require("./Bubble");
-Object.defineProperty(exports, "Bubble", { enumerable: true, get: function () { return Bubble_1.default; } });
+Object.defineProperty(exports, "Bubble", { enumerable: true, get: function () { return __importDefault(Bubble_1).default; } });
 __exportStar(require("./Bubble"), exports);

package/cjs/tag/Tag.js

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -35,8 +35,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
+const __1 = require("..");
 const Tag = react_1.forwardRef((_a, ref) => {
-    var { children, className, variant } = _a, rest = __rest(_a, ["children", "className", "variant"]);
-    return (react_1.default.createElement("span", Object.assign({ ref: ref, className: classnames_1.default("navds-tag", className, "navds-detail", "navds-detail--s", `navds-tag--${variant}`) }, rest), children));
+    var { className, variant, size = "medium" } = _a, rest = __rest(_a, ["className", "variant", "size"]);
+    const Component = size === "medium" ? __1.BodyShort : __1.Detail;
+    return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, as: "span", size: size, className: classnames_1.default("navds-tag", className, `navds-tag--${variant}`, `navds-tag--${size}`) })));
 });
 exports.default = Tag;

package/cjs/tag/index.js

@@ -7,9 +7,13 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
     o[k2] = m[k];
 }));
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tag = void 0;
 var Tag_1 = require("./Tag");
-Object.defineProperty(exports, "Tag", { enumerable: true, get: function () { return Tag_1.default; } });
+Object.defineProperty(exports, "Tag", { enumerable: true, get: function () { return __importDefault(Tag_1).default; } });
 __exportStar(require("./Tag"), exports);

package/cjs/typography/BodyLong.js

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -36,9 +36,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const BodyLong = react_1.forwardRef((_a, ref) => {
-    var { className, size = "m", spacing, component: Component = "p" } = _a, rest = __rest(_a, ["className", "size", "spacing", "component"]);
+    var { className, size = "medium", spacing, as: Component = "p" } = _a, rest = __rest(_a, ["className", "size", "spacing", "as"]);
     return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, className: classnames_1.default(className, "navds-body-long", {
-            "navds-body--s": size === "s",
+            "navds-body-long--small": size === "small",
             "navds-typo--spacing": !!spacing,
         }) })));
 });

package/cjs/typography/BodyShort.js

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -36,9 +36,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const BodyShort = react_1.forwardRef((_a, ref) => {
-    var { className, size = "m", spacing, component: Component = "p" } = _a, rest = __rest(_a, ["className", "size", "spacing", "component"]);
+    var { className, size = "medium", spacing, as: Component = "p" } = _a, rest = __rest(_a, ["className", "size", "spacing", "as"]);
     return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, className: classnames_1.default(className, "navds-body-short", {
-            "navds-body--s": size === "s",
+            "navds-body-short--small": size === "small",
             "navds-typo--spacing": !!spacing,
         }) })));
 });

package/cjs/typography/Detail.js

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -36,9 +36,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const Detail = react_1.forwardRef((_a, ref) => {
-    var { className, size = "m", spacing, component: Component = "p" } = _a, rest = __rest(_a, ["className", "size", "spacing", "component"]);
+    var { className, size = "medium", spacing, as: Component = "p" } = _a, rest = __rest(_a, ["className", "size", "spacing", "as"]);
     return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, className: classnames_1.default(className, "navds-detail", {
-            "navds-detail--s": size === "s",
+            "navds-detail--small": size === "small",
             "navds-typo--spacing": !!spacing,
         }) })));
 });

package/cjs/typography/{Title.js → Heading.js}

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -35,11 +35,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
-const Title = react_1.forwardRef((_a, ref) => {
-    var { level = 1, size = "2xl", spacing, className, children, component } = _a, rest = __rest(_a, ["level", "size", "spacing", "className", "children", "component"]);
-    let HeadingTag = component !== null && component !== void 0 ? component : `h${level}`;
-    return (react_1.default.createElement(HeadingTag, Object.assign({}, rest, { ref: ref, className: classnames_1.default(className, "navds-title", `navds-title--${size}`, {
-            "navds-typo--spacing": !!spacing,
-        }) }), children));
+const Heading = react_1.forwardRef((_a, ref) => {
+    var { level = "1", size, spacing = false, className, as } = _a, rest = __rest(_a, ["level", "size", "spacing", "className", "as"]);
+    let HeadingTag = as !== null && as !== void 0 ? as : `h${level}`;
+    return (react_1.default.createElement(HeadingTag, Object.assign({}, rest, { ref: ref, className: classnames_1.default(className, "navds-heading", `navds-heading--${size}`, {
+            "navds-typo--spacing": spacing,
+        }) })));
 });
-exports.default = Title;
+exports.default = Heading;

package/cjs/typography/Ingress.js

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -36,7 +36,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const Ingress = react_1.forwardRef((_a, ref) => {
-    var { className, spacing, component: Component = "p" } = _a, rest = __rest(_a, ["className", "spacing", "component"]);
+    var { className, spacing, as: Component = "p" } = _a, rest = __rest(_a, ["className", "spacing", "as"]);
     return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, className: classnames_1.default(className, "navds-ingress", {
             "navds-typo--spacing": !!spacing,
         }) })));