Add moj-frontend

app/frontend/application.js

@@ -14,11 +14,16 @@ import 'regenerator-runtime/runtime'
 //
 import { initAll as GOVUKFrontend } from 'govuk-frontend'
 import { initAll as GOVUKPrototypeComponents } from '@x-govuk/govuk-prototype-components'
+import { initAll as MOJFrontend } from '@ministryofjustice/frontend'
 import './controllers'
 import './cookie-banner'
 import './styles/application.scss'
+import 'moj-frontend';
+import $ from 'jquery';
+window.$ = $
 
 require.context('govuk-frontend/dist/govuk/assets')
 
 GOVUKFrontend()
 GOVUKPrototypeComponents()
+MOJFrontend()

app/frontend/styles/application.scss

@@ -49,6 +49,7 @@ $govuk-breakpoints: (
 @import "sub-navigation";
 @import "unread-notification";
 @import "custom-rails-admin";
+@import "node_modules/@ministryofjustice/frontend/moj/components/date-picker/date-picker";
 
 // App utilities
 .app-\!-colour-muted {

config/initializers/assets.rb

@@ -5,5 +5,6 @@ Rails.application.config.assets.version = "1.0"
 
 # Add additional assets to the asset load path.
 Rails.application.config.assets.paths << Rails.root.join("node_modules/@fortawesome/fontawesome-free/webfonts")
+Rails.application.config.assets.paths << Rails.root.join("/node_modules/@ministryofjustice/frontend/moj/assets")
 
 Rails.application.config.assets.precompile += %w[rails_admin/rails_admin.css rails_admin/rails_admin.js]

package.json

@@ -9,6 +9,7 @@
     "@babel/plugin-transform-runtime": "^7.17.0",
     "@babel/preset-env": "^7.16.11",
     "@hotwired/stimulus": "^3.0.0",
+    "@ministryofjustice/frontend": "^3.3.0",
     "@stimulus/polyfills": "^2.0.0",
     "@webcomponents/webcomponentsjs": "^2.6.0",
     "@x-govuk/govuk-prototype-components": "^3.0.9",
@@ -23,6 +24,7 @@
     "govuk-frontend": "5.7.1",
     "html5shiv": "^3.7.3",
     "intersection-observer": "^0.12.0",
+    "jquery": "^3.7.1",
     "mini-css-extract-plugin": "^2.6.0",
     "rails_admin": "3.3.0",
     "regenerator-runtime": "^0.13.9",

webpack.config.js

@@ -41,7 +41,8 @@ module.exports = {
   resolve: {
     alias: {
       'govuk-frontend-styles': path.resolve(__dirname, 'node_modules/govuk-frontend/dist/govuk/all.scss'),
-      'govuk-prototype-styles': path.resolve(__dirname, 'node_modules/@x-govuk/govuk-prototype-components/x-govuk/all.scss')
+      'govuk-prototype-styles': path.resolve(__dirname, 'node_modules/@x-govuk/govuk-prototype-components/x-govuk/all.scss'),
+      'moj-frontend': path.resolve(__dirname, 'node_modules/@ministryofjustice/frontend/moj/all.js')
     },
     modules: ['node_modules', 'node_modules/govuk-frontend/dist/govuk']
   },
@@ -62,7 +63,8 @@ module.exports = {
         { from: 'node_modules/govuk-frontend/dist/govuk/assets/fonts', to: 'fonts' },
         { from: 'node_modules/html5shiv/dist/html5shiv.min.js', to: 'vendor' },
         { from: 'app/frontend/vendor/outerHTML.js', to: 'vendor' },
-        { from: 'app/frontend/vendor/polyfill-output-value.js', to: 'vendor' }
+        { from: 'app/frontend/vendor/polyfill-output-value.js', to: 'vendor' },
+        { from: 'node_modules/@ministryofjustice/frontend/moj/all.js', to: 'vendor' }
       ]
     })
   ]

yarn.lock

@@ -1109,6 +1109,14 @@
     "@jridgewell/resolve-uri" "^3.1.0"
     "@jridgewell/sourcemap-codec" "^1.4.14"
 
+"@ministryofjustice/frontend@^3.3.0":
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/@ministryofjustice/frontend/-/frontend-3.3.0.tgz#45bb0359fa9a466a574d44e2a78121f5544c2eeb"
+  integrity sha512-kK1+XTI8KPgL2kA3ylTkXfXqA2cirENh1oxTYnvogt6W8vg5VexGSYjynRZ5EhRUAQh6uHPmOGyr+mYXmNwReQ==
+  dependencies:
+    govuk-frontend "^5.0.0"
+    moment "^2.27.0"
+
 "@nodelib/fs.scandir@2.1.5":
   version "2.1.5"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5"
@@ -2734,7 +2742,7 @@ gopd@^1.0.1:
   dependencies:
     get-intrinsic "^1.1.3"
 
-govuk-frontend@5.7.1:
+govuk-frontend@5.7.1, govuk-frontend@^5.0.0:
   version "5.7.1"
   resolved "https://registry.yarnpkg.com/govuk-frontend/-/govuk-frontend-5.7.1.tgz#d4c561ebf8c0b76130f31df8c2e4d70d340cd63f"
   integrity sha512-jF1cq5rn57kxZmJRprUZhTQ31zaBBK4b5AyeJaPX3Yhg22lk90Mx/dQLvOk/ycV3wM7e0y+s4IPvb2fFaPlCGg==
@@ -3124,7 +3132,7 @@ jest-worker@^27.4.5:
   dependencies:
     jquery ">=1.8.0 <4.0.0"
 
-"jquery@>=1.8.0 <4.0.0", jquery@^3.6.0:
+"jquery@>=1.8.0 <4.0.0", jquery@^3.6.0, jquery@^3.7.1:
   version "3.7.1"
   resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.7.1.tgz#083ef98927c9a6a74d05a6af02806566d16274de"
   integrity sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==
@@ -3386,6 +3394,11 @@ minimist@^1.2.0, minimist@^1.2.6:
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c"
   integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
 
+moment@^2.27.0:
+  version "2.30.1"
+  resolved "https://registry.yarnpkg.com/moment/-/moment-2.30.1.tgz#f8c91c07b7a786e30c59926df530b4eac96974ae"
+  integrity sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==
+
 ms@2.1.2:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009"