@hexure/ui 1.13.48 → 1.13.50

package/dist/cjs/index.js

@@ -1368,9 +1368,30 @@ const Validation = styled.div `
   color: ${Colors.RED.Hex};
   margin: 4px 0 0 0;
   box-sizing: border-box;
+  min-height: 19px;
 `;
+const ValidationNew = styled.span `
+  font-size: ${FontSizes.SMALL};
+  font-weight: 400;
+  line-height: 1.3em;
+  font-family: ${FontStyles.DEFAULT};
+  color: ${Colors.BLACK.Hex};
+  box-sizing: border-box;
+  align-items: center;
+  display: flex;
+`;
+const ValidationInnerIcon = styled.span `
+  padding-right: 5px;
+  display: flex;
+`;
+const ValidationInnerMessage = styled.span ``;
+const MessageWrapper = message => (React.createElement(ValidationNew, null,
+    React.createElement(ValidationInnerIcon, null,
+        React.createElement(Icon, { path: js.mdiAlertCircle, size: '17px' })),
+    ' ',
+    React.createElement(ValidationInnerMessage, null, message)));
 const Field = (_a) => {
-    var { action, children, validationText, label, description, required, htmlFor, style = {}, tooltip, dataItemid } = _a, accessibleProps = __rest(_a, ["action", "children", "validationText", "label", "description", "required", "htmlFor", "style", "tooltip", "dataItemid"]);
+    var { action, children, validationText, label, description, required, htmlFor, style = {}, tooltip, dataItemid, isNewMessageType } = _a, accessibleProps = __rest(_a, ["action", "children", "validationText", "label", "description", "required", "htmlFor", "style", "tooltip", "dataItemid", "isNewMessageType"]);
     const baseId = dataItemid || 'field';
     return (React.createElement(Wrapper$9, Object.assign({ "$customStyle": style }, accessibleProps, { "data-itemid": `${baseId}-wrapper` }),
         React.createElement(LabelRow, { "data-itemid": `${baseId}-label-row` },
@@ -1381,7 +1402,9 @@ const Field = (_a) => {
             action ? (React.createElement(Action, { "data-itemid": `${baseId}-action`, onClick: action.onClick }, action.label)) : null),
         description ? (React.createElement(Description, { "data-itemid": `${baseId}-description` }, description)) : null,
         React.createElement("div", { "data-itemid": `${baseId}-children` }, children),
-        React.createElement(Validation, { className: 'field-validation-wrapper', "data-itemid": `${baseId}-validation`, title: validationText }, validationText ? validationText : '\u00A0')));
+        React.createElement(Validation, { className: 'field-validation-wrapper', "data-itemid": `${baseId}-validation`, title: validationText }, validationText && isNewMessageType
+            ? MessageWrapper(validationText)
+            : validationText || '\u00A0')));
 };
 
 const Wrapper$8 = styled.fieldset `
@@ -2358,7 +2381,7 @@ const Wrapper$3 = styled.nav `
   column-gap: 10px;
 `;
 const Pagination = (_a) => {
-    var { currentPage = 1, onClick, pageCount = 0, dataItemid } = _a, accessibleProps = __rest(_a, ["currentPage", "onClick", "pageCount", "dataItemid"]);
+    var { currentPage = 1, onClick, pageCount = 0, dataItemid, type = null } = _a, accessibleProps = __rest(_a, ["currentPage", "onClick", "pageCount", "dataItemid", "type"]);
     const is_first_page = currentPage === 1;
     const is_last_page = currentPage === pageCount;
     const handlePrevClick = () => {
@@ -2379,12 +2402,12 @@ const Pagination = (_a) => {
     };
     const baseId = dataItemid || 'pagination';
     return (React.createElement(Wrapper$3, Object.assign({}, accessibleProps, { "data-itemid": `${baseId}-wrapper` }),
-        React.createElement(Button, { "data-itemid": `${baseId}-prev-button`, disabled: is_first_page, icon: js.mdiChevronLeft, onClick: handlePrevClick, small: true }),
+        React.createElement(Button, { "data-itemid": `${baseId}-prev-button`, disabled: is_first_page, icon: js.mdiChevronLeft, onClick: handlePrevClick, small: true, type: type }),
         React.createElement(Select, { "data-itemid": `${baseId}-select`, onChange: handlePageChange, options: Array.from(Array(pageCount).keys(), p => p + 1).map(p => ({
                 label: `Page ${p}`,
                 value: `${p}`,
             })), value: `${currentPage}` }),
-        React.createElement(Button, { "data-itemid": `${baseId}-next-button`, disabled: is_last_page, icon: js.mdiChevronRight, onClick: handleNextClick, small: true })));
+        React.createElement(Button, { "data-itemid": `${baseId}-next-button`, disabled: is_last_page, icon: js.mdiChevronRight, onClick: handleNextClick, small: true, type: type })));
 };
 
 const Wrapper$2 = styled.label `