npm - @razorpay/blade - Versions diffs - 12.62.0 → 12.64.0 - Mend

@razorpay/blade 12.62.0 → 12.64.0

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.

Files changed (141) hide show

package/build/lib/web/development/components/BaseHeaderFooter/BaseHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseHeader.js","sources":["../../../../../../src/components/BaseHeaderFooter/BaseHeader.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport React from 'react';\nimport type { ReactDOMAttributes } from '@use-gesture/react/dist/declarations/src/types';\nimport { Divider } from '~components/Divider';\nimport type { DividerProps } from '~components/Divider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { Heading, Text } from '~components/Typography';\nimport { IconButton } from '~components/Button/IconButton';\nimport { ChevronLeftIcon, CloseIcon } from '~components/Icons';\nimport type { DataAnalyticsAttribute, TestID } from '~utils/types';\nimport type { BoxProps } from '~components/Box';\nimport { Box } from '~components/Box';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getComponentId } from '~utils/isValidAllowedChildren';\nimport { isReactNative, makeSize } from '~utils';\nimport { metaAttribute } from '~utils/metaAttribute';\nimport { logger, throwBladeError } from '~utils/logger';\nimport { size as sizeToken } from '~tokens/global';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype BaseHeaderProps = {\n title?: string;\n subtitle?: string;\n /\n Leading part of the header placed at the left most side of the header\n /\n leading?: React.ReactNode;\n /\n Trailing part of the header placed at the right most side of the header\n /\n trailing?: React.ReactNode;\n /\n Placed adjacent to the title text\n /\n titleSuffix?: React.ReactNode;\n /\n @default true\n /\n showDivider?: boolean;\n /\n @default false\n /\n showBackButton?: boolean;\n\n /\n Slot for rendering any trailing interaction element into BaseHeader.\n \n E.g. Used in accordion to render CollapsibleChevronIcon\n /\n trailingInteractionElement?: React.ReactNode;\n\n /\n Decides size of the Header\n /\n size?: 'xlarge' \| 'large' \| 'medium';\n /\n @default true\n /\n showCloseButton?: boolean;\n\n /\n Disabled state of BaseHeader\n \n @default false\n /\n isDisabled?: boolean;\n\n paddingX?: BoxProps['paddingX'];\n marginY?: BoxProps['marginY'];\n marginTop?: BoxProps['marginTop'];\n marginBottom?: BoxProps['marginBottom'];\n alignItems?: BoxProps['alignItems'];\n dividerProps?: DividerProps;\n\n onCloseButtonClick?: () => void;\n onBackButtonClick?: () => void;\n closeButtonRef?: React.MutableRefObject<any>;\n backButtonRef?: React.MutableRefObject<any>;\n metaComponentName?: string;\n /\n inner child of BottomSheetHeader. Meant to be used for AutoComplete only\n /\n children?: React.ReactElement \| React.ReactElement[];\n /\n Background image of the header\n \n You can use this for adding gradients.\n /\n backgroundImage?: BoxProps['backgroundImage'];\n /\n So we add a wrapper with custom styles in elements like leading, trailing interaction elements and trailing.\n * this props allows you to control that.\n \n For example, in Accordion, we add a wrapper with flex to center the icon (in some cases)\n \n @default false\n */\n shouldAlignLeadingAndTrailingElementsToCenter?: boolean;\n} & Pick<\n ReactDOMAttributes,\n \| 'onClickCapture'\n \| 'onKeyDown'\n \| 'onKeyUp'\n \| 'onLostPointerCapture'\n \| 'onPointerCancel'\n \| 'onPointerDown'\n \| 'onPointerMove'\n \| 'onPointerUp'\n> &\n TestID &\n DataAnalyticsAttribute;\n\ntype TrailingComponents = 'Button' \| 'Badge' \| 'Link' \| 'Text' \| 'Amount';\n\nconst commonCenterBoxProps: BoxProps = {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n};\n\nconst centerBoxProps: { xlarge: BoxProps; large: BoxProps; medium: BoxProps } = {\n xlarge: {\n ...commonCenterBoxProps,\n height: '28px',\n },\n large: {\n ...commonCenterBoxProps,\n // We want to align title, icon, titleSuffix, trailing, closeButton to baseline\n // But we also want to keep them center aligned to each other\n // So we add a virtual Box around these slots with 28px and center align them to that box\n // We have done similar thing in figma as well (which is where this 28px comes from)\n height: '28px',\n },\n medium: {\n ...commonCenterBoxProps,\n height: '20px',\n },\n};\n\nconst absolutePositionedButton = {\n position: 'absolute',\n top: 'spacing.0',\n right: 'spacing.0',\n} as const;\n\nconst sizeTokensMapping = {\n xlarge: {\n title: 'small',\n type: 'heading',\n },\n large: {\n title: 'large',\n type: 'text',\n },\n medium: {\n title: 'medium',\n type: 'text',\n },\n} as const;\n\n// prop restriction map for corresponding sub components\nconst propRestrictionMap = {\n large: {\n Button: {\n size: 'xsmall',\n variant: 'tertiary',\n },\n IconButton: {\n size: 'large',\n },\n Badge: {\n size: 'medium',\n },\n Link: {\n size: 'medium',\n },\n Text: {\n size: 'medium',\n variant: 'body',\n },\n Amount: {\n type: 'body',\n size: 'medium',\n },\n },\n xlarge: {\n Button: {\n size: 'xsmall',\n variant: 'tertiary',\n },\n IconButton: {\n size: 'large',\n },\n Badge: {\n size: 'medium',\n },\n Link: {\n size: 'medium',\n },\n Text: {\n size: 'medium',\n variant: 'body',\n },\n Amount: {\n type: 'body',\n size: 'medium',\n },\n },\n medium: {\n Button: {\n size: 'xsmall',\n variant: 'tertiary',\n },\n IconButton: {\n size: 'large',\n },\n Badge: {\n size: 'small',\n },\n Link: {\n size: 'small',\n },\n Text: {\n size: 'small',\n variant: 'body',\n },\n Amount: {\n type: 'body',\n size: 'small',\n },\n },\n} as const;\n\nconst useTrailingRestriction = ({\n trailing,\n size,\n}: {\n size: NonNullable<BaseHeaderProps['size']>;\n trailing: BaseHeaderProps['trailing'];\n}): React.ReactNode => {\n const [\n validatedTrailingComponent,\n setValidatedTrailingComponent,\n ] = React.useState<React.ReactElement \| null>(null);\n\n // validate and restrict sub component props in trailing prop\n React.useEffect(() => {\n if (React.isValidElement(trailing)) {\n const trailingComponentType = getComponentId(trailing) as TrailingComponents;\n const restrictedProps = propRestrictionMap[size][trailingComponentType];\n\n const allowedComponents = Object.keys(propRestrictionMap[size]);\n if (__DEV__) {\n if (!restrictedProps) {\n throwBladeError({\n message: `Only one of \\`${allowedComponents.join(\n ', ',\n )}\\` component is accepted as trailing`,\n moduleName: 'Header',\n });\n }\n }\n\n const restrictedPropKeys = Object.keys(propRestrictionMap[size][trailingComponentType]);\n for (const prop of restrictedPropKeys) {\n if (trailing?.props?.hasOwnProperty(prop)) {\n logger({\n message: `Do not pass \"${prop}\" to \"${trailingComponentType}\" while inside Header trailing, because we override it.`,\n moduleName: 'Header',\n type: 'warn',\n });\n }\n }\n setValidatedTrailingComponent(\n React.cloneElement(trailing as React.ReactElement, restrictedProps),\n );\n }\n }, [trailing, size]);\n\n return validatedTrailingComponent;\n};\n\nconst _BaseHeader = ({\n title,\n subtitle,\n leading,\n titleSuffix,\n trailing,\n showDivider = true,\n showBackButton = false,\n showCloseButton = true,\n onBackButtonClick,\n onCloseButtonClick,\n closeButtonRef,\n backButtonRef,\n testID,\n onClickCapture,\n onKeyDown,\n onKeyUp,\n onLostPointerCapture,\n onPointerCancel,\n onPointerDown,\n onPointerMove,\n onPointerUp,\n metaComponentName,\n paddingX,\n marginY,\n marginBottom,\n marginTop,\n size = 'large',\n isDisabled,\n children,\n trailingInteractionElement,\n backgroundImage,\n alignItems = 'flex-start',\n dividerProps,\n shouldAlignLeadingAndTrailingElementsToCenter = false,\n ...rest\n}: BaseHeaderProps): React.ReactElement => {\n const validatedTrailingComponent = useTrailingRestriction({ trailing, size });\n const shouldWrapTitle = titleSuffix && trailing && showBackButton && showCloseButton;\n const hasOnlyChildren = children && !(title \|\| subtitle \|\| titleSuffix \|\| leading);\n\n const webOnlyEventHandlers: Record<string, any> = isReactNative()\n ? {}\n : {\n onClickCapture,\n onKeyDown,\n onKeyUp,\n onLostPointerCapture,\n onPointerCancel,\n onPointerDown,\n onPointerMove,\n onPointerUp,\n };\n\n const renderTrailingInteractionElementWithChildren = (): React.ReactNode => {\n if (trailingInteractionElement && children) {\n return (\n <Box\n alignSelf={shouldAlignLeadingAndTrailingElementsToCenter ? 'center' : 'flex-start'}\n {...centerBoxProps[size]}\n >\n {trailingInteractionElement}\n </Box>\n );\n }\n return null;\n };\n\n const renderTrailingInteractionElementWithoutChildren = (): React.ReactNode => {\n if (trailingInteractionElement && !children) {\n return (\n <Box\n {...centerBoxProps[size]}\n alignSelf={shouldAlignLeadingAndTrailingElementsToCenter ? 'center' : undefined}\n >\n {trailingInteractionElement}\n </Box>\n );\n }\n return null;\n };\n\n const renderLeadingElement = (): React.ReactNode => {\n if (Boolean(leading)) {\n return (\n <BaseBox\n marginRight=\"spacing.3\"\n {...centerBoxProps[size]}\n alignSelf={shouldAlignLeadingAndTrailingElementsToCenter ? 'center' : undefined}\n >\n {leading}\n </BaseBox>\n );\n }\n return null;\n };\n\n const renderTrailingElement = (): React.ReactNode => {\n if (shouldAlignLeadingAndTrailingElementsToCenter && validatedTrailingComponent) {\n return (\n <BaseBox marginRight=\"spacing.5\" display=\"flex\" alignItems=\"center\" justifyContent=\"center\">\n <Box {...centerBoxProps[size]}>{validatedTrailingComponent}</Box>\n </BaseBox>\n );\n }\n if (validatedTrailingComponent) {\n return (\n <BaseBox marginRight=\"spacing.5\">\n <Box {...centerBoxProps[size]}>{validatedTrailingComponent}</Box>\n </BaseBox>\n );\n }\n return null;\n };\n\n return (\n <BaseBox\n {...metaAttribute({ name: metaComponentName, testID })}\n {...makeAnalyticsAttribute(rest)}\n backgroundImage={backgroundImage}\n >\n <BaseBox\n marginY={marginY ?? { base: 'spacing.5', m: 'spacing.6' }}\n paddingX={paddingX ?? { base: 'spacing.5', m: 'spacing.6' }}\n marginTop={marginTop}\n marginBottom={marginBottom}\n touchAction=\"none\"\n {...webOnlyEventHandlers}\n >\n <BaseBox position=\"relative\" display=\"flex\" flexDirection=\"row\" userSelect=\"none\">\n {showBackButton ? (\n <BaseBox overflow=\"visible\" marginRight=\"spacing.5\">\n <Box {...centerBoxProps[size]}>\n <IconButton\n ref={backButtonRef}\n size=\"large\"\n icon={ChevronLeftIcon}\n onClick={() => onBackButtonClick?.()}\n accessibilityLabel=\"Back\"\n />\n </Box>\n </BaseBox>\n ) : null}\n {hasOnlyChildren ? null : (\n <BaseBox\n paddingRight=\"spacing.5\"\n marginRight=\"auto\"\n flex=\"auto\"\n display=\"flex\"\n flexDirection=\"row\"\n alignItems={alignItems}\n >\n {renderLeadingElement()}\n <BaseBox flex=\"auto\">\n <BaseBox\n // Explicitly setting maxWidth in React Native because text is not being wrapped properly when multiple fix width components are rendered in header\n // In web, flex containers seem to work a expected\n // @todo: resolve this if we figure out some better solution later\n maxWidth={isReactNative() && shouldWrapTitle ? '100px' : undefined}\n flexShrink={0}\n display=\"flex\"\n flexDirection=\"row\"\n >\n {title ? (\n sizeTokensMapping[size].type === 'heading' ? (\n <Heading\n as=\"h2\"\n marginTop={makeSize(sizeToken['1'])}\n size={sizeTokensMapping[size].title}\n weight=\"semibold\"\n color={\n isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.normal'\n }\n wordBreak=\"break-word\"\n >\n {title}\n </Heading>\n ) : (\n <Text\n size={sizeTokensMapping[size].title}\n marginTop={makeSize(sizeToken['1'])}\n weight=\"semibold\"\n color={\n isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.normal'\n }\n wordBreak=\"break-word\"\n >\n {title}\n </Text>\n )\n ) : null}\n {titleSuffix && (\n <BaseBox marginLeft=\"spacing.3\">\n <Box {...centerBoxProps[size]}>{titleSuffix}</Box>\n </BaseBox>\n )}\n </BaseBox>\n {subtitle ? (\n <Text\n variant=\"body\"\n size=\"small\"\n weight=\"regular\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.muted'}\n >\n {subtitle}\n </Text>\n ) : null}\n </BaseBox>\n </BaseBox>\n )}\n {renderTrailingElement()}\n\n {showCloseButton ? (\n <Box {...(hasOnlyChildren ? absolutePositionedButton : centerBoxProps[size])}>\n <IconButton\n ref={closeButtonRef}\n size=\"large\"\n icon={CloseIcon}\n accessibilityLabel=\"Close\"\n onClick={() => onCloseButtonClick?.()}\n />\n </Box>\n ) : null}\n {renderTrailingInteractionElementWithoutChildren()}\n </BaseBox>\n <BaseBox\n display=\"flex\"\n width=\"100%\"\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n >\n <Box width=\"100%\">{children}</Box>\n {renderTrailingInteractionElementWithChildren()}\n </BaseBox>\n </BaseBox>\n {showDivider ? <Divider {...dividerProps} /> : null}\n </BaseBox>\n );\n};\n\nconst BaseHeader = assignWithoutSideEffects(_BaseHeader, {\n componentId: 'BaseHeader',\n});\n\nexport type { BaseHeaderProps };\nexport { BaseHeader };\n"],"names":["commonCenterBoxProps","display","alignItems","justifyContent","centerBoxProps","xlarge","_objectSpread","height","large","medium","absolutePositionedButton","position","top","right","sizeTokensMapping","title","type","propRestrictionMap","Button","size","variant","IconButton","Badge","Link","Text","Amount","useTrailingRestriction","_ref","trailing","_React$useState","React","useState","_React$useState2","_slicedToArray","validatedTrailingComponent","setValidatedTrailingComponent","useEffect","isValidElement","trailingComponentType","getComponentId","restrictedProps","allowedComponents","Object","keys","throwBladeError","message","concat","join","moduleName","restrictedPropKeys","_i","_restrictedPropKeys","length","_trailing$props","prop","props","hasOwnProperty","logger","cloneElement","_BaseHeader","_ref2","subtitle","leading","titleSuffix","_ref2$showDivider","showDivider","_ref2$showBackButton","showBackButton","_ref2$showCloseButton","showCloseButton","onBackButtonClick","onCloseButtonClick","closeButtonRef","backButtonRef","testID","onClickCapture","onKeyDown","onKeyUp","onLostPointerCapture","onPointerCancel","onPointerDown","onPointerMove","onPointerUp","metaComponentName","paddingX","marginY","marginBottom","marginTop","_ref2$size","isDisabled","children","trailingInteractionElement","backgroundImage","_ref2$alignItems","dividerProps","_ref2$shouldAlignLead","shouldAlignLeadingAndTrailingElementsToCenter","rest","_objectWithoutProperties","_excluded","shouldWrapTitle","hasOnlyChildren","webOnlyEventHandlers","isReactNative","renderTrailingInteractionElementWithChildren","_jsx","Box","alignSelf","renderTrailingInteractionElementWithoutChildren","undefined","renderLeadingElement","Boolean","BaseBox","marginRight","renderTrailingElement","_jsxs","metaAttribute","name","makeAnalyticsAttribute","base","m","touchAction","flexDirection","userSelect","overflow","ref","icon","ChevronLeftIcon","onClick","accessibilityLabel","paddingRight","flex","maxWidth","flexShrink","Heading","as","makeSize","sizeToken","weight","color","wordBreak","marginLeft","CloseIcon","width","Divider","BaseHeader","assignWithoutSideEffects","componentId"],"mappings":"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"}
1	+ {"version":3,"file":"BaseHeader.js","sources":["../../../../../../src/components/BaseHeaderFooter/BaseHeader.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport React from 'react';\nimport type { ReactDOMAttributes } from '@use-gesture/react/dist/declarations/src/types';\nimport { Divider } from '~components/Divider';\nimport type { DividerProps } from '~components/Divider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { Heading, Text } from '~components/Typography';\nimport { IconButton } from '~components/Button/IconButton';\nimport { ChevronLeftIcon, CloseIcon } from '~components/Icons';\nimport type { DataAnalyticsAttribute, TestID, ElementTiming } from '~utils/types';\nimport type { BoxProps } from '~components/Box';\nimport { Box } from '~components/Box';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getComponentId } from '~utils/isValidAllowedChildren';\nimport { isReactNative, makeSize } from '~utils';\nimport { metaAttribute } from '~utils/metaAttribute';\nimport { logger, throwBladeError } from '~utils/logger';\nimport { size as sizeToken } from '~tokens/global';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype BaseHeaderProps = {\n title?: string;\n subtitle?: string;\n /\n Leading part of the header placed at the left most side of the header\n /\n leading?: React.ReactNode;\n /\n Trailing part of the header placed at the right most side of the header\n /\n trailing?: React.ReactNode;\n /\n Placed adjacent to the title text\n /\n titleSuffix?: React.ReactNode;\n /\n @default true\n /\n showDivider?: boolean;\n /\n @default false\n /\n showBackButton?: boolean;\n\n /\n Slot for rendering any trailing interaction element into BaseHeader.\n \n E.g. Used in accordion to render CollapsibleChevronIcon\n /\n trailingInteractionElement?: React.ReactNode;\n\n /\n Decides size of the Header\n /\n size?: 'xlarge' \| 'large' \| 'medium';\n /\n @default true\n /\n showCloseButton?: boolean;\n\n /\n Disabled state of BaseHeader\n \n @default false\n /\n isDisabled?: boolean;\n\n paddingX?: BoxProps['paddingX'];\n marginY?: BoxProps['marginY'];\n marginTop?: BoxProps['marginTop'];\n marginBottom?: BoxProps['marginBottom'];\n alignItems?: BoxProps['alignItems'];\n dividerProps?: DividerProps;\n\n onCloseButtonClick?: () => void;\n onBackButtonClick?: () => void;\n closeButtonRef?: React.MutableRefObject<any>;\n backButtonRef?: React.MutableRefObject<any>;\n metaComponentName?: string;\n /\n inner child of BottomSheetHeader. Meant to be used for AutoComplete only\n /\n children?: React.ReactElement \| React.ReactElement[];\n /\n Background image of the header\n \n You can use this for adding gradients.\n /\n backgroundImage?: BoxProps['backgroundImage'];\n /\n So we add a wrapper with custom styles in elements like leading, trailing interaction elements and trailing.\n * this props allows you to control that.\n \n For example, in Accordion, we add a wrapper with flex to center the icon (in some cases)\n \n @default false\n */\n shouldAlignLeadingAndTrailingElementsToCenter?: boolean;\n} & Pick<\n ReactDOMAttributes,\n \| 'onClickCapture'\n \| 'onKeyDown'\n \| 'onKeyUp'\n \| 'onLostPointerCapture'\n \| 'onPointerCancel'\n \| 'onPointerDown'\n \| 'onPointerMove'\n \| 'onPointerUp'\n> &\n TestID &\n ElementTiming &\n DataAnalyticsAttribute;\n\ntype TrailingComponents = 'Button' \| 'Badge' \| 'Link' \| 'Text' \| 'Amount';\n\nconst commonCenterBoxProps: BoxProps = {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n};\n\nconst centerBoxProps: { xlarge: BoxProps; large: BoxProps; medium: BoxProps } = {\n xlarge: {\n ...commonCenterBoxProps,\n height: '28px',\n },\n large: {\n ...commonCenterBoxProps,\n // We want to align title, icon, titleSuffix, trailing, closeButton to baseline\n // But we also want to keep them center aligned to each other\n // So we add a virtual Box around these slots with 28px and center align them to that box\n // We have done similar thing in figma as well (which is where this 28px comes from)\n height: '28px',\n },\n medium: {\n ...commonCenterBoxProps,\n height: '20px',\n },\n};\n\nconst absolutePositionedButton = {\n position: 'absolute',\n top: 'spacing.0',\n right: 'spacing.0',\n} as const;\n\nconst sizeTokensMapping = {\n xlarge: {\n title: 'small',\n type: 'heading',\n },\n large: {\n title: 'large',\n type: 'text',\n },\n medium: {\n title: 'medium',\n type: 'text',\n },\n} as const;\n\n// prop restriction map for corresponding sub components\nconst propRestrictionMap = {\n large: {\n Button: {\n size: 'xsmall',\n variant: 'tertiary',\n },\n IconButton: {\n size: 'large',\n },\n Badge: {\n size: 'medium',\n },\n Link: {\n size: 'medium',\n },\n Text: {\n size: 'medium',\n variant: 'body',\n },\n Amount: {\n type: 'body',\n size: 'medium',\n },\n },\n xlarge: {\n Button: {\n size: 'xsmall',\n variant: 'tertiary',\n },\n IconButton: {\n size: 'large',\n },\n Badge: {\n size: 'medium',\n },\n Link: {\n size: 'medium',\n },\n Text: {\n size: 'medium',\n variant: 'body',\n },\n Amount: {\n type: 'body',\n size: 'medium',\n },\n },\n medium: {\n Button: {\n size: 'xsmall',\n variant: 'tertiary',\n },\n IconButton: {\n size: 'large',\n },\n Badge: {\n size: 'small',\n },\n Link: {\n size: 'small',\n },\n Text: {\n size: 'small',\n variant: 'body',\n },\n Amount: {\n type: 'body',\n size: 'small',\n },\n },\n} as const;\n\nconst useTrailingRestriction = ({\n trailing,\n size,\n}: {\n size: NonNullable<BaseHeaderProps['size']>;\n trailing: BaseHeaderProps['trailing'];\n}): React.ReactNode => {\n const [\n validatedTrailingComponent,\n setValidatedTrailingComponent,\n ] = React.useState<React.ReactElement \| null>(null);\n\n // validate and restrict sub component props in trailing prop\n React.useEffect(() => {\n if (React.isValidElement(trailing)) {\n const trailingComponentType = getComponentId(trailing) as TrailingComponents;\n const restrictedProps = propRestrictionMap[size][trailingComponentType];\n\n const allowedComponents = Object.keys(propRestrictionMap[size]);\n if (__DEV__) {\n if (!restrictedProps) {\n throwBladeError({\n message: `Only one of \\`${allowedComponents.join(\n ', ',\n )}\\` component is accepted as trailing`,\n moduleName: 'Header',\n });\n }\n }\n\n const restrictedPropKeys = Object.keys(propRestrictionMap[size][trailingComponentType]);\n for (const prop of restrictedPropKeys) {\n if (trailing?.props?.hasOwnProperty(prop)) {\n logger({\n message: `Do not pass \"${prop}\" to \"${trailingComponentType}\" while inside Header trailing, because we override it.`,\n moduleName: 'Header',\n type: 'warn',\n });\n }\n }\n setValidatedTrailingComponent(\n React.cloneElement(trailing as React.ReactElement, restrictedProps),\n );\n }\n }, [trailing, size]);\n\n return validatedTrailingComponent;\n};\n\nconst _BaseHeader = ({\n title,\n subtitle,\n leading,\n titleSuffix,\n trailing,\n showDivider = true,\n showBackButton = false,\n showCloseButton = true,\n onBackButtonClick,\n onCloseButtonClick,\n closeButtonRef,\n backButtonRef,\n testID,\n onClickCapture,\n onKeyDown,\n onKeyUp,\n onLostPointerCapture,\n onPointerCancel,\n onPointerDown,\n onPointerMove,\n onPointerUp,\n metaComponentName,\n paddingX,\n marginY,\n marginBottom,\n marginTop,\n size = 'large',\n isDisabled,\n children,\n trailingInteractionElement,\n backgroundImage,\n alignItems = 'flex-start',\n dividerProps,\n shouldAlignLeadingAndTrailingElementsToCenter = false,\n ...rest\n}: BaseHeaderProps): React.ReactElement => {\n const validatedTrailingComponent = useTrailingRestriction({ trailing, size });\n const shouldWrapTitle = titleSuffix && trailing && showBackButton && showCloseButton;\n const hasOnlyChildren = children && !(title \|\| subtitle \|\| titleSuffix \|\| leading);\n\n const webOnlyEventHandlers: Record<string, any> = isReactNative()\n ? {}\n : {\n onClickCapture,\n onKeyDown,\n onKeyUp,\n onLostPointerCapture,\n onPointerCancel,\n onPointerDown,\n onPointerMove,\n onPointerUp,\n };\n\n const renderTrailingInteractionElementWithChildren = (): React.ReactNode => {\n if (trailingInteractionElement && children) {\n return (\n <Box\n alignSelf={shouldAlignLeadingAndTrailingElementsToCenter ? 'center' : 'flex-start'}\n {...centerBoxProps[size]}\n >\n {trailingInteractionElement}\n </Box>\n );\n }\n return null;\n };\n\n const renderTrailingInteractionElementWithoutChildren = (): React.ReactNode => {\n if (trailingInteractionElement && !children) {\n return (\n <Box\n {...centerBoxProps[size]}\n alignSelf={shouldAlignLeadingAndTrailingElementsToCenter ? 'center' : undefined}\n >\n {trailingInteractionElement}\n </Box>\n );\n }\n return null;\n };\n\n const renderLeadingElement = (): React.ReactNode => {\n if (Boolean(leading)) {\n return (\n <BaseBox\n marginRight=\"spacing.3\"\n {...centerBoxProps[size]}\n alignSelf={shouldAlignLeadingAndTrailingElementsToCenter ? 'center' : undefined}\n >\n {leading}\n </BaseBox>\n );\n }\n return null;\n };\n\n const renderTrailingElement = (): React.ReactNode => {\n if (shouldAlignLeadingAndTrailingElementsToCenter && validatedTrailingComponent) {\n return (\n <BaseBox marginRight=\"spacing.5\" display=\"flex\" alignItems=\"center\" justifyContent=\"center\">\n <Box {...centerBoxProps[size]}>{validatedTrailingComponent}</Box>\n </BaseBox>\n );\n }\n if (validatedTrailingComponent) {\n return (\n <BaseBox marginRight=\"spacing.5\">\n <Box {...centerBoxProps[size]}>{validatedTrailingComponent}</Box>\n </BaseBox>\n );\n }\n return null;\n };\n\n return (\n <BaseBox\n {...metaAttribute({ name: metaComponentName, testID })}\n {...makeAnalyticsAttribute(rest)}\n backgroundImage={backgroundImage}\n >\n <BaseBox\n marginY={marginY ?? { base: 'spacing.5', m: 'spacing.6' }}\n paddingX={paddingX ?? { base: 'spacing.5', m: 'spacing.6' }}\n marginTop={marginTop}\n marginBottom={marginBottom}\n touchAction=\"none\"\n {...webOnlyEventHandlers}\n >\n <BaseBox position=\"relative\" display=\"flex\" flexDirection=\"row\" userSelect=\"none\">\n {showBackButton ? (\n <BaseBox overflow=\"visible\" marginRight=\"spacing.5\">\n <Box {...centerBoxProps[size]}>\n <IconButton\n ref={backButtonRef}\n size=\"large\"\n icon={ChevronLeftIcon}\n onClick={() => onBackButtonClick?.()}\n accessibilityLabel=\"Back\"\n />\n </Box>\n </BaseBox>\n ) : null}\n {hasOnlyChildren ? null : (\n <BaseBox\n paddingRight=\"spacing.5\"\n marginRight=\"auto\"\n flex=\"auto\"\n display=\"flex\"\n flexDirection=\"row\"\n alignItems={alignItems}\n >\n {renderLeadingElement()}\n <BaseBox flex=\"auto\">\n <BaseBox\n // Explicitly setting maxWidth in React Native because text is not being wrapped properly when multiple fix width components are rendered in header\n // In web, flex containers seem to work a expected\n // @todo: resolve this if we figure out some better solution later\n maxWidth={isReactNative() && shouldWrapTitle ? '100px' : undefined}\n flexShrink={0}\n display=\"flex\"\n flexDirection=\"row\"\n >\n {title ? (\n sizeTokensMapping[size].type === 'heading' ? (\n <Heading\n as=\"h2\"\n marginTop={makeSize(sizeToken['1'])}\n size={sizeTokensMapping[size].title}\n weight=\"semibold\"\n color={\n isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.normal'\n }\n wordBreak=\"break-word\"\n >\n {title}\n </Heading>\n ) : (\n <Text\n size={sizeTokensMapping[size].title}\n marginTop={makeSize(sizeToken['1'])}\n weight=\"semibold\"\n color={\n isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.normal'\n }\n wordBreak=\"break-word\"\n >\n {title}\n </Text>\n )\n ) : null}\n {titleSuffix && (\n <BaseBox marginLeft=\"spacing.3\">\n <Box {...centerBoxProps[size]}>{titleSuffix}</Box>\n </BaseBox>\n )}\n </BaseBox>\n {subtitle ? (\n <Text\n variant=\"body\"\n size=\"small\"\n weight=\"regular\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.muted'}\n >\n {subtitle}\n </Text>\n ) : null}\n </BaseBox>\n </BaseBox>\n )}\n {renderTrailingElement()}\n\n {showCloseButton ? (\n <Box {...(hasOnlyChildren ? absolutePositionedButton : centerBoxProps[size])}>\n <IconButton\n ref={closeButtonRef}\n size=\"large\"\n icon={CloseIcon}\n accessibilityLabel=\"Close\"\n onClick={() => onCloseButtonClick?.()}\n />\n </Box>\n ) : null}\n {renderTrailingInteractionElementWithoutChildren()}\n </BaseBox>\n <BaseBox\n display=\"flex\"\n width=\"100%\"\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n >\n <Box width=\"100%\">{children}</Box>\n {renderTrailingInteractionElementWithChildren()}\n </BaseBox>\n </BaseBox>\n {showDivider ? <Divider {...dividerProps} /> : null}\n </BaseBox>\n );\n};\n\nconst BaseHeader = assignWithoutSideEffects(_BaseHeader, {\n componentId: 'BaseHeader',\n});\n\nexport type { BaseHeaderProps };\nexport { BaseHeader };\n"],"names":["commonCenterBoxProps","display","alignItems","justifyContent","centerBoxProps","xlarge","_objectSpread","height","large","medium","absolutePositionedButton","position","top","right","sizeTokensMapping","title","type","propRestrictionMap","Button","size","variant","IconButton","Badge","Link","Text","Amount","useTrailingRestriction","_ref","trailing","_React$useState","React","useState","_React$useState2","_slicedToArray","validatedTrailingComponent","setValidatedTrailingComponent","useEffect","isValidElement","trailingComponentType","getComponentId","restrictedProps","allowedComponents","Object","keys","throwBladeError","message","concat","join","moduleName","restrictedPropKeys","_i","_restrictedPropKeys","length","_trailing$props","prop","props","hasOwnProperty","logger","cloneElement","_BaseHeader","_ref2","subtitle","leading","titleSuffix","_ref2$showDivider","showDivider","_ref2$showBackButton","showBackButton","_ref2$showCloseButton","showCloseButton","onBackButtonClick","onCloseButtonClick","closeButtonRef","backButtonRef","testID","onClickCapture","onKeyDown","onKeyUp","onLostPointerCapture","onPointerCancel","onPointerDown","onPointerMove","onPointerUp","metaComponentName","paddingX","marginY","marginBottom","marginTop","_ref2$size","isDisabled","children","trailingInteractionElement","backgroundImage","_ref2$alignItems","dividerProps","_ref2$shouldAlignLead","shouldAlignLeadingAndTrailingElementsToCenter","rest","_objectWithoutProperties","_excluded","shouldWrapTitle","hasOnlyChildren","webOnlyEventHandlers","isReactNative","renderTrailingInteractionElementWithChildren","_jsx","Box","alignSelf","renderTrailingInteractionElementWithoutChildren","undefined","renderLeadingElement","Boolean","BaseBox","marginRight","renderTrailingElement","_jsxs","metaAttribute","name","makeAnalyticsAttribute","base","m","touchAction","flexDirection","userSelect","overflow","ref","icon","ChevronLeftIcon","onClick","accessibilityLabel","paddingRight","flex","maxWidth","flexShrink","Heading","as","makeSize","sizeToken","weight","color","wordBreak","marginLeft","CloseIcon","width","Divider","BaseHeader","assignWithoutSideEffects","componentId"],"mappings":"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"}

