@entur/typography 2.1.4 → 2.1.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/beta/cjs/components/Text.cjs.map +1 -1
- package/dist/beta/cjs/utils/utils.cjs.map +1 -1
- package/dist/beta/esm/components/Text.mjs +1 -1
- package/dist/beta/esm/components/Text.mjs.map +1 -1
- package/dist/beta/esm/utils/utils.mjs.map +1 -1
- package/dist/beta/types/components/Text.d.ts +1 -1
- package/dist/beta/types/utils/utils.d.ts +1 -1
- package/package.json +5 -7
- package/scripts/migrate-typography.mjs +1 -89
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.cjs","sources":["../../../../src/beta/components/Text.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport { PolymorphicComponentProps } from '@entur/utils';\n\nimport {\n
|
|
1
|
+
{"version":3,"file":"Text.cjs","sources":["../../../../src/beta/components/Text.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport { PolymorphicComponentProps } from '@entur/utils';\n\nimport {\n getSemanticTypeFromTextVariant,\n getSpacingClasses,\n} from '../utils/utils';\n\nimport {\n TypographySize,\n TypographySpacing,\n TypographyTextVariant,\n TypographyWeight,\n} from '../types';\n\nimport './text.scss';\n\ntype TextBaseProps = {\n /** Visuell tekststørrelse (typografi-token) */\n size?: TypographySize;\n /** Fontvekt */\n weight?: TypographyWeight;\n /** Variant (kan brukes til spesielle typer tekst som for eksempel caption) */\n variant?: TypographyTextVariant;\n /** Innhold */\n children: React.ReactNode;\n /** Spacing around the component */\n spacing?: TypographySpacing;\n /** Ekstra klassenavn */\n className?: string;\n};\n\nexport type TextProps<C extends React.ElementType> = PolymorphicComponentProps<\n C,\n TextBaseProps\n>;\n\nconst TypographyText = <C extends React.ElementType = 'p'>({\n children,\n as,\n size,\n variant,\n weight,\n spacing,\n className,\n ...rest\n}: TextProps<C>) => {\n const BodyElement = as || getSemanticTypeFromTextVariant(variant);\n\n return (\n <BodyElement\n className={classNames(\n 'eds-text',\n variant && `eds-text--${variant}`,\n size && `eds-text--${size}`,\n weight && `eds-text--weight-${weight}`,\n getSpacingClasses(spacing, 'eds-text'),\n className,\n )}\n {...rest}\n >\n {children}\n </BodyElement>\n );\n};\n\n// Export as Text to avoid DOM conflicts\nexport const Text = TypographyText;\n"],"names":["getSemanticTypeFromTextVariant","jsx","getSpacingClasses"],"mappings":";;;;;;AAwCA,MAAM,iBAAiB,CAAoC;AAAA,EACzD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAoB;AAClB,QAAM,cAAc,MAAMA,MAAAA,+BAA+B,OAAO;AAEhE,SACEC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,WAAW,aAAa,OAAO;AAAA,QAC/B,QAAQ,aAAa,IAAI;AAAA,QACzB,UAAU,oBAAoB,MAAM;AAAA,QACpCC,MAAAA,kBAAkB,SAAS,UAAU;AAAA,QACrC;AAAA,MAAA;AAAA,MAED,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;AAGO,MAAM,OAAO;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.cjs","sources":["../../../../src/beta/utils/utils.ts"],"sourcesContent":["import {\n
|
|
1
|
+
{"version":3,"file":"utils.cjs","sources":["../../../../src/beta/utils/utils.ts"],"sourcesContent":["import {\n TypographyHeadingVariant,\n TypographySpacing,\n TypographyTextVariant,\n} from '../types';\n\n/**\n * Get spacing classes for a component\n */\nexport function getSpacingClasses(\n spacing: TypographySpacing | undefined,\n baseClass: string,\n): string {\n if (!spacing) return '';\n\n const spacingMap: Record<string, string> = {\n none: `${baseClass}--spacing-none`,\n xs2: `${baseClass}--spacing-xs2`,\n 'xs2-top': `${baseClass}--spacing-xs2-top`,\n 'xs2-bottom': `${baseClass}--spacing-xs2-bottom`,\n xs: `${baseClass}--spacing-xs`,\n 'xs-top': `${baseClass}--spacing-xs-top`,\n 'xs-bottom': `${baseClass}--spacing-xs-bottom`,\n sm: `${baseClass}--spacing-sm`,\n 'sm-top': `${baseClass}--spacing-sm-top`,\n 'sm-bottom': `${baseClass}--spacing-sm-bottom`,\n md: `${baseClass}--spacing-md`,\n 'md-top': `${baseClass}--spacing-md-top`,\n 'md-bottom': `${baseClass}--spacing-md-bottom`,\n lg: `${baseClass}--spacing-lg`,\n 'lg-top': `${baseClass}--spacing-lg-top`,\n 'lg-bottom': `${baseClass}--spacing-lg-bottom`,\n xl: `${baseClass}--spacing-xl`,\n 'xl-top': `${baseClass}--spacing-xl-top`,\n 'xl-bottom': `${baseClass}--spacing-xl-bottom`,\n };\n\n return spacingMap[spacing] || '';\n}\n\n/**\n * Get heading variant based on semantic HTML element\n */\nexport function getHeadingVariantFromSemanticType(\n element: string | React.ElementType,\n): TypographyHeadingVariant {\n const elementStr = typeof element === 'string' ? element : element.toString();\n\n switch (elementStr.toLowerCase()) {\n case 'h1':\n return 'title-1';\n case 'h2':\n return 'title-2';\n case 'h3':\n return 'subtitle-1';\n case 'h4':\n return 'subtitle-2';\n case 'h5':\n return 'section-1';\n case 'h6':\n return 'section-2';\n default:\n return 'title-1';\n }\n}\n\n/**\n * Get semantic HTML element from text variant\n */\nexport function getSemanticTypeFromTextVariant(\n variant: TypographyTextVariant | undefined,\n): string {\n if (!variant) return 'p';\n\n switch (variant) {\n case 'label':\n return 'label';\n case 'sublabel':\n return 'span';\n case 'caption':\n return 'span';\n case 'overline':\n return 'span';\n case 'link':\n return 'a';\n case 'code-text':\n return 'code';\n case 'preformatted-text':\n return 'pre';\n case 'quote':\n return 'blockquote';\n case 'leading':\n case 'paragraph':\n case 'subparagraph':\n case 'emphasized':\n default:\n return 'p';\n }\n}\n"],"names":[],"mappings":";;AASO,SAAS,kBACd,SACA,WACQ;AACR,MAAI,CAAC,QAAS,QAAO;AAErB,QAAM,aAAqC;AAAA,IACzC,MAAM,GAAG,SAAS;AAAA,IAClB,KAAK,GAAG,SAAS;AAAA,IACjB,WAAW,GAAG,SAAS;AAAA,IACvB,cAAc,GAAG,SAAS;AAAA,IAC1B,IAAI,GAAG,SAAS;AAAA,IAChB,UAAU,GAAG,SAAS;AAAA,IACtB,aAAa,GAAG,SAAS;AAAA,IACzB,IAAI,GAAG,SAAS;AAAA,IAChB,UAAU,GAAG,SAAS;AAAA,IACtB,aAAa,GAAG,SAAS;AAAA,IACzB,IAAI,GAAG,SAAS;AAAA,IAChB,UAAU,GAAG,SAAS;AAAA,IACtB,aAAa,GAAG,SAAS;AAAA,IACzB,IAAI,GAAG,SAAS;AAAA,IAChB,UAAU,GAAG,SAAS;AAAA,IACtB,aAAa,GAAG,SAAS;AAAA,IACzB,IAAI,GAAG,SAAS;AAAA,IAChB,UAAU,GAAG,SAAS;AAAA,IACtB,aAAa,GAAG,SAAS;AAAA,EAAA;AAG3B,SAAO,WAAW,OAAO,KAAK;AAChC;AAKO,SAAS,kCACd,SAC0B;AAC1B,QAAM,aAAa,OAAO,YAAY,WAAW,UAAU,QAAQ,SAAA;AAEnE,UAAQ,WAAW,eAAY;AAAA,IAC7B,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EAAA;AAEb;AAKO,SAAS,+BACd,SACQ;AACR,MAAI,CAAC,QAAS,QAAO;AAErB,UAAQ,SAAA;AAAA,IACN,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL;AACE,aAAO;AAAA,EAAA;AAEb;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import classNames from "classnames";
|
|
3
|
-
import {
|
|
3
|
+
import { getSpacingClasses, getSemanticTypeFromTextVariant } from "../utils/utils.mjs";
|
|
4
4
|
/* empty css */
|
|
5
5
|
const TypographyText = ({
|
|
6
6
|
children,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.mjs","sources":["../../../../src/beta/components/Text.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport { PolymorphicComponentProps } from '@entur/utils';\n\nimport {\n
|
|
1
|
+
{"version":3,"file":"Text.mjs","sources":["../../../../src/beta/components/Text.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport { PolymorphicComponentProps } from '@entur/utils';\n\nimport {\n getSemanticTypeFromTextVariant,\n getSpacingClasses,\n} from '../utils/utils';\n\nimport {\n TypographySize,\n TypographySpacing,\n TypographyTextVariant,\n TypographyWeight,\n} from '../types';\n\nimport './text.scss';\n\ntype TextBaseProps = {\n /** Visuell tekststørrelse (typografi-token) */\n size?: TypographySize;\n /** Fontvekt */\n weight?: TypographyWeight;\n /** Variant (kan brukes til spesielle typer tekst som for eksempel caption) */\n variant?: TypographyTextVariant;\n /** Innhold */\n children: React.ReactNode;\n /** Spacing around the component */\n spacing?: TypographySpacing;\n /** Ekstra klassenavn */\n className?: string;\n};\n\nexport type TextProps<C extends React.ElementType> = PolymorphicComponentProps<\n C,\n TextBaseProps\n>;\n\nconst TypographyText = <C extends React.ElementType = 'p'>({\n children,\n as,\n size,\n variant,\n weight,\n spacing,\n className,\n ...rest\n}: TextProps<C>) => {\n const BodyElement = as || getSemanticTypeFromTextVariant(variant);\n\n return (\n <BodyElement\n className={classNames(\n 'eds-text',\n variant && `eds-text--${variant}`,\n size && `eds-text--${size}`,\n weight && `eds-text--weight-${weight}`,\n getSpacingClasses(spacing, 'eds-text'),\n className,\n )}\n {...rest}\n >\n {children}\n </BodyElement>\n );\n};\n\n// Export as Text to avoid DOM conflicts\nexport const Text = TypographyText;\n"],"names":[],"mappings":";;;;AAwCA,MAAM,iBAAiB,CAAoC;AAAA,EACzD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAoB;AAClB,QAAM,cAAc,MAAM,+BAA+B,OAAO;AAEhE,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,WAAW,aAAa,OAAO;AAAA,QAC/B,QAAQ,aAAa,IAAI;AAAA,QACzB,UAAU,oBAAoB,MAAM;AAAA,QACpC,kBAAkB,SAAS,UAAU;AAAA,QACrC;AAAA,MAAA;AAAA,MAED,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;AAGO,MAAM,OAAO;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.mjs","sources":["../../../../src/beta/utils/utils.ts"],"sourcesContent":["import {\n
|
|
1
|
+
{"version":3,"file":"utils.mjs","sources":["../../../../src/beta/utils/utils.ts"],"sourcesContent":["import {\n TypographyHeadingVariant,\n TypographySpacing,\n TypographyTextVariant,\n} from '../types';\n\n/**\n * Get spacing classes for a component\n */\nexport function getSpacingClasses(\n spacing: TypographySpacing | undefined,\n baseClass: string,\n): string {\n if (!spacing) return '';\n\n const spacingMap: Record<string, string> = {\n none: `${baseClass}--spacing-none`,\n xs2: `${baseClass}--spacing-xs2`,\n 'xs2-top': `${baseClass}--spacing-xs2-top`,\n 'xs2-bottom': `${baseClass}--spacing-xs2-bottom`,\n xs: `${baseClass}--spacing-xs`,\n 'xs-top': `${baseClass}--spacing-xs-top`,\n 'xs-bottom': `${baseClass}--spacing-xs-bottom`,\n sm: `${baseClass}--spacing-sm`,\n 'sm-top': `${baseClass}--spacing-sm-top`,\n 'sm-bottom': `${baseClass}--spacing-sm-bottom`,\n md: `${baseClass}--spacing-md`,\n 'md-top': `${baseClass}--spacing-md-top`,\n 'md-bottom': `${baseClass}--spacing-md-bottom`,\n lg: `${baseClass}--spacing-lg`,\n 'lg-top': `${baseClass}--spacing-lg-top`,\n 'lg-bottom': `${baseClass}--spacing-lg-bottom`,\n xl: `${baseClass}--spacing-xl`,\n 'xl-top': `${baseClass}--spacing-xl-top`,\n 'xl-bottom': `${baseClass}--spacing-xl-bottom`,\n };\n\n return spacingMap[spacing] || '';\n}\n\n/**\n * Get heading variant based on semantic HTML element\n */\nexport function getHeadingVariantFromSemanticType(\n element: string | React.ElementType,\n): TypographyHeadingVariant {\n const elementStr = typeof element === 'string' ? element : element.toString();\n\n switch (elementStr.toLowerCase()) {\n case 'h1':\n return 'title-1';\n case 'h2':\n return 'title-2';\n case 'h3':\n return 'subtitle-1';\n case 'h4':\n return 'subtitle-2';\n case 'h5':\n return 'section-1';\n case 'h6':\n return 'section-2';\n default:\n return 'title-1';\n }\n}\n\n/**\n * Get semantic HTML element from text variant\n */\nexport function getSemanticTypeFromTextVariant(\n variant: TypographyTextVariant | undefined,\n): string {\n if (!variant) return 'p';\n\n switch (variant) {\n case 'label':\n return 'label';\n case 'sublabel':\n return 'span';\n case 'caption':\n return 'span';\n case 'overline':\n return 'span';\n case 'link':\n return 'a';\n case 'code-text':\n return 'code';\n case 'preformatted-text':\n return 'pre';\n case 'quote':\n return 'blockquote';\n case 'leading':\n case 'paragraph':\n case 'subparagraph':\n case 'emphasized':\n default:\n return 'p';\n }\n}\n"],"names":[],"mappings":"AASO,SAAS,kBACd,SACA,WACQ;AACR,MAAI,CAAC,QAAS,QAAO;AAErB,QAAM,aAAqC;AAAA,IACzC,MAAM,GAAG,SAAS;AAAA,IAClB,KAAK,GAAG,SAAS;AAAA,IACjB,WAAW,GAAG,SAAS;AAAA,IACvB,cAAc,GAAG,SAAS;AAAA,IAC1B,IAAI,GAAG,SAAS;AAAA,IAChB,UAAU,GAAG,SAAS;AAAA,IACtB,aAAa,GAAG,SAAS;AAAA,IACzB,IAAI,GAAG,SAAS;AAAA,IAChB,UAAU,GAAG,SAAS;AAAA,IACtB,aAAa,GAAG,SAAS;AAAA,IACzB,IAAI,GAAG,SAAS;AAAA,IAChB,UAAU,GAAG,SAAS;AAAA,IACtB,aAAa,GAAG,SAAS;AAAA,IACzB,IAAI,GAAG,SAAS;AAAA,IAChB,UAAU,GAAG,SAAS;AAAA,IACtB,aAAa,GAAG,SAAS;AAAA,IACzB,IAAI,GAAG,SAAS;AAAA,IAChB,UAAU,GAAG,SAAS;AAAA,IACtB,aAAa,GAAG,SAAS;AAAA,EAAA;AAG3B,SAAO,WAAW,OAAO,KAAK;AAChC;AAKO,SAAS,kCACd,SAC0B;AAC1B,QAAM,aAAa,OAAO,YAAY,WAAW,UAAU,QAAQ,SAAA;AAEnE,UAAQ,WAAW,eAAY;AAAA,IAC7B,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EAAA;AAEb;AAKO,SAAS,+BACd,SACQ;AACR,MAAI,CAAC,QAAS,QAAO;AAErB,UAAQ,SAAA;AAAA,IACN,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL;AACE,aAAO;AAAA,EAAA;AAEb;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
import { PolymorphicComponentProps } from '@entur/utils';
|
|
3
|
-
import { TypographySize, TypographyTextVariant, TypographyWeight
|
|
3
|
+
import { TypographySize, TypographySpacing, TypographyTextVariant, TypographyWeight } from '../types';
|
|
4
4
|
type TextBaseProps = {
|
|
5
5
|
/** Visuell tekststørrelse (typografi-token) */
|
|
6
6
|
size?: TypographySize;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/typography",
|
|
3
|
-
"version": "2.1.
|
|
3
|
+
"version": "2.1.6",
|
|
4
4
|
"license": "SEE LICENSE IN README.md",
|
|
5
5
|
"main": "./dist/typography.cjs.js",
|
|
6
6
|
"module": "./dist/typography.esm.js",
|
|
@@ -48,7 +48,6 @@
|
|
|
48
48
|
"build:main": "vite build",
|
|
49
49
|
"build:beta": "vite build --config vite.config.beta.ts",
|
|
50
50
|
"test": "jest",
|
|
51
|
-
"lint": "eslint src",
|
|
52
51
|
"lint:styles": "stylelint 'src/beta**/*.{css,scss}' --ignore-path ../../.gitignore",
|
|
53
52
|
"start": "vite build --watch",
|
|
54
53
|
"start:beta": "vite build --config vite.config.beta.ts --watch",
|
|
@@ -59,9 +58,9 @@
|
|
|
59
58
|
"react-dom": ">=16.8.0"
|
|
60
59
|
},
|
|
61
60
|
"dependencies": {
|
|
62
|
-
"@entur/icons": "^8.4.
|
|
63
|
-
"@entur/tokens": "^3.22.
|
|
64
|
-
"@entur/utils": "^0.13.
|
|
61
|
+
"@entur/icons": "^8.4.5",
|
|
62
|
+
"@entur/tokens": "^3.22.4",
|
|
63
|
+
"@entur/utils": "^0.13.3",
|
|
65
64
|
"classnames": "^2.5.1",
|
|
66
65
|
"modern-normalize": "^3.0.1"
|
|
67
66
|
},
|
|
@@ -73,7 +72,6 @@
|
|
|
73
72
|
"@testing-library/react": "^10.4.9",
|
|
74
73
|
"@testing-library/user-event": "14.6.1",
|
|
75
74
|
"@vitejs/plugin-react": "^5.0.1",
|
|
76
|
-
"eslint": "^7.32.0",
|
|
77
75
|
"jest": "^29.0.0",
|
|
78
76
|
"jest-environment-jsdom": "^29.0.0",
|
|
79
77
|
"ts-jest": "^29.0.0",
|
|
@@ -81,5 +79,5 @@
|
|
|
81
79
|
"vite": "^7.1.3",
|
|
82
80
|
"vite-plugin-dts": "^4.5.4"
|
|
83
81
|
},
|
|
84
|
-
"gitHead": "
|
|
82
|
+
"gitHead": "f103a7b4fef3dc0ce47ce4b0e06a8d4062ba1cc5"
|
|
85
83
|
}
|
|
@@ -76,7 +76,7 @@ async function initializeGlob() {
|
|
|
76
76
|
glob = globModule.default || globModule;
|
|
77
77
|
useGlob = true;
|
|
78
78
|
console.log('📦 Using glob package for pattern matching');
|
|
79
|
-
} catch
|
|
79
|
+
} catch {
|
|
80
80
|
console.log('📁 Using Node.js built-ins for file discovery');
|
|
81
81
|
console.log(
|
|
82
82
|
' (Install glob for better pattern matching: npm install glob or yarn add glob)',
|
|
@@ -85,7 +85,6 @@ async function initializeGlob() {
|
|
|
85
85
|
}
|
|
86
86
|
|
|
87
87
|
// Configuration
|
|
88
|
-
const OLD_IMPORT = '@entur/typography';
|
|
89
88
|
const BETA_IMPORT = '@entur/typography/beta';
|
|
90
89
|
|
|
91
90
|
// Enhanced warning detection patterns - only truly problematic patterns
|
|
@@ -104,14 +103,6 @@ const PROBLEMATIC_PATTERNS = {
|
|
|
104
103
|
semanticMismatch: /<Heading[^>]*as="([^"]*)"[^>]*variant="([^"]*)"/g,
|
|
105
104
|
};
|
|
106
105
|
|
|
107
|
-
// Warning severity levels
|
|
108
|
-
const WARNING_CATEGORIES = {
|
|
109
|
-
CRITICAL: 'critical', // Will break functionality
|
|
110
|
-
HIGH: 'high', // Likely to cause issues
|
|
111
|
-
MEDIUM: 'medium', // May cause styling issues
|
|
112
|
-
LOW: 'low', // Best practice suggestions
|
|
113
|
-
INFO: 'info', // Informational only
|
|
114
|
-
};
|
|
115
106
|
|
|
116
107
|
// =============================================================================
|
|
117
108
|
// 🎯 MIGRATION FOLDERS CONFIGURATION
|
|
@@ -231,77 +222,6 @@ function analyzeFile(filePath, content) {
|
|
|
231
222
|
return analysis;
|
|
232
223
|
}
|
|
233
224
|
|
|
234
|
-
// Generate enhanced warnings with context and solutions
|
|
235
|
-
function generateWarningWithSolution(warning, context, filePath, lineNumber) {
|
|
236
|
-
const severity = determineSeverity(warning);
|
|
237
|
-
const suggestion = generateSuggestion(warning, context);
|
|
238
|
-
const codeExample = generateCodeExample(warning);
|
|
239
|
-
|
|
240
|
-
return {
|
|
241
|
-
message: warning,
|
|
242
|
-
severity,
|
|
243
|
-
suggestion,
|
|
244
|
-
codeExample,
|
|
245
|
-
file: filePath,
|
|
246
|
-
line: lineNumber,
|
|
247
|
-
documentation: getRelevantDocs(warning),
|
|
248
|
-
};
|
|
249
|
-
}
|
|
250
|
-
|
|
251
|
-
// Determine warning severity based on content
|
|
252
|
-
function determineSeverity(warning) {
|
|
253
|
-
if (warning.includes('will break') || warning.includes('fatal'))
|
|
254
|
-
return WARNING_CATEGORIES.CRITICAL;
|
|
255
|
-
if (warning.includes('conflict') || warning.includes('override'))
|
|
256
|
-
return WARNING_CATEGORIES.HIGH;
|
|
257
|
-
if (warning.includes('may cause') || warning.includes('styling'))
|
|
258
|
-
return WARNING_CATEGORIES.MEDIUM;
|
|
259
|
-
if (warning.includes('best practice') || warning.includes('consider'))
|
|
260
|
-
return WARNING_CATEGORIES.LOW;
|
|
261
|
-
return WARNING_CATEGORIES.INFO;
|
|
262
|
-
}
|
|
263
|
-
|
|
264
|
-
// Generate actionable suggestions
|
|
265
|
-
function generateSuggestion(warning, context) {
|
|
266
|
-
if (warning.includes('style and margin')) {
|
|
267
|
-
return 'Remove the margin prop as it will be overridden by inline styles. Use spacing prop instead.';
|
|
268
|
-
}
|
|
269
|
-
if (warning.includes('missing variant')) {
|
|
270
|
-
return 'Add a variant prop to ensure consistent styling. Example: variant="title-1"';
|
|
271
|
-
}
|
|
272
|
-
if (warning.includes('nested typography')) {
|
|
273
|
-
return 'Avoid nesting Text components. Use spans or other inline elements for emphasis.';
|
|
274
|
-
}
|
|
275
|
-
if (warning.includes('deprecated margin')) {
|
|
276
|
-
return 'Replace margin prop with spacing prop for better consistency.';
|
|
277
|
-
}
|
|
278
|
-
return 'Review the component for potential styling conflicts.';
|
|
279
|
-
}
|
|
280
|
-
|
|
281
|
-
// Generate code examples for fixes
|
|
282
|
-
function generateCodeExample(warning) {
|
|
283
|
-
if (warning.includes('style and margin')) {
|
|
284
|
-
return '// Before: <Text style={{color: "red"}} margin="bottom">\n// After: <Text style={{color: "red"}} spacing="bottom">';
|
|
285
|
-
}
|
|
286
|
-
if (warning.includes('missing variant')) {
|
|
287
|
-
return '// Before: <Heading as="h1">Title</Heading>\n// After: <Heading as="h1" variant="title-1">Title</Heading>';
|
|
288
|
-
}
|
|
289
|
-
if (warning.includes('nested typography')) {
|
|
290
|
-
return '// Before: <Text>Hello <Text>World</Text></Text>\n// After: <Text>Hello <span>World</span></Text>';
|
|
291
|
-
}
|
|
292
|
-
return '';
|
|
293
|
-
}
|
|
294
|
-
|
|
295
|
-
// Get relevant documentation links
|
|
296
|
-
function getRelevantDocs(warning) {
|
|
297
|
-
if (warning.includes('variant'))
|
|
298
|
-
return 'https://linje.entur.no/komponenter/ressurser/typography-beta#heading-variants';
|
|
299
|
-
if (warning.includes('spacing'))
|
|
300
|
-
return 'https://linje.entur.no/komponenter/ressurser/typography-beta#spacing';
|
|
301
|
-
if (warning.includes('semantic'))
|
|
302
|
-
return 'https://linje.entur.no/komponenter/ressurser/typography-beta#semantic-html';
|
|
303
|
-
return 'https://linje.entur.no/komponenter/ressurser/typography-beta';
|
|
304
|
-
}
|
|
305
225
|
|
|
306
226
|
let ALLOWED_DIRECTORIES = process.env.TYPOGRAPHY_MIGRATION_DIRS
|
|
307
227
|
? process.env.TYPOGRAPHY_MIGRATION_DIRS.split(',')
|
|
@@ -420,14 +340,6 @@ const SPACING_MAPPING = {
|
|
|
420
340
|
'xs2-bottom': 'xs2-bottom',
|
|
421
341
|
};
|
|
422
342
|
|
|
423
|
-
// Import patterns to handle
|
|
424
|
-
const IMPORT_PATTERNS = [
|
|
425
|
-
/from\s+['"`]@entur\/typography['"`]/g,
|
|
426
|
-
/from\s+['"`]@entur\/typography\/dist['"`]/g,
|
|
427
|
-
/from\s+['"`]@entur\/typography\/dist\/index['"`]/g,
|
|
428
|
-
/from\s+['"`]@entur\/typography\/dist\/styles\.css['"`]/g,
|
|
429
|
-
/from\s+['"`]@entur\/typography\/styles['"`]/g,
|
|
430
|
-
];
|
|
431
343
|
|
|
432
344
|
// Parse JSX props more robustly
|
|
433
345
|
function parseJSXProps(propsString) {
|