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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (139) hide show
  1. package/README.md +34 -0
  2. package/build/data/Alert/Alert.js.map +1 -1
  3. package/build/data/Alert/Alert.styled.js.map +1 -1
  4. package/build/data/Badge/Badge.js.map +1 -1
  5. package/build/data/Badge/Badge.styled.js.map +1 -1
  6. package/build/data/Popover/Popover.js.map +1 -1
  7. package/build/data/Popover/Popover.styled.js.map +1 -1
  8. package/build/data/SeverityBadge/SeverityBadge.js.map +1 -1
  9. package/build/data/Tab/Tab.js.map +1 -1
  10. package/build/data/Tab/Tab.styled.js.map +1 -1
  11. package/build/data/Tabs/Tabs.js.map +1 -1
  12. package/build/data/Tabs/Tabs.styled.js.map +1 -1
  13. package/build/data/Tooltip/Tooltip.js.map +1 -1
  14. package/build/data/Tooltip/Tooltip.styled.js.map +1 -1
  15. package/build/data/VerificationStatusIcon/VerificationStatusIcon.js.map +1 -1
  16. package/build/data/VerificationStatusIcon/VerificationStatusIcon.styled.js.map +1 -1
  17. package/build/data/_shared/FloatingArrow.styled.js.map +1 -1
  18. package/build/hooks/useEventListner.js.map +1 -1
  19. package/build/hooks/useFloatingPopover.js.map +1 -1
  20. package/build/hooks/useIsomorphicLayoutEffect.js.map +1 -1
  21. package/build/hooks/useOnClickOutside.js.map +1 -1
  22. package/build/hooks/useTooltipAutoShow.js.map +1 -1
  23. package/build/inputs/ActionButton/ActionButton.js.map +1 -1
  24. package/build/inputs/ActionButton/ActionButton.styled.js.map +1 -1
  25. package/build/inputs/Button/Button.js.map +1 -1
  26. package/build/inputs/Button/Button.styled.js.map +1 -1
  27. package/build/inputs/Checkbox/Checkbox.js.map +1 -1
  28. package/build/inputs/Checkbox/Checkbox.styled.js.map +1 -1
  29. package/build/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.js.map +1 -1
  30. package/build/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.styled.js.map +1 -1
  31. package/build/inputs/CompactStarRating/CompactStarRating.js.map +1 -1
  32. package/build/inputs/CompactStarRating/CompactStarRating.styled.js.map +1 -1
  33. package/build/inputs/CompactTextInput/CompactTextInput.js.map +1 -1
  34. package/build/inputs/CompactTextInput/CompactTextInput.styled.js.map +1 -1
  35. package/build/inputs/MultiLevelCheckbox/MultiLevelCheckbox.js.map +1 -1
  36. package/build/inputs/MultiLevelCheckbox/MultiLevelCheckbox.styled.js.map +1 -1
  37. package/build/inputs/MultiLevelCheckbox/types.js.map +1 -1
  38. package/build/inputs/MultiLevelCheckboxSelect/MultiLevelCheckboxSelect.js.map +1 -1
  39. package/build/inputs/MultiLevelCheckboxSelect/MultiLevelCheckboxSelect.styled.js.map +1 -1
  40. package/build/inputs/MultiSelect/MultiSelect.js.map +1 -1
  41. package/build/inputs/MultiSelect/MultiSelect.styled.js.map +1 -1
  42. package/build/inputs/Radio/Radio.js.map +1 -1
  43. package/build/inputs/Radio/Radio.styled.js.map +1 -1
  44. package/build/inputs/Switch/Switch.styled.js.map +1 -1
  45. package/build/inputs/TextArea/TextArea.js.map +1 -1
  46. package/build/inputs/TextArea/TextArea.styled.js.map +1 -1
  47. package/build/inputs/TextInput/TextInput.js.map +1 -1
  48. package/build/inputs/TextInput/TextInput.styled.js.map +1 -1
  49. package/build/layout/InputGroup/InputGroup.js.map +1 -1
  50. package/build/layout/InputGroup/InputGroup.styled.js.map +1 -1
  51. package/build/layout/SectionSeparator/SectionSeparator.js.map +1 -1
  52. package/build/layout/SectionSeparator/SectionSeparator.styled.js.map +1 -1
  53. package/build/styles/utils/colors-export.d.ts +6 -25
  54. package/build/utils/dateTime.js.map +1 -1
  55. package/build/utils/defaultTheme.js.map +1 -1
  56. package/build/utils/getElementRef.js.map +1 -1
  57. package/build/utils/parseTrigger.js.map +1 -1
  58. package/build/widgets/AssetAction/AssetAction.js.map +1 -1
  59. package/build/widgets/AssetAction/AssetAction.styled.js.map +1 -1
  60. package/build/widgets/AssetActionsBase/AssetActionsBase.js.map +1 -1
  61. package/build/widgets/AssetActionsBase/AssetActionsBase.styled.js.map +1 -1
  62. package/build/widgets/AssetGallery/AssetGallery.js.map +1 -1
  63. package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryBase.js.map +1 -1
  64. package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryBase.styled.js.map +1 -1
  65. package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryCompactCard/AssetGalleryCompactCard.js.map +1 -1
  66. package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryCompactCard/AssetGalleryCompactCard.styled.js.map +1 -1
  67. package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryGridCard/AssetGalleryGridCard.js.map +1 -1
  68. package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryGridCard/AssetGalleryGridCard.styled.js.map +1 -1
  69. package/build/widgets/AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.js.map +1 -1
  70. package/build/widgets/AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.styled.js.map +1 -1
  71. package/build/widgets/ContextMenu/ContextMenu.js.map +1 -1
  72. package/build/widgets/ContextMenu/ContextMenu.styled.js.map +1 -1
  73. package/build/widgets/ContextMenu/ContextMenuItem/ContextMenuItem.js.map +1 -1
  74. package/build/widgets/ContextMenu/ContextMenuItem/ContextMenuItem.styled.js.map +1 -1
  75. package/build/widgets/ContextMenu/ContextMenuItemsGroup/ContextMenuItemsGroup.js.map +1 -1
  76. package/build/widgets/ContextMenu/ContextMenuItemsGroup/ContextMenuItemsGroup.styled.js.map +1 -1
  77. package/build/widgets/InfoCard/InfoCard.js.map +1 -1
  78. package/build/widgets/InfoCard/InfoCard.styled.js.map +1 -1
  79. package/build/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.js.map +1 -1
  80. package/build/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.styled.js.map +1 -1
  81. package/build/widgets/Instructions/Instructions.js.map +1 -1
  82. package/build/widgets/Instructions/Instructions.styled.js.map +1 -1
  83. package/build/widgets/ProgressBar/ProgressBar.js.map +1 -1
  84. package/build/widgets/ProgressBar/ProgressBar.styled.js.map +1 -1
  85. package/build/widgets/SummaryCard/SummaryCard.js.map +1 -1
  86. package/build/widgets/SummaryCard/SummaryCard.styled.js.map +1 -1
  87. package/package.json +8 -1
  88. package/styles/utils/colors-export.d.ts +6 -25
  89. package/types/components/data/Alert/Alert.styled.d.ts +6 -37
  90. package/types/components/data/Badge/Badge.d.ts +1 -9
  91. package/types/components/data/Badge/Badge.styled.d.ts +0 -99
  92. package/types/components/data/Popover/Popover.d.ts +11 -100
  93. package/types/components/data/Tab/Tab.d.ts +1 -14
  94. package/types/components/data/Tabs/Tabs.styled.d.ts +1 -17
  95. package/types/components/data/Tooltip/Tooltip.d.ts +4 -50
  96. package/types/components/data/VerificationStatusIcon/VerificationStatusIcon.styled.d.ts +3 -22
  97. package/types/components/data/_shared/FloatingArrow.styled.d.ts +1 -101
  98. package/types/components/inputs/ActionButton/ActionButton.styled.d.ts +2 -20
  99. package/types/components/inputs/Button/Button.styled.d.ts +0 -42
  100. package/types/components/inputs/Checkbox/Checkbox.d.ts +0 -9
  101. package/types/components/inputs/Checkbox/Checkbox.styled.d.ts +6 -10
  102. package/types/components/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.styled.d.ts +4 -57
  103. package/types/components/inputs/CompactStarRating/CompactStarRating.styled.d.ts +3 -55
  104. package/types/components/inputs/CompactTextInput/CompactTextInput.styled.d.ts +4 -32
  105. package/types/components/inputs/MultiLevelCheckbox/MultiLevelCheckbox.styled.d.ts +2 -10
  106. package/types/components/inputs/MultiLevelCheckbox/types.d.ts +3 -46
  107. package/types/components/inputs/MultiSelect/MultiSelect.d.ts +0 -57
  108. package/types/components/inputs/MultiSelect/MultiSelect.styled.d.ts +0 -65
  109. package/types/components/inputs/Radio/Radio.styled.d.ts +3 -3
  110. package/types/components/inputs/Switch/Switch.styled.d.ts +3 -7
  111. package/types/components/inputs/TextArea/TextArea.d.ts +0 -4
  112. package/types/components/inputs/TextArea/TextArea.styled.d.ts +5 -7
  113. package/types/components/inputs/TextInput/TextInput.styled.d.ts +1 -1
  114. package/types/components/layout/SectionSeparator/SectionSeparator.styled.d.ts +2 -9
  115. package/types/components/widgets/AssetAction/AssetAction.styled.d.ts +2 -7
  116. package/types/components/widgets/AssetGallery/AssetGalleryBase/AssetGalleryBase.d.ts +0 -12
  117. package/types/components/widgets/AssetGallery/AssetGalleryBase/AssetGalleryCompactCard/AssetGalleryCompactCard.styled.d.ts +7 -55
  118. package/types/components/widgets/AssetGallery/AssetGalleryBase/AssetGalleryGridCard/AssetGalleryGridCard.styled.d.ts +7 -43
  119. package/types/components/widgets/AssetGallery/asset.types.d.ts +31 -148
  120. package/types/components/widgets/AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.styled.d.ts +6 -20
  121. package/types/components/widgets/ContextMenu/ContextMenu.d.ts +1 -17
  122. package/types/components/widgets/ContextMenu/ContextMenuItem/ContextMenuItem.styled.d.ts +5 -13
  123. package/types/components/widgets/ContextMenu/ContextMenuItemsGroup/ContextMenuItemsGroup.d.ts +0 -18
  124. package/types/components/widgets/InfoCard/InfoCard.styled.d.ts +2 -19
  125. package/types/components/widgets/InstructionSeverityDisplay/InstructionSeverityDisplay.styled.d.ts +9 -19
  126. package/types/components/widgets/Instructions/Instructions.styled.d.ts +2 -14
  127. package/types/components/widgets/ProgressBar/ProgressBar.styled.d.ts +6 -43
  128. package/types/components/widgets/SummaryCard/SummaryCard.styled.d.ts +7 -46
  129. package/types/hooks/useElementSize.d.ts +3 -14
  130. package/types/hooks/useEventListner.d.ts +6 -38
  131. package/types/hooks/useFloatingPopover.d.ts +9 -90
  132. package/types/hooks/useIsomorphicLayoutEffect.d.ts +0 -23
  133. package/types/hooks/useOnClickOutside.d.ts +5 -23
  134. package/types/hooks/useTooltipAutoShow.d.ts +8 -57
  135. package/types/styles/utils/colors-export.d.ts +6 -25
  136. package/types/utils/dateTime.d.ts +2 -7
  137. package/types/utils/defaultTheme.d.ts +13 -92
  138. package/types/utils/getElementRef.d.ts +0 -19
  139. package/types/utils/parseTrigger.d.ts +8 -78