package/build/lib/web/development/components/Box/BaseBox/types/propsTypes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"propsTypes.js","sources":["../../../../../../../../src/components/Box/BaseBox/types/propsTypes.ts"],"sourcesContent":["import type { View } from 'react-native';\nimport type { CSSObject } from 'styled-components';\nimport type { MarginProps, PaddingProps, SpacingValueType } from './spacingTypes';\nimport type { MakeObjectResponsive } from './responsiveTypes';\nimport type { Theme } from '~components/BladeProvider';\nimport type { Border, Elevation } from '~tokens/global';\nimport type { DataAnalyticsAttribute, PickCSSByPlatform, TestID } from '~utils/types';\nimport type { Platform } from '~utils';\nimport type { BladeCommonEvents } from '~components/types';\nimport type { DotNotationToken } from '~utils/lodashButBetter/get';\n\ntype LayoutProps = MakeObjectResponsive<\n {\n height: SpacingValueType;\n minHeight: SpacingValueType;\n maxHeight: SpacingValueType;\n width: SpacingValueType;\n minWidth: SpacingValueType;\n maxWidth: SpacingValueType;\n } & PickCSSByPlatform<\n 'display' \| 'overflow' \| 'overflowX' \| 'overflowY' \| 'textAlign' \| 'whiteSpace'\n >\n>;\n\ntype FlexboxProps = MakeObjectResponsive<\n {\n /*\n This uses the native gap property which might not work on older browsers.\n * If you want to support older browsers, you might want to use `margin` instead.\n \n @see https://caniuse.com/?search=gap\n /\n gap: SpacingValueType;\n /\n This uses the native row-gap property which might not work on older browsers.\n * If you want to support older browsers, you might want to use `margin` instead.\n \n @see https://caniuse.com/?search=row-gap\n /\n rowGap: SpacingValueType;\n /\n This uses the native column-gap property which might not work on older browsers.\n * If you want to support older browsers, you might want to use `margin` instead.\n \n @see https://caniuse.com/?search=column-gap\n /\n columnGap: SpacingValueType;\n /\n The `flex` CSS shorthand property sets how a flex _item_ will grow or shrink to fit the space available in its flex container.\n \n @see https://developer.mozilla.org/docs/Web/CSS/flex\n /\n flex: string \| number;\n } & PickCSSByPlatform<\n \| 'flexWrap'\n \| 'flexDirection'\n \| 'flexGrow'\n \| 'flexShrink'\n \| 'flexBasis'\n \| 'alignItems'\n \| 'alignContent'\n \| 'alignSelf'\n \| 'justifyItems'\n \| 'justifyContent'\n \| 'justifySelf'\n \| 'placeSelf'\n \| 'placeItems'\n \| 'order'\n >\n>;\n\ntype PositionProps = MakeObjectResponsive<\n {\n top: SpacingValueType;\n right: SpacingValueType;\n bottom: SpacingValueType;\n left: SpacingValueType;\n } & PickCSSByPlatform<'position' \| 'zIndex'>\n>;\n\ntype GridProps = MakeObjectResponsive<\n PickCSSByPlatform<\n \| 'grid'\n \| 'gridColumn'\n \| 'gridRow'\n \| 'gridRowStart'\n \| 'gridRowEnd'\n \| 'gridColumnStart'\n \| 'gridColumnEnd'\n \| 'gridArea'\n \| 'gridAutoFlow'\n \| 'gridAutoRows'\n \| 'gridAutoColumns'\n \| 'gridTemplate'\n \| 'gridTemplateAreas'\n \| 'gridTemplateColumns'\n \| 'gridTemplateRows'\n >\n>;\n\ntype ColorObjects = 'feedback' \| 'surface' \| 'interactive';\ntype BorderOnlyColorObjects = 'popup';\ntype BackgroundOnlyColorObjects = 'popup' \| 'overlay';\ntype BackgroundColorString<\n T extends ColorObjects \| BackgroundOnlyColorObjects\n> = `${T}.background.${DotNotationToken<Theme['colors'][T]['background']>}`;\ntype BorderColorString<\n T extends ColorObjects \| BorderOnlyColorObjects\n> = `${T}.border.${DotNotationToken<Theme['colors'][T]['border']>}`;\n\n// Created this as an array so I can reuse it for runtime validation\nconst validBoxAsValues = [\n 'div',\n 'section',\n 'footer',\n 'header',\n 'main',\n 'aside',\n 'nav',\n 'span',\n 'label',\n] as const;\n\ntype BoxAsType = typeof validBoxAsValues[number];\n\n// Visual props that are common for both Box and BaseBox\ntype CommonBoxVisualProps = MakeObjectResponsive<\n {\n borderRadius: keyof Border['radius'];\n borderWidth: keyof Border['width'];\n borderColor:\n \| BorderColorString<'surface'>\n \| BorderColorString<'popup'>\n \| BorderColorString<'interactive'>;\n borderTopWidth: keyof Border['width'];\n borderTopColor: BorderColorString<'surface'>;\n borderRightWidth: keyof Border['width'];\n borderRightColor: BorderColorString<'surface'>;\n borderBottomWidth: keyof Border['width'];\n borderBottomColor: BorderColorString<'surface'>;\n borderLeftWidth: keyof Border['width'];\n borderLeftColor: BorderColorString<'surface'>;\n borderTopLeftRadius: keyof Border['radius'];\n borderTopRightRadius: keyof Border['radius'];\n borderBottomRightRadius: keyof Border['radius'];\n borderBottomLeftRadius: keyof Border['radius'];\n } & PickCSSByPlatform<\n \| 'backgroundImage'\n \| 'backgroundSize'\n \| 'backgroundPosition'\n \| 'backgroundOrigin'\n \| 'backgroundRepeat'\n \| 'pointerEvents'\n \| 'opacity'\n \| 'visibility'\n \| 'transform'\n \| 'transformOrigin'\n \| 'clipPath'\n \| 'borderStyle'\n \| 'borderTopStyle'\n \| 'borderBottomStyle'\n \| 'borderLeftStyle'\n \| 'borderRightStyle'\n \| 'backdropFilter'\n \| 'transition'\n > & {\n /\n Sets the elevation for Box\n \n eg: `theme.elevation.midRaised`\n \n @default `theme.elevation.lowRaised`\n \n Links:\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-elevation--docs\n /\n elevation?: keyof Elevation;\n }\n>;\n\n// Visual props that are specific BaseBox\n// This is used to ensure some of the more flexible BaseBox props are not passed to Box\ntype BaseBoxVisualProps = MakeObjectResponsive<\n {\n backgroundColor:\n \| BackgroundColorString<'feedback'>\n \| BackgroundColorString<'surface'>\n \| BackgroundColorString<'interactive'>\n \| BackgroundColorString<'overlay'>\n \| BackgroundColorString<'popup'>\n \| 'transparent'\n \| (string & Record<never, never>);\n lineHeight: SpacingValueType;\n touchAction: CSSObject['touchAction'];\n userSelect: CSSObject['userSelect'];\n } & PickCSSByPlatform<\n \| 'border'\n \| 'borderLeft'\n \| 'borderRight'\n \| 'borderTop'\n \| 'borderBottom'\n \| 'opacity'\n \| 'pointerEvents'\n \| 'cursor'\n >\n>;\n\n// Visual props that are specific to Box\ntype BoxVisualProps = MakeObjectResponsive<{\n backgroundColor:\n \| BackgroundColorString<'surface'>\n \| BackgroundColorString<'overlay'>\n \| BackgroundColorString<'feedback'>\n \| 'transparent';\n}> & {\n // Intentionally keeping this outside of MakeObjectResponsive since we only want as to be string and not responsive object\n // styled-components do not support passing `as` prop as an object\n as: BoxAsType;\n};\n\ntype StyledPropsBlade = Partial<\n Omit<\n MarginProps &\n Pick<FlexboxProps, 'alignSelf' \| 'justifySelf' \| 'placeSelf' \| 'order' \| 'flexWrap'> &\n PositionProps &\n Pick<\n GridProps,\n \| 'gridColumn'\n \| 'gridRow'\n \| 'gridRowStart'\n \| 'gridRowEnd'\n \| 'gridColumnStart'\n \| 'gridColumnEnd'\n \| 'gridArea'\n > &\n Pick<LayoutProps, 'display'> &\n Pick<CommonBoxVisualProps, 'visibility'>,\n '__brand__'\n >\n>;\n\ntype BoxCallbackProps = Omit<\n Platform.Select<{\n web: {\n /\n Warning\n \n Make sure to not use Box when you want to create a trigger that performs action on hover.\n * You would probably want to render it as `button` using `styled.button` instead.\n \n Use this for hoverable containers in cases like custom menus.\n /\n onMouseOver: React.MouseEventHandler<HTMLElement>;\n /\n Warning\n \n Make sure to not use Box when you want to create a trigger that performs action on hover.\n * You would probably want to render it as `button` using `styled.button` instead.\n \n Use this for hoverable containers in cases like custom menus.\n /\n onMouseEnter: React.MouseEventHandler<HTMLElement>;\n /\n Warning\n \n Make sure to not use Box when you want to create a trigger that performs action on hover.\n * You would probably want to render it as `button` using `styled.button` instead.\n \n Use this for hoverable containers in cases like custom menus.\n */\n onMouseLeave: React.MouseEventHandler<HTMLElement>;\n onScroll: React.UIEventHandler<HTMLElement>;\n };\n native: Record<'onMouseOver' \| 'onMouseEnter' \| 'onMouseLeave' \| 'onScroll', undefined>;\n }>,\n '__brand__'\n>;\n\ntype BoxDragAndDropProps = Omit<\n Platform.Select<{\n web: {\n draggable: boolean;\n onDragStart: React.DragEventHandler<HTMLElement>;\n onDragEnter: React.DragEventHandler<HTMLElement>;\n onDragLeave: React.DragEventHandler<HTMLElement>;\n onDragOver: React.DragEventHandler<HTMLElement>;\n onDragEnd: React.DragEventHandler<HTMLElement>;\n onDrop: React.DragEventHandler<HTMLElement>;\n };\n native: Record<\n \| 'draggable'\n \| 'onDragStart'\n \| 'onDragEnter'\n \| 'onDragLeave'\n \| 'onDragOver'\n \| 'onDragEnd'\n \| 'onDrop',\n undefined\n >;\n }>,\n '__brand__'\n>;\n\ntype BoxProps = Partial<\n PaddingProps &\n MarginProps &\n LayoutProps &\n FlexboxProps &\n PositionProps &\n GridProps &\n BoxCallbackProps &\n BoxDragAndDropProps &\n CommonBoxVisualProps &\n BoxVisualProps & {\n children?: React.ReactNode \| React.ReactNode[];\n tabIndex?: number;\n id?: string;\n } & TestID &\n DataAnalyticsAttribute\n>;\n\n// Visual props have different types for BaseBox and Box. BaseBox has more flexible types and more props exposed.\n// So first we Omit Visual props of Box\n// Then we append BaseBoxVisualProps and some other props for styled-components like class and id\ntype BaseBoxProps = Omit<BoxProps, keyof BoxVisualProps> &\n Partial<\n DataAnalyticsAttribute &\n BaseBoxVisualProps & {\n className?: string;\n id?: string;\n tabIndex?: number;\n }\n > &\n BladeCommonEvents;\n\n// ref prop type\ntype BoxRefType = Platform.Select<{\n web: Omit<HTMLElement, 'style'>;\n native: View;\n}>;\n\nexport type { BaseBoxProps, BoxProps, BoxRefType, StyledPropsBlade, FlexboxProps, GridProps };\nexport { validBoxAsValues };\n"],"names":["validBoxAsValues"],"mappings":"AA8GA;AACMA,IAAAA,gBAAgB,GAAG,CACvB,KAAK,EACL,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,OAAO,EACP,KAAK,EACL,MAAM,EACN,OAAO;;;;"}
1	+ {"version":3,"file":"propsTypes.js","sources":["../../../../../../../../src/components/Box/BaseBox/types/propsTypes.ts"],"sourcesContent":["import type { View } from 'react-native';\nimport type { CSSObject } from 'styled-components';\nimport type { MarginProps, PaddingProps, SpacingValueType } from './spacingTypes';\nimport type { MakeObjectResponsive } from './responsiveTypes';\nimport type { Theme } from '~components/BladeProvider';\nimport type { Border, Elevation } from '~tokens/global';\nimport type {\n DataAnalyticsAttribute,\n PickCSSByPlatform,\n TestID,\n ElementTiming,\n} from '~utils/types';\nimport type { Platform } from '~utils';\nimport type { BladeCommonEvents } from '~components/types';\nimport type { DotNotationToken } from '~utils/lodashButBetter/get';\n\ntype LayoutProps = MakeObjectResponsive<\n {\n height: SpacingValueType;\n minHeight: SpacingValueType;\n maxHeight: SpacingValueType;\n width: SpacingValueType;\n minWidth: SpacingValueType;\n maxWidth: SpacingValueType;\n } & PickCSSByPlatform<\n 'display' \| 'overflow' \| 'overflowX' \| 'overflowY' \| 'textAlign' \| 'whiteSpace'\n >\n>;\n\ntype FlexboxProps = MakeObjectResponsive<\n {\n /*\n This uses the native gap property which might not work on older browsers.\n * If you want to support older browsers, you might want to use `margin` instead.\n \n @see https://caniuse.com/?search=gap\n /\n gap: SpacingValueType;\n /\n This uses the native row-gap property which might not work on older browsers.\n * If you want to support older browsers, you might want to use `margin` instead.\n \n @see https://caniuse.com/?search=row-gap\n /\n rowGap: SpacingValueType;\n /\n This uses the native column-gap property which might not work on older browsers.\n * If you want to support older browsers, you might want to use `margin` instead.\n \n @see https://caniuse.com/?search=column-gap\n /\n columnGap: SpacingValueType;\n /\n The `flex` CSS shorthand property sets how a flex _item_ will grow or shrink to fit the space available in its flex container.\n \n @see https://developer.mozilla.org/docs/Web/CSS/flex\n /\n flex: string \| number;\n } & PickCSSByPlatform<\n \| 'flexWrap'\n \| 'flexDirection'\n \| 'flexGrow'\n \| 'flexShrink'\n \| 'flexBasis'\n \| 'alignItems'\n \| 'alignContent'\n \| 'alignSelf'\n \| 'justifyItems'\n \| 'justifyContent'\n \| 'justifySelf'\n \| 'placeSelf'\n \| 'placeItems'\n \| 'order'\n >\n>;\n\ntype PositionProps = MakeObjectResponsive<\n {\n top: SpacingValueType;\n right: SpacingValueType;\n bottom: SpacingValueType;\n left: SpacingValueType;\n } & PickCSSByPlatform<'position' \| 'zIndex'>\n>;\n\ntype GridProps = MakeObjectResponsive<\n PickCSSByPlatform<\n \| 'grid'\n \| 'gridColumn'\n \| 'gridRow'\n \| 'gridRowStart'\n \| 'gridRowEnd'\n \| 'gridColumnStart'\n \| 'gridColumnEnd'\n \| 'gridArea'\n \| 'gridAutoFlow'\n \| 'gridAutoRows'\n \| 'gridAutoColumns'\n \| 'gridTemplate'\n \| 'gridTemplateAreas'\n \| 'gridTemplateColumns'\n \| 'gridTemplateRows'\n >\n>;\n\ntype ColorObjects = 'feedback' \| 'surface' \| 'interactive';\ntype BorderOnlyColorObjects = 'popup';\ntype BackgroundOnlyColorObjects = 'popup' \| 'overlay';\ntype BackgroundColorString<\n T extends ColorObjects \| BackgroundOnlyColorObjects\n> = `${T}.background.${DotNotationToken<Theme['colors'][T]['background']>}`;\ntype BorderColorString<\n T extends ColorObjects \| BorderOnlyColorObjects\n> = `${T}.border.${DotNotationToken<Theme['colors'][T]['border']>}`;\n\n// Created this as an array so I can reuse it for runtime validation\nconst validBoxAsValues = [\n 'div',\n 'section',\n 'footer',\n 'header',\n 'main',\n 'aside',\n 'nav',\n 'span',\n 'label',\n] as const;\n\ntype BoxAsType = typeof validBoxAsValues[number];\n\n// Visual props that are common for both Box and BaseBox\ntype CommonBoxVisualProps = MakeObjectResponsive<\n {\n borderRadius: keyof Border['radius'];\n borderWidth: keyof Border['width'];\n borderColor:\n \| BorderColorString<'surface'>\n \| BorderColorString<'popup'>\n \| BorderColorString<'interactive'>;\n borderTopWidth: keyof Border['width'];\n borderTopColor: BorderColorString<'surface'>;\n borderRightWidth: keyof Border['width'];\n borderRightColor: BorderColorString<'surface'>;\n borderBottomWidth: keyof Border['width'];\n borderBottomColor: BorderColorString<'surface'>;\n borderLeftWidth: keyof Border['width'];\n borderLeftColor: BorderColorString<'surface'>;\n borderTopLeftRadius: keyof Border['radius'];\n borderTopRightRadius: keyof Border['radius'];\n borderBottomRightRadius: keyof Border['radius'];\n borderBottomLeftRadius: keyof Border['radius'];\n } & PickCSSByPlatform<\n \| 'backgroundImage'\n \| 'backgroundSize'\n \| 'backgroundPosition'\n \| 'backgroundOrigin'\n \| 'backgroundRepeat'\n \| 'pointerEvents'\n \| 'opacity'\n \| 'visibility'\n \| 'transform'\n \| 'transformOrigin'\n \| 'clipPath'\n \| 'borderStyle'\n \| 'borderTopStyle'\n \| 'borderBottomStyle'\n \| 'borderLeftStyle'\n \| 'borderRightStyle'\n \| 'backdropFilter'\n \| 'transition'\n > & {\n /\n Sets the elevation for Box\n \n eg: `theme.elevation.midRaised`\n \n @default `theme.elevation.lowRaised`\n \n Links:\n * - Docs: https://blade.razorpay.com/?path=/docs/tokens-elevation--docs\n /\n elevation?: keyof Elevation;\n }\n>;\n\n// Visual props that are specific BaseBox\n// This is used to ensure some of the more flexible BaseBox props are not passed to Box\ntype BaseBoxVisualProps = MakeObjectResponsive<\n {\n backgroundColor:\n \| BackgroundColorString<'feedback'>\n \| BackgroundColorString<'surface'>\n \| BackgroundColorString<'interactive'>\n \| BackgroundColorString<'overlay'>\n \| BackgroundColorString<'popup'>\n \| 'transparent'\n \| (string & Record<never, never>);\n lineHeight: SpacingValueType;\n touchAction: CSSObject['touchAction'];\n userSelect: CSSObject['userSelect'];\n } & PickCSSByPlatform<\n \| 'border'\n \| 'borderLeft'\n \| 'borderRight'\n \| 'borderTop'\n \| 'borderBottom'\n \| 'opacity'\n \| 'pointerEvents'\n \| 'cursor'\n >\n>;\n\n// Visual props that are specific to Box\ntype BoxVisualProps = MakeObjectResponsive<{\n backgroundColor:\n \| BackgroundColorString<'surface'>\n \| BackgroundColorString<'overlay'>\n \| BackgroundColorString<'feedback'>\n \| 'transparent';\n}> & {\n // Intentionally keeping this outside of MakeObjectResponsive since we only want as to be string and not responsive object\n // styled-components do not support passing `as` prop as an object\n as: BoxAsType;\n};\n\ntype StyledPropsBlade = Partial<\n Omit<\n MarginProps &\n Pick<FlexboxProps, 'alignSelf' \| 'justifySelf' \| 'placeSelf' \| 'order' \| 'flexWrap'> &\n PositionProps &\n Pick<\n GridProps,\n \| 'gridColumn'\n \| 'gridRow'\n \| 'gridRowStart'\n \| 'gridRowEnd'\n \| 'gridColumnStart'\n \| 'gridColumnEnd'\n \| 'gridArea'\n > &\n Pick<LayoutProps, 'display'> &\n Pick<CommonBoxVisualProps, 'visibility'>,\n '__brand__'\n >\n>;\n\ntype BoxCallbackProps = Omit<\n Platform.Select<{\n web: {\n /\n Warning\n \n Make sure to not use Box when you want to create a trigger that performs action on hover.\n * You would probably want to render it as `button` using `styled.button` instead.\n \n Use this for hoverable containers in cases like custom menus.\n /\n onMouseOver: React.MouseEventHandler<HTMLElement>;\n /\n Warning\n \n Make sure to not use Box when you want to create a trigger that performs action on hover.\n * You would probably want to render it as `button` using `styled.button` instead.\n \n Use this for hoverable containers in cases like custom menus.\n /\n onMouseEnter: React.MouseEventHandler<HTMLElement>;\n /\n Warning\n \n Make sure to not use Box when you want to create a trigger that performs action on hover.\n * You would probably want to render it as `button` using `styled.button` instead.\n \n Use this for hoverable containers in cases like custom menus.\n */\n onMouseLeave: React.MouseEventHandler<HTMLElement>;\n onScroll: React.UIEventHandler<HTMLElement>;\n };\n native: Record<'onMouseOver' \| 'onMouseEnter' \| 'onMouseLeave' \| 'onScroll', undefined>;\n }>,\n '__brand__'\n>;\n\ntype BoxDragAndDropProps = Omit<\n Platform.Select<{\n web: {\n draggable: boolean;\n onDragStart: React.DragEventHandler<HTMLElement>;\n onDragEnter: React.DragEventHandler<HTMLElement>;\n onDragLeave: React.DragEventHandler<HTMLElement>;\n onDragOver: React.DragEventHandler<HTMLElement>;\n onDragEnd: React.DragEventHandler<HTMLElement>;\n onDrop: React.DragEventHandler<HTMLElement>;\n };\n native: Record<\n \| 'draggable'\n \| 'onDragStart'\n \| 'onDragEnter'\n \| 'onDragLeave'\n \| 'onDragOver'\n \| 'onDragEnd'\n \| 'onDrop',\n undefined\n >;\n }>,\n '__brand__'\n>;\n\ntype BoxProps = Partial<\n PaddingProps &\n MarginProps &\n LayoutProps &\n FlexboxProps &\n PositionProps &\n GridProps &\n BoxCallbackProps &\n BoxDragAndDropProps &\n CommonBoxVisualProps &\n BoxVisualProps & {\n children?: React.ReactNode \| React.ReactNode[];\n tabIndex?: number;\n id?: string;\n } & TestID &\n ElementTiming &\n DataAnalyticsAttribute\n>;\n\n// Visual props have different types for BaseBox and Box. BaseBox has more flexible types and more props exposed.\n// So first we Omit Visual props of Box\n// Then we append BaseBoxVisualProps and some other props for styled-components like class and id\ntype BaseBoxProps = Omit<BoxProps, keyof BoxVisualProps> &\n Partial<\n DataAnalyticsAttribute &\n BaseBoxVisualProps & {\n className?: string;\n id?: string;\n tabIndex?: number;\n } & ElementTiming\n > &\n BladeCommonEvents;\n\n// ref prop type\ntype BoxRefType = Platform.Select<{\n web: Omit<HTMLElement, 'style'>;\n native: View;\n}>;\n\nexport type { BaseBoxProps, BoxProps, BoxRefType, StyledPropsBlade, FlexboxProps, GridProps };\nexport { validBoxAsValues };\n"],"names":["validBoxAsValues"],"mappings":"AAmHA;AACMA,IAAAA,gBAAgB,GAAG,CACvB,KAAK,EACL,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,OAAO,EACP,KAAK,EACL,MAAM,EACN,OAAO;;;;"}

