npm - @transferwise/components - Versions diffs - 0.0.0-experimental-28b4d5d → 0.0.0-experimental-b15bafb - Mend

@transferwise/components 0.0.0-experimental-28b4d5d → 0.0.0-experimental-b15bafb

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 (2555) hide show

package/build/listItem/ListItem.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItem.mjs","sources":["../../src/listItem/ListItem.tsx"],"sourcesContent":["import {\n useContext,\n useId,\n useMemo,\n useState,\n type PropsWithChildren,\n type ReactNode,\n} from 'react';\nimport { Sentiment, Typography } from '../common';\nimport Body from '../body';\nimport { AdditionalInfo } from './AdditionalInfo';\nimport { IconButton, type ListItemIconButtonProps } from './IconButton';\nimport { Checkbox, type ListItemCheckboxProps } from './Checkbox';\nimport { Navigation, type ListItemNavigationProps } from './Navigation';\nimport { clsx } from 'clsx';\nimport { Button, type ListItemButtonProps } from './Button';\nimport { Radio, type ListItemRadioProps } from './Radio';\nimport { Switch, type ListItemSwitchProps } from './Switch';\nimport { AvatarLayout } from './AvatarLayout';\nimport { AvatarView } from './AvatarView';\nimport { Image } from './Image';\nimport { Prompt } from './Prompt';\nimport { PrimitiveAnchor, type PrimitiveAnchorProps } from '../primitives';\nimport {\n ListItemContext,\n type ListItemContextData,\n type ListItemMediaSize,\n} from './ListItemContext';\n\nexport type ListItemTypes =\n \| 'non-interactive'\n \| 'navigation'\n \| 'radio'\n \| 'checkbox'\n \| 'switch'\n \| 'button'\n \| 'icon-button';\n\nexport type ListItemControlProps =\n \| ListItemNavigationProps\n \| ListItemCheckboxProps\n \| ListItemButtonProps\n \| ListItemIconButtonProps\n \| ListItemRadioProps\n \| ListItemSwitchProps;\n\nexport type ListItemProps = {\n /** @default 'li' /\n as?: 'li' \| 'div';\n /\n Swaps vertical hierarchy of title and subtitle and their corresponding right values.\n /\n inverted?: boolean;\n /\n Disables the control and renders the ListItem in greyscale and with slightly decreased opacity.\n /\n disabled?: boolean;\n /\n If set, it'll extend the `disabled` state, overriding existing or injecting uniquely styled prompt with the message provided via this prop. <br />\n * NB: This message cannot house more than 1 link or inline button.<br />\n * NB: It must be used together with `disabled` prop and will be disregarded otherwise.\n /\n disabledPromptMessage?: ReactNode;\n /\n Highlights the list item as an action to be taken or already taken. <br />\n /\n spotlight?: 'active' \| 'inactive';\n title: ReactNode;\n subtitle?: ReactNode;\n /\n Requires `<ListItem.AdditionalInfo />` component as a sole child. <br />\n * Can be only rendered if `subtitle` is also provided.\n /\n additionalInfo?: ReactNode;\n valueTitle?: ReactNode;\n valueSubtitle?: ReactNode;\n /\n Requires one of the following as a sole child: <br />\n * `<ListItem.AvatarView />`,\n * `<ListItem.AvatarLayout />` or\n * `<ListItem.Image />`\n /\n media?: ReactNode;\n /\n Requires one of the following as a sole child: <br/>\n * `<ListItem.Button />`, <br/>\n * `<ListItem.Checkbox />`, <br/>\n * `<ListItem.IconButton />`, <br/>\n * `<ListItem.Navigation />`, <br/>\n * `<ListItem.Radio />`, or\n * `<ListItem.Switch />`\n * @default null\n /\n control?: ReactNode;\n /\n Requires `<ListItem.Prompt />` component as a sole child.\n /\n prompt?: ReactNode;\n className?: string;\n /\n A number between `0–100` which resolves to a `fr` value of a `grid-template-columns` declaration. E.g. `valueColumnWidth={25}` will result in a `75fr 25fr`. <br />\n * Controls the width ratio of left side content (title and subtitle) to the right side content.\n /\n valueColumnWidth?: number;\n id?: string;\n};\n\n/\n @see [Design documentation](https://wise.design/components/list-item)\n * @see [Storybook documentation](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n /\nexport const ListItem = ({\n as: ListItemElement = 'li',\n title,\n subtitle,\n additionalInfo,\n prompt,\n inverted,\n media,\n spotlight,\n valueTitle,\n valueSubtitle,\n control = null,\n disabled,\n disabledPromptMessage,\n className,\n valueColumnWidth,\n id,\n}: ListItemProps) => {\n const idPrefix = useId();\n const [controlProps, setControlProps] = useState<ListItemControlProps>({});\n const [controlType, setControlType] = useState<ListItemTypes>('non-interactive');\n const [mediaSize, setMediaSize] = useState<ListItemMediaSize \| undefined>();\n\n const ids: ListItemContextData['ids'] = {\n title: `${idPrefix}_title`,\n ...(subtitle ? { subtitle: `${idPrefix}_subtitle` } : {}),\n ...(valueTitle ? { valueTitle: `${idPrefix}_value-title` } : {}),\n ...(valueSubtitle ? { valueSubtitle: `${idPrefix}_value-subtitle` } : {}),\n control: `${idPrefix}_control`,\n ...(prompt \|\| (disabled && disabledPromptMessage) ? { prompt: `${idPrefix}_prompt` } : {}),\n ...(additionalInfo ? { additionalInfo: `${idPrefix}_additional-info` } : {}),\n };\n\n const isPartiallyInteractive = Boolean(\n (controlType === 'button' \|\| controlType === 'icon-button') &&\n (controlProps as ListItemButtonProps \| ListItemIconButtonProps)?.partiallyInteractive,\n );\n const isFullyInteractive = controlType !== 'non-interactive' && !isPartiallyInteractive;\n const isButtonAsLink =\n (controlType === 'button' \|\| controlType === 'icon-button') &&\n Boolean((controlProps as ListItemButtonProps \| ListItemIconButtonProps)?.href);\n\n const titlesAndValues = [\n inverted ? ids.subtitle : ids.title,\n inverted ? ids.title : ids.subtitle,\n inverted ? ids.valueSubtitle : ids.valueTitle,\n inverted ? ids.valueTitle : ids.valueSubtitle,\n ].join(' ');\n const additionalInfoPrompt = [ids.additionalInfo, ids.prompt].filter(Boolean).join(' ');\n\n const describedByIds = useMemo(() => {\n return isFullyInteractive && !isButtonAsLink\n ? additionalInfoPrompt\n : `${titlesAndValues} ${additionalInfoPrompt}`;\n }, [additionalInfoPrompt, isButtonAsLink, isFullyInteractive, titlesAndValues]);\n const listItemContext = useMemo(\n () => ({\n setControlType,\n setControlProps,\n setMediaSize,\n ids,\n props: { disabled, inverted, disabledPromptMessage },\n mediaSize,\n isPartiallyInteractive,\n describedByIds,\n }),\n [describedByIds, mediaSize, disabled, inverted, disabledPromptMessage, isPartiallyInteractive],\n );\n const gridColumnsStyle = {\n '--wds-list-item-body-left': valueColumnWidth ? `${100 - valueColumnWidth}fr` : '50fr',\n '--wds-list-item-body-right': valueColumnWidth ? `${valueColumnWidth}fr` : '50fr',\n } as React.CSSProperties;\n\n const getFeatureClassName = () => {\n const partials = [];\n const hasMedia = Boolean(media);\n const hasControl = Boolean(control);\n const hasInfo = Boolean(additionalInfo);\n const hasPrompt = Boolean(prompt) \|\| (disabled && Boolean(disabledPromptMessage));\n\n / eslint-disable functional/immutable-data /\n if (hasMedia && hasControl) {\n partials.push('wds-list-item-hasMedia-hasControl');\n }\n\n if (hasMedia && !hasControl) {\n partials.push('wds-list-item-hasMedia-noControl');\n }\n\n if (!hasMedia && hasControl) {\n partials.push('wds-list-item-noMedia-hasControl');\n }\n\n if (!hasMedia && !hasControl) {\n partials.push('wds-list-item-noMedia-noControl');\n }\n\n if (hasInfo && hasPrompt) {\n partials.push('wds-list-item-hasInfo-hasPrompt');\n }\n if (hasInfo && !hasPrompt) {\n partials.push('wds-list-item-hasInfo-noPrompt');\n }\n if (!hasInfo && hasPrompt) {\n partials.push('wds-list-item-noInfo-hasPrompt');\n }\n if (!hasInfo && !hasPrompt) {\n partials.push('wds-list-item-noInfo-noPrompt');\n }\n / eslint-enable functional/immutable-data /\n\n return partials.join(' ');\n };\n\n return (\n <ListItemContext.Provider value={listItemContext}>\n <ListItemElement\n className={clsx(\n 'wds-list-item',\n `wds-list-item-${controlType}`,\n getFeatureClassName(),\n {\n 'wds-list-item-interactive': isFullyInteractive,\n 'wds-list-item-partially-interactive': isPartiallyInteractive,\n [`wds-list-item-spotlight wds-list-item-spotlight-${spotlight}`]:\n isFullyInteractive && !!spotlight,\n disabled: disabled && !isPartiallyInteractive,\n 'disabled--has-prompt-reason':\n !disabledPromptMessage && disabled && !isPartiallyInteractive,\n },\n className,\n )}\n id={id}\n aria-disabled={disabled}\n style={\n {\n '--wds-list-item-value-min-height': mediaSize ? `${mediaSize}px` : undefined,\n } as React.CSSProperties\n }\n >\n {isFullyInteractive && spotlight === 'inactive' && (\n <svg aria-hidden=\"true\" className=\"wds-list-item-spotlight__border\">\n <rect />\n </svg>\n )}\n\n <View\n {...{\n isPartiallyInteractive,\n subtitle,\n additionalInfo,\n disabled,\n disabledPromptMessage,\n prompt,\n controlType,\n controlProps,\n }}\n className={getFeatureClassName()}\n >\n {media && <div className=\"wds-list-item-media\">{media}</div>}\n\n {/ Title + Subtitle + Values - Group /}\n <div\n className=\"wds-list-item-body\"\n style={valueColumnWidth ? gridColumnsStyle : undefined}\n >\n {/ Title + Subtitle + Values - Group */}\n <span className=\"wds-list-item-titles\">\n {(() => {\n const titles = [\n <Body\n key={ids.title}\n id={ids.title}\n type={Typography.BODY_LARGE_BOLD}\n className=\"wds-list-item-title\"\n >\n {title}\n </Body>,\n ];\n if (subtitle) {\n titles.push(\n <Body key={ids.subtitle} id={ids.subtitle} className=\"wds-list-item-subtitle\">\n {subtitle}\n </Body>,\n );\n }\n return inverted ? [...titles].reverse() : titles;\n })()}\n </span>\n\n {(valueTitle \|\| valueSubtitle) && (\n <span\n className={clsx('wds-list-item-value', {\n 'flex-column': valueTitle !== undefined \|\| valueSubtitle !== undefined,\n })}\n >\n {(() => {\n const values = [];\n if (valueTitle) {\n values.push(\n <Body\n key={ids.valueTitle}\n id={ids.valueTitle}\n type={Typography.BODY_LARGE_BOLD}\n className=\"wds-list-item-title-value\"\n >\n {valueTitle}\n </Body>,\n );\n }\n if (valueSubtitle) {\n values.push(\n <Body\n key={ids.valueSubtitle}\n id={ids.valueSubtitle}\n className=\"wds-list-item-subtitle-value\"\n >\n {valueSubtitle}\n </Body>,\n );\n }\n return inverted ? [...values].reverse() : values;\n })()}\n </span>\n )}\n </div>\n\n {control === null ? null : (\n <Body\n className={clsx('wds-list-item-control-wrapper', {\n 'wds-list-item-button-control': controlType === 'button',\n 'wds-list-item-button-control--hasPrompt':\n controlType === 'button' && Boolean(prompt),\n })}\n style={\n {\n '--wds-list-item-control-wrapper-height': mediaSize ? `${mediaSize}px` : 'auto',\n } as React.CSSProperties\n }\n >\n {control}\n </Body>\n )}\n </View>\n </ListItemElement>\n </ListItemContext.Provider>\n );\n};\n\ntype ViewProps = PropsWithChildren<{\n isPartiallyInteractive: boolean;\n controlType?: ListItemTypes;\n controlProps?: ListItemControlProps;\n}> &\n Pick<\n ListItemProps,\n 'subtitle' \| 'additionalInfo' \| 'prompt' \| 'disabled' \| 'disabledPromptMessage' \| 'className'\n >;\n\nfunction View({\n children,\n additionalInfo,\n prompt,\n disabled,\n disabledPromptMessage,\n isPartiallyInteractive,\n controlType = 'non-interactive',\n controlProps,\n className = '',\n}: ViewProps) {\n const { ids, describedByIds } = useContext<ListItemContextData>(ListItemContext);\n const isLinkControl = ['navigation'].includes(controlType);\n\n const isHrefProvided = isLinkControl && !!(controlProps as ListItemNavigationProps)?.href;\n\n const renderExtras = () => {\n const resolvedPrompt =\n disabled && disabledPromptMessage && !prompt ? (\n <Prompt sentiment={Sentiment.NEUTRAL}>{disabledPromptMessage}</Prompt>\n ) : (\n prompt\n );\n\n return (\n <>\n {additionalInfo}\n {resolvedPrompt}\n </>\n );\n };\n\n if (isLinkControl && isHrefProvided) {\n return (\n // for link instances of .Navigation, .IconButton, .Button\n <div className={clsx('wds-list-item-gridWrapper', className)}>\n <PrimitiveAnchor\n aria-describedby={describedByIds}\n href={(controlProps as ListItemNavigationProps)?.href}\n target={(controlProps as ListItemNavigationProps)?.target}\n className={clsx('wds-list-item-view', {\n 'wds-list-item-control': controlType === 'navigation',\n fullyInteractive: !isPartiallyInteractive,\n })}\n disabled={disabled}\n onClick={(controlProps as PrimitiveAnchorProps \| undefined)?.onClick}\n >\n {children}\n </PrimitiveAnchor>\n\n {renderExtras()}\n </div>\n );\n }\n\n if (isPartiallyInteractive \|\| controlType === 'non-interactive') {\n return (\n <div className={clsx('wds-list-item-gridWrapper', className)}>\n <div className=\"wds-list-item-view\">{children}</div>\n\n {renderExtras()}\n </div>\n );\n }\n\n // for form control instances of .Radio, .Checkbox, .Switch, .Button, .Navigation etc\n // Radio cannot be wrapped in a <fieldset> element to announce it as a group.\n const InputWrapper = controlType === 'radio' ? 'div' : 'fieldset';\n return (\n <InputWrapper className={clsx('wds-list-item-gridWrapper', className)}>\n <label\n htmlFor={ids.control}\n className={clsx('wds-list-item-view', {\n clickable: !disabled,\n fullyInteractive: !isPartiallyInteractive,\n })}\n >\n {children}\n </label>\n\n {renderExtras()}\n </InputWrapper>\n );\n}\n\nListItem.Image = Image;\nListItem.AvatarView = AvatarView;\nListItem.AvatarLayout = AvatarLayout;\nListItem.AdditionalInfo = AdditionalInfo;\nListItem.Checkbox = Checkbox;\nListItem.Radio = Radio;\nListItem.IconButton = IconButton;\nListItem.Navigation = Navigation;\nListItem.Button = Button;\nListItem.Switch = Switch;\nListItem.Prompt = Prompt;\n\nexport default ListItem;\n"],"names":["ListItem","as","ListItemElement","title","subtitle","additionalInfo","prompt","inverted","media","spotlight","valueTitle","valueSubtitle","control","disabled","disabledPromptMessage","className","valueColumnWidth","id","idPrefix","useId","controlProps","setControlProps","useState","controlType","setControlType","mediaSize","setMediaSize","ids","isPartiallyInteractive","Boolean","partiallyInteractive","isFullyInteractive","isButtonAsLink","href","titlesAndValues","join","additionalInfoPrompt","filter","describedByIds","useMemo","listItemContext","props","gridColumnsStyle","getFeatureClassName","partials","hasMedia","hasControl","hasInfo","hasPrompt","push","_jsx","ListItemContext","Provider","value","children","_jsxs","clsx","style","undefined","View","titles","Body","type","Typography","BODY_LARGE_BOLD","reverse","values","useContext","isLinkControl","includes","isHrefProvided","renderExtras","resolvedPrompt","Prompt","sentiment","Sentiment","NEUTRAL","_Fragment","PrimitiveAnchor","target","fullyInteractive","onClick","InputWrapper","htmlFor","clickable","Image","AvatarView","AvatarLayout","AdditionalInfo","Checkbox","Radio","IconButton","Navigation","Button","Switch"],"mappings":"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"}
1	+ {"version":3,"file":"ListItem.mjs","sources":["../../../src/listItem/ListItem.tsx"],"sourcesContent":["import {\n useContext,\n useId,\n useMemo,\n useState,\n type PropsWithChildren,\n type ReactNode,\n} from 'react';\nimport { Sentiment, Typography } from '../common';\nimport Body from '../body';\nimport { AdditionalInfo } from './AdditionalInfo';\nimport { IconButton, type ListItemIconButtonProps } from './IconButton';\nimport { Checkbox, type ListItemCheckboxProps } from './Checkbox';\nimport { Navigation, type ListItemNavigationProps } from './Navigation';\nimport { clsx } from 'clsx';\nimport { Button, type ListItemButtonProps } from './Button';\nimport { Radio, type ListItemRadioProps } from './Radio';\nimport { Switch, type ListItemSwitchProps } from './Switch';\nimport { AvatarLayout } from './AvatarLayout';\nimport { AvatarView } from './AvatarView';\nimport { Image } from './Image';\nimport { Prompt } from './Prompt';\nimport { PrimitiveAnchor, type PrimitiveAnchorProps } from '../primitives';\nimport {\n ListItemContext,\n type ListItemContextData,\n type ListItemMediaSize,\n} from './ListItemContext';\n\nexport type ListItemTypes =\n \| 'non-interactive'\n \| 'navigation'\n \| 'radio'\n \| 'checkbox'\n \| 'switch'\n \| 'button'\n \| 'icon-button';\n\nexport type ListItemControlProps =\n \| ListItemNavigationProps\n \| ListItemCheckboxProps\n \| ListItemButtonProps\n \| ListItemIconButtonProps\n \| ListItemRadioProps\n \| ListItemSwitchProps;\n\nexport type ListItemProps = {\n /** @default 'li' /\n as?: 'li' \| 'div';\n /\n Swaps vertical hierarchy of title and subtitle and their corresponding right values.\n /\n inverted?: boolean;\n /\n Disables the control and renders the ListItem in greyscale and with slightly decreased opacity.\n /\n disabled?: boolean;\n /\n If set, it'll extend the `disabled` state, overriding existing or injecting uniquely styled prompt with the message provided via this prop. <br />\n * NB: This message cannot house more than 1 link or inline button.<br />\n * NB: It must be used together with `disabled` prop and will be disregarded otherwise.\n /\n disabledPromptMessage?: ReactNode;\n /\n Highlights the list item as an action to be taken or already taken. <br />\n /\n spotlight?: 'active' \| 'inactive';\n title: ReactNode;\n subtitle?: ReactNode;\n /\n Requires `<ListItem.AdditionalInfo />` component as a sole child. <br />\n * Can be only rendered if `subtitle` is also provided.\n /\n additionalInfo?: ReactNode;\n valueTitle?: ReactNode;\n valueSubtitle?: ReactNode;\n /\n Requires one of the following as a sole child: <br />\n * `<ListItem.AvatarView />`,\n * `<ListItem.AvatarLayout />` or\n * `<ListItem.Image />`\n /\n media?: ReactNode;\n /\n Requires one of the following as a sole child: <br/>\n * `<ListItem.Button />`, <br/>\n * `<ListItem.Checkbox />`, <br/>\n * `<ListItem.IconButton />`, <br/>\n * `<ListItem.Navigation />`, <br/>\n * `<ListItem.Radio />`, or\n * `<ListItem.Switch />`\n * @default null\n /\n control?: ReactNode;\n /\n Requires `<ListItem.Prompt />` component as a sole child.\n /\n prompt?: ReactNode;\n className?: string;\n /\n A number between `0–100` which resolves to a `fr` value of a `grid-template-columns` declaration. E.g. `valueColumnWidth={25}` will result in a `75fr 25fr`. <br />\n * Controls the width ratio of left side content (title and subtitle) to the right side content.\n /\n valueColumnWidth?: number;\n id?: string;\n};\n\n/\n @see [Design documentation](https://wise.design/components/list-item)\n * @see [Storybook documentation](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n /\nexport const ListItem = ({\n as: ListItemElement = 'li',\n title,\n subtitle,\n additionalInfo,\n prompt,\n inverted,\n media,\n spotlight,\n valueTitle,\n valueSubtitle,\n control = null,\n disabled,\n disabledPromptMessage,\n className,\n valueColumnWidth,\n id,\n}: ListItemProps) => {\n const idPrefix = useId();\n const [controlProps, setControlProps] = useState<ListItemControlProps>({});\n const [controlType, setControlType] = useState<ListItemTypes>('non-interactive');\n const [mediaSize, setMediaSize] = useState<ListItemMediaSize \| undefined>();\n\n const ids: ListItemContextData['ids'] = {\n title: `${idPrefix}_title`,\n ...(subtitle ? { subtitle: `${idPrefix}_subtitle` } : {}),\n ...(valueTitle ? { valueTitle: `${idPrefix}_value-title` } : {}),\n ...(valueSubtitle ? { valueSubtitle: `${idPrefix}_value-subtitle` } : {}),\n control: `${idPrefix}_control`,\n ...(prompt \|\| (disabled && disabledPromptMessage) ? { prompt: `${idPrefix}_prompt` } : {}),\n ...(additionalInfo ? { additionalInfo: `${idPrefix}_additional-info` } : {}),\n };\n\n const isPartiallyInteractive = Boolean(\n (controlType === 'button' \|\| controlType === 'icon-button') &&\n (controlProps as ListItemButtonProps \| ListItemIconButtonProps)?.partiallyInteractive,\n );\n const isFullyInteractive = controlType !== 'non-interactive' && !isPartiallyInteractive;\n const isButtonAsLink =\n (controlType === 'button' \|\| controlType === 'icon-button') &&\n Boolean((controlProps as ListItemButtonProps \| ListItemIconButtonProps)?.href);\n\n const titlesAndValues = [\n inverted ? ids.subtitle : ids.title,\n inverted ? ids.title : ids.subtitle,\n inverted ? ids.valueSubtitle : ids.valueTitle,\n inverted ? ids.valueTitle : ids.valueSubtitle,\n ].join(' ');\n const additionalInfoPrompt = [ids.additionalInfo, ids.prompt].filter(Boolean).join(' ');\n\n const describedByIds = useMemo(() => {\n return isFullyInteractive && !isButtonAsLink\n ? additionalInfoPrompt\n : `${titlesAndValues} ${additionalInfoPrompt}`;\n }, [additionalInfoPrompt, isButtonAsLink, isFullyInteractive, titlesAndValues]);\n const listItemContext = useMemo(\n () => ({\n setControlType,\n setControlProps,\n setMediaSize,\n ids,\n props: { disabled, inverted, disabledPromptMessage },\n mediaSize,\n isPartiallyInteractive,\n describedByIds,\n }),\n [describedByIds, mediaSize, disabled, inverted, disabledPromptMessage, isPartiallyInteractive],\n );\n const gridColumnsStyle = {\n '--wds-list-item-body-left': valueColumnWidth ? `${100 - valueColumnWidth}fr` : '50fr',\n '--wds-list-item-body-right': valueColumnWidth ? `${valueColumnWidth}fr` : '50fr',\n } as React.CSSProperties;\n\n const getFeatureClassName = () => {\n const partials = [];\n const hasMedia = Boolean(media);\n const hasControl = Boolean(control);\n const hasInfo = Boolean(additionalInfo);\n const hasPrompt = Boolean(prompt) \|\| (disabled && Boolean(disabledPromptMessage));\n\n / eslint-disable functional/immutable-data /\n if (hasMedia && hasControl) {\n partials.push('wds-list-item-hasMedia-hasControl');\n }\n\n if (hasMedia && !hasControl) {\n partials.push('wds-list-item-hasMedia-noControl');\n }\n\n if (!hasMedia && hasControl) {\n partials.push('wds-list-item-noMedia-hasControl');\n }\n\n if (!hasMedia && !hasControl) {\n partials.push('wds-list-item-noMedia-noControl');\n }\n\n if (hasInfo && hasPrompt) {\n partials.push('wds-list-item-hasInfo-hasPrompt');\n }\n if (hasInfo && !hasPrompt) {\n partials.push('wds-list-item-hasInfo-noPrompt');\n }\n if (!hasInfo && hasPrompt) {\n partials.push('wds-list-item-noInfo-hasPrompt');\n }\n if (!hasInfo && !hasPrompt) {\n partials.push('wds-list-item-noInfo-noPrompt');\n }\n / eslint-enable functional/immutable-data /\n\n return partials.join(' ');\n };\n\n return (\n <ListItemContext.Provider value={listItemContext}>\n <ListItemElement\n className={clsx(\n 'wds-list-item',\n `wds-list-item-${controlType}`,\n getFeatureClassName(),\n {\n 'wds-list-item-interactive': isFullyInteractive,\n 'wds-list-item-partially-interactive': isPartiallyInteractive,\n [`wds-list-item-spotlight wds-list-item-spotlight-${spotlight}`]:\n isFullyInteractive && !!spotlight,\n disabled: disabled && !isPartiallyInteractive,\n 'disabled--has-prompt-reason':\n !disabledPromptMessage && disabled && !isPartiallyInteractive,\n },\n className,\n )}\n id={id}\n aria-disabled={disabled}\n style={\n {\n '--wds-list-item-value-min-height': mediaSize ? `${mediaSize}px` : undefined,\n } as React.CSSProperties\n }\n >\n {isFullyInteractive && spotlight === 'inactive' && (\n <svg aria-hidden=\"true\" className=\"wds-list-item-spotlight__border\">\n <rect />\n </svg>\n )}\n\n <View\n {...{\n isPartiallyInteractive,\n subtitle,\n additionalInfo,\n disabled,\n disabledPromptMessage,\n prompt,\n controlType,\n controlProps,\n }}\n className={getFeatureClassName()}\n >\n {media && <div className=\"wds-list-item-media\">{media}</div>}\n\n {/ Title + Subtitle + Values - Group /}\n <div\n className=\"wds-list-item-body\"\n style={valueColumnWidth ? gridColumnsStyle : undefined}\n >\n {/ Title + Subtitle + Values - Group */}\n <span className=\"wds-list-item-titles\">\n {(() => {\n const titles = [\n <Body\n key={ids.title}\n id={ids.title}\n type={Typography.BODY_LARGE_BOLD}\n className=\"wds-list-item-title\"\n >\n {title}\n </Body>,\n ];\n if (subtitle) {\n titles.push(\n <Body key={ids.subtitle} id={ids.subtitle} className=\"wds-list-item-subtitle\">\n {subtitle}\n </Body>,\n );\n }\n return inverted ? [...titles].reverse() : titles;\n })()}\n </span>\n\n {(valueTitle \|\| valueSubtitle) && (\n <span\n className={clsx('wds-list-item-value', {\n 'flex-column': valueTitle !== undefined \|\| valueSubtitle !== undefined,\n })}\n >\n {(() => {\n const values = [];\n if (valueTitle) {\n values.push(\n <Body\n key={ids.valueTitle}\n id={ids.valueTitle}\n type={Typography.BODY_LARGE_BOLD}\n className=\"wds-list-item-title-value\"\n >\n {valueTitle}\n </Body>,\n );\n }\n if (valueSubtitle) {\n values.push(\n <Body\n key={ids.valueSubtitle}\n id={ids.valueSubtitle}\n className=\"wds-list-item-subtitle-value\"\n >\n {valueSubtitle}\n </Body>,\n );\n }\n return inverted ? [...values].reverse() : values;\n })()}\n </span>\n )}\n </div>\n\n {control === null ? null : (\n <Body\n className={clsx('wds-list-item-control-wrapper', {\n 'wds-list-item-button-control': controlType === 'button',\n 'wds-list-item-button-control--hasPrompt':\n controlType === 'button' && Boolean(prompt),\n })}\n style={\n {\n '--wds-list-item-control-wrapper-height': mediaSize ? `${mediaSize}px` : 'auto',\n } as React.CSSProperties\n }\n >\n {control}\n </Body>\n )}\n </View>\n </ListItemElement>\n </ListItemContext.Provider>\n );\n};\n\ntype ViewProps = PropsWithChildren<{\n isPartiallyInteractive: boolean;\n controlType?: ListItemTypes;\n controlProps?: ListItemControlProps;\n}> &\n Pick<\n ListItemProps,\n 'subtitle' \| 'additionalInfo' \| 'prompt' \| 'disabled' \| 'disabledPromptMessage' \| 'className'\n >;\n\nfunction View({\n children,\n additionalInfo,\n prompt,\n disabled,\n disabledPromptMessage,\n isPartiallyInteractive,\n controlType = 'non-interactive',\n controlProps,\n className = '',\n}: ViewProps) {\n const { ids, describedByIds } = useContext<ListItemContextData>(ListItemContext);\n const isLinkControl = ['navigation'].includes(controlType);\n\n const isHrefProvided = isLinkControl && !!(controlProps as ListItemNavigationProps)?.href;\n\n const renderExtras = () => {\n const resolvedPrompt =\n disabled && disabledPromptMessage && !prompt ? (\n <Prompt sentiment={Sentiment.NEUTRAL}>{disabledPromptMessage}</Prompt>\n ) : (\n prompt\n );\n\n return (\n <>\n {additionalInfo}\n {resolvedPrompt}\n </>\n );\n };\n\n if (isLinkControl && isHrefProvided) {\n return (\n // for link instances of .Navigation, .IconButton, .Button\n <div className={clsx('wds-list-item-gridWrapper', className)}>\n <PrimitiveAnchor\n aria-describedby={describedByIds}\n href={(controlProps as ListItemNavigationProps)?.href}\n target={(controlProps as ListItemNavigationProps)?.target}\n className={clsx('wds-list-item-view', {\n 'wds-list-item-control': controlType === 'navigation',\n fullyInteractive: !isPartiallyInteractive,\n })}\n disabled={disabled}\n onClick={(controlProps as PrimitiveAnchorProps \| undefined)?.onClick}\n >\n {children}\n </PrimitiveAnchor>\n\n {renderExtras()}\n </div>\n );\n }\n\n if (isPartiallyInteractive \|\| controlType === 'non-interactive') {\n return (\n <div className={clsx('wds-list-item-gridWrapper', className)}>\n <div className=\"wds-list-item-view\">{children}</div>\n\n {renderExtras()}\n </div>\n );\n }\n\n // for form control instances of .Radio, .Checkbox, .Switch, .Button, .Navigation etc\n // Radio cannot be wrapped in a <fieldset> element to announce it as a group.\n const InputWrapper = controlType === 'radio' ? 'div' : 'fieldset';\n return (\n <InputWrapper className={clsx('wds-list-item-gridWrapper', className)}>\n <label\n htmlFor={ids.control}\n className={clsx('wds-list-item-view', {\n clickable: !disabled,\n fullyInteractive: !isPartiallyInteractive,\n })}\n >\n {children}\n </label>\n\n {renderExtras()}\n </InputWrapper>\n );\n}\n\nListItem.Image = Image;\nListItem.AvatarView = AvatarView;\nListItem.AvatarLayout = AvatarLayout;\nListItem.AdditionalInfo = AdditionalInfo;\nListItem.Checkbox = Checkbox;\nListItem.Radio = Radio;\nListItem.IconButton = IconButton;\nListItem.Navigation = Navigation;\nListItem.Button = Button;\nListItem.Switch = Switch;\nListItem.Prompt = Prompt;\n\nexport default ListItem;\n"],"names":["ListItem","as","ListItemElement","title","subtitle","additionalInfo","prompt","inverted","media","spotlight","valueTitle","valueSubtitle","control","disabled","disabledPromptMessage","className","valueColumnWidth","id","idPrefix","useId","controlProps","setControlProps","useState","controlType","setControlType","mediaSize","setMediaSize","ids","isPartiallyInteractive","Boolean","partiallyInteractive","isFullyInteractive","isButtonAsLink","href","titlesAndValues","join","additionalInfoPrompt","filter","describedByIds","useMemo","listItemContext","props","gridColumnsStyle","getFeatureClassName","partials","hasMedia","hasControl","hasInfo","hasPrompt","push","_jsx","ListItemContext","Provider","value","children","_jsxs","clsx","style","undefined","View","titles","Body","type","Typography","BODY_LARGE_BOLD","reverse","values","useContext","isLinkControl","includes","isHrefProvided","renderExtras","resolvedPrompt","Prompt","sentiment","Sentiment","NEUTRAL","_Fragment","PrimitiveAnchor","target","fullyInteractive","onClick","InputWrapper","htmlFor","clickable","Image","AvatarView","AvatarLayout","AdditionalInfo","Checkbox","Radio","IconButton","Navigation","Button","Switch"],"mappings":"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"}

