smoothly 0.1.114 → 0.1.115

package/dist/cjs/smoothly-picker.cjs.entry.js

@@ -1,151 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-138c41c2.js');
-
-const styleCss = ":host{--background-color:var(--smoothly-default-color), 1;--color:var(--smoothly-secondary-contrast);--border-color:var(--smoothly-default-shade), 1;--border-highlight-color:var(--smoothly-secondary-contrast), 1;--label-color:var(--smoothly-secondary-contrast), 0.8;--selected-item-border-radius:0.25rem;--selected-item-background-color:var(--smoothly-secondary-color), 1;--selected-item-color:255, 255, 255, 1}:host{display:block;position:relative;background-color:rgba(var(--background-color));width:100%;cursor:pointer;--intergiro-transition:border-color 200ms cubic-bezier(0.645, 0.045, 0.355, 1);transition:var(--intergiro-transition);border:1px solid rgb(var(--border-color));margin:1px;height:40px;border-radius:0.25rem}:host(:focus-within){border-color:rgb(var(--smoothly-primary-shade));border-width:2px;margin:0px}:host>div{display:flex;background-color:transparent;min-height:40px;align-items:center;align-self:center;border:none;max-height:var(--max-height)}:host>div .icons>smoothly-icon{flex-shrink:0;padding-left:0.6em;stroke:rgba(var(--color), 0.4);fill:rgba(var(--color), 0.4);width:1.5em !important;height:1.5em !important}:host>div .icons>smoothly-icon:hover{fill:rgba(var(--color), 1)}:host>div input{width:100%;background-color:transparent;outline:none;border:none;cursor:pointer;color:rgb(var(--color));padding:0 0.6em;font-family:var(--smoothly-font-family);font-size:1.05em}:host>div input::placeholder{opacity:1;text-overflow:ellipsis}:host([is-open])>div input{color:rgb(var(--smoothly-medium-color))}:host(:not(:focus-within)[multiple]) ul>li:last-child{position:absolute;pointer-events:none}:host([label=\"\"]) ul,:host:not([label]) ul,:host([label-setting=hide]) ul{padding-top:0.1em;padding-bottom:0.1em}label{padding-left:0.6em;white-space:nowrap;color:rgba(var(--label-color));transition:var(--intergiro-transition);font-family:var(--smoothly-font-family);pointer-events:none;transform-origin:left}:host([has-selection]) label{display:var(--label-display)}:host([has-selection]) label,:host(:focus-within) label{display:none}:host(:hover) smoothly-icon[data-arrow],:host(:focus-within) smoothly-icon[data-arrow]{stroke:rgba(var(--color), 1)}:host smoothly-icon[data-arrow]{pointer-events:none}:host smoothly-icon{flex-shrink:0;width:1em;height:1em}:host(:not([is-open])) smoothly-icon.up,:host([is-open]) smoothly-icon.down{display:none}smoothly-icon.search{display:flex;align-self:center;padding-left:0.8em}smoothly-icon.up,smoothly-icon.down{display:flex;align-self:center;padding-right:0.8em;stroke:rgb(var(--smoothly-primary-shade))}:host smoothly-menu-options{margin-top:0.5em;padding-top:0.5em;padding-bottom:0.5em;position:absolute;z-index:1}:host(:not([is-open]))>smoothly-menu-options{display:none}";
-
-let SmoothlyPicker = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.menuClose = index.createEvent(this, "menuClose", 7);
-    this.keepFocusOnReRender = false;
-    this.emptyMenuLabel = "No Options";
-    this.multiple = false;
-    this.options = [];
-    this.selections = [];
-    this.selectNoneName = "Select None";
-    this.selectionName = "items selected";
-  }
-  isOpenChangeHander() {
-    if (this.isOpen == false) {
-      this.menuClose.emit(this.selections);
-    }
-  }
-  componentDidRender() {
-    this.filterOptions();
-    if (this.keepFocusOnReRender) {
-      this.inputElement.focus();
-      this.keepFocusOnReRender = false;
-    }
-  }
-  optionSelectHander(event) {
-    this.toggle(event.detail);
-    event.stopPropagation();
-  }
-  toggle(option) {
-    option.value == "select-none"
-      ? this.toggleAll()
-      : this.selections.map(s => s.value).includes(option.value)
-        ? this.unselect(option)
-        : this.select(option);
-  }
-  toggleAll() {
-    var _a;
-    this.selections = this.selections.length == ((_a = this.options) === null || _a === void 0 ? void 0 : _a.length) ? [] : this.options;
-    this.inputElement.focus();
-    this.keepFocusOnReRender = true;
-  }
-  unselect(selection) {
-    const index = this.selections.map(selection => selection.value).indexOf(selection.value);
-    if (index != -1) {
-      this.selections = [
-        ...this.selections.slice(0, index),
-        ...this.selections.slice(index + 1, this.selections.length),
-      ];
-      this.keepFocusOnReRender = true;
-    }
-  }
-  select(selection) {
-    const isNewSelection = this.selections.reduce((acc, current) => acc && current.value != selection.value, true);
-    if (isNewSelection)
-      this.selections = this.multiple ? [...this.selections, selection] : [selection];
-    this.inputElement.value = "";
-    this.filterOptions();
-    this.keepFocusOnReRender = true;
-    this.isOpen = this.multiple;
-  }
-  toggleHighlighted() {
-    var _a;
-    (_a = this.menuElement) === null || _a === void 0 ? void 0 : _a.getHighlighted().then((result) => {
-      result && this.toggle(result);
-    });
-  }
-  highlightDefault() {
-    var _a;
-    this.filterOptions();
-    (_a = this.menuElement) === null || _a === void 0 ? void 0 : _a.setHighlight(this.multiple || this.selections.length == 0 ? 0 : this.selections[0].value);
-  }
-  filterOptions() {
-    var _a;
-    (_a = this.menuElement) === null || _a === void 0 ? void 0 : _a.filterOptions(this.inputElement.value, []);
-  }
-  onInput(event) {
-    this.isOpen = this.inputElement.value != "" ? true : this.isOpen;
-    this.highlightDefault();
-  }
-  onKeyDown(event) {
-    var _a;
-    if (event.key == "ArrowUp" || event.key == "ArrowDown") {
-      (_a = this.menuElement) === null || _a === void 0 ? void 0 : _a.moveHighlight(event.key == "ArrowUp" ? -1 : 1);
-      event.preventDefault();
-    }
-    else if (event.key == "Enter" && this.isOpen)
-      this.toggleHighlighted();
-    else if (event.key == "Escape") {
-      this.inputElement.value = "";
-      this.isOpen = false;
-      this.filterOptions();
-    }
-    else if (event.key == " " && this.inputElement.value == "") {
-      event.preventDefault();
-      this.isOpen = true;
-      this.filterOptions();
-    }
-  }
-  onClick() {
-    this.isOpen = !this.isOpen;
-    this.inputElement.focus();
-    this.highlightDefault();
-    this.filterOptions();
-  }
-  onBlur() {
-    this.inputElement.value = "";
-    this.isOpen = false;
-    this.filterOptions();
-  }
-  getCheckHtml(checked) {
-    return checked ? (index.h("smoothly-icon", { name: "checkbox", size: "small" })) : (index.h("smoothly-icon", { name: "square-outline", size: "small" }));
-  }
-  render() {
-    var _a, _b, _c, _d;
-    const cssVariables = {
-      "--max-height": (_a = this.maxHeight) !== null && _a !== void 0 ? _a : "inherit",
-      "--label-display": this.labelSetting == "hide" ? "none" : "absolute",
-    };
-    (_b = this.options) === null || _b === void 0 ? void 0 : _b.forEach(o => {
-      o.left = this.getCheckHtml(this.selections.map(s => s.value).includes(o.value));
-    });
-    const options = [
-      {
-        value: "select-none",
-        name: this.selectNoneName,
-        left: this.getCheckHtml(this.selections.length == ((_c = this.options) === null || _c === void 0 ? void 0 : _c.length)),
-        divider: true,
-      },
-      ...((_d = this.options) !== null && _d !== void 0 ? _d : []),
-    ];
-    return (index.h(index.Host, { style: cssVariables, "has-selection": this.selections.length > 0, "is-open": this.isOpen ? "" : undefined, onMouseDown: (e) => e.preventDefault(), onClick: () => this.onClick() }, index.h("div", null, index.h("smoothly-icon", { class: "search", name: "search-outline", size: "tiny" }), index.h("label", null, this.label), index.h("input", { type: "text", ref: (el) => (this.inputElement = el ? el : this.inputElement), onFocus: () => this.highlightDefault(), onBlur: () => this.onBlur(), placeholder: this.selections.length > 3
-        ? this.selections.length.toString() + " " + this.selectionName
-        : this.selections.map(selection => selection.name).join(", "), onKeyDown: e => this.onKeyDown(e), onInput: (e) => this.onInput(e) }), index.h("smoothly-icon", { class: "down", name: "chevron-down", size: "tiny" }), index.h("smoothly-icon", { class: "up", name: "chevron-up", size: "tiny" })), index.h("smoothly-menu-options", { style: { width: "100%" }, optionStyle: Object.assign({}, this.optionStyle), order: false, emptyMenuLabel: this.emptyMenuLabel, "max-menu-height": this.maxMenuHeight, ref: (el) => (this.menuElement = el !== null && el !== void 0 ? el : this.menuElement), onClick: e => e.stopPropagation(), resetHighlightOnOptionsChange: false, options: options })));
-  }
-  get element() { return index.getElement(this); }
-  static get watchers() { return {
-    "selections": ["isOpenChangeHander"],
-    "isOpen": ["isOpenChangeHander"]
-  }; }
-};
-SmoothlyPicker.style = styleCss;
-
-exports.smoothly_picker = SmoothlyPicker;

