vviinn-widgets 2.5.0 → 2.5.2

package/dist/collection/components/vviinn-vps-widget/vviinn-vps-widget.js

@@ -0,0 +1,352 @@
+import { Component, Host, h, State, Prop, Element, Watch, Listen, } from "@stencil/core";
+import { state } from "../../store/store";
+import { imageSearchState } from "../../store/imageSearch.store";
+import * as O from "fp-ts/lib/Option";
+import { slotChangeListener } from "../customized-slots";
+import { v4 as uuidv4 } from "uuid";
+import { createTrackingApi } from "../../openApi";
+import { createFilterEvent, createProductClickVpsEvent, createProductViewVpsEvent, createSearchEvent, createWidgetVpsEvent, } from "../../tracking";
+/**
+ * @prop --color-primary: color used for action button, slider bullets and selected detected object;
+ *
+ * @part close-button - close button on modal header.
+ * @part secondary-action - back button on modal header.
+ * @part title - modal window title.
+ *
+ * @part select-image_button
+ *
+ * @part product-card - product card.
+ * @part product-card_brand - product card brand.
+ * @part product-card_currency - currency sign. Renders after price-amount inside product card.
+ * @part product-card_deeplink - anchor element for title. Rendered only if "deeplink" property filled.
+ * @part product-card_image - product image inside product card.
+ * @part product-card_image-link - anchor element for image. Rendered only if "deeplink" property filled.
+ * @part product-card_price-amount - numeric part of price inside product card.
+ * @part product-card_price-container - block contains all prices inside product card.
+ * @part product-card_price-outdated - renders inside price-container when "sale-price" property filled. Contains regular price.
+ * @part product-card_price-prefix - renders before price-amount. Can be set with "price-prefix" property or inherited from parent component.
+ * @part product-card_price-regular - renders inside price-container when "sale-price" property is empty.
+ * @part product-card_price-sale - renders inside price-container when "sale-price" property filled. Contains sale price.
+ * @part product-card_title - product title
+ * @part example-images - example images block
+ */
+export class VviinnVpsWidget {
+  constructor() {
+    /** @internal */
+    this.apiPath = "https://api.vviinn.com";
+    /** When true modal window with widget will be shown */
+    this.active = false;
+    /** Currency sign will shown after price */
+    this.currencySign = "€";
+    /** Locale for currency formatting */
+    this.locale = "de-DE";
+    this.slidePosition = 0;
+    this.width = 0;
+    this.wrongImageFormat = false;
+    this.imageSource = null;
+  }
+  activeWatcher(value) {
+    if (value) {
+      this.overflow = document.body.style.overflow;
+      document.body.style.overflow = "hidden";
+      this.trackOpenEvent();
+    }
+    else {
+      document.body.style.overflow = this.overflow;
+    }
+  }
+  trackRecommendationView({ detail }) {
+    const recommendationViewEvent = createProductViewVpsEvent(Object.assign({ session_id: this.uiSessionId }, detail));
+    this.trackingApi.trackEvent(recommendationViewEvent);
+  }
+  trackRecommendationClick({ detail }) {
+    const recommendationClickEvent = createProductClickVpsEvent(Object.assign({ sessionId: this.uiSessionId }, detail));
+    this.trackingApi.trackEvent(recommendationClickEvent).finally(() => {
+      const product = imageSearchState.results.find((r) => r.productId === detail.product);
+      if (!product || !product.deeplink)
+        return;
+      window.location.href = product.deeplink;
+    });
+  }
+  trachSearchAreaChanges() {
+    const searchEvent = createSearchEvent({
+      session_id: this.uiSessionId,
+      source: this.imageSource,
+      search_area: "manual-selection",
+    });
+    this.trackingApi.trackEvent(searchEvent);
+  }
+  trackDetectedObject() {
+    const searchEvent = createSearchEvent({
+      session_id: this.uiSessionId,
+      source: this.imageSource,
+      search_area: "attention-point",
+    });
+    this.trackingApi.trackEvent(searchEvent);
+  }
+  trackFilter({ detail }) {
+    const searchEvent = createFilterEvent({
+      session_id: this.uiSessionId,
+      source: this.imageSource,
+      kind: "category",
+      action: detail,
+    });
+    this.trackingApi.trackEvent(searchEvent);
+  }
+  componentWillLoad() {
+    slotChangeListener(this, this.el);
+  }
+  connectedCallback() {
+    state.apiPath = this.apiPath;
+    state.currencySign = this.currencySign;
+    state.locale = this.locale;
+    imageSearchState.token = this.token;
+    this.uiSessionId = uuidv4();
+  }
+  trackOpenEvent() {
+    this.trackingApi = createTrackingApi(this.apiPath, this.token);
+    const widgetOpenEvent = createWidgetVpsEvent({
+      action: "open",
+      session_id: this.uiSessionId,
+    });
+    this.trackingApi.trackEvent(widgetOpenEvent);
+  }
+  handleImageSelection(source) {
+    this.imageSource = source;
+    this.slidePosition = 1;
+    const root = this.el.shadowRoot.querySelector("vviinn-overlayed-modal");
+    const overlay = root.shadowRoot.querySelector("vviinn-overlay");
+    const modal = overlay.querySelector("vviinn-modal");
+    const modalBody = modal.shadowRoot.querySelector(".body");
+    modalBody.scrollTop = 0;
+    this.trackInitialSearch();
+  }
+  trackInitialSearch() {
+    const searchEvent = createSearchEvent({
+      session_id: this.uiSessionId,
+      source: this.imageSource,
+      search_area: "full",
+    });
+    this.trackingApi.trackEvent(searchEvent);
+  }
+  resetState() {
+    this.resetScroll("onboarding-block");
+    this.slidePosition = 0;
+    imageSearchState.image = O.none;
+    imageSearchState.imageUrl = O.none;
+    imageSearchState.imageBounds = O.none;
+    imageSearchState.searchArea = O.none;
+    imageSearchState.results = [];
+    imageSearchState.filters = [];
+    imageSearchState.detectedObjects = [];
+    imageSearchState.activeIonLink = undefined;
+    imageSearchState.rectangleSearchForm = undefined;
+    this.resetScroll("results-block");
+  }
+  haveErrors() {
+    return this.wrongImageFormat || imageSearchState.serverError;
+  }
+  resetScroll(elementId, behavior = "auto") {
+    const element = this.el.shadowRoot.getElementById(elementId);
+    element.scroll({ top: 0, left: 0, behavior });
+  }
+  handleModalClose() {
+    this.active = false;
+    this.resetState();
+    const elementsToReset = ["onboarding-block", "results-block"];
+    elementsToReset.forEach((name) => this.resetScroll(name));
+    const widgetOpenEvent = createWidgetVpsEvent({
+      action: "close",
+      session_id: this.uiSessionId,
+    });
+    this.trackingApi.trackEvent(widgetOpenEvent);
+  }
+  render() {
+    return (h(Host, null,
+      h("vviinn-overlayed-modal", { class: { "first-screen": this.slidePosition === 0 }, active: this.active, onSecondaryActionClicked: () => this.resetState(), onModalClosed: () => this.handleModalClose(), exportparts: "secondary-action, title, close-button, example-images" },
+        h("vviinn-slider", { showBullets: false, position: this.slidePosition },
+          h("vviinn-slide", { class: { "start-page": true } },
+            h("div", { class: {
+                error: this.haveErrors(),
+                "start-page_block": true,
+              } },
+              h("vviinn-wrong-format", { class: { hidden: !this.wrongImageFormat }, onActionClick: () => (this.wrongImageFormat = false) }),
+              h("vviinn-server-error", { class: { hidden: !imageSearchState.serverError }, onActionClick: () => (imageSearchState.serverError = false) }),
+              h("vviinn-teaser", { class: { hidden: this.haveErrors() } }),
+              h("vviinn-image-selector", { class: { hidden: this.haveErrors() }, onImageSelected: () => this.handleImageSelection("upload"), onImageSelectedError: () => (this.wrongImageFormat = true), part: "select-image_button" },
+                h("span", { slot: "upload-button-text", class: "upload-button-content" },
+                  h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "29", height: "28", fill: "none" },
+                    h("defs", null),
+                    h("path", { fill: "#fff", "fill-rule": "evenodd", d: "M10.271 3.89A.875.875 0 0111 3.5h7c.293 0 .566.146.728.39l1.49 2.235h3.033a2.625 2.625 0 012.625 2.625V21a2.625 2.625 0 01-2.625 2.625H5.75A2.625 2.625 0 013.125 21V8.75A2.625 2.625 0 015.75 6.125h3.031l1.49-2.235zm1.197 1.36l-1.49 2.235a.875.875 0 01-.729.39H5.75a.875.875 0 00-.875.875V21a.875.875 0 00.875.875h17.5a.875.875 0 00.875-.875V8.75a.875.875 0 00-.875-.875h-3.5a.875.875 0 01-.729-.39l-1.49-2.235h-6.063z", "clip-rule": "evenodd" }),
+                    h("path", { fill: "#fff", "fill-rule": "evenodd", d: "M14.5 11.375a3.062 3.062 0 100 6.125 3.062 3.062 0 000-6.125zm-4.813 3.063a4.812 4.812 0 119.625 0 4.812 4.812 0 01-9.625 0z", "clip-rule": "evenodd" })),
+                  h("slot", { name: "vviinn-image-upload-button-text" },
+                    h("span", null, "Kamera oder Bild ausw\u00E4hlen")))),
+              h("vviinn-privacy-badge", { class: { hidden: this.haveErrors() } })),
+            h("div", { id: "onboarding-block", class: "start-page_block" },
+              h("div", { class: "onboarding-wrapper" },
+                h("vviinn-onboarding", null),
+                h("vviinn-example-images", { part: "example-images", onImageSelected: () => this.handleImageSelection("example"), onImageSelectedError: () => this.resetScroll("onboarding-block", "smooth") })))),
+          h("vviinn-slide", { class: { "results-page": true, active: this.slidePosition == 1 } },
+            h("div", { class: "image-wrapper" },
+              h("vviinn-image-view", null),
+              h("div", { class: "filters-wrapper" },
+                h("div", { class: "filters" }, imageSearchState.filters.map((filter) => (h("search-filters", { filter: filter })))))),
+            h("div", { id: "results-block", class: "products-wrapper" },
+              h("div", { class: {
+                  "nothing-found": true,
+                  hidden: imageSearchState.results.length > 0,
+                } },
+                h("vviinn-empty-results", null),
+                h("vviinn-onboarding", null)),
+              h("div", { class: {
+                  hidden: imageSearchState.results.length <= 0,
+                  products: true,
+                } }, imageSearchState.results.map((p, i) => {
+                var _a;
+                return (h("vviinn-product-card", { hidden: true, productTitle: p.title, productId: p.productId, brand: p.brand, deeplink: p.deeplink, price: p.price.actual, salePrice: p.price.sale, imageWidth: 160, image: (_a = p.image.thumbnail) !== null && _a !== void 0 ? _a : p.image.original, part: "product-card", index: i }));
+              }))))))));
+  }
+  static get is() { return "vviinn-vps-widget"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["vviinn-vps-widget.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["vviinn-vps-widget.css"]
+  }; }
+  static get properties() { return {
+    "token": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string | undefined",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "vviinn customer token"
+      },
+      "attribute": "token",
+      "reflect": false
+    },
+    "apiPath": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": undefined,
+            "name": "internal"
+          }],
+        "text": ""
+      },
+      "attribute": "api-path",
+      "reflect": false,
+      "defaultValue": "\"https://api.vviinn.com\""
+    },
+    "active": {
+      "type": "boolean",
+      "mutable": true,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "When true modal window with widget will be shown"
+      },
+      "attribute": "active",
+      "reflect": false,
+      "defaultValue": "false"
+    },
+    "currencySign": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Currency sign will shown after price"
+      },
+      "attribute": "currency-sign",
+      "reflect": false,
+      "defaultValue": "\"\u20AC\""
+    },
+    "locale": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Locale for currency formatting"
+      },
+      "attribute": "locale",
+      "reflect": false,
+      "defaultValue": "\"de-DE\""
+    }
+  }; }
+  static get states() { return {
+    "slidePosition": {},
+    "width": {},
+    "wrongImageFormat": {}
+  }; }
+  static get elementRef() { return "el"; }
+  static get watchers() { return [{
+      "propName": "active",
+      "methodName": "activeWatcher"
+    }]; }
+  static get listeners() { return [{
+      "name": "recommendationView",
+      "method": "trackRecommendationView",
+      "target": undefined,
+      "capture": false,
+      "passive": false
+    }, {
+      "name": "recommendationClick",
+      "method": "trackRecommendationClick",
+      "target": undefined,
+      "capture": false,
+      "passive": false
+    }, {
+      "name": "cropperChanged",
+      "method": "trachSearchAreaChanges",
+      "target": undefined,
+      "capture": false,
+      "passive": false
+    }, {
+      "name": "detectedObjectClicked",
+      "method": "trackDetectedObject",
+      "target": undefined,
+      "capture": false,
+      "passive": false
+    }, {
+      "name": "filterSelected",
+      "method": "trackFilter",
+      "target": undefined,
+      "capture": false,
+      "passive": false
+    }]; }
+}

