@oicl/openbridge-webcomponents 0.0.4 → 0.0.6

package/CHANGELOG.md

@@ -0,0 +1,41 @@
+# Changelog
+
+## [0.1.0](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/compare/openbridge-webcomponents-v0.0.4...openbridge-webcomponents-v0.1.0) (2024-02-23)
+
+### Features
+
+- ack alarms in demo ([d377466](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/d377466ece783e707503286e2d8ea623bd9f9ec5))
+- add alertlist ([ad1283f](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/ad1283f08bd10490b3a67df54f23d637bd8499dd))
+- add breadcrumb and pixel perfect ([0d4bf6f](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/0d4bf6fcdac5c0a5a92d6240a9bbacc235c5b52c))
+- add checked button variant ([#25](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/issues/25)) ([ebee8ff](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/ebee8ffcaef3345f159449b3980a903d5b4bee40))
+- add react wrapper and demo ([#40](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/issues/40)) ([cd81b77](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/cd81b77cddb6fb9e10871e3c469e6b574f946591))
+- alert button ([986ffa7](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/986ffa74a629e6391041387a94e045f0b1f8ec7c))
+- alert menu ([65d50c8](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/65d50c864e40c8a9a3dcdc6b878ee1ba5d7ed6f9))
+- implemented alert logic and disabled buttons ([79e37c8](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/79e37c82205cafe45f64755e977b01628e50ee60))
+- link to alert list ([ffa44e7](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/ffa44e7a3fca777d0d2e171f6357d2591257880c))
+- multi color icons ([ab4bfa2](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/ab4bfa27034e5fc78a50b80fcab926dae01ba977))
+- notification button ([9039f16](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/9039f16b432a7950c6e939d63d85f0095ff9cc73))
+- notification message ([7fbc9b7](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/7fbc9b72764435a265c27d6bae2144e7509c2cda))
+- reactive brightness ([#31](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/issues/31)) ([be5a97e](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/be5a97e82857babfb5239117547d1d1c70b636bd))
+- settings topbar, corner icons, divider ([540188a](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/540188a7e59c5ec407673597f3a610ebc8e7b431))
+- slider buttons ([#37](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/issues/37)) ([69c3d24](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/69c3d24de7804507e058c7c46f9fc4842d3ffeb8))
+- snapshots ([a90d612](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/a90d6123edcad8bb2c962d5b0961d33b343b5a25))
+- tooltip ([e85318a](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/e85318a36cbe1b9a1e65fe93b1b7eecbaf707f63))
+
+### Bug Fixes
+
+- add images ([ec7917d](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/ec7917d8a54f9ce3cae39a8bc35ad3a35b6e55b0))
+- alert list not showing ([#32](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/issues/32)) ([ef282db](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/ef282db44684beda958f1d79b146329e329a5830))
+- app menu ([#15](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/issues/15)) ([3e31203](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/3e312037deb053b41e5d5c0ad2366870cb28064d))
+- build and update custom-elements ([c5f8d94](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/c5f8d94f9dfc2242b1757109abcc425fd9b07a2b))
+- cannot close dialogs ([cf8be0f](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/cf8be0f8cdd19279b04893fa785a96789a95141b))
+- change prefix from ob- to obc- ([1dd2bf0](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/1dd2bf06010971d9affa930717b368e32e161e26))
+- made alert message text clickable ([008fa50](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/008fa50394cf21af3142f23c1b9c690731509b1a))
+- made storybook run ([3f74d8e](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/3f74d8e41d6c4100b7b3a929019c6dbe75019a57))
+- minor ([#36](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/issues/36)) ([4143a96](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/4143a96e09e3caf79bfd1a2aa67d7b6a856424b0))
+- move search icon to the left ([#45](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/issues/45)) ([5be4143](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/5be4143dcb6e6e1a05714ee8b575d6b54cdf6477))
+- moved style mixin ([756c4a2](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/756c4a209d276a629a43f36214b947cf00c9c00c))
+- padding last button in toggle button ([#54](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/issues/54)) ([43ca15c](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/43ca15cee3488051cf95061d4e159061f8b63c22))
+- range ([#34](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/issues/34)) ([2dcb4be](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/2dcb4be665ea80c5febe451024d48b8d8156d3e5))
+- scrollbar after review ([14cb0e1](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/14cb0e19e20219ad75163397fa7b43b827cabcc4))
+- update icons ([7e0bf86](https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents/commit/7e0bf864b5be9476eac2022a0933581f07e77e5a))

package/README.md

@@ -0,0 +1,89 @@
+# Openbridge Web Components
+
+Welcome to the Openbridge Web Components! This readme file provides an overview of the project and its components.
+
+> **❗Caution❗** This repository is currently in early development and may not be stable. Please use with caution.
+
+## Table of Contents
+
+- [Storybook](#storybook)
+- [Demo](#demo)
+- [CSS file for palettes](#css-file-for-palettes)
+- [Installation](#installation)
+- [Contributing](#contributing)
+
+## Storybook
+
+[Storybook](https://storybook.js.org/) is a development environment for UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components in isolation.
+
+To access the Storybook for this project, click [here](https://openbridge-storybook.web.app).
+
+## Demo
+
+The demo showcases the project's functionality using Vue.js. It provides a live demonstration of the project's features and allows you to interact with the application.
+
+To access the demo, click [here](https://openbridge-demo.web.app/).
+
+## CSS file for palettes
+
+The CSS file for the palettes is located at [packages/openbridge-webcomponents/src/palettes/variables.css](packages/openbridge-webcomponents/src/palettes/variables.css) or by importing it directly from the package:
+
+```javascript
+import '@oicl/openbridge-webcomponents/src/palettes/variables.css';
+```
+
+The file is called `variables.css` and contains all the openbridge pallets (bright, day, dusk, night).
+It can be used to set the color theme of components.
+To select the pallet, set the `data-obc-theme` attribute on the `html` tag:
+
+```html
+<html lang="en" data-obc-theme="day"></html>
+```
+
+## Installation
+
+If you want to use the components in a Vue.js or React project we suggest that you use the wrapper packages [@oicl/openbridge-webcomponents-vue](https://www.npmjs.com/package/@oicl/openbridge-webcomponents-vue) or [@oicl/openbridge-webcomponents-react](https://www.npmjs.com/package/@oicl/openbridge-webcomponents-react) respectively.
+
+To use the components in your project, you can install the package from npm:
+
+```bash
+npm install @oicl/openbridge-webcomponents
+```
+
+### Setup
+
+1. Add the css file to your project:
+   ```javascript
+   import '@oicl/openbridge-webcomponents/src/palettes/variables.css';
+   ```
+2. Select the pallet by setting the `data-obc-theme` attribute on the `html` tag:
+   ```html
+   <html lang="en" data-obc-theme="day"></html>
+   ```
+3. Install the Noto Sans font by using the attached `NotoSans.tff` file. Add the following to your css:
+
+   ```css
+   @font-face {
+     font-family: 'Noto Sans';
+     src: url('path/to/NotoSans.tff');
+   }
+
+   * {
+     font-family: Noto Sans;
+   }
+   ```
+
+4. Import the desired components in your project, for instance:
+
+   ```javascript
+   import '@oicl/openbridge-webcomponents/dist/components/top-bar/top-bar.js';
+   ```
+
+5. Use the components in your project:
+   ```html
+   <obc-top-bar></obc-top-bar>
+   ```
+
+## Contributing
+
+Contributions are welcome!

package/custom-elements.json

@@ -103,6 +103,12 @@
       "declarations": [],
       "exports": []
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/navigation-instruments/types.ts",
+      "declarations": [],
+      "exports": []
+    },
     {
       "kind": "javascript-module",
       "path": "src/icons/icon-01-add.ts",
@@ -36853,12 +36859,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/navigation-instruments/types.ts",
-      "declarations": [],
-      "exports": []
-    },
     {
       "kind": "javascript-module",
       "path": "src/svghelpers/circle.ts",
@@ -38207,78 +38207,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/components/context-menu/context-menu.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "ObcContextMenu",
-          "members": [],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "obc-context-menu",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "ObcContextMenu",
-          "declaration": {
-            "name": "ObcContextMenu",
-            "module": "src/components/context-menu/context-menu.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "obc-context-menu",
-          "declaration": {
-            "name": "ObcContextMenu",
-            "module": "src/components/context-menu/context-menu.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/components/divider/divider.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "ObcDivider",
-          "members": [],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "obc-divider",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "ObcDivider",
-          "declaration": {
-            "name": "ObcDivider",
-            "module": "src/components/divider/divider.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "obc-divider",
-          "declaration": {
-            "name": "ObcDivider",
-            "module": "src/components/divider/divider.ts"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/components/icon-button/icon-button.ts",
@@ -38420,6 +38348,78 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/divider/divider.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "ObcDivider",
+          "members": [],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "obc-divider",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "ObcDivider",
+          "declaration": {
+            "name": "ObcDivider",
+            "module": "src/components/divider/divider.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "obc-divider",
+          "declaration": {
+            "name": "ObcDivider",
+            "module": "src/components/divider/divider.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/context-menu/context-menu.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "ObcContextMenu",
+          "members": [],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "obc-context-menu",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "ObcContextMenu",
+          "declaration": {
+            "name": "ObcContextMenu",
+            "module": "src/components/context-menu/context-menu.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "obc-context-menu",
+          "declaration": {
+            "name": "ObcContextMenu",
+            "module": "src/components/context-menu/context-menu.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/components/input/input.ts",

package/fix-generated.cjs

@@ -13,4 +13,44 @@ function fixIndexFiles() {
   });
 }
 
+function addRepositoryToPackageJsonVue() {
+  const packageJson = require('../openbridge-webcomponents-vue/package.json');
+  packageJson.repository = {
+    type: 'git',
+    url: 'git+https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents.git',
+    directory: 'packages/openbridge-webcomponents-vue',
+  };
+  fs.writeFileSync(
+    '../openbridge-webcomponents-vue/package.json',
+    JSON.stringify(packageJson, null, 2)
+  );
+}
+
+function addRepositoryToPackageJsonReact() {
+  const packageJson = require('../openbridge-webcomponents-react/package.json');
+  packageJson.repository = {
+    type: 'git',
+    url: 'git+https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents.git',
+    directory: 'packages/openbridge-webcomponents-react',
+  };
+  fs.writeFileSync(
+    '../openbridge-webcomponents-react/package.json',
+    JSON.stringify(packageJson, null, 2)
+  );
+}
+
+function fixFilePathInPackageJsonReact() {
+  const packageJson = require('../openbridge-webcomponents-react/package.json');
+  packageJson.files = packageJson.files.map((file) => {
+    return file.replace('dist/', '');
+  });
+  fs.writeFileSync(
+    '../openbridge-webcomponents-react/package.json',
+    JSON.stringify(packageJson, null, 2)
+  );
+}
+
 fixIndexFiles();
+addRepositoryToPackageJsonVue();
+addRepositoryToPackageJsonReact();
+fixFilePathInPackageJsonReact();

package/package.json

@@ -1,11 +1,17 @@
 {
   "name": "@oicl/openbridge-webcomponents",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "type": "module",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Ocean-Industries-Concept-Lab/openbridge-webcomponents.git",
+    "directory": "packages/openbridge-webcomponents"
+  },
   "scripts": {
     "build": "yarn run typecheck && yarn run build:ts && yarn run analyze && yarn run build:wrappers",
     "build:ts": "vite build",
     "build:ts:watch": "vite build --watch",
+    "build:wrappers": "lit labs gen --framework=vue --framework=react --out=.. && node fix-generated.cjs",
     "typecheck": "tsc --noEmit",
     "preview": "vite preview",
     "storybook": "storybook dev -p 6006",
@@ -22,7 +28,7 @@
     "lint:lit-analyzer": "lit-analyzer",
     "analyze": "cem analyze --litelement --globs \"src/**/*.ts\" --exclude \"src/**/*.stories.ts\"",
     "analyze:watch": "cem analyze --litelement --globs \"src/**/*.ts\" --exclude \"src/**/*.stories.ts\" --watch",
-    "build:wrappers": "lit labs gen --framework=vue --framework=react --out=.. && node fix-generated.cjs"
+    "release": "release-it"
   },
   "dependencies": {
     "lit": "^3.1.0"
@@ -68,7 +74,7 @@
     "vite-plugin-dts": "^3.6.3",
     "xmldom": "^0.6.0"
   },
-  "readme": "ERROR: No README data found!",
+  "readme": "README.md",
   "types": "./dist/index.d.ts",
   "customElements": "custom-elements.json"
 }

package/tsconfig.json

@@ -21,6 +21,7 @@
     "experimentalDecorators": true,
     "forceConsistentCasingInFileNames": true,
     "noImplicitOverride": true,
+    "skipLibCheck": true,
     "plugins": [
       {
         "name": "ts-lit-plugin",