package/build/listItem/ListItemContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemContext.js","sources":["~~../../~~src/listItem/ListItemContext.tsx"],"sourcesContent":["import { createContext } from 'react';\nimport type { ListItemTypes, ListItemControlProps, ListItemProps } from './ListItem';\n\nexport type ListItemMediaSize = 24 \| 32 \| 40 \| 48 \| 56 \| 72;\n\nexport type ListItemContextData = {\n setControlType: (type: ListItemTypes) => void;\n setControlProps: (props: ListItemControlProps) => void;\n setMediaSize: (size: ListItemMediaSize \| undefined) => void;\n ids: {\n title: string;\n subtitle?: string;\n valueTitle?: string;\n valueSubtitle?: string;\n additionalInfo?: string;\n control: string;\n prompt?: string;\n };\n props: Pick<ListItemProps, 'disabled' \| 'inverted' \| 'disabledPromptMessage'>;\n mediaSize?: ListItemMediaSize;\n isPartiallyInteractive?: boolean;\n describedByIds: string;\n};\n\nexport const ListItemContext = createContext<ListItemContextData>(\n null as unknown as ListItemContextData,\n);\n"],"names":["ListItemContext","createContext"],"mappings":";;;;MAwBaA,eAAe,gBAAGC,mBAAa,CAC1C,IAAsC;;;;"}
1	+ {"version":3,"file":"ListItemContext.js","sources":["../../../src/listItem/ListItemContext.tsx"],"sourcesContent":["import { createContext } from 'react';\nimport type { ListItemTypes, ListItemControlProps, ListItemProps } from './ListItem';\n\nexport type ListItemMediaSize = 24 \| 32 \| 40 \| 48 \| 56 \| 72;\n\nexport type ListItemContextData = {\n setControlType: (type: ListItemTypes) => void;\n setControlProps: (props: ListItemControlProps) => void;\n setMediaSize: (size: ListItemMediaSize \| undefined) => void;\n ids: {\n title: string;\n subtitle?: string;\n valueTitle?: string;\n valueSubtitle?: string;\n additionalInfo?: string;\n control: string;\n prompt?: string;\n };\n props: Pick<ListItemProps, 'disabled' \| 'inverted' \| 'disabledPromptMessage'>;\n mediaSize?: ListItemMediaSize;\n isPartiallyInteractive?: boolean;\n describedByIds: string;\n};\n\nexport const ListItemContext = createContext<ListItemContextData>(\n null as unknown as ListItemContextData,\n);\n"],"names":["ListItemContext","createContext"],"mappings":";;;;MAwBaA,eAAe,gBAAGC,mBAAa,CAC1C,IAAsC;;;;"}

