@winchsa/ui 0.1.33 → 0.1.34

package/dist/components/cards/CardStatisticsHorizontal.vue

@@ -0,0 +1,29 @@
+<script setup>
+import { VCard, VCardText, VAvatar } from "vuetify/components";
+defineProps({
+  title: { type: String, required: true },
+  color: { type: String, required: false, default: "primary" },
+  icon: { type: String, required: true },
+  stats: { type: String, required: true }
+});
+</script>
+
+<template>
+  <VCard>
+    <VCardText class="d-flex align-center justify-space-between">
+      <div>
+        <div class="d-flex align-center flex-wrap">
+          <span class="text-h5">{{ stats }}</span>
+        </div>
+        <span class="text-body-2">{{ title }}</span>
+      </div>
+
+      <VAvatar
+        :icon="icon"
+        :color="color"
+        :size="42"
+        variant="tonal"
+      />
+    </VCardText>
+  </VCard>
+</template>

package/dist/components/cards/CardStatisticsHorizontal.vue.d.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    title: string;
+    color?: string;
+    icon: string;
+    stats: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/cards/CheckboxesCard.d.vue.ts

@@ -0,0 +1,18 @@
+type ChechboxModel = {
+    key: string | number;
+    label: string;
+    selected?: boolean;
+};
+type __VLS_Props = {
+    id?: string | number;
+    title?: string;
+    modelValue: ChechboxModel[];
+    vertical?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: ChechboxModel[]) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: ChechboxModel[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/cards/CheckboxesCard.vue

@@ -0,0 +1,108 @@
+<script setup>
+import { onMounted, reactive, watch } from "vue";
+import { VCardItem, VCheckbox, VDivider } from "vuetify/components";
+import AppCard from "./AppCard.vue";
+const props = defineProps({
+  id: { type: [String, Number], required: false, default: "" },
+  title: { type: String, required: false, default: "" },
+  modelValue: { type: Array, required: true, default: () => [] },
+  vertical: { type: Boolean, required: false, default: false }
+});
+const data = reactive({
+  selectedAll: false,
+  model: props.modelValue || []
+});
+const emit = defineEmits(["update:modelValue"]);
+watch(
+  () => props.modelValue,
+  () => {
+    data.model = props.modelValue;
+  }
+);
+watch(
+  () => data.model,
+  () => {
+    allCheckboxSelected();
+    getItemOnChange();
+  },
+  { deep: true }
+);
+onMounted(() => {
+  allCheckboxSelected();
+});
+const selectAll = () => {
+  data.selectedAll = !data.selectedAll;
+  data.model.forEach((item) => item.selected = data.selectedAll);
+};
+function allCheckboxSelected() {
+  data.model.find((item) => item.selected === false || item.selected === void 0) ? data.selectedAll = false : data.selectedAll = true;
+}
+function getItemOnChange() {
+  emit("update:modelValue", data.model);
+}
+</script>
+
+<template>
+  <AppCard class="h-100">
+    <!-- title card -->
+    <VCardItem
+      class="text-center"
+      :class="{
+  'mb-0 pb-0': vertical
+}"
+    >
+      <div class="d-flex justify-space-between w-100">
+        <h3 class="fw-bold">
+          {{ title }}
+        </h3>
+
+        <VCheckbox
+          v-model="data.selectedAll"
+          class="form-check-input"
+          @click="selectAll()"
+        />
+      </div>
+
+      <VDivider />
+    </VCardItem>
+
+    <VCardItem
+      :class="{
+  'pt-2': vertical,
+  'pt-0 pa-0': !vertical
+}"
+    >
+      <template v-if="vertical">
+        <VRow>
+          <VCol
+            v-for="(item, key) in data.model"
+            :key="key"
+            xl="3"
+            lg="4"
+            md="6"
+            sm="12"
+            class="py-0"
+          >
+            <div class="d-flex justify-space-between align-center border pa-3 my-3 rounded">
+              <span>{{ item.label }}</span>
+              <VCheckbox v-model="item.selected" />
+            </div>
+          </VCol>
+        </VRow>
+      </template>
+      
+      <template v-else>
+        <VCardItem class="pt-0">
+          <div
+            v-for="(item, key) in data.model"
+            :key="key"
+            class="d-flex justify-space-between mb-2"
+          >
+            <span>{{ item.label }}</span>
+            <VCheckbox v-model="item.selected" />
+          </div>
+        </vcarditem>
+      </template>
+    </VCardItem>
+  </AppCard>
+</template>

