@antify/ui 2.2.1 → 2.2.4

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

@@ -1,53 +1,90 @@
 import AntButton from "../AntButton.vue";
 import AntFormGroupLabel from "../../forms/AntFormGroupLabel.vue";
 import AntFormGroup from "../../forms/AntFormGroup.vue";
-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";
-import { State, InputState, Position } from "../../../enums/index.mjs";
-import { within } from "@storybook/test";
+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";
+import {
+  State,
+  InputState,
+  Position
+} from "../../../enums/index.mjs";
+import {
+  within
+} from "@storybook/test";
 const meta = {
   component: AntButton,
   title: "Components/Buttons/Button",
-  parameters: { controls: { sort: "requiredFirst" } },
+  parameters: {
+    controls: {
+      sort: "requiredFirst"
+    }
+  },
   argTypes: {
     state: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(State)
     },
     grouped: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(_Grouped),
       description: "Where is this fields position in a group"
     },
     size: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Size),
       description: "Defines the size of the button"
     },
     iconLeft: {
-      control: { type: "none" },
+      control: {
+        type: "none"
+      },
       description: "Will be displayed left to the label or the default slot.<br>Use Font-awesome Icons."
     },
     iconRight: {
-      control: { type: "none" },
+      control: {
+        type: "none"
+      },
       description: "Will be displayed right to the label or the default slot.<br>Use Font-awesome Icons."
     },
     to: {
-      control: { type: "RouteLocationRaw" },
+      control: {
+        type: "RouteLocationRaw"
+      },
       description: "If provided transforms the button into an a-tag with the provided link. Style is still the same as a button.",
-      table: { type: { summary: "string|object" } }
+      table: {
+        type: {
+          summary: "string|object"
+        }
+      }
     },
     submit: {
       description: 'Change the button type to type="submit"'
     },
     tooltipPosition: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Position),
       description: "The tooltips position. Tooltip is only shown if a tooltip-content slot is provided."
     },
     tooltipState: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(InputState),
       description: "The tooltips color type. Tooltip is only shown if a tooltip-content slot is provided."
     }
