oolib 2.177.4 → 2.178.0

package/dist/v2/components/Tags/Comps/TagDisplay/getTagDisplayStyles.d.ts

@@ -0,0 +1,9 @@
+export function getTagDisplayStyles({ variant }: {
+    variant: any;
+}): {
+    backgroundColor: string;
+    backdropFilter?: undefined;
+} | {
+    backgroundColor: string;
+    backdropFilter: string;
+};

package/dist/v2/components/Tags/Comps/TagDisplay/getTagDisplayStyles.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getTagDisplayStyles = void 0;
+var themes_1 = require("../../../../themes");
+var grey40 = themes_1.colors.grey40, green = themes_1.colors.green, yellow = themes_1.colors.yellow, blue = themes_1.colors.blue, error = themes_1.colors.error, purple = themes_1.colors.purple;
+var getTagDisplayStyles = function (_a) {
+    var variant = _a.variant;
+    switch (variant) {
+        case "positive":
+            return {
+                backgroundColor: green,
+            };
+        case "inProgress":
+            return {
+                backgroundColor: blue,
+            };
+        case "warning":
+            return {
+                backgroundColor: yellow,
+            };
+        case "negative":
+            return {
+                backgroundColor: error,
+            };
+        case "special":
+            return {
+                backgroundColor: purple,
+            };
+        default:
+            return {
+                backgroundColor: grey40,
+                backdropFilter: "blur(10px)",
+            };
+    }
+};
+exports.getTagDisplayStyles = getTagDisplayStyles;

package/dist/v2/components/Tags/Comps/TagDisplay/index.d.ts

