npm - @ntbjs/react-components - Versions diffs - 3.0.0-rc.1 → 3.0.0-rc.2 - Mend

@ntbjs/react-components 3.0.0-rc.1 → 3.0.0-rc.2

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

package/build/widgets/InfoCard/InfoCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InfoCard.js","sources":["../../../src/components/widgets/InfoCard/InfoCard.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport * as S from './InfoCard.styled';\n\ntype InfoCardOwnProps = {\n icon: React.ReactElement<any>;\n total: number;\n label: string;\n linkLabel?: string;\n onClick?: (...args: any[]) => any;\n height?: number;\n};\n\n~~/\n~~ ~~NMB-3998~~ ~~§C.2:~~ ~~`props` is spread onto `S.Container`, so the published type\n * has to admit that target's props too~~ — a ~~closed type here is worse than `any` for the\n * 125 consumer files. Declared members win over the base (`Omit` by `keyof InfoCardOwnProps`);\n * a~~ bare ~~`&`~~ ~~would~~ ~~INTERSECT a~~ colliding ~~member~~ instead of overriding ~~it, which narrows\n * it (measured: `rows?: number \| string` & `rows?: number`) or empties it to `never`.\n /\~~ntype Props = Omit<React.ComponentPropsWithoutRef<typeof S.Container>, keyof InfoCardOwnProps> &\n InfoCardOwnProps;\n\n/\n Info Card\n \n ### Import\n \n ``` js\n * import { InfoCard } from '@ntbjs/react-components/widgets'\n * // or\n * import InfoCard from '@ntbjs/react-components/widgets/InfoCard'\n * ```\n \n ### Props\n * ```\n * Pass `icon={<svg></svg>}` to display an icon.\n * Pass `total={100}` to display number.\n * Pass `label={\"this is a label\"}` to display a label.\n * Pass `linkLabel={\"this is a label\"}` to display a link next to the arrow icon.\n * Pass `height={50}` to adjust the card´s height.\n * Pass `onClick={function}` to handle click event.\n * ```\n */\n\nconst InfoCard = React.forwardRef<any, Props>(function InfoCard(\n { icon, total, label, linkLabel, onClick, height, ...props },\n forwardedRef\n) {\n const [isLinkHovered, setIsLinkHovered] = useState(false);\n\n const handleLinkClick = e => onClick(e);\n\n return (\n <S.Container height={height} ref={forwardedRef} {...props}>\n <S.MetricsContainer>\n <S.IconTotalContainer>\n <S.IconContainer>{icon}</S.IconContainer>\n <S.Total>{total}</S.Total>\n </S.IconTotalContainer>\n <S.Label>{label}</S.Label>\n </S.MetricsContainer>\n {linkLabel && onClick && (\n <S.Link\n onClick={handleLinkClick}\n onMouseEnter={() => setIsLinkHovered(true)}\n onMouseLeave={() => setIsLinkHovered(false)}\n >\n <S.ButtonLink $isHovered={isLinkHovered}>{linkLabel}</S.ButtonLink>\n <S.StyledArrowIcon $isHovered={isLinkHovered} />\n </S.Link>\n )}\n </S.Container>\n );\n});\n\nexport default InfoCard;\n"],"names":["InfoCard","React","forwardRef","icon","total","label","linkLabel","onClick","height","props","forwardedRef","isLinkHovered","setIsLinkHovered","useState","handleLinkClick","e","_jsxs","S","ref","children","_jsx","onMouseEnter","onMouseLeave","$isHovered"],"mappings":";;;;~~AA4CA~~,MAAMA,QAAQ,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,QAAQA,CAC7D;EAAEG,IAAI;EAAEC,KAAK;EAAEC,KAAK;EAAEC,SAAS;EAAEC,OAAO;EAAEC,MAAM;EAAE,GAAGC;AAAM,CAAC,EAC5DC,YAAY,EACZ;EACA,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC;AAEzD,EAAA,MAAMC,eAAe,GAAGC,CAAC,IAAIR,OAAO,CAACQ,CAAC,CAAC;AAEvC,EAAA,OACEC,IAAA,CAACC,SAAW,EAAA;AAACT,IAAAA,MAAM,EAAEA,MAAO;AAACU,IAAAA,GAAG,EAAER,YAAa;AAAA,IAAA,GAAKD,KAAK;AAAAU,IAAAA,QAAA,EAAA,CACvDH,IAAA,CAACC,gBAAkB,EAAA;AAAAE,MAAAA,QAAA,EAAA,CACjBH,IAAA,CAACC,kBAAoB,EAAA;AAAAE,QAAAA,QAAA,EAAA,CACnBC,GAAA,CAACH,aAAe,EAAA;AAAAE,UAAAA,QAAA,EAAEhB;AAAI,SAAkB,CAAC,EACzCiB,GAAA,CAACH,KAAO,EAAA;AAAAE,UAAAA,QAAA,EAAEf;AAAK,SAAU,CAAC;AAAA,OACN,CAAC,EACvBgB,GAAA,CAACH,KAAO,EAAA;AAAAE,QAAAA,QAAA,EAAEd;AAAK,OAAU,CAAC;KACR,CAAC,EACpBC,SAAS,IAAIC,OAAO,IACnBS,IAAA,CAACC,IAAM,EAAA;AACLV,MAAAA,OAAO,EAAEO,eAAgB;AACzBO,MAAAA,YAAY,EAAEA,MAAMT,gBAAgB,CAAC,IAAI,CAAE;AAC3CU,MAAAA,YAAY,EAAEA,MAAMV,gBAAgB,CAAC,KAAK,CAAE;AAAAO,MAAAA,QAAA,EAAA,CAE5CC,GAAA,CAACH,UAAY,EAAA;AAACM,QAAAA,UAAU,EAAEZ,aAAc;AAAAQ,QAAAA,QAAA,EAAEb;AAAS,OAAe,CAAC,EACnEc,GAAA,CAACH,eAAiB,EAAA;AAACM,QAAAA,UAAU,EAAEZ;AAAc,OAAE,CAAC;AAAA,KAC1C,CACT;AAAA,GACU,CAAC;AAElB,CAAC;;;;"}
1	+ {"version":3,"file":"InfoCard.js","sources":["../../../src/components/widgets/InfoCard/InfoCard.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport * as S from './InfoCard.styled';\n\ntype InfoCardOwnProps = {\n icon: React.ReactElement<any>;\n total: number;\n label: string;\n linkLabel?: string;\n onClick?: (...args: any[]) => any;\n height?: number;\n};\n\n// Omit before & — a bare intersection narrows colliding props instead of overriding them.\ntype Props = Omit<React.ComponentPropsWithoutRef<typeof S.Container>, keyof InfoCardOwnProps> &\n InfoCardOwnProps;\n\n/*\n Info Card\n \n ### Import\n \n ``` js\n * import { InfoCard } from '@ntbjs/react-components/widgets'\n * // or\n * import InfoCard from '@ntbjs/react-components/widgets/InfoCard'\n * ```\n \n ### Props\n * ```\n * Pass `icon={<svg></svg>}` to display an icon.\n * Pass `total={100}` to display number.\n * Pass `label={\"this is a label\"}` to display a label.\n * Pass `linkLabel={\"this is a label\"}` to display a link next to the arrow icon.\n * Pass `height={50}` to adjust the card´s height.\n * Pass `onClick={function}` to handle click event.\n * ```\n */\n\nconst InfoCard = React.forwardRef<any, Props>(function InfoCard(\n { icon, total, label, linkLabel, onClick, height, ...props },\n forwardedRef\n) {\n const [isLinkHovered, setIsLinkHovered] = useState(false);\n\n const handleLinkClick = e => onClick(e);\n\n return (\n <S.Container height={height} ref={forwardedRef} {...props}>\n <S.MetricsContainer>\n <S.IconTotalContainer>\n <S.IconContainer>{icon}</S.IconContainer>\n <S.Total>{total}</S.Total>\n </S.IconTotalContainer>\n <S.Label>{label}</S.Label>\n </S.MetricsContainer>\n {linkLabel && onClick && (\n <S.Link\n onClick={handleLinkClick}\n onMouseEnter={() => setIsLinkHovered(true)}\n onMouseLeave={() => setIsLinkHovered(false)}\n >\n <S.ButtonLink $isHovered={isLinkHovered}>{linkLabel}</S.ButtonLink>\n <S.StyledArrowIcon $isHovered={isLinkHovered} />\n </S.Link>\n )}\n </S.Container>\n );\n});\n\nexport default InfoCard;\n"],"names":["InfoCard","React","forwardRef","icon","total","label","linkLabel","onClick","height","props","forwardedRef","isLinkHovered","setIsLinkHovered","useState","handleLinkClick","e","_jsxs","S","ref","children","_jsx","onMouseEnter","onMouseLeave","$isHovered"],"mappings":";;;;AAsCA,MAAMA,QAAQ,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,QAAQA,CAC7D;EAAEG,IAAI;EAAEC,KAAK;EAAEC,KAAK;EAAEC,SAAS;EAAEC,OAAO;EAAEC,MAAM;EAAE,GAAGC;AAAM,CAAC,EAC5DC,YAAY,EACZ;EACA,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC;AAEzD,EAAA,MAAMC,eAAe,GAAGC,CAAC,IAAIR,OAAO,CAACQ,CAAC,CAAC;AAEvC,EAAA,OACEC,IAAA,CAACC,SAAW,EAAA;AAACT,IAAAA,MAAM,EAAEA,MAAO;AAACU,IAAAA,GAAG,EAAER,YAAa;AAAA,IAAA,GAAKD,KAAK;AAAAU,IAAAA,QAAA,EAAA,CACvDH,IAAA,CAACC,gBAAkB,EAAA;AAAAE,MAAAA,QAAA,EAAA,CACjBH,IAAA,CAACC,kBAAoB,EAAA;AAAAE,QAAAA,QAAA,EAAA,CACnBC,GAAA,CAACH,aAAe,EAAA;AAAAE,UAAAA,QAAA,EAAEhB;AAAI,SAAkB,CAAC,EACzCiB,GAAA,CAACH,KAAO,EAAA;AAAAE,UAAAA,QAAA,EAAEf;AAAK,SAAU,CAAC;AAAA,OACN,CAAC,EACvBgB,GAAA,CAACH,KAAO,EAAA;AAAAE,QAAAA,QAAA,EAAEd;AAAK,OAAU,CAAC;KACR,CAAC,EACpBC,SAAS,IAAIC,OAAO,IACnBS,IAAA,CAACC,IAAM,EAAA;AACLV,MAAAA,OAAO,EAAEO,eAAgB;AACzBO,MAAAA,YAAY,EAAEA,MAAMT,gBAAgB,CAAC,IAAI,CAAE;AAC3CU,MAAAA,YAAY,EAAEA,MAAMV,gBAAgB,CAAC,KAAK,CAAE;AAAAO,MAAAA,QAAA,EAAA,CAE5CC,GAAA,CAACH,UAAY,EAAA;AAACM,QAAAA,UAAU,EAAEZ,aAAc;AAAAQ,QAAAA,QAAA,EAAEb;AAAS,OAAe,CAAC,EACnEc,GAAA,CAACH,eAAiB,EAAA;AAACM,QAAAA,UAAU,EAAEZ;AAAc,OAAE,CAAC;AAAA,KAC1C,CACT;AAAA,GACU,CAAC;AAElB,CAAC;;;;"}

package/build/widgets/InfoCard/InfoCard.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InfoCard.styled.js","sources":["../../../src/components/widgets/InfoCard/InfoCard.styled.ts"],"sourcesContent":["~~/\n~~ $-~~transient-prop~~ ~~pattern:~~ ~~rules~~ ~~in\n~~ * `src/components/layout/SectionSeparator/SectionSeparator.styled.ts`, derivation and\n * ~~measurements~~ in ~~`scripts/TS-MIGRATION-PLAYBOOK.md` §J~~.\~~n /\~~nimport styled from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\nimport { ArrowForwardIcon } from '../../../icons';\n\n/\n `height` — ~~`PropTypes.~~number`, px, interpolated as `${props.height}px` with a `50px`\n * fallback. `number` and not `number \| string`: a string here would already render\n * `height: 60pxpx`.\n \n NO ~~`$`,~~ ~~AND~~ ~~THAT~~ IS A ~~DEFECT~~ ~~THAT~~ ~~IS ALREADY IN THE RENDER BASELINE. `height` is not a\n * member of `HTMLAttributes<HTMLDivElement>`~~ (~~which~~ is why the read needs this\n * declaration at all) but React DOES recognise it and renders it, so `widgets/InfoCard`\n * in ~~`scripts/~~r19-harness~~/baseline.json` opens with `<div height=\"60\" class=\"…\">`.\n * Renaming it `$height` removes that attribute and therefore MOVES the baseline — C10\n * work, §E.4~~.\n /\nexport interface InfoCardContainerStyleProps {\n height?: number;\n}\n\n/\n `$isHovered` — ~~the `Link`'s hover state, held in `InfoCard.tsx`'s `~~useState`, ~~so\n * genuinely `boolean` and~~ not ~~derived~~ ~~from~~ ~~any~~ ~~prop.\n~~ \n NOT COVERABLE BY THE RENDER GATE, and the fixture says so: it comes from `useState`, so\n * it is `false` in ~~every static render whatever props are passed. Both of its hosts\n * therefore have rule blocks the~~ baseline ~~can never exercise — which is exactly why the\n * type matters here more than it would on a prop a fixture pins~~.\n \n Hosts: `ButtonLink` and `StyledArrowIcon`.\n /\ninterface InfoCardHoverStyleProps {\n $isHovered?: boolean;\n}\n\n~~/\n~~ * Single-argument, ~~and it stays that way — peer floor `~~styled-components: >=5~~.1.0`,~~ ~~and\n~~ * the two majors disagree on the second parameter. §J.4. `prop` needs ~~the~~ annotation\n * because `withConfig` takes ~~this~~ by reference~~, so it gets no contextual typing~~.\~~n */\~~nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\nexport const Container = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<InfoCardContainerStyleProps>(applyDefaultTheme)`\n font-family: ${props => props.theme.primaryFontFamily};\n font-size: 1rem;\n font-weight: 500;\n ${props =>\n props.theme.themeProp(\n 'background',\n props.theme.getColor('gray-800'),\n props.theme.getColor('gray-50')\n )};\n height: ${props => (props.height ? `${props.height}px` : '50px')};\n border-radius: 3px;\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 5px 0;\n`;\n\nexport const MetricsContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n width: 70%;\n gap: 5px;\n padding-left: 15px;\n`;\n\nexport const IconTotalContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 10px;\n`;\nexport const Total = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 1.22rem;\n font-weight: 700;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-900')\n )};\n`;\n\nexport const Label = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 400;\n opacity: 0.8;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-500')\n )};\n`;\nexport const IconContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n justify-content: center;\n align-items: center;\n width: 18px;\n margin-top: -0.05rem;\n`;\n\nexport const Link = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 400;\n width: 30%;\n opacity: 0.7;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n margin-right: 20px;\n cursor: pointer;\n height: 100%;\n gap: 10px;\n svg {\n transition: transform 0.2s ease-in-out;\n }\n &:hover svg {\n transform: translateX(2px);\n }\n`;\n\nexport const ButtonLink = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<InfoCardHoverStyleProps>(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 500;\n height: 100%;\n display: flex;\n align-items: center;\n white-space: nowrap;\n opacity: ${props => (props.$isHovered ? 1 : 0.8)};\n transition: color 0.2s ease-in-out;\n ${props =>\n props.$isHovered\n ? props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))\n : props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-900')\n )};\n`;\n\nexport const StyledArrowIcon = styled(ArrowForwardIcon)\n .withConfig({\n shouldForwardProp\n })\n .attrs<InfoCardHoverStyleProps>(applyDefaultTheme)`\n height: 15px;\n margin-right: 10px;\n opacity: ${props => (props.$isHovered ? 1 : 0.8)};\n transition: transform 0.2s ease-in-out, fill 0.2s ease-in-out;\n transform: ${props => (props.$isHovered ? 'translateX(2px)' : 'translateX(0)')};\n\n ${props =>\n props.$isHovered\n ? props.theme.themeProp('fill', props.theme.getColor('white'), props.theme.getColor('black'))\n : props.theme.themeProp(\n 'fill',\n props.theme.getColor('white'),\n props.theme.getColor('black')\n )};\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Container","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","theme","primaryFontFamily","themeProp","getColor","height","MetricsContainer","IconTotalContainer","Total","Label","IconContainer","Link","ButtonLink","$isHovered","StyledArrowIcon","ArrowForwardIcon"],"mappings":";;;;;~~AA6CA~~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"}
1	+ {"version":3,"file":"InfoCard.styled.js","sources":["../../../src/components/widgets/InfoCard/InfoCard.styled.ts"],"sourcesContent":["// $-prefixed props are transient and never reach the DOM.\nimport styled from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\nimport { ArrowForwardIcon } from '../../../icons';\n\n/*\n `height` as number (px); NO `$` prefix to preserve existing DOM baseline (already in r19-harness).\n /\nexport interface InfoCardContainerStyleProps {\n height?: number;\n}\n\n/\n `$isHovered` from useState; not coverable by render gate (always false at baseline).\n */\ninterface InfoCardHoverStyleProps {\n $isHovered?: boolean;\n}\n\n// Single-argument (styled-components 5 compat); prop needs annotation because withConfig takes by reference.\nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\nexport const Container = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<InfoCardContainerStyleProps>(applyDefaultTheme)`\n font-family: ${props => props.theme.primaryFontFamily};\n font-size: 1rem;\n font-weight: 500;\n ${props =>\n props.theme.themeProp(\n 'background',\n props.theme.getColor('gray-800'),\n props.theme.getColor('gray-50')\n )};\n height: ${props => (props.height ? `${props.height}px` : '50px')};\n border-radius: 3px;\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 5px 0;\n`;\n\nexport const MetricsContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n width: 70%;\n gap: 5px;\n padding-left: 15px;\n`;\n\nexport const IconTotalContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 10px;\n`;\nexport const Total = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 1.22rem;\n font-weight: 700;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-900')\n )};\n`;\n\nexport const Label = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 400;\n opacity: 0.8;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-500')\n )};\n`;\nexport const IconContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n justify-content: center;\n align-items: center;\n width: 18px;\n margin-top: -0.05rem;\n`;\n\nexport const Link = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 400;\n width: 30%;\n opacity: 0.7;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n margin-right: 20px;\n cursor: pointer;\n height: 100%;\n gap: 10px;\n svg {\n transition: transform 0.2s ease-in-out;\n }\n &:hover svg {\n transform: translateX(2px);\n }\n`;\n\nexport const ButtonLink = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<InfoCardHoverStyleProps>(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 500;\n height: 100%;\n display: flex;\n align-items: center;\n white-space: nowrap;\n opacity: ${props => (props.$isHovered ? 1 : 0.8)};\n transition: color 0.2s ease-in-out;\n ${props =>\n props.$isHovered\n ? props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))\n : props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-900')\n )};\n`;\n\nexport const StyledArrowIcon = styled(ArrowForwardIcon)\n .withConfig({\n shouldForwardProp\n })\n .attrs<InfoCardHoverStyleProps>(applyDefaultTheme)`\n height: 15px;\n margin-right: 10px;\n opacity: ${props => (props.$isHovered ? 1 : 0.8)};\n transition: transform 0.2s ease-in-out, fill 0.2s ease-in-out;\n transform: ${props => (props.$isHovered ? 'translateX(2px)' : 'translateX(0)')};\n\n ${props =>\n props.$isHovered\n ? props.theme.themeProp('fill', props.theme.getColor('white'), props.theme.getColor('black'))\n : props.theme.themeProp(\n 'fill',\n props.theme.getColor('white'),\n props.theme.getColor('black')\n )};\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Container","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","theme","primaryFontFamily","themeProp","getColor","height","MetricsContainer","IconTotalContainer","Total","Label","IconContainer","Link","ButtonLink","$isHovered","StyledArrowIcon","ArrowForwardIcon"],"mappings":"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"}

