@helsenorge/designsystem-react 1.0.0-experimental.0 → 1.0.0

package/package.json

@@ -1,118 +1,103 @@
 {
   "name": "@helsenorge/designsystem-react",
-  "version": "1.0.0-experimental.0",
+  "sideEffects": false,
+  "version": "1.0.0",
   "description": "The official design system for Helsenorge built with React.",
   "repository": {
-    "type": "git",
-    "url": "https://github.com/helsenorge/designsystem",
-    "directory": "packages/designsystem-react"
+    "type": "tfs",
+    "url": "https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem"
   },
   "homepage": "https://helsenorge.design",
-  "author": "Steffen Lien <steffen.lien@ehelse.no>",
-  "bugs": {
-    "url": "https://github.com/Helsenorge/designsystem/issues",
-    "email": "contact@helsenorge.design"
-  },
-  "license": "MIT",
-  "keywords": [
-    "components",
-    "design-system",
-    "helsenorge",
-    "patterns",
-    "react"
+  "author": "Helsenorge",
+  "maintainers": [
+    "ROX"
   ],
+  "license": "MIT",
+  "type": "module",
   "publishConfig": {
+    "directory": "lib",
     "access": "public"
   },
-  "main": "dist/js/helsenorge.js",
-  "module": "dist/js/helsenorge.esm.js",
-  "types": "dist/index.d.ts",
+  "types": "lib/index.d.ts",
   "source": "src/index.ts",
-  "files": [
-    "dist/"
-  ],
-  "scripts": {
-    "build": "yarn clean && rollup -c --environment BUILD:production && yarn build:defs",
-    "build:defs": "tsc --emitDeclarationOnly && dts-bundle-generator -project ./tsconfig.json -o ./dist/index.d.ts ./types/src/index.d.ts",
-    "clean": "rimraf dist types",
-    "cz": "git-cz",
-    "format": "prettier --write \"src/**/*.+(js|jsx|json|ts|tsx)\"",
-    "generate:icons": "node scripts/iconGenerator.js generate",
-    "lint": "eslint \"src/**/*\"",
-    "precommit": "lint-staged",
-    "test": "jest",
-    "test:open": "open -a 'Google Chrome' coverage/lcov-report/index.html",
-    "test:watch": "jest --watch",
-    "start": "start-storybook",
-    "validate": "yarn lint && yarn format -l"
-  },
+  "scripts": {},
   "peerDependencies": {
-    "bootstrap": "4.4.1",
+    "bootstrap": "4.6.1",
     "normalize.css": "8.0.1",
-    "react": ">= 16.12.0",
-    "react-dom": ">= 16.12.0",
-    "styled-components": "^5.0.0"
+    "react": "^17.0.0",
+    "react-dom": "^17.0.0"
+  },
+  "dependencies": {
+    "bootstrap": "4.6.1"
   },
   "devDependencies": {
-    "@babel/core": "^7.8.3",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/plugin-proposal-object-rest-spread": "^7.8.3",
-    "@babel/plugin-proposal-optional-chaining": "^7.8.3",
-    "@babel/preset-env": "^7.8.3",
-    "@babel/preset-react": "^7.8.3",
-    "@babel/preset-typescript": "^7.8.3",
-    "@storybook/addon-a11y": "^5.3.13",
-    "@storybook/addon-actions": "^5.3.12",
-    "@storybook/addon-backgrounds": "^5.3.12",
-    "@storybook/addon-centered": "^5.3.12",
-    "@storybook/addon-knobs": "^5.3.12",
-    "@storybook/addon-viewport": "^5.3.12",
-    "@storybook/addons": "^5.3.12",
-    "@storybook/react": "^5.3.12",
-    "@svgr/core": "^4.3.3",
-    "@testing-library/jest-dom": "^4.2.4",
-    "@testing-library/react": "^9.4.0",
-    "@types/jest": "^24.9.0",
-    "@types/styled-components": "^5.0.1",
-    "@types/testing-library__react": "^9.1.2",
-    "async": "^3.1.0",
-    "babel-loader": "^8.0.6",
-    "css-loader": "^3.2.0",
-    "dts-bundle-generator": "^3.3.0",
-    "file-loader": "^4.2.0",
+    "@babel/core": "^7.17.9",
+    "@babel/plugin-proposal-class-properties": "^7.16.7",
+    "@babel/plugin-proposal-object-rest-spread": "^7.17.3",
+    "@babel/plugin-proposal-optional-chaining": "^7.16.7",
+    "@babel/preset-env": "^7.16.11",
+    "@babel/preset-react": "^7.16.7",
+    "@babel/preset-typescript": "^7.16.7",
+    "@rollup/plugin-buble": "^0.21.3",
+    "@rollup/plugin-commonjs": "^22.0.0",
+    "@rollup/plugin-node-resolve": "^13.3.0",
+    "@rollup/plugin-typescript": "^8.0.0",
+    "@storybook/addon-a11y": "^6.0.0",
+    "@storybook/addon-actions": "^6.0.0",
+    "@storybook/addon-backgrounds": "^6.0.0",
+    "@storybook/addon-controls": "^6.0.0",
+    "@storybook/addon-docs": "^6.0.0",
+    "@storybook/addon-viewport": "^6.0.0",
+    "@storybook/addons": "^6.0.0",
+    "@storybook/react": "^6.0.0",
+    "@svgr/core": "^6.2.1",
+    "@testing-library/jest-dom": "^5.16.4",
+    "@testing-library/react": "^12.1.3",
+    "@testing-library/user-event": "^13.5.0",
+    "@types/classnames": "^2.3.1",
+    "@types/jest": "^27.4.1",
+    "@types/prettier": "2.6.0",
+    "@types/react": "^17.0.0",
+    "@types/react-dom": "17.0.0",
+    "async": "^3.2.3",
+    "babel-loader": "^8.2.4",
+    "classnames": "^2.3.1",
+    "copyfiles": "^2.4.1",
+    "css-loader": "^4.3.0",
+    "file-loader": "^6.2.0",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^24.9.0",
-    "jest-styled-components": "^7.0.0",
-    "jest-watch-typeahead": "^0.4.2",
+    "jest": "^27.5.1",
+    "jest-watch-typeahead": "^1.0.0",
+    "jest-when": "^3.5.1",
+    "node-sass": "^6.0.0",
     "normalize.css": "8.0.1",
-    "postcss-import": "^12.0.1",
-    "postcss-loader": "^3.0.0",
-    "postcss-nested": "^4.2.1",
-    "postcss-preset-env": "^6.7.0",
-    "react": "16.12.0",
-    "react-docgen-typescript-loader": "^3.3.0",
-    "react-dom": "16.12.0",
-    "resolve-url-loader": "^3.1.1",
-    "rollup": "^1.26.5",
-    "rollup-plugin-babel": "^4.3.3",
-    "rollup-plugin-buble": "^0.19.8",
-    "rollup-plugin-commonjs": "^10.1.0",
-    "rollup-plugin-copy": "^3.1.0",
+    "npm-run-all": "^4.1.5",
+    "prettier": "2.6.2",
+    "react": "^17.0.0",
+    "react-docgen-typescript": "^1.22.0",
+    "react-docgen-typescript-loader": "^3.7.2",
+    "react-dom": "^17.0.0",
+    "react-hook-form": "^6.15.8",
+    "resolve-url-loader": "^5.0.0",
+    "rimraf": "^3.0.2",
+    "rollup": "^2.71.1",
+    "rollup-plugin-babel": "^4.4.0",
+    "rollup-plugin-copy": "^3.4.0",
     "rollup-plugin-execute": "^1.1.1",
-    "rollup-plugin-node-resolve": "^5.2.0",
-    "rollup-plugin-peer-deps-external": "^2.2.2",
-    "rollup-plugin-progress": "^1.1.1",
-    "rollup-plugin-scss": "^1.0.2",
-    "rollup-plugin-sizes": "^0.5.1",
-    "sass-loader": "^8.0.0",
-    "style-loader": "^1.0.0",
-    "styled-components": "5.0.1",
-    "svg-parser": "^2.0.2",
-    "ts-loader": "^6.2.1",
-    "webpack": "^4.41.2",
-    "yargs": "^15.0.2"
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-progress": "^1.1.2",
+    "rollup-plugin-terser": "^7.0.2",
+    "rollup-plugin-typescript2": "^0.31.2",
+    "sass-loader": "^10.0.0",
+    "style-loader": "^2.0.0",
+    "svg-parser": "^2.0.4",
+    "svgo": "^2.8.0",
+    "ts-loader": "^7.0.0",
+    "typed-scss-modules": "^6.2.0",
+    "typescript": "~4.2.4",
+    "yargs": "^17.4.1"
   },
-  "dependencies": {
-    "bootstrap": "4.4.1"
+  "overrides": {
+    "node-sass": "^6.0.0"
   }
-}
+}

package/palette-f206f488.js

@@ -0,0 +1,2 @@
+var r=Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},{banana50:"#FCF2BF",banana100:"#F9EA9F",banana200:"#F5E080",banana300:"#F1D460",banana400:"#EBC840",banana500:"#DDAB06",banana600:"#C59302",banana700:"#AB7C00",banana800:"#916500",banana900:"#764F00"}),{blueberry50:"#E4F7F9",blueberry100:"#CAE7ED",blueberry200:"#AFDAE3",blueberry300:"#7ABECC",blueberry400:"#58AABB",blueberry500:"#188097",blueberry600:"#126F87",blueberry700:"#08667C",blueberry800:"#06596C",blueberry900:"#084350"}),{cherry50:"#FFF2EA",cherry100:"#F7E1D2",cherry200:"#EEC0A5",cherry300:"#E39376",cherry400:"#D56147",cherry500:"#C83521",cherry600:"#B62E1C",cherry700:"#A31F0E",cherry800:"#912112",cherry900:"#7E1C0E"}),{kiwi50:"#E6F8EE",kiwi100:"#C2EDD6",kiwi200:"#9DE2BF",kiwi300:"#79D6AA",kiwi400:"#56CA96",kiwi500:"#33BE84",kiwi600:"#10B172",kiwi700:"#0CA161",kiwi800:"#099150",kiwi900:"#078141"}),{neutral50:"#F5F3F3",neutral100:"#EAE7E7",neutral200:"#D6D4D3",neutral300:"#BDBAB9",neutral400:"#AAA8A6",neutral500:"#989693",neutral600:"#7D7C79",neutral700:"#62625F",neutral800:"#474745",neutral900:"#2B2C2B"}),{plum50:"#EFE4FD",plum100:"#D7BDF9",plum200:"#BF98F3",plum300:"#A875EB",plum400:"#9153E2",plum500:"#7A33D7",plum600:"#6A2ABF",plum700:"#5B22A6",plum800:"#4C1B8C",plum900:"#3C1471"}),{black:"#000000",white:"#ffffff"});export{r as p};
+//# sourceMappingURL=palette-f206f488.js.map

