shinkansen-gears 1.2.16 → 1.3.1

package/eslint.config.mjs

@@ -139,10 +139,7 @@ export default [
       ...reactRules
     },
     settings: {
-      ...reactSettings,
-      'import/resolver': {
-        'babel-module': {}
-      }
+      ...reactSettings
     }
   }),
   standard({
@@ -169,10 +166,7 @@ export default [
       ...reactRules
     },
     settings: {
-      ...reactSettings,
-      'import/resolver': {
-        'babel-module': {}
-      }
+      ...reactSettings
     }
   }),
   /**
@@ -184,7 +178,6 @@ export default [
     ],
     ignores: [
       'src',
-      'stories',
       'test'
     ],
     languageOptions: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "shinkansen-gears",
-  "version": "1.2.16",
+  "version": "1.3.1",
   "description": "Shinkansen Gears",
   "keywords": [
     "Shinkansen",
@@ -40,7 +40,9 @@
     "prestorybook": "npm run build && npm run transform",
     "pretest": "npm run nvm",
     "storybook": "storybook dev -p 6008",
-    "test": "cross-env NODE_ENV=test jest",
+    "test": "npm run test:mocha && npm run test:jest",
+    "test:jest": "cross-env NODE_ENV=test jest",
+    "test:mocha": "cross-env NODE_ENV=test mocha test --recursive",
     "transform": "cross-env DEBUG=shinkansen-gears* ./transform.sh"
   },
   "dependencies": {
@@ -56,30 +58,36 @@
     "@modernpoacher/design-system": "1.1.31",
     "@sequencemedia/eslint-config-standard": "^0.2.41",
     "@sequencemedia/eslint-config-typescript": "^0.1.57",
-    "@storybook/addon-actions": "7.6.20",
-    "@storybook/addon-essentials": "7.6.20",
-    "@storybook/addon-links": "7.6.20",
-    "@storybook/react": "7.6.20",
-    "@storybook/react-webpack5": "7.6.20",
+    "@storybook/addon-actions": "^8.6.4",
+    "@storybook/addon-essentials": "^8.6.4",
+    "@storybook/addon-links": "^8.6.4",
+    "@storybook/addon-webpack5-compiler-babel": "^3.0.5",
+    "@storybook/manager-api": "^8.6.4",
+    "@storybook/react": "^8.6.4",
+    "@storybook/react-webpack5": "^8.6.4",
+    "@storybook/theming": "^8.6.4",
     "@types/babel__register": "^7.17.3",
+    "@types/chai": "^5.0.1",
     "@types/debug": "^4.1.12",
     "@types/jest": "^29.5.14",
+    "@types/mocha": "^10.0.10",
     "@types/react": "18.3.13",
     "@types/react-test-renderer": "^19.0.0",
     "@typescript-eslint/eslint-plugin": "^8.26.0",
     "@typescript-eslint/parser": "^8.26.0",
     "autoprefixer": "^10.4.20",
+    "chai": "^5.2.0",
     "clean-webpack-plugin": "^4.0.0",
     "core-js": "^3.41.0",
     "cross-env": "^7.0.3",
     "eslint": "^9.21.0",
-    "eslint-import-resolver-babel-module": "^5.3.2",
     "eslint-plugin-react": "^7.37.4",
     "eslint-plugin-storybook": "^0.11.4",
     "globals": "^16.0.0",
     "husky": "^9.1.7",
     "jest": "^29.7.0",
     "mini-css-extract-plugin": "^2.9.2",
+    "mocha": "^11.1.0",
     "perfectionist": "^2.4.0",
     "postcss": "^8.5.3",
     "postcss-discard-comments": "^7.0.3",
@@ -95,13 +103,13 @@
     "remove-files-webpack-plugin": "^1.5.0",
     "sass": "^1.85.1",
     "sass-loader": "^16.0.5",
-    "shinkansen-rails": "1.0.299",
-    "storybook": "7.6.20",
+    "shinkansen-rails": "1.1.0",
+    "storybook": "^8.6.4",
     "webpack": "^5.98.0",
     "webpack-cli": "^6.0.1"
   },
   "peerDependencies": {
-    "shinkansen-rails": "1.0.x"
+    "shinkansen-rails": "1.1.x"
   },
   "imports": {
     "#build/paths": "./build/paths.mjs",
@@ -112,7 +120,13 @@
     "#gears/gears": "./src/gears/index.cjs",
     "#gears/gears/*": "./src/gears/*/index.cjs",
     "#gears/gears/forward": "./src/gears/forward/index.cjs",
