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

package/README.md

@@ -98,6 +98,40 @@ You can build the library with:
 npm run build  
 ```  
 
+### 🛡️ Visual regression gate
+
+Every Storybook story is screenshotted in both the light and the dark theme and
+compared pixel for pixel against a set of baseline images. Use it whenever you
+change anything under `src/`, because a styling change that looks harmless in one
+story often moves another.
+
+The gate needs a browser binary once per checkout:
+
+```  
+npx playwright install chromium chromium-headless-shell  
+```  
+
+Record the baselines on a clean checkout, before you make any changes:
+
+```  
+npm run verify:visual:baseline  
+```  
+
+Then, after your changes, compare against them:
+
+```  
+npm run verify:visual:compare  
+```  
+
+A report opens on failure showing the before, after and diff of every story that
+moved. Read it and decide whether the change was intended before you re-record.
+
+The baselines are **not** committed. There are close to 600 of them, they change
+on any deliberate styling change, and a binary diff tells a reviewer nothing, so
+they stay local and each machine records its own. They are also
+platform-specific: font rasterisation differs between macOS and Linux, so a
+baseline recorded on one cannot be compared against a run on the other.
+
 ### 🧪 Installing the package locally (for testing only)
 
 Let's say you have another project (`test-app`) on your machine that you want to try installing the component library

package/build/data/Alert/Alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","sources":["../../../src/components/data/Alert/Alert.tsx"],"sourcesContent":["import React from 'react';\nimport * as S from './Alert.styled';\nimport { isEmpty } from 'lodash';\n\ntype AlertOwnProps = {\n  /**\n   * Type of alert that will be reflected by the background color of it.\n   */\n  type?: 'warning' | 'error' | 'info';\n  /**\n   * Icon that will be displayed on the left of the alert message.\n   */\n  icon?: React.ReactElement<any>;\n  /**\n   * Alignment of the alert message.\n   */\n  align?: 'left' | 'center';\n  /**\n   * Message that will be displayed on the alert.\n   */\n  alertMessage?: string;\n  /**\n   * Font size of the alert message in pixel.\n   */\n  fontSize?: number;\n  /**\n   * Line height of the alert message in pixel.\n   */\n  lineHeight?: number;\n  /**\n   * Number of lines that will be displayed before the message will be truncated and replaced with ellipsis.\n   */\n  lineClamp?: number;\n  /**\n   * The top and bottom padding of the alert in pixel.\n   */\n  verticalPadding?: number;\n  /**\n   * The left and right padding of the alert in pixel.\n   */\n  horizontalPadding?: number;\n  /**\n   * Custom width of the alert in pixel.\n   */\n  width?: number;\n};\n\n/*\n * NMB-3998 §C.2: `props` is spread onto `S.Alert`, 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 AlertOwnProps`);\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.Alert>, keyof AlertOwnProps> &\n  AlertOwnProps;\n\n/**\n * Alert display warnings or errors.\n *\n * ### Import\n *\n * ``` js\n * import { Alert } from '@ntbjs/react-components/data'\n * // or\n * import Alert from '@ntbjs/react-components/data/Alert'\n * ```\n * ## Props\n * ```\n * Pass one of `warning`, `error` or `info` to the `type` prop to render the right Alert.\n * Pass `align={left}`or `align={center}` to align content.\n * Pass `icon={<svg></svg>}` to display an icon.\n * Pass `alertMessage={'message'} to display the message\n * Pass `fontSize={number}` to set the font size of the message in pixel\n * Pass `lineHeight={number}` to set the line height of the message in pixel\n * Pass `lineClamp={number}` to set the number of lines before the message will be truncated\n * Pass `verticalPadding={number}` to set the top and bottom padding of the alert in pixel\n * Pass `horizontalPadding={number}` to set the left and right padding of the alert in pixel\n * Pass `width={number}` to set the width of the alert in pixel\n *  ```\n * ### Warning / Error / Info\n * ```\n * <Alert type={\"warning\"} />\n * <Alert type={\"error\"} />\n * <Alert type={\"info\"} />\n * ```\n */\n\nconst Alert = React.forwardRef<any, Props>(function Alert(\n  {\n    type,\n    alertMessage = 'Use subject to restrictions. Editorial use only, no commercial use without prior consent from rights holder.',\n    align = 'left',\n    icon,\n    fontSize,\n    lineHeight,\n    lineClamp = 0,\n    verticalPadding = 17,\n    horizontalPadding = 30,\n    width,\n    ...props\n  },\n  forwardedRef\n) {\n  let isWarning = false;\n  let isError = false;\n  let isInfo = true;\n\n  if (!isEmpty(type)) {\n    if (type === 'warning') {\n      isWarning = true;\n    } else if (type === 'error') {\n      isError = true;\n    } else {\n      isInfo = true;\n    }\n  } else {\n    if (isWarning || isError) {\n      isInfo = false;\n    }\n  }\n\n  return (\n    <S.Alert\n      ref={forwardedRef}\n      $alertMessage={alertMessage}\n      $warning={isWarning}\n      $error={isError}\n      $info={isInfo}\n      $align={align}\n      $verticalPadding={verticalPadding}\n      $horizontalPadding={horizontalPadding}\n      width={width}\n      {...props}\n    >\n      <S.AlertRender fontSize={fontSize} $lineHeight={lineHeight} $lineClamp={lineClamp}>\n        {icon} <span>{alertMessage}</span>\n      </S.AlertRender>\n    </S.Alert>\n  );\n});\n\nexport default Alert;\n"],"names":["Alert","React","forwardRef","type","alertMessage","align","icon","fontSize","lineHeight","lineClamp","verticalPadding","horizontalPadding","width","props","forwardedRef","isWarning","isError","isInfo","isEmpty","_jsx","S","ref","$alertMessage","$warning","$error","$info","$align","$verticalPadding","$horizontalPadding","children","_jsxs","$lineHeight","$lineClamp"],"mappings":";;;;;AAwFA,MAAMA,KAAK,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,KAAKA,CACvD;EACEG,IAAI;AACJC,EAAAA,YAAY,GAAG,8GAA8G;AAC7HC,EAAAA,KAAK,GAAG,MAAM;EACdC,IAAI;EACJC,QAAQ;EACRC,UAAU;AACVC,EAAAA,SAAS,GAAG,CAAC;AACbC,EAAAA,eAAe,GAAG,EAAE;AACpBC,EAAAA,iBAAiB,GAAG,EAAE;EACtBC,KAAK;EACL,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,IAAIC,SAAS,GAAG,KAAK;EACrB,IAAIC,OAAO,GAAG,KAAK;EACnB,IAAIC,MAAM,GAAG,IAAI;AAEjB,EAAA,IAAI,CAACC,OAAO,CAACf,IAAI,CAAC,EAAE;IAClB,IAAIA,IAAI,KAAK,SAAS,EAAE;AACtBY,MAAAA,SAAS,GAAG,IAAI;AAClB,IAAA,CAAC,MAAM,IAAIZ,IAAI,KAAK,OAAO,EAAE;AAC3Ba,MAAAA,OAAO,GAAG,IAAI;AAChB,IAAA,CAAC,MAAM;AACLC,MAAAA,MAAM,GAAG,IAAI;AACf,IAAA;AACF,EAAA,CAAC,MAAM;IACL,IAAIF,SAAS,IAAIC,OAAO,EAAE;AACxBC,MAAAA,MAAM,GAAG,KAAK;AAChB,IAAA;AACF,EAAA;AAEA,EAAA,OACEE,GAAA,CAACC,OAAO,EAAA;AACNC,IAAAA,GAAG,EAAEP,YAAa;AAClBQ,IAAAA,aAAa,EAAElB,YAAa;AAC5BmB,IAAAA,QAAQ,EAAER,SAAU;AACpBS,IAAAA,MAAM,EAAER,OAAQ;AAChBS,IAAAA,KAAK,EAAER,MAAO;AACdS,IAAAA,MAAM,EAAErB,KAAM;AACdsB,IAAAA,gBAAgB,EAAEjB,eAAgB;AAClCkB,IAAAA,kBAAkB,EAAEjB,iBAAkB;AACtCC,IAAAA,KAAK,EAAEA,KAAM;AAAA,IAAA,GACTC,KAAK;AAAAgB,IAAAA,QAAA,EAETC,IAAA,CAACV,WAAa,EAAA;AAACb,MAAAA,QAAQ,EAAEA,QAAS;AAACwB,MAAAA,WAAW,EAAEvB,UAAW;AAACwB,MAAAA,UAAU,EAAEvB,SAAU;AAAAoB,MAAAA,QAAA,EAAA,CAC/EvB,IAAI,EAAC,GAAC,EAAAa,GAAA,CAAA,MAAA,EAAA;AAAAU,QAAAA,QAAA,EAAOzB;AAAY,OAAO,CAAC;KACrB;AAAC,GACT,CAAC;AAEd,CAAC;;;;"}
+{"version":3,"file":"Alert.js","sources":["../../../src/components/data/Alert/Alert.tsx"],"sourcesContent":["import React from 'react';\nimport * as S from './Alert.styled';\nimport { isEmpty } from 'lodash';\n\ntype AlertOwnProps = {\n  /**\n   * Type of alert that will be reflected by the background color of it.\n   */\n  type?: 'warning' | 'error' | 'info';\n  /**\n   * Icon that will be displayed on the left of the alert message.\n   */\n  icon?: React.ReactElement<any>;\n  /**\n   * Alignment of the alert message.\n   */\n  align?: 'left' | 'center';\n  /**\n   * Message that will be displayed on the alert.\n   */\n  alertMessage?: string;\n  /**\n   * Font size of the alert message in pixel.\n   */\n  fontSize?: number;\n  /**\n   * Line height of the alert message in pixel.\n   */\n  lineHeight?: number;\n  /**\n   * Number of lines that will be displayed before the message will be truncated and replaced with ellipsis.\n   */\n  lineClamp?: number;\n  /**\n   * The top and bottom padding of the alert in pixel.\n   */\n  verticalPadding?: number;\n  /**\n   * The left and right padding of the alert in pixel.\n   */\n  horizontalPadding?: number;\n  /**\n   * Custom width of the alert in pixel.\n   */\n  width?: number;\n};\n\n// Omit before & — a bare intersection narrows colliding props instead of overriding them.\ntype Props = Omit<React.ComponentPropsWithoutRef<typeof S.Alert>, keyof AlertOwnProps> &\n  AlertOwnProps;\n\n/**\n * Alert display warnings or errors.\n *\n * ### Import\n *\n * ``` js\n * import { Alert } from '@ntbjs/react-components/data'\n * // or\n * import Alert from '@ntbjs/react-components/data/Alert'\n * ```\n * ## Props\n * ```\n * Pass one of `warning`, `error` or `info` to the `type` prop to render the right Alert.\n * Pass `align={left}`or `align={center}` to align content.\n * Pass `icon={<svg></svg>}` to display an icon.\n * Pass `alertMessage={'message'} to display the message\n * Pass `fontSize={number}` to set the font size of the message in pixel\n * Pass `lineHeight={number}` to set the line height of the message in pixel\n * Pass `lineClamp={number}` to set the number of lines before the message will be truncated\n * Pass `verticalPadding={number}` to set the top and bottom padding of the alert in pixel\n * Pass `horizontalPadding={number}` to set the left and right padding of the alert in pixel\n * Pass `width={number}` to set the width of the alert in pixel\n *  ```\n * ### Warning / Error / Info\n * ```\n * <Alert type={\"warning\"} />\n * <Alert type={\"error\"} />\n * <Alert type={\"info\"} />\n * ```\n */\n\nconst Alert = React.forwardRef<any, Props>(function Alert(\n  {\n    type,\n    alertMessage = 'Use subject to restrictions. Editorial use only, no commercial use without prior consent from rights holder.',\n    align = 'left',\n    icon,\n    fontSize,\n    lineHeight,\n    lineClamp = 0,\n    verticalPadding = 17,\n    horizontalPadding = 30,\n    width,\n    ...props\n  },\n  forwardedRef\n) {\n  let isWarning = false;\n  let isError = false;\n  let isInfo = true;\n\n  if (!isEmpty(type)) {\n    if (type === 'warning') {\n      isWarning = true;\n    } else if (type === 'error') {\n      isError = true;\n    } else {\n      isInfo = true;\n    }\n  } else {\n    if (isWarning || isError) {\n      isInfo = false;\n    }\n  }\n\n  return (\n    <S.Alert\n      ref={forwardedRef}\n      $alertMessage={alertMessage}\n      $warning={isWarning}\n      $error={isError}\n      $info={isInfo}\n      $align={align}\n      $verticalPadding={verticalPadding}\n      $horizontalPadding={horizontalPadding}\n      width={width}\n      {...props}\n    >\n      <S.AlertRender fontSize={fontSize} $lineHeight={lineHeight} $lineClamp={lineClamp}>\n        {icon} <span>{alertMessage}</span>\n      </S.AlertRender>\n    </S.Alert>\n  );\n});\n\nexport default Alert;\n"],"names":["Alert","React","forwardRef","type","alertMessage","align","icon","fontSize","lineHeight","lineClamp","verticalPadding","horizontalPadding","width","props","forwardedRef","isWarning","isError","isInfo","isEmpty","_jsx","S","ref","$alertMessage","$warning","$error","$info","$align","$verticalPadding","$horizontalPadding","children","_jsxs","$lineHeight","$lineClamp"],"mappings":";;;;;AAkFA,MAAMA,KAAK,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,KAAKA,CACvD;EACEG,IAAI;AACJC,EAAAA,YAAY,GAAG,8GAA8G;AAC7HC,EAAAA,KAAK,GAAG,MAAM;EACdC,IAAI;EACJC,QAAQ;EACRC,UAAU;AACVC,EAAAA,SAAS,GAAG,CAAC;AACbC,EAAAA,eAAe,GAAG,EAAE;AACpBC,EAAAA,iBAAiB,GAAG,EAAE;EACtBC,KAAK;EACL,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,IAAIC,SAAS,GAAG,KAAK;EACrB,IAAIC,OAAO,GAAG,KAAK;EACnB,IAAIC,MAAM,GAAG,IAAI;AAEjB,EAAA,IAAI,CAACC,OAAO,CAACf,IAAI,CAAC,EAAE;IAClB,IAAIA,IAAI,KAAK,SAAS,EAAE;AACtBY,MAAAA,SAAS,GAAG,IAAI;AAClB,IAAA,CAAC,MAAM,IAAIZ,IAAI,KAAK,OAAO,EAAE;AAC3Ba,MAAAA,OAAO,GAAG,IAAI;AAChB,IAAA,CAAC,MAAM;AACLC,MAAAA,MAAM,GAAG,IAAI;AACf,IAAA;AACF,EAAA,CAAC,MAAM;IACL,IAAIF,SAAS,IAAIC,OAAO,EAAE;AACxBC,MAAAA,MAAM,GAAG,KAAK;AAChB,IAAA;AACF,EAAA;AAEA,EAAA,OACEE,GAAA,CAACC,OAAO,EAAA;AACNC,IAAAA,GAAG,EAAEP,YAAa;AAClBQ,IAAAA,aAAa,EAAElB,YAAa;AAC5BmB,IAAAA,QAAQ,EAAER,SAAU;AACpBS,IAAAA,MAAM,EAAER,OAAQ;AAChBS,IAAAA,KAAK,EAAER,MAAO;AACdS,IAAAA,MAAM,EAAErB,KAAM;AACdsB,IAAAA,gBAAgB,EAAEjB,eAAgB;AAClCkB,IAAAA,kBAAkB,EAAEjB,iBAAkB;AACtCC,IAAAA,KAAK,EAAEA,KAAM;AAAA,IAAA,GACTC,KAAK;AAAAgB,IAAAA,QAAA,EAETC,IAAA,CAACV,WAAa,EAAA;AAACb,MAAAA,QAAQ,EAAEA,QAAS;AAACwB,MAAAA,WAAW,EAAEvB,UAAW;AAACwB,MAAAA,UAAU,EAAEvB,SAAU;AAAAoB,MAAAA,QAAA,EAAA,CAC/EvB,IAAI,EAAC,GAAC,EAAAa,GAAA,CAAA,MAAA,EAAA;AAAAU,QAAAA,QAAA,EAAOzB;AAAY,OAAO,CAAC;KACrB;AAAC,GACT,CAAC;AAEd,CAAC;;;;"}

