@razorpay/blade 12.95.4 → 12.96.0

package/build/lib/web/production/components/GenUI/GenUISchemaRenderer.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"GenUISchemaRenderer.web.js","sources":["../../../../../../src/components/GenUI/GenUISchemaRenderer.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport React, { memo, useState, useEffect, useRef, useCallback } from 'react';\nimport styled, { createGlobalStyle, keyframes } from 'styled-components';\nimport type { GenUIComponent } from './GenUIComponents';\nimport { useGenUI, GenUIContext } from './GenUIContext';\nimport type { AnimateOptions } from './rehypeAnimate';\nimport { useResize } from '~utils/useResize';\n\n/**\n * Block-level component types that should have the animated gradient border effect\n */\nconst BLOCK_LEVEL_COMPONENTS = new Set(['CARD', 'TABLE']);\n\n/**\n * Global styles for @property rules needed for CSS animation of custom properties\n * Note: @property is required to animate CSS custom properties (interpolation)\n */\nconst GlobalAnimationStyles = createGlobalStyle`\n  @property --travel-x {\n    syntax: '<length>';\n    inherits: false;\n    initial-value: 0px;\n  }\n  @property --travel-r {\n    syntax: '<angle>';\n    inherits: false;\n    initial-value: 0deg;\n  }\n  @property --travel-x2 {\n    syntax: '<length>';\n    inherits: false;\n    initial-value: 0px;\n  }\n  @property --travel-r2 {\n    syntax: '<angle>';\n    inherits: false;\n    initial-value: 0deg;\n  }\n`;\n\n/**\n * Static keyframes using CSS variables for positions.\n * Values are passed via inline style: --x-start, --x-end\n * Using ~70% for edge traversal, ~30% for corner sweep (good for typical card aspect ratios)\n */\nconst travelX = keyframes`\n  0% { --travel-x: var(--x-start); }\n  70% { --travel-x: var(--x-end); }\n  100% { --travel-x: var(--x-end); }\n`;\n\nconst travelR = keyframes`\n  0% { --travel-r: 0deg; }\n  70% { --travel-r: 0deg; }\n  100% { --travel-r: 180deg; }\n`;\n\nconst travelX2 = keyframes`\n  0% { --travel-x2: var(--x-start); }\n  30% { --travel-x2: var(--x-start); }\n  100% { --travel-x2: var(--x-end); }\n`;\n\nconst travelR2 = keyframes`\n  0% { --travel-r2: 0deg; }\n  30% { --travel-r2: -180deg; }\n  100% { --travel-r2: -180deg; }\n`;\n\n/** Mask reveal animation - diagonal swipe from top-left to bottom-right */\nconst maskReveal = keyframes`\n  0% {\n    mask-position: 100% 100%;\n    opacity: 0;\n  }\n  100% {\n    mask-position: 0% 0%;\n    opacity: 1;\n  }\n`;\n\n/** Gradient shade movement - left to right, fades out at end */\nconst shadeMove = keyframes`\n  0% {\n    background-position: 0% 50%;\n    opacity: 1;\n  }\n  70% {\n    opacity: 1;\n  }\n  100% {\n    background-position: 100% 50%;\n    opacity: 0;\n  }\n`;\n\n/** Container for the animated border effect — owns the vertical margin to keep the ring flush */\nconst AnimatedBorderContainer = styled.div<{ $showContent?: boolean }>`\n  position: relative;\n  width: 100%;\n  border-radius: 12px;\n  margin: 12px 0;\n`;\n\n/**\n * The animated gradient border layer - light travels along the border edges.\n * Uses conic-gradient positioned at (--travel-x, 50%) with rotation --travel-r.\n * The animation moves the gradient center along the horizontal axis while\n * rotating it at the corners to create the illusion of perimeter traversal.\n */\nconst GradientBorder = styled.div<{ $fadeOut?: boolean }>`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  border-radius: 12px;\n  background: conic-gradient(\n      from calc(var(--travel-r) - 50deg) at var(--travel-x) 50%,\n      transparent 0%,\n      hsl(180 85% 65%) 3%,\n      hsl(145 75% 45%) 5%,\n      hsl(145 85% 70%) 7%,\n      transparent 30%,\n      transparent 100%\n    ),\n    conic-gradient(\n      from calc(var(--travel-r2) - 50deg) at var(--travel-x2) 50%,\n      transparent 0%,\n      hsl(180 85% 65%) 3%,\n      hsl(145 75% 45%) 5%,\n      hsl(145 85% 70%) 7%,\n      transparent 30%,\n      transparent 100%\n    );\n  animation: ${travelX} 1s linear infinite, ${travelR} 1s linear infinite,\n    ${travelX2} 1s linear infinite, ${travelR2} 1s linear infinite;\n  pointer-events: none;\n  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);\n  mask-composite: exclude;\n  padding: 1.5px;\n  opacity: ${({ $fadeOut }) => ($fadeOut ? 0 : 1)};\n  transition: opacity 3s ease-out;\n`;\n\n/** Content container with mask reveal animation */\nconst ContentContainer = styled.div`\n  position: relative;\n  width: 100%;\n  height: 100%;\n  /* Diagonal gradient mask for reveal effect - starts hidden, animates to revealed */\n  mask-image: linear-gradient(135deg, black 0%, black 45%, transparent 55%);\n  mask-size: 300% 300%;\n  /* Start position: fully masked (hidden) */\n  mask-position: 100% 100%;\n  /* Animate to 0% 0% (fully revealed) with ease-out for smooth finish */\n  animation: ${maskReveal} 2s ease-out forwards;\n  animation-delay: 0.6s;\n`;\n\n/** Green linear gradient shade overlay */\nconst GradientShade = styled.div`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  border-radius: 12px;\n  pointer-events: none;\n  z-index: 5;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    hsl(145 85% 50% / 0.15) 30%,\n    hsl(155 85% 45% / 0.25) 50%,\n    hsl(145 85% 50% / 0.15) 70%,\n    transparent 100%\n  );\n  background-size: 50% 100%;\n  background-repeat: no-repeat;\n  background-position: 0% 50%;\n  animation: ${shadeMove} 1.5s ease-out forwards;\n  animation-delay: 0.3s;\n`;\n\n/**\n * Animated gradient border wrapper for block-level components.\n * Uses CSS variables for dynamic position values with static keyframes (best perf).\n * No dynamic style injection - just pass --x-start and --x-end via inline style.\n */\nconst AnimatedGradientBorder: React.FC<{\n  children: React.ReactNode;\n  onAnimationComplete?: () => void;\n}> = ({ children, onAnimationComplete }) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [showContent, setShowContent] = useState(false);\n  // Initial default values to prevent animation from breaking before ResizeObserver fires\n  const [cssVars, setCssVars] = useState<React.CSSProperties>({\n    '--x-start': '50px',\n    '--x-end': '500px',\n  } as React.CSSProperties);\n\n  useEffect(() => {\n    // Trigger border fade-out after mask reveal completes (0.6s delay + 1s animation)\n    const timer = setTimeout(() => {\n      setShowContent(true);\n      onAnimationComplete?.();\n    }, 1000);\n    return () => clearTimeout(timer);\n  }, [onAnimationComplete]);\n\n  // Measure container and compute CSS variable values for animation positions.\n  // Ring now spans the full container (top: 0, bottom: 0), so rect.height is the ring height.\n  const computePositions = useCallback((entry: ResizeObserverEntry) => {\n    const { width: w, height } = entry.contentRect;\n    const h = height;\n    if (w <= 0 || h <= 0) return;\n\n    const xMargin = Math.min(h * 0.5, w * 0.1);\n    const xMax = w - xMargin;\n\n    setCssVars({\n      '--x-start': `${xMargin.toFixed(1)}px`,\n      '--x-end': `${xMax.toFixed(1)}px`,\n    } as React.CSSProperties);\n  }, []);\n\n  useResize(containerRef, computePositions);\n\n  return (\n    <>\n      <GlobalAnimationStyles />\n      <AnimatedBorderContainer ref={containerRef} $showContent={showContent}>\n        <GradientBorder $fadeOut={showContent} style={cssVars} />\n        <ContentContainer>\n          {children}\n          <GradientShade />\n        </ContentContainer>\n      </AnimatedBorderContainer>\n    </>\n  );\n};\n\n/**\n * Helper to generate a stable key for a component based on its index and type\n */\nconst getComponentKey = (component: GenUIComponent, index: number): string => {\n  if (!component?.component) {\n    return `empty-${index}`;\n  }\n  return `${component.component}-${index}`;\n};\n\ntype ComponentRendererProps = {\n  /** The component schema to render */\n  component?: GenUIComponent;\n  /** Index of the component in the list */\n  index: number;\n};\n\n/**\n * Internal component that renders a single GenUI component based on its schema\n * Must be used within a GenUIProvider\n */\nconst ComponentRenderer = memo(({ component, index }: ComponentRendererProps) => {\n  const { registry, validComponentTypes } = useGenUI();\n\n  // Handle incomplete components during streaming\n  if (!component?.component) {\n    return null;\n  }\n\n  const componentType = component.component;\n  const key = getComponentKey(component, index);\n\n  // Look up the renderer in the registry\n  const definition = registry[componentType];\n\n  if (definition) {\n    const Renderer = definition.renderer;\n    const isBuiltInBlockLevel = BLOCK_LEVEL_COMPONENTS.has(componentType);\n    const isGradientAnimation = definition?.animation?.name === 'gradient-ring-entry';\n    const isBlockLevel = isBuiltInBlockLevel || isGradientAnimation;\n\n    // Block-level components get the animated gradient border effect.\n    // Built-in components (CARD, TABLE) carry marginY=\"spacing.4\" so need a\n    // 13px inset; custom components have no external margin so use 0.\n    if (isBlockLevel) {\n      return (\n        <AnimatedGradientBorder key={key}>\n          <Renderer {...component} index={index} />\n        </AnimatedGradientBorder>\n      );\n    }\n\n    return <Renderer key={key} {...component} index={index} />;\n  }\n\n  // During streaming, we might get partial component names, ie DIV for DIVIDER or ST for STACK\n  // Check if the current component name is a prefix of any valid component name\n  const isPotentiallyValidComponentName = validComponentTypes.some((validName) =>\n    validName.startsWith(componentType),\n  );\n\n  if (isPotentiallyValidComponentName) {\n    return null;\n  }\n\n  console.warn(`[GenUI]: Unsupported component: ${componentType}`);\n  return null;\n});\n\ntype GenUISchemaRendererProps = {\n  /** The components array to render */\n  components?: GenUIComponent[];\n  /** Whether text animation is active (for streaming) */\n  isAnimating?: boolean;\n  /** Animation options for text streaming */\n  animateOptions?: AnimateOptions;\n};\n\n/**\n * Renders an array of GenUI components\n * Must be used within a GenUIProvider\n *\n * @example\n * ```tsx\n * <GenUIProvider>\n *   <GenUISchemaRenderer components={[...]} isAnimating={isStreaming} />\n * </GenUIProvider>\n * ```\n */\nconst GenUISchemaRenderer = memo(\n  ({ components, isAnimating, animateOptions }: GenUISchemaRendererProps) => {\n    const parentContext = useGenUI();\n\n    if (!components || components.length === 0) {\n      return null;\n    }\n\n    // Create a new context value with animation state overrides\n    const contextValue = {\n      ...parentContext,\n      isAnimating: isAnimating ?? parentContext.isAnimating,\n      animateOptions: animateOptions ?? parentContext.animateOptions,\n    };\n\n    return (\n      <GenUIContext.Provider value={contextValue}>\n        <>\n          {components.map((component, index) => (\n            <ComponentRenderer\n              key={getComponentKey(component, index)}\n              component={component}\n              index={index}\n            />\n          ))}\n        </>\n      </GenUIContext.Provider>\n    );\n  },\n);\n\nexport { GenUISchemaRenderer, ComponentRenderer };\nexport type { GenUISchemaRendererProps };\n"],"names":["BLOCK_LEVEL_COMPONENTS","Set","GlobalAnimationStyles","createGlobalStyle","_templateObject","_taggedTemplateLiteral","travelX","keyframes","travelR","travelX2","travelR2","maskReveal","shadeMove","AnimatedBorderContainer","styled","div","withConfig","displayName","componentId","GradientBorder","_ref","$fadeOut","ContentContainer","GradientShade","AnimatedGradientBorder","_ref2","children","onAnimationComplete","containerRef","useRef","_useState","useState","_useState2","_slicedToArray","showContent","setShowContent","_useState3","_useState4","cssVars","setCssVars","useEffect","timer","setTimeout","clearTimeout","computePositions","useCallback","entry","_entry$contentRect","contentRect","w","width","height","h","xMargin","Math","min","xMax","concat","toFixed","useResize","_jsxs","_Fragment","_jsx","ref","$showContent","style","getComponentKey","component","index","ComponentRenderer","memo","_ref3","_useGenUI","useGenUI","registry","validComponentTypes","componentType","key","definition","_definition$animation","Renderer","renderer","isBuiltInBlockLevel","has","isGradientAnimation","animation","name","isBlockLevel","_objectSpread","isPotentiallyValidComponentName","some","validName","startsWith","console","warn","GenUISchemaRenderer","_ref4","components","isAnimating","animateOptions","parentContext","length","contextValue","GenUIContext","Provider","value","map"],"mappings":";;;;;;;;;;;;AAWA,IAAMA,sBAAsB,GAAG,IAAIC,GAAG,CAAC,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAA;;AAEzD;AACA;AACA;AACA;AACA,IAAMC,qBAAqB,gBAAGC,iBAAiB,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,CAqB9C,CAAA,kaAAA,CAAA,CAAA,CAAA,CAAA,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA,IAAMC,OAAO,gBAAGC,SAAS,CAIxB,CAAA,2FAAA,CAAA,CAAA,CAAA;AAED,IAAMC,OAAO,gBAAGD,SAAS,CAIxB,CAAA,mEAAA,CAAA,CAAA,CAAA;AAED,IAAME,QAAQ,gBAAGF,SAAS,CAIzB,CAAA,gGAAA,CAAA,CAAA,CAAA;AAED,IAAMG,QAAQ,gBAAGH,SAAS,CAIzB,CAAA,0EAAA,CAAA,CAAA,CAAA;;AAED;AACA,IAAMI,UAAU,gBAAGJ,SAAS,CAS3B,CAAA,4EAAA,CAAA,CAAA,CAAA;;AAED;AACA,IAAMK,SAAS,gBAAGL,SAAS,CAY1B,CAAA,uGAAA,CAAA,CAAA,CAAA;;AAED;AACA,IAAMM,uBAAuB,gBAAGC,MAAM,CAACC,GAAG,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,iDAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAKzC,CAAA,CAAA,CAAA,gEAAA,CAAA,CAAA,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA,IAAMC,cAAc,gBAAGL,MAAM,CAACC,GAAG,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,wCAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAyBlBZ,CAAAA,CAAAA,CAAAA,4cAAAA,EAAAA,sBAAAA,EAAAA,sBAAAA,EAAAA,sBAAAA,EAAAA,4JAAAA,EAAAA,kCAAAA,CAAAA,EAAAA,OAAO,EAAwBE,OAAO,EAC/CC,QAAQ,EAAwBC,QAAQ,EAKjC,UAAAU,IAAA,EAAA;AAAA,EAAA,IAAGC,QAAQ,GAAAD,IAAA,CAARC,QAAQ,CAAA;AAAA,EAAA,OAAQA,QAAQ,GAAG,CAAC,GAAG,CAAC,CAAA;AAAA,CAAC,CAEhD,CAAA;;AAED;AACA,IAAMC,gBAAgB,gBAAGR,MAAM,CAACC,GAAG,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,0CAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAAA,CAAA,CAAA,CAAA,uKAAA,EAAA,6CAAA,CAAA,EAUpBP,UAAU,CAExB,CAAA;;AAED;AACA,IAAMY,aAAa,gBAAGT,MAAM,CAACC,GAAG,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,uCAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAAA,CAAA,CAAA,CAAA,qVAAA,EAAA,+CAAA,CAAA,EAoBjBN,SAAS,CAEvB,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA,IAAMY,sBAGJ,GAAG,SAHCA,sBAGJA,CAAAC,KAAA,EAA0C;AAAA,EAAA,IAApCC,QAAQ,GAAAD,KAAA,CAARC,QAAQ;IAAEC,mBAAmB,GAAAF,KAAA,CAAnBE,mBAAmB,CAAA;AACnC,EAAA,IAAMC,YAAY,GAAGC,MAAM,CAAiB,IAAI,CAAC,CAAA;AACjD,EAAA,IAAAC,SAAA,GAAsCC,QAAQ,CAAC,KAAK,CAAC;IAAAC,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAA9CI,IAAAA,WAAW,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,cAAc,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;AAClC;EACA,IAAAI,UAAA,GAA8BL,QAAQ,CAAsB;AAC1D,MAAA,WAAW,EAAE,MAAM;AACnB,MAAA,SAAS,EAAE,OAAA;AACb,KAAwB,CAAC;IAAAM,UAAA,GAAAJ,cAAA,CAAAG,UAAA,EAAA,CAAA,CAAA;AAHlBE,IAAAA,OAAO,GAAAD,UAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,UAAU,GAAAF,UAAA,CAAA,CAAA,CAAA,CAAA;AAK1BG,EAAAA,SAAS,CAAC,YAAM;AACd;AACA,IAAA,IAAMC,KAAK,GAAGC,UAAU,CAAC,YAAM;MAC7BP,cAAc,CAAC,IAAI,CAAC,CAAA;AACpBR,MAAAA,mBAAmB,KAAnBA,IAAAA,IAAAA,mBAAmB,KAAnBA,KAAAA,CAAAA,IAAAA,mBAAmB,EAAI,CAAA;KACxB,EAAE,IAAI,CAAC,CAAA;IACR,OAAO,YAAA;MAAA,OAAMgB,YAAY,CAACF,KAAK,CAAC,CAAA;AAAA,KAAA,CAAA;AAClC,GAAC,EAAE,CAACd,mBAAmB,CAAC,CAAC,CAAA;;AAEzB;AACA;AACA,EAAA,IAAMiB,gBAAgB,GAAGC,WAAW,CAAC,UAACC,KAA0B,EAAK;AACnE,IAAA,IAAAC,kBAAA,GAA6BD,KAAK,CAACE,WAAW;MAA/BC,CAAC,GAAAF,kBAAA,CAARG,KAAK;MAAKC,MAAM,GAAAJ,kBAAA,CAANI,MAAM,CAAA;IACxB,IAAMC,CAAC,GAAGD,MAAM,CAAA;AAChB,IAAA,IAAIF,CAAC,IAAI,CAAC,IAAIG,CAAC,IAAI,CAAC,EAAE,OAAA;AAEtB,IAAA,IAAMC,OAAO,GAAGC,IAAI,CAACC,GAAG,CAACH,CAAC,GAAG,GAAG,EAAEH,CAAC,GAAG,GAAG,CAAC,CAAA;AAC1C,IAAA,IAAMO,IAAI,GAAGP,CAAC,GAAGI,OAAO,CAAA;AAExBd,IAAAA,UAAU,CAAC;MACT,WAAW,EAAA,EAAA,CAAAkB,MAAA,CAAKJ,OAAO,CAACK,OAAO,CAAC,CAAC,CAAC,EAAI,IAAA,CAAA;MACtC,SAAS,EAAA,EAAA,CAAAD,MAAA,CAAKD,IAAI,CAACE,OAAO,CAAC,CAAC,CAAC,EAAA,IAAA,CAAA;AAC/B,KAAwB,CAAC,CAAA;GAC1B,EAAE,EAAE,CAAC,CAAA;AAENC,EAAAA,SAAS,CAAC/B,YAAY,EAAEgB,gBAAgB,CAAC,CAAA;EAEzC,oBACEgB,IAAA,CAAAC,QAAA,EAAA;IAAAnC,QAAA,EAAA,cACEoC,GAAA,CAAC5D,qBAAqB,IAAE,CAAC,eACzB0D,IAAA,CAAC/C,uBAAuB,EAAA;AAACkD,MAAAA,GAAG,EAAEnC,YAAa;AAACoC,MAAAA,YAAY,EAAE9B,WAAY;MAAAR,QAAA,EAAA,cACpEoC,GAAA,CAAC3C,cAAc,EAAA;AAACE,QAAAA,QAAQ,EAAEa,WAAY;AAAC+B,QAAAA,KAAK,EAAE3B,OAAAA;AAAQ,OAAE,CAAC,eACzDsB,IAAA,CAACtC,gBAAgB,EAAA;AAAAI,QAAAA,QAAA,GACdA,QAAQ,eACToC,GAAA,CAACvC,aAAa,IAAE,CAAC,CAAA;AAAA,OACD,CAAC,CAAA;AAAA,KACI,CAAC,CAAA;AAAA,GAC1B,CAAC,CAAA;AAEP,CAAC,CAAA;;AAED;AACA;AACA;AACA,IAAM2C,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,SAAyB,EAAEC,KAAa,EAAa;EAC5E,IAAI,EAACD,SAAS,KAATA,IAAAA,IAAAA,SAAS,eAATA,SAAS,CAAEA,SAAS,CAAE,EAAA;IACzB,OAAAV,QAAAA,CAAAA,MAAA,CAAgBW,KAAK,CAAA,CAAA;AACvB,GAAA;EACA,OAAAX,EAAAA,CAAAA,MAAA,CAAUU,SAAS,CAACA,SAAS,EAAAV,GAAAA,CAAAA,CAAAA,MAAA,CAAIW,KAAK,CAAA,CAAA;AACxC,CAAC,CAAA;AASD;AACA;AACA;AACA;AACA,IAAMC,iBAAiB,gBAAGC,IAAI,CAAC,UAAAC,KAAA,EAAkD;AAAA,EAAA,IAA/CJ,SAAS,GAAAI,KAAA,CAATJ,SAAS;IAAEC,KAAK,GAAAG,KAAA,CAALH,KAAK,CAAA;AAChD,EAAA,IAAAI,SAAA,GAA0CC,QAAQ,EAAE;IAA5CC,QAAQ,GAAAF,SAAA,CAARE,QAAQ;IAAEC,mBAAmB,GAAAH,SAAA,CAAnBG,mBAAmB,CAAA;;AAErC;EACA,IAAI,EAACR,SAAS,KAATA,IAAAA,IAAAA,SAAS,eAATA,SAAS,CAAEA,SAAS,CAAE,EAAA;AACzB,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;AAEA,EAAA,IAAMS,aAAa,GAAGT,SAAS,CAACA,SAAS,CAAA;AACzC,EAAA,IAAMU,GAAG,GAAGX,eAAe,CAACC,SAAS,EAAEC,KAAK,CAAC,CAAA;;AAE7C;AACA,EAAA,IAAMU,UAAU,GAAGJ,QAAQ,CAACE,aAAa,CAAC,CAAA;AAE1C,EAAA,IAAIE,UAAU,EAAE;AAAA,IAAA,IAAAC,qBAAA,CAAA;AACd,IAAA,IAAMC,QAAQ,GAAGF,UAAU,CAACG,QAAQ,CAAA;AACpC,IAAA,IAAMC,mBAAmB,GAAGlF,sBAAsB,CAACmF,GAAG,CAACP,aAAa,CAAC,CAAA;AACrE,IAAA,IAAMQ,mBAAmB,GAAG,CAAAN,UAAU,KAAVA,IAAAA,IAAAA,UAAU,gBAAAC,qBAAA,GAAVD,UAAU,CAAEO,SAAS,cAAAN,qBAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAArBA,qBAAA,CAAuBO,IAAI,MAAK,qBAAqB,CAAA;AACjF,IAAA,IAAMC,YAAY,GAAGL,mBAAmB,IAAIE,mBAAmB,CAAA;;AAE/D;AACA;AACA;AACA,IAAA,IAAIG,YAAY,EAAE;MAChB,oBACEzB,GAAA,CAACtC,sBAAsB,EAAA;QAAAE,QAAA,eACrBoC,GAAA,CAACkB,QAAQ,EAAAQ,aAAA,CAAAA,aAAA,CAAA,EAAA,EAAKrB,SAAS,CAAA,EAAA,EAAA,EAAA;AAAEC,UAAAA,KAAK,EAAEA,KAAAA;SAAQ,CAAA,CAAA;AAAC,OAAA,EADdS,GAEL,CAAC,CAAA;AAE7B,KAAA;IAEA,oBAAOf,GAAA,CAACkB,QAAQ,EAAAQ,aAAA,CAAAA,aAAA,KAAerB,SAAS,CAAA,EAAA,EAAA,EAAA;AAAEC,MAAAA,KAAK,EAAEA,KAAAA;AAAM,KAAA,CAAA,EAAjCS,GAAmC,CAAC,CAAA;AAC5D,GAAA;;AAEA;AACA;AACA,EAAA,IAAMY,+BAA+B,GAAGd,mBAAmB,CAACe,IAAI,CAAC,UAACC,SAAS,EAAA;AAAA,IAAA,OACzEA,SAAS,CAACC,UAAU,CAAChB,aAAa,CAAC,CAAA;AAAA,GACrC,CAAC,CAAA;AAED,EAAA,IAAIa,+BAA+B,EAAE;AACnC,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;AAEAI,EAAAA,OAAO,CAACC,IAAI,CAAA,kCAAA,CAAArC,MAAA,CAAoCmB,aAAa,CAAE,CAAC,CAAA;AAChE,EAAA,OAAO,IAAI,CAAA;AACb,CAAC,EAAC;AAWF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMmB,mBAAmB,gBAAGzB,IAAI,CAC9B,UAAA0B,KAAA,EAA2E;AAAA,EAAA,IAAxEC,UAAU,GAAAD,KAAA,CAAVC,UAAU;IAAEC,WAAW,GAAAF,KAAA,CAAXE,WAAW;IAAEC,cAAc,GAAAH,KAAA,CAAdG,cAAc,CAAA;AACxC,EAAA,IAAMC,aAAa,GAAG3B,QAAQ,EAAE,CAAA;EAEhC,IAAI,CAACwB,UAAU,IAAIA,UAAU,CAACI,MAAM,KAAK,CAAC,EAAE;AAC1C,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;;AAEA;AACA,EAAA,IAAMC,YAAY,GAAAd,aAAA,CAAAA,aAAA,KACbY,aAAa,CAAA,EAAA,EAAA,EAAA;IAChBF,WAAW,EAAEA,WAAW,KAAXA,IAAAA,IAAAA,WAAW,cAAXA,WAAW,GAAIE,aAAa,CAACF,WAAW;IACrDC,cAAc,EAAEA,cAAc,KAAdA,IAAAA,IAAAA,cAAc,cAAdA,cAAc,GAAIC,aAAa,CAACD,cAAAA;GACjD,CAAA,CAAA;AAED,EAAA,oBACErC,GAAA,CAACyC,YAAY,CAACC,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEH,YAAa;IAAA5E,QAAA,eACzCoC,GAAA,CAAAD,QAAA,EAAA;MAAAnC,QAAA,EACGuE,UAAU,CAACS,GAAG,CAAC,UAACvC,SAAS,EAAEC,KAAK,EAAA;QAAA,oBAC/BN,GAAA,CAACO,iBAAiB,EAAA;AAEhBF,UAAAA,SAAS,EAAEA,SAAU;AACrBC,UAAAA,KAAK,EAAEA,KAAAA;AAAM,SAAA,EAFRF,eAAe,CAACC,SAAS,EAAEC,KAAK,CAGtC,CAAC,CAAA;OACH,CAAA;KACD,CAAA;AAAC,GACkB,CAAC,CAAA;AAE5B,CACF;;;;"}
+{"version":3,"file":"GenUISchemaRenderer.web.js","sources":["../../../../../../src/components/GenUI/GenUISchemaRenderer.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport React, { memo, useState, useEffect, useRef, useCallback } from 'react';\nimport { ErrorBoundary } from 'react-error-boundary';\nimport styled, { createGlobalStyle, keyframes } from 'styled-components';\nimport type { GenUIComponent } from './GenUIComponents';\nimport { useGenUI, GenUIContext } from './GenUIContext';\nimport type { AnimateOptions } from './rehypeAnimate';\nimport { useResize } from '~utils/useResize';\n\n/**\n * Fallback component shown when a GenUI component fails to render\n */\nconst ComponentErrorFallback = () => {\n  // eslint-disable-next-line react/jsx-no-useless-fragment\n  return <></>;\n};\n\n/**\n * Block-level component types that should have the animated gradient border effect\n */\nconst BLOCK_LEVEL_COMPONENTS = new Set(['CARD', 'TABLE']);\n\n/**\n * Global styles for @property rules needed for CSS animation of custom properties\n * Note: @property is required to animate CSS custom properties (interpolation)\n */\nconst GlobalAnimationStyles = createGlobalStyle`\n  @property --travel-x {\n    syntax: '<length>';\n    inherits: false;\n    initial-value: 0px;\n  }\n  @property --travel-r {\n    syntax: '<angle>';\n    inherits: false;\n    initial-value: 0deg;\n  }\n  @property --travel-x2 {\n    syntax: '<length>';\n    inherits: false;\n    initial-value: 0px;\n  }\n  @property --travel-r2 {\n    syntax: '<angle>';\n    inherits: false;\n    initial-value: 0deg;\n  }\n`;\n\n/**\n * Static keyframes using CSS variables for positions.\n * Values are passed via inline style: --x-start, --x-end\n * Using ~70% for edge traversal, ~30% for corner sweep (good for typical card aspect ratios)\n */\nconst travelX = keyframes`\n  0% { --travel-x: var(--x-start); }\n  70% { --travel-x: var(--x-end); }\n  100% { --travel-x: var(--x-end); }\n`;\n\nconst travelR = keyframes`\n  0% { --travel-r: 0deg; }\n  70% { --travel-r: 0deg; }\n  100% { --travel-r: 180deg; }\n`;\n\nconst travelX2 = keyframes`\n  0% { --travel-x2: var(--x-start); }\n  30% { --travel-x2: var(--x-start); }\n  100% { --travel-x2: var(--x-end); }\n`;\n\nconst travelR2 = keyframes`\n  0% { --travel-r2: 0deg; }\n  30% { --travel-r2: -180deg; }\n  100% { --travel-r2: -180deg; }\n`;\n\n/** Mask reveal animation - diagonal swipe from top-left to bottom-right */\nconst maskReveal = keyframes`\n  0% {\n    mask-position: 100% 100%;\n    opacity: 0;\n  }\n  100% {\n    mask-position: 0% 0%;\n    opacity: 1;\n  }\n`;\n\n/** Gradient shade movement - left to right, fades out at end */\nconst shadeMove = keyframes`\n  0% {\n    background-position: 0% 50%;\n    opacity: 1;\n  }\n  70% {\n    opacity: 1;\n  }\n  100% {\n    background-position: 100% 50%;\n    opacity: 0;\n  }\n`;\n\n/** Container for the animated border effect — owns the vertical margin to keep the ring flush */\nconst AnimatedBorderContainer = styled.div<{ $showContent?: boolean }>`\n  position: relative;\n  width: 100%;\n  border-radius: 12px;\n  margin: 12px 0;\n`;\n\n/**\n * The animated gradient border layer - light travels along the border edges.\n * Uses conic-gradient positioned at (--travel-x, 50%) with rotation --travel-r.\n * The animation moves the gradient center along the horizontal axis while\n * rotating it at the corners to create the illusion of perimeter traversal.\n */\nconst GradientBorder = styled.div<{ $fadeOut?: boolean }>`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  border-radius: 12px;\n  background: conic-gradient(\n      from calc(var(--travel-r) - 50deg) at var(--travel-x) 50%,\n      transparent 0%,\n      hsl(180 85% 65%) 3%,\n      hsl(145 75% 45%) 5%,\n      hsl(145 85% 70%) 7%,\n      transparent 30%,\n      transparent 100%\n    ),\n    conic-gradient(\n      from calc(var(--travel-r2) - 50deg) at var(--travel-x2) 50%,\n      transparent 0%,\n      hsl(180 85% 65%) 3%,\n      hsl(145 75% 45%) 5%,\n      hsl(145 85% 70%) 7%,\n      transparent 30%,\n      transparent 100%\n    );\n  animation: ${travelX} 1s linear infinite, ${travelR} 1s linear infinite,\n    ${travelX2} 1s linear infinite, ${travelR2} 1s linear infinite;\n  pointer-events: none;\n  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);\n  mask-composite: exclude;\n  padding: 1.5px;\n  opacity: ${({ $fadeOut }) => ($fadeOut ? 0 : 1)};\n  transition: opacity 3s ease-out;\n`;\n\n/** Content container with mask reveal animation */\nconst ContentContainer = styled.div`\n  position: relative;\n  width: 100%;\n  height: 100%;\n  /* Diagonal gradient mask for reveal effect - starts hidden, animates to revealed */\n  mask-image: linear-gradient(135deg, black 0%, black 45%, transparent 55%);\n  mask-size: 300% 300%;\n  /* Start position: fully masked (hidden) */\n  mask-position: 100% 100%;\n  /* Animate to 0% 0% (fully revealed) with ease-out for smooth finish */\n  animation: ${maskReveal} 2s ease-out forwards;\n  animation-delay: 0.6s;\n`;\n\n/** Green linear gradient shade overlay */\nconst GradientShade = styled.div`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  border-radius: 12px;\n  pointer-events: none;\n  z-index: 5;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    hsl(145 85% 50% / 0.15) 30%,\n    hsl(155 85% 45% / 0.25) 50%,\n    hsl(145 85% 50% / 0.15) 70%,\n    transparent 100%\n  );\n  background-size: 50% 100%;\n  background-repeat: no-repeat;\n  background-position: 0% 50%;\n  animation: ${shadeMove} 1.5s ease-out forwards;\n  animation-delay: 0.3s;\n`;\n\n/**\n * Animated gradient border wrapper for block-level components.\n * Uses CSS variables for dynamic position values with static keyframes (best perf).\n * No dynamic style injection - just pass --x-start and --x-end via inline style.\n */\nconst AnimatedGradientBorder: React.FC<{\n  children: React.ReactNode;\n  onAnimationComplete?: () => void;\n}> = ({ children, onAnimationComplete }) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [showContent, setShowContent] = useState(false);\n  // Initial default values to prevent animation from breaking before ResizeObserver fires\n  const [cssVars, setCssVars] = useState<React.CSSProperties>({\n    '--x-start': '50px',\n    '--x-end': '500px',\n  } as React.CSSProperties);\n\n  useEffect(() => {\n    // Trigger border fade-out after mask reveal completes (0.6s delay + 1s animation)\n    const timer = setTimeout(() => {\n      setShowContent(true);\n      onAnimationComplete?.();\n    }, 1000);\n    return () => clearTimeout(timer);\n  }, [onAnimationComplete]);\n\n  // Measure container and compute CSS variable values for animation positions.\n  // Ring now spans the full container (top: 0, bottom: 0), so rect.height is the ring height.\n  const computePositions = useCallback((entry: ResizeObserverEntry) => {\n    const { width: w, height } = entry.contentRect;\n    const h = height;\n    if (w <= 0 || h <= 0) return;\n\n    const xMargin = Math.min(h * 0.5, w * 0.1);\n    const xMax = w - xMargin;\n\n    setCssVars({\n      '--x-start': `${xMargin.toFixed(1)}px`,\n      '--x-end': `${xMax.toFixed(1)}px`,\n    } as React.CSSProperties);\n  }, []);\n\n  useResize(containerRef, computePositions);\n\n  return (\n    <>\n      <GlobalAnimationStyles />\n      <AnimatedBorderContainer ref={containerRef} $showContent={showContent}>\n        <GradientBorder $fadeOut={showContent} style={cssVars} />\n        <ContentContainer>\n          {children}\n          <GradientShade />\n        </ContentContainer>\n      </AnimatedBorderContainer>\n    </>\n  );\n};\n\n/**\n * Helper to generate a stable key for a component based on its index and type\n */\nconst getComponentKey = (component: GenUIComponent, index: number): string => {\n  if (!component?.component) {\n    return `empty-${index}`;\n  }\n  return `${component.component}-${index}`;\n};\n\ntype ComponentRendererProps = {\n  /** The component schema to render */\n  component?: GenUIComponent;\n  /** Index of the component in the list */\n  index: number;\n};\n\n/**\n * Internal component that renders a single GenUI component based on its schema\n * Must be used within a GenUIProvider\n */\nconst ComponentRendererInner = memo(({ component, index }: ComponentRendererProps) => {\n  const { registry, validComponentTypes } = useGenUI();\n\n  // Handle incomplete components during streaming\n  if (!component?.component) {\n    return null;\n  }\n\n  const componentType = component.component;\n  const key = getComponentKey(component, index);\n\n  // Look up the renderer in the registry\n  const definition = registry[componentType];\n\n  if (definition) {\n    const Renderer = definition.renderer;\n    const isBuiltInBlockLevel = BLOCK_LEVEL_COMPONENTS.has(componentType);\n    const isGradientAnimation = definition?.animation?.name === 'gradient-ring-entry';\n    const isBlockLevel = isBuiltInBlockLevel || isGradientAnimation;\n\n    // Block-level components get the animated gradient border effect.\n    // Built-in components (CARD, TABLE) carry marginY=\"spacing.4\" so need a\n    // 13px inset; custom components have no external margin so use 0.\n    if (isBlockLevel) {\n      return (\n        <AnimatedGradientBorder key={key}>\n          <Renderer {...component} index={index} />\n        </AnimatedGradientBorder>\n      );\n    }\n\n    return <Renderer key={key} {...component} index={index} />;\n  }\n\n  // During streaming, we might get partial component names, ie DIV for DIVIDER or ST for STACK\n  // Check if the current component name is a prefix of any valid component name\n  const isPotentiallyValidComponentName = validComponentTypes.some((validName) =>\n    validName.startsWith(componentType),\n  );\n\n  if (isPotentiallyValidComponentName) {\n    return null;\n  }\n\n  console.warn(`[GenUI]: Unsupported component: ${componentType}`);\n  return null;\n});\n\nconst ComponentRenderer = memo(({ component, index }: ComponentRendererProps) => {\n  return (\n    <ErrorBoundary FallbackComponent={ComponentErrorFallback}>\n      <ComponentRendererInner component={component} index={index} />\n    </ErrorBoundary>\n  );\n});\n\ntype GenUISchemaRendererProps = {\n  /** The components array to render */\n  components?: GenUIComponent[];\n  /** Whether text animation is active (for streaming) */\n  isAnimating?: boolean;\n  /** Animation options for text streaming */\n  animateOptions?: AnimateOptions;\n};\n\n/**\n * Renders an array of GenUI components\n * Must be used within a GenUIProvider\n *\n * @example\n * ```tsx\n * <GenUIProvider>\n *   <GenUISchemaRenderer components={[...]} isAnimating={isStreaming} />\n * </GenUIProvider>\n * ```\n */\nconst GenUISchemaRenderer = memo(\n  ({ components, isAnimating, animateOptions }: GenUISchemaRendererProps) => {\n    const parentContext = useGenUI();\n\n    if (!components || components.length === 0) {\n      return null;\n    }\n\n    // Create a new context value with animation state overrides\n    const contextValue = {\n      ...parentContext,\n      isAnimating: isAnimating ?? parentContext.isAnimating,\n      animateOptions: animateOptions ?? parentContext.animateOptions,\n    };\n\n    return (\n      <GenUIContext.Provider value={contextValue}>\n        <>\n          {components.map((component, index) => (\n            <ComponentRenderer\n              key={getComponentKey(component, index)}\n              component={component}\n              index={index}\n            />\n          ))}\n        </>\n      </GenUIContext.Provider>\n    );\n  },\n);\n\nexport { GenUISchemaRenderer, ComponentRenderer };\nexport type { GenUISchemaRendererProps };\n"],"names":["ComponentErrorFallback","_jsx","_Fragment","BLOCK_LEVEL_COMPONENTS","Set","GlobalAnimationStyles","createGlobalStyle","_templateObject","_taggedTemplateLiteral","travelX","keyframes","travelR","travelX2","travelR2","maskReveal","shadeMove","AnimatedBorderContainer","styled","div","withConfig","displayName","componentId","GradientBorder","_ref","$fadeOut","ContentContainer","GradientShade","AnimatedGradientBorder","_ref2","children","onAnimationComplete","containerRef","useRef","_useState","useState","_useState2","_slicedToArray","showContent","setShowContent","_useState3","_useState4","cssVars","setCssVars","useEffect","timer","setTimeout","clearTimeout","computePositions","useCallback","entry","_entry$contentRect","contentRect","w","width","height","h","xMargin","Math","min","xMax","concat","toFixed","useResize","_jsxs","ref","$showContent","style","getComponentKey","component","index","ComponentRendererInner","memo","_ref3","_useGenUI","useGenUI","registry","validComponentTypes","componentType","key","definition","_definition$animation","Renderer","renderer","isBuiltInBlockLevel","has","isGradientAnimation","animation","name","isBlockLevel","_objectSpread","isPotentiallyValidComponentName","some","validName","startsWith","console","warn","ComponentRenderer","_ref4","ErrorBoundary","FallbackComponent","GenUISchemaRenderer","_ref5","components","isAnimating","animateOptions","parentContext","length","contextValue","GenUIContext","Provider","value","map"],"mappings":"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"}

package/build/types/components/index.d.ts

@@ -28845,6 +28845,10 @@ type CardComponent = GenUIBaseComponent & {
     footer?: string | null;
     children?: GenUIComponent[];
 };
+type InfoGroupItemValue = {
+    helpText?: string;
+    children: string | GenUIComponent;
+};
 type InfoGroupComponent = GenUIBaseComponent & {
     component: typeof ComponentType.INFO_GROUP;
     items?: Array<{
@@ -28852,10 +28856,7 @@ type InfoGroupComponent = GenUIBaseComponent & {
             helpText?: string;
             children: string;
         };
-        value?: {
-            helpText?: string;
-            children: string;
-        };
+        value?: InfoGroupItemValue;
     }>;
 };
 type ButtonComponent = GenUIBaseComponent & {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@razorpay/blade",
   "description": "The Design System that powers Razorpay",
-  "version": "12.95.4",
+  "version": "12.96.0",
   "license": "MIT",
   "engines": {
     "node": ">=18.12.1"