package/build/listItem/ListItemContext.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemContext.mjs","sources":["~~../../~~src/listItem/ListItemContext.tsx"],"sourcesContent":["import { createContext } from 'react';\nimport type { ListItemTypes, ListItemControlProps, ListItemProps } from './ListItem';\n\nexport type ListItemMediaSize = 24 \| 32 \| 40 \| 48 \| 56 \| 72;\n\nexport type ListItemContextData = {\n setControlType: (type: ListItemTypes) => void;\n setControlProps: (props: ListItemControlProps) => void;\n setMediaSize: (size: ListItemMediaSize \| undefined) => void;\n ids: {\n title: string;\n subtitle?: string;\n valueTitle?: string;\n valueSubtitle?: string;\n additionalInfo?: string;\n control: string;\n prompt?: string;\n };\n props: Pick<ListItemProps, 'disabled' \| 'inverted' \| 'disabledPromptMessage'>;\n mediaSize?: ListItemMediaSize;\n isPartiallyInteractive?: boolean;\n describedByIds: string;\n};\n\nexport const ListItemContext = createContext<ListItemContextData>(\n null as unknown as ListItemContextData,\n);\n"],"names":["ListItemContext","createContext"],"mappings":";;MAwBaA,eAAe,gBAAGC,aAAa,CAC1C,IAAsC;;;;"}
1	+ {"version":3,"file":"ListItemContext.mjs","sources":["../../../src/listItem/ListItemContext.tsx"],"sourcesContent":["import { createContext } from 'react';\nimport type { ListItemTypes, ListItemControlProps, ListItemProps } from './ListItem';\n\nexport type ListItemMediaSize = 24 \| 32 \| 40 \| 48 \| 56 \| 72;\n\nexport type ListItemContextData = {\n setControlType: (type: ListItemTypes) => void;\n setControlProps: (props: ListItemControlProps) => void;\n setMediaSize: (size: ListItemMediaSize \| undefined) => void;\n ids: {\n title: string;\n subtitle?: string;\n valueTitle?: string;\n valueSubtitle?: string;\n additionalInfo?: string;\n control: string;\n prompt?: string;\n };\n props: Pick<ListItemProps, 'disabled' \| 'inverted' \| 'disabledPromptMessage'>;\n mediaSize?: ListItemMediaSize;\n isPartiallyInteractive?: boolean;\n describedByIds: string;\n};\n\nexport const ListItemContext = createContext<ListItemContextData>(\n null as unknown as ListItemContextData,\n);\n"],"names":["ListItemContext","createContext"],"mappings":";;MAwBaA,eAAe,gBAAGC,aAAa,CAC1C,IAAsC;;;;"}