package/dist/cjs/smoothly-popup.cjs.entry.js

@@ -1,38 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-138c41c2.js');
-
-const styleCss = ".sc-smoothly-popup-h{display:inline-flex;position:relative}[hidden].sc-smoothly-popup-h{display:none}.sc-smoothly-popup-h:not([visible]) aside.sc-smoothly-popup{display:none}.sc-smoothly-popup-h aside.sc-smoothly-popup{display:inline;position:absolute;padding:0.3em;left:var(--left);right:var(--right);background-color:rgb(238, 238, 238);border-color:rgb(238, 238, 238);border-style:solid;border-width:0.1em;border-radius:0.6em;z-index:3}[direction=down].sc-smoothly-popup-h aside.sc-smoothly-popup{top:2.2em;box-shadow:6px 5px 9px -9px black, 5px 6px 9px -9px black}[direction=up].sc-smoothly-popup-h aside.sc-smoothly-popup{bottom:2.2em;box-shadow:-6px -5px 9px -9px black, -5px -6px 9px -9px black}.sc-smoothly-popup-h:not([visible]) .background.sc-smoothly-popup{display:none}.sc-smoothly-popup-h .background.sc-smoothly-popup{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:2}.sc-smoothly-popup-h:not([visible]) .arrow.sc-smoothly-popup{display:none}.sc-smoothly-popup-h .arrow.sc-smoothly-popup{background-color:rgb(238, 238, 238);border-color:rgb(238, 238, 238);z-index:2;content:\"\";position:absolute;width:12px;height:12px;transform:rotate(45deg);left:calc(var(--left) + 1em);right:calc(var(--right) + 1em)}[direction=down].sc-smoothly-popup-h .arrow.sc-smoothly-popup{top:2em;border-top-style:solid;border-top-width:1px;border-left-style:solid;border-left-width:1px}[direction=up].sc-smoothly-popup-h .arrow.sc-smoothly-popup{bottom:2em;border-bottom-style:solid;border-bottom-width:1px;border-right-style:solid;border-right-width:1px}.sc-smoothly-popup-h .pointer.sc-smoothly-popup{cursor:pointer}";
-
-let SmoothlyPopup = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.popup = index.createEvent(this, "popup", 7);
-    this.visible = false;
-    this.direction = "down";
-    this.cssVariables = { "--left": "0.1em" };
-  }
-  onClick() {
-    var _a, _b, _c, _d, _e, _f;
-    if (this.visible == false) {
-      (_a = this.aside) === null || _a === void 0 ? void 0 : _a.style.setProperty("display", "block");
-      this.cssVariables =
-        ((_c = (_b = this.aside) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().right) !== null && _c !== void 0 ? _c : 0) >= window.innerWidth
-          ? { "--right": "0.1em" }
-          : ((_e = (_d = this.aside) === null || _d === void 0 ? void 0 : _d.getBoundingClientRect().left) !== null && _e !== void 0 ? _e : 0) < 0
-            ? { "--left": "0.1em" }
-            : this.cssVariables;
-      (_f = this.aside) === null || _f === void 0 ? void 0 : _f.style.removeProperty("display");
-    }
-    this.visible = !this.visible;
-    this.popup.emit(this.visible);
-  }
-  render() {
-    return (index.h(index.Host, { style: Object.assign({}, this.cssVariables) }, index.h("content", { class: "pointer", onClick: () => this.onClick() }, index.h("slot", null)), index.h("div", { class: "background", onClick: () => this.onClick() }), index.h("div", { class: "arrow", onClick: () => this.onClick() }), index.h("aside", { ref: el => (this.aside = el) }, index.h("slot", { name: "popup" }))));
-  }
-};
-SmoothlyPopup.style = styleCss;
-
-exports.smoothly_popup = SmoothlyPopup;

