@app-studio/web 0.9.73 → 0.9.76

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -19,9 +19,6 @@ export declare const LineHeights: Record<TitleSize, number>;
19
19
  * Based on the Typography system with dynamic breakpoint sizing
20
20
  */
21
21
  export declare const ResponsiveTypography: Record<TitleSize, {
22
- fontWeight: number;
23
- marginBottom?: number;
24
- letterSpacing?: number;
25
22
  media: {
26
23
  mobile: {
27
24
  fontSize: number;
@@ -17055,90 +17055,6 @@ var TitleSizes = {
17055
17055
  lg: 64,
17056
17056
  xl: 72
17057
17057
  };
17058
- /**
17059
- * Responsive typography system that maps title sizes to responsive breakpoints
17060
- * Based on the Typography system with dynamic breakpoint sizing
17061
- */
17062
- var ResponsiveTypography = {
17063
- // xl maps to H1 - Largest heading
17064
- xl: {
17065
- fontWeight: 500,
17066
- letterSpacing: 1.25,
17067
- media: {
17068
- mobile: {
17069
- fontSize: 60
17070
- },
17071
- tablet: {
17072
- fontSize: 60
17073
- },
17074
- desktop: {
17075
- fontSize: 96
17076
- }
17077
- }
17078
- },
17079
- // lg maps to H2 - Large heading
17080
- lg: {
17081
- fontWeight: 500,
17082
- media: {
17083
- mobile: {
17084
- fontSize: 48
17085
- },
17086
- tablet: {
17087
- fontSize: 48
17088
- },
17089
- desktop: {
17090
- fontSize: 70
17091
- }
17092
- }
17093
- },
17094
- // md maps to H3 - Medium heading
17095
- md: {
17096
- fontWeight: 500,
17097
- media: {
17098
- mobile: {
17099
- fontSize: 32
17100
- },
17101
- tablet: {
17102
- fontSize: 40
17103
- },
17104
- desktop: {
17105
- fontSize: 56
17106
- }
17107
- }
17108
- },
17109
- // sm maps to T1 - Title text
17110
- sm: {
17111
- fontWeight: 400,
17112
- letterSpacing: -0.2,
17113
- media: {
17114
- mobile: {
17115
- fontSize: 20
17116
- },
17117
- tablet: {
17118
- fontSize: 24
17119
- },
17120
- desktop: {
17121
- fontSize: 32
17122
- }
17123
- }
17124
- },
17125
- // xs maps to S1 - Subtitle text
17126
- xs: {
17127
- fontWeight: 400,
17128
- letterSpacing: -0.2,
17129
- media: {
17130
- mobile: {
17131
- fontSize: 14
17132
- },
17133
- tablet: {
17134
- fontSize: 18
17135
- },
17136
- desktop: {
17137
- fontSize: 20
17138
- }
17139
- }
17140
- }
17141
- };
17142
17058
  /**
17143
17059
  * Default styles for different highlight types
17144
17060
  */
@@ -17361,7 +17277,8 @@ var SlideEffect = _ref => {
17361
17277
  position: 'relative',
17362
17278
  overflow: 'hidden',
17363
17279
  verticalAlign: 'bottom',
17364
- whiteSpace: 'nowrap'
17280
+ whiteSpace: 'nowrap',
17281
+ lineHeight: 'normal'
17365
17282
  }, textStyle), [textStyle]);
17366
17283
  // Word row container style
17367
17284
  var wordRowStyle = React.useMemo(() => ({
@@ -17438,7 +17355,7 @@ var SlideEffect = _ref => {
17438
17355
  })));
17439
17356
  };
17440
17357
 
17441
- var _excluded$$ = ["children", "highlightText", "highlightStyle", "highlightColor", "highlightSecondaryColor", "size", "responsive", "views", "highlightAnimate", "animate", "animationLoop", "highlightAnimationLoop", "highlightTypewriter", "highlightTypewriterDuration", "highlightSlide", "highlightSlideDuration", "highlightSlideStagger", "highlightSlideSequential", "themeMode", "textComponent"];
17358
+ var _excluded$$ = ["children", "highlightText", "highlightStyle", "highlightColor", "highlightSecondaryColor", "size", "views", "highlightAnimate", "animate", "animationLoop", "highlightAnimationLoop", "highlightTypewriter", "highlightTypewriterDuration", "highlightSlide", "highlightSlideDuration", "highlightSlideStagger", "highlightSlideSequential", "themeMode", "textComponent"];
17442
17359
  function escapeRegExp(string) {
17443
17360
  return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
17444
17361
  }
@@ -17450,7 +17367,6 @@ var TitleView = _ref => {
17450
17367
  highlightColor = 'theme.primary',
17451
17368
  highlightSecondaryColor,
17452
17369
  size = 'lg',
17453
- responsive = true,
17454
17370
  views,
17455
17371
  highlightAnimate,
17456
17372
  animate,
@@ -17518,10 +17434,7 @@ var TitleView = _ref => {
17518
17434
  highlightSlideSequential
17519
17435
  }, props));
17520
17436
  var TextComponent = textComponent || appStudio.Text;
17521
- // Common style calculations
17522
- var useResponsive = responsive && !props.media;
17523
17437
  var fontSize = TitleSizes[size];
17524
- var responsiveStyles = useResponsive ? ResponsiveTypography[size] : null;
17525
17438
  // Highlight style props
17526
17439
  var highlightProps = HighlightStyles[highlightStyle](resolvedHighlightColor, resolvedHighlightSecondaryColor);
17527
17440
  // Apply loop control to animations
@@ -17546,10 +17459,7 @@ var TitleView = _ref => {
17546
17459
  animate: inView ? controlledAnimate : undefined
17547
17460
  }, !textComponent && {
17548
17461
  as: 'h1',
17549
- fontSize: useResponsive ? undefined : fontSize,
17550
- fontWeight: useResponsive ? responsiveStyles == null ? void 0 : responsiveStyles.fontWeight : 'bold',
17551
- letterSpacing: useResponsive ? responsiveStyles == null ? void 0 : responsiveStyles.letterSpacing : undefined,
17552
- media: useResponsive ? responsiveStyles == null ? void 0 : responsiveStyles.media : undefined
17462
+ fontSize
17553
17463
  });
17554
17464
  // Render highlighted text content (typewriter, slide, or plain)
17555
17465
  var renderHighlightedContent = content => {
@@ -17577,8 +17487,7 @@ var TitleView = _ref => {
17577
17487
  stagger: stateHighlightSlideStagger,
17578
17488
  sequential: stateHighlightSlideSequential,
17579
17489
  direction: "up",
17580
- fontSize: useResponsive ? undefined : fontSize,
17581
- fontWeight: useResponsive ? responsiveStyles == null ? void 0 : responsiveStyles.fontWeight : 'bold',
17490
+ fontSize: fontSize,
17582
17491
  wordProps: highlightProps,
17583
17492
  textComponent: TextComponent
17584
17493
  });
@@ -17601,7 +17510,7 @@ var TitleView = _ref => {
17601
17510
  }
17602
17511
  if (lastIndex < text.length) parts.push(text.substring(lastIndex));
17603
17512
  return /*#__PURE__*/React__default.createElement(appStudio.Element, Object.assign({
17604
- fontSize: useResponsive ? undefined : fontSize
17513
+ fontSize: fontSize
17605
17514
  }, containerProps, views == null ? void 0 : views.container, props), parts.map((part, idx) => typeof part === 'string' ? (/*#__PURE__*/React__default.createElement(TextComponent, {
17606
17515
  key: "text-" + idx,
17607
17516
  as: "span",