package/dist/collection/cropper/Cropper.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/cropper/Handler.js

@@ -0,0 +1,61 @@
+import * as Point from "../geometry/Point";
+export var HandlerDirection;
+(function (HandlerDirection) {
+  HandlerDirection[HandlerDirection["East"] = 0] = "East";
+  HandlerDirection[HandlerDirection["North"] = 1] = "North";
+  HandlerDirection[HandlerDirection["NorthEast"] = 2] = "NorthEast";
+  HandlerDirection[HandlerDirection["NorthWest"] = 3] = "NorthWest";
+  HandlerDirection[HandlerDirection["South"] = 4] = "South";
+  HandlerDirection[HandlerDirection["SouthEast"] = 5] = "SouthEast";
+  HandlerDirection[HandlerDirection["SouthWest"] = 6] = "SouthWest";
+  HandlerDirection[HandlerDirection["West"] = 7] = "West";
+})(HandlerDirection || (HandlerDirection = {}));
+export const getCursorValue = (direction) => {
+  switch (direction) {
+    case HandlerDirection.East:
+      return "e-resize";
+    case HandlerDirection.North:
+      return "n-resize";
+    case HandlerDirection.NorthEast:
+      return "ne-resize";
+    case HandlerDirection.NorthWest:
+      return "nw-resize";
+    case HandlerDirection.South:
+      return "s-resize";
+    case HandlerDirection.SouthEast:
+      return "se-resize";
+    case HandlerDirection.SouthWest:
+      return "sw-resize";
+    case HandlerDirection.West:
+      return "w-resize";
+    default:
+      return "pointer";
+  }
+};
+export const fromRectangle = (r) => [
+  {
+    position: Point.fromRectangle(r),
+    direction: HandlerDirection.NorthWest,
+  },
+  {
+    position: Point.pointSumSemigroup.concat(Point.fromRectangle(r), {
+      x: r.width,
+      y: 0,
+    }),
+    direction: HandlerDirection.NorthEast,
+  },
+  {
+    position: Point.pointSumSemigroup.concat(Point.fromRectangle(r), {
+      x: 0,
+      y: r.height,
+    }),
+    direction: HandlerDirection.SouthWest,
+  },
+  {
+    position: Point.pointSumSemigroup.concat(Point.fromRectangle(r), {
+      x: r.width,
+      y: r.height,
+    }),
+    direction: HandlerDirection.SouthEast,
+  },
+];

