smoothly 0.1.113 → 0.1.116

package/dist/esm/smoothly-dialog-demo.entry.js

@@ -1,12 +0,0 @@
-import { r as registerInstance, h } from './index-02a70ac1.js';
-
-let SmoothlyDialogDemo = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-  }
-  render() {
-    return (h("smoothly-dialog", { color: "default", style: { "margin-top": "6vh" }, closable: true }, h("smoothly-frame", { url: "https://www.wikipedia.org/", name: "parent", style: { height: "80vh" } })));
-  }
-};
-
-export { SmoothlyDialogDemo as smoothly_dialog_demo };

package/dist/esm/smoothly-dialog.entry.js

@@ -1,34 +0,0 @@
-import { r as registerInstance, h, k as Host } from './index-02a70ac1.js';
-import { T as Trigger } from './index-c8b5d468.js';
-import './GoogleFont-8474516b.js';
-
-const styleCss = ".sc-smoothly-dialog-h{display:block;position:fixed;left:0;top:0;width:100%;height:100%;z-index:1;background:rgba(var(--smoothly-default-color), var(--smoothly-semitransparent)) !important}[hidden].sc-smoothly-dialog-h{display:none}.sc-smoothly-dialog-h>header.sc-smoothly-dialog{border-top-left-radius:8px;border-top-right-radius:8px;margin-top:2em;color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color));border-color:rgb(var(--smoothly-primary-color))}.sc-smoothly-dialog-h:not([header]) header.sc-smoothly-dialog{border:none}.sc-smoothly-dialog-h>*.sc-smoothly-dialog{position:relative;color:rgb(var(--smoothly-default-contrast));background-color:rgb(var(--smoothly-default-color));border-color:rgb(var(--smoothly-color));border-width:1px;border-style:solid;max-width:40em;width:calc(100vw - 4em - 2px);max-height:calc(100vh - 6em - 2px);height:auto;margin-left:auto;margin-right:auto;border-collapse:collapse}.sc-smoothly-dialog-h>main.sc-smoothly-dialog{border-bottom-left-radius:8px;border-bottom-right-radius:8px;margin-bottom:2em;border:1px solid rgb(var(--smoothly-default-contrast));box-sizing:border-box;overflow:hidden}.sc-smoothly-dialog-h:not([header]) main.sc-smoothly-dialog{border-radius:8px}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog{position:absolute;right:-2em;top:-2em;z-index:1;border-color:transparent}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog:hover{border-color:transparent}.sc-smoothly-dialog-h smoothly-icon.sc-smoothly-dialog{background-color:rgb(var(--smoothly-color));border-radius:50%}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>*.sc-smoothly-dialog{margin:10px}";
-
-let SmoothlyDialog = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.open = true;
-    this.closable = false;
-  }
-  TriggerListener(event) {
-    if (Trigger.is(event.detail) && event.detail.name == "close")
-      this.open = false;
-  }
-  hostData() {
-    return {
-      style: {
-        display: this.open ? "block" : "none",
-      },
-    };
-  }
-  __stencil_render() {
-    return [
-      h("header", null, this.closable ? (h("smoothly-trigger", { fill: "clear", name: "close" }, h("smoothly-icon", { name: "close-circle", fill: "solid", color: this.color }))) : ([]), this.header ? h("h1", null, this.header) : h("slot", { name: "header" })),
-      h("main", null, h("slot", null)),
-    ];
-  }
-  render() { return h(Host, this.hostData(), this.__stencil_render()); }
-};
-SmoothlyDialog.style = styleCss;
-
-export { SmoothlyDialog as smoothly_dialog };

package/dist/esm/smoothly-display-amount.entry.js

@@ -1,55 +0,0 @@
-import { r as registerInstance } from './index-02a70ac1.js';
-import { d as dist } from './index-a5a08f46.js';
-import './_commonjsHelpers-8fe71198.js';
-
-const styleCss = ".sc-smoothly-display-amount-h{display:block}[hidden].sc-smoothly-display-amount-h{display:none}";
-
-let SmoothlyDisplayAmount = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-  }
-  format(amount) {
-    const digitsPerGroup = 3;
-    const defaultDecimals = 2;
-    const maxDecimals = (dist.Currency.decimalDigits(this.currency) ? dist.Currency.decimalDigits(this.currency) : defaultDecimals);
-    let beforeSeparator = amount.length;
-    let separator;
-    let result = amount;
-    if (result == "")
-      result = "0";
-    if (amount.includes(".")) {
-      separator = amount.indexOf(".");
-      if (separator == 0) {
-        result = "0" + result;
-        separator++;
-      }
-      beforeSeparator = separator;
-      result = result.padEnd(separator + maxDecimals + 1, "0");
-      result = result.substring(0, separator + maxDecimals + 1);
-    }
-    else {
-      result = result + ".";
-      separator = result.length - 1;
-      result = result.padEnd(separator + maxDecimals + 1, "0");
-    }
-    const spaces = Math.ceil(beforeSeparator / digitsPerGroup) - 1;
-    if (spaces > 0) {
-      for (let i = 0; i < spaces; i++) {
-        const position = beforeSeparator - (spaces - i) * digitsPerGroup;
-        result = result.slice(0, position) + " " + result.slice(position, result.length);
-        beforeSeparator++;
-      }
-    }
-    return result;
-  }
-  render() {
-    return [
-      typeof this.amount == "number" ? this.format(this.amount.toString()) : this.format(this.amount),
-      " ",
-      this.currency,
-    ];
-  }
-};
-SmoothlyDisplayAmount.style = styleCss;
-
-export { SmoothlyDisplayAmount as smoothly_display_amount };

