xv-webcomponents 0.1.18 → 0.1.20

package/dist/collection/components/xv-tag/xv-tag.js

@@ -1,158 +0,0 @@
-import { Host, h } from "@stencil/core";
-export class XvTag {
-    constructor() {
-        this.size = 'md';
-        this.color = '';
-        this.bg = '';
-        this.disabled = false;
-        this.closeable = false;
-    }
-    closeHandler(e) {
-        if (this.disabled)
-            return;
-        this.closeClick.emit(e);
-    }
-    render() {
-        return (h(Host, { key: '3164ae035733d790ba1fb02040dd8ba5430c960a', style: { color: this.color, background: this.bg }, class: `xv-tag ${this.disabled ? 'disabled' : ''} ${this.size}` }, h("div", { key: '1c540ff9be6a45d89d8a2175bf2603640e43b478', class: "xv-tag_content" }, h("slot", { key: '2d893f03cc168828c932c4995ba2bbb6a649897b' })), this.closeable && (h("button", { key: '459f1f667f3b207fa6f5b24af82e2b5f6470db0d', onClick: this.closeHandler.bind(this), class: "xv-tag_close" }))));
-    }
-    static get is() { return "xv-tag-v2"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["xv-tag.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["xv-tag.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "size": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'sm' | 'md' | 'lg'",
-                    "resolved": "\"lg\" | \"md\" | \"sm\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "size",
-                "reflect": false,
-                "defaultValue": "'md'"
-            },
-            "color": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "color",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "bg": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "bg",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "disabled": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "disabled",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "closeable": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "closeable",
-                "reflect": false,
-                "defaultValue": "false"
-            }
-        };
-    }
-    static get events() {
-        return [{
-                "method": "closeClick",
-                "name": "closeClick",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "PointerEvent",
-                    "resolved": "PointerEvent",
-                    "references": {
-                        "PointerEvent": {
-                            "location": "global",
-                            "id": "global::PointerEvent"
-                        }
-                    }
-                }
-            }];
-    }
-}
-//# sourceMappingURL=xv-tag.js.map

