@topvisor/ui 0.0.17 → 0.0.33

package/light.css

@@ -1,136 +1 @@
-:root {
-	/* Main */
-	--color-primary: var(--color-blue-500);
-	--color-primary-light: var(--color-blue-100);
-	--color-primary-light-opacity: rgba(25, 117, 255, 0.11);
-	--color-primary-2: var(--color-blue-550);
-	--color-primary-2-light: var(--color-blue-150);
-	--color-primary-2-light-opacity: rgba(25, 117, 255, 0.22);
-
-	--color-secondary-opacity: rgba(14, 65, 142, 0.06);
-	--color-secondary-2-opacity: rgba(14, 65, 142, 0.08);
-	--color-secondary-3-opacity: rgba(14, 65, 142, 0.12);
-	
-	--color-positive: var(--color-green-500);
-	--color-positive-opacity: rgba(22, 196, 96, 0.3);
-	--color-positive-light: var(--color-green-100);
-	--color-positive-light-opacity: rgba(22, 196, 96, 0.11);
-	--color-positive-2: var(--color-green-500);
-	--color-positive-2-light: var(--color-green-150);
-	--color-positive-2-light-opacity: rgba(22, 196, 96, 0.22);
-
-	--color-warning: var(--color-orange-500);
-	--color-warning-opacity: rgba(255, 170, 51, 0.3);
-	--color-warning-light: var(--color-orange-100);
-	--color-warning-light-opacity: rgba(255, 170, 51, 0.12);
-	--color-warning-2: var(--color-orange-550);
-	--color-warning-2-light: var(--color-orange-150);
-	--color-warning-2-light-opacity: rgba(255, 159, 25, 0.22);
-
-	--color-negative: var(--color-red-500);
-	--color-negative-opacity: rgba(234, 65, 50, 0.3);
-	--color-negative-light: var(--color-red-100);
-	--color-negative-light-opacity: rgba(234, 65, 50, 0.11);
-	--color-negative-2: var(--color-red-550);
-	--color-negative-2-light: var(--color-red-150);
-	--color-negative-2-light-opacity: rgba(234, 65, 50, 0.22);
-
-	/* Text */
-	--color-text-1: var(--color-theme-975);
-	--color-text-2: var(--color-theme-750);
-	--color-text-3: var(--color-theme-550);
-	--color-text-4: var(--color-theme-450);
-	--color-text: var(--color-text-1);
-
-	--color-text-secondary: var(--color-gray-250); 
-	--color-text-secondary-2: var(--color-gray-350);
-
-	--color-text-link: var(--color-blue-550);
-	--color-text-link-hover: var(--color-blue-600);
-
-	--color-overlay: rgba(0, 0, 0, 0.5);
-
-	--color-placeholder: var(--color-gray-500);
-	--color-placeholder-active: var(--color-gray-300);
-
-	/* Background colors */
-	--color-bg-1: var(--color-steel-300);
-	--color-bg-2: var(--color-steel-150);
-	--color-bg-3: var(--color-white);
-
-	/* Line colors */
-	--color-line-1-opacity: rgba(14, 65, 142, 0.1);
-	--color-line-2-opacity: rgba(191, 203, 218, 0.67);
-	--color-line-3-opacity: rgba(143, 158, 178, 0.74);
-
-	/* Scroll */
-	--scroll-thumb-color: var(--color-theme-250);
-	--scroll-thumb-color-hover: var(--color-theme-350);
-	--scroll-thumb-color-active: var(--color-theme-500);
-
-	/* Page */
-	--body-background-color: var(--content-background-color);
-	--content-background-color: var(--color-bg-3);
-
-	/* Theme */
-	--color-theme-0: var(--color-bg-3);
-	--color-theme-25: rgba(251, 252, 253, 1);
-	--color-theme-50: rgba(248, 250, 252, 1);
-	--color-theme-75: rgba(241, 243, 247, 1);
-	--color-theme-100: rgba(233, 238, 243, 1);
-	--color-theme-125: rgba(226, 232, 238, 1);
-	--color-theme-150: rgba(220, 226, 234, 1);
-	--color-theme-200: rgba(213, 220, 230, 1);
-	--color-theme-250: rgba(206, 215, 226, 1);
-	--color-theme-300: rgba(199, 209, 222, 1);
-	--color-theme-350: rgba(191, 203, 218, 1);
-	--color-theme-400: rgba(181, 193, 208, 1);
-	--color-theme-450: rgba(172, 183, 198, 1);
-	--color-theme-500: rgba(161, 173, 188, 1);
-	--color-theme-525: rgba(151, 162, 178, 1);
-	--color-theme-550: rgba(141, 152, 167, 1);
-	--color-theme-600: rgba(129, 142, 161, 1);
-	--color-theme-650: rgba(117, 131, 150, 1);
-	--color-theme-700: rgba(105, 118, 135, 1);
-	--color-theme-750: rgba(94, 105, 120, 1);
-	--color-theme-800: rgba(82, 92, 105, 1);
-	--color-theme-850: rgba(70, 79, 90, 1);
-	--color-theme-875: rgba(59, 66, 75, 1);
-	--color-theme-900: rgba(47, 52, 60, 1);
-	--color-theme-925: rgba(35, 39, 45, 1);
-	--color-theme-950: rgba(23, 26, 30, 1);
-	--color-theme-975: rgba(12, 13, 15, 1);
-	--color-theme-1000: rgba(0, 0, 0, 1);
-
-	/* top-shadow */
-	--top-shadow-s:
-		0px 0px 3px rgba(112, 144, 176, 0.07),
-		0px 5px 25px rgba(112, 144, 176, 0.12);
-	--top-shadow:
-		0px 0px 4px rgba(4, 9, 84, 0.08),
-		0px 4px 32px rgba(4, 9, 84, 0.1);
-	--top-shadow-b:
-		0px 0px 4px rgba(4, 36, 84, 0.08),
-		0px 18px 32px rgba(4, 25, 84, 0.18);
-
-	--top-shadow-darken: inset 1000px 1000px 1000px 1000px rgba(0, 0, 0, 0.03);
-	--top-shadow-darken-2: inset 1000px 1000px 1000px 1000px rgba(0, 0, 0, 0.07);
-	--top-shadow-darken-3: inset 1000px 1000px 1000px 1000px rgba(0, 0, 0, 0.14);
-}
-
-/* forms */
-:root {
-	/* for text */
-	--top-forms-color: var(--color-text-1);
-	--top-forms-color-disabled: var(--color-text-3);
-	/* for border */
-	--top-forms-border-color: var(--color-line-2-opacity);
-	--top-forms-border-color-hover: var(--color-primary);
-	--top-forms-border-color-disabled: var(--color-line-1-opacity);
-	/* for placeholder */
-	--top-forms-placeholder-color: var(--color-text-3);
-	--top-forms-placeholder-color-disabled: var(--color-text-4);
-	/* for background */
-	--top-forms-background-color: var(--color-bg-3);
-	--top-forms-background-color-hover: var(--color-bg-3);
-}
+:root{--color-primary: var(--color-blue-500);--color-primary-light: var(--color-blue-100);--color-primary-light-opacity: rgba(25, 117, 255, .11);--color-primary-2: var(--color-blue-550);--color-primary-2-light: var(--color-blue-150);--color-primary-2-light-opacity: rgba(25, 117, 255, .22);--color-secondary-opacity: rgba(14, 65, 142, .06);--color-secondary-2-opacity: rgba(14, 65, 142, .08);--color-secondary-3-opacity: rgba(14, 65, 142, .12);--color-positive: var(--color-green-500);--color-positive-opacity: rgba(22, 196, 96, .3);--color-positive-light: var(--color-green-100);--color-positive-light-opacity: rgba(22, 196, 96, .11);--color-positive-2: var(--color-green-500);--color-positive-2-light: var(--color-green-150);--color-positive-2-light-opacity: rgba(22, 196, 96, .22);--color-warning: var(--color-orange-500);--color-warning-opacity: rgba(255, 170, 51, .3);--color-warning-light: var(--color-orange-100);--color-warning-light-opacity: rgba(255, 170, 51, .12);--color-warning-2: var(--color-orange-550);--color-warning-2-light: var(--color-orange-150);--color-warning-2-light-opacity: rgba(255, 159, 25, .22);--color-negative: var(--color-red-500);--color-negative-opacity: rgba(234, 65, 50, .3);--color-negative-light: var(--color-red-100);--color-negative-light-opacity: rgba(234, 65, 50, .11);--color-negative-2: var(--color-red-550);--color-negative-2-light: var(--color-red-150);--color-negative-2-light-opacity: rgba(234, 65, 50, .22);--color-text-1: var(--color-theme-975);--color-text-2: var(--color-theme-750);--color-text-3: var(--color-theme-550);--color-text-4: var(--color-theme-450);--color-text: var(--color-text-1);--color-text-secondary: var(--color-gray-250);--color-text-secondary-2: var(--color-gray-350);--color-text-link: var(--color-blue-550);--color-text-link-hover: var(--color-blue-600);--color-overlay: rgba(0, 0, 0, .5);--color-placeholder: var(--color-gray-500);--color-placeholder-active: var(--color-gray-300);--color-bg-1: var(--color-steel-300);--color-bg-2: var(--color-steel-150);--color-bg-3: var(--color-white);--color-line-1-opacity: rgba(14, 65, 142, .1);--color-line-2-opacity: rgba(191, 203, 218, .67);--color-line-3-opacity: rgba(143, 158, 178, .74);--scroll-thumb-color: var(--color-theme-250);--scroll-thumb-color-hover: var(--color-theme-350);--scroll-thumb-color-active: var(--color-theme-500);--body-background-color: var(--content-background-color);--content-background-color: var(--color-bg-3);--color-theme-0: var(--color-bg-3);--color-theme-25: rgba(251, 252, 253, 1);--color-theme-50: rgba(248, 250, 252, 1);--color-theme-75: rgba(241, 243, 247, 1);--color-theme-100: rgba(233, 238, 243, 1);--color-theme-125: rgba(226, 232, 238, 1);--color-theme-150: rgba(220, 226, 234, 1);--color-theme-200: rgba(213, 220, 230, 1);--color-theme-250: rgba(206, 215, 226, 1);--color-theme-300: rgba(199, 209, 222, 1);--color-theme-350: rgba(191, 203, 218, 1);--color-theme-400: rgba(181, 193, 208, 1);--color-theme-450: rgba(172, 183, 198, 1);--color-theme-500: rgba(161, 173, 188, 1);--color-theme-525: rgba(151, 162, 178, 1);--color-theme-550: rgba(141, 152, 167, 1);--color-theme-600: rgba(129, 142, 161, 1);--color-theme-650: rgba(117, 131, 150, 1);--color-theme-700: rgba(105, 118, 135, 1);--color-theme-750: rgba(94, 105, 120, 1);--color-theme-800: rgba(82, 92, 105, 1);--color-theme-850: rgba(70, 79, 90, 1);--color-theme-875: rgba(59, 66, 75, 1);--color-theme-900: rgba(47, 52, 60, 1);--color-theme-925: rgba(35, 39, 45, 1);--color-theme-950: rgba(23, 26, 30, 1);--color-theme-975: rgba(12, 13, 15, 1);--color-theme-1000: rgba(0, 0, 0, 1);--top-shadow-s: 0px 0px 3px rgba(112, 144, 176, .07), 0px 5px 25px rgba(112, 144, 176, .12);--top-shadow: 0px 0px 4px rgba(4, 9, 84, .08), 0px 4px 32px rgba(4, 9, 84, .1);--top-shadow-b: 0px 0px 4px rgba(4, 36, 84, .08), 0px 18px 32px rgba(4, 25, 84, .18);--top-shadow-darken: inset 1000px 1000px 1000px 1000px rgba(0, 0, 0, .03);--top-shadow-darken-2: inset 1000px 1000px 1000px 1000px rgba(0, 0, 0, .07);--top-shadow-darken-3: inset 1000px 1000px 1000px 1000px rgba(0, 0, 0, .14)}:root{--top-forms-color: var(--color-text-1);--top-forms-color-disabled: var(--color-text-3);--top-forms-border-color: var(--color-line-2-opacity);--top-forms-border-color-hover: var(--color-primary);--top-forms-border-color-disabled: var(--color-line-1-opacity);--top-forms-placeholder-color: var(--color-text-3);--top-forms-placeholder-color-disabled: var(--color-text-4);--top-forms-background-color: var(--color-bg-3);--top-forms-background-color-hover: var(--color-bg-3)}