package/build/data/Alert/Alert.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.styled.js","sources":["../../../src/components/data/Alert/Alert.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 * THREE DEFERRED DEFECTS ARE DECLARED HERE AND NOT FIXED HERE, because each fix changes\n * the rendered DOM or the rendered CSS and so belongs to C10 with its baseline\n * re-record. Each is named at its declaration: `width` and `fontSize` are non-`$` reads\n * that leak to the DOM, and `align` is read but never passed — a dead branch, while the\n * `$align` the component DOES pass is never read.\n */\nimport styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n/**\n * Props of the `Alert` root, i.e. what `Alert.tsx` passes to `S.Alert`. Value types come\n * from that file's propTypes; all optional per §J.5.\n */\nexport interface AlertStyleProps {\n  /** `isWarning` — derived in the component from `type === 'warning'`, so `boolean`. */\n  $warning?: boolean;\n  /** `isError` — derived from `type === 'error'`. */\n  $error?: boolean;\n  /** `isInfo` — derived; the component initialises it `true`. */\n  $info?: boolean;\n  /**\n   * `verticalPadding` — `PropTypes.number`, px. `number` and not `number | string`: the\n   * template interpolates `${…}px`, so a string would already emit `padding: 17pxpx`.\n   */\n  $verticalPadding?: number;\n  /** `horizontalPadding` — `PropTypes.number`, px, interpolated the same way. */\n  $horizontalPadding?: number;\n  /**\n   * `alertMessage` — `PropTypes.string`.\n   *\n   * DECLARED BECAUSE THE COMPONENT PASSES IT, NOT BECAUSE ANYTHING READS IT. No\n   * interpolation below mentions `$alertMessage`; the message is rendered as the\n   * `<span>` child of `AlertRender` instead. `shouldForwardProp` filters it, so it\n   * reaches neither the CSS nor the DOM — a dead prop, harmless, and dropping it from\n   * `Alert.tsx` is a separate cleanup.\n   */\n  $alertMessage?: string;\n  /**\n   * `align` — `PropTypes.oneOf(['left', 'center'])`.\n   *\n   * DEFECT, DECLARED NOT FIXED: this is the prop the component passes, and NOTHING READS\n   * IT. The `text-align` rule at the bottom of this template reads the non-`$` `align`\n   * (declared below) instead, and that is never passed — so `align=\"center\"` has never\n   * had any effect and every Alert renders `text-align: left`.\n   *\n   * The fix is to repoint that read from `props.align` to `props.$align`, which ACTIVATES\n   * A BRANCH THAT HAS NEVER FIRED and so changes rendered CSS. §J.8 lists that as C10\n   * work with a baseline re-record; it must not ride along in a type-only commit.\n   */\n  $align?: 'left' | 'center';\n  /**\n   * `width` — `PropTypes.number`, px.\n   *\n   * DEFECT, DECLARED NOT FIXED: no `$`. `Alert.tsx` passes `width={width}` and\n   * `shouldForwardProp` forwards every non-`$` prop, so whenever a caller sets `width` it\n   * also lands on the rendered `<div>`, which is not a valid attribute on a `<div>`.\n   * CONFIRMED, not inferred: `scripts/r19-harness/baseline.json` records\n   * `<div width=\"480\" …>` for `data/Alert`. The fix is to rename it `$width` at both ends,\n   * which REMOVES a DOM attribute and so needs C10's re-record. §E.4's third case.\n   */\n  width?: number;\n  /**\n   * `align` again, in its non-`$` form — the key this template actually reads. Same\n   * defect as `$align` above, stated from the reading end: nothing passes this, so the\n   * `=== 'center'` comparison is always `false`.\n   */\n  align?: 'left' | 'center';\n}\n\n/** Props of `AlertRender`, i.e. what `Alert.tsx` passes to `S.AlertRender`. */\ninterface AlertRenderStyleProps {\n  /** `lineHeight` — `PropTypes.number`, px, interpolated as `${…}px`. */\n  $lineHeight?: number;\n  /**\n   * `lineClamp` — `PropTypes.number`, the `-webkit-line-clamp` count. The component\n   * defaults it to `0`, which is falsy, so the clamp block is opt-in.\n   */\n  $lineClamp?: number;\n  /**\n   * `fontSize` — `PropTypes.number`, px.\n   *\n   * DEFECT, DECLARED NOT FIXED: no `$`. `Alert.tsx` passes `fontSize={fontSize}`, so\n   * whenever a caller sets it, it also leaks onto the rendered `<div>` — AS\n   * `font-size=\"12\"`, NOT `fontSize=\"12\"`: React maps this particular camelCase name to\n   * its hyphenated attribute form. CONFIRMED, not inferred:\n   * `scripts/r19-harness/baseline.json` records `<div font-size=\"12\" …>` for every\n   * `data/Alert` entry. The fix is `$fontSize` at both ends — a DOM change, so C10. §E.4.\n   */\n  fontSize?: number;\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 Alert = styled.div\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs<AlertStyleProps>(applyDefaultTheme)`\n  display: flex;\n  flex-direction: column;\n  padding: ${props => {\n    const verticalPadding = props.$verticalPadding ?? 17;\n    const horizontalPadding = props.$horizontalPadding ?? 30;\n    return `${verticalPadding}px ${horizontalPadding}px`;\n  }};\n  width: ${props => (props.width ? `${props.width}px` : '100%')};\n  box-sizing: border-box;\n\n  ${props =>\n    props.$warning &&\n    css`\n      ${props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400'))}\n    `}\n\n  ${props =>\n    props.$error &&\n    css`\n      ${props.theme.themeProp('background', '#7F1B1B', props.theme.getColor('red-200'))}\n    `}\n  \n  ${props =>\n    props.$info &&\n    css`\n      background: transparent;\n    `}\n  \n  text-align: ${props => (props.align === 'center' ? 'center' : 'left')};\n`;\n\nexport const AlertRender = styled.div\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs<AlertRenderStyleProps>(applyDefaultTheme)`\n  display: flex;\n  align-items: center;\n  word-break: break-word;\n  ${props => (props.$lineHeight ? `line-height: ${props.$lineHeight}px;` : null)}\n  ${props => (props.fontSize ? `font-size: ${props.fontSize}px;` : null)}\n  ${props =>\n    props.theme.themeProp(\n      'color',\n      props.theme.getColor('white'),\n      props.theme.getColor('gray-700')\n    )};\n\n  svg {\n    width: 12px;\n    height: 12px;\n  }\n\n  span {\n    flex: 1;\n    padding-left: 5px;\n    ${props =>\n      props.$lineClamp\n        ? css`\n            display: -webkit-box;\n            -webkit-line-clamp: ${props.$lineClamp};\n            -webkit-box-orient: vertical;\n            overflow: hidden;\n            text-overflow: ellipsis;\n          `\n        : null};\n  }\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Alert","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","verticalPadding","$verticalPadding","horizontalPadding","$horizontalPadding","width","$warning","css","theme","themeProp","getColor","$error","$info","align","AlertRender","$lineHeight","fontSize","$lineClamp"],"mappings":";;;AAqGA,MAAMA,iBAAiB,GAAIC,IAAY,IAAc;EACnD,OAAOA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAClD,CAAC;AAEM,MAAMC,KAAK,GAAGC,MAAM,CAACC,GAAG,CAC5BC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAAkBC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,oBAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,6CAAA,EAAA,SAAA,EAAA,yBAAA,EAAA,GAAA,EAAA,GAAA,EAAA,cAAA,EAAA,GAAA,CAAA,EAG/BC,KAAK,IAAI;AAClB,EAAA,MAAMC,eAAe,GAAGD,KAAK,CAACE,gBAAgB,IAAI,EAAE;AACpD,EAAA,MAAMC,iBAAiB,GAAGH,KAAK,CAACI,kBAAkB,IAAI,EAAE;AACxD,EAAA,OAAO,CAAA,EAAGH,eAAe,CAAA,GAAA,EAAME,iBAAiB,CAAA,EAAA,CAAI;AACtD,CAAC,EACQH,KAAK,IAAKA,KAAK,CAACK,KAAK,GAAG,GAAGL,KAAK,CAACK,KAAK,CAAA,EAAA,CAAI,GAAG,MAAO,EAG3DL,KAAK,IACLA,KAAK,CAACM,QAAQ,IACdC,GAAG,WACCP,KAAK,CAACQ,KAAK,CAACC,SAAS,CAAC,YAAY,EAAE,SAAS,EAAET,KAAK,CAACQ,KAAK,CAACE,QAAQ,CAAC,mBAAmB,CAAC,CAAC,CAC5F,EAEDV,KAAK,IACLA,KAAK,CAACW,MAAM,IACZJ,GAAG,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA,EACCP,KAAK,CAACQ,KAAK,CAACC,SAAS,CAAC,YAAY,EAAE,SAAS,EAAET,KAAK,CAACQ,KAAK,CAACE,QAAQ,CAAC,SAAS,CAAC,CAAC,CAClF,EAEDV,KAAK,IACLA,KAAK,CAACY,KAAK,IACXL,GAAG,CAAA,CAAA,yBAAA,CAAA,CAEF,EAEWP,KAAK,IAAKA,KAAK,CAACa,KAAK,KAAK,QAAQ,GAAG,QAAQ,GAAG,MAAO;AAGhE,MAAMC,WAAW,GAAGrB,MAAM,CAACC,GAAG,CAClCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAAwBC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,0BAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,wDAAA,EAAA,GAAA,EAAA,GAAA,EAAA,4DAAA,EAAA,IAAA,CAAA,EAI9CC,KAAK,IAAKA,KAAK,CAACe,WAAW,GAAG,CAAA,aAAA,EAAgBf,KAAK,CAACe,WAAW,CAAA,GAAA,CAAK,GAAG,IAAK,EAC5Ef,KAAK,IAAKA,KAAK,CAACgB,QAAQ,GAAG,CAAA,WAAA,EAAchB,KAAK,CAACgB,QAAQ,CAAA,GAAA,CAAK,GAAG,IAAK,EACpEhB,KAAK,IACLA,KAAK,CAACQ,KAAK,CAACC,SAAS,CACnB,OAAO,EACPT,KAAK,CAACQ,KAAK,CAACE,QAAQ,CAAC,OAAO,CAAC,EAC7BV,KAAK,CAACQ,KAAK,CAACE,QAAQ,CAAC,UAAU,CACjC,CAAC,EAUCV,KAAK,IACLA,KAAK,CAACiB,UAAU,GACZV,GAAG,sHAEqBP,KAAK,CAACiB,UAAU,CAAA,GAKxC,IAAI;;;;"}
+{"version":3,"file":"Alert.styled.js","sources":["../../../src/components/data/Alert/Alert.styled.ts"],"sourcesContent":["/*\n * Three deferred defects declared here: width, fontSize leak to DOM; align is read but never passed.\n */\nimport styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n/**\n * Props of the `Alert` root, i.e. what `Alert.tsx` passes to `S.Alert`. Value types come\n * from that file's propTypes; all optional.\n */\nexport interface AlertStyleProps {\n  /** `isWarning` — derived in the component from `type === 'warning'`, so `boolean`. */\n  $warning?: boolean;\n  /** `isError` — derived from `type === 'error'`. */\n  $error?: boolean;\n  /** `isInfo` — derived; the component initialises it `true`. */\n  $info?: boolean;\n  /**\n   * `verticalPadding` — `PropTypes.number`, px. `number` and not `number | string`: the\n   * template interpolates `${…}px`, so a string would already emit `padding: 17pxpx`.\n   */\n  $verticalPadding?: number;\n  /** `horizontalPadding` — `PropTypes.number`, px, interpolated the same way. */\n  $horizontalPadding?: number;\n  /**\n   * `alertMessage` — `PropTypes.string`. Component passes it; nothing reads it. Harmless; `$` filters it.\n   */\n  $alertMessage?: string;\n  /**\n   * `align` — `PropTypes.oneOf(['left', 'center'])`. Defect: component passes `$align`; template reads plain `align` instead. No-op; every Alert is left-aligned.\n   */\n  $align?: 'left' | 'center';\n  /**\n   * `width` — `PropTypes.number`, px. Defect: no `$` means it leaks to DOM as invalid `width=\"480\"` attribute.\n   */\n  width?: number;\n  /**\n   * `align` in its non-`$` form — read but never passed; comparison always false.\n   */\n  align?: 'left' | 'center';\n}\n\n/** Props of `AlertRender`, i.e. what `Alert.tsx` passes to `S.AlertRender`. */\ninterface AlertRenderStyleProps {\n  /** `lineHeight` — `PropTypes.number`, px, interpolated as `${…}px`. */\n  $lineHeight?: number;\n  /**\n   * `lineClamp` — `PropTypes.number`, the `-webkit-line-clamp` count. The component\n   * defaults it to `0`, which is falsy, so the clamp block is opt-in.\n   */\n  $lineClamp?: number;\n  /**\n   * `fontSize` — `PropTypes.number`, px. Defect: no `$` means it leaks to DOM as `font-size=\"12\"` attribute.\n   */\n  fontSize?: number;\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. `prop` needs the annotation because\n * `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 Alert = styled.div\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs<AlertStyleProps>(applyDefaultTheme)`\n  display: flex;\n  flex-direction: column;\n  padding: ${props => {\n    const verticalPadding = props.$verticalPadding ?? 17;\n    const horizontalPadding = props.$horizontalPadding ?? 30;\n    return `${verticalPadding}px ${horizontalPadding}px`;\n  }};\n  width: ${props => (props.width ? `${props.width}px` : '100%')};\n  box-sizing: border-box;\n\n  ${props =>\n    props.$warning &&\n    css`\n      ${props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400'))}\n    `}\n\n  ${props =>\n    props.$error &&\n    css`\n      ${props.theme.themeProp('background', '#7F1B1B', props.theme.getColor('red-200'))}\n    `}\n  \n  ${props =>\n    props.$info &&\n    css`\n      background: transparent;\n    `}\n  \n  text-align: ${props => (props.align === 'center' ? 'center' : 'left')};\n`;\n\nexport const AlertRender = styled.div\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs<AlertRenderStyleProps>(applyDefaultTheme)`\n  display: flex;\n  align-items: center;\n  word-break: break-word;\n  ${props => (props.$lineHeight ? `line-height: ${props.$lineHeight}px;` : null)}\n  ${props => (props.fontSize ? `font-size: ${props.fontSize}px;` : null)}\n  ${props =>\n    props.theme.themeProp(\n      'color',\n      props.theme.getColor('white'),\n      props.theme.getColor('gray-700')\n    )};\n\n  svg {\n    width: 12px;\n    height: 12px;\n  }\n\n  span {\n    flex: 1;\n    padding-left: 5px;\n    ${props =>\n      props.$lineClamp\n        ? css`\n            display: -webkit-box;\n            -webkit-line-clamp: ${props.$lineClamp};\n            -webkit-box-orient: vertical;\n            overflow: hidden;\n            text-overflow: ellipsis;\n          `\n        : null};\n  }\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Alert","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","verticalPadding","$verticalPadding","horizontalPadding","$horizontalPadding","width","$warning","css","theme","themeProp","getColor","$error","$info","align","AlertRender","$lineHeight","fontSize","$lineClamp"],"mappings":";;;AA8DA,MAAMA,iBAAiB,GAAIC,IAAY,IAAc;EACnD,OAAOA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAClD,CAAC;AAEM,MAAMC,KAAK,GAAGC,MAAM,CAACC,GAAG,CAC5BC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAAkBC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,oBAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,6CAAA,EAAA,SAAA,EAAA,yBAAA,EAAA,GAAA,EAAA,GAAA,EAAA,cAAA,EAAA,GAAA,CAAA,EAG/BC,KAAK,IAAI;AAClB,EAAA,MAAMC,eAAe,GAAGD,KAAK,CAACE,gBAAgB,IAAI,EAAE;AACpD,EAAA,MAAMC,iBAAiB,GAAGH,KAAK,CAACI,kBAAkB,IAAI,EAAE;AACxD,EAAA,OAAO,CAAA,EAAGH,eAAe,CAAA,GAAA,EAAME,iBAAiB,CAAA,EAAA,CAAI;AACtD,CAAC,EACQH,KAAK,IAAKA,KAAK,CAACK,KAAK,GAAG,GAAGL,KAAK,CAACK,KAAK,CAAA,EAAA,CAAI,GAAG,MAAO,EAG3DL,KAAK,IACLA,KAAK,CAACM,QAAQ,IACdC,GAAG,WACCP,KAAK,CAACQ,KAAK,CAACC,SAAS,CAAC,YAAY,EAAE,SAAS,EAAET,KAAK,CAACQ,KAAK,CAACE,QAAQ,CAAC,mBAAmB,CAAC,CAAC,CAC5F,EAEDV,KAAK,IACLA,KAAK,CAACW,MAAM,IACZJ,GAAG,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA,EACCP,KAAK,CAACQ,KAAK,CAACC,SAAS,CAAC,YAAY,EAAE,SAAS,EAAET,KAAK,CAACQ,KAAK,CAACE,QAAQ,CAAC,SAAS,CAAC,CAAC,CAClF,EAEDV,KAAK,IACLA,KAAK,CAACY,KAAK,IACXL,GAAG,CAAA,CAAA,yBAAA,CAAA,CAEF,EAEWP,KAAK,IAAKA,KAAK,CAACa,KAAK,KAAK,QAAQ,GAAG,QAAQ,GAAG,MAAO;AAGhE,MAAMC,WAAW,GAAGrB,MAAM,CAACC,GAAG,CAClCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAAwBC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,0BAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,wDAAA,EAAA,GAAA,EAAA,GAAA,EAAA,4DAAA,EAAA,IAAA,CAAA,EAI9CC,KAAK,IAAKA,KAAK,CAACe,WAAW,GAAG,CAAA,aAAA,EAAgBf,KAAK,CAACe,WAAW,CAAA,GAAA,CAAK,GAAG,IAAK,EAC5Ef,KAAK,IAAKA,KAAK,CAACgB,QAAQ,GAAG,CAAA,WAAA,EAAchB,KAAK,CAACgB,QAAQ,CAAA,GAAA,CAAK,GAAG,IAAK,EACpEhB,KAAK,IACLA,KAAK,CAACQ,KAAK,CAACC,SAAS,CACnB,OAAO,EACPT,KAAK,CAACQ,KAAK,CAACE,QAAQ,CAAC,OAAO,CAAC,EAC7BV,KAAK,CAACQ,KAAK,CAACE,QAAQ,CAAC,UAAU,CACjC,CAAC,EAUCV,KAAK,IACLA,KAAK,CAACiB,UAAU,GACZV,GAAG,sHAEqBP,KAAK,CAACiB,UAAU,CAAA,GAKxC,IAAI;;;;"}

package/build/data/Badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sources":["../../../src/components/data/Badge/Badge.tsx"],"sourcesContent":["import React from 'react';\nimport * as S from './Badge.styled';\n\ntype BadgeOwnProps = {\n  /**\n   * An Icon to show in the badge alongside with a text\n   */\n  badgeIcon?: React.ReactNode;\n  /**\n   * Content to be showed in the badge – e.g. number of results.\n   *\n   * NMB-3998: this is `React.ReactNode` and NOT the four-way union the propTypes\n   * codemod produced from `oneOfType([string, number, func, element])`. The `func`\n   * member was never a legal value: line 182 renders `{badgeContent}` as a child, and\n   * React THROWS \"Functions are not valid as a React child\" for a function. So the\n   * propTypes documented a value that cannot work, and transcribing them faithfully\n   * published that mistake as a type — which is what TS2769 on line 182 was reporting.\n   * The union was also missing `null`, used by `Badge badgeContent={null}` in\n   * Tabs.stories; that only compiled because `strictNullChecks` is off.\n   */\n  badgeContent?: React.ReactNode;\n  /**\n   * The element(s) for which the badge will be displayed – e.g. an icon or a text.\n   */\n  children?: React.ReactNode | string;\n  /**\n   * Whether the badge should be displayed in an elevated position on top of the child element(s) or not.\n   */\n  elevated?: boolean;\n  /**\n   * Whether the element is active or not (e.g. the currently selected menu item). This changes the color of the badge.\n   */\n  active?: boolean;\n  /**\n   * There is an error present – 'error be prioritized over warnings if both are set to `true`.\n   */\n  error?: boolean;\n  /**\n   * There is a warning present.\n   */\n  warning?: boolean;\n  /**\n   * Font size for the badge\n   */\n  fontSize?: number | string;\n  /**\n   * Font weight for the badge\n   */\n  fontWeight?: number | string;\n  /**\n   * Line weight for the badge\n   */\n  lineHeight?: number | string;\n  /**\n   * Colors of the font in the manner of [darkThemeColor, lightThemeColor]\n   */\n  colors?: string[];\n  /**\n   * Background colors for the badge in the manner of [darkThemeColor, lightThemeColor]\n   */\n  backgroundColors?: string[];\n  /**\n   * Top and bottom padding for the badge\n   */\n  verticalPadding?: number;\n  /**\n   * Left and right padding for the badge\n   */\n  horizontalPadding?: number;\n  /**\n   * Height of the badge\n   */\n  height?: number;\n  /**\n   * Minimum height of the badge\n   */\n  minHeight?: number;\n  /**\n   * Width of the badge\n   */\n  width?: number;\n  /**\n   * Minimum width of the badge\n   */\n  minWidth?: number;\n  /**\n   * Border colors in the manner of [darkThemeColor, lightThemeColor]. When provided, a 1px solid border is applied.\n   */\n  borderColors?: string[];\n};\n\n/*\n * NMB-3998 §C.2: `props` is spread onto `S.Badge`, 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 BadgeOwnProps`);\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.Badge>, keyof BadgeOwnProps> &\n  BadgeOwnProps;\n\n/**\n * Badges show a bubble containing a `number` or a `string`. It may be used by itself or with children passed as props\n * (to display a badge on top of an icon, for example, pass the icon as the child).\n *\n * If the badge content is passed as a `float`, it will be rounded up to the nearest `integer`,\n * and if the number is higher than 1 000 or 1 000 000 it will be abbreviated to for example \"1.4K\" or \"1.4M\" respectively.\n * If you need to display a `float` instead of a rounded `integer`, pass it as a `string` instead (e.g. \"1,4\").\n *\n * ### Import\n *\n * ``` js\n * import { Badge } from '@ntbjs/react-components/data'\n * // or\n * import Badge from '@ntbjs/react-components/data/Badge'\n * ```\n * ## Props\n * ```\n * Pass `badgeIcon={<svg></svg>}` to display an icon.\n * Pass a number or string to the badgeContent to display it alongside the icon.\n * Pass `align={\"left\"}`or `align={\"center\"}` to align content.\n * Pass `elevated={true}` to display the badge on top of the children\n * Pass `active={true}` to reflect the active status of the badge\n * Pass `error={true}` to reflect the error status of the badge\n * Pass `warning={true}` to reflect the warning status of the badge\n * Pass `fontSize={15}` to set the font size of the badge in pixel\n * Pass `fontWeight={500}` to set the font weight of the badge\n * Pass `lineHeight={12}` to set the line height of the badge in pixel\n * Pass `colors={[#ffffff, #000000]}` to set the font color of the badge\n * Pass `backgroundColors={[#ffffff, #000000]}` to set the background color of the badge\n * Pass `verticalPadding={15}` to set the bottom and top padding of the badge in pixel\n * Pass `horizontalPadding={20}` to set the left and right padding of the badge in pixel\n * Pass `height={24}` to set the height of the badge in pixel\n * Pass `minHeight={24}` to set the minimum height of the badge in pixel\n * Pass `width={50}` to set the width of the badge in pixel\n * Pass `minWidth={32}` to set the minimum width of the badge in pixel\n *  ```\n */\nconst Badge = React.forwardRef<any, Props>(function Badge(\n  {\n    badgeContent,\n    badgeIcon = null,\n    children,\n    elevated = false,\n    fontSize,\n    fontWeight = 'normal',\n    lineHeight = 'normal',\n    active = false,\n    error = false,\n    warning = false,\n    backgroundColors,\n    colors,\n    verticalPadding,\n    horizontalPadding,\n    height,\n    minHeight,\n    width,\n    minWidth,\n    borderColors,\n    ...props\n  },\n  forwardedRef\n) {\n  if (typeof badgeContent === 'number') {\n    badgeContent = Intl.NumberFormat('en', { notation: 'compact' }).format(badgeContent);\n  }\n\n  return (\n    <S.Badge ref={forwardedRef} $elevated={elevated} $hasChildren={Boolean(children)} {...props}>\n      {children && <S.BadgeChildrenContainer>{children}</S.BadgeChildrenContainer>}\n      {(badgeIcon || badgeContent) && (\n        <S.BadgeLabel\n          $backgroundColors={backgroundColors}\n          $colors={colors}\n          $elevated={elevated}\n          fontSize={fontSize}\n          fontWeight={fontWeight}\n          $lineHeight={lineHeight}\n          $active={active}\n          $error={error}\n          $warning={warning}\n          $elevatedverticalPadding={verticalPadding}\n          $horizontalPadding={horizontalPadding}\n          height={height}\n          $minHeight={minHeight}\n          width={width}\n          $minWidth={minWidth}\n          $borderColors={borderColors}\n        >\n          {badgeIcon && <S.BadgeIcon $useGutter={!!badgeContent}>{badgeIcon}</S.BadgeIcon>}\n          {badgeContent}\n        </S.BadgeLabel>\n      )}\n    </S.Badge>\n  );\n});\n\nexport default Badge;\n"],"names":["Badge","React","forwardRef","badgeContent","badgeIcon","children","elevated","fontSize","fontWeight","lineHeight","active","error","warning","backgroundColors","colors","verticalPadding","horizontalPadding","height","minHeight","width","minWidth","borderColors","props","forwardedRef","Intl","NumberFormat","notation","format","_jsxs","S","ref","$elevated","$hasChildren","Boolean","_jsx","$backgroundColors","$colors","$lineHeight","$active","$error","$warning","$elevatedverticalPadding","$horizontalPadding","$minHeight","$minWidth","$borderColors","$useGutter"],"mappings":";;;;AA0IA,MAAMA,KAAK,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,KAAKA,CACvD;EACEG,YAAY;AACZC,EAAAA,SAAS,GAAG,IAAI;EAChBC,QAAQ;AACRC,EAAAA,QAAQ,GAAG,KAAK;EAChBC,QAAQ;AACRC,EAAAA,UAAU,GAAG,QAAQ;AACrBC,EAAAA,UAAU,GAAG,QAAQ;AACrBC,EAAAA,MAAM,GAAG,KAAK;AACdC,EAAAA,KAAK,GAAG,KAAK;AACbC,EAAAA,OAAO,GAAG,KAAK;EACfC,gBAAgB;EAChBC,MAAM;EACNC,eAAe;EACfC,iBAAiB;EACjBC,MAAM;EACNC,SAAS;EACTC,KAAK;EACLC,QAAQ;EACRC,YAAY;EACZ,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;AACA,EAAA,IAAI,OAAOpB,YAAY,KAAK,QAAQ,EAAE;AACpCA,IAAAA,YAAY,GAAGqB,IAAI,CAACC,YAAY,CAAC,IAAI,EAAE;AAAEC,MAAAA,QAAQ,EAAE;AAAU,KAAC,CAAC,CAACC,MAAM,CAACxB,YAAY,CAAC;AACtF,EAAA;AAEA,EAAA,OACEyB,IAAA,CAACC,OAAO,EAAA;AAACC,IAAAA,GAAG,EAAEP,YAAa;AAACQ,IAAAA,SAAS,EAAEzB,QAAS;AAAC0B,IAAAA,YAAY,EAAEC,OAAO,CAAC5B,QAAQ,CAAE;AAAA,IAAA,GAAKiB,KAAK;AAAAjB,IAAAA,QAAA,GACxFA,QAAQ,IAAI6B,GAAA,CAACL,sBAAwB,EAAA;AAAAxB,MAAAA,QAAA,EAAEA;KAAmC,CAAC,EAC3E,CAACD,SAAS,IAAID,YAAY,KACzByB,IAAA,CAACC,UAAY,EAAA;AACXM,MAAAA,iBAAiB,EAAEtB,gBAAiB;AACpCuB,MAAAA,OAAO,EAAEtB,MAAO;AAChBiB,MAAAA,SAAS,EAAEzB,QAAS;AACpBC,MAAAA,QAAQ,EAAEA,QAAS;AACnBC,MAAAA,UAAU,EAAEA,UAAW;AACvB6B,MAAAA,WAAW,EAAE5B,UAAW;AACxB6B,MAAAA,OAAO,EAAE5B,MAAO;AAChB6B,MAAAA,MAAM,EAAE5B,KAAM;AACd6B,MAAAA,QAAQ,EAAE5B,OAAQ;AAClB6B,MAAAA,wBAAwB,EAAE1B,eAAgB;AAC1C2B,MAAAA,kBAAkB,EAAE1B,iBAAkB;AACtCC,MAAAA,MAAM,EAAEA,MAAO;AACf0B,MAAAA,UAAU,EAAEzB,SAAU;AACtBC,MAAAA,KAAK,EAAEA,KAAM;AACbyB,MAAAA,SAAS,EAAExB,QAAS;AACpByB,MAAAA,aAAa,EAAExB,YAAa;AAAAhB,MAAAA,QAAA,GAE3BD,SAAS,IAAI8B,GAAA,CAACL,SAAW,EAAA;QAACiB,UAAU,EAAE,CAAC,CAAC3C,YAAa;AAAAE,QAAAA,QAAA,EAAED;OAAuB,CAAC,EAC/ED,YAAY;AAAA,KACD,CACf;AAAA,GACM,CAAC;AAEd,CAAC;;;;"}
+{"version":3,"file":"Badge.js","sources":["../../../src/components/data/Badge/Badge.tsx"],"sourcesContent":["import React from 'react';\nimport * as S from './Badge.styled';\n\ntype BadgeOwnProps = {\n  /**\n   * An Icon to show in the badge alongside with a text\n   */\n  badgeIcon?: React.ReactNode;\n  /**\n   * Content to be showed in the badge – e.g. number of results.\n   * ReactNode, not the union — func is never valid, null was missing.\n   */\n  badgeContent?: React.ReactNode;\n  /**\n   * The element(s) for which the badge will be displayed – e.g. an icon or a text.\n   */\n  children?: React.ReactNode | string;\n  /**\n   * Whether the badge should be displayed in an elevated position on top of the child element(s) or not.\n   */\n  elevated?: boolean;\n  /**\n   * Whether the element is active or not (e.g. the currently selected menu item). This changes the color of the badge.\n   */\n  active?: boolean;\n  /**\n   * There is an error present – 'error be prioritized over warnings if both are set to `true`.\n   */\n  error?: boolean;\n  /**\n   * There is a warning present.\n   */\n  warning?: boolean;\n  /**\n   * Font size for the badge\n   */\n  fontSize?: number | string;\n  /**\n   * Font weight for the badge\n   */\n  fontWeight?: number | string;\n  /**\n   * Line weight for the badge\n   */\n  lineHeight?: number | string;\n  /**\n   * Colors of the font in the manner of [darkThemeColor, lightThemeColor]\n   */\n  colors?: string[];\n  /**\n   * Background colors for the badge in the manner of [darkThemeColor, lightThemeColor]\n   */\n  backgroundColors?: string[];\n  /**\n   * Top and bottom padding for the badge\n   */\n  verticalPadding?: number;\n  /**\n   * Left and right padding for the badge\n   */\n  horizontalPadding?: number;\n  /**\n   * Height of the badge\n   */\n  height?: number;\n  /**\n   * Minimum height of the badge\n   */\n  minHeight?: number;\n  /**\n   * Width of the badge\n   */\n  width?: number;\n  /**\n   * Minimum width of the badge\n   */\n  minWidth?: number;\n  /**\n   * Border colors in the manner of [darkThemeColor, lightThemeColor]. When provided, a 1px solid border is applied.\n   */\n  borderColors?: string[];\n};\n\n// Omit before & — a bare intersection narrows colliding props instead of overriding them.\ntype Props = Omit<React.ComponentPropsWithoutRef<typeof S.Badge>, keyof BadgeOwnProps> &\n  BadgeOwnProps;\n\n/**\n * Badges show a bubble containing a `number` or a `string`. It may be used by itself or with children passed as props\n * (to display a badge on top of an icon, for example, pass the icon as the child).\n *\n * If the badge content is passed as a `float`, it will be rounded up to the nearest `integer`,\n * and if the number is higher than 1 000 or 1 000 000 it will be abbreviated to for example \"1.4K\" or \"1.4M\" respectively.\n * If you need to display a `float` instead of a rounded `integer`, pass it as a `string` instead (e.g. \"1,4\").\n *\n * ### Import\n *\n * ``` js\n * import { Badge } from '@ntbjs/react-components/data'\n * // or\n * import Badge from '@ntbjs/react-components/data/Badge'\n * ```\n * ## Props\n * ```\n * Pass `badgeIcon={<svg></svg>}` to display an icon.\n * Pass a number or string to the badgeContent to display it alongside the icon.\n * Pass `align={\"left\"}`or `align={\"center\"}` to align content.\n * Pass `elevated={true}` to display the badge on top of the children\n * Pass `active={true}` to reflect the active status of the badge\n * Pass `error={true}` to reflect the error status of the badge\n * Pass `warning={true}` to reflect the warning status of the badge\n * Pass `fontSize={15}` to set the font size of the badge in pixel\n * Pass `fontWeight={500}` to set the font weight of the badge\n * Pass `lineHeight={12}` to set the line height of the badge in pixel\n * Pass `colors={[#ffffff, #000000]}` to set the font color of the badge\n * Pass `backgroundColors={[#ffffff, #000000]}` to set the background color of the badge\n * Pass `verticalPadding={15}` to set the bottom and top padding of the badge in pixel\n * Pass `horizontalPadding={20}` to set the left and right padding of the badge in pixel\n * Pass `height={24}` to set the height of the badge in pixel\n * Pass `minHeight={24}` to set the minimum height of the badge in pixel\n * Pass `width={50}` to set the width of the badge in pixel\n * Pass `minWidth={32}` to set the minimum width of the badge in pixel\n *  ```\n */\nconst Badge = React.forwardRef<any, Props>(function Badge(\n  {\n    badgeContent,\n    badgeIcon = null,\n    children,\n    elevated = false,\n    fontSize,\n    fontWeight = 'normal',\n    lineHeight = 'normal',\n    active = false,\n    error = false,\n    warning = false,\n    backgroundColors,\n    colors,\n    verticalPadding,\n    horizontalPadding,\n    height,\n    minHeight,\n    width,\n    minWidth,\n    borderColors,\n    ...props\n  },\n  forwardedRef\n) {\n  if (typeof badgeContent === 'number') {\n    badgeContent = Intl.NumberFormat('en', { notation: 'compact' }).format(badgeContent);\n  }\n\n  return (\n    <S.Badge ref={forwardedRef} $elevated={elevated} $hasChildren={Boolean(children)} {...props}>\n      {children && <S.BadgeChildrenContainer>{children}</S.BadgeChildrenContainer>}\n      {(badgeIcon || badgeContent) && (\n        <S.BadgeLabel\n          $backgroundColors={backgroundColors}\n          $colors={colors}\n          $elevated={elevated}\n          fontSize={fontSize}\n          fontWeight={fontWeight}\n          $lineHeight={lineHeight}\n          $active={active}\n          $error={error}\n          $warning={warning}\n          $elevatedverticalPadding={verticalPadding}\n          $horizontalPadding={horizontalPadding}\n          height={height}\n          $minHeight={minHeight}\n          width={width}\n          $minWidth={minWidth}\n          $borderColors={borderColors}\n        >\n          {badgeIcon && <S.BadgeIcon $useGutter={!!badgeContent}>{badgeIcon}</S.BadgeIcon>}\n          {badgeContent}\n        </S.BadgeLabel>\n      )}\n    </S.Badge>\n  );\n});\n\nexport default Badge;\n"],"names":["Badge","React","forwardRef","badgeContent","badgeIcon","children","elevated","fontSize","fontWeight","lineHeight","active","error","warning","backgroundColors","colors","verticalPadding","horizontalPadding","height","minHeight","width","minWidth","borderColors","props","forwardedRef","Intl","NumberFormat","notation","format","_jsxs","S","ref","$elevated","$hasChildren","Boolean","_jsx","$backgroundColors","$colors","$lineHeight","$active","$error","$warning","$elevatedverticalPadding","$horizontalPadding","$minHeight","$minWidth","$borderColors","$useGutter"],"mappings":";;;;AA4HA,MAAMA,KAAK,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,KAAKA,CACvD;EACEG,YAAY;AACZC,EAAAA,SAAS,GAAG,IAAI;EAChBC,QAAQ;AACRC,EAAAA,QAAQ,GAAG,KAAK;EAChBC,QAAQ;AACRC,EAAAA,UAAU,GAAG,QAAQ;AACrBC,EAAAA,UAAU,GAAG,QAAQ;AACrBC,EAAAA,MAAM,GAAG,KAAK;AACdC,EAAAA,KAAK,GAAG,KAAK;AACbC,EAAAA,OAAO,GAAG,KAAK;EACfC,gBAAgB;EAChBC,MAAM;EACNC,eAAe;EACfC,iBAAiB;EACjBC,MAAM;EACNC,SAAS;EACTC,KAAK;EACLC,QAAQ;EACRC,YAAY;EACZ,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;AACA,EAAA,IAAI,OAAOpB,YAAY,KAAK,QAAQ,EAAE;AACpCA,IAAAA,YAAY,GAAGqB,IAAI,CAACC,YAAY,CAAC,IAAI,EAAE;AAAEC,MAAAA,QAAQ,EAAE;AAAU,KAAC,CAAC,CAACC,MAAM,CAACxB,YAAY,CAAC;AACtF,EAAA;AAEA,EAAA,OACEyB,IAAA,CAACC,OAAO,EAAA;AAACC,IAAAA,GAAG,EAAEP,YAAa;AAACQ,IAAAA,SAAS,EAAEzB,QAAS;AAAC0B,IAAAA,YAAY,EAAEC,OAAO,CAAC5B,QAAQ,CAAE;AAAA,IAAA,GAAKiB,KAAK;AAAAjB,IAAAA,QAAA,GACxFA,QAAQ,IAAI6B,GAAA,CAACL,sBAAwB,EAAA;AAAAxB,MAAAA,QAAA,EAAEA;KAAmC,CAAC,EAC3E,CAACD,SAAS,IAAID,YAAY,KACzByB,IAAA,CAACC,UAAY,EAAA;AACXM,MAAAA,iBAAiB,EAAEtB,gBAAiB;AACpCuB,MAAAA,OAAO,EAAEtB,MAAO;AAChBiB,MAAAA,SAAS,EAAEzB,QAAS;AACpBC,MAAAA,QAAQ,EAAEA,QAAS;AACnBC,MAAAA,UAAU,EAAEA,UAAW;AACvB6B,MAAAA,WAAW,EAAE5B,UAAW;AACxB6B,MAAAA,OAAO,EAAE5B,MAAO;AAChB6B,MAAAA,MAAM,EAAE5B,KAAM;AACd6B,MAAAA,QAAQ,EAAE5B,OAAQ;AAClB6B,MAAAA,wBAAwB,EAAE1B,eAAgB;AAC1C2B,MAAAA,kBAAkB,EAAE1B,iBAAkB;AACtCC,MAAAA,MAAM,EAAEA,MAAO;AACf0B,MAAAA,UAAU,EAAEzB,SAAU;AACtBC,MAAAA,KAAK,EAAEA,KAAM;AACbyB,MAAAA,SAAS,EAAExB,QAAS;AACpByB,MAAAA,aAAa,EAAExB,YAAa;AAAAhB,MAAAA,QAAA,GAE3BD,SAAS,IAAI8B,GAAA,CAACL,SAAW,EAAA;QAACiB,UAAU,EAAE,CAAC,CAAC3C,YAAa;AAAAE,QAAAA,QAAA,EAAED;OAAuB,CAAC,EAC/ED,YAAY;AAAA,KACD,CACf;AAAA,GACM,CAAC;AAEd,CAAC;;;;"}

package/build/data/Badge/Badge.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.styled.js","sources":["../../../src/components/data/Badge/Badge.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 * THIS IS THE MOST DEFECT-DENSE FILE OF THE `data/` BATCH: `BadgeLabel` reads eight keys\n * that are not what the component passes. Four are non-`$` reads of props the component\n * DOES pass, so they also leak to the DOM (`fontSize`, `fontWeight`, `height`, `width`);\n * three are reads of keys nothing passes at all, so the branch is dead (`elevated`,\n * `verticalPadding`, `error`); and one is the mirror image — `$elevatedverticalPadding`,\n * a run-together name of the §E.3 family, is passed and never read.\n *\n * ALL OF THEM ARE DECLARED HERE AND NONE IS FIXED HERE. Repointing a dead read or\n * dropping a `$`-less one changes rendered CSS or rendered DOM, which is C10 work with a\n * baseline re-record (§J.8). Each declaration below names its own fix.\n *\n * WHOEVER DOES THAT C10 WORK: THE BLAST RADIUS IS LARGER THAN THIS COMPONENT.\n * `data/SeverityBadge` wraps `Badge`, so it carries the same three leaked attributes in the\n * recorded baseline (`font-size`, `font-weight`, `height` on its label `<span>`) and its\n * entries move too.\n */\nimport styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n/** Props of the `Badge` root, i.e. what `Badge.tsx` passes to `S.Badge`. */\nexport interface BadgeStyleProps {\n  /** `elevated` — `PropTypes.bool`; positions the label on top of the children. */\n  $elevated?: boolean;\n  /** `Boolean(children)`, derived in the component, so genuinely `boolean`. */\n  $hasChildren?: boolean;\n}\n\n/**\n * Props of `BadgeLabel`. Value types from `Badge.tsx`'s propTypes; all optional per §J.5.\n *\n * Read the file header before adding to this list: eight of these members exist because\n * the template and the component disagree about the key, not because they are wanted.\n */\ninterface BadgeLabelStyleProps {\n  /** `elevated` — drives border-radius, margin, position and transform below. */\n  $elevated?: boolean;\n  /** `active` — `PropTypes.bool`. */\n  $active?: boolean;\n  /** `error` — `PropTypes.bool`. Takes priority over `$warning`. */\n  $error?: boolean;\n  /** `warning` — `PropTypes.bool`. */\n  $warning?: boolean;\n  /**\n   * `lineHeight` — `PropTypes.oneOfType([number, string])`.\n   *\n   * DEFECT, DECLARED NOT FIXED: `Badge.tsx` DEFAULTS `lineHeight` TO THE STRING\n   * `'normal'`, and the template emits `${props.$lineHeight}px` whenever the value is\n   * truthy — so every Badge that does not override it renders the invalid declaration\n   * `line-height: normalpx`, which browsers drop. The effect happens to match the\n   * intended `normal`, which is why it has gone unnoticed. Fixing it (default `undefined`,\n   * or a unit-aware interpolation) changes the emitted CSS text, so it is C10 work.\n   */\n  $lineHeight?: number | string;\n  /** `horizontalPadding` — `PropTypes.number`, px. The one padding key that matches. */\n  $horizontalPadding?: number;\n  /** `minHeight` — `PropTypes.number`, px. */\n  $minHeight?: number;\n  /** `minWidth` — `PropTypes.number`, px. */\n  $minWidth?: number;\n  /** `backgroundColors` — `[darkThemeColor, lightThemeColor]`, read by index. */\n  $backgroundColors?: string[];\n  /** `colors` — font colour as `[darkThemeColor, lightThemeColor]`, read by index. */\n  $colors?: string[];\n  /** `borderColors` — `[dark, light]`; when set, a 1px solid border is applied. */\n  $borderColors?: string[];\n  /**\n   * `verticalPadding` — `PropTypes.number`, px.\n   *\n   * DEFECT, DECLARED NOT FIXED, AND IT IS THE §E.3 RUN-TOGETHER-NAME FAMILY.\n   * `Badge.tsx:85` passes `$elevatedverticalPadding={verticalPadding}` — `$elevated` and\n   * `verticalPadding` run together — while the template below reads the plain\n   * `verticalPadding`. Neither name is the other's, so BOTH sides are dead: nothing ever\n   * supplies the key this reads, and nothing ever reads the key the component supplies.\n   * `verticalPadding` has therefore never had any effect; every Badge falls through to\n   * the `$elevated ? '4px' : '6px'` default.\n   *\n   * The fix is to make both ends `$verticalPadding`, which ACTIVATES A BRANCH THAT HAS\n   * NEVER FIRED and so changes rendered padding. C10, with a re-record.\n   */\n  verticalPadding?: number;\n  /**\n   * `$elevatedverticalPadding` — the key `Badge.tsx:85` actually passes. DECLARED BECAUSE\n   * THE COMPONENT PASSES IT, NOT BECAUSE ANYTHING READS IT; see `verticalPadding` above.\n   * Harmless in the DOM (the `$` prefix means `shouldForwardProp` still filters it), so\n   * unlike the four leaks below this one is invisible rather than wrong.\n   */\n  $elevatedverticalPadding?: number;\n  /**\n   * `elevated` in its non-`$` form — read at the `font-size` block below, and NEVER\n   * PASSED (the component passes `$elevated`).\n   *\n   * DEFECT, DECLARED NOT FIXED: the ternary always takes the false arm, so an elevated\n   * Badge renders `font-size: 0.750rem` instead of the intended `0.625rem`. Fix: read\n   * `props.$elevated`, which is already declared above — a CSS change, so C10.\n   */\n  elevated?: boolean;\n  /**\n   * `error` in its non-`$` form — read inside the dark-mode `color` callback, and NEVER\n   * PASSED.\n   *\n   * DEFECT, DECLARED NOT FIXED: it makes the second disjunct of\n   * `(props.$warning && !props.$error) || (props.error && !props.$active)` permanently\n   * `false`, so an inactive error Badge never gets the `gray-900` text colour in dark\n   * mode. Fix: `props.$error` — a colour change, so C10.\n   */\n  error?: boolean;\n  /**\n   * `fontSize` — `PropTypes.oneOfType([number, string])`.\n   *\n   * DEFECT, DECLARED NOT FIXED: no `$`. `Badge.tsx:79` passes it and\n   * `shouldForwardProp` forwards every non-`$` prop, so a caller-supplied `fontSize` also\n   * lands on the rendered `<span>` — AS `font-size=\"15\"`, NOT `fontSize=\"15\"`: React maps\n   * this particular camelCase name to its hyphenated attribute form. CONFIRMED, not\n   * inferred: `scripts/r19-harness/baseline.json` records `<span font-size=\"12\" …>` for\n   * every `data/Badge` entry. Note the `string` half of the propTypes union is also a\n   * trap: the template emits `${props.fontSize}px`, so `fontSize=\"15px\"` would render\n   * `15pxpx`. Fix: `$fontSize` at both ends — removes a DOM attribute, so C10. §E.4's\n   * third case.\n   */\n  fontSize?: number | string;\n  /**\n   * `fontWeight` — `PropTypes.oneOfType([number, string])`, interpolated raw so both\n   * halves are safe. Same non-`$` DOM leak as `fontSize`, hyphenated the same way, and\n   * this is the UNCONDITIONAL one: `Badge.tsx:80` passes it and `Badge.tsx:49` defaults it\n   * to `'normal'`, so `font-weight=\"normal\"` is on EVERY rendered label whether the caller\n   * sets anything or not. Verified by rendering `<Badge badgeContent={5} />` with no other\n   * prop. Fix: `$fontWeight` at both ends — C10.\n   */\n  fontWeight?: number | string;\n  /**\n   * `height` — `PropTypes.number`, px. Same non-`$` DOM leak; `Badge.tsx:87` passes it.\n   * `height` is not a valid attribute on a `<span>`. CONFIRMED: the baseline records\n   * `<span … height=\"24\" …>` for every `data/Badge` entry. Fix: `$height` — C10.\n   */\n  height?: number;\n  /**\n   * `width` — `PropTypes.number`, px. Same non-`$` DOM leak; `Badge.tsx:89` passes it. No\n   * baseline fixture sets it, so it is absent there, but rendering the built `Badge` with\n   * `width={50}` puts `width=\"50\"` on the `<span>`. Fix: `$width` — C10.\n   */\n  width?: number;\n}\n\n/** Props of `BadgeIcon`. */\ninterface BadgeIconStyleProps {\n  /** `!!badgeContent`, derived in the component — adds the gutter between icon and text. */\n  $useGutter?: 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 Badge = styled.span\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs<BadgeStyleProps>(applyDefaultTheme)`\n  align-content: center;\n  display: ${props => (props.$elevated || !props.$hasChildren ? 'inline-flex' : 'flex')};\n  font-family: ${props => props.theme.primaryFontFamily};\n  font-size: 1rem;\n  font-weight: 500;\n  min-height: 24px;\n  position: relative;\n  width: ${props => (props.$elevated ? 'fit-content' : 'initial')};\n`;\n\nexport const BadgeChildrenContainer = styled.span\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs(applyDefaultTheme)`\n  align-self: center;\n  height: fit-content;\n  margin-right: 8px;\n`;\n\nexport const BadgeLabel = styled.span\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs<BadgeLabelStyleProps>(applyDefaultTheme)`\n  border-radius: ${props => (props.$elevated ? '12px' : '14px')};\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n\n  font-size: ${props => {\n    if (props.fontSize) {\n      return `${props.fontSize}px`;\n    } else {\n      return props.elevated ? '0.625rem' : '0.750rem';\n    }\n  }};\n  font-weight: ${props => (props.fontWeight ? props.fontWeight : 'normal')};\n  line-height: ${props => (props.$lineHeight ? `${props.$lineHeight}px` : 'normal')};\n  height: ${props => (props.height ? `${props.height}px` : 'fit-content')};\n  letter-spacing: 0.32px;\n  margin-left: ${props => (props.$elevated ? '15px' : 'auto')};\n  position: ${props => (props.$elevated ? 'absolute' : 'initial')};\n  right: 0;\n  transform: ${props => (props.$elevated ? 'translate(33%, -8px)' : 'initial')};\n\n  ${props =>\n    props.width\n      ? css`\n          width: ${props.width}px;\n        `\n      : null}\n\n  ${props =>\n    props.$minWidth\n      ? css`\n          min-width: ${props.$minWidth}px;\n        `\n      : null}\n\n  ${props =>\n    props.$minHeight\n      ? css`\n          min-height: ${props.$minHeight}px;\n        `\n      : null}\n\n  ${props => {\n    const verticalPadding = props.verticalPadding\n      ? `${props.verticalPadding}px`\n      : props.$elevated\n        ? '4px'\n        : '6px';\n    const horizontalPadding = props.$horizontalPadding\n      ? `${props.$horizontalPadding}px`\n      : props.$elevated\n        ? '7px'\n        : '10px';\n    return css`\n      padding: ${verticalPadding} ${horizontalPadding};\n    `;\n  }}\n\n  ${props =>\n    props.theme.themeProp(\n      'background',\n      () => {\n        const active = props.$active;\n        const error = props.$error;\n        const warning = props.$warning;\n\n        const defaultBgColor = props?.$backgroundColors?.[0] ?? props.theme.getColor('gray-600');\n\n        switch (true) {\n          case !error && !warning && !active:\n            return defaultBgColor;\n\n          case !error && !warning && active:\n            return props.theme.getColor('gray-700');\n\n          case error && active:\n            return props.theme.getColor('red-500');\n\n          case error:\n            return props.theme.getColor('red-200');\n\n          case warning && active:\n            return props.theme.getColor('signal-yellow-500');\n\n          case warning:\n            return props.theme.getColor('signal-yellow-400');\n\n          default:\n            return props.theme.getColor('gray-600');\n        }\n      },\n      () => {\n        const active = props.$active;\n        const error = props.$error;\n        const warning = props.$warning;\n\n        const defaultBgColor = props?.$backgroundColors?.[1] ?? props.theme.getColor('gray-200');\n\n        switch (true) {\n          case !error && !warning && !active:\n            return defaultBgColor;\n\n          case !error && !warning && active:\n            return props.theme.getColor('white');\n\n          case error && active:\n            return props.theme.getColor('red-500');\n\n          case error:\n            return props.theme.getColor('red-200');\n\n          case warning && active:\n            return props.theme.getColor('signal-yellow-500');\n\n          case warning:\n            return props.theme.getColor('signal-yellow-400');\n\n          default:\n            return props.theme.getColor('gray-200');\n        }\n      }\n    )}\n\n    ${props =>\n      props.theme.themeProp(\n        'color',\n        () => {\n          const defaultColor = props?.$colors?.[0] ?? props.theme.getColor('white');\n          if ((props.$warning && !props.$error) || (props.error && !props.$active)) {\n            return props.theme.getColor('gray-900');\n          } else {\n            return defaultColor;\n          }\n        },\n        () => {\n          const defaultColor = props?.$colors?.[1] ?? props.theme.getColor('gray-900');\n          if (props.$error && props.$active) {\n            return props.theme.getColor('white');\n          } else {\n            return defaultColor;\n          }\n        }\n      )}\n\n    ${props =>\n      props.$borderColors &&\n      css`\n        border: 1px solid;\n        ${props.theme.themeProp('border-color', props.$borderColors[0], props.$borderColors[1])}\n      `}\n`;\n\nexport const BadgeIcon = styled.span\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs<BadgeIconStyleProps>(applyDefaultTheme)`\n  display: flex;\n  align-items: center;\n  margin-right: ${props => (props.$useGutter ? '4px' : 0)};\n  svg {\n    height: 12px;\n  }\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Badge","styled","span","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","$elevated","$hasChildren","theme","primaryFontFamily","BadgeChildrenContainer","BadgeLabel","fontSize","elevated","fontWeight","$lineHeight","height","width","css","$minWidth","$minHeight","verticalPadding","horizontalPadding","$horizontalPadding","themeProp","active","$active","error","$error","warning","$warning","defaultBgColor","$backgroundColors","getColor","defaultColor","$colors","$borderColors","BadgeIcon","$useGutter"],"mappings":";;;AA+JA,MAAMA,iBAAiB,GAAIC,IAAY,IAAc;EACnD,OAAOA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAClD,CAAC;AAEM,MAAMC,KAAK,GAAGC,MAAM,CAACC,IAAI,CAC7BC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAAkBC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,oBAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,+BAAA,EAAA,eAAA,EAAA,0EAAA,EAAA,GAAA,CAAA,EAE/BC,KAAK,IAAKA,KAAK,CAACC,SAAS,IAAI,CAACD,KAAK,CAACE,YAAY,GAAG,aAAa,GAAG,MAAO,EACtEF,KAAK,IAAIA,KAAK,CAACG,KAAK,CAACC,iBAAiB,EAK5CJ,KAAK,IAAKA,KAAK,CAACC,SAAS,GAAG,aAAa,GAAG,SAAU;AAG1D,MAAMI,sBAAsB,GAAGZ,MAAM,CAACC,IAAI,CAC9CC,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,wDAAA,CAAA;AAMpB,MAAMO,UAAU,GAAGb,MAAM,CAACC,IAAI,CAClCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAAuBC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,yBAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,gBAAA,EAAA,0FAAA,EAAA,eAAA,EAAA,eAAA,EAAA,UAAA,EAAA,qCAAA,EAAA,YAAA,EAAA,qBAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,EAAA,CAAA,EAC9BC,KAAK,IAAKA,KAAK,CAACC,SAAS,GAAG,MAAM,GAAG,MAAO,EAMhDD,KAAK,IAAI;EACpB,IAAIA,KAAK,CAACO,QAAQ,EAAE;AAClB,IAAA,OAAO,CAAA,EAAGP,KAAK,CAACO,QAAQ,CAAA,EAAA,CAAI;AAC9B,EAAA,CAAC,MAAM;AACL,IAAA,OAAOP,KAAK,CAACQ,QAAQ,GAAG,UAAU,GAAG,UAAU;AACjD,EAAA;AACF,CAAC,EACcR,KAAK,IAAKA,KAAK,CAACS,UAAU,GAAGT,KAAK,CAACS,UAAU,GAAG,QAAS,EACzDT,KAAK,IAAKA,KAAK,CAACU,WAAW,GAAG,CAAA,EAAGV,KAAK,CAACU,WAAW,CAAA,EAAA,CAAI,GAAG,QAAS,EACvEV,KAAK,IAAKA,KAAK,CAACW,MAAM,GAAG,CAAA,EAAGX,KAAK,CAACW,MAAM,CAAA,EAAA,CAAI,GAAG,aAAc,EAExDX,KAAK,IAAKA,KAAK,CAACC,SAAS,GAAG,MAAM,GAAG,MAAO,EAC/CD,KAAK,IAAKA,KAAK,CAACC,SAAS,GAAG,UAAU,GAAG,SAAU,EAElDD,KAAK,IAAKA,KAAK,CAACC,SAAS,GAAG,sBAAsB,GAAG,SAAU,EAE1ED,KAAK,IACLA,KAAK,CAACY,KAAK,GACPC,GAAG,CAAA,CAAA,QAAA,EAAA,KAAA,CAAA,EACQb,KAAK,CAACY,KAAK,CAAA,GAEtB,IAAI,EAERZ,KAAK,IACLA,KAAK,CAACc,SAAS,GACXD,GAAG,CAAA,CAAA,YAAA,EAAA,KAAA,CAAA,EACYb,KAAK,CAACc,SAAS,CAAA,GAE9B,IAAI,EAERd,KAAK,IACLA,KAAK,CAACe,UAAU,GACZF,GAAG,CAAA,CAAA,aAAA,EAAA,KAAA,CAAA,EACab,KAAK,CAACe,UAAU,CAAA,GAEhC,IAAI,EAERf,KAAK,IAAI;AACT,EAAA,MAAMgB,eAAe,GAAGhB,KAAK,CAACgB,eAAe,GACzC,GAAGhB,KAAK,CAACgB,eAAe,CAAA,EAAA,CAAI,GAC5BhB,KAAK,CAACC,SAAS,GACb,KAAK,GACL,KAAK;AACX,EAAA,MAAMgB,iBAAiB,GAAGjB,KAAK,CAACkB,kBAAkB,GAC9C,GAAGlB,KAAK,CAACkB,kBAAkB,CAAA,EAAA,CAAI,GAC/BlB,KAAK,CAACC,SAAS,GACb,KAAK,GACL,MAAM;AACZ,EAAA,OAAOY,GAAG,CAAA,CAAA,UAAA,EAAA,GAAA,EAAA,GAAA,CAAA,EACGG,eAAe,EAAIC,iBAAiB,CAAA;AAEnD,CAAC,EAECjB,KAAK,IACLA,KAAK,CAACG,KAAK,CAACgB,SAAS,CACnB,YAAY,EACZ,MAAM;AACJ,EAAA,MAAMC,MAAM,GAAGpB,KAAK,CAACqB,OAAO;AAC5B,EAAA,MAAMC,KAAK,GAAGtB,KAAK,CAACuB,MAAM;AAC1B,EAAA,MAAMC,OAAO,GAAGxB,KAAK,CAACyB,QAAQ;AAE9B,EAAA,MAAMC,cAAc,GAAG1B,KAAK,EAAE2B,iBAAiB,GAAG,CAAC,CAAC,IAAI3B,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,UAAU,CAAC;AAExF,EAAA,QAAQ,IAAI;AACV,IAAA,KAAK,CAACN,KAAK,IAAI,CAACE,OAAO,IAAI,CAACJ,MAAM;AAChC,MAAA,OAAOM,cAAc;AAEvB,IAAA,KAAK,CAACJ,KAAK,IAAI,CAACE,OAAO,IAAIJ,MAAM;AAC/B,MAAA,OAAOpB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,UAAU,CAAC;IAEzC,KAAKN,KAAK,IAAIF,MAAM;AAClB,MAAA,OAAOpB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,SAAS,CAAC;AAExC,IAAA,KAAKN,KAAK;AACR,MAAA,OAAOtB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,SAAS,CAAC;IAExC,KAAKJ,OAAO,IAAIJ,MAAM;AACpB,MAAA,OAAOpB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,mBAAmB,CAAC;AAElD,IAAA,KAAKJ,OAAO;AACV,MAAA,OAAOxB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,mBAAmB,CAAC;AAElD,IAAA;AACE,MAAA,OAAO5B,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,UAAU,CAAC;AAC3C;AACF,CAAC,EACD,MAAM;AACJ,EAAA,MAAMR,MAAM,GAAGpB,KAAK,CAACqB,OAAO;AAC5B,EAAA,MAAMC,KAAK,GAAGtB,KAAK,CAACuB,MAAM;AAC1B,EAAA,MAAMC,OAAO,GAAGxB,KAAK,CAACyB,QAAQ;AAE9B,EAAA,MAAMC,cAAc,GAAG1B,KAAK,EAAE2B,iBAAiB,GAAG,CAAC,CAAC,IAAI3B,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,UAAU,CAAC;AAExF,EAAA,QAAQ,IAAI;AACV,IAAA,KAAK,CAACN,KAAK,IAAI,CAACE,OAAO,IAAI,CAACJ,MAAM;AAChC,MAAA,OAAOM,cAAc;AAEvB,IAAA,KAAK,CAACJ,KAAK,IAAI,CAACE,OAAO,IAAIJ,MAAM;AAC/B,MAAA,OAAOpB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,OAAO,CAAC;IAEtC,KAAKN,KAAK,IAAIF,MAAM;AAClB,MAAA,OAAOpB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,SAAS,CAAC;AAExC,IAAA,KAAKN,KAAK;AACR,MAAA,OAAOtB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,SAAS,CAAC;IAExC,KAAKJ,OAAO,IAAIJ,MAAM;AACpB,MAAA,OAAOpB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,mBAAmB,CAAC;AAElD,IAAA,KAAKJ,OAAO;AACV,MAAA,OAAOxB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,mBAAmB,CAAC;AAElD,IAAA;AACE,MAAA,OAAO5B,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,UAAU,CAAC;AAC3C;AACF,CACF,CAAC,EAEC5B,KAAK,IACLA,KAAK,CAACG,KAAK,CAACgB,SAAS,CACnB,OAAO,EACP,MAAM;AACJ,EAAA,MAAMU,YAAY,GAAG7B,KAAK,EAAE8B,OAAO,GAAG,CAAC,CAAC,IAAI9B,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,OAAO,CAAC;AACzE,EAAA,IAAK5B,KAAK,CAACyB,QAAQ,IAAI,CAACzB,KAAK,CAACuB,MAAM,IAAMvB,KAAK,CAACsB,KAAK,IAAI,CAACtB,KAAK,CAACqB,OAAQ,EAAE;AACxE,IAAA,OAAOrB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,UAAU,CAAC;AACzC,EAAA,CAAC,MAAM;AACL,IAAA,OAAOC,YAAY;AACrB,EAAA;AACF,CAAC,EACD,MAAM;AACJ,EAAA,MAAMA,YAAY,GAAG7B,KAAK,EAAE8B,OAAO,GAAG,CAAC,CAAC,IAAI9B,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,UAAU,CAAC;AAC5E,EAAA,IAAI5B,KAAK,CAACuB,MAAM,IAAIvB,KAAK,CAACqB,OAAO,EAAE;AACjC,IAAA,OAAOrB,KAAK,CAACG,KAAK,CAACyB,QAAQ,CAAC,OAAO,CAAC;AACtC,EAAA,CAAC,MAAM;AACL,IAAA,OAAOC,YAAY;AACrB,EAAA;AACF,CACF,CAAC,EAED7B,KAAK,IACLA,KAAK,CAAC+B,aAAa,IACnBlB,GAAG,CAAA,CAAA,mBAAA,EAAA,EAAA,CAAA,EAECb,KAAK,CAACG,KAAK,CAACgB,SAAS,CAAC,cAAc,EAAEnB,KAAK,CAAC+B,aAAa,CAAC,CAAC,CAAC,EAAE/B,KAAK,CAAC+B,aAAa,CAAC,CAAC,CAAC,CAAC,CACxF;AAGA,MAAMC,SAAS,GAAGvC,MAAM,CAACC,IAAI,CACjCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAAsBC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,wBAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,+CAAA,EAAA,oBAAA,CAAA,EAG9BC,KAAK,IAAKA,KAAK,CAACiC,UAAU,GAAG,KAAK,GAAG,CAAE;;;;"}
+{"version":3,"file":"Badge.styled.js","sources":["../../../src/components/data/Badge/Badge.styled.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nexport interface BadgeStyleProps {\n  $elevated?: boolean;\n  $hasChildren?: boolean;\n}\n\ninterface BadgeLabelStyleProps {\n  $elevated?: boolean;\n  $active?: boolean;\n  $error?: boolean;\n  $warning?: boolean;\n  $lineHeight?: number | string;\n  $horizontalPadding?: number;\n  $minHeight?: number;\n  $minWidth?: number;\n  $backgroundColors?: string[];\n  $colors?: string[];\n  $borderColors?: string[];\n  verticalPadding?: number;\n  $elevatedverticalPadding?: number;\n  elevated?: boolean;\n  error?: boolean;\n  fontSize?: number | string;\n  fontWeight?: number | string;\n  height?: number;\n  width?: number;\n}\n\ninterface BadgeIconStyleProps {\n  $useGutter?: boolean;\n}\n\nconst shouldForwardProp = (prop: string): boolean => {\n  return prop !== 'theme' && !prop.startsWith('$');\n};\n\nexport const Badge = styled.span\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs<BadgeStyleProps>(applyDefaultTheme)`\n  align-content: center;\n  display: ${props => (props.$elevated || !props.$hasChildren ? 'inline-flex' : 'flex')};\n  font-family: ${props => props.theme.primaryFontFamily};\n  font-size: 1rem;\n  font-weight: 500;\n  min-height: 24px;\n  position: relative;\n  width: ${props => (props.$elevated ? 'fit-content' : 'initial')};\n`;\n\nexport const BadgeChildrenContainer = styled.span\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs(applyDefaultTheme)`\n  align-self: center;\n  height: fit-content;\n  margin-right: 8px;\n`;\n\nexport const BadgeLabel = styled.span\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs<BadgeLabelStyleProps>(applyDefaultTheme)`\n  border-radius: ${props => (props.$elevated ? '12px' : '14px')};\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n\n  font-size: ${props => {\n    if (props.fontSize) {\n      return `${props.fontSize}px`;\n    } else {\n      return props.elevated ? '0.625rem' : '0.750rem';\n    }\n  }};\n  font-weight: ${props => (props.fontWeight ? props.fontWeight : 'normal')};\n  line-height: ${props => (props.$lineHeight ? `${props.$lineHeight}px` : 'normal')};\n  height: ${props => (props.height ? `${props.height}px` : 'fit-content')};\n  letter-spacing: 0.32px;\n  margin-left: ${props => (props.$elevated ? '15px' : 'auto')};\n  position: ${props => (props.$elevated ? 'absolute' : 'initial')};\n  right: 0;\n  transform: ${props => (props.$elevated ? 'translate(33%, -8px)' : 'initial')};\n\n  ${props =>\n    props.width\n      ? css`\n          width: ${props.width}px;\n        `\n      : null}\n\n  ${props =>\n    props.$minWidth\n      ? css`\n          min-width: ${props.$minWidth}px;\n        `\n      : null}\n\n  ${props =>\n    props.$minHeight\n      ? css`\n          min-height: ${props.$minHeight}px;\n        `\n      : null}\n\n  ${props => {\n    const verticalPadding = props.verticalPadding\n      ? `${props.verticalPadding}px`\n      : props.$elevated\n        ? '4px'\n        : '6px';\n    const horizontalPadding = props.$horizontalPadding\n      ? `${props.$horizontalPadding}px`\n      : props.$elevated\n        ? '7px'\n        : '10px';\n    return css`\n      padding: ${verticalPadding} ${horizontalPadding};\n    `;\n  }}\n\n  ${props =>\n    props.theme.themeProp(\n      'background',\n      () => {\n        const active = props.$active;\n        const error = props.$error;\n        const warning = props.$warning;\n\n        const defaultBgColor = props?.$backgroundColors?.[0] ?? props.theme.getColor('gray-600');\n\n        switch (true) {\n          case !error && !warning && !active:\n            return defaultBgColor;\n\n          case !error && !warning && active:\n            return props.theme.getColor('gray-700');\n\n          case error && active:\n            return props.theme.getColor('red-500');\n\n          case error:\n            return props.theme.getColor('red-200');\n\n          case warning && active:\n            return props.theme.getColor('signal-yellow-500');\n\n          case warning:\n            return props.theme.getColor('signal-yellow-400');\n\n          default:\n            return props.theme.getColor('gray-600');\n        }\n      },\n      () => {\n        const active = props.$active;\n        const error = props.$error;\n        const warning = props.$warning;\n\n        const defaultBgColor = props?.$backgroundColors?.[1] ?? props.theme.getColor('gray-200');\n\n        switch (true) {\n          case !error && !warning && !active:\n            return defaultBgColor;\n\n          case !error && !warning && active:\n            return props.theme.getColor('white');\n\n          case error && active:\n            return props.theme.getColor('red-500');\n\n          case error:\n            return props.theme.getColor('red-200');\n\n          case warning && active:\n            return props.theme.getColor('signal-yellow-500');\n\n          case warning:\n            return props.theme.getColor('signal-yellow-400');\n\n          default:\n            return props.theme.getColor('gray-200');\n        }\n      }\n    )}\n\n    ${props =>\n      props.theme.themeProp(\n        'color',\n        () => {\n          const defaultColor = props?.$colors?.[0] ?? props.theme.getColor('white');\n          if ((props.$warning && !props.$error) || (props.error && !props.$active)) {\n            return props.theme.getColor('gray-900');\n          } else {\n            return defaultColor;\n          }\n        },\n        () => {\n          const defaultColor = props?.$colors?.[1] ?? props.theme.getColor('gray-900');\n          if (props.$error && props.$active) {\n            return props.theme.getColor('white');\n          } else {\n            return defaultColor;\n          }\n        }\n      )}\n\n    ${props =>\n      props.$borderColors &&\n      css`\n        border: 1px solid;\n        ${props.theme.themeProp('border-color', props.$borderColors[0], props.$borderColors[1])}\n      `}\n`;\n\nexport const BadgeIcon = styled.span\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs<BadgeIconStyleProps>(applyDefaultTheme)`\n  display: flex;\n  align-items: center;\n  margin-right: ${props => (props.$useGutter ? '4px' : 0)};\n  svg {\n    height: 12px;\n  }\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Badge","styled","span","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","$elevated","$hasChildren","theme","primaryFontFamily","BadgeChildrenContainer","BadgeLabel","fontSize","elevated","fontWeight","$lineHeight","height","width","css","$minWidth","$minHeight","verticalPadding","horizontalPadding","$horizontalPadding","themeProp","active","$active","error","$error","warning","$warning","defaultBgColor","$backgroundColors","getColor","defaultColor","$colors","$borderColors","BadgeIcon","$useGutter"],"mappings":"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"}

package/build/data/Popover/Popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","sources":["../../../src/components/data/Popover/Popover.tsx"],"sourcesContent":["import React from 'react';\n\nimport { FloatingNode, FloatingPortal, useFloatingNodeId, useMergeRefs } from '@floating-ui/react';\n\nimport useFloatingPopover from '../../../hooks/useFloatingPopover';\nimport { getElementRef } from '../../../utils/getElementRef';\nimport { POPOVER_ARROW, SharedFloatingArrow } from '../_shared/FloatingArrow.styled';\nimport * as S from './Popover.styled';\n\nimport type { Middleware, OpenChangeReason } from '@floating-ui/react';\nimport type { PopoverPlacement, PopperOffset } from '../../../hooks/useFloatingPopover';\n\n/**\n * tippy's own default `zIndex`, applied unconditionally to every popper root it ever\n * created (`popper.style.zIndex = String(zIndex)`, `tippy.js/dist/tippy.cjs.js:754`, with\n * `zIndex: 9999` at line 342). 10 consumer call sites override it, up to 999999, which is\n * why it is a declared prop here even though it was never in the old prop type — it used to\n * typecheck only because the published `Props` widened to `TippyProps`, and that widening\n * disappears with tippy.\n */\nconst TIPPY_DEFAULT_Z_INDEX = 9999;\n\n/**\n * `max-width: calc(100vw - 10px)`, which `tippy.css` applied through `[data-tippy-root]` —\n * i.e. to the POSITIONER, not to the box. It only binds on a viewport narrower than the\n * popover, which is precisely the case it exists for, so it is carried over rather than\n * dropped as unobservable. The box's own cap is the public `maxWidth` prop, default\n * `'none'`, which tippy wrote inline as `box.style.maxWidth` (line 561).\n */\nconst POSITIONER_MAX_WIDTH = 'calc(100vw - 10px)';\n\n/**\n * What `contextMenuSublevel` forces, unchanged from the old implementation\n * (`placement={contextMenuSublevel ? 'right-start' : placement}` and\n * `trigger={… contextMenuSublevel ? 'mouseenter click focus' : trigger}`). Both override the\n * caller, which is the documented behaviour: \"This will automatically set placement, spacing\n * and trigger events\".\n */\nconst CONTEXT_MENU_SUBLEVEL_PLACEMENT = 'right-start' as const;\nconst CONTEXT_MENU_SUBLEVEL_TRIGGER = 'mouseenter click focus';\n\n/**\n * The class `ContextMenuItem` writes (`ContextMenuItem.tsx:81`), and the one it adds for an\n * item that opens a submenu. A click on a LEAF item closes the menu; a click on a sublevel\n * opener must not, or the submenu would close the parent it just opened.\n */\nconst CONTEXT_MENU_ITEM_SELECTOR = '.context-menu-item';\nconst CONTEXT_MENU_SUBLEVEL_OPENER_CLASS = 'opens-sublevel';\n\n/**\n * tippy's `appendTo`, and the three-way rule it implies. `'parent'` and an implicit-parent\n * case are real tippy behaviours, not inventions — measured in\n * `tippy.js/dist/tippy.cjs.js`:\n *\n * ```js\n * if (instance.props.interactive && appendTo === TIPPY_DEFAULT_APPEND_TO || appendTo === 'parent') {\n *   parentNode = node.parentNode;          // INLINE, next to the reference\n * } else {\n *   parentNode = invokeWithArgsOrReturn(appendTo, [node]);   // portal\n * }\n * ```\n *\n * ⚠️ **`Popover` DEFAULTS `interactive` TO `true`, SO ITS DEFAULT IS THE INLINE BRANCH.**\n * `appendTo` appears in 6 files per consumer out of 30 `<Popover>` call sites across both,\n * so a blanket `FloatingPortal` would relocate the MAJORITY of call sites out of their\n * current DOM position — a stacking/`z-index` regression across both apps, not a\n * preservation. Plan §A3 originally resolved C4 as \"portal by default\" on half the evidence\n * and was corrected in `0ef5f71`; `Tooltip.tsx:77-97` is where the branch was first found.\n *\n * | `appendTo` | `interactive` | where it renders |\n * | --- | --- | --- |\n * | given | any | `FloatingPortal` rooted at `appendTo` |\n * | absent | `false` | `FloatingPortal` rooted at `document.body` |\n * | absent | `true` *(the default)* | **INLINE**, into the reference's parent |\n *\n * All 12 `appendTo` sites across both consumers pass `document.body`; the `'parent'` and\n * function forms are supported because tippy supported them and the render-gate fixture\n * uses `'parent'` to make an open popover capturable.\n */\nexport type PopoverAppendTo = 'parent' | Element | ((reference: Element) => Element);\n\ntype PopoverOwnProps = {\n  /**\n   * The content of the `Popover`.\n   */\n  content: string | React.ReactElement<any>;\n  /**\n   * Determines if the `Popover` has interactive content inside of it, so that it can be\n   * hovered over and clicked inside without hiding.\n   *\n   * **It also decides where the popover renders** — see `PopoverAppendTo`. It defaults to\n   * `true`, so a `Popover` renders INLINE unless `appendTo` or `interactive={false}` says\n   * otherwise.\n   */\n  interactive?: boolean;\n  /**\n   * The preferred placement of the `Popover`. Note that the flip middleware can change this\n   * to the opposite placement if it has more space.\n   *\n   * The 12 concrete names are spelled identically in Popper and Floating UI, so they need no\n   * translation. The three `auto*` values have no Floating UI string — they select\n   * `autoPlacement()` instead of `flip()`; see `useFloatingPopover`.\n   */\n  placement?: PopoverPlacement;\n  /**\n   * Duration in ms of the transition animation.\n   */\n  duration?: number;\n  /**\n   * Determines the events that cause the `Popover` to show. Multiple event names are separated by\n   * spaces.\n   *\n   * *Example events:*\n   *\n   * `trigger: 'click'`\n   *\n   * `trigger: 'focusin'`\n   *\n   * `trigger: 'mouseenter click'`\n   *\n   * `''` means no triggers at all, and `undefined` means tippy's default\n   * (`'mouseenter focus'`) — though this component overrides that with its own default of\n   * `'click focus'`. See `parseTrigger`.\n   *\n   * --\n   */\n  trigger?: string;\n  /**\n   * Displaces the popover from its reference element in pixels (skidding and distance).\n   *\n   * `[skidding, distance]`\n   *\n   * `distance` is the gap between the reference and the ARROW TIP, not the box — which is\n   * what it has always meant here, because the old implementation handed tippy\n   * `offset[1] + (arrow ? 15 : 0)`. `useFloatingPopover` adds the arrow height back, so the\n   * prop keeps its meaning; see `DEFAULT_ARROW_HEIGHT` for the derivation of the 15.\n   */\n  offset?: number[];\n  /**\n   * Determines if the popover has an arrow.\n   *\n   * ⚠️ It also moves the box even when the arrow is NOT drawn — see the block comment at\n   * `arrowDrivesTheOffset` in the body. That is the existing behaviour, reproduced.\n   */\n  arrow?: boolean;\n  /**\n   * Use React's state to fully control the `Popover` instead of relying on the native trigger\n   * and `hideOnClick` props\n   *\n   * Passing a boolean — **including `false`** — switches the popover to CONTROLLED mode and\n   * its own triggers stop firing. `undefined` leaves it uncontrolled. `onClickOutside` still\n   * fires in controlled mode, which is how 12 consumer call sites close a controlled\n   * popover.\n   */\n  visible?: boolean;\n  /**\n   * @deprecated Accepted and IGNORED. This was a Popper `modifiers` array, appended to\n   * `popperOptions.modifiers`; Floating UI has middleware instead and the two are not\n   * translatable prop-for-prop. Kept so that no existing call site throws — plan C6. No\n   * consumer passes it. Pass `middleware` instead.\n   */\n  modifiers?: any[];\n  /**\n   * Extra Floating UI middleware, appended after the built-in chain\n   * (`offset` → `flip`/`autoPlacement` → `shift` → `arrow` → `size`). This is the honest\n   * replacement for `modifiers`, and it exists because one internal caller genuinely needed\n   * it: `MultiLevelCheckboxSelect` matched the popover's width to its input with a\n   * hand-written Popper `sameWidth` modifier, which C6's accept-and-ignore would have\n   * silently dropped.\n   */\n  middleware?: Middleware[];\n  /**\n   * Max-width of the popover box, as a CSS length. Defaults to `'none'`, which is what tippy\n   * received and wrote inline on every popover in both consumers.\n   */\n  maxWidth?: string;\n  /**\n   * Whether the `Popover` contains a context menu.\n   * This will remove the default arrow, and apply styling.\n   *\n   * It also makes a click on a `ContextMenuItem` close the menu — see\n   * `handleContextMenuClick`.\n   */\n  contextMenu?: boolean;\n  /**\n   * Whether the `Popover` contains a context menu which is the sublevel of another context menu.\n   * This will automatically set placement, spacing and trigger events, add a dropdown icon, etc.\n   */\n  contextMenuSublevel?: boolean;\n  /**\n   * `z-index` of the positioned element. Defaults to 9999, tippy's default. 10 consumer call\n   * sites pass this.\n   */\n  zIndex?: number;\n  /**\n   * A disabled popover can never open, even under a controlled `visible={true}` — tippy's\n   * semantics.\n   */\n  disabled?: boolean;\n  /**\n   * Where the popover is rendered. Omitting it means INLINE for an `interactive` popover\n   * (the default) and `document.body` otherwise. See `PopoverAppendTo`.\n   */\n  appendTo?: PopoverAppendTo;\n  /** Fired when a press lands outside both the reference and the popover. */\n  onClickOutside?: (event?: Event) => void;\n  /**\n   * Fired when the popover opens. tippy's `onShow`, minus its instance argument.\n   */\n  onShow?: () => void;\n  /**\n   * Fired when the popover closes. tippy's `onHide`, minus its instance argument.\n   *\n   * ONE INTERNAL CALLER DEPENDS ON IT: `inputs/Button` passes\n   * `onHide={handleDropdownClose}` to reset its `dropdown-is-active` class, so this is not a\n   * courtesy re-export. It fires on every close the component decides for itself —\n   * outside press, a second click on the trigger, a context-menu item click. It does NOT\n   * fire when a CONTROLLED popover is closed by its owner flipping `visible` to `false`,\n   * because nothing asks this component to close in that case; tippy did fire there. No\n   * call site pairs `onHide` with `visible`, so the difference is currently unobservable.\n   */\n  onHide?: () => void;\n  /**\n   * Content of the `Popover`.\n   */\n  children: React.ReactNode;\n};\n\n/*\n * NMB-3998 §C.2: the rest of `props` is spread onto `S.Popover`, so the published type has\n * to admit that target's props too — a closed type here is worse than `any` for the 125\n * consumer files. Declared members win over the base (`Omit` by `keyof PopoverOwnProps`);\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 *\n * THE BASE MOVED, AND THAT IS WHY THE PROP TYPE ABOVE GREW. It used to be\n * `styled(TippyTooltip)`, so this widening admitted every tippy option — which is how\n * `zIndex`, `disabled`, `appendTo`, `onClickOutside` and `onHide` typechecked at consumer\n * and internal call sites while appearing nowhere in the prop type. `S.Popover` is now a\n * `styled.div`, so those five would have become type errors the moment the library starts\n * publishing `.d.ts` (playbook §G.4). Declaring them explicitly is what keeps that promise;\n * the set was taken from a scan of every `<Popover>` tag in both consumers — 30 sites, 13\n * distinct props — per plan §A6's warning not to trust the old prop types.\n */\ntype Props = Omit<React.ComponentPropsWithoutRef<typeof S.Popover>, keyof PopoverOwnProps> &\n  PopoverOwnProps;\n\n/**\n * Props that are accepted and then deliberately dropped, in two groups.\n *\n * `onClick` / `onChange` / `onSubmit` — this filter predates the migration and it used to be\n * redundant: `@tippyjs/react` destructures the props it knows and hands the rest to\n * `tippy()`, which ignores what it does not recognise, so an `onClick` passed to a `Popover`\n * has never fired. It is LOAD-BEARING NOW. The rest of `props` lands on a real element in\n * this implementation, so removing the filter would silently activate handlers that have\n * been dead at every call site that passes one — and there are two, in\n * `news_archive/na_download_options` in both consumers.\n *\n * `popperOptions` — plan C6. A Popper concept with no Floating UI translation and no\n * consumer usage, kept accepted-but-ignored so that no existing call site throws. It is\n * filtered here rather than destructured above because destructuring it would bind a name\n * nothing reads, which is a lint error, and because \"the list of props that never reach the\n * DOM\" is worth having in exactly one place. (`modifiers` and `maxWidth` ARE destructured:\n * `maxWidth` is applied, and `modifiers` is named in the prop type so its deprecation is\n * visible at the call site.)\n */\nconst PROPS_NEVER_FORWARDED = ['onClick', 'onChange', 'onSubmit', 'popperOptions'];\n\n/**\n * The `Popover` is a transient view that shows on a content screen when a user clicks on a control button or within a defined area.\n * A `Popover` renders a temporary context to get user’s attention and to hide unnecessary interactions.\n *\n * This component is used with the `Button` and `ContextMenu` components to create dropdown menus and context menus.\n * See their documentation for usage examples.\n *\n * ### Import\n *\n * ``` js\n * import { Popover } from '@ntbjs/react-components/data'\n * // or\n * import Popover from '@ntbjs/react-components/data/Popover'\n * ```\n *\n * ### Usage example\n *\n * ``` js\n<Popover content={<img alt=\"Dummy content\" src={dummyImage} />}>\n  <ActionButton icon={<DeleteIcon />} onClick={() => {}} />\n</Popover>\n * ```\n */\n\nconst Popover = React.forwardRef<any, Props>(function Popover(\n  {\n    content = 'Tooltip',\n    interactive = true,\n    placement = 'bottom-end',\n    duration = 350,\n    trigger = 'click focus',\n    offset = [0, 8],\n    arrow = true,\n    visible = undefined,\n    contextMenu = false,\n    contextMenuSublevel = false,\n    children,\n    modifiers = [],\n    middleware,\n    maxWidth = 'none',\n    zIndex = TIPPY_DEFAULT_Z_INDEX,\n    disabled = false,\n    appendTo,\n    onClickOutside,\n    onShow,\n    onHide,\n    ...props\n  },\n  ref\n) {\n  /*\n   * `modifiers` is destructured so it cannot reach the DOM, and named here so the compiler\n   * does not report an unused binding. Reading `.length` is the cheapest expression that is\n   * also true of the prop's purpose: it is accepted, measured to be empty at every call site\n   * in both consumers, and ignored. Plan C6.\n   */\n  void modifiers.length;\n\n  const onOpenChange = React.useCallback(\n    (open: boolean, event?: Event, reason?: OpenChangeReason) => {\n      if (!open && reason === 'outside-press') {\n        onClickOutside?.(event);\n      }\n\n      if (open) {\n        onShow?.();\n      } else {\n        onHide?.();\n      }\n    },\n    [onClickOutside, onShow, onHide]\n  );\n\n  /*\n   * Registers this popover in an enclosing `FloatingTree`, if there is one, and returns an\n   * id either way. Safe with NO tree present, which is the standalone case and plan C5's\n   * requirement — verified in the installed 0.26.28 rather than assumed:\n   * `useFloatingNodeId` does `tree == null || tree.addNode(node)`, and every tree read in\n   * `useDismiss` is guarded (`const children = tree ? getChildren(…) : []`). So a `Popover`\n   * with no `FloatingTree` above it behaves exactly as if `nodeId` were absent.\n   *\n   * The provider itself is NOT here. Plan C5: it belongs at the nesting site, so only nested\n   * context menus pay for it — see `widgets/ContextMenu`, and read the note there, because\n   * where it can usefully sit turned out to be narrower than C5 assumed.\n   */\n  const nodeId = useFloatingNodeId();\n\n  /*\n   * `[skidding, distance]`, normalised to a fixed-length tuple. The public prop stays\n   * `number[]` and not a tuple type on purpose: consumers pass `offset={[0, 5]}` through\n   * variables typed `number[]`, and narrowing the prop would turn those into type errors at\n   * call sites that compile today.\n   */\n  const offsetTuple: PopperOffset = [offset[0] ?? 0, offset[1] ?? 0];\n\n  /*\n   * ⚠️ THE ARROW DRIVES THE OFFSET EVEN WHEN NO ARROW IS DRAWN, AND THAT IS DELIBERATE\n   * REPRODUCTION OF EXISTING GEOMETRY RATHER THAN AN OVERSIGHT.\n   *\n   * The old implementation had two separate expressions:\n   *\n   *   const errorOffset = useMemo(() => (arrow ? 15 : 0), [arrow]);   // the RAW prop\n   *   offset={[offset[0], offset[1] + errorOffset]}\n   *   arrow={contextMenu ? false : arrow}                             // the DRAWN arrow\n   *\n   * so a `contextMenu` popover that leaves `arrow` at its default `true` gets the +15 in its\n   * offset and no arrow on screen. That is not hypothetical: `AssetGalleryGridCard` passes\n   * `contextMenu` with `offset={[0, -8]}` and no `arrow`, i.e. −8 + 15 = a box 7px from its\n   * reference. Collapsing the two into one flag would move that menu 15px.\n   *\n   * So `arrow` (raw) goes to the hook, which adds `DEFAULT_ARROW_HEIGHT` to the main axis\n   * and enables the `arrow()` middleware; `drawsArrow` decides whether an `<svg>` is\n   * rendered. An enabled `arrow()` middleware with nothing attached to `arrowRef` is inert —\n   * `@floating-ui/core` returns `{}` when its `element` is null — so the middleware costs a\n   * null check and no behaviour.\n   */\n  const arrowDrivesTheOffset = arrow;\n  const drawsArrow = contextMenu ? false : arrow;\n\n  const {\n    refs,\n    floatingStyles,\n    context,\n    getReferenceProps,\n    getFloatingProps,\n    isMounted,\n    transitionStyles,\n    arrowRef,\n    setOpen,\n    placement: resolvedPlacement,\n    pointerEvents\n  } = useFloatingPopover({\n    placement: contextMenuSublevel ? CONTEXT_MENU_SUBLEVEL_PLACEMENT : placement,\n    open: visible,\n    onOpenChange,\n    trigger: contextMenuSublevel ? CONTEXT_MENU_SUBLEVEL_TRIGGER : trigger,\n    offset: offsetTuple,\n    arrow: arrowDrivesTheOffset,\n    interactive,\n    disabled,\n    duration,\n    /*\n     * Always on, because the old implementation always passed the\n     * `popper-max-size-modifier` + `applyMaxSize` pair — unconditionally, in the same\n     * `popperOptions` object every popover got. The hook's `size()` improves on it in one\n     * way that is a fix rather than a change: it CLEARS the cap when the content fits,\n     * where `applyMaxSize` set `maxHeight` on every reposition and gave a 3-item menu a\n     * scrollbar.\n     *\n     * `boundary` is Floating UI's default (`clippingAncestors`) where the old code passed\n     * Popper `boundary: 'viewport'`. Floating UI has no `'viewport'` boundary and needs\n     * none: the cap is written onto the positioner, whose clipping ancestor is the viewport\n     * in the portalled cases, and in the inline case a nearer clipping ancestor is the\n     * honest answer anyway.\n     */\n    constrainHeight: true,\n    nodeId,\n    middleware\n  });\n\n  /*\n   * The reference is the CHILD, not the wrapper `<div>`, and that is a compatibility\n   * requirement rather than a preference. `@tippyjs/react` does\n   * `cloneElement(children, { ref })` and attaches its listeners to the resulting node, so\n   * every popover in both consumers is positioned against the child's box. The wrapper is a\n   * plain block `<div>`, which in most layouts is far wider than the child — anchoring to it\n   * would re-align every popover that is not in a flex row.\n   *\n   * The ref is merged three ways: this component's own forwarded `ref`, the child's existing\n   * `ref`, and `refs.setReference`. `useMergeRefs` returns `null` when every input is\n   * nullish, which `cloneElement` treats as \"no ref\".\n   *\n   * `ref` GOES SOMEWHERE REAL FOR THE FIRST TIME. It used to be handed to\n   * `styled(TippyTooltip)`, and `Tippy` is a plain function component, so React had nowhere\n   * to put it. Plan risk #9 asks for `forwardRef` onto the reference and this is it; no\n   * consumer passes `ref` to a `Popover` (measured over both apps — the `ref` attributes\n   * near `<Popover>` in `datepicker_range` are on the calendar `<div>` inside `content`), so\n   * nothing observable changes.\n   *\n   * The CHILD's ref is a different measurement, and it is live: `inputs/CompactTextInput`\n   * renders `<S.Input ref={forwardedRef}>` as this popover's child on the `link` branch, and\n   * `ntb-dam/client` passes react-hook-form's `field.ref` that way on React 16.14. Reading\n   * it as `children.props.ref` yields `undefined` before React 19, so the `cloneElement`\n   * below overwrote it — see `getElementRef`. tippy merged it via `preserveRef`.\n   */\n  const childRef = React.isValidElement(children) ? getElementRef(children) : null;\n  const referenceRef = useMergeRefs([ref, childRef, refs.setReference]);\n\n  const filteredProps = Object.fromEntries(\n    Object.entries(props).filter(([key]) => !PROPS_NEVER_FORWARDED.includes(key))\n  );\n\n  /*\n   * `getReferenceProps(children.props)` and not `getReferenceProps()`: Floating UI COMPOSES\n   * the handlers it needs with the ones already on the element, so a child that has its own\n   * `onClick` keeps it. That matters more here than for `Tooltip`, because `Popover`'s\n   * default trigger is `'click focus'` and the reference is usually a button with its own\n   * handler — `inputs/Button` passes `onClick={handleDropdownButtonClick}` on the very\n   * element that opens the popover. tippy did not need this: it attached native listeners\n   * straight to the DOM node and never touched the child's props.\n   */\n  const reference = React.isValidElement(children)\n    ? React.cloneElement(\n        children as React.ReactElement<Record<string, unknown>>,\n        {\n          ...getReferenceProps((children as React.ReactElement<Record<string, unknown>>).props),\n          ref: referenceRef\n        } as never\n      )\n    : children;\n\n  /*\n   * WHAT REPLACED `_tippy.hide()` AND THE `[data-tippy-root]` SWEEP, AND HOW THE WHOLE CHAIN\n   * OF MENUS STILL CLOSES.\n   *\n   * The old `handleContextMenuItemClick` ran on every `onShow` and, for every\n   * `.context-menu-item:not(.opens-sublevel)` IN THE DOCUMENT, added a `click` listener that\n   * called `.hide()` on every `[data-tippy-root]` IN THE DOCUMENT. Three things about it:\n   * the listeners accumulated one set per show and were never removed; the selector was\n   * global, so a menu in one corner of the app closed a popover in another; and it reached\n   * for the imperative tippy instance off the DOM node.\n   *\n   * This is scoped instead: one delegated handler on this popover's own floating element,\n   * closing only this popover. The ANCESTOR menus still close, and by a mechanism worth\n   * writing down because it is not obvious — a sublevel `Popover` renders INLINE (C4: it is\n   * `interactive` with no `appendTo`), so its floating element is a DOM descendant of the\n   * parent menu's floating element, and the same click bubbles into the parent's identical\n   * handler. Every menu in the chain closes itself. If a future change portals sublevels,\n   * this stops working and a `FloatingTree` event becomes necessary.\n   *\n   * TWO DELIBERATE NARROWINGS, both from \"every tippy in the document\" to \"this menu\":\n   *\n   * - An unrelated popover elsewhere on the page no longer closes. That was a side effect of\n   *   a global DOM query, not a feature.\n   * - The close now happens AFTER the item's own `onClickEffect` rather than before it,\n   *   because this is a React handler on an ancestor and tippy's was a native listener on\n   *   the item itself. The visible result is the same; a handler that called\n   *   `event.stopPropagation()` would now keep the menu open, and none does.\n   */\n  const handleContextMenuClick = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (!contextMenu) return;\n\n    const target = event.target;\n    if (!(target instanceof Element)) return;\n\n    const item = target.closest(CONTEXT_MENU_ITEM_SELECTOR);\n    if (!item || item.classList.contains(CONTEXT_MENU_SUBLEVEL_OPENER_CLASS)) return;\n\n    setOpen(false, event.nativeEvent, 'click');\n  };\n\n  /*\n   * tippy's appendTo resolution, reproduced. `'parent'`, and `interactive` with no explicit\n   * `appendTo`, render INLINE; everything else portals. See `PopoverAppendTo` for the\n   * measurement, and note that unlike `Tooltip` the INLINE branch is the DEFAULT here.\n   */\n  const renderInline = appendTo === 'parent' || (interactive && appendTo === undefined);\n\n  /*\n   * Deliberately NOT memoised. The function form of `appendTo` is resolved against the\n   * reference node, which is populated by a callback ref and is therefore `null` on the\n   * first render; a `useMemo` keyed on `refs.reference.current` would be reading a ref\n   * during render to decide whether to recompute, which is the one thing a memo cannot do\n   * correctly.\n   *\n   * ⚠️ `undefined` AND `null` ARE NOT INTERCHANGEABLE HERE, AND GETTING IT WRONG SILENTLY\n   * DELETES THE POPOVER. `FloatingPortal`'s `root` is typed `HTMLElement | null | ref`,\n   * which reads as though `null` were the \"no root given\" value. It is not — measured in\n   * `useFloatingPortalNode`:\n   *\n   * ```js\n   * // Wait for the root to exist before creating the portal node.\n   * if (root === null) return;\n   * …\n   * container = container || document.body;\n   * ```\n   *\n   * `null` means \"the root does not exist YET, do not create the portal node\", and the\n   * effect simply returns. Only `undefined` falls through to the `|| document.body` default.\n   * The one place `null` is right is the genuine \"not resolvable yet\" case: a function\n   * `appendTo` cannot be called until the reference exists, and `null` correctly defers the\n   * portal until it does rather than briefly portalling to the wrong parent.\n   */\n  const resolvePortalRoot = (): HTMLElement | null | undefined => {\n    if (renderInline || appendTo === undefined) return undefined;\n    if (typeof appendTo === 'function') {\n      const node = refs.reference.current;\n      return node instanceof Element ? (appendTo(node) as HTMLElement) : null;\n    }\n    return appendTo as HTMLElement;\n  };\n\n  const floating = isMounted ? (\n    <div\n      ref={refs.setFloating}\n      style={{ ...floatingStyles, zIndex, pointerEvents, maxWidth: POSITIONER_MAX_WIDTH }}\n      {...getFloatingProps({ onClick: handleContextMenuClick })}\n    >\n      {/*\n       * `{...filteredProps}` FIRST and the explicit attributes after, so that a colliding\n       * `style` or `className` cannot displace the transition styles or the placement\n       * attribute. `className` still reaches this element, which is where tippy put it —\n       * `@tippyjs/react`'s own `classNamePlugin` does\n       * `updateClassName(instance.popper.firstElementChild, 'add', className)`, i.e. onto\n       * the box and not the positioner — so `.settings-item-popover` and the other 2\n       * consumer classNames land exactly where their CSS expects.\n       *\n       * `role=\"tooltip\"` and `tabindex=\"-1\"` are tippy's, not a choice: its `defaultProps`\n       * carry `role: 'tooltip'` (`tippy.cjs.js:340`) and its renderer writes both onto the\n       * box (`box.setAttribute('tabindex', '-1')`, line 528; `role`, line 564). Every popover\n       * in both consumers has carried them. `role=\"menu\"` would arguably be better for a\n       * context menu, but `ContextMenu` already puts `role=\"menu\"` on its own root, so adding\n       * it here would nest two menus — and changing roles is an accessibility decision, not\n       * a dependency swap.\n       */}\n      <S.Popover\n        {...filteredProps}\n        data-placement={resolvedPlacement}\n        data-context-menu={contextMenu ? 'true' : undefined}\n        data-context-menu-sublevel={contextMenuSublevel ? 'true' : undefined}\n        role=\"tooltip\"\n        tabIndex={-1}\n        style={{ ...transitionStyles, maxWidth }}\n      >\n        <div className=\"tippy-content\">{content}</div>\n        {drawsArrow && (\n          <SharedFloatingArrow\n            ref={arrowRef}\n            context={context}\n            data-arrow-surface=\"popover\"\n            {...POPOVER_ARROW}\n          />\n        )}\n      </S.Popover>\n    </div>\n  ) : null;\n\n  /*\n   * `FloatingNode` publishes this popover's id to anything rendered inside it, so a nested\n   * `Popover` in `content` becomes its child rather than a second root when a `FloatingTree`\n   * is present. It renders no DOM — it is a context provider only — so it costs nothing in\n   * the standalone case.\n   *\n   * The bare wrapper `<div>` is preserved verbatim — plan risk #9. It carries no props and\n   * no styling, and consumers position against it.\n   */\n  return (\n    <div>\n      {reference}\n      <FloatingNode id={nodeId}>\n        {renderInline ? (\n          floating\n        ) : (\n          <FloatingPortal root={resolvePortalRoot()}>{floating}</FloatingPortal>\n        )}\n      </FloatingNode>\n    </div>\n  );\n});\n\nexport default Popover;\n"],"names":["TIPPY_DEFAULT_Z_INDEX","POSITIONER_MAX_WIDTH","CONTEXT_MENU_SUBLEVEL_PLACEMENT","CONTEXT_MENU_SUBLEVEL_TRIGGER","CONTEXT_MENU_ITEM_SELECTOR","CONTEXT_MENU_SUBLEVEL_OPENER_CLASS","PROPS_NEVER_FORWARDED","Popover","React","forwardRef","content","interactive","placement","duration","trigger","offset","arrow","visible","undefined","contextMenu","contextMenuSublevel","children","modifiers","middleware","maxWidth","zIndex","disabled","appendTo","onClickOutside","onShow","onHide","props","ref","length","onOpenChange","useCallback","open","event","reason","nodeId","useFloatingNodeId","offsetTuple","arrowDrivesTheOffset","drawsArrow","refs","floatingStyles","context","getReferenceProps","getFloatingProps","isMounted","transitionStyles","arrowRef","setOpen","resolvedPlacement","pointerEvents","useFloatingPopover","constrainHeight","childRef","isValidElement","getElementRef","referenceRef","useMergeRefs","setReference","filteredProps","Object","fromEntries","entries","filter","key","includes","reference","cloneElement","handleContextMenuClick","target","Element","item","closest","classList","contains","nativeEvent","renderInline","resolvePortalRoot","node","current","floating","_jsx","setFloating","style","onClick","_jsxs","S","role","tabIndex","className","SharedFloatingArrow","POPOVER_ARROW","FloatingNode","id","FloatingPortal","root"],"mappings":";;;;;;;;AAoBA,MAAMA,qBAAqB,GAAG,IAAI;AASlC,MAAMC,oBAAoB,GAAG,oBAAoB;AASjD,MAAMC,+BAA+B,GAAG,aAAsB;AAC9D,MAAMC,6BAA6B,GAAG,wBAAwB;AAO9D,MAAMC,0BAA0B,GAAG,oBAAoB;AACvD,MAAMC,kCAAkC,GAAG,gBAAgB;AA2N3D,MAAMC,qBAAqB,GAAG,CAAC,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,eAAe,CAAC;AA0BlF,MAAMC,OAAO,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,OAAOA,CAC3D;AACEG,EAAAA,OAAO,GAAG,SAAS;AACnBC,EAAAA,WAAW,GAAG,IAAI;AAClBC,EAAAA,SAAS,GAAG,YAAY;AACxBC,EAAAA,QAAQ,GAAG,GAAG;AACdC,EAAAA,OAAO,GAAG,aAAa;AACvBC,EAAAA,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC;AACfC,EAAAA,KAAK,GAAG,IAAI;AACZC,EAAAA,OAAO,GAAGC,SAAS;AACnBC,EAAAA,WAAW,GAAG,KAAK;AACnBC,EAAAA,mBAAmB,GAAG,KAAK;EAC3BC,QAAQ;AACRC,EAAAA,SAAS,GAAG,EAAE;EACdC,UAAU;AACVC,EAAAA,QAAQ,GAAG,MAAM;AACjBC,EAAAA,MAAM,GAAGzB,qBAAqB;AAC9B0B,EAAAA,QAAQ,GAAG,KAAK;EAChBC,QAAQ;EACRC,cAAc;EACdC,MAAM;EACNC,MAAM;EACN,GAAGC;AACL,CAAC,EACDC,GAAG,EACH;EAOA,KAAKV,SAAS,CAACW,MAAM;AAErB,EAAA,MAAMC,YAAY,GAAG1B,cAAK,CAAC2B,WAAW,CACpC,CAACC,IAAa,EAAEC,KAAa,EAAEC,MAAyB,KAAK;AAC3D,IAAA,IAAI,CAACF,IAAI,IAAIE,MAAM,KAAK,eAAe,EAAE;MACvCV,cAAc,GAAGS,KAAK,CAAC;AACzB,IAAA;AAEA,IAAA,IAAID,IAAI,EAAE;AACRP,MAAAA,MAAM,IAAI;AACZ,IAAA,CAAC,MAAM;AACLC,MAAAA,MAAM,IAAI;AACZ,IAAA;EACF,CAAC,EACD,CAACF,cAAc,EAAEC,MAAM,EAAEC,MAAM,CACjC,CAAC;AAcD,EAAA,MAAMS,MAAM,GAAGC,iBAAiB,EAAE;AAQlC,EAAA,MAAMC,WAAyB,GAAG,CAAC1B,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,EAAEA,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;EAuBlE,MAAM2B,oBAAoB,GAAG1B,KAAK;AAClC,EAAA,MAAM2B,UAAU,GAAGxB,WAAW,GAAG,KAAK,GAAGH,KAAK;EAE9C,MAAM;IACJ4B,IAAI;IACJC,cAAc;IACdC,OAAO;IACPC,iBAAiB;IACjBC,gBAAgB;IAChBC,SAAS;IACTC,gBAAgB;IAChBC,QAAQ;IACRC,OAAO;AACPxC,IAAAA,SAAS,EAAEyC,iBAAiB;AAC5BC,IAAAA;GACD,GAAGC,kBAAkB,CAAC;AACrB3C,IAAAA,SAAS,EAAEQ,mBAAmB,GAAGlB,+BAA+B,GAAGU,SAAS;AAC5EwB,IAAAA,IAAI,EAAEnB,OAAO;IACbiB,YAAY;AACZpB,IAAAA,OAAO,EAAEM,mBAAmB,GAAGjB,6BAA6B,GAAGW,OAAO;AACtEC,IAAAA,MAAM,EAAE0B,WAAW;AACnBzB,IAAAA,KAAK,EAAE0B,oBAAoB;IAC3B/B,WAAW;IACXe,QAAQ;IACRb,QAAQ;AAeR2C,IAAAA,eAAe,EAAE,IAAI;IACrBjB,MAAM;AACNhB,IAAAA;AACF,GAAC,CAAC;AA2BF,EAAA,MAAMkC,QAAQ,GAAGjD,cAAK,CAACkD,cAAc,CAACrC,QAAQ,CAAC,GAAGsC,aAAa,CAACtC,QAAQ,CAAC,GAAG,IAAI;AAChF,EAAA,MAAMuC,YAAY,GAAGC,YAAY,CAAC,CAAC7B,GAAG,EAAEyB,QAAQ,EAAEb,IAAI,CAACkB,YAAY,CAAC,CAAC;AAErE,EAAA,MAAMC,aAAa,GAAGC,MAAM,CAACC,WAAW,CACtCD,MAAM,CAACE,OAAO,CAACnC,KAAK,CAAC,CAACoC,MAAM,CAAC,CAAC,CAACC,GAAG,CAAC,KAAK,CAAC9D,qBAAqB,CAAC+D,QAAQ,CAACD,GAAG,CAAC,CAC9E,CAAC;AAWD,EAAA,MAAME,SAAS,GAAG9D,cAAK,CAACkD,cAAc,CAACrC,QAAQ,CAAC,GAC5Cb,cAAK,CAAC+D,YAAY,CAChBlD,QAAQ,EACR;AACE,IAAA,GAAG0B,iBAAiB,CAAE1B,QAAQ,CAAiDU,KAAK,CAAC;AACrFC,IAAAA,GAAG,EAAE4B;GAET,CAAC,GACDvC,QAAQ;EA8BZ,MAAMmD,sBAAsB,GAAInC,KAAuC,IAAK;IAC1E,IAAI,CAAClB,WAAW,EAAE;AAElB,IAAA,MAAMsD,MAAM,GAAGpC,KAAK,CAACoC,MAAM;AAC3B,IAAA,IAAI,EAAEA,MAAM,YAAYC,OAAO,CAAC,EAAE;AAElC,IAAA,MAAMC,IAAI,GAAGF,MAAM,CAACG,OAAO,CAACxE,0BAA0B,CAAC;IACvD,IAAI,CAACuE,IAAI,IAAIA,IAAI,CAACE,SAAS,CAACC,QAAQ,CAACzE,kCAAkC,CAAC,EAAE;IAE1E+C,OAAO,CAAC,KAAK,EAAEf,KAAK,CAAC0C,WAAW,EAAE,OAAO,CAAC;EAC5C,CAAC;EAOD,MAAMC,YAAY,GAAGrD,QAAQ,KAAK,QAAQ,IAAKhB,WAAW,IAAIgB,QAAQ,KAAKT,SAAU;EA2BrF,MAAM+D,iBAAiB,GAAGA,MAAsC;AAC9D,IAAA,IAAID,YAAY,IAAIrD,QAAQ,KAAKT,SAAS,EAAE,OAAOA,SAAS;AAC5D,IAAA,IAAI,OAAOS,QAAQ,KAAK,UAAU,EAAE;AAClC,MAAA,MAAMuD,IAAI,GAAGtC,IAAI,CAAC0B,SAAS,CAACa,OAAO;MACnC,OAAOD,IAAI,YAAYR,OAAO,GAAI/C,QAAQ,CAACuD,IAAI,CAAC,GAAmB,IAAI;AACzE,IAAA;AACA,IAAA,OAAOvD,QAAQ;EACjB,CAAC;AAED,EAAA,MAAMyD,QAAQ,GAAGnC,SAAS,GACxBoC,GAAA,CAAA,KAAA,EAAA;IACErD,GAAG,EAAEY,IAAI,CAAC0C,WAAY;AACtBC,IAAAA,KAAK,EAAE;AAAE,MAAA,GAAG1C,cAAc;MAAEpB,MAAM;MAAE6B,aAAa;AAAE9B,MAAAA,QAAQ,EAAEvB;KAAuB;AAAA,IAAA,GAChF+C,gBAAgB,CAAC;AAAEwC,MAAAA,OAAO,EAAEhB;AAAuB,KAAC,CAAC;AAAAnD,IAAAA,QAAA,EAmBzDoE,IAAA,CAACC,SAAS,EAAA;AAAA,MAAA,GACJ3B,aAAa;AACjB,MAAA,gBAAA,EAAgBV,iBAAkB;AAClC,MAAA,mBAAA,EAAmBlC,WAAW,GAAG,MAAM,GAAGD,SAAU;AACpD,MAAA,4BAAA,EAA4BE,mBAAmB,GAAG,MAAM,GAAGF,SAAU;AACrEyE,MAAAA,IAAI,EAAC,SAAS;MACdC,QAAQ,EAAE,EAAG;AACbL,MAAAA,KAAK,EAAE;AAAE,QAAA,GAAGrC,gBAAgB;AAAE1B,QAAAA;OAAW;AAAAH,MAAAA,QAAA,GAEzCgE,GAAA,CAAA,KAAA,EAAA;AAAKQ,QAAAA,SAAS,EAAC,eAAe;AAAAxE,QAAAA,QAAA,EAAEX;AAAO,OAAM,CAAC,EAC7CiC,UAAU,IACT0C,GAAA,CAACS,mBAAmB,EAAA;AAClB9D,QAAAA,GAAG,EAAEmB,QAAS;AACdL,QAAAA,OAAO,EAAEA,OAAQ;AACjB,QAAA,oBAAA,EAAmB,SAAS;QAAA,GACxBiD;AAAa,OAClB,CACF;KACQ;GACR,CAAC,GACJ,IAAI;AAWR,EAAA,OACEN,IAAA,CAAA,KAAA,EAAA;AAAApE,IAAAA,QAAA,EAAA,CACGiD,SAAS,EACVe,GAAA,CAACW,YAAY,EAAA;AAACC,MAAAA,EAAE,EAAE1D,MAAO;AAAAlB,MAAAA,QAAA,EACtB2D,YAAY,GACXI,QAAQ,GAERC,GAAA,CAACa,cAAc,EAAA;QAACC,IAAI,EAAElB,iBAAiB,EAAG;AAAA5D,QAAAA,QAAA,EAAE+D;OAAyB;AACtE,KACW,CAAC;AAAA,GACZ,CAAC;AAEV,CAAC;;;;"}
+{"version":3,"file":"Popover.js","sources":["../../../src/components/data/Popover/Popover.tsx"],"sourcesContent":["import React from 'react';\n\nimport { FloatingNode, FloatingPortal, useFloatingNodeId, useMergeRefs } from '@floating-ui/react';\n\nimport useFloatingPopover from '../../../hooks/useFloatingPopover';\nimport { getElementRef } from '../../../utils/getElementRef';\nimport { POPOVER_ARROW, SharedFloatingArrow } from '../_shared/FloatingArrow.styled';\nimport * as S from './Popover.styled';\n\nimport type { Middleware, OpenChangeReason } from '@floating-ui/react';\nimport type { PopoverPlacement, PopperOffset } from '../../../hooks/useFloatingPopover';\n\n// tippy's default z-index; 10 consumer call sites override it, which is why it's declared as a prop.\nconst TIPPY_DEFAULT_Z_INDEX = 9999;\n\n// tippy.css applied this viewport cap through [data-tippy-root] (the positioner), carried over.\nconst POSITIONER_MAX_WIDTH = 'calc(100vw - 10px)';\n\n// Placement and trigger that contextMenuSublevel forces, unchanged from old implementation.\nconst CONTEXT_MENU_SUBLEVEL_PLACEMENT = 'right-start' as const;\nconst CONTEXT_MENU_SUBLEVEL_TRIGGER = 'mouseenter click focus';\n\n/**\n * The class `ContextMenuItem` writes (`ContextMenuItem.tsx:81`), and the one it adds for an\n * item that opens a submenu. A click on a LEAF item closes the menu; a click on a sublevel\n * opener must not, or the submenu would close the parent it just opened.\n */\nconst CONTEXT_MENU_ITEM_SELECTOR = '.context-menu-item';\nconst CONTEXT_MENU_SUBLEVEL_OPENER_CLASS = 'opens-sublevel';\n\n// tippy's three-way appendTo: given value portals, absent+interactive=true (default) renders INLINE into reference's parent, absent+interactive=false portals to body. Plan C4 confirms behaviour-preserving.\nexport type PopoverAppendTo = 'parent' | Element | ((reference: Element) => Element);\n\ntype PopoverOwnProps = {\n  /**\n   * The content of the `Popover`.\n   */\n  content: string | React.ReactElement<any>;\n  /**\n   * Whether the popover's content is interactive and where it renders (inline by default for interactive popovers).\n   */\n  interactive?: boolean;\n  /**\n   * Preferred placement; 12 concrete names need no Popper→Floating UI translation. Three `auto*` values select `autoPlacement()` instead of `flip()`.\n   */\n  placement?: PopoverPlacement;\n  /**\n   * Duration in ms of the transition animation.\n   */\n  duration?: number;\n  /**\n   * Events that cause the popover to show (space-separated). `''` means no triggers, `undefined` means `'mouseenter focus'`, component defaults to `'click focus'`.\n   */\n  trigger?: string;\n  /**\n   * `[skidding, distance]`; distance is the gap between reference and arrow tip (not box), absorbing the old `+15` offset.\n   */\n  offset?: number[];\n  /**\n   * Whether the popover has an arrow; also moves the box even when not drawn (existing behaviour, reproduced).\n   */\n  arrow?: boolean;\n  /**\n   * Pass a boolean to control visibility; both `true` and `false` disable native triggers. `onClickOutside` still fires in controlled mode.\n   */\n  visible?: boolean;\n  /**\n   * @deprecated Accepted and ignored; use `middleware` instead.\n   */\n  modifiers?: any[];\n  /**\n   * Extra Floating UI middleware, appended after the built-in chain; one internal caller needed this for width matching.\n   */\n  middleware?: Middleware[];\n  /**\n   * Max-width of the popover box, as a CSS length. Defaults to `'none'`, which is what tippy\n   * received and wrote inline on every popover in both consumers.\n   */\n  maxWidth?: string;\n  /**\n   * Whether the `Popover` contains a context menu.\n   * This will remove the default arrow, and apply styling.\n   *\n   * It also makes a click on a `ContextMenuItem` close the menu — see\n   * `handleContextMenuClick`.\n   */\n  contextMenu?: boolean;\n  /**\n   * Whether the `Popover` contains a context menu which is the sublevel of another context menu.\n   * This will automatically set placement, spacing and trigger events, add a dropdown icon, etc.\n   */\n  contextMenuSublevel?: boolean;\n  /**\n   * `z-index` of the positioned element (default: 9999, tippy's default).\n   */\n  zIndex?: number;\n  /**\n   * A disabled popover can never open, even under a controlled `visible={true}` — tippy's\n   * semantics.\n   */\n  disabled?: boolean;\n  /**\n   * Where the popover is rendered (default: inline for interactive popovers, document.body otherwise).\n   */\n  appendTo?: PopoverAppendTo;\n  /** Fired when a press lands outside both the reference and the popover. */\n  onClickOutside?: (event?: Event) => void;\n  /**\n   * Fired when the popover opens. tippy's `onShow`, minus its instance argument.\n   */\n  onShow?: () => void;\n  /**\n   * Fired when the popover closes; one internal caller (inputs/Button) depends on it to reset dropdown-is-active class.\n   */\n  onHide?: () => void;\n  /**\n   * Content of the `Popover`.\n   */\n  children: React.ReactNode;\n};\n\n// Props spreads onto S.Popover, so the published type must admit its props. Base moved from styled(Tippy) to styled.div, requiring explicit declaration of zIndex, disabled, appendTo, onClickOutside, onHide.\ntype Props = Omit<React.ComponentPropsWithoutRef<typeof S.Popover>, keyof PopoverOwnProps> &\n  PopoverOwnProps;\n\n// Props accepted-but-ignored: onClick/onChange/onSubmit filter is load-bearing (would activate dead handlers); popperOptions is plan C6 deprecation.\nconst PROPS_NEVER_FORWARDED = ['onClick', 'onChange', 'onSubmit', 'popperOptions'];\n\n/**\n * The `Popover` is a transient view that shows on a content screen when a user clicks on a control button or within a defined area.\n * A `Popover` renders a temporary context to get user’s attention and to hide unnecessary interactions.\n *\n * This component is used with the `Button` and `ContextMenu` components to create dropdown menus and context menus.\n * See their documentation for usage examples.\n *\n * ### Import\n *\n * ``` js\n * import { Popover } from '@ntbjs/react-components/data'\n * // or\n * import Popover from '@ntbjs/react-components/data/Popover'\n * ```\n *\n * ### Usage example\n *\n * ``` js\n<Popover content={<img alt=\"Dummy content\" src={dummyImage} />}>\n  <ActionButton icon={<DeleteIcon />} onClick={() => {}} />\n</Popover>\n * ```\n */\n\nconst Popover = React.forwardRef<any, Props>(function Popover(\n  {\n    content = 'Tooltip',\n    interactive = true,\n    placement = 'bottom-end',\n    duration = 350,\n    trigger = 'click focus',\n    offset = [0, 8],\n    arrow = true,\n    visible = undefined,\n    contextMenu = false,\n    contextMenuSublevel = false,\n    children,\n    modifiers = [],\n    middleware,\n    maxWidth = 'none',\n    zIndex = TIPPY_DEFAULT_Z_INDEX,\n    disabled = false,\n    appendTo,\n    onClickOutside,\n    onShow,\n    onHide,\n    ...props\n  },\n  ref\n) {\n  void modifiers.length;\n\n  const onOpenChange = React.useCallback(\n    (open: boolean, event?: Event, reason?: OpenChangeReason) => {\n      if (!open && reason === 'outside-press') {\n        onClickOutside?.(event);\n      }\n\n      if (open) {\n        onShow?.();\n      } else {\n        onHide?.();\n      }\n    },\n    [onClickOutside, onShow, onHide]\n  );\n\n  // Registers in FloatingTree if present; safe with no tree (guarded reads in useDismiss).\n  const nodeId = useFloatingNodeId();\n\n  // Normalize to fixed-length tuple; public prop stays number[] for compat.\n  const offsetTuple: PopperOffset = [offset[0] ?? 0, offset[1] ?? 0];\n\n  // Arrow position drives offset even when not drawn (existing behavior). arrowDrivesTheOffset feeds hook; drawsArrow decides rendering.\n  const arrowDrivesTheOffset = arrow;\n  const drawsArrow = contextMenu ? false : arrow;\n\n  const {\n    refs,\n    floatingStyles,\n    context,\n    getReferenceProps,\n    getFloatingProps,\n    isMounted,\n    transitionStyles,\n    arrowRef,\n    setOpen,\n    placement: resolvedPlacement,\n    pointerEvents\n  } = useFloatingPopover({\n    placement: contextMenuSublevel ? CONTEXT_MENU_SUBLEVEL_PLACEMENT : placement,\n    open: visible,\n    onOpenChange,\n    trigger: contextMenuSublevel ? CONTEXT_MENU_SUBLEVEL_TRIGGER : trigger,\n    offset: offsetTuple,\n    arrow: arrowDrivesTheOffset,\n    interactive,\n    disabled,\n    duration,\n    // Always on, replacing popper-max-size-modifier behavior (but clears cap when content fits, unlike applyMaxSize).\n    constrainHeight: true,\n    nodeId,\n    middleware\n  });\n\n  // Reference is the CHILD (not wrapper) for positioning compat; ref merges forwarded ref, child's ref, and setReference.\n  const childRef = React.isValidElement(children) ? getElementRef(children) : null;\n  const referenceRef = useMergeRefs([ref, childRef, refs.setReference]);\n\n  const filteredProps = Object.fromEntries(\n    Object.entries(props).filter(([key]) => !PROPS_NEVER_FORWARDED.includes(key))\n  );\n\n  // Floating UI composes handlers with existing ones, so child's own handlers still work.\n  const reference = React.isValidElement(children)\n    ? React.cloneElement(\n        children as React.ReactElement<Record<string, unknown>>,\n        {\n          ...getReferenceProps((children as React.ReactElement<Record<string, unknown>>).props),\n          ref: referenceRef\n        } as never\n      )\n    : children;\n\n  // Delegated click handler closes this menu on item click (inline rendering means ancestor menus close automatically via bubbling).\n  const handleContextMenuClick = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (!contextMenu) return;\n\n    const target = event.target;\n    if (!(target instanceof Element)) return;\n\n    const item = target.closest(CONTEXT_MENU_ITEM_SELECTOR);\n    if (!item || item.classList.contains(CONTEXT_MENU_SUBLEVEL_OPENER_CLASS)) return;\n\n    setOpen(false, event.nativeEvent, 'click');\n  };\n\n  // Inline rendering: 'parent' or (interactive && no explicit appendTo).\n  const renderInline = appendTo === 'parent' || (interactive && appendTo === undefined);\n\n  // null/undefined NOT interchangeable: undefined→document.body default, null→defer until reference exists.\n  const resolvePortalRoot = (): HTMLElement | null | undefined => {\n    if (renderInline || appendTo === undefined) return undefined;\n    if (typeof appendTo === 'function') {\n      const node = refs.reference.current;\n      return node instanceof Element ? (appendTo(node) as HTMLElement) : null;\n    }\n    return appendTo as HTMLElement;\n  };\n\n  const floating = isMounted ? (\n    <div\n      ref={refs.setFloating}\n      style={{ ...floatingStyles, zIndex, pointerEvents, maxWidth: POSITIONER_MAX_WIDTH }}\n      {...getFloatingProps({ onClick: handleContextMenuClick })}\n    >\n      {/*\n       * filteredProps first so explicit attrs can't override transition/placement styles. role/tabindex from tippy (not changed for compat).\n       */}\n      <S.Popover\n        {...filteredProps}\n        data-placement={resolvedPlacement}\n        data-context-menu={contextMenu ? 'true' : undefined}\n        data-context-menu-sublevel={contextMenuSublevel ? 'true' : undefined}\n        role=\"tooltip\"\n        tabIndex={-1}\n        style={{ ...transitionStyles, maxWidth }}\n      >\n        <div className=\"tippy-content\">{content}</div>\n        {drawsArrow && (\n          <SharedFloatingArrow\n            ref={arrowRef}\n            context={context}\n            data-arrow-surface=\"popover\"\n            {...POPOVER_ARROW}\n          />\n        )}\n      </S.Popover>\n    </div>\n  ) : null;\n\n  // FloatingNode publishes ID to nested popovers; no DOM cost in standalone case. Bare wrapper preserved for compat.\n  return (\n    <div>\n      {reference}\n      <FloatingNode id={nodeId}>\n        {renderInline ? (\n          floating\n        ) : (\n          <FloatingPortal root={resolvePortalRoot()}>{floating}</FloatingPortal>\n        )}\n      </FloatingNode>\n    </div>\n  );\n});\n\nexport default Popover;\n"],"names":["TIPPY_DEFAULT_Z_INDEX","POSITIONER_MAX_WIDTH","CONTEXT_MENU_SUBLEVEL_PLACEMENT","CONTEXT_MENU_SUBLEVEL_TRIGGER","CONTEXT_MENU_ITEM_SELECTOR","CONTEXT_MENU_SUBLEVEL_OPENER_CLASS","PROPS_NEVER_FORWARDED","Popover","React","forwardRef","content","interactive","placement","duration","trigger","offset","arrow","visible","undefined","contextMenu","contextMenuSublevel","children","modifiers","middleware","maxWidth","zIndex","disabled","appendTo","onClickOutside","onShow","onHide","props","ref","length","onOpenChange","useCallback","open","event","reason","nodeId","useFloatingNodeId","offsetTuple","arrowDrivesTheOffset","drawsArrow","refs","floatingStyles","context","getReferenceProps","getFloatingProps","isMounted","transitionStyles","arrowRef","setOpen","resolvedPlacement","pointerEvents","useFloatingPopover","constrainHeight","childRef","isValidElement","getElementRef","referenceRef","useMergeRefs","setReference","filteredProps","Object","fromEntries","entries","filter","key","includes","reference","cloneElement","handleContextMenuClick","target","Element","item","closest","classList","contains","nativeEvent","renderInline","resolvePortalRoot","node","current","floating","_jsx","setFloating","style","onClick","_jsxs","S","role","tabIndex","className","SharedFloatingArrow","POPOVER_ARROW","FloatingNode","id","FloatingPortal","root"],"mappings":"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"}

package/build/data/Popover/Popover.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.styled.js","sources":["../../../src/components/data/Popover/Popover.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 * NO TRANSIENT PROP IS READ HERE — every interpolation reads only `props.theme`, which\n * `ExecutionContext` already supplies via the C6 `DefaultTheme` augmentation. The two\n * per-instance variants (`contextMenu`, `contextMenuSublevel`) are STATIC ATTRIBUTE\n * SELECTORS, not `${props => css`…`}` rules — see \"THE TWO VARIANTS\" below.\n *\n * ================== WHAT REPLACED WHAT, AND THE FOUR THINGS THAT CAME BACK ==================\n *\n * This file used to be `styled(TippyTooltip)`, so the class it generated landed on tippy's\n * `.tippy-box` and the rules below were only ever the OVERRIDES — the base came from\n * `tippy.js/dist/tippy.css`, which this file imported. Dropping tippy therefore drops a\n * base stylesheet nobody had written down. Measured, verbatim, from that file:\n *\n *   .tippy-box    { position: relative; background-color: #333; color: #fff;\n *                   border-radius: 4px; font-size: 14px; line-height: 1.4;\n *                   white-space: normal; outline: 0;\n *                   transition-property: transform, visibility, opacity }\n *   .tippy-content{ position: relative; padding: 5px 9px; z-index: 1 }\n *   [data-tippy-root]{ max-width: calc(100vw - 10px) }\n *\n * Five of those declarations were OVERRIDDEN by the old version of this file\n * (`background-color` by the themed `background`, `color` by `color: inherit`,\n * `border-radius` by `0`, `font-size` by `1rem`, `line-height` by `inherit`) and tippy's\n * values are simply gone. Four were IN FORCE and are carried over here, because dropping\n * them silently would change the rendering:\n *\n * - `position: relative` is the ARROW'S CONTAINING BLOCK. `FloatingArrow` positions its\n *   `<svg>` at `[side]: 100%`, which resolves against the nearest positioned ancestor;\n *   with a static box the arrow escapes to the viewport. This is the single most\n *   load-bearing line in the file.\n * - `white-space: normal` and `outline: 0` were in force and are not initial values.\n * - `.tippy-content`'s `position: relative` and `z-index: 1`. The old file overrode only\n *   its `padding`; the stacking pair came from `tippy.css` and is declared explicitly\n *   below for the same reason `Tooltip.styled.ts` declares it.\n *\n * `transition-property` is deliberately NOT carried over: `useTransitionStyles` emits its\n * own transition shorthand inline on this element, so a stylesheet declaration would be\n * overridden on every render.\n *\n * `[data-tippy-root]`'s `max-width: calc(100vw - 10px)` applied to the POSITIONER, not to\n * this element, so it moved to `Popover.tsx` (`POSITIONER_MAX_WIDTH`) along with tippy's\n * `popper.style.zIndex` and `popper.style.pointerEvents`.\n *\n * The public `maxWidth` prop also moved to `Popover.tsx`. It used to be read here as\n * `${props => props.maxWidth && css`max-width: ${props.maxWidth}`}` AND written inline by\n * tippy (`box.style.maxWidth = maxWidth`), i.e. twice; it is now written once, inline,\n * which is what tippy did and what `Tooltip.tsx` does.\n *\n * ================== THE ARROW: 8 RULES AND 4 themeProp() CALLS ARE GONE ==================\n *\n * tippy drew the arrow as a CSS border triangle, so this file carried an outline layer\n * (`::before`) and a fill layer (`::after`) for each of the four sides — 8 nested blocks,\n * 4 `themeProp()` calls for the border colour, and a `.tippy-arrow { color: … }` rule that\n * existed only because `border-*-color: initial` resolves to `currentColor`.\n *\n * All of it is replaced by ONE `<svg>`: `SharedFloatingArrow` with\n * `data-arrow-surface=\"popover\"` and the geometry in `POPOVER_ARROW`\n * (`src/components/data/_shared/FloatingArrow.styled.ts`). That file's `popover` surface\n * carries the same two colour pairs this one did — `gray-700`/`white` for the fill,\n * `gray-800`/`gray-300` for the 1px border that continues the box's own — and it is where\n * the 15px/26px geometry is derived from the `border-width: 15px 13px 0` these blocks used\n * to declare.\n *\n * ================== WHY `.tippy-content` IS STILL CALLED `.tippy-content` ==================\n *\n * It is a deliberate compatibility shim, not a leftover. `src/sass/components/popover.scss`\n * in BOTH consumers targets that class name — it is the 600px notification layout — so\n * renaming it needs coordinated PRs in two repos: plan C2/§A4. `Popover.tsx` renders\n * exactly one such element.\n *\n * ================== THE TWO VARIANTS, AND THE DEAD CSS THEY REVIVE ==================\n *\n * `contextMenu` and `contextMenuSublevel` used to be `${props => props.contextMenu && css…}`\n * blocks that NOTHING COULD REACH: `Popover.tsx` destructured both props out and the two\n * lines that would have forwarded them were commented out. The old header of this file and\n * `scripts/r19-harness/fixtures.cjs`'s `data/Popover` entry both record that as a declared,\n * unfixed defect — \"~10 CSS declarations in this file are dead code, and no fixture can\n * cover them\".\n *\n * They are live now, and the plan asks for it (§Approach step 2: \"`contextMenu`: arrow off,\n * context-menu styling variant\"). Two consequences worth stating before the next reader\n * hunts for them:\n *\n * 1. **The rules are written as static attribute selectors**, `&[data-context-menu='true']`,\n *    not as interpolated `css` blocks. An interpolated rule shares the component's\n *    `componentId`, so two instances in different states collide and one wins for both —\n *    the convention recorded in `ThemeProp`'s JSDoc in `src/utils/defaultTheme.ts`.\n * 2. **The theme branches are written out by hand** rather than through `themeProp()`, for\n *    the same reason `FloatingArrow.styled.ts` does it: `themeProp()` emits a SELECTOR\n *    (`body.dark-theme &&`), and nesting one inside another selector block produces a\n *    descendant selector rather than a refinement. Writing them out also settles the\n *    specificity question by construction — each variant rule carries the base rule's\n *    `body.<theme>` prefix PLUS an attribute selector, so it wins outright instead of by\n *    being later in the sheet.\n */\nimport styled from 'styled-components';\nimport { rgba } from 'polished';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n/*\n * Single-argument, and it stays that way — peer floor `styled-components: >=5.1.0`, and the\n * two majors disagree on the second parameter. §J.4.\n *\n * IT IS ALSO NOW MANDATORY RATHER THAN OPTIONAL, WHICH FIXES A DECLARED DEFECT. The old\n * version of this file was one of only two of the 36 styled files with no\n * `shouldForwardProp`, and its header recorded the consequence: nothing filtered props, so\n * the `theme` OBJECT that `.attrs(applyDefaultTheme)` injects was handed to\n * `@tippyjs/react`, which did `box.setAttribute('data-theme', theme)` for any truthy theme\n * (`tippy.js/dist/tippy.cjs.js:543`) and put `data-theme=\"[object Object]\"` on the live box.\n * The root here is a plain `styled.div`, so without this predicate that same object would be\n * written to the DOM as `theme=\"[object Object]\"` — `theme` is all-lowercase, so React 19\n * does NOT drop it the way it drops unknown camelCase props. The fix the old header asked\n * for is therefore not a follow-up; it is a precondition of this rewrite.\n *\n * `data-context-menu` / `data-context-menu-sublevel` are forwarded precisely because they\n * do not start with `$`: the rules below select on them, so they have to reach the DOM.\n */\nconst shouldForwardProp = (prop: string): boolean => {\n  return prop !== 'theme' && !prop.startsWith('$');\n};\n\n/**\n * The popover box — what `.tippy-box` was.\n *\n * `Popover.tsx` puts the transition styles and the `max-width` on this element inline and\n * the POSITION on its parent, matching the split tippy used (animated box inside a\n * Popper-positioned root) and the one `Tooltip` and the three existing Floating UI sites\n * use.\n *\n * `max-height: inherit` is not decorative and neither is the `.tippy-content` chain below\n * it. `size()` writes its cap onto the POSITIONER (`elements.floating`), exactly where\n * `popper-max-size-modifier` + `applyMaxSize` used to write `state.styles.popper.maxHeight`,\n * so the cap has to be inherited down box → `.tippy-content` → its child to reach the\n * element that actually scrolls.\n */\nexport const Popover = styled.div\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs(applyDefaultTheme)`\n  position: relative;\n  outline: 0;\n  white-space: normal;\n  font-family: ${props => props.theme.primaryFontFamily};\n  font-size: 1rem;\n  font-weight: 400;\n  color: inherit;\n  border-radius: 0;\n  line-height: inherit;\n  max-height: inherit;\n\n  ${props =>\n    props.theme.themeProp(\n      'background',\n      props.theme.getColor('gray-700'),\n      props.theme.getColor('white')\n    )}\n\n  ${props =>\n    props.theme.themeProp(\n      'box-shadow',\n      `0px 1px 6px -3px ${rgba(props.theme.getColor('black'), 0.7)}`,\n      `0 1px 6px -4px ${props.theme.getColor('black')}`\n    )}\n\n  ${props =>\n    props.theme.themeProp(\n      'border',\n      `1px solid ${props.theme.getColor('gray-800')}`,\n      `1px solid ${props.theme.getColor('gray-300')}`\n    )}\n\n  .tippy-content {\n    position: relative;\n    z-index: 1;\n    padding: 0;\n    max-height: inherit;\n\n    > div {\n      max-height: inherit;\n    }\n  }\n\n  /* ------------------------------------------------------------- context-menu variant ----\n   * NO BACKTICKS ANYWHERE BELOW: this is the inside of a tagged template literal, so a\n   * backtick in a comment ends the template and the file stops parsing.\n   *\n   * border-radius is not themed, so it needs no theme prefix; border and box-shadow are,\n   * and both override a themeProp() rule above, so each theme branch is spelled out.\n   * \"border: none\" is the same in both themes (the old code passed themeProp('border',\n   * 'none', 'none')) but still needs the prefix to outrank the base border rule.\n   */\n  &[data-context-menu='true'] {\n    border-radius: 4px;\n  }\n\n  body.dark-theme &[data-context-menu='true'] {\n    border: none;\n    box-shadow: none;\n  }\n\n  body.light-theme &[data-context-menu='true'] {\n    border: none;\n    box-shadow: 0 1px 6px ${props => rgba(props.theme.getColor('gray-900'), 0.3)};\n  }\n\n  body:not(.light-theme):not(.dark-theme) &[data-context-menu='true'] {\n    border: none;\n    box-shadow: 0 1px 6px ${props => rgba(props.theme.getColor('gray-900'), 0.3)};\n\n    @media (prefers-color-scheme: dark) {\n      box-shadow: none;\n    }\n  }\n\n  /* ---------------------------------------------------------------- sublevel variant ----\n   * The margins that pull a submenu back onto its parent item. Not themed, so one block.\n   * data-placement is written by Popover.tsx from the placement the middleware RESOLVED,\n   * which is what tippy put on the box, so a submenu that has flipped from right to left\n   * still gets the correction for the side it ended up on.\n   */\n  &[data-context-menu-sublevel='true'] {\n    &[data-placement^='right-start'],\n    &[data-placement^='left-start'] {\n      margin-top: -4px;\n    }\n\n    &[data-placement^='left'] {\n      margin-right: -6px;\n    }\n\n    &[data-placement^='right'] {\n      margin-left: -6px;\n    }\n  }\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Popover","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","theme","primaryFontFamily","themeProp","getColor","rgba"],"mappings":";;;;AAyHA,MAAMA,iBAAiB,GAAIC,IAAY,IAAc;EACnD,OAAOA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAClD,CAAC;AAgBM,MAAMC,OAAO,GAAGC,MAAM,CAACC,GAAG,CAC9BC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,wBAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,6DAAA,EAAA,uGAAA,EAAA,GAAA,EAAA,GAAA,EAAA,4SAAA,EAAA,yGAAA,EAAA,0QAAA,CAAA,EAIVC,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACC,iBAAiB,EAQnDF,KAAK,IACLA,KAAK,CAACC,KAAK,CAACE,SAAS,CACnB,YAAY,EACZH,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,UAAU,CAAC,EAChCJ,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,OAAO,CAC9B,CAAC,EAEDJ,KAAK,IACLA,KAAK,CAACC,KAAK,CAACE,SAAS,CACnB,YAAY,EACZ,CAAA,iBAAA,EAAoBE,IAAI,CAACL,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAA,CAAE,EAC9D,CAAA,eAAA,EAAkBJ,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,OAAO,CAAC,CAAA,CACjD,CAAC,EAEDJ,KAAK,IACLA,KAAK,CAACC,KAAK,CAACE,SAAS,CACnB,QAAQ,EACR,CAAA,UAAA,EAAaH,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,UAAU,CAAC,CAAA,CAAE,EAC/C,CAAA,UAAA,EAAaJ,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,UAAU,CAAC,CAAA,CAC/C,CAAC,EAiCuBJ,KAAK,IAAIK,IAAI,CAACL,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,UAAU,CAAC,EAAE,GAAG,CAAC,EAKpDJ,KAAK,IAAIK,IAAI,CAACL,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,UAAU,CAAC,EAAE,GAAG,CAAC;;;;"}
+{"version":3,"file":"Popover.styled.js","sources":["../../../src/components/data/Popover/Popover.styled.ts"],"sourcesContent":["// Carries four load-bearing styles from tippy.css: position:relative (arrow container), white-space:normal, outline:0, .tippy-content position/z-index. Arrow CSS replaced by SVG (FloatingArrow.styled.ts). Variants use static attribute selectors (not interpolated) to avoid componentId collisions.\n\nimport styled from 'styled-components';\nimport { rgba } from 'polished';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n// Mandatory (not optional) to filter theme object from DOM; fixes declared defect where theme was written as `data-theme=\"[object Object]\"`.\n\nconst shouldForwardProp = (prop: string): boolean => {\n  return prop !== 'theme' && !prop.startsWith('$');\n};\n\n/**\n * The popover box — what `.tippy-box` was.\n *\n * `Popover.tsx` puts the transition styles and the `max-width` on this element inline and\n * the POSITION on its parent, matching the split tippy used (animated box inside a\n * Popper-positioned root) and the one `Tooltip` and the three existing Floating UI sites\n * use.\n *\n * `max-height: inherit` is not decorative and neither is the `.tippy-content` chain below\n * it. `size()` writes its cap onto the POSITIONER (`elements.floating`), exactly where\n * `popper-max-size-modifier` + `applyMaxSize` used to write `state.styles.popper.maxHeight`,\n * so the cap has to be inherited down box → `.tippy-content` → its child to reach the\n * element that actually scrolls.\n */\nexport const Popover = styled.div\n  .withConfig({\n    shouldForwardProp\n  })\n  .attrs(applyDefaultTheme)`\n  position: relative;\n  outline: 0;\n  white-space: normal;\n  font-family: ${props => props.theme.primaryFontFamily};\n  font-size: 1rem;\n  font-weight: 400;\n  color: inherit;\n  border-radius: 0;\n  line-height: inherit;\n  max-height: inherit;\n\n  ${props =>\n    props.theme.themeProp(\n      'background',\n      props.theme.getColor('gray-700'),\n      props.theme.getColor('white')\n    )}\n\n  ${props =>\n    props.theme.themeProp(\n      'box-shadow',\n      `0px 1px 6px -3px ${rgba(props.theme.getColor('black'), 0.7)}`,\n      `0 1px 6px -4px ${props.theme.getColor('black')}`\n    )}\n\n  ${props =>\n    props.theme.themeProp(\n      'border',\n      `1px solid ${props.theme.getColor('gray-800')}`,\n      `1px solid ${props.theme.getColor('gray-300')}`\n    )}\n\n  .tippy-content {\n    position: relative;\n    z-index: 1;\n    padding: 0;\n    max-height: inherit;\n\n    > div {\n      max-height: inherit;\n    }\n  }\n\n  /* context-menu variant: NO BACKTICKS IN COMMENTS (ends tagged template) **/\n  &[data-context-menu='true'] {\n    border-radius: 4px;\n  }\n\n  body.dark-theme &[data-context-menu='true'] {\n    border: none;\n    box-shadow: none;\n  }\n\n  body.light-theme &[data-context-menu='true'] {\n    border: none;\n    box-shadow: 0 1px 6px ${props => rgba(props.theme.getColor('gray-900'), 0.3)};\n  }\n\n  body:not(.light-theme):not(.dark-theme) &[data-context-menu='true'] {\n    border: none;\n    box-shadow: 0 1px 6px ${props => rgba(props.theme.getColor('gray-900'), 0.3)};\n\n    @media (prefers-color-scheme: dark) {\n      box-shadow: none;\n    }\n  }\n\n  /* sublevel variant: margins pull submenu back onto parent item; data-placement from resolved placement **/\n  &[data-context-menu-sublevel='true'] {\n    &[data-placement^='right-start'],\n    &[data-placement^='left-start'] {\n      margin-top: -4px;\n    }\n\n    &[data-placement^='left'] {\n      margin-right: -6px;\n    }\n\n    &[data-placement^='right'] {\n      margin-left: -6px;\n    }\n  }\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Popover","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","theme","primaryFontFamily","themeProp","getColor","rgba"],"mappings":";;;;AAQA,MAAMA,iBAAiB,GAAIC,IAAY,IAAc;EACnD,OAAOA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAClD,CAAC;AAgBM,MAAMC,OAAO,GAAGC,MAAM,CAACC,GAAG,CAC9BC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,wBAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,6DAAA,EAAA,uGAAA,EAAA,GAAA,EAAA,GAAA,EAAA,4SAAA,EAAA,yGAAA,EAAA,0QAAA,CAAA,EAIVC,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACC,iBAAiB,EAQnDF,KAAK,IACLA,KAAK,CAACC,KAAK,CAACE,SAAS,CACnB,YAAY,EACZH,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,UAAU,CAAC,EAChCJ,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,OAAO,CAC9B,CAAC,EAEDJ,KAAK,IACLA,KAAK,CAACC,KAAK,CAACE,SAAS,CACnB,YAAY,EACZ,CAAA,iBAAA,EAAoBE,IAAI,CAACL,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAA,CAAE,EAC9D,CAAA,eAAA,EAAkBJ,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,OAAO,CAAC,CAAA,CACjD,CAAC,EAEDJ,KAAK,IACLA,KAAK,CAACC,KAAK,CAACE,SAAS,CACnB,QAAQ,EACR,CAAA,UAAA,EAAaH,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,UAAU,CAAC,CAAA,CAAE,EAC/C,CAAA,UAAA,EAAaJ,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,UAAU,CAAC,CAAA,CAC/C,CAAC,EAyBuBJ,KAAK,IAAIK,IAAI,CAACL,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,UAAU,CAAC,EAAE,GAAG,CAAC,EAKpDJ,KAAK,IAAIK,IAAI,CAACL,KAAK,CAACC,KAAK,CAACG,QAAQ,CAAC,UAAU,CAAC,EAAE,GAAG,CAAC;;;;"}

package/build/data/SeverityBadge/SeverityBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"SeverityBadge.js","sources":["../../../src/components/data/SeverityBadge/SeverityBadge.tsx"],"sourcesContent":["import React from 'react';\nimport Badge from '../Badge/Badge';\n\nconst InformationIcon = () => (\n  <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path\n      d=\"M6 11C3.2385 11 1 8.7615 1 6C1 3.2385 3.2385 1 6 1C8.7615 1 11 3.2385 11 6C11 8.7615 8.7615 11 6 11ZM6 10C7.06087 10 8.07828 9.57857 8.82843 8.82843C9.57857 8.07828 10 7.06087 10 6C10 4.93913 9.57857 3.92172 8.82843 3.17157C8.07828 2.42143 7.06087 2 6 2C4.93913 2 3.92172 2.42143 3.17157 3.17157C2.42143 3.92172 2 4.93913 2 6C2 7.06087 2.42143 8.07828 3.17157 8.82843C3.92172 9.57857 4.93913 10 6 10ZM5.5 3.5H6.5V4.5H5.5V3.5ZM5.5 5.5H6.5V8.5H5.5V5.5Z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n);\n\n/**\n * NMB-3998 playbook §E.3 defect #9: `style.borderColors` was read unconditionally while\n * only severities 1 and 2 define it, so `<Badge borderColors={undefined} />` is what\n * severities 3, 4 and 5 have always passed. That is TS2339 on the read.\n *\n * The asymmetry is REPORTED, NOT \"FIXED\", because both of §E.3's suggested fixes are\n * product decisions that change rendered output: inventing border colours for 3-5 adds a\n * 1px border that has never been there (`Badge` applies one only \"when provided\"), and\n * deleting the read removes the border severities 1-2 do have. Neither is derivable from\n * this repository, so per §E.1 rule 2 the type records what the code DOES instead: the\n * member is optional. `Badge.borderColors` is already `string[] | undefined`, so passing\n * `undefined` was always well-typed at the receiving end — only the read was not.\n *\n * This annotation is type-only. It emits identical JavaScript and cannot move the\n * baseline. If the missing borders turn out to be the bug, that is a visual change and\n * belongs with C10's re-record.\n */\ntype SeverityBadgeStyle = {\n  backgroundColors: string[];\n  colors: string[];\n  borderColors?: string[];\n};\n\nconst SEVERITY_BADGE_STYLES: Record<1 | 2 | 3 | 4 | 5, SeverityBadgeStyle> = {\n  1: {\n    backgroundColors: ['#272727', '#ffffff'],\n    colors: ['#d9dce0', '#202435'],\n    borderColors: ['#3a3a3a', '#ece4e1']\n  },\n  2: {\n    backgroundColors: ['#272727', '#ffffff'],\n    colors: ['#d9dce0', '#202435'],\n    borderColors: ['#3a3a3a', '#ece4e1']\n  },\n  3: {\n    backgroundColors: ['#2e2301', '#faeeb3'],\n    colors: ['#eab308', '#78350F']\n  },\n  4: {\n    backgroundColors: ['#2e2301', '#faeeb3'],\n    colors: ['#eab308', '#78350F']\n  },\n  5: {\n    backgroundColors: ['#7E1B1B', 'rgba(182, 41, 2, 0.1)'],\n    colors: ['#e8d5d6', '#b62902']\n  }\n};\n\ntype SeverityBadgeOwnProps = {\n  /** Severity level (1-5). 1-2 = Info, 3-4 = Limited use, 5 = Highly restricted. */\n  severity: 1 | 2 | 3 | 4 | 5;\n  /** Badge content — string or JSX node (e.g. label with remove button). */\n  label: React.ReactNode;\n  /** Override the default information icon. Pass null to suppress. */\n  icon?: React.ReactNode;\n  /** Font size in pixels. */\n  fontSize?: number;\n  /** Font weight. */\n  fontWeight?: number;\n  /** Badge height in pixels. */\n  height?: number;\n  /** Left and right padding in pixels. */\n  horizontalPadding?: number;\n  /** Top and bottom padding in pixels. */\n  verticalPadding?: number;\n};\n\n/*\n * NMB-3998 §C.2: `rest` is spread onto `Badge`, 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 SeverityBadgeOwnProps`);\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 SeverityBadgeProps = Omit<\n  React.ComponentPropsWithoutRef<typeof Badge>,\n  keyof SeverityBadgeOwnProps\n> &\n  SeverityBadgeOwnProps;\n\n/**\n * A severity-aware badge that maps a severity level (1-5) to the appropriate\n * color scheme and icon. Thin wrapper around Badge.\n *\n * ### Import\n *\n * ```js\n * import { SeverityBadge } from \"@ntbjs/react-components/data\";\n * // named exports for advanced use\n * ```\n */\nconst SeverityBadge = React.forwardRef<any, SeverityBadgeProps>(function SeverityBadge(\n  {\n    severity,\n    label,\n    icon,\n    fontSize = 12,\n    fontWeight = 500,\n    height = 24,\n    horizontalPadding = 8,\n    verticalPadding = 2,\n    ...rest\n  },\n  forwardedRef\n) {\n  const style = SEVERITY_BADGE_STYLES[severity] || SEVERITY_BADGE_STYLES[1];\n\n  return (\n    <Badge\n      ref={forwardedRef}\n      badgeIcon={icon === undefined ? <InformationIcon /> : icon}\n      badgeContent={label}\n      backgroundColors={style.backgroundColors}\n      colors={style.colors}\n      borderColors={style.borderColors}\n      fontSize={fontSize}\n      fontWeight={fontWeight}\n      height={height}\n      horizontalPadding={horizontalPadding}\n      verticalPadding={verticalPadding}\n      {...rest}\n    />\n  );\n});\n\nexport default SeverityBadge;\n"],"names":["InformationIcon","_jsx","width","height","viewBox","fill","xmlns","children","d","SEVERITY_BADGE_STYLES","backgroundColors","colors","borderColors","SeverityBadge","React","forwardRef","severity","label","icon","fontSize","fontWeight","horizontalPadding","verticalPadding","rest","forwardedRef","style","Badge","ref","badgeIcon","undefined","badgeContent"],"mappings":";;;;AAGA,MAAMA,eAAe,GAAGA,MACtBC,GAAA,CAAA,KAAA,EAAA;AAAKC,EAAAA,KAAK,EAAC,IAAI;AAACC,EAAAA,MAAM,EAAC,IAAI;AAACC,EAAAA,OAAO,EAAC,WAAW;AAACC,EAAAA,IAAI,EAAC,MAAM;AAACC,EAAAA,KAAK,EAAC,4BAA4B;AAAAC,EAAAA,QAAA,EAC5FN,GAAA,CAAA,MAAA,EAAA;AACEO,IAAAA,CAAC,EAAC,ocAAoc;AACtcH,IAAAA,IAAI,EAAC;GACN;AAAC,CACC,CACN;AAyBD,MAAMI,qBAAoE,GAAG;AAC3E,EAAA,CAAC,EAAE;AACDC,IAAAA,gBAAgB,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AACxCC,IAAAA,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AAC9BC,IAAAA,YAAY,EAAE,CAAC,SAAS,EAAE,SAAS;GACpC;AACD,EAAA,CAAC,EAAE;AACDF,IAAAA,gBAAgB,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AACxCC,IAAAA,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AAC9BC,IAAAA,YAAY,EAAE,CAAC,SAAS,EAAE,SAAS;GACpC;AACD,EAAA,CAAC,EAAE;AACDF,IAAAA,gBAAgB,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AACxCC,IAAAA,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS;GAC9B;AACD,EAAA,CAAC,EAAE;AACDD,IAAAA,gBAAgB,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AACxCC,IAAAA,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS;GAC9B;AACD,EAAA,CAAC,EAAE;AACDD,IAAAA,gBAAgB,EAAE,CAAC,SAAS,EAAE,uBAAuB,CAAC;AACtDC,IAAAA,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS;AAC/B;AACF,CAAC;AA6CD,MAAME,aAAa,GAAGC,cAAK,CAACC,UAAU,CAA0B,SAASF,aAAaA,CACpF;EACEG,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,QAAQ,GAAG,EAAE;AACbC,EAAAA,UAAU,GAAG,GAAG;AAChBjB,EAAAA,MAAM,GAAG,EAAE;AACXkB,EAAAA,iBAAiB,GAAG,CAAC;AACrBC,EAAAA,eAAe,GAAG,CAAC;EACnB,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,KAAK,GAAGhB,qBAAqB,CAACO,QAAQ,CAAC,IAAIP,qBAAqB,CAAC,CAAC,CAAC;EAEzE,OACER,GAAA,CAACyB,KAAK,EAAA;AACJC,IAAAA,GAAG,EAAEH,YAAa;IAClBI,SAAS,EAAEV,IAAI,KAAKW,SAAS,GAAG5B,GAAA,CAACD,eAAe,EAAA,EAAE,CAAC,GAAGkB,IAAK;AAC3DY,IAAAA,YAAY,EAAEb,KAAM;IACpBP,gBAAgB,EAAEe,KAAK,CAACf,gBAAiB;IACzCC,MAAM,EAAEc,KAAK,CAACd,MAAO;IACrBC,YAAY,EAAEa,KAAK,CAACb,YAAa;AACjCO,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,UAAU,EAAEA,UAAW;AACvBjB,IAAAA,MAAM,EAAEA,MAAO;AACfkB,IAAAA,iBAAiB,EAAEA,iBAAkB;AACrCC,IAAAA,eAAe,EAAEA,eAAgB;IAAA,GAC7BC;AAAI,GACT,CAAC;AAEN,CAAC;;;;"}
+{"version":3,"file":"SeverityBadge.js","sources":["../../../src/components/data/SeverityBadge/SeverityBadge.tsx"],"sourcesContent":["import React from 'react';\nimport Badge from '../Badge/Badge';\n\nconst InformationIcon = () => (\n  <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path\n      d=\"M6 11C3.2385 11 1 8.7615 1 6C1 3.2385 3.2385 1 6 1C8.7615 1 11 3.2385 11 6C11 8.7615 8.7615 11 6 11ZM6 10C7.06087 10 8.07828 9.57857 8.82843 8.82843C9.57857 8.07828 10 7.06087 10 6C10 4.93913 9.57857 3.92172 8.82843 3.17157C8.07828 2.42143 7.06087 2 6 2C4.93913 2 3.92172 2.42143 3.17157 3.17157C2.42143 3.92172 2 4.93913 2 6C2 7.06087 2.42143 8.07828 3.17157 8.82843C3.92172 9.57857 4.93913 10 6 10ZM5.5 3.5H6.5V4.5H5.5V3.5ZM5.5 5.5H6.5V8.5H5.5V5.5Z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n);\n\n// Severities 3-5 pass undefined borderColors; type declares it optional to match code behavior, not a functional fix.\ntype SeverityBadgeStyle = {\n  backgroundColors: string[];\n  colors: string[];\n  borderColors?: string[];\n};\n\nconst SEVERITY_BADGE_STYLES: Record<1 | 2 | 3 | 4 | 5, SeverityBadgeStyle> = {\n  1: {\n    backgroundColors: ['#272727', '#ffffff'],\n    colors: ['#d9dce0', '#202435'],\n    borderColors: ['#3a3a3a', '#ece4e1']\n  },\n  2: {\n    backgroundColors: ['#272727', '#ffffff'],\n    colors: ['#d9dce0', '#202435'],\n    borderColors: ['#3a3a3a', '#ece4e1']\n  },\n  3: {\n    backgroundColors: ['#2e2301', '#faeeb3'],\n    colors: ['#eab308', '#78350F']\n  },\n  4: {\n    backgroundColors: ['#2e2301', '#faeeb3'],\n    colors: ['#eab308', '#78350F']\n  },\n  5: {\n    backgroundColors: ['#7E1B1B', 'rgba(182, 41, 2, 0.1)'],\n    colors: ['#e8d5d6', '#b62902']\n  }\n};\n\ntype SeverityBadgeOwnProps = {\n  /** Severity level (1-5). 1-2 = Info, 3-4 = Limited use, 5 = Highly restricted. */\n  severity: 1 | 2 | 3 | 4 | 5;\n  /** Badge content — string or JSX node (e.g. label with remove button). */\n  label: React.ReactNode;\n  /** Override the default information icon. Pass null to suppress. */\n  icon?: React.ReactNode;\n  /** Font size in pixels. */\n  fontSize?: number;\n  /** Font weight. */\n  fontWeight?: number;\n  /** Badge height in pixels. */\n  height?: number;\n  /** Left and right padding in pixels. */\n  horizontalPadding?: number;\n  /** Top and bottom padding in pixels. */\n  verticalPadding?: number;\n};\n\n// Omit before & — a bare intersection narrows colliding props instead of overriding them.\ntype SeverityBadgeProps = Omit<\n  React.ComponentPropsWithoutRef<typeof Badge>,\n  keyof SeverityBadgeOwnProps\n> &\n  SeverityBadgeOwnProps;\n\n/**\n * A severity-aware badge that maps a severity level (1-5) to the appropriate\n * color scheme and icon. Thin wrapper around Badge.\n *\n * ### Import\n *\n * ```js\n * import { SeverityBadge } from \"@ntbjs/react-components/data\";\n * // named exports for advanced use\n * ```\n */\nconst SeverityBadge = React.forwardRef<any, SeverityBadgeProps>(function SeverityBadge(\n  {\n    severity,\n    label,\n    icon,\n    fontSize = 12,\n    fontWeight = 500,\n    height = 24,\n    horizontalPadding = 8,\n    verticalPadding = 2,\n    ...rest\n  },\n  forwardedRef\n) {\n  const style = SEVERITY_BADGE_STYLES[severity] || SEVERITY_BADGE_STYLES[1];\n\n  return (\n    <Badge\n      ref={forwardedRef}\n      badgeIcon={icon === undefined ? <InformationIcon /> : icon}\n      badgeContent={label}\n      backgroundColors={style.backgroundColors}\n      colors={style.colors}\n      borderColors={style.borderColors}\n      fontSize={fontSize}\n      fontWeight={fontWeight}\n      height={height}\n      horizontalPadding={horizontalPadding}\n      verticalPadding={verticalPadding}\n      {...rest}\n    />\n  );\n});\n\nexport default SeverityBadge;\n"],"names":["InformationIcon","_jsx","width","height","viewBox","fill","xmlns","children","d","SEVERITY_BADGE_STYLES","backgroundColors","colors","borderColors","SeverityBadge","React","forwardRef","severity","label","icon","fontSize","fontWeight","horizontalPadding","verticalPadding","rest","forwardedRef","style","Badge","ref","badgeIcon","undefined","badgeContent"],"mappings":";;;;AAGA,MAAMA,eAAe,GAAGA,MACtBC,GAAA,CAAA,KAAA,EAAA;AAAKC,EAAAA,KAAK,EAAC,IAAI;AAACC,EAAAA,MAAM,EAAC,IAAI;AAACC,EAAAA,OAAO,EAAC,WAAW;AAACC,EAAAA,IAAI,EAAC,MAAM;AAACC,EAAAA,KAAK,EAAC,4BAA4B;AAAAC,EAAAA,QAAA,EAC5FN,GAAA,CAAA,MAAA,EAAA;AACEO,IAAAA,CAAC,EAAC,ocAAoc;AACtcH,IAAAA,IAAI,EAAC;GACN;AAAC,CACC,CACN;AASD,MAAMI,qBAAoE,GAAG;AAC3E,EAAA,CAAC,EAAE;AACDC,IAAAA,gBAAgB,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AACxCC,IAAAA,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AAC9BC,IAAAA,YAAY,EAAE,CAAC,SAAS,EAAE,SAAS;GACpC;AACD,EAAA,CAAC,EAAE;AACDF,IAAAA,gBAAgB,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AACxCC,IAAAA,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AAC9BC,IAAAA,YAAY,EAAE,CAAC,SAAS,EAAE,SAAS;GACpC;AACD,EAAA,CAAC,EAAE;AACDF,IAAAA,gBAAgB,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AACxCC,IAAAA,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS;GAC9B;AACD,EAAA,CAAC,EAAE;AACDD,IAAAA,gBAAgB,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AACxCC,IAAAA,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS;GAC9B;AACD,EAAA,CAAC,EAAE;AACDD,IAAAA,gBAAgB,EAAE,CAAC,SAAS,EAAE,uBAAuB,CAAC;AACtDC,IAAAA,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS;AAC/B;AACF,CAAC;AAuCD,MAAME,aAAa,GAAGC,cAAK,CAACC,UAAU,CAA0B,SAASF,aAAaA,CACpF;EACEG,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,QAAQ,GAAG,EAAE;AACbC,EAAAA,UAAU,GAAG,GAAG;AAChBjB,EAAAA,MAAM,GAAG,EAAE;AACXkB,EAAAA,iBAAiB,GAAG,CAAC;AACrBC,EAAAA,eAAe,GAAG,CAAC;EACnB,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,KAAK,GAAGhB,qBAAqB,CAACO,QAAQ,CAAC,IAAIP,qBAAqB,CAAC,CAAC,CAAC;EAEzE,OACER,GAAA,CAACyB,KAAK,EAAA;AACJC,IAAAA,GAAG,EAAEH,YAAa;IAClBI,SAAS,EAAEV,IAAI,KAAKW,SAAS,GAAG5B,GAAA,CAACD,eAAe,EAAA,EAAE,CAAC,GAAGkB,IAAK;AAC3DY,IAAAA,YAAY,EAAEb,KAAM;IACpBP,gBAAgB,EAAEe,KAAK,CAACf,gBAAiB;IACzCC,MAAM,EAAEc,KAAK,CAACd,MAAO;IACrBC,YAAY,EAAEa,KAAK,CAACb,YAAa;AACjCO,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,UAAU,EAAEA,UAAW;AACvBjB,IAAAA,MAAM,EAAEA,MAAO;AACfkB,IAAAA,iBAAiB,EAAEA,iBAAkB;AACrCC,IAAAA,eAAe,EAAEA,eAAgB;IAAA,GAC7BC;AAAI,GACT,CAAC;AAEN,CAAC;;;;"}