package/build/lib/web/development/components/Box/Box.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Box.js","sources":["../../../../../../src/components/Box/Box.tsx"],"sourcesContent":["import React from 'react';\nimport BaseBox from './BaseBox';\nimport type { BoxProps, BoxRefType, MakeValueResponsive } from './BaseBox/types';\nimport { validBoxAsValues } from './BaseBox/types/propsTypes';\nimport type { KeysRequired } from '~utils/types';\nimport { isReactNative } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst validateBackgroundString = (stringBackgroundColorValue: string): void => {\n if (__DEV__) {\n if (\n !stringBackgroundColorValue.startsWith('surface.background') &&\n !stringBackgroundColorValue.startsWith('overlay.') &&\n !stringBackgroundColorValue.startsWith('feedback.background') &&\n stringBackgroundColorValue !== 'transparent'\n ) {\n throwBladeError({\n message: `Oops! Currently you can only use \\`transparent\\`, \\`surface.background.\\`, and \\`overlay.\\` tokens with backgroundColor property but we received \\`${stringBackgroundColorValue}\\` instead.\\n\\n Do you have a usecase of using other values? Create an issue on https://github.com/razorpay/blade repo to let us know and we can discuss ✨`,\n moduleName: 'Box',\n });\n }\n }\n};\n\nconst validateBackgroundProp = (\n responsiveBackgroundColor: MakeValueResponsive<string \| undefined>,\n): void => {\n if (__DEV__) {\n if (responsiveBackgroundColor) {\n if (typeof responsiveBackgroundColor === 'string') {\n validateBackgroundString(responsiveBackgroundColor);\n return;\n }\n\n Object.values(responsiveBackgroundColor).forEach((backgroundColor) => {\n if (typeof backgroundColor === 'string') {\n validateBackgroundString(backgroundColor);\n }\n });\n }\n }\n};\n\n/*\n This function is to filter out any unexpected props passed by the user\n /\nconst makeBoxProps = (\n props: BoxProps,\n): KeysRequired<Omit<BoxProps, 'testID' \| 'id' \| '__brand__'>> => {\n return {\n // Layout\n display: props.display,\n overflow: props.overflow,\n overflowX: props.overflowX,\n overflowY: props.overflowY,\n whiteSpace: props.whiteSpace,\n height: props.height,\n minHeight: props.minHeight,\n maxHeight: props.maxHeight,\n width: props.width,\n minWidth: props.minWidth,\n maxWidth: props.maxWidth,\n textAlign: props.textAlign,\n\n // Flex\n flex: props.flex,\n flexWrap: props.flexWrap,\n flexDirection: props.flexDirection,\n flexGrow: props.flexGrow,\n flexShrink: props.flexShrink,\n flexBasis: props.flexBasis,\n alignItems: props.alignItems,\n alignContent: props.alignContent,\n alignSelf: props.alignSelf,\n justifyItems: props.justifyItems,\n justifyContent: props.justifyContent,\n justifySelf: props.justifySelf,\n placeSelf: props.placeSelf,\n placeItems: props.placeItems,\n order: props.order,\n\n // Grid\n grid: props.grid,\n gridColumn: props.gridColumn,\n gridRow: props.gridRow,\n gridRowStart: props.gridRowStart,\n gridRowEnd: props.gridRowEnd,\n gridColumnStart: props.gridColumnStart,\n gridColumnEnd: props.gridColumnEnd,\n gridArea: props.gridArea,\n gridAutoFlow: props.gridAutoFlow,\n gridAutoRows: props.gridAutoRows,\n gridAutoColumns: props.gridAutoColumns,\n gridTemplate: props.gridTemplate,\n gridTemplateAreas: props.gridTemplateAreas,\n gridTemplateColumns: props.gridTemplateColumns,\n gridTemplateRows: props.gridTemplateRows,\n\n // Spacing\n padding: props.padding,\n paddingTop: props.paddingTop,\n paddingBottom: props.paddingBottom,\n paddingRight: props.paddingRight,\n paddingLeft: props.paddingLeft,\n paddingX: props.paddingX,\n paddingY: props.paddingY,\n margin: props.margin,\n marginBottom: props.marginBottom,\n marginTop: props.marginTop,\n marginRight: props.marginRight,\n marginLeft: props.marginLeft,\n marginX: props.marginX,\n marginY: props.marginY,\n gap: props.gap,\n rowGap: props.rowGap,\n columnGap: props.columnGap,\n\n // Position\n position: props.position,\n zIndex: props.zIndex,\n top: props.top,\n right: props.right,\n bottom: props.bottom,\n left: props.left,\n\n // Visual\n backgroundColor: props.backgroundColor,\n backgroundImage: props.backgroundImage,\n backgroundSize: props.backgroundSize,\n backgroundPosition: props.backgroundPosition,\n backgroundOrigin: props.backgroundOrigin,\n backgroundRepeat: props.backgroundRepeat,\n elevation: props.elevation,\n opacity: props.opacity,\n visibility: props.visibility,\n backdropFilter: props.backdropFilter,\n\n // Border\n borderWidth: props.borderWidth,\n borderColor: props.borderColor,\n borderStyle: props.borderStyle,\n borderTopWidth: props.borderTopWidth,\n borderTopColor: props.borderTopColor,\n borderTopStyle: props.borderTopStyle,\n borderRightWidth: props.borderRightWidth,\n borderRightColor: props.borderRightColor,\n borderRightStyle: props.borderRightStyle,\n borderBottomWidth: props.borderBottomWidth,\n borderBottomColor: props.borderBottomColor,\n borderBottomStyle: props.borderBottomStyle,\n borderLeftWidth: props.borderLeftWidth,\n borderLeftColor: props.borderLeftColor,\n borderLeftStyle: props.borderLeftStyle,\n borderRadius: props.borderRadius,\n borderTopLeftRadius: props.borderTopLeftRadius,\n borderTopRightRadius: props.borderTopRightRadius,\n borderBottomRightRadius: props.borderBottomRightRadius,\n borderBottomLeftRadius: props.borderBottomLeftRadius,\n\n // Polygon Support\n transform: props.transform,\n transformOrigin: props.transformOrigin,\n clipPath: props.clipPath,\n\n // Animation\n transition: props.transition,\n\n // callbacks\n onMouseEnter: props.onMouseEnter,\n onMouseLeave: props.onMouseLeave,\n onMouseOver: props.onMouseOver,\n onScroll: props.onScroll,\n\n // Drag and Drop\n draggable: props.draggable,\n onDragStart: props.onDragStart,\n onDragEnd: props.onDragEnd,\n onDragEnter: props.onDragEnter,\n onDragLeave: props.onDragLeave,\n onDragOver: props.onDragOver,\n onDrop: props.onDrop,\n\n pointerEvents: props.pointerEvents,\n children: props.children,\n tabIndex: props.tabIndex,\n as: isReactNative() ? undefined : props.as, // as is not supported on react-native\n };\n};\n\n/\n ## Box\n * \n * Box is the basic Layout component.\n \n \n * Box components supports most spacing CSS properties like `display`, `padding`, `flex`, `height`, `width`, etc.\n \n Check out {@linkcode BoxProps BoxPropsType} for complete list of props and [Layout RFC](https://github.com/razorpay/blade/blob/master/rfcs/2023-01-06-layout.md) for more details on API decision.\n * \n * ----\n * \n * ### Usage\n * \n * ```jsx\n * <Box display=\"flex\">\n * ```\n\n * #### Responsive Props\n \n ```jsx\n * <Box padding={{ base: 'spacing.3', m: 'spacing.10' }} />\n * ```\n * \n * #### Margin and Padding Shorthands\n * \n * ```jsx\n * <Box padding={[\"spacing.3\", \"spacing.10\"]} />\n * ```\n \n ---\n * \n * Checkout {@link https://blade.razorpay.com/?path=/docs/components-box Box Documentation}\n * \n */\nconst _Box: React.ForwardRefRenderFunction<BoxRefType, BoxProps> = (props, ref) => {\n React.useEffect(() => {\n if (__DEV__) {\n validateBackgroundProp(props.backgroundColor);\n }\n }, [props.backgroundColor]);\n\n React.useEffect(() => {\n if (__DEV__) {\n if (props.as) {\n if (isReactNative()) {\n throwBladeError({\n message: '`as` prop is not supported on React Native',\n moduleName: 'Box',\n });\n }\n\n if (!validBoxAsValues.includes(props.as)) {\n throwBladeError({\n message: `Invalid \\`as\\` prop value - ${props.as}. Only ${validBoxAsValues.join(\n ', ',\n )} are valid values`,\n moduleName: 'Box',\n });\n }\n }\n }\n }, [props.as]);\n\n return (\n <BaseBox\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref={ref as any}\n id={props.id}\n {...metaAttribute({ name: MetaConstants.Box, testID: props.testID })}\n {...makeBoxProps(props)}\n {...makeAnalyticsAttribute(props)}\n />\n );\n};\n\nconst Box = assignWithoutSideEffects(React.forwardRef(_Box), {\n displayName: 'Box',\n componentId: 'Box',\n});\n\nexport { Box, makeBoxProps };\n"],"names":["validateBackgroundString","stringBackgroundColorValue","startsWith","throwBladeError","message","concat","moduleName","validateBackgroundProp","responsiveBackgroundColor","Object","values","forEach","backgroundColor","makeBoxProps","props","display","overflow","overflowX","overflowY","whiteSpace","height","minHeight","maxHeight","width","minWidth","maxWidth","textAlign","flex","flexWrap","flexDirection","flexGrow","flexShrink","flexBasis","alignItems","alignContent","alignSelf","justifyItems","justifyContent","justifySelf","placeSelf","placeItems","order","grid","gridColumn","gridRow","gridRowStart","gridRowEnd","gridColumnStart","gridColumnEnd","gridArea","gridAutoFlow","gridAutoRows","gridAutoColumns","gridTemplate","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","padding","paddingTop","paddingBottom","paddingRight","paddingLeft","paddingX","paddingY","margin","marginBottom","marginTop","marginRight","marginLeft","marginX","marginY","gap","rowGap","columnGap","position","zIndex","top","right","bottom","left","backgroundImage","backgroundSize","backgroundPosition","backgroundOrigin","backgroundRepeat","elevation","opacity","visibility","backdropFilter","borderWidth","borderColor","borderStyle","borderTopWidth","borderTopColor","borderTopStyle","borderRightWidth","borderRightColor","borderRightStyle","borderBottomWidth","borderBottomColor","borderBottomStyle","borderLeftWidth","borderLeftColor","borderLeftStyle","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomRightRadius","borderBottomLeftRadius","transform","transformOrigin","clipPath","transition","onMouseEnter","onMouseLeave","onMouseOver","onScroll","draggable","onDragStart","onDragEnd","onDragEnter","onDragLeave","onDragOver","onDrop","pointerEvents","children","tabIndex","as","isReactNative","undefined","_Box","ref","React","useEffect","validBoxAsValues","includes","join","_jsx","BaseBox","_objectSpread","id","metaAttribute","name","MetaConstants","Box","testID","makeAnalyticsAttribute","assignWithoutSideEffects","forwardRef","displayName","componentId"],"mappings":"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"}
1	+ {"version":3,"file":"Box.js","sources":["../../../../../../src/components/Box/Box.tsx"],"sourcesContent":["import React from 'react';\nimport BaseBox from './BaseBox';\nimport type { BoxProps, BoxRefType, MakeValueResponsive } from './BaseBox/types';\nimport { validBoxAsValues } from './BaseBox/types/propsTypes';\nimport type { KeysRequired } from '~utils/types';\nimport { isReactNative } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst validateBackgroundString = (stringBackgroundColorValue: string): void => {\n if (__DEV__) {\n if (\n !stringBackgroundColorValue.startsWith('surface.background') &&\n !stringBackgroundColorValue.startsWith('overlay.') &&\n !stringBackgroundColorValue.startsWith('feedback.background') &&\n stringBackgroundColorValue !== 'transparent'\n ) {\n throwBladeError({\n message: `Oops! Currently you can only use \\`transparent\\`, \\`surface.background.\\`, and \\`overlay.\\` tokens with backgroundColor property but we received \\`${stringBackgroundColorValue}\\` instead.\\n\\n Do you have a usecase of using other values? Create an issue on https://github.com/razorpay/blade repo to let us know and we can discuss ✨`,\n moduleName: 'Box',\n });\n }\n }\n};\n\nconst validateBackgroundProp = (\n responsiveBackgroundColor: MakeValueResponsive<string \| undefined>,\n): void => {\n if (__DEV__) {\n if (responsiveBackgroundColor) {\n if (typeof responsiveBackgroundColor === 'string') {\n validateBackgroundString(responsiveBackgroundColor);\n return;\n }\n\n Object.values(responsiveBackgroundColor).forEach((backgroundColor) => {\n if (typeof backgroundColor === 'string') {\n validateBackgroundString(backgroundColor);\n }\n });\n }\n }\n};\n\n/*\n This function is to filter out any unexpected props passed by the user\n /\nconst makeBoxProps = (\n props: BoxProps,\n): KeysRequired<Omit<BoxProps, 'testID' \| 'id' \| '__brand__' \| 'elementtiming'>> => {\n return {\n // Layout\n display: props.display,\n overflow: props.overflow,\n overflowX: props.overflowX,\n overflowY: props.overflowY,\n whiteSpace: props.whiteSpace,\n height: props.height,\n minHeight: props.minHeight,\n maxHeight: props.maxHeight,\n width: props.width,\n minWidth: props.minWidth,\n maxWidth: props.maxWidth,\n textAlign: props.textAlign,\n\n // Flex\n flex: props.flex,\n flexWrap: props.flexWrap,\n flexDirection: props.flexDirection,\n flexGrow: props.flexGrow,\n flexShrink: props.flexShrink,\n flexBasis: props.flexBasis,\n alignItems: props.alignItems,\n alignContent: props.alignContent,\n alignSelf: props.alignSelf,\n justifyItems: props.justifyItems,\n justifyContent: props.justifyContent,\n justifySelf: props.justifySelf,\n placeSelf: props.placeSelf,\n placeItems: props.placeItems,\n order: props.order,\n\n // Grid\n grid: props.grid,\n gridColumn: props.gridColumn,\n gridRow: props.gridRow,\n gridRowStart: props.gridRowStart,\n gridRowEnd: props.gridRowEnd,\n gridColumnStart: props.gridColumnStart,\n gridColumnEnd: props.gridColumnEnd,\n gridArea: props.gridArea,\n gridAutoFlow: props.gridAutoFlow,\n gridAutoRows: props.gridAutoRows,\n gridAutoColumns: props.gridAutoColumns,\n gridTemplate: props.gridTemplate,\n gridTemplateAreas: props.gridTemplateAreas,\n gridTemplateColumns: props.gridTemplateColumns,\n gridTemplateRows: props.gridTemplateRows,\n\n // Spacing\n padding: props.padding,\n paddingTop: props.paddingTop,\n paddingBottom: props.paddingBottom,\n paddingRight: props.paddingRight,\n paddingLeft: props.paddingLeft,\n paddingX: props.paddingX,\n paddingY: props.paddingY,\n margin: props.margin,\n marginBottom: props.marginBottom,\n marginTop: props.marginTop,\n marginRight: props.marginRight,\n marginLeft: props.marginLeft,\n marginX: props.marginX,\n marginY: props.marginY,\n gap: props.gap,\n rowGap: props.rowGap,\n columnGap: props.columnGap,\n\n // Position\n position: props.position,\n zIndex: props.zIndex,\n top: props.top,\n right: props.right,\n bottom: props.bottom,\n left: props.left,\n\n // Visual\n backgroundColor: props.backgroundColor,\n backgroundImage: props.backgroundImage,\n backgroundSize: props.backgroundSize,\n backgroundPosition: props.backgroundPosition,\n backgroundOrigin: props.backgroundOrigin,\n backgroundRepeat: props.backgroundRepeat,\n elevation: props.elevation,\n opacity: props.opacity,\n visibility: props.visibility,\n backdropFilter: props.backdropFilter,\n\n // Border\n borderWidth: props.borderWidth,\n borderColor: props.borderColor,\n borderStyle: props.borderStyle,\n borderTopWidth: props.borderTopWidth,\n borderTopColor: props.borderTopColor,\n borderTopStyle: props.borderTopStyle,\n borderRightWidth: props.borderRightWidth,\n borderRightColor: props.borderRightColor,\n borderRightStyle: props.borderRightStyle,\n borderBottomWidth: props.borderBottomWidth,\n borderBottomColor: props.borderBottomColor,\n borderBottomStyle: props.borderBottomStyle,\n borderLeftWidth: props.borderLeftWidth,\n borderLeftColor: props.borderLeftColor,\n borderLeftStyle: props.borderLeftStyle,\n borderRadius: props.borderRadius,\n borderTopLeftRadius: props.borderTopLeftRadius,\n borderTopRightRadius: props.borderTopRightRadius,\n borderBottomRightRadius: props.borderBottomRightRadius,\n borderBottomLeftRadius: props.borderBottomLeftRadius,\n\n // Polygon Support\n transform: props.transform,\n transformOrigin: props.transformOrigin,\n clipPath: props.clipPath,\n\n // Animation\n transition: props.transition,\n\n // callbacks\n onMouseEnter: props.onMouseEnter,\n onMouseLeave: props.onMouseLeave,\n onMouseOver: props.onMouseOver,\n onScroll: props.onScroll,\n\n // Drag and Drop\n draggable: props.draggable,\n onDragStart: props.onDragStart,\n onDragEnd: props.onDragEnd,\n onDragEnter: props.onDragEnter,\n onDragLeave: props.onDragLeave,\n onDragOver: props.onDragOver,\n onDrop: props.onDrop,\n\n pointerEvents: props.pointerEvents,\n children: props.children,\n tabIndex: props.tabIndex,\n as: isReactNative() ? undefined : props.as, // as is not supported on react-native\n };\n};\n\n/\n ## Box\n * \n * Box is the basic Layout component.\n \n \n * Box components supports most spacing CSS properties like `display`, `padding`, `flex`, `height`, `width`, etc.\n \n Check out {@linkcode BoxProps BoxPropsType} for complete list of props and [Layout RFC](https://github.com/razorpay/blade/blob/master/rfcs/2023-01-06-layout.md) for more details on API decision.\n * \n * ----\n * \n * ### Usage\n * \n * ```jsx\n * <Box display=\"flex\">\n * ```\n\n * #### Responsive Props\n \n ```jsx\n * <Box padding={{ base: 'spacing.3', m: 'spacing.10' }} />\n * ```\n * \n * #### Margin and Padding Shorthands\n * \n * ```jsx\n * <Box padding={[\"spacing.3\", \"spacing.10\"]} />\n * ```\n \n ---\n * \n * Checkout {@link https://blade.razorpay.com/?path=/docs/components-box Box Documentation}\n * \n */\nconst _Box: React.ForwardRefRenderFunction<BoxRefType, BoxProps> = (props, ref) => {\n React.useEffect(() => {\n if (__DEV__) {\n validateBackgroundProp(props.backgroundColor);\n }\n }, [props.backgroundColor]);\n\n React.useEffect(() => {\n if (__DEV__) {\n if (props.as) {\n if (isReactNative()) {\n throwBladeError({\n message: '`as` prop is not supported on React Native',\n moduleName: 'Box',\n });\n }\n\n if (!validBoxAsValues.includes(props.as)) {\n throwBladeError({\n message: `Invalid \\`as\\` prop value - ${props.as}. Only ${validBoxAsValues.join(\n ', ',\n )} are valid values`,\n moduleName: 'Box',\n });\n }\n }\n }\n }, [props.as]);\n\n return (\n <BaseBox\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref={ref as any}\n id={props.id}\n {...metaAttribute({ name: MetaConstants.Box, testID: props.testID })}\n {...makeBoxProps(props)}\n {...makeAnalyticsAttribute(props)}\n />\n );\n};\n\nconst Box = assignWithoutSideEffects(React.forwardRef(_Box), {\n displayName: 'Box',\n componentId: 'Box',\n});\n\nexport { Box, makeBoxProps };\n"],"names":["validateBackgroundString","stringBackgroundColorValue","startsWith","throwBladeError","message","concat","moduleName","validateBackgroundProp","responsiveBackgroundColor","Object","values","forEach","backgroundColor","makeBoxProps","props","display","overflow","overflowX","overflowY","whiteSpace","height","minHeight","maxHeight","width","minWidth","maxWidth","textAlign","flex","flexWrap","flexDirection","flexGrow","flexShrink","flexBasis","alignItems","alignContent","alignSelf","justifyItems","justifyContent","justifySelf","placeSelf","placeItems","order","grid","gridColumn","gridRow","gridRowStart","gridRowEnd","gridColumnStart","gridColumnEnd","gridArea","gridAutoFlow","gridAutoRows","gridAutoColumns","gridTemplate","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","padding","paddingTop","paddingBottom","paddingRight","paddingLeft","paddingX","paddingY","margin","marginBottom","marginTop","marginRight","marginLeft","marginX","marginY","gap","rowGap","columnGap","position","zIndex","top","right","bottom","left","backgroundImage","backgroundSize","backgroundPosition","backgroundOrigin","backgroundRepeat","elevation","opacity","visibility","backdropFilter","borderWidth","borderColor","borderStyle","borderTopWidth","borderTopColor","borderTopStyle","borderRightWidth","borderRightColor","borderRightStyle","borderBottomWidth","borderBottomColor","borderBottomStyle","borderLeftWidth","borderLeftColor","borderLeftStyle","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomRightRadius","borderBottomLeftRadius","transform","transformOrigin","clipPath","transition","onMouseEnter","onMouseLeave","onMouseOver","onScroll","draggable","onDragStart","onDragEnd","onDragEnter","onDragLeave","onDragOver","onDrop","pointerEvents","children","tabIndex","as","isReactNative","undefined","_Box","ref","React","useEffect","validBoxAsValues","includes","join","_jsx","BaseBox","_objectSpread","id","metaAttribute","name","MetaConstants","Box","testID","makeAnalyticsAttribute","assignWithoutSideEffects","forwardRef","displayName","componentId"],"mappings":"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"}