package/dist/collection/dom/index.js

@@ -0,0 +1,3 @@
+export const findTarget = (ev) => {
+  return ev.target;
+};

package/dist/collection/error.js

@@ -0,0 +1,14 @@
+export const basicErrorFromResponse = (error) => {
+  return {
+    kind: "server",
+    inner: error,
+  };
+};
+export const invalidTokenError = {
+  kind: "client",
+  inner: "Token not exist or empty",
+};
+export const emptyApiPathError = {
+  kind: "client",
+  inner: "Api path empty or missing",
+};

package/dist/collection/file/index.js

@@ -0,0 +1,4 @@
+export const fileDoesntExistError = {
+  kind: "app",
+  inner: "File doesnt exist",
+};

package/dist/collection/geometry/Clip.js

@@ -0,0 +1,14 @@
+const fromRectangle = (shape, target) => {
+  const top = `${shape.y}px`;
+  const left = `${shape.x}px`;
+  const right = `${target.width - (shape.x + shape.width)}px`;
+  const bottom = `${target.height - (shape.y + shape.height)}px`;
+  return {
+    top,
+    right,
+    bottom,
+    left,
+  };
+};
+const printClip = (clip) => `inset(${clip.top} ${clip.right} ${clip.bottom} ${clip.left})`;
+export const getClipValue = (shape, target) => printClip(fromRectangle(shape, target));