package/build/data/Tab/Tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.js","sources":["../../../src/components/data/Tab/Tab.tsx"],"sourcesContent":["import React from 'react';\nimport * as S from './Tab.styled';\n\ntype TabOwnProps = {\n  children?: any;\n  hidden?: boolean;\n  /**\n   * The tab's clickable header, conventionally a `Badge`:\n   * `<Tab trigger={<Badge>Tab title</Badge>}>`.\n   *\n   * NOT DECLARED BY THE OLD propTypes AND NOT READ BY THIS COMPONENT — which is why\n   * neither the codemod nor the widening pass could produce it, and why it is\n   * hand-written here. `Tab` is a data carrier: `Tabs.tsx` walks its children with\n   * `child.type === Tab` and lifts `child.props?.trigger` out, then renders it inside\n   * `S.TabHeader`. The `<Tab>` element itself is never mounted, so `trigger` never\n   * reaches the DOM and there is no attribute leak to fix.\n   *\n   * `ReactElement`, not `ReactNode`: `Tabs.handleTabClick` reads\n   * `tab.trigger.props.children` to build the `triggerText` it passes to `onTabClick`.\n   * A string trigger would compile under `ReactNode` and silently produce an empty\n   * `triggerText`. All 44 call sites in `src` pass a `<Badge>`.\n   */\n  trigger?: React.ReactElement<any>;\n};\n\n/*\n * NMB-3998 §C.2: `props` is spread onto `S.Tab`, 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 TabOwnProps`);\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.Tab>, keyof TabOwnProps> & TabOwnProps;\n\n/**\n * This is a component to help you get started with development.\n */\nconst Tab = React.forwardRef<any, Props>(function Tab(\n  { children, hidden = false, ...props },\n  forwardedRef\n) {\n  if (hidden) return null;\n\n  return (\n    <S.Tab ref={forwardedRef} {...props}>\n      {children}\n    </S.Tab>\n  );\n});\n\nexport default Tab;\n"],"names":["Tab","React","forwardRef","children","hidden","props","forwardedRef","_jsx","S","ref"],"mappings":";;;;AAqCA,MAAMA,GAAG,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,GAAGA,CACnD;EAAEG,QAAQ;AAAEC,EAAAA,MAAM,GAAG,KAAK;EAAE,GAAGC;AAAM,CAAC,EACtCC,YAAY,EACZ;EACA,IAAIF,MAAM,EAAE,OAAO,IAAI;AAEvB,EAAA,OACEG,GAAA,CAACC,KAAK,EAAA;AAACC,IAAAA,GAAG,EAAEH,YAAa;AAAA,IAAA,GAAKD,KAAK;AAAAF,IAAAA,QAAA,EAChCA;AAAQ,GACJ,CAAC;AAEZ,CAAC;;;;"}
+{"version":3,"file":"Tab.js","sources":["../../../src/components/data/Tab/Tab.tsx"],"sourcesContent":["import React from 'react';\nimport * as S from './Tab.styled';\n\ntype TabOwnProps = {\n  children?: any;\n  hidden?: boolean;\n  /**\n   * The tab's clickable header, conventionally a `Badge`. Not read by Tab itself; Tabs extracts it.\n   */\n  trigger?: React.ReactElement<any>;\n};\n\n// Omit before & — a bare intersection narrows colliding props instead of overriding them.\ntype Props = Omit<React.ComponentPropsWithoutRef<typeof S.Tab>, keyof TabOwnProps> & TabOwnProps;\n\n/**\n * This is a component to help you get started with development.\n */\nconst Tab = React.forwardRef<any, Props>(function Tab(\n  { children, hidden = false, ...props },\n  forwardedRef\n) {\n  if (hidden) return null;\n\n  return (\n    <S.Tab ref={forwardedRef} {...props}>\n      {children}\n    </S.Tab>\n  );\n});\n\nexport default Tab;\n"],"names":["Tab","React","forwardRef","children","hidden","props","forwardedRef","_jsx","S","ref"],"mappings":";;;;AAkBA,MAAMA,GAAG,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,GAAGA,CACnD;EAAEG,QAAQ;AAAEC,EAAAA,MAAM,GAAG,KAAK;EAAE,GAAGC;AAAM,CAAC,EACtCC,YAAY,EACZ;EACA,IAAIF,MAAM,EAAE,OAAO,IAAI;AAEvB,EAAA,OACEG,GAAA,CAACC,KAAK,EAAA;AAACC,IAAAA,GAAG,EAAEH,YAAa;AAAA,IAAA,GAAKD,KAAK;AAAAF,IAAAA,QAAA,EAChCA;AAAQ,GACJ,CAAC;AAEZ,CAAC;;;;"}