package/palette-f206f488.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"palette-f206f488.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/scss/_body.scss

@@ -0,0 +1,15 @@
+@import './font-settings';
+@import './palette';
+@import 'breakpoints';
+
+body {
+  font-family: 'Source Sans Pro', Arial, Verdana, sans-serif;
+  background-color: $white;
+  color: $black;
+  font-size: $font-size-sm;
+  line-height: $lineheight-size-sm;
+  @include media-breakpoint-up(md) {
+    font-size: $font-size-md;
+    line-height: $lineheight-size-md;
+  }
+}

package/scss/_breakpoints.scss

@@ -0,0 +1,24 @@
+@import 'spacers';
+
+$grid-gutter-width: map-get($spacers, 5);
+
+$grid-breakpoints: (
+  xxs: 0,
+  xs: 360px,
+  sm: 564px,
+  md: 768px,
+  lg: 1088px,
+  xl: 1450px,
+);
+
+$grid-max-breakpoints: (
+  xs: map-get($grid-breakpoints, sm) - 0.02,
+  sm: map-get($grid-breakpoints, md) - 0.02,
+  md: map-get($grid-breakpoints, lg) - 0.02,
+);
+
+$container-max-widths: (
+  sm: 528px,
+  md: 612px,
+  lg: 1056px,
+);

