@eturnity/eturnity_reusable_components 8.26.0 → 8.26.2

package/dist/main.es12.js

@@ -1,6 +1,6 @@
 import "./main.es3.js";
-import { setupDevtoolsPlugin } from "./main.es15.js";
-import { shallowRef, unref, reactive, ref } from "./main.es16.js";
+import { setupDevtoolsPlugin } from "./main.es16.js";
+import { shallowRef, unref, reactive, ref } from "./main.es17.js";
 import { computed, nextTick, defineComponent, watch, inject, h, provide, watchEffect, getCurrentInstance } from "./main.es6.js";
 /*!
   * vue-router v4.2.2

package/dist/main.es13.js

@@ -1,8 +1,8 @@
 import styled from "./main.es7.js";
-import PanelRangeInfo from "./main.es17.js";
-import IconCollection from "./main.es18.js";
+import PanelRangeInfo from "./main.es18.js";
+import IconCollection from "./main.es19.js";
 import "./main.es3.js";
-import "./main.es19.js";
+import "./main.es20.js";
 import _export_sfc from "./main.es11.js";
 import { resolveComponent, openBlock, createElementBlock, createVNode, withCtx, createTextVNode, withDirectives, createElementVNode as createBaseVNode, Fragment } from "./main.es6.js";
 import { vModelText } from "./main.es5.js";

package/dist/main.es14.js

@@ -1,10 +1,10 @@
 import styled from "./main.es7.js";
-import InfoText from "./main.es20.js";
+import InfoText from "./main.es21.js";
 import "./main.es3.js";
 import _export_sfc from "./main.es11.js";
 import { withKeys, withModifiers } from "./main.es5.js";
 import { resolveComponent, openBlock, createBlock, withCtx, createVNode, createTextVNode, createCommentVNode } from "./main.es6.js";
-import { toDisplayString } from "./main.es21.js";
+import { toDisplayString } from "./main.es22.js";
 const Container = styled.div`
     display: inline-block;
   `;

package/dist/main.es15.js

@@ -1,26 +1,218 @@
-import { isProxyAvailable, getTarget, getDevtoolsGlobalHook } from "./main.es373.js";
-import { HOOK_SETUP } from "./main.es374.js";
-import { ApiProxy } from "./main.es375.js";
-function setupDevtoolsPlugin(pluginDescriptor, setupFn) {
-  const descriptor = pluginDescriptor;
-  const target = getTarget();
-  const hook = getDevtoolsGlobalHook();
-  const enableProxy = isProxyAvailable && descriptor.enableEarlyProxy;
-  if (hook && (target.__VUE_DEVTOOLS_PLUGIN_API_AVAILABLE__ || !enableProxy)) {
-    hook.emit(HOOK_SETUP, pluginDescriptor, setupFn);
-  } else {
-    const proxy = enableProxy ? new ApiProxy(descriptor, hook) : null;
-    const list = target.__VUE_DEVTOOLS_PLUGINS__ = target.__VUE_DEVTOOLS_PLUGINS__ || [];
-    list.push({
-      pluginDescriptor: descriptor,
-      setupFn,
-      proxy
-    });
-    if (proxy) {
-      setupFn(proxy.proxiedTarget);
+import styled from "./main.es7.js";
+import _sfc_main$1 from "./main.es24.js";
+import theme from "./main.es8.js";
+import "./main.es3.js";
+import _export_sfc from "./main.es11.js";
+import { resolveComponent, openBlock, createBlock, withCtx, createVNode, createCommentVNode, createTextVNode } from "./main.es6.js";
+import { toDisplayString } from "./main.es22.js";
+const PageContainer = styled.div``;
+const ButtonAttrs = {
+  type: String,
+  isDisabled: Boolean,
+  minWidth: String,
+  noWrap: Boolean,
+  height: String,
+  variant: String,
+  buttonSize: String,
+  appTheme: String
+};
+const ButtonContainer = styled("div", ButtonAttrs)`
+    display: flex;
+    justify-content: center;
+    padding: ${(props) => {
+  var _a, _b, _c, _d;
+  return (_d = (_c = (_b = (_a = props.theme) == null ? void 0 : _a.mainButton) == null ? void 0 : _b.size) == null ? void 0 : _c[props.buttonSize]) == null ? void 0 : _d.padding;
+}};
+    font-size: ${(props) => {
+  var _a, _b, _c, _d;
+  return (_d = (_c = (_b = (_a = props.theme) == null ? void 0 : _a.mainButton) == null ? void 0 : _b.size) == null ? void 0 : _c[props.buttonSize]) == null ? void 0 : _d.fontSize;
+}};
+    color: ${(props) => props.isDisabled ? props.theme.mainButton[props.appTheme][props.type][props.variant].disabled.textColor : props.theme.mainButton[props.appTheme][props.type][props.variant].default.textColor};
+    background-color: ${(props) => props.isDisabled ? props.theme.mainButton[props.appTheme][props.type][props.variant].disabled.backgroundColor : props.theme.mainButton[props.appTheme][props.type][props.variant].default.backgroundColor};
+    border: ${(props) => {
+  const borderValue = props.isDisabled ? props.theme.mainButton[props.appTheme][props.type][props.variant].disabled.borderColor : props.theme.mainButton[props.appTheme][props.type][props.variant].default.borderColor;
+  return borderValue ? "1px solid " + borderValue : "none";
+}};
+    border-radius: 4px;
+    text-align: center;
+    cursor: ${(props) => props.isDisabled ? "not-allowed" : "pointer"};
+    user-select: none;
+    ${(props) => props.minWidth ? `min-width: ${props.minWidth};` : ""};
+    ${(props) => props.noWrap ? `white-space: nowrap;` : ""};
+    height: ${(props) => props.height};
+    line-height: 1;
+
+    &:hover {
+      background-color: ${(props) => props.isDisabled ? props.theme.mainButton[props.appTheme][props.type][props.variant].disabled.backgroundColor : props.theme.mainButton[props.appTheme][props.type][props.variant].hover.backgroundColor};
+    }
+
+    &:active {
+      background-color: ${(props) => props.isDisabled ? props.theme.mainButton[props.appTheme][props.type][props.variant].disabled.backgroundColor : props.theme.mainButton[props.appTheme][props.type][props.variant].active.backgroundColor};
+    }
+  `;
+const AltAttrs = {
+  altStyle: Boolean,
+  color: String
+};
+styled("div", AltAttrs)`
+    background-color: ${(props) => props.color ? props.color : props.theme.colors.transparentWhite1};
+    padding: 7px;
+    height: 100%;
+    width: 30%;
+    justify-content: center;
+    display: flex;
+    align-items: center;
+    border-radius: 4px 0 0 4px;
+    color: ${(props) => props.theme.colors.white};
+    all: ${(props) => props.altStyle ? "" : "unset"};
+  `;
+styled("span", AltAttrs)`
+    padding: ${(props) => props.altStyle ? "7px" : "0"};
+    all: ${(props) => props.altStyle ? "" : "unset"};
+  `;
+const LabelAttrs = {
+  hasIcon: Boolean
+};
+const LabelComponent = styled("span", LabelAttrs)`
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: ${(props) => props.hasIcon ? "5px" : "0"};
+  `;
+const _sfc_main = {
+  name: "MainButton",
+  components: {
+    Icon: _sfc_main$1,
+    LabelComponent,
+    PageContainer,
+    ButtonContainer
+  },
+  props: {
+    type: {
+      required: false,
+      default: "primary",
+      // primary, secondary, tertiary, ghost
+      type: String
+    },
+    variant: {
+      required: false,
+      default: "main",
+      // main, cancel
+      type: String
+    },
+    isDisabled: {
+      required: false,
+      default: false,
+      type: Boolean
+    },
+    icon: {
+      required: false,
+      default: null,
+      type: String
+    },
+    iconColor: {
+      required: false,
+      default: "",
+      type: String
+    },
+    iconAltStyle: {
+      required: false,
+      default: false,
+      type: Boolean
+    },
+    iconAltStyleColor: {
+      required: false,
+      default: null,
+      type: String
+    },
+    text: {
+      required: true,
+      type: String
+    },
+    noWrap: {
+      required: false,
+      default: false,
+      type: Boolean
+    },
+    minWidth: {
+      required: false,
+      default: null,
+      type: String
+    },
+    height: {
+      required: false,
+      default: "auto",
+      type: String
+    },
+    id: {
+      required: false,
+      default: null,
+      type: String
+    },
+    dataId: {
+      type: String,
+      default: ""
+    },
+    dataQaId: {
+      type: String,
+      default: ""
+    },
+    appTheme: {
+      type: String,
+      default: "light"
+    },
+    buttonSize: {
+      type: String,
+      default: "medium",
+      required: false
+    }
+  },
+  computed: {
+    theme() {
+      return theme;
+    },
+    getIconColor() {
+      return this.isDisabled ? this.theme.mainButton[this.appTheme][this.type][this.variant].disabled.textColor : this.iconColor ? this.iconColor : this.theme.mainButton[this.appTheme][this.type][this.variant].default.textColor;
     }
   }
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_Icon = resolveComponent("Icon");
+  const _component_LabelComponent = resolveComponent("LabelComponent");
+  const _component_ButtonContainer = resolveComponent("ButtonContainer");
+  const _component_PageContainer = resolveComponent("PageContainer");
+  return openBlock(), createBlock(_component_PageContainer, null, {
+    default: withCtx(() => [createVNode(_component_ButtonContainer, {
+      id: $props.id,
+      "app-theme": $props.appTheme,
+      "button-size": $props.buttonSize,
+      "data-id": $props.dataId,
+      "data-qa-id": $props.dataQaId,
+      height: $props.height,
+      "is-disabled": $props.isDisabled,
+      "min-width": $props.minWidth,
+      "no-wrap": $props.noWrap,
+      type: $props.type,
+      variant: $props.variant
+    }, {
+      default: withCtx(() => [createVNode(_component_LabelComponent, {
+        "has-icon": Boolean($props.icon)
+      }, {
+        default: withCtx(() => [$props.icon ? (openBlock(), createBlock(_component_Icon, {
+          key: 0,
+          color: $options.getIconColor,
+          "hovered-color": $options.getIconColor,
+          name: $props.icon,
+          size: "14px"
+        }, null, 8, ["color", "hovered-color", "name"])) : createCommentVNode("", true), createTextVNode(" " + toDisplayString($props.text), 1)]),
+        _: 1
+      }, 8, ["has-icon"])]),
+      _: 1
+    }, 8, ["id", "app-theme", "button-size", "data-id", "data-qa-id", "height", "is-disabled", "min-width", "no-wrap", "type", "variant"])]),
+    _: 1
+  });
 }
+const RCButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {
-  setupDevtoolsPlugin
+  RCButton as default
 };