@semcore/typography 16.3.3-prerelease.9 → 16.4.0-prerelease.1

package/lib/cjs/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","names":["_core","require","_baseComponents","_resolveColorEnhance","_interopRequireDefault","_react","styles","sstyled","insert","TextRoot","Component","constructor","props","_defineProperty2","default","React","createRef","showHint","handleEllipsized","bind","componentDidMount","initEllipsis","componentDidUpdate","prevProps","ellipsis","asProps","cleanUpEllipsis","componentWillUnmount","render","_ref","_ref2","SText","Box","color","underline","lineThrough","hintProps","children","resolveColor","state","cropPosition","undefined","withHint","maxLineValue","maxLine","createElement","Fragment","cn","assignProps","innerRef","getTextDecoration","Boolean","Hint","isEllipsis","setState","current","Ellipsis","on","off","cleanUp","resolveColorEnhance","_default","exports","createComponent"],"sources":["../../src/Text.tsx"],"sourcesContent":["import { Ellipsis, Hint, Box } from '@semcore/base-components';\nimport { Root, sstyled, Component, createComponent } from '@semcore/core';\nimport resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';\nimport React from 'react';\n\nimport type { TextProps } from './index';\nimport styles from './style/text.shadow.css';\n\ntype DefaultProps = {\n  ellipsis: TextProps['ellipsis'] | false;\n};\n\ntype State = {\n  showHint: boolean;\n};\n\nclass TextRoot extends Component<TextProps, typeof TextRoot.enhance, {}, DefaultProps, State> {\n  private ellipsis: Ellipsis | null = null;\n  private innerRef = React.createRef<HTMLElement | null>();\n\n  static enhance = [resolveColorEnhance()] as const;\n  static styles = styles;\n  static displayName = 'Text';\n\n  static defaultProps: DefaultProps = {\n    ellipsis: false,\n  };\n\n  state = {\n    showHint: false,\n  };\n\n  constructor(props: TextProps) {\n    super(props);\n\n    this.handleEllipsized = this.handleEllipsized.bind(this);\n  }\n\n  componentDidMount(): void {\n    this.initEllipsis();\n  }\n\n  componentDidUpdate(prevProps: TextProps) {\n    if (prevProps.ellipsis !== this.asProps.ellipsis) {\n      this.cleanUpEllipsis();\n\n      this.initEllipsis();\n    }\n  }\n\n  componentWillUnmount() {\n    this.cleanUpEllipsis();\n  }\n\n  render(): React.ReactNode {\n    const SText = Root;\n    const { color, underline, lineThrough, hintProps, children, ellipsis, resolveColor } = this.asProps;\n    const { showHint } = this.state;\n\n    const cropPosition = typeof ellipsis === 'object' ? (ellipsis.cropPosition ?? 'end') : (ellipsis === true ? 'end' : undefined);\n    let withHint = hintProps !== false;\n\n    const maxLineValue = typeof ellipsis === 'object' && ellipsis.maxLine !== undefined ? ellipsis.maxLine : undefined;\n    if (hintProps === undefined && maxLineValue !== undefined && maxLineValue > 1) {\n      withHint = false;\n    }\n\n    return sstyled(styles)(\n      <>\n        <SText\n          render={Box}\n          tag='span'\n          data-ui-name='Text'\n          ref={this.innerRef}\n          use:decoration={this.getTextDecoration(underline, lineThrough)}\n          use:color={resolveColor(color)}\n          use:ellipsis={Boolean(ellipsis)}\n          maxLine={maxLineValue}\n          trim={cropPosition}\n        />\n        {showHint && withHint && <Hint triggerRef={this.innerRef} {...hintProps}>{children}</Hint>}\n      </>,\n    );\n  }\n\n  private handleEllipsized(isEllipsis: boolean) {\n    this.setState({ showHint: isEllipsis });\n  }\n\n  private initEllipsis() {\n    const ellipsis = this.asProps.ellipsis;\n    if (ellipsis && this.innerRef.current) {\n      this.ellipsis = ellipsis instanceof Ellipsis ? ellipsis : new Ellipsis(this.innerRef.current, ellipsis === true ? {} : ellipsis);\n\n      this.ellipsis.on('isEllipsized', this.handleEllipsized);\n    }\n  }\n\n  private cleanUpEllipsis() {\n    this.ellipsis?.off('isEllipsized', this.handleEllipsized);\n    this.ellipsis?.cleanUp();\n    this.setState({ showHint: false });\n  }\n\n  private getTextDecoration(underline?: boolean, lineThrough?: boolean) {\n    if (underline) {\n      return 'underline';\n    }\n\n    if (lineThrough) {\n      return 'line-through';\n    }\n  }\n}\n\nexport default createComponent(TextRoot);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Text.js","names":["_core","require","_useColorResolver","_flexBox","_react","_interopRequireDefault","styles","sstyled","insert","getTextDecoration","underline","lineThrough","Text","props","ref","_ref","arguments[0]","_ref2","SText","Box","color","textDecoration","resolveColor","useColorResolver","createElement","cn","_objectSpread2","assignProps","displayName","_default","exports","createBaseComponent"],"sources":["../../src/Text.jsx"],"sourcesContent":["import { createBaseComponent, Root, sstyled } from '@semcore/core';\nimport { useColorResolver } from '@semcore/core/lib/utils/use/useColorResolver';\nimport { Box } from '@semcore/flex-box';\nimport React from 'react';\n\nimport styles from './style/text.shadow.css';\n\nfunction getTextDecoration(underline, lineThrough) {\n  if (underline) {\n    return 'underline';\n  }\n\n  if (lineThrough) {\n    return 'line-through';\n  }\n}\n\nfunction Text(props, ref) {\n  const SText = Root;\n  const { color, underline, lineThrough } = props;\n  const textDecoration = getTextDecoration(underline, lineThrough);\n  const resolveColor = useColorResolver();\n\n  return sstyled(styles)(\n    <SText\n      render={Box}\n      tag='span'\n      data-ui-name='Text'\n      ref={ref}\n      use:decoration={textDecoration}\n      use:color={resolveColor(color)}\n    />,\n  );\n}\n\nText.displayName = 'Text';\n\nexport default createBaseComponent(Text);\n"],"mappings":";;;;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAC,sBAAA,CAAAJ,OAAA;AAA0B;AAAA,IAAAK,MAAA,8BAAAN,KAAA,CAAAO,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAI1B,SAASC,iBAAiBA,CAACC,SAAS,EAAEC,WAAW,EAAE;EACjD,IAAID,SAAS,EAAE;IACb,OAAO,WAAW;EACpB;EAEA,IAAIC,WAAW,EAAE;IACf,OAAO,cAAc;EACvB;AACF;AAEA,SAASC,IAAIA,CAACC,KAAK,EAAEC,GAAG,EAAE;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;EACxB,IAAMC,KAAK,GAOCC,YAAG;EANf,IAAQC,KAAK,GAA6BP,KAAK,CAAvCO,KAAK;IAAEV,SAAS,GAAkBG,KAAK,CAAhCH,SAAS;IAAEC,WAAW,GAAKE,KAAK,CAArBF,WAAW;EACrC,IAAMU,cAAc,GAAGZ,iBAAiB,CAACC,SAAS,EAAEC,WAAW,CAAC;EAChE,IAAMW,YAAY,GAAG,IAAAC,kCAAgB,EAAC,CAAC;EAEvC,OAAAN,KAAA,GAAO,IAAAV,aAAO,EAACD,MAAM,CAAC,eACpBF,MAAA,YAAAoB,aAAA,CAACN,KAAK,EAAAD,KAAA,CAAAQ,EAAA,cAAAC,cAAA,qBAAA1B,KAAA,CAAA2B,WAAA;IAAA,OAEA,MAAM;IAAA,gBACG,MAAM;IAAA,OACdb,GAAG;IAAA,kBACQO,cAAc;IAAA,aACnBC,YAAY,CAACF,KAAK;EAAC,GAAAL,IAAA,GAC/B,CAAC;AAEN;AAEAH,IAAI,CAACgB,WAAW,GAAG,MAAM;AAAC,IAAAC,QAAA,GAAAC,OAAA,cAEX,IAAAC,yBAAmB,EAACnB,IAAI,CAAC","ignoreList":[]}

