@hh.ru/magritte-ui-text-list 1.1.0

package/TextList.d.ts

@@ -0,0 +1,8 @@
+import { TextTypography } from '@hh.ru/magritte-ui-typography';
+type Paragraph<Typography> = Typography extends `paragraph-${string}` ? Typography : never;
+export interface TextListProps {
+    Element?: 'ul' | 'ol';
+    typography?: Paragraph<TextTypography>;
+}
+export declare const TextList: React.FC<React.PropsWithChildren<TextListProps & JSX.IntrinsicElements[Required<TextListProps>['Element']]>>;
+export {};

package/TextList.js

@@ -0,0 +1,21 @@
+import './index.css';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Children, cloneElement } from 'react';
+import classnames from 'classnames';
+import { Text, isTextElement } from '@hh.ru/magritte-ui-typography';
+
+var styles = {"list":"magritte-list___cNNtz_1-1-0","paragraph-1-regular":"magritte-paragraph-1-regular___et3fO_1-1-0","paragraph1Regular":"magritte-paragraph-1-regular___et3fO_1-1-0","paragraph-2-regular":"magritte-paragraph-2-regular___KBhHQ_1-1-0","paragraph2Regular":"magritte-paragraph-2-regular___KBhHQ_1-1-0","paragraph-3-regular":"magritte-paragraph-3-regular___eyi5y_1-1-0","paragraph3Regular":"magritte-paragraph-3-regular___eyi5y_1-1-0","paragraph-4-regular":"magritte-paragraph-4-regular___zftoT_1-1-0","paragraph4Regular":"magritte-paragraph-4-regular___zftoT_1-1-0","numbered":"magritte-numbered___J770f_1-1-0","item":"magritte-item___kn-Qh_1-1-0","marker":"magritte-marker___r-3yT_1-1-0","marked":"magritte-marked___Fsh2t_1-1-0","content":"magritte-content___Zt8a6_1-1-0"};
+
+const TextList = ({ Element = 'ul', children, typography = 'paragraph-2-regular' }) => {
+    return (jsx(Element, { className: classnames(styles.list, styles[typography], {
+            [styles.marked]: Element === 'ul',
+            [styles.numbered]: Element === 'ol',
+        }), children: Children.map(children, (child) => {
+            return (jsxs("li", { className: styles.item, children: [jsx(Text, { typography: typography, children: jsx("div", { className: styles.marker }) }), jsx("div", { className: styles.content, children: isTextElement(child) && !('typography' in child.props)
+                            ? cloneElement(child, { typography })
+                            : child })] }));
+        }) }));
+};
+
+export { TextList };
+//# sourceMappingURL=TextList.js.map

