@vitrosoftware/common-ui-ts 1.1.25 → 1.1.28

package/css/std/controls/action-handler/action-handler.css

@@ -213,6 +213,7 @@
     color: #222D44 !important;
     border: 1px solid #E4E6EC !important;
     margin-right: 12px !important;
+    font-family: 'InterRegular' !important;
 }
 
 .vitro-button-cancel:hover, .vitro-button-cancel:active {
@@ -220,9 +221,9 @@
 }
 
 .vitro-button, .vitro-button-cancel {
-    min-width: 145px !important;
-    height: 44px !important;
-    font-size: 18px !important;
+    min-width: 120px !important;
+    height: 40px !important;
+    font-size: 16px !important;
 }
 
 .vitro-success {

package/css/std/controls/dialog/dialog-button-close.css

@@ -15,6 +15,7 @@
 }
 
 .vitro-button-close {
+    font-family: 'InterRegular' !important;
     background: #fff !important;
     color: #222D44 !important;
     border: none;

package/css/std/controls/dropdown-button/dropdown-button.css

@@ -51,13 +51,6 @@
     color: #4A556C;
 }
 
-.vitro-icon {
-    width: 20px;
-    height: 20px;
-    background-size: 20px;
-    margin-right: 12px;
-}
-
 .vitro-dropdown-button :global(.dropdown-menu) {
     box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
     background: #fff;
@@ -94,6 +87,18 @@
     background-image: url(data:image/svg+xml,%3Csvg viewBox=%270 0 16 11%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M6.31554 1.65838L0.382812 11H15.6249L9.69214 1.65838C8.90651 0.421336 7.10117 0.421335 6.31554 1.65838Z%27 fill=%27white%27/%3E%3C/svg%3E%0A);
 }
 