package/dist/cjs/smoothly-quiet.cjs.entry.js

@@ -1,19 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-138c41c2.js');
-
-const styleCss = ".sc-smoothly-quiet-h{opacity:0.5}";
-
-let SmoothlyQuiet = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-  }
-  render() {
-    return (index.h(index.Host, { color: this.color }, index.h("slot", null)));
-  }
-};
-SmoothlyQuiet.style = styleCss;
-
-exports.smoothly_quiet = SmoothlyQuiet;

package/dist/cjs/smoothly-radio.cjs.entry.js

@@ -1,28 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-138c41c2.js');
-
-const styleCss = ".sc-smoothly-radio-h{display:block;position:relative}[hidden].sc-smoothly-radio-h{display:none}label.sc-smoothly-radio{display:block;width:calc(100% - 2 * 0.4em);padding:0.2em 0.4em 0.2em 0.4em}input[type=radio].sc-smoothly-radio{position:absolute;left:0;top:0;width:calc(100%);height:100%;margin:0;appearance:none;-webkit-appearance:none}input[type=radio].sc-smoothly-radio~label.sc-smoothly-radio{border:1px solid rgb(var(--smoothly-default-color));color:rgba(var(--smoothly-default-contrast), 0.5);background:rgb(var(--smoothly-default-color))}input[type=radio].sc-smoothly-radio:checked~label.sc-smoothly-radio{background-color:rgb(var(--smoothly-default-shade));color:rgb(var(--smoothly-default-contrast))}";
-
-let SmoothlyRadio = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.smoothlySelected = index.createEvent(this, "smoothlySelected", 7);
-  }
-  async onInput(e) {
-    if (e.target && e.target.value && (this.checked = e.target.checked))
-      this.smoothlySelected.emit({ name: this.name, value: this.value });
-    return true;
-  }
-  render() {
-    return [
-      index.h("input", { type: "radio", name: this.name, id: this.value, tabindex: this.tabIndex, checked: this.checked, value: this.value, onChange: e => this.onInput(e) }),
-      index.h("label", { htmlFor: this.value }, index.h("slot", null)),
-    ];
-  }
-};
-SmoothlyRadio.style = styleCss;
-
-exports.smoothly_radio = SmoothlyRadio;

