@antify/ui-module 1.6.0 → 1.7.2

package/dist/runtime/components/form/__stories/AntRangeSlider.stories.mjs

@@ -1,40 +0,0 @@
-import AntRangeSlider from "../AntRangeSlider.vue";
-import { ref } from "vue";
-import { InputColorType } from "../../../enums/index.mjs";
-const meta = {
-  title: "Components/Forms/Range Slider",
-  component: AntRangeSlider,
-  parameters: {
-    docs: {
-      description: {
-        component: "WIP: waiting for design to finish"
-      }
-    },
-    controls: {
-      sort: "requiredFirst"
-    }
-  },
-  argTypes: {
-    modelValue: {
-      control: "number",
-      description: "Reactive value"
-    },
-    colorType: {
-      control: { type: "select" },
-      options: Object.values(InputColorType)
-    }
-  }
-};
-export default meta;
-export const Docs = {
-  render: (args) => ({
-    components: { AntRangeSlider },
-    setup() {
-      const value = ref(1);
-      return { args, value };
-    },
-    template: `
-      <AntRangeSlider v-bind="args" v-model="value"/>
-    `
-  })
-};

package/dist/runtime/components/form/__stories/AntSearch.stories.mjs

@@ -1,43 +0,0 @@
-import { Size } from "../../../enums/Size.enum.mjs";
-import AntSearch from "../AntSearch.vue";
-const meta = {
-  title: "Components/Forms/Search",
-  component: AntSearch,
-  parameters: { controls: { sort: "requiredFirst" } },
-  argTypes: {
-    modelValue: {
-      control: "text",
-      table: { type: { summary: "string|null" } }
-    },
-    size: {
-      control: { type: "radio" },
-      options: Object.values(Size)
-    },
-    inputTimeout: {
-      description: "How long is the timeout between inputs to update the value in milliseconds"
-    },
-    query: {
-      description: "Read and write the value into url as urldecoded string. Using the given string as query name."
-    },
-    placeholder: {
-      table: { defaultValue: { summary: "Search" } }
-    }
-  }
-};
-export default meta;
-export const Docs = {
-  render: (args) => ({
-    components: { AntSearch },
-    setup() {
-      return { args };
-    },
-    template: `
-      <AntSearch v-bind="args" v-model="args.modelValue"/>
-      <div class="text-xs mt-4">Reactive value: {{ args.modelValue }}</div>
-    `
-  }),
-  args: {
-    modelValue: "",
-    placeholder: "Search"
-  }
-};

package/dist/runtime/components/form/__stories/AntSwitch.stories.mjs

@@ -1,218 +0,0 @@
-import { AntSwitch } from "../index.mjs";
-import { computed, ref } from "vue";
-import { InputColorType, Size } from "../../../enums/index.mjs";
-import { useFieldValidator } from "@antify/validate";
-const meta = {
-  title: "Components/Forms/Switch",
-  component: AntSwitch,
-  argTypes: {
-    colorType: {
-      control: { type: "select" },
-      options: Object.values(InputColorType)
-    },
-    size: {
-      control: { type: "select" },
-      options: Object.values(Size)
-    }
-  }
-};
-export default meta;
-export const Docs = {
-  render: (args) => ({
-    components: { AntSwitch },
-    setup() {
-      const value = computed({
-        // @ts-ignore
-        get: () => args.modelValue,
-        // @ts-ignore
-        set: (val) => args.modelValue = val
-      });
-      return { args, value };
-    },
-    template: `
-      <AntSwitch v-bind="args" v-model="value"/>
-    `
-  })
-};
-export const withValidator = {
-  render: Docs.render,
-  args: {
-    ...Docs.args,
-    validator: useFieldValidator([
-      (val) => {
-        return !val || "Must be false";
-      }
-    ])
-  }
-};
-export const Summary = {
-  parameters: {
-    chromatic: { disableSnapshot: false }
-  },
-  render: (args) => ({
-    components: { AntSwitch },
-    setup() {
-      const value = ref(true);
-      const notValue = ref(false);
-      return { args, value, notValue, InputColorType, Size };
-    },
-    template: `
-      <div class="flex flex-col gap-5 ">
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="value" :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="value" :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="value" :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="value" :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="value" :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="value" label="Test" :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="value" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="value" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="value" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" readonly label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" readonly label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" readonly label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" readonly label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" readonly label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" disabled label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" disabled label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" disabled label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" disabled label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" disabled label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" skeleton label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" skeleton label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" skeleton label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" skeleton label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" skeleton label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="value" :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" readonly :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" readonly :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" readonly :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" readonly :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" readonly :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" disabled :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" disabled :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" disabled :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" disabled :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" disabled :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitch v-bind="args" v-model="notValue" skeleton :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.base"/>
-          <AntSwitch v-bind="args" v-model="notValue" skeleton :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.info"/>
-          <AntSwitch v-bind="args" v-model="notValue" skeleton :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.success"/>
-          <AntSwitch v-bind="args" v-model="notValue" skeleton :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.warning"/>
-          <AntSwitch v-bind="args" v-model="notValue" skeleton :size="Size.sm" label="Test" value="Value" description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua." :color-type="InputColorType.danger"/>
-        </div>
-      </div>
-    `
-  })
-};