package/package.json

@@ -1,19 +1,19 @@
-{
-  "name": "@topvisor/ui",
-  "private": false,
-  "version": "0.0.17",
-  "type": "module",
-  "description": "Topvisor UI-kit Vue",
-  "author": "Topvisor",
-  "keywords": [
-    "topvisor",
-    "vue",
-    "ui framework",
-    "component framework",
-    "component library"
-  ],
-  "license": "MIT",
-  "peerDependencies": {
-    "vue": "^3.3.4"
-  }
-}
+{
+  "name": "@topvisor/ui",
+  "private": false,
+  "version": "0.0.33",
+  "type": "module",
+  "description": "Topvisor UI-kit Vue",
+  "author": "Topvisor",
+  "keywords": [
+    "topvisor",
+    "vue",
+    "ui framework",
+    "component framework",
+    "component library"
+  ],
+  "license": "MIT",
+  "peerDependencies": {
+    "vue": "^3.3.4"
+  }
+}

package/popup/popup.amd.js

@@ -1,198 +1,3 @@
-define(["exports", "vue", "./worker.amd", "../.chunks/core-51f7b679.amd", "../utils/device.amd", "../utils/dom.amd"], function(exports, vue, popup_worker, core_core, utils_device, utils_dom) {
-  "use strict"; if(typeof vue === "undefined") var vue = window.Vue;
-  var __vite_style__ = document.createElement("style");
-  __vite_style__.textContent = "\nh3[data-top-popup],\ndiv[data-top-popup],\ni[data-top-popup]:not(.btn):not(.g_btn),\nb[data-top-popup]:not(.btn):not(.g_btn) {\n	cursor: pointer;\n	user-select: none;\n	font-style: normal;\n	text-decoration: none;\n	display: inline-flex;\n	align-items: center;\n}\n[data-top-popup][data-top-popup-disabled] {\n	pointer-events: none;\n	cursor: auto !important;\n}\ni[contenteditable] {\n	cursor: text !important;\n}\n";
-  document.head.appendChild(__vite_style__);
-  var POS = /* @__PURE__ */ ((POS2) => {
-    POS2["over"] = "0";
-    POS2["top"] = "1";
-    POS2["right"] = "2";
-    POS2["bottom"] = "3";
-    POS2["left"] = "4";
-    return POS2;
-  })(POS || {});
-  var POS_BY = /* @__PURE__ */ ((POS_BY2) => {
-    POS_BY2["fixed"] = "fixed";
-    POS_BY2["left"] = "left";
-    POS_BY2["right"] = "right";
-    return POS_BY2;
-  })(POS_BY || {});
-  const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
-    __name: "opener",
-    props: {
-      id: {},
-      pos: { default: POS.bottom },
-      notch: { type: Boolean, default: true },
-      openByHover: { type: Boolean },
-      posBy: { default: POS_BY.fixed }
-    },
-    setup(__props) {
-      const props = __props;
-      const id = props.id || Math.random() + "";
-      let elOpener;
-      function render(el) {
-        setTimeout(() => {
-          elOpener = el.nextElementSibling;
-          if (elOpener) {
-            renderOpener(elOpener);
-          }
-        });
-      }
-      vue.onUpdated(() => {
-        if (elOpener) {
-          renderOpener(elOpener);
-        }
-      });
-      function renderOpener(elOpener2) {
-        elOpener2.dataset.topPopup = "vue-" + id;
-        elOpener2.dataset.topPopupId = id;
-        elOpener2.dataset.topPopupP = props.pos;
-        elOpener2.dataset.topPopupPosBy = props.posBy;
-        elOpener2.dataset.topPopupNotch = props.notch ? "true" : "";
-        elOpener2.dataset.topPopupOpenByHover = props.openByHover ? "true" : "";
-      }
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
-          vue.createElementVNode("template", { ref: render }),
-          vue.renderSlot(_ctx.$slots, "default")
-        ], 64);
-      };
-    }
-  });
-  const opener_vue_vue_type_style_index_0_lang = "";
-  const _hoisted_1 = {
-    key: 0,
-    class: "top-popup_header"
-  };
-  const _hoisted_2 = {
-    key: 1,
-    class: "top-popup_content"
-  };
-  const _hoisted_3 = {
-    key: 2,
-    class: "top-popup_content"
-  };
-  const _hoisted_4 = {
-    key: 3,
-    class: "top-popup_footer"
-  };
-  const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
-    __name: "popup",
-    props: {
-      id: { default: "" },
-      class: {},
-      pos: { default: POS.bottom },
-      notch: { type: Boolean, default: true },
-      openByHover: { type: Boolean },
-      posBy: { default: POS_BY.fixed }
-    },
-    emits: ["open", "close"],
-    setup(__props, { emit }) {
-      const props = __props;
-      const id = props.id || Math.random() + "";
-      const elPopupRef = vue.ref(null);
-      const onOpen = async (popup) => {
-        popup.elPopupInner.innerText = "";
-        elPopupRef.value = popup.elPopupInner;
-        vueConnector.opened = true;
-        vueConnector.popup = popup;
-        emit("open");
-      };
-      const onClose = (popup) => {
-        elPopupRef.value = null;
-        vueConnector.opened = false;
-        vueConnector.popup = null;
-        emit("close");
-      };
-      const vueConnector = {
-        onOpen,
-        onClose,
-        classRef: vue.toRef(props, "class"),
-        opened: false,
-        popup: null
-      };
-      popup_worker.regVueComponent(id, vueConnector);
-      vue.onUnmounted(() => {
-        popup_worker.unregVueComponent(id);
-      });
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
-          _ctx.$slots.opener ? (vue.openBlock(), vue.createBlock(_sfc_main$2, {
-            key: 0,
-            id: vue.unref(id),
-            pos: _ctx.pos,
-            posBy: _ctx.posBy,
-            notch: _ctx.notch,
-            openByHover: _ctx.openByHover
-          }, {
-            default: vue.withCtx(() => [
-              vue.renderSlot(_ctx.$slots, "opener")
-            ]),
-            _: 3
-          }, 8, ["id", "pos", "posBy", "notch", "openByHover"])) : vue.createCommentVNode("", true),
-          elPopupRef.value ? (vue.openBlock(), vue.createBlock(vue.Teleport, {
-            key: 1,
-            to: elPopupRef.value
-          }, [
-            _ctx.$slots.header ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
-              vue.renderSlot(_ctx.$slots, "header")
-            ])) : vue.createCommentVNode("", true),
-            _ctx.$slots.content ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
-              vue.renderSlot(_ctx.$slots, "content")
-            ])) : vue.createCommentVNode("", true),
-            _ctx.$slots.contentList ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_3, [
-              vue.renderSlot(_ctx.$slots, "contentList")
-            ])) : vue.createCommentVNode("", true),
-            _ctx.$slots.footer ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, [
-              vue.renderSlot(_ctx.$slots, "footer")
-            ])) : vue.createCommentVNode("", true)
-          ], 8, ["to"])) : vue.createCommentVNode("", true)
-        ], 64);
-      };
-    }
-  });
-  const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-    ...{
-      inheritAttrs: false
-    },
-    __name: "listItem",
-    props: {
-      type: { default: "simple" },
-      closeByClick: { type: Boolean, default: true }
-    },
-    setup(__props) {
-      const props = __props;
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("li", {
-          class: vue.normalizeClass({
-            "top-popup_listDelimiter": _ctx.type === "delimiter",
-            "top-popup_listTitle": _ctx.type === "title"
-          })
-        }, [
-          props.type === "simple" || props.type === "link" ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(props.type === "link" ? "a" : "i"), vue.mergeProps({
-            key: 0,
-            class: {
-              "top-popup_item": true,
-              "top-popup_item-a": props.type === "simple",
-              // имитация оформления ссылки
-              "a": true,
-              // deprecated
-              "top-popup-noCloser": !_ctx.closeByClick
-            }
-          }, _ctx.$attrs), {
-            default: vue.withCtx(() => [
-              vue.renderSlot(_ctx.$slots, "default")
-            ]),
-            _: 3
-          }, 16, ["class"])) : vue.createCommentVNode("", true),
-          props.type === "title" || props.type === "control" ? vue.renderSlot(_ctx.$slots, "default", { key: 1 }) : vue.createCommentVNode("", true)
-        ], 2);
-      };
-    }
-  });
-  exports.Popup = _sfc_main$1;
-  exports.PopupListItem = _sfc_main;
-  exports.PopupOpener = _sfc_main$2;
-  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-});
+define(["exports","vue","./worker.amd","../.chunks/forms-cab135c7.amd","../utils/dom.amd"],function(d,e,i,C,P){"use strict"; if(typeof vue === "undefined") var vue = window.Vue;var m=document.createElement("style");m.textContent=`h3[data-top-popup],div[data-top-popup],i[data-top-popup]:not(.btn):not(.g_btn),b[data-top-popup]:not(.btn):not(.g_btn){cursor:pointer;-webkit-user-select:none;user-select:none;font-style:normal;text-decoration:none;display:inline-flex;align-items:center}[data-top-popup][data-top-popup-disabled]{pointer-events:none;cursor:auto!important}i[contenteditable]{cursor:text!important}
+`,document.head.appendChild(m);const u=e.defineComponent({__name:"opener",props:{id:{},pos:{default:"3"},notch:{type:Boolean,default:!0},openByHover:{type:Boolean},posBy:{default:"fixed"}},setup(a){const t=a,n=t.id||Math.random()+"";let l;function s(p){setTimeout(()=>{l=p.nextElementSibling,l&&c(l)})}e.onUpdated(()=>{l&&c(l)});function c(p){p.dataset.topPopup="vue-"+n,p.dataset.topPopupId=n,p.dataset.topPopupP=t.pos,p.dataset.topPopupPosBy=t.posBy,p.dataset.topPopupNotch=t.notch?"true":"",p.dataset.topPopupOpenByHover=t.openByHover?"true":""}return(p,r)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("template",{ref:s}),e.renderSlot(p.$slots,"default")],64))}}),$="",y={key:0,class:"top-popup_header"},f={key:1,class:"top-popup_content"},B={key:2,class:"top-popup_content"},k={key:3,class:"top-popup_footer"},_=e.defineComponent({__name:"popup",props:{id:{default:""},class:{},pos:{default:"3"},notch:{type:Boolean,default:!0},openByHover:{type:Boolean},posBy:{default:"fixed"}},emits:["open","close"],setup(a,{emit:t}){const n=a,l=n.id||Math.random()+"",s=e.ref(null),r={onOpen:async o=>{o.elPopupInner.innerText="",s.value=o.elPopupInner,r.opened=!0,r.popup=o,t("open")},onClose:o=>{s.value=null,r.opened=!1,r.popup=null,t("close")},classRef:e.toRef(n,"class"),opened:!1,popup:null};return i.regVueComponent(l,r),e.onUnmounted(()=>{i.unregVueComponent(l)}),(o,g)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[o.$slots.opener?(e.openBlock(),e.createBlock(u,{key:0,id:e.unref(l),pos:o.pos,posBy:o.posBy,notch:o.notch,openByHover:o.openByHover},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"opener")]),_:3},8,["id","pos","posBy","notch","openByHover"])):e.createCommentVNode("",!0),s.value?(e.openBlock(),e.createBlock(e.Teleport,{key:1,to:s.value},[o.$slots.header?(e.openBlock(),e.createElementBlock("div",y,[e.renderSlot(o.$slots,"header")])):e.createCommentVNode("",!0),o.$slots.content?(e.openBlock(),e.createElementBlock("div",f,[e.renderSlot(o.$slots,"content")])):e.createCommentVNode("",!0),o.$slots.contentList?(e.openBlock(),e.createElementBlock("ul",B,[e.renderSlot(o.$slots,"contentList")])):e.createCommentVNode("",!0),o.$slots.footer?(e.openBlock(),e.createElementBlock("div",k,[e.renderSlot(o.$slots,"footer")])):e.createCommentVNode("",!0)],8,["to"])):e.createCommentVNode("",!0)],64))}}),h=e.defineComponent({inheritAttrs:!1,__name:"listItem",props:{type:{default:"simple"},closeByClick:{type:Boolean,default:!0}},setup(a){const t=a;return(n,l)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass({"top-popup_listDelimiter":n.type==="delimiter","top-popup_listTitle":n.type==="title"})},[t.type==="simple"||t.type==="link"?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.type==="link"?"a":"i"),e.mergeProps({key:0,class:{"top-popup_item":!0,"top-popup_item-a":t.type==="simple",a:!0,"top-popup-noCloser":!n.closeByClick}},n.$attrs),{default:e.withCtx(()=>[e.renderSlot(n.$slots,"default")]),_:3},16,["class"])):e.createCommentVNode("",!0),t.type==="title"||t.type==="control"?e.renderSlot(n.$slots,"default",{key:1}):e.createCommentVNode("",!0)],2))}});d.Popup=_,d.PopupListItem=h,d.PopupOpener=u,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})});
 //# sourceMappingURL=popup.amd.js.map

