pollination-react-io 0.0.31 → 0.0.34

package/build/atoms/Dropdown/Dropdown.d.ts

@@ -1,5 +1,6 @@
 import React, { FC } from 'react';
 import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
+import "./Dropdown.scss";
 export declare type Option = {
     type: 'checkbox' | 'radio' | 'button' | 'label' | 'link';
     id: string;

package/build/index.esm.js

@@ -4698,6 +4698,36 @@ var ConditionalWrapper = function (_a) {
     return condition ? wrapper(children) : children;
 };
 
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { return; }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var css_248z$5 = ":root {\n  --background: #FFFAEE;\n  --primary: #1890ff;\n  --primary2: #40a9ff;\n  --primary0: #e6f7ff;\n  --grey5: #8c8c8c;\n  --grey3: #d0d7de;\n  --secondary: #fff566;\n  --font-color: #494949;\n}\n\n@media (prefers-color-scheme: dark) {\n  :root {\n    --background: #3c3c3c;\n    --font-color: #fafafa;\n  }\n}\n@keyframes spin {\n  from {\n    transform: rotate(0);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n.spin {\n  animation: spin 1s linear 0s infinite;\n}\n\nspan.label {\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", Segoe UI Symbol, \"Noto Color Emoji\";\n  font-size: clamp(0.75rem, 8vw - 0.85rem, 0.95rem);\n  color: #11181C;\n}\n\nspan.label-secondary {\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", Segoe UI Symbol, \"Noto Color Emoji\";\n  font-size: clamp(0.65rem, 8vw - 0.75rem, 0.85rem);\n  color: #687075;\n}\n\n.poll-select-content {\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", Segoe UI Symbol, \"Noto Color Emoji\";\n  display: flex;\n  flex-direction: column;\n  width: fit-content;\n  background-color: white;\n  border: 1px solid var(--grey3);\n  border-radius: 4px;\n  padding: 6px 4px;\n  box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 4px;\n  gap: 2px;\n}\n\n.poll-select-item {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 6px;\n  border-radius: 2px;\n  padding: 2px 8px 2px 24px;\n  transition: background-color 0.15s linear, color 0.15s linear;\n}\n\n.poll-select-item[data-state=checked] {\n  background-color: var(--primary2);\n  color: white;\n}\n\n.poll-select-item:focus-visible {\n  outline: none;\n}\n\n.poll-select-item:hover {\n  background-color: var(--primary0);\n  cursor: pointer;\n  color: unset;\n}\n\n.poll-separator {\n  background-color: #d0d7de;\n  height: 1px;\n  width: 100%;\n  margin: 4px 0;\n}";
+styleInject(css_248z$5);
+
 var Dropdown = function (_a) {
     var optionGroups = _a.optionGroups, trigger = _a.trigger, contentProps = _a.contentProps, itemProps = _a.itemProps, _b = _a.arrow, arrow = _b === void 0 ? true : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c;
     var renderItem = useCallback(function (o) {
@@ -4756,33 +4786,6 @@ var Dropdown = function (_a) {
                 }, offset: 12 }))));
 };
 