package/dist/components/cards/CheckboxesCard.vue.d.ts

@@ -0,0 +1,18 @@
+type ChechboxModel = {
+    key: string | number;
+    label: string;
+    selected?: boolean;
+};
+type __VLS_Props = {
+    id?: string | number;
+    title?: string;
+    modelValue: ChechboxModel[];
+    vertical?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: ChechboxModel[]) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: ChechboxModel[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/cards/HeaderCard.d.vue.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    title: string;
+    backPage?: string;
+    isAppRtl: boolean;
+    logoSrc?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/cards/HeaderCard.vue

@@ -0,0 +1,31 @@
+<script setup>
+import { VCol, VBtn } from "vuetify/components";
+defineProps({
+  title: { type: String, required: true },
+  backPage: { type: String, required: false },
+  isAppRtl: { type: Boolean, required: true },
+  logoSrc: { type: String, required: false }
+});
+</script>
+
+<template>
+  <img :src="logoSrc">
+
+  <div class="d-flex align-center mt-2 position-relative">
+    <VBtn
+      v-if="backPage"
+      :to="backPage"
+      elevation="0"
+      size="33px"
+      :icon="isAppRtl ? 'tabler-arrow-right' : 'tabler-arrow-left'"
+      class="back-btn"
+      color="gray-200"
+    />
+
+    <VCol class="py-0">
+      <h5 class="text-h5 font-weight-medium text-center">
+        {{ title }}
+      </h5>
+    </VCol>
+  </div>
+</template>

package/dist/components/cards/HeaderCard.vue.d.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    title: string;
+    backPage?: string;
+    isAppRtl: boolean;
+    logoSrc?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/cards/ImageCard.d.vue.ts

@@ -0,0 +1,33 @@
+type __VLS_Props = {
+    title?: {
+        text: string;
+        to?: string;
+    };
+    subTitle?: {
+        text: string;
+        to?: string;
+    };
+    image?: string;
+    avatar?: string;
+    isLoading?: boolean;
+    imageClass?: string[];
+};
+declare var __VLS_25: {}, __VLS_27: {}, __VLS_34: {}, __VLS_41: {};
+type __VLS_Slots = {} & {
+    'image-subtitle'?: (props: typeof __VLS_25) => any;
+} & {
+    title?: (props: typeof __VLS_27) => any;
+} & {
+    'sub-title'?: (props: typeof __VLS_34) => any;
+} & {
+    default?: (props: typeof __VLS_41) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/cards/ImageCard.vue

@@ -0,0 +1,73 @@
+<script setup>
+import { VCardItem, VAvatar, VImg } from "vuetify/components";
+import AppLink from "../forms/AppLink.vue";
+import AppCard from "./AppCard.vue";
+defineProps({
+  title: { type: Object, required: false, default: () => ({
+    text: ""
+  }) },
+  subTitle: { type: Object, required: false, default: () => ({
+    text: ""
+  }) },
+  image: { type: String, required: false, default: "" },
+  avatar: { type: String, required: false },
+  isLoading: { type: Boolean, required: false },
+  imageClass: { type: Array, required: false }
+});
+</script>
+
+<template>
+  <AppCard class="p-3" :is-loading="isLoading">
+    <VCardItem class="align-center h-100">
+      <div class="d-flex align-center justify-space-between gap-4">
+        <div class="d-flex flex-column flex-shrink-0 mt-1">
+          <img
+            v-if="image"
+            :src="image"
+            :class="imageClass"
+            :alt="title.text"
+          >
+          <VAvatar
+            v-if="avatar"
+            rounded="circle"
+            size="x-large"
+          >
+            <VImg
+              v-if="avatar"
+              :src="avatar"
+              :alt="title.text"
+              cover
+              class="rounded-circle bg-grey-lighten-1"
+            />
+          </VAvatar>
+
+          <slot name="image-subtitle" />
+        </div>
+
+        <div class="d-flex flex-column flex-1-1">
+          <div>
+            <slot name="title">
+              <AppLink
+                v-if="title"
+                class="font-weight-bold text-wrap app-font-size-13"
+                :to="title.to"
+              >
+                {{ title.text }}
+              </AppLink>
+            </slot>
+
+            <div class="text-caption text-wrap">
+              <slot name="sub-title">
+                <AppLink :to="subTitle.to">
+                  {{ subTitle.text }}
+                </AppLink>
+              </slot>
+            </div>
+
+            <slot />
+          </div>
+        </div>
+      </div>
+    </VCardItem>
+  </AppCard>
+</template>

package/dist/components/cards/ImageCard.vue.d.ts

@@ -0,0 +1,33 @@
+type __VLS_Props = {
+    title?: {
+        text: string;
+        to?: string;
+    };
+    subTitle?: {
+        text: string;
+        to?: string;
+    };
+    image?: string;
+    avatar?: string;
+    isLoading?: boolean;
+    imageClass?: string[];
+};
+declare var __VLS_25: {}, __VLS_27: {}, __VLS_34: {}, __VLS_41: {};
+type __VLS_Slots = {} & {
+    'image-subtitle'?: (props: typeof __VLS_25) => any;
+} & {
+    title?: (props: typeof __VLS_27) => any;
+} & {
+    'sub-title'?: (props: typeof __VLS_34) => any;
+} & {
+    default?: (props: typeof __VLS_41) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/cards/InputCard.d.vue.ts

@@ -0,0 +1,21 @@
+type __VLS_Props = {
+    title?: string;
+    text?: string | number;
+    color?: string;
+    to?: string;
+    disabled?: boolean;
+    info?: string;
+};
+declare var __VLS_12: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_12) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/cards/InputCard.vue

@@ -0,0 +1,60 @@
+<script setup>
+import { computed } from "vue";
+import { VLabel } from "vuetify/components";
+import AppLink from "../forms/AppLink.vue";
+import AppCard from "./AppCard.vue";
+const props = defineProps({
+  title: { type: String, required: false, default: "" },
+  text: { type: [String, Number], required: false, default: "" },
+  color: { type: String, required: false, default: "" },
+  to: { type: String, required: false },
+  disabled: { type: Boolean, required: false, default: false },
+  info: { type: String, required: false }
+});
+const colorStyle = computed(() => props.color ? `text-${props.color}` : "");
+</script>
+
+<template>
+  <div>
+    <VLabel v-if="title" class="text-subtitle-2 text-capitalize">
+      {{ title }}
+    </VLabel>
+
+    <AppCard
+      class="border px-4 py-0 mt-2 text-subtitle-2 d-flex align-center app-input-card"
+      style="cursor: text;"
+      :class="{
+  'bg-disable': disabled
+}"
+      elevation="0"
+      min-height="41px"
+    >
+      <div class="d-flex flex-column">
+        <slot>
+          <AppLink
+            class="pb-0"
+            :class="`${colorStyle}`"
+            :to="to"
+          >
+            {{ text }}
+          </AppLink>
+        </slot>
+      </div>
+    </AppCard>
+
+    <p v-if="info" class="app-font-size-12 mb-0 mt-1 text-gray-500 text-start">
+      {{ info }}
+    </p>
+  </div>
+</template>
+
+<style scoped>
+.bg-disable {
+  background: rgb(var(--v-disabled-background)) !important;
+}
+
+.app-input-card span {
+  font-size: 14px;
+  color: rgba(var(--v-theme-on-background), var(--v-high-emphasis-opacity));
+}
+</style>

package/dist/components/cards/InputCard.vue.d.ts

@@ -0,0 +1,21 @@
+type __VLS_Props = {
+    title?: string;
+    text?: string | number;
+    color?: string;
+    to?: string;
+    disabled?: boolean;
+    info?: string;
+};
+declare var __VLS_12: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_12) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/cards/StaticCard.d.vue.ts