package/dist/cjs/smoothly-room.cjs.entry.js

@@ -1,16 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-138c41c2.js');
-
-let SmoothlyRoom = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-  }
-  render() {
-    return index.h("slot", null);
-  }
-};
-
-exports.smoothly_room = SmoothlyRoom;

package/dist/cjs/smoothly-select-demo.cjs.entry.js

@@ -1,86 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-138c41c2.js');
-
-const styleCss = ".sc-smoothly-select-demo-h{display:block}[hidden].sc-smoothly-select-demo-h{display:none}button.sc-smoothly-select-demo:focus{outline:none}smoothly-selector.sc-smoothly-select-demo{outline:none}";
-
-let SmoothlySelectDemo = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.currencies = ["SEK", "EUR"];
-    this.currency = "SEK";
-  }
-  alertf() {
-    var _a;
-    console.log(this.quantityElement);
-    alert((_a = this.quantityElement) === null || _a === void 0 ? void 0 : _a.value);
-  }
-  handleSelectionChanged(event) {
-    console.log("selectionChanged", event.detail);
-  }
-  render() {
-    return [
-      index.h("smoothly-select", { identifier: "currency" }, this.currencies.map(option => this.currency == option ? (index.h("option", { value: option, selected: true }, option)) : (index.h("option", { value: option }, option)))),
-      index.h("smoothly-select", { identifier: "language" }, index.h("optgroup", { label: "Nordic" }, index.h("option", { value: "sv" }, "Swedish"), index.h("option", { value: "da", selected: true }, "Danish"), index.h("option", { value: "no" }, "Norwegian")), index.h("optgroup", { label: "Other" }, index.h("option", { value: "en" }, "English"))),
-      index.h("smoothly-select", { identifier: "quantity", ref: e => (this.quantityElement = e) }, index.h("option", { value: "1" }, "1"), index.h("option", { value: "2" }, "2"), index.h("option", { value: "3" }, "3")),
-      index.h("smoothly-input-date", null, "Date"),
-      index.h("smoothly-input-date", { value: "2021-10-28", max: "2021-12-30", min: "2021-10-10" }, "Date"),
-      index.h("smoothly-input-date-range", { start: "2022-10-28", end: "2022-11-27", min: "2021-10-10", max: "2022-12-30" }),
-      index.h("smoothly-input-date-range", { start: "2022-10-28", end: "2022-11-27", min: "2021-10-10", max: "2022-12-30", showLabel: false, style: {
-          "--background": "rgb(var(--smoothly-dark-shade))",
-          "--border-radius": "4px",
-          "--padding": "0 0.75em",
-          "--input-width": "6rem",
-        } }),
-      index.h("smoothly-selector", null, index.h("smoothly-item", { value: "1" }, "January"), index.h("smoothly-item", { value: "2" }, "February"), index.h("smoothly-item", { value: "3" }, "March"), index.h("smoothly-item", { value: "4" }, "April"), index.h("smoothly-item", { value: "5" }, "May"), index.h("smoothly-item", { value: "6" }, "June"), index.h("smoothly-item", { value: "7" }, "July"), index.h("smoothly-item", { value: "8" }, "August"), index.h("smoothly-item", { value: "9" }, "September"), index.h("smoothly-item", { value: "10" }, "October"), index.h("smoothly-item", { value: "11" }, "November"), index.h("smoothly-item", { value: "12" }, "December")),
-      index.h("button", { onClick: () => this.alertf() }, "press here"),
-      index.h("smoothly-picker", { label: "Filter", "empty-menu-label": "Sorry, we're out of options.", "max-height": "58px", multiple: true, options: [
-          { name: "Big Dog", value: "dog", aliases: ["WOFF"] },
-          { name: "Cat Stevens", value: "cat", aliases: ["moew"] },
-          { name: "Noble Pig", value: "pig" },
-          { name: "Turtle Wax", value: "turtle" },
-          { name: "Spider Man", value: "spider" },
-          { name: "Phoenix Order Long Wooord", value: "phoenix" },
-          { name: "Horse Back", value: "horse" },
-          { name: "Unicorn Horn", value: "unicorn" },
-          { name: "Talking Parrot Parrot", value: "parrot" },
-          { name: "Hidden Dragon", value: "dragon" },
-          { name: "Scary Kraken", value: "kraken" },
-        ] }),
-      index.h("br", null),
-      index.h("smoothly-picker", { label: "", "empty-menu-label": "Sorry, we're out of options.", "max-height": "58px", multiple: true, options: [
-          { name: "Big Dog", value: "dog", aliases: ["WOFF"] },
-          { name: "Cat Stevens", value: "cat", aliases: ["moew"] },
-          { name: "Noble Pig", value: "pig" },
-          { name: "Turtle Wax", value: "turtle" },
-          { name: "Spider Man", value: "spider" },
-          { name: "Phoenix Order Long Wooord", value: "phoenix" },
-          { name: "Horse Back", value: "horse" },
-          { name: "Unicorn Horn", value: "unicorn" },
-          { name: "Talking Parrot Parrot", value: "parrot" },
-          { name: "Hidden Dragon", value: "dragon" },
-          { name: "Scary Kraken", value: "kraken" },
-        ] }),
-      index.h("br", null),
-      index.h("smoothly-picker", { label: "Single select", multiple: false, "max-menu-height": "200px", options: [
-          { name: "Dog", value: "dog", aliases: ["WOFF"], right: "Woof 🐶" },
-          { name: "Cat", value: "cat", aliases: ["moew"] },
-          { name: "Pig", value: "pig" },
-          { name: "Turtle", value: "turtle" },
-          { name: "Spider", value: "spider" },
-          { name: "Phoenix", value: "phoenix" },
-          { name: "Horse", value: "horse" },
-          { name: "Unicorn", value: "unicorn" },
-          { name: "Parrot", value: "parrot" },
-          { name: "Dragon", value: "dragon" },
-          { name: "Kraken", value: "kraken" },
-        ] }),
-      index.h("smoothly-tab-switch", null, index.h("smoothly-tab", { label: "test1", open: true }, "Hello world!"), index.h("smoothly-tab", { label: "test2" }, "this is a test message!"), index.h("smoothly-tab", { label: "test3" }, "this is a test message again!")),
-    ];
-  }
-};
-SmoothlySelectDemo.style = styleCss;
-
-exports.smoothly_select_demo = SmoothlySelectDemo;

