@dnb/eufemia 10.56.0 → 10.57.1

package/cjs/elements/span/SpanDocs.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SpanProperties = void 0;
+var _TypographyDocs = require("../typography/TypographyDocs");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+const SpanProperties = _objectSpread({}, _TypographyDocs.TypographyProperties);
+exports.SpanProperties = SpanProperties;
+//# sourceMappingURL=SpanDocs.js.map

package/cjs/elements/span/SpanDocs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpanDocs.js","names":["_TypographyDocs","require","ownKeys","object","enumerableOnly","keys","Object","getOwnPropertySymbols","symbols","filter","sym","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","target","i","arguments","length","source","forEach","key","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","obj","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","call","TypeError","Number","SpanProperties","TypographyProperties","exports"],"sources":["../../../../src/elements/span/SpanDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\nimport { TypographyProperties } from '../typography/TypographyDocs'\n\nexport const SpanProperties: PropertiesTableProps = {\n  ...TypographyProperties,\n}\n"],"mappings":";;;;;;AACA,IAAAA,eAAA,GAAAC,OAAA;AAAmE,SAAAC,QAAAC,MAAA,EAAAC,cAAA,QAAAC,IAAA,GAAAC,MAAA,CAAAD,IAAA,CAAAF,MAAA,OAAAG,MAAA,CAAAC,qBAAA,QAAAC,OAAA,GAAAF,MAAA,CAAAC,qBAAA,CAAAJ,MAAA,GAAAC,cAAA,KAAAI,OAAA,GAAAA,OAAA,CAAAC,MAAA,WAAAC,GAAA,WAAAJ,MAAA,CAAAK,wBAAA,CAAAR,MAAA,EAAAO,GAAA,EAAAE,UAAA,OAAAP,IAAA,CAAAQ,IAAA,CAAAC,KAAA,CAAAT,IAAA,EAAAG,OAAA,YAAAH,IAAA;AAAA,SAAAU,cAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,WAAAF,SAAA,CAAAD,CAAA,IAAAC,SAAA,CAAAD,CAAA,QAAAA,CAAA,OAAAf,OAAA,CAAAI,MAAA,CAAAc,MAAA,OAAAC,OAAA,WAAAC,GAAA,IAAAC,eAAA,CAAAP,MAAA,EAAAM,GAAA,EAAAF,MAAA,CAAAE,GAAA,SAAAhB,MAAA,CAAAkB,yBAAA,GAAAlB,MAAA,CAAAmB,gBAAA,CAAAT,MAAA,EAAAV,MAAA,CAAAkB,yBAAA,CAAAJ,MAAA,KAAAlB,OAAA,CAAAI,MAAA,CAAAc,MAAA,GAAAC,OAAA,WAAAC,GAAA,IAAAhB,MAAA,CAAAoB,cAAA,CAAAV,MAAA,EAAAM,GAAA,EAAAhB,MAAA,CAAAK,wBAAA,CAAAS,MAAA,EAAAE,GAAA,iBAAAN,MAAA;AAAA,SAAAO,gBAAAI,GAAA,EAAAL,GAAA,EAAAM,KAAA,IAAAN,GAAA,GAAAO,cAAA,CAAAP,GAAA,OAAAA,GAAA,IAAAK,GAAA,IAAArB,MAAA,CAAAoB,cAAA,CAAAC,GAAA,EAAAL,GAAA,IAAAM,KAAA,EAAAA,KAAA,EAAAhB,UAAA,QAAAkB,YAAA,QAAAC,QAAA,oBAAAJ,GAAA,CAAAL,GAAA,IAAAM,KAAA,WAAAD,GAAA;AAAA,SAAAE,eAAAG,GAAA,QAAAV,GAAA,GAAAW,YAAA,CAAAD,GAAA,2BAAAV,GAAA,gBAAAA,GAAA,GAAAY,MAAA,CAAAZ,GAAA;AAAA,SAAAW,aAAAE,KAAA,EAAAC,IAAA,eAAAD,KAAA,iBAAAA,KAAA,kBAAAA,KAAA,MAAAE,IAAA,GAAAF,KAAA,CAAAG,MAAA,CAAAC,WAAA,OAAAF,IAAA,KAAAG,SAAA,QAAAC,GAAA,GAAAJ,IAAA,CAAAK,IAAA,CAAAP,KAAA,EAAAC,IAAA,2BAAAK,GAAA,sBAAAA,GAAA,YAAAE,SAAA,4DAAAP,IAAA,gBAAAF,MAAA,GAAAU,MAAA,EAAAT,KAAA;AAE5D,MAAMU,cAAoC,GAAA9B,aAAA,KAC5C+B,oCAAoB,CACxB;AAAAC,OAAA,CAAAF,cAAA,GAAAA,cAAA"}

package/cjs/elements/typography/Ingress.js

