@antify/ui 2.4.4 → 2.4.10

package/dist/components/inputs/__stories/AntSelect.stories.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.withPlaceholder = exports.summary = exports.skeleton = exports.nullable = exports.manyOptions = exports.grouped = exports.ellipsisText = exports.disabled = exports.default = exports.WithSlots = exports.Docs = void 0;
+exports.withPlaceholder = exports.summary = exports.skeleton = exports.nullable = exports.manyOptions = exports.longOptions = exports.grouped = exports.ellipsisText = exports.disabled = exports.default = exports.WithSlots = exports.Docs = void 0;
 var _Size = require("../../../enums/Size.enum");
 var _AntSelect = _interopRequireDefault(require("../AntSelect.vue"));
 var _AntIcon = _interopRequireDefault(require("../../AntIcon.vue"));
@@ -11,6 +11,8 @@ var _AntSelectMenu = _interopRequireDefault(require("../Elements/AntSelectMenu.v
 var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
 var _vue = require("vue");
 var _enums = require("../../../enums");
+var _AntFormGroup = _interopRequireDefault(require("../../forms/AntFormGroup.vue"));
+var _AntFormGroupLabel = _interopRequireDefault(require("../../forms/AntFormGroupLabel.vue"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const meta = {
   title: "Inputs/Select",
@@ -81,6 +83,10 @@ const manySelectOptions = [...Array(24).keys()].map(key => ({
   label: `Option ${Number(key) + 1}`,
   value: Number(key) + 1
 }));
+const longSelectOptions = [...Array(4).keys()].map(key => ({
+  label: `Very Long Select Option Possibly Larger Than Container ${Number(key) + 1}`,
+  value: Number(key) + 1
+}));
 const Docs = exports.Docs = {
   render: args => ({
     components: {
@@ -193,6 +199,25 @@ const manyOptions = exports.manyOptions = {
     options: manySelectOptions
   }
 };
+const longOptions = exports.longOptions = {
+  render: (args, ctx) => ({
+    // @ts-ignore
+    components: Docs.render(args, ctx).components,
+    // @ts-ignore
+    setup: Docs.render(args, ctx).setup,
+    template: `
+      <div class="flex justify-center overflow-y-auto h-[100vh] p-2.5 dashed">
+        <div class="flex flex-col gap-4 justify-center h-[250vh] max-w-[150px]">
+          <AntSelect v-bind="args" v-model="modelValue"/>
+        </div>
+      </div>
+    `
+  }),
+  args: {
+    ...Docs.args,
+    options: longSelectOptions
+  }
+};
 const nullable = exports.nullable = {
   render: Docs.render,
   args: {
@@ -312,9 +337,18 @@ const summary = exports.summary = {
   },
   render: (args, ctx) => ({
     // @ts-ignore
-    components: Docs.render(args, ctx).components,
+    components: {
+      AntSelect: _AntSelect.default,
+      AntFormGroup: _AntFormGroup.default,
+      AntFormGroupLabel: _AntFormGroupLabel.default
+    },
     // @ts-ignore
-    setup: Docs.render(args, ctx).setup,
+    setup() {
+      return {
+        ...Docs.render(args, ctx).setup(),
+        longSelectOptions
+      };
+    },
     template: `
       <div class="p-4 flex flex-col gap-2.5">
         <div class="flex w-2/5 gap-2.5">
@@ -385,6 +419,16 @@ const summary = exports.summary = {
           <AntSelect v-bind="args" v-model="modelValue" size="sm" nullable state="warning"/>
           <AntSelect v-bind="args" v-model="modelValue" size="sm" nullable state="danger"/>
         </div>
+        <AntFormGroup>
+          <AntFormGroupLabel>Long Select Options</AntFormGroupLabel>
+        <div class="grid grid-cols-5 gap-2.5">
+          <AntSelect v-bind="args" v-model="modelValue" :options="longSelectOptions"/>
+           <AntSelect v-bind="args" v-model="modelValue" :options="longSelectOptions"/>
+           <AntSelect v-bind="args" v-model="modelValue" :options="longSelectOptions"/>
+           <AntSelect v-bind="args" v-model="modelValue" :options="longSelectOptions"/>
+           <AntSelect v-bind="args" v-model="modelValue" :options="longSelectOptions"/>
+        </div>
+        </AntFormGroup>
       </div>
     `
   }),

package/dist/components/inputs/__stories/AntSelect.stories.mjs

@@ -15,6 +15,8 @@ import {
 import {
   InputState
 } from "../../../enums/index.mjs";
+import AntFormGroup from "../../forms/AntFormGroup.vue";
+import AntFormGroupLabel from "../../forms/AntFormGroupLabel.vue";
 const meta = {
   title: "Inputs/Select",
   component: AntSelect,
@@ -91,6 +93,12 @@ const manySelectOptions = [
   label: `Option ${Number(key) + 1}`,
   value: Number(key) + 1
 }));
+const longSelectOptions = [
+  ...Array(4).keys()
+].map((key) => ({
+  label: `Very Long Select Option Possibly Larger Than Container ${Number(key) + 1}`,
+  value: Number(key) + 1
+}));
 export const Docs = {
   render: (args) => ({
     components: {
@@ -208,6 +216,25 @@ export const manyOptions = {
     options: manySelectOptions
   }
 };
+export const longOptions = {
+  render: (args, ctx) => ({
+    // @ts-ignore
+    components: Docs.render(args, ctx).components,
+    // @ts-ignore
+    setup: Docs.render(args, ctx).setup,
+    template: `
+      <div class="flex justify-center overflow-y-auto h-[100vh] p-2.5 dashed">
+        <div class="flex flex-col gap-4 justify-center h-[250vh] max-w-[150px]">
+          <AntSelect v-bind="args" v-model="modelValue"/>
+        </div>
+      </div>
+    `
+  }),
+  args: {
+    ...Docs.args,
+    options: longSelectOptions
+  }
+};
 export const nullable = {
   render: Docs.render,
   args: {
@@ -334,9 +361,18 @@ export const summary = {
   },
   render: (args, ctx) => ({
     // @ts-ignore
-    components: Docs.render(args, ctx).components,
+    components: {
+      AntSelect,
+      AntFormGroup,
+      AntFormGroupLabel
+    },
     // @ts-ignore
-    setup: Docs.render(args, ctx).setup,
+    setup() {
+      return {
+        ...Docs.render(args, ctx).setup(),
+        longSelectOptions
+      };
+    },
     template: `
       <div class="p-4 flex flex-col gap-2.5">
         <div class="flex w-2/5 gap-2.5">
@@ -407,6 +443,16 @@ export const summary = {
           <AntSelect v-bind="args" v-model="modelValue" size="sm" nullable state="warning"/>
           <AntSelect v-bind="args" v-model="modelValue" size="sm" nullable state="danger"/>
         </div>
+        <AntFormGroup>
+          <AntFormGroupLabel>Long Select Options</AntFormGroupLabel>
+        <div class="grid grid-cols-5 gap-2.5">
+          <AntSelect v-bind="args" v-model="modelValue" :options="longSelectOptions"/>
+           <AntSelect v-bind="args" v-model="modelValue" :options="longSelectOptions"/>
+           <AntSelect v-bind="args" v-model="modelValue" :options="longSelectOptions"/>
+           <AntSelect v-bind="args" v-model="modelValue" :options="longSelectOptions"/>
+           <AntSelect v-bind="args" v-model="modelValue" :options="longSelectOptions"/>
+        </div>
+        </AntFormGroup>
       </div>
     `
   }),

package/dist/components/inputs/__types/index.d.ts

@@ -5,3 +5,4 @@ export * from './AntSelect.types';
 export * from './AntSwitcher.types';
 export * from './AntTagInput.types';
 export * from './AntTextInput.types';
+export * from '../AntColorInput/AntColorInput.types';

package/dist/components/inputs/__types/index.js

@@ -79,4 +79,15 @@ Object.keys(_AntTextInput).forEach(function (key) {
       return _AntTextInput[key];
     }
   });
+});
+var _AntColorInput = require("../AntColorInput/AntColorInput.types");
+Object.keys(_AntColorInput).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _AntColorInput[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _AntColorInput[key];
+    }
+  });
 });

package/dist/components/inputs/__types/index.mjs

@@ -5,3 +5,4 @@ export * from "./AntSelect.types.mjs";
 export * from "./AntSwitcher.types.mjs";
 export * from "./AntTagInput.types.mjs";
 export * from "./AntTextInput.types.mjs";
+export * from "../AntColorInput/AntColorInput.types.mjs";

package/package.json

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