@toptal/picasso-form 6.0.0 → 6.1.0

package/dist-package/src/FormHint/FormHint.d.ts

@@ -4,6 +4,8 @@ import type { BaseProps } from '@toptal/picasso-shared';
 export interface Props extends BaseProps, HTMLAttributes<HTMLDivElement> {
     /** The text of the hint */
     children: ReactNode;
+    /** Whether the FormHint is disabled */
+    disabled?: boolean;
 }
 export declare const FormHint: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
 export default FormHint;

package/dist-package/src/FormHint/FormHint.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormHint.d.ts","sourceRoot":"","sources":["../../../src/FormHint/FormHint.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAqB,MAAM,OAAO,CAAA;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAIvD,MAAM,WAAW,KAAM,SAAQ,SAAS,EAAE,cAAc,CAAC,cAAc,CAAC;IACtE,2BAA2B;IAC3B,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,eAAO,MAAM,QAAQ,8EAgBnB,CAAA;AAMF,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"FormHint.d.ts","sourceRoot":"","sources":["../../../src/FormHint/FormHint.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAqB,MAAM,OAAO,CAAA;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAIvD,MAAM,WAAW,KAAM,SAAQ,SAAS,EAAE,cAAc,CAAC,cAAc,CAAC;IACtE,2BAA2B;IAC3B,QAAQ,EAAE,SAAS,CAAA;IACnB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,eAAO,MAAM,QAAQ,8EAkBnB,CAAA;AAMF,eAAe,QAAQ,CAAA"}

package/dist-package/src/FormHint/FormHint.js

@@ -13,9 +13,9 @@ import React, { forwardRef } from 'react';
 import { Typography } from '@toptal/picasso-typography';
 import { twMerge } from '@toptal/picasso-tailwind-merge';
 export const FormHint = forwardRef(function FormHint(props, ref) {
-    const { children, className, style } = props, rest = __rest(props, ["children", "className", "style"]);
+    const { children, className, style, disabled } = props, rest = __rest(props, ["children", "className", "style", "disabled"]);
     return (React.createElement("div", Object.assign({}, rest, { ref: ref, className: twMerge('mt-1', className), style: style }),
-        React.createElement(Typography, { size: 'xxsmall' }, children)));
+        React.createElement(Typography, { size: 'xxsmall', color: disabled ? 'grey-main-2' : undefined }, children)));
 });
 FormHint.defaultProps = {};
 FormHint.displayName = 'FormHint';

package/dist-package/src/FormHint/FormHint.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormHint.js","sourceRoot":"","sources":["../../../src/FormHint/FormHint.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAOxD,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAwB,SAAS,QAAQ,CACzE,KAAK,EACL,GAAG;IAEH,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,KAAc,KAAK,EAAd,IAAI,UAAK,KAAK,EAA/C,kCAAuC,CAAQ,CAAA;IAErD,OAAO,CACL,6CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,CAAC,MAAM,EAAE,SAAS,CAAC,EACrC,KAAK,EAAE,KAAK;QAEZ,oBAAC,UAAU,IAAC,IAAI,EAAC,SAAS,IAAE,QAAQ,CAAc,CAC9C,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,QAAQ,CAAC,YAAY,GAAG,EAAE,CAAA;AAE1B,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAA;AAEjC,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"FormHint.js","sourceRoot":"","sources":["../../../src/FormHint/FormHint.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AASxD,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAwB,SAAS,QAAQ,CACzE,KAAK,EACL,GAAG;IAEH,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,KAAc,KAAK,EAAd,IAAI,UAAK,KAAK,EAAzD,8CAAiD,CAAQ,CAAA;IAE/D,OAAO,CACL,6CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,CAAC,MAAM,EAAE,SAAS,CAAC,EACrC,KAAK,EAAE,KAAK;QAEZ,oBAAC,UAAU,IAAC,IAAI,EAAC,SAAS,EAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,IACnE,QAAQ,CACE,CACT,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,QAAQ,CAAC,YAAY,GAAG,EAAE,CAAA;AAE1B,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAA;AAEjC,eAAe,QAAQ,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toptal/picasso-form",
-  "version": "6.0.0",
+  "version": "6.1.0",
   "description": "Toptal UI components library - Form",
   "publishConfig": {
     "access": "public"
@@ -23,7 +23,7 @@
   "homepage": "https://github.com/toptal/picasso/tree/master/packages/picasso#readme",
   "dependencies": {
     "@toptal/picasso-collapse": "3.0.1",
-    "@toptal/picasso-container": "3.0.1",
+    "@toptal/picasso-container": "3.1.0",
     "@toptal/picasso-grid": "5.0.1",
     "@toptal/picasso-icons": "1.6.1",
     "@toptal/picasso-shared": "15.0.0",

package/src/FormHint/FormHint.tsx

@@ -7,13 +7,15 @@ import { twMerge } from '@toptal/picasso-tailwind-merge'
 export interface Props extends BaseProps, HTMLAttributes<HTMLDivElement> {
   /** The text of the hint */
   children: ReactNode
+  /** Whether the FormHint is disabled */
+  disabled?: boolean
 }
 
 export const FormHint = forwardRef<HTMLDivElement, Props>(function FormHint(
   props,
   ref
 ) {
-  const { children, className, style, ...rest } = props
+  const { children, className, style, disabled, ...rest } = props
 
   return (
     <div
@@ -22,7 +24,9 @@ export const FormHint = forwardRef<HTMLDivElement, Props>(function FormHint(
       className={twMerge('mt-1', className)}
       style={style}
     >
-      <Typography size='xxsmall'>{children}</Typography>
+      <Typography size='xxsmall' color={disabled ? 'grey-main-2' : undefined}>
+        {children}
+      </Typography>
     </div>
   )
 })