@@ -1 +1 @@
1
- {"version":3,"file":"ActionButton.styled.js","sources":["../../../src/components/inputs/ActionButton/ActionButton.styled.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { rgba } from 'polished';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n/*\n * THE ONE-LINE VARIANT OF THE PREDICATE 33 OTHER FILES SPELL OVER THREE LINES — kept\n * on one line, because reformatting it is churn in a diff that has to be reviewable as\n * \"types only\". Single-argument, and it stays that way: the peer floor is\n * `styled-components: >=5.1.0` and the two majors disagree on the second parameter (v6\n * `elementToBeCreated`, v5.1 `defaultValidatorFn`), so a one-parameter function is the\n * only form correct on both. Rules in\n * `layout/SectionSeparator/SectionSeparator.styled.ts`, derivation in\n * `scripts/TS-MIGRATION-PLAYBOOK.md` §J.4. `prop` needs the annotation because\n * `withConfig` takes this by reference, so it gets no contextual typing.\n */\nconst shouldForwardProp = (prop: string): boolean => prop !== 'theme' && !prop.startsWith('$');\n\n/**\n * Props of the one styled component in this file. Value types from\n * `ActionButton.tsx`'s propTypes; all optional per §J.5 — and here that is not\n * theoretical, `ActionButton.tsx` spreads `{...props}` onto this root, which is the\n * measured TS2769 case.\n *\n * `disabled` is deliberately ABSENT: it is a real `ButtonHTMLAttributes` member, the\n * component passes it, and the template only uses the `&:disabled` CSS pseudo-class\n * rather than reading the prop. Nothing to declare. §J.9, first row.\n */\nexport interface ActionButtonStyleProps {\n /**\n * `actionWidthHeight` — `PropTypes.array`, `[width, height]` in px, defaulted to\n * `[40, 40]` BY THE COMPONENT (which is not a default here, so still optional).\n * `number[]` rather than `[number, number]`: the propTypes accept any array and the\n * template only ever indexes `[0]` and `[1]`.\n *\n * NOTE FOR THE `strictNullChecks` FLIP: these seven reads are UNGUARDED\n * (`props.$actionWidthHeight[0]`, not `props.$actionWidthHeight?.[0]`), unlike every\n * other transient prop in the converted files. They compile today because\n * `strictNullChecks` is off; when it is turned on at the end of the migration this\n * is the site that needs either `?.` plus a fallback or a required prop, and either\n * is a behaviour question rather than a typing one — so it is recorded, not changed\n * here. (`$backgroundColors` below is already read with `?.`.)\n */\n $actionWidthHeight?: number[];\n /** `backgroundColors` — `PropTypes.arrayOf(PropTypes.string)`, `[dark, light]`. */\n $backgroundColors?: string[];\n /** `active` — `PropTypes.bool`. Locks the hover state. */\n $active?: boolean;\n /** `useShadow` — `PropTypes.bool`. Component defaults it to `false`. */\n $useShadow?: boolean;\n}\n\nexport const ActionButton = styled.button\n .withConfig({\n shouldForwardProp\n })\n .attrs<ActionButtonStyleProps>(applyDefaultTheme)`\n display: inline-flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n width: ${props => `${props.$actionWidthHeight[0]}px`};\n height: ${props => `${props.$actionWidthHeight[1]}px`};\n border: 0;\n color: inherit;\n background-color: transparent;\n\n background-position: center;\n background-repeat: no-repeat;\n background-size: 0 0;\n transition: background-size 250ms ease;\n cursor: pointer;\n\n ${props => {\n const darkThemeBgColor = props?.$backgroundColors?.[0] ?? props.theme.getColor('gray-600');\n const lightThemeBgColor = props?.$backgroundColors?.[1] ?? props.theme.getColor('gray-200');\n return props.theme.themeProp(\n 'background-image',\n `radial-gradient(circle at center, ${darkThemeBgColor} 50%, transparent 51%)`,\n `radial-gradient(circle at center, ${lightThemeBgColor} 50%, transparent 51%)`\n );\n }}\n\n &:hover:not(:disabled) {\n background-size: ${props =>\n Math.max(props.$actionWidthHeight[0], props.$actionWidthHeight[1]) * 2}px\n ${props => Math.max(props.$actionWidthHeight[0], props.$actionWidthHeight[1]) * 2}px;\n\n svg {\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-700')\n )};\n }\n }\n\n ${props =>\n props.$active &&\n css`\n background-size: ${Math.max(props.$actionWidthHeight[0], props.$actionWidthHeight[1]) * 2}px\n ${Math.max(props.$actionWidthHeight[0], props.$actionWidthHeight[1]) * 2}px;\n\n svg {\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-700')\n )};\n }\n `}\n\n ${props =>\n props.$useShadow\n ? props.theme.themeProp(\n 'box-shadow',\n `0px 3px 6px ${rgba(props.theme.getColor('black'), 0.7)}`,\n `0px 3px 6px ${props.theme.getColor('black')}`\n )\n : null}\n\n &:disabled {\n opacity: 0.5;\n color: inherit;\n cursor: not-allowed;\n }\n\n svg {\n width: 100%;\n max-width: ${props => `${props.$actionWidthHeight[0] - 15}px`};\n max-height: ${props => `${props.$actionWidthHeight[1] - 15}px`};\n pointer-events: none;\n transition: color 250ms;\n }\n`;\n"],"names":["shouldForwardProp","prop","startsWith","ActionButton","styled","button","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","$actionWidthHeight","darkThemeBgColor","$backgroundColors","theme","getColor","lightThemeBgColor","themeProp","Math","max","$active","css","$useShadow","rgba"],"mappings":"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"}
1
+ {"version":3,"file":"ActionButton.styled.js","sources":["../../../src/components/inputs/ActionButton/ActionButton.styled.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { rgba } from 'polished';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\n/* Single-argument for styled-components >=5.1.0; prop needs annotation for withConfig. */\nconst shouldForwardProp = (prop: string): boolean => prop !== 'theme' && !prop.startsWith('$');\n\n/**\n * Props of the styled ActionButton. `disabled` is absent: it's a real ButtonHTMLAttributes member.\n */\nexport interface ActionButtonStyleProps {\n /**\n * Width and height `[width, height]` in px. Unguarded array access—needs `?.` when strictNullChecks flips.\n */\n $actionWidthHeight?: number[];\n /** `backgroundColors` — `PropTypes.arrayOf(PropTypes.string)`, `[dark, light]`. */\n $backgroundColors?: string[];\n /** `active` — `PropTypes.bool`. Locks the hover state. */\n $active?: boolean;\n /** `useShadow` — `PropTypes.bool`. Component defaults it to `false`. */\n $useShadow?: boolean;\n}\n\nexport const ActionButton = styled.button\n .withConfig({\n shouldForwardProp\n })\n .attrs<ActionButtonStyleProps>(applyDefaultTheme)`\n display: inline-flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n width: ${props => `${props.$actionWidthHeight[0]}px`};\n height: ${props => `${props.$actionWidthHeight[1]}px`};\n border: 0;\n color: inherit;\n background-color: transparent;\n\n background-position: center;\n background-repeat: no-repeat;\n background-size: 0 0;\n transition: background-size 250ms ease;\n cursor: pointer;\n\n ${props => {\n const darkThemeBgColor = props?.$backgroundColors?.[0] ?? props.theme.getColor('gray-600');\n const lightThemeBgColor = props?.$backgroundColors?.[1] ?? props.theme.getColor('gray-200');\n return props.theme.themeProp(\n 'background-image',\n `radial-gradient(circle at center, ${darkThemeBgColor} 50%, transparent 51%)`,\n `radial-gradient(circle at center, ${lightThemeBgColor} 50%, transparent 51%)`\n );\n }}\n\n &:hover:not(:disabled) {\n background-size: ${props =>\n Math.max(props.$actionWidthHeight[0], props.$actionWidthHeight[1]) * 2}px\n ${props => Math.max(props.$actionWidthHeight[0], props.$actionWidthHeight[1]) * 2}px;\n\n svg {\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-700')\n )};\n }\n }\n\n ${props =>\n props.$active &&\n css`\n background-size: ${Math.max(props.$actionWidthHeight[0], props.$actionWidthHeight[1]) * 2}px\n ${Math.max(props.$actionWidthHeight[0], props.$actionWidthHeight[1]) * 2}px;\n\n svg {\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-100'),\n props.theme.getColor('gray-700')\n )};\n }\n `}\n\n ${props =>\n props.$useShadow\n ? props.theme.themeProp(\n 'box-shadow',\n `0px 3px 6px ${rgba(props.theme.getColor('black'), 0.7)}`,\n `0px 3px 6px ${props.theme.getColor('black')}`\n )\n : null}\n\n &:disabled {\n opacity: 0.5;\n color: inherit;\n cursor: not-allowed;\n }\n\n svg {\n width: 100%;\n max-width: ${props => `${props.$actionWidthHeight[0] - 15}px`};\n max-height: ${props => `${props.$actionWidthHeight[1] - 15}px`};\n pointer-events: none;\n transition: color 250ms;\n }\n`;\n"],"names":["shouldForwardProp","prop","startsWith","ActionButton","styled","button","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","$actionWidthHeight","darkThemeBgColor","$backgroundColors","theme","getColor","lightThemeBgColor","themeProp","Math","max","$active","css","$useShadow","rgba"],"mappings":";;;;AAKA,MAAMA,iBAAiB,GAAIC,IAAY,IAAcA,IAAI,KAAK,OAAO,IAAI,CAACA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC;AAkBvF,MAAMC,YAAY,GAAGC,MAAM,CAACC,MAAM,CACtCC,UAAU,CAAC;AACVN,EAAAA;AACF,CAAC,CAAC,CACDO,KAAK,CAAyBC,iBAAiB,CAAC,CAAAF,UAAA,CAAA;EAAAG,WAAA,EAAA,kCAAA;EAAAC,WAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,wFAAA,EAAA,UAAA,EAAA,uLAAA,EAAA,0CAAA,EAAA,KAAA,EAAA,SAAA,EAAA,KAAA,EAAA,GAAA,EAAA,qFAAA,EAAA,cAAA,EAAA,+CAAA,CAAA,EAKxCC,KAAK,IAAI,CAAA,EAAGA,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,CAAA,EAAA,CAAI,EAC1CD,KAAK,IAAI,CAAA,EAAGA,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,CAAA,EAAA,CAAI,EAWnDD,KAAK,IAAI;AACT,EAAA,MAAME,gBAAgB,GAAGF,KAAK,EAAEG,iBAAiB,GAAG,CAAC,CAAC,IAAIH,KAAK,CAACI,KAAK,CAACC,QAAQ,CAAC,UAAU,CAAC;AAC1F,EAAA,MAAMC,iBAAiB,GAAGN,KAAK,EAAEG,iBAAiB,GAAG,CAAC,CAAC,IAAIH,KAAK,CAACI,KAAK,CAACC,QAAQ,CAAC,UAAU,CAAC;AAC3F,EAAA,OAAOL,KAAK,CAACI,KAAK,CAACG,SAAS,CAC1B,kBAAkB,EAClB,CAAA,kCAAA,EAAqCL,gBAAgB,CAAA,sBAAA,CAAwB,EAC7E,CAAA,kCAAA,EAAqCI,iBAAiB,wBACxD,CAAC;AACH,CAAC,EAGoBN,KAAK,IACtBQ,IAAI,CAACC,GAAG,CAACT,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,EAAED,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,EACpED,KAAK,IAAIQ,IAAI,CAACC,GAAG,CAACT,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,EAAED,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,EAG/ED,KAAK,IACLA,KAAK,CAACI,KAAK,CAACG,SAAS,CACnB,OAAO,EACPP,KAAK,CAACI,KAAK,CAACC,QAAQ,CAAC,UAAU,CAAC,EAChCL,KAAK,CAACI,KAAK,CAACC,QAAQ,CAAC,UAAU,CACjC,CAAC,EAILL,KAAK,IACLA,KAAK,CAACU,OAAO,IACbC,GAAG,CAAA,CAAA,kBAAA,EAAA,KAAA,EAAA,SAAA,EAAA,IAAA,CAAA,EACkBH,IAAI,CAACC,GAAG,CAACT,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,EAAED,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,EACrFO,IAAI,CAACC,GAAG,CAACT,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,EAAED,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,EAGtED,KAAK,CAACI,KAAK,CAACG,SAAS,CACrB,OAAO,EACPP,KAAK,CAACI,KAAK,CAACC,QAAQ,CAAC,UAAU,CAAC,EAChCL,KAAK,CAACI,KAAK,CAACC,QAAQ,CAAC,UAAU,CACjC,CAAC,CAEJ,EAEDL,KAAK,IACLA,KAAK,CAACY,UAAU,GACZZ,KAAK,CAACI,KAAK,CAACG,SAAS,CACnB,YAAY,EACZ,eAAeM,IAAI,CAACb,KAAK,CAACI,KAAK,CAACC,QAAQ,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,EAAE,EACzD,CAAA,YAAA,EAAeL,KAAK,CAACI,KAAK,CAACC,QAAQ,CAAC,OAAO,CAAC,CAAA,CAC9C,CAAC,GACD,IAAI,EAUKL,KAAK,IAAI,CAAA,EAAGA,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,GAAG,EAAE,CAAA,EAAA,CAAI,EAC/CD,KAAK,IAAI,CAAA,EAAGA,KAAK,CAACC,kBAAkB,CAAC,CAAC,CAAC,GAAG,EAAE,CAAA,EAAA,CAAI;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sources":["../../../src/components/inputs/Button/Button.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef } from 'react';\nimport * as S from './Button.styled';\n\nimport Popover from '../../data/Popover';\nimport ContextMenu from '../../widgets/ContextMenu/ContextMenu';\n\nimport { ReactComponent as DropdownIcon } from '../../../icons/expand-more.svg';\n\ntype ButtonOwnProps = {\n /**\n * On-click effect for the main button\n */\n onClickEffect?: (...args: any[]) => any;\n /**\n * Whether the button is a \"single action button\". For single action buttons,\n * the entire button opens the dropdown menu, not just the arrow.\n */\n singleAction?: boolean;\n /**\n * Whether the button must have an active dropdown menu.\n */\n activeDropdown?: boolean;\n /**\n * An array containing nodes of the `ContextMenuItem` component\n */\n dropdownItems?: React.ReactNode;\n /**\n * Whether the button should be styled as a secondary button\n */\n secondary?: boolean;\n /**\n * Whether the button should be styled with borders\n */\n outlined?: boolean;\n /**\n * Whether the button should customize the border width\n */\n border?: number;\n /**\n * Whether the button should be of 100% width\n */\n block?: boolean;\n /**\n * Optional icon to be displayed on the left side of the button\n */\n icon?: React.ReactElement<any>;\n /**\n * Which size variation should be used\n */\n size?: 'x-small' | 'small' | 'normal' | 'large';\n /**\n * Whether the button should be disabled\n */\n disabled?: boolean;\n /**\n * Whether the button should be initiated in a loading state\n */\n loading?: boolean;\n /**\n * Optional custom classnames for the HTML element\n */\n className?: string;\n /**\n * Main content of the button\n */\n children: any;\n /**\n * Gap between arrow and text in single action button\n */\n singleActionGap?: number;\n /**\n * Custom min-width\n */\n width?: number;\n};\n\n/*\n * NMB-3998 §C.2: `props` is spread onto `S.Button`, 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 ButtonOwnProps`);\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.Button>, keyof ButtonOwnProps> &\n ButtonOwnProps;\n\n/**\n * Buttons communicate actions that users can take.\n *\n * ### Import\n *\n * ``` js\n * import { Button } from '@ntbjs/react-components/inputs'\n * // or\n * import Button from '@ntbjs/react-components/inputs/Button'\n * ```\n */\nconst Button = React.forwardRef<any, Props>(function Button(\n {\n onClickEffect,\n singleAction = false,\n activeDropdown = false,\n dropdownItems,\n secondary,\n outlined,\n block = false,\n icon,\n size = 'normal',\n disabled,\n loading,\n className,\n children,\n singleActionGap = 34,\n width,\n border = 2,\n ...props\n },\n forwardedRef\n) {\n const [loadingState, setLoadingState] = useState(loading || false);\n const [loadingStep, setLoadingStep] = useState(113);\n const loadingInterval = useRef(0);\n const loadingTimeout = useRef(0);\n const [dropdownIsActive, setDropdownIsActive] = useState(false);\n\n const isMounted = useRef(true);\n\n useEffect(() => {\n return () => {\n isMounted.current = false;\n clearInterval(loadingInterval.current);\n clearTimeout(loadingTimeout.current);\n };\n }, []);\n\n const enableLoading = () => {\n loadingInterval.current = setInterval(() => {\n setLoadingStep(currentLoadingStep => {\n const newLoadingStep = Math.round(currentLoadingStep - (15 * currentLoadingStep) / 100);\n\n if (newLoadingStep === currentLoadingStep) {\n clearInterval(loadingInterval.current);\n }\n\n return newLoadingStep;\n });\n }, 300);\n\n setLoadingState(true);\n };\n\n const disableLoading = () => {\n clearInterval(loadingInterval.current);\n setLoadingStep(0);\n\n loadingTimeout.current = setTimeout(() => {\n if (isMounted.current) {\n setLoadingState(false);\n setLoadingStep(113);\n }\n }, 500);\n };\n\n useEffect(() => {\n if (loading) {\n enableLoading();\n } else {\n disableLoading();\n }\n\n return () => {\n clearInterval(loadingInterval.current);\n clearTimeout(loadingTimeout.current);\n };\n }, [loading]);\n\n const handleDropdownButtonClick = () => {\n setDropdownIsActive(true);\n };\n\n const handleDropdownClose = () => {\n setDropdownIsActive(false);\n };\n\n return (\n <S.ButtonWrapper>\n {!singleAction ? (\n <S.MainButtonWrapper\n $activeDropdown={activeDropdown}\n $dropdownItems={dropdownItems}\n $outlined={outlined}\n $secondary={secondary}\n $block={block}\n >\n <S.MainButtonContainer\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n $block={block}\n >\n <S.Button\n ref={forwardedRef}\n onClick={onClickEffect}\n $border={border}\n $singleaction={singleAction}\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n $block={block}\n size={size}\n disabled={disabled}\n className={className}\n aria-busy={disabled}\n $width={width}\n {...props}\n >\n <S.ButtonContent $loading={loadingState} size={size}>\n {icon}\n {children}\n </S.ButtonContent>\n <S.LoadingIndicator\n $loading={loadingState}\n style={{\n opacity: loadingState ? 1 : 0\n }}\n >\n <S.LoadingIndicatorSvg viewBox=\"22 22 44 44\">\n <S.LoadingIndicatorSvgCircle\n cx=\"44\"\n cy=\"44\"\n r=\"18\"\n fill=\"none\"\n strokeWidth=\"4\"\n stroke=\"currentColor\"\n style={{\n strokeDashoffset: `${loadingStep}px`\n }}\n />\n </S.LoadingIndicatorSvg>\n </S.LoadingIndicator>\n </S.Button>\n </S.MainButtonContainer>\n {(activeDropdown || dropdownItems) && (\n <S.DropdownButtonContainer\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n >\n <Popover\n content={<ContextMenu>{dropdownItems}</ContextMenu>}\n placement={'bottom-end'}\n arrow={false}\n contextMenu={true}\n onHide={handleDropdownClose}\n >\n <S.Button\n ref={forwardedRef}\n $singleaction={singleAction}\n $singleactiongap={singleActionGap}\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n $border={border}\n $block={block}\n size={size}\n disabled={disabled}\n onClick={handleDropdownButtonClick}\n className={dropdownIsActive ? 'dropdown-is-active' : ''}\n $width={width}\n >\n <DropdownIcon />\n </S.Button>\n </Popover>\n </S.DropdownButtonContainer>\n )}\n </S.MainButtonWrapper>\n ) : (\n <>\n <S.MainButtonContainerSingle\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n className={className}\n >\n <S.DropdownButtonContainer $singleaction={singleAction}>\n <Popover\n content={<ContextMenu>{dropdownItems}</ContextMenu>}\n placement={'bottom-end'}\n arrow={false}\n contextMenu={true}\n onHide={handleDropdownClose}\n >\n <S.Button\n ref={forwardedRef}\n $singleaction={singleAction}\n $singleactiongap={singleActionGap}\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n $border={border}\n $block={block}\n size={size}\n disabled={disabled}\n onClick={handleDropdownButtonClick}\n className={dropdownIsActive ? 'dropdown-is-active' : ''}\n $width={width}\n >\n <S.ButtonContent $loading={loadingState} size={size} $singleaction={singleAction}>\n {icon}\n {children}\n </S.ButtonContent>\n <DropdownIcon />\n </S.Button>\n </Popover>\n </S.DropdownButtonContainer>\n </S.MainButtonContainerSingle>\n </>\n )}\n </S.ButtonWrapper>\n );\n});\n\nexport default Button;\n"],"names":["Button","React","forwardRef","onClickEffect","singleAction","activeDropdown","dropdownItems","secondary","outlined","block","icon","size","disabled","loading","className","children","singleActionGap","width","border","props","forwardedRef","loadingState","setLoadingState","useState","loadingStep","setLoadingStep","loadingInterval","useRef","loadingTimeout","dropdownIsActive","setDropdownIsActive","isMounted","useEffect","current","clearInterval","clearTimeout","enableLoading","setInterval","currentLoadingStep","newLoadingStep","Math","round","disableLoading","setTimeout","handleDropdownButtonClick","handleDropdownClose","_jsx","S","_jsxs","$activeDropdown","$dropdownItems","$outlined","$secondary","$block","ref","onClick","$border","$singleaction","$width","$loading","style","opacity","viewBox","cx","cy","r","fill","strokeWidth","stroke","strokeDashoffset","Popover","content","ContextMenu","placement","arrow","contextMenu","onHide","$singleactiongap","DropdownIcon","_Fragment"],"mappings":"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"}
1
+ {"version":3,"file":"Button.js","sources":["../../../src/components/inputs/Button/Button.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef } from 'react';\nimport * as S from './Button.styled';\n\nimport Popover from '../../data/Popover';\nimport ContextMenu from '../../widgets/ContextMenu/ContextMenu';\n\nimport { ReactComponent as DropdownIcon } from '../../../icons/expand-more.svg';\n\ntype ButtonOwnProps = {\n /**\n * On-click effect for the main button\n */\n onClickEffect?: (...args: any[]) => any;\n /**\n * Whether the button is a \"single action button\". For single action buttons,\n * the entire button opens the dropdown menu, not just the arrow.\n */\n singleAction?: boolean;\n /**\n * Whether the button must have an active dropdown menu.\n */\n activeDropdown?: boolean;\n /**\n * An array containing nodes of the `ContextMenuItem` component\n */\n dropdownItems?: React.ReactNode;\n /**\n * Whether the button should be styled as a secondary button\n */\n secondary?: boolean;\n /**\n * Whether the button should be styled with borders\n */\n outlined?: boolean;\n /**\n * Whether the button should customize the border width\n */\n border?: number;\n /**\n * Whether the button should be of 100% width\n */\n block?: boolean;\n /**\n * Optional icon to be displayed on the left side of the button\n */\n icon?: React.ReactElement<any>;\n /**\n * Which size variation should be used\n */\n size?: 'x-small' | 'small' | 'normal' | 'large';\n /**\n * Whether the button should be disabled\n */\n disabled?: boolean;\n /**\n * Whether the button should be initiated in a loading state\n */\n loading?: boolean;\n /**\n * Optional custom classnames for the HTML element\n */\n className?: string;\n /**\n * Main content of the button\n */\n children: any;\n /**\n * Gap between arrow and text in single action button\n */\n singleActionGap?: number;\n /**\n * Custom min-width\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.Button>, keyof ButtonOwnProps> &\n ButtonOwnProps;\n\n/**\n * Buttons communicate actions that users can take.\n *\n * ### Import\n *\n * ``` js\n * import { Button } from '@ntbjs/react-components/inputs'\n * // or\n * import Button from '@ntbjs/react-components/inputs/Button'\n * ```\n */\nconst Button = React.forwardRef<any, Props>(function Button(\n {\n onClickEffect,\n singleAction = false,\n activeDropdown = false,\n dropdownItems,\n secondary,\n outlined,\n block = false,\n icon,\n size = 'normal',\n disabled,\n loading,\n className,\n children,\n singleActionGap = 34,\n width,\n border = 2,\n ...props\n },\n forwardedRef\n) {\n const [loadingState, setLoadingState] = useState(loading || false);\n const [loadingStep, setLoadingStep] = useState(113);\n const loadingInterval = useRef(0);\n const loadingTimeout = useRef(0);\n const [dropdownIsActive, setDropdownIsActive] = useState(false);\n\n const isMounted = useRef(true);\n\n useEffect(() => {\n return () => {\n isMounted.current = false;\n clearInterval(loadingInterval.current);\n clearTimeout(loadingTimeout.current);\n };\n }, []);\n\n const enableLoading = () => {\n loadingInterval.current = setInterval(() => {\n setLoadingStep(currentLoadingStep => {\n const newLoadingStep = Math.round(currentLoadingStep - (15 * currentLoadingStep) / 100);\n\n if (newLoadingStep === currentLoadingStep) {\n clearInterval(loadingInterval.current);\n }\n\n return newLoadingStep;\n });\n }, 300);\n\n setLoadingState(true);\n };\n\n const disableLoading = () => {\n clearInterval(loadingInterval.current);\n setLoadingStep(0);\n\n loadingTimeout.current = setTimeout(() => {\n if (isMounted.current) {\n setLoadingState(false);\n setLoadingStep(113);\n }\n }, 500);\n };\n\n useEffect(() => {\n if (loading) {\n enableLoading();\n } else {\n disableLoading();\n }\n\n return () => {\n clearInterval(loadingInterval.current);\n clearTimeout(loadingTimeout.current);\n };\n }, [loading]);\n\n const handleDropdownButtonClick = () => {\n setDropdownIsActive(true);\n };\n\n const handleDropdownClose = () => {\n setDropdownIsActive(false);\n };\n\n return (\n <S.ButtonWrapper>\n {!singleAction ? (\n <S.MainButtonWrapper\n $activeDropdown={activeDropdown}\n $dropdownItems={dropdownItems}\n $outlined={outlined}\n $secondary={secondary}\n $block={block}\n >\n <S.MainButtonContainer\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n $block={block}\n >\n <S.Button\n ref={forwardedRef}\n onClick={onClickEffect}\n $border={border}\n $singleaction={singleAction}\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n $block={block}\n size={size}\n disabled={disabled}\n className={className}\n aria-busy={disabled}\n $width={width}\n {...props}\n >\n <S.ButtonContent $loading={loadingState} size={size}>\n {icon}\n {children}\n </S.ButtonContent>\n <S.LoadingIndicator\n $loading={loadingState}\n style={{\n opacity: loadingState ? 1 : 0\n }}\n >\n <S.LoadingIndicatorSvg viewBox=\"22 22 44 44\">\n <S.LoadingIndicatorSvgCircle\n cx=\"44\"\n cy=\"44\"\n r=\"18\"\n fill=\"none\"\n strokeWidth=\"4\"\n stroke=\"currentColor\"\n style={{\n strokeDashoffset: `${loadingStep}px`\n }}\n />\n </S.LoadingIndicatorSvg>\n </S.LoadingIndicator>\n </S.Button>\n </S.MainButtonContainer>\n {(activeDropdown || dropdownItems) && (\n <S.DropdownButtonContainer\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n >\n <Popover\n content={<ContextMenu>{dropdownItems}</ContextMenu>}\n placement={'bottom-end'}\n arrow={false}\n contextMenu={true}\n onHide={handleDropdownClose}\n >\n <S.Button\n ref={forwardedRef}\n $singleaction={singleAction}\n $singleactiongap={singleActionGap}\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n $border={border}\n $block={block}\n size={size}\n disabled={disabled}\n onClick={handleDropdownButtonClick}\n className={dropdownIsActive ? 'dropdown-is-active' : ''}\n $width={width}\n >\n <DropdownIcon />\n </S.Button>\n </Popover>\n </S.DropdownButtonContainer>\n )}\n </S.MainButtonWrapper>\n ) : (\n <>\n <S.MainButtonContainerSingle\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n className={className}\n >\n <S.DropdownButtonContainer $singleaction={singleAction}>\n <Popover\n content={<ContextMenu>{dropdownItems}</ContextMenu>}\n placement={'bottom-end'}\n arrow={false}\n contextMenu={true}\n onHide={handleDropdownClose}\n >\n <S.Button\n ref={forwardedRef}\n $singleaction={singleAction}\n $singleactiongap={singleActionGap}\n $dropdownItems={dropdownItems}\n $secondary={secondary}\n $outlined={outlined}\n $border={border}\n $block={block}\n size={size}\n disabled={disabled}\n onClick={handleDropdownButtonClick}\n className={dropdownIsActive ? 'dropdown-is-active' : ''}\n $width={width}\n >\n <S.ButtonContent $loading={loadingState} size={size} $singleaction={singleAction}>\n {icon}\n {children}\n </S.ButtonContent>\n <DropdownIcon />\n </S.Button>\n </Popover>\n </S.DropdownButtonContainer>\n </S.MainButtonContainerSingle>\n </>\n )}\n </S.ButtonWrapper>\n );\n});\n\nexport default Button;\n"],"names":["Button","React","forwardRef","onClickEffect","singleAction","activeDropdown","dropdownItems","secondary","outlined","block","icon","size","disabled","loading","className","children","singleActionGap","width","border","props","forwardedRef","loadingState","setLoadingState","useState","loadingStep","setLoadingStep","loadingInterval","useRef","loadingTimeout","dropdownIsActive","setDropdownIsActive","isMounted","useEffect","current","clearInterval","clearTimeout","enableLoading","setInterval","currentLoadingStep","newLoadingStep","Math","round","disableLoading","setTimeout","handleDropdownButtonClick","handleDropdownClose","_jsx","S","_jsxs","$activeDropdown","$dropdownItems","$outlined","$secondary","$block","ref","onClick","$border","$singleaction","$width","$loading","style","opacity","viewBox","cx","cy","r","fill","strokeWidth","stroke","strokeDashoffset","Popover","content","ContextMenu","placement","arrow","contextMenu","onHide","$singleactiongap","DropdownIcon","_Fragment"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Button.styled.js","sources":["../../../src/components/inputs/Button/Button.styled.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nimport type { ReactNode } from 'react';\n\n/*\n * Single-argument, and it stays that way — peer floor `styled-components: >=5.1.0`\n * and the two majors disagree on the second parameter. Rules in\n * `layout/SectionSeparator/SectionSeparator.styled.ts`, derivation in\n * `scripts/TS-MIGRATION-PLAYBOOK.md` §J.4. `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\n/**\n * `size` — `PropTypes.oneOf(['x-small', 'small', 'normal', 'large'])`, component default\n * `'normal'`. Closed on purpose (§J.6): `Button` and `ButtonContent` compare against\n * three of the four members, so a mistyped size is TS2367 rather than a dead branch.\n *\n * IT HAS NO `$`, AND THAT IS A DEFECT. `size` is not a member of\n * `ButtonHTMLAttributes` (it is an `<input>`/`<select>` attribute), which is why the\n * five reads of it were TS2339, and `shouldForwardProp` forwards every non-`$` prop —\n * so `size=\"normal\"` is on every rendered `<button>` and every `ButtonContent`\n * `<div>` today, and both are in the recorded render baseline. Fix = rename `$size` at\n * both ends; removes a DOM attribute → C10 with its re-record. §E.4 third case.\n */\ntype ButtonSize = 'x-small' | 'small' | 'normal' | 'large';\n\n/**\n * `dropdownItems` — `PropTypes.node`, an array of `ContextMenuItem`s.\n *\n * `ReactNode` and not `boolean`: the templates only ever test it for truthiness, but\n * what is passed is the node itself, and recording what the code does is the rule\n * (§J.6). It is transient, so it never reaches the DOM.\n */\ntype DropdownItems = ReactNode;\n\n/**\n * `Button`'s props — nine of them, which is why they are a named interface here rather\n * than inline. All optional per §J.5, and here that is load-bearing twice over:\n * `Button.tsx` spreads `{...props}` onto this root, and it renders `S.Button` at three\n * sites that pass different subsets (only the two dropdown sites pass\n * `$singleactiongap`).\n *\n * `disabled` is deliberately ABSENT: on a `styled.button` it is a genuine\n * `ButtonHTMLAttributes` member, so the read at `props.disabled &&` already typechecks\n * and the attribute belongs on the element (§J.9, first row).\n */\nexport interface ButtonStyleProps {\n /** `border` — `PropTypes.number`, default `2`. Interpolated as `${…}px`, so a string\n * here would already render `border: 2pxpx solid`. */\n $border?: number;\n /** `secondary` — `PropTypes.bool`. */\n $secondary?: boolean;\n /** `outlined` — `PropTypes.bool`. */\n $outlined?: boolean;\n /** `dropdownItems` — see `DropdownItems`. */\n $dropdownItems?: DropdownItems;\n /** `block` — `PropTypes.bool`, default `false`. Full-width. */\n $block?: boolean;\n /** `size` — see `ButtonSize`. Leaks to the DOM; see there. */\n size?: ButtonSize;\n /** `singleAction` — `PropTypes.bool`, default `false`. */\n $singleaction?: boolean;\n /** `singleActionGap` — `PropTypes.number`, default `34`. Interpolated as `${…}px`.\n * Passed only at the two dropdown `S.Button` sites, which is one of the reasons\n * every member here is optional. */\n $singleactiongap?: number;\n /** `width` — `PropTypes.number`, the custom `min-width`, interpolated as `${…}px`. */\n $width?: number;\n}\n\nexport const Button = styled.button\n .withConfig({\n shouldForwardProp\n })\n .attrs<ButtonStyleProps>(applyDefaultTheme)`\n position: relative;\n border-radius: 3px;\n font-family: inherit;\n font-size: 0.875rem;\n font-weight: 400;\n padding: 12px 16px;\n cursor: pointer;\n background: ${props => props.theme.getColor('emerald-500')};\n border: ${props => props.$border}px solid ${props => props.theme.getColor('emerald-500')};\n transition:\n all 250ms,\n opacity 200ms;\n\n &:hover,\n &.dropdown-is-active {\n background: #296c58;\n border-color: #296c58;\n }\n\n ${props =>\n props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('white'))}\n\n && {\n ${props =>\n props.$secondary &&\n css`\n background: ${props => props.theme.getColor('gray-200')};\n border-color: ${props => props.theme.getColor('gray-200')};\n\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-700'),\n props.theme.getColor('gray-700')\n )}\n\n &:hover,\n &.dropdown-is-active {\n background: ${props => props.theme.getColor('gray-300')};\n border-color: ${props => props.theme.getColor('gray-300')};\n }\n `};\n }\n\n && {\n ${props =>\n props.$outlined &&\n css`\n background: transparent;\n transition: none;\n\n ${props.theme.themeProp(\n 'border-color',\n props.theme.getColor('emerald-400'),\n props.theme.getColor('emerald-500')\n )}\n\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('emerald-400'),\n props.theme.getColor('emerald-500')\n )}\n\n &:hover,\n &.dropdown-is-active {\n background-color: #296c58;\n\n ${props.theme.themeProp(\n 'border-color',\n props.theme.getColor('emerald-600'),\n props.theme.getColor('emerald-600')\n )}\n\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-200'),\n props.theme.getColor('gray-200')\n )}\n }\n `};\n }\n\n && {\n ${props =>\n props.$outlined &&\n props.$secondary &&\n css`\n ${props.theme.themeProp(\n 'border-color',\n props.theme.getColor('gray-400'),\n props.theme.getColor('gray-700')\n )}\n\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-200'),\n props.theme.getColor('gray-700')\n )}\n\n &:hover,\n &.dropdown-is-active {\n background: ${props.theme.getColor('gray-300')};\n\n ${props.theme.themeProp(\n 'border-color',\n props.theme.getColor('gray-300'),\n props.theme.getColor('gray-300')\n )}\n\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-700'),\n props.theme.getColor('gray-700')\n )}\n }\n `};\n }\n\n && {\n ${props =>\n props.$outlined &&\n props.$secondary &&\n props.$dropdownItems &&\n css`\n &:hover,\n &.dropdown-is-active {\n ${props.theme.themeProp(\n 'border-color',\n props.theme.getColor('gray-300'),\n props.theme.getColor('gray-300')\n )}\n }\n `};\n }\n\n ${props =>\n props.$block &&\n css`\n width: 100%;\n `};\n\n ${props =>\n props.disabled &&\n css`\n opacity: 0.5;\n cursor: not-allowed;\n pointer-events: none;\n `};\n\n ${props =>\n props.size === 'x-small' &&\n css`\n padding: 1px 16px;\n height: 24px;\n `};\n\n ${props =>\n props.size === 'small' &&\n css`\n padding: 6px 16px;\n `};\n\n ${props =>\n props.size === 'large' &&\n css`\n padding: 16px 16px;\n `};\n\n ${props =>\n props.$singleaction &&\n css`\n display: flex;\n align-items: center;\n gap: ${props.$singleactiongap}px;\n border-radius: 3px !important;\n transition:\n all 250ms,\n opacity 200ms;\n `};\n\n ${props =>\n props.$width &&\n css`\n min-width: ${props.$width}px;\n justify-content: center;\n `};\n`;\n\nexport const ButtonContent = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<{\n /** `size` — see `ButtonSize`. Leaks onto this `<div>` too; see there. */\n size?: ButtonSize;\n /** `loadingState` — the component's own state, so `boolean`. */\n $loading?: boolean;\n /** `singleAction` — passed only at the single-action site. */\n $singleaction?: boolean;\n }>(applyDefaultTheme)`\n display: flex;\n justify-content: center;\n align-items: center;\n transform: scale(1);\n opacity: 1;\n transition: all 200ms;\n\n > svg {\n width: 100%;\n max-width: 16px;\n max-height: 16px;\n margin-right: 8px;\n\n ${props =>\n props.size === 'small' &&\n css`\n max-width: 13px;\n max-height: 13px;\n `};\n\n ${props =>\n props.size === 'x-small' &&\n css`\n max-width: 11px;\n max-height: 11px;\n `};\n }\n\n ${props =>\n props.$loading &&\n css`\n transform: scale(0.95);\n opacity: 0;\n `}\n\n ${props =>\n props.$singleaction &&\n css`\n svg {\n width: 100% !important;\n height: 100% !important;\n margin-right: 24px;\n }\n `};\n`;\n\nexport const LoadingIndicator = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<{ $loading?: boolean }>(applyDefaultTheme)`\n position: absolute;\n height: 100%;\n width: 100%;\n top: 0;\n left: 0;\n padding: 4px;\n background: inherit;\n opacity: 0;\n transition: opacity 200ms;\n box-sizing: border-box;\n\n ${props =>\n props.$loading &&\n css`\n opacity: 1;\n `}\n`;\n\nexport const LoadingIndicatorSvg = styled.svg\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n height: 100%;\n color: inherit;\n transform: rotate(-88deg);\n`;\n\nexport const LoadingIndicatorSvgCircle = styled.circle\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n transition: stroke-dashoffset 300ms linear;\n stroke-dasharray: 113;\n`;\n\n/*\n * `$block` IS READ HERE AND PASSED NOWHERE — declared so the read typechecks, and\n * recorded as a defect. `Button.tsx` renders `<S.ButtonWrapper>` with NO props at all\n * (it is the outermost element, and the `block` handling is done by `MainButtonWrapper`\n * / `MainButtonContainer` / `S.Button` instead), so `props.$block` is always `undefined`\n * and this `width: 100%` has never applied. Passing it, or deleting the block, changes\n * rendered CSS → C9/C10 with the baseline re-record, not a type-only commit.\n */\nexport const ButtonWrapper = styled.span\n .withConfig({\n shouldForwardProp\n })\n .attrs<{ $block?: boolean }>(applyDefaultTheme)`\n white-space: nowrap;\n display: flex;\n ${props =>\n props.$block &&\n css`\n width: 100%;\n `}\n`;\n\n/** The dropdown-state props the three container `<div>`s share. */\ninterface DropdownContainerStyleProps {\n /** `activeDropdown` — `PropTypes.bool`, default `false`. */\n $activeDropdown?: boolean;\n /** `dropdownItems` — see `DropdownItems`. */\n $dropdownItems?: DropdownItems;\n}\n\nexport const MainButtonWrapper = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<\n DropdownContainerStyleProps & {\n /** `block` — full-width. */\n $block?: boolean;\n /** `outlined` — suppresses the wrapper background. */\n $outlined?: boolean;\n /** `secondary` — picks the grey background over the emerald one. */\n $secondary?: boolean;\n }\n >(applyDefaultTheme)`\n border-radius: 3px;\n ${props =>\n props.$block &&\n css`\n width: 100%;\n display: flex;\n `}\n\n ${props => {\n return (\n (props.$activeDropdown || props.$dropdownItems) &&\n !props.$outlined &&\n css`\n background: ${props.$secondary\n ? props.theme.getColor('gray-200')\n : props.theme.getColor('emerald-500')};\n `\n );\n }};\n`;\n\n/*\n * TWO DEAD READS HERE, BOTH DECLARED AND NEITHER FIXED.\n *\n * 1. `props.outlined` (in the second `button {}` block) HAS NO `$` while `Button.tsx`\n * passes `$outlined` — so this is the §E.3 dead-branch class, exactly\n * `Badge.styled`'s `props.elevated` vs `$elevated`. `props.outlined` is always\n * `undefined`, so `border-right: none` HAS NEVER APPLIED to a dropdown-adjacent\n * outlined button. Repointing it to `$outlined` ACTIVATES A BRANCH THAT HAS NEVER\n * FIRED, which changes rendered CSS, so it belongs to C9/C10 with the baseline\n * re-record. Declared here (as the non-`$` name it actually reads) so the file\n * typechecks without blessing it — and note nothing passes `outlined`, so unlike\n * `size` it does not currently leak to the DOM either.\n * 2. `$activeDropdown` is read and NOT passed to this component (`Button.tsx` gives it\n * `$dropdownItems`, `$secondary`, `$outlined`, `$block` only). Both reads are\n * `(props.$activeDropdown || props.$dropdownItems)`, so the `||` still works via the\n * second operand and the visible behaviour is \"dropdownItems only\". Declared, not\n * wired up.\n */\nexport const MainButtonContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<\n DropdownContainerStyleProps & {\n /** `block` — full-width. */\n $block?: boolean;\n /** DEAD READ, see above. Nothing passes it; `$outlined` is what arrives. */\n outlined?: boolean;\n }\n >(applyDefaultTheme)`\n display: inline-block;\n\n ${props =>\n props.$block &&\n css`\n flex: 1;\n width: 100%;\n `}\n\n button {\n ${props =>\n (props.$activeDropdown || props.$dropdownItems) &&\n css`\n border-bottom-right-radius: 0;\n border-top-right-radius: 0;\n `};\n\n ${props =>\n (props.$activeDropdown || props.$dropdownItems) &&\n props.outlined &&\n css`\n border-right: none;\n `};\n }\n`;\n\n/*\n * TWO MORE READ-BUT-NEVER-PASSED PROPS, declared and recorded, not fixed.\n * `Button.tsx` renders `<S.MainButtonContainerSingle $dropdownItems $secondary\n * $outlined className>`, so:\n * - `$singleaction` is always `undefined` — and this is the SINGLE-ACTION branch of\n * the component, so the `display: flex` block below has never applied even though\n * it is the only reason this component exists separately from\n * `MainButtonContainer`. (`$secondary` / `$outlined` are passed but never read\n * here, which is the harmless mirror image of the same mistake.)\n * - `$activeDropdown` is always `undefined`; the `||` falls through to\n * `$dropdownItems`, as in `MainButtonContainer`.\n * Passing either changes rendered CSS → C9/C10 with the re-record.\n */\nexport const MainButtonContainerSingle = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<\n DropdownContainerStyleProps & {\n /** DEAD READ, see above: the single-action layout never applies. */\n $singleaction?: boolean;\n }\n >(applyDefaultTheme)`\n display: inline-block;\n width: 100%;\n ${props =>\n props.$singleaction &&\n css`\n display: flex;\n align-items: center;\n border-radius: 3px !important;\n transition:\n all 250ms,\n opacity 200ms;\n `};\n\n button {\n ${props =>\n (props.$activeDropdown || props.$dropdownItems) &&\n css`\n border-bottom-right-radius: 0;\n border-top-right-radius: 0;\n `};\n }\n`;\n\n/*\n * The one component whose `$singleaction` reads are BOTH live: `Button.tsx` renders this\n * with `$singleaction={singleAction}` in the single-action branch and without it in the\n * other, and `!props.$singleaction` is written for exactly that absence — which is also\n * why the prop stays optional (§J.5).\n */\nexport const DropdownButtonContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<{ $singleaction?: boolean }>(applyDefaultTheme)`\n display: inline-block;\n\n button {\n border-bottom-left-radius: 0;\n border-top-left-radius: 0;\n\n ${props => !props.$singleaction && 'border-left: none'};\n }\n\n svg {\n color: inherit;\n height: 7px;\n width: 12px;\n\n ${props => !props.$singleaction && 'margin-bottom: 1px'};\n }\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Button","styled","button","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","theme","getColor","$border","themeProp","$secondary","css","$outlined","$dropdownItems","$block","disabled","size","$singleaction","$singleactiongap","$width","ButtonContent","div","$loading","LoadingIndicator","LoadingIndicatorSvg","svg","LoadingIndicatorSvgCircle","circle","ButtonWrapper","span","MainButtonWrapper","$activeDropdown","MainButtonContainer","outlined","MainButtonContainerSingle","DropdownButtonContainer"],"mappings":"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"}
1
+ {"version":3,"file":"Button.styled.js","sources":["../../../src/components/inputs/Button/Button.styled.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nimport type { ReactNode } from 'react';\n\nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\ntype ButtonSize = 'x-small' | 'small' | 'normal' | 'large';\ntype DropdownItems = ReactNode;\n\nexport interface ButtonStyleProps {\n $border?: number;\n $secondary?: boolean;\n $outlined?: boolean;\n $dropdownItems?: DropdownItems;\n $block?: boolean;\n size?: ButtonSize;\n $singleaction?: boolean;\n $singleactiongap?: number;\n $width?: number;\n}\n\nexport const Button = styled.button\n .withConfig({\n shouldForwardProp\n })\n .attrs<ButtonStyleProps>(applyDefaultTheme)`\n position: relative;\n border-radius: 3px;\n font-family: inherit;\n font-size: 0.875rem;\n font-weight: 400;\n padding: 12px 16px;\n cursor: pointer;\n background: ${props => props.theme.getColor('emerald-500')};\n border: ${props => props.$border}px solid ${props => props.theme.getColor('emerald-500')};\n transition:\n all 250ms,\n opacity 200ms;\n\n &:hover,\n &.dropdown-is-active {\n background: #296c58;\n border-color: #296c58;\n }\n\n ${props =>\n props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('white'))}\n\n && {\n ${props =>\n props.$secondary &&\n css`\n background: ${props => props.theme.getColor('gray-200')};\n border-color: ${props => props.theme.getColor('gray-200')};\n\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-700'),\n props.theme.getColor('gray-700')\n )}\n\n &:hover,\n &.dropdown-is-active {\n background: ${props => props.theme.getColor('gray-300')};\n border-color: ${props => props.theme.getColor('gray-300')};\n }\n `};\n }\n\n && {\n ${props =>\n props.$outlined &&\n css`\n background: transparent;\n transition: none;\n\n ${props.theme.themeProp(\n 'border-color',\n props.theme.getColor('emerald-400'),\n props.theme.getColor('emerald-500')\n )}\n\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('emerald-400'),\n props.theme.getColor('emerald-500')\n )}\n\n &:hover,\n &.dropdown-is-active {\n background-color: #296c58;\n\n ${props.theme.themeProp(\n 'border-color',\n props.theme.getColor('emerald-600'),\n props.theme.getColor('emerald-600')\n )}\n\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-200'),\n props.theme.getColor('gray-200')\n )}\n }\n `};\n }\n\n && {\n ${props =>\n props.$outlined &&\n props.$secondary &&\n css`\n ${props.theme.themeProp(\n 'border-color',\n props.theme.getColor('gray-400'),\n props.theme.getColor('gray-700')\n )}\n\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-200'),\n props.theme.getColor('gray-700')\n )}\n\n &:hover,\n &.dropdown-is-active {\n background: ${props.theme.getColor('gray-300')};\n\n ${props.theme.themeProp(\n 'border-color',\n props.theme.getColor('gray-300'),\n props.theme.getColor('gray-300')\n )}\n\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-700'),\n props.theme.getColor('gray-700')\n )}\n }\n `};\n }\n\n && {\n ${props =>\n props.$outlined &&\n props.$secondary &&\n props.$dropdownItems &&\n css`\n &:hover,\n &.dropdown-is-active {\n ${props.theme.themeProp(\n 'border-color',\n props.theme.getColor('gray-300'),\n props.theme.getColor('gray-300')\n )}\n }\n `};\n }\n\n ${props =>\n props.$block &&\n css`\n width: 100%;\n `};\n\n ${props =>\n props.disabled &&\n css`\n opacity: 0.5;\n cursor: not-allowed;\n pointer-events: none;\n `};\n\n ${props =>\n props.size === 'x-small' &&\n css`\n padding: 1px 16px;\n height: 24px;\n `};\n\n ${props =>\n props.size === 'small' &&\n css`\n padding: 6px 16px;\n `};\n\n ${props =>\n props.size === 'large' &&\n css`\n padding: 16px 16px;\n `};\n\n ${props =>\n props.$singleaction &&\n css`\n display: flex;\n align-items: center;\n gap: ${props.$singleactiongap}px;\n border-radius: 3px !important;\n transition:\n all 250ms,\n opacity 200ms;\n `};\n\n ${props =>\n props.$width &&\n css`\n min-width: ${props.$width}px;\n justify-content: center;\n `};\n`;\n\nexport const ButtonContent = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<{\n /** `size` — see `ButtonSize`. Leaks onto this `<div>` too; see there. */\n size?: ButtonSize;\n /** `loadingState` — the component's own state, so `boolean`. */\n $loading?: boolean;\n /** `singleAction` — passed only at the single-action site. */\n $singleaction?: boolean;\n }>(applyDefaultTheme)`\n display: flex;\n justify-content: center;\n align-items: center;\n transform: scale(1);\n opacity: 1;\n transition: all 200ms;\n\n > svg {\n width: 100%;\n max-width: 16px;\n max-height: 16px;\n margin-right: 8px;\n\n ${props =>\n props.size === 'small' &&\n css`\n max-width: 13px;\n max-height: 13px;\n `};\n\n ${props =>\n props.size === 'x-small' &&\n css`\n max-width: 11px;\n max-height: 11px;\n `};\n }\n\n ${props =>\n props.$loading &&\n css`\n transform: scale(0.95);\n opacity: 0;\n `}\n\n ${props =>\n props.$singleaction &&\n css`\n svg {\n width: 100% !important;\n height: 100% !important;\n margin-right: 24px;\n }\n `};\n`;\n\nexport const LoadingIndicator = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<{ $loading?: boolean }>(applyDefaultTheme)`\n position: absolute;\n height: 100%;\n width: 100%;\n top: 0;\n left: 0;\n padding: 4px;\n background: inherit;\n opacity: 0;\n transition: opacity 200ms;\n box-sizing: border-box;\n\n ${props =>\n props.$loading &&\n css`\n opacity: 1;\n `}\n`;\n\nexport const LoadingIndicatorSvg = styled.svg\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n height: 100%;\n color: inherit;\n transform: rotate(-88deg);\n`;\n\nexport const LoadingIndicatorSvgCircle = styled.circle\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n transition: stroke-dashoffset 300ms linear;\n stroke-dasharray: 113;\n`;\n\n/*\n * `$block` IS READ HERE AND PASSED NOWHERE — declared so the read typechecks, and\n * recorded as a defect. `Button.tsx` renders `<S.ButtonWrapper>` with NO props at all\n * (it is the outermost element, and the `block` handling is done by `MainButtonWrapper`\n * / `MainButtonContainer` / `S.Button` instead), so `props.$block` is always `undefined`\n * and this `width: 100%` has never applied. Passing it, or deleting the block, changes\n * rendered CSS → C9/C10 with the baseline re-record, not a type-only commit.\n */\nexport const ButtonWrapper = styled.span\n .withConfig({\n shouldForwardProp\n })\n .attrs<{ $block?: boolean }>(applyDefaultTheme)`\n white-space: nowrap;\n display: flex;\n ${props =>\n props.$block &&\n css`\n width: 100%;\n `}\n`;\n\n/** The dropdown-state props the three container `<div>`s share. */\ninterface DropdownContainerStyleProps {\n /** `activeDropdown` — `PropTypes.bool`, default `false`. */\n $activeDropdown?: boolean;\n /** `dropdownItems` — see `DropdownItems`. */\n $dropdownItems?: DropdownItems;\n}\n\nexport const MainButtonWrapper = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<\n DropdownContainerStyleProps & {\n /** `block` — full-width. */\n $block?: boolean;\n /** `outlined` — suppresses the wrapper background. */\n $outlined?: boolean;\n /** `secondary` — picks the grey background over the emerald one. */\n $secondary?: boolean;\n }\n >(applyDefaultTheme)`\n border-radius: 3px;\n ${props =>\n props.$block &&\n css`\n width: 100%;\n display: flex;\n `}\n\n ${props => {\n return (\n (props.$activeDropdown || props.$dropdownItems) &&\n !props.$outlined &&\n css`\n background: ${props.$secondary\n ? props.theme.getColor('gray-200')\n : props.theme.getColor('emerald-500')};\n `\n );\n }};\n`;\n\n/*\n * Two dead reads, declared but not fixed:\n *\n * 1. `props.outlined` lacks the `$` that `Button.tsx` passes, so `border-right: none` has\n * never applied. Repointing it activates a branch that never fired, changing rendered CSS.\n * 2. `$activeDropdown` is read but never passed; both reads are\n * `(props.$activeDropdown || props.$dropdownItems)`, so behaviour is \"dropdownItems only\".\n */\nexport const MainButtonContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<\n DropdownContainerStyleProps & {\n /** `block` — full-width. */\n $block?: boolean;\n /** DEAD READ, see above. Nothing passes it; `$outlined` is what arrives. */\n outlined?: boolean;\n }\n >(applyDefaultTheme)`\n display: inline-block;\n\n ${props =>\n props.$block &&\n css`\n flex: 1;\n width: 100%;\n `}\n\n button {\n ${props =>\n (props.$activeDropdown || props.$dropdownItems) &&\n css`\n border-bottom-right-radius: 0;\n border-top-right-radius: 0;\n `};\n\n ${props =>\n (props.$activeDropdown || props.$dropdownItems) &&\n props.outlined &&\n css`\n border-right: none;\n `};\n }\n`;\n\n/*\n * TWO MORE READ-BUT-NEVER-PASSED PROPS, declared and recorded, not fixed.\n * `Button.tsx` renders `<S.MainButtonContainerSingle $dropdownItems $secondary\n * $outlined className>`, so:\n * - `$singleaction` is always `undefined` — and this is the SINGLE-ACTION branch of\n * the component, so the `display: flex` block below has never applied even though\n * it is the only reason this component exists separately from\n * `MainButtonContainer`. (`$secondary` / `$outlined` are passed but never read\n * here, which is the harmless mirror image of the same mistake.)\n * - `$activeDropdown` is always `undefined`; the `||` falls through to\n * `$dropdownItems`, as in `MainButtonContainer`.\n * Passing either changes rendered CSS → C9/C10 with the re-record.\n */\nexport const MainButtonContainerSingle = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<\n DropdownContainerStyleProps & {\n /** DEAD READ, see above: the single-action layout never applies. */\n $singleaction?: boolean;\n }\n >(applyDefaultTheme)`\n display: inline-block;\n width: 100%;\n ${props =>\n props.$singleaction &&\n css`\n display: flex;\n align-items: center;\n border-radius: 3px !important;\n transition:\n all 250ms,\n opacity 200ms;\n `};\n\n button {\n ${props =>\n (props.$activeDropdown || props.$dropdownItems) &&\n css`\n border-bottom-right-radius: 0;\n border-top-right-radius: 0;\n `};\n }\n`;\n\n/*\n * The one component whose `$singleaction` reads are BOTH live: `Button.tsx` renders this\n * with `$singleaction={singleAction}` in the single-action branch and without it in the\n * other, and `!props.$singleaction` is written for exactly that absence — which is also\n * why the prop stays optional.\n */\nexport const DropdownButtonContainer = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<{ $singleaction?: boolean }>(applyDefaultTheme)`\n display: inline-block;\n\n button {\n border-bottom-left-radius: 0;\n border-top-left-radius: 0;\n\n ${props => !props.$singleaction && 'border-left: none'};\n }\n\n svg {\n color: inherit;\n height: 7px;\n width: 12px;\n\n ${props => !props.$singleaction && 'margin-bottom: 1px'};\n }\n`;\n"],"names":["shouldForwardProp","prop","startsWith","Button","styled","button","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","theme","getColor","$border","themeProp","$secondary","css","$outlined","$dropdownItems","$block","disabled","size","$singleaction","$singleactiongap","$width","ButtonContent","div","$loading","LoadingIndicator","LoadingIndicatorSvg","svg","LoadingIndicatorSvgCircle","circle","ButtonWrapper","span","MainButtonWrapper","$activeDropdown","MainButtonContainer","outlined","MainButtonContainerSingle","DropdownButtonContainer"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.js","sources":["../../../src/components/inputs/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\n\nimport { nanoid } from 'nanoid';\n\nimport { isEmpty } from 'lodash';\nimport * as S from './Checkbox.styled';\n\ntype Props = {\n /**\n * Whether the checkbox is checked\n */\n checked?: boolean;\n /**\n * Whether the checkbox should be checked or unchecked by default\n */\n defaultChecked?: boolean;\n /**\n * The checkbox' label\n */\n label?: string | React.ReactElement<any>;\n /**\n * Whether the checkbox is disabled\n */\n disabled?: boolean;\n /**\n * Whether the checkbox is read-only\n */\n readOnly?: boolean;\n /**\n * The checkbox' name\n */\n name?: string;\n /**\n * The checkbox' value\n *\n * `string | number`, not the `PropTypes.string` this replaces. `MultiLevelCheckbox`\n * renders `<Checkbox value={node.value} …>` and a node's value is\n * `MultiLevelCheckboxNodeValue = string | number`, so a numeric value reaches this\n * prop through a public API today and `oneOf`-style validation never noticed because\n * the two components' propTypes were never compared. The value is forwarded\n * unchanged onto `<input type=\"checkbox\">`, whose own React type is\n * `string | number | readonly string[]`, so this widening records reality and emits\n * identical markup.\n */\n value?: string | number;\n /**\n * Description of the checkbox\n */\n description?: string;\n /**\n * Whether there's an error. Error message can be passed as a `string` to be displayed below the checkbox.\n */\n error?: boolean | string;\n /**\n * Whether the checkbox is indeterminate. This will display a dash in the checkbox instead of the default checkmark.\n */\n indeterminate?: boolean;\n /**\n * Mutes the color of the visual checkbox – Does not mute the label or other parts of the Checkbox\n */\n muted?: boolean;\n /**\n * On-change effect\n */\n onChange?: (...args: any[]) => any;\n /**\n * On-blur effect\n */\n onBlur?: (...args: any[]) => any;\n /**\n * Optional class name for the HTML element\n */\n className?: string;\n /**\n * Optional in-line styling for the HTML element\n */\n style?: any;\n /**\n * Visual variant. `green` (default) uses emerald fill. `black` uses themed black/white square (24px, rounded), inverted check.\n */\n variant?: 'green' | 'black';\n};\n\n/**\n * Checkboxes allow the user to select one or more items from a set.\n *\n * If you have a single option, avoid using a checkbox and use an on/off switch (`Switch` component) instead.\n *\n *\n * ### Import\n *\n * ``` js\n * import { Checkbox } from '@ntbjs/react-components/inputs'\n * // or\n * import Checkbox from '@ntbjs/react-components/inputs/Checkbox'\n * ```\n */\nconst Checkbox = React.forwardRef<any, Props>(function Checkbox(\n {\n checked,\n defaultChecked,\n disabled = false,\n readOnly = false,\n name,\n value,\n description,\n error,\n indeterminate = false,\n muted,\n label,\n onChange,\n onBlur,\n className,\n style,\n variant = 'green'\n },\n forwardedRef\n) {\n const [uniqueId] = useState(nanoid());\n\n /*\n * NMB-3998: `typeof` instead of lodash `isBoolean`, the same failure documented at\n * length in TextInput.tsx. `@types/lodash` is not installed and lodash 4 ships no\n * types, so `isBoolean` is `any` and narrows nothing; `hasError` widened to\n * `string | boolean` and `S.Description`'s `$error?: boolean` rejected it (TS2769).\n * The value is already a boolean at runtime either way, so this records behaviour\n * rather than widening the styled generic to a `string` it can never receive.\n */\n const hasError = useMemo(() => {\n if (typeof error === 'boolean') {\n return error;\n }\n\n return !isEmpty(error);\n }, [error]);\n\n const descriptionText = useMemo(() => {\n if (!isEmpty(error)) {\n return error;\n }\n\n if (!isEmpty(description)) {\n return description;\n }\n\n return null;\n }, [description, error]);\n\n return (\n <S.Checkbox\n className={className}\n disabled={disabled}\n readOnly={readOnly}\n style={style}\n $variant={variant}\n >\n <S.CheckboxLabel\n disabled={disabled}\n muted={muted}\n readOnly={readOnly}\n htmlFor={uniqueId}\n $variant={variant}\n >\n <input\n ref={forwardedRef}\n id={uniqueId}\n checked={checked}\n defaultChecked={defaultChecked}\n disabled={disabled}\n readOnly={readOnly}\n value={value}\n name={name}\n type=\"checkbox\"\n onChange={onChange}\n onBlur={onBlur}\n data-indeterminate={indeterminate}\n />\n\n <S.IndeterminateCheckIcon />\n <S.CheckIcon>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 10.9 8.45\">\n <path\n d=\"m3.68,8.45L0,4.75l1.21-1.21,2.47,2.45L9.7,0l1.21,1.23-7.22,7.22Z\"\n fill=\"currentColor\"\n />\n </svg>\n </S.CheckIcon>\n {((typeof label === 'string' && label.length > 0) || typeof label === 'object') && (\n <S.CheckboxVisualLabel>{label}</S.CheckboxVisualLabel>\n )}\n </S.CheckboxLabel>\n {typeof descriptionText === 'string' && descriptionText.length > 0 && (\n <S.Description $error={hasError}>{descriptionText}</S.Description>\n )}\n </S.Checkbox>\n );\n});\n\nexport default Checkbox;\n"],"names":["Checkbox","React","forwardRef","checked","defaultChecked","disabled","readOnly","name","value","description","error","indeterminate","muted","label","onChange","onBlur","className","style","variant","forwardedRef","uniqueId","useState","nanoid","hasError","useMemo","isEmpty","descriptionText","_jsxs","S","$variant","children","htmlFor","_jsx","ref","id","type","xmlns","viewBox","d","fill","length","$error"],"mappings":";;;;;;AAiGA,MAAMA,QAAQ,GAAGC,cAAK,CAACC,UAAU,CAAa,SAASF,QAAQA,CAC7D;EACEG,OAAO;EACPC,cAAc;AACdC,EAAAA,QAAQ,GAAG,KAAK;AAChBC,EAAAA,QAAQ,GAAG,KAAK;EAChBC,IAAI;EACJC,KAAK;EACLC,WAAW;EACXC,KAAK;AACLC,EAAAA,aAAa,GAAG,KAAK;EACrBC,KAAK;EACLC,KAAK;EACLC,QAAQ;EACRC,MAAM;EACNC,SAAS;EACTC,KAAK;AACLC,EAAAA,OAAO,GAAG;AACZ,CAAC,EACDC,YAAY,EACZ;EACA,MAAM,CAACC,QAAQ,CAAC,GAAGC,QAAQ,CAACC,MAAM,EAAE,CAAC;AAUrC,EAAA,MAAMC,QAAQ,GAAGC,OAAO,CAAC,MAAM;AAC7B,IAAA,IAAI,OAAOd,KAAK,KAAK,SAAS,EAAE;AAC9B,MAAA,OAAOA,KAAK;AACd,IAAA;AAEA,IAAA,OAAO,CAACe,OAAO,CAACf,KAAK,CAAC;AACxB,EAAA,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;AAEX,EAAA,MAAMgB,eAAe,GAAGF,OAAO,CAAC,MAAM;AACpC,IAAA,IAAI,CAACC,OAAO,CAACf,KAAK,CAAC,EAAE;AACnB,MAAA,OAAOA,KAAK;AACd,IAAA;AAEA,IAAA,IAAI,CAACe,OAAO,CAAChB,WAAW,CAAC,EAAE;AACzB,MAAA,OAAOA,WAAW;AACpB,IAAA;AAEA,IAAA,OAAO,IAAI;AACb,EAAA,CAAC,EAAE,CAACA,WAAW,EAAEC,KAAK,CAAC,CAAC;AAExB,EAAA,OACEiB,IAAA,CAACC,UAAU,EAAA;AACTZ,IAAAA,SAAS,EAAEA,SAAU;AACrBX,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,QAAQ,EAAEA,QAAS;AACnBW,IAAAA,KAAK,EAAEA,KAAM;AACbY,IAAAA,QAAQ,EAAEX,OAAQ;AAAAY,IAAAA,QAAA,EAAA,CAElBH,IAAA,CAACC,aAAe,EAAA;AACdvB,MAAAA,QAAQ,EAAEA,QAAS;AACnBO,MAAAA,KAAK,EAAEA,KAAM;AACbN,MAAAA,QAAQ,EAAEA,QAAS;AACnByB,MAAAA,OAAO,EAAEX,QAAS;AAClBS,MAAAA,QAAQ,EAAEX,OAAQ;AAAAY,MAAAA,QAAA,GAElBE,GAAA,CAAA,OAAA,EAAA;AACEC,QAAAA,GAAG,EAAEd,YAAa;AAClBe,QAAAA,EAAE,EAAEd,QAAS;AACbjB,QAAAA,OAAO,EAAEA,OAAQ;AACjBC,QAAAA,cAAc,EAAEA,cAAe;AAC/BC,QAAAA,QAAQ,EAAEA,QAAS;AACnBC,QAAAA,QAAQ,EAAEA,QAAS;AACnBE,QAAAA,KAAK,EAAEA,KAAM;AACbD,QAAAA,IAAI,EAAEA,IAAK;AACX4B,QAAAA,IAAI,EAAC,UAAU;AACfrB,QAAAA,QAAQ,EAAEA,QAAS;AACnBC,QAAAA,MAAM,EAAEA,MAAO;QACf,oBAAA,EAAoBJ;AAAc,OACnC,CAAC,EAEFqB,GAAA,CAACJ,sBAAwB,EAAA,EAAE,CAAC,EAC5BI,GAAA,CAACJ,SAAW,EAAA;AAAAE,QAAAA,QAAA,EACVE,GAAA,CAAA,KAAA,EAAA;AAAKI,UAAAA,KAAK,EAAC,4BAA4B;AAACC,UAAAA,OAAO,EAAC,eAAe;AAAAP,UAAAA,QAAA,EAC7DE,GAAA,CAAA,MAAA,EAAA;AACEM,YAAAA,CAAC,EAAC,kEAAkE;AACpEC,YAAAA,IAAI,EAAC;WACN;SACE;OACM,CAAC,EACb,CAAE,OAAO1B,KAAK,KAAK,QAAQ,IAAIA,KAAK,CAAC2B,MAAM,GAAG,CAAC,IAAK,OAAO3B,KAAK,KAAK,QAAQ,KAC5EmB,GAAA,CAACJ,mBAAqB,EAAA;AAAAE,QAAAA,QAAA,EAAEjB;AAAK,OAAwB,CACtD;AAAA,KACc,CAAC,EACjB,OAAOa,eAAe,KAAK,QAAQ,IAAIA,eAAe,CAACc,MAAM,GAAG,CAAC,IAChER,GAAA,CAACJ,WAAa,EAAA;AAACa,MAAAA,MAAM,EAAElB,QAAS;AAAAO,MAAAA,QAAA,EAAEJ;AAAe,KAAgB,CAClE;AAAA,GACS,CAAC;AAEjB,CAAC;;;;"}
1
+ {"version":3,"file":"Checkbox.js","sources":["../../../src/components/inputs/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\n\nimport { nanoid } from 'nanoid';\n\nimport { isEmpty } from 'lodash';\nimport * as S from './Checkbox.styled';\n\ntype Props = {\n /**\n * Whether the checkbox is checked\n */\n checked?: boolean;\n /**\n * Whether the checkbox should be checked or unchecked by default\n */\n defaultChecked?: boolean;\n /**\n * The checkbox' label\n */\n label?: string | React.ReactElement<any>;\n /**\n * Whether the checkbox is disabled\n */\n disabled?: boolean;\n /**\n * Whether the checkbox is read-only\n */\n readOnly?: boolean;\n /**\n * The checkbox' name\n */\n name?: string;\n /**\n * The checkbox' value\n */\n value?: string | number;\n /**\n * Description of the checkbox\n */\n description?: string;\n /**\n * Whether there's an error. Error message can be passed as a `string` to be displayed below the checkbox.\n */\n error?: boolean | string;\n /**\n * Whether the checkbox is indeterminate. This will display a dash in the checkbox instead of the default checkmark.\n */\n indeterminate?: boolean;\n /**\n * Mutes the color of the visual checkbox – Does not mute the label or other parts of the Checkbox\n */\n muted?: boolean;\n /**\n * On-change effect\n */\n onChange?: (...args: any[]) => any;\n /**\n * On-blur effect\n */\n onBlur?: (...args: any[]) => any;\n /**\n * Optional class name for the HTML element\n */\n className?: string;\n /**\n * Optional in-line styling for the HTML element\n */\n style?: any;\n /**\n * Visual variant. `green` (default) uses emerald fill. `black` uses themed black/white square (24px, rounded), inverted check.\n */\n variant?: 'green' | 'black';\n};\n\n/**\n * Checkboxes allow the user to select one or more items from a set.\n *\n * If you have a single option, avoid using a checkbox and use an on/off switch (`Switch` component) instead.\n *\n *\n * ### Import\n *\n * ``` js\n * import { Checkbox } from '@ntbjs/react-components/inputs'\n * // or\n * import Checkbox from '@ntbjs/react-components/inputs/Checkbox'\n * ```\n */\nconst Checkbox = React.forwardRef<any, Props>(function Checkbox(\n {\n checked,\n defaultChecked,\n disabled = false,\n readOnly = false,\n name,\n value,\n description,\n error,\n indeterminate = false,\n muted,\n label,\n onChange,\n onBlur,\n className,\n style,\n variant = 'green'\n },\n forwardedRef\n) {\n const [uniqueId] = useState(nanoid());\n\n // `typeof` rather than lodash `isBoolean` — lodash ships no types here.\n const hasError = useMemo(() => {\n if (typeof error === 'boolean') {\n return error;\n }\n\n return !isEmpty(error);\n }, [error]);\n\n const descriptionText = useMemo(() => {\n if (!isEmpty(error)) {\n return error;\n }\n\n if (!isEmpty(description)) {\n return description;\n }\n\n return null;\n }, [description, error]);\n\n return (\n <S.Checkbox\n className={className}\n disabled={disabled}\n readOnly={readOnly}\n style={style}\n $variant={variant}\n >\n <S.CheckboxLabel\n disabled={disabled}\n muted={muted}\n readOnly={readOnly}\n htmlFor={uniqueId}\n $variant={variant}\n >\n <input\n ref={forwardedRef}\n id={uniqueId}\n checked={checked}\n defaultChecked={defaultChecked}\n disabled={disabled}\n readOnly={readOnly}\n value={value}\n name={name}\n type=\"checkbox\"\n onChange={onChange}\n onBlur={onBlur}\n data-indeterminate={indeterminate}\n />\n\n <S.IndeterminateCheckIcon />\n <S.CheckIcon>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 10.9 8.45\">\n <path\n d=\"m3.68,8.45L0,4.75l1.21-1.21,2.47,2.45L9.7,0l1.21,1.23-7.22,7.22Z\"\n fill=\"currentColor\"\n />\n </svg>\n </S.CheckIcon>\n {((typeof label === 'string' && label.length > 0) || typeof label === 'object') && (\n <S.CheckboxVisualLabel>{label}</S.CheckboxVisualLabel>\n )}\n </S.CheckboxLabel>\n {typeof descriptionText === 'string' && descriptionText.length > 0 && (\n <S.Description $error={hasError}>{descriptionText}</S.Description>\n )}\n </S.Checkbox>\n );\n});\n\nexport default Checkbox;\n"],"names":["Checkbox","React","forwardRef","checked","defaultChecked","disabled","readOnly","name","value","description","error","indeterminate","muted","label","onChange","onBlur","className","style","variant","forwardedRef","uniqueId","useState","nanoid","hasError","useMemo","isEmpty","descriptionText","_jsxs","S","$variant","children","htmlFor","_jsx","ref","id","type","xmlns","viewBox","d","fill","length","$error"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.styled.js","sources":["../../../src/components/inputs/Checkbox/Checkbox.styled.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nconst checkboxSize = '18px';\nconst blackVariantSize = '24px';\n\n/*\n * Single-argument, and it stays that way — peer floor `styled-components: >=5.1.0`\n * and the two majors disagree on the second parameter. Rules in\n * `layout/SectionSeparator/SectionSeparator.styled.ts`, derivation in\n * `scripts/TS-MIGRATION-PLAYBOOK.md` §J.4. `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\n/**\n * `variant` — `PropTypes.oneOf(['green', 'black'])`, carried as `$variant` by both\n * `Checkbox` and `CheckboxLabel`. Closed on purpose (§J.6): both templates compare\n * `=== 'black'`, and with a closed union a mistyped variant name is TS2367 rather\n * than a branch that silently never fires.\n */\ntype CheckboxVariant = 'green' | 'black';\n\n/*\n * `Checkbox.tsx` ALSO passes `disabled` and `readOnly` here, and this template never\n * reads either — they are a dead pass, not a prop. They are deliberately NOT declared\n * (rule 2: declare only what is read), and they are a recorded defect: without a `$`\n * they are forwarded, so `disabled=\"\"` / `readonly=\"\"` are on this `<div>` in the\n * render baseline while contributing nothing to its CSS. `CheckboxLabel` below is\n * where the two actually do something. Fix (C10, needs the re-record): stop passing\n * them here.\n */\nexport const Checkbox = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<{ $variant?: CheckboxVariant }>(applyDefaultTheme)`\n display: flex;\n flex-direction: column;\n\n ${props =>\n props.$variant === 'black' &&\n css`\n ${props.theme.themeProp('--checkbox-black-box', props.theme.getColor('white'), 'black')}\n ${props.theme.themeProp('--checkbox-black-check', 'black', props.theme.getColor('white'))}\n `}\n`;\n\nexport const CheckIcon = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n opacity: 0;\n transform: scale(0.1);\n transition: all 200ms;\n position: absolute;\n width: 12px;\n top: 4px;\n left: 3px;\n color: ${props => props.theme.getColor('gray-100')};\n\n svg {\n width: 100%;\n display: block;\n }\n`;\n\nexport const IndeterminateCheckIcon = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n opacity: 0;\n transform: scale(0.1);\n transition: all 200ms;\n position: absolute;\n height: 2px;\n top: 8px;\n left: 4px;\n background: ${props => props.theme.getColor('gray-100')};\n width: 10px;\n`;\n\n/*\n * THREE OF THESE FOUR HAVE NO `$`, AND THAT IS A DEFECT — declared here, not fixed here.\n *\n * `Checkbox.tsx` renders\n * `<S.CheckboxLabel disabled={disabled} muted={muted} readOnly={readOnly} htmlFor=… $variant=…>`.\n * None of `disabled`, `muted`, `readOnly` is a member of `LabelHTMLAttributes` — they are\n * input/media attributes — which is why all three reads below are TS2339, and\n * `shouldForwardProp` forwards every non-`$` prop, so `disabled=\"\"`, `muted=\"\"` and\n * `readonly=\"\"` are on the rendered `<label>` today and are in the recorded render\n * baseline. The fix is to rename all three `$disabled` / `$muted` / `$readOnly` at both\n * ends; that removes three DOM attributes, so it belongs to C10 with its baseline\n * re-record and must not ride along in a type-only commit. §E.4 third case, §J.9.\n */\ninterface CheckboxLabelStyleProps {\n /** `muted` — `PropTypes.bool`. Fades the `&::before` box only. Leaks to the DOM. */\n muted?: boolean;\n /** `readOnly` — `PropTypes.bool`. Leaks to the DOM. */\n readOnly?: boolean;\n /** `disabled` — `PropTypes.bool`. Leaks to the DOM. */\n disabled?: boolean;\n /** `variant` — see `CheckboxVariant`. Properly transient. */\n $variant?: CheckboxVariant;\n}\n\nexport const CheckboxLabel = styled.label\n .withConfig({\n shouldForwardProp\n })\n .attrs<CheckboxLabelStyleProps>(applyDefaultTheme)`\n display: inline-flex;\n position: relative;\n cursor: pointer;\n user-select: none;\n min-height: ${checkboxSize};\n text-align: left;\n flex-wrap: wrap;\n flex: 1;\n line-height: ${checkboxSize};\n margin-right: auto;\n\n & input[type='checkbox'] {\n position: absolute;\n opacity: 0;\n pointer-events: none;\n margin: 0;\n }\n\n &::before {\n content: '';\n border: 2px solid ${props => props.theme.getColor('gray-300')};\n border-radius: 2px;\n transition: all 200ms;\n width: ${checkboxSize};\n height: ${checkboxSize};\n box-sizing: border-box;\n ${props =>\n props.muted &&\n css`\n opacity: 0.75;\n `}\n }\n\n &:has(input[type='checkbox']:checked) {\n &::before {\n background: ${props => props.theme.getColor('emerald-500')};\n border-color: ${props => props.theme.getColor('emerald-500')};\n }\n }\n\n &:has(input[type='checkbox']:not([data-indeterminate='true']):checked) {\n ${CheckIcon} {\n opacity: 1;\n transform: scale(1);\n }\n }\n\n &:has(input[type='checkbox'][data-indeterminate='true']:checked) {\n ${IndeterminateCheckIcon} {\n opacity: 1;\n transform: scale(1);\n }\n }\n\n ${props =>\n props.readOnly &&\n css`\n opacity: 0.5;\n cursor: default;\n pointer-events: none;\n user-select: text;\n `}\n\n ${props =>\n props.disabled &&\n css`\n opacity: 0.5;\n cursor: not-allowed;\n `}\n\n ${props =>\n props.$variant === 'black' &&\n css`\n min-height: ${blackVariantSize};\n line-height: ${blackVariantSize};\n\n &::before {\n width: ${blackVariantSize};\n height: ${blackVariantSize};\n border-radius: 4px;\n border-color: var(--checkbox-black-box);\n background: transparent;\n }\n\n &:has(input[type='checkbox']:checked) {\n &::before {\n background: var(--checkbox-black-box);\n border-color: var(--checkbox-black-box);\n }\n }\n\n ${CheckIcon} {\n width: 14px;\n top: 6px;\n left: 5px;\n color: var(--checkbox-black-check);\n }\n\n ${IndeterminateCheckIcon} {\n top: 11px;\n left: 7px;\n background: var(--checkbox-black-check);\n }\n `}\n`;\n\nexport const CheckboxVisualLabel = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n padding-left: 10px;\n font-weight: 400;\n font-size: 0.875rem;\n flex: 1;\n\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-300'),\n props.theme.getColor('gray-600')\n )};\n`;\n\nexport const Description = styled.p\n .withConfig({\n shouldForwardProp\n })\n .attrs<{\n /**\n * `error` — the component derives `hasError` (`isBoolean(error) ? error :\n * !isEmpty(error)`) and passes that, so `boolean` and not the\n * `bool | string` that `error`'s own propTypes allow.\n */\n $error?: boolean;\n }>(applyDefaultTheme)`\n margin: 0.375rem 0 0 0;\n font-size: 0.75rem;\n line-height: 1.333;\n\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-400'),\n props.theme.getColor('gray-500')\n )};\n\n ${props =>\n props.$error &&\n css`\n content: 'error';\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('red-200'),\n props.theme.getColor('red-500')\n )}\n `}\n`;\n"],"names":["checkboxSize","blackVariantSize","shouldForwardProp","prop","startsWith","Checkbox","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","$variant","css","theme","themeProp","getColor","CheckIcon","IndeterminateCheckIcon","CheckboxLabel","label","muted","readOnly","disabled","CheckboxVisualLabel","Description","p","$error"],"mappings":"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"}
1
+ {"version":3,"file":"Checkbox.styled.js","sources":["../../../src/components/inputs/Checkbox/Checkbox.styled.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nconst checkboxSize = '18px';\nconst blackVariantSize = '24px';\n\n// Single-argument only — styled-components v5.1+ and v6 disagree on the second parameter.\nconst shouldForwardProp = (prop: string): boolean => {\n return prop !== 'theme' && !prop.startsWith('$');\n};\n\n/**\n * `variant` — `PropTypes.oneOf(['green', 'black'])`, carried as `$variant` by both\n * `Checkbox` and `CheckboxLabel`. Closed on purpose: both templates compare\n * `=== 'black'`, and with a closed union a mistyped variant name is TS2367 rather\n * than a branch that silently never fires.\n */\ntype CheckboxVariant = 'green' | 'black';\n\n// Dead pass: disabled/readOnly are forwarded to <div> but not read; defect in render baseline.\nexport const Checkbox = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs<{ $variant?: CheckboxVariant }>(applyDefaultTheme)`\n display: flex;\n flex-direction: column;\n\n ${props =>\n props.$variant === 'black' &&\n css`\n ${props.theme.themeProp('--checkbox-black-box', props.theme.getColor('white'), 'black')}\n ${props.theme.themeProp('--checkbox-black-check', 'black', props.theme.getColor('white'))}\n `}\n`;\n\nexport const CheckIcon = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n opacity: 0;\n transform: scale(0.1);\n transition: all 200ms;\n position: absolute;\n width: 12px;\n top: 4px;\n left: 3px;\n color: ${props => props.theme.getColor('gray-100')};\n\n svg {\n width: 100%;\n display: block;\n }\n`;\n\nexport const IndeterminateCheckIcon = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n opacity: 0;\n transform: scale(0.1);\n transition: all 200ms;\n position: absolute;\n height: 2px;\n top: 8px;\n left: 4px;\n background: ${props => props.theme.getColor('gray-100')};\n width: 10px;\n`;\n\n// Three of four props lack `$`: disabled/muted/readOnly leak to <label> DOM; defect in baseline.\ninterface CheckboxLabelStyleProps {\n /** `muted` — fades the checkbox box. Leaks to DOM. */\n muted?: boolean;\n /** `readOnly` — leaks to DOM. */\n readOnly?: boolean;\n /** `disabled` — leaks to DOM. */\n disabled?: boolean;\n /** `variant` — closed union, properly transient. */\n $variant?: CheckboxVariant;\n}\n\nexport const CheckboxLabel = styled.label\n .withConfig({\n shouldForwardProp\n })\n .attrs<CheckboxLabelStyleProps>(applyDefaultTheme)`\n display: inline-flex;\n position: relative;\n cursor: pointer;\n user-select: none;\n min-height: ${checkboxSize};\n text-align: left;\n flex-wrap: wrap;\n flex: 1;\n line-height: ${checkboxSize};\n margin-right: auto;\n\n & input[type='checkbox'] {\n position: absolute;\n opacity: 0;\n pointer-events: none;\n margin: 0;\n }\n\n &::before {\n content: '';\n border: 2px solid ${props => props.theme.getColor('gray-300')};\n border-radius: 2px;\n transition: all 200ms;\n width: ${checkboxSize};\n height: ${checkboxSize};\n box-sizing: border-box;\n ${props =>\n props.muted &&\n css`\n opacity: 0.75;\n `}\n }\n\n &:has(input[type='checkbox']:checked) {\n &::before {\n background: ${props => props.theme.getColor('emerald-500')};\n border-color: ${props => props.theme.getColor('emerald-500')};\n }\n }\n\n &:has(input[type='checkbox']:not([data-indeterminate='true']):checked) {\n ${CheckIcon} {\n opacity: 1;\n transform: scale(1);\n }\n }\n\n &:has(input[type='checkbox'][data-indeterminate='true']:checked) {\n ${IndeterminateCheckIcon} {\n opacity: 1;\n transform: scale(1);\n }\n }\n\n ${props =>\n props.readOnly &&\n css`\n opacity: 0.5;\n cursor: default;\n pointer-events: none;\n user-select: text;\n `}\n\n ${props =>\n props.disabled &&\n css`\n opacity: 0.5;\n cursor: not-allowed;\n `}\n\n ${props =>\n props.$variant === 'black' &&\n css`\n min-height: ${blackVariantSize};\n line-height: ${blackVariantSize};\n\n &::before {\n width: ${blackVariantSize};\n height: ${blackVariantSize};\n border-radius: 4px;\n border-color: var(--checkbox-black-box);\n background: transparent;\n }\n\n &:has(input[type='checkbox']:checked) {\n &::before {\n background: var(--checkbox-black-box);\n border-color: var(--checkbox-black-box);\n }\n }\n\n ${CheckIcon} {\n width: 14px;\n top: 6px;\n left: 5px;\n color: var(--checkbox-black-check);\n }\n\n ${IndeterminateCheckIcon} {\n top: 11px;\n left: 7px;\n background: var(--checkbox-black-check);\n }\n `}\n`;\n\nexport const CheckboxVisualLabel = styled.div\n .withConfig({\n shouldForwardProp\n })\n .attrs(applyDefaultTheme)`\n padding-left: 10px;\n font-weight: 400;\n font-size: 0.875rem;\n flex: 1;\n\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-300'),\n props.theme.getColor('gray-600')\n )};\n`;\n\nexport const Description = styled.p\n .withConfig({\n shouldForwardProp\n })\n .attrs<{\n /** `error` — narrowed to `boolean` after `hasError` derivation. */\n $error?: boolean;\n }>(applyDefaultTheme)`\n margin: 0.375rem 0 0 0;\n font-size: 0.75rem;\n line-height: 1.333;\n\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-400'),\n props.theme.getColor('gray-500')\n )};\n\n ${props =>\n props.$error &&\n css`\n content: 'error';\n ${props.theme.themeProp(\n 'color',\n props.theme.getColor('red-200'),\n props.theme.getColor('red-500')\n )}\n `}\n`;\n"],"names":["checkboxSize","blackVariantSize","shouldForwardProp","prop","startsWith","Checkbox","styled","div","withConfig","attrs","applyDefaultTheme","displayName","componentId","props","$variant","css","theme","themeProp","getColor","CheckIcon","IndeterminateCheckIcon","CheckboxLabel","label","muted","readOnly","disabled","CheckboxVisualLabel","Description","p","$error"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"CompactAutocompleteSelect.js","sources":["../../../src/components/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.tsx"],"sourcesContent":["import { isEmpty } from 'lodash';\nimport { nanoid } from 'nanoid';\nimport React, { useMemo, useState } from 'react';\nimport { Tooltip } from '../../data';\n\nimport * as S from './CompactAutocompleteSelect.styled';\n\nconst DEFAULT_NO_OPTIONS_MESSAGE_FUNC = inputValue => {\n if (inputValue) {\n return `No matches for \"${inputValue}\"`;\n } else {\n return 'No available options';\n }\n};\n\nexport type CompactAutocompleteSelectOwnProps = {\n /**\n * The label of the input field – leave `undefined` to hide the label\n */\n label?: string;\n /**\n * The placeholder of the input. Text to be displayed on the input element when the component is enabled and not focused – e.g. \"Search categories...\"\n */\n placeholder?: string;\n /**\n * `Array` of `objects` that populate the select menu. This is only needed\n * when asynchronous option fetching with the `loadOptions` prop is not used.\n *\n * **Note:**\n * <br />This will be overridden by the `loadOptions` prop if both props are set.\n */\n availableOptions?: any[];\n /**\n * `Array` of `objects` containing the selected options.\n */\n selectedOption?: any;\n /**\n * Function with a `Promise` returning filtered options.\n *\n * See [Asynchronous fetching/filtering with pagination](#asynchronous-fetchingfiltering-with-pagination)\n * for details.\n *\n * **Note:**\n * <br />This will override the `availableOptions` prop if both props are set.\n */\n loadOptions?: (...args: any[]) => any;\n /**\n * Function for custom \"Loading...\" message while waiting for the first page\n * from `loadOptions` to resolve. Defaults to \"Loading...\" if no function is provided.\n */\n loadingMessageFunc?: (...args: any[]) => any;\n /**\n * Callback function for formatting the message displayed in the dropdown when there\n * are no matching options, and the user has permission to create new options.\n * The callback function will be given the current input value as an argument.\n */\n createNewOptionMessageFunc?: (...args: any[]) => any;\n /**\n * If the list of options is empty, or if the current input value doesn't match\n * any of the available options and the user doesn't have permission to add options,\n * this function will be called and passed the current input value as an argument.\n */\n noOptionsMessageFunc?: (...args: any[]) => any;\n /**\n * Whether the value is read only\n */\n readOnly?: boolean;\n /**\n * Displays a grey background to show that value is editable\n */\n edit?: boolean;\n /**\n * Whether the component is hidden or visible.\n */\n hidden?: boolean;\n /**\n * There is an error present – 'error be prioritized over warnings if both are set to 'true'.\n */\n error?: boolean | string;\n /**\n * There is a warning present.\n */\n warning?: boolean | string;\n /**\n * Callback function for sending updates to the backend whenever the selected values are updated.\n * See [Update handling](#update-handling) for details.\n */\n onUpdateCallback?: (...args: any[]) => any;\n /**\n * Whether the user have permission to create new options\n */\n creatable?: boolean;\n /**\n * Whether the multi-select should be disabled.\n * The user will not be able to trigger the on-click effect of the selected options.\n */\n disabled?: boolean;\n /**\n * Define the type based on error, warning, loading and success.\n */\n type?: '' | 'error' | 'warning' | 'instructions-warning' | 'loading' | 'success';\n /**\n * Description ToolTip text.\n */\n descriptionToolTip?: string;\n /**\n * Icon element – E.g: `icon={<Spinner />}`\n */\n loadingIcon?: React.ReactElement<any>;\n /**\n * Icon element – E.g: `icon={<Check />}`\n */\n successIcon?: React.ReactElement<any>;\n};\n\n/*\n * NMB-3998 §C.2: `props` is spread onto `S.AsyncCreatableAutocompleteSelect`, 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 CompactAutocompleteSelectOwnProps`);\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 * BOTH ALIASES ARE `export`ed, AND THE `const` BELOW CARRIES AN EXPLICIT ANNOTATION,\n * FOR ONE REASON: declaration emit. §G.4.\n *\n * tsc prints a type alias declaration from the SOURCE TEXT when the alias is exported, and\n * EXPANDS it structurally when it is not. Unexported, this alias expanded through\n * `S.AsyncCreatableAutocompleteSelect` into react-select's `PublicBaseSelectProps` and\n * `StateManagerAdditionalProps`, which `react-select`'s `exports` map does not serve —\n * 2 x TS2883, and the emitted declaration degraded to\n * `ForwardRefExoticComponent<RefAttributes<unknown>>`, zero props. The annotation on the\n * `const` is needed for the same reason: `React.forwardRef` INFERS\n * `ForwardRefExoticComponent<PropsWithoutRef<P> & RefAttributes<any>>`, and tsc computes\n * `PropsWithoutRef<P>` eagerly, which reintroduces the expansion the exported alias just\n * avoided. Written out, it is printed as written.\n *\n * The `export`s are also a small win in their own right: a consumer can now write\n * `CompactAutocompleteSelectProps` instead of `React.ComponentProps<typeof …>`.\n */\nexport type CompactAutocompleteSelectProps = Omit<\n React.ComponentPropsWithoutRef<typeof S.AsyncCreatableAutocompleteSelect>,\n keyof CompactAutocompleteSelectOwnProps\n> &\n CompactAutocompleteSelectOwnProps;\n\n/**\n * Select input control with autocomplete, async and creatable support.\n *\n * This control allows users to search through a predefined set of options, asynchronously load additional options,\n * and even create new options on-the-fly. It combines the benefits of autocomplete functionality,\n * asynchronous data fetching, and creatable option support.\n *\n * The component uses [react-select](https://react-select.com/) for the main select functionality,\n * with [react-select-async-paginate](https://www.npmjs.com/package/react-select-async-paginate) for pagination.\n *\n * <br /> ### Import\n *\n * ``` js\n * import { CompactAutocompleteSelect } from '@ntbjs/react-components/inputs'\n * // or\n * import CompactAutocompleteSelect from '@ntbjs/react-components/inputs/CompactAutocompleteSelect'\n * ```\n *\n * <br /> ## Option `object` format\n * Options are represented by an `Array` of `objects` with the following format:\n *\n * ``` js\n * {\n * value: \"Example\",\n * label: \"Example\"\n * }\n * ```\n * The `label` is what will visible to the end-user. Whether `value` and `label`\n * should be different will depend on your use-case, but they are not required to.\n *\n * <br /> ## Update handling\n * Changes from the end-user to the selected/available options can be handled with a callback function\n * passed through the `onUpdateCallback` prop, which is triggered any time the selected values change.\n *\n * The callback function will be passed two arguments:\n * * `action: string`\n * * `updatedOption: object`\n *\n * <br />#### `action`\n * A `string` indicating what kind of update was made.\n *\n * The possible values of `action` are:\n * * `create-option`: an option that didn't exist in the original list of available options were added\n * * `select-option`: an option was selected\n * * `deselect-option`: an option was de-selected by clicking the X in the dropdown menu\n * * `remove-value`: an option was de-selected by clicking the X on the option label/box\n * * `pop-value`: an option was de-selected with backspace\n * * `clear`: all options were de-selected by clicking the clear indicator (not currently in use)\n *\n * <br />#### `updatedOption`\n * Option `object`of the updated option:\n *\n * In addition to the default `value` and `label` keys, an `__isNew__` flag will be present if the option was\n * not part of the original list of available options, i.e. created by the user in the current \"session\".\n * This is the case regardless of whether the list is provided through `availableOptions` or\n * asynchronously through `loadOptions`.\n *\n *\n * <br />## Asynchronous fetching/filtering with pagination\n * The list of available options can be fetched and filtered asynchronously with a `Promise`\n * passed through the `loadOptions` prop.\n *\n * It will be passed two arguments:\n *\n * * `inputValue: string`: current input value/search\n * * `prevOptions: Array`: previously loaded options for the current search\n *\n * The function is triggered and the first page is fetched when the dropdown menu opens.\n * Whenever the user scrolls down to the bottom of the list, `loadOptions` will\n * be triggered again to fetch the next page.\n *\n * The `Promise` should return an `object` with the following keys:\n *\n * ``` js\n * {\n * options: Array,\n * hasMore: boolean\n * }\n * ```\n *\n * `options` should contain the current page of options. It will be concatenated to the previous\n * set of options automatically. The `hasMore` flag indicates whether there is another page to be fetched.\n *\n * **Example:**\n *\n * ``` js\n *\n * const availableOptions = [\n * { value: \"Example 1\", label: \"Example 1\" },\n * ...\n * { value: \"Example N\", label: \"Example N\" }\n * ];\n *\n * const filterOptions = inputValue => {\n * return availableOptions.filter(option => {\n * return option.label.toLowerCase().includes(inputValue.toLowerCase());\n * });\n * };\n *\n * const loadOptionsFunc = (inputValue, prevOptions) => {\n * const currentLength = prevOptions.length;\n * const pageLength = 10;\n *\n * let filteredOptions;\n *\n * if (inputValue) {\n * filteredOptions = filterOptions(inputValue);\n * } else {\n * filteredOptions = availableOptions;\n * }\n *\n * const hasMore = filteredOptions.length > currentLength + pageLength;\n * const slicedOptions = filteredOptions.slice(currentLength, currentLength + pageLength);\n *\n * return {\n * options: slicedOptions,\n * hasMore\n * };\n * };\n *\n * const loadOptions = (inputValue, prevOptions) => {\n * return new Promise(resolve => {\n * resolve(loadOptionsFunc(inputValue, prevOptions));\n * });\n * };\n * ```\n *\n * While waiting for the `Promise` to resolve, the component will be in a loading state.\n * The loading state is showcased in the \"Primary With Fetching Timeout\" Story.\n *\n * <br />#### Without asynchronous fetching/filtering\n * If you wish to not use asynchronous fetching/filtering, leave the `loadOptions` prop undefined\n * and pass the `Array` of all available options to the `availableOptions` prop instead.\n * The component will use the built-in filtering on `label` from `react-select`, and the options\n * will not be paginated.\n *\n * <br />\n */\n\nconst CompactAutocompleteSelect: React.ForwardRefExoticComponent<\n CompactAutocompleteSelectProps & React.RefAttributes<any>\n> = React.forwardRef<any, CompactAutocompleteSelectProps>(function CompactAutocompleteSelect(\n {\n label,\n availableOptions,\n placeholder,\n selectedOption,\n loadOptions,\n noOptionsMessageFunc = DEFAULT_NO_OPTIONS_MESSAGE_FUNC,\n createNewOptionMessageFunc,\n onUpdateCallback,\n loadingMessageFunc,\n creatable = true,\n readOnly = false,\n edit = false,\n disabled = false,\n hidden = false,\n type = '',\n descriptionToolTip = '',\n loadingIcon,\n successIcon,\n ...props\n },\n forwardedRef\n) {\n const [uniqueId] = useState(nanoid());\n const [selected, setSelected] = useState(selectedOption);\n const [focused, setFocused] = useState(false);\n const [cacheUnique, setCacheUnique] = useState(0);\n\n const memoizedDescriptionToolTip = useMemo(() => {\n return descriptionToolTip;\n }, [descriptionToolTip]);\n\n /**\n * Adds displayname to inner components\n */\n const Control = props => {\n return <S.Control className=\"select-control\" edit={edit} type={type} {...props} />;\n };\n\n const ValueContainer = useMemo(() => {\n const valueContainer = props => {\n return (\n <>\n <S.ValueContainer type={type} {...props} />\n </>\n );\n };\n valueContainer.displayName = 'ValueContainerWrapper';\n return valueContainer;\n }, [type]);\n\n const Input = useMemo(() => {\n const selectInput = props => {\n return <S.Input className=\"select-input\" {...props} />;\n };\n selectInput.displayName = 'InputWrapper';\n return selectInput;\n }, []);\n\n const Menu = useMemo(() => {\n const menu = props => {\n return <S.Menu className=\"select-menu\" {...props} />;\n };\n menu.displayName = 'MenuWrapper';\n return menu;\n }, []);\n\n const Placeholder = props => {\n return <S.Placeholder className=\"select-placeholder\" type={type} {...props} />;\n };\n\n /*\n * HAND-WRITTEN. `Option.propTypes` was declared INSIDE the component body, and\n * `reactPropsPlugin` iterates only `sourceFile.statements` — so this is the third\n * component the plugin structurally cannot see, and the reason this file was one of\n * the two still importing `prop-types` after the codemod ran.\n *\n * It reported no TYPE error either, which is the more interesting half: `props` was an\n * implicit `any` and `noImplicitAny` is off in this repo, so `props.data.link` went\n * unchecked. The deleted propTypes are the source — `icon` was `PropTypes.node`,\n * `link` `PropTypes.string`.\n *\n * This is a react-select custom `Option`: react-select owns the rest of the props\n * object and the body passes it straight to `S.Option`. So only the two members the\n * body actually reads are declared and the rest stays open through the base, which is\n * the same reasoning as the §C.2 widening.\n */\n type OptionProps = React.ComponentPropsWithoutRef<typeof S.Option> & {\n data: {\n icon?: React.ReactNode;\n link?: string;\n };\n label?: string;\n };\n\n const Option = (props: OptionProps) => {\n return !props.data.link ? (\n <S.Option className=\"menu-item\" {...props} />\n ) : (\n <S.Option {...props}>\n <a href={props.data.link}>\n {props.data.icon}\n {props.label}\n </a>\n </S.Option>\n );\n };\n\n const SingleValue = props => {\n return <S.SingleValue className=\"menu-value\" {...props} />;\n };\n\n const DropdownIndicator = props => {\n return (\n <S.DropdownIndicator className=\"dropdown-indicator\" {...props}>\n <S.DropdownIndicatorIcon />\n </S.DropdownIndicator>\n );\n };\n\n const ClearIndicator = props => {\n return (\n <S.ClearIndicator className=\"clear-indicator\" {...props}>\n <S.ClearIndicatorIcon />\n </S.ClearIndicator>\n );\n };\n\n const IndicatorSeparator = props => {\n return <S.IndicatorSeparator className=\"indicator-separator\" {...props} />;\n };\n\n /**\n * Adds classnames to inner components\n */\n const innerComponents = {\n Control,\n ValueContainer,\n DropdownIndicator,\n IndicatorSeparator,\n ClearIndicator,\n Option,\n SingleValue,\n Input,\n Placeholder,\n Menu\n };\n\n const sharedSelectProps = {\n ref: forwardedRef,\n options: loadOptions ? undefined : availableOptions,\n value: selected,\n loadOptions: loadOptions,\n loadingMessage: loadingMessageFunc,\n formatCreateLabel: createNewOptionMessageFunc,\n noOptionsMessage: input => {\n return noOptionsMessageFunc(input.inputValue);\n },\n onFocus: () => {\n setFocused(true);\n },\n onBlur: () => {\n setFocused(false);\n },\n focused: focused,\n isDisabled: disabled || readOnly,\n components: innerComponents,\n isClearable: true,\n isSearchable: true,\n placeholder: placeholder,\n id: uniqueId,\n cacheUniqs: loadOptions ? [cacheUnique] : undefined,\n onChange: (selected, actionMeta) => {\n switch (actionMeta.action) {\n case 'create-option':\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n if (loadOptions) {\n setCacheUnique(cacheUnique + 1);\n }\n\n setSelected(selected);\n break;\n\n case 'select-option':\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n setSelected(selected);\n break;\n\n case 'remove-value':\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n setSelected(selected);\n break;\n\n case 'pop-value':\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n setSelected(selected);\n break;\n\n case 'deselect-option':\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n setSelected(selected);\n break;\n\n case 'clear':\n setSelected(selected);\n break;\n\n default:\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n setSelected(selected);\n break;\n }\n }\n };\n\n if (hidden) return null;\n\n const input = () => {\n return (\n <S.CompactAutocompleteSelect disabled={disabled}>\n <S.InputContainer>\n {label && (\n <S.Label htmlFor={uniqueId} disabled={disabled}>\n {label}\n <S.SuccessContainer>\n {type === 'loading' && loadingIcon}\n {type === 'success' && successIcon}\n </S.SuccessContainer>\n </S.Label>\n )}\n {loadOptions ? (\n creatable ? (\n <S.AsyncCreatableAutocompleteSelect\n $hasLabel={!isEmpty(label)}\n {...sharedSelectProps}\n {...props}\n />\n ) : (\n <S.AsyncAutocompleteSelect\n $hasLabel={!isEmpty(label)}\n {...sharedSelectProps}\n {...props}\n />\n )\n ) : creatable ? (\n <S.AutocompletCreatableSelect\n $hasLabel={!isEmpty(label)}\n {...sharedSelectProps}\n {...props}\n />\n ) : (\n <S.AutocompletSelect $hasLabel={!isEmpty(label)} {...sharedSelectProps} {...props} />\n )}\n </S.InputContainer>\n </S.CompactAutocompleteSelect>\n );\n };\n\n return (\n <>\n {!memoizedDescriptionToolTip && input()}\n {memoizedDescriptionToolTip && (\n <div>\n <Tooltip\n content={memoizedDescriptionToolTip}\n key=\"tooltipTextArea1\"\n placement=\"bottom-end\"\n trigger={'mouseenter'}\n zIndex={999999}\n >\n {input()}\n </Tooltip>\n </div>\n )}\n </>\n );\n});\n\nexport default CompactAutocompleteSelect;\n"],"names":["DEFAULT_NO_OPTIONS_MESSAGE_FUNC","inputValue","CompactAutocompleteSelect","React","forwardRef","label","availableOptions","placeholder","selectedOption","loadOptions","noOptionsMessageFunc","createNewOptionMessageFunc","onUpdateCallback","loadingMessageFunc","creatable","readOnly","edit","disabled","hidden","type","descriptionToolTip","loadingIcon","successIcon","props","forwardedRef","uniqueId","useState","nanoid","selected","setSelected","focused","setFocused","cacheUnique","setCacheUnique","memoizedDescriptionToolTip","useMemo","Control","_jsx","S","className","ValueContainer","valueContainer","_Fragment","children","displayName","Input","selectInput","Menu","menu","Placeholder","Option","data","link","_jsxs","href","icon","SingleValue","DropdownIndicator","ClearIndicator","IndicatorSeparator","innerComponents","sharedSelectProps","ref","options","undefined","value","loadingMessage","formatCreateLabel","noOptionsMessage","input","onFocus","onBlur","isDisabled","components","isClearable","isSearchable","id","cacheUniqs","onChange","actionMeta","action","htmlFor","$hasLabel","isEmpty","Tooltip","content","placement","trigger","zIndex"],"mappings":"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"}
1
+ {"version":3,"file":"CompactAutocompleteSelect.js","sources":["../../../src/components/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.tsx"],"sourcesContent":["import { isEmpty } from 'lodash';\nimport { nanoid } from 'nanoid';\nimport React, { useMemo, useState } from 'react';\nimport { Tooltip } from '../../data';\n\nimport * as S from './CompactAutocompleteSelect.styled';\n\nconst DEFAULT_NO_OPTIONS_MESSAGE_FUNC = inputValue => {\n if (inputValue) {\n return `No matches for \"${inputValue}\"`;\n } else {\n return 'No available options';\n }\n};\n\nexport type CompactAutocompleteSelectOwnProps = {\n /**\n * The label of the input field – leave `undefined` to hide the label\n */\n label?: string;\n /**\n * The placeholder of the input. Text to be displayed on the input element when the component is enabled and not focused – e.g. \"Search categories...\"\n */\n placeholder?: string;\n /**\n * `Array` of `objects` that populate the select menu. This is only needed\n * when asynchronous option fetching with the `loadOptions` prop is not used.\n *\n * **Note:**\n * <br />This will be overridden by the `loadOptions` prop if both props are set.\n */\n availableOptions?: any[];\n /**\n * `Array` of `objects` containing the selected options.\n */\n selectedOption?: any;\n /**\n * Function with a `Promise` returning filtered options.\n *\n * See [Asynchronous fetching/filtering with pagination](#asynchronous-fetchingfiltering-with-pagination)\n * for details.\n *\n * **Note:**\n * <br />This will override the `availableOptions` prop if both props are set.\n */\n loadOptions?: (...args: any[]) => any;\n /**\n * Function for custom \"Loading...\" message while waiting for the first page\n * from `loadOptions` to resolve. Defaults to \"Loading...\" if no function is provided.\n */\n loadingMessageFunc?: (...args: any[]) => any;\n /**\n * Callback function for formatting the message displayed in the dropdown when there\n * are no matching options, and the user has permission to create new options.\n * The callback function will be given the current input value as an argument.\n */\n createNewOptionMessageFunc?: (...args: any[]) => any;\n /**\n * If the list of options is empty, or if the current input value doesn't match\n * any of the available options and the user doesn't have permission to add options,\n * this function will be called and passed the current input value as an argument.\n */\n noOptionsMessageFunc?: (...args: any[]) => any;\n /**\n * Whether the value is read only\n */\n readOnly?: boolean;\n /**\n * Displays a grey background to show that value is editable\n */\n edit?: boolean;\n /**\n * Whether the component is hidden or visible.\n */\n hidden?: boolean;\n /**\n * There is an error present – 'error be prioritized over warnings if both are set to 'true'.\n */\n error?: boolean | string;\n /**\n * There is a warning present.\n */\n warning?: boolean | string;\n /**\n * Callback function for sending updates to the backend whenever the selected values are updated.\n * See [Update handling](#update-handling) for details.\n */\n onUpdateCallback?: (...args: any[]) => any;\n /**\n * Whether the user have permission to create new options\n */\n creatable?: boolean;\n /**\n * Whether the multi-select should be disabled.\n * The user will not be able to trigger the on-click effect of the selected options.\n */\n disabled?: boolean;\n /**\n * Define the type based on error, warning, loading and success.\n */\n type?: '' | 'error' | 'warning' | 'instructions-warning' | 'loading' | 'success';\n /**\n * Description ToolTip text.\n */\n descriptionToolTip?: string;\n /**\n * Icon element – E.g: `icon={<Spinner />}`\n */\n loadingIcon?: React.ReactElement<any>;\n /**\n * Icon element – E.g: `icon={<Check />}`\n */\n successIcon?: React.ReactElement<any>;\n};\n\n// Omit before & — a bare intersection narrows colliding props instead of overriding them. Exported aliases and const annotation needed for declaration emit.\nexport type CompactAutocompleteSelectProps = Omit<\n React.ComponentPropsWithoutRef<typeof S.AsyncCreatableAutocompleteSelect>,\n keyof CompactAutocompleteSelectOwnProps\n> &\n CompactAutocompleteSelectOwnProps;\n\n/**\n * Select input control with autocomplete, async and creatable support.\n *\n * This control allows users to search through a predefined set of options, asynchronously load additional options,\n * and even create new options on-the-fly. It combines the benefits of autocomplete functionality,\n * asynchronous data fetching, and creatable option support.\n *\n * The component uses [react-select](https://react-select.com/) for the main select functionality,\n * with [react-select-async-paginate](https://www.npmjs.com/package/react-select-async-paginate) for pagination.\n *\n * <br /> ### Import\n *\n * ``` js\n * import { CompactAutocompleteSelect } from '@ntbjs/react-components/inputs'\n * // or\n * import CompactAutocompleteSelect from '@ntbjs/react-components/inputs/CompactAutocompleteSelect'\n * ```\n *\n * <br /> ## Option `object` format\n * Options are represented by an `Array` of `objects` with the following format:\n *\n * ``` js\n * {\n * value: \"Example\",\n * label: \"Example\"\n * }\n * ```\n * The `label` is what will visible to the end-user. Whether `value` and `label`\n * should be different will depend on your use-case, but they are not required to.\n *\n * <br /> ## Update handling\n * Changes from the end-user to the selected/available options can be handled with a callback function\n * passed through the `onUpdateCallback` prop, which is triggered any time the selected values change.\n *\n * The callback function will be passed two arguments:\n * * `action: string`\n * * `updatedOption: object`\n *\n * <br />#### `action`\n * A `string` indicating what kind of update was made.\n *\n * The possible values of `action` are:\n * * `create-option`: an option that didn't exist in the original list of available options were added\n * * `select-option`: an option was selected\n * * `deselect-option`: an option was de-selected by clicking the X in the dropdown menu\n * * `remove-value`: an option was de-selected by clicking the X on the option label/box\n * * `pop-value`: an option was de-selected with backspace\n * * `clear`: all options were de-selected by clicking the clear indicator (not currently in use)\n *\n * <br />#### `updatedOption`\n * Option `object`of the updated option:\n *\n * In addition to the default `value` and `label` keys, an `__isNew__` flag will be present if the option was\n * not part of the original list of available options, i.e. created by the user in the current \"session\".\n * This is the case regardless of whether the list is provided through `availableOptions` or\n * asynchronously through `loadOptions`.\n *\n *\n * <br />## Asynchronous fetching/filtering with pagination\n * The list of available options can be fetched and filtered asynchronously with a `Promise`\n * passed through the `loadOptions` prop.\n *\n * It will be passed two arguments:\n *\n * * `inputValue: string`: current input value/search\n * * `prevOptions: Array`: previously loaded options for the current search\n *\n * The function is triggered and the first page is fetched when the dropdown menu opens.\n * Whenever the user scrolls down to the bottom of the list, `loadOptions` will\n * be triggered again to fetch the next page.\n *\n * The `Promise` should return an `object` with the following keys:\n *\n * ``` js\n * {\n * options: Array,\n * hasMore: boolean\n * }\n * ```\n *\n * `options` should contain the current page of options. It will be concatenated to the previous\n * set of options automatically. The `hasMore` flag indicates whether there is another page to be fetched.\n *\n * **Example:**\n *\n * ``` js\n *\n * const availableOptions = [\n * { value: \"Example 1\", label: \"Example 1\" },\n * ...\n * { value: \"Example N\", label: \"Example N\" }\n * ];\n *\n * const filterOptions = inputValue => {\n * return availableOptions.filter(option => {\n * return option.label.toLowerCase().includes(inputValue.toLowerCase());\n * });\n * };\n *\n * const loadOptionsFunc = (inputValue, prevOptions) => {\n * const currentLength = prevOptions.length;\n * const pageLength = 10;\n *\n * let filteredOptions;\n *\n * if (inputValue) {\n * filteredOptions = filterOptions(inputValue);\n * } else {\n * filteredOptions = availableOptions;\n * }\n *\n * const hasMore = filteredOptions.length > currentLength + pageLength;\n * const slicedOptions = filteredOptions.slice(currentLength, currentLength + pageLength);\n *\n * return {\n * options: slicedOptions,\n * hasMore\n * };\n * };\n *\n * const loadOptions = (inputValue, prevOptions) => {\n * return new Promise(resolve => {\n * resolve(loadOptionsFunc(inputValue, prevOptions));\n * });\n * };\n * ```\n *\n * While waiting for the `Promise` to resolve, the component will be in a loading state.\n * The loading state is showcased in the \"Primary With Fetching Timeout\" Story.\n *\n * <br />#### Without asynchronous fetching/filtering\n * If you wish to not use asynchronous fetching/filtering, leave the `loadOptions` prop undefined\n * and pass the `Array` of all available options to the `availableOptions` prop instead.\n * The component will use the built-in filtering on `label` from `react-select`, and the options\n * will not be paginated.\n *\n * <br />\n */\n\nconst CompactAutocompleteSelect: React.ForwardRefExoticComponent<\n CompactAutocompleteSelectProps & React.RefAttributes<any>\n> = React.forwardRef<any, CompactAutocompleteSelectProps>(function CompactAutocompleteSelect(\n {\n label,\n availableOptions,\n placeholder,\n selectedOption,\n loadOptions,\n noOptionsMessageFunc = DEFAULT_NO_OPTIONS_MESSAGE_FUNC,\n createNewOptionMessageFunc,\n onUpdateCallback,\n loadingMessageFunc,\n creatable = true,\n readOnly = false,\n edit = false,\n disabled = false,\n hidden = false,\n type = '',\n descriptionToolTip = '',\n loadingIcon,\n successIcon,\n ...props\n },\n forwardedRef\n) {\n const [uniqueId] = useState(nanoid());\n const [selected, setSelected] = useState(selectedOption);\n const [focused, setFocused] = useState(false);\n const [cacheUnique, setCacheUnique] = useState(0);\n\n const memoizedDescriptionToolTip = useMemo(() => {\n return descriptionToolTip;\n }, [descriptionToolTip]);\n\n /**\n * Adds displayname to inner components\n */\n const Control = props => {\n return <S.Control className=\"select-control\" edit={edit} type={type} {...props} />;\n };\n\n const ValueContainer = useMemo(() => {\n const valueContainer = props => {\n return (\n <>\n <S.ValueContainer type={type} {...props} />\n </>\n );\n };\n valueContainer.displayName = 'ValueContainerWrapper';\n return valueContainer;\n }, [type]);\n\n const Input = useMemo(() => {\n const selectInput = props => {\n return <S.Input className=\"select-input\" {...props} />;\n };\n selectInput.displayName = 'InputWrapper';\n return selectInput;\n }, []);\n\n const Menu = useMemo(() => {\n const menu = props => {\n return <S.Menu className=\"select-menu\" {...props} />;\n };\n menu.displayName = 'MenuWrapper';\n return menu;\n }, []);\n\n const Placeholder = props => {\n return <S.Placeholder className=\"select-placeholder\" type={type} {...props} />;\n };\n\n type OptionProps = React.ComponentPropsWithoutRef<typeof S.Option> & {\n data: {\n icon?: React.ReactNode;\n link?: string;\n };\n label?: string;\n };\n\n const Option = (props: OptionProps) => {\n return !props.data.link ? (\n <S.Option className=\"menu-item\" {...props} />\n ) : (\n <S.Option {...props}>\n <a href={props.data.link}>\n {props.data.icon}\n {props.label}\n </a>\n </S.Option>\n );\n };\n\n const SingleValue = props => {\n return <S.SingleValue className=\"menu-value\" {...props} />;\n };\n\n const DropdownIndicator = props => {\n return (\n <S.DropdownIndicator className=\"dropdown-indicator\" {...props}>\n <S.DropdownIndicatorIcon />\n </S.DropdownIndicator>\n );\n };\n\n const ClearIndicator = props => {\n return (\n <S.ClearIndicator className=\"clear-indicator\" {...props}>\n <S.ClearIndicatorIcon />\n </S.ClearIndicator>\n );\n };\n\n const IndicatorSeparator = props => {\n return <S.IndicatorSeparator className=\"indicator-separator\" {...props} />;\n };\n\n /**\n * Adds classnames to inner components\n */\n const innerComponents = {\n Control,\n ValueContainer,\n DropdownIndicator,\n IndicatorSeparator,\n ClearIndicator,\n Option,\n SingleValue,\n Input,\n Placeholder,\n Menu\n };\n\n const sharedSelectProps = {\n ref: forwardedRef,\n options: loadOptions ? undefined : availableOptions,\n value: selected,\n loadOptions: loadOptions,\n loadingMessage: loadingMessageFunc,\n formatCreateLabel: createNewOptionMessageFunc,\n noOptionsMessage: input => {\n return noOptionsMessageFunc(input.inputValue);\n },\n onFocus: () => {\n setFocused(true);\n },\n onBlur: () => {\n setFocused(false);\n },\n focused: focused,\n isDisabled: disabled || readOnly,\n components: innerComponents,\n isClearable: true,\n isSearchable: true,\n placeholder: placeholder,\n id: uniqueId,\n cacheUniqs: loadOptions ? [cacheUnique] : undefined,\n onChange: (selected, actionMeta) => {\n switch (actionMeta.action) {\n case 'create-option':\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n if (loadOptions) {\n setCacheUnique(cacheUnique + 1);\n }\n\n setSelected(selected);\n break;\n\n case 'select-option':\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n setSelected(selected);\n break;\n\n case 'remove-value':\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n setSelected(selected);\n break;\n\n case 'pop-value':\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n setSelected(selected);\n break;\n\n case 'deselect-option':\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n setSelected(selected);\n break;\n\n case 'clear':\n setSelected(selected);\n break;\n\n default:\n if (onUpdateCallback) {\n onUpdateCallback(actionMeta.action, selected.value);\n }\n\n setSelected(selected);\n break;\n }\n }\n };\n\n if (hidden) return null;\n\n const input = () => {\n return (\n <S.CompactAutocompleteSelect disabled={disabled}>\n <S.InputContainer>\n {label && (\n <S.Label htmlFor={uniqueId} disabled={disabled}>\n {label}\n <S.SuccessContainer>\n {type === 'loading' && loadingIcon}\n {type === 'success' && successIcon}\n </S.SuccessContainer>\n </S.Label>\n )}\n {loadOptions ? (\n creatable ? (\n <S.AsyncCreatableAutocompleteSelect\n $hasLabel={!isEmpty(label)}\n {...sharedSelectProps}\n {...props}\n />\n ) : (\n <S.AsyncAutocompleteSelect\n $hasLabel={!isEmpty(label)}\n {...sharedSelectProps}\n {...props}\n />\n )\n ) : creatable ? (\n <S.AutocompletCreatableSelect\n $hasLabel={!isEmpty(label)}\n {...sharedSelectProps}\n {...props}\n />\n ) : (\n <S.AutocompletSelect $hasLabel={!isEmpty(label)} {...sharedSelectProps} {...props} />\n )}\n </S.InputContainer>\n </S.CompactAutocompleteSelect>\n );\n };\n\n return (\n <>\n {!memoizedDescriptionToolTip && input()}\n {memoizedDescriptionToolTip && (\n <div>\n <Tooltip\n content={memoizedDescriptionToolTip}\n key=\"tooltipTextArea1\"\n placement=\"bottom-end\"\n trigger={'mouseenter'}\n zIndex={999999}\n >\n {input()}\n </Tooltip>\n </div>\n )}\n </>\n );\n});\n\nexport default CompactAutocompleteSelect;\n"],"names":["DEFAULT_NO_OPTIONS_MESSAGE_FUNC","inputValue","CompactAutocompleteSelect","React","forwardRef","label","availableOptions","placeholder","selectedOption","loadOptions","noOptionsMessageFunc","createNewOptionMessageFunc","onUpdateCallback","loadingMessageFunc","creatable","readOnly","edit","disabled","hidden","type","descriptionToolTip","loadingIcon","successIcon","props","forwardedRef","uniqueId","useState","nanoid","selected","setSelected","focused","setFocused","cacheUnique","setCacheUnique","memoizedDescriptionToolTip","useMemo","Control","_jsx","S","className","ValueContainer","valueContainer","_Fragment","children","displayName","Input","selectInput","Menu","menu","Placeholder","Option","data","link","_jsxs","href","icon","SingleValue","DropdownIndicator","ClearIndicator","IndicatorSeparator","innerComponents","sharedSelectProps","ref","options","undefined","value","loadingMessage","formatCreateLabel","noOptionsMessage","input","onFocus","onBlur","isDisabled","components","isClearable","isSearchable","id","cacheUniqs","onChange","actionMeta","action","htmlFor","$hasLabel","isEmpty","Tooltip","content","placement","trigger","zIndex"],"mappings":"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"}