Merge pull request #1131 from dnbexperience/main

.github/workflows/build-check.yml

@@ -1,4 +1,4 @@
-name: Build Check
+name: Build Check # This name is used in the release.yml workflow_run event
 
 on:
   push:
@@ -8,6 +8,10 @@ on:
       - '!**--visual-reports'
       - '!wip/**'
       - '!experiments/**'
+      - '!release'
+      - '!portal'
+      - '!beta'
+      - '!alpha'
   pull_request:
     branches:
       - 'main'

.github/workflows/verify.yml

@@ -8,6 +8,10 @@ on:
       - '!**--visual-reports'
       - '!wip/**'
       - '!experiments/**'
+      - '!release'
+      - '!portal'
+      - '!beta'
+      - '!alpha'
 
 jobs:
   action:

packages/dnb-design-system-portal/.eslintrc

@@ -28,6 +28,7 @@
   ],
   "plugins": ["react", "react-hooks", "jsx-a11y"],
   "rules": {
+    "react/react-in-jsx-scope": "off",
     "no-console": "off",
     "react/prop-types": "warn",
     "react/require-default-props": "warn",

packages/dnb-design-system-portal/gatsby-config.js

@@ -141,4 +141,5 @@ module.exports = {
   pathPrefix,
   siteMetadata,
   plugins,
+  jsxRuntime: 'automatic',
 }

packages/dnb-design-system-portal/src/docs/uilib/components/breadcrumb/Examples.js

@@ -3,7 +3,6 @@
  *
  */
 
-import React from 'react'
 import ComponentBox from 'dnb-design-system-portal/src/shared/tags/ComponentBox'
 
 export const BreadcrumbSingle = () => (

packages/dnb-eufemia/.eslintrc

@@ -34,6 +34,7 @@
     "security"
   ],
   "rules": {
+    "react/react-in-jsx-scope": "off",
     "import/namespace": "off",
     "no-restricted-imports": [
       "error",

packages/dnb-eufemia/babel.config.js

@@ -1,15 +1,16 @@
-/* stylelint-disable */
 /**
  * Main Babel config
  *
  */
 
-const presets =
+const basisPresets = [
+  '@babel/preset-react',
+  ['@babel/preset-typescript', { isTSX: true, allExtensions: true }],
+]
+
+const presetsGeneral =
   process.env.BABEL_ENV === 'es'
-    ? [
-        '@babel/preset-react',
-        ['@babel/preset-typescript', { isTSX: true, allExtensions: true }],
-      ]
+    ? basisPresets
     : [
         [
           // Using .browserslistrc for the targets
@@ -20,25 +21,51 @@ const presets =
               : 'cjs',
           },
         ],
-        '@babel/preset-react',
-        ['@babel/preset-typescript', { isTSX: true, allExtensions: true }],
+
+        ...basisPresets,
       ]
 
-// also for IE testing with Storybook}
-const legacy =
+// Used for legacy, IE11 builds
+const legacyPresets =
   process.env.BABEL_ENV === 'es'
     ? []
     : [
+        // Include the rest
+        ...presetsGeneral,
+
+        // Manipulate @babel/preset-env
         [
-          presets[0][0], // get preset id
+          presetsGeneral[0][0], // get preset id
           {
-            ...presets[0][1], // get preset options
+            ...presetsGeneral[0][1], // get preset options
             useBuiltIns: 'usage',
             corejs: 3,
           },
         ],
-        presets[1],
       ]
+        .slice(1) // remove the first "presetsGeneral"
+        .reverse()
+
+const testingPresets =
+  process.env.BABEL_ENV === 'es'
+    ? []
+    : [
+        // Include the rest
+        ...presetsGeneral,
+
+        // Manipulate @babel/preset-env
+        [
+          presetsGeneral[0][0], // get preset id
+          {
+            ...presetsGeneral[0][1], // get preset options
+            targets: {
+              node: 'current',
+            },
+          },
+        ],
+      ]
+        .slice(1) // remove the first "presetsGeneral"
+        .reverse()
 
 const productionPlugins = [
   '@babel/plugin-transform-react-constant-elements',
@@ -65,7 +92,7 @@ if (typeof process.env.BABEL_ENV !== 'undefined') {
 }
 
 const config = {
-  presets,
+  presets: presetsGeneral,
   plugins: [
     'babel-plugin-optimize-clsx',
     '@babel/plugin-proposal-export-default-from',
@@ -79,13 +106,13 @@ const config = {
   ignore: ['node_modules/**'],
   env: {
     cjs: {
-      presets: legacy,
+      presets: legacyPresets,
       plugins: productionPlugins.concat([
         '@babel/plugin-transform-modules-commonjs',
       ]),
     },
     esm: {
-      presets: legacy,
+      presets: legacyPresets,
       plugins: [
         ...productionPlugins,
         ['@babel/plugin-transform-runtime', { useESModules: true }],
@@ -98,33 +125,22 @@ const config = {
       ],
     },
     umd: {
-      presets: legacy,
+      presets: legacyPresets,
       plugins: [
         ...productionPlugins,
         ['@babel/plugin-transform-runtime', { useESModules: true }],
       ],
     },
     production: {
-      presets: legacy,
+      presets: legacyPresets,
       plugins: [
         ...productionPlugins,
         ['@babel/plugin-transform-runtime', { useESModules: true }],
       ],
     },
-    development: { presets: legacy },
+    development: { presets: presetsGeneral },
     test: {
-      presets: [
-        [
-          '@babel/preset-env',
-          {
-            targets: {
-              node: 'current',
-            },
-          },
-        ],
-        '@babel/preset-react',
-        ['@babel/preset-typescript', { isTSX: true, allExtensions: true }],
-      ],
+      presets: testingPresets,
     },
   },
 }

packages/dnb-eufemia/package.json

@@ -21,7 +21,7 @@
     "audit:ci:yarn-outdated": "babel-node ./scripts/prepub/audit/toOpt && audit-ci --config ./audit-ci.json --package-manager=yarn --report-type full && babel-node ./scripts/prepub/audit/toDev",
     "build": "yarn build:prebuild && yarn build:esm && yarn build:copy",
     "prebuild:ci": "yarn build",
-    "postbuild:ci": "./scripts/release/postbuild.sh",
+    "postbuild:ci": "./scripts/release/postbuild.sh && yarn test:build",
     "build:cjs": "./scripts/release/babel-cjs.sh",
     "build:clean": "rm -rf build/**",
     "build:copy": "./scripts/release/copy-build-artifacts.sh",

packages/dnb-eufemia/rollup.config.js

@@ -28,7 +28,7 @@ const excludes = [
 ]
 
 const currentBranch = branchName()
-export default isCI && !/^(release|beta|alpha)$/.test(currentBranch)
+export default !/^(release|beta|alpha)$/.test(currentBranch)
   ? [
       // NB: rollup needs at least one config
       makeRollupConfig(
@@ -204,7 +204,10 @@ function makeRollupConfig(
     }
   })
 
+  const extensions = ['.js', '.ts', '.tsx']
+
   const babelOptions = {
+    extensions,
     exclude: /node_modules/,
     babelHelpers: 'runtime', // using @babel/plugin-transform-runtime
     configFile: './babel.config.js',
@@ -226,7 +229,9 @@ function makeRollupConfig(
     },
     external,
     plugins: [
-      nodeResolve(),
+      nodeResolve({
+        extensions,
+      }),
       babel(babelOptions),
       commonjs(commonjsOptions),
       nodeGlobals(),

packages/dnb-eufemia/scripts/release/__tests__/postbuild.test.js

@@ -160,7 +160,14 @@ describe('babel build', () => {
         break
     }
 
-    {
+    if (stage == 'cjs') {
+      const exists = fs.existsSync(
+        path.resolve(
+          `./build/${stage}/components/breadcrumb/Breadcrumb.tsx`
+        )
+      )
+      expect(exists).toBe(false)
+    } else {
       const content = fs.readFileSync(
         path.resolve(
           `./build/${stage}/components/breadcrumb/Breadcrumb.tsx`

packages/dnb-eufemia/scripts/release/babel-cjs.sh

@@ -15,9 +15,9 @@ babel ./src \
 
 echo 'Building cjs bundle done!'
 
-echo 'Copy .d.ts files to cjs ...'
+echo 'Copy additional files to cjs ...'
 
-OUT_DIR=./build/cjs babel-node ./scripts/release/copyTypeScriptFiles.js
+OUT_DIR=./build/cjs ONLY_DEFINITION_FILES=1 babel-node ./scripts/release/copyTypeScriptFiles.js
 OUT_DIR=./build/cjs babel-node ./scripts/release/copyStyles.js
 
 echo 'Copy extra cjs package.json ...'

packages/dnb-eufemia/scripts/release/babel-es.sh

@@ -15,7 +15,7 @@ babel ./src \
 
 echo 'Building es bundle done!'
 
-echo 'Copy .d.ts files to es ...'
+echo 'Copy additional files to es ...'
 
 OUT_DIR=./build/es babel-node ./scripts/release/copyTypeScriptFiles.js
 OUT_DIR=./build/es babel-node ./scripts/release/copyStyles.js

packages/dnb-eufemia/scripts/release/babel-esm.sh

@@ -15,7 +15,7 @@ babel ./src \
 
 echo 'Building esm bundle done!'
 
-echo 'Copy .d.ts files to esm ...'
+echo 'Copy additional files to esm ...'
 
 OUT_DIR=./build/esm babel-node ./scripts/release/copyTypeScriptFiles.js
 OUT_DIR=./build/esm babel-node ./scripts/release/copyStyles.js

packages/dnb-eufemia/scripts/release/copyTypeScriptFiles.js

@@ -1,5 +1,5 @@
 /**
- * Copy .d.ts files recursively
+ * Copy additional files recursively
  *
  */
 
@@ -12,11 +12,13 @@ if (require.main === module) {
 }
 
 async function copyTypeScriptFiles(dist) {
-  const files = await globby([
-    './src/**/*.ts',
-    './src/**/*.tsx',
-    './src/**/*.d.ts',
-  ])
+  const globbyFiles = ['./src/**/*.d.ts']
+
+  if (process.env.ONLY_DEFINITION_FILES !== '1') {
+    globbyFiles.push('./src/**/*.ts', './src/**/*.tsx')
+  }
+
+  const files = await globby(globbyFiles)
 
   for await (const file of files) {
     const src = path.resolve(file)

packages/dnb-eufemia/scripts/release/postbuild.sh

@@ -10,6 +10,5 @@ yarn build:umd
 echo 'Can be enabled in future if needed -> yarn build:resources'
 yarn build:copy
 yarn prettier:other
-yarn test:build
 
 echo 'Postbuild done!'

packages/dnb-eufemia/src/components/breadcrumb/Breadcrumb.tsx

@@ -1,14 +1,20 @@
 import React, { useEffect, useState } from 'react'
-import BreadcrumbItem, { BreadcrumbItemProps } from './BreadcrumbItem'
-import Context from '../../shared/Context'
-import { ISpacingProps, SkeletonTypes } from '../../shared/interfaces'
 import classnames from 'classnames'
+
+// Components
 import { createSkeletonClass } from '../skeleton/SkeletonHelper'
-import Section from '../section/Section'
 import { createSpacingClasses } from '../space/SpacingHelper'
+import Section from '../section/Section'
+import Button from '../button/Button'
+
+// Shared
 import { useMediaQuery } from '../../shared'
+import Context from '../../shared/Context'
+import { ISpacingProps, SkeletonTypes } from '../../shared/interfaces'
 import { extendPropsWithContext } from '../../shared/component-helper'
-import { Button } from '..'
+
+// Internal
+import BreadcrumbItem, { BreadcrumbItemProps } from './BreadcrumbItem'
 
 export * from './BreadcrumbItem'
 

packages/dnb-eufemia/src/components/breadcrumb/BreadcrumbItem.tsx

@@ -1,10 +1,17 @@
 import React from 'react'
-import Context from '../../shared/Context'
-import Button from '../Button'
-import homeIcon from '../../icons/home'
+
+// Components
+import Button from '../button/Button'
+import IconPrimary, { IconPrimaryIcon } from '../icon-primary/IconPrimary'
+
+// Elements
 import P from '../../elements/P'
-import { IconPrimary } from '..'
-import { IconPrimaryIcon } from '../icon-primary/IconPrimary'
+
+// Icons
+import homeIcon from '../../icons/home'
+
+// Shared
+import Context from '../../shared/Context'
 import { SkeletonTypes } from '../../shared/interfaces'
 import { extendPropsWithContext } from '../../shared/component-helper'