mediacube-ui-v2 0.0.55 → 0.0.56

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -408,13 +408,14 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<im
408
408
  shadow: boolean;
409
409
  type: ButtonTypeUnion;
410
410
  variation: ButtonVariationUnion;
411
+ weight: WeightsUnion;
412
+ textAlign: HorizontalAlignmentUnion;
411
413
  nuxt: boolean;
412
414
  disabled: boolean;
413
415
  inactive: boolean;
414
416
  loading: boolean;
415
417
  iconLoading: boolean;
416
418
  semiRounded: boolean;
417
- textAlign: HorizontalAlignmentUnion;
418
419
  fullWidth: boolean;
419
420
  isActive: boolean;
420
421
  exact: boolean;
@@ -422,7 +423,6 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<im
422
423
  secondaryColor: "transparent" | "purple" | "hover-purple" | "light-purple" | "bg-purple" | "lighter-purple" | "black" | "outline-light" | "dark-gray" | "gray" | "outline-gray" | "hover-gray" | "bg-gray" | "white" | "hover-blue" | "blue" | "light-blue" | "lighter-blue" | "dark-orange" | "orange" | "yellow" | "dark-red" | "red" | "bright-pink" | "pale-pink" | "dark-green" | "green" | "toxic" | "ultraviolet" | "pinkish" | "azure" | "turquoise" | "darken-turquoise";
423
424
  underlineLink: boolean;
424
425
  bgFlat: boolean;
425
- weight: WeightsUnion;
426
426
  tooltip: string;
427
427
  tooltipPlacement: TooltipPositionsUnion;
