@xy-planning-network/trees 0.4.6 → 0.4.8-rc-2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xy-planning-network/trees",
-  "version": "0.4.6",
+  "version": "0.4.8-rc-2",
   "description": "",
   "license": "MIT",
   "repository": "github:xy-planning-network/trees",
@@ -58,7 +58,7 @@
   "dependencies": {
     "@headlessui/vue": "^1.4.2",
     "@heroicons/vue": "^1.0.5",
-    "axios": "^0.21.4",
+    "axios": "^0.27.2",
     "flatpickr": "^4.6.9"
   },
   "peerDependencies": {

package/src/lib-components/forms/MultiCheckboxes.vue

@@ -79,7 +79,7 @@ const onChange = (checked: boolean, val: CheckboxValue) => {
         >
           <div class="flex items-center h-5">
             <input
-              :id="uuid"
+              :id="`${uuid}-${index}`"
               :aria-labelledby="`${uuid}-${index}-label`"
               :aria-describedby="
                 option?.help && option.help
@@ -91,7 +91,9 @@ const onChange = (checked: boolean, val: CheckboxValue) => {
               class="focus:ring-blue-500 h-4 w-4 text-blue-500 border-gray-600 rounded disabled:opacity-50 disabled:cursor-not-allowed"
               type="checkbox"
               v-bind="{
-              onChange: ($event) => { onChange(($event.target as HTMLInputElement).checked, option.value) },
+              onChange: ($event) => { 
+                onChange(($event.target as HTMLInputElement).checked, option.value)
+              },
               ...$attrs,
             }"
             />
@@ -105,7 +107,7 @@ const onChange = (checked: boolean, val: CheckboxValue) => {
                 option.disabled === true
               "
               :id="`${uuid}-${index}-label`"
-              :for="uuid"
+              :for="`${uuid}-${index}`"
               :label="option.label"
             />
             <InputHelp

package/src/lib-components/forms/Radio.vue

@@ -93,7 +93,7 @@ const hasLegend = computed(() => {
                 option.disabled === true
               "
               :id="`${uuid}-${index}-label`"
-              :for="uuid"
+              :for="`${uuid}-${index}`"
               :label="option.label"
             />
             <InputHelp

package/types/api/base.d.ts

@@ -1,12 +1,18 @@
-import { AxiosPromise, AxiosRequestConfig } from "axios";
+import { AxiosResponse, AxiosRequestConfig } from "axios";
+export declare type RequestMethod = "GET" | "get" | "PUT" | "put" | "POST" | "post" | "DELETE" | "delete";
+export interface TreesResponse<T> extends AxiosResponse<T> {
+    data: T;
+}
 export interface RequestOptions {
+    dataIntercept?: boolean;
     skipLoader?: boolean;
+    withDelay?: number;
 }
 declare const BaseAPI: {
-    makeRequest(config: AxiosRequestConfig, opts: RequestOptions): AxiosPromise;
-    get(path: string, opts: RequestOptions, params?: Record<string, unknown> | undefined): AxiosPromise;
-    delete(path: string, opts: RequestOptions): AxiosPromise;
-    post(path: string, data: Record<string, unknown>, opts: RequestOptions): AxiosPromise;
-    put(path: string, data: Record<string, unknown>, opts: RequestOptions): AxiosPromise;
+    makeRequest<T = any>(config: AxiosRequestConfig, opts: RequestOptions): Promise<T>;
+    get<T_1 = any>(path: string, opts: RequestOptions, params?: Record<string, unknown> | undefined): Promise<T_1>;
+    delete<T_2 = any>(path: string, opts: RequestOptions): Promise<T_2>;
+    post<T_3 = any>(path: string, data: Record<string, unknown>, opts: RequestOptions): Promise<T_3>;
+    put<T_4 = any>(path: string, data: Record<string, unknown>, opts: RequestOptions): Promise<T_4>;
 };
 export default BaseAPI;

package/types/composables/index.d.ts

@@ -0,0 +1,4 @@
+import { default as useBaseAPI, useBaseAPIGet, useBaseAPIPut, useBaseAPIPost, useBaseAPIDelete } from "./useBaseAPI";
+import type { UseBaseAPIOptions, UseBaseAPI } from "./useBaseAPI";
+export type { UseBaseAPIOptions, UseBaseAPI };
+export { useBaseAPI, useBaseAPIGet, useBaseAPIPut, useBaseAPIPost, useBaseAPIDelete, };

package/types/composables/useBaseAPI.d.ts

@@ -0,0 +1,105 @@
+import { AxiosError, AxiosRequestConfig } from "axios";
+import { Ref, ShallowRef } from "vue";
+import type { RequestMethod, RequestOptions } from "../api/base";
+/**
+ * UseBaseAPIOptions extends Trees/RequestOptions
+ * these options are used only in the instantiation
+ * of a new UseBaseAPI composable
+ */
+export interface UseBaseAPIOptions extends RequestOptions {
+    /**
+     * Whether to immediately fire the execute function during instantiation
+     */
+    immediate?: boolean;
+}
+/**
+ * UseBaseAPI is a composable the wraps up the
+ * usage of Trees/BaseAPI and returns reactive
+ * state variables along with reusaable execute and abort functions
+ */
+export interface UseBaseAPI<T> {
+    /**
+     * Axios response data
+     */
+    result: Ref<T | undefined>;
+    /**
+     * Any errors that may have occurred
+     */
+    error: ShallowRef<Error | AxiosError<T> | undefined>;
+    /**
+     * Indicates if the request has finished
+     */
+    isFinished: Ref<boolean>;
+    /**
+     * Indicates if the request is currently loading
+     */
+    isLoading: Ref<boolean>;
+    /**
+     * Indicates if the request was canceled
+     */
+    isAborted: Ref<boolean>;
+    /**
+     * Indicates if a first request has completed
+     */
+    hasFetched: Ref<boolean>;
+    /**
+     * Aborts the current request
+     * can be used multiple times
+     */
+    abort: () => void;
+    /**
+     * Manually call the axios request
+     * can be used multiple times
+     */
+    execute: (data?: Record<string, unknown>, opts?: RequestOptions, config?: AxiosRequestConfig) => Promise<T>;
+}
+/**
+ * useBaseAPI is a composable wrapper of BaseAPI
+ * @param path {string} the api path or full url for the
+ * @param method {RequestMethod} the initial request type
+ * @param initOpts {UseBaseAPIOptions}
+ * @param initConfig {AxiosRequestConfig}
+ * @returns {UseBaseAPI<T>}
+ */
+export default function useBaseAPI<T = any>(path: string, method?: RequestMethod, initOpts?: UseBaseAPIOptions, initConfig?: AxiosRequestConfig): {
+    result: Ref<T | undefined>;
+    error: ShallowRef<Error | AxiosError<T, any> | undefined>;
+    isFinished: Ref<boolean>;
+    isLoading: Ref<boolean>;
+    isAborted: Ref<boolean>;
+    hasFetched: Ref<boolean>;
+    abort: () => void;
+    execute: (data?: Record<string, unknown>, execOpts?: RequestOptions, execConfig?: AxiosRequestConfig) => Promise<T>;
+};
+/**
+ * useBaseAPIGet is a convenience function for useBaseAPI
+ * @param path {string} the api path or full url for the
+ * @param initOpts {UseBaseAPIOptions}
+ * @param initConfig {AxiosRequestConfig}
+ * @returns {UseBaseAPI<T>}
+ */
+export declare function useBaseAPIGet<T = any>(url: string, initOpts?: UseBaseAPIOptions, initConfig?: AxiosRequestConfig): UseBaseAPI<T>;
+/**
+ * useBaseAPIDelete is a convenience function for useBaseAPI
+ * @param path {string} the api path or full url for the
+ * @param initOpts {UseBaseAPIOptions}
+ * @param initConfig {AxiosRequestConfig}
+ * @returns {UseBaseAPI<T>}
+ */
+export declare function useBaseAPIDelete<T = any>(url: string, initOpts?: UseBaseAPIOptions, initConfig?: AxiosRequestConfig): UseBaseAPI<T>;
+/**
+ * useBaseAPIPost is a convenience function for useBaseAPI
+ * @param path {string} the api path or full url for the
+ * @param initOpts {UseBaseAPIOptions}
+ * @param initConfig {AxiosRequestConfig}
+ * @returns {UseBaseAPI<T>}
+ */
+export declare function useBaseAPIPost<T = any>(url: string, initOpts?: UseBaseAPIOptions, initConfig?: AxiosRequestConfig): UseBaseAPI<T>;
+/**
+ * useBaseAPIPut is a convenience function for useBaseAPI
+ * @param path {string} the api path or full url for the
+ * @param initOpts {UseBaseAPIOptions}
+ * @param initConfig {AxiosRequestConfig}
+ * @returns {UseBaseAPI<T>}
+ */
+export declare function useBaseAPIPut<T = any>(url: string, initOpts?: UseBaseAPIOptions, initConfig?: AxiosRequestConfig): UseBaseAPI<T>;

package/types/entry.d.ts

@@ -2,5 +2,6 @@ import { Plugin } from "vue";
 import BaseAPI from "./api/base";
 declare const install: Exclude<Plugin["install"], undefined>;
 export default install;
+export * from "./composables/index";
 export * from "./lib-components/index";
 export { BaseAPI };

package/types/helpers/Debounce.d.ts

@@ -1 +1,2 @@
 export declare function debounce(func: () => void, timeout?: number): () => void;
+export declare function debounceLeading(func: () => void, timeout?: number): (...args: any[]) => void;

package/types/types/lists.d.ts

@@ -0,0 +1,12 @@
+export interface Pagination {
+    page: number;
+    perPage: number;
+    totalItems: number;
+    totalPages: number;
+}
+export interface PaginationItems<T = any> {
+    items: T[];
+}
+export interface PaginationData<T = any> {
+    data: Pagination & PaginationItems<T>;
+}