@weni/unnnic-system 3.0.1-alpha.3 → 3.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@weni/unnnic-system",
-  "version": "3.0.1-alpha.3",
+  "version": "3.0.2",
   "type": "commonjs",
   "files": [
     "dist",
@@ -82,6 +82,7 @@
     "@vitest/ui": "^1.6.0",
     "@vue/eslint-config-prettier": "^9.0.0",
     "@vue/test-utils": "^2.4.6",
+
     "eslint": "^8.0.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.1.3",

package/src/assets/scss/colors.scss

@@ -90,17 +90,17 @@ $unnnic-color-aux-purple-800: #5A36A1;
 $unnnic-color-aux-purple-900: #4B2E84;
 $unnnic-color-aux-purple-950: #2E1C59;
 
-$unnnic-color-aux-red-50: #F6F5FD;
-$unnnic-color-aux-red-100: #EEECFB;
-$unnnic-color-aux-red-200: #DFDCF8;
-$unnnic-color-aux-red-300: #C7BFF3;
-$unnnic-color-aux-red-400: #AA9BEA;
-$unnnic-color-aux-red-500: #8D72E0;
-$unnnic-color-aux-red-600: #805AD5;
-$unnnic-color-aux-red-700: #6B41C0;
-$unnnic-color-aux-red-800: #5A36A1;
-$unnnic-color-aux-red-900: #4B2E84;
-$unnnic-color-aux-red-950: #2E1C59;
+$unnnic-color-aux-red-50: #FDF3F3;
+$unnnic-color-aux-red-100: #FDE3E3;
+$unnnic-color-aux-red-200: #FCCCCC;
+$unnnic-color-aux-red-300: #F8A9A9;
+$unnnic-color-aux-red-400: #F27777;
+$unnnic-color-aux-red-500: #E53E3E;
+$unnnic-color-aux-red-600: #D32F2F;
+$unnnic-color-aux-red-700: #B22323;
+$unnnic-color-aux-red-800: #932121;
+$unnnic-color-aux-red-900: #7A2222;
+$unnnic-color-aux-red-950: #420D0D;
 
 $unnnic-color-aux-orange-50: #FDF8EF;
 $unnnic-color-aux-orange-100: #FBEED9;

package/src/components/ChatsHeader/ChatsHeader.vue

@@ -68,9 +68,8 @@
           <slot />
         </div>
       </main>
-      <slot v-if="slots['right']" name="right" />
       <UnnnicButton
-        v-else-if="close"
+        v-if="close"
         class="unnnic-chats-header__close--sm"
         type="tertiary"
         iconCenter="close-1"
@@ -80,59 +79,80 @@
     </header>
   </div>
 </template>
-
-<script lang="ts" setup>
-import { useSlots } from 'vue';
-import type { UnnnicColorToken } from '../../types/unnnic-utils';
+<script>
+import UnnnicI18n from '../../mixins/i18n';
 
 import UnnnicButton from '../Button/Button.vue';
 import UnnnicAvatarIcon from '../AvatarIcon/AvatarIcon.vue';
 import UnnnicChatsUserAvatar from '../ChatsUserAvatar/ChatsUserAvatar.vue';
 import UnnnicBreadcrumb from '../Breadcrumb/Breadcrumb.vue';
 
-defineOptions({
+export default {
   name: 'UnnnicChatsHeader',
-});
-
-interface Props {
-  title?: string;
-  subtitle?: string;
-  sectionIconScheme?: UnnnicColorToken;
-  avatarIcon?: string;
-  avatarName?: string;
-  back?: () => void;
-  close?: () => void;
-  avatarClick?: () => void;
-  titleClick?: () => void;
-  crumbs?: Array<{ name: string; path: string }>;
-  size?: 'auto' | 'small' | 'large';
-}
-
-withDefaults(defineProps<Props>(), {
-  title: '',
-  subtitle: '',
-  sectionIconScheme: 'aux-purple',
-  avatarIcon: '',
-  avatarName: '',
-  back: undefined,
-  close: undefined,
-  avatarClick: undefined,
-  titleClick: undefined,
-  crumbs: () => [],
-  size: 'auto',
-});
-
-const slots = useSlots();
-
-defineEmits<{
-  crumbClick: [crumb: { name: string; path: string }];
-}>();
 
+  components: {
+    UnnnicButton,
+    UnnnicAvatarIcon,
+    UnnnicChatsUserAvatar,
+    UnnnicBreadcrumb,
+  },
+
+  mixins: [UnnnicI18n],
+
+  props: {
+    title: {
+      type: String,
+      required: true,
+      default: '',
+    },
+    subtitle: {
+      type: String,
+      default: '',
+    },
+    sectionIconScheme: {
+      type: String,
+      default: 'aux-purple',
+    },
+    avatarIcon: {
+      type: String,
+      default: '',
+    },
+    avatarName: {
+      type: String,
+      default: '',
+    },
+    back: {
+      type: Function,
+      required: false,
+    },
+    close: {
+      type: Function,
+      required: false,
+    },
+    avatarClick: {
+      type: Function,
+      required: false,
+    },
+    titleClick: {
+      type: Function,
+      required: false,
+    },
+    crumbs: {
+      type: Array,
+      default: () => [],
+    },
+    size: {
+      type: String,
+      default: 'auto',
+      validator(size) {
+        return ['auto', 'small', 'large'].includes(size);
+      },
+    },
+  },
+};
 </script>
-
 <style lang="scss">
 @use '@/assets/scss/unnnic' as *;
-
 .unnnic-chats-header {
   padding: $unnnic-spacing-sm;
 

package/src/components/index.ts

@@ -88,7 +88,6 @@ import ModalDialog from './ModalDialog/ModalDialog.vue';
 import Tour from './Tour/Tour.vue';
 import Navigator from './Navigator/index.vue';
 import SelectTime from './SelectTime/index.vue';
-import DataTable from './DataTable/index.vue';
 
 type VueComponent = Component;
 
@@ -187,7 +186,6 @@ export const components: ComponentsMap = {
   unnnicTour: Tour,
   unnnicNavigator: Navigator,
   unnnicSelectTime: SelectTime,
-  unnnicDataTable: DataTable,
 };
 
 export const unnnicFontSize = fontSize;
@@ -280,5 +278,4 @@ export const unnnicDrawer = Drawer;
 export const unnnicTableNext = TableNext;
 export const unnnicTour = Tour;
 export const unnnicNavigator = Navigator;
-export const unnnicDataTable = DataTable;
-export const unnnicSelectTime = SelectTime as VueComponent; 
+export const unnnicSelectTime = SelectTime as VueComponent; 

package/src/stories/ChatsHeader.stories.js

@@ -32,27 +32,6 @@ export const ContactInfos = {
   },
 };
 
-export const ContactRightSlot = {
-  args: {
-    title: 'John Doe',
-    avatarName: 'John Doe',
-  },
-  render: (args) => ({
-    setup() {
-      return { args };
-    },
-    components: { UnnnicChatsHeader },
-    template: `
-      <UnnnicChatsHeader 
-        v-bind="args" 
-      >
-        <template #right>
-          right slot
-        </template>
-      </UnnnicChatsHeader>`,
-  }),
-}
-
 export const Dashboard = {
   args: {
     title: size === 'large' ? 'Lorem Ipsum Inc.' : 'Dashboard',

package/src/types/index.d.ts

@@ -1,6 +1,6 @@
-import type { App, Component } from "vue";
+import type { App, Component } from 'vue';
 
-export type { IconProps } from "../components/Icon.vue";
+export type { IconProps } from '../components/Icon.vue';
 
 export interface UnnnicPlugin {
   install(app: App): void;
@@ -48,4 +48,4 @@ export declare const unnnicCallModal: (props: any) => void;
 export declare const unnnicFontSize: any;
 
 declare const Unnnic: UnnnicPlugin;
-export default Unnnic;
+export default Unnnic; 

package/dist/components/DataTable/index.vue.d.ts

@@ -1,156 +0,0 @@
-declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
-    headers: {
-        type: {
-            title: string;
-            isSortable?: boolean;
-            itemKey: string;
-            align?: "start" | "center" | "end";
-            size?: number | string;
-        }[];
-        required: true;
-    };
-    items: {
-        type: {
-            [key: string]: any;
-        }[];
-        required: true;
-    };
-    isLoading: {
-        type: Boolean;
-        default: false;
-    };
-    size: {
-        type: "sm" | "md";
-        default: "md";
-    };
-    height: {
-        type: String;
-        default: "";
-    };
-    maxHeight: {
-        type: String;
-        default: "";
-    };
-    clickable: {
-        type: Boolean;
-        default: false;
-    };
-    fixedHeaders: {
-        type: Boolean;
-        default: false;
-    };
-    hideHeaders: {
-        type: Boolean;
-        default: false;
-    };
-    hidePagination: {
-        type: Boolean;
-        default: false;
-    };
-    page: {
-        type: Number;
-        default: 1;
-    };
-    pageTotal: {
-        type: Number;
-        default: 0;
-    };
-    pageInterval: {
-        type: Number;
-        default: 5;
-    };
-    locale: {
-        type: string;
-        default: "en";
-    };
-}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:sort": (sort: {
-        header: string;
-        order: string;
-    }) => any;
-    itemClick: (item: {
-        [key: string]: any;
-    }) => any;
-    "update:page": (page: number) => any;
-}, string, import('vue').PublicProps, Readonly<{
-    headers: {
-        type: {
-            title: string;
-            isSortable?: boolean;
-            itemKey: string;
-            align?: "start" | "center" | "end";
-            size?: number | string;
-        }[];
-        required: true;
-    };
-    items: {
-        type: {
-            [key: string]: any;
-        }[];
-        required: true;
-    };
-    isLoading: {
-        type: Boolean;
-        default: false;
-    };
-    size: {
-        type: "sm" | "md";
-        default: "md";
-    };
-    height: {
-        type: String;
-        default: "";
-    };
-    maxHeight: {
-        type: String;
-        default: "";
-    };
-    clickable: {
-        type: Boolean;
-        default: false;
-    };
-    fixedHeaders: {
-        type: Boolean;
-        default: false;
-    };
-    hideHeaders: {
-        type: Boolean;
-        default: false;
-    };
-    hidePagination: {
-        type: Boolean;
-        default: false;
-    };
-    page: {
-        type: Number;
-        default: 1;
-    };
-    pageTotal: {
-        type: Number;
-        default: 0;
-    };
-    pageInterval: {
-        type: Number;
-        default: 5;
-    };
-    locale: {
-        type: string;
-        default: "en";
-    };
-}> & Readonly<{
-    "onUpdate:sort"?: ((sort: {
-        header: string;
-        order: string;
-    }) => any) | undefined;
-    onItemClick?: ((item: {
-        [key: string]: any;
-    }) => any) | undefined;
-    "onUpdate:page"?: ((page: number) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>, any>;
-export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};
-//# sourceMappingURL=index.vue.d.ts.map

package/dist/components/DataTable/index.vue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.vue.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/index.vue"],"names":[],"mappings":"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"}