package/lib/cjs/index.d.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { BoxProps, Flex, FlexProps, EllipsisSettings, SimpleHintPopperProps, Ellipsis } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\nimport type { Property } from 'csstype';\nimport type React from 'react';\n\nexport type TextProps = BoxProps & {\n  /** Font size and line-heights */\n  size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800;\n  /**\n   * The text will not be wrapped on a new line and will be cut off with ellipsis\n   * @deprecated use ellipsis prop instead\n   **/\n  noWrap?: boolean;\n  /** CSS property `font-weight: 700;` */\n  bold?: boolean;\n  /** CSS property `font-weight: 600;` */\n  semibold?: boolean;\n  /** CSS property `font-weight: 500;` */\n  medium?: boolean;\n  /** Italicized text */\n  italic?: boolean;\n  /** Underlined text */\n  underline?: boolean;\n  /** CSS property `font-family: monospace;` */\n  monospace?: boolean;\n  /** Strikethrough text */\n  lineThrough?: boolean;\n  /** Uppercase text */\n  uppercase?: boolean;\n  /** Lowercase text */\n  lowercase?: boolean;\n  /** Capitalized text */\n  capitalize?: boolean;\n  /** Text color **/\n  color?: string;\n  /** Custom `font-size` */\n  fontSize?: Property.FontSize<any>;\n  /** Custom `line-height` */\n  lineHeight?: Property.LineHeight<any>;\n  /** Custom `font-weight` */\n  fontWeight?: Property.FontWeight;\n  /** Text alignment */\n  textAlign?: Property.TextAlign;\n  /** Enforces text color */\n  use?: 'primary' | 'secondary';\n  /** Makes text semi-transparent to indicate disabled state */\n  disabled?: boolean;\n  /** Enable formatting/styling for all nested HTML tags with our default styles for them */\n  formatTags?: boolean;\n  /** The text will not be wrapped on a new line and will be cut off with ellipsis. Also, it will show a hint with full text. */\n  ellipsis?: true | Readonly<EllipsisSettings> | Ellipsis;\n  /** Settings for a hint with full text (cropped by ellipsis) */\n  hintProps?: Partial<Omit<SimpleHintPopperProps, 'children'>> | false;\n};\n\nexport type ListProps = TextProps & {\n  /** Marker of the entire list\n   * @default • */\n  marker?: React.ReactNode;\n};\n\nexport type ListItemProps = TextProps & {\n  /** Individual marker of a list item */\n  marker?: React.ReactNode;\n};\n\nexport type ListItemContentProps = FlexProps;\n\nexport type ListContext = {\n  getItemProps: PropGetterFn;\n};\n\nexport type BlockquoteProps = BoxProps & {\n  /** Source of the quote */\n  author?: React.ReactNode;\n};\n\ndeclare const Item: Intergalactic.Component<'li', ListItemProps> & {\n  Content: Intergalactic.Component<typeof Flex, ListItemContentProps>;\n};\n\ndeclare const List: Intergalactic.Component<'ul', ListProps> & {\n  Item: typeof Item;\n};\n\ndeclare const Text: Intergalactic.Component<'span', TextProps>;\n\ndeclare const Blockquote: Intergalactic.Component<'blockquote', BlockquoteProps>;\n\nexport { Text, List, Blockquote };\n"],"mappings":"","ignoreList":[]}
+{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport type { BoxProps, Flex, FlexProps } from '@semcore/flex-box';\nimport type { Property } from 'csstype';\nimport type React from 'react';\n\n/** @deprecated */\nexport interface ITextProps extends TextProps, UnknownProperties {}\nexport type TextProps = BoxProps & {\n  /** Font size and line-heights */\n  size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800;\n  /** The text will not be wrapped on a new line and will be cut off with ellipsis */\n  noWrap?: boolean;\n  /** CSS property `font-weight: 700;` */\n  bold?: boolean;\n  /** CSS property `font-weight: 600;` */\n  semibold?: boolean;\n  /** CSS property `font-weight: 500;` */\n  medium?: boolean;\n  /** Italicized text */\n  italic?: boolean;\n  /** Underlined text */\n  underline?: boolean;\n  /** CSS property `font-family: monospace;` */\n  monospace?: boolean;\n  /** Strikethrough text */\n  lineThrough?: boolean;\n  /** Uppercase text */\n  uppercase?: boolean;\n  /** Lowercase text */\n  lowercase?: boolean;\n  /** Capitalized text */\n  capitalize?: boolean;\n  /** Text color **/\n  color?: string;\n  /** Custom `font-size` */\n  fontSize?: Property.FontSize<any>;\n  /** Custom `line-height` */\n  lineHeight?: Property.LineHeight<any>;\n  /** Custom `font-weight` */\n  fontWeight?: Property.FontWeight;\n  /** Text alignment */\n  textAlign?: Property.TextAlign;\n  /** Enforces text color */\n  use?: 'primary' | 'secondary';\n  /** Makes text semi-transparent to indicate disabled state */\n  disabled?: boolean;\n  /** Enable formatting/styling for all nested HTML tags with our default styles for them */\n  formatTags?: boolean;\n};\n\n/** @deprecated */\nexport interface IListProps extends ListProps, UnknownProperties {}\nexport type ListProps = TextProps & {\n  /** Marker of the entire list\n   * @default • */\n  marker?: React.ReactNode;\n};\n\n/** @deprecated */\nexport interface IListItemProps extends ListItemProps, UnknownProperties {}\nexport type ListItemProps = TextProps & {\n  /** Individual marker of a list item */\n  marker?: React.ReactNode;\n};\n\nexport type ListItemContentProps = FlexProps;\n\n/** @deprecated */\nexport interface IListContext extends ListContext, UnknownProperties {}\nexport type ListContext = {\n  getItemProps: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface IBlockquoteProps extends BlockquoteProps, UnknownProperties {}\nexport type BlockquoteProps = BoxProps & {\n  /** Source of the quote */\n  author?: React.ReactNode;\n};\n\ndeclare const Item: Intergalactic.Component<'li', ListItemProps> & {\n  Content: Intergalactic.Component<typeof Flex, ListItemContentProps>;\n};\n\ndeclare const List: Intergalactic.Component<'ul', ListProps> & {\n  Item: typeof Item;\n};\n\ndeclare const Text: Intergalactic.Component<'span', TextProps>;\n\ndeclare const Blockquote: Intergalactic.Component<'blockquote', BlockquoteProps>;\n\nexport { Text, List, Blockquote };\n"],"mappings":"","ignoreList":[]}

package/lib/cjs/index.js

@@ -1,25 +1,25 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 Object.defineProperty(exports, "Blockquote", {
   enumerable: true,
-  get: function () {
-    return _Blockquote.default;
+  get: function get() {
+    return _Blockquote["default"];
   }
 });
 Object.defineProperty(exports, "List", {
   enumerable: true,
-  get: function () {
-    return _List.default;
+  get: function get() {
+    return _List["default"];
   }
 });
 Object.defineProperty(exports, "Text", {
   enumerable: true,
-  get: function () {
-    return _Text.default;
+  get: function get() {
+    return _Text["default"];
   }
 });
 var _Text = _interopRequireDefault(require("./Text"));

package/lib/cjs/style/blockquote.shadow.css

@@ -4,7 +4,7 @@ SBlockquote {
   font-style: italic;
   font-size: var(--intergalactic-fs-400, 20px);
   line-height: var(--intergalactic-lh-400, 120%);
-  color: var(--intergalactic-text-primary, #191b23);
+  color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
 }
 
 SDoubleQuotation {
@@ -15,13 +15,13 @@ SDoubleQuotation {
   /* disable-tokens-validator */
   font-size: 68px;
   line-height: 52px;
-  color: var(--intergalactic-text-large-secondary, #a9abb6);
+  color: var(--intergalactic-text-large-secondary, oklch(0.088 0.026 147.7 / 0.583));
 }
 
 SAuthor {
   display: block;
   margin-top: var(--intergalactic-spacing-4x, 16px);
-  color: var(--intergalactic-text-secondary, #6c6e79);
+  color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
   font-style: normal;
   font-size: var(--intergalactic-fs-300, 16px);
   line-height: var(--intergalactic-lh-300, 150%);

package/lib/cjs/style/list.shadow.css

@@ -23,6 +23,6 @@ SItem + SItem {
 
 SMarker {
   margin-right: var(--intergalactic-spacing-2x, 8px);
-  color: var(--intergalactic-text-secondary, #6c6e79);
+  color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
   line-height: normal;
 }

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

@@ -5,15 +5,15 @@ SText {
   &[formatTags] {
 
     & abbr {
-      color: var(--intergalactic-text-secondary, #6c6e79);
-      text-decoration: underline dashed var(--intergalactic-text-secondary, #6c6e79);
+      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, #484a54);
-        text-decoration: underline dashed var(--intergalactic-text-hint-hover-active, #484a54);
+        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));
       }
     }
 
@@ -22,7 +22,7 @@ SText {
       background: none;
       outline: none;
       text-decoration: none;
-      color: var(--intergalactic-text-link, #006dca);
+      color: var(--intergalactic-text-link, oklch(0.53 0.21 263));
       border-bottom-width: 1px;
       border-bottom-style: solid;
       border-color: transparent;
@@ -31,8 +31,8 @@ SText {
       &:hover {
         outline: none;
         text-decoration: none;
-        color: var(--intergalactic-text-link-hover-active, #044792);
-        border-color: var(--intergalactic-text-link-hover-active, #044792);
+        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 {
@@ -58,7 +58,7 @@ SText {
         display: inline-block;
         position: absolute;
         left: 0;
-        color: var(--intergalactic-icon-secondary-neutral, #a9abb6);
+        color: var(--intergalactic-icon-secondary-neutral, oklch(0.104 0.023 162.3 / 0.385));
         font-family: Georgia, Times, 'Times New Roman', serif;
       }
 
@@ -66,7 +66,7 @@ SText {
         display: block;
         font-style: normal;
         margin-top: var(--intergalactic-spacing-4x, 16px);
-        color: var(--intergalactic-text-secondary, #6c6e79);
+        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%);
       }
@@ -83,7 +83,7 @@ SText {
         &:before {
           position: absolute;
           left: 0;
-          color: var(--intergalactic-text-secondary, #6c6e79);
+          color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
         }
       }
 
@@ -103,12 +103,7 @@ SText {
 
     & ul:not(ul[start], ul[reversed], ul[type]) li:not(SText):before {
       content: '';
-      background-color: var(--intergalactic-icon-primary-neutral, #6c6e79);
-    }
-
-    & 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);
+      background-color: var(--intergalactic-icon-primary-neutral, oklch(0.092 0.024 152.2 / 0.526));
     }
 
     & h1 {
@@ -184,7 +179,7 @@ SText {
     & h5,
     & h6 {
       & small {
-        color: var(--intergalactic-text-secondary, #6c6e79);
+        color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
         font-weight: 300;
         font-size: 100%;
       }
@@ -197,7 +192,7 @@ SText {
     }
 
     & p {
-      margin: 0 0 var(--intergalactic-spacing-4x, 16px) 0;
+      margin: 0 0 var(--intergalactic-spacing-5x, 20px) 0;
 
       &:last-child {
         margin-bottom: 0;
@@ -227,29 +222,6 @@ SText {
   }
 }
 
-SText[ellipsis] {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: pre;
-  display: inline-block;
-
-  &[trim='end']::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%);
@@ -303,7 +275,7 @@ SText[size='200'] {
     }
 
     & p {
-      margin: 0 0 var(--intergalactic-spacing-3x, 12px) 0;
+      margin: 0 0 var(--intergalactic-spacing-5x, 20px) 0;
 
       &:last-child {
         margin-bottom: 0;
@@ -345,7 +317,7 @@ SText[size='300'] {
     }
 
     & p {
-      margin: 0 0 var(--intergalactic-spacing-4x, 16px) 0;
+      margin: 0 0 var(--intergalactic-spacing-6x, 24px) 0;
 
       &:last-child {
         margin-bottom: 0;
@@ -462,15 +434,15 @@ SText[textAlign] {
 }
 
 SText[use='primary'] {
-  color: var(--intergalactic-text-primary, #191b23);
+  color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
 }
 
 SText[use='secondary'] {
-  color: var(--intergalactic-text-secondary, #6c6e79);
+  color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
 }
 
 SText[disabled] {
-  opacity: var(--intergalactic-disabled-opacity, 0.3);
+  opacity: var(--intergalactic-disabled-opacity, 0.4);
 }
 
 @media (prefers-reduced-motion) {

package/lib/es6/Blockquote.js

@@ -1,33 +1,30 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import { sstyled as _sstyled } from "@semcore/core";
 import { assignProps as _assignProps } from "@semcore/core";
-import { Box } from '@semcore/base-components';
 import { createBaseComponent, Root, sstyled } from '@semcore/core';
 import isNode from '@semcore/core/lib/utils/isNode';
+import { Box } from '@semcore/flex-box';
 import React from 'react';
 /*!__reshadow-styles__:"./style/blockquote.shadow.css"*/
-const styles = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SBlockquote_hkf9e_gg_{position:relative;display:flex;font-style:italic;font-size:var(--intergalactic-fs-400, 20px);line-height:var(--intergalactic-lh-400, 120%);color:var(--intergalactic-text-primary, #191b23)}.___SDoubleQuotation_hkf9e_gg_{position:relative;margin-right:var(--intergalactic-spacing-5x, 20px);font-family:\"Times New Roman\",serif;font-style:normal;font-size:68px;line-height:52px;color:var(--intergalactic-text-large-secondary, #a9abb6)}.___SAuthor_hkf9e_gg_{display:block;margin-top:var(--intergalactic-spacing-4x, 16px);color:var(--intergalactic-text-secondary, #6c6e79);font-style:normal;font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}", /*__inner_css_end__*/"hkf9e_gg_"),
+var styles = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SBlockquote_187c0_gg_{position:relative;display:flex;font-style:italic;font-size:var(--intergalactic-fs-400, 20px);line-height:var(--intergalactic-lh-400, 120%);color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}.___SDoubleQuotation_187c0_gg_{position:relative;margin-right:var(--intergalactic-spacing-5x, 20px);font-family:\"Times New Roman\",serif;font-style:normal;font-size:68px;line-height:52px;color:var(--intergalactic-text-large-secondary, rgba(0, 3, 0, 0.583))}@supports (color:color(display-p3 0 0 0%)){.___SDoubleQuotation_187c0_gg_{color:var(--intergalactic-text-large-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___SDoubleQuotation_187c0_gg_{color:var(--intergalactic-text-large-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}.___SAuthor_187c0_gg_{display:block;margin-top:var(--intergalactic-spacing-4x, 16px);color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583));font-style:normal;font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}@supports (color:color(display-p3 0 0 0%)){.___SAuthor_187c0_gg_{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___SAuthor_187c0_gg_{color:var(--intergalactic-text-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}", /*__inner_css_end__*/"187c0_gg_"),
 /*__reshadow_css_end__*/
 {
-  "__SBlockquote": "___SBlockquote_hkf9e_gg_",
-  "__SDoubleQuotation": "___SDoubleQuotation_hkf9e_gg_",
-  "__SAuthor": "___SAuthor_hkf9e_gg_"
+  "__SBlockquote": "___SBlockquote_187c0_gg_",
+  "__SDoubleQuotation": "___SDoubleQuotation_187c0_gg_",
+  "__SAuthor": "___SAuthor_187c0_gg_"
 });
 function Blockquote(props, ref) {
   var _ref = arguments[0],
     _ref2;
-  const SBlockquote = Box;
-  const SDoubleQuotation = 'span';
-  const SAuthor = 'cite';
-  const {
-    children,
-    author
-  } = props;
-  return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(SBlockquote, _ref2.cn("SBlockquote", {
-    ..._assignProps({
-      "tag": 'blockquote',
-      "ref": ref
-    }, _ref)
-  }), /*#__PURE__*/React.createElement(SDoubleQuotation, _ref2.cn("SDoubleQuotation", {}), "\u201C"), /*#__PURE__*/React.createElement("span", _ref2.cn("span", {}), children, isNode(author) && /*#__PURE__*/React.createElement(SAuthor, _ref2.cn("SAuthor", {}), author)));
+  var SBlockquote = Box;
+  var SDoubleQuotation = 'span';
+  var SAuthor = 'cite';
+  var children = props.children,
+    author = props.author;
+  return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(SBlockquote, _ref2.cn("SBlockquote", _objectSpread({}, _assignProps({
+    "tag": 'blockquote',
+    "ref": ref
+  }, _ref))), /*#__PURE__*/React.createElement(SDoubleQuotation, _ref2.cn("SDoubleQuotation", {}), "\u201C"), /*#__PURE__*/React.createElement("span", _ref2.cn("span", {}), children, isNode(author) && /*#__PURE__*/React.createElement(SAuthor, _ref2.cn("SAuthor", {}), author)));
 }
 Blockquote.displayName = 'Blockquote';
 export default createBaseComponent(Blockquote);

package/lib/es6/Blockquote.js.map

@@ -1 +1 @@
-{"version":3,"file":"Blockquote.js","names":["Box","createBaseComponent","Root","sstyled","isNode","React","styles","_sstyled","insert","Blockquote","props","ref","_ref","arguments[0]","_ref2","SBlockquote","SDoubleQuotation","SAuthor","children","author","createElement","cn","_assignProps","displayName"],"sources":["../../src/Blockquote.jsx"],"sourcesContent":["import { Box } from '@semcore/base-components';\nimport { createBaseComponent, Root, sstyled } from '@semcore/core';\nimport isNode from '@semcore/core/lib/utils/isNode';\nimport React from 'react';\n\nimport styles from './style/blockquote.shadow.css';\n\nfunction Blockquote(props, ref) {\n  const SBlockquote = Root;\n  const SDoubleQuotation = 'span';\n  const SAuthor = 'cite';\n  const { children, author } = props;\n\n  return sstyled(styles)(\n    <SBlockquote render={Box} tag='blockquote' ref={ref}>\n      <SDoubleQuotation>“</SDoubleQuotation>\n      <span>\n        {children}\n        {isNode(author) && <SAuthor>{author}</SAuthor>}\n      </span>\n    </SBlockquote>,\n  );\n}\n\nBlockquote.displayName = 'Blockquote';\n\nexport default createBaseComponent(Blockquote);\n"],"mappings":";;AAAA,SAASA,GAAG,QAAQ,0BAA0B;AAC9C,SAASC,mBAAmB,EAAEC,IAAI,EAAEC,OAAO,QAAQ,eAAe;AAClE,OAAOC,MAAM,MAAM,gCAAgC;AACnD,OAAOC,KAAK,MAAM,OAAO;AAAC;AAAA,MAAAC,MAAA,8BAAAC,QAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;AAAA;AAI1B,SAASC,UAAUA,CAACC,KAAK,EAAEC,GAAG,EAAE;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;EAC9B,MAAMC,WAAW,GAMMf,GAAG;EAL1B,MAAMgB,gBAAgB,GAAG,MAAM;EAC/B,MAAMC,OAAO,GAAG,MAAM;EACtB,MAAM;IAAEC,QAAQ;IAAEC;EAAO,CAAC,GAAGT,KAAK;EAElC,OAAAI,KAAA,GAAOX,OAAO,CAACG,MAAM,CAAC,eACpBD,KAAA,CAAAe,aAAA,CAACL,WAAW,EAAAD,KAAA,CAAAO,EAAA;IAAA,GAAAC,YAAA;MAAA,OAAkB,YAAY;MAAA,OAAMX;IAAG,GAAAC,IAAA;EAAA,iBACjDP,KAAA,CAAAe,aAAA,CAACJ,gBAAgB,EAAAF,KAAA,CAAAO,EAAA,0BAAC,QAAmB,CAAC,eACtChB,KAAA,CAAAe,aAAA,SAAAN,KAAA,CAAAO,EAAA,cACGH,QAAQ,EACRd,MAAM,CAACe,MAAM,CAAC,iBAAId,KAAA,CAAAe,aAAA,CAACH,OAAO,EAAAH,KAAA,CAAAO,EAAA,iBAAEF,MAAgB,CACzC,CACK,CAAC;AAElB;AAEAV,UAAU,CAACc,WAAW,GAAG,YAAY;AAErC,eAAetB,mBAAmB,CAACQ,UAAU,CAAC","ignoreList":[]}
+{"version":3,"file":"Blockquote.js","names":["createBaseComponent","Root","sstyled","isNode","Box","React","styles","_sstyled","insert","Blockquote","props","ref","_ref","arguments[0]","_ref2","SBlockquote","SDoubleQuotation","SAuthor","children","author","createElement","cn","_objectSpread","_assignProps","displayName"],"sources":["../../src/Blockquote.jsx"],"sourcesContent":["import { createBaseComponent, Root, sstyled } from '@semcore/core';\nimport isNode from '@semcore/core/lib/utils/isNode';\nimport { Box } from '@semcore/flex-box';\nimport React from 'react';\n\nimport styles from './style/blockquote.shadow.css';\n\nfunction Blockquote(props, ref) {\n  const SBlockquote = Root;\n  const SDoubleQuotation = 'span';\n  const SAuthor = 'cite';\n  const { children, author } = props;\n\n  return sstyled(styles)(\n    <SBlockquote render={Box} tag='blockquote' ref={ref}>\n      <SDoubleQuotation>“</SDoubleQuotation>\n      <span>\n        {children}\n        {isNode(author) && <SAuthor>{author}</SAuthor>}\n      </span>\n    </SBlockquote>,\n  );\n}\n\nBlockquote.displayName = 'Blockquote';\n\nexport default createBaseComponent(Blockquote);\n"],"mappings":";;;AAAA,SAASA,mBAAmB,EAAEC,IAAI,EAAEC,OAAO,QAAQ,eAAe;AAClE,OAAOC,MAAM,MAAM,gCAAgC;AACnD,SAASC,GAAG,QAAQ,mBAAmB;AACvC,OAAOC,KAAK,MAAM,OAAO;AAAC;AAAA,IAAAC,MAAA,8BAAAC,QAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;AAAA;AAI1B,SAASC,UAAUA,CAACC,KAAK,EAAEC,GAAG,EAAE;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;EAC9B,IAAMC,WAAW,GAMMX,GAAG;EAL1B,IAAMY,gBAAgB,GAAG,MAAM;EAC/B,IAAMC,OAAO,GAAG,MAAM;EACtB,IAAQC,QAAQ,GAAaR,KAAK,CAA1BQ,QAAQ;IAAEC,MAAM,GAAKT,KAAK,CAAhBS,MAAM;EAExB,OAAAL,KAAA,GAAOZ,OAAO,CAACI,MAAM,CAAC,eACpBD,KAAA,CAAAe,aAAA,CAACL,WAAW,EAAAD,KAAA,CAAAO,EAAA,gBAAAC,aAAA,KAAAC,YAAA;IAAA,OAAkB,YAAY;IAAA,OAAMZ;EAAG,GAAAC,IAAA,kBACjDP,KAAA,CAAAe,aAAA,CAACJ,gBAAgB,EAAAF,KAAA,CAAAO,EAAA,0BAAC,QAAmB,CAAC,eACtChB,KAAA,CAAAe,aAAA,SAAAN,KAAA,CAAAO,EAAA,cACGH,QAAQ,EACRf,MAAM,CAACgB,MAAM,CAAC,iBAAId,KAAA,CAAAe,aAAA,CAACH,OAAO,EAAAH,KAAA,CAAAO,EAAA,iBAAEF,MAAgB,CACzC,CACK,CAAC;AAElB;AAEAV,UAAU,CAACe,WAAW,GAAG,YAAY;AAErC,eAAexB,mBAAmB,CAACS,UAAU,CAAC","ignoreList":[]}

package/lib/es6/List.js

@@ -1,94 +1,104 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _callSuper from "@babel/runtime/helpers/callSuper";
+import _inherits from "@babel/runtime/helpers/inherits";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { sstyled as _sstyled } from "@semcore/core";
 import { assignProps as _assignProps3 } from "@semcore/core";
 import { assignProps as _assignProps2 } from "@semcore/core";
 import { assignProps as _assignProps } from "@semcore/core";
-import { Flex } from '@semcore/base-components';
 import { createComponent, Component, Root, sstyled } from '@semcore/core';
 import { isAdvanceMode } from '@semcore/core/lib/utils/findComponent';
 import isNode from '@semcore/core/lib/utils/isNode';
+import { Flex } from '@semcore/flex-box';
 import React from 'react';
 /*!__reshadow-styles__:"./style/list.shadow.css"*/
-const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SList_1i2n2_gg_{padding:0;margin:0;list-style-type:none}.___SContent_1i2n2_gg_{overflow:inherit;text-overflow:inherit}.___SItem_1i2n2_gg_+.___SItem_1i2n2_gg_,.___SList_1i2n2_gg_ .___SList_1i2n2_gg_{margin-top:var(--intergalactic-spacing-2x, 8px)}.___SItem_1i2n2_gg_{display:flex}.___SMarker_1i2n2_gg_{margin-right:var(--intergalactic-spacing-2x, 8px);color:var(--intergalactic-text-secondary, #6c6e79);line-height:normal}", /*__inner_css_end__*/"1i2n2_gg_"),
+var style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SList_ey0xg_gg_{padding:0;margin:0;list-style-type:none}.___SContent_ey0xg_gg_{overflow:inherit;text-overflow:inherit}.___SItem_ey0xg_gg_+.___SItem_ey0xg_gg_,.___SList_ey0xg_gg_ .___SList_ey0xg_gg_{margin-top:var(--intergalactic-spacing-2x, 8px)}.___SItem_ey0xg_gg_{display:flex}.___SMarker_ey0xg_gg_{margin-right:var(--intergalactic-spacing-2x, 8px);color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583));line-height:normal}@supports (color:color(display-p3 0 0 0%)){.___SMarker_ey0xg_gg_{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___SMarker_ey0xg_gg_{color:var(--intergalactic-text-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}", /*__inner_css_end__*/"ey0xg_gg_"),
 /*__reshadow_css_end__*/
 {
-  "__SList": "___SList_1i2n2_gg_",
-  "__SContent": "___SContent_1i2n2_gg_",
-  "__SItem": "___SItem_1i2n2_gg_",
-  "__SMarker": "___SMarker_1i2n2_gg_"
+  "__SList": "___SList_ey0xg_gg_",
+  "__SContent": "___SContent_ey0xg_gg_",
+  "__SItem": "___SItem_ey0xg_gg_",
+  "__SMarker": "___SMarker_ey0xg_gg_"
 });
 import Text from './Text';
-class ListRoot extends Component {
-  getItemProps() {
-    const {
-      marker
-    } = this.asProps;
-    return {
-      marker
-    };
+var ListRoot = /*#__PURE__*/function (_Component) {
+  function ListRoot() {
+    _classCallCheck(this, ListRoot);
+    return _callSuper(this, ListRoot, arguments);
   }
-  render() {
-    var _ref = this.asProps,
-      _ref4;
-    const SList = Text;
-    const {
-      styles
-    } = this.asProps;
-    return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(SList, _ref4.cn("SList", {
-      ..._assignProps({
+  _inherits(ListRoot, _Component);
+  return _createClass(ListRoot, [{
+    key: "getItemProps",
+    value: function getItemProps() {
+      var marker = this.asProps.marker;
+      return {
+        marker: marker
+      };
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _ref = this.asProps,
+        _ref4;
+      var SList = Text;
+      var styles = this.asProps.styles;
+      return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(SList, _ref4.cn("SList", _objectSpread({}, _assignProps({
         "tag": 'ul'
-      }, _ref)
-    }));
-  }
-}
+      }, _ref))));
+    }
+  }]);
+}(Component);
 _defineProperty(ListRoot, "displayName", 'List');
 _defineProperty(ListRoot, "style", style);
 _defineProperty(ListRoot, "defaultProps", {
   marker: '•'
 });
-class ItemRoot extends Component {
-  render() {
-    var _ref2 = this.asProps,
-      _ref5;
-    const SItem = Text;
-    const {
-      styles,
-      children,
-      marker: markerNode,
-      Children
-    } = this.asProps;
-    const SMarker = 'span';
-    const SContent = 'div';
-    const isAdvancedMode = isAdvanceMode(Children, [List.Item.Content.displayName]);
-    return _ref5 = sstyled(styles), /*#__PURE__*/React.createElement(SItem, _ref5.cn("SItem", {
-      ..._assignProps2({
-        "tag": 'li'
-      }, _ref2)
-    }), isNode(markerNode) && /*#__PURE__*/React.createElement(SMarker, _ref5.cn("SMarker", {
-      "aria-hidden": 'true'
-    }), markerNode), isAdvancedMode ? /*#__PURE__*/React.createElement(Children, _ref5.cn("Children", {})) : /*#__PURE__*/React.createElement(SContent, _ref5.cn("SContent", {}), children));
+var ItemRoot = /*#__PURE__*/function (_Component2) {
+  function ItemRoot() {
+    _classCallCheck(this, ItemRoot);
+    return _callSuper(this, ItemRoot, arguments);
   }
-}
+  _inherits(ItemRoot, _Component2);
+  return _createClass(ItemRoot, [{
+    key: "render",
+    value: function render() {
+      var _ref2 = this.asProps,
+        _ref5;
+      var SItem = Text;
+      var _this$asProps = this.asProps,
+        styles = _this$asProps.styles,
+        children = _this$asProps.children,
+        markerNode = _this$asProps.marker,
+        Children = _this$asProps.Children;
+      var SMarker = 'span';
+      var SContent = 'div';
+      var isAdvancedMode = isAdvanceMode(Children, [List.Item.Content.displayName]);
+      return _ref5 = sstyled(styles), /*#__PURE__*/React.createElement(SItem, _ref5.cn("SItem", _objectSpread({}, _assignProps2({
+        "tag": 'li'
+      }, _ref2))), isNode(markerNode) && /*#__PURE__*/React.createElement(SMarker, _ref5.cn("SMarker", {
+        "aria-hidden": 'true'
+      }), markerNode), isAdvancedMode ? /*#__PURE__*/React.createElement(Children, _ref5.cn("Children", {})) : /*#__PURE__*/React.createElement(SContent, _ref5.cn("SContent", {}), children));
+    }
+  }]);
+}(Component);
 _defineProperty(ItemRoot, "style", style);
 _defineProperty(ItemRoot, "displayName", 'Item');
 function Content(props) {
   var _ref3 = arguments[0],
     _ref6;
-  const {
-    styles,
-    children
-  } = props;
-  const SContent = Flex;
-  return _ref6 = sstyled(styles), /*#__PURE__*/React.createElement(SContent, _ref6.cn("SContent", {
-    ..._assignProps3({}, _ref3)
-  }), children);
+  var styles = props.styles,
+    children = props.children;
+  var SContent = Flex;
+  return _ref6 = sstyled(styles), /*#__PURE__*/React.createElement(SContent, _ref6.cn("SContent", _objectSpread({}, _assignProps3({}, _ref3))), children);
 }
 Content.displayName = 'Content';
-const Item = createComponent(ItemRoot, {
-  Content
+var Item = createComponent(ItemRoot, {
+  Content: Content
 });
-const List = createComponent(ListRoot, {
-  Item
+var List = createComponent(ListRoot, {
+  Item: Item
 });
 export default List;
 //# sourceMappingURL=List.js.map

package/lib/es6/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","names":["Flex","createComponent","Component","Root","sstyled","isAdvanceMode","isNode","React","style","_sstyled","insert","Text","ListRoot","getItemProps","marker","asProps","render","_ref","_ref4","SList","styles","createElement","cn","_assignProps","_defineProperty","ItemRoot","_ref2","_ref5","SItem","children","markerNode","Children","SMarker","SContent","isAdvancedMode","List","Item","Content","displayName","_assignProps2","props","_ref3","arguments[0]","_ref6","_assignProps3"],"sources":["../../src/List.jsx"],"sourcesContent":["import { Flex } from '@semcore/base-components';\nimport { createComponent, Component, Root, sstyled } from '@semcore/core';\nimport { isAdvanceMode } from '@semcore/core/lib/utils/findComponent';\nimport isNode from '@semcore/core/lib/utils/isNode';\nimport React from 'react';\n\nimport style from './style/list.shadow.css';\nimport Text from './Text';\n\nclass ListRoot extends Component {\n  static displayName = 'List';\n  static style = style;\n  static defaultProps = {\n    marker: '•',\n  };\n\n  getItemProps() {\n    const { marker } = this.asProps;\n    return {\n      marker,\n    };\n  }\n\n  render() {\n    const SList = Root;\n    const { styles } = this.asProps;\n    return sstyled(styles)(<SList render={Text} tag='ul' />);\n  }\n}\n\nclass ItemRoot extends Component {\n  static style = style;\n  static displayName = 'Item';\n\n  render() {\n    const SItem = Root;\n    const { styles, children, marker: markerNode, Children } = this.asProps;\n    const SMarker = 'span';\n    const SContent = 'div';\n\n    const isAdvancedMode = isAdvanceMode(Children, [List.Item.Content.displayName]);\n\n    return sstyled(styles)(\n      <SItem render={Text} tag='li'>\n        {isNode(markerNode) && <SMarker aria-hidden='true'>{markerNode}</SMarker>}\n        {isAdvancedMode ? <Children /> : <SContent>{children}</SContent>}\n      </SItem>,\n    );\n  }\n}\n\nfunction Content(props) {\n  const { styles, children } = props;\n  const SContent = Root;\n\n  return sstyled(styles)(<SContent render={Flex}>{children}</SContent>);\n}\n\nContent.displayName = 'Content';\n\nconst Item = createComponent(ItemRoot, { Content });\n\nconst List = createComponent(ListRoot, { Item });\n\nexport default List;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"List.js","names":["createComponent","Component","Root","sstyled","isAdvanceMode","isNode","Flex","React","style","_sstyled","insert","Text","ListRoot","_Component","_classCallCheck","_callSuper","arguments","_inherits","_createClass","key","value","getItemProps","marker","asProps","render","_ref","_ref4","SList","styles","createElement","cn","_objectSpread","_assignProps","_defineProperty","ItemRoot","_Component2","_ref2","_ref5","SItem","_this$asProps","children","markerNode","Children","SMarker","SContent","isAdvancedMode","List","Item","Content","displayName","_assignProps2","props","_ref3","arguments[0]","_ref6","_assignProps3"],"sources":["../../src/List.jsx"],"sourcesContent":["import { createComponent, Component, Root, sstyled } from '@semcore/core';\nimport { isAdvanceMode } from '@semcore/core/lib/utils/findComponent';\nimport isNode from '@semcore/core/lib/utils/isNode';\nimport { Flex } from '@semcore/flex-box';\nimport React from 'react';\n\nimport style from './style/list.shadow.css';\nimport Text from './Text';\n\nclass ListRoot extends Component {\n  static displayName = 'List';\n  static style = style;\n  static defaultProps = {\n    marker: '•',\n  };\n\n  getItemProps() {\n    const { marker } = this.asProps;\n    return {\n      marker,\n    };\n  }\n\n  render() {\n    const SList = Root;\n    const { styles } = this.asProps;\n    return sstyled(styles)(<SList render={Text} tag='ul' />);\n  }\n}\n\nclass ItemRoot extends Component {\n  static style = style;\n  static displayName = 'Item';\n\n  render() {\n    const SItem = Root;\n    const { styles, children, marker: markerNode, Children } = this.asProps;\n    const SMarker = 'span';\n    const SContent = 'div';\n\n    const isAdvancedMode = isAdvanceMode(Children, [List.Item.Content.displayName]);\n\n    return sstyled(styles)(\n      <SItem render={Text} tag='li'>\n        {isNode(markerNode) && <SMarker aria-hidden='true'>{markerNode}</SMarker>}\n        {isAdvancedMode ? <Children /> : <SContent>{children}</SContent>}\n      </SItem>,\n    );\n  }\n}\n\nfunction Content(props) {\n  const { styles, children } = props;\n  const SContent = Root;\n\n  return sstyled(styles)(<SContent render={Flex}>{children}</SContent>);\n}\n\nContent.displayName = 'Content';\n\nconst Item = createComponent(ItemRoot, { Content });\n\nconst List = createComponent(ListRoot, { Item });\n\nexport default List;\n"],"mappings":";;;;;;;;;;AAAA,SAASA,eAAe,EAAEC,SAAS,EAAEC,IAAI,EAAEC,OAAO,QAAQ,eAAe;AACzE,SAASC,aAAa,QAAQ,uCAAuC;AACrE,OAAOC,MAAM,MAAM,gCAAgC;AACnD,SAASC,IAAI,QAAQ,mBAAmB;AACxC,OAAOC,KAAK,MAAM,OAAO;AAAC;AAAA,IAAAC,KAAA,8BAAAC,QAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAG1B,OAAOC,IAAI,MAAM,QAAQ;AAAC,IAEpBC,QAAQ,0BAAAC,UAAA;EAAA,SAAAD,SAAA;IAAAE,eAAA,OAAAF,QAAA;IAAA,OAAAG,UAAA,OAAAH,QAAA,EAAAI,SAAA;EAAA;EAAAC,SAAA,CAAAL,QAAA,EAAAC,UAAA;EAAA,OAAAK,YAAA,CAAAN,QAAA;IAAAO,GAAA;IAAAC,KAAA,EAOZ,SAAAC,YAAYA,CAAA,EAAG;MACb,IAAQC,MAAM,GAAK,IAAI,CAACC,OAAO,CAAvBD,MAAM;MACd,OAAO;QACLA,MAAM,EAANA;MACF,CAAC;IACH;EAAC;IAAAH,GAAA;IAAAC,KAAA,EAED,SAAAI,MAAMA,CAAA,EAAG;MAAA,IAAAC,IAAA,QAAAF,OAAA;QAAAG,KAAA;MACP,IAAMC,KAAK,GAE2BhB,IAAI;MAD1C,IAAQiB,MAAM,GAAK,IAAI,CAACL,OAAO,CAAvBK,MAAM;MACd,OAAAF,KAAA,GAAOvB,OAAO,CAACyB,MAAM,CAAC,eAACrB,KAAA,CAAAsB,aAAA,CAACF,KAAK,EAAAD,KAAA,CAAAI,EAAA,UAAAC,aAAA,KAAAC,YAAA;QAAA,OAAmB;MAAI,GAAAP,IAAA,GAAE,CAAC;IACzD;EAAC;AAAA,EAlBoBxB,SAAS;AAAAgC,eAAA,CAA1BrB,QAAQ,iBACS,MAAM;AAAAqB,eAAA,CADvBrB,QAAQ,WAEGJ,KAAK;AAAAyB,eAAA,CAFhBrB,QAAQ,kBAGU;EACpBU,MAAM,EAAE;AACV,CAAC;AAAA,IAgBGY,QAAQ,0BAAAC,WAAA;EAAA,SAAAD,SAAA;IAAApB,eAAA,OAAAoB,QAAA;IAAA,OAAAnB,UAAA,OAAAmB,QAAA,EAAAlB,SAAA;EAAA;EAAAC,SAAA,CAAAiB,QAAA,EAAAC,WAAA;EAAA,OAAAjB,YAAA,CAAAgB,QAAA;IAAAf,GAAA;IAAAC,KAAA,EAIZ,SAAAI,MAAMA,CAAA,EAAG;MAAA,IAAAY,KAAA,QAAAb,OAAA;QAAAc,KAAA;MACP,IAAMC,KAAK,GAQM3B,IAAI;MAPrB,IAAA4B,aAAA,GAA2D,IAAI,CAAChB,OAAO;QAA/DK,MAAM,GAAAW,aAAA,CAANX,MAAM;QAAEY,QAAQ,GAAAD,aAAA,CAARC,QAAQ;QAAUC,UAAU,GAAAF,aAAA,CAAlBjB,MAAM;QAAcoB,QAAQ,GAAAH,aAAA,CAARG,QAAQ;MACtD,IAAMC,OAAO,GAAG,MAAM;MACtB,IAAMC,QAAQ,GAAG,KAAK;MAEtB,IAAMC,cAAc,GAAGzC,aAAa,CAACsC,QAAQ,EAAE,CAACI,IAAI,CAACC,IAAI,CAACC,OAAO,CAACC,WAAW,CAAC,CAAC;MAE/E,OAAAZ,KAAA,GAAOlC,OAAO,CAACyB,MAAM,CAAC,eACpBrB,KAAA,CAAAsB,aAAA,CAACS,KAAK,EAAAD,KAAA,CAAAP,EAAA,UAAAC,aAAA,KAAAmB,aAAA;QAAA,OAAmB;MAAI,GAAAd,KAAA,KAC1B/B,MAAM,CAACoC,UAAU,CAAC,iBAAIlC,KAAA,CAAAsB,aAAA,CAACc,OAAO,EAAAN,KAAA,CAAAP,EAAA;QAAA,eAAa;MAAM,IAAEW,UAAoB,CAAC,EACxEI,cAAc,gBAAGtC,KAAA,CAAAsB,aAAA,CAACa,QAAQ,EAAAL,KAAA,CAAAP,EAAA,gBAAE,CAAC,gBAAGvB,KAAA,CAAAsB,aAAA,CAACe,QAAQ,EAAAP,KAAA,CAAAP,EAAA,kBAAEU,QAAmB,CAC1D,CAAC;IAEZ;EAAC;AAAA,EAlBoBvC,SAAS;AAAAgC,eAAA,CAA1BC,QAAQ,WACG1B,KAAK;AAAAyB,eAAA,CADhBC,QAAQ,iBAES,MAAM;AAmB7B,SAASc,OAAOA,CAACG,KAAK,EAAE;EAAA,IAAAC,KAAA,GAAAC,YAAA;IAAAC,KAAA;EACtB,IAAQ1B,MAAM,GAAeuB,KAAK,CAA1BvB,MAAM;IAAEY,QAAQ,GAAKW,KAAK,CAAlBX,QAAQ;EACxB,IAAMI,QAAQ,GAE2BtC,IAAI;EAA7C,OAAAgD,KAAA,GAAOnD,OAAO,CAACyB,MAAM,CAAC,eAACrB,KAAA,CAAAsB,aAAA,CAACe,QAAQ,EAAAU,KAAA,CAAAxB,EAAA,aAAAC,aAAA,KAAAwB,aAAA,KAAAH,KAAA,KAAgBZ,QAAmB,CAAC;AACtE;AAEAQ,OAAO,CAACC,WAAW,GAAG,SAAS;AAE/B,IAAMF,IAAI,GAAG/C,eAAe,CAACkC,QAAQ,EAAE;EAAEc,OAAO,EAAPA;AAAQ,CAAC,CAAC;AAEnD,IAAMF,IAAI,GAAG9C,eAAe,CAACY,QAAQ,EAAE;EAAEmC,IAAI,EAAJA;AAAK,CAAC,CAAC;AAEhD,eAAeD,IAAI","ignoreList":[]}