@uh-design-system/component-library 0.0.1-alpha.9

package/dist/utils/utils.js

@@ -0,0 +1,4 @@
+export function format(first, middle, last) {
+    return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');
+}
+//# sourceMappingURL=utils.js.map

package/dist/utils/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/utils/utils.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,MAAM,CAAC,KAAc,EAAE,MAAe,EAAE,IAAa;IACnE,OAAO,CAAC,KAAK,IAAI,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;AACjF,CAAC","sourcesContent":["export function format(first?: string, middle?: string, last?: string): string {\n  return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');\n}\n"]}

package/docs/DEPLOYMENT.md

@@ -0,0 +1,53 @@
+# University of Helsinki Design System Component Library
+
+## Deployment
+
+### CI worker
+
+Atm. there is project specific Gitlab CI/CD runner in use. It is running as a Docker container. The runner is registered
+to Gitlab manually on opa-worker-2.it.helsinki.fi server with the following command:
+
+```bash
+docker exec -t uhds-gitlab-runner gitlab-runner register --non-interactive --executor docker \
+  --docker-image docker:stable --url https://version.helsinki.fi/ --token TOKEN --name uhds-runner --docker-privileged \
+  --docker-disable-cache=false --docker-volumes=/var/run/docker.sock:/var/run/docker.sock --docker-volumes=/builds:/builds
+```
+
+### Storybook
+
+There is two servers in use. Official names are:
+-
+- designsystem-qa-24.it.helsinki.fi
+- designsystem-prod-24.it.helsinki.fi
+
+Design system was later decided to be published through 3rd party server, which will use domain name designsystem.helsinki.fi.
+
+These servers are used for static Storybook site in the following addresses:
+- https://storybook.it.helsinki.fi
+- https://storybook-qa.it.helsinki.fi
+
+Servers are provisioned using Ansible. At this point it means installing Nginx and configuring it. User with username
+deployer with correct permissions to `/var/www/html` dir has been created manually to the servers with following commands as root user:
+
+```bash
+adduser deployer
+usermod -aG hysudo deployer
+echo "deployer ALL=(ALL) NOPASSWD:ALL" | sudo tee /etc/sudoers.d/deployer
+mkdir -p /home/deployer/.ssh
+chmod 700 /home/deployer/.ssh
+echo "[deployer public key]" > /home/deployer/.ssh/authorized_keys
+chmod 600 /home/deployer/.ssh/authorized_keys
+chown -R deployer:deployer /home/deployer/.ssh
+```
+
+deployer user's private key has been added to Gitlab as a file variable to be used for authentication in Gitlab CI/CD pipeline.
+
+There is manual provision jobs in Gitlab CI/CD pipeline for both QA and production servers for setting up Nginx.
+
+There is also automatic deployment job for Storybook site in Gitlab CI/CD pipeline. It uses `rsync` to copy files to the server.
+
+Pushes to production branch will trigger automatic deployment to production server. Pushes to other branches will trigger automatic deployment to QA server.
+
+Url to the other branches are in the form of `https://storybook-qa.it.helsinki.fi/[branch-name-slug]`. URL to the deployment is shown in the pipeline job log.
+
+When the branch is deleted, the deployment job will remove the branch from the server except for the `main` and `production` branch.

package/docs/DEVELOPMENT.md

@@ -0,0 +1,52 @@
+# University of Helsinki Design System Component Library
+
+## Development Guide
+
+This guide will help you set up the development environment for the University of Helsinki Design System Component Library.
+
+### Cloning the Repository
+
+First, clone the repository to your local machine:
+
+```sh
+git clone git@version.helsinki.fi:uh-design-system/component-library.git
+cd component-library
+```
+
+### Installing Dependencies
+
+Install the necessary dependencies using npm:
+
+```sh
+npm install
+```
+
+### Building Components
+
+To build the components, run the following command:
+
+```sh
+npm run build
+```
+
+This will compile the components and output them to the `dist` directory.
+
+### Running Storybook
+
+To run Storybook for developing and testing components, use the following command:
+
+```sh
+npm run develop
+```
+
+This will start Storybook and watch for any changes in the components.
+
+### Running Static Storybook
+To build and serve a static version of Storybook, use the following commands:
+
+```sh
+npm run build-storybook-static
+npx http-server storybook-static
+```
+
+This will build the static Storybook files and serve them using a simple HTTP server.

package/docs/PUBLISHING.md

@@ -0,0 +1,33 @@
+# University of Helsinki Design System Component Library
+
+## Publishing Components
+
+This document provides instructions on how to publish components in the University of Helsinki Design System Component Library using Lerna.
+
+### Prerequisites
+
+- Ensure that Lerna is installed globally.
+
+```sh
+npm install -g lerna
+```
+
+### Steps to Publish
+
+1. **Build the components**: Ensure that all components are built and ready for publishing.
+
+```sh
+npm run build
+```
+
+2. **Publish with Lerna**: Use Lerna to publish the components. Lerna will handle versioning and pushing commits to GitLab.
+
+```sh
+npx lerna publish
+```
+
+### Notes
+
+- Ensure that you have the necessary permissions to publish the package.
+- Follow the organization's guidelines for versioning and releasing components.
+- Lerna will automatically update the version number and push the commit to GitLab.

package/docs/TESTING.md

@@ -0,0 +1,24 @@
+# University of Helsinki Design System Component Library
+
+## Testing
+
+[Storybook test runner](https://storybook.js.org/docs/writing-tests/test-runner) is used to run automatic tests in the repository. The types of tests include
+- Visual testing using [jest-image-snapshot](https://github.com/americanexpress/jest-image-snapshot)
+- Interaction testing using storybook test runner
+- Accessibility tests using [axe-playwright](https://github.com/abhinaba-ghosh/axe-playwright)
+
+Tests can be ran with command `npm run test-storybook`.
+
+Visual tests can be updated with `npm run test-storybook:update`.
+
+### Compatibility issues
+
+Different browsers and operating systems might render web content differently, so there's a possibility that visual tests
+results in different outcomes locally and when ran in CI.
+
+For this reason, there's also scripts to run tests and updating test snapshots using [docker](https://www.docker.com/).
+This uses the same image as what is used in CI, so it should match the environment used in CI.
+
+Tests using docker can be ran with command `npm run test-storybook:docker`.
+
+Visual tests can be updated with docker with the command `npm run test-storybook:update:docker`.

package/loader/cdn.js

@@ -0,0 +1 @@
+module.exports = require('../dist/cjs/loader.cjs.js');

package/loader/index.cjs.js

@@ -0,0 +1 @@
+module.exports = require('../dist/cjs/loader.cjs.js');

package/loader/index.d.ts

@@ -0,0 +1,24 @@
+export * from '../dist/types/components';
+export interface CustomElementsDefineOptions {
+  exclude?: string[];
+  resourcesUrl?: string;
+  syncQueue?: boolean;
+  jmp?: (c: Function) => any;
+  raf?: (c: FrameRequestCallback) => number;
+  ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+}
+export declare function defineCustomElements(win?: Window, opts?: CustomElementsDefineOptions): void;
+/**
+ * @deprecated
+ */
+export declare function applyPolyfills(): Promise<void>;
+
+/**
+ * Used to specify a nonce value that corresponds with an application's CSP.
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a meta tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) which
+ * will result in the same behavior.
+ */
+export declare function setNonce(nonce: string): void;

package/loader/index.es2017.js

@@ -0,0 +1 @@
+export * from '../dist/esm/loader.js';

package/loader/index.js

@@ -0,0 +1,2 @@
+(function(){if("undefined"!==typeof window&&void 0!==window.Reflect&&void 0!==window.customElements){var a=HTMLElement;window.HTMLElement=function(){return Reflect.construct(a,[],this.constructor)};HTMLElement.prototype=a.prototype;HTMLElement.prototype.constructor=HTMLElement;Object.setPrototypeOf(HTMLElement,a)}})();
+export * from '../dist/esm/loader.js';

package/loader/package.json

@@ -0,0 +1,11 @@
+{
+  "name": "component-library-loader",
+  "private": true,
+  "typings": "./index.d.ts",
+  "module": "./index.js",
+  "main": "./index.cjs.js",
+  "jsnext:main": "./index.es2017.js",
+  "es2015": "./index.es2017.js",
+  "es2017": "./index.es2017.js",
+  "unpkg": "./cdn.js"
+}

package/package.json

@@ -0,0 +1,96 @@
+{
+  "name": "@uh-design-system/component-library",
+  "version": "0.0.1-alpha.9",
+  "publishConfig": {
+    "access": "public"
+  },
+  "description": "University of Helsinki Design System Component Library",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.js",
+  "types": "dist/types/index.d.ts",
+  "collection": "dist/collection/collection-manifest.json",
+  "collection:main": "dist/collection/index.js",
+  "unpkg": "dist/uh-component-library/uh-component-library.esm.js",
+  "exports": {
+    ".": {
+      "import": "./dist/uh-component-library/uh-component-library.esm.js",
+      "require": "./dist/uh-component-library/uh-component-library.cjs.js"
+    },
+    "./my-component": {
+      "import": "./dist/components/my-component.js",
+      "types": "./dist/components/my-component.d.ts"
+    },
+    "./loader": {
+      "types": "./loader/index.d.ts",
+      "import": "./loader/index.js",
+      "require": "./loader/index.cjs"
+    }
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://version.helsinki.fi/uh-design-system/component-library.git"
+  },
+  "files": [
+    "dist/",
+    "loader/",
+    "react-wrapper/",
+    "docs/"
+  ],
+  "scripts": {
+    "build": "stencil build",
+    "build.watch": "stencil build --watch",
+    "develop": "concurrently \"npm:build.watch\" \"npm:storybook\"",
+    "start": "stencil build --dev --watch --serve",
+    "test-storybook": "test-storybook",
+    "test-storybook:update": "test-storybook -u",
+    "test-storybook:docker": "./scripts/run-tests-in-docker.sh",
+    "test-storybook:update:docker": "./scripts/run-tests-in-docker.sh -u",
+    "test": "stencil test --spec --e2e",
+    "test.watch": "stencil test --spec --e2e --watchAll",
+    "generate": "stencil generate",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook-static": "storybook build",
+    "build-storybook": "concurrently \"npm:build\" \"npm:storybook build\""
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^3.2.2",
+    "@material-symbols/svg-500": "^0.26.0",
+    "@stencil/core": "^4.22.2",
+    "@stencil/react-output-target": "^0.7.4",
+    "@storybook/addon-a11y": "^8.4.5",
+    "@storybook/addon-essentials": "^8.4.5",
+    "@storybook/addon-interactions": "^8.4.5",
+    "@storybook/addon-links": "^8.4.5",
+    "@storybook/addon-styling-webpack": "^1.0.1",
+    "@storybook/addon-webpack5-compiler-swc": "^1.0.5",
+    "@storybook/blocks": "^8.4.5",
+    "@storybook/manager-api": "^8.4.5",
+    "@storybook/test": "^8.4.5",
+    "@storybook/test-runner": "^0.19.1",
+    "@storybook/theming": "^8.4.5",
+    "@storybook/web-components": "^8.4.5",
+    "@storybook/web-components-webpack5": "^8.4.5",
+    "@types/jest": "^29.5.14",
+    "@types/node": "^16.18.119",
+    "axe-playwright": "^2.0.3",
+    "concurrently": "^9.1.0",
+    "css-loader": "^7.1.2",
+    "jest": "^29.7.0",
+    "jest-cli": "^29.7.0",
+    "jest-image-snapshot": "^6.4.0",
+    "lerna": "^8.1.9",
+    "lit": "^3.2.1",
+    "sass": "^1.81.0",
+    "sass-loader": "^16.0.3",
+    "stencil-inline-svg": "^1.1.0",
+    "storybook": "^8.4.5",
+    "storybook-dark-mode": "^4.0.2",
+    "style-loader": "^4.0.0"
+  },
+  "overrides": {
+    "rimraf": "^4.0.0",
+    "glob": "^9.0.0"
+  },
+  "license": "MIT",
+  "gitHead": "39df3fcff4ea2a3def7b423175b28255836042ec"
+}