@loomhq/lens 11.0.2 → 11.1.0

package/dist/components/notification-bar/notification-bar.d.ts

@@ -5,7 +5,7 @@ declare const NotificationBar: ({ children, onCloseClick, isOpen, severity, id,
 type NotificationBarProps = {
     children?: React.ReactNode;
     isOpen?: boolean;
-    onCloseClick: () => void;
+    onCloseClick?: () => void;
     severity: SeverityLevels;
 };
 type NotificationBarWrapperProps = {

package/dist/components/text-input/text-input.d.ts

@@ -23,5 +23,6 @@ type InputFieldProps = {
     icon?: React.ReactNode;
     hasError?: boolean;
     inputSize?: 'small' | 'medium' | 'large';
+    addOn?: React.ReactNode;
 };
 export default TextInput;

package/dist/index.js

@@ -1879,6 +1879,7 @@ var sizesStyles2 = {
     iconSize: 2,
     padding: u(1.75),
     withIconPadding: u(4.5),
+    passwordAdditionalPadding: u(0.5),
     textSize: "small"
   },
   medium: {
@@ -1887,6 +1888,7 @@ var sizesStyles2 = {
     iconSize: 3,
     padding: "var(--lns-formFieldHorizontalPadding)",
     withIconPadding: u(5.5),
+    passwordAdditionalPadding: u(0.5),
     textSize: "medium"
   },
   large: {
@@ -1895,9 +1897,17 @@ var sizesStyles2 = {
     iconSize: 3,
     padding: "var(--lns-formFieldHorizontalPadding)",
     withIconPadding: u(5.5),
+    passwordAdditionalPadding: u(0.5),
     textSize: "large"
   }
 };
+var inputRightPadding = (props) => {
+  let padding = props.addOn ? sizesStyles2[props.inputSize].withIconPadding : sizesStyles2[props.inputSize].padding;
+  if (props.type === "password") {
+    padding = `calc(${sizesStyles2[props.inputSize].passwordAdditionalPadding} + ${padding})`;
+  }
+  return padding;
+};
 var InputField = styled7.input`
   -webkit-appearance: none;
   font-family: inherit;
@@ -1910,7 +1920,7 @@ var InputField = styled7.input`
   padding-top: 0;
   padding-bottom: 0;
   padding-left: ${(props) => props.icon ? sizesStyles2[props.inputSize].withIconPadding : sizesStyles2[props.inputSize].padding};
-  padding-right: ${(props) => props.icon ? sizesStyles2[props.inputSize].withIconPadding : sizesStyles2[props.inputSize].padding};
+  padding-right: ${(props) => inputRightPadding(props)};
   border-radius: var(--lns-radius-full);
   box-shadow: inset 0 0 0
     ${(props) => props.hasError ? "var(--lns-formFieldBorderWidthFocus) var(--lns-color-danger)" : "var(--lns-formFieldBorderWidth) var(--lns-color-formFieldBorder)"};
@@ -2014,7 +2024,8 @@ var TextInput = forwardRef(
         ref,
         value,
         hasError,
-        inputSize: size
+        inputSize: size,
+        addOn
       }, props)
     );
     return icon || addOn ? /* @__PURE__ */ React9.createElement(InputFieldWrapper, null, icon && /* @__PURE__ */ React9.createElement(IconSection2, { size }, /* @__PURE__ */ React9.createElement(
@@ -4256,7 +4267,7 @@ var NotificationBar = ({
     const keyListener = (e) => {
       if (e.key === "Escape") {
         e.preventDefault();
-        onCloseClick();
+        onCloseClick && onCloseClick();
       }
     };
     window.addEventListener("keydown", keyListener);
@@ -4299,7 +4310,7 @@ var NotificationBar = ({
         children
       )
     )
-  ), /* @__PURE__ */ React34.createElement(
+  ), onCloseClick && /* @__PURE__ */ React34.createElement(
     icon_button_default,
     {
       iconColor: (_c = severityStyles[severity].color) != null ? _c : "var(--lns-color-white)",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loomhq/lens",
-  "version": "11.0.2",
+  "version": "11.1.0",
   "engines": {
     "pnpm": "^8.9.2"
   },