@@ -9,7 +9,7 @@ var _P = _interopRequireDefault(require("./P"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 const Ingress = props => _react.default.createElement(_P.default, _extends({
-  medium: true
+  weight: "medium"
 }, props));
 Ingress._supportsSpacingProps = true;
 var _default = Ingress;

package/cjs/elements/typography/Ingress.js.map

@@ -1 +1 @@
-{"version":3,"file":"Ingress.js","names":["_react","_interopRequireDefault","require","_P","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","Ingress","props","createElement","medium","_supportsSpacingProps","_default","exports"],"sources":["../../../../src/elements/typography/Ingress.tsx"],"sourcesContent":["/**\n * HTML Element\n *\n */\nimport React from 'react'\nimport P, { PProps } from './P'\n\nconst Ingress = (props: PProps) => <P medium {...props} />\n\nIngress._supportsSpacingProps = true\n\nexport default Ingress\n"],"mappings":";;;;;;AAIA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,EAAA,GAAAF,sBAAA,CAAAC,OAAA;AAA+B,SAAAD,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAE/B,MAAMQ,OAAO,GAAIC,KAAa,IAAKtB,MAAA,CAAAM,OAAA,CAAAiB,aAAA,CAACpB,EAAA,CAAAG,OAAC,EAAAC,QAAA;EAACiB,MAAM;AAAA,GAAKF,KAAK,CAAG,CAAC;AAE1DD,OAAO,CAACI,qBAAqB,GAAG,IAAI;AAAA,IAAAC,QAAA,GAErBL,OAAO;AAAAM,OAAA,CAAArB,OAAA,GAAAoB,QAAA"}
+{"version":3,"file":"Ingress.js","names":["_react","_interopRequireDefault","require","_P","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","Ingress","props","createElement","weight","_supportsSpacingProps","_default","exports"],"sources":["../../../../src/elements/typography/Ingress.tsx"],"sourcesContent":["/**\n * HTML Element\n *\n */\nimport React from 'react'\nimport P, { PProps } from './P'\n\nconst Ingress = (props: PProps) => <P weight=\"medium\" {...props} />\n\nIngress._supportsSpacingProps = true\n\nexport default Ingress\n"],"mappings":";;;;;;AAIA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,EAAA,GAAAF,sBAAA,CAAAC,OAAA;AAA+B,SAAAD,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAE/B,MAAMQ,OAAO,GAAIC,KAAa,IAAKtB,MAAA,CAAAM,OAAA,CAAAiB,aAAA,CAACpB,EAAA,CAAAG,OAAC,EAAAC,QAAA;EAACiB,MAAM,EAAC;AAAQ,GAAKF,KAAK,CAAG,CAAC;AAEnED,OAAO,CAACI,qBAAqB,GAAG,IAAI;AAAA,IAAAC,QAAA,GAErBL,OAAO;AAAAM,OAAA,CAAArB,OAAA,GAAAoB,QAAA"}

package/cjs/elements/typography/P.d.ts

@@ -3,31 +3,25 @@
  *
  */
 import React from 'react';
-import { SpacingProps } from '../../components/space/types';
-import type { DynamicElement } from '../../shared/types';
-export type PSize = 'x-small' | 'small' | 'basis' | 'medium' | 'large' | 'x-large' | 'xx-large';
-export type PProps = SpacingProps & React.HTMLAttributes<HTMLParagraphElement> & {
+import { TypographySize, TypographyProps } from './Typography';
+/** @deprecated use TypographySize instead */
+export type PSize = TypographySize;
+export type PProps = TypographyProps<HTMLParagraphElement> & {
     /**
-     * Defines the Element Type, like "p"
-     * Default: p
-     */
-    element?: DynamicElement | 'p';
-    /**
-     * Tells the component to use the medium font-weight styling dnb-p--medium defined in paragraphStyle - typography-mixins.scss. Find more details here https://eufemia.dnb.no/uilib/typography/font-weight/
+     * Tells the component to use the medium font-weight styling dnb-t__weight--medium defined in paragraphStyle - typography-mixins.scss. Find more details here https://eufemia.dnb.no/uilib/typography/font-weight/
+     * @deprecated use the `weight` prop instead
      */
     medium?: boolean;
     /**
-     * Tells the component to use the bold font-weight styling dnb-p--bold defined in paragraphStyle - typography-mixins.scss. Find more details here https://eufemia.dnb.no/uilib/typography/font-weight/
+     * Tells the component to use the bold font-weight styling dnb-t__weight--bold defined in paragraphStyle - typography-mixins.scss. Find more details here https://eufemia.dnb.no/uilib/typography/font-weight/
+     * @deprecated use the `weight` prop instead
      */
     bold?: boolean;
-    /**
-     * Sets the font size based on size classes defined in paragraphStyle - typography-mixins.scss. For more detailed information go here: https://eufemia.dnb.no/uilib/typography/font-size/
-     */
-    size?: PSize;
     /**
      * A string containing a combination of modifiers, used to set both font-size and weight in one property. e.g. "x-small bold" would make the paragraph extra small and bold.
-     * Works as a flexible alternative to setting the medium, small, bold and size props.
+     * Works as a flexible alternative to setting the medium, bold and size props.
      * List of modifiers can be found at https://eufemia.dnb.no/uilib/typography/font-size/ and https://eufemia.dnb.no/uilib/typography/font-weight/
+     * @deprecated only font weights "bold" and "medium" and sizes "x-small" and "small" are supported. Use the `size` and `weight` props instead.
      */
     modifier?: string;
 };

package/cjs/elements/typography/P.js

@@ -7,46 +7,76 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.ParagraphContext = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
-var _Element = _interopRequireDefault(require("../Element"));
-const _excluded = ["modifier", "element", "className", "medium", "bold", "size", "children"];
+var _Typography = _interopRequireDefault(require("./Typography"));
+const _excluded = ["remainingModifiers", "element", "className"],
+  _excluded2 = ["weight", "size", "modifier", "bold", "medium"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function P(props) {
-  const {
-      modifier,
+  const _handleDeprecatedProp = handleDeprecatedProps(props),
+    {
+      remainingModifiers,
       element = 'p',
-      className,
-      medium,
-      bold,
-      size,
-      children
-    } = props,
-    rest = _objectWithoutProperties(props, _excluded);
-  const allModifiers = [medium && 'medium', bold && 'bold'];
+      className
+    } = _handleDeprecatedProp,
+    rest = _objectWithoutProperties(_handleDeprecatedProp, _excluded);
   const paragraphContext = (0, _react.useContext)(ParagraphContext);
-  if (modifier) {
-    modifier.split(/\s/g).forEach(modifier => allModifiers.push(modifier));
-  }
-  const modifierString = allModifiers.filter(Boolean).reduce((acc, cur) => {
-    if (['x-small', 'small'].includes(cur)) {
-      return `${acc} dnb-p__size--${cur}`;
-    }
+  const deprecatedModifierString = remainingModifiers.reduce((acc, cur) => {
     return `${acc} dnb-p--${cur}`;
   }, '');
   return _react.default.createElement(ParagraphContext.Provider, {
     value: {
       isNested: true
     }
-  }, _react.default.createElement(_Element.default, _extends({
-    as: element === 'p' && paragraphContext !== null && paragraphContext !== void 0 && paragraphContext.isNested ? 'span' : element
-  }, rest, {
-    className: (0, _classnames.default)('dnb-p', modifierString, className, size && `dnb-p__size--${size}`)
-  }), children));
+  }, _react.default.createElement(_Typography.default, _extends({
+    element: element === 'p' && paragraphContext !== null && paragraphContext !== void 0 && paragraphContext.isNested ? 'span' : element,
+    className: (0, _classnames.default)('dnb-p', deprecatedModifierString, className)
+  }, rest)));
 }
+const handleDeprecatedProps = _ref => {
+  let {
+      weight,
+      size,
+      modifier,
+      bold,
+      medium
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded2);
+  let oldWeight;
+  let oldSize;
+  const allModifiers = [bold && 'bold', medium && 'medium'];
+  if (modifier) {
+    modifier.split(/\s/g).forEach(modifier => allModifiers.push(modifier));
+  }
+  const remainingModifiers = allModifiers.filter(Boolean).filter(cur => {
+    if (['x-small'].includes(cur)) {
+      oldSize = 'x-small';
+    } else if (['small'].includes(cur)) {
+      oldSize = oldSize || 'small';
+    } else if (['medium'].includes(cur)) {
+      oldWeight = oldWeight || 'medium';
+    } else if (['bold'].includes(cur)) {
+      oldWeight = 'bold';
+    } else {
+      return true;
+    }
+    return false;
+  }, []);
+  return _objectSpread({
+    weight: weight || oldWeight,
+    size: oldSize && size !== 'x-small' ? oldSize : size,
+    remainingModifiers
+  }, rest);
+};
 P._supportsSpacingProps = true;
 var _default = P;
 exports.default = _default;

package/cjs/elements/typography/P.js.map

@@ -1 +1 @@
-{"version":3,"file":"P.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_Element","_excluded","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","P","props","modifier","element","className","medium","bold","size","children","rest","allModifiers","paragraphContext","useContext","ParagraphContext","split","forEach","push","modifierString","filter","Boolean","reduce","acc","cur","includes","createElement","Provider","value","isNested","as","classnames","_supportsSpacingProps","_default","exports","createContext","undefined"],"sources":["../../../../src/elements/typography/P.tsx"],"sourcesContent":["/**\n * HTML Element\n *\n */\n\nimport React, { createContext, useContext } from 'react'\nimport classnames from 'classnames'\nimport { SpacingProps } from '../../components/space/types'\nimport type { DynamicElement } from '../../shared/types'\nimport E from '../Element'\n\nexport type PSize =\n  | 'x-small'\n  | 'small'\n  | 'basis'\n  | 'medium'\n  | 'large'\n  | 'x-large'\n  | 'xx-large'\n\nexport type PProps = SpacingProps &\n  React.HTMLAttributes<HTMLParagraphElement> & {\n    /**\n     * Defines the Element Type, like \"p\"\n     * Default: p\n     */\n    element?: DynamicElement | 'p'\n    /**\n     * Tells the component to use the medium font-weight styling dnb-p--medium defined in paragraphStyle - typography-mixins.scss. Find more details here https://eufemia.dnb.no/uilib/typography/font-weight/\n     */\n    medium?: boolean\n    /**\n     * Tells the component to use the bold font-weight styling dnb-p--bold defined in paragraphStyle - typography-mixins.scss. Find more details here https://eufemia.dnb.no/uilib/typography/font-weight/\n     */\n    bold?: boolean\n    /**\n     * Sets the font size based on size classes defined in paragraphStyle - typography-mixins.scss. For more detailed information go here: https://eufemia.dnb.no/uilib/typography/font-size/\n     */\n    size?: PSize\n    /**\n     * A string containing a combination of modifiers, used to set both font-size and weight in one property. e.g. \"x-small bold\" would make the paragraph extra small and bold.\n     * Works as a flexible alternative to setting the medium, small, bold and size props.\n     * List of modifiers can be found at https://eufemia.dnb.no/uilib/typography/font-size/ and https://eufemia.dnb.no/uilib/typography/font-weight/\n     */\n    modifier?: string\n  }\n\nfunction P(props: PProps) {\n  const {\n    modifier,\n    element = 'p',\n    className,\n    medium,\n    bold,\n    size,\n    children,\n    ...rest\n  } = props\n\n  const allModifiers = [medium && 'medium', bold && 'bold']\n  const paragraphContext = useContext(ParagraphContext)\n\n  if (modifier) {\n    modifier\n      .split(/\\s/g)\n      .forEach((modifier) => allModifiers.push(modifier))\n  }\n\n  const modifierString = allModifiers\n    .filter(Boolean)\n    .reduce((acc, cur) => {\n      if (['x-small', 'small'].includes(cur)) {\n        return `${acc} dnb-p__size--${cur}`\n      }\n\n      return `${acc} dnb-p--${cur}`\n    }, '')\n\n  return (\n    <ParagraphContext.Provider value={{ isNested: true }}>\n      <E\n        as={\n          element === 'p' && paragraphContext?.isNested ? 'span' : element\n        }\n        {...rest}\n        className={classnames(\n          'dnb-p',\n          modifierString,\n          className,\n          size && `dnb-p__size--${size}`\n        )}\n      >\n        {children}\n      </E>\n    </ParagraphContext.Provider>\n  )\n}\n\nP._supportsSpacingProps = true\n\nexport default P\n\nexport type ParagraphContextType = {\n  isNested?: boolean\n}\n\nexport const ParagraphContext =\n  createContext<ParagraphContextType>(undefined)\n"],"mappings":"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"}
+{"version":3,"file":"P.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_Typography","_excluded","_excluded2","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","ownKeys","object","enumerableOnly","keys","getOwnPropertySymbols","symbols","filter","sym","enumerable","push","apply","_objectSpread","target","i","arguments","length","source","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","TypeError","Number","_extends","assign","bind","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","P","props","_handleDeprecatedProp","handleDeprecatedProps","remainingModifiers","element","className","rest","paragraphContext","useContext","ParagraphContext","deprecatedModifierString","reduce","acc","cur","createElement","Provider","isNested","classnames","_ref","weight","size","modifier","bold","medium","oldWeight","oldSize","allModifiers","split","Boolean","includes","_supportsSpacingProps","_default","exports","createContext"],"sources":["../../../../src/elements/typography/P.tsx"],"sourcesContent":["/**\n * HTML Element\n *\n */\n\nimport React, { createContext, useContext } from 'react'\nimport classnames from 'classnames'\nimport Typography, { TypographySize, TypographyProps } from './Typography'\n\n/** @deprecated use TypographySize instead */\nexport type PSize = TypographySize\n\nexport type PProps = TypographyProps<HTMLParagraphElement> & {\n  /**\n   * Tells the component to use the medium font-weight styling dnb-t__weight--medium defined in paragraphStyle - typography-mixins.scss. Find more details here https://eufemia.dnb.no/uilib/typography/font-weight/\n   * @deprecated use the `weight` prop instead\n   */\n  medium?: boolean\n  /**\n   * Tells the component to use the bold font-weight styling dnb-t__weight--bold defined in paragraphStyle - typography-mixins.scss. Find more details here https://eufemia.dnb.no/uilib/typography/font-weight/\n   * @deprecated use the `weight` prop instead\n   */\n  bold?: boolean\n  /**\n   * A string containing a combination of modifiers, used to set both font-size and weight in one property. e.g. \"x-small bold\" would make the paragraph extra small and bold.\n   * Works as a flexible alternative to setting the medium, bold and size props.\n   * List of modifiers can be found at https://eufemia.dnb.no/uilib/typography/font-size/ and https://eufemia.dnb.no/uilib/typography/font-weight/\n   * @deprecated only font weights \"bold\" and \"medium\" and sizes \"x-small\" and \"small\" are supported. Use the `size` and `weight` props instead.\n   */\n  modifier?: string\n}\n\nfunction P(props: PProps) {\n  const {\n    remainingModifiers,\n    element = 'p',\n    className,\n    ...rest\n  } = handleDeprecatedProps(props)\n\n  const paragraphContext = useContext(ParagraphContext)\n\n  const deprecatedModifierString = remainingModifiers.reduce(\n    (acc, cur) => {\n      // This entire string could possibly be deprecated. There are no remaining modifiers\n      // that should be supported, but technically this allows for any class \"dnb-p--[modifier]\".\n      // But \"dnb-p--lead\" is the only class that we have, and it's not supposed to be added here.\n      return `${acc} dnb-p--${cur}`\n    },\n    ''\n  )\n\n  return (\n    <ParagraphContext.Provider value={{ isNested: true }}>\n      <Typography\n        element={\n          element === 'p' && paragraphContext?.isNested ? 'span' : element\n        }\n        className={classnames(\n          'dnb-p',\n          deprecatedModifierString,\n          className\n        )}\n        {...rest}\n      />\n    </ParagraphContext.Provider>\n  )\n}\n\nconst handleDeprecatedProps = ({\n  weight,\n  size,\n  modifier,\n  bold,\n  medium,\n  ...rest\n}: PProps): TypographyProps<HTMLParagraphElement> & {\n  remainingModifiers?: string[]\n} => {\n  let oldWeight\n  let oldSize\n\n  const allModifiers = [bold && 'bold', medium && 'medium']\n  if (modifier) {\n    modifier\n      .split(/\\s/g)\n      .forEach((modifier) => allModifiers.push(modifier))\n  }\n\n  const remainingModifiers = allModifiers.filter(Boolean).filter((cur) => {\n    if (['x-small'].includes(cur)) {\n      oldSize = 'x-small'\n    } else if (['small'].includes(cur)) {\n      oldSize = oldSize || 'small'\n    } else if (['medium'].includes(cur)) {\n      oldWeight = oldWeight || 'medium'\n    } else if (['bold'].includes(cur)) {\n      oldWeight = 'bold'\n    } else {\n      // There should never be anything here unless it's a custom modifier.\n      return true\n    }\n    return false\n  }, [])\n\n  return {\n    weight: weight || oldWeight,\n    size: oldSize && size !== 'x-small' ? oldSize : size,\n    remainingModifiers,\n    ...rest,\n  }\n}\n\nP._supportsSpacingProps = true\n\nexport default P\n\nexport type ParagraphContextType = {\n  isNested?: boolean\n}\n\nexport const ParagraphContext =\n  createContext<ParagraphContextType>(undefined)\n"],"mappings":"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"}

package/cjs/elements/typography/PDocs.js

@@ -4,37 +4,28 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ParagraphProperties = void 0;
-const ParagraphProperties = {
-  element: {
-    doc: 'Defines the Element Type, like `p`.',
-    type: ['HTMLElement', 'string'],
-    status: 'optional'
-  },
+var _TypographyDocs = require("./TypographyDocs");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+const ParagraphProperties = _objectSpread(_objectSpread({}, _TypographyDocs.TypographyProperties), {}, {
   medium: {
-    doc: 'Tells the component to use the medium font-weight styling `dnb-p--medium`. More details [here](/uilib/typography/font-weight).',
+    doc: 'Tells the component to use the medium font-weight styling `dnb-t__weight--medium`. More details [here](/uilib/typography/font-weight).',
     type: 'boolean',
-    status: 'optional'
+    status: 'deprecated'
   },
   bold: {
-    doc: 'Tells the component to use the bold font-weight styling class `dnb-p--bold`. More details [here](/uilib/typography/font-weight).',
+    doc: 'Tells the component to use the bold font-weight styling class `dnb-t__weight--bold`. More details [here](/uilib/typography/font-weight).',
     type: 'boolean',
-    status: 'optional'
-  },
-  size: {
-    doc: 'Sets the font size based on the following sizes:  `x-small`, `small`, `basis`, `medium`, `large`, `x-large` or `xx-large`.',
-    type: 'string',
-    status: 'optional'
+    status: 'deprecated'
   },
   modifier: {
-    doc: 'String containing a combination of modifiers, used to set both font-size and weight in one property. e.g. `x-small bold` would make the paragraph extra small and bold.',
+    doc: 'String containing a combination of modifiers, used to set both font-size and weight in one property. e.g. `x-small medium` would make the paragraph extra small and medium.',
     type: 'string',
-    status: 'optional'
-  },
-  '[Space](/uilib/layout/space/properties)': {
-    doc: 'Spacing properties like `top` or `bottom` are supported.',
-    type: ['string', 'object'],
-    status: 'optional'
+    status: 'deprecated'
   }
-};
+});
 exports.ParagraphProperties = ParagraphProperties;
 //# sourceMappingURL=PDocs.js.map

package/cjs/elements/typography/PDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"PDocs.js","names":["ParagraphProperties","element","doc","type","status","medium","bold","size","modifier","exports"],"sources":["../../../../src/elements/typography/PDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const ParagraphProperties: PropertiesTableProps = {\n  element: {\n    doc: 'Defines the Element Type, like `p`.',\n    type: ['HTMLElement', 'string'],\n    status: 'optional',\n  },\n  medium: {\n    doc: 'Tells the component to use the medium font-weight styling `dnb-p--medium`. More details [here](/uilib/typography/font-weight).',\n    type: 'boolean',\n    status: 'optional',\n  },\n  bold: {\n    doc: 'Tells the component to use the bold font-weight styling class `dnb-p--bold`. More details [here](/uilib/typography/font-weight).',\n    type: 'boolean',\n    status: 'optional',\n  },\n  size: {\n    doc: 'Sets the font size based on the following sizes:  `x-small`, `small`, `basis`, `medium`, `large`, `x-large` or `xx-large`.',\n    type: 'string',\n    status: 'optional',\n  },\n  modifier: {\n    doc: 'String containing a combination of modifiers, used to set both font-size and weight in one property. e.g. `x-small bold` would make the paragraph extra small and bold.',\n    type: 'string',\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n"],"mappings":";;;;;;AAEO,MAAMA,mBAAyC,GAAG;EACvDC,OAAO,EAAE;IACPC,GAAG,EAAE,qCAAqC;IAC1CC,IAAI,EAAE,CAAC,aAAa,EAAE,QAAQ,CAAC;IAC/BC,MAAM,EAAE;EACV,CAAC;EACDC,MAAM,EAAE;IACNH,GAAG,EAAE,gIAAgI;IACrIC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDE,IAAI,EAAE;IACJJ,GAAG,EAAE,kIAAkI;IACvIC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDG,IAAI,EAAE;IACJL,GAAG,EAAE,4HAA4H;IACjIC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,QAAQ,EAAE;IACRN,GAAG,EAAE,yKAAyK;IAC9KC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC;AAAAK,OAAA,CAAAT,mBAAA,GAAAA,mBAAA"}
+{"version":3,"file":"PDocs.js","names":["_TypographyDocs","require","ownKeys","object","enumerableOnly","keys","Object","getOwnPropertySymbols","symbols","filter","sym","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","target","i","arguments","length","source","forEach","key","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","obj","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","call","TypeError","Number","ParagraphProperties","TypographyProperties","medium","doc","type","status","bold","modifier","exports"],"sources":["../../../../src/elements/typography/PDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\nimport { TypographyProperties } from './TypographyDocs'\n\nexport const ParagraphProperties: PropertiesTableProps = {\n  ...TypographyProperties,\n  medium: {\n    doc: 'Tells the component to use the medium font-weight styling `dnb-t__weight--medium`. More details [here](/uilib/typography/font-weight).',\n    type: 'boolean',\n    status: 'deprecated',\n  },\n  bold: {\n    doc: 'Tells the component to use the bold font-weight styling class `dnb-t__weight--bold`. More details [here](/uilib/typography/font-weight).',\n    type: 'boolean',\n    status: 'deprecated',\n  },\n  modifier: {\n    doc: 'String containing a combination of modifiers, used to set both font-size and weight in one property. e.g. `x-small medium` would make the paragraph extra small and medium.',\n    type: 'string',\n    status: 'deprecated',\n  },\n}\n"],"mappings":";;;;;;AACA,IAAAA,eAAA,GAAAC,OAAA;AAAuD,SAAAC,QAAAC,MAAA,EAAAC,cAAA,QAAAC,IAAA,GAAAC,MAAA,CAAAD,IAAA,CAAAF,MAAA,OAAAG,MAAA,CAAAC,qBAAA,QAAAC,OAAA,GAAAF,MAAA,CAAAC,qBAAA,CAAAJ,MAAA,GAAAC,cAAA,KAAAI,OAAA,GAAAA,OAAA,CAAAC,MAAA,WAAAC,GAAA,WAAAJ,MAAA,CAAAK,wBAAA,CAAAR,MAAA,EAAAO,GAAA,EAAAE,UAAA,OAAAP,IAAA,CAAAQ,IAAA,CAAAC,KAAA,CAAAT,IAAA,EAAAG,OAAA,YAAAH,IAAA;AAAA,SAAAU,cAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,WAAAF,SAAA,CAAAD,CAAA,IAAAC,SAAA,CAAAD,CAAA,QAAAA,CAAA,OAAAf,OAAA,CAAAI,MAAA,CAAAc,MAAA,OAAAC,OAAA,WAAAC,GAAA,IAAAC,eAAA,CAAAP,MAAA,EAAAM,GAAA,EAAAF,MAAA,CAAAE,GAAA,SAAAhB,MAAA,CAAAkB,yBAAA,GAAAlB,MAAA,CAAAmB,gBAAA,CAAAT,MAAA,EAAAV,MAAA,CAAAkB,yBAAA,CAAAJ,MAAA,KAAAlB,OAAA,CAAAI,MAAA,CAAAc,MAAA,GAAAC,OAAA,WAAAC,GAAA,IAAAhB,MAAA,CAAAoB,cAAA,CAAAV,MAAA,EAAAM,GAAA,EAAAhB,MAAA,CAAAK,wBAAA,CAAAS,MAAA,EAAAE,GAAA,iBAAAN,MAAA;AAAA,SAAAO,gBAAAI,GAAA,EAAAL,GAAA,EAAAM,KAAA,IAAAN,GAAA,GAAAO,cAAA,CAAAP,GAAA,OAAAA,GAAA,IAAAK,GAAA,IAAArB,MAAA,CAAAoB,cAAA,CAAAC,GAAA,EAAAL,GAAA,IAAAM,KAAA,EAAAA,KAAA,EAAAhB,UAAA,QAAAkB,YAAA,QAAAC,QAAA,oBAAAJ,GAAA,CAAAL,GAAA,IAAAM,KAAA,WAAAD,GAAA;AAAA,SAAAE,eAAAG,GAAA,QAAAV,GAAA,GAAAW,YAAA,CAAAD,GAAA,2BAAAV,GAAA,gBAAAA,GAAA,GAAAY,MAAA,CAAAZ,GAAA;AAAA,SAAAW,aAAAE,KAAA,EAAAC,IAAA,eAAAD,KAAA,iBAAAA,KAAA,kBAAAA,KAAA,MAAAE,IAAA,GAAAF,KAAA,CAAAG,MAAA,CAAAC,WAAA,OAAAF,IAAA,KAAAG,SAAA,QAAAC,GAAA,GAAAJ,IAAA,CAAAK,IAAA,CAAAP,KAAA,EAAAC,IAAA,2BAAAK,GAAA,sBAAAA,GAAA,YAAAE,SAAA,4DAAAP,IAAA,gBAAAF,MAAA,GAAAU,MAAA,EAAAT,KAAA;AAEhD,MAAMU,mBAAyC,GAAA9B,aAAA,CAAAA,aAAA,KACjD+B,oCAAoB;EACvBC,MAAM,EAAE;IACNC,GAAG,EAAE,wIAAwI;IAC7IC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDC,IAAI,EAAE;IACJH,GAAG,EAAE,0IAA0I;IAC/IC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDE,QAAQ,EAAE;IACRJ,GAAG,EAAE,6KAA6K;IAClLC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV;AAAC,EACF;AAAAG,OAAA,CAAAR,mBAAA,GAAAA,mBAAA"}

package/cjs/elements/typography/Typography.d.ts

@@ -0,0 +1,55 @@
+/**
+ * HTML Element
+ *
+ */
+import React from 'react';
+import { SpacingProps } from '../../components/space/types';
+import type { DynamicElement } from '../../shared/types';
+export type TypographySize = 'x-small' | 'small' | 'basis' | 'medium' | 'large' | 'x-large' | 'xx-large';
+export type TypographyAlign = 'center' | 'left' | 'right';
+export type TypographyFamily = 'basis' | 'heading' | 'monospace';
+export type TypographyWeight = 'regular' | 'medium' | 'bold';
+export type TypographyDecoration = 'underline';
+export type TypographySlant = 'italic';
+export type TypographyProps<ElementType extends HTMLElement = HTMLElement> = SpacingProps & React.HTMLAttributes<ElementType> & {
+    /**
+     * Defines the Element Type, like "p".
+     */
+    element?: DynamicElement;
+    /**
+     * Sets the font size, also sets the line-height if `line` prop is not set
+     */
+    size?: TypographySize;
+    /**
+     * Sets the line height, will use same value as `size` if not set.
+     */
+    lineHeight?: TypographySize;
+    /**
+     * Sets the text alignment
+     */
+    align?: TypographyAlign;
+    /**
+     * Sets the font family
+     */
+    family?: TypographyFamily;
+    /**
+     * Sets the font weight
+     */
+    weight?: TypographyWeight;
+    /**
+     * Sets the font decoration
+     */
+    decoration?: TypographyDecoration;
+    /**
+     * Sets the font style
+     */
+    slant?: TypographySlant;
+};
+type TypographyInternalProps = {
+    innerRef?: React.RefObject<HTMLElement> | React.ForwardedRef<unknown>;
+};
+declare const Typography: {
+    ({ element, className, size, lineHeight, align, family, weight, decoration, slant, ...props }: TypographyProps & TypographyInternalProps): import("react/jsx-runtime").JSX.Element;
+    _supportsSpacingProps: boolean;
+};
+export default Typography;

package/cjs/elements/typography/Typography.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _Element = _interopRequireDefault(require("../Element"));
+const _excluded = ["element", "className", "size", "lineHeight", "align", "family", "weight", "decoration", "slant"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+const Typography = _ref => {
+  let {
+      element = 'p',
+      className,
+      size,
+      lineHeight,
+      align,
+      family,
+      weight,
+      decoration,
+      slant
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return _react.default.createElement(_Element.default, _extends({
+    as: element
+  }, props, {
+    className: (0, _classnames.default)(className, (lineHeight || size) && `dnb-t__line-height--${lineHeight || size}`, size && `dnb-t__size--${size}`, align && `dnb-t__align--${align}`, family && `dnb-t__family--${family}`, weight && `dnb-t__weight--${weight}`, decoration && `dnb-t__decoration--${decoration}`, slant && `dnb-t__slant--${slant}`)
+  }));
+};
+Typography._supportsSpacingProps = true;
+var _default = Typography;
+exports.default = _default;
+//# sourceMappingURL=Typography.js.map

package/cjs/elements/typography/Typography.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typography.js","names":["_react","_interopRequireDefault","require","_classnames","_Element","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Typography","_ref","element","className","size","lineHeight","align","family","weight","decoration","slant","props","createElement","as","classnames","_supportsSpacingProps","_default","exports"],"sources":["../../../../src/elements/typography/Typography.tsx"],"sourcesContent":["/**\n * HTML Element\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport { SpacingProps } from '../../components/space/types'\nimport type { DynamicElement } from '../../shared/types'\nimport E from '../Element'\n\nexport type TypographySize =\n  | 'x-small'\n  | 'small'\n  | 'basis'\n  | 'medium'\n  | 'large'\n  | 'x-large'\n  | 'xx-large'\n\nexport type TypographyAlign = 'center' | 'left' | 'right'\nexport type TypographyFamily = 'basis' | 'heading' | 'monospace'\nexport type TypographyWeight = 'regular' | 'medium' | 'bold'\nexport type TypographyDecoration = 'underline'\nexport type TypographySlant = 'italic'\n\nexport type TypographyProps<\n  ElementType extends HTMLElement = HTMLElement,\n> = SpacingProps &\n  React.HTMLAttributes<ElementType> & {\n    /**\n     * Defines the Element Type, like \"p\".\n     */\n    element?: DynamicElement\n    /**\n     * Sets the font size, also sets the line-height if `line` prop is not set\n     */\n    size?: TypographySize\n    /**\n     * Sets the line height, will use same value as `size` if not set.\n     */\n    lineHeight?: TypographySize\n    /**\n     * Sets the text alignment\n     */\n    align?: TypographyAlign\n    /**\n     * Sets the font family\n     */\n    family?: TypographyFamily\n    /**\n     * Sets the font weight\n     */\n    weight?: TypographyWeight\n    /**\n     * Sets the font decoration\n     */\n    decoration?: TypographyDecoration\n    /**\n     * Sets the font style\n     */\n    slant?: TypographySlant\n  }\n\ntype TypographyInternalProps = {\n  innerRef?: React.RefObject<HTMLElement> | React.ForwardedRef<unknown>\n}\n\nconst Typography = ({\n  element = 'p',\n  className,\n  size,\n  lineHeight,\n  align,\n  family,\n  weight,\n  decoration,\n  slant,\n  ...props\n}: TypographyProps & TypographyInternalProps) => {\n  return (\n    <E\n      as={element}\n      {...props}\n      className={classnames(\n        className,\n        size && `dnb-t__size--${size}`,\n        align && `dnb-t__align--${align}`,\n        family && `dnb-t__family--${family}`,\n        weight && `dnb-t__weight--${weight}`,\n        decoration && `dnb-t__decoration--${decoration}`,\n        slant && `dnb-t__slant--${slant}`,\n        (lineHeight || size) && `dnb-t__line-height--${lineHeight || size}`\n      )}\n    />\n  )\n}\n\nTypography._supportsSpacingProps = true\n\nexport default Typography\n"],"mappings":"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"}

package/cjs/elements/typography/TypographyDocs.d.ts

@@ -0,0 +1,2 @@
+import { PropertiesTableProps } from '../../shared/types';
+export declare const TypographyProperties: PropertiesTableProps;

package/cjs/elements/typography/TypographyDocs.js

@@ -0,0 +1,55 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TypographyProperties = void 0;
+const TypographyProperties = {
+  element: {
+    doc: 'Defines the Element Type, like `p`.',
+    type: ['HTMLElement', 'string'],
+    status: 'optional'
+  },
+  size: {
+    doc: 'Sets the font size, also sets the line-height if `lineHeight` prop is not set.',
+    type: [`'x-small'`, `'small'`, `'basis'`, `'medium'`, `'large'`, `'x-large'`, `'xx-large'`],
+    status: 'optional'
+  },
+  lineHeight: {
+    doc: 'Sets the line height, will use same value as `size` if not set.',
+    type: [`'x-small'`, `'small'`, `'basis'`, `'medium'`, `'large'`, `'x-large'`, `'xx-large'`],
+    status: 'optional'
+  },
+  align: {
+    doc: 'Sets the text alignment.',
+    type: [`'center'`, `'left'`, `'right'`],
+    status: 'optional'
+  },
+  family: {
+    doc: 'Sets the font family.',
+    type: [`'basis'`, `'heading'`, `'monospace'`],
+    status: 'optional'
+  },
+  weight: {
+    doc: 'Sets the font weight.',
+    type: [`'regular'`, `'medium'`],
+    status: 'optional'
+  },
+  decoration: {
+    doc: 'Sets the font decoration.',
+    type: `'underline'`,
+    status: 'optional'
+  },
+  slant: {
+    doc: 'Sets the font style.',
+    type: `'italic'`,
+    status: 'optional'
+  },
+  '[Space](/uilib/layout/space/properties)': {
+    doc: 'Spacing properties like `top` or `bottom` are supported.',
+    type: ['string', 'object'],
+    status: 'optional'
+  }
+};
+exports.TypographyProperties = TypographyProperties;
+//# sourceMappingURL=TypographyDocs.js.map

package/cjs/elements/typography/TypographyDocs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TypographyDocs.js","names":["TypographyProperties","element","doc","type","status","size","lineHeight","align","family","weight","decoration","slant","exports"],"sources":["../../../../src/elements/typography/TypographyDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const TypographyProperties: PropertiesTableProps = {\n  element: {\n    doc: 'Defines the Element Type, like `p`.',\n    type: ['HTMLElement', 'string'],\n    status: 'optional',\n  },\n  size: {\n    doc: 'Sets the font size, also sets the line-height if `lineHeight` prop is not set.',\n    type: [\n      `'x-small'`,\n      `'small'`,\n      `'basis'`,\n      `'medium'`,\n      `'large'`,\n      `'x-large'`,\n      `'xx-large'`,\n    ],\n    status: 'optional',\n  },\n  lineHeight: {\n    doc: 'Sets the line height, will use same value as `size` if not set.',\n    type: [\n      `'x-small'`,\n      `'small'`,\n      `'basis'`,\n      `'medium'`,\n      `'large'`,\n      `'x-large'`,\n      `'xx-large'`,\n    ],\n    status: 'optional',\n  },\n  align: {\n    doc: 'Sets the text alignment.',\n    type: [`'center'`, `'left'`, `'right'`],\n    status: 'optional',\n  },\n  family: {\n    doc: 'Sets the font family.',\n    type: [`'basis'`, `'heading'`, `'monospace'`],\n    status: 'optional',\n  },\n  weight: {\n    doc: 'Sets the font weight.',\n    type: [`'regular'`, `'medium'`],\n    status: 'optional',\n  },\n  decoration: {\n    doc: 'Sets the font decoration.',\n    type: `'underline'`,\n    status: 'optional',\n  },\n  slant: {\n    doc: 'Sets the font style.',\n    type: `'italic'`,\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n"],"mappings":";;;;;;AAEO,MAAMA,oBAA0C,GAAG;EACxDC,OAAO,EAAE;IACPC,GAAG,EAAE,qCAAqC;IAC1CC,IAAI,EAAE,CAAC,aAAa,EAAE,QAAQ,CAAC;IAC/BC,MAAM,EAAE;EACV,CAAC;EACDC,IAAI,EAAE;IACJH,GAAG,EAAE,gFAAgF;IACrFC,IAAI,EAAE,CACH,WAAU,EACV,SAAQ,EACR,SAAQ,EACR,UAAS,EACT,SAAQ,EACR,WAAU,EACV,YAAW,CACb;IACDC,MAAM,EAAE;EACV,CAAC;EACDE,UAAU,EAAE;IACVJ,GAAG,EAAE,iEAAiE;IACtEC,IAAI,EAAE,CACH,WAAU,EACV,SAAQ,EACR,SAAQ,EACR,UAAS,EACT,SAAQ,EACR,WAAU,EACV,YAAW,CACb;IACDC,MAAM,EAAE;EACV,CAAC;EACDG,KAAK,EAAE;IACLL,GAAG,EAAE,0BAA0B;IAC/BC,IAAI,EAAE,CAAE,UAAS,EAAG,QAAO,EAAG,SAAQ,CAAC;IACvCC,MAAM,EAAE;EACV,CAAC;EACDI,MAAM,EAAE;IACNN,GAAG,EAAE,uBAAuB;IAC5BC,IAAI,EAAE,CAAE,SAAQ,EAAG,WAAU,EAAG,aAAY,CAAC;IAC7CC,MAAM,EAAE;EACV,CAAC;EACDK,MAAM,EAAE;IACNP,GAAG,EAAE,uBAAuB;IAC5BC,IAAI,EAAE,CAAE,WAAU,EAAG,UAAS,CAAC;IAC/BC,MAAM,EAAE;EACV,CAAC;EACDM,UAAU,EAAE;IACVR,GAAG,EAAE,2BAA2B;IAChCC,IAAI,EAAG,aAAY;IACnBC,MAAM,EAAE;EACV,CAAC;EACDO,KAAK,EAAE;IACLT,GAAG,EAAE,sBAAsB;IAC3BC,IAAI,EAAG,UAAS;IAChBC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC;AAAAQ,OAAA,CAAAZ,oBAAA,GAAAA,oBAAA"}

package/cjs/elements/typography/style/_dnb-t.scss

@@ -0,0 +1,93 @@
+/*
+ * Typography
+ * Universal set of helper classes that do not have a specific element. 
+ * The class ".dnb-t" does nothing, only it's modifiers ".dnb-t__[***]" do.
+ */
+.dnb-t {
+  // size
+  &__size--xx-large {
+    font-size: var(--font-size-xx-large);
+  }
+  &__size--x-large {
+    font-size: var(--font-size-x-large);
+  }
+  &__size--large {
+    font-size: var(--font-size-large);
+  }
+  &__size--medium {
+    font-size: var(--font-size-medium);
+  }
+  &__size--basis {
+    font-size: var(--font-size-basis);
+  }
+  &__size--small {
+    font-size: var(--font-size-small);
+  }
+  &__size--x-small {
+    font-size: var(--font-size-x-small);
+  }
+
+  // line height
+  &__line-height--xx-large {
+    line-height: var(--line-height-xx-large);
+  }
+  &__line-height--x-large {
+    line-height: var(--line-height-x-large);
+  }
+  &__line-height--large {
+    line-height: var(--line-height-large);
+  }
+  &__line-height--medium {
+    line-height: var(--line-height-medium);
+  }
+  &__line-height--basis {
+    line-height: var(--line-height-basis);
+  }
+  &__line-height--small {
+    line-height: var(--line-height-small);
+  }
+  &__line-height--x-small {
+    line-height: var(--line-height-x-small);
+  }
+
+  // weight
+  &__weight--regular {
+    font-weight: var(--font-weight-regular);
+  }
+  &__weight--medium {
+    font-weight: var(--font-weight-medium);
+  }
+  &__weight--bold {
+    font-weight: var(--font-weight-bold);
+  }
+
+  // alignement
+  &__align--center {
+    text-align: center;
+  }
+  &__align--left {
+    text-align: left;
+  }
+  &__align--right {
+    text-align: right;
+  }
+
+  // family
+  &__family--default {
+    font-family: var(--font-family-default);
+  }
+  &__family--heading {
+    font-family: var(--font-family-heading);
+  }
+  &__family--monospace {
+    font-family: var(--font-family-monospace);
+  }
+
+  // underline / italic
+  &__decoration--underline {
+    text-decoration: underline;
+  }
+  &__slant--italic {
+    font-style: italic;
+  }
+}

package/cjs/elements/typography/style/dnb-typography.scss

@@ -7,7 +7,6 @@
 @import './typography-mixins.scss';
 
 @include typographySelectors() {
-  --typography-h-default-font-family: var(--font-family-default);
   --typography-h-default-font-weight: var(--font-weight-medium);
 
   // Heading xx-large
@@ -94,6 +93,8 @@ sub {
   @include paragraphStyle();
 }
 
+@import './dnb-t.scss';
+
 // Tables
 .dnb-table {
   b,

package/cjs/elements/typography/style/themes/dnb-typography-theme-sbanken.scss

@@ -18,7 +18,6 @@
 }
 
 @include typography.typographySelectors() {
-  --typography-h-default-font-family: var(--sb-font-family-headings);
   --typography-h-xx-large-weight: var(--font-weight-regular);
   --typography-h-x-large-weight: var(--font-weight-regular);
   --typography-h-large-small-font-size: var(--sb-font-size-medium--plus);