adata-ui 4.0.42 → 4.0.44

package/README.md

@@ -1,84 +1,84 @@
-<!--
-Get your module up and running quickly.
-
-Find and replace all on all files (CMD+SHIFT+F):
-- Name: My Module
-- Package name: my-module
-- Description: My new Nuxt module
--->
-
-# My Module
-
-[![npm version][npm-version-src]][npm-version-href]
-[![npm downloads][npm-downloads-src]][npm-downloads-href]
-[![License][license-src]][license-href]
-[![Nuxt][nuxt-src]][nuxt-href]
-
-My new Nuxt module for doing amazing things.
-
-- [✨ &nbsp;Release Notes](/CHANGELOG.md)
-<!-- - [🏀 Online playground](https://stackblitz.com/github/your-org/my-module?file=playground%2Fapp.vue) -->
-<!-- - [📖 &nbsp;Documentation](https://example.com) -->
-
-## Features
-
-<!-- Highlight some of the features your module provide here -->
-- ⛰ &nbsp;Foo
-- 🚠 &nbsp;Bar
-- 🌲 &nbsp;Baz
-
-## Quick Setup
-
-Install the module to your Nuxt application with one command:
-
-```bash
-npx nuxi module add my-module
-```
-
-That's it! You can now use My Module in your Nuxt app ✨
-
-
-## Contribution
-
-<details>
-  <summary>Local development</summary>
-  
-  ```bash
-  # Install dependencies
-  npm install
-  
-  # Generate type stubs
-  npm run dev:prepare
-  
-  # Develop with the playground
-  npm run dev
-  
-  # Build the playground
-  npm run dev:build
-  
-  # Run ESLint
-  npm run lint
-  
-  # Run Vitest
-  npm run test
-  npm run test:watch
-  
-  # Release new version
-  npm run release
-  ```
-
-</details>
-
-
-<!-- Badges -->
-[npm-version-src]: https://img.shields.io/npm/v/my-module/latest.svg?style=flat&colorA=020420&colorB=00DC82
-[npm-version-href]: https://npmjs.com/package/my-module
-
-[npm-downloads-src]: https://img.shields.io/npm/dm/my-module.svg?style=flat&colorA=020420&colorB=00DC82
-[npm-downloads-href]: https://npm.chart.dev/my-module
-
-[license-src]: https://img.shields.io/npm/l/my-module.svg?style=flat&colorA=020420&colorB=00DC82
-[license-href]: https://npmjs.com/package/my-module
-
-[nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js
-[nuxt-href]: https://nuxt.com
+<!--
+Get your module up and running quickly.
+
+Find and replace all on all files (CMD+SHIFT+F):
+- Name: My Module
+- Package name: my-module
+- Description: My new Nuxt module
+-->
+
+# My Module
+
+[![npm version][npm-version-src]][npm-version-href]
+[![npm downloads][npm-downloads-src]][npm-downloads-href]
+[![License][license-src]][license-href]
+[![Nuxt][nuxt-src]][nuxt-href]
+
+My new Nuxt module for doing amazing things.
+
+- [✨ &nbsp;Release Notes](/CHANGELOG.md)
+<!-- - [🏀 Online playground](https://stackblitz.com/github/your-org/my-module?file=playground%2Fapp.vue) -->
+<!-- - [📖 &nbsp;Documentation](https://example.com) -->
+
+## Features
+
+<!-- Highlight some of the features your module provide here -->
+- ⛰ &nbsp;Foo
+- 🚠 &nbsp;Bar
+- 🌲 &nbsp;Baz
+
+## Quick Setup
+
+Install the module to your Nuxt application with one command:
+
+```bash
+npx nuxi module add my-module
+```
+
+That's it! You can now use My Module in your Nuxt app ✨
+
+
+## Contribution
+
+<details>
+  <summary>Local development</summary>
+  
+  ```bash
+  # Install dependencies
+  npm install
+  
+  # Generate type stubs
+  npm run dev:prepare
+  
+  # Develop with the playground
+  npm run dev
+  
+  # Build the playground
+  npm run dev:build
+  
+  # Run ESLint
+  npm run lint
+  
+  # Run Vitest
+  npm run test
+  npm run test:watch
+  
+  # Release new version
+  npm run release
+  ```
+
+</details>
+
+
+<!-- Badges -->
+[npm-version-src]: https://img.shields.io/npm/v/my-module/latest.svg?style=flat&colorA=020420&colorB=00DC82
+[npm-version-href]: https://npmjs.com/package/my-module
+
+[npm-downloads-src]: https://img.shields.io/npm/dm/my-module.svg?style=flat&colorA=020420&colorB=00DC82
+[npm-downloads-href]: https://npm.chart.dev/my-module
+
+[license-src]: https://img.shields.io/npm/l/my-module.svg?style=flat&colorA=020420&colorB=00DC82
+[license-href]: https://npmjs.com/package/my-module
+
+[nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js
+[nuxt-href]: https://nuxt.com

package/dist/module.json

@@ -5,7 +5,7 @@
     "nuxt": ">=3.16.0"
   },
   "failOnWarn": false,
-  "version": "4.0.42",
+  "version": "4.0.44",
   "builder": {
     "@nuxt/module-builder": "1.0.1",
     "unbuild": "3.5.0"

package/dist/runtime/components/Alert.vue

@@ -1,30 +1,30 @@
 <template>
-  <div
-    class="inline-flex w-full rounded-md"
-    :class="twMerge(colorOptions.description[color], textBgClasses)"
-  >
-    <div
-      class="flex items-center justify-center rounded-l-md"
-      :class="twMerge([colorOptions.icon[color], sizeOptions[size]], iconBgClasses)"
-    >
-      <slot name="icon">
-        <i-info-circle
-          v-if="iconType == 'circle'"
-          :class="`w-[${iconSize}] h-[${iconSize}]`"
-        />
-        <i-warning-triangle
-          v-if="iconType == 'triangle'"
-          :class="`w-[${iconSize}] h-[${iconSize}]`"
-        />
-      </slot>
-    </div>
-    <div
-      :class="sizeOptions[size]"
-      class="rounded-r-md flex items-center"
-    >
-      <slot name="default" />
-    </div>
-  </div>
+  <div
+    class="inline-flex w-full rounded-md"
+    :class="twMerge(colorOptions.description[color], textBgClasses)"
+  >
+    <div
+      class="flex items-center justify-center rounded-l-md"
+      :class="twMerge([colorOptions.icon[color], sizeOptions[size]], iconBgClasses)"
+    >
+      <slot name="icon">
+        <i-info-circle
+          v-if="iconType == 'circle'"
+          :class="`w-[${iconSize}] h-[${iconSize}]`"
+        />
+        <i-warning-triangle
+          v-if="iconType == 'triangle'"
+          :class="`w-[${iconSize}] h-[${iconSize}]`"
+        />
+      </slot>
+    </div>
+    <div
+      :class="sizeOptions[size]"
+      class="rounded-r-md flex items-center"
+    >
+      <slot name="default" />
+    </div>
+  </div>
 </template>
 
 <script setup>

package/dist/runtime/components/Chip.vue

@@ -0,0 +1,24 @@
+<script setup>
+import { twMerge } from "tailwind-merge";
+defineProps({
+  size: { type: String, required: false, default: "sm" },
+  view: { type: String, required: false, default: "outline" }
+});
+const chipView = {
+  standard: "text-deepblue border-gray focus-visible:outline-gray",
+  outline: "text-blue border-blue focus-visible:outline-blue"
+};
+const sizeOptions = {
+  sm: "h-4",
+  md: "h-5",
+  lg: "h-7"
+};
+</script>
+
+<template>
+  <button
+    :class="twMerge(['flex items-center gap-2 rounded-3xl border border-solid px-2.5 text-xs hover:bg-deepblue-100 dark:hover:bg-[#E3E5E80D] focus-visible:shadow-[0_0_0_4px#1B64B3] active:bg-blue active:text-white disabled:border-deepblue-200 disabled:text-deepblue-200', chipView[view], sizeOptions[size]], $attrs.class)"
+  >
+    <slot />
+  </button>
+</template>

package/dist/runtime/components/Chip.vue.d.ts

@@ -0,0 +1,19 @@
+type Props = {
+    size?: 'sm' | 'md' | 'lg';
+    view?: 'standard' | 'outline';
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    size: "sm" | "md" | "lg";
+    view: "standard" | "outline";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DigitBadge.vue.d.ts

@@ -13,8 +13,8 @@ export type StateType = {
 declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
     size: "sm" | "md" | "lg";
     type: "primary" | "success" | "danger" | "gray" | "orange" | "warning";
-    disabled: boolean;
     view: "default" | "inverted";
+    disabled: boolean;
     customClasses: string;
     prefix: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/Header.vue.d.ts

@@ -26,10 +26,10 @@ declare const __VLS_component: import("vue").DefineComponent<Props, {}, {}, {},
     daysRemaining: number;
     limitRemaining: number;
     isAuthenticated: boolean;
+    mobileHeaderType: "search" | "default";
     module: ProjectKeys;
     rate: string;
     balance: number;
-    mobileHeaderType: "search" | "default";
     showLogIn: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/runtime/components/Tag.vue

@@ -39,8 +39,8 @@ const typeSwitchValues = {
 </script>
 
 <template>
-  <div :class="[[classes], customClasses]">
-    <slot name="point" />
-    <slot />
-  </div>
+  <div :class="[[classes], customClasses]">
+    <slot name="point" />
+    <slot />
+  </div>
 </template>

package/dist/runtime/components/accordion/Accordion.vue.d.ts

@@ -28,8 +28,8 @@ declare const __VLS_component: import("vue").DefineComponent<Props, {
     size: import("./types.js").Size;
     color: import("./types.js").Color;
     disabled: boolean;
-    slot: string;
     defaultOpen: boolean;
+    slot: string;
     divider: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/runtime/components/button/Button.vue

@@ -8,7 +8,7 @@ const props = defineProps({
   view: { type: String, required: false, default: "default" },
   size: { type: String, required: false, default: "lg" },
   form: { type: String, required: false, default: "button" },
-  icon: { type: null, required: false },
+  icon: { type: [Object, Function], required: false },
   iconClass: { type: String, required: false, default: "" },
   loading: { type: Boolean, required: false, default: false },
   disabled: { type: Boolean, required: false, default: false },

package/dist/runtime/components/button/Button.vue.d.ts

@@ -18,15 +18,15 @@ type __VLS_Slots = {} & {
 };
 declare const __VLS_component: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
     size: "sm" | "md" | "lg" | "xl";
+    view: "default" | "outline" | "transparent";
     disabled: boolean;
     active: boolean;
-    view: "default" | "outline" | "transparent";
+    to: string;
+    loading: boolean;
     variant: "primary" | "success" | "danger" | "gray" | "ghost";
     form: "icon" | "button";
     iconClass: string;
-    loading: boolean;
     block: boolean;
-    to: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/runtime/components/forms/input/textarea/ATextarea.vue.d.ts

@@ -24,9 +24,9 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps,
     "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
 }>, {
     size: "sm" | "md";
+    error: string | boolean;
     disabled: boolean;
     required: boolean;
-    error: string | boolean;
     label: string;
     readonly: boolean;
     clearable: boolean;

package/dist/runtime/components/pill-tabs/PillTabs.vue.d.ts

@@ -24,8 +24,8 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps,
     size: "lg" | "sm" | "xs";
     view: "transparent" | "main" | "gray" | "blue" | "mobile";
     block: boolean;
-    badgeSize: "sm" | "md" | "lg";
     align: "left" | "center";
+    badgeSize: "sm" | "md" | "lg";
     wrapper: "column" | "row";
     countView: "badge" | "brackets";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/row-card/RowCard.vue

@@ -7,7 +7,7 @@ const props = defineProps({
   titleClasses: { type: String, required: false },
   cardClasses: { type: String, required: false },
   valueClasses: { type: String, required: false },
-  icon: { type: null, required: false }
+  icon: { type: [Object, Function], required: false }
 });
 const combinedCardClasses = twMerge("flex justify-between items-center rounded-md py-3 px-4 dark:bg-gray-900 bg-white", props.cardClasses);
 const combinedLeadingClasses = twMerge("rounded-full size-4", props.leadingColor);

package/dist/runtime/components/select-row/index.vue

@@ -0,0 +1,117 @@
+<script setup>
+import { isEqual } from "lodash-es";
+import { twMerge } from "tailwind-merge";
+import { computed, ref } from "#imports";
+const props = defineProps({
+  clearable: { type: Boolean, required: false, default: true },
+  disabled: { type: Boolean, required: false, default: false },
+  deletable: { type: Boolean, required: false, default: false },
+  label: { type: String, required: true, default: "select" },
+  selectedItems: { type: Array, required: true },
+  btnClass: { type: String, required: false, default: "" }
+});
+const items = computed(() => {
+  return props.selectedItems;
+});
+const emits = defineEmits(["delete"]);
+const disabledStyles = "disabled:pointer-events-none disabled:opacity-40 disabled:bg-deepblue-50 disabled:text-deepblue-200 disabled:dark:text-gray-500";
+const isOpen = defineModel("isOpen", { type: Boolean });
+const minWidthOfChip = 100;
+const buttonElement = ref();
+const buttonWidth = computed(() => buttonElement.value?.offsetWidth - 50);
+const itemsCount = computed(() => {
+  return items.value.length;
+});
+const maxWidthOfChip = computed(() => {
+  if (itemsCount.value) {
+    const width = (itemsCount.value <= 5 ? buttonWidth.value - itemsCount.value * 8 : buttonWidth.value) / itemsCount.value;
+    if (width < minWidthOfChip) {
+      return minWidthOfChip;
+    }
+    return width;
+  }
+  return "auto";
+});
+const countOfVisibleItems = computed(() => {
+  if (!items.value?.length) return void 0;
+  const maxCountOfVisibleItems = Math.floor((buttonElement.value?.offsetWidth - 50) / 120);
+  if (maxCountOfVisibleItems > items.value.length) return items.value.length;
+  else return maxCountOfVisibleItems;
+});
+const visibleItems = computed(() => {
+  if (!items.value.length && !countOfVisibleItems.value) return void 0;
+  return items.value.slice(0, countOfVisibleItems.value);
+});
+const countOfUnvisibleItems = computed(() => {
+  if (!items.value?.length && !countOfVisibleItems.value) return void 0;
+  return items.value.length - countOfVisibleItems.value;
+});
+const deleteItem = (item) => {
+  emits("delete", item);
+  items.value = items.value?.filter((el) => !isEqual(el, item));
+};
+const onClear = () => {
+  items.value.length = 0;
+};
+</script>
+
+<template>
+  <div>
+    <button
+      ref="buttonElement"
+      class="hover:border-blue focus-visible:outline-blue
+      relative flex w-full items-center justify-between gap-2 rounded-md
+      border border-solid border-deepblue-50 bg-deepblue-50 min-h-[40px] text-gray-500 body-400 px-4 py-1.5
+      focus-visible:shadow-[0_0_0_4px#1B64B3] dark:border-gray-900 dark:bg-gray-200/5
+      dark:hover:border-blue-700"
+      :class="twMerge(disabledStyles, props.btnClass)"
+      :disabled="disabled"
+      @click="isOpen = !isOpen"
+    >
+      <div>
+        <div
+          v-if="visibleItems && visibleItems.length"
+          class="flex gap-2"
+        >
+          <adt-chip
+            v-for="item in visibleItems"
+            :key="item.id"
+            size="md"
+            class="text-deepblue-900 dark:text-gray-200 border-gray-500"
+            :style="{ 'max-width': maxWidthOfChip + 'px' }"
+          >
+            <span class="truncate">{{ item.name }}</span>
+            <button
+              v-if="deletable"
+              class="rounded-full bg-deepblue-100 dark:bg-gray-200/10"
+              @click.stop="deleteItem(item)"
+            >
+              <a-icon-x-mark class="size-3 dark:text-gray-300" />
+            </button>
+          </adt-chip>
+          <adt-chip
+            v-if="countOfUnvisibleItems"
+            class="text-blue-700 dark:text-blue-500 border-blue-700 dark:border-blue-500 whitespace-nowrap"
+            size="md"
+          >
+            + {{ countOfUnvisibleItems }}
+          </adt-chip>
+        </div>
+        <div v-else>
+          {{ label }}
+        </div>
+      </div>
+      <!--      <button -->
+      <!--        v-if="visibleItems && countOfVisibleItems && clearable" -->
+      <!--        class="absolute right-10 top-1/2 -translate-y-1/2 rounded-full bg-deepblue-100 dark:bg-gray-200/10" -->
+      <!--        @click.stop="onClear" -->
+      <!--      > -->
+      <!--        <a-icon-chevron-down class="!m-0 text-base dark:text-gray-300"/> -->
+      <!--      </button> -->
+      <a-icon-chevron-down
+        class="!m-0 min-w-4 transition-all text-deepblue-900 dark:text-gray-500"
+        :class="{ '-rotate-90': !isOpen }"
+      />
+    </button>
+  </div>
+</template>

package/dist/runtime/components/select-row/index.vue.d.ts

@@ -0,0 +1,31 @@
+type Item = {
+    id: number | string;
+    name: string;
+};
+interface Props {
+    clearable?: boolean;
+    disabled?: boolean;
+    deletable?: boolean;
+    label: string;
+    selectedItems: Item[];
+    btnClass?: string;
+}
+type __VLS_Props = Props;
+type __VLS_PublicProps = __VLS_Props & {
+    'isOpen'?: boolean;
+};
+declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:isOpen": (value: boolean | undefined) => any;
+} & {
+    delete: (item: Item) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onDelete?: ((item: Item) => any) | undefined;
+    "onUpdate:isOpen"?: ((value: boolean | undefined) => any) | undefined;
+}>, {
+    disabled: boolean;
+    label: string;
+    clearable: boolean;
+    deletable: boolean;
+    btnClass: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/tree-select/TreeSelect.vue

@@ -0,0 +1,132 @@
+<script setup>
+import { useDebounceFn } from "@vueuse/shared";
+import highlight from "../../composables/highlight";
+import TreeSelectNodes from "./components/tree-select-nodes.vue";
+import { useTreeService } from "./TreeService";
+import { watch, computed, onMounted } from "#imports";
+const emits = defineEmits(["update:modelValue"]);
+const props = defineProps({
+  options: { type: Array, required: true },
+  modelValue: { type: Array, required: true },
+  type: { type: String, required: false, default: "checkbox" },
+  isSearch: { type: Boolean, required: false },
+  searchText: { type: String, required: false, default: "" },
+  asyncSearch: { type: Function, required: false },
+  withoutId: { type: Boolean, required: false, default: false }
+});
+const {
+  nestedTree,
+  tree,
+  setState,
+  setExpandableClosed,
+  initTree,
+  collectSelectedIds,
+  updateNestedTree,
+  searchedData,
+  toggleHiddenNodes,
+  reset,
+  toggleExpandableNodes
+} = useTreeService(props.withoutId);
+const selected = computed({
+  get() {
+    return props.modelValue;
+  },
+  set(val) {
+    emits("update:modelValue", val);
+  }
+});
+initTree(props.options);
+const toggleExpand = (node) => {
+  if (node.expandable) {
+    setExpandableClosed(node.id, !node.expandableClosed);
+  }
+};
+const toggleCheckbox = (id, checked) => {
+  setState(id, checked ? "checked" : "unchecked");
+};
+function openFounded(nodes) {
+  nodes.forEach((node) => {
+    node.expandableClosed = false;
+    node.text = highlight(node.text, props.searchText);
+    if (node.child.length) {
+      openFounded(node.child);
+    }
+  });
+}
+function filterOptions(options, search) {
+  return options.map((option) => {
+    const matches = option.name.toLowerCase().includes(search.toLowerCase());
+    const matchesWithId = option.id?.toString().toLowerCase().includes(search.toLowerCase());
+    let filteredChildren = [];
+    if (option.children) {
+      filteredChildren = filterOptions(option.children, search);
+    }
+    if (matches || matchesWithId || filteredChildren.length > 0) {
+      return {
+        ...option,
+        children: filteredChildren
+      };
+    }
+    return null;
+  }).filter(Boolean);
+}
+const debouncedSearch = useDebounceFn(async () => {
+  if (props.searchText !== "") {
+    if (props?.asyncSearch) {
+      const searchData = await props.asyncSearch(props.searchText);
+      searchedData(searchData, props.searchText);
+    } else {
+      const searchData = filterOptions(props.options, props.searchText);
+      searchedData(searchData, props.searchText);
+    }
+  } else {
+    toggleHiddenNodes(false);
+    toggleExpandableNodes(true);
+    updateNestedTree();
+  }
+}, 300);
+watch(
+  () => props.searchText,
+  (newVal) => debouncedSearch()
+);
+onMounted(() => {
+  if (props.modelValue && props.modelValue.length) {
+    props.modelValue.forEach((id) => {
+      setState(id, "checked");
+    });
+  }
+  if (props.isSearch) {
+  }
+});
+watch(
+  tree,
+  () => {
+    if (tree.value) {
+      selected.value = collectSelectedIds(tree.value);
+    }
+  },
+  { deep: true }
+);
+defineExpose({
+  reset
+});
+</script>
+
+<template>
+  <div>
+    <ul>
+      <template
+        v-for="node in nestedTree"
+        :key="node.id"
+      >
+        <TreeSelectNodes
+          v-if="!node?.hidden"
+          :node="node"
+          :toggle-expand="toggleExpand"
+          :toggle-checkbox="toggleCheckbox"
+          :type="type"
+        />
+      </template>
+    </ul>
+  </div>
+</template>