package/dist/collection/geometry/Point.js

@@ -0,0 +1,32 @@
+import { semigroupSum, semigroupProduct, struct } from "fp-ts/Semigroup";
+import { semigroupDiff } from "../utils/semigroup/semigroupDiff";
+export const fromRectangle = ({ x, y }) => {
+  return {
+    x,
+    y,
+  };
+};
+export const fromMouseEvent = ({ clientX, clientY }) => {
+  return {
+    x: clientX,
+    y: clientY,
+  };
+};
+export const fromTouchEvent = ({ touches }) => {
+  return {
+    x: touches[0].clientX,
+    y: touches[0].clientY,
+  };
+};
+export const pointDiffSemigroup = struct({
+  x: semigroupDiff,
+  y: semigroupDiff,
+});
+export const pointSumSemigroup = struct({
+  x: semigroupSum,
+  y: semigroupSum,
+});
+export const pointProductSemigroup = struct({
+  x: semigroupProduct,
+  y: semigroupProduct,
+});

package/dist/collection/geometry/Rectangle.js

@@ -0,0 +1,95 @@
+import { fromRectangle, pointSumSemigroup, pointProductSemigroup, } from "./Point";
+import { HandlerDirection } from "../cropper/Handler";
+import { sizedDivSemigroup } from "./Sized";
+export const move = (origin, position) => {
+  const originPosition = fromRectangle(origin);
+  const newPosition = pointSumSemigroup.concat(originPosition, position);
+  return Object.assign(Object.assign({}, newPosition), { width: origin.width, height: origin.height });
+};
+const transformNorthEast = (origin, handler) => {
+  const newPosition = pointSumSemigroup.concat(fromRectangle(origin), {
+    x: 0,
+    y: handler.position.y,
+  });
+  return Object.assign(Object.assign({}, newPosition), { width: origin.width + handler.position.x, height: origin.height - handler.position.y });
+};
+export const transformNorthWest = (origin, handler) => {
+  const newPosition = pointSumSemigroup.concat(fromRectangle(origin), handler.position);
+  return Object.assign(Object.assign({}, newPosition), { width: origin.width - handler.position.x, height: origin.height - handler.position.y });
+};
+const transformSouthEast = (origin, handler) => {
+  return Object.assign(Object.assign({}, origin), { width: origin.width + handler.position.x, height: origin.height + handler.position.y });
+};
+const transformSouthWest = (origin, handler) => {
+  const newPosition = pointSumSemigroup.concat(fromRectangle(origin), {
+    x: handler.position.x,
+    y: 0,
+  });
+  return Object.assign(Object.assign({}, newPosition), { width: origin.width - handler.position.x, height: origin.height + handler.position.y });
+};
+export const transform = (origin, handler) => {
+  switch (handler.direction) {
+    case HandlerDirection.NorthEast:
+      return transformNorthEast(origin, handler);
+    case HandlerDirection.NorthWest:
+      return transformNorthWest(origin, handler);
+    case HandlerDirection.SouthEast:
+      return transformSouthEast(origin, handler);
+    case HandlerDirection.SouthWest:
+      return transformSouthWest(origin, handler);
+  }
+};
+export const fromImage = (image) => {
+  return {
+    x: 0,
+    y: 0,
+    width: image.width,
+    height: image.height,
+  };
+};
+export const fromNaturalImage = (image) => {
+  return {
+    x: 0,
+    y: 0,
+    width: image.naturalWidth,
+    height: image.naturalHeight,
+  };
+};
+export const getScaleRange = (source, target) => {
+  const difference = sizedDivSemigroup.concat(target, source);
+  return {
+    x: difference.width,
+    y: difference.height,
+  };
+};
+export const scaleSelection = (source, sourceSelection, target) => {
+  const sourcePosition = fromRectangle(source);
+  const scale = getScaleRange(source, target);
+  const newPosition = pointProductSemigroup.concat(sourcePosition, scale);
+  return Object.assign(Object.assign({}, newPosition), { width: sourceSelection.width * scale.x, height: sourceSelection.height * scale.y });
+};
+export const fromAlt = (r) => {
+  return Object.assign({ x: r.left, y: r.top }, r);
+};
+export const scaleWithSized = (s) => (r) => {
+  return {
+    x: r.x * s.width,
+    y: r.y * s.height,
+    width: r.width * s.width,
+    height: r.height * s.height,
+  };
+};
+export const divideOnSized = (s) => (r) => {
+  return {
+    x: r.x / s.width,
+    y: r.y / s.height,
+    width: r.width / s.width,
+    height: r.height / s.height,
+  };
+};
+export const center = (r) => {
+  return {
+    x: r.x + r.width * 0.5,
+    y: r.y + r.height * 0.5,
+  };
+};