package/build/listItem/Navigation/ListItemNavigation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemNavigation.js","sources":["~~../../../~~src/listItem/Navigation/ListItemNavigation.tsx"],"sourcesContent":["import { ChevronRight } from '@transferwise/icons';\nimport type { ButtonProps } from '../../button/Button.types';\nimport { useListItemControl } from '../useListItemControl';\nimport { PrimitiveButton } from '../../primitives';\nimport { useContext } from 'react';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemNavigationProps = Pick<ButtonProps, 'onClick' \| 'href' \| 'target'>;\n\n/*\n This component allows for rendering a control functionally synonymous with HTML `anchor` or a\n * `button`, giving users a rich way to choose between options and navigate to another screen or\n * step in a flow. It offers only a subset of features of the HTML element in line with the\n * ListItem's constraints.<br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---navigation) for details.\n */\nexport const Navigation = function Navigation({ href, ...props }: ListItemNavigationProps) {\n const { baseItemProps } = useListItemControl('navigation', { href, ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n const icon = <ChevronRight size={16} />;\n\n return href ? (\n <>{icon}</>\n ) : (\n <PrimitiveButton\n disabled={baseItemProps.disabled}\n aria-describedby={describedByIds}\n id={ids.control}\n className=\"btn-unstyled wds-list-item-control\"\n onClick={props.onClick as React.MouseEventHandler<HTMLButtonElement> \| undefined}\n >\n {icon}\n </PrimitiveButton>\n );\n};\n\nNavigation.displayName = 'ListItem.Navigation';\n"],"names":["Navigation","href","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","icon","_jsx","ChevronRight","size","_Fragment","children","PrimitiveButton","disabled","id","control","className","onClick","displayName"],"mappings":";;;;;;;;;;AAiBO,MAAMA,UAAU,GAAG,SAASA,UAAUA,CAAC;EAAEC,IAAI;EAAE,GAAGC;AAAK,CAA2B,EAAA;EACvF,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,YAAY,EAAE;IAAEH,IAAI;IAAE,GAAGC;AAAK,GAAE,CAAC;EAC9E,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;AAC3D,EAAA,MAAMC,IAAI,gBAAGC,cAAA,CAACC,kBAAY,EAAA;AAACC,IAAAA,IAAI,EAAE;AAAG,GAAA,CAAG;AAEvC,EAAA,OAAOX,IAAI,gBACTS,cAAA,CAAAG,mBAAA,EAAA;AAAAC,IAAAA,QAAA,EAAGL;AAAI,GAAC,CAAG,gBAEXC,cAAA,CAACK,uBAAe,EAAA;IACdC,QAAQ,EAAEb,aAAa,CAACa,QAAS;AACjC,IAAA,kBAAA,EAAkBV,cAAe;IACjCW,EAAE,EAAEZ,GAAG,CAACa,OAAQ;AAChBC,IAAAA,SAAS,EAAC,oCAAoC;IAC9CC,OAAO,EAAElB,KAAK,CAACkB,OAAkE;AAAAN,IAAAA,QAAA,EAEhFL;AAAI,GACU,CAClB;AACH;AAEAT,UAAU,CAACqB,WAAW,GAAG,qBAAqB;;;;"}
1	+ {"version":3,"file":"ListItemNavigation.js","sources":["../../../../src/listItem/Navigation/ListItemNavigation.tsx"],"sourcesContent":["import { ChevronRight } from '@transferwise/icons';\nimport type { ButtonProps } from '../../button/Button.types';\nimport { useListItemControl } from '../useListItemControl';\nimport { PrimitiveButton } from '../../primitives';\nimport { useContext } from 'react';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemNavigationProps = Pick<ButtonProps, 'onClick' \| 'href' \| 'target'>;\n\n/*\n This component allows for rendering a control functionally synonymous with HTML `anchor` or a\n * `button`, giving users a rich way to choose between options and navigate to another screen or\n * step in a flow. It offers only a subset of features of the HTML element in line with the\n * ListItem's constraints.<br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---navigation) for details.\n */\nexport const Navigation = function Navigation({ href, ...props }: ListItemNavigationProps) {\n const { baseItemProps } = useListItemControl('navigation', { href, ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n const icon = <ChevronRight size={16} />;\n\n return href ? (\n <>{icon}</>\n ) : (\n <PrimitiveButton\n disabled={baseItemProps.disabled}\n aria-describedby={describedByIds}\n id={ids.control}\n className=\"btn-unstyled wds-list-item-control\"\n onClick={props.onClick as React.MouseEventHandler<HTMLButtonElement> \| undefined}\n >\n {icon}\n </PrimitiveButton>\n );\n};\n\nNavigation.displayName = 'ListItem.Navigation';\n"],"names":["Navigation","href","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","icon","_jsx","ChevronRight","size","_Fragment","children","PrimitiveButton","disabled","id","control","className","onClick","displayName"],"mappings":";;;;;;;;;;AAiBO,MAAMA,UAAU,GAAG,SAASA,UAAUA,CAAC;EAAEC,IAAI;EAAE,GAAGC;AAAK,CAA2B,EAAA;EACvF,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,YAAY,EAAE;IAAEH,IAAI;IAAE,GAAGC;AAAK,GAAE,CAAC;EAC9E,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;AAC3D,EAAA,MAAMC,IAAI,gBAAGC,cAAA,CAACC,kBAAY,EAAA;AAACC,IAAAA,IAAI,EAAE;AAAG,GAAA,CAAG;AAEvC,EAAA,OAAOX,IAAI,gBACTS,cAAA,CAAAG,mBAAA,EAAA;AAAAC,IAAAA,QAAA,EAAGL;AAAI,GAAC,CAAG,gBAEXC,cAAA,CAACK,uBAAe,EAAA;IACdC,QAAQ,EAAEb,aAAa,CAACa,QAAS;AACjC,IAAA,kBAAA,EAAkBV,cAAe;IACjCW,EAAE,EAAEZ,GAAG,CAACa,OAAQ;AAChBC,IAAAA,SAAS,EAAC,oCAAoC;IAC9CC,OAAO,EAAElB,KAAK,CAACkB,OAAkE;AAAAN,IAAAA,QAAA,EAEhFL;AAAI,GACU,CAClB;AACH;AAEAT,UAAU,CAACqB,WAAW,GAAG,qBAAqB;;;;"}

package/build/listItem/Navigation/ListItemNavigation.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemNavigation.mjs","sources":["~~../../../~~src/listItem/Navigation/ListItemNavigation.tsx"],"sourcesContent":["import { ChevronRight } from '@transferwise/icons';\nimport type { ButtonProps } from '../../button/Button.types';\nimport { useListItemControl } from '../useListItemControl';\nimport { PrimitiveButton } from '../../primitives';\nimport { useContext } from 'react';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemNavigationProps = Pick<ButtonProps, 'onClick' \| 'href' \| 'target'>;\n\n/*\n This component allows for rendering a control functionally synonymous with HTML `anchor` or a\n * `button`, giving users a rich way to choose between options and navigate to another screen or\n * step in a flow. It offers only a subset of features of the HTML element in line with the\n * ListItem's constraints.<br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---navigation) for details.\n */\nexport const Navigation = function Navigation({ href, ...props }: ListItemNavigationProps) {\n const { baseItemProps } = useListItemControl('navigation', { href, ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n const icon = <ChevronRight size={16} />;\n\n return href ? (\n <>{icon}</>\n ) : (\n <PrimitiveButton\n disabled={baseItemProps.disabled}\n aria-describedby={describedByIds}\n id={ids.control}\n className=\"btn-unstyled wds-list-item-control\"\n onClick={props.onClick as React.MouseEventHandler<HTMLButtonElement> \| undefined}\n >\n {icon}\n </PrimitiveButton>\n );\n};\n\nNavigation.displayName = 'ListItem.Navigation';\n"],"names":["Navigation","href","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","icon","_jsx","ChevronRight","size","_Fragment","children","PrimitiveButton","disabled","id","control","className","onClick","displayName"],"mappings":";;;;;;;;AAiBO,MAAMA,UAAU,GAAG,SAASA,UAAUA,CAAC;EAAEC,IAAI;EAAE,GAAGC;AAAK,CAA2B,EAAA;EACvF,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,YAAY,EAAE;IAAEH,IAAI;IAAE,GAAGC;AAAK,GAAE,CAAC;EAC9E,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;AAC3D,EAAA,MAAMC,IAAI,gBAAGC,GAAA,CAACC,YAAY,EAAA;AAACC,IAAAA,IAAI,EAAE;AAAG,GAAA,CAAG;AAEvC,EAAA,OAAOX,IAAI,gBACTS,GAAA,CAAAG,QAAA,EAAA;AAAAC,IAAAA,QAAA,EAAGL;AAAI,GAAC,CAAG,gBAEXC,GAAA,CAACK,eAAe,EAAA;IACdC,QAAQ,EAAEb,aAAa,CAACa,QAAS;AACjC,IAAA,kBAAA,EAAkBV,cAAe;IACjCW,EAAE,EAAEZ,GAAG,CAACa,OAAQ;AAChBC,IAAAA,SAAS,EAAC,oCAAoC;IAC9CC,OAAO,EAAElB,KAAK,CAACkB,OAAkE;AAAAN,IAAAA,QAAA,EAEhFL;AAAI,GACU,CAClB;AACH;AAEAT,UAAU,CAACqB,WAAW,GAAG,qBAAqB;;;;"}
1	+ {"version":3,"file":"ListItemNavigation.mjs","sources":["../../../../src/listItem/Navigation/ListItemNavigation.tsx"],"sourcesContent":["import { ChevronRight } from '@transferwise/icons';\nimport type { ButtonProps } from '../../button/Button.types';\nimport { useListItemControl } from '../useListItemControl';\nimport { PrimitiveButton } from '../../primitives';\nimport { useContext } from 'react';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemNavigationProps = Pick<ButtonProps, 'onClick' \| 'href' \| 'target'>;\n\n/*\n This component allows for rendering a control functionally synonymous with HTML `anchor` or a\n * `button`, giving users a rich way to choose between options and navigate to another screen or\n * step in a flow. It offers only a subset of features of the HTML element in line with the\n * ListItem's constraints.<br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---navigation) for details.\n */\nexport const Navigation = function Navigation({ href, ...props }: ListItemNavigationProps) {\n const { baseItemProps } = useListItemControl('navigation', { href, ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n const icon = <ChevronRight size={16} />;\n\n return href ? (\n <>{icon}</>\n ) : (\n <PrimitiveButton\n disabled={baseItemProps.disabled}\n aria-describedby={describedByIds}\n id={ids.control}\n className=\"btn-unstyled wds-list-item-control\"\n onClick={props.onClick as React.MouseEventHandler<HTMLButtonElement> \| undefined}\n >\n {icon}\n </PrimitiveButton>\n );\n};\n\nNavigation.displayName = 'ListItem.Navigation';\n"],"names":["Navigation","href","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","icon","_jsx","ChevronRight","size","_Fragment","children","PrimitiveButton","disabled","id","control","className","onClick","displayName"],"mappings":";;;;;;;;AAiBO,MAAMA,UAAU,GAAG,SAASA,UAAUA,CAAC;EAAEC,IAAI;EAAE,GAAGC;AAAK,CAA2B,EAAA;EACvF,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,YAAY,EAAE;IAAEH,IAAI;IAAE,GAAGC;AAAK,GAAE,CAAC;EAC9E,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;AAC3D,EAAA,MAAMC,IAAI,gBAAGC,GAAA,CAACC,YAAY,EAAA;AAACC,IAAAA,IAAI,EAAE;AAAG,GAAA,CAAG;AAEvC,EAAA,OAAOX,IAAI,gBACTS,GAAA,CAAAG,QAAA,EAAA;AAAAC,IAAAA,QAAA,EAAGL;AAAI,GAAC,CAAG,gBAEXC,GAAA,CAACK,eAAe,EAAA;IACdC,QAAQ,EAAEb,aAAa,CAACa,QAAS;AACjC,IAAA,kBAAA,EAAkBV,cAAe;IACjCW,EAAE,EAAEZ,GAAG,CAACa,OAAQ;AAChBC,IAAAA,SAAS,EAAC,oCAAoC;IAC9CC,OAAO,EAAElB,KAAK,CAACkB,OAAkE;AAAAN,IAAAA,QAAA,EAEhFL;AAAI,GACU,CAClB;AACH;AAEAT,UAAU,CAACqB,WAAW,GAAG,qBAAqB;;;;"}

package/build/listItem/Prompt/ListItemPrompt.js CHANGED Viewed

@@ -3,8 +3,8 @@
 var React = require('react');
 require('../../common/theme.js');
 require('../../common/direction.js');
-require('@transferwise/neptune-tokens');
 require('../../common/propsValues/control.js');
+require('../../common/propsValues/breakpoint.js');
 require('../../common/propsValues/size.js');
 require('../../common/propsValues/typography.js');
 require('../../common/propsValues/width.js');

package/build/listItem/Prompt/ListItemPrompt.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemPrompt.js","sources":["~~../../../~~src/listItem/Prompt/ListItemPrompt.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport { Sentiment } from '../../common';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport { InlinePrompt, type InlinePromptProps } from '../../prompt';\n\nexport type ListItemPromptProps = Pick<\n InlinePromptProps,\n 'children' \| 'sentiment' \| 'mediaLabel' \| 'media' \| 'loading'\n>;\n\n/*\n This component allows for rendering an Inline Prompt. <br />\n * In the future it will be a thin wrapper around a standalone component.<br />\n \n Please refer to the [Design documentation](https://wise.design/components/list-item#prompt) for details.\n */\nexport const Prompt = ({\n sentiment = Sentiment.NEUTRAL,\n mediaLabel,\n children,\n media,\n loading,\n}: ListItemPromptProps) => {\n const { ids, props } = useContext<ListItemContextData>(ListItemContext);\n const isLongLivedMuted = props.disabled && Boolean(props.disabledPromptMessage);\n\n return (\n <InlinePrompt\n id={ids.prompt}\n sentiment={sentiment}\n media={media}\n loading={loading}\n mediaLabel={mediaLabel}\n muted={isLongLivedMuted}\n className=\"wds-list-item-prompt\"\n >\n {isLongLivedMuted ? props.disabledPromptMessage : children}\n </InlinePrompt>\n );\n};\n\nPrompt.displayName = 'ListItem.Prompt';\n"],"names":["Prompt","sentiment","Sentiment","NEUTRAL","mediaLabel","children","media","loading","ids","props","useContext","ListItemContext","isLongLivedMuted","disabled","Boolean","disabledPromptMessage","_jsx","InlinePrompt","id","prompt","muted","className","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBO,MAAMA,MAAM,GAAGA,CAAC;aACrBC,WAAS,GAAGC,mBAAS,CAACC,OAAO;EAC7BC,UAAU;EACVC,QAAQ;EACRC,KAAK;AACLC,EAAAA;AAAO,CACa,KAAI;EACxB,MAAM;IAAEC,GAAG;AAAEC,IAAAA;AAAK,GAAE,GAAGC,gBAAU,CAAsBC,+BAAe,CAAC;EACvE,MAAMC,gBAAgB,GAAGH,KAAK,CAACI,QAAQ,IAAIC,OAAO,CAACL,KAAK,CAACM,qBAAqB,CAAC;EAE/E,oBACEC,cAAA,CAACC,yBAAY,EAAA;IACXC,EAAE,EAAEV,GAAG,CAACW,MAAO;AACflB,IAAAA,SAAS,EAAEA,WAAU;AACrBK,IAAAA,KAAK,EAAEA,KAAM;AACbC,IAAAA,OAAO,EAAEA,OAAQ;AACjBH,IAAAA,UAAU,EAAEA,UAAW;AACvBgB,IAAAA,KAAK,EAAER,gBAAiB;AACxBS,IAAAA,SAAS,EAAC,sBAAsB;AAAAhB,IAAAA,QAAA,EAE/BO,gBAAgB,GAAGH,KAAK,CAACM,qBAAqB,GAAGV;AAAQ,GAC9C,CAAC;AAEnB;AAEAL,MAAM,CAACsB,WAAW,GAAG,iBAAiB;;;;"}
1	+ {"version":3,"file":"ListItemPrompt.js","sources":["../../../../src/listItem/Prompt/ListItemPrompt.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport { Sentiment } from '../../common';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport { InlinePrompt, type InlinePromptProps } from '../../prompt';\n\nexport type ListItemPromptProps = Pick<\n InlinePromptProps,\n 'children' \| 'sentiment' \| 'mediaLabel' \| 'media' \| 'loading'\n>;\n\n/*\n This component allows for rendering an Inline Prompt. <br />\n * In the future it will be a thin wrapper around a standalone component.<br />\n \n Please refer to the [Design documentation](https://wise.design/components/list-item#prompt) for details.\n */\nexport const Prompt = ({\n sentiment = Sentiment.NEUTRAL,\n mediaLabel,\n children,\n media,\n loading,\n}: ListItemPromptProps) => {\n const { ids, props } = useContext<ListItemContextData>(ListItemContext);\n const isLongLivedMuted = props.disabled && Boolean(props.disabledPromptMessage);\n\n return (\n <InlinePrompt\n id={ids.prompt}\n sentiment={sentiment}\n media={media}\n loading={loading}\n mediaLabel={mediaLabel}\n muted={isLongLivedMuted}\n className=\"wds-list-item-prompt\"\n >\n {isLongLivedMuted ? props.disabledPromptMessage : children}\n </InlinePrompt>\n );\n};\n\nPrompt.displayName = 'ListItem.Prompt';\n"],"names":["Prompt","sentiment","Sentiment","NEUTRAL","mediaLabel","children","media","loading","ids","props","useContext","ListItemContext","isLongLivedMuted","disabled","Boolean","disabledPromptMessage","_jsx","InlinePrompt","id","prompt","muted","className","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBO,MAAMA,MAAM,GAAGA,CAAC;aACrBC,WAAS,GAAGC,mBAAS,CAACC,OAAO;EAC7BC,UAAU;EACVC,QAAQ;EACRC,KAAK;AACLC,EAAAA;AAAO,CACa,KAAI;EACxB,MAAM;IAAEC,GAAG;AAAEC,IAAAA;AAAK,GAAE,GAAGC,gBAAU,CAAsBC,+BAAe,CAAC;EACvE,MAAMC,gBAAgB,GAAGH,KAAK,CAACI,QAAQ,IAAIC,OAAO,CAACL,KAAK,CAACM,qBAAqB,CAAC;EAE/E,oBACEC,cAAA,CAACC,yBAAY,EAAA;IACXC,EAAE,EAAEV,GAAG,CAACW,MAAO;AACflB,IAAAA,SAAS,EAAEA,WAAU;AACrBK,IAAAA,KAAK,EAAEA,KAAM;AACbC,IAAAA,OAAO,EAAEA,OAAQ;AACjBH,IAAAA,UAAU,EAAEA,UAAW;AACvBgB,IAAAA,KAAK,EAAER,gBAAiB;AACxBS,IAAAA,SAAS,EAAC,sBAAsB;AAAAhB,IAAAA,QAAA,EAE/BO,gBAAgB,GAAGH,KAAK,CAACM,qBAAqB,GAAGV;AAAQ,GAC9C,CAAC;AAEnB;AAEAL,MAAM,CAACsB,WAAW,GAAG,iBAAiB;;;;"}

package/build/listItem/Prompt/ListItemPrompt.mjs CHANGED Viewed

@@ -1,8 +1,8 @@
 import { useContext } from 'react';
 import '../../common/theme.mjs';
 import '../../common/direction.mjs';
-import '@transferwise/neptune-tokens';
 import '../../common/propsValues/control.mjs';
+import '../../common/propsValues/breakpoint.mjs';
 import '../../common/propsValues/size.mjs';
 import '../../common/propsValues/typography.mjs';
 import '../../common/propsValues/width.mjs';

package/build/listItem/Prompt/ListItemPrompt.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemPrompt.mjs","sources":["~~../../../~~src/listItem/Prompt/ListItemPrompt.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport { Sentiment } from '../../common';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport { InlinePrompt, type InlinePromptProps } from '../../prompt';\n\nexport type ListItemPromptProps = Pick<\n InlinePromptProps,\n 'children' \| 'sentiment' \| 'mediaLabel' \| 'media' \| 'loading'\n>;\n\n/*\n This component allows for rendering an Inline Prompt. <br />\n * In the future it will be a thin wrapper around a standalone component.<br />\n \n Please refer to the [Design documentation](https://wise.design/components/list-item#prompt) for details.\n */\nexport const Prompt = ({\n sentiment = Sentiment.NEUTRAL,\n mediaLabel,\n children,\n media,\n loading,\n}: ListItemPromptProps) => {\n const { ids, props } = useContext<ListItemContextData>(ListItemContext);\n const isLongLivedMuted = props.disabled && Boolean(props.disabledPromptMessage);\n\n return (\n <InlinePrompt\n id={ids.prompt}\n sentiment={sentiment}\n media={media}\n loading={loading}\n mediaLabel={mediaLabel}\n muted={isLongLivedMuted}\n className=\"wds-list-item-prompt\"\n >\n {isLongLivedMuted ? props.disabledPromptMessage : children}\n </InlinePrompt>\n );\n};\n\nPrompt.displayName = 'ListItem.Prompt';\n"],"names":["Prompt","sentiment","Sentiment","NEUTRAL","mediaLabel","children","media","loading","ids","props","useContext","ListItemContext","isLongLivedMuted","disabled","Boolean","disabledPromptMessage","_jsx","InlinePrompt","id","prompt","muted","className","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBO,MAAMA,MAAM,GAAGA,CAAC;EACrBC,SAAS,GAAGC,SAAS,CAACC,OAAO;EAC7BC,UAAU;EACVC,QAAQ;EACRC,KAAK;AACLC,EAAAA;AAAO,CACa,KAAI;EACxB,MAAM;IAAEC,GAAG;AAAEC,IAAAA;AAAK,GAAE,GAAGC,UAAU,CAAsBC,eAAe,CAAC;EACvE,MAAMC,gBAAgB,GAAGH,KAAK,CAACI,QAAQ,IAAIC,OAAO,CAACL,KAAK,CAACM,qBAAqB,CAAC;EAE/E,oBACEC,GAAA,CAACC,YAAY,EAAA;IACXC,EAAE,EAAEV,GAAG,CAACW,MAAO;AACflB,IAAAA,SAAS,EAAEA,SAAU;AACrBK,IAAAA,KAAK,EAAEA,KAAM;AACbC,IAAAA,OAAO,EAAEA,OAAQ;AACjBH,IAAAA,UAAU,EAAEA,UAAW;AACvBgB,IAAAA,KAAK,EAAER,gBAAiB;AACxBS,IAAAA,SAAS,EAAC,sBAAsB;AAAAhB,IAAAA,QAAA,EAE/BO,gBAAgB,GAAGH,KAAK,CAACM,qBAAqB,GAAGV;AAAQ,GAC9C,CAAC;AAEnB;AAEAL,MAAM,CAACsB,WAAW,GAAG,iBAAiB;;;;"}
1	+ {"version":3,"file":"ListItemPrompt.mjs","sources":["../../../../src/listItem/Prompt/ListItemPrompt.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport { Sentiment } from '../../common';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport { InlinePrompt, type InlinePromptProps } from '../../prompt';\n\nexport type ListItemPromptProps = Pick<\n InlinePromptProps,\n 'children' \| 'sentiment' \| 'mediaLabel' \| 'media' \| 'loading'\n>;\n\n/*\n This component allows for rendering an Inline Prompt. <br />\n * In the future it will be a thin wrapper around a standalone component.<br />\n \n Please refer to the [Design documentation](https://wise.design/components/list-item#prompt) for details.\n */\nexport const Prompt = ({\n sentiment = Sentiment.NEUTRAL,\n mediaLabel,\n children,\n media,\n loading,\n}: ListItemPromptProps) => {\n const { ids, props } = useContext<ListItemContextData>(ListItemContext);\n const isLongLivedMuted = props.disabled && Boolean(props.disabledPromptMessage);\n\n return (\n <InlinePrompt\n id={ids.prompt}\n sentiment={sentiment}\n media={media}\n loading={loading}\n mediaLabel={mediaLabel}\n muted={isLongLivedMuted}\n className=\"wds-list-item-prompt\"\n >\n {isLongLivedMuted ? props.disabledPromptMessage : children}\n </InlinePrompt>\n );\n};\n\nPrompt.displayName = 'ListItem.Prompt';\n"],"names":["Prompt","sentiment","Sentiment","NEUTRAL","mediaLabel","children","media","loading","ids","props","useContext","ListItemContext","isLongLivedMuted","disabled","Boolean","disabledPromptMessage","_jsx","InlinePrompt","id","prompt","muted","className","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBO,MAAMA,MAAM,GAAGA,CAAC;EACrBC,SAAS,GAAGC,SAAS,CAACC,OAAO;EAC7BC,UAAU;EACVC,QAAQ;EACRC,KAAK;AACLC,EAAAA;AAAO,CACa,KAAI;EACxB,MAAM;IAAEC,GAAG;AAAEC,IAAAA;AAAK,GAAE,GAAGC,UAAU,CAAsBC,eAAe,CAAC;EACvE,MAAMC,gBAAgB,GAAGH,KAAK,CAACI,QAAQ,IAAIC,OAAO,CAACL,KAAK,CAACM,qBAAqB,CAAC;EAE/E,oBACEC,GAAA,CAACC,YAAY,EAAA;IACXC,EAAE,EAAEV,GAAG,CAACW,MAAO;AACflB,IAAAA,SAAS,EAAEA,SAAU;AACrBK,IAAAA,KAAK,EAAEA,KAAM;AACbC,IAAAA,OAAO,EAAEA,OAAQ;AACjBH,IAAAA,UAAU,EAAEA,UAAW;AACvBgB,IAAAA,KAAK,EAAER,gBAAiB;AACxBS,IAAAA,SAAS,EAAC,sBAAsB;AAAAhB,IAAAA,QAAA,EAE/BO,gBAAgB,GAAGH,KAAK,CAACM,qBAAqB,GAAGV;AAAQ,GAC9C,CAAC;AAEnB;AAEAL,MAAM,CAACsB,WAAW,GAAG,iBAAiB;;;;"}

package/build/listItem/Radio/ListItemRadio.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemRadio.js","sources":["~~../../../~~src/listItem/Radio/ListItemRadio.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport RadioButton, { type RadioButtonProps } from '../../common/RadioButton/RadioButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemRadioProps = Omit<\n RadioButtonProps,\n 'disabled' \| 'readOnly' \| 'className' \| 'id'\n>;\n\n/*\n This component allows for rendering a Button control. It's a thin wrapper around the\n * [Button component](https://storybook.wise.design/?path=/docs/content-button--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---button) for details.\n */\nexport const Radio = function (props: ListItemRadioProps) {\n const { baseItemProps } = useListItemControl('radio', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <RadioButton\n {...props}\n aria-describedby={describedByIds}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n />\n );\n};\n\nRadio.displayName = 'ListItem.Radio';\n"],"names":["Radio","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","RadioButton","className","disabled","id","control","displayName"],"mappings":";;;;;;;;MAiBaA,KAAK,GAAG,UAAUC,KAAyB,EAAA;EACtD,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,OAAO,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACnE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;EAE3D,oBACEC,cAAA,CAACC,mBAAW,EAAA;AAAA,IAAA,GACNR,KAAK;AACT,IAAA,kBAAA,EAAkBI,cAAe;AACjCK,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS;AAAQ,GAAA,CAChB;AAEN;AAEAb,KAAK,CAACc,WAAW,GAAG,gBAAgB;;;;"}
1	+ {"version":3,"file":"ListItemRadio.js","sources":["../../../../src/listItem/Radio/ListItemRadio.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport RadioButton, { type RadioButtonProps } from '../../common/RadioButton/RadioButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemRadioProps = Omit<\n RadioButtonProps,\n 'disabled' \| 'readOnly' \| 'className' \| 'id'\n>;\n\n/*\n This component allows for rendering a Button control. It's a thin wrapper around the\n * [Button component](https://storybook.wise.design/?path=/docs/content-button--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---button) for details.\n */\nexport const Radio = function (props: ListItemRadioProps) {\n const { baseItemProps } = useListItemControl('radio', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <RadioButton\n {...props}\n aria-describedby={describedByIds}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n />\n );\n};\n\nRadio.displayName = 'ListItem.Radio';\n"],"names":["Radio","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","RadioButton","className","disabled","id","control","displayName"],"mappings":";;;;;;;;MAiBaA,KAAK,GAAG,UAAUC,KAAyB,EAAA;EACtD,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,OAAO,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACnE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;EAE3D,oBACEC,cAAA,CAACC,mBAAW,EAAA;AAAA,IAAA,GACNR,KAAK;AACT,IAAA,kBAAA,EAAkBI,cAAe;AACjCK,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS;AAAQ,GAAA,CAChB;AAEN;AAEAb,KAAK,CAACc,WAAW,GAAG,gBAAgB;;;;"}

package/build/listItem/Radio/ListItemRadio.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemRadio.mjs","sources":["~~../../../~~src/listItem/Radio/ListItemRadio.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport RadioButton, { type RadioButtonProps } from '../../common/RadioButton/RadioButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemRadioProps = Omit<\n RadioButtonProps,\n 'disabled' \| 'readOnly' \| 'className' \| 'id'\n>;\n\n/*\n This component allows for rendering a Button control. It's a thin wrapper around the\n * [Button component](https://storybook.wise.design/?path=/docs/content-button--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---button) for details.\n */\nexport const Radio = function (props: ListItemRadioProps) {\n const { baseItemProps } = useListItemControl('radio', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <RadioButton\n {...props}\n aria-describedby={describedByIds}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n />\n );\n};\n\nRadio.displayName = 'ListItem.Radio';\n"],"names":["Radio","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","RadioButton","className","disabled","id","control","displayName"],"mappings":";;;;;;MAiBaA,KAAK,GAAG,UAAUC,KAAyB,EAAA;EACtD,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,OAAO,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACnE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;EAE3D,oBACEC,GAAA,CAACC,WAAW,EAAA;AAAA,IAAA,GACNR,KAAK;AACT,IAAA,kBAAA,EAAkBI,cAAe;AACjCK,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS;AAAQ,GAAA,CAChB;AAEN;AAEAb,KAAK,CAACc,WAAW,GAAG,gBAAgB;;;;"}
1	+ {"version":3,"file":"ListItemRadio.mjs","sources":["../../../../src/listItem/Radio/ListItemRadio.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport RadioButton, { type RadioButtonProps } from '../../common/RadioButton/RadioButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemRadioProps = Omit<\n RadioButtonProps,\n 'disabled' \| 'readOnly' \| 'className' \| 'id'\n>;\n\n/*\n This component allows for rendering a Button control. It's a thin wrapper around the\n * [Button component](https://storybook.wise.design/?path=/docs/content-button--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---button) for details.\n */\nexport const Radio = function (props: ListItemRadioProps) {\n const { baseItemProps } = useListItemControl('radio', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <RadioButton\n {...props}\n aria-describedby={describedByIds}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n />\n );\n};\n\nRadio.displayName = 'ListItem.Radio';\n"],"names":["Radio","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","RadioButton","className","disabled","id","control","displayName"],"mappings":";;;;;;MAiBaA,KAAK,GAAG,UAAUC,KAAyB,EAAA;EACtD,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,OAAO,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACnE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;EAE3D,oBACEC,GAAA,CAACC,WAAW,EAAA;AAAA,IAAA,GACNR,KAAK;AACT,IAAA,kBAAA,EAAkBI,cAAe;AACjCK,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS;AAAQ,GAAA,CAChB;AAEN;AAEAb,KAAK,CAACc,WAAW,GAAG,gBAAgB;;;;"}

package/build/listItem/Switch/ListItemSwitch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemSwitch.js","sources":["~~../../../~~src/listItem/Switch/ListItemSwitch.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport SwitchComp, { type SwitchProps } from '../../switch';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemSwitchProps = Omit<\n SwitchProps,\n 'disabled' \| 'id' \| 'aria-labelledby' \| 'aria-label'\n>;\n\n/*\n This component allows for rendering a switch control within a fully interactive ListItem. <br />It's a thin wrapper around the\n * [CheckboxButton component](https://storybook.wise.design/?path=/docs/actions-switch--docs),\n * but offers only a subset of its features in line with the ListItem's constraints. <br />\n \n Please refer to the [Design documentation](https://wise.design/components/list-item---switch) for details.\n */\nexport const Switch = function (props: ListItemSwitchProps) {\n const { baseItemProps } = useListItemControl('switch', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <SwitchComp\n {...props}\n aria-describedby={describedByIds}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n />\n );\n};\n\nSwitch.displayName = 'ListItem.Switch';\n"],"names":["Switch","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","SwitchComp","className","disabled","id","control","displayName"],"mappings":";;;;;;;;MAiBaA,MAAM,GAAG,UAAUC,KAA0B,EAAA;EACxD,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,QAAQ,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACpE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;EAE3D,oBACEC,cAAA,CAACC,gBAAU,EAAA;AAAA,IAAA,GACLR,KAAK;AACT,IAAA,kBAAA,EAAkBI,cAAe;AACjCK,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS;AAAQ,GAAA,CAChB;AAEN;AAEAb,MAAM,CAACc,WAAW,GAAG,iBAAiB;;;;"}
1	+ {"version":3,"file":"ListItemSwitch.js","sources":["../../../../src/listItem/Switch/ListItemSwitch.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport SwitchComp, { type SwitchProps } from '../../switch';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemSwitchProps = Omit<\n SwitchProps,\n 'disabled' \| 'id' \| 'aria-labelledby' \| 'aria-label'\n>;\n\n/*\n This component allows for rendering a switch control within a fully interactive ListItem. <br />It's a thin wrapper around the\n * [CheckboxButton component](https://storybook.wise.design/?path=/docs/actions-switch--docs),\n * but offers only a subset of its features in line with the ListItem's constraints. <br />\n \n Please refer to the [Design documentation](https://wise.design/components/list-item---switch) for details.\n */\nexport const Switch = function (props: ListItemSwitchProps) {\n const { baseItemProps } = useListItemControl('switch', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <SwitchComp\n {...props}\n aria-describedby={describedByIds}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n />\n );\n};\n\nSwitch.displayName = 'ListItem.Switch';\n"],"names":["Switch","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","SwitchComp","className","disabled","id","control","displayName"],"mappings":";;;;;;;;MAiBaA,MAAM,GAAG,UAAUC,KAA0B,EAAA;EACxD,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,QAAQ,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACpE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;EAE3D,oBACEC,cAAA,CAACC,gBAAU,EAAA;AAAA,IAAA,GACLR,KAAK;AACT,IAAA,kBAAA,EAAkBI,cAAe;AACjCK,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS;AAAQ,GAAA,CAChB;AAEN;AAEAb,MAAM,CAACc,WAAW,GAAG,iBAAiB;;;;"}

package/build/listItem/Switch/ListItemSwitch.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemSwitch.mjs","sources":["~~../../../~~src/listItem/Switch/ListItemSwitch.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport SwitchComp, { type SwitchProps } from '../../switch';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemSwitchProps = Omit<\n SwitchProps,\n 'disabled' \| 'id' \| 'aria-labelledby' \| 'aria-label'\n>;\n\n/*\n This component allows for rendering a switch control within a fully interactive ListItem. <br />It's a thin wrapper around the\n * [CheckboxButton component](https://storybook.wise.design/?path=/docs/actions-switch--docs),\n * but offers only a subset of its features in line with the ListItem's constraints. <br />\n \n Please refer to the [Design documentation](https://wise.design/components/list-item---switch) for details.\n */\nexport const Switch = function (props: ListItemSwitchProps) {\n const { baseItemProps } = useListItemControl('switch', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <SwitchComp\n {...props}\n aria-describedby={describedByIds}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n />\n );\n};\n\nSwitch.displayName = 'ListItem.Switch';\n"],"names":["Switch","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","SwitchComp","className","disabled","id","control","displayName"],"mappings":";;;;;;MAiBaA,MAAM,GAAG,UAAUC,KAA0B,EAAA;EACxD,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,QAAQ,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACpE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;EAE3D,oBACEC,GAAA,CAACC,QAAU,EAAA;AAAA,IAAA,GACLR,KAAK;AACT,IAAA,kBAAA,EAAkBI,cAAe;AACjCK,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS;AAAQ,GAAA,CAChB;AAEN;AAEAb,MAAM,CAACc,WAAW,GAAG,iBAAiB;;;;"}
1	+ {"version":3,"file":"ListItemSwitch.mjs","sources":["../../../../src/listItem/Switch/ListItemSwitch.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport SwitchComp, { type SwitchProps } from '../../switch';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemSwitchProps = Omit<\n SwitchProps,\n 'disabled' \| 'id' \| 'aria-labelledby' \| 'aria-label'\n>;\n\n/*\n This component allows for rendering a switch control within a fully interactive ListItem. <br />It's a thin wrapper around the\n * [CheckboxButton component](https://storybook.wise.design/?path=/docs/actions-switch--docs),\n * but offers only a subset of its features in line with the ListItem's constraints. <br />\n \n Please refer to the [Design documentation](https://wise.design/components/list-item---switch) for details.\n */\nexport const Switch = function (props: ListItemSwitchProps) {\n const { baseItemProps } = useListItemControl('switch', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <SwitchComp\n {...props}\n aria-describedby={describedByIds}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n />\n );\n};\n\nSwitch.displayName = 'ListItem.Switch';\n"],"names":["Switch","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","SwitchComp","className","disabled","id","control","displayName"],"mappings":";;;;;;MAiBaA,MAAM,GAAG,UAAUC,KAA0B,EAAA;EACxD,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,QAAQ,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACpE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;EAE3D,oBACEC,GAAA,CAACC,QAAU,EAAA;AAAA,IAAA,GACLR,KAAK;AACT,IAAA,kBAAA,EAAkBI,cAAe;AACjCK,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS;AAAQ,GAAA,CAChB;AAEN;AAEAb,MAAM,CAACc,WAAW,GAAG,iBAAiB;;;;"}

package/build/listItem/useListItemControl.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useListItemControl.js","sources":["~~../../~~src/listItem/useListItemControl.tsx"],"sourcesContent":["import { useContext, useLayoutEffect } from 'react';\nimport { ListItemContext, type ListItemContextData } from './ListItemContext';\nimport type { ListItemTypes, ListItemControlProps } from './ListItem';\n\nexport function useListItemControl(controlType: ListItemTypes, controlProps: ListItemControlProps) {\n const {\n setControlType,\n setControlProps,\n props: baseItemProps,\n } = useContext<ListItemContextData>(ListItemContext);\n\n useLayoutEffect(() => {\n setControlType(controlType);\n setControlProps(controlProps);\n }, [controlType, controlProps, setControlType, setControlProps]);\n\n return { baseItemProps };\n}\n"],"names":["useListItemControl","controlType","controlProps","setControlType","setControlProps","props","baseItemProps","useContext","ListItemContext","useLayoutEffect"],"mappings":";;;;;AAIM,SAAUA,kBAAkBA,CAACC,WAA0B,EAAEC,YAAkC,EAAA;EAC/F,MAAM;IACJC,cAAc;IACdC,eAAe;AACfC,IAAAA,KAAK,EAAEC;AAAa,GACrB,GAAGC,gBAAU,CAAsBC,+BAAe,CAAC;AAEpDC,EAAAA,qBAAe,CAAC,MAAK;IACnBN,cAAc,CAACF,WAAW,CAAC;IAC3BG,eAAe,CAACF,YAAY,CAAC;EAC/B,CAAC,EAAE,CAACD,WAAW,EAAEC,YAAY,EAAEC,cAAc,EAAEC,eAAe,CAAC,CAAC;EAEhE,OAAO;AAAEE,IAAAA;GAAe;AAC1B;;;;"}
1	+ {"version":3,"file":"useListItemControl.js","sources":["../../../src/listItem/useListItemControl.tsx"],"sourcesContent":["import { useContext, useLayoutEffect } from 'react';\nimport { ListItemContext, type ListItemContextData } from './ListItemContext';\nimport type { ListItemTypes, ListItemControlProps } from './ListItem';\n\nexport function useListItemControl(controlType: ListItemTypes, controlProps: ListItemControlProps) {\n const {\n setControlType,\n setControlProps,\n props: baseItemProps,\n } = useContext<ListItemContextData>(ListItemContext);\n\n useLayoutEffect(() => {\n setControlType(controlType);\n setControlProps(controlProps);\n }, [controlType, controlProps, setControlType, setControlProps]);\n\n return { baseItemProps };\n}\n"],"names":["useListItemControl","controlType","controlProps","setControlType","setControlProps","props","baseItemProps","useContext","ListItemContext","useLayoutEffect"],"mappings":";;;;;AAIM,SAAUA,kBAAkBA,CAACC,WAA0B,EAAEC,YAAkC,EAAA;EAC/F,MAAM;IACJC,cAAc;IACdC,eAAe;AACfC,IAAAA,KAAK,EAAEC;AAAa,GACrB,GAAGC,gBAAU,CAAsBC,+BAAe,CAAC;AAEpDC,EAAAA,qBAAe,CAAC,MAAK;IACnBN,cAAc,CAACF,WAAW,CAAC;IAC3BG,eAAe,CAACF,YAAY,CAAC;EAC/B,CAAC,EAAE,CAACD,WAAW,EAAEC,YAAY,EAAEC,cAAc,EAAEC,eAAe,CAAC,CAAC;EAEhE,OAAO;AAAEE,IAAAA;GAAe;AAC1B;;;;"}

package/build/listItem/useListItemControl.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useListItemControl.mjs","sources":["~~../../~~src/listItem/useListItemControl.tsx"],"sourcesContent":["import { useContext, useLayoutEffect } from 'react';\nimport { ListItemContext, type ListItemContextData } from './ListItemContext';\nimport type { ListItemTypes, ListItemControlProps } from './ListItem';\n\nexport function useListItemControl(controlType: ListItemTypes, controlProps: ListItemControlProps) {\n const {\n setControlType,\n setControlProps,\n props: baseItemProps,\n } = useContext<ListItemContextData>(ListItemContext);\n\n useLayoutEffect(() => {\n setControlType(controlType);\n setControlProps(controlProps);\n }, [controlType, controlProps, setControlType, setControlProps]);\n\n return { baseItemProps };\n}\n"],"names":["useListItemControl","controlType","controlProps","setControlType","setControlProps","props","baseItemProps","useContext","ListItemContext","useLayoutEffect"],"mappings":";;;AAIM,SAAUA,kBAAkBA,CAACC,WAA0B,EAAEC,YAAkC,EAAA;EAC/F,MAAM;IACJC,cAAc;IACdC,eAAe;AACfC,IAAAA,KAAK,EAAEC;AAAa,GACrB,GAAGC,UAAU,CAAsBC,eAAe,CAAC;AAEpDC,EAAAA,eAAe,CAAC,MAAK;IACnBN,cAAc,CAACF,WAAW,CAAC;IAC3BG,eAAe,CAACF,YAAY,CAAC;EAC/B,CAAC,EAAE,CAACD,WAAW,EAAEC,YAAY,EAAEC,cAAc,EAAEC,eAAe,CAAC,CAAC;EAEhE,OAAO;AAAEE,IAAAA;GAAe;AAC1B;;;;"}
1	+ {"version":3,"file":"useListItemControl.mjs","sources":["../../../src/listItem/useListItemControl.tsx"],"sourcesContent":["import { useContext, useLayoutEffect } from 'react';\nimport { ListItemContext, type ListItemContextData } from './ListItemContext';\nimport type { ListItemTypes, ListItemControlProps } from './ListItem';\n\nexport function useListItemControl(controlType: ListItemTypes, controlProps: ListItemControlProps) {\n const {\n setControlType,\n setControlProps,\n props: baseItemProps,\n } = useContext<ListItemContextData>(ListItemContext);\n\n useLayoutEffect(() => {\n setControlType(controlType);\n setControlProps(controlProps);\n }, [controlType, controlProps, setControlType, setControlProps]);\n\n return { baseItemProps };\n}\n"],"names":["useListItemControl","controlType","controlProps","setControlType","setControlProps","props","baseItemProps","useContext","ListItemContext","useLayoutEffect"],"mappings":";;;AAIM,SAAUA,kBAAkBA,CAACC,WAA0B,EAAEC,YAAkC,EAAA;EAC/F,MAAM;IACJC,cAAc;IACdC,eAAe;AACfC,IAAAA,KAAK,EAAEC;AAAa,GACrB,GAAGC,UAAU,CAAsBC,eAAe,CAAC;AAEpDC,EAAAA,eAAe,CAAC,MAAK;IACnBN,cAAc,CAACF,WAAW,CAAC;IAC3BG,eAAe,CAACF,YAAY,CAAC;EAC/B,CAAC,EAAE,CAACD,WAAW,EAAEC,YAAY,EAAEC,cAAc,EAAEC,eAAe,CAAC,CAAC;EAEhE,OAAO;AAAEE,IAAAA;GAAe;AAC1B;;;;"}

package/build/listItem/useListItemMedia.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useListItemMedia.js","sources":["~~../../~~src/listItem/useListItemMedia.tsx"],"sourcesContent":["import { useContext, useLayoutEffect } from 'react';\nimport {\n ListItemContext,\n type ListItemContextData,\n type ListItemMediaSize,\n} from './ListItemContext';\n\nexport function useListItemMedia(size?: ListItemMediaSize) {\n const { setMediaSize, mediaSize } = useContext<ListItemContextData>(ListItemContext);\n\n useLayoutEffect(() => {\n setMediaSize(size);\n }, [size, setMediaSize]);\n\n return { mediaSize, setMediaSize };\n}\n"],"names":["useListItemMedia","size","setMediaSize","mediaSize","useContext","ListItemContext","useLayoutEffect"],"mappings":";;;;;AAOM,SAAUA,gBAAgBA,CAACC,IAAwB,EAAA;EACvD,MAAM;IAAEC,YAAY;AAAEC,IAAAA;AAAS,GAAE,GAAGC,gBAAU,CAAsBC,+BAAe,CAAC;AAEpFC,EAAAA,qBAAe,CAAC,MAAK;IACnBJ,YAAY,CAACD,IAAI,CAAC;AACpB,EAAA,CAAC,EAAE,CAACA,IAAI,EAAEC,YAAY,CAAC,CAAC;EAExB,OAAO;IAAEC,SAAS;AAAED,IAAAA;GAAc;AACpC;;;;"}
1	+ {"version":3,"file":"useListItemMedia.js","sources":["../../../src/listItem/useListItemMedia.tsx"],"sourcesContent":["import { useContext, useLayoutEffect } from 'react';\nimport {\n ListItemContext,\n type ListItemContextData,\n type ListItemMediaSize,\n} from './ListItemContext';\n\nexport function useListItemMedia(size?: ListItemMediaSize) {\n const { setMediaSize, mediaSize } = useContext<ListItemContextData>(ListItemContext);\n\n useLayoutEffect(() => {\n setMediaSize(size);\n }, [size, setMediaSize]);\n\n return { mediaSize, setMediaSize };\n}\n"],"names":["useListItemMedia","size","setMediaSize","mediaSize","useContext","ListItemContext","useLayoutEffect"],"mappings":";;;;;AAOM,SAAUA,gBAAgBA,CAACC,IAAwB,EAAA;EACvD,MAAM;IAAEC,YAAY;AAAEC,IAAAA;AAAS,GAAE,GAAGC,gBAAU,CAAsBC,+BAAe,CAAC;AAEpFC,EAAAA,qBAAe,CAAC,MAAK;IACnBJ,YAAY,CAACD,IAAI,CAAC;AACpB,EAAA,CAAC,EAAE,CAACA,IAAI,EAAEC,YAAY,CAAC,CAAC;EAExB,OAAO;IAAEC,SAAS;AAAED,IAAAA;GAAc;AACpC;;;;"}

package/build/listItem/useListItemMedia.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useListItemMedia.mjs","sources":["~~../../~~src/listItem/useListItemMedia.tsx"],"sourcesContent":["import { useContext, useLayoutEffect } from 'react';\nimport {\n ListItemContext,\n type ListItemContextData,\n type ListItemMediaSize,\n} from './ListItemContext';\n\nexport function useListItemMedia(size?: ListItemMediaSize) {\n const { setMediaSize, mediaSize } = useContext<ListItemContextData>(ListItemContext);\n\n useLayoutEffect(() => {\n setMediaSize(size);\n }, [size, setMediaSize]);\n\n return { mediaSize, setMediaSize };\n}\n"],"names":["useListItemMedia","size","setMediaSize","mediaSize","useContext","ListItemContext","useLayoutEffect"],"mappings":";;;AAOM,SAAUA,gBAAgBA,CAACC,IAAwB,EAAA;EACvD,MAAM;IAAEC,YAAY;AAAEC,IAAAA;AAAS,GAAE,GAAGC,UAAU,CAAsBC,eAAe,CAAC;AAEpFC,EAAAA,eAAe,CAAC,MAAK;IACnBJ,YAAY,CAACD,IAAI,CAAC;AACpB,EAAA,CAAC,EAAE,CAACA,IAAI,EAAEC,YAAY,CAAC,CAAC;EAExB,OAAO;IAAEC,SAAS;AAAED,IAAAA;GAAc;AACpC;;;;"}
1	+ {"version":3,"file":"useListItemMedia.mjs","sources":["../../../src/listItem/useListItemMedia.tsx"],"sourcesContent":["import { useContext, useLayoutEffect } from 'react';\nimport {\n ListItemContext,\n type ListItemContextData,\n type ListItemMediaSize,\n} from './ListItemContext';\n\nexport function useListItemMedia(size?: ListItemMediaSize) {\n const { setMediaSize, mediaSize } = useContext<ListItemContextData>(ListItemContext);\n\n useLayoutEffect(() => {\n setMediaSize(size);\n }, [size, setMediaSize]);\n\n return { mediaSize, setMediaSize };\n}\n"],"names":["useListItemMedia","size","setMediaSize","mediaSize","useContext","ListItemContext","useLayoutEffect"],"mappings":";;;AAOM,SAAUA,gBAAgBA,CAACC,IAAwB,EAAA;EACvD,MAAM;IAAEC,YAAY;AAAEC,IAAAA;AAAS,GAAE,GAAGC,UAAU,CAAsBC,eAAe,CAAC;AAEpFC,EAAAA,eAAe,CAAC,MAAK;IACnBJ,YAAY,CAACD,IAAI,CAAC;AACpB,EAAA,CAAC,EAAE,CAACA,IAAI,EAAEC,YAAY,CAAC,CAAC;EAExB,OAAO;IAAEC,SAAS;AAAED,IAAAA;GAAc;AACpC;;;;"}

package/build/loader/Loader.js CHANGED Viewed

@@ -7,8 +7,8 @@ var clsx = require('clsx');
 var React = require('react');
 require('../common/theme.js');
 require('../common/direction.js');
-require('@transferwise/neptune-tokens');
 require('../common/propsValues/control.js');
+require('../common/propsValues/breakpoint.js');
 var size = require('../common/propsValues/size.js');
 require('../common/propsValues/typography.js');
 require('../common/propsValues/width.js');

package/build/loader/Loader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Loader.js","sources":["~~../../~~src/loader/Loader.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { useEffect, useState } from 'react';\n\nimport { Size, SizeExtraSmall, SizeSmall, SizeMedium, SizeLarge, SizeExtraLarge } from '../common';\n\n// TODO: We gracefully deprecated xs, lg and xl -- remove these as part of a future breaking change to this component\ntype DeprecatedSize = SizeExtraSmall \| SizeLarge \| SizeExtraLarge;\n\ntype SizeType = SizeSmall \| SizeMedium;\n\nexport type LoaderProps = {\n /*\n @deprecated Use `size` instead.\n * @default false\n /\n small?: boolean;\n /* @default 'md' /\n size?: SizeType \| DeprecatedSize;\n /* @default false /\n displayInstantly?: boolean;\n // TODO: refactor in favor of prop from `CommonProps` type\n /* @default {} /\n classNames?: Record<string, string>;\n 'data-testid'?: string;\n};\n\n/\n Loader component\n \n Docs link: https://transferwise.github.io/neptune-web/components/progress/Loader\n \n @param root0\n * @param root0.small\n * @param root0.size\n * @param root0.classNames\n */\nconst Loader = ({\n small = false,\n size = Size.MEDIUM,\n displayInstantly = false,\n classNames = {},\n ...restProps\n}: LoaderProps) => {\n const { theme } = useTheme();\n const [hasDebounced, setHasDebounced] = useState(displayInstantly);\n\n useEffect(() => {\n let cancelled: boolean;\n let timeout: ReturnType<typeof setTimeout> \| undefined;\n\n if (!displayInstantly) {\n timeout = setTimeout(() => {\n if (!cancelled) {\n setHasDebounced(true);\n }\n }, 1000);\n }\n\n return () => {\n cancelled = true;\n\n clearTimeout(timeout);\n };\n }, []);\n\n const style = (className: string): string => classNames[className] \|\| className;\n const legacySize: SizeType \| DeprecatedSize = small ? Size.SMALL : size;\n const supportedSize = getSupportedSize(legacySize);\n\n if (theme === 'forest-green') {\n // eslint-disable-next-line no-console\n console.warn(\n 'Loader is forbidden to use with Forest Green theme. Check the https://wise.design/components/screen-loader for more info.',\n );\n return <></>;\n }\n\n return (\n <div\n className={clsx(style('tw-loader'), style(`tw-loader--${supportedSize}`), {\n 'tw-loader--visible': hasDebounced,\n })}\n data-testid={restProps['data-testid']}\n />\n );\n};\n\nconst getSupportedSize = (size: SizeType \| DeprecatedSize): SizeType => {\n switch (size) {\n case Size.SMALL:\n case Size.EXTRA_SMALL:\n return Size.SMALL;\n\n case Size.EXTRA_LARGE:\n case Size.LARGE:\n case Size.MEDIUM:\n default:\n return Size.MEDIUM;\n }\n};\n\nexport default Loader;\n"],"names":["Loader","small","size","Size","MEDIUM","displayInstantly","classNames","restProps","theme","useTheme","hasDebounced","setHasDebounced","useState","useEffect","cancelled","timeout","setTimeout","clearTimeout","style","className","legacySize","SMALL","supportedSize","getSupportedSize","console","warn","_jsx","_Fragment","clsx","EXTRA_SMALL","EXTRA_LARGE","LARGE"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,MAAMA,MAAM,GAAGA,CAAC;AACdC,EAAAA,KAAK,GAAG,KAAK;QACbC,MAAI,GAAGC,SAAI,CAACC,MAAM;AAClBC,EAAAA,gBAAgB,GAAG,KAAK;EACxBC,UAAU,GAAG,EAAE;EACf,GAAGC;AAAS,CACA,KAAI;EAChB,MAAM;AAAEC,IAAAA;GAAO,GAAGC,0BAAQ,EAAE;EAC5B,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGC,cAAQ,CAACP,gBAAgB,CAAC;AAElEQ,EAAAA,eAAS,CAAC,MAAK;AACb,IAAA,IAAIC,SAAkB;AACtB,IAAA,IAAIC,OAAkD;IAEtD,IAAI,CAACV,gBAAgB,EAAE;MACrBU,OAAO,GAAGC,UAAU,CAAC,MAAK;QACxB,IAAI,CAACF,SAAS,EAAE;UACdH,eAAe,CAAC,IAAI,CAAC;AACvB,QAAA;MACF,CAAC,EAAE,IAAI,CAAC;AACV,IAAA;AAEA,IAAA,OAAO,MAAK;AACVG,MAAAA,SAAS,GAAG,IAAI;MAEhBG,YAAY,CAACF,OAAO,CAAC;IACvB,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMG,KAAK,GAAIC,SAAiB,IAAab,UAAU,CAACa,SAAS,CAAC,IAAIA,SAAS;EAC/E,MAAMC,UAAU,GAA8BnB,KAAK,GAAGE,SAAI,CAACkB,KAAK,GAAGnB,MAAI;AACvE,EAAA,MAAMoB,aAAa,GAAGC,gBAAgB,CAACH,UAAU,CAAC;EAElD,IAAIZ,KAAK,KAAK,cAAc,EAAE;AAC5B;AACAgB,IAAAA,OAAO,CAACC,IAAI,CACV,2HAA2H,CAC5H;AACD,IAAA,oBAAOC,cAAA,CAAAC,mBAAA,EAAA,GAAK;AACd,EAAA;AAEA,EAAA,oBACED,cAAA,CAAA,KAAA,EAAA;AACEP,IAAAA,SAAS,EAAES,SAAI,CAACV,KAAK,CAAC,WAAW,CAAC,EAAEA,KAAK,CAAC,CAAA,WAAA,EAAcI,aAAa,CAAA,CAAE,CAAC,EAAE;AACxE,MAAA,oBAAoB,EAAEZ;AACvB,KAAA,CAAE;IACH,aAAA,EAAaH,SAAS,CAAC,aAAa;AAAE,GAAA,CACtC;AAEN;AAEA,MAAMgB,gBAAgB,GAAIrB,MAA+B,IAAc;AACrE,EAAA,QAAQA,MAAI;IACV,KAAKC,SAAI,CAACkB,KAAK;IACf,KAAKlB,SAAI,CAAC0B,WAAW;MACnB,OAAO1B,SAAI,CAACkB,KAAK;IAEnB,KAAKlB,SAAI,CAAC2B,WAAW;IACrB,KAAK3B,SAAI,CAAC4B,KAAK;IACf,KAAK5B,SAAI,CAACC,MAAM;AAChB,IAAA;MACE,OAAOD,SAAI,CAACC,MAAM;AACtB;AACF,CAAC;;;;"}
1	+ {"version":3,"file":"Loader.js","sources":["../../../src/loader/Loader.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { useEffect, useState } from 'react';\n\nimport { Size, SizeExtraSmall, SizeSmall, SizeMedium, SizeLarge, SizeExtraLarge } from '../common';\n\n// TODO: We gracefully deprecated xs, lg and xl -- remove these as part of a future breaking change to this component\ntype DeprecatedSize = SizeExtraSmall \| SizeLarge \| SizeExtraLarge;\n\ntype SizeType = SizeSmall \| SizeMedium;\n\nexport type LoaderProps = {\n /*\n @deprecated Use `size` instead.\n * @default false\n /\n small?: boolean;\n /* @default 'md' /\n size?: SizeType \| DeprecatedSize;\n /* @default false /\n displayInstantly?: boolean;\n // TODO: refactor in favor of prop from `CommonProps` type\n /* @default {} /\n classNames?: Record<string, string>;\n 'data-testid'?: string;\n};\n\n/\n Loader component\n \n Docs link: https://transferwise.github.io/neptune-web/components/progress/Loader\n \n @param root0\n * @param root0.small\n * @param root0.size\n * @param root0.classNames\n */\nconst Loader = ({\n small = false,\n size = Size.MEDIUM,\n displayInstantly = false,\n classNames = {},\n ...restProps\n}: LoaderProps) => {\n const { theme } = useTheme();\n const [hasDebounced, setHasDebounced] = useState(displayInstantly);\n\n useEffect(() => {\n let cancelled: boolean;\n let timeout: ReturnType<typeof setTimeout> \| undefined;\n\n if (!displayInstantly) {\n timeout = setTimeout(() => {\n if (!cancelled) {\n setHasDebounced(true);\n }\n }, 1000);\n }\n\n return () => {\n cancelled = true;\n\n clearTimeout(timeout);\n };\n }, []);\n\n const style = (className: string): string => classNames[className] \|\| className;\n const legacySize: SizeType \| DeprecatedSize = small ? Size.SMALL : size;\n const supportedSize = getSupportedSize(legacySize);\n\n if (theme === 'forest-green') {\n // eslint-disable-next-line no-console\n console.warn(\n 'Loader is forbidden to use with Forest Green theme. Check the https://wise.design/components/screen-loader for more info.',\n );\n return <></>;\n }\n\n return (\n <div\n className={clsx(style('tw-loader'), style(`tw-loader--${supportedSize}`), {\n 'tw-loader--visible': hasDebounced,\n })}\n data-testid={restProps['data-testid']}\n />\n );\n};\n\nconst getSupportedSize = (size: SizeType \| DeprecatedSize): SizeType => {\n switch (size) {\n case Size.SMALL:\n case Size.EXTRA_SMALL:\n return Size.SMALL;\n\n case Size.EXTRA_LARGE:\n case Size.LARGE:\n case Size.MEDIUM:\n default:\n return Size.MEDIUM;\n }\n};\n\nexport default Loader;\n"],"names":["Loader","small","size","Size","MEDIUM","displayInstantly","classNames","restProps","theme","useTheme","hasDebounced","setHasDebounced","useState","useEffect","cancelled","timeout","setTimeout","clearTimeout","style","className","legacySize","SMALL","supportedSize","getSupportedSize","console","warn","_jsx","_Fragment","clsx","EXTRA_SMALL","EXTRA_LARGE","LARGE"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,MAAMA,MAAM,GAAGA,CAAC;AACdC,EAAAA,KAAK,GAAG,KAAK;QACbC,MAAI,GAAGC,SAAI,CAACC,MAAM;AAClBC,EAAAA,gBAAgB,GAAG,KAAK;EACxBC,UAAU,GAAG,EAAE;EACf,GAAGC;AAAS,CACA,KAAI;EAChB,MAAM;AAAEC,IAAAA;GAAO,GAAGC,0BAAQ,EAAE;EAC5B,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGC,cAAQ,CAACP,gBAAgB,CAAC;AAElEQ,EAAAA,eAAS,CAAC,MAAK;AACb,IAAA,IAAIC,SAAkB;AACtB,IAAA,IAAIC,OAAkD;IAEtD,IAAI,CAACV,gBAAgB,EAAE;MACrBU,OAAO,GAAGC,UAAU,CAAC,MAAK;QACxB,IAAI,CAACF,SAAS,EAAE;UACdH,eAAe,CAAC,IAAI,CAAC;AACvB,QAAA;MACF,CAAC,EAAE,IAAI,CAAC;AACV,IAAA;AAEA,IAAA,OAAO,MAAK;AACVG,MAAAA,SAAS,GAAG,IAAI;MAEhBG,YAAY,CAACF,OAAO,CAAC;IACvB,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMG,KAAK,GAAIC,SAAiB,IAAab,UAAU,CAACa,SAAS,CAAC,IAAIA,SAAS;EAC/E,MAAMC,UAAU,GAA8BnB,KAAK,GAAGE,SAAI,CAACkB,KAAK,GAAGnB,MAAI;AACvE,EAAA,MAAMoB,aAAa,GAAGC,gBAAgB,CAACH,UAAU,CAAC;EAElD,IAAIZ,KAAK,KAAK,cAAc,EAAE;AAC5B;AACAgB,IAAAA,OAAO,CAACC,IAAI,CACV,2HAA2H,CAC5H;AACD,IAAA,oBAAOC,cAAA,CAAAC,mBAAA,EAAA,GAAK;AACd,EAAA;AAEA,EAAA,oBACED,cAAA,CAAA,KAAA,EAAA;AACEP,IAAAA,SAAS,EAAES,SAAI,CAACV,KAAK,CAAC,WAAW,CAAC,EAAEA,KAAK,CAAC,CAAA,WAAA,EAAcI,aAAa,CAAA,CAAE,CAAC,EAAE;AACxE,MAAA,oBAAoB,EAAEZ;AACvB,KAAA,CAAE;IACH,aAAA,EAAaH,SAAS,CAAC,aAAa;AAAE,GAAA,CACtC;AAEN;AAEA,MAAMgB,gBAAgB,GAAIrB,MAA+B,IAAc;AACrE,EAAA,QAAQA,MAAI;IACV,KAAKC,SAAI,CAACkB,KAAK;IACf,KAAKlB,SAAI,CAAC0B,WAAW;MACnB,OAAO1B,SAAI,CAACkB,KAAK;IAEnB,KAAKlB,SAAI,CAAC2B,WAAW;IACrB,KAAK3B,SAAI,CAAC4B,KAAK;IACf,KAAK5B,SAAI,CAACC,MAAM;AAChB,IAAA;MACE,OAAOD,SAAI,CAACC,MAAM;AACtB;AACF,CAAC;;;;"}

package/build/loader/Loader.mjs CHANGED Viewed

@@ -3,8 +3,8 @@ import { clsx } from 'clsx';
 import { useState, useEffect } from 'react';
 import '../common/theme.mjs';
 import '../common/direction.mjs';
-import '@transferwise/neptune-tokens';
 import '../common/propsValues/control.mjs';
+import '../common/propsValues/breakpoint.mjs';
 import { Size } from '../common/propsValues/size.mjs';
 import '../common/propsValues/typography.mjs';
 import '../common/propsValues/width.mjs';

package/build/loader/Loader.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Loader.mjs","sources":["~~../../~~src/loader/Loader.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { useEffect, useState } from 'react';\n\nimport { Size, SizeExtraSmall, SizeSmall, SizeMedium, SizeLarge, SizeExtraLarge } from '../common';\n\n// TODO: We gracefully deprecated xs, lg and xl -- remove these as part of a future breaking change to this component\ntype DeprecatedSize = SizeExtraSmall \| SizeLarge \| SizeExtraLarge;\n\ntype SizeType = SizeSmall \| SizeMedium;\n\nexport type LoaderProps = {\n /*\n @deprecated Use `size` instead.\n * @default false\n /\n small?: boolean;\n /* @default 'md' /\n size?: SizeType \| DeprecatedSize;\n /* @default false /\n displayInstantly?: boolean;\n // TODO: refactor in favor of prop from `CommonProps` type\n /* @default {} /\n classNames?: Record<string, string>;\n 'data-testid'?: string;\n};\n\n/\n Loader component\n \n Docs link: https://transferwise.github.io/neptune-web/components/progress/Loader\n \n @param root0\n * @param root0.small\n * @param root0.size\n * @param root0.classNames\n */\nconst Loader = ({\n small = false,\n size = Size.MEDIUM,\n displayInstantly = false,\n classNames = {},\n ...restProps\n}: LoaderProps) => {\n const { theme } = useTheme();\n const [hasDebounced, setHasDebounced] = useState(displayInstantly);\n\n useEffect(() => {\n let cancelled: boolean;\n let timeout: ReturnType<typeof setTimeout> \| undefined;\n\n if (!displayInstantly) {\n timeout = setTimeout(() => {\n if (!cancelled) {\n setHasDebounced(true);\n }\n }, 1000);\n }\n\n return () => {\n cancelled = true;\n\n clearTimeout(timeout);\n };\n }, []);\n\n const style = (className: string): string => classNames[className] \|\| className;\n const legacySize: SizeType \| DeprecatedSize = small ? Size.SMALL : size;\n const supportedSize = getSupportedSize(legacySize);\n\n if (theme === 'forest-green') {\n // eslint-disable-next-line no-console\n console.warn(\n 'Loader is forbidden to use with Forest Green theme. Check the https://wise.design/components/screen-loader for more info.',\n );\n return <></>;\n }\n\n return (\n <div\n className={clsx(style('tw-loader'), style(`tw-loader--${supportedSize}`), {\n 'tw-loader--visible': hasDebounced,\n })}\n data-testid={restProps['data-testid']}\n />\n );\n};\n\nconst getSupportedSize = (size: SizeType \| DeprecatedSize): SizeType => {\n switch (size) {\n case Size.SMALL:\n case Size.EXTRA_SMALL:\n return Size.SMALL;\n\n case Size.EXTRA_LARGE:\n case Size.LARGE:\n case Size.MEDIUM:\n default:\n return Size.MEDIUM;\n }\n};\n\nexport default Loader;\n"],"names":["Loader","small","size","Size","MEDIUM","displayInstantly","classNames","restProps","theme","useTheme","hasDebounced","setHasDebounced","useState","useEffect","cancelled","timeout","setTimeout","clearTimeout","style","className","legacySize","SMALL","supportedSize","getSupportedSize","console","warn","_jsx","_Fragment","clsx","EXTRA_SMALL","EXTRA_LARGE","LARGE"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,MAAMA,MAAM,GAAGA,CAAC;AACdC,EAAAA,KAAK,GAAG,KAAK;EACbC,IAAI,GAAGC,IAAI,CAACC,MAAM;AAClBC,EAAAA,gBAAgB,GAAG,KAAK;EACxBC,UAAU,GAAG,EAAE;EACf,GAAGC;AAAS,CACA,KAAI;EAChB,MAAM;AAAEC,IAAAA;GAAO,GAAGC,QAAQ,EAAE;EAC5B,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGC,QAAQ,CAACP,gBAAgB,CAAC;AAElEQ,EAAAA,SAAS,CAAC,MAAK;AACb,IAAA,IAAIC,SAAkB;AACtB,IAAA,IAAIC,OAAkD;IAEtD,IAAI,CAACV,gBAAgB,EAAE;MACrBU,OAAO,GAAGC,UAAU,CAAC,MAAK;QACxB,IAAI,CAACF,SAAS,EAAE;UACdH,eAAe,CAAC,IAAI,CAAC;AACvB,QAAA;MACF,CAAC,EAAE,IAAI,CAAC;AACV,IAAA;AAEA,IAAA,OAAO,MAAK;AACVG,MAAAA,SAAS,GAAG,IAAI;MAEhBG,YAAY,CAACF,OAAO,CAAC;IACvB,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMG,KAAK,GAAIC,SAAiB,IAAab,UAAU,CAACa,SAAS,CAAC,IAAIA,SAAS;EAC/E,MAAMC,UAAU,GAA8BnB,KAAK,GAAGE,IAAI,CAACkB,KAAK,GAAGnB,IAAI;AACvE,EAAA,MAAMoB,aAAa,GAAGC,gBAAgB,CAACH,UAAU,CAAC;EAElD,IAAIZ,KAAK,KAAK,cAAc,EAAE;AAC5B;AACAgB,IAAAA,OAAO,CAACC,IAAI,CACV,2HAA2H,CAC5H;AACD,IAAA,oBAAOC,GAAA,CAAAC,QAAA,EAAA,GAAK;AACd,EAAA;AAEA,EAAA,oBACED,GAAA,CAAA,KAAA,EAAA;AACEP,IAAAA,SAAS,EAAES,IAAI,CAACV,KAAK,CAAC,WAAW,CAAC,EAAEA,KAAK,CAAC,CAAA,WAAA,EAAcI,aAAa,CAAA,CAAE,CAAC,EAAE;AACxE,MAAA,oBAAoB,EAAEZ;AACvB,KAAA,CAAE;IACH,aAAA,EAAaH,SAAS,CAAC,aAAa;AAAE,GAAA,CACtC;AAEN;AAEA,MAAMgB,gBAAgB,GAAIrB,IAA+B,IAAc;AACrE,EAAA,QAAQA,IAAI;IACV,KAAKC,IAAI,CAACkB,KAAK;IACf,KAAKlB,IAAI,CAAC0B,WAAW;MACnB,OAAO1B,IAAI,CAACkB,KAAK;IAEnB,KAAKlB,IAAI,CAAC2B,WAAW;IACrB,KAAK3B,IAAI,CAAC4B,KAAK;IACf,KAAK5B,IAAI,CAACC,MAAM;AAChB,IAAA;MACE,OAAOD,IAAI,CAACC,MAAM;AACtB;AACF,CAAC;;;;"}
1	+ {"version":3,"file":"Loader.mjs","sources":["../../../src/loader/Loader.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { useEffect, useState } from 'react';\n\nimport { Size, SizeExtraSmall, SizeSmall, SizeMedium, SizeLarge, SizeExtraLarge } from '../common';\n\n// TODO: We gracefully deprecated xs, lg and xl -- remove these as part of a future breaking change to this component\ntype DeprecatedSize = SizeExtraSmall \| SizeLarge \| SizeExtraLarge;\n\ntype SizeType = SizeSmall \| SizeMedium;\n\nexport type LoaderProps = {\n /*\n @deprecated Use `size` instead.\n * @default false\n /\n small?: boolean;\n /* @default 'md' /\n size?: SizeType \| DeprecatedSize;\n /* @default false /\n displayInstantly?: boolean;\n // TODO: refactor in favor of prop from `CommonProps` type\n /* @default {} /\n classNames?: Record<string, string>;\n 'data-testid'?: string;\n};\n\n/\n Loader component\n \n Docs link: https://transferwise.github.io/neptune-web/components/progress/Loader\n \n @param root0\n * @param root0.small\n * @param root0.size\n * @param root0.classNames\n */\nconst Loader = ({\n small = false,\n size = Size.MEDIUM,\n displayInstantly = false,\n classNames = {},\n ...restProps\n}: LoaderProps) => {\n const { theme } = useTheme();\n const [hasDebounced, setHasDebounced] = useState(displayInstantly);\n\n useEffect(() => {\n let cancelled: boolean;\n let timeout: ReturnType<typeof setTimeout> \| undefined;\n\n if (!displayInstantly) {\n timeout = setTimeout(() => {\n if (!cancelled) {\n setHasDebounced(true);\n }\n }, 1000);\n }\n\n return () => {\n cancelled = true;\n\n clearTimeout(timeout);\n };\n }, []);\n\n const style = (className: string): string => classNames[className] \|\| className;\n const legacySize: SizeType \| DeprecatedSize = small ? Size.SMALL : size;\n const supportedSize = getSupportedSize(legacySize);\n\n if (theme === 'forest-green') {\n // eslint-disable-next-line no-console\n console.warn(\n 'Loader is forbidden to use with Forest Green theme. Check the https://wise.design/components/screen-loader for more info.',\n );\n return <></>;\n }\n\n return (\n <div\n className={clsx(style('tw-loader'), style(`tw-loader--${supportedSize}`), {\n 'tw-loader--visible': hasDebounced,\n })}\n data-testid={restProps['data-testid']}\n />\n );\n};\n\nconst getSupportedSize = (size: SizeType \| DeprecatedSize): SizeType => {\n switch (size) {\n case Size.SMALL:\n case Size.EXTRA_SMALL:\n return Size.SMALL;\n\n case Size.EXTRA_LARGE:\n case Size.LARGE:\n case Size.MEDIUM:\n default:\n return Size.MEDIUM;\n }\n};\n\nexport default Loader;\n"],"names":["Loader","small","size","Size","MEDIUM","displayInstantly","classNames","restProps","theme","useTheme","hasDebounced","setHasDebounced","useState","useEffect","cancelled","timeout","setTimeout","clearTimeout","style","className","legacySize","SMALL","supportedSize","getSupportedSize","console","warn","_jsx","_Fragment","clsx","EXTRA_SMALL","EXTRA_LARGE","LARGE"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,MAAMA,MAAM,GAAGA,CAAC;AACdC,EAAAA,KAAK,GAAG,KAAK;EACbC,IAAI,GAAGC,IAAI,CAACC,MAAM;AAClBC,EAAAA,gBAAgB,GAAG,KAAK;EACxBC,UAAU,GAAG,EAAE;EACf,GAAGC;AAAS,CACA,KAAI;EAChB,MAAM;AAAEC,IAAAA;GAAO,GAAGC,QAAQ,EAAE;EAC5B,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGC,QAAQ,CAACP,gBAAgB,CAAC;AAElEQ,EAAAA,SAAS,CAAC,MAAK;AACb,IAAA,IAAIC,SAAkB;AACtB,IAAA,IAAIC,OAAkD;IAEtD,IAAI,CAACV,gBAAgB,EAAE;MACrBU,OAAO,GAAGC,UAAU,CAAC,MAAK;QACxB,IAAI,CAACF,SAAS,EAAE;UACdH,eAAe,CAAC,IAAI,CAAC;AACvB,QAAA;MACF,CAAC,EAAE,IAAI,CAAC;AACV,IAAA;AAEA,IAAA,OAAO,MAAK;AACVG,MAAAA,SAAS,GAAG,IAAI;MAEhBG,YAAY,CAACF,OAAO,CAAC;IACvB,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMG,KAAK,GAAIC,SAAiB,IAAab,UAAU,CAACa,SAAS,CAAC,IAAIA,SAAS;EAC/E,MAAMC,UAAU,GAA8BnB,KAAK,GAAGE,IAAI,CAACkB,KAAK,GAAGnB,IAAI;AACvE,EAAA,MAAMoB,aAAa,GAAGC,gBAAgB,CAACH,UAAU,CAAC;EAElD,IAAIZ,KAAK,KAAK,cAAc,EAAE;AAC5B;AACAgB,IAAAA,OAAO,CAACC,IAAI,CACV,2HAA2H,CAC5H;AACD,IAAA,oBAAOC,GAAA,CAAAC,QAAA,EAAA,GAAK;AACd,EAAA;AAEA,EAAA,oBACED,GAAA,CAAA,KAAA,EAAA;AACEP,IAAAA,SAAS,EAAES,IAAI,CAACV,KAAK,CAAC,WAAW,CAAC,EAAEA,KAAK,CAAC,CAAA,WAAA,EAAcI,aAAa,CAAA,CAAE,CAAC,EAAE;AACxE,MAAA,oBAAoB,EAAEZ;AACvB,KAAA,CAAE;IACH,aAAA,EAAaH,SAAS,CAAC,aAAa;AAAE,GAAA,CACtC;AAEN;AAEA,MAAMgB,gBAAgB,GAAIrB,IAA+B,IAAc;AACrE,EAAA,QAAQA,IAAI;IACV,KAAKC,IAAI,CAACkB,KAAK;IACf,KAAKlB,IAAI,CAAC0B,WAAW;MACnB,OAAO1B,IAAI,CAACkB,KAAK;IAEnB,KAAKlB,IAAI,CAAC2B,WAAW;IACrB,KAAK3B,IAAI,CAAC4B,KAAK;IACf,KAAK5B,IAAI,CAACC,MAAM;AAChB,IAAA;MACE,OAAOD,IAAI,CAACC,MAAM;AACtB;AACF,CAAC;;;;"}

package/build/logo/Logo.js CHANGED Viewed

@@ -6,8 +6,8 @@ var clsx = require('clsx');
 var logoAssets$1 = require('./logo-assets.js');
 require('../common/theme.js');
 require('../common/direction.js');
-var neptuneTokens = require('@transferwise/neptune-tokens');
 require('../common/propsValues/control.js');
+var breakpoint = require('../common/propsValues/breakpoint.js');
 require('../common/propsValues/size.js');
 require('../common/propsValues/typography.js');
 require('../common/propsValues/width.js');
@@ -64,7 +64,7 @@ const logoAssets = {
 };
 /**
  * Renders the Wise wordmark logo. Responsive — shows the flag-only mark on small viewports
- * and the full wordmark on ≥600px (small breakpoint and above).
+ * and the full wordmark on ≥576px (small breakpoint and above).
  *
  * @see {@link https://wise.design/foundations/logo Design Spec}
  */
@@ -75,7 +75,7 @@ function Logo({
   display = 'responsive',
   'aria-label': ariaLabel
 }) {
-  const isScreenSm = !useScreenSize.useScreenSize(neptuneTokens.Breakpoint.SMALL);
+  const isScreenSm = !useScreenSize.useScreenSize(breakpoint.Breakpoint.SMALL);
   const compact = display === 'compact' || display === 'responsive' && isScreenSm;
   const assetName = compact ? 'FastFlag' : getAssetName(type, format);
   const Asset = logoAssets[assetName];

package/build/logo/Logo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Logo.js","sources":["~~../../~~src/logo/Logo.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport {\n WiseLogo,\n WiseBusinessPrimary,\n WiseBusinessSecondary,\n WisePlatformPrimary,\n WisePlatformSecondary,\n FastFlag,\n logoAssetsDimensions,\n} from './logo-assets';\nimport type { LogoAssetName } from './logo-assets';\nimport { Breakpoint } from '../common';\nimport { useScreenSize } from '../common/hooks/useScreenSize';\nimport { AriaAttributes } from 'react';\n\nexport enum LogoType {\n WISE = 'WISE',\n WISE_BUSINESS = 'WISE_BUSINESS',\n WISE_PLATFORM = 'WISE_PLATFORM',\n}\n\nexport enum LogoDisplay {\n RESPONSIVE = 'responsive',\n COMPACT = 'compact',\n FULL = 'full',\n}\n\nexport enum LogoFormat {\n DEFAULT = 'default',\n PRIMARY_LOCKUP = 'primary-lockup',\n SECONDARY_LOCKUP = 'secondary-lockup',\n}\n\nexport interface LogoProps {\n /** Extra classes applied to Logo /\n className?: string;\n /\n Renders a light-coloured version suited for dark backgrounds.\n * @default false\n * @deprecated dark mode comes out of the box, this property has no effect\n /\n inverse?: boolean;\n /\n What type of logo to display\n * @default 'WISE'\n /\n type?: `${LogoType}`;\n /\n Controls which logo variant is shown.\n * - `\"responsive\"` (default): full wordmark on large screens, fast-flag mark on small screens (<600 px).\n * - `\"compact\"`: always renders the fast-flag mark regardless of screen size.\n * - `\"full\"`: always renders the full wordmark/lockup regardless of screen size.\n * @default 'responsive'\n /\n display?: `${LogoDisplay}`;\n /\n Controls the format of the logo.\n * - `\"default\"`: plain Wise wordmark, no product name.\n * - `\"primary-lockup\"`: product name shown inline alongside the wordmark.\n * - `\"secondary-lockup\"`: stacked (two-line) variant with the product name.\n * @default 'default'\n /\n format?: `${LogoFormat}`;\n /\n Override default ({@link labelByType}) screen reader messages\n /\n 'aria-label'?: AriaAttributes['aria-label'];\n}\n\nconst labelByType = {\n WISE: 'Wise',\n WISE_BUSINESS: 'Wise Business',\n WISE_PLATFORM: 'Wise Platform',\n} satisfies Record<`${LogoType}`, string>;\n\nconst logoAssets: Record<LogoAssetName, () => JSX.Element> = {\n FastFlag,\n WiseLogo,\n WiseBusinessPrimary,\n WiseBusinessSecondary,\n WisePlatformPrimary,\n WisePlatformSecondary,\n};\n\n/\n Renders the Wise wordmark logo. Responsive — shows the flag-only mark on small viewports\n * and the full wordmark on ≥~~600px~~ (small breakpoint and above).\n \n @see {@link https://wise.design/foundations/logo Design Spec}\n */\nexport default function Logo({\n className,\n type = 'WISE',\n format = 'default',\n display = 'responsive',\n 'aria-label': ariaLabel,\n}: LogoProps) {\n const isScreenSm = !useScreenSize(Breakpoint.SMALL);\n const compact = display === 'compact' \|\| (display === 'responsive' && isScreenSm);\n\n const assetName = compact ? 'FastFlag' : getAssetName(type, format);\n const Asset = logoAssets[assetName];\n const { width, height } = logoAssetsDimensions[assetName];\n\n return (\n <span\n className={clsx('np-logo', className)}\n role=\"img\"\n aria-label={ariaLabel ?? labelByType[type]}\n style={\n {\n '--wds-logo-width': `${width}px`,\n '--wds-logo-height': `${height}px`,\n } as React.CSSProperties\n }\n >\n <Asset />\n </span>\n );\n}\n\nfunction getAssetName(type: `${LogoType}`, format: `${LogoFormat}`): LogoAssetName {\n if (format !== 'default') {\n if (type === 'WISE_BUSINESS') {\n return format === 'secondary-lockup' ? 'WiseBusinessSecondary' : 'WiseBusinessPrimary';\n }\n if (type === 'WISE_PLATFORM') {\n return format === 'secondary-lockup' ? 'WisePlatformSecondary' : 'WisePlatformPrimary';\n }\n }\n return 'WiseLogo';\n}\n"],"names":["LogoType","LogoDisplay","LogoFormat","labelByType","WISE","WISE_BUSINESS","WISE_PLATFORM","logoAssets","FastFlag","WiseLogo","WiseBusinessPrimary","WiseBusinessSecondary","WisePlatformPrimary","WisePlatformSecondary","Logo","className","type","format","display","ariaLabel","isScreenSm","useScreenSize","Breakpoint","SMALL","compact","assetName","getAssetName","Asset","width","height","logoAssetsDimensions","_jsx","clsx","role","style","children"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBYA;AAAZ,CAAA,UAAYA,QAAQ,EAAA;AAClBA,EAAAA,QAAA,CAAA,MAAA,CAAA,GAAA,MAAa;AACbA,EAAAA,QAAA,CAAA,eAAA,CAAA,GAAA,eAA+B;AAC/BA,EAAAA,QAAA,CAAA,eAAA,CAAA,GAAA,eAA+B;AACjC,CAAC,EAJWA,gBAAQ,KAARA,gBAAQ,GAAA,EAAA,CAAA,CAAA;AAMRC;AAAZ,CAAA,UAAYA,WAAW,EAAA;AACrBA,EAAAA,WAAA,CAAA,YAAA,CAAA,GAAA,YAAyB;AACzBA,EAAAA,WAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnBA,EAAAA,WAAA,CAAA,MAAA,CAAA,GAAA,MAAa;AACf,CAAC,EAJWA,mBAAW,KAAXA,mBAAW,GAAA,EAAA,CAAA,CAAA;AAMXC;AAAZ,CAAA,UAAYA,UAAU,EAAA;AACpBA,EAAAA,UAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnBA,EAAAA,UAAA,CAAA,gBAAA,CAAA,GAAA,gBAAiC;AACjCA,EAAAA,UAAA,CAAA,kBAAA,CAAA,GAAA,kBAAqC;AACvC,CAAC,EAJWA,kBAAU,KAAVA,kBAAU,GAAA,EAAA,CAAA,CAAA;AA0CtB,MAAMC,WAAW,GAAG;AAClBC,EAAAA,IAAI,EAAE,MAAM;AACZC,EAAAA,aAAa,EAAE,eAAe;AAC9BC,EAAAA,aAAa,EAAE;CACwB;AAEzC,MAAMC,UAAU,GAA6C;YAC3DC,qBAAQ;YACRC,qBAAQ;uBACRC,gCAAmB;yBACnBC,kCAAqB;uBACrBC,gCAAmB;AACnBC,yBAAAA;CACD;AAED;;;;;AAKG;AACW,SAAUC,IAAIA,CAAC;EAC3BC,SAAS;AACTC,EAAAA,IAAI,GAAG,MAAM;AACbC,EAAAA,MAAM,GAAG,SAAS;AAClBC,EAAAA,OAAO,GAAG,YAAY;AACtB,EAAA,YAAY,EAAEC;AAAS,CACb,EAAA;EACV,MAAMC,UAAU,GAAG,CAACC,2BAAa,CAACC,~~wBAAU~~,CAACC,KAAK,CAAC;EACnD,MAAMC,OAAO,GAAGN,OAAO,KAAK,SAAS,IAAKA,OAAO,KAAK,YAAY,IAAIE,UAAW;EAEjF,MAAMK,SAAS,GAAGD,OAAO,GAAG,UAAU,GAAGE,YAAY,CAACV,IAAI,EAAEC,MAAM,CAAC;AACnE,EAAA,MAAMU,KAAK,GAAGpB,UAAU,CAACkB,SAAS,CAAC;EACnC,MAAM;IAAEG,KAAK;AAAEC,IAAAA;AAAM,GAAE,GAAGC,iCAAoB,CAACL,SAAS,CAAC;AAEzD,EAAA,oBACEM,cAAA,CAAA,MAAA,EAAA;AACEhB,IAAAA,SAAS,EAAEiB,SAAI,CAAC,SAAS,EAAEjB,SAAS,CAAE;AACtCkB,IAAAA,IAAI,EAAC,KAAK;AACV,IAAA,YAAA,EAAYd,SAAS,IAAIhB,WAAW,CAACa,IAAI,CAAE;AAC3CkB,IAAAA,KAAK,EACH;MACE,kBAAkB,EAAE,CAAA,EAAGN,KAAK,CAAA,EAAA,CAAI;MAChC,mBAAmB,EAAE,GAAGC,MAAM,CAAA,EAAA;KAEjC;AAAAM,IAAAA,QAAA,eAEDJ,cAAA,CAACJ,KAAK,EAAA,EAAA;AACR,GAAM,CAAC;AAEX;AAEA,SAASD,YAAYA,CAACV,IAAmB,EAAEC,MAAuB,EAAA;EAChE,IAAIA,MAAM,KAAK,SAAS,EAAE;IACxB,IAAID,IAAI,KAAK,eAAe,EAAE;AAC5B,MAAA,OAAOC,MAAM,KAAK,kBAAkB,GAAG,uBAAuB,GAAG,qBAAqB;AACxF,IAAA;IACA,IAAID,IAAI,KAAK,eAAe,EAAE;AAC5B,MAAA,OAAOC,MAAM,KAAK,kBAAkB,GAAG,uBAAuB,GAAG,qBAAqB;AACxF,IAAA;AACF,EAAA;AACA,EAAA,OAAO,UAAU;AACnB;;;;"}
1	+ {"version":3,"file":"Logo.js","sources":["../../../src/logo/Logo.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport {\n WiseLogo,\n WiseBusinessPrimary,\n WiseBusinessSecondary,\n WisePlatformPrimary,\n WisePlatformSecondary,\n FastFlag,\n logoAssetsDimensions,\n} from './logo-assets';\nimport type { LogoAssetName } from './logo-assets';\nimport { Breakpoint } from '../common';\nimport { useScreenSize } from '../common/hooks/useScreenSize';\nimport { AriaAttributes } from 'react';\n\nexport enum LogoType {\n WISE = 'WISE',\n WISE_BUSINESS = 'WISE_BUSINESS',\n WISE_PLATFORM = 'WISE_PLATFORM',\n}\n\nexport enum LogoDisplay {\n RESPONSIVE = 'responsive',\n COMPACT = 'compact',\n FULL = 'full',\n}\n\nexport enum LogoFormat {\n DEFAULT = 'default',\n PRIMARY_LOCKUP = 'primary-lockup',\n SECONDARY_LOCKUP = 'secondary-lockup',\n}\n\nexport interface LogoProps {\n /** Extra classes applied to Logo /\n className?: string;\n /\n Renders a light-coloured version suited for dark backgrounds.\n * @default false\n * @deprecated dark mode comes out of the box, this property has no effect\n /\n inverse?: boolean;\n /\n What type of logo to display\n * @default 'WISE'\n /\n type?: `${LogoType}`;\n /\n Controls which logo variant is shown.\n * - `\"responsive\"` (default): full wordmark on large screens, fast-flag mark on small screens (<600 px).\n * - `\"compact\"`: always renders the fast-flag mark regardless of screen size.\n * - `\"full\"`: always renders the full wordmark/lockup regardless of screen size.\n * @default 'responsive'\n /\n display?: `${LogoDisplay}`;\n /\n Controls the format of the logo.\n * - `\"default\"`: plain Wise wordmark, no product name.\n * - `\"primary-lockup\"`: product name shown inline alongside the wordmark.\n * - `\"secondary-lockup\"`: stacked (two-line) variant with the product name.\n * @default 'default'\n /\n format?: `${LogoFormat}`;\n /\n Override default ({@link labelByType}) screen reader messages\n /\n 'aria-label'?: AriaAttributes['aria-label'];\n}\n\nconst labelByType = {\n WISE: 'Wise',\n WISE_BUSINESS: 'Wise Business',\n WISE_PLATFORM: 'Wise Platform',\n} satisfies Record<`${LogoType}`, string>;\n\nconst logoAssets: Record<LogoAssetName, () => JSX.Element> = {\n FastFlag,\n WiseLogo,\n WiseBusinessPrimary,\n WiseBusinessSecondary,\n WisePlatformPrimary,\n WisePlatformSecondary,\n};\n\n/\n Renders the Wise wordmark logo. Responsive — shows the flag-only mark on small viewports\n * and the full wordmark on ≥576px (small breakpoint and above).\n \n @see {@link https://wise.design/foundations/logo Design Spec}\n */\nexport default function Logo({\n className,\n type = 'WISE',\n format = 'default',\n display = 'responsive',\n 'aria-label': ariaLabel,\n}: LogoProps) {\n const isScreenSm = !useScreenSize(Breakpoint.SMALL);\n const compact = display === 'compact' \|\| (display === 'responsive' && isScreenSm);\n\n const assetName = compact ? 'FastFlag' : getAssetName(type, format);\n const Asset = logoAssets[assetName];\n const { width, height } = logoAssetsDimensions[assetName];\n\n return (\n <span\n className={clsx('np-logo', className)}\n role=\"img\"\n aria-label={ariaLabel ?? labelByType[type]}\n style={\n {\n '--wds-logo-width': `${width}px`,\n '--wds-logo-height': `${height}px`,\n } as React.CSSProperties\n }\n >\n <Asset />\n </span>\n );\n}\n\nfunction getAssetName(type: `${LogoType}`, format: `${LogoFormat}`): LogoAssetName {\n if (format !== 'default') {\n if (type === 'WISE_BUSINESS') {\n return format === 'secondary-lockup' ? 'WiseBusinessSecondary' : 'WiseBusinessPrimary';\n }\n if (type === 'WISE_PLATFORM') {\n return format === 'secondary-lockup' ? 'WisePlatformSecondary' : 'WisePlatformPrimary';\n }\n }\n return 'WiseLogo';\n}\n"],"names":["LogoType","LogoDisplay","LogoFormat","labelByType","WISE","WISE_BUSINESS","WISE_PLATFORM","logoAssets","FastFlag","WiseLogo","WiseBusinessPrimary","WiseBusinessSecondary","WisePlatformPrimary","WisePlatformSecondary","Logo","className","type","format","display","ariaLabel","isScreenSm","useScreenSize","Breakpoint","SMALL","compact","assetName","getAssetName","Asset","width","height","logoAssetsDimensions","_jsx","clsx","role","style","children"],"mappings":"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"}

package/build/logo/Logo.mjs CHANGED Viewed

@@ -2,8 +2,8 @@ import { clsx } from 'clsx';
 import { logoAssetsDimensions, WisePlatformSecondary, WisePlatformPrimary, WiseBusinessSecondary, WiseBusinessPrimary, WiseLogo, FastFlag } from './logo-assets.mjs';
 import '../common/theme.mjs';
 import '../common/direction.mjs';
-import { Breakpoint } from '@transferwise/neptune-tokens';
 import '../common/propsValues/control.mjs';
+import { Breakpoint } from '../common/propsValues/breakpoint.mjs';
 import '../common/propsValues/size.mjs';
 import '../common/propsValues/typography.mjs';
 import '../common/propsValues/width.mjs';
@@ -60,7 +60,7 @@ const logoAssets = {
 };
 /**
  * Renders the Wise wordmark logo. Responsive — shows the flag-only mark on small viewports
- * and the full wordmark on ≥600px (small breakpoint and above).
+ * and the full wordmark on ≥576px (small breakpoint and above).
  *
  * @see {@link https://wise.design/foundations/logo Design Spec}
  */

package/build/logo/Logo.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Logo.mjs","sources":["~~../../~~src/logo/Logo.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport {\n WiseLogo,\n WiseBusinessPrimary,\n WiseBusinessSecondary,\n WisePlatformPrimary,\n WisePlatformSecondary,\n FastFlag,\n logoAssetsDimensions,\n} from './logo-assets';\nimport type { LogoAssetName } from './logo-assets';\nimport { Breakpoint } from '../common';\nimport { useScreenSize } from '../common/hooks/useScreenSize';\nimport { AriaAttributes } from 'react';\n\nexport enum LogoType {\n WISE = 'WISE',\n WISE_BUSINESS = 'WISE_BUSINESS',\n WISE_PLATFORM = 'WISE_PLATFORM',\n}\n\nexport enum LogoDisplay {\n RESPONSIVE = 'responsive',\n COMPACT = 'compact',\n FULL = 'full',\n}\n\nexport enum LogoFormat {\n DEFAULT = 'default',\n PRIMARY_LOCKUP = 'primary-lockup',\n SECONDARY_LOCKUP = 'secondary-lockup',\n}\n\nexport interface LogoProps {\n /** Extra classes applied to Logo /\n className?: string;\n /\n Renders a light-coloured version suited for dark backgrounds.\n * @default false\n * @deprecated dark mode comes out of the box, this property has no effect\n /\n inverse?: boolean;\n /\n What type of logo to display\n * @default 'WISE'\n /\n type?: `${LogoType}`;\n /\n Controls which logo variant is shown.\n * - `\"responsive\"` (default): full wordmark on large screens, fast-flag mark on small screens (<600 px).\n * - `\"compact\"`: always renders the fast-flag mark regardless of screen size.\n * - `\"full\"`: always renders the full wordmark/lockup regardless of screen size.\n * @default 'responsive'\n /\n display?: `${LogoDisplay}`;\n /\n Controls the format of the logo.\n * - `\"default\"`: plain Wise wordmark, no product name.\n * - `\"primary-lockup\"`: product name shown inline alongside the wordmark.\n * - `\"secondary-lockup\"`: stacked (two-line) variant with the product name.\n * @default 'default'\n /\n format?: `${LogoFormat}`;\n /\n Override default ({@link labelByType}) screen reader messages\n /\n 'aria-label'?: AriaAttributes['aria-label'];\n}\n\nconst labelByType = {\n WISE: 'Wise',\n WISE_BUSINESS: 'Wise Business',\n WISE_PLATFORM: 'Wise Platform',\n} satisfies Record<`${LogoType}`, string>;\n\nconst logoAssets: Record<LogoAssetName, () => JSX.Element> = {\n FastFlag,\n WiseLogo,\n WiseBusinessPrimary,\n WiseBusinessSecondary,\n WisePlatformPrimary,\n WisePlatformSecondary,\n};\n\n/\n Renders the Wise wordmark logo. Responsive — shows the flag-only mark on small viewports\n * and the full wordmark on ≥~~600px~~ (small breakpoint and above).\n \n @see {@link https://wise.design/foundations/logo Design Spec}\n */\nexport default function Logo({\n className,\n type = 'WISE',\n format = 'default',\n display = 'responsive',\n 'aria-label': ariaLabel,\n}: LogoProps) {\n const isScreenSm = !useScreenSize(Breakpoint.SMALL);\n const compact = display === 'compact' \|\| (display === 'responsive' && isScreenSm);\n\n const assetName = compact ? 'FastFlag' : getAssetName(type, format);\n const Asset = logoAssets[assetName];\n const { width, height } = logoAssetsDimensions[assetName];\n\n return (\n <span\n className={clsx('np-logo', className)}\n role=\"img\"\n aria-label={ariaLabel ?? labelByType[type]}\n style={\n {\n '--wds-logo-width': `${width}px`,\n '--wds-logo-height': `${height}px`,\n } as React.CSSProperties\n }\n >\n <Asset />\n </span>\n );\n}\n\nfunction getAssetName(type: `${LogoType}`, format: `${LogoFormat}`): LogoAssetName {\n if (format !== 'default') {\n if (type === 'WISE_BUSINESS') {\n return format === 'secondary-lockup' ? 'WiseBusinessSecondary' : 'WiseBusinessPrimary';\n }\n if (type === 'WISE_PLATFORM') {\n return format === 'secondary-lockup' ? 'WisePlatformSecondary' : 'WisePlatformPrimary';\n }\n }\n return 'WiseLogo';\n}\n"],"names":["LogoType","LogoDisplay","LogoFormat","labelByType","WISE","WISE_BUSINESS","WISE_PLATFORM","logoAssets","FastFlag","WiseLogo","WiseBusinessPrimary","WiseBusinessSecondary","WisePlatformPrimary","WisePlatformSecondary","Logo","className","type","format","display","ariaLabel","isScreenSm","useScreenSize","Breakpoint","SMALL","compact","assetName","getAssetName","Asset","width","height","logoAssetsDimensions","_jsx","clsx","role","style","children"],"mappings":"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"}
1	+ {"version":3,"file":"Logo.mjs","sources":["../../../src/logo/Logo.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport {\n WiseLogo,\n WiseBusinessPrimary,\n WiseBusinessSecondary,\n WisePlatformPrimary,\n WisePlatformSecondary,\n FastFlag,\n logoAssetsDimensions,\n} from './logo-assets';\nimport type { LogoAssetName } from './logo-assets';\nimport { Breakpoint } from '../common';\nimport { useScreenSize } from '../common/hooks/useScreenSize';\nimport { AriaAttributes } from 'react';\n\nexport enum LogoType {\n WISE = 'WISE',\n WISE_BUSINESS = 'WISE_BUSINESS',\n WISE_PLATFORM = 'WISE_PLATFORM',\n}\n\nexport enum LogoDisplay {\n RESPONSIVE = 'responsive',\n COMPACT = 'compact',\n FULL = 'full',\n}\n\nexport enum LogoFormat {\n DEFAULT = 'default',\n PRIMARY_LOCKUP = 'primary-lockup',\n SECONDARY_LOCKUP = 'secondary-lockup',\n}\n\nexport interface LogoProps {\n /** Extra classes applied to Logo /\n className?: string;\n /\n Renders a light-coloured version suited for dark backgrounds.\n * @default false\n * @deprecated dark mode comes out of the box, this property has no effect\n /\n inverse?: boolean;\n /\n What type of logo to display\n * @default 'WISE'\n /\n type?: `${LogoType}`;\n /\n Controls which logo variant is shown.\n * - `\"responsive\"` (default): full wordmark on large screens, fast-flag mark on small screens (<600 px).\n * - `\"compact\"`: always renders the fast-flag mark regardless of screen size.\n * - `\"full\"`: always renders the full wordmark/lockup regardless of screen size.\n * @default 'responsive'\n /\n display?: `${LogoDisplay}`;\n /\n Controls the format of the logo.\n * - `\"default\"`: plain Wise wordmark, no product name.\n * - `\"primary-lockup\"`: product name shown inline alongside the wordmark.\n * - `\"secondary-lockup\"`: stacked (two-line) variant with the product name.\n * @default 'default'\n /\n format?: `${LogoFormat}`;\n /\n Override default ({@link labelByType}) screen reader messages\n /\n 'aria-label'?: AriaAttributes['aria-label'];\n}\n\nconst labelByType = {\n WISE: 'Wise',\n WISE_BUSINESS: 'Wise Business',\n WISE_PLATFORM: 'Wise Platform',\n} satisfies Record<`${LogoType}`, string>;\n\nconst logoAssets: Record<LogoAssetName, () => JSX.Element> = {\n FastFlag,\n WiseLogo,\n WiseBusinessPrimary,\n WiseBusinessSecondary,\n WisePlatformPrimary,\n WisePlatformSecondary,\n};\n\n/\n Renders the Wise wordmark logo. Responsive — shows the flag-only mark on small viewports\n * and the full wordmark on ≥576px (small breakpoint and above).\n \n @see {@link https://wise.design/foundations/logo Design Spec}\n */\nexport default function Logo({\n className,\n type = 'WISE',\n format = 'default',\n display = 'responsive',\n 'aria-label': ariaLabel,\n}: LogoProps) {\n const isScreenSm = !useScreenSize(Breakpoint.SMALL);\n const compact = display === 'compact' \|\| (display === 'responsive' && isScreenSm);\n\n const assetName = compact ? 'FastFlag' : getAssetName(type, format);\n const Asset = logoAssets[assetName];\n const { width, height } = logoAssetsDimensions[assetName];\n\n return (\n <span\n className={clsx('np-logo', className)}\n role=\"img\"\n aria-label={ariaLabel ?? labelByType[type]}\n style={\n {\n '--wds-logo-width': `${width}px`,\n '--wds-logo-height': `${height}px`,\n } as React.CSSProperties\n }\n >\n <Asset />\n </span>\n );\n}\n\nfunction getAssetName(type: `${LogoType}`, format: `${LogoFormat}`): LogoAssetName {\n if (format !== 'default') {\n if (type === 'WISE_BUSINESS') {\n return format === 'secondary-lockup' ? 'WiseBusinessSecondary' : 'WiseBusinessPrimary';\n }\n if (type === 'WISE_PLATFORM') {\n return format === 'secondary-lockup' ? 'WisePlatformSecondary' : 'WisePlatformPrimary';\n }\n }\n return 'WiseLogo';\n}\n"],"names":["LogoType","LogoDisplay","LogoFormat","labelByType","WISE","WISE_BUSINESS","WISE_PLATFORM","logoAssets","FastFlag","WiseLogo","WiseBusinessPrimary","WiseBusinessSecondary","WisePlatformPrimary","WisePlatformSecondary","Logo","className","type","format","display","ariaLabel","isScreenSm","useScreenSize","Breakpoint","SMALL","compact","assetName","getAssetName","Asset","width","height","logoAssetsDimensions","_jsx","clsx","role","style","children"],"mappings":"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"}