@stihl-design-system/components 1.0.0-RC.0

package/package.json

@@ -0,0 +1,125 @@
+{
+  "name": "@stihl-design-system/components",
+  "private": false,
+  "version": "1.0.0-RC.0",
+  "license": "SEE LICENSE IN LICENSE",
+  "homepage": "https://designsystem.stihl.de",
+  "publishConfig": {
+    "access": "public",
+    "@stihl-design-system:registry": "https://registry.npmjs.org"
+  },
+  "type": "module",
+  "module": "./index.es.js",
+  "types": "./index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./index.d.ts",
+      "import": "./index.es.js",
+      "default": "./index.es.js"
+    },
+    "./styles/fonts": "./styles/fonts/font-face.min.css",
+    "./styles/fonts/*.css": {
+      "default": "./styles/fonts/*.css"
+    },
+    "./styles/scss": "./styles/scss/_index.scss",
+    "./partials": {
+      "types": "./partials/index.d.ts",
+      "import": "./partials/index.js",
+      "require": "./partials/index.js"
+    }
+  },
+  "typesVersions": {
+    "*": {
+      "partials": [
+        "./partials/index.d.ts"
+      ]
+    }
+  },
+  "scripts": {
+    "predev": "npx vite-node scripts/extractAriaTypes.ts && prettier ./src/types/aria-types.d.ts --write",
+    "dev": "npm run storybook",
+    "prebuild": "npm run build:propsOverview",
+    "build": "npm run build:components && npm run build:storybook",
+    "build:components": "tsc && vite build && npm run build:copyUtilitiesBuild && npm run build:copyTypes && cp package.json ./dist",
+    "build:copyComponents": "npm run build:components && ../../copyDistToExampleApps.sh '../../'",
+    "build:copyTypes": "TARGET=./dist/types && rm -rf $TARGET && mkdir -p $TARGET && cp -r ./src/types/* $TARGET/",
+    "build:copyUtilitiesBuild": "npm run build:copyUtilitiesBuild:scss && npm run build:copyUtilitiesBuild:fonts && npm run build:copyUtilitiesBuild:partials",
+    "build:copyUtilitiesBuild:scss": "TARGET=./dist/styles/scss && rm -rf $TARGET && mkdir -p $TARGET && cp -r ../utilities/dist/scss/* $TARGET/",
+    "build:copyUtilitiesBuild:fonts": "TARGET=./dist/styles/fonts && rm -rf $TARGET && mkdir -p $TARGET && cp -r ../utilities/dist/fonts/* $TARGET/",
+    "build:copyUtilitiesBuild:partials": "TARGET=./dist/partials && rm -rf $TARGET && mkdir -p $TARGET && cp -r ../utilities/dist/partials/* $TARGET/",
+    "build:storybook": "storybook build",
+    "build:propsOverview": "EXCLUDED_COMPS=**/Asterisk.tsx,**/CustomReactSelect.tsx,**/OptionCheckbox.tsx,**/SystemFeedback.tsx,**/Radio.tsx && react-docgen ./src/components/**/*.tsx -o ./src/stories/Introduction/component-props.json -i **/*.test.tsx,**/*.utils.tsx,$EXCLUDED_COMPS",
+    "release": "cp package.json LICENSE.md README.md ./dist && cd dist && npm publish",
+    "preview": "vite preview",
+    "storybook": "storybook dev -p 6006",
+    "sync": "npm run build && anima-storybook sync",
+    "lint": "eslint -c .eslintrc.cjs './src/**/*.{ts,tsx}'",
+    "pretest:smoke": "npm run build:components && npm run build:propsOverview",
+    "test:smoke": "vitest --config vitest.smoke.config.ts",
+    "test:unit": "vitest",
+    "pretest:e2e": "npx playwright install --with-deps",
+    "pretest:e2e-ui": "npx playwright install --with-deps",
+    "test:e2e": "npx playwright test",
+    "test:e2e-ui": "npx playwright test --ui --project=chromium",
+    "test:a11y": "test-storybook",
+    "test:vrt": "npx playwright test --config=playwright.config.vrt.ts"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.23.2",
+    "@juggle/resize-observer": "^3.4.0",
+    "@playwright/test": "^1.39.0",
+    "@react-docgen/cli": "^2.0.3",
+    "@storybook/addon-a11y": "^8.0.6",
+    "@storybook/addon-actions": "^8.0.6",
+    "@storybook/addon-essentials": "^8.0.6",
+    "@storybook/addon-interactions": "^8.0.6",
+    "@storybook/addon-links": "^8.0.6",
+    "@storybook/blocks": "^8.0.6",
+    "@storybook/react": "^8.0.6",
+    "@storybook/react-vite": "^8.0.6",
+    "@storybook/test": "^8.0.6",
+    "@storybook/test-runner": "^0.17.0",
+    "@testing-library/jest-dom": "^6.1.4",
+    "@testing-library/react": "^14.0.0",
+    "@types/node": "^20.8.8",
+    "@types/react": "^18.2.31",
+    "@types/react-dom": "^18.2.14",
+    "@types/react-syntax-highlighter": "^15.5.11",
+    "@typescript-eslint/eslint-plugin": "^6.9.0",
+    "@typescript-eslint/parser": "^6.9.0",
+    "@vitejs/plugin-react": "^4.1.0",
+    "anima-storybook-cli": "^0.13.1",
+    "axe-playwright": "^1.2.3",
+    "babel-loader": "^9.1.3",
+    "change-case": "^5.1.2",
+    "classnames": "^2.3.2",
+    "concurrently": "^8.2.2",
+    "eslint": "^8.52.0",
+    "eslint-plugin-react": "^7.33.2",
+    "eslint-plugin-storybook": "^0.8.0",
+    "globby": "^13.2.2",
+    "http-server": "^14.1.1",
+    "jsdom": "^22.1.0",
+    "react": "^18.x",
+    "react-docgen": "^7.0.3",
+    "react-dom": "^18.x",
+    "react-intersection-observer": "^9.5.2",
+    "react-syntax-highlighter": "^15.5.0",
+    "sass": "^1.69.4",
+    "storybook": "^8.0.6",
+    "typescript": "^5.2.2",
+    "vite": "^4.5.0",
+    "vite-plugin-dts": "^3.6.1",
+    "vite-plugin-eslint": "^1.8.1",
+    "vite-plugin-lib-inject-css": "^1.3.0",
+    "vite-plugin-svgr": "^3.3.0",
+    "vitest": "^0.34.6"
+  },
+  "peerDependencies": {
+    "classnames": "^2.3.2",
+    "react": ">=17.0.0 <19.0.0",
+    "react-dom": ">=17.0.0 <19.0.0",
+    "react-intersection-observer": "^9.5.2",
+    "react-select": "^5.8.0"
+  }
+}