-function styleInject(css, ref) {
-  if ( ref === void 0 ) ref = {};
-  var insertAt = ref.insertAt;
-
-  if (!css || typeof document === 'undefined') { return; }
-
-  var head = document.head || document.getElementsByTagName('head')[0];
-  var style = document.createElement('style');
-  style.type = 'text/css';
-
-  if (insertAt === 'top') {
-    if (head.firstChild) {
-      head.insertBefore(style, head.firstChild);
-    } else {
-      head.appendChild(style);
-    }
-  } else {
-    head.appendChild(style);
-  }
-
-  if (style.styleSheet) {
-    style.styleSheet.cssText = css;
-  } else {
-    style.appendChild(document.createTextNode(css));
-  }
-}
-
 var css_248z$4 = ":root {\n  --background: #FFFAEE;\n  --primary: #1890ff;\n  --primary2: #40a9ff;\n  --primary0: #e6f7ff;\n  --grey5: #8c8c8c;\n  --grey3: #d0d7de;\n  --secondary: #fff566;\n  --font-color: #494949;\n}\n\n@media (prefers-color-scheme: dark) {\n  :root {\n    --background: #3c3c3c;\n    --font-color: #fafafa;\n  }\n}\n@keyframes spin {\n  from {\n    transform: rotate(0);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n.spin {\n  animation: spin 1s linear 0s infinite;\n}\n\nspan.label {\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", Segoe UI Symbol, \"Noto Color Emoji\";\n  font-size: clamp(0.75rem, 8vw - 0.85rem, 0.95rem);\n  color: #11181C;\n}\n\nspan.label-secondary {\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", Segoe UI Symbol, \"Noto Color Emoji\";\n  font-size: clamp(0.65rem, 8vw - 0.75rem, 0.85rem);\n  color: #687075;\n}\n\n.btn-group {\n  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", Segoe UI Symbol, \"Noto Color Emoji\";\n  width: fit-content;\n  display: flex;\n  border-radius: 4px;\n}\n\n.btn-group:hover {\n  box-shadow: 0 1px 2px 0 rgba(26, 115, 232, 0.45), 0 1px 3px 1px rgba(26, 115, 232, 0.3);\n}\n\n.btn-group-disabled:hover {\n  box-shadow: none;\n}\n\n.btn-group button {\n  max-width: 260px;\n  display: flex;\n  background-color: var(--primary);\n  border: 1px solid var(--primary);\n  color: white;\n  padding: 6px 10px;\n  cursor: pointer;\n  float: left;\n  transition: background-color 0.125s ease-in-out;\n  z-index: 10;\n  align-items: center;\n  gap: 8px;\n}\n\n.btn-group-disabled button {\n  background-color: var(--grey3);\n  color: var(--grey5);\n  cursor: default;\n  border-color: var(--grey5);\n}\n\n.btn-group button:first-child {\n  border-top-left-radius: 4px;\n  border-bottom-left-radius: 4px;\n}\n\n.btn-group button:last-child {\n  border-top-right-radius: 4px;\n  border-bottom-right-radius: 4px;\n  border-left-color: #096dd9;\n}\n\n.btn-group button:last-child:disabled {\n  border-left-color: var(--grey5);\n}\n\n.btn-group button:not(:last-child) {\n  border-right: none;\n}\n\n.btn-group button:focus-visible {\n  outline: none;\n}\n\n.btn-group button:focus {\n  outline: none;\n}\n\n/* Clear floats (clearfix hack) */\n.btn-group:after {\n  content: \"\";\n  clear: both;\n  display: table;\n}\n\n.btn-group button:hover {\n  background-color: var(--primary2);\n  z-index: 11;\n}\n\n.btn-group-disabled:hover button:hover {\n  background-color: var(--grey3);\n}\n\n.options-content {\n  font-size: clamp(0.65rem, 8vw - 0.75rem, 0.85rem);\n}";
 styleInject(css_248z$4);
 
@@ -6619,10 +6622,10 @@ var css_248z$1 = "span.label {\n  font-family: -apple-system, BlinkMacSystemFont
 styleInject(css_248z$1);
 
 var FileInput = function (_a) {
-    var disabled = _a.disabled; _a.onChange;
+    var disabled = _a.disabled, onChange = _a.onChange;
     var onDrop = useCallback(function (acceptedFiles) {
-        console.log(acceptedFiles);
-    }, []);
+        onChange(acceptedFiles[0]);
+    }, [onChange]);
     var _b = useDropzone({
         onDrop: onDrop,
         accept: {
@@ -6684,13 +6687,14 @@ var GetModel = function (_a) {
         }
     }, [getHbjson, key, subscribe]);
     return (host === 'web' ?
-        React__default.createElement(FileInput, { onChange: function (event) {
-                if (event.target.files.length < 1)
+        React__default.createElement(FileInput, { onChange: function (file) {
+                if (!file)
                     return;
-                var file = event.target.files[0];
                 var fr = new FileReader();
+                fr.onabort = function () { return console.log('file reading was aborted'); };
+                fr.onerror = function () { return console.log('file reading has failed'); };
                 fr.onload = function (e) {
-                    setParentState(this.result);
+                    setParentState({ hbjson: this.result });
                 };
                 fr.readAsText(file);
             } })