package/scss/_font-settings.scss

@@ -0,0 +1,8 @@
+$font-size-xs: 1rem; // 16px
+$font-size-sm: 1.125rem; // 18px
+$font-size-md: 1.25rem; // 20px
+$font-size-lg: 1.5rem; // 24px
+$lineheight-size-xs: 1.5rem; // 24px
+$lineheight-size-sm: 1.75rem; // 28px
+$lineheight-size-md: 1.875rem; // 30px
+$lineheight-size-lg: 2rem; // 32px

package/{dist/scss → scss}/_fonts.scss

@@ -1,3 +1,5 @@
+@import './font-settings.scss';
+
 /* latin */
 @font-face {
   font-family: 'Source Sans Pro';
@@ -5,8 +7,7 @@
   font-weight: 200;
   font-display: swap;
   src: local('Source Sans Pro Extra Light'), local('SourceSansPro-ExtraLight'),
-    url(../fonts/source-sans-pro-200-extralight.woff) format('woff'),
-    url(../fonts/source-sans-pro-200-extralight.woff2) format('woff2');
+    url(../fonts/source-sans-pro-200-extralight.woff) format('woff'), url(../fonts/source-sans-pro-200-extralight.woff2) format('woff2');
 }
 /* latin */
 @font-face {
@@ -24,8 +25,7 @@
   font-style: normal;
   font-weight: 300;
   font-display: swap;
-  src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
-    url(../fonts/source-sans-pro-300-light.woff) format('woff'),
+  src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url(../fonts/source-sans-pro-300-light.woff) format('woff'),
     url(../fonts/source-sans-pro-300-light.woff2) format('woff2');
 }
 /* latin */
