@antify/ui 3.1.25 → 3.1.26

package/dist/components/AntButton.vue

@@ -10,12 +10,12 @@ import {
 } from 'vue-router';
 import AntSkeleton from './AntSkeleton.vue';
 import AntSpinner from './AntSpinner.vue';
+import {
+  AntSpinnerSize,
+} from './__types';
 import {
   Grouped,
 } from '../enums/Grouped.enum';
-import {
-  Size,
-} from '../enums/Size.enum';
 import {
   handleEnumValidation,
 } from '../handler';
@@ -24,6 +24,7 @@ import {
 } from '../enums';
 import {
   ButtonType,
+  ButtonSize,
 } from './__types';
 import AntIcon from './AntIcon.vue';
 import AntTooltip from './AntTooltip.vue';
@@ -42,7 +43,7 @@ defineEmits([
 
 const props = withDefaults(defineProps<{
   filled?: boolean;
-  size?: Size;
+  size?: ButtonSize;
   state?: State;
   iconLeft?: IconDefinition;
   iconRight?: IconDefinition;
@@ -66,7 +67,7 @@ const props = withDefaults(defineProps<{
   filled: false,
   skeleton: false,
   spinner: false,
-  size: Size.md,
+  size: ButtonSize.md,
   grouped: Grouped.none,
   readonly: false,
   expanded: false,
@@ -134,17 +135,18 @@ const classes = computed(() => {
   };
 
   return {
-    'transition-all inline-flex items-center justify-center font-medium cursor-pointer select-none': true,
+    'transition-all inline-flex items-center justify-center font-medium cursor-pointer select-none h-fit': true,
     'active:shadow-[inset_0_4px_4px_rgba(0,0,0,0.25)]': !hasInputState.value,
-    'p-1 text-xs gap-1': props.size === Size.xs2,
-    'p-1.5 text-xs gap-1.5': props.size === Size.xs,
-    'p-1.5 text-sm gap-1.5': props.size === Size.sm,
-    'p-2 text-sm gap-2': props.size === Size.md,
-    'p-2.5 text-sm gap-2.5': props.size === Size.lg,
+    'p-1 text-2xs gap-1': props.size === ButtonSize.xs3,
+    'p-1 text-xs gap-1': props.size === ButtonSize.xs2,
+    'p-1.5 text-xs gap-1.5': props.size === ButtonSize.xs,
+    'p-1.5 text-sm gap-1.5': props.size === ButtonSize.sm,
+    'p-2 text-sm gap-2': props.size === ButtonSize.md,
+    'p-2.5 text-sm gap-2.5': props.size === ButtonSize.lg,
     'disabled:opacity-50 disabled:cursor-not-allowed': true,
     'cursor-default': props.readonly,
-    'focus:ring-2': !props.readonly && props.size === Size.sm || props.size === Size.xs || props.size === Size.xs2,
-    'focus:ring-4': !props.readonly && props.size === Size.md || props.size === Size.lg,
+    'focus:ring-2': !props.readonly && props.size === ButtonSize.sm || props.size === ButtonSize.xs || props.size === ButtonSize.xs2 || props.size === ButtonSize.xs3,
+    'focus:ring-4': !props.readonly && props.size === ButtonSize.md || props.size === ButtonSize.lg,
     'w-full': props.expanded,
     'outline outline-1 outline-offset-[-1px]': props.outlined,
     ...groupedClassList.value,
@@ -192,15 +194,33 @@ const is = computed(() => {
   return props.to !== undefined ? 'router-link' : 'button';
 });
 const getIconSize = computed(() => {
-  if (props.size === Size.xs || props.size === Size.xs2) {
+  if (props.size === ButtonSize.xs || props.size === ButtonSize.xs2) {
     return IconSize.xs;
+  } else if (props.size === ButtonSize.xs3) {
+    return IconSize.xs2;
   } else {
     return IconSize.sm;
   }
 });
+const spinnerSize = computed(() => {
+  switch (props.size) {
+    case ButtonSize.lg:
+      return AntSpinnerSize.sm;
+    case ButtonSize.md:
+      return AntSpinnerSize.sm;
+    case ButtonSize.sm:
+      return AntSpinnerSize.sm;
+    case ButtonSize.xs:
+      return AntSpinnerSize.xs;
+    case ButtonSize.xs2:
+      return AntSpinnerSize.xs2;
+    default:
+      return AntSpinnerSize.xs2;
+  }
+});
 
 onMounted(() => {
-  handleEnumValidation(props.size, Size, 'size');
+  handleEnumValidation(props.size, ButtonSize, 'size');
   handleEnumValidation(props.state, State, 'state');
   handleEnumValidation(props.grouped, Grouped, 'grouped');
 });
@@ -236,7 +256,7 @@ onMounted(() => {
         >
           <AntSpinner
             v-if="spinner"
-            :size="size"
+            :size="spinnerSize"
             :state="state"
             :inverted="!filled"
           />

package/dist/components/AntTooltip.vue

@@ -170,11 +170,12 @@ function onClick() {
 
 <template>
   <div
-    class="relative"
+    class="relative h-fit"
     data-e2e="tooltip"
   >
     <div
       ref="reference"
+      class="flex"
       @mouseenter="() => onMouseOver()"
       @mouseleave="() => onMouseLeave()"
       @click="() => onClick()"

package/dist/components/__stories/AntButton.stories.js

@@ -8,10 +8,10 @@ var _AntButton = _interopRequireDefault(require("../AntButton.vue"));
 var _AntFormGroupLabel = _interopRequireDefault(require("../forms/AntFormGroupLabel.vue"));
 var _AntFormGroup = _interopRequireDefault(require("../forms/AntFormGroup.vue"));
 var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
-var _Size = require("../../enums/Size.enum");
 var _Grouped2 = require("../../enums/Grouped.enum");
 var _enums = require("../../enums");
 var _test = require("@storybook/test");
+var _AntButton2 = require("../__types/AntButton.types");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const meta = {
   component: _AntButton.default,
@@ -39,7 +39,7 @@ const meta = {
       control: {
         type: "select"
       },
-      options: Object.values(_Size.Size),
+      options: Object.values(_AntButton2.ButtonSize),
       description: "Defines the size of the button"
     },
     iconLeft: {

package/dist/components/__stories/AntButton.stories.mjs

@@ -5,9 +5,6 @@ import {
   faCaretRight,
   faCaretLeft
 } from "@fortawesome/free-solid-svg-icons";
-import {
-  Size
-} from "../../enums/Size.enum.mjs";
 import {
   Grouped as _Grouped
 } from "../../enums/Grouped.enum.mjs";
@@ -19,6 +16,9 @@ import {
 import {
   within
 } from "@storybook/test";
+import {
+  ButtonSize
+} from "../__types/AntButton.types.mjs";
 const meta = {
   component: AntButton,
   title: "Components/Button",
@@ -45,7 +45,7 @@ const meta = {
       control: {
         type: "select"
       },
-      options: Object.values(Size),
+      options: Object.values(ButtonSize),
       description: "Defines the size of the button"
     },
     iconLeft: {

package/dist/components/__types/AntButton.types.d.ts

@@ -2,3 +2,11 @@ export declare enum ButtonType {
     button = "button",
     submit = "submit"
 }
+export declare enum ButtonSize {
+    lg = "lg",
+    md = "md",
+    sm = "sm",
+    xs = "xs",
+    xs2 = "2xs",
+    xs3 = "3xs"
+}

package/dist/components/__types/AntButton.types.js

@@ -3,9 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ButtonType = void 0;
+exports.ButtonType = exports.ButtonSize = void 0;
 var ButtonType = exports.ButtonType = /* @__PURE__ */(ButtonType2 => {
   ButtonType2["button"] = "button";
   ButtonType2["submit"] = "submit";
   return ButtonType2;
-})(ButtonType || {});
+})(ButtonType || {});
+var ButtonSize = exports.ButtonSize = /* @__PURE__ */(ButtonSize2 => {
+  ButtonSize2["lg"] = "lg";
+  ButtonSize2["md"] = "md";
+  ButtonSize2["sm"] = "sm";
+  ButtonSize2["xs"] = "xs";
+  ButtonSize2["xs2"] = "2xs";
+  ButtonSize2["xs3"] = "3xs";
+  return ButtonSize2;
+})(ButtonSize || {});

package/dist/components/__types/AntButton.types.mjs

@@ -3,3 +3,12 @@ export var ButtonType = /* @__PURE__ */ ((ButtonType2) => {
   ButtonType2["submit"] = "submit";
   return ButtonType2;
 })(ButtonType || {});
+export var ButtonSize = /* @__PURE__ */ ((ButtonSize2) => {
+  ButtonSize2["lg"] = "lg";
+  ButtonSize2["md"] = "md";
+  ButtonSize2["sm"] = "sm";
+  ButtonSize2["xs"] = "xs";
+  ButtonSize2["xs2"] = "2xs";
+  ButtonSize2["xs3"] = "3xs";
+  return ButtonSize2;
+})(ButtonSize || {});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antify/ui",
-  "version": "3.1.25",
+  "version": "3.1.26",
   "private": false,
   "type": "module",
   "exports": {