package/build/lib/web/development/components/Charts/AreaChart/AreaChart.web.js CHANGED Viewed

@@ -3,6 +3,7 @@ import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProper
 import React__default from 'react';
 import { Area as Area$1, ResponsiveContainer, AreaChart } from 'recharts';
 import '../utils/index.js';
+import '../CommonChartComponents/index.js';
 import { componentIds } from './componentIds.js';
 import '../../../utils/makeAnalyticsAttribute/index.js';
 import '../../BladeProvider/index.js';
@@ -10,15 +11,20 @@ import '../../../utils/metaAttribute/index.js';
 import '../../Box/BaseBox/index.js';
 import getIn from '../../../utils/lodashButBetter/get.js';
 import '../../../utils/assignWithoutSideEffects/index.js';
-import { jsx } from 'react/jsx-runtime';
+import '../../../utils/isValidAllowedChildren/index.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import useTheme from '../../BladeProvider/useTheme.js';
 import useChartsColorTheme from '../utils/useColorTheme.js';
+import { getHighestColorInRange } from '../utils/getHighestColorInRange.js';
 import { assignWithoutSideEffects } from '../../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
+import { getComponentId } from '../../../utils/isValidAllowedChildren/isValidAllowedChildren.js';
+import { assignDataColorMapping } from '../utils/assignDataColorMapping/assignDataColorMapping.js';
+import { CommonChartComponentsContext } from '../CommonChartComponents/CommonChartComponentsContext.js';
 import { BaseBox } from '../../Box/BaseBox/BaseBox.web.js';
 import { metaAttribute } from '../../../utils/metaAttribute/metaAttribute.web.js';
 import { makeAnalyticsAttribute } from '../../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
