adata-ui 3.0.2 → 3.1.0

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

@@ -0,0 +1,100 @@
+<template>
+  <li
+    :style="{ 'padding-left': `${node.level * 20}px` }"
+    :class="[
+  { 'bg-[#2C3E500D] dark:bg-[#E3E5E80D]': node.state === 'checked' && type === 'select' }
+]"
+  >
+    <div
+      v-if="!node?.hidden"
+      class="flex items-center gap-1 p-2"
+    >
+      <div class="min-w-4">
+        <i-chevron-down
+          v-if="node.expandable"
+          width="16"
+          height="16"
+          :class="['cursor-pointer transition-all', { '-rotate-90': node.expandableClosed }]"
+          @click="toggleExpand(node)"
+        />
+      </div>
+      <div
+        v-if="type === 'select'"
+        class="w-full"
+      >
+        <input
+          :id="node.id.toString()"
+          type="checkbox"
+          class="hidden"
+          :checked="node.state === 'checked'"
+          @change="handleCheckboxChange"
+        >
+        <label
+          :for="node.id.toString()"
+          class="flex grow cursor-pointer items-center justify-between gap-4"
+        >
+          <span
+            :class="{ 'font-semibold': node.level === 0 }"
+            v-html="node.text"
+          />
+          <checkbox-active
+            v-if="node.state === 'checked'"
+            class="min-w-4 text-blue-700"
+          />
+        </label>
+      </div>
+      <adt-checkbox
+        v-if="type === 'checkbox'"
+        size="lg"
+        :model-value="node.state === 'checked'"
+        :name="`${node.id}`"
+        :intermediate="node.state === 'indeterminate'"
+        side="right"
+        always-intermediate
+        @change="handleCheckboxChange"
+      >
+        <span
+          class="heading-05"
+          v-html="node.text"
+        />
+      </adt-checkbox>
+    </div>
+
+    <!--    <a-transition-height> -->
+    <ul v-if="node.expandable && !node.expandableClosed">
+      <template
+        v-for="childNode in node.child"
+        :key="childNode.id"
+      >
+        <tree-select-nodes
+          :node="childNode"
+          :toggle-expand="toggleExpand"
+          :toggle-checkbox="toggleCheckbox"
+          :type="type"
+        />
+      </template>
+    </ul>
+    <!--    </a-transition-height> -->
+  </li>
+</template>
+
+<script setup>
+import IChevronDown from "#icons/arrow/chevron-down.vue";
+import CheckboxActive from "#icons/checkbox/checkbox-active.vue";
+const props = defineProps({
+  node: { type: Object, required: true },
+  toggleExpand: { type: Function, required: true },
+  toggleCheckbox: { type: Function, required: true },
+  type: { type: String, required: true }
+});
+const handleCheckboxChange = (event) => {
+  props.toggleCheckbox(props.node.id, event.target.checked);
+};
+const toggleExpand = (node) => {
+  props.toggleExpand(node);
+};
+</script>
+
+<style scoped>
+
+</style>

package/dist/runtime/components/tree-select/components/tree-select-nodes.vue.d.ts

@@ -0,0 +1,9 @@
+import type { TreeNestedNode } from '~/src/runtime/components/tree-select/types';
+interface Props {
+    node: TreeNestedNode;
+    toggleExpand: Function;
+    toggleCheckbox: Function;
+    type: 'checkbox' | 'select';
+}
+declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/tree-select/types.d.ts

@@ -0,0 +1,29 @@
+export interface TreeNode {
+    id: string | number;
+    name: string;
+    state: TreeNodeState;
+    level: number;
+    expandable: boolean;
+    expandableClosed: boolean;
+    parent: string | number | null;
+    hidden?: boolean;
+    child: (string | number)[];
+}
+export interface TreeNestedNode {
+    id: string | number;
+    name: string;
+    state: TreeNodeState;
+    level: number;
+    expandable: boolean;
+    expandableClosed: boolean;
+    text: string;
+    hidden: boolean;
+    child: TreeNestedNode[];
+}
+export type TreeData = {
+    id: number | string;
+    name: string;
+    children?: TreeData[];
+};
+export type TreeNodeState = 'checked' | 'unchecked' | 'indeterminate';
+export type TreeNodeStateEditable = 'checked' | 'unchecked';

package/dist/runtime/composables/highlight.d.ts

@@ -0,0 +1 @@
+export default function (text: string, search?: string): string;

package/dist/runtime/composables/highlight.js

@@ -0,0 +1,15 @@
+export default function(text, search = "") {
+  let label = text || "";
+  const index = label.toLowerCase().indexOf(search?.toLowerCase());
+  const regExp = new RegExp(search, "gi");
+  if (index >= 0) {
+    label = label.replace(
+      regExp,
+      `<span class="bg-yellow-200 dark:text-gray-950 dark:bg-yellow-300">${label.substring(
+        index,
+        index + search.length
+      )}</span>`
+    );
+  }
+  return label;
+}

package/dist/runtime/composables/projectState.d.ts

@@ -0,0 +1,2 @@
+export declare const useCurrentModule: () => any;
+export declare const useContacts: () => any;

package/dist/runtime/composables/projectState.js

@@ -0,0 +1,3 @@
+import { useState } from "#imports";
+export const useCurrentModule = () => useState("current-module", () => "pk");
+export const useContacts = () => useState("contacts", () => []);