package/dist/collection/components/xv-tag/xv-tag.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"xv-tag.js","sourceRoot":"","sources":["../../../src/components/xv-tag/xv-tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAO9E,MAAM,OAAO,KAAK;IALlB;QAMU,SAAI,GAAuB,IAAI,CAAC;QAChC,UAAK,GAAW,EAAE,CAAC;QACnB,OAAE,GAAW,EAAE,CAAC;QAChB,aAAQ,GAAY,KAAK,CAAC;QAC1B,cAAS,GAAY,KAAK,CAAC;KAwBpC;IArBC,YAAY,CAAC,CAAe;QAC1B,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAE1B,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IAC1B,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,CAAC,EAAE,EAAE,EACjD,KAAK,EAAE,UAAU,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,IAAI,IAAI,CAAC,IAAI,EAAE;YAE/D,4DAAK,KAAK,EAAC,gBAAgB;gBACzB,8DAAa,CACT;YACL,IAAI,CAAC,SAAS,IAAI,CACjB,+DAAQ,OAAO,EAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,KAAK,EAAC,cAAc,GAAU,CAC9E,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'xv-tag-v2',\n  styleUrl: 'xv-tag.scss',\n  shadow: true,\n})\nexport class XvTag {\n  @Prop() size: 'sm' | 'md' | 'lg' = 'md';\n  @Prop() color: string = '';\n  @Prop() bg: string = '';\n  @Prop() disabled: boolean = false;\n  @Prop() closeable: boolean = false;\n  @Event() closeClick: EventEmitter<PointerEvent>;\n\n  closeHandler(e: PointerEvent) {\n    if (this.disabled) return;\n\n    this.closeClick.emit(e);\n  }\n\n  render() {\n    return (\n      <Host\n        style={{ color: this.color, background: this.bg }}\n        class={`xv-tag ${this.disabled ? 'disabled' : ''} ${this.size}`}\n      >\n        <div class=\"xv-tag_content\">\n          <slot></slot>\n        </div>\n        {this.closeable && (\n          <button onClick={this.closeHandler.bind(this)} class=\"xv-tag_close\"></button>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/xv-tooltip/xv-tooltip.css

@@ -1,154 +0,0 @@
-:host {
-  position: relative;
-  display: inline-block;
-  cursor: pointer;
-  line-height: 0.5;
-}
-
-/* General styles for tooltip */
-:host::before,
-:host::after {
-  position: absolute;
-  opacity: 0;
-  visibility: hidden;
-  transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
-  z-index: 10;
-}
-
-/* Tooltip */
-:host::before {
-  content: attr(tooltip);
-  background: var(--background-inverse, #333);
-  color: var(--icon-inverse, #fff);
-  padding: var(--gap-sm, 5px) var(--gap-md, 16px);
-  border-radius: 2px;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-width: 70vw;
-  font-family: var(--fz-body, Tahoma);
-  font-size: var(fz-md, 14px);
-  font-weight: 400;
-  line-height: 18px;
-  letter-spacing: 0.16px;
-}
-
-/* Arrow */
-:host::after {
-  content: "";
-  border: 6px solid transparent;
-}
-
-/* Show Tooltip and arrow */
-:host(:hover)::before,
-:host(:hover)::after,
-:host(:focus)::before,
-:host(:focus)::after {
-  opacity: 1;
-  visibility: visible;
-}
-
-/* Tooltip positions */
-:host(.xv-tooltip_top)::before {
-  bottom: 100%;
-  left: 50%;
-  transform: translateX(-50%) translateY(-5px);
-}
-
-:host(.xv-tooltip_top)::after {
-  bottom: 100%;
-  left: 50%;
-  border-top-color: var(--background-inverse, #333);
-  transform: translateX(-50%) translateY(5px);
-}
-
-:host(.xv-tooltip_top-left)::before {
-  bottom: 100%;
-  left: 0;
-  transform: translateY(-5px);
-}
-
-:host(.xv-tooltip_top-left)::after {
-  bottom: 100%;
-  left: 10px;
-  border-top-color: black;
-  transform: translateY(5px);
-}
-
-:host(.xv-tooltip_top-right)::before {
-  bottom: 100%;
-  right: 0;
-  transform: translateY(-5px);
-}
-
-:host(.xv-tooltip_top-right)::after {
-  bottom: 100%;
-  right: 10px;
-  border-top-color: var(--background-inverse, #333);
-  transform: translateY(5px);
-}
-
-:host(.xv-tooltip_bottom)::before {
-  top: 100%;
-  left: 50%;
-  transform: translateX(-50%) translateY(5px);
-}
-
-:host(.xv-tooltip_bottom)::after {
-  top: 100%;
-  left: 50%;
-  border-bottom-color: black;
-  transform: translateX(-50%) translateY(-5px);
-}
-
-:host(.xv-tooltip_bottom-left)::before {
-  top: 100%;
-  left: 0;
-  transform: translateY(5px);
-}
-
-:host(.xv-tooltip_bottom-left)::after {
-  top: 100%;
-  left: 10px;
-  border-bottom-color: var(--background-inverse, #333);
-  transform: translateY(-5px);
-}
-
-:host(.xv-tooltip_bottom-right)::before {
-  top: 100%;
-  right: 0;
-  transform: translateY(5px);
-}
-
-:host(.xv-tooltip_bottom-right)::after {
-  top: 100%;
-  right: 10px;
-  border-bottom-color: var(--background-inverse, #333);
-  transform: translateY(-5px);
-}
-
-:host(.xv-tooltip_left)::before {
-  right: 100%;
-  top: 50%;
-  transform: translateY(-50%) translateX(-5px);
-}
-
-:host(.xv-tooltip_left)::after {
-  right: 100%;
-  top: 50%;
-  border-left-color: var(--background-inverse, #333);
-  transform: translateY(-50%) translateX(5px);
-}
-
-:host(.xv-tooltip_right)::before {
-  left: 100%;
-  top: 50%;
-  transform: translateY(-50%) translateX(5px);
-}
-
-:host(.xv-tooltip_right)::after {
-  left: 100%;
-  top: 50%;
-  border-right-color: var(--background-inverse, #333);
-  transform: translateY(-50%) translateX(-5px);
-}

package/dist/collection/components/xv-tooltip/xv-tooltip.js

@@ -1,70 +0,0 @@
-import { Host, h } from "@stencil/core";
-export class XvTooltip {
-    constructor() {
-        /**
-         * Tooltip and arrow position related to element
-         * possible options: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right'.
-         * By default, "top"
-         */
-        this.position = 'top';
-    }
-    render() {
-        return (h(Host, { key: '476077c0607c160c2374a48f00c5ddabd199da03', tooltip: this.message, class: `xv-tooltip_${this.position}` }, h("slot", { key: '9ebaf660c304374fd7eb1802a5e145a7856c7b70' }, h("svg", { key: '196a46d3bf15df204853bc092361538dafcbf9f8', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", width: 16, height: 16 }, h("path", { key: '042422978eb1dca37c64df75b076fc25f4f0dd87', fill: "currentColor", d: "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z" })))));
-    }
-    static get is() { return "xv-tooltip-v2"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["xv-tooltip.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["xv-tooltip.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "message": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Message what will be shown for tooltip *"
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "message",
-                "reflect": false
-            },
-            "position": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right'",
-                    "resolved": "\"bottom\" | \"bottom-left\" | \"bottom-right\" | \"left\" | \"right\" | \"top\" | \"top-left\" | \"top-right\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Tooltip and arrow position related to element\npossible options: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right'.\nBy default, \"top\""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "position",
-                "reflect": false,
-                "defaultValue": "'top'"
-            }
-        };
-    }
-}
-//# sourceMappingURL=xv-tooltip.js.map

package/dist/collection/components/xv-tooltip/xv-tooltip.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"xv-tooltip.js","sourceRoot":"","sources":["../../../src/components/xv-tooltip/xv-tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,SAAS;IALtB;QAQE;;;;WAIG;QACK,aAAQ,GAAoG,KAAK,CAAC;KAgB3H;IAdC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,EAAE,cAAc,IAAI,CAAC,QAAQ,EAAE;YAC/D;gBACE,4DAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,aAAa,EAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE;oBACjF,6DACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,yTAAyT,GAC3T,CACE,CACD,CACF,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'xv-tooltip-v2',\n  styleUrl: 'xv-tooltip.scss',\n  shadow: true,\n})\nexport class XvTooltip {\n  /** Message what will be shown for tooltip **/\n  @Prop() message: string;\n  /**\n   * Tooltip and arrow position related to element\n   * possible options: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right'.\n   * By default, \"top\"\n   */\n  @Prop() position: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right' = 'top';\n\n  render() {\n    return (\n      <Host tooltip={this.message} class={`xv-tooltip_${this.position}`}>\n        <slot>\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\" width={16} height={16}>\n            <path\n              fill=\"currentColor\"\n              d=\"M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z\"\n            />\n          </svg>\n        </slot>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/index.js

@@ -1,11 +0,0 @@
-/**
- * @fileoverview entry point for your component library
- *
- * This is the entry point for your component library. Use this file to export utilities,
- * constants or data structure that accompany your components.
- *
- * DO NOT use this file to export your components. Instead, use the recommended approaches
- * to consume components of this package as outlined in the `README.md`.
- */
-export { format } from './utils/utils';
-//# sourceMappingURL=index.js.map

package/dist/collection/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC","sourcesContent":["/**\n * @fileoverview entry point for your component library\n *\n * This is the entry point for your component library. Use this file to export utilities,\n * constants or data structure that accompany your components.\n *\n * DO NOT use this file to export your components. Instead, use the recommended approaches\n * to consume components of this package as outlined in the `README.md`.\n */\n\nexport { format } from './utils/utils';\nexport type * from './components.d.ts';\n"]}

package/dist/collection/types/enum.js

@@ -1,9 +0,0 @@
-export var SIZE_VAR;
-(function (SIZE_VAR) {
-    SIZE_VAR["XS"] = "XS";
-    SIZE_VAR["SM"] = "sm";
-    SIZE_VAR["MD"] = "md";
-    SIZE_VAR["LG"] = "lg";
-    SIZE_VAR["XL"] = "xl";
-})(SIZE_VAR || (SIZE_VAR = {}));
-//# sourceMappingURL=enum.js.map

package/dist/collection/types/enum.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"enum.js","sourceRoot":"","sources":["../../src/types/enum.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,QAMX;AAND,WAAY,QAAQ;IAClB,qBAAS,CAAA;IACT,qBAAS,CAAA;IACT,qBAAS,CAAA;IACT,qBAAS,CAAA;IACT,qBAAS,CAAA;AACX,CAAC,EANW,QAAQ,KAAR,QAAQ,QAMnB","sourcesContent":["export enum SIZE_VAR {\n  XS = 'XS',\n  SM = 'sm',\n  MD = 'md',\n  LG = 'lg',\n  XL = 'xl',\n}\n"]}

package/dist/collection/utils/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/utils/utils.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,MAAM,CAAC,KAAc,EAAE,MAAe,EAAE,IAAa;IACnE,OAAO,CAAC,KAAK,IAAI,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;AACjF,CAAC;AAED,MAAM,UAAU,YAAY;IAC1B,OAAO,sCAAsC,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,CAClE,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,eAAe,CAAC,IAAI,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAChF,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CACrB,CAA+C,EAC/C,SAAoD,EACpD,UAAgB,EAChB,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC","sourcesContent":["export function format(first?: string, middle?: string, last?: string): string {\n  return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');\n}\n\nexport function uidGenerator() {\n  return \"10000000-1000-4000-8000-100000000000\".replace(/[018]/g, c =>\n    (+c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> +c / 4).toString(16)\n  );\n}\n\n/**\n * Walks through the given DOM collection and runs the given callback.\n * @param a A DOM collection.\n * @param predicate The callback function.\n * @param [thisObject] The context object for the given callback function.\n */\nexport const forEach = (\n  a: NodeListOf<Node> | HTMLCollectionOf<Element>,\n  predicate: (search: Element, index?: number) => void,\n  thisObject?: any\n) => Array.prototype.forEach.call(a, predicate, thisObject);\n"]}