-var _excluded = ["color", "type", "connectNulls", "showLegend", "stackId", "dot", "activeDot", "_index", "_colorTheme"],
+var _excluded = ["color", "type", "connectNulls", "showLegend", "stackId", "dot", "activeDot", "_index", "_colorTheme", "_totalAreas", "dataKey", "name"],
   _excluded2 = ["data", "children", "testID", "colorTheme"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -38,23 +44,32 @@ var Area = function Area(_ref) {
     activeDot = _ref$activeDot === void 0 ? true : _ref$activeDot,
     _index = _ref._index,
     _colorTheme = _ref._colorTheme,
+    _totalAreas = _ref._totalAreas,
+    dataKey = _ref.dataKey,
+    name = _ref.name,
     props = _objectWithoutProperties(_ref, _excluded);
   var _useTheme = useTheme(),
     theme = _useTheme.theme;
   var themeColors = useChartsColorTheme({
-    colorTheme: _colorTheme
+    colorTheme: _colorTheme,
+    chartName: 'area',
+    chartDataIndicators: _totalAreas
   });
-  var colorToken = color ? getIn(theme.colors, color) : themeColors[_index !== null && _index !== void 0 ? _index : 0];
+  var colorToken = getIn(theme.colors, color ? getHighestColorInRange({
+    colorToken: color
+  }) : themeColors[_index !== null && _index !== void 0 ? _index : 0]);
   var animationBegin = theme.motion.delay.gentle;
   var animationDuration = theme.motion.duration.xgentle;
   return /*#__PURE__*/jsx(Area$1, _objectSpread(_objectSpread({}, props), {}, {
-    fill: colorToken,
+    fill: "url(#color-".concat(_index, "-").concat(dataKey, ")"),
+    dataKey: dataKey,
+    name: name,
     stroke: colorToken,
-    fillOpacity: 0.09,
+    fillOpacity: 0.5,
     type: type,
     connectNulls: connectNulls,
     legendType: showLegend ? 'rect' : 'none',
-    strokeWidth: 3,
+    strokeWidth: 1.5,
     dot: dot,
     stackId: stackId,
     activeDot: activeDot,
@@ -65,40 +80,127 @@ var Area = function Area(_ref) {
 var ChartArea = /*#__PURE__*/assignWithoutSideEffects(Area, {
   componentId: componentIds.ChartArea
 });
+var ChartColorGradient = function ChartColorGradient(_ref2) {
+  var index = _ref2.index,
+    color = _ref2.color,
+    totalAreaChartChildren = _ref2.totalAreaChartChildren,
+    id = _ref2.id;
+  var _useTheme2 = useTheme(),
+    colorScheme = _useTheme2.colorScheme,
+    theme = _useTheme2.theme;
+  var isDarkMode = colorScheme === 'dark';
+  var themeColors = useChartsColorTheme({
+    colorTheme: 'categorical',
+    chartName: 'area',
+    chartDataIndicators: totalAreaChartChildren
+  });
+  var colorToken = getIn(theme.colors, getHighestColorInRange({
+    colorToken: color !== null && color !== void 0 ? color : themeColors[index],
+    followIntensityMapping: true
+  }));
+  return /*#__PURE__*/jsxs("linearGradient", {
+    id: id,
+    x1: "0",
+    y1: "0",
+    x2: "0",
+    y2: "1",
+    children: [/*#__PURE__*/jsx("stop", {
+      offset: "5%",
+      stopColor: colorToken,
+      stopOpacity: isDarkMode ? 0.28 : 1
+    }), /*#__PURE__*/jsx("stop", {
+      offset: "95%",
+      stopColor: colorToken,
+      stopOpacity: isDarkMode ? 0.12 : 0.32
+    })]
+  }, id);
+};
 // Main components
-var ChartAreaWrapper = function ChartAreaWrapper(_ref2) {
-  var data = _ref2.data,
-    children = _ref2.children,
-    testID = _ref2.testID,
-    _ref2$colorTheme = _ref2.colorTheme,
-    colorTheme = _ref2$colorTheme === void 0 ? 'default' : _ref2$colorTheme,
-    restProps = _objectWithoutProperties(_ref2, _excluded2);
-  var modifiedChildren = React__default.useMemo(function () {
-    var AreaChartIndex = 0;
-    return React__default.Children.map(children, function (child) {
-      if (/*#__PURE__*/React__default.isValidElement(child) && child.type === componentIds.ChartArea) {
-        return /*#__PURE__*/React__default.cloneElement(child, {
-          _index: AreaChartIndex++,
-          _colorTheme: colorTheme
-        });
-      }
-      return child;
-    });
-  }, [children, colorTheme]);
-  return /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, metaAttribute({
-    name: 'chart-area-container',
-    testID: testID
-  })), makeAnalyticsAttribute(restProps)), restProps), {}, {
-    width: "100%",
-    height: "100%",
-    children: /*#__PURE__*/jsx(ResponsiveContainer, {
-      children: /*#__PURE__*/jsx(AreaChart, {
-        data: data,
-        children: modifiedChildren
+var ChartAreaWrapper = function ChartAreaWrapper(_ref3) {
+  var data = _ref3.data,
+    children = _ref3.children,
+    testID = _ref3.testID,
+    _ref3$colorTheme = _ref3.colorTheme,
+    colorTheme = _ref3$colorTheme === void 0 ? 'categorical' : _ref3$colorTheme,
+    restProps = _objectWithoutProperties(_ref3, _excluded2);
+  var themeColors = useChartsColorTheme({
+    colorTheme: colorTheme,
+    chartName: 'area'
+  });
+  var _React$useMemo = React__default.useMemo(function () {
+      var childrenArray = React__default.Children.toArray(children);
+      var dataColorMapping = {};
+      // Count ChartLine components
+      var totalAreas = childrenArray.filter(function (child) {
+        return /*#__PURE__*/React__default.isValidElement(child) && getComponentId(child) === componentIds.ChartArea;
+      }).length;
+      var AreaChartIndex = 0;
+      /**
+       * We need to check child of ChartAreaWrapper. if they have any custom color we store that.
+       * We need these mapping because colors of tooltip & legend is determine based on this
+       *  recharts do provide a color but it is hex code and we need blade color token .
+       */
+      var modifiedChildren = React__default.Children.map(children, function (child) {
+        if (/*#__PURE__*/React__default.isValidElement(child) && getComponentId(child) === componentIds.ChartArea) {
+          var _child$props, _child$props2;
+          var childColor = child === null || child === void 0 || (_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.color;
+          var dataKey = child === null || child === void 0 || (_child$props2 = child.props) === null || _child$props2 === void 0 ? void 0 : _child$props2.dataKey;
+          if (dataKey) {
+            //  assign  colors to the dataColorMapping, if no color is assigned  we assign color in `assignDataColorMapping`
+            dataColorMapping[dataKey] = {
+              colorToken: childColor,
+              isCustomColor: Boolean(childColor)
+            };
+          }
+          return /*#__PURE__*/React__default.cloneElement(child, {
+            _index: AreaChartIndex++,
+            _colorTheme: colorTheme,
+            _totalAreas: totalAreas
+          });
+        }
+        return child;
+      });
+      assignDataColorMapping(dataColorMapping, themeColors);
+      return {
+        modifiedChildren: modifiedChildren,
+        totalAreaChartChildren: AreaChartIndex,
+        dataColorMapping: dataColorMapping
+      };
+    }, [children, colorTheme, themeColors]),
+    modifiedChildren = _React$useMemo.modifiedChildren,
+    totalAreaChartChildren = _React$useMemo.totalAreaChartChildren,
+    dataColorMapping = _React$useMemo.dataColorMapping;
+  return /*#__PURE__*/jsx(CommonChartComponentsContext.Provider, {
+    value: {
+      chartName: 'area',
+      dataColorMapping: dataColorMapping
+    },
+    children: /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, metaAttribute({
+      name: 'chart-area-container',
+      testID: testID
+    })), makeAnalyticsAttribute(restProps)), restProps), {}, {
+      width: "100%",
+      height: "100%",
+      children: /*#__PURE__*/jsx(ResponsiveContainer, {
+        children: /*#__PURE__*/jsxs(AreaChart, {
+          data: data,
+          children: [/*#__PURE__*/jsx("defs", {
+            children: Object.keys(dataColorMapping).map(function (dataKey, index) {
+              return /*#__PURE__*/jsx(ChartColorGradient, {
+                id: "color-".concat(index, "-").concat(dataKey),
+                index: index,
+                color: dataColorMapping[dataKey].colorToken,
+                totalAreaChartChildren: totalAreaChartChildren
+              }, "color-".concat(index, "-").concat(dataKey));
+            })
+          }), modifiedChildren]
+        })
       })
-    })
-  }));
+    }))
+  });
 };
 export { ChartArea, ChartAreaWrapper };