package/TextList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextList.js","sources":["../src/TextList.tsx"],"sourcesContent":["import { Children, cloneElement } from 'react';\nimport classnames from 'classnames';\n\nimport { Text, TextTypography, isTextElement } from '@hh.ru/magritte-ui-typography';\n\nimport styles from './text-list.less';\n\ntype Paragraph<Typography> = Typography extends `paragraph-${string}` ? Typography : never;\n\nexport interface TextListProps {\n    Element?: 'ul' | 'ol';\n    typography?: Paragraph<TextTypography>;\n}\n\nexport const TextList: React.FC<\n    React.PropsWithChildren<TextListProps & JSX.IntrinsicElements[Required<TextListProps>['Element']]>\n> = ({ Element = 'ul', children, typography = 'paragraph-2-regular' }) => {\n    return (\n        <Element\n            className={classnames(styles.list, styles[typography], {\n                [styles.marked]: Element === 'ul',\n                [styles.numbered]: Element === 'ol',\n            })}\n        >\n            {Children.map(children, (child) => {\n                return (\n                    <li className={styles.item}>\n                        <Text typography={typography}>\n                            <div className={styles.marker} />\n                        </Text>\n                        <div className={styles.content}>\n                            {isTextElement(child) && !('typography' in child.props)\n                                ? cloneElement(child, { typography })\n                                : child}\n                        </div>\n                    </li>\n                );\n            })}\n        </Element>\n    );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;AAca,MAAA,QAAQ,GAEjB,CAAC,EAAE,OAAO,GAAG,IAAI,EAAE,QAAQ,EAAE,UAAU,GAAG,qBAAqB,EAAE,KAAI;AACrE,IAAA,QACIA,GAAC,CAAA,OAAO,EACJ,EAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,UAAU,CAAC,EAAE;AACnD,YAAA,CAAC,MAAM,CAAC,MAAM,GAAG,OAAO,KAAK,IAAI;AACjC,YAAA,CAAC,MAAM,CAAC,QAAQ,GAAG,OAAO,KAAK,IAAI;SACtC,CAAC,EAAA,QAAA,EAED,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,KAAI;AAC9B,YAAA,QACIC,IAAI,CAAA,IAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,IAAI,EACtB,QAAA,EAAA,CAAAD,GAAA,CAAC,IAAI,EAAC,EAAA,UAAU,EAAE,UAAU,EAAA,QAAA,EACxBA,aAAK,SAAS,EAAE,MAAM,CAAC,MAAM,GAAI,EAC9B,CAAA,EACPA,aAAK,SAAS,EAAE,MAAM,CAAC,OAAO,YACzB,aAAa,CAAC,KAAK,CAAC,IAAI,EAAE,YAAY,IAAI,KAAK,CAAC,KAAK,CAAC;8BACjD,YAAY,CAAC,KAAK,EAAE,EAAE,UAAU,EAAE,CAAC;AACrC,8BAAE,KAAK,EACT,CAAA,CAAA,EAAA,CACL,EACP;SACL,CAAC,EACI,CAAA,EACZ;AACN;;;;"}

package/index.css

@@ -0,0 +1,56 @@
+:root{
+  --magritte-static-space-200-v22-1-0:8px;
+  --magritte-static-space-300-v22-1-0:12px;
+}
+.magritte-list___cNNtz_1-1-0{
+  display:grid;
+  grid-template-columns:min-content auto;
+  list-style-type:none;
+}
+.magritte-paragraph-1-regular___et3fO_1-1-0{
+  gap:var(--magritte-static-space-300-v22-1-0) 0;
+}
+.magritte-paragraph-2-regular___KBhHQ_1-1-0{
+  gap:var(--magritte-static-space-200-v22-1-0) 0;
+}
+.magritte-paragraph-3-regular___eyi5y_1-1-0{
+  gap:var(--magritte-static-space-200-v22-1-0) 0;
+}
+.magritte-paragraph-4-regular___zftoT_1-1-0{
+  gap:var(--magritte-static-space-200-v22-1-0) 0;
+}
+.magritte-numbered___J770f_1-1-0{
+  counter-set:list-counter;
+}
+.magritte-item___kn-Qh_1-1-0{
+  display:contents;
+}
+.magritte-marker___r-3yT_1-1-0{
+  display:block;
+  text-align:right;
+  padding:0 var(--list-marker-padding);
+}
+.magritte-marked___Fsh2t_1-1-0 .magritte-marker___r-3yT_1-1-0::before{
+  content:'•';
+}
+.magritte-numbered___J770f_1-1-0 .magritte-marker___r-3yT_1-1-0{
+  counter-increment:list-counter;
+}
+.magritte-numbered___J770f_1-1-0 .magritte-marker___r-3yT_1-1-0::before{
+  content:counter(list-counter) '.';
+}
+.magritte-paragraph-1-regular___et3fO_1-1-0 .magritte-marker___r-3yT_1-1-0{
+  padding:0 10px;
+}
+.magritte-paragraph-2-regular___KBhHQ_1-1-0 .magritte-marker___r-3yT_1-1-0{
+  padding:0 9px;
+}
+.magritte-paragraph-3-regular___eyi5y_1-1-0 .magritte-marker___r-3yT_1-1-0{
+  padding:0 8px;
+}
+.magritte-paragraph-4-regular___zftoT_1-1-0 .magritte-marker___r-3yT_1-1-0{
+  padding:0 7px;
+}
+.magritte-content___Zt8a6_1-1-0{
+  display:block;
+}

package/index.d.ts

@@ -0,0 +1 @@
+export * from '@hh.ru/magritte-ui-text-list/TextList';

package/index.js

@@ -0,0 +1,7 @@
+import './index.css';
+export { TextList } from './TextList.js';
+import 'react/jsx-runtime';
+import 'react';
+import 'classnames';
+import '@hh.ru/magritte-ui-typography';
+//# sourceMappingURL=index.js.map

package/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@hh.ru/magritte-ui-text-list",
+  "version": "1.1.0",
+  "main": "index.js",
+  "types": "index.d.ts",
+  "sideEffects": [
+    "index.css"
+  ],
+  "scripts": {
+    "build": "yarn root:build $(pwd)",
+    "build-test-branch": "yarn root:build-test-branch $(pwd)",
+    "prepack": "yarn root:prepack $(pwd)",
+    "postpublish": "yarn root:postpublish $(pwd)",
+    "stylelint-check": "yarn root:stylelint-check $(pwd)",
+    "eslint-check": "yarn root:eslint-check $(pwd)",
+    "ts-config": "yarn root:ts-config $(pwd)",
+    "ts-check": "yarn root:ts-check $(pwd)",
+    "test": "yarn root:test $(pwd)",
+    "watch": "yarn root:watch $(pwd)"
+  },
+  "dependencies": {
+    "@hh.ru/magritte-ui-mock-component": "1.1.4",
+    "@hh.ru/magritte-ui-typography": "4.1.0"
+  },
+  "peerDependencies": {
+    "classnames": ">=2.3.2",
+    "react": ">=18.2.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "gitHead": "89aedbfa1b7f5abf2a91ce8a543286e75a78385f"
+}