package/build/data/Tab/Tab.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.styled.js","sources":["../../../src/components/data/Tab/Tab.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 * NO GENERIC HERE, AND THAT IS THE CORRECT OUTCOME, NOT AN OMISSION. The single template\n * below reads only `props.theme`, which `ExecutionContext` already supplies via the C6\n * `DefaultTheme` augmentation, and `Tab.tsx` passes no transient prop at all — it spreads\n * `{...props}` and consumes `hidden` itself by returning `null`. Rule 2: declare only what\n * the component actually passes. This file entered the styled-generics bucket at 0 errors\n * and the only change it needs is the `shouldForwardProp` parameter annotation.\n *\n * `Tab` is not independent of `Tabs`: `Tabs.tsx` identifies its children with\n * `child.type === Tab`, so the two are one unit for any change to either's props.\n */\nimport styled from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\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 and\n * `prop.startsWith` would otherwise go unchecked.\n */\nconst shouldForwardProp = (prop: string): boolean => {\n  return prop !== 'theme' && !prop.startsWith('$');\n};\n\nexport const Tab = 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  border-bottom: 1px solid;\n  min-height: 35px;\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Tab","styled","p","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","theme","primaryFontFamily"],"mappings":";;;AAwBA,MAAMA,iBAAiB,GAAIC,IAAY,IAAc;EACnD,OAAOA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAClD,CAAC;AAEM,MAAMC,GAAG,GAAGC,MAAM,CAACC,CAAC,CACxBC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,gBAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,cAAA,EAAA,0EAAA,CAAA,EACVC,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACC,iBAAiB;;;;"}
+{"version":3,"file":"Tab.styled.js","sources":["../../../src/components/data/Tab/Tab.styled.ts"],"sourcesContent":["/*\n * No generic needed; Tab reads only theme. Tab and Tabs are coupled.\n */\nimport styled from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n// `prop` needs annotation because withConfig takes it by reference; no contextual typing otherwise.\nconst shouldForwardProp = (prop: string): boolean => {\n  return prop !== 'theme' && !prop.startsWith('$');\n};\n\nexport const Tab = 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  border-bottom: 1px solid;\n  min-height: 35px;\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Tab","styled","p","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","theme","primaryFontFamily"],"mappings":";;;AAOA,MAAMA,iBAAiB,GAAIC,IAAY,IAAc;EACnD,OAAOA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAClD,CAAC;AAEM,MAAMC,GAAG,GAAGC,MAAM,CAACC,CAAC,CACxBC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAACC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,gBAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,cAAA,EAAA,0EAAA,CAAA,EACVC,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACC,iBAAiB;;;;"}