package/dist/cjs/smoothly-select.cjs.entry.js

@@ -1,31 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-138c41c2.js');
-
-const styleCss = ".sc-smoothly-select-h{display:block}[hidden].sc-smoothly-select-h{display:none}select.sc-smoothly-select{min-width:1.5em;padding-top:0.5em;border:none;-webkit-appearance:none;background-color:rgb(var(--smoothly-color));padding:0.3em}select.sc-smoothly-select>option.sc-smoothly-select{background-color:inherit}select.sc-smoothly-select:focus{outline:none}";
-
-let SmoothlySelect = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.selectionChanged = index.createEvent(this, "selectionChanged", 7);
-  }
-  optionSelected() {
-    if (this.selectElement)
-      this.selectionChanged.emit({ identifier: this.identifier, value: (this.value = this.selectElement.value) });
-  }
-  componentDidLoad() {
-    var _a;
-    if (this.selectElement)
-      this.value = (_a = this.selectElement) === null || _a === void 0 ? void 0 : _a.value;
-  }
-  render() {
-    return [
-      index.h("select", { ref: e => (this.selectElement = e), id: this.identifier, onChange: () => this.optionSelected(), style: { background: this.background } }, index.h("slot", null)),
-    ];
-  }
-};
-SmoothlySelect.style = styleCss;
-
-exports.smoothly_select = SmoothlySelect;