package/dist/runtime/components/form/__stories/AntSwitcher.stories.mjs

@@ -1,228 +0,0 @@
-import { computed, ref } from "vue";
-import { Size } from "../../../enums/index.mjs";
-import { useFieldValidator } from "@antify/validate";
-import { InputColorType } from "../../../enums/index.mjs";
-import { AntSwitcher } from "../index.mjs";
-const meta = {
-  title: "Components/Forms/Switcher",
-  component: AntSwitcher,
-  argTypes: {
-    modelValue: {
-      control: "text"
-    },
-    options: {
-      table: {
-        type: {
-          summary: "string | SwitcherOption[]",
-          detail: `
-type SwitcherOption = {
-  label: string;
-  value: string | number;
-  [key: string]: unknown;
-}
-          `
-        }
-      }
-    },
-    colorType: {
-      control: { type: "select" },
-      options: Object.values(InputColorType)
-    },
-    size: {
-      control: { type: "select" },
-      options: Object.values(Size)
-    }
-  }
-};
-export default meta;
-export const Docs = {
-  render: (args) => ({
-    components: { AntSwitcher },
-    setup() {
-      const modelValue = computed({
-        // @ts-ignore
-        get: () => args.modelValue,
-        // @ts-ignore
-        set: (val) => args.modelValue = val
-      });
-      return { args, modelValue };
-    },
-    template: `
-      <AntSwitcher v-bind="args" v-model="modelValue"/>
-    `
-  }),
-  args: {
-    options: [
-      {
-        label: "Entry 1",
-        value: "entry-1"
-      },
-      {
-        label: "Entry 2",
-        value: "entry-2"
-      },
-      {
-        label: "Entry 3",
-        value: "entry-3"
-      },
-      {
-        label: "Entry 4",
-        value: "entry-4"
-      }
-    ],
-    modelValue: "entry-1"
-  }
-};
-export const withValidator = {
-  render: Docs.render,
-  args: {
-    ...Docs.args,
-    validator: useFieldValidator([
-      (val) => {
-        return val.value !== "entry-1" || "Select something else";
-      }
-    ])
-  }
-};
-export const Summary = {
-  parameters: {
-    chromatic: { disableSnapshot: false }
-  },
-  render: (args) => ({
-    components: { AntSwitcher },
-    setup() {
-      const modelValue = computed({
-        // @ts-ignore
-        get: () => args.modelValue,
-        // @ts-ignore
-        set: (val) => args.modelValue = val
-      });
-      const skeleton = ref(true);
-      return { args, modelValue, InputColorType, skeleton };
-    },
-    template: `
-      <div class="flex flex-col gap-5 ">
-        <div class="flex gap-2.5">
-          <AntSwitcher v-bind="args" v-model="modelValue" :color-type="InputColorType.base"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" :color-type="InputColorType.info"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" :color-type="InputColorType.success"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" :color-type="InputColorType.warning"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitcher v-bind="args" v-model="modelValue" label="Label" :color-type="InputColorType.base"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" label="Label" :color-type="InputColorType.info"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" label="Label" :color-type="InputColorType.success"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" label="Label" :color-type="InputColorType.warning"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" label="Label" :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitcher v-bind="args" v-model="modelValue"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.base"/>
-          <AntSwitcher v-bind="args" v-model="modelValue"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.info"/>
-          <AntSwitcher v-bind="args" v-model="modelValue"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.success"/>
-          <AntSwitcher v-bind="args" v-model="modelValue"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.warning"/>
-          <AntSwitcher v-bind="args" v-model="modelValue"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitcher v-bind="args" v-model="modelValue" label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.base"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.info"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.success"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.warning"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitcher v-bind="args" v-model="modelValue" readonly label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.base"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" readonly label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.info"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" readonly label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.success"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" readonly label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.warning"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" readonly label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitcher v-bind="args" v-model="modelValue" disabled label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.base"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" disabled label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.info"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" disabled label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.success"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" disabled label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.warning"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" disabled label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.danger"/>
-        </div>
-        <div class="flex gap-2.5">
-          <AntSwitcher v-bind="args" v-model="modelValue" :skeleton="true" label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.base"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" :skeleton="true" label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.info"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" :skeleton="true" label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.success"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" :skeleton="true" label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.warning"/>
-          <AntSwitcher v-bind="args" v-model="modelValue" :skeleton="true" label="Label"
-                       description="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod"
-                       :color-type="InputColorType.danger"/>
-        </div>
-      </div>
-    `
-  }),
-  args: {
-    options: [
-      {
-        label: "Entry 1",
-        value: "entry-1"
-      },
-      {
-        label: "Entry 2",
-        value: "entry-2"
-      },
-      {
-        label: "Entry 3",
-        value: "entry-3"
-      },
-      {
-        label: "Entry 4",
-        value: "entry-4"
-      }
-    ],
-    modelValue: "entry-1"
-  }
-};