-    "#gears/gears/reverse": "./src/gears/reverse/index.cjs"
+    "#gears/gears/reverse": "./src/gears/reverse/index.cjs",
+    "#gears/render": {
+      "require": "./src/render/index.cjs",
+      "import": "./src/render/index.mjs"
+    },
+    "#gears/render/forward": "./src/render/forward/index.cjs",
+    "#gears/render/reverse": "./src/render/reverse/index.cjs"
   },
   "exports": {
     ".": {
@@ -120,7 +134,14 @@
       "import": "./src/index.mjs"
     },
     "./gears": "./src/gears/index.cjs",
+    "./gears/*": "./src/gears/*/index.cjs",
     "./gears/forward": "./src/gears/forward/index.cjs",
-    "./gears/reverse": "./src/gears/reverse/index.cjs"
+    "./gears/reverse": "./src/gears/reverse/index.cjs",
+    "./render": {
+      "require": "./src/render/index.cjs",
+      "import": "./src/render/index.mjs"
+    },
+    "./render/forward": "./src/render/forward/index.cjs",
+    "./render/reverse": "./src/render/reverse/index.cjs"
   }
 }

package/src/gears/forward/index.cjs

@@ -11,7 +11,10 @@ const log = debug('shinkansen-gears/gears/forward')
 log('`shinkansen` is awake')
 
 const {
-  default: component // @ts-ignore
+  default: Forward // @ts-expect-error
 } = require('./index.jsx')
 
-module.exports = component
+/**
+ *  Exports only default
+ */
+module.exports = Forward

package/src/gears/forward/index.jsx

@@ -1,5 +1,5 @@
 /**
- * @typedef {GearsTypes.Forward.ForwardProps} ForwardProps
+ *  @typedef {GearsTypes.Forward.ForwardProps} ForwardProps
  */
 
 import React from 'react'