package/build/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InstructionSeverityDisplay.js","sources":["../../../src/components/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.tsx"],"sourcesContent":["import React from 'react';\nimport SeverityBadge from '../../data/SeverityBadge/SeverityBadge';\nimport * as S from './InstructionSeverityDisplay.styled';\n\nconst defaultLabels = {\n 1: 'Info',\n 2: 'Info',\n 3: 'Limited use',\n 4: 'Limited use',\n 5: 'Highly restricted'\n};\n\ntype InstructionSeverityDisplayOwnProps = {\n /** Severity level (1-5). 1=Info, 3=Limited use, 5=Highly restricted. /\n severity?: 1 \| 2 \| 3 \| 4 \| 5;\n /* The instruction text to display. Component returns null if empty. /\n instructionText?: string;\n /* Override the default badge label for the severity level. /\n severityLabel?: string;\n /* Map of severity level to translated label string, e.g. { 1: 'Info', 3: 'Begrenset bruk', 5: 'Svært begrenset' }. /\n labels?: {\n [key: string]: string;\n };\n /* Override the default icon element. /\n icon?: React.ReactElement<any>;\n /* Whether to show card styling (border-radius, shadow, border). Defaults to true. /\n showCard?: boolean;\n /* Custom card padding, e.g. \"8px 6px\" or \"20px\". Defaults to \"14px 10px\". /\n padding?: string;\n /* Custom font size for the badge text, e.g. \"10px\" or \"0.75rem\". Defaults to \"12px\". /\n badgeFontSize?: string;\n /* Custom font size for the details/instruction text, e.g. \"12px\" or \"0.875rem\". Defaults to \"14px\". /\n detailsFontSize?: string;\n /* Override card background color in light mode, e.g. \"#ffffff\" or \"transparent\". /\n bgLight?: string;\n /* Override card background color in dark mode, e.g. \"#1a1a1a\" or \"transparent\". /\n bgDark?: string;\n /* Max number of lines for instruction text before clamping with ellipsis. /\n maxLines?: number;\n /* URL of a thumbnail image to display on the left side of the card. Pass null to show a placeholder. Omit to show no thumbnail. /\n thumbnail?: string;\n};\n\n~~/\n~~ * ~~NMB-3998~~ ~~§C.2:~~ ~~`props` is spread onto `S.Card`, so the published type\n * has to admit that target's props too~~ — a ~~closed type here is worse than `any` for the\n * 125 consumer files. Declared members win over the base (`Omit` by `keyof InstructionSeverityDisplayOwnProps`);\n * a~~ bare ~~`&`~~ ~~would~~ ~~INTERSECT a~~ colliding ~~member~~ instead of overriding ~~it, which narrows\n * it (measured: `rows?: number \| string` & `rows?: number`) or empties it to `never`.\n /\~~ntype Props = Omit<\n React.ComponentPropsWithoutRef<typeof S.Card>,\n keyof InstructionSeverityDisplayOwnProps\n> &\n InstructionSeverityDisplayOwnProps;\n\n/\n InstructionSeverityDisplay communicates the usage restrictions or\n * severity levels associated with a specific instruction or asset.\n \n ### Import\n \n ``` js\n * import { InstructionSeverityDisplay } from '@ntbjs/react-components/widgets'\n * // or\n * import InstructionSeverityDisplay from '@ntbjs/react-components/widgets/InstructionSeverityDisplay'\n * ```\n */\nconst InstructionSeverityDisplay = React.forwardRef<any, Props>(function InstructionSeverityDisplay(\n {\n severity,\n instructionText,\n severityLabel,\n labels,\n icon,\n showCard = true,\n padding,\n badgeFontSize,\n detailsFontSize,\n bgLight,\n bgDark,\n maxLines,\n thumbnail,\n ...props\n },\n forwardedRef\n) {\n if (!instructionText) {\n return null;\n }\n\n const effectiveSeverity = severity ?? 1;\n const displayLabel =\n severityLabel \|\| (labels && labels[effectiveSeverity]) \|\| defaultLabels[effectiveSeverity];\n\n const hasThumbnail = thumbnail !== undefined;\n\n const content = (\n <>\n <SeverityBadge\n severity={severity}\n label={displayLabel}\n icon={icon}\n fontSize={badgeFontSize ? parseFloat(badgeFontSize) : undefined}\n />\n <S.InstructionText $fontSize={detailsFontSize} $maxLines={maxLines}>\n {maxLines ? <span title={instructionText}>{instructionText}</span> : instructionText}\n </S.InstructionText>\n </>\n );\n\n return (\n <S.Card\n ref={forwardedRef}\n $severity={severity}\n $showCard={showCard}\n $padding={padding}\n $bgLight={bgLight}\n $bgDark={bgDark}\n $hasThumbnail={hasThumbnail}\n {...props}\n >\n {hasThumbnail && (\n <S.ThumbnailWrapper>\n {thumbnail && <S.ThumbnailImage src={thumbnail} alt=\"\" />}\n </S.ThumbnailWrapper>\n )}\n {hasThumbnail ? <S.ContentWrapper>{content}</S.ContentWrapper> : content}\n </S.Card>\n );\n});\n\nexport default InstructionSeverityDisplay;\n"],"names":["defaultLabels","InstructionSeverityDisplay","React","forwardRef","severity","instructionText","severityLabel","labels","icon","showCard","padding","badgeFontSize","detailsFontSize","bgLight","bgDark","maxLines","thumbnail","props","forwardedRef","effectiveSeverity","displayLabel","hasThumbnail","undefined","content","_jsxs","_Fragment","children","_jsx","SeverityBadge","label","fontSize","parseFloat","S","$fontSize","$maxLines","title","ref","$severity","$showCard","$padding","$bgLight","$bgDark","$hasThumbnail","src","alt"],"mappings":";;;;;AAIA,MAAMA,aAAa,GAAG;AACpB,EAAA,CAAC,EAAE,MAAM;AACT,EAAA,CAAC,EAAE,MAAM;AACT,EAAA,CAAC,EAAE,aAAa;AAChB,EAAA,CAAC,EAAE,aAAa;AAChB,EAAA,CAAC,EAAE;AACL,CAAC;~~AA0DD~~,MAAMC,0BAA0B,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,0BAA0BA,CACjG;EACEG,QAAQ;EACRC,eAAe;EACfC,aAAa;EACbC,MAAM;EACNC,IAAI;AACJC,EAAAA,QAAQ,GAAG,IAAI;EACfC,OAAO;EACPC,aAAa;EACbC,eAAe;EACfC,OAAO;EACPC,MAAM;EACNC,QAAQ;EACRC,SAAS;EACT,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,IAAI,CAACb,eAAe,EAAE;AACpB,IAAA,OAAO,IAAI;AACb,EAAA;AAEA,EAAA,MAAMc,iBAAiB,GAAGf,QAAQ,IAAI,CAAC;AACvC,EAAA,MAAMgB,YAAY,GAChBd,aAAa,IAAKC,MAAM,IAAIA,MAAM,CAACY,iBAAiB,CAAE,IAAInB,aAAa,CAACmB,iBAAiB,CAAC;AAE5F,EAAA,MAAME,YAAY,GAAGL,SAAS,KAAKM,SAAS;AAE5C,EAAA,MAAMC,OAAO,GACXC,IAAA,CAAAC,QAAA,EAAA;IAAAC,QAAA,EAAA,CACEC,GAAA,CAACC,aAAa,EAAA;AACZxB,MAAAA,QAAQ,EAAEA,QAAS;AACnByB,MAAAA,KAAK,EAAET,YAAa;AACpBZ,MAAAA,IAAI,EAAEA,IAAK;AACXsB,MAAAA,QAAQ,EAAEnB,aAAa,GAAGoB,UAAU,CAACpB,aAAa,CAAC,GAAGW;AAAU,KACjE,CAAC,EACFK,GAAA,CAACK,eAAiB,EAAA;AAACC,MAAAA,SAAS,EAAErB,eAAgB;AAACsB,MAAAA,SAAS,EAAEnB,QAAS;MAAAW,QAAA,EAChEX,QAAQ,GAAGY,GAAA,CAAA,MAAA,EAAA;AAAMQ,QAAAA,KAAK,EAAE9B,eAAgB;AAAAqB,QAAAA,QAAA,EAAErB;AAAe,OAAO,CAAC,GAAGA;AAAe,KACnE,CAAC;AAAA,GACpB,CACH;AAED,EAAA,OACEmB,IAAA,CAACQ,IAAM,EAAA;AACLI,IAAAA,GAAG,EAAElB,YAAa;AAClBmB,IAAAA,SAAS,EAAEjC,QAAS;AACpBkC,IAAAA,SAAS,EAAE7B,QAAS;AACpB8B,IAAAA,QAAQ,EAAE7B,OAAQ;AAClB8B,IAAAA,QAAQ,EAAE3B,OAAQ;AAClB4B,IAAAA,OAAO,EAAE3B,MAAO;AAChB4B,IAAAA,aAAa,EAAErB,YAAa;AAAA,IAAA,GACxBJ,KAAK;AAAAS,IAAAA,QAAA,GAERL,YAAY,IACXM,GAAA,CAACK,gBAAkB,EAAA;AAAAN,MAAAA,QAAA,EAChBV,SAAS,IAAIW,GAAA,CAACK,cAAgB,EAAA;AAACW,QAAAA,GAAG,EAAE3B,SAAU;AAAC4B,QAAAA,GAAG,EAAC;OAAI;KACtC,CACrB,EACAvB,YAAY,GAAGM,GAAA,CAACK,cAAgB,EAAA;AAAAN,MAAAA,QAAA,EAAEH;KAA0B,CAAC,GAAGA,OAAO;AAAA,GAClE,CAAC;AAEb,CAAC;;;;"}
1	+ {"version":3,"file":"InstructionSeverityDisplay.js","sources":["../../../src/components/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.tsx"],"sourcesContent":["import React from 'react';\nimport SeverityBadge from '../../data/SeverityBadge/SeverityBadge';\nimport * as S from './InstructionSeverityDisplay.styled';\n\nconst defaultLabels = {\n 1: 'Info',\n 2: 'Info',\n 3: 'Limited use',\n 4: 'Limited use',\n 5: 'Highly restricted'\n};\n\ntype InstructionSeverityDisplayOwnProps = {\n /** Severity level (1-5). 1=Info, 3=Limited use, 5=Highly restricted. /\n severity?: 1 \| 2 \| 3 \| 4 \| 5;\n /* The instruction text to display. Component returns null if empty. /\n instructionText?: string;\n /* Override the default badge label for the severity level. /\n severityLabel?: string;\n /* Map of severity level to translated label string, e.g. { 1: 'Info', 3: 'Begrenset bruk', 5: 'Svært begrenset' }. /\n labels?: {\n [key: string]: string;\n };\n /* Override the default icon element. /\n icon?: React.ReactElement<any>;\n /* Whether to show card styling (border-radius, shadow, border). Defaults to true. /\n showCard?: boolean;\n /* Custom card padding, e.g. \"8px 6px\" or \"20px\". Defaults to \"14px 10px\". /\n padding?: string;\n /* Custom font size for the badge text, e.g. \"10px\" or \"0.75rem\". Defaults to \"12px\". /\n badgeFontSize?: string;\n /* Custom font size for the details/instruction text, e.g. \"12px\" or \"0.875rem\". Defaults to \"14px\". /\n detailsFontSize?: string;\n /* Override card background color in light mode, e.g. \"#ffffff\" or \"transparent\". /\n bgLight?: string;\n /* Override card background color in dark mode, e.g. \"#1a1a1a\" or \"transparent\". /\n bgDark?: string;\n /* Max number of lines for instruction text before clamping with ellipsis. /\n maxLines?: number;\n /* URL of a thumbnail image to display on the left side of the card. Pass null to show a placeholder. Omit to show no thumbnail. /\n thumbnail?: string;\n};\n\n// Omit before & — a bare intersection narrows colliding props instead of overriding them.\ntype Props = Omit<\n React.ComponentPropsWithoutRef<typeof S.Card>,\n keyof InstructionSeverityDisplayOwnProps\n> &\n InstructionSeverityDisplayOwnProps;\n\n/\n InstructionSeverityDisplay communicates the usage restrictions or\n * severity levels associated with a specific instruction or asset.\n \n ### Import\n \n ``` js\n * import { InstructionSeverityDisplay } from '@ntbjs/react-components/widgets'\n * // or\n * import InstructionSeverityDisplay from '@ntbjs/react-components/widgets/InstructionSeverityDisplay'\n * ```\n */\nconst InstructionSeverityDisplay = React.forwardRef<any, Props>(function InstructionSeverityDisplay(\n {\n severity,\n instructionText,\n severityLabel,\n labels,\n icon,\n showCard = true,\n padding,\n badgeFontSize,\n detailsFontSize,\n bgLight,\n bgDark,\n maxLines,\n thumbnail,\n ...props\n },\n forwardedRef\n) {\n if (!instructionText) {\n return null;\n }\n\n const effectiveSeverity = severity ?? 1;\n const displayLabel =\n severityLabel \|\| (labels && labels[effectiveSeverity]) \|\| defaultLabels[effectiveSeverity];\n\n const hasThumbnail = thumbnail !== undefined;\n\n const content = (\n <>\n <SeverityBadge\n severity={severity}\n label={displayLabel}\n icon={icon}\n fontSize={badgeFontSize ? parseFloat(badgeFontSize) : undefined}\n />\n <S.InstructionText $fontSize={detailsFontSize} $maxLines={maxLines}>\n {maxLines ? <span title={instructionText}>{instructionText}</span> : instructionText}\n </S.InstructionText>\n </>\n );\n\n return (\n <S.Card\n ref={forwardedRef}\n $severity={severity}\n $showCard={showCard}\n $padding={padding}\n $bgLight={bgLight}\n $bgDark={bgDark}\n $hasThumbnail={hasThumbnail}\n {...props}\n >\n {hasThumbnail && (\n <S.ThumbnailWrapper>\n {thumbnail && <S.ThumbnailImage src={thumbnail} alt=\"\" />}\n </S.ThumbnailWrapper>\n )}\n {hasThumbnail ? <S.ContentWrapper>{content}</S.ContentWrapper> : content}\n </S.Card>\n );\n});\n\nexport default InstructionSeverityDisplay;\n"],"names":["defaultLabels","InstructionSeverityDisplay","React","forwardRef","severity","instructionText","severityLabel","labels","icon","showCard","padding","badgeFontSize","detailsFontSize","bgLight","bgDark","maxLines","thumbnail","props","forwardedRef","effectiveSeverity","displayLabel","hasThumbnail","undefined","content","_jsxs","_Fragment","children","_jsx","SeverityBadge","label","fontSize","parseFloat","S","$fontSize","$maxLines","title","ref","$severity","$showCard","$padding","$bgLight","$bgDark","$hasThumbnail","src","alt"],"mappings":";;;;;AAIA,MAAMA,aAAa,GAAG;AACpB,EAAA,CAAC,EAAE,MAAM;AACT,EAAA,CAAC,EAAE,MAAM;AACT,EAAA,CAAC,EAAE,aAAa;AAChB,EAAA,CAAC,EAAE,aAAa;AAChB,EAAA,CAAC,EAAE;AACL,CAAC;AAoDD,MAAMC,0BAA0B,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,0BAA0BA,CACjG;EACEG,QAAQ;EACRC,eAAe;EACfC,aAAa;EACbC,MAAM;EACNC,IAAI;AACJC,EAAAA,QAAQ,GAAG,IAAI;EACfC,OAAO;EACPC,aAAa;EACbC,eAAe;EACfC,OAAO;EACPC,MAAM;EACNC,QAAQ;EACRC,SAAS;EACT,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,IAAI,CAACb,eAAe,EAAE;AACpB,IAAA,OAAO,IAAI;AACb,EAAA;AAEA,EAAA,MAAMc,iBAAiB,GAAGf,QAAQ,IAAI,CAAC;AACvC,EAAA,MAAMgB,YAAY,GAChBd,aAAa,IAAKC,MAAM,IAAIA,MAAM,CAACY,iBAAiB,CAAE,IAAInB,aAAa,CAACmB,iBAAiB,CAAC;AAE5F,EAAA,MAAME,YAAY,GAAGL,SAAS,KAAKM,SAAS;AAE5C,EAAA,MAAMC,OAAO,GACXC,IAAA,CAAAC,QAAA,EAAA;IAAAC,QAAA,EAAA,CACEC,GAAA,CAACC,aAAa,EAAA;AACZxB,MAAAA,QAAQ,EAAEA,QAAS;AACnByB,MAAAA,KAAK,EAAET,YAAa;AACpBZ,MAAAA,IAAI,EAAEA,IAAK;AACXsB,MAAAA,QAAQ,EAAEnB,aAAa,GAAGoB,UAAU,CAACpB,aAAa,CAAC,GAAGW;AAAU,KACjE,CAAC,EACFK,GAAA,CAACK,eAAiB,EAAA;AAACC,MAAAA,SAAS,EAAErB,eAAgB;AAACsB,MAAAA,SAAS,EAAEnB,QAAS;MAAAW,QAAA,EAChEX,QAAQ,GAAGY,GAAA,CAAA,MAAA,EAAA;AAAMQ,QAAAA,KAAK,EAAE9B,eAAgB;AAAAqB,QAAAA,QAAA,EAAErB;AAAe,OAAO,CAAC,GAAGA;AAAe,KACnE,CAAC;AAAA,GACpB,CACH;AAED,EAAA,OACEmB,IAAA,CAACQ,IAAM,EAAA;AACLI,IAAAA,GAAG,EAAElB,YAAa;AAClBmB,IAAAA,SAAS,EAAEjC,QAAS;AACpBkC,IAAAA,SAAS,EAAE7B,QAAS;AACpB8B,IAAAA,QAAQ,EAAE7B,OAAQ;AAClB8B,IAAAA,QAAQ,EAAE3B,OAAQ;AAClB4B,IAAAA,OAAO,EAAE3B,MAAO;AAChB4B,IAAAA,aAAa,EAAErB,YAAa;AAAA,IAAA,GACxBJ,KAAK;AAAAS,IAAAA,QAAA,GAERL,YAAY,IACXM,GAAA,CAACK,gBAAkB,EAAA;AAAAN,MAAAA,QAAA,EAChBV,SAAS,IAAIW,GAAA,CAACK,cAAgB,EAAA;AAACW,QAAAA,GAAG,EAAE3B,SAAU;AAAC4B,QAAAA,GAAG,EAAC;OAAI;KACtC,CACrB,EACAvB,YAAY,GAAGM,GAAA,CAACK,cAAgB,EAAA;AAAAN,MAAAA,QAAA,EAAEH;KAA0B,CAAC,GAAGA,OAAO;AAAA,GAClE,CAAC;AAEb,CAAC;;;;"}

package/build/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InstructionSeverityDisplay.styled.js","sources":["../../../src/components/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.styled.ts"],"sourcesContent":["~~/\n~~ $-~~transient-prop~~ ~~pattern:~~ ~~rules~~ ~~in\n~~ ~~* `src/components/layout/SectionSeparator/SectionSeparator.styled.ts`, derivation\n ~~ and ~~measurements~~ in ~~`scripts/TS-MIGRATION-PLAYBOOK.md`~~ §J.\n \n * ~~THIS~~ ~~FILE~~ IS ~~THE~~ ~~WORKED~~ ~~EXAMPLE~~ FOR THE TWO CHAIN SHAPES, because it is the only\n * one of the 36 that has both:\n \n Card, ThumbnailWrapper, InstructionText ~~.withConfig({…}~~)~~.attrs(…)`…`\n~~ * → ~~generic~~ ~~goes on `.attrs<P>~~()`\n \n ThumbnailImage, ContentWrapper ~~.withConfig({…}~~)~~`…` (NO .attrs)\~~n * → ~~`.attrs<P>()` does not exist to annotate, and `styled.img<P>.withConfig({…})`\n * is TS1477. The generic~~ goes on ~~the TAGGED-TEMPLATE CALL instead:\n * styled~~.~~img.withConfig({ shouldForwardProp })~~<P~~>`…`\n * C7 rule 1 says the generic goes on `.attrs~~()` ~~\"and only there\"; that is\n * wrong~~ for ~~this shape, and §J.1 corrects it with~~ the ~~measurement.\n~~ \n Neither of those two reads any prop, so NEITHER IS ANNOTATED HERE — rule 2, declare\n * only what is actually passed. The shape ~~is documented because it is the one the\n * a7bb76d prototype skips with \"chain has no .attrs() and root is not the tag\"~~, ~~and\n~~ * whoever converts a file where such a site DOES read a prop needs to know the ~~slot\n~~ * ~~exists rather than reaching~~ for a ~~suppression~~.\~~n /\~~nimport styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n/\n Card's props, ~~i.e.~~ what `InstructionSeverityDisplay.tsx` passes to `S.Card~~`.\n~~ * Value types from that file's propTypes; all optional ~~per §J.5~~.\n /\nexport interface CardStyleProps {\n /* ~~`severity`~~ — ~~`PropTypes.oneOf([~~1~~, 2, 3, 4,~~ 5~~])`.~~ ~~Closed~~ on ~~purpose:~~ ~~the~~ ~~template\n * compares `===~~ 5`, ~~and a~~ comparison ~~against~~ ~~a value outside the union is~~ TS2367~~\n * rather than a branch that never fires~~. /\n $severity?: 1 \| 2 \| 3 \| 4 \| 5;\n /* ~~`showCard`~~ — ~~component~~ ~~defaults~~ it to ~~`true`,~~ ~~but~~ ~~see~~ ~~§J.5:~~ ~~a default in the\n * COMPONENT is not a default here, so this stays optional~~. /\n $showCard?: boolean;\n /* ~~`padding` — a whole~~ CSS padding shorthand, e.g. `'8px 6px'`. ~~`string`,~~ not\n * `~~number`: the template uses it raw (`padding: ${props.$padding}`) with a\n * `~~'14px 10px'~~` fallback, so a number would emit a unitless `padding: 8~~`. /\n $padding?: string;\n /* ~~`bgLight` —~~ CSS colour ~~applied~~ under `body.light-theme`. /\n $bgLight?: string;\n /* ~~`bgDark` —~~ CSS colour ~~applied~~ under `body.dark-theme`. /\n $bgDark?: string;\n /* Derived ~~in the component~~ as `thumbnail !== undefined`, ~~so genuinely `~~boolean~~`\n * and~~ not ~~the `~~string~~` the `thumbnail` prop is~~. /\n $hasThumbnail?: boolean;\n}\n\n/* InstructionText's props. /\ninterface InstructionTextStyleProps {\n /* ~~`detailsFontSize`~~ — a ~~font-size~~ with ~~its~~ unit, e.g. `'12px'`, `'0.875rem'~~`.\n * `string`~~ ~~for the same reason as `$padding`: it is~~ interpolated raw. /\n $fontSize?: string;\n /* ~~`maxLines`~~ — ~~`PropTypes.number`,~~ ~~the~~ `-webkit-line-clamp` ~~count.~~ ~~Read~~ only\n * behind `props.$maxLines ~~&&`,~~ ~~which is what keeps it valid when\n * `strictNullChecks` is eventually turned on.~~ /\n $maxLines?: number;\n}\n\n~~/\n~~ * Single-argument, ~~and it stays that way — the peer floor is\n * `~~styled-components: >=5~~.1.0`~~ ~~and~~ ~~the two majors disagree on the second parameter.\n * See SectionSeparator.styled.ts and §J.4. `~~prop` needs ~~the~~ annotation because\n * `withConfig` takes ~~this~~ by reference ~~and so gives it no contextual typing~~.\~~n /\~~nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\nexport const Card = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<CardStyleProps>(applyDefaultTheme)`\n display: flex;\n flex-direction: ${props => (props.$hasThumbnail ? 'row' : 'column')};\n gap: ${props => (props.$hasThumbnail ? '12px' : '8px')};\n align-items: flex-start;\n padding: ${props => props.$padding \|\| '14px 10px'};\n ${props => {\n if (props.$bgDark \|\| props.$bgLight) {\n return props.theme.themeProp(\n 'background',\n props.$bgDark \|\| props.theme.getColor('gray-900'),\n props.$bgLight \|\| props.theme.getColor('gray-200')\n );\n }\n return props.theme.themeProp(\n 'background',\n props.theme.getColor('gray-900'),\n props.theme.getColor('gray-200')\n );\n }}\n\n ${props =>\n props.$showCard &&\n css`\n border-radius: 10px;\n box-shadow: 0px 0px 26px #0000001a;\n `}\n\n ${props =>\n props.$severity === 5 &&\n props.$showCard &&\n css`\n outline-offset: -1px;\n ${props.theme.themeProp('outline', '1px solid #7f1d1d', '1px solid #dc2626')}\n `}\n`;\n\nexport const ThumbnailWrapper = styled.div\n .withConfig({ shouldForwardProp })\n .attrs(applyDefaultTheme)`\n flex-shrink: 0;\n width: 56px;\n height: 56px;\n border-radius: 6px;\n overflow: hidden;\n ${props =>\n props.theme.themeProp(\n 'background',\n props.theme.getColor('gray-700'),\n props.theme.getColor('gray-200')\n )}\n`;\n\n~~/\n~~ * ~~NO `.~~attrs()`, ~~and~~ no prop read, so no ~~generic.~~ ~~If a prop read is ever~~ added ~~here,\n~~ * the annotation goes on ~~the~~ ~~TEMPLATE~~ ~~CALL~~ ~~— `styled.img.withConfig({…})<P>`…`` —\n * and NOT~~ on `styled.img<P~~>.withConfig(…)`, which is TS1477. §J.1.\n */\~~nexport const ThumbnailImage = styled.img.withConfig({ shouldForwardProp })`\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n`;\n\nexport const ContentWrapper = styled.div.withConfig({ shouldForwardProp })`\n display: flex;\n flex-direction: column;\n gap: 8px;\n align-items: flex-start;\n flex: 1;\n min-width: 0;\n`;\n\nexport const InstructionText = styled.p\n .withConfig({\n shouldForwardProp\n })\n .attrs<InstructionTextStyleProps>(applyDefaultTheme)`\n font-size: ${props => props.$fontSize \|\| '14px'};\n font-weight: 400;\n line-height: 1.286em;\n margin: 0;\n overflow-wrap: break-word;\n word-break: break-word;\n ${props =>\n props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('black'))}\n\n ${props =>\n props.$maxLines &&\n css`\n display: -webkit-box;\n -webkit-line-clamp: ${props.$maxLines};\n -webkit-box-orient: vertical;\n overflow: hidden;\n `}\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Card","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","$hasThumbnail","$padding","$bgDark","$bgLight","theme","themeProp","getColor","$showCard","css","$severity","ThumbnailWrapper","ThumbnailImage","img","ContentWrapper","InstructionText","p","$fontSize","$maxLines"],"mappings":";;;~~AAqEA~~,MAAMA,iBAAiB,GAAIC,IAAY,IAAc;EACnD,OAAOA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAClD,CAAC;AAEM,MAAMC,IAAI,GAAGC,MAAM,CAACC,GAAG,CAC3BC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAAiBC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,wCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,8BAAA,EAAA,OAAA,EAAA,kCAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,EAAA,CAAA,EAEvBC,KAAK,IAAKA,KAAK,CAACC,aAAa,GAAG,KAAK,GAAG,QAAS,EAC5DD,KAAK,IAAKA,KAAK,CAACC,aAAa,GAAG,MAAM,GAAG,KAAM,EAE3CD,KAAK,IAAIA,KAAK,CAACE,QAAQ,IAAI,WAAW,EAC/CF,KAAK,IAAI;AACT,EAAA,IAAIA,KAAK,CAACG,OAAO,IAAIH,KAAK,CAACI,QAAQ,EAAE;AACnC,IAAA,OAAOJ,KAAK,CAACK,KAAK,CAACC,SAAS,CAC1B,YAAY,EACZN,KAAK,CAACG,OAAO,IAAIH,KAAK,CAACK,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,EACjDP,KAAK,CAACI,QAAQ,IAAIJ,KAAK,CAACK,KAAK,CAACE,QAAQ,CAAC,UAAU,CACnD,CAAC;AACH,EAAA;EACA,OAAOP,KAAK,CAACK,KAAK,CAACC,SAAS,CAC1B,YAAY,EACZN,KAAK,CAACK,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,EAChCP,KAAK,CAACK,KAAK,CAACE,QAAQ,CAAC,UAAU,CACjC,CAAC;AACH,CAAC,EAECP,KAAK,IACLA,KAAK,CAACQ,SAAS,IACfC,GAAG,CAAA,CAAA,uDAAA,CAAA,CAGF,EAEDT,KAAK,IACLA,KAAK,CAACU,SAAS,KAAK,CAAC,IACrBV,KAAK,CAACQ,SAAS,IACfC,GAAG,CAAA,CAAA,sBAAA,EAAA,EAAA,CAAA,EAECT,KAAK,CAACK,KAAK,CAACC,SAAS,CAAC,SAAS,EAAE,mBAAmB,EAAE,mBAAmB,CAAC,CAC7E;AAGE,MAAMK,gBAAgB,GAAGlB,MAAM,CAACC,GAAG,CACvCC,UAAU,CAAC;AAAEN,EAAAA;AAAkB,CAAC,CAAC,CACjCO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,oDAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,yEAAA,EAAA,EAAA,CAAA,EAMvBC,KAAK,IACLA,KAAK,CAACK,KAAK,CAACC,SAAS,CACnB,YAAY,EACZN,KAAK,CAACK,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,EAChCP,KAAK,CAACK,KAAK,CAACE,QAAQ,CAAC,UAAU,CACjC,CAAC;~~AAQE~~,MAAMK,cAAc,GAAGnB,MAAM,CAACoB,GAAG,CAAClB,UAAU,CAAC;AAAEN,EAAAA;AAAkB,CAAC,CAAC,CAAAM,UAAA,CAAA;EAAAG,WAAA,EAAA,kDAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,wDAAA,CAAA;AAOnE,MAAMe,cAAc,GAAGrB,MAAM,CAACC,GAAG,CAACC,UAAU,CAAC;AAAEN,EAAAA;AAAkB,CAAC,CAAC,CAAAM,UAAA,CAAA;EAAAG,WAAA,EAAA,kDAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,uFAAA,CAAA;AASnE,MAAMgB,eAAe,GAAGtB,MAAM,CAACuB,CAAC,CACpCrB,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAA4BC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,mDAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,YAAA,EAAA,+FAAA,EAAA,GAAA,EAAA,EAAA,CAAA,EACvCC,KAAK,IAAIA,KAAK,CAACiB,SAAS,IAAI,MAAM,EAM7CjB,KAAK,IACLA,KAAK,CAACK,KAAK,CAACC,SAAS,CAAC,OAAO,EAAEN,KAAK,CAACK,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,EAAEP,KAAK,CAACK,KAAK,CAACE,QAAQ,CAAC,OAAO,CAAC,CAAC,EAE/FP,KAAK,IACLA,KAAK,CAACkB,SAAS,IACfT,GAAG,+FAEqBT,KAAK,CAACkB,SAAS,CAGtC;;;;"}
1	+ {"version":3,"file":"InstructionSeverityDisplay.styled.js","sources":["../../../src/components/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.styled.ts"],"sourcesContent":["// $-prefixed props are transient and never reach the DOM.\n// This file demonstrates both chain shapes: with .attrs() (Card, ThumbnailWrapper, InstructionText) and without (ThumbnailImage, ContentWrapper).\n// Generic goes on .attrs<P>() for the first shape, on the template call for the second.\nimport styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n/*\n Card's props — what `InstructionSeverityDisplay.tsx` passes to `S.Card`; all optional.\n /\nexport interface CardStyleProps {\n /* Severity level 1-5; closed to allow === 5 comparison without TS2367. /\n $severity?: 1 \| 2 \| 3 \| 4 \| 5;\n /* Show card styling; optional here even though component defaults to true. /\n $showCard?: boolean;\n /* CSS padding shorthand as string, e.g. `'8px 6px'`; fallback `'14px 10px'`. /\n $padding?: string;\n /* CSS colour under `body.light-theme`. /\n $bgLight?: string;\n /* CSS colour under `body.dark-theme`. /\n $bgDark?: string;\n /* Derived as `thumbnail !== undefined`; boolean not string. /\n $hasThumbnail?: boolean;\n}\n\n/* InstructionText's props. /\ninterface InstructionTextStyleProps {\n /* Font-size as string with unit, e.g. `'12px'`, `'0.875rem'`; interpolated raw. /\n $fontSize?: string;\n /* Line-clamp count for `-webkit-line-clamp`; used only behind `props.$maxLines &&`. */\n $maxLines?: number;\n}\n\n// Single-argument (styled-components 5 compat); prop needs annotation because withConfig takes by reference.\nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\nexport const Card = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<CardStyleProps>(applyDefaultTheme)`\n display: flex;\n flex-direction: ${props => (props.$hasThumbnail ? 'row' : 'column')};\n gap: ${props => (props.$hasThumbnail ? '12px' : '8px')};\n align-items: flex-start;\n padding: ${props => props.$padding \|\| '14px 10px'};\n ${props => {\n if (props.$bgDark \|\| props.$bgLight) {\n return props.theme.themeProp(\n 'background',\n props.$bgDark \|\| props.theme.getColor('gray-900'),\n props.$bgLight \|\| props.theme.getColor('gray-200')\n );\n }\n return props.theme.themeProp(\n 'background',\n props.theme.getColor('gray-900'),\n props.theme.getColor('gray-200')\n );\n }}\n\n ${props =>\n props.$showCard &&\n css`\n border-radius: 10px;\n box-shadow: 0px 0px 26px #0000001a;\n `}\n\n ${props =>\n props.$severity === 5 &&\n props.$showCard &&\n css`\n outline-offset: -1px;\n ${props.theme.themeProp('outline', '1px solid #7f1d1d', '1px solid #dc2626')}\n `}\n`;\n\nexport const ThumbnailWrapper = styled.div\n .withConfig({ shouldForwardProp })\n .attrs(applyDefaultTheme)`\n flex-shrink: 0;\n width: 56px;\n height: 56px;\n border-radius: 6px;\n overflow: hidden;\n ${props =>\n props.theme.themeProp(\n 'background',\n props.theme.getColor('gray-700'),\n props.theme.getColor('gray-200')\n )}\n`;\n\n// No .attrs() or prop read; if props are added, generic goes on template call, not on styled.img<P>.\nexport const ThumbnailImage = styled.img.withConfig({ shouldForwardProp })`\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n`;\n\nexport const ContentWrapper = styled.div.withConfig({ shouldForwardProp })`\n display: flex;\n flex-direction: column;\n gap: 8px;\n align-items: flex-start;\n flex: 1;\n min-width: 0;\n`;\n\nexport const InstructionText = styled.p\n .withConfig({\n shouldForwardProp\n })\n .attrs<InstructionTextStyleProps>(applyDefaultTheme)`\n font-size: ${props => props.$fontSize \|\| '14px'};\n font-weight: 400;\n line-height: 1.286em;\n margin: 0;\n overflow-wrap: break-word;\n word-break: break-word;\n ${props =>\n props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('black'))}\n\n ${props =>\n props.$maxLines &&\n css`\n display: -webkit-box;\n -webkit-line-clamp: ${props.$maxLines};\n -webkit-box-orient: vertical;\n overflow: hidden;\n `}\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Card","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","$hasThumbnail","$padding","$bgDark","$bgLight","theme","themeProp","getColor","$showCard","css","$severity","ThumbnailWrapper","ThumbnailImage","img","ContentWrapper","InstructionText","p","$fontSize","$maxLines"],"mappings":"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"}

package/build/widgets/Instructions/Instructions.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Instructions.js","sources":["../../../src/components/widgets/Instructions/Instructions.tsx"],"sourcesContent":["import { isFunction } from 'lodash';\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { ReactComponent as AlertIcon } from '../../../icons/warning-circle.svg';\nimport AutocompleteSelect from '../../inputs/CompactAutocompleteSelect/CompactAutocompleteSelect';\nimport TextArea from '../../inputs/TextArea/TextArea';\nimport * as S from './Instructions.styled';\n\nconst NOOP = () => {};\n\ntype InstructionsOwnProps = {\n /*\n Name of the text area (used when sending form data)\n /\n name?: string;\n /\n The placeholder of the input. Text to be displayed on the input element when the component is enabled and not focused â€“ e.g. \"Search categories...\"\n /\n placeholder?: string;\n /\n How many rows/lines of text to be displayed by default\n /\n rows?: number \| string;\n /\n Selected option\n /\n selectedOption?: any;\n /\n Function with a `Promise` returning filtered options.\n \n See [Asynchronous fetching/filtering with pagination](#asynchronous-fetchingfiltering-with-pagination)\n * for details.\n \n Note:\n * <br />This will override the `availableOptions` prop if both props are set.\n /\n loadOptions?: (...args: any[]) => any;\n /\n Function for custom \"Loading...\" message while waiting for the first page\n * from `loadOptions` to resolve. Defaults to \"Loading...\" if no function is provided.\n /\n loadingMessageFunc?: (...args: any[]) => any;\n /\n /\n Whether the components displays an initial custom message.\n /\n clickToAdd?: boolean;\n /\n Add initial custom message. i.e: `No instructions (click to add)`.\n /\n customAddMessage?: string;\n /\n Whether to auto select the entire value when the input is focused â€“ does also work when the field is in read-only mode\n /\n autoSelect?: boolean;\n /\n Whether the instruction is read only\n /\n readOnly?: boolean;\n /\n Whether the intruction is disabled\n /\n disabled?: boolean;\n /\n Whether the component is hidden or visible.\n /\n hidden?: boolean;\n /\n `Array` of `objects` that populate the select menu. This is only needed\n * when asynchronous option fetching with the `loadOptions` prop is not used.\n \n Note:\n * <br />This will be overridden by the `loadOptions` prop if both props are set.\n /\n availableOptions?: any[];\n /\n `LightBackground color\n /\n lightBackground?: boolean;\n /\n Displays a light-yellow background to show that instruction value is editable\n /\n edit?: boolean;\n /\n Function with a `Promise` returning filtered options.\n \n See [Asynchronous fetching/filtering with pagination](#asynchronous-fetchingfiltering-with-pagination)\n * for details.\n \n Note:\n * <br /> `options`should be passed as an `array`of `objects`\n * <br />This will override the `availableOptions` prop if both props are set.\n /\n options?: any[];\n /\n Callback for `onChange`\n /\n subscribeCurrentValue?: (...args: any[]) => any;\n /\n Callback for `onChange`\n /\n onChange?: (...args: any[]) => any;\n /\n Callback for `onFocus`\n /\n onFocus?: (...args: any[]) => any;\n /\n Callback for `onBlur`\n /\n onBlur?: (...args: any[]) => any;\n /\n Callback for `onUpdateCallback`: register to AutocompleteSelect label and value\n /\n onUpdateCallback?: (...args: any[]) => any;\n /\n Define the type based on error,error-border , warning, loading and success.\n /\n type?: '' \| 'error' \| 'error-border' \| 'warning' \| 'instructions-warning' \| 'loading' \| 'success';\n /\n Define the type AutoCompleteSelect based on error,error-border , warning, loading and success.\n /\n selectType?: '' \| 'error' \| 'warning' \| 'instructions-warning' \| 'loading' \| 'success';\n isExpanded?: (...args: any[]) => any;\n /\n Icon element â€“ E.g: `icon={<Spinner />}`\n /\n loadingIcon?: React.ReactElement<any>;\n /\n Icon element â€“ E.g: `icon={<Check />}`\n /\n successIcon?: React.ReactElement<any>;\n /\n Add padding (small-medium-large)\n /\n padding?: '' \| 'small' \| 'medium' \| 'large';\n};\n\n/\n * NMB-3998 §C.2: `props` is spread onto `S.Instructions`, so the published type\n * has to admit that target's props too — a closed type here is worse than `any` for the\n * 125 consumer files. Declared members win over the base (`Omit` by `keyof InstructionsOwnProps`);\n * a bare `&` would INTERSECT a colliding member instead of overriding it, which narrows\n * it (measured: `rows?: number \| string` & `rows?: number`) or empties it to `never`.\n /\ntype InstructionsProps = Omit<\n React.ComponentPropsWithoutRef<typeof S.Instructions>,\n keyof InstructionsOwnProps\n> &\n InstructionsOwnProps;\n\n/\n Instructions that let you display Terms & Conditions\n \n \n * ### Import\n \n ``` js\n * import { Instructions } from '@ntbjs/react-components/widgets/Instructions'\n * // or\n * import Instructions from '@ntbjs/react-components/widgets/Instructions'\n * ```\n \n ### AutocompleteSelect\n * `AutocompleteSelect` is integrated within Instructions in order to implement the Drop-down Menu (check out the `Autocomplete` component documentation).\n \n \n * <br /> ## Options `object` format\n * Options are represented by an `Array` of `objects` with the following format:\n \n ``` js\n * {\n * value: \"Example\",\n * label: \"Example\"\n * }\n * ```\n \n /\n\nconst Instructions = React.forwardRef<any, InstructionsProps>(function Instructions(\n {\n clickToAdd = false,\n customAddMessage,\n selectedOption,\n loadOptions,\n readOnly = false,\n disabled = false,\n hidden = false,\n name,\n lightBackground = false,\n autoSelect = true,\n subscribeCurrentValue: subscribeCurrentValueProp,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n onUpdateCallback = NOOP,\n availableOptions,\n loadingMessageFunc,\n placeholder,\n type = '',\n selectType = '',\n edit = false,\n rows,\n isExpanded,\n loadingIcon,\n successIcon,\n padding = 'medium',\n /\n NMB-3998 DOM LEAK. `options` is declared and documented on `InstructionsOwnProps`\n * but was never destructured, so it fell into the `...props` rest below and was\n * spread onto `<S.Instructions>`. Nothing in `Instructions.styled.ts` reads it and it\n * has no `$` prefix, so `shouldForwardProp` forwarded it to the host `<div>`, where\n * React stringified the array: `<div options=\"[object Object],[object Object],…\">` is\n * in the committed render baseline entry `widgets/Instructions`.\n \n Destructuring it here is what stops the leak. It is also consumed for the first\n * time, in `sharedSelectProps` below, which is the behaviour its own JSDoc has always\n * documented (\"will override the `availableOptions` prop if both props are set\") and\n * which nothing implemented. Leaving it destructured-but-unused would have been a\n * knowingly dead binding.\n /\n options,\n ...props\n },\n forwardedRef\n) {\n const [isHovered, setIsHovered] = useState(false);\n const [selected, setSelected] = useState({});\n const [addInstructions, setAddInstructions] = useState(clickToAdd);\n const [customMessage, setCustomMessage] = useState(customAddMessage);\n const [background, setBackground] = useState(lightBackground);\n const [initialHover, setInitialHover] = useState(true);\n /\n * NMB-3998: same failure as CompactTextInput — bare `useState()` infers `undefined`, so\n * the setter is `(prevState: undefined) => undefined` and rejects every string assigned\n * to it (TS2345 at the `customMessage` and `''` sites). All six writes are strings\n * (`selectedOption.value`, `customMessage`, `event.target.value`, `''`,\n * `selected.value`). The initial value stays `undefined` — type-only, no argument added.\n /\n const [currentValue, setCurrentValue] = useState<string \| undefined>();\n\n useEffect(() => {\n if (isFunction(subscribeCurrentValueProp)) {\n subscribeCurrentValueProp(currentValue);\n }\n }, [currentValue]);\n\n useEffect(() => {\n handleChange(selected);\n }, [selected]);\n //Selected option to be displayed on first render\n useEffect(() => {\n if (selectedOption) {\n setCurrentValue(selectedOption.value);\n }\n }, [selectedOption]);\n //Custom instructions added by consumer\n useEffect(() => {\n if (addInstructions) {\n setCurrentValue(customMessage);\n setInitialHover(true);\n }\n }, [addInstructions, customMessage]);\n\n const onChange = useCallback(\n event => {\n setCurrentValue(event.target.value);\n if (isFunction(onChangeProp)) {\n onChangeProp(event);\n }\n },\n [onChangeProp]\n );\n const onFocus = useCallback(\n event => {\n if (autoSelect) {\n event.target.select();\n }\n if (isFunction(onFocusProp)) {\n onFocusProp(event);\n }\n if (event.target.value === customMessage) {\n setCurrentValue('');\n }\n },\n [autoSelect, readOnly, onFocusProp]\n );\n const onBlur = useCallback(\n event => {\n if (isFunction(onBlurProp)) {\n onBlurProp(event);\n }\n },\n [onBlurProp]\n );\n\n const handleMouseOver = () => {\n setIsHovered(true);\n };\n const handleMouseLeave = () => {\n setIsHovered(false);\n };\n\n const handleChange = selected => {\n if (selected === null) {\n setSelected({});\n setAddInstructions(true);\n setBackground(true);\n setInitialHover(true);\n setCustomMessage(customAddMessage);\n } else {\n setSelected(selected);\n setCurrentValue(selected.value);\n setAddInstructions(false);\n setBackground(false);\n setInitialHover(false);\n onUpdateCallback(selected);\n }\n };\n\n const sharedSelectProps = {\n // `options` wins over `availableOptions` when both are set — its documented contract.\n options: loadOptions ? undefined : (options ?? availableOptions),\n loadOptions: loadOptions,\n loadingMessage: loadingMessageFunc,\n placeholder: placeholder\n };\n\n if (hidden) return null;\n\n return (\n <S.Instructions\n ref={forwardedRef}\n onMouseDown={handleMouseOver}\n onMouseLeave={handleMouseLeave}\n {...props}\n >\n {!readOnly && !disabled && (\n <S.TopBarContainer\n $initialHover={initialHover}\n className={isHovered && !readOnly && !disabled && 'slide-in'}\n >\n <S.SelectContainer>\n <AutocompleteSelect\n type={selectType}\n value={selectedOption}\n creatable={false}\n onChange={handleChange}\n {...sharedSelectProps}\n />\n </S.SelectContainer>\n </S.TopBarContainer>\n )}\n\n {/\n * NMB-3998 DOM LEAK, fixed by deleting a prop nothing consumed. `S.InstructionsArea`\n * used to be given `type={type}`. It is a `styled.div` whose template reads no props\n * at all, and `type` has no `$` prefix, so `shouldForwardProp` forwarded it straight\n * onto the `<div>` — `<div type=\"warning\" …>` is in the committed render baseline\n * entry `widgets/Instructions`, and `type` is not an attribute of `<div>`. The `type`\n * styling is done by the `TextArea` below, which does consume it.\n /}\n <S.InstructionsArea>\n <TextArea\n noBorder\n type={type}\n /\n INERT. TextArea stopped consuming `lightBackground` in f5ff074\n * (Aug 2024), so Instructions' documented `lightBackground` prop has had\n * no visual effect since then — its only remaining behaviour was leaking\n * onto the DOM as an unknown attribute. Kept transient ($-prefixed) so\n * styled-components strips it, rather than deleted, because deleting the\n * pass-down orphans the `background` state and the public prop while\n * fixing nothing a consumer can see. Restoring the feature is a\n * behaviour change and needs its own ticket.\n */\n $lightBackground={background}\n readOnly={readOnly}\n disabled={disabled}\n name={name}\n isExpanded={isExpanded}\n edit={edit}\n value={currentValue === null ? '' : currentValue}\n onFocus={onFocus}\n onChange={onChange}\n onBlur={onBlur}\n rows={rows}\n icon={<AlertIcon />}\n loadingIcon={loadingIcon}\n successIcon={successIcon}\n padding={padding}\n />\n </S.InstructionsArea>\n </S.Instructions>\n );\n});\n\nexport default Instructions;\n"],"names":["NOOP","Instructions","React","forwardRef","clickToAdd","customAddMessage","selectedOption","loadOptions","readOnly","disabled","hidden","name","lightBackground","autoSelect","subscribeCurrentValue","subscribeCurrentValueProp","onChange","onChangeProp","onFocus","onFocusProp","onBlur","onBlurProp","onUpdateCallback","availableOptions","loadingMessageFunc","placeholder","type","selectType","edit","rows","isExpanded","loadingIcon","successIcon","padding","options","props","forwardedRef","isHovered","setIsHovered","useState","selected","setSelected","addInstructions","setAddInstructions","customMessage","setCustomMessage","background","setBackground","initialHover","setInitialHover","currentValue","setCurrentValue","useEffect","isFunction","handleChange","value","useCallback","event","target","select","handleMouseOver","handleMouseLeave","sharedSelectProps","undefined","loadingMessage","_jsxs","S","ref","onMouseDown","onMouseLeave","children","_jsx","$initialHover","className","AutocompleteSelect","creatable","TextArea","noBorder","$lightBackground","icon","AlertIcon"],"mappings":"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"}
1	+ {"version":3,"file":"Instructions.js","sources":["../../../src/components/widgets/Instructions/Instructions.tsx"],"sourcesContent":["import { isFunction } from 'lodash';\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { ReactComponent as AlertIcon } from '../../../icons/warning-circle.svg';\nimport AutocompleteSelect from '../../inputs/CompactAutocompleteSelect/CompactAutocompleteSelect';\nimport TextArea from '../../inputs/TextArea/TextArea';\nimport * as S from './Instructions.styled';\n\nconst NOOP = () => {};\n\ntype InstructionsOwnProps = {\n /*\n Name of the text area (used when sending form data)\n /\n name?: string;\n /\n The placeholder of the input. Text to be displayed on the input element when the component is enabled and not focused â€“ e.g. \"Search categories...\"\n /\n placeholder?: string;\n /\n How many rows/lines of text to be displayed by default\n /\n rows?: number \| string;\n /\n Selected option\n /\n selectedOption?: any;\n /\n Function with a `Promise` returning filtered options.\n \n See [Asynchronous fetching/filtering with pagination](#asynchronous-fetchingfiltering-with-pagination)\n * for details.\n \n Note:\n * <br />This will override the `availableOptions` prop if both props are set.\n /\n loadOptions?: (...args: any[]) => any;\n /\n Function for custom \"Loading...\" message while waiting for the first page\n * from `loadOptions` to resolve. Defaults to \"Loading...\" if no function is provided.\n /\n loadingMessageFunc?: (...args: any[]) => any;\n /\n /\n Whether the components displays an initial custom message.\n /\n clickToAdd?: boolean;\n /\n Add initial custom message. i.e: `No instructions (click to add)`.\n /\n customAddMessage?: string;\n /\n Whether to auto select the entire value when the input is focused â€“ does also work when the field is in read-only mode\n /\n autoSelect?: boolean;\n /\n Whether the instruction is read only\n /\n readOnly?: boolean;\n /\n Whether the intruction is disabled\n /\n disabled?: boolean;\n /\n Whether the component is hidden or visible.\n /\n hidden?: boolean;\n /\n `Array` of `objects` that populate the select menu. This is only needed\n * when asynchronous option fetching with the `loadOptions` prop is not used.\n \n Note:\n * <br />This will be overridden by the `loadOptions` prop if both props are set.\n /\n availableOptions?: any[];\n /\n `LightBackground color\n /\n lightBackground?: boolean;\n /\n Displays a light-yellow background to show that instruction value is editable\n /\n edit?: boolean;\n /\n Function with a `Promise` returning filtered options.\n \n See [Asynchronous fetching/filtering with pagination](#asynchronous-fetchingfiltering-with-pagination)\n * for details.\n \n Note:\n * <br /> `options`should be passed as an `array`of `objects`\n * <br />This will override the `availableOptions` prop if both props are set.\n /\n options?: any[];\n /\n Callback for `onChange`\n /\n subscribeCurrentValue?: (...args: any[]) => any;\n /\n Callback for `onChange`\n /\n onChange?: (...args: any[]) => any;\n /\n Callback for `onFocus`\n /\n onFocus?: (...args: any[]) => any;\n /\n Callback for `onBlur`\n /\n onBlur?: (...args: any[]) => any;\n /\n Callback for `onUpdateCallback`: register to AutocompleteSelect label and value\n /\n onUpdateCallback?: (...args: any[]) => any;\n /\n Define the type based on error,error-border , warning, loading and success.\n /\n type?: '' \| 'error' \| 'error-border' \| 'warning' \| 'instructions-warning' \| 'loading' \| 'success';\n /\n Define the type AutoCompleteSelect based on error,error-border , warning, loading and success.\n /\n selectType?: '' \| 'error' \| 'warning' \| 'instructions-warning' \| 'loading' \| 'success';\n isExpanded?: (...args: any[]) => any;\n /\n Icon element â€“ E.g: `icon={<Spinner />}`\n /\n loadingIcon?: React.ReactElement<any>;\n /\n Icon element â€“ E.g: `icon={<Check />}`\n /\n successIcon?: React.ReactElement<any>;\n /\n Add padding (small-medium-large)\n /\n padding?: '' \| 'small' \| 'medium' \| 'large';\n};\n\n// Omit before & — a bare intersection narrows colliding props instead of overriding them.\ntype InstructionsProps = Omit<\n React.ComponentPropsWithoutRef<typeof S.Instructions>,\n keyof InstructionsOwnProps\n> &\n InstructionsOwnProps;\n\n/\n Instructions that let you display Terms & Conditions\n \n \n * ### Import\n \n ``` js\n * import { Instructions } from '@ntbjs/react-components/widgets/Instructions'\n * // or\n * import Instructions from '@ntbjs/react-components/widgets/Instructions'\n * ```\n \n ### AutocompleteSelect\n * `AutocompleteSelect` is integrated within Instructions in order to implement the Drop-down Menu (check out the `Autocomplete` component documentation).\n \n \n * <br /> ## Options `object` format\n * Options are represented by an `Array` of `objects` with the following format:\n \n ``` js\n * {\n * value: \"Example\",\n * label: \"Example\"\n * }\n * ```\n \n /\n\nconst Instructions = React.forwardRef<any, InstructionsProps>(function Instructions(\n {\n clickToAdd = false,\n customAddMessage,\n selectedOption,\n loadOptions,\n readOnly = false,\n disabled = false,\n hidden = false,\n name,\n lightBackground = false,\n autoSelect = true,\n subscribeCurrentValue: subscribeCurrentValueProp,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n onUpdateCallback = NOOP,\n availableOptions,\n loadingMessageFunc,\n placeholder,\n type = '',\n selectType = '',\n edit = false,\n rows,\n isExpanded,\n loadingIcon,\n successIcon,\n padding = 'medium',\n // DOM LEAK: options was never destructured, so it leaked to the DOM as a stringified array.\n options,\n ...props\n },\n forwardedRef\n) {\n const [isHovered, setIsHovered] = useState(false);\n const [selected, setSelected] = useState({});\n const [addInstructions, setAddInstructions] = useState(clickToAdd);\n const [customMessage, setCustomMessage] = useState(customAddMessage);\n const [background, setBackground] = useState(lightBackground);\n const [initialHover, setInitialHover] = useState(true);\n // Bare useState() infers undefined; explicit <string \| undefined> allows all writes without argument.\n const [currentValue, setCurrentValue] = useState<string \| undefined>();\n\n useEffect(() => {\n if (isFunction(subscribeCurrentValueProp)) {\n subscribeCurrentValueProp(currentValue);\n }\n }, [currentValue]);\n\n useEffect(() => {\n handleChange(selected);\n }, [selected]);\n //Selected option to be displayed on first render\n useEffect(() => {\n if (selectedOption) {\n setCurrentValue(selectedOption.value);\n }\n }, [selectedOption]);\n //Custom instructions added by consumer\n useEffect(() => {\n if (addInstructions) {\n setCurrentValue(customMessage);\n setInitialHover(true);\n }\n }, [addInstructions, customMessage]);\n\n const onChange = useCallback(\n event => {\n setCurrentValue(event.target.value);\n if (isFunction(onChangeProp)) {\n onChangeProp(event);\n }\n },\n [onChangeProp]\n );\n const onFocus = useCallback(\n event => {\n if (autoSelect) {\n event.target.select();\n }\n if (isFunction(onFocusProp)) {\n onFocusProp(event);\n }\n if (event.target.value === customMessage) {\n setCurrentValue('');\n }\n },\n [autoSelect, readOnly, onFocusProp]\n );\n const onBlur = useCallback(\n event => {\n if (isFunction(onBlurProp)) {\n onBlurProp(event);\n }\n },\n [onBlurProp]\n );\n\n const handleMouseOver = () => {\n setIsHovered(true);\n };\n const handleMouseLeave = () => {\n setIsHovered(false);\n };\n\n const handleChange = selected => {\n if (selected === null) {\n setSelected({});\n setAddInstructions(true);\n setBackground(true);\n setInitialHover(true);\n setCustomMessage(customAddMessage);\n } else {\n setSelected(selected);\n setCurrentValue(selected.value);\n setAddInstructions(false);\n setBackground(false);\n setInitialHover(false);\n onUpdateCallback(selected);\n }\n };\n\n const sharedSelectProps = {\n // `options` wins over `availableOptions` when both are set — its documented contract.\n options: loadOptions ? undefined : (options ?? availableOptions),\n loadOptions: loadOptions,\n loadingMessage: loadingMessageFunc,\n placeholder: placeholder\n };\n\n if (hidden) return null;\n\n return (\n <S.Instructions\n ref={forwardedRef}\n onMouseDown={handleMouseOver}\n onMouseLeave={handleMouseLeave}\n {...props}\n >\n {!readOnly && !disabled && (\n <S.TopBarContainer\n $initialHover={initialHover}\n className={isHovered && !readOnly && !disabled && 'slide-in'}\n >\n <S.SelectContainer>\n <AutocompleteSelect\n type={selectType}\n value={selectedOption}\n creatable={false}\n onChange={handleChange}\n {...sharedSelectProps}\n />\n </S.SelectContainer>\n </S.TopBarContainer>\n )}\n\n {/* DOM LEAK fixed: type is passed only to TextArea, not to InstructionsArea. */}\n <S.InstructionsArea>\n <TextArea\n noBorder\n type={type}\n // lightBackground prop is inert (TextArea no longer consumes it); kept transient to prevent other regressions.\n $lightBackground={background}\n readOnly={readOnly}\n disabled={disabled}\n name={name}\n isExpanded={isExpanded}\n edit={edit}\n value={currentValue === null ? '' : currentValue}\n onFocus={onFocus}\n onChange={onChange}\n onBlur={onBlur}\n rows={rows}\n icon={<AlertIcon />}\n loadingIcon={loadingIcon}\n successIcon={successIcon}\n padding={padding}\n />\n </S.InstructionsArea>\n </S.Instructions>\n );\n});\n\nexport default Instructions;\n"],"names":["NOOP","Instructions","React","forwardRef","clickToAdd","customAddMessage","selectedOption","loadOptions","readOnly","disabled","hidden","name","lightBackground","autoSelect","subscribeCurrentValue","subscribeCurrentValueProp","onChange","onChangeProp","onFocus","onFocusProp","onBlur","onBlurProp","onUpdateCallback","availableOptions","loadingMessageFunc","placeholder","type","selectType","edit","rows","isExpanded","loadingIcon","successIcon","padding","options","props","forwardedRef","isHovered","setIsHovered","useState","selected","setSelected","addInstructions","setAddInstructions","customMessage","setCustomMessage","background","setBackground","initialHover","setInitialHover","currentValue","setCurrentValue","useEffect","isFunction","handleChange","value","useCallback","event","target","select","handleMouseOver","handleMouseLeave","sharedSelectProps","undefined","loadingMessage","_jsxs","S","ref","onMouseDown","onMouseLeave","children","_jsx","$initialHover","className","AutocompleteSelect","creatable","TextArea","noBorder","$lightBackground","icon","AlertIcon"],"mappings":"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"}

package/build/widgets/Instructions/Instructions.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Instructions.styled.js","sources":["../../../src/components/widgets/Instructions/Instructions.styled.ts"],"sourcesContent":["~~/\n~~ $-~~transient-prop~~ ~~pattern:~~ ~~rules~~ ~~in\n~~ * `src/components/layout/SectionSeparator/SectionSeparator.styled.ts`, derivation and\n * ~~measurements~~ in ~~`scripts/TS-MIGRATION-PLAYBOOK.md` §J~~.\~~n /\~~nimport styled from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n/\n `TopBarContainer`, the only component in this file that reads a prop.\n /\ninterface InstructionsTopBarStyleProps {\n /\n `initialHover` — ~~`Instructions.tsx`'s~~ ~~`useState(true)`,~~ so ~~genuinely `boolean` and not\n * derived from any prop. Transient, so it never reaches the DOM.\n \n READ, PASSED, AND NEVERTHELESS INERT — recorded, not fixed. The~~ rule it ~~guards is\n * `themeProp('background', '#634E01', getColor('signal-yellow-400'))`, character for\n * character~~ the ~~same~~ ~~declaration as the UNCONDITIONAL~~ one ~~three lines~~ above it~~. So\n * whichever way `$initialHover` goes, the emitted background is identical and the\n * conditional only ever adds a duplicate of the rule that precedes it~~.\n \n Deleting it is the fix, and it is not a type-only change: removing the block removes a\n * duplicate declaration from the generated CSS and therefore moves the render baseline\n * (§J.8). Whether the intent was a DIFFERENT hover colour is a question for whoever owns\n * the design, not for this commit.\n /\n $initialHover?: boolean;\n}\n\n~~/\n~~ * Single-argument, ~~and it stays that way — peer floor `~~styled-components: >=5~~.1.0`,~~ ~~and\n~~ * the two majors disagree on the second parameter. §J.4. `prop` needs the annotation\n * because `withConfig` takes this by reference, so it gets no contextual typing.\n \n NOTE, for whoever audits DOM leaks ~~here:~~ ~~this predicate is doing its job and both leaks\n * this component had were~~ upstream ~~of it,~~ in `Instructions.tsx~~`, which is where they were\n * fixed — nothing in this file read either prop, so there was never anything to declare~~.\n * For the record, since the recorded baseline still shows them until it is re-recorded:\n * `widgets/Instructions` opened `<div options=\"[object Object],[object Object],…\">`\n * (`options` was never destructured, so it rode the `...props` rest onto `S.Instructions`)\n * and `InstructionsArea` rendered `<div type=\"warning\">` (`type={type}` was passed to a\n * component whose template reads no props at all).\n */\nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\nexport const Instructions = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n position: relative;\n flex-direction: column;\n ${props =>\n props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400'))};\n`;\n\nexport const TopBarContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<InstructionsTopBarStyleProps>(applyDefaultTheme)`\n position: absolute;\n display: flex;\n width: 100%;\n margin-top: 0;\n transition: margin-top 120ms;\n &&.slide-in {\n margin-top: -24px;\n }\n ${props =>\n props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400'))};\n\n ${props =>\n props.$initialHover &&\n props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400'))};\n`;\n\nexport const SelectContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n width: 100%;\n margin: 0 2px;\n`;\n\nexport const InstructionsArea = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n margin: 2px 2px -2px 2px;\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Instructions","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","theme","themeProp","getColor","TopBarContainer","$initialHover","SelectContainer","InstructionsArea"],"mappings":";;;~~AA4CA~~,MAAMA,iBAAiB,GAAIC,IAAY,IAAc;EACnD,OAAOA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAClD,CAAC;AAEM,MAAMC,YAAY,GAAGC,MAAM,CAACC,GAAG,CACnCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,kCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,uDAAA,EAAA,GAAA,CAAA,EAIvBC,KAAK,IACLA,KAAK,CAACC,KAAK,CAACC,SAAS,CAAC,YAAY,EAAE,SAAS,EAAEF,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,mBAAmB,CAAC,CAAC;AAGtF,MAAMC,eAAe,GAAGX,MAAM,CAACC,GAAG,CACtCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAA+BC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,qCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,mHAAA,EAAA,GAAA,EAAA,GAAA,CAAA,EASrDC,KAAK,IACLA,KAAK,CAACC,KAAK,CAACC,SAAS,CAAC,YAAY,EAAE,SAAS,EAAEF,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,mBAAmB,CAAC,CAAC,EAEzFH,KAAK,IACLA,KAAK,CAACK,aAAa,IACnBL,KAAK,CAACC,KAAK,CAACC,SAAS,CAAC,YAAY,EAAE,SAAS,EAAEF,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,mBAAmB,CAAC,CAAC;AAGtF,MAAMG,eAAe,GAAGb,MAAM,CAACC,GAAG,CACtCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,qCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,0BAAA,CAAA;AAKpB,MAAMQ,gBAAgB,GAAGd,MAAM,CAACC,GAAG,CACvCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,sCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,0BAAA,CAAA;;;;"}
1	+ {"version":3,"file":"Instructions.styled.js","sources":["../../../src/components/widgets/Instructions/Instructions.styled.ts"],"sourcesContent":["// $-prefixed props are transient and never reach the DOM.\nimport styled from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n/*\n TopBarContainer — the only component in this file that reads a prop.\n /\ninterface InstructionsTopBarStyleProps {\n /\n `$initialHover` is inert: its conditional rule duplicates the unconditional one above it.\n */\n $initialHover?: boolean;\n}\n\n// Single-argument (styled-components 5 compat); DOM leaks fixed upstream in Instructions.tsx.\nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\nexport const Instructions = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n position: relative;\n flex-direction: column;\n ${props =>\n props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400'))};\n`;\n\nexport const TopBarContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<InstructionsTopBarStyleProps>(applyDefaultTheme)`\n position: absolute;\n display: flex;\n width: 100%;\n margin-top: 0;\n transition: margin-top 120ms;\n &&.slide-in {\n margin-top: -24px;\n }\n ${props =>\n props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400'))};\n\n ${props =>\n props.$initialHover &&\n props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400'))};\n`;\n\nexport const SelectContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n width: 100%;\n margin: 0 2px;\n`;\n\nexport const InstructionsArea = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n margin: 2px 2px -2px 2px;\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Instructions","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","theme","themeProp","getColor","TopBarContainer","$initialHover","SelectContainer","InstructionsArea"],"mappings":";;;AAeA,MAAMA,iBAAiB,GAAIC,IAAY,IAAc;EACnD,OAAOA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAClD,CAAC;AAEM,MAAMC,YAAY,GAAGC,MAAM,CAACC,GAAG,CACnCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,kCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,uDAAA,EAAA,GAAA,CAAA,EAIvBC,KAAK,IACLA,KAAK,CAACC,KAAK,CAACC,SAAS,CAAC,YAAY,EAAE,SAAS,EAAEF,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,mBAAmB,CAAC,CAAC;AAGtF,MAAMC,eAAe,GAAGX,MAAM,CAACC,GAAG,CACtCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAA+BC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,qCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,mHAAA,EAAA,GAAA,EAAA,GAAA,CAAA,EASrDC,KAAK,IACLA,KAAK,CAACC,KAAK,CAACC,SAAS,CAAC,YAAY,EAAE,SAAS,EAAEF,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,mBAAmB,CAAC,CAAC,EAEzFH,KAAK,IACLA,KAAK,CAACK,aAAa,IACnBL,KAAK,CAACC,KAAK,CAACC,SAAS,CAAC,YAAY,EAAE,SAAS,EAAEF,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,mBAAmB,CAAC,CAAC;AAGtF,MAAMG,eAAe,GAAGb,MAAM,CAACC,GAAG,CACtCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,qCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,0BAAA,CAAA;AAKpB,MAAMQ,gBAAgB,GAAGd,MAAM,CAACC,GAAG,CACvCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,sCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,0BAAA,CAAA;;;;"}

package/build/widgets/ProgressBar/ProgressBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ProgressBar.js","sources":["../../../src/components/widgets/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport * as S from './ProgressBar.styled';\n\ntype ProgressBarOwnProps = {\n totalAssets: number;\n completedAssets: number;\n percentageText?: string;\n barColor?: string;\n height?: number;\n label?: string;\n type?: string;\n linkText?: string;\n onClick?: (...args: any[]) => any;\n};\n\n~~/\n~~ ~~NMB-3998 §C.2: `props` is~~ spread onto ~~`S.Container`,~~ so ~~the~~ ~~published~~ ~~type\n * has~~ to ~~admit~~ ~~that~~ ~~target's~~ ~~props too — a closed type here is worse than `any` for the\n * 125 consumer files. Declared members win over the base (`Omit` by `keyof ProgressBarOwnProps`);\n * a bare `&` would INTERSECT a~~ colliding ~~member instead of overriding it, which narrows\n * it (measured: `rows?: number \| string` & `rows?: number`) or empties it to `never`.\n /\~~ntype Props = Omit<React.ComponentPropsWithoutRef<typeof S.Container>, keyof ProgressBarOwnProps> &\n ProgressBarOwnProps;\n\n/\n ProgressBar that let you progress through a task.\n \n \n * ### Import\n \n ``` js\n * import { ProgressBar } from '@ntbjs/react-components/widgets/ProgressBar'\n * // or\n * import ProgressBar from '@ntbjs/react-components/widgets/ProgressBar'\n * ```\n \n \n /\n\nconst ProgressBar = ({\n totalAssets,\n completedAssets,\n percentageText,\n barColor,\n height,\n label,\n type,\n linkText,\n onClick,\n ...props\n}: Props) => {\n const [isLinkHovered, setIsLinkHovered] = useState(false);\n\n const safeCompletedAssets = Math.max(0, completedAssets);\n const safeTotalAssets = Math.max(1, totalAssets);\n const percentage = (safeCompletedAssets / safeTotalAssets) 100;\n const formattedPercentage = `${Math.round(percentage)}%`;\n\n const isLowPercentage = percentage <= 5;\n\n const handleLinkClick = e => onClick(e);\n\n const formatNumberNew = num => {\n if (num < 1000000) {\n return num.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ' ');\n } else {\n const units = ['K', 'M', 'B', 'T'];\n const unit = Math.floor((num.toString().length - 1) / 3) - 1;\n const shortNum = num / Math.pow(1000, unit + 1);\n return shortNum.toFixed(shortNum < 10 ? 1 : 0) + units[unit];\n }\n };\n\n return (\n <S.Container height={height} {...props}>\n <S.Label>{label}</S.Label>\n <S.InnerContainer type={type}>\n <S.Completed type={type}>{formatNumberNew(completedAssets)}</S.Completed>\n <S.ProgressBarTrack>\n <S.MetricsContainer $hasLink={Boolean(linkText)}>\n <S.ProgressBarFill type={type} $percentage={percentage} barColor={barColor}>\n {!isLowPercentage && (\n /\n ~~NMB-3998:~~ `$hasLink~~={Boolean(linkText)}~~` removed. ProgressBar.styled.ts:32-38\n * ~~already~~ ~~records this as a dead pass — `$hasLink` is declared for\n * MetricsContainer, which~~ reads it for its `width`, while PercentageIndicator\n * \"NEVER READS IT\". Output-neutral: not read by the template, so the class is\n * unchanged, and transient so it never reached the DOM.\n */\n <S.PercentageIndicator>\n {percentageText \|\| formattedPercentage}\n </S.PercentageIndicator>\n )}\n </S.ProgressBarFill>\n {isLowPercentage && (\n <S.ExternalPercentageIndicator>\n {percentageText \|\| formattedPercentage}\n </S.ExternalPercentageIndicator>\n )}\n </S.MetricsContainer>\n {linkText && (\n <S.Link\n onClick={handleLinkClick}\n onMouseEnter={() => setIsLinkHovered(true)}\n onMouseLeave={() => setIsLinkHovered(false)}\n >\n <S.ButtonLink $isHovered={isLinkHovered}>{linkText}</S.ButtonLink>\n <S.StyledArrowIcon $isHovered={isLinkHovered} />\n </S.Link>\n )}\n </S.ProgressBarTrack>\n </S.InnerContainer>\n </S.Container>\n );\n};\n\nexport default ProgressBar;\n"],"names":["ProgressBar","totalAssets","completedAssets","percentageText","barColor","height","label","type","linkText","onClick","props","isLinkHovered","setIsLinkHovered","useState","safeCompletedAssets","Math","max","safeTotalAssets","percentage","formattedPercentage","round","isLowPercentage","handleLinkClick","e","formatNumberNew","num","toString","replace","units","unit","floor","length","shortNum","pow","toFixed","_jsxs","S","children","_jsx","$hasLink","Boolean","$percentage","onMouseEnter","onMouseLeave","$isHovered"],"mappings":";;;;~~AAwCA~~,MAAMA,WAAW,GAAGA,CAAC;EACnBC,WAAW;EACXC,eAAe;EACfC,cAAc;EACdC,QAAQ;EACRC,MAAM;EACNC,KAAK;EACLC,IAAI;EACJC,QAAQ;EACRC,OAAO;EACP,GAAGC;AACE,CAAC,KAAK;EACX,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC;EAEzD,MAAMC,mBAAmB,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEd,eAAe,CAAC;EACxD,MAAMe,eAAe,GAAGF,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEf,WAAW,CAAC;AAChD,EAAA,MAAMiB,UAAU,GAAIJ,mBAAmB,GAAGG,eAAe,GAAI,GAAG;EAChE,MAAME,mBAAmB,GAAG,CAAA,EAAGJ,IAAI,CAACK,KAAK,CAACF,UAAU,CAAC,CAAA,CAAA,CAAG;AAExD,EAAA,MAAMG,eAAe,GAAGH,UAAU,IAAI,CAAC;AAEvC,EAAA,MAAMI,eAAe,GAAGC,CAAC,IAAId,OAAO,CAACc,CAAC,CAAC;EAEvC,MAAMC,eAAe,GAAGC,GAAG,IAAI;IAC7B,IAAIA,GAAG,GAAG,OAAO,EAAE;MACjB,OAAOA,GAAG,CAACC,QAAQ,EAAE,CAACC,OAAO,CAAC,uBAAuB,EAAE,GAAG,CAAC;AAC7D,IAAA,CAAC,MAAM;MACL,MAAMC,KAAK,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;MAClC,MAAMC,IAAI,GAAGd,IAAI,CAACe,KAAK,CAAC,CAACL,GAAG,CAACC,QAAQ,EAAE,CAACK,MAAM,GAAG,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC;AAC5D,MAAA,MAAMC,QAAQ,GAAGP,GAAG,GAAGV,IAAI,CAACkB,GAAG,CAAC,IAAI,EAAEJ,IAAI,GAAG,CAAC,CAAC;AAC/C,MAAA,OAAOG,QAAQ,CAACE,OAAO,CAACF,QAAQ,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC,GAAGJ,KAAK,CAACC,IAAI,CAAC;AAC9D,IAAA;EACF,CAAC;AAED,EAAA,OACEM,IAAA,CAACC,SAAW,EAAA;AAAC/B,IAAAA,MAAM,EAAEA,MAAO;AAAA,IAAA,GAAKK,KAAK;AAAA2B,IAAAA,QAAA,EAAA,CACpCC,GAAA,CAACF,KAAO,EAAA;AAAAC,MAAAA,QAAA,EAAE/B;AAAK,KAAU,CAAC,EAC1B6B,IAAA,CAACC,cAAgB,EAAA;AAAC7B,MAAAA,IAAI,EAAEA,IAAK;AAAA8B,MAAAA,QAAA,EAAA,CAC3BC,GAAA,CAACF,SAAW,EAAA;AAAC7B,QAAAA,IAAI,EAAEA,IAAK;QAAA8B,QAAA,EAAEb,eAAe,CAACtB,eAAe;AAAC,OAAc,CAAC,EACzEiC,IAAA,CAACC,gBAAkB,EAAA;AAAAC,QAAAA,QAAA,EAAA,CACjBF,IAAA,CAACC,gBAAkB,EAAA;AAACG,UAAAA,QAAQ,EAAEC,OAAO,CAAChC,QAAQ,CAAE;AAAA6B,UAAAA,QAAA,EAAA,CAC9CC,GAAA,CAACF,eAAiB,EAAA;AAAC7B,YAAAA,IAAI,EAAEA,IAAK;AAACkC,YAAAA,WAAW,EAAEvB,UAAW;AAACd,YAAAA,QAAQ,EAAEA,QAAS;YAAAiC,QAAA,EACxE,CAAChB,eAAe,~~IAQfiB~~,GAAA,CAACF,mBAAqB,EAAA;cAAAC,QAAA,EACnBlC,cAAc,IAAIgB;aACE;WAER,CAAC,EACnBE,eAAe,IACdiB,GAAA,CAACF,2BAA6B,EAAA;YAAAC,QAAA,EAC3BlC,cAAc,IAAIgB;AAAmB,WACT,CAChC;SACiB,CAAC,EACpBX,QAAQ,IACP2B,IAAA,CAACC,IAAM,EAAA;AACL3B,UAAAA,OAAO,EAAEa,eAAgB;AACzBoB,UAAAA,YAAY,EAAEA,MAAM9B,gBAAgB,CAAC,IAAI,CAAE;AAC3C+B,UAAAA,YAAY,EAAEA,MAAM/B,gBAAgB,CAAC,KAAK,CAAE;AAAAyB,UAAAA,QAAA,EAAA,CAE5CC,GAAA,CAACF,UAAY,EAAA;AAACQ,YAAAA,UAAU,EAAEjC,aAAc;AAAA0B,YAAAA,QAAA,EAAE7B;AAAQ,WAAe,CAAC,EAClE8B,GAAA,CAACF,eAAiB,EAAA;AAACQ,YAAAA,UAAU,EAAEjC;AAAc,WAAE,CAAC;AAAA,SAC1C,CACT;AAAA,OACiB,CAAC;AAAA,KACL,CAAC;AAAA,GACR,CAAC;AAElB;;;;"}
1	+ {"version":3,"file":"ProgressBar.js","sources":["../../../src/components/widgets/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport * as S from './ProgressBar.styled';\n\ntype ProgressBarOwnProps = {\n totalAssets: number;\n completedAssets: number;\n percentageText?: string;\n barColor?: string;\n height?: number;\n label?: string;\n type?: string;\n linkText?: string;\n onClick?: (...args: any[]) => any;\n};\n\n// Props spread onto styled component; use Omit+intersection to widen, not narrow, colliding props.\ntype Props = Omit<React.ComponentPropsWithoutRef<typeof S.Container>, keyof ProgressBarOwnProps> &\n ProgressBarOwnProps;\n\n/*\n ProgressBar that let you progress through a task.\n \n \n * ### Import\n \n ``` js\n * import { ProgressBar } from '@ntbjs/react-components/widgets/ProgressBar'\n * // or\n * import ProgressBar from '@ntbjs/react-components/widgets/ProgressBar'\n * ```\n \n \n /\n\nconst ProgressBar = ({\n totalAssets,\n completedAssets,\n percentageText,\n barColor,\n height,\n label,\n type,\n linkText,\n onClick,\n ...props\n}: Props) => {\n const [isLinkHovered, setIsLinkHovered] = useState(false);\n\n const safeCompletedAssets = Math.max(0, completedAssets);\n const safeTotalAssets = Math.max(1, totalAssets);\n const percentage = (safeCompletedAssets / safeTotalAssets) 100;\n const formattedPercentage = `${Math.round(percentage)}%`;\n\n const isLowPercentage = percentage <= 5;\n\n const handleLinkClick = e => onClick(e);\n\n const formatNumberNew = num => {\n if (num < 1000000) {\n return num.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ' ');\n } else {\n const units = ['K', 'M', 'B', 'T'];\n const unit = Math.floor((num.toString().length - 1) / 3) - 1;\n const shortNum = num / Math.pow(1000, unit + 1);\n return shortNum.toFixed(shortNum < 10 ? 1 : 0) + units[unit];\n }\n };\n\n return (\n <S.Container height={height} {...props}>\n <S.Label>{label}</S.Label>\n <S.InnerContainer type={type}>\n <S.Completed type={type}>{formatNumberNew(completedAssets)}</S.Completed>\n <S.ProgressBarTrack>\n <S.MetricsContainer $hasLink={Boolean(linkText)}>\n <S.ProgressBarFill type={type} $percentage={percentage} barColor={barColor}>\n {!isLowPercentage && (\n // `$hasLink` removed; PercentageIndicator never reads it.\n <S.PercentageIndicator>\n {percentageText \|\| formattedPercentage}\n </S.PercentageIndicator>\n )}\n </S.ProgressBarFill>\n {isLowPercentage && (\n <S.ExternalPercentageIndicator>\n {percentageText \|\| formattedPercentage}\n </S.ExternalPercentageIndicator>\n )}\n </S.MetricsContainer>\n {linkText && (\n <S.Link\n onClick={handleLinkClick}\n onMouseEnter={() => setIsLinkHovered(true)}\n onMouseLeave={() => setIsLinkHovered(false)}\n >\n <S.ButtonLink $isHovered={isLinkHovered}>{linkText}</S.ButtonLink>\n <S.StyledArrowIcon $isHovered={isLinkHovered} />\n </S.Link>\n )}\n </S.ProgressBarTrack>\n </S.InnerContainer>\n </S.Container>\n );\n};\n\nexport default ProgressBar;\n"],"names":["ProgressBar","totalAssets","completedAssets","percentageText","barColor","height","label","type","linkText","onClick","props","isLinkHovered","setIsLinkHovered","useState","safeCompletedAssets","Math","max","safeTotalAssets","percentage","formattedPercentage","round","isLowPercentage","handleLinkClick","e","formatNumberNew","num","toString","replace","units","unit","floor","length","shortNum","pow","toFixed","_jsxs","S","children","_jsx","$hasLink","Boolean","$percentage","onMouseEnter","onMouseLeave","$isHovered"],"mappings":";;;;AAkCA,MAAMA,WAAW,GAAGA,CAAC;EACnBC,WAAW;EACXC,eAAe;EACfC,cAAc;EACdC,QAAQ;EACRC,MAAM;EACNC,KAAK;EACLC,IAAI;EACJC,QAAQ;EACRC,OAAO;EACP,GAAGC;AACE,CAAC,KAAK;EACX,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC;EAEzD,MAAMC,mBAAmB,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEd,eAAe,CAAC;EACxD,MAAMe,eAAe,GAAGF,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEf,WAAW,CAAC;AAChD,EAAA,MAAMiB,UAAU,GAAIJ,mBAAmB,GAAGG,eAAe,GAAI,GAAG;EAChE,MAAME,mBAAmB,GAAG,CAAA,EAAGJ,IAAI,CAACK,KAAK,CAACF,UAAU,CAAC,CAAA,CAAA,CAAG;AAExD,EAAA,MAAMG,eAAe,GAAGH,UAAU,IAAI,CAAC;AAEvC,EAAA,MAAMI,eAAe,GAAGC,CAAC,IAAId,OAAO,CAACc,CAAC,CAAC;EAEvC,MAAMC,eAAe,GAAGC,GAAG,IAAI;IAC7B,IAAIA,GAAG,GAAG,OAAO,EAAE;MACjB,OAAOA,GAAG,CAACC,QAAQ,EAAE,CAACC,OAAO,CAAC,uBAAuB,EAAE,GAAG,CAAC;AAC7D,IAAA,CAAC,MAAM;MACL,MAAMC,KAAK,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;MAClC,MAAMC,IAAI,GAAGd,IAAI,CAACe,KAAK,CAAC,CAACL,GAAG,CAACC,QAAQ,EAAE,CAACK,MAAM,GAAG,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC;AAC5D,MAAA,MAAMC,QAAQ,GAAGP,GAAG,GAAGV,IAAI,CAACkB,GAAG,CAAC,IAAI,EAAEJ,IAAI,GAAG,CAAC,CAAC;AAC/C,MAAA,OAAOG,QAAQ,CAACE,OAAO,CAACF,QAAQ,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC,GAAGJ,KAAK,CAACC,IAAI,CAAC;AAC9D,IAAA;EACF,CAAC;AAED,EAAA,OACEM,IAAA,CAACC,SAAW,EAAA;AAAC/B,IAAAA,MAAM,EAAEA,MAAO;AAAA,IAAA,GAAKK,KAAK;AAAA2B,IAAAA,QAAA,EAAA,CACpCC,GAAA,CAACF,KAAO,EAAA;AAAAC,MAAAA,QAAA,EAAE/B;AAAK,KAAU,CAAC,EAC1B6B,IAAA,CAACC,cAAgB,EAAA;AAAC7B,MAAAA,IAAI,EAAEA,IAAK;AAAA8B,MAAAA,QAAA,EAAA,CAC3BC,GAAA,CAACF,SAAW,EAAA;AAAC7B,QAAAA,IAAI,EAAEA,IAAK;QAAA8B,QAAA,EAAEb,eAAe,CAACtB,eAAe;AAAC,OAAc,CAAC,EACzEiC,IAAA,CAACC,gBAAkB,EAAA;AAAAC,QAAAA,QAAA,EAAA,CACjBF,IAAA,CAACC,gBAAkB,EAAA;AAACG,UAAAA,QAAQ,EAAEC,OAAO,CAAChC,QAAQ,CAAE;AAAA6B,UAAAA,QAAA,EAAA,CAC9CC,GAAA,CAACF,eAAiB,EAAA;AAAC7B,YAAAA,IAAI,EAAEA,IAAK;AAACkC,YAAAA,WAAW,EAAEvB,UAAW;AAACd,YAAAA,QAAQ,EAAEA,QAAS;YAAAiC,QAAA,EACxE,CAAChB,eAAe,IAEfiB,GAAA,CAACF,mBAAqB,EAAA;cAAAC,QAAA,EACnBlC,cAAc,IAAIgB;aACE;WAER,CAAC,EACnBE,eAAe,IACdiB,GAAA,CAACF,2BAA6B,EAAA;YAAAC,QAAA,EAC3BlC,cAAc,IAAIgB;AAAmB,WACT,CAChC;SACiB,CAAC,EACpBX,QAAQ,IACP2B,IAAA,CAACC,IAAM,EAAA;AACL3B,UAAAA,OAAO,EAAEa,eAAgB;AACzBoB,UAAAA,YAAY,EAAEA,MAAM9B,gBAAgB,CAAC,IAAI,CAAE;AAC3C+B,UAAAA,YAAY,EAAEA,MAAM/B,gBAAgB,CAAC,KAAK,CAAE;AAAAyB,UAAAA,QAAA,EAAA,CAE5CC,GAAA,CAACF,UAAY,EAAA;AAACQ,YAAAA,UAAU,EAAEjC,aAAc;AAAA0B,YAAAA,QAAA,EAAE7B;AAAQ,WAAe,CAAC,EAClE8B,GAAA,CAACF,eAAiB,EAAA;AAACQ,YAAAA,UAAU,EAAEjC;AAAc,WAAE,CAAC;AAAA,SAC1C,CACT;AAAA,OACiB,CAAC;AAAA,KACL,CAAC;AAAA,GACR,CAAC;AAElB;;;;"}

package/build/widgets/ProgressBar/ProgressBar.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ProgressBar.styled.js","sources":["../../../src/components/widgets/ProgressBar/ProgressBar.styled.ts"],"sourcesContent":["/\n $-transient-prop pattern: rules in\n * `src/components/layout/SectionSeparator/SectionSeparator.styled.ts`, derivation and\n * measurements in `scripts/TS-MIGRATION-PLAYBOOK.md` §J.\n \n `getBackgroundColor` below is a module-scope FUNCTION that reads props — the same kind\n * of site as `AssetGalleryGridCard.styled.ts`'s `ringState`, and not one C7 enumerates.\n * Unannotated its parameter is an implicit `any`, and with `noImplicitAny` off that is\n * SILENT: three prop reads and a `getColor()` call stayed unchecked while the file looked\n * converted. Typing it is what surfaced `colorMap` — see the note there.\n /\nimport styled from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\nimport { ArrowForwardIcon } from '../../../icons';\n\nimport type { ColorName, NtbTheme } from '../../../utils/defaultTheme';\n\n/\n `height` — `PropTypes.number`, px, interpolated as `${props.height}px` with a `50px`\n * fallback, so `number` and not `number \| string`.\n \n NO `$`, AND THAT IS A DEFECT THAT IS ALREADY IN THE RENDER BASELINE. `height` is not a\n * member of `HTMLAttributes<HTMLDivElement>` — hence the declaration — but React does\n * recognise it and renders it, so `widgets/ProgressBar` in\n * `scripts/r19-harness/baseline.json` opens with `<div height=\"50\" class=\"…\">`. Renaming\n * it `$height` removes that attribute and MOVES the baseline — C10, §E.4.\n /\ninterface ProgressBarContainerStyleProps {\n height?: number;\n}\n\n/\n `$hasLink` — `Boolean(linkText)`, so genuinely boolean and not `linkText`'s `string`.\n \n Declared for `MetricsContainer` only. `ProgressBar.tsx` also passes `$hasLink` to\n * `PercentageIndicator`, WHICH NEVER READS IT — so per rule 2 (declare only what is\n * actually consumed) that component gets no generic, and the pass is recorded here as the\n * dead prop it is. It is transient, so it does not reach the DOM either way.\n /\ninterface ProgressBarMetricsStyleProps {\n $hasLink?: boolean;\n}\n\n/* `ProgressBarFill`, the one component here whose props are read from two places. /\ninterface ProgressBarFillStyleProps {\n /\n `type` — `PropTypes.string`, selecting a row of `colorMap`. Left as `string` rather\n * than narrowed to the five `colorMap` keys, because `string` is what the published\n * propTypes say; narrowing it here would invent a contract the component does not have\n * (§E.1 rule 2). The `\|\| colorMap.default` fallback is what makes that safe.\n \n NO `$`, AND THAT IS A DEFECT ALREADY IN THE RENDER BASELINE — but on OTHER components.\n * `ProgressBar.tsx` passes `type` to `InnerContainer`, `Completed` and `ProgressBarFill`\n * alike; the first two never read it, and a string-valued `type` renders on a `<div>`,\n * so `widgets/ProgressBar` records `<div type=\"success\">` twice. Renaming it removes\n * those attributes — C10, §E.4.\n /\n type?: string;\n /* `barColor` — `PropTypes.string`, a whole CSS colour that short-circuits `colorMap`\n * entirely. NO `$` either, and it is unread by any other component, so it leaks only\n * from this one and only when a consumer passes it — no fixture does. /\n barColor?: string;\n /* `(completedAssets / totalAssets) * 100`, interpolated as `${props.$percentage}%`, so\n * `number`. Not rounded — the rounding is only for the label text. /\n $percentage?: number;\n}\n\n/\n `$isHovered` — the `Link`'s hover state from `ProgressBar.tsx`'s `useState`, so\n * genuinely `boolean`. Like `InfoCard`'s, it is `false` in every static render, so the\n * rule blocks it guards are unreachable from the render gate.\n \n Hosts: `ButtonLink` and `StyledArrowIcon`.\n /\ninterface ProgressBarHoverStyleProps {\n $isHovered?: boolean;\n}\n\n/\n * Single-argument, and it stays that way — peer floor `styled-components: >=5.1.0`, and\n * the two majors disagree on the second parameter. §J.4. `prop` needs the annotation\n * because `withConfig` takes this by reference, so it gets no contextual typing.\n /\nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\nconst getBackgroundColor = (\n props: Pick<ProgressBarFillStyleProps, 'type' \| 'barColor'> & { theme: NtbTheme }\n) => {\n if (props.barColor) {\n return `background: ${props.barColor};`;\n }\n /\n * ANNOTATED, AND THE ANNOTATION IS THE POINT. `getColor` takes the closed `ColorName`\n * union and THROWS at runtime for anything else, so without this type the ten colour\n * names below were unchecked strings feeding a function that throws — a typo here would\n * have been a runtime error inside a styled template. All ten were verified against\n * `src/styles/utils/colors-export.js` by making the compiler check them.\n \n `Record<string, …>` rather than a closed key union because `props.type` is\n * `PropTypes.string`; the index signature is what lets a caller pass an unknown type and\n * fall through to `colorMap.default`, which is the existing behaviour.\n */\n const colorMap: Record<string, [ColorName, ColorName]> = {\n success: ['emerald-600', 'emerald-300'],\n error: ['red-600', 'cercise-200'],\n warning: ['orange-600', 'orange-400'],\n none: ['gray-500', 'gray-300'],\n default: ['emerald-600', 'emerald-500']\n };\n\n const [darkColor, lightColor] = colorMap[props.type] \|\| colorMap.default;\n\n return props.theme.themeProp(\n 'background',\n props.theme.getColor(darkColor),\n props.theme.getColor(lightColor)\n );\n};\n\nexport const ProgressBar = styled.p\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-family: ${props => props.theme.primaryFontFamily};\n font-size: 1rem;\n font-weight: 500;\n`;\n\nexport const Container = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<ProgressBarContainerStyleProps>(applyDefaultTheme)`\n width: 100%;\n height: ${props => (props.height ? `${props.height}px` : '50px')};\n font-family: ${props => props.theme.primaryFontFamily};\n`;\n\nexport const InnerContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n height: 100%;\n`;\n\nexport const MetricsContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<ProgressBarMetricsStyleProps>(applyDefaultTheme)`\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: ${props => (props.$hasLink ? '85%' : '100%')};\n height: 100%;\n flex-direction: row;\n justify-content: flex-start;\n`;\n\nexport const Label = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 0.875rem;\n padding-bottom: 5px;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-700')\n )}\n`;\n\nexport const Percentage = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 500;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-700')\n )}\n`;\n\nexport const ProgressBarTrack = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: flex-start;\n align-items: center;\n border-radius: 3px;\n height: 100%;\n ${props =>\n props.theme.themeProp(\n 'background',\n props.theme.getColor('gray-800'),\n props.theme.getColor('gray-50')\n )}\n`;\n\nexport const Completed = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 1.2rem;\n font-weight: 400;\n height: 100%;\n border-radius: 3px;\n display: flex;\n align-items: center;\n width: 96px;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-800')\n )};\n`;\nexport const PercentageIndicator = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n position: absolute;\n right: 10px;\n font-weight: 400;\n font-size: 0.875rem;\n white-space: nowrap;\n opacity: 0.8;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-300'),\n props.theme.getColor('gray-500')\n )};\n`;\n\nexport const ExternalPercentageIndicator = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n margin-left: 8px;\n font-size: 1.2rem;\n font-weight: 400;\n font-size: 0.875rem;\n opacity: 0.9;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-300'),\n props.theme.getColor('gray-500')\n )};\n display: flex;\n align-items: center;\n`;\n\nexport const ProgressBarFill = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<ProgressBarFillStyleProps>(applyDefaultTheme)`\n height: 100%;\n border-radius: 0 3px 3px 0;\n width: ${props => props.$percentage}%;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n ${props => getBackgroundColor(props)}\n transition: width 0.3s ease;\n`;\n\nexport const Link = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 400;\n width: 15%;\n opacity: 0.7;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n margin-right: 20px;\n cursor: pointer;\n height: 100%;\n gap: 10px;\n svg {\n transition: transform 0.2s ease-in-out;\n }\n &:hover svg {\n transform: translateX(2px);\n }\n`;\n\nexport const ButtonLink = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<ProgressBarHoverStyleProps>(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 500;\n height: 100%;\n display: flex;\n align-items: center;\n opacity: ${props => (props.$isHovered ? 1 : 0.8)};\n transition: color 0.2s ease-in-out;\n ${props =>\n props.$isHovered\n ? props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))\n : props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-900')\n )};\n`;\n\nexport const StyledArrowIcon = styled(ArrowForwardIcon)\n .withConfig({\n shouldForwardProp\n })\n .attrs<ProgressBarHoverStyleProps>(applyDefaultTheme)`\n height: 15px;\n margin-right: 10px;\n opacity: ${props => (props.$isHovered ? 1 : 0.8)};\n transition:\n transform 0.2s ease-in-out,\n fill 0.2s ease-in-out;\n transform: ${props => (props.$isHovered ? 'translateX(2px)' : 'translateX(0)')};\n\n ${props =>\n props.$isHovered\n ? props.theme.themeProp('fill', props.theme.getColor('white'), props.theme.getColor('black'))\n : props.theme.themeProp(\n 'fill',\n props.theme.getColor('white'),\n props.theme.getColor('black')\n )};\n`;\n"],"names":["shouldForwardProp","prop","startsWith","getBackgroundColor","props","barColor","colorMap","success","error","warning","none","default","darkColor","lightColor","type","theme","themeProp","getColor","styled","p","withConfig","attrs","applyDefaultTheme","displayName","componentId","primaryFontFamily","Container","div","height","InnerContainer","MetricsContainer","$hasLink","Label","ProgressBarTrack","Completed","PercentageIndicator","ExternalPercentageIndicator","ProgressBarFill","$percentage","Link","ButtonLink","$isHovered","StyledArrowIcon","ArrowForwardIcon"],"mappings":"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"}
1	+ {"version":3,"file":"ProgressBar.styled.js","sources":["../../../src/components/widgets/ProgressBar/ProgressBar.styled.ts"],"sourcesContent":["// `getBackgroundColor` function parameter needs type annotation to catch typos in color names.\nimport styled from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\nimport { ArrowForwardIcon } from '../../../icons';\n\nimport type { ColorName, NtbTheme } from '../../../utils/defaultTheme';\n\ninterface ProgressBarContainerStyleProps {\n /** `height` — px, so `number`. No `$` but defect in baseline. /\n height?: number;\n}\n\ninterface ProgressBarMetricsStyleProps {\n /* `$hasLink` — declared for MetricsContainer only; PercentageIndicator never reads it. /\n $hasLink?: boolean;\n}\n\ninterface ProgressBarFillStyleProps {\n /* `type` — left as `string` to match propTypes contract; has `colorMap.default` fallback. /\n type?: string;\n /* `barColor` — whole CSS colour that short-circuits `colorMap`. /\n barColor?: string;\n /* `(completedAssets / totalAssets) * 100`, interpolated as `%`. /\n $percentage?: number;\n}\n\ninterface ProgressBarHoverStyleProps {\n /* `$isHovered` — hover state from `useState`. Hosts: `ButtonLink` and `StyledArrowIcon`. */\n $isHovered?: boolean;\n}\n\n// Single-argument only — v5.1 and v6 differ on second parameter.\nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\nconst getBackgroundColor = (\n props: Pick<ProgressBarFillStyleProps, 'type' \| 'barColor'> & { theme: NtbTheme }\n) => {\n if (props.barColor) {\n return `background: ${props.barColor};`;\n }\n // `ColorName` type here catches color name typos at compile time.\n const colorMap: Record<string, [ColorName, ColorName]> = {\n success: ['emerald-600', 'emerald-300'],\n error: ['red-600', 'cercise-200'],\n warning: ['orange-600', 'orange-400'],\n none: ['gray-500', 'gray-300'],\n default: ['emerald-600', 'emerald-500']\n };\n\n const [darkColor, lightColor] = colorMap[props.type] \|\| colorMap.default;\n\n return props.theme.themeProp(\n 'background',\n props.theme.getColor(darkColor),\n props.theme.getColor(lightColor)\n );\n};\n\nexport const ProgressBar = styled.p\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-family: ${props => props.theme.primaryFontFamily};\n font-size: 1rem;\n font-weight: 500;\n`;\n\nexport const Container = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<ProgressBarContainerStyleProps>(applyDefaultTheme)`\n width: 100%;\n height: ${props => (props.height ? `${props.height}px` : '50px')};\n font-family: ${props => props.theme.primaryFontFamily};\n`;\n\nexport const InnerContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n height: 100%;\n`;\n\nexport const MetricsContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<ProgressBarMetricsStyleProps>(applyDefaultTheme)`\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: ${props => (props.$hasLink ? '85%' : '100%')};\n height: 100%;\n flex-direction: row;\n justify-content: flex-start;\n`;\n\nexport const Label = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 0.875rem;\n padding-bottom: 5px;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-700')\n )}\n`;\n\nexport const Percentage = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 500;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-700')\n )}\n`;\n\nexport const ProgressBarTrack = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: flex-start;\n align-items: center;\n border-radius: 3px;\n height: 100%;\n ${props =>\n props.theme.themeProp(\n 'background',\n props.theme.getColor('gray-800'),\n props.theme.getColor('gray-50')\n )}\n`;\n\nexport const Completed = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 1.2rem;\n font-weight: 400;\n height: 100%;\n border-radius: 3px;\n display: flex;\n align-items: center;\n width: 96px;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-800')\n )};\n`;\nexport const PercentageIndicator = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n position: absolute;\n right: 10px;\n font-weight: 400;\n font-size: 0.875rem;\n white-space: nowrap;\n opacity: 0.8;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-300'),\n props.theme.getColor('gray-500')\n )};\n`;\n\nexport const ExternalPercentageIndicator = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n margin-left: 8px;\n font-size: 1.2rem;\n font-weight: 400;\n font-size: 0.875rem;\n opacity: 0.9;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-300'),\n props.theme.getColor('gray-500')\n )};\n display: flex;\n align-items: center;\n`;\n\nexport const ProgressBarFill = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<ProgressBarFillStyleProps>(applyDefaultTheme)`\n height: 100%;\n border-radius: 0 3px 3px 0;\n width: ${props => props.$percentage}%;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n ${props => getBackgroundColor(props)}\n transition: width 0.3s ease;\n`;\n\nexport const Link = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 400;\n width: 15%;\n opacity: 0.7;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n margin-right: 20px;\n cursor: pointer;\n height: 100%;\n gap: 10px;\n svg {\n transition: transform 0.2s ease-in-out;\n }\n &:hover svg {\n transform: translateX(2px);\n }\n`;\n\nexport const ButtonLink = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<ProgressBarHoverStyleProps>(applyDefaultTheme)`\n font-size: 0.875rem;\n font-weight: 500;\n height: 100%;\n display: flex;\n align-items: center;\n opacity: ${props => (props.$isHovered ? 1 : 0.8)};\n transition: color 0.2s ease-in-out;\n ${props =>\n props.$isHovered\n ? props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))\n : props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-900')\n )};\n`;\n\nexport const StyledArrowIcon = styled(ArrowForwardIcon)\n .withConfig({\n shouldForwardProp\n })\n .attrs<ProgressBarHoverStyleProps>(applyDefaultTheme)`\n height: 15px;\n margin-right: 10px;\n opacity: ${props => (props.$isHovered ? 1 : 0.8)};\n transition:\n transform 0.2s ease-in-out,\n fill 0.2s ease-in-out;\n transform: ${props => (props.$isHovered ? 'translateX(2px)' : 'translateX(0)')};\n\n ${props =>\n props.$isHovered\n ? props.theme.themeProp('fill', props.theme.getColor('white'), props.theme.getColor('black'))\n : props.theme.themeProp(\n 'fill',\n props.theme.getColor('white'),\n props.theme.getColor('black')\n )};\n`;\n"],"names":["shouldForwardProp","prop","startsWith","getBackgroundColor","props","barColor","colorMap","success","error","warning","none","default","darkColor","lightColor","type","theme","themeProp","getColor","styled","p","withConfig","attrs","applyDefaultTheme","displayName","componentId","primaryFontFamily","Container","div","height","InnerContainer","MetricsContainer","$hasLink","Label","ProgressBarTrack","Completed","PercentageIndicator","ExternalPercentageIndicator","ProgressBarFill","$percentage","Link","ButtonLink","$isHovered","StyledArrowIcon","ArrowForwardIcon"],"mappings":"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"}