@@ -35,8 +35,7 @@
   font-weight: 300;
   font-display: swap;
   src: local('Source Sans Pro Light Italic'), local('SourceSansPro-LightItalic'),
-    url(../fonts/source-sans-pro-300-light-italic.woff) format('woff'),
-    url(../fonts/source-sans-pro-300-light-italic.woff2) format('woff2');
+    url(../fonts/source-sans-pro-300-light-italic.woff) format('woff'), url(../fonts/source-sans-pro-300-light-italic.woff2) format('woff2');
 }
 /* latin */
 @font-face {
@@ -44,8 +43,7 @@
   font-style: normal;
   font-weight: 400;
   font-display: swap;
-  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
-    url(../fonts/source-sans-pro-400-regular.woff) format('woff'),
+  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(../fonts/source-sans-pro-400-regular.woff) format('woff'),
     url(../fonts/source-sans-pro-400-regular.woff2) format('woff2');
 }
 /* latin */
@@ -54,8 +52,7 @@
   font-style: italic;
   font-weight: 400;
   font-display: swap;
-  src: local('Source Sans Pro Italic'), local('SourceSansPro-Italic'),
-    url(../fonts/source-sans-pro-400-regular-italic.woff) format('woff'),
+  src: local('Source Sans Pro Italic'), local('SourceSansPro-Italic'), url(../fonts/source-sans-pro-400-regular-italic.woff) format('woff'),
     url(../fonts/source-sans-pro-400-regular-italic.woff2) format('woff2');
 }
 /* latin */
@@ -64,8 +61,7 @@
   font-style: normal;
   font-weight: 600;
   font-display: swap;
-  src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'),
-    url(../fonts/source-sans-pro-600-semibold.woff) format('woff'),
+  src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'), url(../fonts/source-sans-pro-600-semibold.woff) format('woff'),
     url(../fonts/source-sans-pro-600-semibold.woff2) format('woff2');
 }
 /* latin */
@@ -84,8 +80,7 @@
   font-style: normal;
   font-weight: 700;
   font-display: swap;
-  src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'),
-    url(../fonts/source-sans-pro-700-bold.woff) format('woff'),
+  src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(../fonts/source-sans-pro-700-bold.woff) format('woff'),
     url(../fonts/source-sans-pro-700-bold.woff2) format('woff2');
 }
 /* latin */
@@ -95,8 +90,7 @@
   font-weight: 700;
   font-display: swap;
   src: local('Source Sans Pro Bold Italic'), local('SourceSansPro-BoldItalic'),
-    url(../fonts/source-sans-pro-700-bold-italic.woff) format('woff'),
-    url(../fonts/source-sans-pro-700-bold-italic.woff2) format('woff2');
+    url(../fonts/source-sans-pro-700-bold-italic.woff) format('woff'), url(../fonts/source-sans-pro-700-bold-italic.woff2) format('woff2');
 }
 /* latin */
 @font-face {
@@ -104,8 +98,7 @@
   font-style: normal;
   font-weight: 900;
   font-display: swap;
-  src: local('Source Sans Pro Black'), local('SourceSansPro-Black'),
-    url(../fonts/source-sans-pro-900-black.woff) format('woff'),
+  src: local('Source Sans Pro Black'), local('SourceSansPro-Black'), url(../fonts/source-sans-pro-900-black.woff) format('woff'),
     url(../fonts/source-sans-pro-900-black.woff2) format('woff2');
 }
 /* latin */
@@ -115,6 +108,5 @@
   font-weight: 900;
   font-display: swap;
   src: local('Source Sans Pro Black Italic'), local('SourceSansPro-BlackItalic'),
-    url(../fonts/source-sans-pro-900-black-italic.woff) format('woff'),
-    url(../fonts/source-sans-pro-900-black-italic.woff2) format('woff2');
+    url(../fonts/source-sans-pro-900-black-italic.woff) format('woff'), url(../fonts/source-sans-pro-900-black-italic.woff2) format('woff2');
 }

package/scss/_grid.scss

@@ -0,0 +1 @@
+@import '~bootstrap/scss/bootstrap-grid.scss';