@semcore/typography 5.54.0-prerelease.1 → 5.54.0-prerelease.5

package/lib/esm/style/text.shadow.css

@@ -1,21 +1,379 @@
 SText {
   padding: 0;
   margin: 0;
+
+  &[formatTags] {
+
+    & abbr {
+      color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
+      text-decoration: underline dashed var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
+
+      &:active,
+      &:hover,
+      &:focus {
+        outline: none;
+        color: var(--intergalactic-text-hint-hover-active, oklch(0.086 0.026 145.8 / 0.605));
+        text-decoration: underline dashed var(--intergalactic-text-hint-hover-active, oklch(0.086 0.026 145.8 / 0.605));
+      }
+    }
+
+    & a {
+      display: inline;
+      background: none;
+      outline: none;
+      text-decoration: none;
+      color: var(--intergalactic-text-link, oklch(0.53 0.21 263));
+      border-bottom-width: 1px;
+      border-bottom-style: solid;
+      border-color: transparent;
+
+      &:active,
+      &:hover {
+        outline: none;
+        text-decoration: none;
+        color: var(--intergalactic-text-link-hover-active, oklch(0.51 0.202 263));
+        border-color: var(--intergalactic-text-link-hover-active, oklch(0.51 0.202 263));
+      }
+
+      &:focus {
+        @mixin focus-outline-mixin;
+      }
+    }
+
+    & code,
+    & pre {
+      font-family: Consolas, 'Roboto Mono', Menlo, Courier, monospace;
+    }
+
+    & blockquote {
+      position: relative;
+      /* disable-tokens-validator */
+      padding-left: 51px;
+      font-size: var(--intergalactic-fs-400, 20px);
+      line-height: var(--intergalactic-lh-400, 120%);
+      font-style: italic;
+
+      &:before {
+        content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNyIgaGVpZ2h0PSIxOSIgdmlld0JveD0iMCAwIDI3IDE5IiBmaWxsPSJub25lIj4KPHBhdGggZD0iTTguODI0MjIgMC45NDcyNjZWMi4zMDg1OUM2Ljg3NjMgMy4zMjY4MiA1LjQ4MTc3IDQuMzg5MzIgNC42NDA2MiA1LjQ5NjA5QzMuNzk5NDggNi42MDI4NiAzLjM3ODkxIDcuODA5MjQgMy4zNzg5MSA5LjExNTIzQzMuMzc4OTEgOS44ODk5NyAzLjQ4OTU4IDEwLjQyMTIgMy43MTA5NCAxMC43MDlDMy45MTAxNiAxMS4wMTg5IDQuMTUzNjUgMTEuMTczOCA0LjQ0MTQxIDExLjE3MzhDNC43MjkxNyAxMS4xNzM4IDUuMTE2NTQgMTEuMDk2NCA1LjYwMzUyIDEwLjk0MTRDNi4wOTA0OSAxMC43NjQzIDYuNTMzMiAxMC42NzU4IDYuOTMxNjQgMTAuNjc1OEM3LjgzOTE5IDEwLjY3NTggOC42MjUgMTEuMDE4OSA5LjI4OTA2IDExLjcwNTFDOS45NzUyNiAxMi4zNjkxIDEwLjMxODQgMTMuMTg4MiAxMC4zMTg0IDE0LjE2MjFDMTAuMzE4NCAxNS4yMjQ2IDkuOTA4ODUgMTYuMTQzMiA5LjA4OTg0IDE2LjkxOEM4LjI3MDgzIDE3LjY3MDYgNy4yNTI2IDE4LjA0NjkgNi4wMzUxNiAxOC4wNDY5QzQuNTUyMDggMTguMDQ2OSAzLjIxMjg5IDE3LjQwNDkgMi4wMTc1OCAxNi4xMjExQzAuODIyMjY2IDE0LjgzNzIgMC4yMjQ2MDkgMTMuMjU0NiAwLjIyNDYwOSAxMS4zNzNDMC4yMjQ2MDkgOS4xNTk1MSAwLjk1NTA3OCA3LjEwMDkxIDIuNDE2MDIgNS4xOTcyN0MzLjg5OTA5IDMuMjcxNDggNi4wMzUxNiAxLjg1NDgyIDguODI0MjIgMC45NDcyNjZaTTI0LjY2MjEgMS4wNDY4OFYyLjMwODU5QzIyLjQyNjQgMy41OTI0NSAyMC45NTQ0IDQuNzQzNDkgMjAuMjQ2MSA1Ljc2MTcyQzE5LjUzNzggNi43Nzk5NSAxOS4xODM2IDcuOTc1MjYgMTkuMTgzNiA5LjM0NzY2QzE5LjE4MzYgOS45Njc0NSAxOS4zMDUzIDEwLjQzMjMgMTkuNTQ4OCAxMC43NDIyQzE5Ljc5MjMgMTEuMDUyMSAyMC4wNDY5IDExLjIwNyAyMC4zMTI1IDExLjIwN0MyMC41NTYgMTEuMjA3IDIwLjkyMTIgMTEuMTE4NSAyMS40MDgyIDEwLjk0MTRDMjEuODk1MiAxMC43NjQzIDIyLjM4MjIgMTAuNjc1OCAyMi44NjkxIDEwLjY3NThDMjMuNzc2NyAxMC42NzU4IDI0LjU2MjUgMTEuMDA3OCAyNS4yMjY2IDExLjY3MTlDMjUuOTEyOCAxMi4zMTM4IDI2LjI1NTkgMTMuMTEwNyAyNi4yNTU5IDE0LjA2MjVDMjYuMjU1OSAxNS4xNDcxIDI1LjgyNDIgMTYuMDg3OSAyNC45NjA5IDE2Ljg4NDhDMjQuMTE5OCAxNy42ODE2IDIzLjA3OTQgMTguMDgwMSAyMS44Mzk4IDE4LjA4MDFDMjAuMzc4OSAxOC4wODAxIDE5LjA2MTggMTcuNDQ5MiAxNy44ODg3IDE2LjE4NzVDMTYuNzE1NSAxNC45MjU4IDE2LjEyODkgMTMuMzU0MiAxNi4xMjg5IDExLjQ3MjdDMTYuMTI4OSA5LjE0ODQ0IDE2Ljg3MDQgNy4wMzQ1MSAxOC4zNTM1IDUuMTMwODZDMTkuODM2NiAzLjIwNTA4IDIxLjkzOTUgMS44NDM3NSAyNC42NjIxIDEuMDQ2ODhaIiBmaWxsPSIjQTlBQkI2Ii8+Cjwvc3ZnPg==);
+        display: inline-block;
+        position: absolute;
+        left: 0;
+        color: var(--intergalactic-icon-secondary-neutral, oklch(0.104 0.023 162.3 / 0.385));
+        font-family: Georgia, Times, 'Times New Roman', serif;
+      }
+
+      & cite {
+        display: block;
+        font-style: normal;
+        margin-top: var(--intergalactic-spacing-4x, 16px);
+        color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
+        font-size: var(--intergalactic-fs-300, 16px);
+        line-height: var(--intergalactic-lh-300, 150%);
+      }
+    }
+
+    & ol:not(ol[start], ol[reversed], ol[type]),
+    & ul:not(ul[start], ul[reversed], ul[type]) {
+      margin: var(--intergalactic-spacing-2x, 8px) 0;
+      padding: 0;
+      list-style: none;
+      position: relative;
+
+      & li:not(SText) {
+        &:before {
+          position: absolute;
+          left: 0;
+          color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
+        }
+      }
+
+      & li:not(SText) + li:not(SText) {
+        margin: var(--intergalactic-spacing-2x, 8px) 0 0 0;
+      }
+    }
+
+    & ol:not(ol[start], ol[reversed], ol[type]) {
+      counter-reset: item 0;
+
+      & li:not(SText):before {
+        counter-increment: item;
+        content: counters(item, '.');
+      }
+    }
+
+    & ul:not(ul[start], ul[reversed], ul[type]) li:not(SText):before {
+      content: '';
+      background-color: var(--intergalactic-icon-primary-neutral, oklch(0.092 0.024 152.2 / 0.526));
+    }
+
+    & ol:not(ol[start], ol[reversed], ol[type]):has(+ p),
+    & ul:not(ul[start], ul[reversed], ul[type]):has(+ p) {
+      margin-bottom: var(--intergalactic-spacing-4x, 16px);
+    }
+
+    & h1 {
+      font-size: var(--intergalactic-fs-800, 48px);
+      line-height: var(--intergalactic-lh-800, 117%);
+      font-weight: var(--intergalactic-semi-bold, 600);
+      margin: 0 0 var(--intergalactic-spacing-6x, 24px) 0;
+
+      &:only-child {
+        margin-bottom: 0;
+      }
+    }
+
+    & h2 {
+      font-size: var(--intergalactic-fs-700, 36px);
+      line-height: var(--intergalactic-lh-700, 110%);
+      font-weight: var(--intergalactic-semi-bold, 600);
+      margin: 0 0 var(--intergalactic-spacing-4x, 16px) 0;
+
+      &:only-child {
+        margin-bottom: 0;
+      }
+    }
+
+    & h3 {
+      font-size: var(--intergalactic-fs-600, 32px);
+      line-height: var(--intergalactic-lh-600, 125%);
+      font-weight: var(--intergalactic-semi-bold, 600);
+      margin: 0 0 var(--intergalactic-spacing-4x, 16px) 0;
+
+      &:only-child {
+        margin-bottom: 0;
+      }
+    }
+
+    & h4 {
+      font-size: var(--intergalactic-fs-500, 24px);
+      line-height: var(--intergalactic-lh-500, 117%);
+      font-weight: var(--intergalactic-semi-bold, 600);
+      margin: 0 0 var(--intergalactic-spacing-3x, 12px) 0;
+
+      &:only-child {
+        margin-bottom: 0;
+      }
+    }
+
+    & h5 {
+      font-size: var(--intergalactic-fs-400, 20px);
+      line-height: var(--intergalactic-lh-400, 120%);
+      font-weight: var(--intergalactic-semi-bold, 600);
+      margin: 0 0 var(--intergalactic-spacing-2x, 8px) 0;
+
+      &:only-child {
+        margin-bottom: 0;
+      }
+    }
+
+    & h6 {
+      font-size: var(--intergalactic-fs-300, 16px);
+      line-height: var(--intergalactic-lh-300, 150%);
+      font-weight: var(--intergalactic-bold, 700);
+      margin: 0 0 var(--intergalactic-spacing-1x, 4px) 0;
+
+      &:only-child {
+        margin-bottom: 0;
+      }
+    }
+
+    & h1,
+    & h2,
+    & h3,
+    & h4,
+    & h5,
+    & h6 {
+      & small {
+        color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
+        font-weight: 300;
+        font-size: 100%;
+      }
+    }
+
+    & p,
+    & li {
+      font-size: var(--intergalactic-fs-200, 14px);
+      line-height: var(--intergalactic-lh-200, 142%);
+    }
+
+    & p {
+      margin: 0 0 var(--intergalactic-spacing-4x, 16px) 0;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+
+    & li {
+      padding-left: calc(var(--intergalactic-spacing-4x, 16px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ol ol li {
+      padding-left: calc(var(--intergalactic-spacing-6x, 24px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ol ol ol li {
+      padding-left: calc(var(--intergalactic-spacing-8x, 32px) + var(--intergalactic-spacing-1x, 4px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ul li:before {
+      width: 4px;
+      height: 4px;
+      border-radius: 50%;
+      /* disable-tokens-validator */
+      margin-top: calc(var(--intergalactic-spacing-2x, 8px) - 1px);
+      margin-left: var(--intergalactic-spacing-05x, 2px);
+    }
+  }
+}
+
+SText[ellipsis] {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: pre;
+  display: inline-block;
+  line-height: unset;
+  vertical-align: top;
+
+  &[trim='end'][isEllipsized]::after {
+    content: '';
+    display: block;
+  }
+
+  &[maxLine] {
+    -webkit-line-clamp: var(--maxLine);
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    white-space: normal;
+    overflow-wrap: break-word;
+  }
+  &[trim='middle'] {
+    text-overflow: unset;
+  }
 }
 
 SText[size='100'] {
   font-size: var(--intergalactic-fs-100, 12px);
   line-height: var(--intergalactic-lh-100, 133%);
+
+  &[formatTags] {
+    & p,
+    & li {
+      font-size: var(--intergalactic-fs-100, 12px);
+      line-height: var(--intergalactic-lh-100, 133%);
+    }
+
+    & p {
+      margin: 0 0 calc(var(--intergalactic-spacing-4x, 16px) + var(--intergalactic-spacing-05x, 2px)) 0;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+
+    & li {
+      padding-left: calc(var(--intergalactic-spacing-4x, 16px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ol ol li {
+      padding-left: calc(var(--intergalactic-spacing-6x, 24px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ol ol ol li {
+      padding-left: calc(var(--intergalactic-spacing-8x, 32px) + var(--intergalactic-spacing-1x, 4px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ul li:before {
+      width: 3px;
+      height: 3px;
+      border-radius: 50%;
+      margin-top: var(--intergalactic-spacing-2x, 8px);
+      margin-left: var(--intergalactic-spacing-05x, 2px);
+    }
+  }
 }
 
 SText[size='200'] {
   font-size: var(--intergalactic-fs-200, 14px);
   line-height: var(--intergalactic-lh-200, 142%);
+
+  &[formatTags] {
+    & p,
+    & li {
+      font-size: var(--intergalactic-fs-200, 14px);
+      line-height: var(--intergalactic-lh-200, 142%);
+    }
+
+    & p {
+      margin: 0 0 var(--intergalactic-spacing-3x, 12px) 0;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+
+    & li {
+      padding-left: calc(var(--intergalactic-spacing-4x, 16px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ol ol li {
+      padding-left: calc(var(--intergalactic-spacing-6x, 24px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ol ol ol li {
+      padding-left: calc(var(--intergalactic-spacing-8x, 32px) + var(--intergalactic-spacing-1x, 4px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ul li:before {
+      width: 4px;
+      height: 4px;
+      border-radius: 50%;
+      /* disable-tokens-validator */
+      margin-top: calc(var(--intergalactic-spacing-2x, 8px) - 1px);
+      margin-left: var(--intergalactic-spacing-05x, 2px);
+    }
+  }
 }
 
 SText[size='300'] {
   font-size: var(--intergalactic-fs-300, 16px);
   line-height: var(--intergalactic-lh-300, 150%);
+
+  &[formatTags] {
+    & p,
+    & li {
+      font-size: var(--intergalactic-fs-300, 16px);
+      line-height: var(--intergalactic-lh-300, 150%);
+    }
+
+    & p {
+      margin: 0 0 var(--intergalactic-spacing-4x, 16px) 0;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+
+    & li {
+      padding-left: calc(var(--intergalactic-spacing-4x, 16px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ol ol li {
+      padding-left: calc(var(--intergalactic-spacing-6x, 24px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ol ol ol li {
+      padding-left: calc(var(--intergalactic-spacing-8x, 32px) + var(--intergalactic-spacing-1x, 4px) + var(--intergalactic-spacing-05x, 2px));
+    }
+
+    & ul li:before {
+      width: 5px;
+      height: 5px;
+      border-radius: 50%;
+      margin-top: calc(var(--intergalactic-spacing-2x, 8px) + var(--intergalactic-spacing-05x, 2px));
+      margin-left: var(--intergalactic-spacing-05x, 2px);
+    }
+  }
 }
 
 SText[size='400'] {
@@ -115,4 +473,12 @@ SText[use='secondary'] {
 
 SText[disabled] {
   opacity: var(--intergalactic-disabled-opacity, 0.4);
-}
+}
+
+@media (prefers-reduced-motion) {
+  SText {
+    & a {
+      transition: none;
+    }
+  }
+}

package/lib/types/components/Blockquote/Blockquote.d.ts

@@ -0,0 +1,3 @@
+import type { NSBlockquote } from './Blockquote.type';
+declare const Blockquote: NSBlockquote.Component;
+export default Blockquote;

package/lib/types/components/Blockquote/Blockquote.type.d.ts

@@ -0,0 +1,12 @@
+import type { BoxProps } from '@semcore/base-components';
+import type { Intergalactic } from '@semcore/core';
+declare namespace NSBlockquote {
+    type Props = BoxProps & {
+        /** Source of the quote */
+        author?: React.ReactNode;
+    };
+    type Component = Intergalactic.Component<'blockquote', Props>;
+}
+/** @deprecated It will be removed in v18. */
+export type BlockquoteProps = NSBlockquote.Props;
+export type { NSBlockquote };

package/lib/types/components/List/List.d.ts

@@ -0,0 +1,3 @@
+import type { NSList } from './List.type';
+declare const List: NSList.Component;
+export default List;

package/lib/types/components/List/List.type.d.ts

@@ -0,0 +1,34 @@
+import type { Flex, FlexProps } from '@semcore/base-components';
+import type { Intergalactic } from '@semcore/core';
+import type React from 'react';
+import type { NSText } from '../Text/Text.type';
+declare namespace NSList {
+    type Props = NSText.Props & {
+        /** Marker of the entire list
+         * @default • */
+        marker?: React.ReactNode;
+    };
+    namespace Item {
+        type Props = NSText.Props & {
+            /** Individual marker of a list item */
+            marker?: React.ReactNode;
+        };
+        namespace Content {
+            type Props = FlexProps;
+            type Component = Intergalactic.Component<typeof Flex, Props>;
+        }
+        type Component = Intergalactic.Component<'li', Props> & {
+            Content: Content.Component;
+        };
+    }
+    type Component = Intergalactic.Component<'ul', Props> & {
+        Item: Item.Component;
+    };
+}
+/** @deprecated It will be removed in v18. */
+export type ListItemProps = NSList.Item.Props;
+/** @deprecated It will be removed in v18. */
+export type ListItemContentProps = NSList.Item.Content.Props;
+/** @deprecated It will be removed in v18. */
+export type ListProps = NSList.Props;
+export type { NSList };

package/lib/types/components/Text/Text.d.ts

@@ -0,0 +1,3 @@
+import type { NSText } from './Text.type';
+declare const Text: NSText.Component;
+export default Text;

package/lib/types/components/Text/Text.type.d.ts

@@ -0,0 +1,82 @@
+import type { BoxProps, EllipsisSettings, SimpleHintPopperProps, Ellipsis as EllipsisInstance } from '@semcore/base-components';
+import type { Intergalactic } from '@semcore/core';
+import type { Property } from 'csstype';
+declare namespace NSText {
+    type BaseProps = {
+        /** Font size and line-heights */
+        size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800;
+        /**
+         * The text will not be wrapped on a new line and will be cut off with ellipsis
+         * @deprecated use ellipsis prop instead
+         **/
+        noWrap?: boolean;
+        /** CSS property `font-weight: 700;` */
+        bold?: boolean;
+        /** CSS property `font-weight: 600;` */
+        semibold?: boolean;
+        /** CSS property `font-weight: 500;` */
+        medium?: boolean;
+        /** Italicized text */
+        italic?: boolean;
+        /** Underlined text */
+        underline?: boolean;
+        /** CSS property `font-family: monospace;` */
+        monospace?: boolean;
+        /** Strikethrough text */
+        lineThrough?: boolean;
+        /** Uppercase text */
+        uppercase?: boolean;
+        /** Lowercase text */
+        lowercase?: boolean;
+        /** Capitalized text */
+        capitalize?: boolean;
+        /** Text color **/
+        color?: string;
+        /** Custom `font-size` */
+        fontSize?: Property.FontSize<any>;
+        /** Custom `line-height` */
+        lineHeight?: Property.LineHeight<any>;
+        /** Custom `font-weight` */
+        fontWeight?: Property.FontWeight;
+        /** Text alignment */
+        textAlign?: Property.TextAlign;
+        /** Enforces text color */
+        use?: 'primary' | 'secondary';
+        /** Makes text semi-transparent to indicate disabled state */
+        disabled?: boolean;
+    };
+    type HintProps = {
+        /** Manually enabled/disabled Hint */
+        hint?: boolean;
+    } & {
+        [K in keyof SimpleHintPopperProps as `hint:${string & K}`]?: SimpleHintPopperProps[K];
+    };
+    type EllipsisProps = {
+        /** Manually enabled/disabled Ellipsis or provide an instance of it. */
+        ellipsis?: boolean | EllipsisInstance;
+    } & {
+        [K in keyof EllipsisSettings as `ellipsis:${string & K}`]?: EllipsisSettings[K];
+    };
+    type Props = BoxProps & NSText.BaseProps & ({
+        /** Enable formatting/styling for all nested HTML tags with our default styles for them */
+        formatTags?: boolean;
+        ellipsis?: never;
+        ellipsisProps?: never;
+        hint?: never;
+        hintProps?: never;
+    } | ({
+        formatTags?: never;
+    } & NSText.HintProps & NSText.EllipsisProps));
+    type Component = Intergalactic.Component<'span', Props>;
+}
+/** @deprecated It will be removed in v18. */
+export type TextHintProps = NSText.HintProps;
+/** @deprecated It will be removed in v18. */
+export type TextEllipsisProps = NSText.EllipsisProps;
+/** @deprecated It will be removed in v18. */
+export type BaseTextProps = NSText.BaseProps;
+/** @deprecated It will be removed in v18. */
+export type TextProps = NSText.Props;
+/** @deprecated It will be removed in v18. */
+export type TextComponent = NSText.Component;
+export type { NSText };

package/lib/types/index.d.ts

@@ -1,117 +1,6 @@
-import React from 'react';
-import { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';
-
-import { Property } from 'csstype';
-import { Box, BoxProps, Flex, FlexProps } from '@semcore/flex-box';
-import { KeyboardFocusProps } from '@semcore/utils/lib/enhances/keyboardFocusEnhance';
-
-/** @deprecated */
-export interface ITextProps extends TextProps, UnknownProperties {}
-export type TextProps = BoxProps & {
-  /** Font size and line-heights */
-  size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800;
-  /** The text will not be wrapped on a new line and will be cut off with ellipsis */
-  noWrap?: boolean;
-  /** CSS property `font-weight: 700;` */
-  bold?: boolean;
-  /** CSS property `font-weight: 600;` */
-  semibold?: boolean;
-  /** CSS property `font-weight: 500;` */
-  medium?: boolean;
-  /** Italicized text */
-  italic?: boolean;
-  /** Underlined text */
-  underline?: boolean;
-  /** CSS property `font-family: monospace;` */
-  monospace?: boolean;
-  /** Strikethrough text */
-  lineThrough?: boolean;
-  /** Uppercase text */
-  uppercase?: boolean;
-  /** Lowercase text */
-  lowercase?: boolean;
-  /** Capitalized text */
-  capitalize?: boolean;
-  /** Text color **/
-  color?: string;
-  /** Custom `font-size` */
-  fontSize?: Property.FontSize<any>;
-  /** Custom `line-height` */
-  lineHeight?: Property.LineHeight<any>;
-  /** Custom `font-weight` */
-  fontWeight?: Property.FontWeight;
-  /** Text alignment */
-  textAlign?: Property.TextAlign;
-  /** Enforces text color */
-  use?: 'primary' | 'secondary';
-  /** Makes text semi-transparent to indicate disabled state */
-  disabled?: boolean;
-};
-
-/** @deprecated */
-export interface IListProps extends ListProps, UnknownProperties {}
-export type ListProps = TextProps & {
-  /** Marker of the entire list
-   * @default • */
-  marker?: React.ReactNode;
-};
-
-/** @deprecated */
-export interface IListItemProps extends ListItemProps, UnknownProperties {}
-export type ListItemProps = TextProps & {
-  /** Individual marker of a list item */
-  marker?: React.ReactNode;
-};
-
-export type ListItemContentProps = FlexProps;
-
-/** @deprecated */
-export interface IListContext extends ListContext, UnknownProperties {}
-export type ListContext = {
-  getItemProps: PropGetterFn;
-};
-
-/** @deprecated */
-export interface IHintProps extends HintProps, UnknownProperties {}
-export type TypographyHintProps = TextProps &
-  KeyboardFocusProps & {
-    /** The value responsible for the activity of the element
-     * @default false
-     */
-    disabled?: boolean;
-    /** Enable `active` state */
-    active?: boolean;
-    /** Left addon hint  */
-    addonLeft?: React.ElementType;
-    /** Right addon hint  */
-    addonRight?: React.ElementType;
-  };
-
-/** @deprecated use `TypographyHintProps` instead */
-export type HintProps = TypographyHintProps;
-
-/** @deprecated */
-export interface IBlockquoteProps extends BlockquoteProps, UnknownProperties {}
-export type BlockquoteProps = BoxProps & {
-  /** Source of the quote */
-  author?: React.ReactNode;
-};
-
-declare const Hint: Intergalactic.Component<'abbr', HintProps> & {
-  Addon: typeof Box;
-  Text: typeof Box;
-};
-
-declare const Item: Intergalactic.Component<'li', ListItemProps> & {
-  Content: Intergalactic.Component<typeof Flex, ListItemContentProps>;
-};
-
-declare const List: Intergalactic.Component<'ul', ListProps> & {
-  Item: typeof Item;
-};
-
-declare const Text: Intergalactic.Component<'span', TextProps>;
-
-declare const Blockquote: Intergalactic.Component<'blockquote', BlockquoteProps>;
-
-export { Text, List, Hint, Blockquote };
+export { default as Text } from './components/Text/Text';
+export { default as Blockquote } from './components/Blockquote/Blockquote';
+export { default as List } from './components/List/List';
+export * from './components/Text/Text.type';
+export * from './components/Blockquote/Blockquote.type';
+export * from './components/List/List.type';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/typography",
   "description": "Semrush Typography Component",
-  "version": "5.54.0-prerelease.1",
+  "version": "5.54.0-prerelease.5",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
@@ -14,13 +14,13 @@
     "types": "./lib/types/index.d.ts"
   },
   "dependencies": {
-    "@semcore/utils": "4.49.0-prerelease.1",
-    "@semcore/flex-box": "5.42.0-prerelease.1",
-    "@semcore/icon": "4.63.0-prerelease.1",
+    "@semcore/utils": "4.49.0-prerelease.5",
+    "@semcore/flex-box": "5.42.0-prerelease.5",
+    "@semcore/icon": "4.63.0-prerelease.5",
     "csstype": "3.0.8"
   },
   "peerDependencies": {
-    "@semcore/core": "^2.40.0-prerelease.1",
+    "@semcore/core": "^2.40.0-prerelease.5",
     "react": "16.8 - 18",
     "react-dom": "16.8 - 18"
   },