@@ -56,9 +93,13 @@ const meta = {
 export default meta;
 export const Docs = {
   render: (args) => ({
-    components: { AntButton },
+    components: {
+      AntButton
+    },
     setup() {
-      return { args };
+      return {
+        args
+      };
     },
     template: '<AntButton v-bind="args">Button</AntButton>'
   }),
@@ -151,9 +192,13 @@ export const WithoutBorder = {
 };
 export const WithTooltip = {
   render: (args) => ({
-    components: { AntButton },
+    components: {
+      AntButton
+    },
     setup() {
-      return { args };
+      return {
+        args
+      };
     },
     template: `
 			<AntButton v-bind="args">
@@ -162,19 +207,26 @@ export const WithTooltip = {
 				<template #tooltip-content>This is a button</template>
 			</AntButton>`
   }),
-  play: async ({ canvasElement, step }) => {
+  play: async ({
+    canvasElement,
+    step
+  }) => {
     const canvas = within(canvasElement);
   },
   args: {
     tooltipDelay: 800
   },
   parameters: {
-    chromatic: { disableSnapshot: false }
+    chromatic: {
+      disableSnapshot: false
+    }
   }
 };
 export const Summary = {
   parameters: {
-    chromatic: { disableSnapshot: false }
+    chromatic: {
+      disableSnapshot: false
+    }
   },
   render: (args) => ({
     components: {
@@ -183,7 +235,9 @@ export const Summary = {
       AntFormGroup
     },
     setup() {
-      return { args };
+      return {
+        args
+      };
     },
     template: `
 			<div class="flex flex-col gap-2.5">

package/dist/components/buttons/__stories/AntCreateButton.stories.mjs

@@ -1,20 +1,34 @@
 import AntCreateButton from "../AntCreateButton.vue";
-import { Position, Grouped as _Grouped, Size } from "../../../enums/index.mjs";
+import {
+  Position,
+  Grouped as _Grouped,
+  Size
+} from "../../../enums/index.mjs";
 const meta = {
   title: "Components/Buttons/Create Button",
   component: AntCreateButton,
-  parameters: { controls: { sort: "requiredFirst" } },
+  parameters: {
+    controls: {
+      sort: "requiredFirst"
+    }
+  },
   argTypes: {
     size: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Size)
     },
     grouped: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(_Grouped)
     },
     tooltipPosition: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Position)
     }
   }
@@ -22,9 +36,13 @@ const meta = {
 export default meta;
 export const Docs = {
   render: (args) => ({
-    components: { AntCreateButton },
+    components: {
+      AntCreateButton
+    },
     setup() {
-      return { args };
+      return {
+        args
+      };
     },
     template: '<AntCreateButton v-bind="args"/>'
   }),

package/dist/components/buttons/__stories/AntDeleteButton.stories.mjs

@@ -1,20 +1,34 @@
 import AntDeleteButton from "../AntDeleteButton.vue";
-import { Position, Grouped as _Grouped, Size } from "../../../enums/index.mjs";
+import {
+  Position,
+  Grouped as _Grouped,
+  Size
+} from "../../../enums/index.mjs";
 const meta = {
   title: "Components/Buttons/Delete Button",
   component: AntDeleteButton,
-  parameters: { controls: { sort: "requiredFirst" } },
+  parameters: {
+    controls: {
+      sort: "requiredFirst"
+    }
+  },
   argTypes: {
     size: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Size)
     },
     grouped: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(_Grouped)
     },
     tooltipPosition: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Position)
     }
   }
@@ -22,9 +36,13 @@ const meta = {
 export default meta;
 export const Docs = {
   render: (args) => ({
-    components: { AntDeleteButton },
+    components: {
+      AntDeleteButton
+    },
     setup() {
-      return { args };
+      return {
+        args
+      };
     },
     template: '<AntDeleteButton v-bind="args"/>'
   }),

package/dist/components/buttons/__stories/AntDuplicateButton.stories.mjs

@@ -1,20 +1,34 @@
 import AntDuplicateButton from "../AntDuplicateButton.vue";
-import { Position, Grouped as _Grouped, Size } from "../../../enums/index.mjs";
+import {
+  Position,
+  Grouped as _Grouped,
+  Size
+} from "../../../enums/index.mjs";
 const meta = {
   title: "Components/Buttons/Duplicate Button",
   component: AntDuplicateButton,
-  parameters: { controls: { sort: "requiredFirst" } },
+  parameters: {
+    controls: {
+      sort: "requiredFirst"
+    }
+  },
   argTypes: {
     size: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Size)
     },
     grouped: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(_Grouped)
     },
     tooltipPosition: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Position)
     }
   }
@@ -22,9 +36,13 @@ const meta = {
 export default meta;
 export const Docs = {
   render: (args) => ({
-    components: { AntDuplicateButton },
+    components: {
+      AntDuplicateButton
+    },
     setup() {
-      return { args };
+      return {
+        args
+      };
     },
     template: '<AntDuplicateButton v-bind="args"/>'
   }),

package/dist/components/buttons/__stories/AntEditButton.stories.mjs

@@ -1,20 +1,34 @@
 import AntEditButton from "../AntEditButton.vue";
-import { Position, Grouped as _Grouped, Size } from "../../../enums/index.mjs";
+import {
+  Position,
+  Grouped as _Grouped,
+  Size
+} from "../../../enums/index.mjs";
 const meta = {
   title: "Components/Buttons/Edit Button",
   component: AntEditButton,
-  parameters: { controls: { sort: "requiredFirst" } },
+  parameters: {
+    controls: {
+      sort: "requiredFirst"
+    }
+  },
   argTypes: {
     size: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Size)
     },
     grouped: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(_Grouped)
     },
     tooltipPosition: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Position)
     }
   }
@@ -22,9 +36,13 @@ const meta = {
 export default meta;
 export const Docs = {
   render: (args) => ({
-    components: { AntEditButton },
+    components: {
+      AntEditButton
+    },
     setup() {
-      return { args };
+      return {
+        args
+      };
     },
     template: '<AntEditButton v-bind="args"/>'
   }),

package/dist/components/buttons/__stories/AntSaveAndNewButton.stories.mjs

@@ -1,20 +1,34 @@
 import AntSaveAndNewButton from "../AntSaveAndNewButton.vue";
-import { Position, Grouped as _Grouped, Size } from "../../../enums/index.mjs";
+import {
+  Position,
+  Grouped as _Grouped,
+  Size
+} from "../../../enums/index.mjs";
 const meta = {
   title: "Components/Buttons/Save And New Button",
   component: AntSaveAndNewButton,
-  parameters: { controls: { sort: "requiredFirst" } },
+  parameters: {
+    controls: {
+      sort: "requiredFirst"
+    }
+  },
   argTypes: {
     size: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Size)
     },
     grouped: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(_Grouped)
     },
     tooltipPosition: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Position)
     }
   }
@@ -22,9 +36,13 @@ const meta = {
 export default meta;
 export const Docs = {
   render: (args) => ({
-    components: { AntSaveAndNewButton },
+    components: {
+      AntSaveAndNewButton
+    },
     setup() {
-      return { args };
+      return {
+        args
+      };
     },
     template: '<AntSaveAndNewButton v-bind="args"/>'
   }),

package/dist/components/buttons/__stories/AntSaveButton.stories.mjs

@@ -1,20 +1,34 @@
 import AntSaveButton from "../AntSaveButton.vue";
-import { Position, Grouped as _Grouped, Size } from "../../../enums/index.mjs";
+import {
+  Position,
+  Grouped as _Grouped,
+  Size
+} from "../../../enums/index.mjs";
 const meta = {
   title: "Components/Buttons/Save Button",
   component: AntSaveButton,
-  parameters: { controls: { sort: "requiredFirst" } },
+  parameters: {
+    controls: {
+      sort: "requiredFirst"
+    }
+  },
   argTypes: {
     size: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Size)
     },
     grouped: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(_Grouped)
     },
     tooltipPosition: {
-      control: { type: "select" },
+      control: {
+        type: "select"
+      },
       options: Object.values(Position)
     }
   }
@@ -22,9 +36,13 @@ const meta = {
 export default meta;
 export const Docs = {
   render: (args) => ({
-    components: { AntSaveButton },
+    components: {
+      AntSaveButton
+    },
     setup() {
-      return { args };
+      return {
+        args
+      };
     },
     template: '<AntSaveButton v-bind="args"/>'
   }),

package/dist/components/crud/AntCrud.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 withDefaults(defineProps<{
-  showDetail?: boolean,
+  showDetail?: boolean;
 }>(), {
   showDetail: false,
 });
@@ -16,15 +16,15 @@ withDefaults(defineProps<{
       :class="{'w-[40rem]': showDetail, 'w-full': !showDetail}"
     >
       <div class="bg-white">
-        <slot name="search-section"/>
+        <slot name="search-section" />
       </div>
 
-      <div class="bg-white flex-grow h-px overflow-hidden">
-        <slot name="table-section"/>
+      <div class="bg-white grow h-px overflow-hidden">
+        <slot name="table-section" />
       </div>
 
       <div class="bg-white">
-        <slot name="table-nav-section"/>
+        <slot name="table-nav-section" />
       </div>
     </div>
 
@@ -34,7 +34,7 @@ withDefaults(defineProps<{
         class="flex flex-col gap-px border-l border-base-300 overflow-hidden"
         :class="{'w-full': showDetail}"
       >
-        <slot/>
+        <slot />
       </div>
     </Transition>
   </div>

package/dist/components/crud/AntCrudDetail.vue

@@ -1,11 +1,14 @@
 <template>
-  <div class="flex flex-col bg-base-300 gap-px h-full" data-e2e="crud-detail">
-    <slot name="header"/>
+  <div
+    class="flex flex-col bg-base-300 gap-px h-full"
+    data-e2e="crud-detail"
+  >
+    <slot name="header" />
 
-    <div class="flex-grow bg-white h-full overflow-y-auto">
-      <slot/>
+    <div class="grow bg-white h-full overflow-y-auto">
+      <slot />
     </div>
 
-    <slot name="footer"/>
+    <slot name="footer" />
   </div>
 </template>

package/dist/components/crud/AntCrudDetailActions.vue

@@ -1,18 +1,24 @@
 <script setup lang="ts">
 import AntButton from '../buttons/AntButton.vue';
-import {faAngleLeft} from '@fortawesome/free-solid-svg-icons';
+import {
+  faAngleLeft,
+} from '@fortawesome/free-solid-svg-icons';
 import AntSaveAndNewButton from '../buttons/AntSaveAndNewButton.vue';
 import AntSaveButton from '../buttons/AntSaveButton.vue';
 
-defineEmits(['back', 'save', 'save-and-new']);
+defineEmits([
+  'back',
+  'save',
+  'save-and-new',
+]);
 withDefaults(defineProps<{
-  disabled?: boolean
-  skeleton?: boolean
-  canSave?: boolean
+  disabled?: boolean;
+  skeleton?: boolean;
+  canSave?: boolean;
 }>(), {
   disabled: false,
   skeleton: false,
-  canSave: true
+  canSave: true,
 });
 </script>
 
@@ -37,7 +43,7 @@ withDefaults(defineProps<{
     </div>
 
     <div class="flex gap-2.5">
-      <slot name="before-buttons-right"/>
+      <slot name="before-buttons-right" />
       <slot name="buttons-right">
         <AntSaveAndNewButton
           :skeleton="skeleton"
@@ -53,7 +59,7 @@ withDefaults(defineProps<{
           @click="$emit('save')"
         />
       </slot>
-      <slot name="after-buttons-right"/>
+      <slot name="after-buttons-right" />
     </div>
   </div>
 </template>

package/dist/components/crud/AntCrudDetailNav.vue

@@ -1,26 +1,34 @@
 <script setup lang="ts">
 // TODO:: fix why tabs are not full height in story
-import type {TabItem} from '../tabs/__types/AntTabItem.types';
+import type {
+  TabItem,
+} from '../tabs/__types/AntTabItem.types';
 import AntTabs from '../tabs/AntTabs.vue';
 import AntDeleteButton from '../buttons/AntDeleteButton.vue';
 import AntDeleteDialog from '../dialogs/AntDeleteDialog.vue';
-import {ref} from 'vue';
-import {Position} from '../../enums';
+import {
+  ref,
+} from 'vue';
+import {
+  Position,
+} from '../../enums';
 
-defineEmits(['delete']);
+defineEmits([
+  'delete',
+]);
 withDefaults(defineProps<{
-  tabItems?: TabItem[]
-  deleteButtonDisabled?: boolean
-  getEntityName: () => string
-  canDelete?: boolean
-  showDeleteButton?: boolean
-  skeleton?: boolean
+  tabItems?: TabItem[];
+  deleteButtonDisabled?: boolean;
+  getEntityName: () => string;
+  canDelete?: boolean;
+  showDeleteButton?: boolean;
+  skeleton?: boolean;
 }>(), {
   tabItems: () => [],
   deleteButtonDisabled: false,
   canDelete: true,
   showDeleteButton: true,
-  skeleton: false
+  skeleton: false,
 });
 
 const dialogOpen = ref(false);
@@ -40,7 +48,7 @@ const dialogOpen = ref(false);
 
     <div class="flex gap-2 pr-2 py-2">
       <slot name="buttons">
-        <slot name="before-delete-button"/>
+        <slot name="before-delete-button" />
 
         <AntDeleteButton
           v-if="showDeleteButton"
@@ -52,7 +60,7 @@ const dialogOpen = ref(false);
           @click="() => dialogOpen = true"
         />
 
-        <slot name="after-delete-button"/>
+        <slot name="after-delete-button" />
       </slot>
     </div>