@@ -0,0 +1,21 @@
+type __VLS_Props = {
+    title: string;
+    subTitle?: string;
+    color?: string;
+    titleClass?: string;
+    subTitleClass?: string;
+    isLoading: boolean;
+};
+declare var __VLS_13: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_13) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/cards/StaticCard.vue

@@ -0,0 +1,37 @@
+<script setup>
+import { VCardItem } from "vuetify/components";
+import AppCard from "./AppCard.vue";
+defineProps({
+  title: { type: String, required: true, default: "" },
+  subTitle: { type: String, required: false },
+  color: { type: String, required: false, default: "success" },
+  titleClass: { type: String, required: false },
+  subTitleClass: { type: String, required: false },
+  isLoading: { type: Boolean, required: true }
+});
+</script>
+
+<template>
+  <AppCard class="p-3" :is-loading="isLoading">
+    <VCardItem>
+      <slot>
+        <label
+          class="font-weight-bold text-h6"
+          :class="`text-${color}`"
+        >
+          <span :class="titleClass" class="cursor-text">
+            {{ title }}
+          </span>
+        </label>
+
+        <div class="d-flex flex-column">
+          <span :class="subTitleClass">{{ subTitle }}</span>
+        </div>
+      </slot>
+    </VCardItem>
+  </AppCard>
+</template>
+
+<style>
+.cursor-text{cursor:text}
+</style>