+.vitro-dropdown-button :global(.dropdown-item) .vitro-icon {
+    width: 20px;
+    height: 20px;
+    margin-right: 12px;
+    margin-left: 0;
+}
+
+.vitro-dropdown-button :global(.dropdown-item) .vitro-icon img {
+    width: 20px;
+    height: 20px;
+}
+
 .vitro-dropdown-button :global(.dropdown-item) {
     display: flex;
     align-items: center;

package/css/std/controls/message-input/message-input.css

@@ -0,0 +1,110 @@
+.vitro-message-input {
+    display: flex;
+    align-items: flex-start;
+    border-top: 1px solid #e0e0e0;
+    padding-top: 12px;
+}
+
+.vitro-message-input .vitro-control {
+    width: 100%;
+    position: relative;
+    padding: 0;
+    border-radius: 4px;
+    border: 1px solid #C0CAD5;
+    min-height: 40px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0 8px;
+    margin-left: 8px;
+}
+
+.vitro-control textarea {
+    border: none;
+    resize: none;
+    line-height: 20px;
+    overflow-y: auto;
+    height: 20px;
+    width: 90%;
+}
+
+.vitro-control span {
+    overflow-y: auto;
+    width: 90%;
+    height: fit-content;
+    max-height: 60px;
+}
+
+.vitro-button-send {
+    height: 24px;
+    width: 24px;
+    background-color: #fff;
+    border: none;
+    outline: none;
+    background-size: 100%;
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Layer_1' x='0px' y='0px' viewBox='0 0 20 20' style='enable-background:new 0 0 20 20;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23BDBDBD;stroke-miterlimit:10;%7D%0A%3C/style%3E%3Cpath class='st0' d='M18,10L1.5,8.5l0-5.9L18,10c-5.5,2.5-11,5-16.5,7.5v-6L18,10'/%3E%3C/svg%3E");
+}
+
+.vitro-button-send:hover,
+.vitro-button-send:active {
+    background-color: none;
+    border: none;
+    outline: none;
+}
+
+:global(.vitro-input-upload-file) {
+    height: 24px;
+}
+
+:global(.vitro-input-upload-file) input {
+    display: none;
+}
+
+:global(.vitro-input-upload-file) label {
+    margin-bottom: 0px;
+}
+
+:global(.card-header), textarea:global(.note-codable), :global(.note-statusbar), :global(.note-table-popover.bottom), :global(.note-link-popover.bottom), :global(.note-dropzone) {
+    display: none;
+}
+
+:global(.note-editor) {
+    width: 100%;
+    border: none !important;
+}
+
+:global(.note-editable) {
+    color: #4F4F4F;
+}
+
+:global(.note-editable) img {
+    max-width: 200px;
+    display: block;
+}
+
+:global(.note-popover.popover) {
+    max-width: 440px;
+    max-height: 150px;
+    overflow-y: auto;
+    border: none;
+    background: #fff;
+    box-shadow: 0 4px 16px rgb(0 0 0 / 10%);
+    border-radius: 8px;
+    margin-bottom: 8px;
+}
+
+:global(.note-popover.popover div.note-hint-group) {
+    padding: 8px 0;
+}
+
+:global(.note-hint-item) {
+    padding: 4px 8px;
+    font-family: "InterRegular";
+    font-size: 10pt;
+    line-height: 11pt;
+    cursor: pointer;
+}
+
+:global(.note-hint-item):hover {
+    background: #F5F6FA;
+}

package/css/std/controls/table-view/treegrid.css

@@ -211,16 +211,28 @@ div.TWMenuItemText {
 .TWCheck0Left,
 .TWMenuUncheckedIconLeft, .TWMenuUncheckedIconRight,
 .TWBool0, .TWBool0RO {
-    /* ico-tableview-checkbox-empty.svg URL-encoder for SVG */
-    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 64 64'%3E%3Crect fill='none' stroke='%23bdbdbd' stroke-width='2' x='10' y='10' width='40' height='40' rx='5' ry='5'/%3E%3C/svg%3E") !important;
+	background-size: 24px;
+    /* checkbox-big-empty.svg URL-encoder for SVG */
+	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='Checkbox-big'%3E%3Crect id='Background' x='2.5' y='2.5' width='19' height='19' rx='3.5' stroke='%23C0CAD5'/%3E%3C/g%3E%3C/svg%3E%0A") !important;
 }
 
 .TWCheck1Left,
 .TWMenuCheckedIconLeft, .TWMenuCheckedIconRight,
 .TWFilter1, .TWGroup1, .TWSearch1,
 .TWBool1, .TWBool1RO {
-    /* ico-tableview-checkbox-full.svg URL-encoder for SVG */
-    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' viewBox='0 0 64 64'%3E%3Crect fill='%23fff' stroke='%23bdbdbd' stroke-width='2' x='10' y='10' width='40' height='40' rx='5' ry='5'/%3E%3Cpolyline fill='none' stroke='%23ff5b2d' stroke-width='6' points='16,28 28,38 44,20'/%3E%3C/svg%3E") !important;
+	background-size: 24px;
+    /* checkbox-big-active.svg URL-encoder for SVG */
+	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='2' y='2' width='20' height='20' rx='2.5' fill='%234292F7'/%3E%3Cpath d='M16.7062 8.50593C17.0826 8.86144 17.0996 9.45479 16.7441 9.83121L11.4316 15.4562C11.2577 15.6404 11.0166 15.7463 10.7634 15.7499C10.5101 15.7535 10.2662 15.6545 10.0871 15.4754L7.27459 12.6629C6.90847 12.2968 6.90847 11.7032 7.27459 11.3371C7.6407 10.971 8.2343 10.971 8.60041 11.3371L10.7308 13.4675L15.3809 8.54379C15.7364 8.16737 16.3298 8.15042 16.7062 8.50593Z' fill='white'/%3E%3C/svg%3E%0A") !important;
+}
+
+.TWBoolX, .TWBoolXRO {
+	background-size: 24px;
+	/* checkbox-big-undetermined.svg URL-encoder for SVG */
+	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='7' y='7' width='10' height='10' rx='1' fill='%234292F7'/%3E%3Crect x='2.625' y='2.625' width='18.75' height='18.75' rx='1.875' stroke='%23C0CAD5' stroke-width='1.25'/%3E%3C/svg%3E%0A") !important;
+}
+
+.TWBoolImage {
+	width: 24px !important;
 }
 
 .TWPickEmpty {

package/dist/controls/ActionHandler/ActionHandlerConstants.d.ts

@@ -1,18 +1,19 @@
 export declare enum LOCALE {
     CONF_SINGLE = "app.common.msg.action.conf.single",
     CONF_MULTI = "app.common.msg.action.conf.multi",
+    CONF_STD = "app.common.msg.action.conf.std",
     ITEM_COUNT = "app.common.actionHandler.itemCount",
     ITEM_NAME = "app.common.actionHandler.itemName",
     SUCCESS_SINGLE = "app.common.msg.action.success.single",
     SUCCESS_MULTI = "app.common.msg.action.success.multi",
+    SUCCESS_STD = "app.common.msg.action.success.std",
     ERROR_SINGLE = "app.common.msg.action.error.single",
     ERROR_MULTI = "app.common.msg.action.error.multi",
+    ERROR_STD = "app.common.msg.action.error.std",
     PROGRESS_SINGLE = "app.common.msg.action.progress.single",
     PROGRESS_MULTI = "app.common.msg.action.progress.multi",
-    WARNING_SINGLE = "app.common.msg.action.warning.single",
-    WARNING_MULTI = "app.common.msg.action.warning.multi",
+    PROGRESS_STD = "app.common.msg.action.progress.std",
     ACTION = "app.common.action",
-    ACTION_MSG = "app.common.msg.action",
     ERROR_MSG = "app.common.msg.error",
     SUCCESS = "success",
     PROGRESS = "progress",

package/dist/controls/CommandMenu/CommandMenuDropdownButton.d.ts

@@ -3,6 +3,7 @@ interface CommandMenuDropdownButtonProps {
     itemList?: {
         text: string;
         onClick: (e: any) => any;
+        imageUrl?: string;
     }[];
     toggle?: boolean;
     children: React.ReactNode;

package/dist/controls/CommandMenu/CommandMenuSubItem.d.ts

@@ -5,6 +5,7 @@ interface CommandMenuSubItemProps {
     title?: string;
     onClick: (e: any) => any;
     href?: string;
+    isShowImage?: boolean;
     imageUrl?: string;
     imageHoverUrl?: string;
 }

package/dist/controls/MessageInput/MessageInput.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+interface MessageInputProps {
+    userName: string;
+    userImageUrl?: string;
+    placeholder?: string;
+    maxRows?: number;
+    isDisabled?: boolean;
+    onSubmit: (value: string) => any;
+    onChange?: (e: any, value: string) => any;
+    onDrop?: (e: any) => any;
+    children?: React.ReactNode;
+}
+export declare const MessageInput: (props: MessageInputProps) => JSX.Element;
+export {};

package/dist/controls/PdfViewer/PdfViewerContext.d.ts

@@ -4,7 +4,6 @@ export interface PdfViewerContext {
     getFile(id: string): any;
     getFileVersionList(id: string): any;
     createLocale(key: string): any;
-    updateIssue(name: string, description: string): any;
     getIssueList(): Promise<any>;
     onCreateIssue(data: any): any;
     toggleIssueDetail(show: boolean): any;

package/dist/controls/TableView/TableViewConstants.d.ts

@@ -13,6 +13,7 @@ export declare enum EVENT {
     ON_CUSTOM_END_EDIT = "OnCustomEndEdit",
     ON_CUSTOM_START_EDIT = "OnCustomStartEdit",
     ON_ENDED_DRAG = "OnEndedDrag",
+    ON_END_DRAG = "OnEndDrag",
     ON_FILTER_OPERATOR = "OnFilterOperator",
     ON_FILTER = "OnFilter",
     ON_GANTT_CHANGED = "OnGanttChanged",

package/dist/controls/TelerikUploader/TelerikUploaderContextImpl.d.ts

@@ -31,6 +31,7 @@ export declare class TelerikUploaderContextImpl implements TelerikUploaderContex
     private getProgressInfo;
     addFile(): void;
     setAthorizationToken(token: string): void;
+    private setErrorMessage;
     private setFileImage;
     private setProgressBar;
     private setFileProgress;

package/dist/controls/TelerikUploader/TelerikUploaderSettings.d.ts

@@ -11,4 +11,5 @@ export interface TelerikUploaderSettings {
     isAutoReset?: boolean;
     resetDurationMs?: number;
     getFileImage?: (name: string) => string;
+    handleError?: (response: any) => any;
 }

package/dist/controls/TreeView/TreeViewConstants.d.ts

@@ -28,7 +28,8 @@ export declare enum EVENT {
     CLOSE_NODE = "close_node.jstree",
     SELECT_NODE = "select_node.jstree",
     LOADED = "loaded.jstree",
-    MODEL = "model.jstree"
+    MODEL = "model.jstree",
+    DBLCLICK = "dblclick.jstree"
 }
 export declare enum NODE_TYPE {
     FOLDER = "folder",

package/dist/index.css

@@ -1281,6 +1281,7 @@
     color: #222D44 !important;
     border: 1px solid #E4E6EC !important;
     margin-right: 12px !important;
+    font-family: 'InterRegular' !important;
 }
 
 ._action-handler_vitro-button-cancel_GE8JsGp:hover, ._action-handler_vitro-button-cancel_GE8JsGp:active {
@@ -1288,9 +1289,9 @@
 }
 
 ._action-handler_vitro-button_1wSNAYT, ._action-handler_vitro-button-cancel_GE8JsGp {
-    min-width: 145px !important;
-    height: 44px !important;
-    font-size: 18px !important;
+    min-width: 120px !important;
+    height: 40px !important;
+    font-size: 16px !important;
 }
 
 ._action-handler_vitro-success_1bfGHQQ {
@@ -1492,13 +1493,6 @@
     color: #4A556C;
 }
 
-._dropdown-button_vitro-icon_2NCEoeb {
-    width: 20px;
-    height: 20px;
-    background-size: 20px;
-    margin-right: 12px;
-}
-
 ._dropdown-button_vitro-dropdown-button_1myvkhB .dropdown-menu {
     box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
     background: #fff;
@@ -1533,6 +1527,18 @@
     background-image: url(data:image/svg+xml,%3Csvg viewBox=%270 0 16 11%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M6.31554 1.65838L0.382812 11H15.6249L9.69214 1.65838C8.90651 0.421336 7.10117 0.421335 6.31554 1.65838Z%27 fill=%27white%27/%3E%3C/svg%3E%0A);
 }
 
+._dropdown-button_vitro-dropdown-button_1myvkhB .dropdown-item ._dropdown-button_vitro-icon_2NCEoeb {
+    width: 20px;
+    height: 20px;
+    margin-right: 12px;
+    margin-left: 0;
+}
+
+._dropdown-button_vitro-dropdown-button_1myvkhB .dropdown-item ._dropdown-button_vitro-icon_2NCEoeb img {
+    width: 20px;
+    height: 20px;
+}
+
 ._dropdown-button_vitro-dropdown-button_1myvkhB .dropdown-item {
     display: flex;
     align-items: center;
@@ -4094,6 +4100,7 @@ ul > li:last-child > ul > li:last-child ._sidebar-item_vitro-active_7p5iOhY {
 }
 
 ._dialog-button-close_vitro-button-close_2BpzTR0 {
+    font-family: 'InterRegular' !important;
     background: #fff !important;
     color: #222D44 !important;
     border: none;
@@ -4329,3 +4336,115 @@ ul > li:last-child > ul > li:last-child ._sidebar-item_vitro-active_7p5iOhY {
 ._activity-item_vitro-avatar_218ZqAk {
     margin-right: 4px;
 }
+
+._message-input_vitro-message-input_3MkcjWD {
+    display: flex;
+    align-items: flex-start;
+    border-top: 1px solid #e0e0e0;
+    padding-top: 12px;
+}
+
+._message-input_vitro-message-input_3MkcjWD ._message-input_vitro-control_1PUSjq9 {
+    width: 100%;
+    position: relative;
+    padding: 0;
+    border-radius: 4px;
+    border: 1px solid #C0CAD5;
+    min-height: 40px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0 8px;
+    margin-left: 8px;
+}
+
+._message-input_vitro-control_1PUSjq9 textarea {
+    border: none;
+    resize: none;
+    line-height: 20px;
+    overflow-y: auto;
+    height: 20px;
+    width: 90%;
+}
+
+._message-input_vitro-control_1PUSjq9 span {
+    overflow-y: auto;
+    width: 90%;
+    height: -moz-fit-content;
+    height: fit-content;
+    max-height: 60px;
+}
+
+._message-input_vitro-button-send_1vktQrZ {
+    height: 24px;
+    width: 24px;
+    background-color: #fff;
+    border: none;
+    outline: none;
+    background-size: 100%;
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Layer_1' x='0px' y='0px' viewBox='0 0 20 20' style='enable-background:new 0 0 20 20;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23BDBDBD;stroke-miterlimit:10;%7D%0A%3C/style%3E%3Cpath class='st0' d='M18,10L1.5,8.5l0-5.9L18,10c-5.5,2.5-11,5-16.5,7.5v-6L18,10'/%3E%3C/svg%3E");
+}
+
+._message-input_vitro-button-send_1vktQrZ:hover,
+._message-input_vitro-button-send_1vktQrZ:active {
+    background-color: none;
+    border: none;
+    outline: none;
+}
+
+.vitro-input-upload-file {
+    height: 24px;
+}
+
+.vitro-input-upload-file input {
+    display: none;
+}
+
+.vitro-input-upload-file label {
+    margin-bottom: 0px;
+}
+
+.card-header, textarea.note-codable, .note-statusbar, .note-table-popover.bottom, .note-link-popover.bottom, .note-dropzone {
+    display: none;
+}
+
+.note-editor {
+    width: 100%;
+    border: none !important;
+}
+
+.note-editable {
+    color: #4F4F4F;
+}
+
+.note-editable img {
+    max-width: 200px;
+    display: block;
+}
+
+.note-popover.popover {
+    max-width: 440px;
+    max-height: 150px;
+    overflow-y: auto;
+    border: none;
+    background: #fff;
+    box-shadow: 0 4px 16px rgb(0 0 0 / 10%);
+    border-radius: 8px;
+    margin-bottom: 8px;
+}
+
+.note-popover.popover div.note-hint-group {
+    padding: 8px 0;
+}
+
+.note-hint-item {
+    padding: 4px 8px;
+    font-family: "InterRegular";
+    font-size: 10pt;
+    line-height: 11pt;
+    cursor: pointer;
+}
+
+.note-hint-item:hover {
+    background: #F5F6FA;
+}

package/dist/index.d.ts

@@ -61,6 +61,7 @@ import { ActivityItem, ActivityItemProps } from './controls/ActivityItem/Activit
 import { Icon } from './controls/Icon/Icon';
 import { EVENT } from './constants/Event';
 import { ScrollBar } from './controls/ScrollBar/ScrollBar';
+import { MessageInput } from './controls/MessageInput/MessageInput';
 export { Breadcrumbs };
 export { TopLevelMenu };
 export { TreeView, TreeViewContext, TREE_VIEW };
@@ -96,3 +97,4 @@ export { ActivityItem, ActivityItemProps };
 export { Icon };
 export { EVENT };
 export { ScrollBar };
+export { MessageInput };