428
428
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>, {
@@ -172,8 +172,8 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<im
172
172
  variation: RadioVariationUnion;
173
173
  modelValue: null;
174
174
  color: "transparent" | "purple" | "hover-purple" | "light-purple" | "bg-purple" | "lighter-purple" | "black" | "outline-light" | "dark-gray" | "gray" | "outline-gray" | "hover-gray" | "bg-gray" | "white" | "hover-blue" | "blue" | "light-blue" | "lighter-blue" | "dark-orange" | "orange" | "yellow" | "dark-red" | "red" | "bright-pink" | "pale-pink" | "dark-green" | "green" | "toxic" | "ultraviolet" | "pinkish" | "azure" | "turquoise" | "darken-turquoise";
175
- disabled: boolean;
176
175
  dir: DirectionsUnion;
176
+ disabled: boolean;
177
177
  helpText: string;
178
178
  errors: string[];
179
179
  iconSize: "400" | "500" | "600" | "700" | "50" | "100" | "150" | "200" | "250" | "300" | "550" | "800" | "900" | "1000";
@@ -487,11 +487,11 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<im
487
487
  }>, {
488
488
  icon: "reset" | "link" | "a_circle" | "access_time" | "account_circle" | "account_edit" | "add" | "add_circle" | "address" | "ads_banner" | "album" | "alert_solid" | "alternate_email" | "amocrm" | "amper_music" | "analytics" | "animation_motion" | "api" | "apple_icon" | "applications" | "applications_new" | "apps" | "archive" | "archive_in" | "archive_out" | "arrow-stats-down" | "arrow-stats-up" | "arrow_backward" | "arrow_downward" | "arrow_drop_down" | "arrow_drop_up" | "arrow_forward" | "arrow_leftward" | "arrow_rightward" | "arrow_to_grow_circle" | "arrow_up_down" | "arrow_upward" | "arrows" | "artist" | "assessment" | "assets_unassigned" | "assignment" | "assignment_ind" | "assist_icon" | "attach_money" | "audiotrack" | "backspace" | "bank" | "bank_building" | "bank_building_blue" | "bank_card" | "bank_card_arrow" | "bank_card_clock" | "bank_card_double" | "bank_card_virtual_blue" | "bank_money_colored" | "bankwire" | "bell" | "binance_coin_colored" | "biometrics" | "bitcoin" | "bitcoin_cash_colored" | "bitcoin_colored" | "board" | "book" | "broken_link" | "bug" | "bug_big" | "bug_report" | "building" | "building_colored" | "business_center" | "calendar" | "calendar_colored" | "calendar_load" | "calendar_sixteen" | "calendar_two_weeks" | "calendar_user" | "camera_alt" | "camera_plus" | "camera_video" | "cancel" | "cancel_alt" | "capitalist" | "capitalist_colored" | "card" | "card_off" | "card_off_circle" | "card_to_card_blue" | "card_to_card_colored" | "cash-ad" | "cash" | "category" | "cellphone" | "change_sheet" | "channels_icon" | "chart_bar" | "chart_line" | "chat" | "chat_add" | "chat_forum" | "chat_messages" | "check-rhombus" | "check" | "check_all" | "check_circle" | "check_circle_second" | "check_circle_solid" | "check_polygonal" | "checkbox--checked" | "checkbox" | "checkboxes" | "circle" | "circle_arrows" | "click" | "clickup" | "clip" | "clock_check" | "clock_solid" | "close" | "close_circle_outline" | "close_circle_solid" | "cloud_upload" | "coin_speed" | "comment" | "company" | "confetti" | "connection" | "contacts" | "contracts" | "convert" | "copy" | "copyright" | "credit-card" | "credit_card_blink" | "crypto" | "crypto_blue" | "crypto_colored" | "cryptowallet" | "cryptowallet_blue" | "cryptowallet_colored" | "cup" | "dashboard" | "date_range" | "deeplinks" | "delete-account" | "delete" | "delete_alt" | "deprecated" | "desktop_device" | "dialog" | "discord" | "discord_colored" | "dislike" | "doc-export" | "document" | "dollar" | "donate_blue" | "donate_colored" | "dot-status" | "download" | "drag" | "eWallet" | "e_wallet_blue" | "e_wallet_colored" | "edit" | "edit_solid" | "email" | "email_circle" | "email_colored" | "enrollment" | "epayments_colored" | "epidemic-sound" | "epidemic_sound_circle" | "error" | "ethereum_colored" | "event" | "event_alt" | "exit_to_app" | "explicit" | "export" | "export_all" | "express_payment" | "face" | "face_alt" | "facebook" | "facebook_colored" | "fast" | "favorite" | "file" | "file_add" | "file_copy" | "file_download" | "file_export" | "file_eye" | "file_import" | "file_new" | "filter_list" | "find_in_page" | "fire" | "fire_colored" | "fire_solid" | "flag_ar" | "flag_en" | "flag_es" | "flag_pt" | "flag_ru" | "flag_th" | "flag_vi" | "fly_dollar" | "fly_euro" | "freeze" | "fullscreen" | "get_app" | "gift_solid" | "glasses" | "google_colored" | "googleplus_colored" | "graph-no-data" | "group" | "group_connection" | "growth_arrow_circle" | "hand_money" | "help" | "help_invert" | "help_solid" | "help_ukraine_colored" | "home" | "iban" | "iban_blue" | "id_square" | "id_thin" | "image" | "infinity" | "info" | "info_rounded_square" | "info_solid" | "instagram" | "instagram_colored" | "keyboard" | "keyboard_arrow_left" | "keyboard_arrow_right" | "keyboard_arrow_right_thin" | "kraken" | "language" | "layers" | "lightning" | "lightning_circle" | "lightning_circle_solid" | "lightning_outlined" | "like" | "link_broken" | "link_colored" | "link_external" | "link_external_new" | "linkedin" | "linkedin_colored" | "list" | "litecoin_colored" | "live_help" | "loader" | "location_city" | "location_on" | "lock" | "lock_old" | "logout" | "magic_blink" | "mail_outline" | "mc_assist" | "mc_dashboard" | "mc_id" | "mc_pay" | "mc_pay_app" | "mc_pay_compact" | "mc_pay_menu" | "mc_pay_menu_circle_colored" | "mc_pay_mobile_app" | "mc_studio" | "mc_vidwide" | "mcadslogo" | "mediacube" | "menu" | "menu_new" | "message" | "messenger" | "messenger_colored" | "minus" | "mobile_device" | "money_clock" | "money_input" | "more_horiz" | "music" | "music_icon" | "new" | "notes" | "objects" | "obs" | "okru" | "okru_colored" | "ondemand_video" | "partners" | "pause" | "payment" | "payoneer" | "payoneer_colored" | "payoneer_cy" | "paypal" | "paypal_colored" | "percent" | "personal_email_colored" | "phone_colored" | "photo_add" | "picture" | "picture_thin" | "plane" | "play-videos" | "play" | "print" | "prototype" | "public" | "qiwi" | "qiwi_colored" | "radio--checked" | "ready" | "receipt" | "receipt_thin" | "recording_circle" | "recruiters" | "redo" | "referral" | "referral_solid" | "reload" | "reload_right" | "remove_red_eye" | "repair" | "reply_arrow" | "requisites" | "resize_video" | "revenue" | "review" | "ripple_colored" | "rocket" | "rocket_colored" | "rocket_small" | "role" | "safety" | "sand_clock" | "save" | "search" | "send" | "send_solid" | "settings" | "settings_solid" | "settings_tools" | "shield" | "shield_blue" | "shield_colored" | "shield_usd" | "shop" | "shopping_cart" | "shuffle" | "sign_out" | "skype" | "skype_colored" | "slack" | "smile_star_eye" | "sort_asc" | "sort_az" | "sort_desc" | "sort_directions" | "sort_list" | "sort_za" | "spy_colored" | "staff" | "star" | "star_round" | "star_round_solid" | "stars" | "stars_fill" | "stats_icon" | "steam" | "steam_colored" | "studio_icon" | "subscriptions" | "suitcase" | "supervised_user_circle" | "support" | "swap_cubes" | "swap_cubes_colored" | "swap_horizontal_circle" | "switches" | "table" | "telegram" | "telegram_colored" | "tether" | "tether_colored" | "three_dots" | "thumb_down" | "thumb_up" | "tiktok" | "time" | "time_thin" | "timelapse" | "timeline" | "tipalti" | "transaction" | "twitter_colored" | "unarchive" | "unfold_more" | "unlock" | "upload_img" | "usd_coin_colored" | "user" | "user_edit" | "user_kyc" | "viber" | "viber_colored" | "videoblocks" | "vidiq-logo-mono" | "vidiq_circle" | "visibility" | "visibility_off" | "vkontakte" | "vkontakte_colored" | "wallet" | "warning" | "webmoney" | "webmoney_colored" | "website_colored" | "whatsapp" | "whatsapp_colored" | "wise_colored" | "worldfirst" | "x_network" | "yandexmoney" | "yoomoney_colored" | "youtube" | "youtube_circled" | "youtube_circled_second" | "youtube_colored" | "youtube_outlined" | "zcash_colored";
489
489
  title: string;
490
+ required: boolean;
491
+ dir: DirectionsUnion;
490
492
  disabled: boolean;
491
493
  loading: boolean;
492
494
  tabindex: string | number;
493
- required: boolean;
494
- dir: DirectionsUnion;
495
495
  helpText: string;
496
496
  placeholder: string;
497
497
  errors: string[];
@@ -429,9 +429,9 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<im
429
429
  title: string;
430
430
  mask: string;
431
431
  modelValue: InputValue;
432
- disabled: boolean;
433
432
  required: boolean;
434
433
  dir: DirectionsUnion;
434
+ disabled: boolean;
435
435
  helpText: string;
436
436
  placeholder: string;
437
437
  errors: string[];
@@ -111,8 +111,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
111
111
  }>> & Readonly<{}>, {
112
112
  size: "400" | "500" | "600" | "700" | "50" | "100" | "150" | "200" | "250" | "300" | "550" | "800" | "900" | "1000";
113
113
  color: "transparent" | "purple" | "hover-purple" | "light-purple" | "bg-purple" | "lighter-purple" | "black" | "outline-light" | "dark-gray" | "gray" | "outline-gray" | "hover-gray" | "bg-gray" | "white" | "hover-blue" | "blue" | "light-blue" | "lighter-blue" | "dark-orange" | "orange" | "yellow" | "dark-red" | "red" | "bright-pink" | "pale-pink" | "dark-green" | "green" | "toxic" | "ultraviolet" | "pinkish" | "azure" | "turquoise" | "darken-turquoise";
114
- weight: number;
115
114
  spritePath: string;
115
+ weight: number;
116
116
  defaultName: string;
117
117
  dir: DirectionsUnion;
118
118
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
@@ -178,10 +178,10 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<im
178
178
  uppercase: boolean;
179
179
  variation: TitleVariationsUnion;
180
180
  color: "transparent" | "purple" | "hover-purple" | "light-purple" | "bg-purple" | "lighter-purple" | "black" | "outline-light" | "dark-gray" | "gray" | "outline-gray" | "hover-gray" | "bg-gray" | "white" | "hover-blue" | "blue" | "light-blue" | "lighter-blue" | "dark-orange" | "orange" | "yellow" | "dark-red" | "red" | "bright-pink" | "pale-pink" | "dark-green" | "green" | "toxic" | "ultraviolet" | "pinkish" | "azure" | "turquoise" | "darken-turquoise";
181
- textAlign: HorizontalAlignmentUnion;
182
181
  weight: WeightsUnion;
183
182
  ellipsis: boolean;
184
183
  tagName: string;
184
+ textAlign: HorizontalAlignmentUnion;
185
185
  lineHeight: "400" | "500" | "600" | "150" | "200" | "250" | "300";
186
186
  maxWidth: string;
187
187
  preLine: boolean;
@@ -65,5 +65,6 @@ export { default as McTableCardHeader } from './templates/McTable/McTableCard/Mc
65
65
  export { default as McTableCard } from './templates/McTable/McTableCard/McTableCard.vue';
66
66
  export { default as McTableSkeletonLoading } from './templates/McTable/McTableSkeletonLoading/McTableSkeletonLoading.vue';
67
67
  export { default as McTableSort } from './templates/McTable/McTableSort/McTableSort.vue';
68
+ export { default as McToast } from './templates/McToast/McToast.vue';
68
69
  export { default as McTopBar } from './templates/McTopBar/McTopBar.vue';
69
70
  export { default as McVirtualScroll } from './templates/McVirtualScroll/McVirtualScroll.vue';
@@ -49,7 +49,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
49
49
  }>> & Readonly<{
50
50
  onClose?: (() => any) | undefined;
51
51
  }>, {
52
- isActive: boolean;
53
52
  closable: boolean;
53
+ isActive: boolean;
54
54
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
55
55
  export default _default;
@@ -0,0 +1,141 @@
1
+ import { PropType } from 'vue';
2
+ import { IconsListUnion } from '../../../types/styles/Icons';
3
+ import { ColorTypes, IToast, IToastAction, ToastPositionsUnion } from '../../../types';
4
+ import { ToastPositions } from '../../../enums/Toast';
5
+ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
6
+ id: {
7
+ type: PropType<number>;
8
+ };
9
+ duration: {
10
+ type: PropType<number>;
11
+ default: null;
12
+ };
13
+ position: {
14
+ type: () => ToastPositionsUnion;
15
+ default: ToastPositions;
16
+ };
17
+ variation: {
18
+ type: () => ColorTypes;
19
+ default: string;
20
+ };
21
+ /**
22
+ * иконка
23
+ */
24
+ icon: {
25
+ type: () => IconsListUnion;
26
+ default: null;
27
+ };
28
+ title: {
29
+ type: PropType<string>;
30
+ default: null;
31
+ };
32
+ description: {
33
+ type: PropType<string>;
34
+ default: null;
35
+ };
36
+ /**
37
+ * Нужна ли кнопка
38
+ * закрытия
39
+ */
40
+ closable: {
41
+ type: PropType<boolean>;
42
+ default: boolean;
43
+ };
44
+ /**
45
+ * Temporary unavailable
46
+ * */
47
+ show_time: {
48
+ type: PropType<boolean>;
49
+ default: boolean;
50
+ };
51
+ /**
52
+ * Array of mc-button props
53
+ * */
54
+ actions: {
55
+ type: PropType<IToastAction[]>;
56
+ default: () => never[];
57
+ };
58
+ /**
59
+ * Technical prop
60
+ * */
61
+ toast: {
62
+ type: () => IToast;
63
+ default: () => {};
64
+ };
65
+ }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
66
+ close: (value: IToast) => any;
67
+ }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
68
+ id: {
69
+ type: PropType<number>;
70
+ };
71
+ duration: {
72
+ type: PropType<number>;
73
+ default: null;
74
+ };
75
+ position: {
76
+ type: () => ToastPositionsUnion;
77
+ default: ToastPositions;
78
+ };
79
+ variation: {
80
+ type: () => ColorTypes;
81
+ default: string;
82
+ };
83
+ /**
84
+ * иконка
85
+ */
86
+ icon: {
87
+ type: () => IconsListUnion;
88
+ default: null;
89
+ };
90
+ title: {
91
+ type: PropType<string>;
92
+ default: null;
93
+ };
94
+ description: {
95
+ type: PropType<string>;
96
+ default: null;
97
+ };
98
+ /**
99
+ * Нужна ли кнопка
100
+ * закрытия
101
+ */
102
+ closable: {
103
+ type: PropType<boolean>;
104
+ default: boolean;
105
+ };
106
+ /**
107
+ * Temporary unavailable
108
+ * */
109
+ show_time: {
110
+ type: PropType<boolean>;
111
+ default: boolean;
112
+ };
113
+ /**
114
+ * Array of mc-button props
115
+ * */
116
+ actions: {
117
+ type: PropType<IToastAction[]>;
118
+ default: () => never[];
119
+ };
120
+ /**
121
+ * Technical prop
122
+ * */
123
+ toast: {
124
+ type: () => IToast;
125
+ default: () => {};
126
+ };
127
+ }>> & Readonly<{
128
+ onClose?: ((value: IToast) => any) | undefined;
129
+ }>, {
130
+ position: ToastPositionsUnion;
131
+ icon: "reset" | "link" | "a_circle" | "access_time" | "account_circle" | "account_edit" | "add" | "add_circle" | "address" | "ads_banner" | "album" | "alert_solid" | "alternate_email" | "amocrm" | "amper_music" | "analytics" | "animation_motion" | "api" | "apple_icon" | "applications" | "applications_new" | "apps" | "archive" | "archive_in" | "archive_out" | "arrow-stats-down" | "arrow-stats-up" | "arrow_backward" | "arrow_downward" | "arrow_drop_down" | "arrow_drop_up" | "arrow_forward" | "arrow_leftward" | "arrow_rightward" | "arrow_to_grow_circle" | "arrow_up_down" | "arrow_upward" | "arrows" | "artist" | "assessment" | "assets_unassigned" | "assignment" | "assignment_ind" | "assist_icon" | "attach_money" | "audiotrack" | "backspace" | "bank" | "bank_building" | "bank_building_blue" | "bank_card" | "bank_card_arrow" | "bank_card_clock" | "bank_card_double" | "bank_card_virtual_blue" | "bank_money_colored" | "bankwire" | "bell" | "binance_coin_colored" | "biometrics" | "bitcoin" | "bitcoin_cash_colored" | "bitcoin_colored" | "board" | "book" | "broken_link" | "bug" | "bug_big" | "bug_report" | "building" | "building_colored" | "business_center" | "calendar" | "calendar_colored" | "calendar_load" | "calendar_sixteen" | "calendar_two_weeks" | "calendar_user" | "camera_alt" | "camera_plus" | "camera_video" | "cancel" | "cancel_alt" | "capitalist" | "capitalist_colored" | "card" | "card_off" | "card_off_circle" | "card_to_card_blue" | "card_to_card_colored" | "cash-ad" | "cash" | "category" | "cellphone" | "change_sheet" | "channels_icon" | "chart_bar" | "chart_line" | "chat" | "chat_add" | "chat_forum" | "chat_messages" | "check-rhombus" | "check" | "check_all" | "check_circle" | "check_circle_second" | "check_circle_solid" | "check_polygonal" | "checkbox--checked" | "checkbox" | "checkboxes" | "circle" | "circle_arrows" | "click" | "clickup" | "clip" | "clock_check" | "clock_solid" | "close" | "close_circle_outline" | "close_circle_solid" | "cloud_upload" | "coin_speed" | "comment" | "company" | "confetti" | "connection" | "contacts" | "contracts" | "convert" | "copy" | "copyright" | "credit-card" | "credit_card_blink" | "crypto" | "crypto_blue" | "crypto_colored" | "cryptowallet" | "cryptowallet_blue" | "cryptowallet_colored" | "cup" | "dashboard" | "date_range" | "deeplinks" | "delete-account" | "delete" | "delete_alt" | "deprecated" | "desktop_device" | "dialog" | "discord" | "discord_colored" | "dislike" | "doc-export" | "document" | "dollar" | "donate_blue" | "donate_colored" | "dot-status" | "download" | "drag" | "eWallet" | "e_wallet_blue" | "e_wallet_colored" | "edit" | "edit_solid" | "email" | "email_circle" | "email_colored" | "enrollment" | "epayments_colored" | "epidemic-sound" | "epidemic_sound_circle" | "error" | "ethereum_colored" | "event" | "event_alt" | "exit_to_app" | "explicit" | "export" | "export_all" | "express_payment" | "face" | "face_alt" | "facebook" | "facebook_colored" | "fast" | "favorite" | "file" | "file_add" | "file_copy" | "file_download" | "file_export" | "file_eye" | "file_import" | "file_new" | "filter_list" | "find_in_page" | "fire" | "fire_colored" | "fire_solid" | "flag_ar" | "flag_en" | "flag_es" | "flag_pt" | "flag_ru" | "flag_th" | "flag_vi" | "fly_dollar" | "fly_euro" | "freeze" | "fullscreen" | "get_app" | "gift_solid" | "glasses" | "google_colored" | "googleplus_colored" | "graph-no-data" | "group" | "group_connection" | "growth_arrow_circle" | "hand_money" | "help" | "help_invert" | "help_solid" | "help_ukraine_colored" | "home" | "iban" | "iban_blue" | "id_square" | "id_thin" | "image" | "infinity" | "info" | "info_rounded_square" | "info_solid" | "instagram" | "instagram_colored" | "keyboard" | "keyboard_arrow_left" | "keyboard_arrow_right" | "keyboard_arrow_right_thin" | "kraken" | "language" | "layers" | "lightning" | "lightning_circle" | "lightning_circle_solid" | "lightning_outlined" | "like" | "link_broken" | "link_colored" | "link_external" | "link_external_new" | "linkedin" | "linkedin_colored" | "list" | "litecoin_colored" | "live_help" | "loader" | "location_city" | "location_on" | "lock" | "lock_old" | "logout" | "magic_blink" | "mail_outline" | "mc_assist" | "mc_dashboard" | "mc_id" | "mc_pay" | "mc_pay_app" | "mc_pay_compact" | "mc_pay_menu" | "mc_pay_menu_circle_colored" | "mc_pay_mobile_app" | "mc_studio" | "mc_vidwide" | "mcadslogo" | "mediacube" | "menu" | "menu_new" | "message" | "messenger" | "messenger_colored" | "minus" | "mobile_device" | "money_clock" | "money_input" | "more_horiz" | "music" | "music_icon" | "new" | "notes" | "objects" | "obs" | "okru" | "okru_colored" | "ondemand_video" | "partners" | "pause" | "payment" | "payoneer" | "payoneer_colored" | "payoneer_cy" | "paypal" | "paypal_colored" | "percent" | "personal_email_colored" | "phone_colored" | "photo_add" | "picture" | "picture_thin" | "plane" | "play-videos" | "play" | "print" | "prototype" | "public" | "qiwi" | "qiwi_colored" | "radio--checked" | "ready" | "receipt" | "receipt_thin" | "recording_circle" | "recruiters" | "redo" | "referral" | "referral_solid" | "reload" | "reload_right" | "remove_red_eye" | "repair" | "reply_arrow" | "requisites" | "resize_video" | "revenue" | "review" | "ripple_colored" | "rocket" | "rocket_colored" | "rocket_small" | "role" | "safety" | "sand_clock" | "save" | "search" | "send" | "send_solid" | "settings" | "settings_solid" | "settings_tools" | "shield" | "shield_blue" | "shield_colored" | "shield_usd" | "shop" | "shopping_cart" | "shuffle" | "sign_out" | "skype" | "skype_colored" | "slack" | "smile_star_eye" | "sort_asc" | "sort_az" | "sort_desc" | "sort_directions" | "sort_list" | "sort_za" | "spy_colored" | "staff" | "star" | "star_round" | "star_round_solid" | "stars" | "stars_fill" | "stats_icon" | "steam" | "steam_colored" | "studio_icon" | "subscriptions" | "suitcase" | "supervised_user_circle" | "support" | "swap_cubes" | "swap_cubes_colored" | "swap_horizontal_circle" | "switches" | "table" | "telegram" | "telegram_colored" | "tether" | "tether_colored" | "three_dots" | "thumb_down" | "thumb_up" | "tiktok" | "time" | "time_thin" | "timelapse" | "timeline" | "tipalti" | "transaction" | "twitter_colored" | "unarchive" | "unfold_more" | "unlock" | "upload_img" | "usd_coin_colored" | "user" | "user_edit" | "user_kyc" | "viber" | "viber_colored" | "videoblocks" | "vidiq-logo-mono" | "vidiq_circle" | "visibility" | "visibility_off" | "vkontakte" | "vkontakte_colored" | "wallet" | "warning" | "webmoney" | "webmoney_colored" | "website_colored" | "whatsapp" | "whatsapp_colored" | "wise_colored" | "worldfirst" | "x_network" | "yandexmoney" | "yoomoney_colored" | "youtube" | "youtube_circled" | "youtube_circled_second" | "youtube_colored" | "youtube_outlined" | "zcash_colored";
132
+ title: string;
133
+ variation: "transparent" | "purple" | "hover-purple" | "light-purple" | "bg-purple" | "lighter-purple" | "black" | "outline-light" | "dark-gray" | "gray" | "outline-gray" | "hover-gray" | "bg-gray" | "white" | "hover-blue" | "blue" | "light-blue" | "lighter-blue" | "dark-orange" | "orange" | "yellow" | "dark-red" | "red" | "bright-pink" | "pale-pink" | "dark-green" | "green" | "toxic" | "ultraviolet" | "pinkish" | "azure" | "turquoise" | "darken-turquoise";
134
+ duration: number;
135
+ description: string;
136
+ closable: boolean;
137
+ show_time: boolean;
138
+ actions: IToastAction[];
139
+ toast: IToast;
140
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
141
+ export default _default;
@@ -0,0 +1,26 @@
1
+ import { PropType } from 'vue';
2
+ import { IToast } from '../../../types';
3
+ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
4
+ reactiveProps: {
5
+ type: PropType<{
6
+ toasts: IToast[];
7
+ }>;
8
+ default: () => {
9
+ toasts: never[];
10
+ };
11
+ };
12
+ }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
13
+ reactiveProps: {
14
+ type: PropType<{
15
+ toasts: IToast[];
16
+ }>;
17
+ default: () => {
18
+ toasts: never[];
19
+ };
20
+ };
21
+ }>> & Readonly<{}>, {
22
+ reactiveProps: {
23
+ toasts: IToast[];
24
+ };
25
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
26
+ export default _default;
@@ -6,3 +6,4 @@ export { useHelper } from './useHelper';
6
6
  export { useModal } from './useModal';
7
7
  export { useRandomNumber } from './useRandomNumber';
8
8
  export { useTooltip } from './useTooltip';
9
+ export { useToast } from './useToast';
@@ -0,0 +1,4 @@
1
+ export declare function useTimer(callback: Function, duration: number): {
2
+ start: () => void;
3
+ pause: () => void;
4
+ };
@@ -0,0 +1,10 @@
1
+ import { IToast } from '../types';
2
+ declare function show(payload: Partial<IToast>): void;
3
+ declare function info(payload: Partial<IToast>): void;
4
+ declare function hideAll(): void;
5
+ export declare function useToast(): {
6
+ show: typeof show;
7
+ info: typeof info;
8
+ hideAll: typeof hideAll;
9
+ };
10
+ export {};
@@ -0,0 +1,8 @@
1
+ export declare enum ToastPositions {
2
+ TopLeft = "top-left",
3
+ TopCenter = "top-center",
4
+ TopRight = "top-right",
5
+ BottomLeft = "bottom-left",
6
+ BottomCenter = "bottom-center",
7
+ BottomRight = "bottom-right"
8
+ }
@@ -15,6 +15,7 @@ export * from './Select';
15
15
  export * from './Sidebar';
16
16
  export * from './Tab';
17
17
  export * from './Title';
18
+ export * from './Toast';
18
19
  export * from './Tooltip';
19
20
  export * from './ui/Alignment';
20
21
  export * from './ui/Button';
@@ -0,0 +1,25 @@
1
+ import { ToastPositions } from '../enums/Toast';
2
+ import { ColorTypes } from './styles/Colors';
3
+ import { IconsListUnion } from './styles/Icons';
4
+ import { ButtonVariationUnion } from './IButton';
5
+ export interface IToast {
6
+ id?: number;
7
+ duration?: number;
8
+ position: ToastPositions;
9
+ variation?: ColorTypes;
10
+ icon?: IconsListUnion;
11
+ title: string;
12
+ description: string;
13
+ closable?: boolean;
14
+ show_time?: boolean;
15
+ actions?: IToastAction[];
16
+ destroy: Function;
17
+ toast: IToast;
18
+ }
19
+ export interface IToastAction {
20
+ title: string;
21
+ handler: Function;
22
+ variation?: ButtonVariationUnion;
23
+ icon?: IconsListUnion;
24
+ }
25
+ export type ToastPositionsUnion = (typeof ToastPositions)[keyof typeof ToastPositions];
@@ -19,6 +19,7 @@ export * from './ISideBar';
19
19
  export * from './ITable';
20
20
  export * from './ITabs';
21
21
  export * from './ITitle';
22
+ export * from './IToast';
22
23
  export * from './ITooltip';
23
24
  export * from './styles/Alignment';
24
25
  export * from './styles/AvatarSizes';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "mediacube-ui-v2",
3
- "version": "0.0.55",
3
+ "version": "0.0.56",
4
4
  "license": "MIT",
5
5
  "description": "Design system for Mediacube services",
6
6
  "keywords": [