package/dist/cjs/smoothly-selector.cjs.entry.js

@@ -1,119 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-138c41c2.js');
-
-const styleCss = ".sc-smoothly-selector-h{position:relative;height:100%}.sc-smoothly-selector-h>main.sc-smoothly-selector,.sc-smoothly-selector-h>main.sc-smoothly-selector>*.sc-smoothly-selector{height:100%;display:flex;align-items:center}.sc-smoothly-selector-h>div.sc-smoothly-selector>nav.sc-smoothly-selector{display:flex;flex-direction:column;position:absolute;z-index:10}.sc-smoothly-selector-h>aside.sc-smoothly-selector{position:absolute;top:0;left:5em;z-index:10;background-color:rgb(var(--smoothly-tertiary-color));color:rgb(var(--smoothly-tertiary-contrast));height:20px;border-radius:5px;padding:5px;display:flex;align-items:center}.missing.sc-smoothly-selector-h>aside.sc-smoothly-selector{background-color:rgb(var(--smoothly-warning-color));color:rgb(var(--smoothly-warning-contast))}.hidden.sc-smoothly-selector{display:none}.sc-smoothly-selector-h>section.sc-smoothly-selector{position:fixed;top:0px;left:0px;width:100vw;height:100vh;z-index:10}";
-
-let Selector = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.selected = index.createEvent(this, "selected", 7);
-    this.opened = false;
-    this.items = [];
-    this.missing = false;
-    this.filter = "";
-  }
-  onSelectedChange(value, old) {
-    if (old)
-      old.selected = false;
-    this.selected.emit(value === null || value === void 0 ? void 0 : value.value);
-  }
-  async onFilterChange(value) {
-    value = value.toLowerCase();
-    if (!(await Promise.all(this.items.map(item => item.filter(value)))).some(r => r)) {
-      this.missing = true;
-      this.items.forEach(el => el.filter(""));
-    }
-    else
-      this.missing = false;
-  }
-  onClick(event) {
-    event.stopPropagation();
-    this.opened = !this.opened;
-  }
-  onItemSelected(event) {
-    this.selectedElement = event.target;
-    if (this.mainElement)
-      this.mainElement.innerHTML = this.selectedElement.innerHTML;
-  }
-  onKeyDown(event) {
-    event.stopPropagation();
-    if (this.opened) {
-      let direction = 0;
-      switch (event.key) {
-        case "ArrowUp":
-          direction = -1;
-          break;
-        case "ArrowDown":
-          direction = 1;
-          break;
-        case "Escape":
-          this.filter = "";
-          break;
-        case "Backspace":
-          this.filter = this.filter.slice(0, -1);
-          break;
-        case "Enter":
-          this.items.forEach(element => {
-            if (!element.hidden) {
-              this.selected.emit(element.value);
-              if (this.mainElement && this.selectedElement)
-                this.mainElement.innerHTML = this.selectedElement.innerHTML;
-              this.opened = false;
-              this.filter = "";
-            }
-          });
-          break;
-        default:
-          if (event.key.length == 1)
-            this.filter += event.key;
-          break;
-      }
-      this.move(direction);
-    }
-    else if (event.key == "Enter")
-      this.opened = true;
-  }
-  move(direction) {
-    if (direction) {
-      let selectedIndex = this.items.findIndex(item => item == this.selectedElement);
-      console.log("selectedindex", selectedIndex);
-      do {
-        selectedIndex = (selectedIndex + direction + this.items.length) % this.items.length;
-      } while (this.items[selectedIndex].hidden);
-      this.selectedElement = this.items[selectedIndex];
-      this.selectedElement.selected = true;
-    }
-  }
-  render() {
-    return (index.h(index.Host, { tabIndex: 2, class: this.missing ? "missing" : "" }, index.h("main", { ref: element => (this.mainElement = element) }, "(none)"), this.filter.length != 0 ? (index.h("aside", { ref: element => (this.aside = element) }, this.filter, index.h("button", { onClick: e => {
-        e.stopPropagation();
-        this.filter = "";
-      } }, index.h("smoothly-icon", { name: "close", size: "small" })))) : undefined, this.opened ? index.h("section", { onClick: () => (this.opened = true) }) : [], index.h("div", { class: this.opened ? "" : "hidden" }, index.h("nav", null, index.h("slot", null)))));
-  }
-  componentDidRender() {
-    const items = [];
-    const children = this.element.querySelectorAll("div > nav > smoothly-item");
-    for (let i = 0; i < children.length; i++) {
-      const node = children.item(i);
-      if (isItem(node))
-        items.push(node);
-    }
-    this.items = items;
-  }
-  get element() { return index.getElement(this); }
-  static get watchers() { return {
-    "selectedElement": ["onSelectedChange"],
-    "filter": ["onFilterChange"]
-  }; }
-};
-function isItem(value) {
-  return (typeof value == "object" &&
-    (typeof value.selected == "boolean" || value.selected == undefined) &&
-    typeof value.filter == "function");
-}
-Selector.style = styleCss;
-
-exports.smoothly_selector = Selector;