package/dist/collection/geometry/RectangleAlt.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/geometry/Sized.js

@@ -0,0 +1,8 @@
+import { semigroupDiv } from "../utils/semigroup/semigroupDiff";
+import { getStructSemigroup } from "fp-ts/Semigroup";
+import * as Ord from "fp-ts/Ord";
+export const sizedDivSemigroup = getStructSemigroup({
+  width: semigroupDiv,
+  height: semigroupDiv,
+});
+export const ordSized = Ord.contramap((s) => s.width * s.height)(Ord.ordNumber);

package/dist/collection/global.js

@@ -0,0 +1,19 @@
+import * as Sentry from "@sentry/browser";
+import { Env } from "@stencil/core";
+import { filterInternalExeptions } from "./sentry";
+const setupSentry = () => {
+  Sentry.init({
+    dsn: "https://70bcf561598b44148bd3cabc7c142a6c@o1015876.ingest.sentry.io/5983034",
+    release: `${Env.packageName}@${Env.packageVersion}`,
+    environment: Env.environment,
+    tracesSampleRate: 0.0,
+    maxBreadcrumbs: 4,
+    beforeSend: filterInternalExeptions,
+    allowUrls: [
+      /https?:\/\/cdn\.jsdelivr\.net\/npm\/vviinn-widgets.+/
+    ]
+  });
+};
+export default function () {
+  setupSentry();
+}

