@clerk/types - npm Package Compare versions

Comparing version 3.0.0-next.5 to 3.0.0-next.6

dist/appearance.d.ts

@@ -24,2 +24,8 @@ import * as CSS from 'csstype';
 declare type FontSmoothing = 'auto' | 'antialiased' | 'never';
+declare type FontWeight = 400 | 500 | 600;
+declare type FontWeightScale = {
+    normal?: FontWeight;
+    medium?: FontWeight;
+    bold?: FontWeight;
+};
 declare type WebSafeFont = 'Arial' | 'Brush Script MT' | 'Courier New' | 'Garamond' | 'Georgia' | 'Helvetica' | 'Tahoma' | 'Times New Roman' | 'Trebuchet MS' | 'Verdana';
@@ -100,3 +106,5 @@ export declare type FontFamily = string | WebSafeFont;
     'socialButtons-logo': WithOptions<OAuthProvider | Web3Provider, LoadingState | DisabledState, never>;
-    divider: WithOptions<never, never, never>;
+    dividerBox: WithOptions<never, never, never>;
+    dividerText: WithOptions<never, never, never>;
+    dividerLine: WithOptions<never, never, never>;
     form: WithOptions<never, ErrorState, never>;
@@ -204,4 +212,4 @@ 'form-fieldRow': WithOptions<never, never, never>;
      * This can be the name of a custom font loaded by your code or the name of a web-safe font ((@link WebSafeFont})
-     * If a specific fontFamily is not provided, the components will automatically preconnect, preload, load and inject the "Inter" Google font.
-     * @default Inter
+     * If a specific fontFamily is not provided, the components will inherit the font of the parent element.
+     * @default inherit
      * @example
@@ -214,3 +222,3 @@ * { fontFamily: 'Montserrat' }
      * If not provided, {@link Variables.fontFamily} will be used instead.
-     * @default Inter
+     * @default inherit
      */
@@ -230,2 +238,8 @@ fontFamilyButtons?: FontFamily;
     /**
+     * The font weight the components will use. By default, the components will use the 400, 500 and 600 weights for normal, medium and bold
+     * text respectively. You can override the default weights by passing a {@FontWeightScale} object
+     * @default { normal: 400, medium: 500, bold: 600 };
+     */
+    fontWeight?: FontWeightScale;
+    /**
      * The size that will be used as the `md` base borderRadius value. This is used as the base to calculate the `lg`, `xl`, `2xl`
@@ -303,5 +317,5 @@ * our components use. As a general rule, the bigger an element is, the larger its borderRadius is going to be.
     /**
-     * Controls whether the logo will be rendered inside or outside the component card.
-     * To customise the logo further, you can use {@link Appearance.elements}
-     * @default inside
+     * Controls whether the social buttons will be rendered above or below the card form.
+     * To customise the social button container further, you can use {@link Appearance.elements}
+     * @default 'top'
      */
@@ -308,0 +322,0 @@ socialButtonsPlacement?: 'top' | 'bottom';

package.json

 {
   "name": "@clerk/types",
-  "version": "3.0.0-next.5",
+  "version": "3.0.0-next.6",
   "license": "MIT",
@@ -48,3 +48,3 @@ "description": "Typings for Clerk libraries.",
   },
-  "gitHead": "658511834393bda947f390e017bab200ac902bc7"
+  "gitHead": "6164f7ff9e623a2c6e6b0ccce2a0f2359bdeefc2"
 }

src/appearance.ts

@@ -23,2 +23,4 @@ import * as CSS from 'csstype';
 type FontSmoothing = 'auto' | 'antialiased' | 'never';
+type FontWeight = 400 | 500 | 600;
+type FontWeightScale = { normal?: FontWeight; medium?: FontWeight; bold?: FontWeight };
 
@@ -151,3 +153,5 @@ type WebSafeFont =
 
-  divider: WithOptions<never, never, never>;
+  dividerBox: WithOptions<never, never, never>;
+  dividerText: WithOptions<never, never, never>;
+  dividerLine: WithOptions<never, never, never>;
 
@@ -271,4 +275,4 @@ form: WithOptions<never, ErrorState, never>;
    * This can be the name of a custom font loaded by your code or the name of a web-safe font ((@link WebSafeFont})
-   * If a specific fontFamily is not provided, the components will automatically preconnect, preload, load and inject the "Inter" Google font.
-   * @default Inter
+   * If a specific fontFamily is not provided, the components will inherit the font of the parent element.
+   * @default inherit
    * @example
@@ -281,3 +285,3 @@ * { fontFamily: 'Montserrat' }
    * If not provided, {@link Variables.fontFamily} will be used instead.
-   * @default Inter
+   * @default inherit
    */
@@ -297,2 +301,8 @@ fontFamilyButtons?: FontFamily;
   /**
+   * The font weight the components will use. By default, the components will use the 400, 500 and 600 weights for normal, medium and bold
+   * text respectively. You can override the default weights by passing a {@FontWeightScale} object
+   * @default { normal: 400, medium: 500, bold: 600 };
+   */
+  fontWeight?: FontWeightScale;
+  /**
    * The size that will be used as the `md` base borderRadius value. This is used as the base to calculate the `lg`, `xl`, `2xl`
@@ -371,5 +381,5 @@ * our components use. As a general rule, the bigger an element is, the larger its borderRadius is going to be.
   /**
-   * Controls whether the logo will be rendered inside or outside the component card.
-   * To customise the logo further, you can use {@link Appearance.elements}
-   * @default inside
+   * Controls whether the social buttons will be rendered above or below the card form.
+   * To customise the social button container further, you can use {@link Appearance.elements}
+   * @default 'top'
    */
@@ -421,2 +431,7 @@ socialButtonsPlacement?: 'top' | 'bottom';
     fontSmoothing: 'auto',
+    // fontWeight: {
+    //   normal: '',
+    //   medium: '',
+    //   bold: '',
+    // },
   },
@@ -423,0 +438,0 @@ elements: {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

251141

increased by0.63%

Lines of code

4813

increased by0.61%

No dependency changes