package/dist/components/cards/StaticCard.vue.d.ts

@@ -0,0 +1,21 @@
+type __VLS_Props = {
+    title: string;
+    subTitle?: string;
+    color?: string;
+    titleClass?: string;
+    subTitleClass?: string;
+    isLoading: boolean;
+};
+declare var __VLS_13: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_13) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/forms/Accordion.d.vue.ts

@@ -0,0 +1,19 @@
+type __VLS_Props = {
+    title?: string;
+    isOpen?: boolean;
+};
+declare var __VLS_31: {}, __VLS_39: {};
+type __VLS_Slots = {} & {
+    title?: (props: typeof __VLS_31) => any;
+} & {
+    default?: (props: typeof __VLS_39) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/forms/Accordion.vue

@@ -0,0 +1,43 @@
+<script setup>
+import { VExpansionPanels, VExpansionPanel, VExpansionPanelTitle, VExpansionPanelText, VIcon } from "vuetify/components";
+import { ref } from "vue";
+import BaseButton from "./BaseButton.vue";
+const props = defineProps({
+  title: { type: String, required: false },
+  isOpen: { type: Boolean, required: false, default: true }
+});
+const panel = ref(props.isOpen ? 0 : null);
+</script>
+
+<template>
+  <VExpansionPanels v-model="panel">
+    <VExpansionPanel elevation="0">
+      <div class="d-flex align-center">
+        <VExpansionPanelTitle v-slot="{ expanded }" class="pe-2" hide-actions>
+          <BaseButton
+            color="primary"
+            size="32"
+          >
+            <VIcon
+              :icon="!expanded ? 'tabler-chevron-down' : 'tabler-chevron-up'"
+            />
+          </BaseButton>
+        </VExpansionPanelTitle>
+
+        <slot name="title">
+          {{ title }}
+        </slot>
+      </div>
+
+      <VExpansionPanelText>
+        <slot />
+      </VExpansionPanelText>
+    </VExpansionPanel>
+  </VExpansionPanels>
+</template>
+
+<style scoped>
+:deep(.v-expansion-panel-title) {
+  width: fit-content !important;
+}
+</style>

package/dist/components/forms/Accordion.vue.d.ts

@@ -0,0 +1,19 @@
+type __VLS_Props = {
+    title?: string;
+    isOpen?: boolean;
+};
+declare var __VLS_31: {}, __VLS_39: {};
+type __VLS_Slots = {} & {
+    title?: (props: typeof __VLS_31) => any;
+} & {
+    default?: (props: typeof __VLS_39) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};