@ebrains/react 0.6.0-alpha.0 → 0.8.0-alpha.0

package/eds-spinner.entry.esm.js

@@ -0,0 +1,67 @@
+import { r as registerInstance, h, H as Host } from './index.esm2.js';
+import 'react';
+import 'react/jsx-runtime';
+import 'react-dom';
+
+const edsSpinnerCss = ":host{display:block}.spinner{box-sizing:border-box;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}";
+const EdsSpinnerStyle0 = edsSpinnerCss;
+const EdsSpinner = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.size = '1rem';
+    this.thickness = '10px';
+    this.borderColor = 'var(--grey-400)';
+    this.bottomColor = 'var(--grey-900)';
+    this.background = 'var(--grey-200)';
+    this.fullscreen = false;
+  }
+  render() {
+    const spinnerStyle = Object.assign({
+      width: this.size,
+      height: this.size,
+      border: `${this.thickness} solid ${this.borderColor}`,
+      borderBottomColor: this.bottomColor
+    }, !this.fullscreen && {
+      display: 'inline-block'
+    });
+    // Overlay style: use fixed positioning for fullscreen,
+    // and absolute positioning for inline mode.
+    const overlayStyle = this.fullscreen ? {
+      position: 'fixed',
+      top: '0',
+      left: '0',
+      width: '100vw',
+      height: '100vh',
+      zIndex: '9999999',
+      backgroundColor: this.background,
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center'
+    } : {
+      position: 'absolute',
+      top: '0',
+      left: '0',
+      width: '100%',
+      height: '100%',
+      zIndex: '1000',
+      backgroundColor: this.background,
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center'
+    };
+    return h(Host, {
+      key: '49a825afb039ee46b26609eea60109e0a060c104'
+    }, h("div", {
+      key: '6445a4e7f1e7c553bdee660c42f1db0e011443f2',
+      class: "spinner-overlay",
+      style: overlayStyle
+    }, h("span", {
+      key: '07feeb7736e6d306e2b7baf5d253b2ce96bb2c9e',
+      class: "spinner",
+      style: spinnerStyle
+    })));
+  }
+};
+EdsSpinner.style = EdsSpinnerStyle0;
+
+export { EdsSpinner as eds_spinner };

package/eds-svg-repository.entry.esm.js

@@ -24,6 +24,9 @@ import { m as menu } from './menu-340ea948.esm.js';
 import { m as more } from './more-4449d549.esm.js';
 import { u as user } from './user-71ebdc15.esm.js';
 import { c as copy } from './copy-03b72cb6.esm.js';
+import { t as thumbsUp } from './thumbs-up-c19a71bc.esm.js';
+import { t as thumbsDown } from './thumbs-down-a18fd049.esm.js';
+import { s as star } from './star-0da9b5e9.esm.js';
 import 'react';
 import 'react/jsx-runtime';
 import 'react-dom';
@@ -277,8 +280,13 @@ const svgs = /*#__PURE__*/Object.freeze({
   search: search,
   success: success,
   warning: warning,
-  unknown: unknown
+  unknown: unknown,
+  thumbsUp: thumbsUp,
+  thumbsDown: thumbsDown,
+  star: star
 });
+const edsSvgRepositoryCss = ":host,.full-width{display:block;width:100%}";
+const EdsSvgRepositoryStyle0 = edsSvgRepositoryCss;
 const EdsSvgRepository = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -307,19 +315,22 @@ const EdsSvgRepository = class {
         format: 'bold'
       }
     };
-    return h("eds-table", {
-      key: 'a7d7fa426da72e174880a300202390c1016b74df',
-      data: JSON.stringify(svgData),
+    return h("div", {
+      key: '8b10e6b478c9a2354f4cf418dacb33d5629585ac',
+      class: "full-width"
+    }, h("eds-table", {
+      key: '04ea0a3bc8d72f42225290210aa0bda441e14b95',
+      "table-data": JSON.stringify(svgData),
       config: JSON.stringify(tableConfig),
       "rows-per-page": 10,
       "search-enabled": true,
-      "pagination-enabled": true,
-      "host-width": this.hostWidth
-    });
+      "pagination-enabled": true
+    }));
   }
   get hostEl() {
     return getElement(this);
   }
 };
+EdsSvgRepository.style = EdsSvgRepositoryStyle0;
 
 export { EdsSvgRepository as eds_svg_repository };

package/eds-switch.entry.esm.js

@@ -25,13 +25,13 @@ const EdsSwitch = class {
     // Compute an accessible name based on state.
     const accessibleLabel = this.labelOn || this.labelOff ? this.checked ? this.labelOn : this.labelOff : 'Toggle switch';
     return h("div", {
-      key: 'd4c727cbb562921b2bcba269e84f25c359c7061b',
+      key: 'd9e216919a58d90017b6fec249e7fc811c4fb681',
       class: "switch-container"
     }, this.labelOff && h("span", {
-      key: '90b18fff27bd21501466deb5879e5fe6ff607043',
+      key: '161bca12a4c6eebf4240ea0bdd07fd1acba35228',
       class: "switch-label switch-label--off"
     }, this.labelOff), h("button", {
-      key: '8675f5d9f972d3932710fa7f9b28f74f95a83003',
+      key: '855477e89765d01d5a52f3d9db279a1e5c56ea9d',
       type: "button",
       role: "switch",
       "aria-checked": this.checked ? 'true' : 'false',
@@ -45,10 +45,10 @@ const EdsSwitch = class {
       onClick: this.toggleSwitch,
       disabled: this.disabled
     }, h("span", {
-      key: '26aa30a01b10419c1665b1fd58b5696a02d1504a',
+      key: '4486e5f54ee75b95fd174291e1f5d67e181f3243',
       class: "switch-handle"
     })), this.labelOn && h("span", {
-      key: '3680d67555e9193a97e129c0639b411263e070a8',
+      key: '702e5385f6e941dcb67eecdd766725c4b04b8b7c',
       class: "switch-label switch-label--on"
     }, this.labelOn));
   }