@moving-walls/design-system 1.0.3 → 1.0.4

package/dist/components/ui/Typography.d.ts

@@ -7,10 +7,11 @@ export interface DisplayProps extends React.HTMLAttributes<HTMLHeadingElement> {
 export declare function Display({ size, children, className, ...props }: DisplayProps): import("react/jsx-runtime").JSX.Element;
 export interface HeadingProps extends React.HTMLAttributes<HTMLHeadingElement> {
     level?: 1 | 2 | 3 | 4 | 5 | 6;
+    weight?: 'normal' | 'medium' | 'semibold' | 'bold';
     children: React.ReactNode;
     className?: string;
 }
-export declare function Heading({ level, children, className, ...props }: HeadingProps): import("react/jsx-runtime").JSX.Element;
+export declare function Heading({ level, weight, children, className, ...props }: HeadingProps): import("react/jsx-runtime").JSX.Element;
 type TextBaseProps = {
     size?: '2xs' | 'xs' | 'sm' | 'base' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl';
     variant?: 'primary' | 'secondary' | 'muted' | 'error' | 'success' | 'info' | 'warning';

package/dist/index.esm.js

@@ -43987,27 +43987,44 @@ function Display(_a) {
 function Heading(_a) {
   var _a$level = _a.level,
     level = _a$level === void 0 ? 1 : _a$level,
+    weight = _a.weight,
     children = _a.children,
     className = _a.className,
-    props = __rest$1(_a, ["level", "children", "className"]);
+    props = __rest$1(_a, ["level", "weight", "children", "className"]);
   var Tag = "h".concat(level);
   var sizeClasses = {
-    1: 'text-4xl font-semibold leading-[3.5rem] text-mw-neutral-900 dark:text-white',
+    1: 'text-4xl leading-[3.5rem] text-mw-neutral-900 dark:text-white',
     // 40px / 56px
-    2: 'text-3xl font-semibold leading-[3rem] text-mw-neutral-900 dark:text-white',
+    2: 'text-3xl leading-[3rem] text-mw-neutral-900 dark:text-white',
     // 32px / 48px
-    3: 'text-2xl font-semibold leading-[2.5rem] text-mw-neutral-900 dark:text-white',
+    3: 'text-2xl leading-[2.5rem] text-mw-neutral-900 dark:text-white',
     // 24px / 40px
     // H4: Page titles - 20px font, 600 weight, 32px line-height (Figma: Creatives title)
-    4: 'text-xl font-semibold leading-[2rem] text-mw-neutral-900 dark:text-white',
+    4: 'text-xl leading-[2rem] text-mw-neutral-900 dark:text-white',
     // 20px / 32px
-    5: 'text-lg font-semibold leading-[1.5rem] text-mw-neutral-900 dark:text-white',
+    5: 'text-lg leading-[1.5rem] text-mw-neutral-900 dark:text-white',
     // 18px / 24px
     // H6: Section headings - 16px font, 500 weight, 20px line-height (Figma: Folders/Recently Activity)
-    6: 'text-base font-medium leading-[1.25rem] text-mw-neutral-900 dark:text-white' // 16px / 20px
+    6: 'text-base leading-[1.25rem] text-mw-neutral-900 dark:text-white' // 16px / 20px
   };
+  var weightClasses = {
+    normal: 'font-normal',
+    medium: 'font-medium',
+    semibold: 'font-semibold',
+    bold: 'font-bold'
+  };
+  // Default weights based on level
+  var defaultWeights = {
+    1: 'semibold',
+    2: 'semibold',
+    3: 'semibold',
+    4: 'semibold',
+    5: 'semibold',
+    6: 'medium'
+  };
+  var finalWeight = weight || defaultWeights[level];
   return jsx(Tag, Object.assign({
-    className: clsx(sizeClasses[level], className)
+    className: clsx(sizeClasses[level], weightClasses[finalWeight], className)
   }, props, {
     children: children
   }));