package/dist/esm/smoothly-display-date-time.entry.js

@@ -1,16 +0,0 @@
-import { r as registerInstance } from './index-02a70ac1.js';
-
-const styleCss = ".sc-smoothly-display-date-time-h{display:block}[hidden].sc-smoothly-display-date-time-h{display:none}";
-
-let SmoothlyDisplayDateTime = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-  }
-  render() {
-    const datetime = this.datetime.split("T");
-    return [datetime[0], " ", datetime[1]];
-  }
-};
-SmoothlyDisplayDateTime.style = styleCss;
-
-export { SmoothlyDisplayDateTime as smoothly_display_date_time };

package/dist/esm/smoothly-display-demo.entry.js

@@ -1,21 +0,0 @@
-import { r as registerInstance, i as createEvent, h } from './index-02a70ac1.js';
-import { N as Notice } from './index-c8b5d468.js';
-import './GoogleFont-8474516b.js';
-
-let SmoothlyDisplayDemo = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.notice = createEvent(this, "notice", 7);
-  }
-  noticeWarning(notice) {
-    console.log("emit", notice);
-    this.notice.emit(notice);
-  }
-  render() {
-    return [
-      h("main", null, h("smoothly-popup", null, h("div", null, "Popup, click me"), h("div", { color: "dark", slot: "popup" }, "1 line popup")), h("smoothly-display-date-time", { datetime: "2019-08-15T08:08:17.65Z" }), h("dl", null, h("dt", null, "text"), h("dd", null, h("smoothly-display", { type: "text", value: "text" })), h("dt", null, "postal code"), h("dd", null, h("smoothly-display", { type: "postal-code", value: "752 31" })), h("dt", null, "password"), h("dd", null, h("smoothly-display", { type: "password", value: "password" })), h("dt", null, "email"), h("dd", null, h("smoothly-display", { type: "email", value: "test@example.com" })), h("dt", null, "price"), h("dd", null, h("smoothly-display", { type: "price", value: "13.37", currency: "SEK" })), h("dt", null, "percent"), h("dd", null, h("smoothly-display", { type: "percent", value: "42" })), h("dt", null, "phone"), h("dd", null, h("smoothly-display", { type: "phone", value: "0101881108" })), h("dt", null, "card number"), h("dd", null, h("smoothly-display", { type: "card-number", value: "4111111111111111" })), h("dt", null, "card expires"), h("dd", null, h("smoothly-display", { type: "card-expires", value: "7/22" })), h("dt", null, "card csc"), h("dd", null, h("smoothly-display", { type: "card-csc", value: "987" })), h("dt", null, "Quiet"), h("dd", null, h("smoothly-quiet", { color: "dark" }, "-"))), h("smoothly-skeleton", { period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { period: 3, distance: "20rem", color: "200,200,255" }), h("smoothly-skeleton", { period: 3, distance: "20rem", color: "var(--smoothly-warning-color)" }), h("smoothly-skeleton", { period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-urlencoded", { data: "hej=hopp&tjena=moss" }), h("div", { style: { display: "flex", justifyContent: "space-between" } }, h("smoothly-popup", { direction: "down" }, "Click for popup", h("span", { slot: "popup", color: "dark", style: { whiteSpace: "nowrap" } }, "Some popup stuff that has a lot of text")), h("smoothly-popup", { direction: "down" }, "Click for popup", h("span", { slot: "popup", color: "dark", style: { whiteSpace: "nowrap" } }, "Some popup with a bunch of text."))), h("p", null, "Test of diffrent kinds of notifier:"), h("button", { onClick: () => this.noticeWarning(Notice.warn("This is a test warning notice.")) }, "warning"), h("button", { onClick: () => this.noticeWarning(Notice.succeded("This is a test success notice.")) }, "success"), h("button", { onClick: () => this.noticeWarning(Notice.failed("This is a test danger notice.")) }, "danger"), h("button", { onClick: () => this.noticeWarning(Notice.execute("This is a test execute notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "execute"), h("button", { onClick: () => this.noticeWarning(Notice.delay("This is a test delay notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "delay"), h("div", { style: { position: "relative", height: "10em" } }, "Large Spinner", h("smoothly-spinner", { active: true, size: "large", style: { "--background-color": "255,255,255", "--background-opacity": "0.2", "--spinner-color": "0,130,0", } })), h("div", { style: { position: "relative", height: "10em" } }, "Medium Spinner", h("smoothly-spinner", { active: true, size: "medium" })), h("div", { style: { position: "relative", height: "10em" } }, "Small Spinner", h("smoothly-spinner", { active: true, size: "small" })), h("div", { style: { position: "absolute", left: "500px", top: "150px" } }, h("smoothly-svg", { url: "https://theme.payfunc.com/intergiro/animated-logo.svg" }))),
-    ];
-  }
-};
-
-export { SmoothlyDisplayDemo as smoothly_display_demo };

package/dist/esm/smoothly-display.entry.js

@@ -1,37 +0,0 @@
-import { r as registerInstance, h } from './index-02a70ac1.js';
-import { d as dist } from './index-401c6ce3.js';
-import './_commonjsHelpers-8fe71198.js';
-import './index-a5a08f46.js';
-
-const styleCss = ".sc-smoothly-display-h{display:block}[hidden].sc-smoothly-display-h{display:none}";
-
-let SmoothlyDisplay = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-  }
-  render() {
-    let result;
-    const type = this.type;
-    switch (type) {
-      default:
-        result = dist.format(this.value, type);
-        break;
-      case "email":
-        result = h("a", { href: "mailto:" + this.value }, dist.format(this.value, type));
-        break;
-      case "phone":
-        result = h("a", { href: "tel:" + this.value }, dist.format(this.value, type, this.country));
-        break;
-      case "postal-code":
-        result = dist.format(this.value, type, this.country);
-        break;
-      case "price":
-        result = dist.format(this.value, type, this.currency);
-        break;
-    }
-    return result;
-  }
-};
-SmoothlyDisplay.style = styleCss;
-
-export { SmoothlyDisplay as smoothly_display };

package/dist/esm/smoothly-frame.entry.js

@@ -1,46 +0,0 @@
-import { r as registerInstance, i as createEvent, h, j as getElement } from './index-02a70ac1.js';
-import { M as Message, T as Trigger } from './index-c8b5d468.js';
-import './GoogleFont-8474516b.js';
-
-const styleCss = ".sc-smoothly-frame-h{display:block;width:100%;height:100%}[hidden].sc-smoothly-frame-h{display:none}.sc-smoothly-frame-h>iframe.sc-smoothly-frame{border:none;padding:none;margin:none}";
-
-let SmoothlyFrame = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.trigger = createEvent(this, "trigger", 7);
-    this.message = createEvent(this, "message", 7);
-  }
-  get contentWindow() {
-    const iframe = this.element && this.element.firstElementChild ? this.element.firstElementChild : undefined;
-    return (iframe && iframe.contentWindow) || undefined;
-  }
-  get defaultOrigin() {
-    const match = this.url.match(/^(([a-z]+\+)*[a-z]+:\/\/)?[^/^\n]+/);
-    return match ? match[0] : "*";
-  }
-  componentDidLoad() {
-    var _a;
-    if (this.contentWindow)
-      Message.listen((_a = this.origin) !== null && _a !== void 0 ? _a : this.defaultOrigin, (destination, content) => {
-        if (destination == this.name)
-          if (Trigger.is(content))
-            this.trigger.emit(content);
-          else
-            this.message.emit({ destination, content });
-      }, window);
-  }
-  async send(message, content) {
-    var _a, _b;
-    if (typeof message == "string")
-      Message.send(((_a = this.origin) !== null && _a !== void 0 ? _a : this.defaultOrigin) + "#" + message, content, this.contentWindow);
-    else if (Message.is(message) && this.contentWindow)
-      Message.send({ destination: ((_b = this.origin) !== null && _b !== void 0 ? _b : this.defaultOrigin) + "#" + message.destination, content: message.destination }, this.contentWindow);
-  }
-  render() {
-    return h("iframe", { src: this.url + "#" + window.location.origin, height: "100%", width: "100%" });
-  }
-  get element() { return getElement(this); }
-};
-SmoothlyFrame.style = styleCss;
-
-export { SmoothlyFrame as smoothly_frame };