package/build/widgets/SummaryCard/SummaryCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SummaryCard.js","sources":["../../../src/components/widgets/SummaryCard/SummaryCard.tsx"],"sourcesContent":["import React from 'react';\nimport InstructionSeverityDisplay from '../InstructionSeverityDisplay';\nimport * as S from './SummaryCard.styled';\n\ntype AssetSummaryCardOwnProps = {\n /*\n Wether the SummaryCard is active or not.\n /\n activeSummaryCard?: boolean;\n /\n Title of the content\n /\n title?: string;\n /\n Description of the content\n /\n description?: string;\n /\n Special instructions for the content\n /\n instructions?: string;\n /\n Type of instructions\n /\n instructionSeverity?: 1 \| 2 \| 3 \| 4 \| 5;\n /\n One or more children to render in the left half of the header\n /\n headerLeft?: React.ReactNode;\n /\n One or more children to render in the right half of the header\n /\n headerRight?: React.ReactNode;\n /\n One or more children to render in the left half of the footer\n /\n footerLeft?: React.ReactNode;\n /\n One or more children to render in the right half of the footer\n /\n footerRight?: React.ReactNode;\n /\n Width of the card\n /\n width?: number;\n /\n Whether or not to use a border around the card\n /\n useBorder?: boolean;\n /\n Whether or not the Summary Card is within the CompactCard view or Grid view\n /\n view?: string;\n /\n Translated labels object for instruction(Info,Limited Use etc)\n /\n instructionLabels?: {\n [key: string]: string;\n };\n};\n\n~~/\n~~ * ~~NMB-3998~~ ~~§C.2:~~ ~~`props` is spread onto `S.SummaryCard`, so the published type\n * has to admit that target's props too~~ — a ~~closed type here is worse than `any` for the\n * 125 consumer files. Declared members win over the base (`Omit` by `keyof AssetSummaryCardOwnProps`);\n * a~~ bare ~~`&`~~ ~~would~~ ~~INTERSECT a~~ colliding ~~member~~ instead of overriding ~~it, which narrows\n * it (measured: `rows?: number \| string` & `rows?: number`) or empties it to `never`.\n /\~~ntype Props = Omit<\n React.ComponentPropsWithoutRef<typeof S.SummaryCard>,\n keyof AssetSummaryCardOwnProps\n> &\n AssetSummaryCardOwnProps;\n\n/\n ### Import\n \n ``` js\n * import { SummaryCard } from '@ntbjs/react-components/widgets'\n * // or\n * import SummaryCard from '@ntbjs/react-components/widgets/SummaryCard'\n * ```\n \n ### Props\n * ```\n * Pass `title=\"Title\"` to set the title of the card.\n * Pass `description=\"Description\"` to set the description of the card.\n * Pass `instructions=\"Instructions\"` to set the instructions of the card.\n * Pass 1-5 to `instructionSeverity` to reflect the severity of the instructions.\n * Pass `headerLeft={<div>Left</div>}` to set the left header of the card.\n * Pass `headerRight={<div>Right</div>}` to set the right header of the card.\n * Pass `footerLeft={<div>Left</div>}` to set the left footer of the card.\n * Pass `footerRight={<div>Right</div>}` to set the right footer of the card.\n * Pass `width={300}` to set the width of the card.\n * Pass `useBorder={true}` to set the border of the card.\n * ```\n */\n\nconst SummaryCard = React.forwardRef<any, Props>(function AssetSummaryCard(\n {\n activeSummaryCard = false,\n title = '',\n description = '',\n instructions = '',\n instructionSeverity = 1,\n headerLeft = null,\n headerRight = null,\n footerLeft = null,\n footerRight = null,\n width,\n useBorder = false,\n view,\n instructionLabels,\n ...props\n },\n forwardedRef\n) {\n const shouldRenderInstructions = !!instructions;\n const shouldRenderHeader = !!headerLeft \|\| !!headerRight;\n const shouldRenderFooter = !!footerLeft \|\| !!footerRight;\n const shouldAddGutterAfterInstructions = shouldRenderInstructions && shouldRenderFooter;\n const shouldAddGutterAfterTitle =\n !!title && (!!description \|\| !!instructions \|\| shouldRenderFooter);\n\n if (!activeSummaryCard) return null;\n\n const filteredProps = Object.fromEntries(\n Object.entries(props).filter(([key]) => key !== 'compact')\n );\n\n return (\n <S.SummaryCard\n ref={forwardedRef}\n width={width}\n $useBorder={useBorder}\n {...filteredProps}\n view={view}\n >\n {shouldRenderHeader && (\n <>\n <S.Gutter $gutter={8} />\n <S.Header>\n <S.HeaderLeft>{headerLeft}</S.HeaderLeft>\n <S.HeaderRight>{headerRight}</S.HeaderRight>\n </S.Header>\n </>\n )}\n <S.Gutter $gutter={shouldRenderHeader ? 8 : 16} />\n {title && <S.Title>{title}</S.Title>}\n {shouldAddGutterAfterTitle && <S.Gutter $gutter={4} />}\n {description && <S.Description>{description}</S.Description>}\n <S.Gutter $gutter={16} />\n\n {shouldRenderInstructions && (\n <InstructionSeverityDisplay\n labels={instructionLabels}\n instructionText={instructions}\n severity={instructionSeverity}\n showCard={false}\n padding={`14px 17px`}\n detailsFontSize={`12px`}\n maxLines={view === 'grid' ? 3 : undefined}\n />\n )}\n {shouldAddGutterAfterInstructions && <S.Gutter $gutter={16} />}\n {shouldRenderFooter && (\n <S.Footer>\n <S.FooterLeft>{footerLeft}</S.FooterLeft>\n <S.FooterRight>{footerRight}</S.FooterRight>\n </S.Footer>\n )}\n {shouldRenderFooter && <S.Gutter $gutter={16} />}\n </S.SummaryCard>\n );\n});\n\nexport default SummaryCard;\n"],"names":["SummaryCard","React","forwardRef","AssetSummaryCard","activeSummaryCard","title","description","instructions","instructionSeverity","headerLeft","headerRight","footerLeft","footerRight","width","useBorder","view","instructionLabels","props","forwardedRef","shouldRenderInstructions","shouldRenderHeader","shouldRenderFooter","shouldAddGutterAfterInstructions","shouldAddGutterAfterTitle","filteredProps","Object","fromEntries","entries","filter","key","_jsxs","S","ref","$useBorder","children","_Fragment","_jsx","$gutter","InstructionSeverityDisplay","labels","instructionText","severity","showCard","padding","detailsFontSize","maxLines","undefined"],"mappings":";;;;;~~AAkGA~~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"}
1	+ {"version":3,"file":"SummaryCard.js","sources":["../../../src/components/widgets/SummaryCard/SummaryCard.tsx"],"sourcesContent":["import React from 'react';\nimport InstructionSeverityDisplay from '../InstructionSeverityDisplay';\nimport * as S from './SummaryCard.styled';\n\ntype AssetSummaryCardOwnProps = {\n /*\n Wether the SummaryCard is active or not.\n /\n activeSummaryCard?: boolean;\n /\n Title of the content\n /\n title?: string;\n /\n Description of the content\n /\n description?: string;\n /\n Special instructions for the content\n /\n instructions?: string;\n /\n Type of instructions\n /\n instructionSeverity?: 1 \| 2 \| 3 \| 4 \| 5;\n /\n One or more children to render in the left half of the header\n /\n headerLeft?: React.ReactNode;\n /\n One or more children to render in the right half of the header\n /\n headerRight?: React.ReactNode;\n /\n One or more children to render in the left half of the footer\n /\n footerLeft?: React.ReactNode;\n /\n One or more children to render in the right half of the footer\n /\n footerRight?: React.ReactNode;\n /\n Width of the card\n /\n width?: number;\n /\n Whether or not to use a border around the card\n /\n useBorder?: boolean;\n /\n Whether or not the Summary Card is within the CompactCard view or Grid view\n /\n view?: string;\n /\n Translated labels object for instruction(Info,Limited Use etc)\n /\n instructionLabels?: {\n [key: string]: string;\n };\n};\n\n// Omit before & — a bare intersection narrows colliding props instead of overriding them.\ntype Props = Omit<\n React.ComponentPropsWithoutRef<typeof S.SummaryCard>,\n keyof AssetSummaryCardOwnProps\n> &\n AssetSummaryCardOwnProps;\n\n/\n ### Import\n \n ``` js\n * import { SummaryCard } from '@ntbjs/react-components/widgets'\n * // or\n * import SummaryCard from '@ntbjs/react-components/widgets/SummaryCard'\n * ```\n \n ### Props\n * ```\n * Pass `title=\"Title\"` to set the title of the card.\n * Pass `description=\"Description\"` to set the description of the card.\n * Pass `instructions=\"Instructions\"` to set the instructions of the card.\n * Pass 1-5 to `instructionSeverity` to reflect the severity of the instructions.\n * Pass `headerLeft={<div>Left</div>}` to set the left header of the card.\n * Pass `headerRight={<div>Right</div>}` to set the right header of the card.\n * Pass `footerLeft={<div>Left</div>}` to set the left footer of the card.\n * Pass `footerRight={<div>Right</div>}` to set the right footer of the card.\n * Pass `width={300}` to set the width of the card.\n * Pass `useBorder={true}` to set the border of the card.\n * ```\n */\n\nconst SummaryCard = React.forwardRef<any, Props>(function AssetSummaryCard(\n {\n activeSummaryCard = false,\n title = '',\n description = '',\n instructions = '',\n instructionSeverity = 1,\n headerLeft = null,\n headerRight = null,\n footerLeft = null,\n footerRight = null,\n width,\n useBorder = false,\n view,\n instructionLabels,\n ...props\n },\n forwardedRef\n) {\n const shouldRenderInstructions = !!instructions;\n const shouldRenderHeader = !!headerLeft \|\| !!headerRight;\n const shouldRenderFooter = !!footerLeft \|\| !!footerRight;\n const shouldAddGutterAfterInstructions = shouldRenderInstructions && shouldRenderFooter;\n const shouldAddGutterAfterTitle =\n !!title && (!!description \|\| !!instructions \|\| shouldRenderFooter);\n\n if (!activeSummaryCard) return null;\n\n const filteredProps = Object.fromEntries(\n Object.entries(props).filter(([key]) => key !== 'compact')\n );\n\n return (\n <S.SummaryCard\n ref={forwardedRef}\n width={width}\n $useBorder={useBorder}\n {...filteredProps}\n view={view}\n >\n {shouldRenderHeader && (\n <>\n <S.Gutter $gutter={8} />\n <S.Header>\n <S.HeaderLeft>{headerLeft}</S.HeaderLeft>\n <S.HeaderRight>{headerRight}</S.HeaderRight>\n </S.Header>\n </>\n )}\n <S.Gutter $gutter={shouldRenderHeader ? 8 : 16} />\n {title && <S.Title>{title}</S.Title>}\n {shouldAddGutterAfterTitle && <S.Gutter $gutter={4} />}\n {description && <S.Description>{description}</S.Description>}\n <S.Gutter $gutter={16} />\n\n {shouldRenderInstructions && (\n <InstructionSeverityDisplay\n labels={instructionLabels}\n instructionText={instructions}\n severity={instructionSeverity}\n showCard={false}\n padding={`14px 17px`}\n detailsFontSize={`12px`}\n maxLines={view === 'grid' ? 3 : undefined}\n />\n )}\n {shouldAddGutterAfterInstructions && <S.Gutter $gutter={16} />}\n {shouldRenderFooter && (\n <S.Footer>\n <S.FooterLeft>{footerLeft}</S.FooterLeft>\n <S.FooterRight>{footerRight}</S.FooterRight>\n </S.Footer>\n )}\n {shouldRenderFooter && <S.Gutter $gutter={16} />}\n </S.SummaryCard>\n );\n});\n\nexport default SummaryCard;\n"],"names":["SummaryCard","React","forwardRef","AssetSummaryCard","activeSummaryCard","title","description","instructions","instructionSeverity","headerLeft","headerRight","footerLeft","footerRight","width","useBorder","view","instructionLabels","props","forwardedRef","shouldRenderInstructions","shouldRenderHeader","shouldRenderFooter","shouldAddGutterAfterInstructions","shouldAddGutterAfterTitle","filteredProps","Object","fromEntries","entries","filter","key","_jsxs","S","ref","$useBorder","children","_Fragment","_jsx","$gutter","InstructionSeverityDisplay","labels","instructionText","severity","showCard","padding","detailsFontSize","maxLines","undefined"],"mappings":";;;;;AA4FA,MAAMA,WAAW,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASC,gBAAgBA,CACxE;AACEC,EAAAA,iBAAiB,GAAG,KAAK;AACzBC,EAAAA,KAAK,GAAG,EAAE;AACVC,EAAAA,WAAW,GAAG,EAAE;AAChBC,EAAAA,YAAY,GAAG,EAAE;AACjBC,EAAAA,mBAAmB,GAAG,CAAC;AACvBC,EAAAA,UAAU,GAAG,IAAI;AACjBC,EAAAA,WAAW,GAAG,IAAI;AAClBC,EAAAA,UAAU,GAAG,IAAI;AACjBC,EAAAA,WAAW,GAAG,IAAI;EAClBC,KAAK;AACLC,EAAAA,SAAS,GAAG,KAAK;EACjBC,IAAI;EACJC,iBAAiB;EACjB,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;AACA,EAAA,MAAMC,wBAAwB,GAAG,CAAC,CAACZ,YAAY;EAC/C,MAAMa,kBAAkB,GAAG,CAAC,CAACX,UAAU,IAAI,CAAC,CAACC,WAAW;EACxD,MAAMW,kBAAkB,GAAG,CAAC,CAACV,UAAU,IAAI,CAAC,CAACC,WAAW;AACxD,EAAA,MAAMU,gCAAgC,GAAGH,wBAAwB,IAAIE,kBAAkB;AACvF,EAAA,MAAME,yBAAyB,GAC7B,CAAC,CAAClB,KAAK,KAAK,CAAC,CAACC,WAAW,IAAI,CAAC,CAACC,YAAY,IAAIc,kBAAkB,CAAC;AAEpE,EAAA,IAAI,CAACjB,iBAAiB,EAAE,OAAO,IAAI;EAEnC,MAAMoB,aAAa,GAAGC,MAAM,CAACC,WAAW,CACtCD,MAAM,CAACE,OAAO,CAACV,KAAK,CAAC,CAACW,MAAM,CAAC,CAAC,CAACC,GAAG,CAAC,KAAKA,GAAG,KAAK,SAAS,CAC3D,CAAC;AAED,EAAA,OACEC,IAAA,CAACC,aAAa,EAAA;AACZC,IAAAA,GAAG,EAAEd,YAAa;AAClBL,IAAAA,KAAK,EAAEA,KAAM;AACboB,IAAAA,UAAU,EAAEnB,SAAU;AAAA,IAAA,GAClBU,aAAa;AACjBT,IAAAA,IAAI,EAAEA,IAAK;AAAAmB,IAAAA,QAAA,EAAA,CAEVd,kBAAkB,IACjBU,IAAA,CAAAK,QAAA,EAAA;AAAAD,MAAAA,QAAA,EAAA,CACEE,GAAA,CAACL,MAAQ,EAAA;AAACM,QAAAA,OAAO,EAAE;AAAE,OAAE,CAAC,EACxBP,IAAA,CAACC,MAAQ,EAAA;AAAAG,QAAAA,QAAA,EAAA,CACPE,GAAA,CAACL,UAAY,EAAA;AAAAG,UAAAA,QAAA,EAAEzB;AAAU,SAAe,CAAC,EACzC2B,GAAA,CAACL,WAAa,EAAA;AAAAG,UAAAA,QAAA,EAAExB;AAAW,SAAgB,CAAC;AAAA,OACpC,CAAC;AAAA,KACX,CACH,EACD0B,GAAA,CAACL,MAAQ,EAAA;AAACM,MAAAA,OAAO,EAAEjB,kBAAkB,GAAG,CAAC,GAAG;KAAK,CAAC,EACjDf,KAAK,IAAI+B,GAAA,CAACL,KAAO,EAAA;AAAAG,MAAAA,QAAA,EAAE7B;KAAe,CAAC,EACnCkB,yBAAyB,IAAIa,GAAA,CAACL,MAAQ,EAAA;AAACM,MAAAA,OAAO,EAAE;KAAI,CAAC,EACrD/B,WAAW,IAAI8B,GAAA,CAACL,WAAa,EAAA;AAAAG,MAAAA,QAAA,EAAE5B;AAAW,KAAgB,CAAC,EAC5D8B,GAAA,CAACL,MAAQ,EAAA;AAACM,MAAAA,OAAO,EAAE;AAAG,KAAE,CAAC,EAExBlB,wBAAwB,IACvBiB,GAAA,CAACE,0BAA0B,EAAA;AACzBC,MAAAA,MAAM,EAAEvB,iBAAkB;AAC1BwB,MAAAA,eAAe,EAAEjC,YAAa;AAC9BkC,MAAAA,QAAQ,EAAEjC,mBAAoB;AAC9BkC,MAAAA,QAAQ,EAAE,KAAM;AAChBC,MAAAA,OAAO,EAAE,CAAA,SAAA,CAAY;AACrBC,MAAAA,eAAe,EAAE,CAAA,IAAA,CAAO;AACxBC,MAAAA,QAAQ,EAAE9B,IAAI,KAAK,MAAM,GAAG,CAAC,GAAG+B;KACjC,CACF,EACAxB,gCAAgC,IAAIc,GAAA,CAACL,MAAQ,EAAA;AAACM,MAAAA,OAAO,EAAE;KAAK,CAAC,EAC7DhB,kBAAkB,IACjBS,IAAA,CAACC,MAAQ,EAAA;AAAAG,MAAAA,QAAA,EAAA,CACPE,GAAA,CAACL,UAAY,EAAA;AAAAG,QAAAA,QAAA,EAAEvB;AAAU,OAAe,CAAC,EACzCyB,GAAA,CAACL,WAAa,EAAA;AAAAG,QAAAA,QAAA,EAAEtB;AAAW,OAAgB,CAAC;KACpC,CACX,EACAS,kBAAkB,IAAIe,GAAA,CAACL,MAAQ,EAAA;AAACM,MAAAA,OAAO,EAAE;AAAG,KAAE,CAAC;AAAA,GACnC,CAAC;AAEpB,CAAC;;;;"}

package/build/widgets/SummaryCard/SummaryCard.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SummaryCard.styled.js","sources":["../../../src/components/widgets/SummaryCard/SummaryCard.styled.ts"],"sourcesContent":["/\n $-transient-prop pattern: rules in\n * `src/components/layout/SectionSeparator/SectionSeparator.styled.ts`, derivation and\n * measurements in `scripts/TS-MIGRATION-PLAYBOOK.md` §J.\n /\nimport styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\nimport { FloatingArrow } from '@floating-ui/react';\n\n/* The card root, i.e. what `SummaryCard.tsx` passes to `<S.SummaryCard>`. /\nexport interface SummaryCardStyleProps {\n /\n `view` — `PropTypes.string`. The template tests `=== 'compact'` twice and treats every\n * other value as the grid view. Left as `string` rather than narrowed to\n * `'compact' \| 'grid'`: that is what the published propTypes say, and narrowing it here\n * would invent a contract the component does not have (§E.1 rule 2). Note the asymmetry\n * with `AssetGalleryCompactCard`'s `type`, which IS narrowed — there the propTypes\n * really do declare a closed set.\n \n NO `$`, AND THAT IS A DEFECT ALREADY IN THE RENDER BASELINE. A string-valued `view`\n * renders on a `<div>`, so `widgets/SummaryCard` records `<div width=\"300\" view=\"grid\">`\n * and its `#compact` variant records `view=\"compact\"`. Renaming it removes that\n * attribute and MOVES the baseline — C10, §E.4.\n /\n view?: string;\n /\n `width` — `PropTypes.number`, px, interpolated as `${props.width}px` with a `100%`\n * fallback, so `number` and not `number \| string`.\n \n NO `$`, AND ALSO ALREADY IN THE BASELINE: `<div width=\"300\" …>` on the same element.\n * `width` is not a member of `HTMLAttributes<HTMLDivElement>` — hence the declaration —\n * but React recognises and renders it. C10, §E.4.\n /\n width?: number;\n /* `useBorder` — `PropTypes.bool`; the component defaults it to `false`, which is not a\n * default HERE (nothing but `theme` is injected by `applyDefaultTheme`), so it stays\n * optional per §J.5. /\n $useBorder?: boolean;\n}\n\n/\n `Gutter`, the spacer component. `SummaryCard.tsx` renders it seven times and passes\n * `$gutter` every time.\n /\ninterface SummaryCardGutterStyleProps {\n /* `$gutter` — px, always a literal (`4`, `8` or `16`) at the seven call sites, so\n * `number`. The `\|\| 8` fallback is unreachable from inside this library. /\n $gutter?: number;\n /\n `renderAsMargin` IS READ AND NEVER PASSED — DECLARED, NOT FIXED.\n \n None of the seven `<S.Gutter>` sites passes it and nothing else in `src` constructs\n * this component, so the `if` branch below never runs: `margin-bottom` is never emitted\n * and the `else` branch is what always applies. And the `else` branch is REDUNDANT with\n * the unconditional `padding-bottom` on the line after the block, which emits the same\n * declaration a second time — so today the whole conditional contributes nothing at all.\n \n Two separate things to fix, neither of them here: wiring up `renderAsMargin` is a\n * feature, and deleting the dead conditional REMOVES a duplicate declaration from the\n * generated CSS and therefore moves the baseline (§J.8). It also has NO `$`, though\n * that part is harmless: React drops an unrecognised camelCase prop whose value is\n * `true`, so it could not reach the DOM even if it were passed.\n /\n renderAsMargin?: boolean;\n}\n\n/\n * Single-argument, and it stays that way — peer floor `styled-components: >=5.1.0`, and\n * the two majors disagree on the second parameter. §J.4. `prop` needs the annotation\n * because `withConfig` takes this by reference, so it gets no contextual typing.\n /\nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\nexport const SummaryCard = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<SummaryCardStyleProps>(applyDefaultTheme)`\n display: flex;\n flex-direction: column;\n border-radius: 4px;\n ${props =>\n props.view === 'compact' &&\n css`\n overflow: hidden;\n box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);\n `}\n width: ${props => (props.width ? `${props.width}px` : '100%')};\n ${props =>\n props.view === 'compact'\n ? props.theme.themeProp(\n 'background',\n props.theme.getColor('gray-700'),\n props.theme.getColor('white')\n )\n : 'background: transparent'};\n\n ${props =>\n props.$useBorder\n ? props.theme.themeProp(\n 'border',\n `1px solid ${props.theme.getColor('gray-500')}`,\n `1px solid ${props.theme.getColor('gray-300')}`\n )\n : null}\n`;\n\nexport const Gutter = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<SummaryCardGutterStyleProps>(applyDefaultTheme)`\n ${props => {\n if (props.renderAsMargin) {\n return css`\n margin-bottom: ${props.$gutter \|\| 8}px;\n `;\n } else {\n return css`\n padding-bottom: ${props.$gutter \|\| 8}px;\n `;\n }\n }}\n padding-bottom: ${props => props.$gutter \|\| 8}px;\n`;\n\nexport const Header = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0 16px;\n`;\n\nexport const HeaderLeft = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: flex-start;\n\n > {\n margin-right: 4px;\n }\n`;\n\nexport const HeaderRight = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: flex-end;\n\n > * {\n margin-left: 4px;\n }\n`;\n\nexport const Title = styled.span\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: inline-block;\n padding: 0 16px;\n font: normal normal 500 14px/19px Roboto;\n letter-spacing: 0.28px;\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n box-sizing: border-box;\n\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('white'),\n props.theme.getColor('gray-700')\n )};\n`;\n\nexport const Description = styled.span\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n padding: 0 16px;\n text-align: left;\n font: normal normal normal 12px/16px Roboto;\n letter-spacing: 0.24px;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n box-sizing: border-box;\n overflow-wrap: break-word;\n word-break: break-word;\n\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('white'),\n props.theme.getColor('gray-700')\n )};\n`;\n\nexport const Instruction = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)``;\n\nexport const Footer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0 16px;\n`;\n\nexport const FooterLeft = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: flex-start;\n\n > * {\n margin-right: 4px;\n }\n`;\n\nexport const FooterRight = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: flex-end;\n\n > * {\n margin-left: 4px;\n }\n`;\n\nexport const StyledFloatingArrow = styled(FloatingArrow)\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n ${props =>\n props.theme.themeProp('fill', props.theme.getColor('gray-700'), props.theme.getColor('white'))}\n`;\n"],"names":["shouldForwardProp","prop","startsWith","SummaryCard","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","view","css","width","theme","themeProp","getColor","$useBorder","Gutter","renderAsMargin","$gutter","Header","HeaderLeft","HeaderRight","Title","span","Description","Footer","FooterLeft","FooterRight","FloatingArrow"],"mappings":";;;;AAuEA,MAAMA,iBAAiB,GAAIC,IAAY,IAAc;EACnD,OAAOA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAClD,CAAC;AAEM,MAAMC,WAAW,GAAGC,MAAM,CAACC,GAAG,CAClCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAAwBC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,gCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,uDAAA,EAAA,SAAA,EAAA,GAAA,EAAA,GAAA,EAAA,EAAA,CAAA,EAI9CC,KAAK,IACLA,KAAK,CAACC,IAAI,KAAK,SAAS,IACxBC,GAAG,CAAA,CAAA,0DAAA,CAAA,CAGF,EACMF,KAAK,IAAKA,KAAK,CAACG,KAAK,GAAG,GAAGH,KAAK,CAACG,KAAK,CAAA,EAAA,CAAI,GAAG,MAAO,EAC3DH,KAAK,IACLA,KAAK,CAACC,IAAI,KAAK,SAAS,GACpBD,KAAK,CAACI,KAAK,CAACC,SAAS,CACnB,YAAY,EACZL,KAAK,CAACI,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,EAChCN,KAAK,CAACI,KAAK,CAACE,QAAQ,CAAC,OAAO,CAC9B,CAAC,GACD,yBAAyB,EAE7BN,KAAK,IACLA,KAAK,CAACO,UAAU,GACZP,KAAK,CAACI,KAAK,CAACC,SAAS,CACnB,QAAQ,EACR,aAAaL,KAAK,CAACI,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,CAAA,CAAE,EAC/C,CAAA,UAAA,EAAaN,KAAK,CAACI,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,CAAA,CAC/C,CAAC,GACD,IAAI;AAGL,MAAME,MAAM,GAAGf,MAAM,CAACC,GAAG,CAC7BC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAA8BC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,2BAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,EAAA,EAAA,kBAAA,EAAA,KAAA,CAAA,EACpDC,KAAK,IAAI;EACT,IAAIA,KAAK,CAACS,cAAc,EAAE;AACxB,IAAA,OAAOP,GAAG,CAAA,CAAA,gBAAA,EAAA,KAAA,CAAA,EACSF,KAAK,CAACU,OAAO,IAAI,CAAC,CAAA;AAEvC,EAAA,CAAC,MAAM;AACL,IAAA,OAAOR,GAAG,CAAA,CAAA,iBAAA,EAAA,KAAA,CAAA,EACUF,KAAK,CAACU,OAAO,IAAI,CAAC,CAAA;AAExC,EAAA;AACF,CAAC,EACiBV,KAAK,IAAIA,KAAK,CAACU,OAAO,IAAI,CAAC;AAGxC,MAAMC,MAAM,GAAGlB,MAAM,CAACC,GAAG,CAC7BC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,2BAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,+EAAA,CAAA;AAOpB,MAAMa,UAAU,GAAGnB,MAAM,CAACC,GAAG,CACjCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,+BAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,mFAAA,CAAA;AAUpB,MAAMc,WAAW,GAAGpB,MAAM,CAACC,GAAG,CAClCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,gCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,gFAAA,CAAA;AAUpB,MAAMe,KAAK,GAAGrB,MAAM,CAACsB,IAAI,CAC7BpB,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,0BAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,sOAAA,EAAA,GAAA,CAAA,EAYvBC,KAAK,IACLA,KAAK,CAACI,KAAK,CAACC,SAAS,CACnB,OAAO,EACPL,KAAK,CAACI,KAAK,CAACE,QAAQ,CAAC,OAAO,CAAC,EAC7BN,KAAK,CAACI,KAAK,CAACE,QAAQ,CAAC,UAAU,CACjC,CAAC;AAGE,MAAMU,WAAW,GAAGvB,MAAM,CAACsB,IAAI,CACnCpB,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,gCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,mRAAA,EAAA,GAAA,CAAA,EAcvBC,KAAK,IACLA,KAAK,CAACI,KAAK,CAACC,SAAS,CACnB,OAAO,EACPL,KAAK,CAACI,KAAK,CAACE,QAAQ,CAAC,OAAO,CAAC,EAC7BN,KAAK,CAACI,KAAK,CAACE,QAAQ,CAAC,UAAU,CACjC,CAAC;AAGsBb,MAAM,CAACC,GAAG,CAClCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,gCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,EAAA,CAAA;AAEpB,MAAMkB,MAAM,GAAGxB,MAAM,CAACC,GAAG,CAC7BC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,2BAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,+EAAA,CAAA;AAOpB,MAAMmB,UAAU,GAAGzB,MAAM,CAACC,GAAG,CACjCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,+BAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,mFAAA,CAAA;AAUpB,MAAMoB,WAAW,GAAG1B,MAAM,CAACC,GAAG,CAClCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,gCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,gFAAA,CAAA;AAUQN,MAAM,CAAC2B,aAAa,CAAC,CACrDzB,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,wCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA,EACvBC,KAAK,IACLA,KAAK,CAACI,KAAK,CAACC,SAAS,CAAC,MAAM,EAAEL,KAAK,CAACI,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,EAAEN,KAAK,CAACI,KAAK,CAACE,QAAQ,CAAC,OAAO,CAAC,CAAC;;;;"}
1	+ {"version":3,"file":"SummaryCard.styled.js","sources":["../../../src/components/widgets/SummaryCard/SummaryCard.styled.ts"],"sourcesContent":["// $-prefixed props are transient and never reach the DOM.\nimport styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\nimport { FloatingArrow } from '@floating-ui/react';\n\n/** Card root props; what `SummaryCard.tsx` passes to `<S.SummaryCard>`. /\nexport interface SummaryCardStyleProps {\n /* `view` as string (not narrowed to 'compact'\|'grid'); NO `$` to preserve existing DOM baseline. /\n view?: string;\n /* `width` as number (px); NO `$` to preserve existing DOM baseline. /\n width?: number;\n /* `useBorder` — optional here even though component defaults to false. /\n $useBorder?: boolean;\n}\n\n/* Gutter spacer component; rendered seven times by `SummaryCard.tsx`. /\ninterface SummaryCardGutterStyleProps {\n /* `$gutter` — always a literal (4, 8, or 16) at the call sites; number. /\n $gutter?: number;\n /* `renderAsMargin` — read but never passed; conditional here is dead code. /\n renderAsMargin?: boolean;\n}\n\n// Single-argument (styled-components 5 compat); prop needs annotation because withConfig takes by reference.\nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\nexport const SummaryCard = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<SummaryCardStyleProps>(applyDefaultTheme)`\n display: flex;\n flex-direction: column;\n border-radius: 4px;\n ${props =>\n props.view === 'compact' &&\n css`\n overflow: hidden;\n box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);\n `}\n width: ${props => (props.width ? `${props.width}px` : '100%')};\n ${props =>\n props.view === 'compact'\n ? props.theme.themeProp(\n 'background',\n props.theme.getColor('gray-700'),\n props.theme.getColor('white')\n )\n : 'background: transparent'};\n\n ${props =>\n props.$useBorder\n ? props.theme.themeProp(\n 'border',\n `1px solid ${props.theme.getColor('gray-500')}`,\n `1px solid ${props.theme.getColor('gray-300')}`\n )\n : null}\n`;\n\nexport const Gutter = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<SummaryCardGutterStyleProps>(applyDefaultTheme)`\n ${props => {\n if (props.renderAsMargin) {\n return css`\n margin-bottom: ${props.$gutter \|\| 8}px;\n `;\n } else {\n return css`\n padding-bottom: ${props.$gutter \|\| 8}px;\n `;\n }\n }}\n padding-bottom: ${props => props.$gutter \|\| 8}px;\n`;\n\nexport const Header = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0 16px;\n`;\n\nexport const HeaderLeft = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: flex-start;\n\n > {\n margin-right: 4px;\n }\n`;\n\nexport const HeaderRight = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: flex-end;\n\n > * {\n margin-left: 4px;\n }\n`;\n\nexport const Title = styled.span\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: inline-block;\n padding: 0 16px;\n font: normal normal 500 14px/19px Roboto;\n letter-spacing: 0.28px;\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n box-sizing: border-box;\n\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('white'),\n props.theme.getColor('gray-700')\n )};\n`;\n\nexport const Description = styled.span\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n padding: 0 16px;\n text-align: left;\n font: normal normal normal 12px/16px Roboto;\n letter-spacing: 0.24px;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n box-sizing: border-box;\n overflow-wrap: break-word;\n word-break: break-word;\n\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('white'),\n props.theme.getColor('gray-700')\n )};\n`;\n\nexport const Instruction = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)``;\n\nexport const Footer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0 16px;\n`;\n\nexport const FooterLeft = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: flex-start;\n\n > * {\n margin-right: 4px;\n }\n`;\n\nexport const FooterRight = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n justify-content: flex-end;\n\n > * {\n margin-left: 4px;\n }\n`;\n\nexport const StyledFloatingArrow = styled(FloatingArrow)\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n ${props =>\n props.theme.themeProp('fill', props.theme.getColor('gray-700'), props.theme.getColor('white'))}\n`;\n"],"names":["shouldForwardProp","prop","startsWith","SummaryCard","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","view","css","width","theme","themeProp","getColor","$useBorder","Gutter","renderAsMargin","$gutter","Header","HeaderLeft","HeaderRight","Title","span","Description","Footer","FooterLeft","FooterRight","FloatingArrow"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@ntbjs/react-components",
-  "version": "3.0.0-rc.1",
+  "version": "3.0.0-rc.2",
   "publishConfig": {
     "access": "public"
   },
@@ -75,6 +75,8 @@
     "types": "tsc -p tsconfig.json",
     "types:emit": "node scripts/emit-types.cjs",
     "prepack": "npm run types:emit",
+    "verify:visual:baseline": "node scripts/visual-gate/ensure-storybook.cjs && playwright test --update-snapshots",
+    "verify:visual:compare": "node scripts/visual-gate/compare.cjs",
     "lint": "eslint .",
     "storybook": "storybook dev -p 6006",
     "storybook:export": "storybook build",
@@ -106,6 +108,7 @@
     "@babel/preset-react": "^7.28.5",
     "@babel/preset-typescript": "^7.28.5",
     "@eslint/js": "^9.39.5",
+    "@playwright/test": "^1.62.1",
     "@rollup/plugin-babel": "^7.1.0",
     "@rollup/plugin-commonjs": "^29.0.3",
     "@rollup/plugin-node-resolve": "^16.0.3",
@@ -123,11 +126,13 @@
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "colors": "^1.4.0",
     "cross-env": "^7.0.3",
+    "esbuild": "^0.27.7",
     "eslint": "^9.39.5",
     "eslint-plugin-react": "^7.35.0",
     "globals": "^17.9.0",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^27.0.4",
+    "jsdom": "^16.7.0",
     "postcss": "^8.3.0",
     "react": "^19.2.4",
     "react-dom": "^19.2.4",
@@ -141,6 +146,8 @@
     "sass-loader": "^10.1.1",
     "storybook": "^10.1.11",
     "styled-components": "^6.1.19",
+    "ts-migrate-plugins": "0.1.35",
+    "ts-migrate-server": "0.1.33",
     "typescript": "6.0.3",
     "url-loader": "^4.1.1"
   },