package/dist/cjs/smoothly-skeleton.cjs.entry.js

@@ -1,27 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-138c41c2.js');
-
-const styleCss = ".sc-smoothly-skeleton-h{display:block;height:1rem}.sc-smoothly-skeleton-h::before{content:\"\";display:block;width:var(--width);height:100%;border-radius:0.4rem;background-image:linear-gradient(90deg, rgb(var(--color, var(--smoothly-dark-color))) 0, transparent 2.5rem, rgb(var(--color, var(--smoothly-dark-color))) 5rem);background-size:calc(var(--distance) + 5rem);animation-duration:var(--period, 1.6s);animation-iteration-count:infinite;animation-timing-function:linear;animation-name:shine-lines-left}@keyframes shine-lines-left{0%{background-position:-5rem}40%,100%{background-position:var(--distance)}}[align=center].sc-smoothly-skeleton-h::before{margin:0 auto;animation-name:shine-lines-center}@keyframes shine-lines-center{0%{background-position:calc((var(--width) - var(--distance)) / 2 - 5rem)}40%,100%{background-position:calc(var(--width) + (var(--distance) - var(--width)) / 2)}}[align=right].sc-smoothly-skeleton-h::before{margin:0;margin-left:auto;animation-name:shine-lines-right}@keyframes shine-lines-right{0%{background-position:calc(var(--width) - var(--distance) - 5rem)}40%,100%{background-position:var(--width)}}";
-
-let SmoothlySkeleton = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.widths = ["8rem", "9rem", "10rem"];
-    this.align = "left";
-  }
-  componentWillLoad() {
-    var _a;
-    this.width = (_a = this.width) !== null && _a !== void 0 ? _a : this.widths[Math.floor(Math.random() * this.widths.length)];
-  }
-  render() {
-    var _a;
-    const cssVariables = Object.assign(Object.assign({ "--width": this.width, "--distance": (_a = this.distance) !== null && _a !== void 0 ? _a : "10rem" }, (this.color ? { "--color": this.color } : undefined)), (this.period ? { "--period": this.period + "s" } : undefined));
-    return index.h(index.Host, { style: cssVariables });
-  }
-};
-SmoothlySkeleton.style = styleCss;
-
-exports.smoothly_skeleton = SmoothlySkeleton;

package/dist/cjs/smoothly-spinner.cjs.entry.js

