@antify/ui-module 1.6.0 → 1.7.1

package/dist/runtime/components/dialogs/AntDialog.vue

@@ -11,7 +11,7 @@ import {
   faInfoCircle,
   type IconDefinition,
 } from '@fortawesome/free-solid-svg-icons';
-import {ColorType, InputColorType} from '../../enums';
+import {State, InputState} from '../../enums';
 import {IconSize} from '../__types';
 
 const emit = defineEmits(['update:open', 'close', 'confirm']);
@@ -21,9 +21,9 @@ const props = withDefaults(defineProps<{
   confirmText?: string,
   cancelText?: string,
   showCancel?: boolean,
-  colorType?: InputColorType
+  state?: InputState
 }>(), {
-  colorType: InputColorType.base,
+  state: InputState.base,
   confirmText: 'Confirm',
   cancelText: 'Cancel',
   showCancel: true,
@@ -32,23 +32,23 @@ const props = withDefaults(defineProps<{
 const openDialog = ref(props.open);
 const openBackground = ref(props.open);
 const icons = {
-  [InputColorType.base]: null,
-  [InputColorType.info]: faInfoCircle,
-  [InputColorType.danger]: faExclamationCircle,
-  [InputColorType.warning]: faExclamationTriangle,
-  [InputColorType.success]: faCheckCircle,
+  [InputState.base]: null,
+  [InputState.info]: faInfoCircle,
+  [InputState.danger]: faExclamationCircle,
+  [InputState.warning]: faExclamationTriangle,
+  [InputState.success]: faCheckCircle,
 };
 
 const iconColor = computed(() => {
   const variants = {
-    [InputColorType.base]: 'text-neutral-100-font',
-    [InputColorType.danger]: 'text-danger-500',
-    [InputColorType.info]: 'text-info-500',
-    [InputColorType.success]: 'text-success-500',
-    [InputColorType.warning]: 'text-warning-500',
+    [InputState.base]: 'text-neutral-100-font',
+    [InputState.danger]: 'text-danger-500',
+    [InputState.info]: 'text-info-500',
+    [InputState.success]: 'text-success-500',
+    [InputState.warning]: 'text-warning-500',
   };
 
-  return variants[props.colorType];
+  return variants[props.state];
 });
 
 watch(() => props.open, (val) => {
@@ -60,11 +60,11 @@ watch(() => props.open, (val) => {
 
   if (val) {
     openBackground.value = true;
-    setTimeout(() => openDialog.value = true, 100)
+    setTimeout(() => openDialog.value = true, 100);
     document.addEventListener('keydown', onKeydown);
   } else {
     openDialog.value = false;
-    setTimeout(() => openBackground.value = false, 100)
+    setTimeout(() => openBackground.value = false, 100);
     document.removeEventListener('keydown', onKeydown);
   }
 });
@@ -94,19 +94,19 @@ function confirmDialog() {
         >
           <div
             v-if="title || $slots['title']"
-            class="bg-neutral-100 p-2.5 flex items-center justify-between text-neutral-100-font text-sm font-semibold"
+            class="bg-neutral-100 p-2 flex items-center justify-between text-neutral-100-font text-sm font-semibold"
           >
             <slot name="title">
               {{ title }}
             </slot>
           </div>
 
-          <div class="bg-white p-2.5 grow flex items-center gap-2.5 text-sm">
+          <div class="bg-white p-2 grow flex items-center gap-2 text-sm text-for-white-bg-font">
             <slot name="icon">
               <AntIcon
-                v-if="icons[colorType]"
+                v-if="icons[state]"
                 :size="IconSize.xl3"
-                :icon="icons[colorType] as unknown as IconDefinition"
+                :icon="icons[state] as unknown as IconDefinition"
                 :color="iconColor"
                 class="px-2.5 w-8 h-8"
               />
@@ -116,19 +116,19 @@ function confirmDialog() {
           </div>
 
           <div
-            class="bg-neutral-100 p-2.5 gap-2.5 text-for-white-bg-font flex w-full justify-end"
+            class="bg-neutral-100 p-2 gap-2 text-for-white-bg-font flex w-full justify-end"
           >
             <slot name="footer">
               <AntButton
                 v-if="showCancel"
-                :color-type="ColorType.base"
+                :state="State.base"
                 @click="closeDialog()"
               >
                 {{ cancelText }}
               </AntButton>
 
               <AntButton
-                :color-type="colorType === ColorType.base ? ColorType.primary : colorType as unknown as ColorType"
+                :state="state === State.base ? State.primary : state as unknown as State"
                 filled
                 @click="confirmDialog()"
               >

package/dist/runtime/components/dialogs/__stories/AndDeleteDialog.stories.mjs

@@ -14,13 +14,15 @@ export const Docs = {
       return { args };
     },
     template: `
-      <AntButton @click="() => args.open = true" color-type="danger">Delete</AntButton>
+    <div class="h-96">
+      <AntButton @click="() => args.open = true" state="danger">Delete</AntButton>
 
       <AntDeleteDialog
         v-model:open="args.open"
         :entity="args.entity"
         v-bind="args"
       />
+    </div>
     `
   }),
   args: {

package/dist/runtime/components/dialogs/__stories/AntDialog.stories.mjs

@@ -1,15 +1,15 @@
 import AntDialog from "../AntDialog.vue";
 import AntButton from "../../buttons/AntButton.vue";
-import { InputColorType } from "../../../enums/index.mjs";
+import { InputState } from "../../../enums/index.mjs";
 const meta = {
   title: "Components/Dialogs/Dialog",
   component: AntDialog,
   parameters: { controls: { sort: "requiredFirst" } },
   decorators: [() => ({ template: '<div class="border border-dashed border-neutral-300"><story/></div>' })],
   argTypes: {
-    colorType: {
+    state: {
       control: { type: "select" },
-      options: Object.values(InputColorType)
+      options: Object.values(InputState)
     },
     title: {
       control: "text",
@@ -44,7 +44,7 @@ export const Docs = {
           justo duo dolores et ea rebum. Stet clita kasd
         </div>
 
-        <AntButton @click="args.open = true" color-type="primary">Open Dialog</AntButton>
+        <AntButton @click="args.open = true" state="primary">Open Dialog</AntButton>
 
         <AntDialog v-bind="args" v-model:open="args.open">
           Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et

package/dist/runtime/components/{form/Elements → forms}/AntField.vue

@@ -1,39 +1,46 @@
 <script lang="ts" setup>
 import {onMounted, computed} from 'vue';
-import {Size} from '../../../enums/Size.enum'
-import AntInputLabel from './AntInputLabel.vue';
-import AntInputDescription from './AntInputDescription.vue';
-import {handleEnumValidation} from '../../../handler';
-import AntInputLimiter from './AntInputLimiter.vue';
-import {InputColorType} from '../../../enums';
+import {Size} from '../../enums/Size.enum';
+import AntInputLabel from '../inputs/Elements/AntInputLabel.vue';
+import AntInputDescription from '../inputs/Elements/AntInputDescription.vue';
+import {handleEnumValidation} from '../../handler';
+import AntInputLimiter from '../inputs/Elements/AntInputLimiter.vue';
+import {InputState} from '../../enums';
 
 defineEmits(['clickLabel', 'validate']);
+
 const props = withDefaults(defineProps<{
   label?: string;
   description?: string;
+  messages?: string[];
   size?: Size;
-  colorType?: InputColorType;
+  state?: InputState;
   skeleton?: boolean;
   limiterValue?: number;
   limiterMaxValue?: number;
   labelFor?: string;
-  errors?: string[];
   expanded?: boolean;
 }>(), {
-  colorType: InputColorType.base,
+  state: InputState.base,
   skeleton: false,
   size: Size.md,
-  errors: () => [],
+  messages: () => [],
   expanded: true
 });
 
 onMounted(() => {
   handleEnumValidation(props.size, Size, 'size');
-  handleEnumValidation(props.colorType, InputColorType, 'colorType');
+  handleEnumValidation(props.state, InputState, 'state');
 });
 
-const _errors = computed(() => props.skeleton ? [] : props.errors);
-const _colorType = computed(() => _errors.value.length > 0 ? InputColorType.danger : props.colorType);
+const _state = computed(() => props.messages.length <= 0 ? InputState.base : props.state);
+const fontSize = computed(() => {
+  if (props.size === Size.xs2 || props.size === Size.xs) {
+    return Size.xs;
+  }
+
+  return Size.sm;
+});
 </script>
 
 <template>
@@ -43,7 +50,7 @@ const _colorType = computed(() => _errors.value.length > 0 ? InputColorType.dang
   >
     <AntInputLabel
       :label="label"
-      :size="size"
+      :size="fontSize"
       :skeleton="skeleton"
       :for="labelFor"
       @click-content="$emit('clickLabel')"
@@ -54,28 +61,28 @@ const _colorType = computed(() => _errors.value.length > 0 ? InputColorType.dang
     </AntInputLabel>
 
     <div
-      v-if="description || _errors.length > 0 || (limiterMaxValue !== undefined && limiterValue !== undefined)"
+      v-if="description || messages.length > 0 || (limiterMaxValue !== undefined && limiterValue !== undefined)"
       class="flex justify-between w-full"
     >
       <AntInputDescription
-        v-if="description || _errors.length > 0"
-        :size="size"
+        v-if="description || messages.length > 0"
+        :size="fontSize"
         :skeleton="skeleton"
-        :color-type="_colorType"
+        :state="_state"
       >
         <slot name="description">
-          <template v-if="_errors.length === 1">
-            {{ errors[0] }}
+          <template v-if="_state !== InputState.base && messages.length === 1">
+            {{ messages[0] }}
           </template>
 
-          <template v-else-if="_errors.length > 1">
+          <template v-else-if="_state !== InputState.base && messages.length > 1">
             <ul class="list-disc list-outside pl-4">
               <li
-                v-for="(error, index) of _errors"
-                :key="`field-error-${index}`"
+                v-for="(message, index) of messages"
+                :key="`field-message-${index}`"
                 class="marker:m-none marker:p-none"
               >
-                {{ error }}
+                {{ message }}
               </li>
             </ul>
           </template>
@@ -93,12 +100,9 @@ const _colorType = computed(() => _errors.value.length > 0 ? InputColorType.dang
         <AntInputLimiter
           :value="limiterValue"
           :max-value="limiterMaxValue"
-          :color-type="_colorType"
-          :size="size"
+          :size="fontSize"
           :skeleton="skeleton"
-        >
-          {{ limiterValue }}/{{ limiterMaxValue }}
-        </AntInputLimiter>
+        />
       </div>
     </div>
   </div>

package/dist/runtime/components/forms/AntFormGroupLabel.vue

@@ -0,0 +1,5 @@
+<template>
+  <div class="text-primary-500 text-xl font-medium">
+    <slot/>
+  </div>
+</template>

package/dist/runtime/components/{form/Elements → forms}/__stories/AntField.stories.mjs

@@ -1,21 +1,21 @@
 import AntField from "../AntField.vue";
-import AntBaseInput from "../AntBaseInput.vue";
-import { Size } from "../../../../enums/Size.enum.mjs";
+import AntBaseInput from "../../inputs/Elements/AntBaseInput.vue";
+import { Size } from "../../../enums/Size.enum.mjs";
 import { computed, reactive, ref } from "vue";
-import { InputColorType } from "../../../../enums/index.mjs";
+import { InputState } from "../../../enums/index.mjs";
 import { isRequiredRule, notBlankRule, useFieldValidator } from "@antify/validate";
 const meta = {
-  title: "Components/Forms/Elements/Field",
+  title: "Forms/Field",
   component: AntField,
   parameters: { controls: { sort: "requiredFirst" } },
   argTypes: {
     size: {
-      control: { type: "radio" },
+      control: { type: "select" },
       options: Object.values(Size)
     },
-    colorType: {
+    state: {
       control: { type: "select" },
-      options: Object.values(InputColorType)
+      options: Object.values(InputState)
     },
     skeleton: {
       control: "boolean",
@@ -44,30 +44,30 @@ export const Docs = {
           args.size = val;
         }
       });
-      const colorType = computed({
+      const state = computed({
         get() {
-          return args.colorType;
+          return validator.hasErrors() ? InputState.danger : args.state;
         },
         set(val) {
-          args.colorType = val;
+          args.state = val;
         }
       });
       const value = ref(null);
       const validator = reactive(useFieldValidator([isRequiredRule, notBlankRule]));
-      return { args, value, validator, skeleton, size, colorType };
+      return { args, value, validator, skeleton, size, state, InputState };
     },
     template: `
       <AntField
         v-bind="args"
-        :errors="Array.isArray(args.errors) ? args.errors : validator.getErrors()"
+        :messages="Array.isArray(args.messages) ? args.messages : validator.getErrors()"
+        :state="state"
       >
         <AntBaseInput
-          v-model:value="value"
+          v-model="value"
           :skeleton="skeleton"
           :size="size"
-          :color-type="colorType"
+          :state="state"
           placeholder="Placeholder"
-          :has-errors="Array.isArray(args.errors) ? args.errors.length > 0 : validator.hasErrors()"
           @validate="(val) => validator.validate(val)"
         />
       </AntField>

package/dist/runtime/components/{form → forms}/__stories/AntFormGroup.stories.mjs

@@ -1,10 +1,10 @@
 import AntFormGroup from "../AntFormGroup.vue";
 import AntFormGroupLabel from "../AntFormGroupLabel.vue";
-import AntTextInput from "../AntTextInput.vue";
+import AntTextInput from "../../inputs/AntTextInput.vue";
 import AntButton from "../../buttons/AntButton.vue";
 import { Direction } from "../../../enums/Direction.enum.mjs";
 const meta = {
-  title: "Components/Forms/Form Group",
+  title: "Forms/Form Group",
   component: AntFormGroup,
   parameters: { controls: { sort: "requiredFirst" } },
   argTypes: {
@@ -25,7 +25,7 @@ export const Docs = {
       <AntFormGroup v-bind="args">
         <AntFormGroupLabel>Example label</AntFormGroupLabel>
         <AntTextInput label="Example"/>
-        <AntButton color-type="primary">Submit</AntButton>
+        <AntButton state="primary">Submit</AntButton>
       </AntFormGroup>
     `
   }),

package/dist/runtime/components/{form → forms}/__stories/AntFormGroupLabel.stories.mjs

@@ -1,6 +1,6 @@
 import AntFormGroupLabel from "../AntFormGroupLabel.vue";
 const meta = {
-  title: "Components/Forms/Form Group Label",
+  title: "Forms/Form Group Label",
   component: AntFormGroupLabel,
   parameters: { controls: { sort: "requiredFirst" } },
   argTypes: {}

package/dist/runtime/components/index.d.ts

@@ -1,6 +1,50 @@
+import AntActionButton from './buttons/AntActionButton.vue';
+import AntButton from './buttons/AntButton.vue';
+import AntCreateButton from './buttons/AntCreateButton.vue';
+import AntDeleteButton from './buttons/AntDeleteButton.vue';
+import AntDuplicateButton from './buttons/AntDuplicateButton.vue';
+import AntEditButton from './buttons/AntEditButton.vue';
+import AntSaveAndNewButton from './buttons/AntSaveAndNewButton.vue';
+import AntSaveButton from './buttons/AntSaveButton.vue';
+import AntCrud from './crud/AntCrud.vue';
+import AntCrudDetail from './crud/AntCrudDetail.vue';
+import AntCrudDetailActions from './crud/AntCrudDetailActions.vue';
+import AntCrudDetailNav from './crud/AntCrudDetailNav.vue';
+import AntCrudTableFilter from './crud/AntCrudTableFilter.vue';
+import AntCrudTableNav from './crud/AntCrudTableNav.vue';
+import AntDeleteDialog from './dialogs/AntDeleteDialog.vue';
+import AntDialog from './dialogs/AntDialog.vue';
+import AntField from './forms/AntField.vue';
+import AntFormGroup from './forms/AntFormGroup.vue';
+import AntFormGroupLabel from './forms/AntFormGroupLabel.vue';
+import AntBaseInput from './inputs/Elements/AntBaseInput.vue';
+import AntDropDown from './inputs/Elements/AntDropDown.vue';
+import AntInputDescription from './inputs/Elements/AntInputDescription.vue';
+import AntInputLabel from './inputs/Elements/AntInputLabel.vue';
+import AntInputLimiter from './inputs/Elements/AntInputLimiter.vue';
+import AntCheckbox from './inputs/AntCheckbox.vue';
+import AntCheckboxGroup from './inputs/AntCheckboxGroup.vue';
+import AntDateInput from './inputs/AntDateInput.vue';
+import AntNumberInput from './inputs/AntNumberInput.vue';
+import AntPasswordInput from './inputs/AntPasswordInput.vue';
+import AntRadio from './inputs/AntRadio.vue';
+import AntRadioGroup from './inputs/AntRadioGroup.vue';
+import AntRangeSlider from './inputs/AntRangeSlider.vue';
+import AntSearch from './inputs/AntSearch.vue';
+import AntSelect from './inputs/AntSelect.vue';
+import AntSwitch from './inputs/AntSwitch.vue';
+import AntSwitcher from './inputs/AntSwitcher.vue';
+import AntTagInput from './inputs/AntTagInput.vue';
+import AntNavLeftLayout from './layouts/AntNavLeftLayout.vue';
+import AntNavbar from './navbar/AntNavbar.vue';
+import AntNavbarItem from './navbar/AntNavbarItem.vue';
+import AntTable from './table/AntNavbar.vue';
+import AntTabs from './tabs/AntTabs.vue';
+import AntTransitionCollapseHeight from './transitions/AntTransitionCollapseHeight.vue';
 import AntAccordion from './AntAccordion.vue';
 import AntAccordionItem from './AntAccordionItem.vue';
 import AntAlert from './AntAlert.vue';
+import AntContent from './AntContent.vue';
 import AntDropdown from './AntDropdown.vue';
 import AntIcon from './AntIcon.vue';
 import AntKeycap from './AntKeycap.vue';
@@ -9,14 +53,10 @@ import AntListGroupItem from './AntListGroupItem.vue';
 import AntModal from './AntModal.vue';
 import AntPagination from './AntPagination.vue';
 import AntPopover from './AntPopover.vue';
-import AntCrudTableFilter from './crud/AntCrudTableFilter.vue';
 import AntSkeleton from './AntSkeleton.vue';
 import AntSpinner from './AntSpinner.vue';
-import AntTableNav from './crud/AntCrudTableNav.vue';
 import AntTag from './AntTag.vue';
 import AntToast from './AntToast.vue';
+import AntToaster from './AntToaster.vue';
 import AntTooltip from './AntTooltip.vue';
-export * from './deprecated/elements';
-export * from './form';
-export * from './form/Elements';
-export { AntAccordion, AntAccordionItem, AntAlert, AntDropdown, AntIcon, AntKeycap, AntListGroup, AntListGroupItem, AntModal, AntPagination, AntPopover, AntCrudTableFilter, AntSkeleton, AntSpinner, AntTableNav, AntTag, AntToast, AntTooltip };
+export { AntActionButton, AntButton, AntCreateButton, AntDeleteButton, AntDuplicateButton, AntEditButton, AntSaveAndNewButton, AntSaveButton, AntCrud, AntCrudDetail, AntCrudDetailActions, AntCrudDetailNav, AntCrudTableFilter, AntCrudTableNav, AntDeleteDialog, AntDialog, AntField, AntFormGroup, AntFormGroupLabel, AntBaseInput, AntDropDown, AntInputDescription, AntInputLabel, AntInputLimiter, AntCheckbox, AntCheckboxGroup, AntDateInput, AntNumberInput, AntPasswordInput, AntRadio, AntRadioGroup, AntRangeSlider, AntSearch, AntSelect, AntSwitch, AntSwitcher, AntTagInput, AntNavLeftLayout, AntNavbar, AntNavbarItem, AntTable, AntTabs, AntTransitionCollapseHeight, AntAccordion, AntAccordionItem, AntAlert, AntContent, AntDropdown, AntIcon, AntKeycap, AntListGroup, AntListGroupItem, AntModal, AntPagination, AntPopover, AntSkeleton, AntSpinner, AntTag, AntToast, AntToaster, AntTooltip };

package/dist/runtime/components/index.mjs

@@ -1,6 +1,50 @@
+import AntActionButton from "./buttons/AntActionButton.vue";
+import AntButton from "./buttons/AntButton.vue";
+import AntCreateButton from "./buttons/AntCreateButton.vue";
+import AntDeleteButton from "./buttons/AntDeleteButton.vue";
+import AntDuplicateButton from "./buttons/AntDuplicateButton.vue";
+import AntEditButton from "./buttons/AntEditButton.vue";
+import AntSaveAndNewButton from "./buttons/AntSaveAndNewButton.vue";
+import AntSaveButton from "./buttons/AntSaveButton.vue";
+import AntCrud from "./crud/AntCrud.vue";
+import AntCrudDetail from "./crud/AntCrudDetail.vue";
+import AntCrudDetailActions from "./crud/AntCrudDetailActions.vue";
+import AntCrudDetailNav from "./crud/AntCrudDetailNav.vue";
+import AntCrudTableFilter from "./crud/AntCrudTableFilter.vue";
+import AntCrudTableNav from "./crud/AntCrudTableNav.vue";
+import AntDeleteDialog from "./dialogs/AntDeleteDialog.vue";
+import AntDialog from "./dialogs/AntDialog.vue";
+import AntField from "./forms/AntField.vue";
+import AntFormGroup from "./forms/AntFormGroup.vue";
+import AntFormGroupLabel from "./forms/AntFormGroupLabel.vue";
+import AntBaseInput from "./inputs/Elements/AntBaseInput.vue";
+import AntDropDown from "./inputs/Elements/AntDropDown.vue";
+import AntInputDescription from "./inputs/Elements/AntInputDescription.vue";
+import AntInputLabel from "./inputs/Elements/AntInputLabel.vue";
+import AntInputLimiter from "./inputs/Elements/AntInputLimiter.vue";
+import AntCheckbox from "./inputs/AntCheckbox.vue";
+import AntCheckboxGroup from "./inputs/AntCheckboxGroup.vue";
+import AntDateInput from "./inputs/AntDateInput.vue";
+import AntNumberInput from "./inputs/AntNumberInput.vue";
+import AntPasswordInput from "./inputs/AntPasswordInput.vue";
+import AntRadio from "./inputs/AntRadio.vue";
+import AntRadioGroup from "./inputs/AntRadioGroup.vue";
+import AntRangeSlider from "./inputs/AntRangeSlider.vue";
+import AntSearch from "./inputs/AntSearch.vue";
+import AntSelect from "./inputs/AntSelect.vue";
+import AntSwitch from "./inputs/AntSwitch.vue";
+import AntSwitcher from "./inputs/AntSwitcher.vue";
+import AntTagInput from "./inputs/AntTagInput.vue";
+import AntNavLeftLayout from "./layouts/AntNavLeftLayout.vue";
+import AntNavbar from "./navbar/AntNavbar.vue";
+import AntNavbarItem from "./navbar/AntNavbarItem.vue";
+import AntTable from "./table/AntNavbar.vue";
+import AntTabs from "./tabs/AntTabs.vue";
+import AntTransitionCollapseHeight from "./transitions/AntTransitionCollapseHeight.vue";
 import AntAccordion from "./AntAccordion.vue";
 import AntAccordionItem from "./AntAccordionItem.vue";
 import AntAlert from "./AntAlert.vue";
+import AntContent from "./AntContent.vue";
 import AntDropdown from "./AntDropdown.vue";
 import AntIcon from "./AntIcon.vue";
 import AntKeycap from "./AntKeycap.vue";
@@ -9,20 +53,60 @@ import AntListGroupItem from "./AntListGroupItem.vue";
 import AntModal from "./AntModal.vue";
 import AntPagination from "./AntPagination.vue";
 import AntPopover from "./AntPopover.vue";
-import AntCrudTableFilter from "./crud/AntCrudTableFilter.vue";
 import AntSkeleton from "./AntSkeleton.vue";
 import AntSpinner from "./AntSpinner.vue";
-import AntTableNav from "./crud/AntCrudTableNav.vue";
 import AntTag from "./AntTag.vue";
 import AntToast from "./AntToast.vue";
+import AntToaster from "./AntToaster.vue";
 import AntTooltip from "./AntTooltip.vue";
-export * from "./deprecated/elements";
-export * from "./form/index.mjs";
-export * from "./form/Elements/index.mjs";
 export {
+  AntActionButton,
+  AntButton,
+  AntCreateButton,
+  AntDeleteButton,
+  AntDuplicateButton,
+  AntEditButton,
+  AntSaveAndNewButton,
+  AntSaveButton,
+  AntCrud,
+  AntCrudDetail,
+  AntCrudDetailActions,
+  AntCrudDetailNav,
+  AntCrudTableFilter,
+  AntCrudTableNav,
+  AntDeleteDialog,
+  AntDialog,
+  AntField,
+  AntFormGroup,
+  AntFormGroupLabel,
+  AntBaseInput,
+  AntDropDown,
+  AntInputDescription,
+  AntInputLabel,
+  AntInputLimiter,
+  AntCheckbox,
+  AntCheckboxGroup,
+  AntDateInput,
+  AntNumberInput,
+  AntPasswordInput,
+  AntRadio,
+  AntRadioGroup,
+  AntRangeSlider,
+  AntSearch,
+  AntSelect,
+  AntSwitch,
+  AntSwitcher,
+  AntTagInput,
+  AntNavLeftLayout,
+  AntNavbar,
+  AntNavbarItem,
+  AntTable,
+  AntTabs,
+  AntTransitionCollapseHeight,
   AntAccordion,
   AntAccordionItem,
   AntAlert,
+  AntContent,
   AntDropdown,
   AntIcon,
   AntKeycap,
@@ -31,11 +115,10 @@ export {
   AntModal,
   AntPagination,
   AntPopover,
-  AntCrudTableFilter,
   AntSkeleton,
   AntSpinner,
-  AntTableNav,
   AntTag,
   AntToast,
+  AntToaster,
   AntTooltip
 };