package/build/data/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sources":["../../../src/components/data/Tabs/Tabs.tsx"],"sourcesContent":["import { isEmpty, isNil } from 'lodash';\nimport React, { Children, Fragment, useMemo, useRef, useState } from 'react';\nimport Tab from '../Tab';\nimport * as S from './Tabs.styled';\n\ntype TabsOwnProps = {\n  children?: any[] | any;\n  /**\n   * Whether `Tabs` component has a background color\n   */\n  backgroundColor?: string;\n  /**\n   * Whether `tabs` will have a predefined min-height.\n   */\n  defaultMinHeight?: string;\n  /**\n   * Custom padding.\n   */\n  customPadding?: string;\n  /**\n   * Callback for clicked tab\n   */\n  onTabClick?: (...args: any[]) => any;\n};\n\n/*\n * NMB-3998 §C.2: `props` is spread onto `S.Tabs`, 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 TabsOwnProps`);\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.Tabs>, keyof TabsOwnProps> & TabsOwnProps;\n\n/**\n * Tabs that let you group content\n *\n * ### Import\n *\n * ``` js\n * import { Tabs, Tab } from '@ntbjs/react-components/data'\n * // or\n * import Tabs from '@ntbjs/react-components/data/Tabs'\n * import Tab from '@ntbjs/react-components/data/Tab'\n * ```\n * ### Tab - Tabs - Badge\n * `Tab`, `Tabs` and `Badge` must be used in order to implement the component.\n * ```\n * <Tabs>\n *  <Tab trigger={<Badge>Tab title</Badge>}>\n *    Tab content\n *  </Tab>\n * </Tabs>\n * ```\n *  ## Wrapping\n *  Content (data displayed inside the `Tab`) is wrapped by `Tab`:\n *  ```\n * <Tab>\n *    Tab content\n * </Tab>\n * ```\n *   ### Badge\n * The tab title is wrapped by `Badge` (which is passed as the trigger prop inside `Tab`):\n *\n *Props that can be passed inside the `Badge` component are: `badgeContent`, `active`, `error`, `warning` (check out the `Badge` component documentation for props options).\n *  ```\n * <Tab trigger={<Badge>Tab title</Badge>}>\n *    Tab content\n * </Tab>\n * ```\n * All tabs are wrapped by `Tabs`:\n *  ```\n * <Tabs>\n *  <Tab trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n *  <Tab trigger={<Badge>Tab title 3</Badge>}>Tab content 3</Tab>\n *  <Tab trigger={<Badge>Tab title 4</Badge>}>Tab content 4</Tab>\n *  <Tab trigger={<Badge>Tab title 5</Badge>}>Tab content 5</Tab>\n * </Tabs>\n * ```\n *  ## Props\n * A `backgroundColor` prop can be passed as a string to set the `Tabs` component background color.\n *    ```\n *  <Tabs backgroundColor={'#bfe0d5'}>\n *  <Tab  trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n * </Tabs>\n * ```\n *  ### hidden\n * A single Tab can be hidden by using the `hidden={true||false}` prop (this is useful when the tab has empty content):\n *   ```\n *  <Tabs>\n *  <Tab hidden={true} trigger={<Badge>Tab title 1</Badge>}></Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n *  <Tab hidden={true} trigger={<Badge>Tab title 3</Badge>}></Tab>\n *  <Tab trigger={<Badge>Tab title 4</Badge>}>Tab content 4</Tab>\n *  <Tab hidden={true} trigger={<Badge>Tab title 5</Badge>}></Tab>\n * </Tabs>\n * ```\n *  ### Default minHeight\n * A `defaultMinHeight` prop can be passed to the Tabs component to set a predefined min-height.\n *\n * Pass `defaultMinHeight={'value px'}` on the `Tabs` component to use this feature.\n *   ```\n *  <Tabs defaultMinHeight={'500px'}>\n *  <Tab  trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n * </Tabs>\n * ```\n *\n *   ### Custom padding\n * A `customPadding` prop can be passed to the Tabs component to set a custom padding on the tabs. The custom padding is applied the the Tabs options,\n * not to the content within the Tabs.\n *\n * Pass `customPadding={'value px'}` on the `Tabs` component to use this feature.\n *   ```\n *  <Tabs customPadding={'40px'}>\n *  <Tab  trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n * </Tabs>\n * ```\n */\nconst Tabs = React.forwardRef<any, Props>(function Tabs(\n  {\n    children,\n    defaultMinHeight = '',\n    customPadding = 0,\n    backgroundColor,\n    onTabClick = () => {},\n    ...props\n  },\n  forwardedRef\n) {\n  const [activeTab, setActiveTab] = useState(0);\n  const contentRef = useRef(null);\n\n  const tabs = useMemo(() => {\n    const tabs = [];\n    function extractChildren(children) {\n      Children.forEach(children, (child, index) => {\n        if (isNil(child)) {\n          return null;\n        }\n\n        if (child.type === Fragment) {\n          extractChildren(child.props?.children);\n        }\n\n        if (child.props?.hidden) {\n          return null;\n        }\n\n        if (child.type === Tab) {\n          tabs.push({\n            key: index,\n            trigger: child.props?.trigger,\n            content: child.props?.children\n          });\n        }\n      });\n    }\n\n    extractChildren(children);\n\n    if (!tabs.some(tab => tab?.key === activeTab)) {\n      setActiveTab(tabs[0]?.key);\n    }\n\n    return tabs;\n  }, [children]);\n\n  const handleTabClick = tab => {\n    setActiveTab(tab.key);\n    let triggerText = '';\n\n    if (tab.trigger && tab.trigger.props && tab.trigger.props.children) {\n      triggerText = tab.trigger.props.children;\n    }\n    if (onTabClick) {\n      onTabClick({\n        ...tab,\n        triggerText: triggerText\n      });\n    }\n  };\n\n  return (\n    <S.Tabs ref={forwardedRef} $backgroundColor={backgroundColor} {...props} role=\"tablist\">\n      <S.TabHeaders custompadding={customPadding}>\n        {tabs.map(tab => (\n          <S.TabHeader\n            key={tab.key}\n            hidden={tab.hidden}\n            $active={tab.key === activeTab}\n            onClick={() => handleTabClick(tab)}\n            role=\"tab\"\n          >\n            {tab.trigger}\n          </S.TabHeader>\n        ))}\n      </S.TabHeaders>\n      <S.TabHeaderBorder custompadding={customPadding}></S.TabHeaderBorder>\n      <S.TabContent>\n        {tabs.map(tab => (\n          <div\n            ref={tab.key === activeTab?.key ? contentRef : null}\n            key={tab.key}\n            role=\"tabpanel\"\n            hidden={tab.key !== activeTab}\n            style={{\n              minHeight: !isEmpty(defaultMinHeight) ? defaultMinHeight : ''\n            }}\n          >\n            {tab.content}\n          </div>\n        ))}\n      </S.TabContent>\n    </S.Tabs>\n  );\n});\n\nexport default Tabs;\n"],"names":["Tabs","React","forwardRef","children","defaultMinHeight","customPadding","backgroundColor","onTabClick","props","forwardedRef","activeTab","setActiveTab","useState","contentRef","useRef","tabs","useMemo","extractChildren","Children","forEach","child","index","isNil","type","Fragment","hidden","Tab","push","key","trigger","content","some","tab","handleTabClick","triggerText","_jsxs","S","ref","$backgroundColor","role","_jsx","custompadding","map","$active","onClick","style","minHeight","isEmpty"],"mappings":"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"}
+{"version":3,"file":"Tabs.js","sources":["../../../src/components/data/Tabs/Tabs.tsx"],"sourcesContent":["import { isEmpty, isNil } from 'lodash';\nimport React, { Children, Fragment, useMemo, useRef, useState } from 'react';\nimport Tab from '../Tab';\nimport * as S from './Tabs.styled';\n\ntype TabsOwnProps = {\n  children?: any[] | any;\n  /**\n   * Whether `Tabs` component has a background color\n   */\n  backgroundColor?: string;\n  /**\n   * Whether `tabs` will have a predefined min-height.\n   */\n  defaultMinHeight?: string;\n  /**\n   * Custom padding.\n   */\n  customPadding?: string;\n  /**\n   * Callback for clicked tab\n   */\n  onTabClick?: (...args: any[]) => any;\n};\n\n// Omit before & — a bare intersection narrows colliding props instead of overriding them.\ntype Props = Omit<React.ComponentPropsWithoutRef<typeof S.Tabs>, keyof TabsOwnProps> & TabsOwnProps;\n\n/**\n * Tabs that let you group content\n *\n * ### Import\n *\n * ``` js\n * import { Tabs, Tab } from '@ntbjs/react-components/data'\n * // or\n * import Tabs from '@ntbjs/react-components/data/Tabs'\n * import Tab from '@ntbjs/react-components/data/Tab'\n * ```\n * ### Tab - Tabs - Badge\n * `Tab`, `Tabs` and `Badge` must be used in order to implement the component.\n * ```\n * <Tabs>\n *  <Tab trigger={<Badge>Tab title</Badge>}>\n *    Tab content\n *  </Tab>\n * </Tabs>\n * ```\n *  ## Wrapping\n *  Content (data displayed inside the `Tab`) is wrapped by `Tab`:\n *  ```\n * <Tab>\n *    Tab content\n * </Tab>\n * ```\n *   ### Badge\n * The tab title is wrapped by `Badge` (which is passed as the trigger prop inside `Tab`):\n *\n *Props that can be passed inside the `Badge` component are: `badgeContent`, `active`, `error`, `warning` (check out the `Badge` component documentation for props options).\n *  ```\n * <Tab trigger={<Badge>Tab title</Badge>}>\n *    Tab content\n * </Tab>\n * ```\n * All tabs are wrapped by `Tabs`:\n *  ```\n * <Tabs>\n *  <Tab trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n *  <Tab trigger={<Badge>Tab title 3</Badge>}>Tab content 3</Tab>\n *  <Tab trigger={<Badge>Tab title 4</Badge>}>Tab content 4</Tab>\n *  <Tab trigger={<Badge>Tab title 5</Badge>}>Tab content 5</Tab>\n * </Tabs>\n * ```\n *  ## Props\n * A `backgroundColor` prop can be passed as a string to set the `Tabs` component background color.\n *    ```\n *  <Tabs backgroundColor={'#bfe0d5'}>\n *  <Tab  trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n * </Tabs>\n * ```\n *  ### hidden\n * A single Tab can be hidden by using the `hidden={true||false}` prop (this is useful when the tab has empty content):\n *   ```\n *  <Tabs>\n *  <Tab hidden={true} trigger={<Badge>Tab title 1</Badge>}></Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n *  <Tab hidden={true} trigger={<Badge>Tab title 3</Badge>}></Tab>\n *  <Tab trigger={<Badge>Tab title 4</Badge>}>Tab content 4</Tab>\n *  <Tab hidden={true} trigger={<Badge>Tab title 5</Badge>}></Tab>\n * </Tabs>\n * ```\n *  ### Default minHeight\n * A `defaultMinHeight` prop can be passed to the Tabs component to set a predefined min-height.\n *\n * Pass `defaultMinHeight={'value px'}` on the `Tabs` component to use this feature.\n *   ```\n *  <Tabs defaultMinHeight={'500px'}>\n *  <Tab  trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n * </Tabs>\n * ```\n *\n *   ### Custom padding\n * A `customPadding` prop can be passed to the Tabs component to set a custom padding on the tabs. The custom padding is applied the the Tabs options,\n * not to the content within the Tabs.\n *\n * Pass `customPadding={'value px'}` on the `Tabs` component to use this feature.\n *   ```\n *  <Tabs customPadding={'40px'}>\n *  <Tab  trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n * </Tabs>\n * ```\n */\nconst Tabs = React.forwardRef<any, Props>(function Tabs(\n  {\n    children,\n    defaultMinHeight = '',\n    customPadding = 0,\n    backgroundColor,\n    onTabClick = () => {},\n    ...props\n  },\n  forwardedRef\n) {\n  const [activeTab, setActiveTab] = useState(0);\n  const contentRef = useRef(null);\n\n  const tabs = useMemo(() => {\n    const tabs = [];\n    function extractChildren(children) {\n      Children.forEach(children, (child, index) => {\n        if (isNil(child)) {\n          return null;\n        }\n\n        if (child.type === Fragment) {\n          extractChildren(child.props?.children);\n        }\n\n        if (child.props?.hidden) {\n          return null;\n        }\n\n        if (child.type === Tab) {\n          tabs.push({\n            key: index,\n            trigger: child.props?.trigger,\n            content: child.props?.children\n          });\n        }\n      });\n    }\n\n    extractChildren(children);\n\n    if (!tabs.some(tab => tab?.key === activeTab)) {\n      setActiveTab(tabs[0]?.key);\n    }\n\n    return tabs;\n  }, [children]);\n\n  const handleTabClick = tab => {\n    setActiveTab(tab.key);\n    let triggerText = '';\n\n    if (tab.trigger && tab.trigger.props && tab.trigger.props.children) {\n      triggerText = tab.trigger.props.children;\n    }\n    if (onTabClick) {\n      onTabClick({\n        ...tab,\n        triggerText: triggerText\n      });\n    }\n  };\n\n  return (\n    <S.Tabs ref={forwardedRef} $backgroundColor={backgroundColor} {...props} role=\"tablist\">\n      <S.TabHeaders custompadding={customPadding}>\n        {tabs.map(tab => (\n          <S.TabHeader\n            key={tab.key}\n            hidden={tab.hidden}\n            $active={tab.key === activeTab}\n            onClick={() => handleTabClick(tab)}\n            role=\"tab\"\n          >\n            {tab.trigger}\n          </S.TabHeader>\n        ))}\n      </S.TabHeaders>\n      <S.TabHeaderBorder custompadding={customPadding}></S.TabHeaderBorder>\n      <S.TabContent>\n        {tabs.map(tab => (\n          <div\n            ref={tab.key === activeTab?.key ? contentRef : null}\n            key={tab.key}\n            role=\"tabpanel\"\n            hidden={tab.key !== activeTab}\n            style={{\n              minHeight: !isEmpty(defaultMinHeight) ? defaultMinHeight : ''\n            }}\n          >\n            {tab.content}\n          </div>\n        ))}\n      </S.TabContent>\n    </S.Tabs>\n  );\n});\n\nexport default Tabs;\n"],"names":["Tabs","React","forwardRef","children","defaultMinHeight","customPadding","backgroundColor","onTabClick","props","forwardedRef","activeTab","setActiveTab","useState","contentRef","useRef","tabs","useMemo","extractChildren","Children","forEach","child","index","isNil","type","Fragment","hidden","Tab","push","key","trigger","content","some","tab","handleTabClick","triggerText","_jsxs","S","ref","$backgroundColor","role","_jsx","custompadding","map","$active","onClick","style","minHeight","isEmpty"],"mappings":"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"}