@caipira/tamandua 0.0.1 → 0.0.2

package/.storybook/main.ts

@@ -1,8 +1,5 @@
-import { loadEnv } from "vite";
 import { StorybookConfig } from "@storybook/vue3-vite";
 
-const env = loadEnv("", process.cwd(), "GLOBAL_");
-
 const config: StorybookConfig = {
     stories: ["../components/**/*.story.@(js|ts)"],
     addons: [

package/README.md

@@ -9,3 +9,7 @@ You can start Storybook by running:
 ```sh
 npm run start:sb
 ```
+
+## Reference
+
+[Storybook](https://storybook.js.org/docs/get-started/vue3-vite)

package/components/Form/Form.vue

@@ -9,7 +9,7 @@ import {
     ValidationResult,
 } from "@/types/form";
 
-import { transformForm } from "@/services/form/form-transformer";
+import { transformForm } from "@/form/form-transformer";
 import { ref, provide, reactive, watch } from "vue";
 
 defineOptions({ name: "TForm" });

package/components/InputMultiplier/InputMultiplier.vue

@@ -1,33 +1,22 @@
 <script lang="ts" setup>
-import { SocialDirectory } from "@/types/social-network";
-
 import { ref, watch, inject } from "vue";
+import { InputMultiplierEvents, InputMultiplierProps } from "./types";
 
 defineOptions({ name: "TInputMultiplier" });
 
-const props = withDefaults(
-    defineProps<{
-        modelValue?: any[];
-        type?: string;
-        label?: string;
-        inputProps?: any;
-    }>(),
-    {
-        type: "",
-        label: "",
-        inputProps: {},
-    },
-);
+const props = withDefaults(defineProps<InputMultiplierProps>(), {
+    type: "t-input-text",
+    label: "",
+    listeners: () => ({}),
+    inputProps: () => ({}),
+});
+
+const emit = defineEmits<InputMultiplierEvents>();
 
 const values = ref<any[]>([]);
 const formStyle = inject("formStyle", { label: "", input: "" });
 
-const emit = defineEmits<{
-    (e: "update:modelValue", val: any): void;
-    (e: "on-fetch-directory", val: SocialDirectory): void;
-}>();
-
-const add = () => {
+const addNewItem = () => {
     // @todo: Add an switch case that adds an value according to the input type
     values.value.push({});
 };
@@ -49,31 +38,10 @@ const getItemKey = (value: any, index: number): string | number => {
     }
 };
 
-const onFetchDirectory = (directory: SocialDirectory) => {
-    values.value = [
-        ...values.value,
-        ...directory.social_networks
-            .filter(
-                (network) =>
-                    !!!values.value.find(
-                        (value) =>
-                            value.network === network.network &&
-                            value.profile === network.path,
-                    ),
-            )
-            .map((network) => ({
-                network: network.network,
-                profile: network.path,
-            })),
-    ];
-
-    emit("on-fetch-directory", directory);
-};
-
 watch(
     values,
     (newValues: any[]) => {
-        emit("update:modelValue", newValues);
+        emit("update:model-value", newValues);
     },
     { deep: true },
 );
@@ -101,7 +69,7 @@ watch(
                 :is-outline="true"
                 icon="plus"
                 size="sm"
-                @click="add"
+                @click="addNewItem"
             />
         </div>
         <div
@@ -111,7 +79,14 @@ watch(
             class="flex items-center justify-start mt-1 ml-2"
         >
             <div :class="{ [formStyle.label]: true }" />
-            <t-input-social
+            <component
+                :is="props.component"
+                v-model="values[index]"
+                v-bind="props.inputProps"
+                v-on="props.listeners"
+                class="my-1"
+            />
+            <!-- <t-input-social
                 v-if="type === 'social'"
                 v-model="values[index]"
                 class="my-1"
@@ -132,7 +107,7 @@ watch(
                 v-model="values[index]"
                 v-bind="props.inputProps"
                 class="my-1"
-            />
+            /> -->
             <t-icon-button
                 icon="close"
                 size="sm"

package/components/InputMultiplier/input-multiplier.story.ts

@@ -0,0 +1,30 @@
+const story = {
+    title: "Form/Input multiplier",
+    args: {
+        label: "Name",
+        component: "t-input-text",
+        listeners: {
+            "update:model-value": (newValue: string) => {
+                console.log("new value from child: ", newValue);
+            },
+        },
+    },
+    argTypes: {
+        component: {
+            options: ["t-input-text", "t-input-phone"],
+            control: "radio",
+            description: "Set component",
+        },
+    },
+};
+
+const Template = (args: any) => ({
+    setup() {
+        return { args };
+    },
+    template: `<t-input-multiplier v-bind="args" />`,
+});
+
+const Default: any = Template.bind({});
+
+export { story as default, Default };

package/components/InputMultiplier/types.ts

@@ -0,0 +1,16 @@
+type ComponentType = "t-input-text" | "t-input-phone";
+
+export type InputMultiplierProps = {
+    component?: ComponentType;
+    inputProps?: any;
+    label?: string;
+    listeners?: {
+        [key: string]: (...args: any[]) => void;
+    };
+    modelValue?: any[];
+};
+
+export type InputMultiplierEvents = {
+    /** Fired when the input value changes */
+    (event: "update:model-value", value: any[]): void;
+};

package/components/InputPassword/InputPassword.vue

@@ -8,29 +8,29 @@ import { inject, ref, watch } from "vue";
 import InputText from "@/components/InputText/InputText.vue";
 import ButtonCopy from "@/components/ButtonCopy/ButtonCopy.vue";
 
+export type InputPasswordProps = {
+    autocomplete?: string;
+    canCopy?: boolean;
+    encryptor?: (value: string) => Promise<string>;
+    keyup?: any;
+    modelValue?: InputPasswordModel;
+    showRefresh?: boolean;
+    showStrength?: boolean;
+    simpleMode?: boolean;
+};
+
 defineOptions({ name: "TInputPassword" });
 
-const props = withDefaults(
-    defineProps<{
-        keyup?: any;
-        encrypt?: boolean;
-        canCopy?: boolean;
-        modelValue?: InputPasswordModel;
-        simpleMode?: boolean;
-        showRefresh?: boolean;
-        showStrength?: boolean;
-        autocomplete?: string;
-    }>(),
-    {
-        keyup: () => () => {},
-        encrypt: true,
-        canCopy: true,
-        simpleMode: false,
-        showRefresh: false,
-        showStrength: false,
-        autocomplete: "current-password",
-    },
-);
+const props = withDefaults(defineProps<InputPasswordProps>(), {
+    autocomplete: "current-password",
+    canCopy: true,
+    encryptor: undefined,
+    keyup: () => () => {},
+    modelValue: undefined,
+    showRefresh: false,
+    showStrength: false,
+    simpleMode: false,
+});
 
 const emit = defineEmits<{
     (e: "generate", val: InputPasswordModel): void;
@@ -44,7 +44,7 @@ const strength = ref<number>(0);
 const password = ref<string>("");
 const isLoading = ref<boolean>(false);
 const formStyle = inject("formStyle", { input: "w-full" });
-const updatedAt = ref<Date | null>(null);
+const updatedAt = ref<Date>();
 
 const setValue = (localPassword?: InputPasswordModel) => {
     if (typeof localPassword !== "object") {
@@ -55,22 +55,24 @@ const setValue = (localPassword?: InputPasswordModel) => {
     strength.value = localPassword.strength
         ? localPassword.strength
         : passwordService.getPasswordStrength(localPassword.value).score;
-    updatedAt.value = localPassword.updatedAt ? localPassword.updatedAt : null;
+    updatedAt.value = localPassword.updatedAt;
 };
 
-const passwordToPayload = (password: string): InputPasswordModel => {
+const passwordToPayload = async (
+    password: string,
+): Promise<InputPasswordModel> => {
     strength.value = passwordService.getPasswordStrength(password).score;
 
     return {
         value: password,
         strength: strength.value,
-        encrypt: props.encrypt,
-        updatedAt: updatedAt.value ? updatedAt.value : null,
-    } as InputPasswordModel;
+        encrypted: props.encryptor ? await props.encryptor(password) : password,
+        updatedAt: updatedAt.value,
+    };
 };
 
-const onInput = (password: string) => {
-    emit("update:modelValue", passwordToPayload(password));
+const onInput = async (password: string) => {
+    emit("update:modelValue", await passwordToPayload(password));
 };
 
 const focus = () => {
@@ -87,7 +89,7 @@ const generatePassword = async () => {
 
     isLoading.value = false;
 
-    emit("generate", passwordToPayload(password.value));
+    emit("generate", await passwordToPayload(password.value));
     onInput(data);
 };
 

package/components/InputText/InputText.vue

@@ -23,7 +23,7 @@ const props = withDefaults(
 );
 
 const emit = defineEmits<{
-    (e: "update:modelValue", val: string): void;
+    (e: "update:model-value", val: string): void;
     (e: "keyup.enter", val: any): void;
 }>();
 
@@ -37,7 +37,7 @@ const value = computed({
         return props.modelValue;
     },
     set: (value: string) => {
-        emit("update:modelValue", value);
+        emit("update:model-value", value);
     },
 });
 </script>

package/components/ModalForm/ModalForm.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { SelectOption } from "@/types/form";
 
-import CrudService from "@/services/form/crud";
+import CrudService from "@/form/crud";
 import { computed, ref } from "vue";
 
 type Form = {

package/components/Table/Table.story.ts

@@ -1,22 +1,18 @@
 import { faker } from "@faker-js/faker";
 
-import UITable from "./Table.vue";
-
-export default {
-    components: UITable,
+const story = {
     title: "Table",
 };
 
-const Template1 = (args: any) => ({
-    components: { UITable },
+const Template = (args: any) => ({
     setup() {
         return { args };
     },
-    template: `<UITable v-bind="args" />`,
+    template: `<t-table v-bind="args" />`,
 });
 
-export const Table: any = Template1.bind({});
-Table.args = {
+const Default: any = Template.bind({});
+Default.args = {
     loading: false,
     data: (Array.from({ length: 10 }) as any).map(() => ({
         id: faker.string.uuid(),
@@ -30,3 +26,5 @@ Table.args = {
         { title: "Job", property: "job" },
     ],
 };
+
+export { story as default, Default };

package/components/Table/Table.vue

@@ -1,49 +1,22 @@
 <script lang="ts" setup generic="T extends object">
-import { TableColumn } from "@/types/ui";
+import { TableProps } from "./types";
 
 import { computed, reactive, ref, useSlots } from "vue";
 
-export type TableProps<T = object> = {
-    data: T[];
-    rowKey?: string;
-    columns: TableColumn[];
-    loading?: boolean;
-    selectable?: boolean;
-    disableStyle?: boolean;
-    stickyHeader?: boolean;
-
-    rowClass?: string;
-    tableDataClass?: string;
-};
-
 defineOptions({ name: "TTable" });
 
-const props = withDefaults(
-    defineProps<{
-        data: T[];
-        rowKey?: string;
-        columns: TableColumn[];
-        loading?: boolean;
-        selectable?: boolean;
-        disableStyle?: boolean;
-        stickyHeader?: boolean;
-
-        rowClass?: string;
-        tableDataClass?: string;
-    }>(),
-    {
-        data: () => [],
-        rowKey: "id",
-        columns: () => [],
-        loading: false,
-        selectable: false,
-        disableStyle: false,
-        stickyHeader: true,
-
-        rowClass: "hover:bg-hover",
-        tableDataClass: "px-2 py-2",
-    },
-);
+const props = withDefaults(defineProps<TableProps<T>>(), {
+    data: () => [],
+    rowKey: "id",
+    columns: () => [],
+    loading: false,
+    selectable: false,
+    disableStyle: false,
+    stickyHeader: true,
+
+    rowClass: "hover:bg-hover",
+    tableDataClass: "px-2 py-2",
+});
 
 const emit = defineEmits<{
     (e: "selected", val: any): void;

package/components/Table/index.ts

@@ -1,7 +1,7 @@
 import type { App, Plugin } from "vue";
 import registerComponent from "@/plugins/register-component";
 
-import Table from "./Table.vue";
+import Table from "@/components/Table/Table.vue";
 
 export default {
     install(app: App) {

package/components/Table/types.ts

@@ -0,0 +1,14 @@
+import { TableColumn } from "@/types/ui";
+
+export type TableProps<T = object> = {
+    data: T[];
+    rowKey?: string;
+    columns: TableColumn[];
+    loading?: boolean;
+    selectable?: boolean;
+    disableStyle?: boolean;
+    stickyHeader?: boolean;
+
+    rowClass?: string;
+    tableDataClass?: string;
+};

package/components/Tag/Tag.vue

@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 import { ElementSize } from "@/enums/ui";
+import { TagProps, TagEvents } from "./types";
 
 defineOptions({ name: "TTag" });
 
@@ -12,9 +13,7 @@ const props = withDefaults(defineProps<TagProps>(), {
     hasCloseButton: false,
 });
 
-const emit = defineEmits<{
-    (e: "close"): void;
-}>();
+const emit = defineEmits<TagEvents>();
 </script>
 
 <template>
@@ -60,14 +59,3 @@ const emit = defineEmits<{
         </div>
     </div>
 </template>
-
-<script lang="ts">
-export interface TagProps {
-    text?: string;
-    size?: ElementSize;
-    role?: string;
-    color?: string;
-    confirmClose?: boolean;
-    hasCloseButton?: boolean;
-}
-</script>

package/components/Tag/types.ts

@@ -0,0 +1,15 @@
+import { ElementSize } from "@/enums/ui";
+
+export type TagProps = {
+    text?: string;
+    size?: ElementSize;
+    role?: string;
+    color?: string;
+    confirmClose?: boolean;
+    hasCloseButton?: boolean;
+};
+
+export type TagEvents = {
+    /** Fired when the "x" button from tag is clicked */
+    (event: "close"): void;
+};

package/form/convertors.ts

@@ -0,0 +1,31 @@
+const jsonToFormData = (json: any) => {
+    const formData = new FormData();
+
+    if (json) {
+        for (const key in json) {
+            if (json[key] !== null && json[key] !== undefined) {
+                if (Array.isArray(json[key])) {
+                    json[key].forEach((item: any) => {
+                        formData.append(`${key}[]`, item);
+                    });
+                } else {
+                    formData.append(key, json[key]);
+                }
+            }
+        }
+    }
+
+    return formData;
+};
+
+const formDataToJson = (formData: FormData) => {
+    const json: any = {};
+
+    formData.forEach((value, key) => {
+        json[key] = value;
+    });
+
+    return json;
+};
+
+export { jsonToFormData, formDataToJson };

package/{services/form → form}/form-data-transformers.ts

@@ -4,14 +4,14 @@ import {
     formValuePriceTransformer,
     formValueCountryTransformer,
     formValuePasswordTransformer,
-} from "@/services/form/form-value-transformers";
+} from "@/form/form-value-transformers";
 import {
     FormDataForm,
     TransformedForm,
     FormSchemaValueMap,
     AcceptedFormDataValues,
 } from "@/types/form";
-``;
+
 const sanitizeValue = (value: string | number): AcceptedFormDataValues => {
     if (value === null || value === undefined) {
         value = "";
@@ -32,7 +32,7 @@ const transformers = {
             | FormSchemaValueMap[FormDataTypes.String]
             | FormSchemaValueMap[FormDataTypes.Number],
         form: FormDataForm,
-        key: string
+        key: string,
     ) => {
         value = sanitizeValue(value);
 
@@ -46,7 +46,7 @@ const transformers = {
         price: FormSchemaValueMap[FormDataTypes.Price],
         form: FormDataForm,
         key: string,
-        suffixes: string[] = ["Currency", "Value"]
+        suffixes: string[] = ["Currency", "Value"],
     ): FormDataForm => {
         const [iso, value] = formValuePriceTransformer(price);
 
@@ -58,14 +58,14 @@ const transformers = {
     address: (
         address: FormSchemaValueMap[FormDataTypes.Address],
         form: FormDataForm,
-        key: string
+        key: string,
     ): FormDataForm => {
         form.append(
             key,
             JSON.stringify({
                 ...address,
                 country: formValueCountryTransformer(address?.country),
-            })
+            }),
         );
 
         return form;
@@ -73,7 +73,7 @@ const transformers = {
     documents: (
         files: FormSchemaValueMap[FormDataTypes.Documents],
         form: FormDataForm,
-        key: string
+        key: string,
     ): FormDataForm => {
         if (!key.endsWith("[]")) {
             key = `${key}[]`;
@@ -86,7 +86,7 @@ const transformers = {
     document: (
         file: FormSchemaValueMap[FormDataTypes.Document],
         form: FormDataForm,
-        key: string
+        key: string,
     ): FormDataForm => {
         form.append(key, file);
 
@@ -95,7 +95,7 @@ const transformers = {
     stringArray: (
         value: FormSchemaValueMap[FormDataTypes.StringArray],
         form: FormDataForm,
-        key: string
+        key: string,
     ) => {
         if (!key.endsWith("[]")) {
             key = `${key}[]`;
@@ -110,15 +110,15 @@ const transformers = {
 export const formValueToFormDataValue = async (
     schema: FormDataTypes,
     form: TransformedForm<FormSubmissionFormat.FormData>,
-    value: FormFieldValue<typeof schema>,
-    key: string
+    value: any,
+    key: string,
 ): Promise<FormDataForm> => {
     switch (schema) {
         case FormDataTypes.Country:
             return transformers.default(
                 formValueCountryTransformer(value),
                 form,
-                key
+                key,
             );
         case FormDataTypes.Document:
             return transformers.document(value, form, key);
@@ -128,7 +128,7 @@ export const formValueToFormDataValue = async (
             return transformers.default(
                 formValueDateTransformer(value),
                 form,
-                key
+                key,
             );
         case FormDataTypes.Address:
             return transformers.address(value, form, key);
@@ -138,7 +138,7 @@ export const formValueToFormDataValue = async (
             return transformers.default(
                 await formValuePasswordTransformer(value),
                 form,
-                key
+                key,
             );
         case FormDataTypes.StringArray:
             return transformers.stringArray(value, form, key);

package/{services/form → form}/form-transformer.ts

@@ -6,8 +6,8 @@ import {
     TransformedForm,
 } from "@/types/form";
 
-import { formValueToJSONFormValue } from "@/services/form/form-json-transformers";
-import { formValueToFormDataValue } from "@/services/form/form-data-transformers";
+import { formValueToJSONFormValue } from "@/form/json-transformers";
+import { formValueToFormDataValue } from "@/form/form-data-transformers";
 
 /**
  * Transforms the form values to a format that conforms to the submission format

package/{services/form → form}/form-value-transformers.ts

@@ -21,10 +21,7 @@ const formValueCountryTransformer = (country?: Country): string => {
 const formValuePasswordTransformer = async (
     password?: InputPasswordModel,
 ): Promise<string> => {
-    const pass = password?.value ?? "";
-
-    // return password?.encrypt ? await vault.encrypt(pass) : pass;
-    return pass;
+    return password?.encrypted ?? password?.value ?? "";
 };
 
 export {

package/{services/form → form}/form.test.ts

@@ -2,7 +2,7 @@ import { FormInstance } from "@/types/form";
 import { FormDataTypes, FormSubmissionFormat } from "@/enums/form";
 
 import { expect, test } from "vitest";
-import { transformForm } from "@/services/form/form-transformer";
+import { transformForm } from "@/form/form-transformer";
 
 test("Form is transformed into FormData", async () => {
     const schema = {
@@ -22,7 +22,6 @@ test("Form is transformed into FormData", async () => {
         password: {
             value: "123",
             strength: 100,
-            encrypt: false,
             updatedAt: new Date(),
         },
         price: {
@@ -70,7 +69,6 @@ test("Form is transformed into JSON", async () => {
         password: {
             value: "123",
             strength: 100,
-            encrypt: false,
             updatedAt: new Date(),
         },
         price: {

package/{services/form/form-json-transformers.ts → form/json-transformers.ts}

@@ -11,13 +11,13 @@ import {
     formValuePriceTransformer,
     formValueCountryTransformer,
     formValuePasswordTransformer,
-} from "@/services/form/form-value-transformers";
+} from "@/form/form-value-transformers";
 
 const transformers = {
     default: (
         value: FormSchemaValueMap[FormDataTypes.String],
         form: JSONForm,
-        key: string
+        key: string,
     ) => {
         form[key] = value;
 
@@ -27,7 +27,7 @@ const transformers = {
         date: FormSchemaValueMap[FormDataTypes.Price],
         form: JSONForm,
         key: string,
-        suffixes: string[] = ["Currency", "Value"]
+        suffixes: string[] = ["Currency", "Value"],
     ): JSONForm => {
         const [currency, value] = formValuePriceTransformer(date);
 
@@ -39,7 +39,7 @@ const transformers = {
     password: async (
         value: FormSchemaValueMap[FormDataTypes.Password],
         form: JSONForm,
-        key: string
+        key: string,
     ): Promise<JSONForm> => {
         form[key] = await formValuePasswordTransformer(value);
 
@@ -48,7 +48,7 @@ const transformers = {
     stringArray: (
         value: FormSchemaValueMap[FormDataTypes.StringArray],
         form: JSONForm,
-        key: string
+        key: string,
     ) => {
         form[key] = value;
 
@@ -60,14 +60,14 @@ export const formValueToJSONFormValue = async <T extends FormDataTypes>(
     schema: FormSchema[T],
     form: TransformedForm<FormSubmissionFormat.JSON>,
     value: any,
-    key: string
+    key: string,
 ): Promise<JSONForm> => {
     switch (schema) {
         case FormDataTypes.Country:
             return transformers.default(
                 formValueCountryTransformer(value),
                 form,
-                key
+                key,
             );
         case FormDataTypes.Documents:
             return transformers.default(value, form, key);
@@ -75,7 +75,7 @@ export const formValueToJSONFormValue = async <T extends FormDataTypes>(
             return transformers.default(
                 formValueDateTransformer(value),
                 form,
-                key
+                key,
             );
         case FormDataTypes.Address:
             return transformers.default(value, form, key);

package/index.css

@@ -232,92 +232,6 @@
     display: inline-block;
 }
 
-.fs {
-    width: 20px;
-    height: 20px;
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/unknown.svg");
-}
-
-.fs.bmp {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/bmp.svg");
-}
-
-.fs.ics {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/ics.svg");
-}
-
-.fs.jpg {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/jpg.svg");
-}
-
-.fs.jpeg {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/jpeg.svg");
-}
-
-.fs.doc {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/doc.svg");
-}
-
-.fs.docx {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/docx.svg");
-}
-
-.fs.gif {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/gif.svg");
-}
-
-.fs.mp3 {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/mp3.svg");
-}
-
-.fs.mp4 {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/mp4.svg");
-}
-
-.fs.pdf {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/pdf.svg");
-}
-
-.fs.png {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/png.svg");
-}
-
-.fs.rar {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/rar.svg");
-}
-
-.fs.tar {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/tar.svg");
-}
-
-.fs.txt {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/txt.svg");
-}
-
-.fs.xls {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/xls.svg");
-}
-
-.fs.xlsx {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/xlsx.svg");
-}
-
-.fs.xml {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/xml.svg");
-}
-
-.fs.yaml {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/yaml.svg");
-}
-
-.fs.zip {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/zip.svg");
-}
-
-.fs.dir {
-    content: url("https://static.%GLOBAL_DOMAIN%/site/assets/images/fs/folder-paleorange.svg");
-}
-
 html,
 body {
     font-family: "San Francisco", sans-serif; /* font-family: "Inter", sans-serif; */

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@caipira/tamandua",
-    "version": "0.0.1",
+    "version": "0.0.2",
     "description": "UI library for the Caipira ecosystem",
     "license": "UNLICENSED",
     "homepage": "https://caipira.io",
@@ -67,4 +67,4 @@
         "vue": "^3.4.21",
         "vue-tsc": "^1.8.0"
     }
-}
+}

package/types/form.ts

@@ -52,23 +52,23 @@ export type SelectOption = {
       }
 );
 
-export interface InputSocialModel {
-    profile: string;
-    network: number;
-}
-
 export interface InputPriceModel {
     iso: string;
     value: number;
 }
 
 export interface InputPasswordModel {
+    /** Unencrypted password */
     value: string;
+
+    /** Strength of the password */
     strength?: number;
+
+    /** Date of creation or last update */
     updatedAt?: Date;
 
-    /** If true, encrypts the password before posting to the API */
-    encrypt?: boolean;
+    /** If an encryptor was passed, this prop will hold the encrypted value */
+    encrypted?: string;
 }
 
 export type FormStyle = { [key in "label" | "input"]?: string };

package/vite.config.mts

@@ -1,38 +1,14 @@
 import vue from "@vitejs/plugin-vue";
-import { resolve } from "path";
 import tsconfigPaths from "vite-tsconfig-paths";
-import { defineConfig, loadEnv } from "vite";
+import { defineConfig } from "vite";
 
-export default defineConfig(({ mode }) => {
-    const envPrefix = "GLOBAL_";
-    const env = loadEnv(mode, process.cwd(), envPrefix);
-
-    const cssPlugin = () => {
-        return {
-            name: "css-transform",
-            transform(src: string, id: any) {
-                if (/\.(css)$/.test(id)) {
-                    return src.replace(/%(.*?)%/g, (match, p1) => env[p1]);
-                }
-            },
-        };
-    };
-
-    return {
-        plugins: [vue(), tsconfigPaths(), cssPlugin()],
-        resolve: {
-            alias: {
-                "@": resolve(__dirname),
-                vue: "vue/dist/vue.esm-bundler.js",
-            },
-        },
-        build: {
-            outDir: "./dist",
-        },
-        envPrefix,
-        test: {
-            environment: "jsdom",
-            setupFiles: ["vitest.setup.ts"],
-        },
-    };
+export default defineConfig({
+    plugins: [vue(), tsconfigPaths()],
+    build: {
+        outDir: "./dist",
+    },
+    test: {
+        environment: "jsdom",
+        setupFiles: ["vitest.setup.ts"],
+    },
 });

package/vitest.setup.ts

@@ -1,5 +1,5 @@
-import ui from "@/plugins/ui";
 import { vi } from "vitest";
+import Tamandua from "@/index";
 import { config } from "@vue/test-utils";
 
 Object.defineProperty(window, "matchMedia", {
@@ -18,4 +18,4 @@ Object.defineProperty(window, "matchMedia", {
     })),
 });
 
-config.global.plugins = [ui];
+config.global.plugins = [Tamandua];

package/services/form/form.ts

@@ -1,80 +0,0 @@
-import { APISearchFilters } from "@/types/api";
-
-const jsonToFormData = (json: any) => {
-    const formData = new FormData();
-
-    if (json) {
-        for (const key in json) {
-            if (json[key] !== null && json[key] !== undefined) {
-                if (Array.isArray(json[key])) {
-                    json[key].forEach((item: any) => {
-                        formData.append(`${key}[]`, item);
-                    });
-                } else {
-                    formData.append(key, json[key]);
-                }
-            }
-        }
-    }
-
-    return formData;
-};
-
-const formDataToJson = (formData: FormData) => {
-    const json: any = {};
-
-    formData.forEach((value, key) => {
-        json[key] = value;
-    });
-
-    return json;
-};
-
-const hitSearchCache = (
-    filters: APISearchFilters | undefined,
-    store: any,
-    key: string
-) => {
-    if (!store) {
-        return;
-    }
-
-    if (filters?.i) {
-        const item = store[
-            filters?.r && filters?.r === "option" ? `${key}Options` : key
-        ]?.find((item: { uuid: string }) => item.uuid === filters.i);
-
-        if (item) {
-            return {
-                items: [item],
-                pagination: {
-                    page: 1,
-                    pages: 1,
-                    perPage: 12,
-                    items: 1,
-                    totalItems: 1,
-                    skip: 0,
-                },
-            };
-        }
-    }
-};
-
-const refreshSearchCache = (
-    filters: APISearchFilters | undefined,
-    store: any,
-    key: string,
-    data: any[]
-) => {
-    if (!store) {
-        return;
-    }
-
-    if (filters?.r && filters?.r === "option") {
-        store[`${key}Options`] = data;
-    } else {
-        store[key] = data;
-    }
-};
-
-export { jsonToFormData, formDataToJson, hitSearchCache, refreshSearchCache };