package/popup/popup.amd.js.map

@@ -1 +1 @@
-{"version":3,"file":"popup.amd.js","sources":["../../src/components/popup/popup/popup.ts","../../src/components/popup/popup/opener.vue","../../src/components/popup/popup/popup.vue"],"sourcesContent":["export interface Props extends OpenerProps {\n\t/**\n\t * Уникальный id компонента, используется только в setup, т.е. изменение id будет проигнорировано\n\t *\n\t * Генерируется автоматически при создании кнопки Popup\n\t *\n\t * Можно задать вручную, если необходимо создать Popup без кнопки для последюущего использования,\n\t * особенно важно при создании большого числа кнопок, например в списках и таблицах\n\t */\n\tid?: string;\n\n\t/**\n\t * Класс, который нужно добавить к Popup, устанавилвается в момент открытия\n\t */\n\tclass?: string;\n}\n\nexport interface Emits {\n\t/**\n\t * Будет вызвано при открытии Popup\n\t */\n\t(e: 'open'): void;\n\n\t/**\n\t * Будет вызвано после закрытия Popup\n\t */\n\t(e: 'close'): void;\n}\n\nexport interface OpenerProps {\n\t/**\n\t * id компонента Popup, который необходимо открыть\n\t */\n\tid?: string;\n\n\t/**\n\t * Положение Popup по часовой стрелке\n\t */\n\tpos?: POS;\n\n\t/**\n\t * Добавить клювик\n\t */\n\tnotch?: boolean;\n\n\t/**\n\t * Открывать / закрывать при наведении / отведении мыши\n\t */\n\topenByHover?: boolean;\n\n\t/**\n\t * Способ привязки позиционирования меню\n\t *\n\t * left/right - левый/правый край родителя\n\t *\n\t * fixed - по окну\n\t */\n\tposBy?: POS_BY;\n}\n\nexport interface ListItemProps {\n\t/**\n\t * Тип элемента списка\n\t * * simple - обычный кликабельный (выбираемый) элемент\n\t * * link - ссылка\n\t * * control - элемент формы, например чекбокс\n\t * * delimiter - разделитель\n\t */\n\ttype?: 'simple' | 'link' | 'control' | 'title' | 'delimiter';\n\n\t/**\n\t * Следует ли закрывать меню по клику на элемент типа simple и link\n\t */\n\tcloseByClick?: boolean;\n}\n\nexport enum POS {\n\tover = '0',\n\ttop = '1',\n\tright = '2',\n\tbottom = '3',\n\tleft = '4'\n}\n\nexport enum POS_BY {\n\tfixed = 'fixed',\n\tleft = 'left',\n\tright = 'right',\n}","<script setup lang=\"ts\">\nimport { onUpdated, ref } from 'vue';\nimport type { OpenerProps } from './popup';\nimport { POS, POS_BY } from './popup';\n\nconst props = withDefaults(defineProps<OpenerProps>(), {\n\tpos: POS.bottom,\n\tnotch: true,\n\tposBy: POS_BY.fixed,\n});\n\nconst id = props.id || Math.random() + '';\n\nlet elOpener: Element;\n\n/**\n * Необычная функция для проброски props внтурь элемента слота\n *\n * @param el - вспомогательрный элемент для доступа к элементам слота\n */\nfunction render (el: any) {\n\tsetTimeout(() => {\n\t\telOpener = el.nextElementSibling;\n\n\t\tif (elOpener) {\n\t\t\trenderOpener(elOpener);\n\t\t}\n\t});\n}\n\nonUpdated(() => {\n\tif (elOpener) {\n\t\trenderOpener(elOpener);\n\t}\n});\n\nfunction renderOpener (elOpener: any) {\n\telOpener.dataset.topPopup = 'vue-' + id;\n\telOpener.dataset.topPopupId = id;\n\telOpener.dataset.topPopupP = props.pos;\n\telOpener.dataset.topPopupPosBy = props.posBy;\n\telOpener.dataset.topPopupNotch = props.notch ? 'true' : '';\n\telOpener.dataset.topPopupOpenByHover = props.openByHover ? 'true' : '';\n}\n</script>\n\n<template>\n\t<template :ref=\"render\"></template>\n\n\t<!-- @slot элемент для открытия Popup -->\n\t<slot></slot>\n</template>\n\n<style>\nh3[data-top-popup],\ndiv[data-top-popup],\ni[data-top-popup]:not(.btn):not(.g_btn),\nb[data-top-popup]:not(.btn):not(.g_btn) {\n\tcursor: pointer;\n\tuser-select: none;\n\tfont-style: normal;\n\ttext-decoration: none;\n\tdisplay: inline-flex;\n\talign-items: center;\n}\n\n[data-top-popup][data-top-popup-disabled] {\n\tpointer-events: none;\n\tcursor: auto !important;\n}\n\ni[contenteditable] {\n\tcursor: text !important;\n}\n</style>","<script setup lang=\"ts\">\nimport { ref, toRef, onUnmounted } from 'vue';\nimport type { Props, Emits } from './popup';\nimport { POS, POS_BY } from './popup';\nimport Opener from './opener.vue';\nimport Worker from '@/components/popup/lib/worker';\n\nconst props = withDefaults(defineProps<Props>(), {\n\tid: '',\n\tpos: POS.bottom,\n\tnotch: true,\n\tposBy: POS_BY.fixed,\n});\n\nconst emit = defineEmits<Emits>();\n\nconst id = props.id || Math.random() + '';\nconst elPopupRef = ref(null);\n\n// см. lib/popup\nconst onOpen = async (popup: any) => {\n\tpopup.elPopupInner.innerText = '';\n\n\telPopupRef.value = popup.elPopupInner;\n\n\tvueConnector.opened = true;\n\tvueConnector.popup = popup;\n\n\temit('open');\n};\n\n// см. lib/popup\nconst onClose = (popup: any) => {\n\telPopupRef.value = null;\n\n\tvueConnector.opened = false;\n\tvueConnector.popup = null;\n\n\temit('close');\n};\n\nconst vueConnector = {\n\tonOpen,\n\tonClose,\n\tclassRef: toRef(props, 'class'),\n\topened: false,\n\tpopup: null,\n};\n\nWorker.regVueComponent(id, vueConnector);\n\nonUnmounted(() => {\n\tWorker.unregVueComponent(id);\n});\n</script>\n\n<template>\n\t<Opener\n\t\tv-if=\"$slots.opener\"\n\t\t:id=\"id\"\n\t\t:pos=\"pos\"\n\t\t:posBy=\"posBy\"\n\t\t:notch=\"notch\"\n\t\t:openByHover=\"openByHover\"\n\t>\n\t\t<!-- @slot элемент для открытия Popup -->\n\t\t<slot name=\"opener\"></slot>\n\t</Opener>\n\n\t<!-- Это шаблон для компонента Popup, сам Popup генерируется в js и может находиться где угодно -->\n\t<!-- elPopupRef будет установлен только после открытия и будет сброшен сразу после закрытия Popup -->\n\t<teleport\n\t\tv-if=\"elPopupRef\"\n\t\t:to=\"elPopupRef\"\n\t>\n\t\t<div v-if=\"$slots.header\" class=\"top-popup_header\">\n\t\t\t<!-- @slot Шапка -->\n\t\t\t<slot name=\"header\"></slot>\n\t\t</div>\n\n\t\t<div v-if=\"$slots.content\" class=\"top-popup_content\">\n\t\t\t<!-- @slot Контент в свободной форме -->\n\t\t\t<slot name=\"content\"></slot>\n\t\t</div>\n\n\t\t<ul v-if=\"$slots.contentList\" class=\"top-popup_content\">\n\t\t\t<!-- @slot Контент в виде списка, для вставки элементов списка испоьзуйте компонент popup/listItem -->\n\t\t\t<slot name=\"contentList\"></slot>\n\t\t</ul>\n\n\t\t<div v-if=\"$slots.footer\" class=\"top-popup_footer\">\n\t\t\t<!-- @slot Футер -->\n\t\t\t<slot name=\"footer\"></slot>\n\t\t</div>\n\t</teleport>\n</template>"],"names":["POS","POS_BY","onUpdated","elOpener","ref","toRef","Worker","onUnmounted"],"mappings":";;;;;AA4EY,MAAA,wBAAAA,SAAL;AACNA,SAAA,MAAO,IAAA;AACPA,SAAA,KAAM,IAAA;AACNA,SAAA,OAAQ,IAAA;AACRA,SAAA,QAAS,IAAA;AACTA,SAAA,MAAO,IAAA;AALIA,WAAAA;AAAAA,EAAA,GAAA,OAAA,CAAA,CAAA;AAQA,MAAA,2BAAAC,YAAL;AACNA,YAAA,OAAQ,IAAA;AACRA,YAAA,MAAO,IAAA;AACPA,YAAA,OAAQ,IAAA;AAHGA,WAAAA;AAAAA,EAAA,GAAA,UAAA,CAAA,CAAA;;;;;;;;;;;;ACzEZ,YAAM,KAAK,MAAM,MAAM,KAAK,OAAW,IAAA;AAEnC,UAAA;AAOJ,eAAS,OAAQ,IAAS;AACzB,mBAAW,MAAM;AAChB,qBAAW,GAAG;AAEd,cAAI,UAAU;AACb,yBAAa,QAAQ;AAAA,UACtB;AAAA,QAAA,CACA;AAAA,MACF;AAEAC,UAAAA,UAAU,MAAM;AACf,YAAI,UAAU;AACb,uBAAa,QAAQ;AAAA,QACtB;AAAA,MAAA,CACA;AAED,eAAS,aAAcC,WAAe;AACrCA,kBAAS,QAAQ,WAAW,SAAS;AACrCA,kBAAS,QAAQ,aAAa;AAC9BA,kBAAS,QAAQ,YAAY,MAAM;AACnCA,kBAAS,QAAQ,gBAAgB,MAAM;AACvCA,kBAAS,QAAQ,gBAAgB,MAAM,QAAQ,SAAS;AACxDA,kBAAS,QAAQ,sBAAsB,MAAM,cAAc,SAAS;AAAA,MACrE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3BA,YAAM,KAAK,MAAM,MAAM,KAAK,OAAW,IAAA;AACjC,YAAA,aAAaC,QAAI,IAAI;AAGrB,YAAA,SAAS,OAAO,UAAe;AACpC,cAAM,aAAa,YAAY;AAE/B,mBAAW,QAAQ,MAAM;AAEzB,qBAAa,SAAS;AACtB,qBAAa,QAAQ;AAErB,aAAK,MAAM;AAAA,MAAA;AAIN,YAAA,UAAU,CAAC,UAAe;AAC/B,mBAAW,QAAQ;AAEnB,qBAAa,SAAS;AACtB,qBAAa,QAAQ;AAErB,aAAK,OAAO;AAAA,MAAA;AAGb,YAAM,eAAe;AAAA,QACpB;AAAA,QACA;AAAA,QACA,UAAUC,IAAAA,MAAM,OAAO,OAAO;AAAA,QAC9B,QAAQ;AAAA,QACR,OAAO;AAAA,MAAA;AAGDC,mBAAA,gBAAgB,IAAI,YAAY;AAEvCC,UAAAA,YAAY,MAAM;AACjBD,qBAAO,kBAAkB,EAAE;AAAA,MAAA,CAC3B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"popup.amd.js","sources":["../../src/components/popup/popup/opener.vue","../../src/components/popup/popup/popup.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { onUpdated, ref } from 'vue';\r\nimport type { OpenerProps } from './popup';\r\n\r\nconst props = withDefaults(defineProps<OpenerProps>(), {\r\n\tpos: '3',\r\n\tnotch: true,\r\n\tposBy: 'fixed',\r\n});\r\n\r\nconst id = props.id || Math.random() + '';\r\n\r\nlet elOpener: Element;\r\n\r\n/**\r\n * Необычная функция для проброски props внтурь элемента слота\r\n *\r\n * @param el - вспомогательрный элемент для доступа к элементам слота\r\n */\r\nfunction render (el: any) {\r\n\tsetTimeout(() => {\r\n\t\telOpener = el.nextElementSibling;\r\n\r\n\t\tif (elOpener) {\r\n\t\t\trenderOpener(elOpener);\r\n\t\t}\r\n\t});\r\n}\r\n\r\nonUpdated(() => {\r\n\tif (elOpener) {\r\n\t\trenderOpener(elOpener);\r\n\t}\r\n});\r\n\r\nfunction renderOpener (elOpener: any) {\r\n\telOpener.dataset.topPopup = 'vue-' + id;\r\n\telOpener.dataset.topPopupId = id;\r\n\telOpener.dataset.topPopupP = props.pos;\r\n\telOpener.dataset.topPopupPosBy = props.posBy;\r\n\telOpener.dataset.topPopupNotch = props.notch ? 'true' : '';\r\n\telOpener.dataset.topPopupOpenByHover = props.openByHover ? 'true' : '';\r\n}\r\n</script>\r\n\r\n<template>\r\n\t<template :ref=\"render\"></template>\r\n\r\n\t<!-- @slot элемент для открытия Popup -->\r\n\t<slot></slot>\r\n</template>\r\n\r\n<style>\r\nh3[data-top-popup],\r\ndiv[data-top-popup],\r\ni[data-top-popup]:not(.btn):not(.g_btn),\r\nb[data-top-popup]:not(.btn):not(.g_btn) {\r\n\tcursor: pointer;\r\n\tuser-select: none;\r\n\tfont-style: normal;\r\n\ttext-decoration: none;\r\n\tdisplay: inline-flex;\r\n\talign-items: center;\r\n}\r\n\r\n[data-top-popup][data-top-popup-disabled] {\r\n\tpointer-events: none;\r\n\tcursor: auto !important;\r\n}\r\n\r\ni[contenteditable] {\r\n\tcursor: text !important;\r\n}\r\n</style>","<script setup lang=\"ts\">\r\nimport { ref, toRef, onUnmounted } from 'vue';\r\nimport type { Props, Emits } from './popup';\r\nimport Opener from './opener.vue';\r\nimport Worker from '@/components/popup/lib/worker';\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\tid: '',\r\n\tpos: '3',\r\n\tnotch: true,\r\n\tposBy: 'fixed',\r\n});\r\n\r\nconst emit = defineEmits<Emits>();\r\n\r\nconst id = props.id || Math.random() + '';\r\nconst elPopupRef = ref(null);\r\n\r\n// см. lib/popup\r\nconst onOpen = async (popup: any) => {\r\n\tpopup.elPopupInner.innerText = '';\r\n\r\n\telPopupRef.value = popup.elPopupInner;\r\n\r\n\tvueConnector.opened = true;\r\n\tvueConnector.popup = popup;\r\n\r\n\temit('open');\r\n};\r\n\r\n// см. lib/popup\r\nconst onClose = (popup: any) => {\r\n\telPopupRef.value = null;\r\n\r\n\tvueConnector.opened = false;\r\n\tvueConnector.popup = null;\r\n\r\n\temit('close');\r\n};\r\n\r\nconst vueConnector = {\r\n\tonOpen,\r\n\tonClose,\r\n\tclassRef: toRef(props, 'class'),\r\n\topened: false,\r\n\tpopup: null,\r\n};\r\n\r\nWorker.regVueComponent(id, vueConnector);\r\n\r\nonUnmounted(() => {\r\n\tWorker.unregVueComponent(id);\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<Opener\r\n\t\tv-if=\"$slots.opener\"\r\n\t\t:id=\"id\"\r\n\t\t:pos=\"pos\"\r\n\t\t:posBy=\"posBy\"\r\n\t\t:notch=\"notch\"\r\n\t\t:openByHover=\"openByHover\"\r\n\t>\r\n\t\t<!-- @slot элемент для открытия Popup -->\r\n\t\t<slot name=\"opener\"></slot>\r\n\t</Opener>\r\n\r\n\t<!-- Это шаблон для компонента Popup, сам Popup генерируется в js и может находиться где угодно -->\r\n\t<!-- elPopupRef будет установлен только после открытия и будет сброшен сразу после закрытия Popup -->\r\n\t<teleport\r\n\t\tv-if=\"elPopupRef\"\r\n\t\t:to=\"elPopupRef\"\r\n\t>\r\n\t\t<div v-if=\"$slots.header\" class=\"top-popup_header\">\r\n\t\t\t<!-- @slot Шапка -->\r\n\t\t\t<slot name=\"header\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<div v-if=\"$slots.content\" class=\"top-popup_content\">\r\n\t\t\t<!-- @slot Контент в свободной форме -->\r\n\t\t\t<slot name=\"content\"></slot>\r\n\t\t</div>\r\n\r\n\t\t<ul v-if=\"$slots.contentList\" class=\"top-popup_content\">\r\n\t\t\t<!-- @slot Контент в виде списка, для вставки элементов списка испоьзуйте компонент popup/listItem -->\r\n\t\t\t<slot name=\"contentList\"></slot>\r\n\t\t</ul>\r\n\r\n\t\t<div v-if=\"$slots.footer\" class=\"top-popup_footer\">\r\n\t\t\t<!-- @slot Футер -->\r\n\t\t\t<slot name=\"footer\"></slot>\r\n\t\t</div>\r\n\t</teleport>\r\n</template>"],"names":["id","props","elOpener","render","el","renderOpener","onUpdated","elPopupRef","ref","vueConnector","popup","emit","toRef","Worker","onUnmounted"],"mappings":";gNAUMA,EAAKC,EAAM,IAAM,KAAK,OAAW,EAAA,GAEnC,IAAAC,EAOJ,SAASC,EAAQC,EAAS,CACzB,WAAW,IAAM,CAChBF,EAAWE,EAAG,mBAEVF,GACHG,EAAaH,CAAQ,CACtB,CACA,CACF,CAEAI,EAAAA,UAAU,IAAM,CACXJ,GACHG,EAAaH,CAAQ,CACtB,CACA,EAED,SAASG,EAAcH,EAAe,CACrCA,EAAS,QAAQ,SAAW,OAASF,EACrCE,EAAS,QAAQ,WAAaF,EAC9BE,EAAS,QAAQ,UAAYD,EAAM,IACnCC,EAAS,QAAQ,cAAgBD,EAAM,MACvCC,EAAS,QAAQ,cAAgBD,EAAM,MAAQ,OAAS,GACxDC,EAAS,QAAQ,oBAAsBD,EAAM,YAAc,OAAS,EACrE,sgBC3BMD,EAAKC,EAAM,IAAM,KAAK,OAAW,EAAA,GACjCM,EAAaC,MAAI,IAAI,EAwBrBC,EAAe,CACpB,OAtBc,MAAOC,GAAe,CACpCA,EAAM,aAAa,UAAY,GAE/BH,EAAW,MAAQG,EAAM,aAEzBD,EAAa,OAAS,GACtBA,EAAa,MAAQC,EAErBC,EAAK,MAAM,CAAA,EAeX,QAXgBD,GAAe,CAC/BH,EAAW,MAAQ,KAEnBE,EAAa,OAAS,GACtBA,EAAa,MAAQ,KAErBE,EAAK,OAAO,CAAA,EAMZ,SAAUC,EAAAA,MAAMX,EAAO,OAAO,EAC9B,OAAQ,GACR,MAAO,IAAA,EAGDY,OAAAA,EAAA,gBAAgBb,EAAIS,CAAY,EAEvCK,EAAAA,YAAY,IAAM,CACjBD,EAAO,kBAAkBb,CAAE,CAAA,CAC3B"}