package/build/lib/web/development/components/Charts/AreaChart/AreaChart.web.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AreaChart.web.js","sources":["../../../../../../../src/components/Charts/AreaChart/AreaChart.web.tsx"],"sourcesContent":["import React from 'react';\nimport {\n AreaChart as RechartsAreaChart,\n Area as RechartsArea,\n ResponsiveContainer,\n} from 'recharts';\nimport { useChartsColorTheme } from '../utils';\nimport type { ChartAreaProps, ChartAreaWrapperProps } from './types';\nimport { componentIds } from './componentIds';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nimport type { DataAnalyticsAttribute, TestID } from '~utils/types';\nimport { useTheme } from '~components/BladeProvider';\nimport { metaAttribute } from '~utils/metaAttribute';\nimport BaseBox from '~components/Box/BaseBox';\nimport getIn from '~utils/lodashButBetter/get';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\n\nconst Area: React.FC<ChartAreaProps> = ({\n color,\n type = 'monotone',\n connectNulls = false,\n showLegend = true,\n stackId = 1,\n dot = false,\n activeDot = true,\n _index,\n _colorTheme,\n ...props\n}) => {\n const { theme } = useTheme();\n const themeColors = useChartsColorTheme({ colorTheme: _colorTheme });\n const colorToken = color ? getIn(theme.colors, color) : themeColors[_index ?? 0];\n const animationBegin = theme.motion.delay.gentle;\n const animationDuration = theme.motion.duration.xgentle;\n\n return (\n <RechartsArea\n {...props}\n fill={colorToken}\n stroke={colorToken}\n fillOpacity={0.09}\n type={type}\n connectNulls={connectNulls}\n legendType={showLegend ? 'rect' : 'none'}\n strokeWidth={3}\n dot={dot}\n stackId={stackId}\n activeDot={activeDot}\n animationBegin={animationBegin}\n animationDuration={animationDuration}\n />\n );\n};\n\nconst ChartArea = assignWithoutSideEffects(Area, {\n componentId: componentIds.ChartArea,\n});\n\n// Main components\nconst ChartAreaWrapper: React.FC<ChartAreaWrapperProps & TestID & DataAnalyticsAttribute> = ({\n data,\n children,\n testID,\n colorTheme = 'default',\n ...restProps\n}) => {\n const modifiedChildren = React.useMemo(() => {\n let AreaChartIndex = 0;\n return React.Children.map(children, (child) => {\n if (React.isValidElement(child) && child.type === componentIds.ChartArea) {\n return React.cloneElement(child, {\n _index: AreaChartIndex++,\n _colorTheme: colorTheme,\n } as Partial<ChartAreaProps>);\n }\n return child;\n });\n }, [children, colorTheme]);\n\n return (\n <BaseBox\n {...metaAttribute({ name: 'chart-area-container', testID })}\n {...makeAnalyticsAttribute(restProps)}\n {...restProps}\n width=\"100%\"\n height=\"100%\"\n >\n <ResponsiveContainer>\n <RechartsAreaChart data={data}>{modifiedChildren}</RechartsAreaChart>\n </ResponsiveContainer>\n </BaseBox>\n );\n};\n\nexport type { ChartAreaWrapperProps, ChartAreaProps };\nexport { ChartAreaWrapper, ChartArea };\n"],"names":["Area","_ref","color","_ref$type","type","_ref$connectNulls","connectNulls","_ref$showLegend","showLegend","_ref$stackId","stackId","_ref$dot","dot","_ref$activeDot","activeDot","_index","_colorTheme","props","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","themeColors","useChartsColorTheme","colorTheme","colorToken","getIn","colors","animationBegin","motion","delay","gentle","animationDuration","duration","xgentle","_jsx","RechartsArea","_objectSpread","fill","stroke","fillOpacity","legendType","strokeWidth","ChartArea","assignWithoutSideEffects","componentId","componentIds","ChartAreaWrapper","_ref2","data","children","testID","_ref2$colorTheme","restProps","_excluded2","modifiedChildren","React","useMemo","AreaChartIndex","Children","map","child","isValidElement","cloneElement","BaseBox","metaAttribute","name","makeAnalyticsAttribute","width","height","ResponsiveContainer","RechartsAreaChart"],"mappings":"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"}
1	+ {"version":3,"file":"AreaChart.web.js","sources":["../../../../../../../src/components/Charts/AreaChart/AreaChart.web.tsx"],"sourcesContent":["import React from 'react';\nimport {\n AreaChart as RechartsAreaChart,\n Area as RechartsArea,\n ResponsiveContainer,\n} from 'recharts';\nimport { getHighestColorInRange, useChartsColorTheme, assignDataColorMapping } from '../utils';\nimport type { DataColorMapping } from '../CommonChartComponents';\nimport { CommonChartComponentsContext } from '../CommonChartComponents';\nimport type { ChartAreaProps, ChartAreaWrapperProps, ChartColorGradientProps } from './types';\nimport { componentIds } from './componentIds';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nimport type { DataAnalyticsAttribute, TestID } from '~utils/types';\nimport { useTheme } from '~components/BladeProvider';\nimport { metaAttribute } from '~utils/metaAttribute';\nimport BaseBox from '~components/Box/BaseBox';\nimport getIn from '~utils/lodashButBetter/get';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getComponentId } from '~utils/isValidAllowedChildren';\n\nconst Area: React.FC<ChartAreaProps> = ({\n color,\n type = 'monotone',\n connectNulls = false,\n showLegend = true,\n stackId = 1,\n dot = false,\n activeDot = true,\n _index,\n _colorTheme,\n _totalAreas,\n dataKey,\n name,\n ...props\n}) => {\n const { theme } = useTheme();\n const themeColors = useChartsColorTheme({\n colorTheme: _colorTheme,\n chartName: 'area',\n chartDataIndicators: _totalAreas,\n });\n const colorToken = getIn(\n theme.colors,\n color ? getHighestColorInRange({ colorToken: color }) : themeColors[_index ?? 0],\n );\n const animationBegin = theme.motion.delay.gentle;\n const animationDuration = theme.motion.duration.xgentle;\n\n return (\n <RechartsArea\n {...props}\n fill={`url(#color-${_index}-${dataKey})`}\n dataKey={dataKey}\n name={name}\n stroke={colorToken}\n fillOpacity={0.5}\n type={type}\n connectNulls={connectNulls}\n legendType={showLegend ? 'rect' : 'none'}\n strokeWidth={1.5}\n dot={dot}\n stackId={stackId}\n activeDot={activeDot}\n animationBegin={animationBegin}\n animationDuration={animationDuration}\n />\n );\n};\n\nconst ChartArea = assignWithoutSideEffects(Area, {\n componentId: componentIds.ChartArea,\n});\n\nconst ChartColorGradient: React.FC<ChartColorGradientProps> = ({\n index,\n color,\n totalAreaChartChildren,\n id,\n}) => {\n const { colorScheme, theme } = useTheme();\n const isDarkMode = colorScheme === 'dark';\n const themeColors = useChartsColorTheme({\n colorTheme: 'categorical',\n chartName: 'area',\n chartDataIndicators: totalAreaChartChildren,\n });\n\n const colorToken = getIn(\n theme.colors,\n getHighestColorInRange({\n colorToken: color ?? themeColors[index],\n followIntensityMapping: true,\n }),\n );\n return (\n <linearGradient id={id} key={id} x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n <stop offset=\"5%\" stopColor={colorToken} stopOpacity={isDarkMode ? 0.28 : 1} />\n <stop offset=\"95%\" stopColor={colorToken} stopOpacity={isDarkMode ? 0.12 : 0.32} />\n </linearGradient>\n );\n};\n\n// Main components\nconst ChartAreaWrapper: React.FC<ChartAreaWrapperProps & TestID & DataAnalyticsAttribute> = ({\n data,\n children,\n testID,\n colorTheme = 'categorical',\n ...restProps\n}) => {\n const themeColors = useChartsColorTheme({\n colorTheme,\n chartName: 'area',\n });\n const { modifiedChildren, totalAreaChartChildren, dataColorMapping } = React.useMemo(() => {\n const childrenArray = React.Children.toArray(children);\n const dataColorMapping: DataColorMapping = {};\n\n // Count ChartLine components\n const totalAreas = childrenArray.filter(\n (child): child is React.ReactElement =>\n React.isValidElement(child) && getComponentId(child) === componentIds.ChartArea,\n ).length;\n\n let AreaChartIndex = 0;\n /*\n We need to check child of ChartAreaWrapper. if they have any custom color we store that.\n * We need these mapping because colors of tooltip & legend is determine based on this\n * recharts do provide a color but it is hex code and we need blade color token .\n */\n const modifiedChildren = React.Children.map(children, (child) => {\n if (React.isValidElement(child) && getComponentId(child) === componentIds.ChartArea) {\n const childColor = child?.props?.color;\n const dataKey = (child?.props as ChartAreaProps)?.dataKey as string;\n if (dataKey) {\n // assign colors to the dataColorMapping, if no color is assigned we assign color in `assignDataColorMapping`\n\n dataColorMapping[dataKey] = {\n colorToken: childColor,\n isCustomColor: Boolean(childColor),\n };\n }\n return React.cloneElement(child, {\n _index: AreaChartIndex++,\n _colorTheme: colorTheme,\n _totalAreas: totalAreas,\n } as Partial<ChartAreaProps>);\n }\n return child;\n });\n\n assignDataColorMapping(dataColorMapping, themeColors);\n return {\n modifiedChildren,\n totalAreaChartChildren: AreaChartIndex,\n dataColorMapping,\n };\n }, [children, colorTheme, themeColors]);\n\n return (\n <CommonChartComponentsContext.Provider value={{ chartName: 'area', dataColorMapping }}>\n <BaseBox\n {...metaAttribute({ name: 'chart-area-container', testID })}\n {...makeAnalyticsAttribute(restProps)}\n {...restProps}\n width=\"100%\"\n height=\"100%\"\n >\n <ResponsiveContainer>\n <RechartsAreaChart data={data}>\n <defs>\n {Object.keys(dataColorMapping).map((dataKey, index) => (\n <ChartColorGradient\n key={`color-${index}-${dataKey}`}\n id={`color-${index}-${dataKey}`}\n index={index}\n color={dataColorMapping[dataKey].colorToken}\n totalAreaChartChildren={totalAreaChartChildren}\n />\n ))}\n </defs>\n\n {modifiedChildren}\n </RechartsAreaChart>\n </ResponsiveContainer>\n </BaseBox>\n </CommonChartComponentsContext.Provider>\n );\n};\n\nexport type { ChartAreaWrapperProps, ChartAreaProps };\nexport { ChartAreaWrapper, ChartArea };\n"],"names":["Area","_ref","color","_ref$type","type","_ref$connectNulls","connectNulls","_ref$showLegend","showLegend","_ref$stackId","stackId","_ref$dot","dot","_ref$activeDot","activeDot","_index","_colorTheme","_totalAreas","dataKey","name","props","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","themeColors","useChartsColorTheme","colorTheme","chartName","chartDataIndicators","colorToken","getIn","colors","getHighestColorInRange","animationBegin","motion","delay","gentle","animationDuration","duration","xgentle","_jsx","RechartsArea","_objectSpread","fill","concat","stroke","fillOpacity","legendType","strokeWidth","ChartArea","assignWithoutSideEffects","componentId","componentIds","ChartColorGradient","_ref2","index","totalAreaChartChildren","id","_useTheme2","colorScheme","isDarkMode","followIntensityMapping","_jsxs","x1","y1","x2","y2","children","offset","stopColor","stopOpacity","ChartAreaWrapper","_ref3","data","testID","_ref3$colorTheme","restProps","_excluded2","_React$useMemo","React","useMemo","childrenArray","Children","toArray","dataColorMapping","totalAreas","filter","child","isValidElement","getComponentId","length","AreaChartIndex","modifiedChildren","map","_child$props","_child$props2","childColor","isCustomColor","Boolean","cloneElement","assignDataColorMapping","CommonChartComponentsContext","Provider","value","BaseBox","metaAttribute","makeAnalyticsAttribute","width","height","ResponsiveContainer","RechartsAreaChart","Object","keys"],"mappings":"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"}