@@ -1,26 +1,14 @@
-import React, { FunctionComponent } from 'react';
-export interface TagDisplayProps {
+import React from 'react';
+import { TagInterface } from '../Tag';
+export interface TagDisplayInterface extends Omit<TagInterface, 'variant'> {
+    id?: string;
     display: string;
-    title?: string;
-    style?: React.CSSProperties;
-    M?: boolean;
-    XS?: boolean;
+    size?: "XS" | "S" | "M";
     tagColor?: string;
     textColor?: string;
-    variant?: 'positive' | 'inProgress' | 'warning' | 'negative' | 'special' | 'grey' | "default";
+    fill?: string;
+    icon?: string;
+    weight?: "bold" | "light" | "default";
+    variant: 'positive' | 'inProgress' | 'warning' | 'negative' | 'special' | "default";
 }
-/**
- * @component Renders a TagDisplay component with customizable text, style and variant.
- *
- * - The props object containing the following properties:
- * @prop {string} display: The text to be displayed inside the TagDisplay component.
- * @prop {React.CSSProperties} style: Additional CSS styles to apply to the TagDisplay.
- * @prop {boolean} [M] : A boolean indicating whether the component should render at the large size. Defaults to false.
- * @prop {boolean} [XS] : A boolean indicating whether the component should render at the extra small size. Defaults to false.
- * @prop {string} [tagColor] : A string indicating the background color of the component. Defaults to undefined.
- * @prop {red | green | black} [color] : A string indicating the background color of the component. Defaults to undefined.
- * @prop {string} [textColor] : A string indicating the text color of the component. Defaults to undefined.
- * @prop {('primary' | 'secondary')} [variant] : A string indicating the variant of the component. Defaults to "primary".
- * @return {ReactElement} The rendered TagDisplay component.
- */
-export declare const TagDisplay: FunctionComponent<TagDisplayProps>;
+export declare const TagDisplay: React.FunctionComponent<TagDisplayInterface>;

package/dist/v2/components/Tags/Comps/TagDisplay/index.js

@@ -1,31 +1,31 @@
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TagDisplay = void 0;
 var react_1 = __importDefault(require("react"));
-var styled_1 = require("./styled");
-var getTypoComp_1 = require("../../utils/getTypoComp");
-/**
- * @component Renders a TagDisplay component with customizable text, style and variant.
- *
- * - The props object containing the following properties:
- * @prop {string} display: The text to be displayed inside the TagDisplay component.
- * @prop {React.CSSProperties} style: Additional CSS styles to apply to the TagDisplay.
- * @prop {boolean} [M] : A boolean indicating whether the component should render at the large size. Defaults to false.
- * @prop {boolean} [XS] : A boolean indicating whether the component should render at the extra small size. Defaults to false.
- * @prop {string} [tagColor] : A string indicating the background color of the component. Defaults to undefined.
- * @prop {red | green | black} [color] : A string indicating the background color of the component. Defaults to undefined.
- * @prop {string} [textColor] : A string indicating the text color of the component. Defaults to undefined.
- * @prop {('primary' | 'secondary')} [variant] : A string indicating the variant of the component. Defaults to "primary".
- * @return {ReactElement} The rendered TagDisplay component.
- */
+var Typo2_1 = require("../../../Typo2");
+var Tag_1 = require("../Tag");
+var themes_1 = require("../../../../themes");
+var getTagDisplayStyles_1 = require("./getTagDisplayStyles");
+var white = themes_1.colors.white;
 var TagDisplay = function (_a) {
-    var display = _a.display, title = _a.title, style = _a.style, M = _a.M, XS = _a.XS, tagColor = _a.tagColor, textColor = _a.textColor, _b = _a.variant, variant = _b === void 0 ? 'default' : _b;
-    var size = M ? 'M' : XS ? 'XS' : 'S';
-    var TYPO_COMP = (0, getTypoComp_1.getTypoComp)({ typo: "tag" }); // secondary variant has a different typo - "UI_CAPTION"
-    return (react_1.default.createElement(styled_1.StyledTagDisplay, { variant: variant, textColor: textColor, tagColor: tagColor, size: size, style: style, title: title },
-        react_1.default.createElement(TYPO_COMP, null, display)));
+    var id = _a.id, display = _a.display, size = _a.size, 
+    // tagColor,
+    // textColor,
+    fill = _a.fill, icon = _a.icon, _b = _a.variant, variant = _b === void 0 ? 'default' : _b, weight = _a.weight;
+    return (react_1.default.createElement(Tag_1.Tag, { weight: weight, id: id, display: display, icon: icon, size: size, fill: fill, style: __assign({ padding: "0.25rem 0.5rem", borderRadius: "4px", color: white }, (0, getTagDisplayStyles_1.getTagDisplayStyles)({ variant: variant })), typo: Typo2_1.UI_TAG_DF }));
 };
 exports.TagDisplay = TagDisplay;

package/dist/v2/components/Tags/Comps/TagLink/index.d.ts

@@ -1,24 +1,11 @@
-import { FunctionComponent } from "react";
+import React, { FunctionComponent } from "react";
+export declare const StyledLink: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("react-router-dom").NavLinkProps & React.RefAttributes<HTMLAnchorElement>>, any, {}, never>;
 export interface TagLinkProps {
     display: string;
     to: string;
-    invert?: boolean;
-    M?: boolean;
-    XS?: boolean;
-    variant?: 'primary' | 'secondary';
-    color?: 'red' | 'green' | 'black';
+    id?: string;
+    fill: "solid" | "outline";
+    size?: "S" | "XS";
+    weight?: "bold" | "light" | "default";
 }
-/**
- * @component Renders a TagLink component with customizable text, URL, style and variant.
- *
- * - The props object containing the following properties:
- * @prop {string} display: The text to be displayed inside the TagLink component.
- * @prop {string} to: The URL to navigate to when the component is clicked.
- * @prop {boolean} [invert] : A boolean indicating whether to invert the colors of the component. Defaults to false.
- * @prop {boolean} [M] : A boolean indicating whether the component should render at the large size. Defaults to false.
- * @prop {boolean} [XS] : A boolean indicating whether the component should render at the extra small size. Defaults to false.
- * @prop {string} [variant] : A string indicating the variant of the component. Defaults to "primary".
- * @prop {string} [color] : A string indicating the background color of the component. Defaults to undefined.
- * @return {ReactElement} The rendered TagLink component.
- */
 export declare const TagLink: FunctionComponent<TagLinkProps>;

package/dist/v2/components/Tags/Comps/TagLink/index.js

@@ -1,69 +1,22 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (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 () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TagLink = void 0;
-var react_1 = __importStar(require("react"));
-var styled_1 = require("./styled");
-var icons_1 = require("../../../../../icons");
-var styled_components_1 = require("styled-components");
-var getTypoComp_1 = require("../../utils/getTypoComp");
-var ArrowLineUpRight = icons_1.icons.ArrowLineUpRight;
-/**
- * @component Renders a TagLink component with customizable text, URL, style and variant.
- *
- * - The props object containing the following properties:
- * @prop {string} display: The text to be displayed inside the TagLink component.
- * @prop {string} to: The URL to navigate to when the component is clicked.
- * @prop {boolean} [invert] : A boolean indicating whether to invert the colors of the component. Defaults to false.
- * @prop {boolean} [M] : A boolean indicating whether the component should render at the large size. Defaults to false.
- * @prop {boolean} [XS] : A boolean indicating whether the component should render at the extra small size. Defaults to false.
- * @prop {string} [variant] : A string indicating the variant of the component. Defaults to "primary".
- * @prop {string} [color] : A string indicating the background color of the component. Defaults to undefined.
- * @return {ReactElement} The rendered TagLink component.
- */
+exports.TagLink = exports.StyledLink = void 0;
+var react_1 = __importDefault(require("react"));
+var Tag_1 = require("../Tag");
+var styled_components_1 = __importDefault(require("styled-components"));
+var react_router_dom_1 = require("react-router-dom");
+exports.StyledLink = (0, styled_components_1.default)(react_router_dom_1.NavLink)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  text-decoration: none;\n"], ["\n  text-decoration: none;\n"])));
 var TagLink = function (_a) {
-    var display = _a.display, to = _a.to, M = _a.M, XS = _a.XS, _b = _a.variant, variant = _b === void 0 ? 'primary' : _b, color = _a.color;
-    var size = M ? 'M' : XS ? 'XS' : 'S';
-    var TYPO_COMP = (0, getTypoComp_1.getTypoComp)({ typo: "captionSemiBold" });
-    var _c = (0, react_1.useState)(false), hoverTag = _c[0], setHoverOnTag = _c[1];
-    var theme = (0, styled_components_1.useTheme)();
-    return (react_1.default.createElement(styled_1.StyledLink, { to: to },
-        react_1.default.createElement(styled_1.StyledTagLink, { color: color, variant: variant, size: size, onMouseEnter: function () { return setHoverOnTag(true); }, onMouseLeave: function () { return setHoverOnTag(false); } },
-            react_1.default.createElement(TYPO_COMP, null, display),
-            hoverTag &&
-                react_1.default.createElement(styled_1.StyledLinkIconWrapper, { theme: theme },
-                    react_1.default.createElement(ArrowLineUpRight, { style: { marginRight: '-0.3rem' }, size: 14, weight: 'bold' })))));
+    var display = _a.display, to = _a.to, id = _a.id, fill = _a.fill, size = _a.size, weight = _a.weight;
+    return (react_1.default.createElement(exports.StyledLink, { to: to },
+        react_1.default.createElement(Tag_1.Tag, { id: id, display: display, icon: "ArrowLineUpRight", size: size || "S", variant: "link", fill: fill, weight: weight })));
 };
 exports.TagLink = TagLink;
+var templateObject_1;

package/dist/v2/components/Tags/Comps/styled.d.ts

@@ -1,25 +0,0 @@
-import { ColorsType } from '../../../../themes/colors';
-interface CommonStyleProps {
-    size: keyof typeof SIZES;
-}
-interface TextColorProps {
-    invert?: boolean;
-    colors?: ColorsType;
-}
-export interface HoverProps {
-    invert?: boolean;
-    colors: ColorsType;
-}
-export declare const SIZES: {
-    XS: string;
-    S: string;
-    M: string;
-};
-export declare const commonStyle: ({ size }: CommonStyleProps) => string;
-export declare const textColor: ({ invert }: TextColorProps) => import("styled-components").FlattenSimpleInterpolation;
-export declare const blueHover: ({ invert, colors }: HoverProps) => import("styled-components").FlattenSimpleInterpolation;
-export declare const redHover: ({ invert }: TextColorProps) => import("styled-components").FlattenSimpleInterpolation;
-export declare const greenHover: ({ invert }: TextColorProps) => import("styled-components").FlattenSimpleInterpolation;
-export declare const blackHover: ({ invert }: TextColorProps) => import("styled-components").FlattenSimpleInterpolation;
-export declare const greyHover: ({ invert }: TextColorProps) => import("styled-components").FlattenSimpleInterpolation;
-export {};

package/dist/v2/components/Tags/Comps/styled.js

@@ -1,52 +1,35 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.greyHover = exports.blackHover = exports.greenHover = exports.redHover = exports.blueHover = exports.textColor = exports.commonStyle = exports.SIZES = void 0;
-var styled_components_1 = require("styled-components");
-var colors_1 = require("../../../../themes/colors");
-var utilsOolib_1 = require("../../../../utilsOolib");
-var greyColor100 = colors_1.colors.greyColor100, greyColor80 = colors_1.colors.greyColor80, greyColor10 = colors_1.colors.greyColor10, white = colors_1.colors.white, greyColor5 = colors_1.colors.greyColor5, hoverRed = colors_1.colors.hoverRed, hoverInvertRed = colors_1.colors.hoverInvertRed, hoverGreen = colors_1.colors.hoverGreen, invertHoverGreen = colors_1.colors.invertHoverGreen;
-exports.SIZES = {
-    XS: '1.8rem',
-    S: "2.5rem",
-    M: "3rem",
-};
-var commonStyle = function (_a) {
-    var size = _a.size;
-    return "\n  padding: ".concat(size === 'XS' ? '0.5rem' : '1rem', ";\n  border-radius: 4px;\n  position: relative;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  white-space: nowrap;\n  max-width: 100%;\n");
-};
-exports.commonStyle = commonStyle;
-var textColor = function (_a) {
-    var invert = _a.invert;
-    return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), invert ? greyColor100 : white);
-};
-exports.textColor = textColor;
-var blueHover = function (_a) {
-    var invert = _a.invert, colors = _a.colors;
-    return (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  @media (hover: hover) {\n    &:hover {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n"], ["\n  @media (hover: hover) {\n    &:hover {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n"])), invert ? (0, utilsOolib_1.getPrimaryColor10)(colors) : (0, utilsOolib_1.getPrimaryColor40)(colors), invert ? greyColor100 : (0, utilsOolib_1.getPrimaryColorText)(colors));
-};
-exports.blueHover = blueHover;
-var redHover = function (_a) {
-    var invert = _a.invert;
-    return (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  @media (hover: hover) {\n    &:hover {\n      background-color: ", ";\n    }\n  }\n"], ["\n  @media (hover: hover) {\n    &:hover {\n      background-color: ", ";\n    }\n  }\n"])), invert ? hoverInvertRed : hoverRed);
-};
-exports.redHover = redHover;
-var greenHover = function (_a) {
-    var invert = _a.invert;
-    return (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  @media (hover: hover) {\n    &:hover {\n      background-color: ", ";\n    }\n  }\n"], ["\n  @media (hover: hover) {\n    &:hover {\n      background-color: ", ";\n    }\n  }\n"])), invert ? invertHoverGreen : hoverGreen);
-};
-exports.greenHover = greenHover;
-var blackHover = function (_a) {
-    var invert = _a.invert;
-    return (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  @media (hover: hover) {\n    &:hover {\n      background-color: ", ";\n    }\n  }\n"], ["\n  @media (hover: hover) {\n    &:hover {\n      background-color: ", ";\n    }\n  }\n"])), invert ? greyColor5 : greyColor80);
-};
-exports.blackHover = blackHover;
-var greyHover = function (_a) {
-    var invert = _a.invert;
-    return (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  @media (hover: hover) {\n    &:hover {\n      background-color: ", ";\n    }\n  }\n"], ["\n  @media (hover: hover) {\n    &:hover {\n      background-color: ", ";\n    }\n  }\n"])), invert ? greyColor80 : greyColor10);
-};
-exports.greyHover = greyHover;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
+// import { css } from 'styled-components';
+// import { colors, Colors2Type } from '../../../themes/colors';
+// const {
+//   grey10,
+//   white,
+// } = colors;
+// interface CommonStyleProps {
+//   size: keyof typeof SIZES;
+// }
+// interface TextColorProps {
+//   invert?: boolean;
+//   colors?: Colors2Type;
+// }
+// export interface HoverProps {
+//   invert?: boolean;
+//   colors: Colors2Type;
+// }
+// export const SIZES = {
+//   XS: '1.8rem',
+//   S: `2.5rem`,
+//   M: `3rem`,
+// };
+// export const commonStyle = ({ size }: CommonStyleProps) => `
+//   padding: ${size === 'XS' ? '0.5rem' : size === "S" ? '0.8rem' : "1rem"};
+//   border-radius: 4px;
+//   position: relative;
+//   display: inline-flex;
+//   justify-content: center;
+//   align-items: center;
+//   white-space: nowrap;
+//   max-width: 100%;
+// `;
+// export const textColor = ({ invert }: TextColorProps) => css`
+//   color: ${invert ? grey10 : white};
+// `;

package/dist/v2/components/Tags/index.d.ts

@@ -1,3 +1,4 @@
 export { TagDisplay } from './Comps/TagDisplay';
 export { TagClear } from './Comps/TagClear';
 export { TagLink } from './Comps/TagLink';
+export { Tag } from './Comps/Tag';

package/dist/v2/components/Tags/index.js

@@ -1,9 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TagLink = exports.TagClear = exports.TagDisplay = void 0;
+exports.Tag = exports.TagLink = exports.TagClear = exports.TagDisplay = void 0;
 var TagDisplay_1 = require("./Comps/TagDisplay");
 Object.defineProperty(exports, "TagDisplay", { enumerable: true, get: function () { return TagDisplay_1.TagDisplay; } });
 var TagClear_1 = require("./Comps/TagClear");
 Object.defineProperty(exports, "TagClear", { enumerable: true, get: function () { return TagClear_1.TagClear; } });
 var TagLink_1 = require("./Comps/TagLink");
 Object.defineProperty(exports, "TagLink", { enumerable: true, get: function () { return TagLink_1.TagLink; } });
+var Tag_1 = require("./Comps/Tag");
+Object.defineProperty(exports, "Tag", { enumerable: true, get: function () { return Tag_1.Tag; } });

package/dist/v2/components/Typo2/index.d.ts

@@ -51,6 +51,7 @@ export declare const UI_CAPTION_BOLD_DF: React.FunctionComponent<TypoCompProps>;
 export declare const UI_CAPTION_SEMIBOLD_DF: React.FunctionComponent<TypoCompProps>;
 export declare const UI_CAPTION_SEMIBOLD: React.FunctionComponent<TypoCompProps>;
 export declare const UI_TAG: React.FunctionComponent<TypoCompProps>;
+export declare const UI_TAG_DF: React.FunctionComponent<TypoCompProps>;
 export declare const UI_HELPTEXT: React.FunctionComponent<TypoCompProps>;
 export declare const UI_STAT_LG: React.FunctionComponent<TypoCompProps>;
 export declare const UI_STAT_SM: React.FunctionComponent<TypoCompProps>;

package/dist/v2/components/Typo2/index.js

@@ -25,7 +25,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TypoV2ClassesProvider = exports.CONTENT_BODY_POSTIT = exports.CONTENT_TITLE_POSTIT = exports.CONTENT_QUOTE = exports.CONTENT_BODY_BOLD_ITALIC = exports.CONTENT_BODY_ITALIC = exports.CONTENT_BODY_BOLD = exports.CONTENT_BODY_SM = exports.CONTENT_BODY = exports.CONTENT_H3 = exports.CONTENT_H2 = exports.CONTENT_H1 = exports.UI_STAT_SM = exports.UI_STAT_LG = exports.UI_HELPTEXT = exports.UI_TAG = exports.UI_CAPTION_SEMIBOLD = exports.UI_CAPTION_SEMIBOLD_DF = exports.UI_CAPTION_BOLD_DF = exports.UI_CAPTION_DF = exports.UI_CAPTION_BOLD = exports.UI_CAPTION = exports.UI_PARAGRAPH_BOLD = exports.UI_PARAGRAPH = exports.UI_BODY_BOLD_SM_DF = exports.UI_BODY_BOLD_DF = exports.UI_BODY_SEMIBOLD_SM_DF = exports.UI_BODY_SEMIBOLD_DF = exports.UI_BODY_SM_DF = exports.UI_BODY_DF = exports.UI_BODY_BOLD_SM = exports.UI_BODY_BOLD = exports.UI_BODY_SEMIBOLD_SM = exports.UI_BODY_SEMIBOLD = exports.UI_BODY_SM = exports.UI_BODY = exports.UI_TITLE_SM = exports.UI_TITLE = exports.UI_HEADLINE_SM = exports.UI_HEADLINE = exports.UI_DISPLAY_SM = exports.UI_DISPLAY = void 0;
+exports.TypoV2ClassesProvider = exports.CONTENT_BODY_POSTIT = exports.CONTENT_TITLE_POSTIT = exports.CONTENT_QUOTE = exports.CONTENT_BODY_BOLD_ITALIC = exports.CONTENT_BODY_ITALIC = exports.CONTENT_BODY_BOLD = exports.CONTENT_BODY_SM = exports.CONTENT_BODY = exports.CONTENT_H3 = exports.CONTENT_H2 = exports.CONTENT_H1 = exports.UI_STAT_SM = exports.UI_STAT_LG = exports.UI_HELPTEXT = exports.UI_TAG_DF = exports.UI_TAG = exports.UI_CAPTION_SEMIBOLD = exports.UI_CAPTION_SEMIBOLD_DF = exports.UI_CAPTION_BOLD_DF = exports.UI_CAPTION_DF = exports.UI_CAPTION_BOLD = exports.UI_CAPTION = exports.UI_PARAGRAPH_BOLD = exports.UI_PARAGRAPH = exports.UI_BODY_BOLD_SM_DF = exports.UI_BODY_BOLD_DF = exports.UI_BODY_SEMIBOLD_SM_DF = exports.UI_BODY_SEMIBOLD_DF = exports.UI_BODY_SM_DF = exports.UI_BODY_DF = exports.UI_BODY_BOLD_SM = exports.UI_BODY_BOLD = exports.UI_BODY_SEMIBOLD_SM = exports.UI_BODY_SEMIBOLD = exports.UI_BODY_SM = exports.UI_BODY = exports.UI_TITLE_SM = exports.UI_TITLE = exports.UI_HEADLINE_SM = exports.UI_HEADLINE = exports.UI_DISPLAY_SM = exports.UI_DISPLAY = void 0;
 var react_1 = __importDefault(require("react"));
 var index_styled_1 = require("./index.styled");
 var utilsOolib_1 = require("../../../utilsOolib");
@@ -125,6 +125,8 @@ var UI_CAPTION_SEMIBOLD = function (props) { return react_1.default.createElemen
 exports.UI_CAPTION_SEMIBOLD = UI_CAPTION_SEMIBOLD;
 var UI_TAG = function (props) { return react_1.default.createElement(GenComp, { props: props, Comp: index_styled_1.UI_TAG_STYLED }); };
 exports.UI_TAG = UI_TAG;
+var UI_TAG_DF = function (props) { return react_1.default.createElement(GenComp, { props: props, Comp: index_styled_1.UI_TAG_DF_STYLED }); };
+exports.UI_TAG_DF = UI_TAG_DF;
 var UI_HELPTEXT = function (props) { return react_1.default.createElement(GenComp, { props: props, Comp: index_styled_1.UI_HELPTEXT_STYLED }); };
 exports.UI_HELPTEXT = UI_HELPTEXT;
 var UI_STAT_LG = function (props) { return react_1.default.createElement(GenComp, { props: props, Comp: index_styled_1.UI_STAT_LG_STYLED }); };

package/dist/v2/components/Typo2/index.styled.d.ts

@@ -25,6 +25,7 @@ export declare const UI_CAPTION_BOLD_DF_STYLED: import("styled-components").Styl
 export declare const UI_CAPTION_SEMIBOLD_STYLED: import("styled-components").StyledComponent<"p", any, {}, never>;
 export declare const UI_CAPTION_SEMIBOLD_DF_STYLED: import("styled-components").StyledComponent<"p", any, {}, never>;
 export declare const UI_TAG_STYLED: import("styled-components").StyledComponent<"p", any, {}, never>;
+export declare const UI_TAG_DF_STYLED: import("styled-components").StyledComponent<"p", any, {}, never>;
 export declare const UI_HELPTEXT_STYLED: import("styled-components").StyledComponent<"p", any, {}, never>;
 export declare const UI_STAT_LG_STYLED: import("styled-components").StyledComponent<"h2", any, {}, never>;
 export declare const UI_STAT_SM_STYLED: import("styled-components").StyledComponent<"h3", any, {}, never>;

package/dist/v2/components/Typo2/index.styled.js

@@ -7,7 +7,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TYPO_V2_CLASSES = exports.CONTENT_BODY_POSTIT_STYLED = exports.CONTENT_TITLE_POSTIT_STYLED = exports.CONTENT_QUOTE_STYLED = exports.CONTENT_BODY_BOLD_ITALIC_STYLED = exports.CONTENT_BODY_ITALIC_STYLED = exports.CONTENT_BODY_BOLD_STYLED = exports.CONTENT_BODY_SM_STYLED = exports.CONTENT_BODY_STYLED = exports.CONTENT_H3_STYLED = exports.CONTENT_H2_STYLED = exports.CONTENT_H1_STYLED = exports.UI_STAT_SM_STYLED = exports.UI_STAT_LG_STYLED = exports.UI_HELPTEXT_STYLED = exports.UI_TAG_STYLED = exports.UI_CAPTION_SEMIBOLD_DF_STYLED = exports.UI_CAPTION_SEMIBOLD_STYLED = exports.UI_CAPTION_BOLD_DF_STYLED = exports.UI_CAPTION_DF_STYLED = exports.UI_CAPTION_BOLD_STYLED = exports.UI_CAPTION_STYLED = exports.UI_PARAGRAPH_BOLD_STYLED = exports.UI_PARAGRAPH_STYLED = exports.UI_BODY_BOLD_SM_DF_STYLED = exports.UI_BODY_SEMIBOLD_SM_DF_STYLED = exports.UI_BODY_SM_DF_STYLED = exports.UI_BODY_DF_STYLED = exports.UI_BODY_BOLD_DF_STYLED = exports.UI_BODY_SEMIBOLD_DF_STYLED = exports.UI_BODY_BOLD_SM_STYLED = exports.UI_BODY_BOLD_STYLED = exports.UI_BODY_SEMIBOLD_SM_STYLED = exports.UI_BODY_SEMIBOLD_STYLED = exports.UI_BODY_SM_STYLED = exports.UI_BODY_STYLED = exports.UI_TITLE_SM_STYLED = exports.UI_TITLE_STYLED = exports.UI_HEADLINE_SM_STYLED = exports.UI_HEADLINE_STYLED = exports.UI_DISPLAY_SM_STYLED = exports.UI_DISPLAY_STYLED = void 0;
+exports.TYPO_V2_CLASSES = exports.CONTENT_BODY_POSTIT_STYLED = exports.CONTENT_TITLE_POSTIT_STYLED = exports.CONTENT_QUOTE_STYLED = exports.CONTENT_BODY_BOLD_ITALIC_STYLED = exports.CONTENT_BODY_ITALIC_STYLED = exports.CONTENT_BODY_BOLD_STYLED = exports.CONTENT_BODY_SM_STYLED = exports.CONTENT_BODY_STYLED = exports.CONTENT_H3_STYLED = exports.CONTENT_H2_STYLED = exports.CONTENT_H1_STYLED = exports.UI_STAT_SM_STYLED = exports.UI_STAT_LG_STYLED = exports.UI_HELPTEXT_STYLED = exports.UI_TAG_DF_STYLED = exports.UI_TAG_STYLED = exports.UI_CAPTION_SEMIBOLD_DF_STYLED = exports.UI_CAPTION_SEMIBOLD_STYLED = exports.UI_CAPTION_BOLD_DF_STYLED = exports.UI_CAPTION_DF_STYLED = exports.UI_CAPTION_BOLD_STYLED = exports.UI_CAPTION_STYLED = exports.UI_PARAGRAPH_BOLD_STYLED = exports.UI_PARAGRAPH_STYLED = exports.UI_BODY_BOLD_SM_DF_STYLED = exports.UI_BODY_SEMIBOLD_SM_DF_STYLED = exports.UI_BODY_SM_DF_STYLED = exports.UI_BODY_DF_STYLED = exports.UI_BODY_BOLD_DF_STYLED = exports.UI_BODY_SEMIBOLD_DF_STYLED = exports.UI_BODY_BOLD_SM_STYLED = exports.UI_BODY_BOLD_STYLED = exports.UI_BODY_SEMIBOLD_SM_STYLED = exports.UI_BODY_SEMIBOLD_STYLED = exports.UI_BODY_SM_STYLED = exports.UI_BODY_STYLED = exports.UI_TITLE_SM_STYLED = exports.UI_TITLE_STYLED = exports.UI_HEADLINE_SM_STYLED = exports.UI_HEADLINE_STYLED = exports.UI_DISPLAY_SM_STYLED = exports.UI_DISPLAY_STYLED = void 0;
 var styled_components_1 = __importDefault(require("styled-components"));
 var typo_1 = require("../../themes/typo");
 // UI Fonts
@@ -38,22 +38,23 @@ exports.UI_CAPTION_BOLD_DF_STYLED = styled_components_1.default.p(templateObject
 exports.UI_CAPTION_SEMIBOLD_STYLED = styled_components_1.default.p(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.UI_CAPTION_SEMIBOLD);
 exports.UI_CAPTION_SEMIBOLD_DF_STYLED = styled_components_1.default.p(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.UI_CAPTION_SEMIBOLD_DF);
 exports.UI_TAG_STYLED = styled_components_1.default.p(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.UI_TAG);
-exports.UI_HELPTEXT_STYLED = styled_components_1.default.p(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.UI_HELPTEXT);
-exports.UI_STAT_LG_STYLED = styled_components_1.default.h2(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.UI_STAT_LG);
-exports.UI_STAT_SM_STYLED = styled_components_1.default.h3(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"
+exports.UI_TAG_DF_STYLED = styled_components_1.default.p(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.UI_TAG_DF);
+exports.UI_HELPTEXT_STYLED = styled_components_1.default.p(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.UI_HELPTEXT);
+exports.UI_STAT_LG_STYLED = styled_components_1.default.h2(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.UI_STAT_LG);
+exports.UI_STAT_SM_STYLED = styled_components_1.default.h3(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"
     // Content Fonts
 ])), typo_1.typo.UI_STAT_SM);
 // Content Fonts
-exports.CONTENT_H1_STYLED = styled_components_1.default.h1(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n  ", "  \n  "], ["\n  ", "  \n  "])), typo_1.typo.CONTENT_H1);
-exports.CONTENT_H2_STYLED = styled_components_1.default.h2(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n  ", "  \n"], ["\n  ", "  \n"])), typo_1.typo.CONTENT_H2);
-exports.CONTENT_H3_STYLED = styled_components_1.default.h3(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n  ", "  \n"], ["\n  ", "  \n"])), typo_1.typo.CONTENT_H3);
-exports.CONTENT_BODY_STYLED = styled_components_1.default.p(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY);
-exports.CONTENT_BODY_SM_STYLED = styled_components_1.default.p(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY_SM);
-exports.CONTENT_BODY_BOLD_STYLED = styled_components_1.default.p(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY_BOLD);
-exports.CONTENT_BODY_ITALIC_STYLED = styled_components_1.default.p(templateObject_37 || (templateObject_37 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY_ITALIC);
-exports.CONTENT_BODY_BOLD_ITALIC_STYLED = styled_components_1.default.p(templateObject_38 || (templateObject_38 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY_BOLD_ITALIC);
-exports.CONTENT_QUOTE_STYLED = styled_components_1.default.h4(templateObject_39 || (templateObject_39 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_QUOTE);
-exports.CONTENT_TITLE_POSTIT_STYLED = styled_components_1.default.p(templateObject_40 || (templateObject_40 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_TITLE_POSTIT);
-exports.CONTENT_BODY_POSTIT_STYLED = styled_components_1.default.p(templateObject_41 || (templateObject_41 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY_POSTIT);
-exports.TYPO_V2_CLASSES = styled_components_1.default.div(templateObject_42 || (templateObject_42 = __makeTemplateObject(["\n  .UI_DISPLAY {\n    ", "\n  }\n\n  .UI_HEADLINE {\n    ", "\n  }\n\n  .UI_HEADLINE_SM {\n    ", "\n  }\n\n  .UI_TITLE {\n    ", "\n  }\n\n  .UI_TITLE_SM {\n    ", "\n  }\n\n  .UI_TITLE_SM {\n    ", "\n  }\n\n  .UI_BODY {\n    ", "\n  }\n\n  .UI_BODY_SM {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_SM {\n    ", "\n  } \n\n  .UI_BODY_BOLD_DF {\n    ", "\n  }\n\n  .UI_BODY_BOLD_SM_DF {\n    ", "\n  }\n\n  .UI_BODY_DF {\n    ", "\n  }\n\n  .UI_BODY_SM_DF {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_DF {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_SM_DF {\n    ", "\n  } \n\n  .UI_BODY_BOLD_SM {\n    ", "\n  }\n\n  .UI_PARAGRAPH {\n    ", "\n  }\n\n  .UI_PARAGRAPH_BOLD {\n    ", "\n  }\n\n  .UI_CAPTION {\n    ", "\n  }\n\n  .UI_CAPTION_BOLD {\n    ", "\n  }\n\n  .UI_CAPTION_DF {\n    ", "\n  }\n  \n  .UI_CAPTION_BOLD_DF {\n    ", "\n  }\n\n  .UI_TAG {\n    ", "\n  }\n  \n  .UI_HELPTEXT {\n    ", "\n  }\n\n  .UI_STAT_LG {\n    ", "\n  }\n\n  .UI_STAT_SM {\n    ", "\n  }\n\n\n  .CONTENT_H1 {\n    ", "\n  }\n  .CONTENT_H2 {\n    ", "\n  }\n  .CONTENT_H3 {\n    ", "\n  }\n  .CONTENT_BODY {\n    ", "\n  }\n\n  .CONTENT_BODY_BOLD {\n    ", "\n  }\n  .CONTENT_BODY_ITALIC {\n    ", "\n  }\n  .CONTENT_BODY_BOLD_ITALIC {\n    ", "\n  }\n  .CONTENT_QUOTE {\n    ", "\n  }\n\n  .CONTENT_TITLE_POSTIT {\n    ", "\n  }\n  .CONTENT_BODY_POSTIT {\n    ", "\n  }\n"], ["\n  .UI_DISPLAY {\n    ", "\n  }\n\n  .UI_HEADLINE {\n    ", "\n  }\n\n  .UI_HEADLINE_SM {\n    ", "\n  }\n\n  .UI_TITLE {\n    ", "\n  }\n\n  .UI_TITLE_SM {\n    ", "\n  }\n\n  .UI_TITLE_SM {\n    ", "\n  }\n\n  .UI_BODY {\n    ", "\n  }\n\n  .UI_BODY_SM {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_SM {\n    ", "\n  } \n\n  .UI_BODY_BOLD_DF {\n    ", "\n  }\n\n  .UI_BODY_BOLD_SM_DF {\n    ", "\n  }\n\n  .UI_BODY_DF {\n    ", "\n  }\n\n  .UI_BODY_SM_DF {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_DF {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_SM_DF {\n    ", "\n  } \n\n  .UI_BODY_BOLD_SM {\n    ", "\n  }\n\n  .UI_PARAGRAPH {\n    ", "\n  }\n\n  .UI_PARAGRAPH_BOLD {\n    ", "\n  }\n\n  .UI_CAPTION {\n    ", "\n  }\n\n  .UI_CAPTION_BOLD {\n    ", "\n  }\n\n  .UI_CAPTION_DF {\n    ", "\n  }\n  \n  .UI_CAPTION_BOLD_DF {\n    ", "\n  }\n\n  .UI_TAG {\n    ", "\n  }\n  \n  .UI_HELPTEXT {\n    ", "\n  }\n\n  .UI_STAT_LG {\n    ", "\n  }\n\n  .UI_STAT_SM {\n    ", "\n  }\n\n\n  .CONTENT_H1 {\n    ", "\n  }\n  .CONTENT_H2 {\n    ", "\n  }\n  .CONTENT_H3 {\n    ", "\n  }\n  .CONTENT_BODY {\n    ", "\n  }\n\n  .CONTENT_BODY_BOLD {\n    ", "\n  }\n  .CONTENT_BODY_ITALIC {\n    ", "\n  }\n  .CONTENT_BODY_BOLD_ITALIC {\n    ", "\n  }\n  .CONTENT_QUOTE {\n    ", "\n  }\n\n  .CONTENT_TITLE_POSTIT {\n    ", "\n  }\n  .CONTENT_BODY_POSTIT {\n    ", "\n  }\n"])), typo_1.typo.UI_DISPLAY, typo_1.typo.UI_HEADLINE, typo_1.typo.UI_HEADLINE_SM, typo_1.typo.UI_TITLE, typo_1.typo.UI_TITLE_SM, typo_1.typo.UI_TITLE_SM, typo_1.typo.UI_BODY, typo_1.typo.UI_BODY_SM, typo_1.typo.UI_BODY_SEMIBOLD, typo_1.typo.UI_BODY_SEMIBOLD_SM, typo_1.typo.UI_BODY_BOLD_DF, typo_1.typo.UI_BODY_BOLD_SM_DF, typo_1.typo.UI_BODY_DF, typo_1.typo.UI_BODY_SM_DF, typo_1.typo.UI_BODY_SEMIBOLD_DF, typo_1.typo.UI_BODY_SEMIBOLD_SM_DF, typo_1.typo.UI_BODY_BOLD_SM, typo_1.typo.UI_PARAGRAPH, typo_1.typo.UI_PARAGRAPH_BOLD, typo_1.typo.UI_CAPTION, typo_1.typo.UI_CAPTION_BOLD, typo_1.typo.UI_CAPTION_DF, typo_1.typo.UI_CAPTION_BOLD_DF, typo_1.typo.UI_TAG, typo_1.typo.UI_HELPTEXT, typo_1.typo.UI_STAT_LG, typo_1.typo.UI_STAT_SM, typo_1.typo.CONTENT_H1, typo_1.typo.CONTENT_H2, typo_1.typo.CONTENT_H3, typo_1.typo.CONTENT_BODY, typo_1.typo.CONTENT_BODY_BOLD, typo_1.typo.CONTENT_BODY_ITALIC, typo_1.typo.CONTENT_BODY_BOLD_ITALIC, typo_1.typo.CONTENT_QUOTE, typo_1.typo.CONTENT_TITLE_POSTIT, typo_1.typo.CONTENT_BODY_POSTIT);
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42;
+exports.CONTENT_H1_STYLED = styled_components_1.default.h1(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n  ", "  \n  "], ["\n  ", "  \n  "])), typo_1.typo.CONTENT_H1);
+exports.CONTENT_H2_STYLED = styled_components_1.default.h2(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n  ", "  \n"], ["\n  ", "  \n"])), typo_1.typo.CONTENT_H2);
+exports.CONTENT_H3_STYLED = styled_components_1.default.h3(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n  ", "  \n"], ["\n  ", "  \n"])), typo_1.typo.CONTENT_H3);
+exports.CONTENT_BODY_STYLED = styled_components_1.default.p(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY);
+exports.CONTENT_BODY_SM_STYLED = styled_components_1.default.p(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY_SM);
+exports.CONTENT_BODY_BOLD_STYLED = styled_components_1.default.p(templateObject_37 || (templateObject_37 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY_BOLD);
+exports.CONTENT_BODY_ITALIC_STYLED = styled_components_1.default.p(templateObject_38 || (templateObject_38 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY_ITALIC);
+exports.CONTENT_BODY_BOLD_ITALIC_STYLED = styled_components_1.default.p(templateObject_39 || (templateObject_39 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY_BOLD_ITALIC);
+exports.CONTENT_QUOTE_STYLED = styled_components_1.default.h4(templateObject_40 || (templateObject_40 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_QUOTE);
+exports.CONTENT_TITLE_POSTIT_STYLED = styled_components_1.default.p(templateObject_41 || (templateObject_41 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_TITLE_POSTIT);
+exports.CONTENT_BODY_POSTIT_STYLED = styled_components_1.default.p(templateObject_42 || (templateObject_42 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), typo_1.typo.CONTENT_BODY_POSTIT);
+exports.TYPO_V2_CLASSES = styled_components_1.default.div(templateObject_43 || (templateObject_43 = __makeTemplateObject(["\n  .UI_DISPLAY {\n    ", "\n  }\n\n  .UI_HEADLINE {\n    ", "\n  }\n\n  .UI_HEADLINE_SM {\n    ", "\n  }\n\n  .UI_TITLE {\n    ", "\n  }\n\n  .UI_TITLE_SM {\n    ", "\n  }\n\n  .UI_TITLE_SM {\n    ", "\n  }\n\n  .UI_BODY {\n    ", "\n  }\n\n  .UI_BODY_SM {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_SM {\n    ", "\n  } \n\n  .UI_BODY_BOLD_DF {\n    ", "\n  }\n\n  .UI_BODY_BOLD_SM_DF {\n    ", "\n  }\n\n  .UI_BODY_DF {\n    ", "\n  }\n\n  .UI_BODY_SM_DF {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_DF {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_SM_DF {\n    ", "\n  } \n\n  .UI_BODY_BOLD_SM {\n    ", "\n  }\n\n  .UI_PARAGRAPH {\n    ", "\n  }\n\n  .UI_PARAGRAPH_BOLD {\n    ", "\n  }\n\n  .UI_CAPTION {\n    ", "\n  }\n\n  .UI_CAPTION_BOLD {\n    ", "\n  }\n\n  .UI_CAPTION_DF {\n    ", "\n  }\n  \n  .UI_CAPTION_BOLD_DF {\n    ", "\n  }\n\n  .UI_TAG {\n    ", "\n  }\n  \n  .UI_TAG {\n    ", "\n  }\n\n  .UI_HELPTEXT {\n    ", "\n  }\n\n  .UI_STAT_LG {\n    ", "\n  }\n\n  .UI_STAT_SM {\n    ", "\n  }\n\n\n  .CONTENT_H1 {\n    ", "\n  }\n  .CONTENT_H2 {\n    ", "\n  }\n  .CONTENT_H3 {\n    ", "\n  }\n  .CONTENT_BODY {\n    ", "\n  }\n\n  .CONTENT_BODY_BOLD {\n    ", "\n  }\n  .CONTENT_BODY_ITALIC {\n    ", "\n  }\n  .CONTENT_BODY_BOLD_ITALIC {\n    ", "\n  }\n  .CONTENT_QUOTE {\n    ", "\n  }\n\n  .CONTENT_TITLE_POSTIT {\n    ", "\n  }\n  .CONTENT_BODY_POSTIT {\n    ", "\n  }\n"], ["\n  .UI_DISPLAY {\n    ", "\n  }\n\n  .UI_HEADLINE {\n    ", "\n  }\n\n  .UI_HEADLINE_SM {\n    ", "\n  }\n\n  .UI_TITLE {\n    ", "\n  }\n\n  .UI_TITLE_SM {\n    ", "\n  }\n\n  .UI_TITLE_SM {\n    ", "\n  }\n\n  .UI_BODY {\n    ", "\n  }\n\n  .UI_BODY_SM {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_SM {\n    ", "\n  } \n\n  .UI_BODY_BOLD_DF {\n    ", "\n  }\n\n  .UI_BODY_BOLD_SM_DF {\n    ", "\n  }\n\n  .UI_BODY_DF {\n    ", "\n  }\n\n  .UI_BODY_SM_DF {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_DF {\n    ", "\n  }\n\n  .UI_BODY_SEMIBOLD_SM_DF {\n    ", "\n  } \n\n  .UI_BODY_BOLD_SM {\n    ", "\n  }\n\n  .UI_PARAGRAPH {\n    ", "\n  }\n\n  .UI_PARAGRAPH_BOLD {\n    ", "\n  }\n\n  .UI_CAPTION {\n    ", "\n  }\n\n  .UI_CAPTION_BOLD {\n    ", "\n  }\n\n  .UI_CAPTION_DF {\n    ", "\n  }\n  \n  .UI_CAPTION_BOLD_DF {\n    ", "\n  }\n\n  .UI_TAG {\n    ", "\n  }\n  \n  .UI_TAG {\n    ", "\n  }\n\n  .UI_HELPTEXT {\n    ", "\n  }\n\n  .UI_STAT_LG {\n    ", "\n  }\n\n  .UI_STAT_SM {\n    ", "\n  }\n\n\n  .CONTENT_H1 {\n    ", "\n  }\n  .CONTENT_H2 {\n    ", "\n  }\n  .CONTENT_H3 {\n    ", "\n  }\n  .CONTENT_BODY {\n    ", "\n  }\n\n  .CONTENT_BODY_BOLD {\n    ", "\n  }\n  .CONTENT_BODY_ITALIC {\n    ", "\n  }\n  .CONTENT_BODY_BOLD_ITALIC {\n    ", "\n  }\n  .CONTENT_QUOTE {\n    ", "\n  }\n\n  .CONTENT_TITLE_POSTIT {\n    ", "\n  }\n  .CONTENT_BODY_POSTIT {\n    ", "\n  }\n"])), typo_1.typo.UI_DISPLAY, typo_1.typo.UI_HEADLINE, typo_1.typo.UI_HEADLINE_SM, typo_1.typo.UI_TITLE, typo_1.typo.UI_TITLE_SM, typo_1.typo.UI_TITLE_SM, typo_1.typo.UI_BODY, typo_1.typo.UI_BODY_SM, typo_1.typo.UI_BODY_SEMIBOLD, typo_1.typo.UI_BODY_SEMIBOLD_SM, typo_1.typo.UI_BODY_BOLD_DF, typo_1.typo.UI_BODY_BOLD_SM_DF, typo_1.typo.UI_BODY_DF, typo_1.typo.UI_BODY_SM_DF, typo_1.typo.UI_BODY_SEMIBOLD_DF, typo_1.typo.UI_BODY_SEMIBOLD_SM_DF, typo_1.typo.UI_BODY_BOLD_SM, typo_1.typo.UI_PARAGRAPH, typo_1.typo.UI_PARAGRAPH_BOLD, typo_1.typo.UI_CAPTION, typo_1.typo.UI_CAPTION_BOLD, typo_1.typo.UI_CAPTION_DF, typo_1.typo.UI_CAPTION_BOLD_DF, typo_1.typo.UI_TAG, typo_1.typo.UI_TAG_DF, typo_1.typo.UI_HELPTEXT, typo_1.typo.UI_STAT_LG, typo_1.typo.UI_STAT_SM, typo_1.typo.CONTENT_H1, typo_1.typo.CONTENT_H2, typo_1.typo.CONTENT_H3, typo_1.typo.CONTENT_BODY, typo_1.typo.CONTENT_BODY_BOLD, typo_1.typo.CONTENT_BODY_ITALIC, typo_1.typo.CONTENT_BODY_BOLD_ITALIC, typo_1.typo.CONTENT_QUOTE, typo_1.typo.CONTENT_TITLE_POSTIT, typo_1.typo.CONTENT_BODY_POSTIT);
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43;

package/dist/v2/themes/typo.d.ts

@@ -26,6 +26,7 @@ export declare const typo: {
     UI_CAPTION_SEMIBOLD: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<any>>;
     UI_CAPTION_SEMIBOLD_DF: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<any>>;
     UI_TAG: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<any>>;
+    UI_TAG_DF: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<any>>;
     UI_HELPTEXT: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<any>>;
     UI_STAT_LG: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<any>>;
     UI_STAT_SM: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<any>>;