@@ -10,8 +10,8 @@ import {
 } from 'react-router'
 
 /**
- * @param {ForwardProps} props
- * @returns {React.JSX.Element}
+ *  @param {ForwardProps} props
+ *  @returns {React.JSX.Element}
  */
 function Forward ({ pathname }) {
   const key = pathname.concat('-forward')

package/src/gears/index.cjs

@@ -10,4 +10,11 @@ const log = debug('shinkansen-gears/gears')
 
 log('`shinkansen` is awake')
 
-module.exports = require('./index.jsx')
+const {
+  default: Gears // @ts-expect-error
+} = require('./index.jsx')
+
+/**
+ *  Exports only default
+ */
+module.exports = Gears

package/src/gears/index.d.mts

@@ -1,18 +1,13 @@
 declare module '#gears/gears' {
   import React from 'react'
 
-  type GearsProps = GearsTypes.GearsProps
-  type GearsState = GearsTypes.GearsState
+  export type GearsProps = GearsTypes.GearsProps
+  export type GearsState = GearsTypes.GearsState
 
-  export function renderReverse (reverse?: Record<string, unknown>, pattern?: string): React.JSX.Element | null
-  export function renderForward (forward?: Record<string, unknown>, pattern?: string): React.JSX.Element | null
   export default class Gears extends React.Component<GearsProps, GearsState> {}
 }
 
 declare module 'shinkansen-gears/gears' {
-  export type GearsProps = GearsTypes.GearsProps
-  export type GearsState = GearsTypes.GearsState
-
   export { default } from '#gears/gears'
   export * from '#gears/gears'
 }

package/src/gears/index.jsx

@@ -1,6 +1,6 @@
 /**
- * @typedef {GearsTypes.GearsProps} GearsProps
- * @typedef {GearsTypes.GearsState} GearsState
+ *  @typedef {GearsTypes.GearsProps} GearsProps
+ *  @typedef {GearsTypes.GearsState} GearsState
  */
 
 import React, { Component } from 'react'
@@ -11,42 +11,9 @@ import {
   Rails
 } from 'shinkansen-rails'
 
-import Reverse from './reverse/index.jsx'
-import Forward from './forward/index.jsx'
+import renderReverse from '#gears/render/reverse'
 
-/**
- * @type {(reverse?: Record<string, unknown>, pattern?: string) => React.JSX.Element | null}
- */
-export function renderReverse (reverse, pattern) {
-  if (Rails.go(reverse, pattern)) {
-    const pathname = Rails.to(reverse, pattern)
-
-    return (
-      <Reverse
-        pathname={pathname}
-      />
-    )
-  }
-
-  return null
-}
-
-/**
- * @type {(forward?: Record<string, unknown>, pattern?: string) => React.JSX.Element | null}
- */
-export function renderForward (forward, pattern) {
-  if (Rails.go(forward, pattern)) {
-    const pathname = Rails.to(forward, pattern)
-
-    return (
-      <Forward
-        pathname={pathname}
-      />
-    )
-  }
-
-  return null
-}
+import renderForward from '#gears/render/forward'
 
 export default class Gears extends Component {
   /**
@@ -57,9 +24,9 @@ export default class Gears extends Component {
   /**
    *  Store latest 'props' in 'state'
    *
-   * @param {GearsProps} props   Latest props
-   * @param {GearsState} state   Current state
-   * @returns {GearsState} Derived state
+   *  @param {GearsProps} props   Latest props
+   *  @param {GearsState} state   Current state
+   *  @returns {GearsState} Derived state
    */
   static getDerivedStateFromProps ({ reverse, forward }, { reverse: R, forward: F }) {
     return {
@@ -71,9 +38,9 @@ export default class Gears extends Component {
   /**
    *  Compare latest 'props' and 'state' for changes to 'pattern', 'reverse' or 'forward'
    *
-   * @param {GearsProps} props   Latest props
-   * @param {GearsState} state   Current state
-   * @returns {boolean}
+   *  @param {GearsProps} props   Latest props
+   *  @param {GearsState} state   Current state
+   *  @returns {boolean}
    */
   shouldComponentUpdate ({ pattern }, state) {
     const {

package/src/gears/reverse/index.cjs

@@ -11,7 +11,10 @@ const log = debug('shinkansen-gears/gears/reverse')
 log('`shinkansen` is awake')
 
 const {
-  default: component // @ts-ignore
+  default: Reverse // @ts-expect-error
 } = require('./index.jsx')
 
-module.exports = component
+/**
+ *  Exports only default
+ */
+module.exports = Reverse

package/src/gears/reverse/index.jsx

@@ -1,5 +1,5 @@
 /**
- * @typedef {GearsTypes.Reverse.ReverseProps} ReverseProps
+ *  @typedef {GearsTypes.Reverse.ReverseProps} ReverseProps
  */
 
 import React from 'react'
@@ -10,8 +10,8 @@ import {
 } from 'react-router'
 
 /**
- * @param {ReverseProps} props
- * @returns {React.JSX.Element}
+ *  @param {ReverseProps} props
+ *  @returns {React.JSX.Element}
  */
 function Reverse ({ pathname }) {
   const key = pathname.concat('-reverse')

package/src/index.cjs

@@ -10,12 +10,14 @@ const log = debug('shinkansen-gears')
 
 log('`shinkansen` is awake')
 
-const {
-  default: Gears,
-  renderReverse,
-  renderForward
-} = require('./gears/index.cjs')
+const Gears = require('./gears/index.cjs')
+const Reverse = require('./gears/reverse/index.cjs')
+const Forward = require('./gears/forward/index.cjs')
+const renderReverse = require('./render/reverse/index.cjs')
+const renderForward = require('./render/forward/index.cjs')
 
 module.exports.Gears = Gears
+module.exports.Reverse = Reverse
+module.exports.Forward = Forward
 module.exports.renderReverse = renderReverse
 module.exports.renderForward = renderForward

package/src/index.d.cts

@@ -1,5 +1,19 @@
 export {
-  default as Gears,
-  renderReverse,
-  renderForward
+  default as Gears
 } from '#gears/gears'
+
+export {
+  default as Reverse
+} from '#gears/gears/reverse'
+
+export {
+  default as Forward
+} from '#gears/gears/forward'
+
+export {
+  default as renderReverse
+} from '#gears/render/reverse'
+
+export {
+  default as renderForward
+} from '#gears/render/forward'

package/src/index.d.mts

@@ -1,5 +1,19 @@
 export {
-  default as Gears,
-  renderReverse,
-  renderForward
+  default as Gears
 } from '#gears/gears'
+
+export {
+  default as Reverse
+} from '#gears/gears/reverse'
+
+export {
+  default as Forward
+} from '#gears/gears/forward'
+
+export {
+  default as renderReverse
+} from '#gears/render/reverse'
+
+export {
+  default as renderForward
+} from '#gears/render/forward'

package/src/index.mjs

@@ -1,11 +1,19 @@
 import debug from 'debug'
 
+import Gears from './gears/index.cjs'
+import Reverse from './gears/reverse/index.cjs'
+import Forward from './gears/forward/index.cjs'
+import renderReverse from './render/reverse/index.cjs'
+import renderForward from './render/forward/index.cjs'
+
 const log = debug('shinkansen-gears')
 
 log('`shinkansen` is awake')
 
 export {
   Gears,
+  Reverse,
+  Forward,
   renderReverse,
   renderForward
-} from './index.cjs'
+}

package/src/render/forward/index.cjs

@@ -0,0 +1,20 @@
+require('@babel/register')({
+  ignore: [
+    /node_modules\/(?!shinkansen|@modernpoacher)/
+  ]
+})
+
+const debug = require('debug')
+
+const log = debug('shinkansen-gears/render/forward')
+
+log('`shinkansen` is awake')
+
+const {
+  default: renderForward // @ts-expect-error
+} = require('./index.jsx')
+
+/**
+ *  Exports only default
+ */
+module.exports = renderForward

package/src/render/forward/index.d.cts

@@ -0,0 +1 @@
+export { default } from '#gears/render/forward'

package/src/render/forward/index.d.mts

@@ -0,0 +1,9 @@
+declare module '#gears/render/forward' {
+  import type React from 'react'
+
+  export default function renderForward (forward?: Record<string, unknown>, pattern?: string): React.JSX.Element | null
+}
+
+declare module 'shinkansen-gears/render/forward' {
+  export { default } from '#gears/render/forward'
+}

package/src/render/forward/index.jsx

@@ -0,0 +1,24 @@
+import React from 'react'
+
+import {
+  Rails
+} from 'shinkansen-rails'
+
+import Forward from '#gears/gears/forward'
+
+/**
+ *  @type {(forward?: Record<string, unknown>, pattern?: string) => React.JSX.Element | null}
+ */
+export default function renderForward (forward, pattern) {
+  if (Rails.go(forward, pattern)) {
+    const pathname = Rails.to(forward, pattern)
+
+    return (
+      <Forward
+        pathname={pathname}
+      />
+    )
+  }
+
+  return null
+}

package/src/render/index.cjs

@@ -0,0 +1,17 @@
+require('@babel/register')({
+  ignore: [
+    /node_modules\/(?!shinkansen|@modernpoacher)/
+  ]
+})
+
+const debug = require('debug')
+
+const log = debug('shinkansen-gears/render')
+
+log('`shinkansen` is awake')
+
+const renderReverse = require('./reverse/index.cjs')
+const renderForward = require('./forward/index.cjs')
+
+module.exports.renderReverse = renderReverse
+module.exports.renderForward = renderForward

package/src/render/index.d.cts

@@ -0,0 +1,7 @@
+export {
+  default as renderReverse
+} from '#gears/render/reverse'
+
+export {
+  default as renderForward
+} from '#gears/render/forward'

package/src/render/index.d.mts

@@ -0,0 +1,7 @@
+export {
+  default as renderReverse
+} from '#gears/render/reverse'
+
+export {
+  default as renderForward
+} from '#gears/render/forward'

package/src/render/index.mjs

@@ -0,0 +1,13 @@
+import debug from 'debug'
+
+import renderReverse from './reverse/index.cjs'
+import renderForward from './forward/index.cjs'
+
+const log = debug('shinkansen-gears/render')
+
+log('`shinkansen` is awake')
+
+export {
+  renderReverse,
+  renderForward
+}

package/src/render/reverse/index.cjs

@@ -0,0 +1,20 @@
+require('@babel/register')({
+  ignore: [
+    /node_modules\/(?!shinkansen|@modernpoacher)/
+  ]
+})
+
+const debug = require('debug')
+
+const log = debug('shinkansen-gears/render/reverse')
+
+log('`shinkansen` is awake')
+
+const {
+  default: renderReverse // @ts-expect-error
+} = require('./index.jsx')
+
+/**
+ *  Exports only default
+ */
+module.exports = renderReverse

package/src/render/reverse/index.d.cts

@@ -0,0 +1 @@
+export { default } from '#gears/render/reverse'

package/src/render/reverse/index.d.mts

@@ -0,0 +1,9 @@
+declare module '#gears/render/reverse' {
+  import type React from 'react'
+
+  export default function renderReverse (reverse?: Record<string, unknown>, pattern?: string): React.JSX.Element | null
+}
+
+declare module 'shinkansen-gears/render/reverse' {
+  export { default } from '#gears/render/reverse'
+}

package/src/render/reverse/index.jsx

@@ -0,0 +1,24 @@
+import React from 'react'
+
+import {
+  Rails
+} from 'shinkansen-rails'
+
+import Reverse from '#gears/gears/reverse'
+
+/**
+ *  @type {(reverse?: Record<string, unknown>, pattern?: string) => React.JSX.Element | null}
+ */
+export default function renderReverse (reverse, pattern) {
+  if (Rails.go(reverse, pattern)) {
+    const pathname = Rails.to(reverse, pattern)
+
+    return (
+      <Reverse
+        pathname={pathname}
+      />
+    )
+  }
+
+  return null
+}