package/dist/collection/index.js

@@ -0,0 +1 @@
+export * from './components';

package/dist/collection/interfaces/generated.js

@@ -0,0 +1,5 @@
+/**
+ * This file was auto-generated by openapi-typescript.
+ * Do not make direct changes to the file.
+ */
+export {};

package/dist/collection/interfaces/recommendation.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/network/apiClient.js

@@ -0,0 +1,9 @@
+import * as E from "fp-ts/Either";
+import * as TE from "fp-ts/TaskEither";
+import { pipe } from "fp-ts/function";
+import { sequenceT } from "fp-ts/Apply";
+import { createInitGetRequest, createInitPostRequest, getApiPath, } from "./utils";
+import { makeRequest } from "./request";
+const sequenceToEither = sequenceT(E.Apply);
+export const apiGet = (path, data = {}) => pipe(sequenceToEither(getApiPath(), createInitGetRequest), TE.fromEither, TE.chainW(makeRequest(path, data)));
+export const apiPost = (path, data = {}) => pipe(sequenceToEither(getApiPath(), createInitPostRequest), TE.fromEither, TE.chainW(makeRequest(path, data)));

package/dist/collection/network/ion/File.js

@@ -0,0 +1,14 @@
+export const fileToB64 = async (f) => new Promise((resolve) => {
+  const reader = new FileReader();
+  reader.addEventListener("load", () => {
+    resolve(reader.result);
+  });
+  reader.readAsDataURL(f);
+});
+export const fromFile = async (f) => {
+  return {
+    name: f.name,
+    mediaType: f.type,
+    value: await fileToB64(f),
+  };
+};