@itfin/components 1.3.21 → 1.3.23

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itfin/components",
-  "version": "1.3.21",
+  "version": "1.3.23",
   "author": "Vitalii Savchuk <esvit666@gmail.com>",
   "scripts": {
     "serve": "vue-cli-service serve",
@@ -41,12 +41,14 @@
     "@vue/composition-api": "^1.7.1",
     "air-datepicker": "^3.3.5",
     "bootstrap": "^5.3.x",
+    "bpmn-js": "^17.0.2",
     "core-js": "^3.7.0",
     "debug": "^4.2.0",
     "intersection-observer": "^0.12.2",
     "lodash": "^4.17.20",
     "luxon": "^3.3.0",
     "pdfjs-dist": "^2.10.377",
+    "storybook-dark-mode": "^3.0.3",
     "tippy.js": "^6.3.2",
     "vue-imask": "^6.6.3",
     "vue-property-decorator": "^9.1.2",

package/src/assets/scss/_dark-theme.scss

@@ -18,6 +18,7 @@ body[data-theme="dark"] {
     background-color: $dark-input-bg;
     border-color: $dark-input-bg;
     color: $dark-body-color;
+    box-shadow: 0 2px 10px rgba(255,255,255,.05);
 
     &:focus, &:active {
       background-color: #3d3d3d;

package/src/assets/scss/main.scss

@@ -28,6 +28,7 @@
 
 .form-control {
   min-height: 2.5rem;
+  box-shadow: 0 2px 10px rgba(0,0,0,.05);
 }
 
 .color-project-tnm {

package/src/components/dropdown/Dropdown.vue

@@ -33,11 +33,11 @@ class itfDropdown extends Vue {
   render (createElement, context) {
     const { props, slots, data } = context;
     const modalId = `dropdownId${globalModalIndex++}`;
-    const { buttonOptions, toggle, right, shadow, label, appendToBody } = props;
+    const { buttonOptions, toggle, text, right, shadow, label, appendToBody } = props;
     const { button, default: defaultSlot } = slots();
     let elements = [
       createElement(
-        itfButton,
+        text ? 'div' : itfButton,
         {
           props: buttonOptions || {},
           class: { 'dropdown-toggle': toggle },

package/src/components/dropdown/index.stories.js

@@ -51,11 +51,9 @@ storiesOf('Common', module)
             <itf-icon name="filter" />
           </template>
 
-          <ul class="dropdown-menu show" aria-labelledby="dropdownMenuOffset">
-            <li><a class="dropdown-item" href="#">Action</a></li>
-            <li><a class="dropdown-item" href="#">Another action</a></li>
-            <li><a class="dropdown-item" href="#">Something else here</a></li>
-          </ul>
+            <div><a class="dropdown-item" href="#">Action</a></div>
+            <div><a class="dropdown-item" href="#">Another action</a></div>
+            <div><a class="dropdown-item" href="#">Something else here</a></div>
         </itf-dropdown>
 
       </itf-app>

package/src/components/editor/Editor.vue

@@ -8,7 +8,7 @@
 }
 @font-face {
   font-family: "Cascadia";
-  src: url("https://unpkg.com/@excalidraw/excalidraw@undefined/dist/excalidraw-assets/Cascadia.woff2");
+  src: url("https://unpkg.com/@excalidraw/excalidraw@0.16.1/dist/excalidraw-assets/Cascadia.woff2");
 }
 .editor {
   &.readonly {
@@ -67,6 +67,7 @@ import AttachesTool from '@editorjs/attaches';
 import NestedList from '@editorjs/nested-list';
 import editorjsCodecup from './tools/highlightcode/codecup';
 import Drawing from './tools/drawing/drawing';
+import Bpmn from './tools/bpmn/bpmn';
 import cloneDeep from 'lodash/cloneDeep';
 
 export default @Component({
@@ -133,6 +134,10 @@ class itfEditor extends Vue {
           inlineToolbar: true,
           class: Drawing
         },
+        bpmn: {
+          inlineToolbar: true,
+          class: Bpmn
+        },
         // warning: Warning,
         table: {
           inlineToolbar: true,