package/partials/copyAssets.js

@@ -0,0 +1,84 @@
+import fs from 'fs';
+import path from 'path';
+const NEXT_WITH_APP_ROUTER_MODE = 'nextWithAppRouter';
+
+const copyFile = (source, destination) => {
+  try {
+    fs.copyFileSync(source, destination);
+    console.log(`Copied asset ${path.basename(source)} to ${destination}`);
+  } catch (error) {
+    console.error(`Error copying ${path.basename(source)}: ${error}`);
+  }
+};
+
+const copyAssets = (copyDirectory, mode) => {
+  // Define the source and destination directories
+  const sourceDir = path.resolve(
+    'node_modules',
+    '@stihl-design-system',
+    'components',
+    'partials'
+  );
+  const destDir = path.resolve(
+    copyDirectory,
+    mode === NEXT_WITH_APP_ROUTER_MODE ? '' : 'public'
+  );
+
+  // Array of file names to copy
+  const filesToCopy = [
+    'apple-icon.png',
+    'favicon.ico',
+    'icon-192.png',
+    'icon-512.png',
+    'icon.svg',
+    mode === NEXT_WITH_APP_ROUTER_MODE
+      ? 'manifest.json'
+      : 'manifest.webmanifest',
+  ];
+
+  // Create the destination directory if it doesn't exist
+  if (!fs.existsSync(destDir)) {
+    fs.mkdirSync(destDir, { recursive: true });
+  }
+
+  console.log('\x1b[36m%s\x1b[0m', 'Copying Meta Icon Assets...');
+
+  // Copy each file
+  filesToCopy.forEach((file) => {
+    const sourceFile = path.join(sourceDir, file);
+    let fileName = file;
+    // adjustments for next with app router
+    if (mode === NEXT_WITH_APP_ROUTER_MODE) {
+      if (file === 'icon-192.png') {
+        fileName = 'icon2.png';
+      } else if (file === 'icon-512.png') {
+        fileName = 'icon1.png';
+      } else if (file === 'manifest.json') {
+        fileName = 'manifest.webmanifest';
+      }
+    }
+    const destFile = path.join(destDir, fileName);
+
+    if (fs.existsSync(sourceFile)) {
+      copyFile(sourceFile, destFile);
+      console.log(`Copied ${file} to ${destDir}`);
+    } else {
+      console.error(`Source file ${sourceFile} does not exist.`);
+    }
+  });
+  console.log('\x1b[32m%s\x1b[0m', 'SUCCESS - Copying Meta Icon Assets');
+};
+
+// Get the arguments
+const args = process.argv;
+// Extract directory argument
+const dirArg = args.find((arg) => arg.startsWith('--dir='));
+const copyDirectory = dirArg ? dirArg.replace('--dir=', '') : './';
+
+const modeArg = args.find((arg) => arg.startsWith('--mode='));
+const mode = modeArg ? modeArg.replace('--mode=', '') : undefined;
+try {
+  copyAssets(copyDirectory, mode);
+} catch (e) {
+  console.error('ERROR - Copying Meta Icon Assets:', error);
+}

package/partials/icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 500 500"><g clip-path="url(#a)"><path fill="#F37A1F" d="M512 0H0v512h512V0Z"/><path fill="#fff" d="m154.502 145.006-25.035 81.859c-11.126 36.45 9.14 63.364 45.048 63.364h117.226a7.613 7.613 0 0 1 6.007 3.271 7.625 7.625 0 0 1 .965 6.771l-6.322 20.592a15.536 15.536 0 0 1-13.077 10.042H95.076l-23.084 75.502H309.55c26.191 0 48.589-12.138 60.04-49.636l23.77-77.741c11.235-36.992-9.681-63.255-42.446-63.255H233.182c-6.502 0-9.103-4.769-7.225-10.549l6.286-20.591a15.53 15.53 0 0 1 15.353-12.174h169.462l23.084-75.501H215.12c-32.116 0-52.237 20.591-60.618 48.046Z"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h500v500H0z"/></clipPath></defs></svg>

package/partials/index.d.ts

@@ -0,0 +1,2 @@
+export * from './lib/partials';
+export type { Format } from './shared';