Merge pull request #97 from forumone/1.x-RC

1.1.3

Author: kmonahan

.prettierrc

@@ -13,9 +13,9 @@
   "useTabs": false,
   "overrides": [
     {
-      "files": ["source/01-global/icon/**/*.tsx"],
+      "files": ["source/01-global/icon/**/*.tsx", "source/01-global/icon/**/*.svg"],
       "options": {
-        "organizeImportsSkipDestructiveCodeActions": true
+        "plugins": []
       }
     }
   ]

.storybook/main.js

@@ -13,7 +13,6 @@ module.exports = {
   ],
   framework: {
     name: '@storybook/nextjs',
-    options: { builder: { useSWC: true } },
   },
   webpackFinal: async config => {
     config.plugins.push(

.storybook/preview.js

@@ -4,7 +4,6 @@ import '../source/01-global/index.css';
 import '../source/06-utility/index.css';
 
 const parameters = {
-  actions: { argTypesRegex: '^on[A-Z].*' },
   controls: {
     matchers: {
       color: /(background|color)$/i,

.stylelintrc.yml

@@ -28,6 +28,7 @@ rules:
         - global
         - iff
         - 'responsive-font-size'
+        - 'rem-convert'
   import-notation: string
   max-nesting-depth: 4
   number-max-precision: null

lib/icon-template.js

@@ -53,9 +53,12 @@ const iconTemplate = (
   }
 
   return tpl`
+// organize-imports-ignore
+
 // This component is automatically generated.
 // SVGs should be added to icon/svgs.
 // See the project documentation for more information.
+
 // tslint:disable:ordered-imports
 import clsx from 'clsx';
 ${imports};

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "nextjs-project",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -30,25 +30,23 @@
     "react-select": "^5.8.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.23.7",
     "@csstools/postcss-global-data": "^2.1.1",
-    "@storybook/addon-a11y": "^7.6.17",
-    "@storybook/addon-actions": "^7.6.17",
-    "@storybook/addon-essentials": "^7.6.17",
-    "@storybook/addon-interactions": "^7.6.17",
-    "@storybook/addon-links": "^7.6.17",
-    "@storybook/nextjs": "^7.6.17",
-    "@storybook/react": "^7.6.17",
-    "@storybook/testing-library": "^0.2.2",
-    "@storybook/theming": "^7.6.17",
+    "@storybook/addon-a11y": "^8.0.2",
+    "@storybook/addon-actions": "^8.0.2",
+    "@storybook/addon-essentials": "^8.0.2",
+    "@storybook/addon-interactions": "^8.0.2",
+    "@storybook/addon-links": "^8.0.2",
+    "@storybook/nextjs": "^8.0.2",
+    "@storybook/react": "^8.0.2",
+    "@storybook/test": "^8.0.2",
+    "@storybook/theming": "^8.0.2",
     "@svgr/babel-plugin-add-jsx-attribute": "^8.0.0",
     "@svgr/babel-plugin-remove-jsx-attribute": "^8.0.0",
     "@svgr/cli": "^8.1.0",
     "@types/node": "^18.19.3",
     "@types/react": "^18.2.48",
-    "@typescript-eslint/eslint-plugin": "^6.19.1",
-    "@typescript-eslint/parser": "^6.19.1",
-    "babel-loader": "^9.1.3",
+    "@typescript-eslint/eslint-plugin": "^7.3.1",
+    "@typescript-eslint/parser": "^7.3.1",
     "clsx": "^2.1.0",
     "css-loader": "^6.9.1",
     "csstype": "3.1.3",
@@ -58,25 +56,23 @@
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.1.3",
     "html-react-parser": "^5.1.1",
-    "husky": "^8.0.3",
-    "i": "^0.3.7",
+    "husky": "^9.0.11",
     "inquirer": "^9.2.12",
     "mkdirp": "^3.0.1",
-    "npm": "^10.2.5",
     "postcss": "^8.4.33",
     "postcss-advanced-variables": "github:kmonahan/postcss-advanced-variables",
-    "postcss-loader": "^7.3.4",
+    "postcss-loader": "^8.1.1",
     "postcss-nesting": "^12.0.2",
     "postcss-preset-env": "^9.3.0",
-    "postcss-rem": "^2.0.2",
+    "postcss-rem": "^3.0.0",
     "prettier": "^3.2.4",
     "prettier-plugin-organize-imports": "^3.2.4",
-    "storybook": "^7.6.17",
+    "storybook": "^8.0.2",
     "style-loader": "^3.3.4",
-    "stylelint": "^15.11.0",
-    "stylelint-config-standard": "^33.0.0",
+    "stylelint": "^16.2.1",
+    "stylelint-config-standard": "^36.0.0",
     "stylelint-order": "^6.0.4",
-    "stylelint-webpack-plugin": "^4.1.1",
+    "stylelint-webpack-plugin": "^5.0.0",
     "typescript": "^5.3.3",
     "yaml": "^2.3.4"
   },

package.json

@@ -82,7 +82,10 @@
   @param {String} $item-min-width Minimum column width.
   @param {Boolean} $flex-override Whether to reset styling to remove flex constrains first.
  */
-@mixin css-autofit-grid($item-min-width: rem(300px), $flex-override: false) {
+@mixin css-autofit-grid(
+  $item-min-width: rem-convert(300px),
+  $flex-override: false
+) {
   @if $flex-override {
     @include css-grid-reset();
   }

source/00-config/mixins/grids.css

@@ -1,5 +1,5 @@
 :root {
-  --constrain-sm: rem(800px);
-  --constrain-md: rem(1440px);
-  --constrain-lg: rem(2200px);
+  --constrain-sm: rem-convert(800px);
+  --constrain-md: rem-convert(1440px);
+  --constrain-lg: rem-convert(2200px);
 }

source/00-config/vars/constrain.css

@@ -1,28 +1,28 @@
 :root {
   --spacing-0: 0;
-  --spacing-0-5: rem(4px);
-  --spacing-1: rem(8px);
-  --spacing-1-5: rem(12px);
-  --spacing-2: rem(16px);
-  --spacing-2-5: rem(20px);
-  --spacing-3: rem(24px);
-  --spacing-4: rem(32px);
-  --spacing-5: rem(40px);
-  --spacing-6: rem(48px);
-  --spacing-7: rem(56px);
-  --spacing-8: rem(64px);
-  --spacing-9: rem(72px);
-  --spacing-10: rem(80px);
-  --spacing-12: rem(96px);
-  --spacing-15: rem(120px);
+  --spacing-0-5: rem-convert(4px);
+  --spacing-1: rem-convert(8px);
+  --spacing-1-5: rem-convert(12px);
+  --spacing-2: rem-convert(16px);
+  --spacing-2-5: rem-convert(20px);
+  --spacing-3: rem-convert(24px);
+  --spacing-4: rem-convert(32px);
+  --spacing-5: rem-convert(40px);
+  --spacing-6: rem-convert(48px);
+  --spacing-7: rem-convert(56px);
+  --spacing-8: rem-convert(64px);
+  --spacing-9: rem-convert(72px);
+  --spacing-10: rem-convert(80px);
+  --spacing-12: rem-convert(96px);
+  --spacing-15: rem-convert(120px);
 
-  --gutter-width: rem(40px);
+  --gutter-width: rem-convert(40px);
 
-  --site-margins: rem(16px);
+  --site-margins: rem-convert(16px);
 }
 
 @media (--desktop) {
   :root {
-    --site-margins: rem(32px);
+    --site-margins: rem-convert(32px);
   }
 }