Added Self-Exclusion Page

packages/components/pages/f-self-exclusion/.eslintignore

@@ -0,0 +1,2 @@
+node_modules
+dist

packages/components/pages/f-self-exclusion/CHANGELOG.md

@@ -0,0 +1,13 @@
+# Changelog
+
+The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
+and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
+
+
+v0.1.0
+------------------------------
+*August 15, 2023*
+
+### Added
+- Add your change under the following headings: `Added`/`Changed`/`Deprecated`/`Removed`/`Fixed`/`Security`
+!!! Please, add your component to `.circleci/config.yml` under `save_cache_dist_directories` manually after the component is generated.

packages/components/pages/f-self-exclusion/LICENSE

@@ -0,0 +1,17 @@
+Apache License
+Version 2.0, January 2004
+http://www.apache.org/licenses/
+
+Copyright (c) Just Eat Holding Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.

packages/components/pages/f-self-exclusion/README.md

@@ -0,0 +1,127 @@
+<div align="center">
+
+# f-self-exclusion
+
+<img width="125" alt="Fozzie Bear" src="../../../../bear.png" />
+
+Customers must be able to voluntarily self-exclude or nominate themselves for self exclusion for a specified time period or permanently (includes purchasing and marketing), and their account (associated to the email address or phone number provided during self exclusions) must be blocked from purchasing alcohol and other items.
+
+</div>
+
+---
+
+[![npm version](https://badge.fury.io/js/%40justeat%2Ff-self-exclusion.svg)](https://badge.fury.io/js/%40justeat%2Ff-self-exclusion)
+[![CircleCI](https://circleci.com/gh/justeat/fozzie-components.svg?style=svg)](https://circleci.com/gh/justeat/workflows/fozzie-components)
+[![Coverage Status](https://coveralls.io/repos/github/justeat/f-self-exclusion/badge.svg)](https://coveralls.io/github/justeat/f-self-exclusion)
+[![Known Vulnerabilities](https://snyk.io/test/github/justeat/f-self-exclusion/badge.svg?targetFile=package.json)](https://snyk.io/test/github/justeat/f-self-exclusion?targetFile=package.json)
+
+---
+
+## Usage
+
+### Installation
+
+Install the module using npm or Yarn:
+
+```sh
+yarn add @justeat/f-self-exclusion
+```
+
+```sh
+npm install @justeat/f-self-exclusion
+```
+
+
+
+### Vue Applications
+
+You can import it in your Vue SFC like this (please note that styles have to be imported separately):
+
+```js
+import SelfExclusion from '@justeat/f-self-exclusion';
+import '@justeat/f-self-exclusion/dist/f-self-exclusion.css';
+
+export default {
+    components: {
+        SelfExclusion
+    }
+}
+```
+
+If you are using Webpack, you can import the component dynamically to separate the `self-exclusion` bundle from the main `bundle.client.js`:
+
+```js
+import '@justeat/f-self-exclusion/dist/f-self-exclusion.css';
+
+export default {
+    components: {
+        // …
+        SelfExclusion: () => import(/* webpackChunkName: "self-exclusion" */ '@justeat/f-self-exclusion')
+    }
+}
+```
+
+## Configuration
+
+### Props
+
+There may be props that allow you to customise its functionality.
+
+The props that can be defined are as follows (if any):
+
+| Prop  | Type  | Default | Description |
+| ----- | ----- | ------- | ----------- |
+
+### Events
+
+The events that can be subscribed to are as follows (if any):
+
+| Event | Description |
+| ----- | ----------- |
+
+## Development
+
+Start by cloning the repository and installing the required dependencies:
+
+```sh
+$ git clone [email protected]:justeat/fozzie-components.git
+$ cd fozzie-components
+$ yarn
+```
+
+Change directory to the `f-self-exclusion` package:
+
+```sh
+$ cd packages/components/pages/f-self-exclusion
+```
+
+## Testing
+
+To test all components, run from root directory.
+To test only `f-self-exclusion`, run from the `./fozzie-components/packages/components/pages/f-self-exclusion` directory.
+
+### Unit and Integration tests
+
+```sh
+yarn test
+```
+
+### Component and Accessibility Tests
+
+```bash
+# Note: Ensure Storybook is running when running the following commands
+cd ./fozzie-components
+
+yarn storybook:build
+yarn storybook:serve-static
+```
+
+yarn test-component:chrome
+```
+### Accessibility tests
+```bash
+yarn test-a11y:chrome
+```
+## Documentation to be completed once module is in stable state.
+
+

packages/components/pages/f-self-exclusion/babel.config.js

@@ -0,0 +1,26 @@
+module.exports = api => {
+    // Use `isTest` to determine what presets and plugins to use with jest
+    const isTest = api.env('test');
+    const presets = [];
+    const plugins = [
+        '@babel/plugin-proposal-optional-chaining' // https://babeljs.io/docs/en/babel-plugin-proposal-optional-chaining
+    ];
+    const builtIns = (api.env('development') ? 'entry' : false);
+
+    if (!isTest) {
+        api.cache(true); // Caches the computed babel config function – https://babeljs.io/docs/en/config-files#apicache
+        presets.push(['@vue/app', { useBuiltIns: builtIns }]);
+        // Alias for @babel/preset-env
+        // Hooks into browserslist to provide smart Babel transforms
+        // https://babeljs.io/docs/en/babel-preset-env
+        presets.push('@babel/env');
+    } else {
+        // use current node version for transpiling test files
+        presets.push(['@babel/env', { targets: { node: 'current' } }]);
+    }
+
+    return {
+        presets,
+        plugins
+    };
+};

packages/components/pages/f-self-exclusion/jest.config.js

@@ -0,0 +1,41 @@
+module.exports = {
+    moduleFileExtensions: [
+        'js',
+        'json',
+        'vue'
+    ],
+
+    transform: {
+        '^.+\\.js$': 'babel-jest',
+        '^.+\\.vue$': 'vue-jest',
+        '.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub'
+    },
+
+    transformIgnorePatterns: [
+        'node_modules/(?!(lodash-es)/)'
+    ],
+
+    moduleNameMapper: {
+        '^@/(.*)$': '<rootDir>/src/$1',
+        '^~include-media/(.*)$': '<rootDir>../../node_modules/include-media/$1',
+        '^~@justeat/(.*)$': '<rootDir>../../node_modules/@justeat/$1',
+        '\\.(css|scss)$': 'jest-transform-stub'
+    },
+
+    snapshotSerializers: [
+        'jest-serializer-vue'
+    ],
+
+    globals: {
+        'vue-jest': {
+            hideStyleWarn: true, // We hide style warnings given the first time we run the tests it complains about some styles. The second time the tests are run, the warning disappears. https://github.com/vuejs/vue-jest/issues/178#issuecomment-529175129
+            experimentalCSSCompile: false // hoping this will be a temporary fix, as tests fail when updating to dart-sass currently with vue-cli
+        }
+    },
+
+    modulePathIgnorePatterns: [
+
+    ],
+
+    testURL: 'http://localhost/'
+};

packages/components/pages/f-self-exclusion/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "@justeat/f-self-exclusion",
+  "description": "Fozzie Self Exclusion - Customers must be able to voluntarily self-exclude or nominate themselves for self exclusion for a specified time period or permanently (includes purchasing and marketing), and their account (associated to the email address or phone number provided during self exclusions) must be blocked from purchasing alcohol and other items.",
+  "version": "0.1.0",
+  "main": "dist/f-self-exclusion.umd.min.js",
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "homepage": "https://github.com/justeat/fozzie-components/tree/master/packages/components/pages/f-self-exclusion",
+  "contributors": [
+    "Github contributors <https://github.com/justeat/fozzie-components/graphs/contributors>"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "[email protected]:justeat/fozzie-components.git"
+  },
+  "bugs": {
+    "url": "https://github.com/justeat/fozzie-components/issues"
+  },
+  "license": "Apache-2.0",
+  "engines": {
+    "node": "^12 || ^14 || ^16"
+  },
+  "keywords": [
+    "fozzie"
+  ],
+  "scripts": {
+    "prepublishOnly": "yarn lint && yarn test && yarn build",
+    "build": "vue-cli-service build --target lib --name f-self-exclusion ./src/index.js",
+    "lint": "eslint \"!(dist)/**/*.{js,vue}\"",
+    "lint:fix": "yarn lint --fix",
+    "lint:style": "stylelint ./src/**/*.{vue,htm,html,css,sss,less,scss}",
+    "lint:style:fix": "yarn lint:style --fix",
+    "test": "jest --passWithNoTests",
+    "ci:test:pages": "yarn test",
+    "test-a11y:chrome": "cross-env-shell TEST_TYPE=a11y wdio ../../../../wdio-chrome.conf.js"
+  },
+  "browserslist": [
+    "extends @justeat/browserslist-config-fozzie"
+  ],
+  "dependencies": {
+    "@justeat/f-services": "1.x"
+  },
+  "peerDependencies": {
+    "@justeat/browserslist-config-fozzie": ">=1.2.0"
+  },
+  "devDependencies": {
+  }  
+}

packages/components/pages/f-self-exclusion/src/assets/scss/common.scss

@@ -0,0 +1 @@
+// Add styles here so it can be injected first via vue.config.js.