@loomhq/lens 11.18.0 → 11.20.0

package/dist/components/textarea/textarea.d.ts

@@ -10,5 +10,6 @@ type TextareaProps = {
     onChange?: React.ReactEventHandler;
     size?: 'small' | 'medium';
     resize?: 'none' | 'both' | 'horizontal' | 'vertical';
+    error?: string;
 };
 export default Textarea;

package/dist/css-variables/index.d.ts

@@ -7,6 +7,7 @@ export declare const radiusVariables: VarsObject;
 export declare const shadowVariables: VarsObject;
 export declare const spaceVariables: VarsObject;
 export declare const formFieldVariables: VarsObject;
+export declare const gradientVariables: VarsObject;
 export declare const getSizingVariablesCssVarsObject: () => VarsObject;
 export declare const getVariablesCssVarsObject: () => VarsObject;
 export declare const getColorsCssVarsObject: () => VarsObject;

package/dist/index.js

@@ -484,6 +484,10 @@ var breakpoints = {
   medium: "64em",
   large: "75em"
 };
+var gradients = {
+  "ai-primary": "radial-gradient(134.96% 884.49% at 119.29% 112.58%, #DC43BE 0%, #565ADD 70%)",
+  "ai-secondary": "radial-gradient(100% 138.41% at 100% 100%, #EFF0FF 0%, #FFFFFF 100%)"
+};
 
 // src/components/text/text.tsx
 import React2 from "react";
@@ -1213,6 +1217,10 @@ var formFieldVariables = getCssVarsFromObject(void 0, {
   formFieldBorderShadowFocus: `
     inset 0 0 0 var(--lns-formFieldBorderWidthFocus) var(--lns-color-blurple),
     0 0 0 var(--lns-formFieldBorderWidthFocus) var(--lns-color-focusRing)
+  `,
+  formFieldBorderShadowError: `
+    inset 0 0 0 var(--lns-formFieldBorderWidthFocus) var(--lns-color-danger),
+    0 0 0 var(--lns-formFieldBorderWidthFocus) var(--lns-color-orangeLight)
   `
 });
 var colorVariables = getCssVarsFromObject("color", getColorsObject());
@@ -1220,6 +1228,7 @@ var themeColorVariables = getCssVarsFromObject(
   void 0,
   getThemeColorsObject()
 );
+var gradientVariables = getCssVarsFromObject("gradient", gradients);
 var sizingVariables = [
   unitVariables,
   textSizeVariables,
@@ -1235,7 +1244,7 @@ var getVariablesCssVarsObject = () => {
   return Object.assign({}, fontWeightVariables, ...sizingVariables);
 };
 var getColorsCssVarsObject = () => {
-  return __spreadValues(__spreadValues({}, colorVariables), themeColorVariables);
+  return __spreadValues(__spreadValues(__spreadValues({}, colorVariables), themeColorVariables), gradientVariables);
 };
 var assignLightThemeColors = () => {
   return Object.keys(themeColors.light).map(
@@ -3899,18 +3908,19 @@ var TextareaWrapper = styled22.textarea`
   padding: ${(props) => sizesStyles3[props.size].padding};
   ${getRadius("large")};
   box-shadow: inset 0 0 0 var(--lns-formFieldBorderWidth)
-    var(--lns-color-formFieldBorder);
+    ${(props) => props.error ? "var(--lns-color-danger)" : "var(--lns-color-formFieldBorder)"};
   ${(props) => getTextSize(sizesStyles3[props.size].textSize)};
   resize: ${(props) => props.resize};
 
   &:hover {
     box-shadow: inset 0 0 0 var(--lns-formFieldBorderWidthFocus)
-      var(--lns-color-blurple);
+      ${(props) => props.error ? "var(--lns-color-danger)" : "var(--lns-color-blurple)"};
   }
 
   &:focus {
-    outline: 1px solid transparent;
-    box-shadow: var(--lns-formFieldBorderShadowFocus);
+    outline: 1px solid
+      ${(props) => props.error ? "var(--lns-color-orangeLight)" : "transparent"};
+    box-shadow: ${(props) => props.error != "" ? "var(--lns-formFieldBorderShadowError)" : "var(--lns-formFieldBorderShadowFocus)"};
   }
 
   &:disabled {
@@ -3936,7 +3946,8 @@ var Textarea = React28.forwardRef(
       isDisabled,
       placeholder,
       size = "medium",
-      resize = "both"
+      resize = "both",
+      error = void 0
     } = _b, props = __objRest(_b, [
       "onChange",
       "value",
@@ -3944,9 +3955,10 @@ var Textarea = React28.forwardRef(
       "isDisabled",
       "placeholder",
       "size",
-      "resize"
+      "resize",
+      "error"
     ]);
-    return /* @__PURE__ */ React28.createElement(
+    return /* @__PURE__ */ React28.createElement(React28.Fragment, null, /* @__PURE__ */ React28.createElement(
       TextareaWrapper,
       __spreadValues({
         disabled: isDisabled,
@@ -3956,9 +3968,10 @@ var Textarea = React28.forwardRef(
         rows,
         value,
         size,
-        resize
+        resize,
+        error
       }, props)
-    );
+    ), error ? /* @__PURE__ */ React28.createElement(React28.Fragment, null, /* @__PURE__ */ React28.createElement(spacer_default, { bottom: "xmsall" }), /* @__PURE__ */ React28.createElement(text_default, { color: "danger", fontWeight: "book", size: "body-md" }, error)) : null);
   }
 );
 var textarea_default = Textarea;
@@ -7550,6 +7563,8 @@ export {
   getThemeStyles,
   getThemeStylesString,
   getVariablesCssVarsObject,
+  gradientVariables,
+  gradients,
   growRules,
   heightRules,
   hslaBaseColors,

package/dist/variables.d.ts

@@ -88,3 +88,7 @@ export namespace breakpoints {
     const large_3: string;
     export { large_3 as large };
 }
+export const gradients: {
+    'ai-primary': string;
+    'ai-secondary': string;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loomhq/lens",
-  "version": "11.18.0",
+  "version": "11.20.0",
   "packageManager": "pnpm@8.9.2",
   "scripts": {
     "preinstall": "npx only-allow pnpm",