@@ -1,24 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-138c41c2.js');
-
-const styleCss = ".sc-smoothly-spinner-h:not([active]){display:none}[hidden].sc-smoothly-spinner-h{display:none}.sc-smoothly-spinner-h{display:block;stroke:rgb(var(--spinner-color, var(--smoothly-primary-tint)));position:absolute;inset:0;width:100%;height:100%;background-color:rgba(var(--background-color, var(--smoothly-default-color)), var(--background-opacity, var(--smoothly-semitransparent, 0.8)))}.sc-smoothly-spinner-h svg.sc-smoothly-spinner{position:absolute;left:calc(50% - var(--size) / 2);top:calc(50% - var(--size) / 2);width:var(--size);animation:SPIN-SVG 1.4s linear infinite}.sc-smoothly-spinner-h svg.sc-smoothly-spinner circle.sc-smoothly-spinner{transform-origin:center;animation:SPIN-CIRCLE 1.4s ease-in-out infinite;stroke-dasharray:187;stroke-dashoffset:0}@keyframes SPIN-SVG{0%{transform:rotate(0deg)}100%{transform:rotate(270deg)}}@keyframes SPIN-CIRCLE{0%{stroke-dashoffset:187}50%{stroke-dashoffset:46.75;transform:rotate(135deg)}100%{stroke-dashoffset:187;transform:rotate(450deg)}}";
-
-let SmoothlySpinner = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.size = "large";
-  }
-  render() {
-    const strokeWidth = this.size == "large" ? 6 : this.size == "medium" ? 8 : 12;
-    return (index.h(index.Host, { style: {
-        "--color": `var(--spinner-color)`,
-        "--size": this.size == "large" ? "5em" : this.size == "medium" ? "3em" : "1.2em",
-      } }, index.h("svg", { class: "spinner", viewBox: `0 0 ${60 + strokeWidth} ${60 + strokeWidth}`, xmlns: "http://www.w3.org/2000/svg" }, index.h("circle", { class: "path", fill: "none", "stroke-width": strokeWidth, "stroke-linecap": "round", cx: `${30 + strokeWidth / 2}`, cy: `${30 + strokeWidth / 2}`, r: "30" }))));
-  }
-};
-SmoothlySpinner.style = styleCss;
-
-exports.smoothly_spinner = SmoothlySpinner;

package/dist/cjs/smoothly-submit.cjs.entry.js

@@ -1,60 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-138c41c2.js');
-
-const styleCss = ".sc-smoothly-submit-h{display:block;border-width:1px;border-style:solid;border-radius:3px}[hidden].sc-smoothly-submit-h{display:none}[disabled].sc-smoothly-submit-h{opacity:0.5}button.sc-smoothly-submit{padding:0.2em 0.3em;font-size:110%;font-weight:400}[processing].sc-smoothly-submit-h{border-color:rgb(var(--smoothly-light-color))}[processing].sc-smoothly-submit-h>button.sc-smoothly-submit{color:rgb(var(--smoothly-light-contrast));background:rgb(var(--smoothly-light-color))}.sc-smoothly-submit-h:not([processing]):not([disabled]):hover,.sc-smoothly-submit-h:not([processing]):not([disabled]):focus,.sc-smoothly-submit-h:not([processing]):not([disabled]):active{border-color:rgb(var(--smoothly-submit-border))}[expand=fill].sc-smoothly-submit-h>button.sc-smoothly-submit,[expand=block].sc-smoothly-submit-h>button.sc-smoothly-submit{width:100%}[expand=fill].sc-smoothly-submit-h{border-left:none;border-right:none}";
-
-let SmoothlySubmit = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.submitEvent = index.createEvent(this, "submit", 7);
-    this.disabled = false;
-  }
-  get form() {
-    return (this.button && this.button.form) || undefined;
-  }
-  async handleSubmit(event) {
-    if (!this.processing) {
-      this.processing = true;
-      if (this.prevent)
-        event.preventDefault();
-      const result = {};
-      if (this.form) {
-        const elements = this.form.elements;
-        for (let i = 0; i < elements.length; i++) {
-          const element = elements.item(i);
-          if (hasNameAndValue(element) && element.name)
-            result[element.name] = element.value;
-        }
-        const smoothlyInputs = this.form.getElementsByTagName("smoothly-input");
-        for (let i = 0; i < smoothlyInputs.length; i++) {
-          const element = smoothlyInputs.item(i);
-          if (hasNameAndValue(element) && element.name)
-            result[element.name] = element.value;
-        }
-      }
-      this.submitEvent.emit(result);
-      this.processing = false;
-    }
-  }
-  async submit() {
-    let result;
-    if ((result = !!this.form))
-      this.form.submit();
-    return result;
-  }
-  render() {
-    return [
-      index.h("smoothly-spinner", { active: this.processing }),
-      index.h("button", { type: "submit", disabled: this.disabled || this.processing, ref: (element) => (this.button = element) }, index.h("slot", null)),
-    ];
-  }
-};
-function hasNameAndValue(element) {
-  return (typeof element.name == "string" && typeof element.value == "string");
-}
-SmoothlySubmit.style = styleCss;
-
-exports.smoothly_submit = SmoothlySubmit;