@veeqo/ui 14.14.0-beta-1 → 14.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (118) hide show
  1. package/dist/components/Action/Action.d.ts +8 -8
  2. package/dist/components/Alerts/Alert/Alert.cjs +12 -16
  3. package/dist/components/Alerts/Alert/Alert.cjs.map +1 -1
  4. package/dist/components/Alerts/Alert/Alert.d.ts +1 -4
  5. package/dist/components/Alerts/Alert/Alert.js +12 -16
  6. package/dist/components/Alerts/Alert/Alert.js.map +1 -1
  7. package/dist/components/Alerts/Alert/Alert.module.scss.cjs +2 -2
  8. package/dist/components/Alerts/Alert/Alert.module.scss.cjs.map +1 -1
  9. package/dist/components/Alerts/Alert/Alert.module.scss.js +2 -2
  10. package/dist/components/Alerts/Alert/Alert.module.scss.js.map +1 -1
  11. package/dist/components/Alerts/Alert/index.d.ts +0 -1
  12. package/dist/components/Alerts/Alert/types.d.ts +1 -15
  13. package/dist/components/Alerts/Alerts.module.scss.cjs +2 -2
  14. package/dist/components/Alerts/Alerts.module.scss.cjs.map +1 -1
  15. package/dist/components/Alerts/Alerts.module.scss.js +2 -2
  16. package/dist/components/Alerts/Alerts.module.scss.js.map +1 -1
  17. package/dist/components/Alerts/MiniAlert/MiniAlert.cjs +4 -7
  18. package/dist/components/Alerts/MiniAlert/MiniAlert.cjs.map +1 -1
  19. package/dist/components/Alerts/MiniAlert/MiniAlert.d.ts +1 -4
  20. package/dist/components/Alerts/MiniAlert/MiniAlert.js +4 -7
  21. package/dist/components/Alerts/MiniAlert/MiniAlert.js.map +1 -1
  22. package/dist/components/Alerts/MiniAlert/MiniAlert.module.scss.cjs +2 -2
  23. package/dist/components/Alerts/MiniAlert/MiniAlert.module.scss.cjs.map +1 -1
  24. package/dist/components/Alerts/MiniAlert/MiniAlert.module.scss.js +2 -2
  25. package/dist/components/Alerts/MiniAlert/MiniAlert.module.scss.js.map +1 -1
  26. package/dist/components/Alerts/MiniAlert/index.d.ts +0 -1
  27. package/dist/components/Alerts/MiniAlert/types.d.ts +2 -10
  28. package/dist/components/Alerts/constants.cjs.map +1 -1
  29. package/dist/components/Alerts/constants.d.ts +2 -2
  30. package/dist/components/Alerts/constants.js.map +1 -1
  31. package/dist/components/Alerts/types.d.ts +1 -7
  32. package/dist/components/AnimatedDropdown/hooks/useClickAway.cjs.map +1 -1
  33. package/dist/components/AnimatedDropdown/hooks/useClickAway.d.ts +1 -1
  34. package/dist/components/AnimatedDropdown/hooks/useClickAway.js.map +1 -1
  35. package/dist/components/Button/Button.d.ts +2 -2
  36. package/dist/components/DataGrid/components/GridContainer/GridContainer.cjs.map +1 -1
  37. package/dist/components/DataGrid/components/GridContainer/GridContainer.d.ts +2 -2
  38. package/dist/components/DataGrid/components/GridContainer/GridContainer.js.map +1 -1
  39. package/dist/components/DataGrid/hooks/useKeyboardNavigation.cjs.map +1 -1
  40. package/dist/components/DataGrid/hooks/useKeyboardNavigation.d.ts +1 -1
  41. package/dist/components/DataGrid/hooks/useKeyboardNavigation.js.map +1 -1
  42. package/dist/components/DataTable/components/ActionBar.cjs.map +1 -1
  43. package/dist/components/DataTable/components/ActionBar.d.ts +2 -2
  44. package/dist/components/DataTable/components/ActionBar.js.map +1 -1
  45. package/dist/components/DataTable/components/StickyHead.cjs.map +1 -1
  46. package/dist/components/DataTable/components/StickyHead.d.ts +2 -2
  47. package/dist/components/DataTable/components/StickyHead.js.map +1 -1
  48. package/dist/components/DataTable/hooks/useCellWidths.cjs.map +1 -1
  49. package/dist/components/DataTable/hooks/useCellWidths.d.ts +1 -1
  50. package/dist/components/DataTable/hooks/useCellWidths.js.map +1 -1
  51. package/dist/components/DataTable/hooks/useColumnWidths.cjs.map +1 -1
  52. package/dist/components/DataTable/hooks/useColumnWidths.d.ts +1 -1
  53. package/dist/components/DataTable/hooks/useColumnWidths.js.map +1 -1
  54. package/dist/components/DataTable/hooks/useColumns.cjs.map +1 -1
  55. package/dist/components/DataTable/hooks/useColumns.d.ts +1 -1
  56. package/dist/components/DataTable/hooks/useColumns.js.map +1 -1
  57. package/dist/components/DateInputField/types.d.ts +2 -2
  58. package/dist/components/DimensionsInput/DimensionsInput.d.ts +88 -69
  59. package/dist/components/Flex/FlexCol/FlexCol.d.ts +1 -1
  60. package/dist/components/Flex/FlexRow/FlexRow.d.ts +1 -1
  61. package/dist/components/LegacyDataTable/StickyHeader.cjs.map +1 -1
  62. package/dist/components/LegacyDataTable/StickyHeader.d.ts +2 -2
  63. package/dist/components/LegacyDataTable/StickyHeader.js.map +1 -1
  64. package/dist/components/Loader/Loader.cjs +4 -4
  65. package/dist/components/Loader/Loader.cjs.map +1 -1
  66. package/dist/components/Loader/Loader.d.ts +1 -1
  67. package/dist/components/Loader/Loader.js +4 -4
  68. package/dist/components/Loader/Loader.js.map +1 -1
  69. package/dist/components/Loader/TailSpin.cjs +3 -5
  70. package/dist/components/Loader/TailSpin.cjs.map +1 -1
  71. package/dist/components/Loader/TailSpin.js +3 -5
  72. package/dist/components/Loader/TailSpin.js.map +1 -1
  73. package/dist/components/Loader/loader.module.scss.cjs +2 -2
  74. package/dist/components/Loader/loader.module.scss.cjs.map +1 -1
  75. package/dist/components/Loader/loader.module.scss.js +2 -2
  76. package/dist/components/Loader/loader.module.scss.js.map +1 -1
  77. package/dist/components/Loader/loaderTypes.d.ts +5 -0
  78. package/dist/components/PhoneInput/index.d.ts +89 -69
  79. package/dist/components/Search/Search.d.ts +88 -69
  80. package/dist/components/SelectDropdown/components/ListItemSection/ListItemSection.cjs.map +1 -1
  81. package/dist/components/SelectDropdown/components/ListItemSection/ListItemSection.d.ts +2 -1
  82. package/dist/components/SelectDropdown/components/ListItemSection/ListItemSection.js.map +1 -1
  83. package/dist/components/SimpleTable/SimpleTable.d.ts +2 -2
  84. package/dist/components/Slider/hooks/types.d.ts +3 -3
  85. package/dist/components/Stack/Stack.d.ts +4 -4
  86. package/dist/components/TextField/TextField.d.ts +88 -69
  87. package/dist/components/TextField/index.d.ts +89 -69
  88. package/dist/components/Tooltip/Tooltip.cjs.map +1 -1
  89. package/dist/components/Tooltip/Tooltip.d.ts +2 -1
  90. package/dist/components/Tooltip/Tooltip.js.map +1 -1
  91. package/dist/components/UploadFile/hooks/useUploadFile/useUploadFile.d.ts +1 -1
  92. package/dist/components/View/View.cjs.map +1 -1
  93. package/dist/components/View/View.js.map +1 -1
  94. package/dist/components/ViewTab/ViewTab.d.ts +1 -1
  95. package/dist/components/ViewsContainer/hooks/useSetScrollPosition.cjs +1 -1
  96. package/dist/components/ViewsContainer/hooks/useSetScrollPosition.cjs.map +1 -1
  97. package/dist/components/ViewsContainer/hooks/useSetScrollPosition.js +1 -1
  98. package/dist/components/ViewsContainer/hooks/useSetScrollPosition.js.map +1 -1
  99. package/dist/components/WeightInput/WeightInput.cjs +0 -3
  100. package/dist/components/WeightInput/WeightInput.cjs.map +1 -1
  101. package/dist/components/WeightInput/WeightInput.js +0 -3
  102. package/dist/components/WeightInput/WeightInput.js.map +1 -1
  103. package/dist/components/index.d.ts +2 -3
  104. package/dist/hoc/withTokens/withTokens.cjs.map +1 -1
  105. package/dist/hoc/withTokens/withTokens.js.map +1 -1
  106. package/dist/hooks/useClickOutside.d.ts +1 -1
  107. package/dist/hooks/useDragToScroll.cjs.map +1 -1
  108. package/dist/hooks/useDragToScroll.d.ts +1 -1
  109. package/dist/hooks/useDragToScroll.js.map +1 -1
  110. package/dist/hooks/useIntersectionObserver.cjs +4 -4
  111. package/dist/hooks/useIntersectionObserver.cjs.map +1 -1
  112. package/dist/hooks/useIntersectionObserver.js +4 -4
  113. package/dist/hooks/useIntersectionObserver.js.map +1 -1
  114. package/dist/hooks/useResizeObserver.cjs +2 -2
  115. package/dist/hooks/useResizeObserver.cjs.map +1 -1
  116. package/dist/hooks/useResizeObserver.js +2 -2
  117. package/dist/hooks/useResizeObserver.js.map +1 -1
  118. package/package.json +12 -9
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, { ReactNode, useState } from 'react';\nimport { AnimatePresence } from 'framer-motion';\nimport { TooltipProps } from './types';\nimport { TooltipPopover } from './components/TooltipPopover';\nimport { LegacyClassNames } from './components/types';\nimport { Portal } from '../Portal';\nimport { buildClassnames } from '../../utils';\nimport tooltipStyles from './Tooltip.module.scss';\n\nconst WithOptionalPortal: React.FC<{ usePortal: boolean; children: ReactNode }> = ({\n usePortal = false,\n children,\n // eslint-disable-next-line react/jsx-no-useless-fragment\n}) => (usePortal ? <Portal>{children}</Portal> : <>{children}</>);\n\nexport const Tooltip = ({\n children,\n text,\n content,\n config,\n reversed = false,\n className,\n hoverableClassName,\n withTriangle,\n initialShouldShow = false,\n useReactPortal = true,\n}: TooltipProps): JSX.Element | null => {\n const [shouldShow, setShouldShow] = useState(initialShouldShow);\n const [hoverableElement, setHoverableElement] = useState<HTMLDivElement | null>(null);\n\n const hasText = text ? text.trim().length > 0 : false;\n const hasContent = !!(content || hasText);\n\n // Backward-compatible suffix classes for monolith consumers that\n // target sub-elements via the className prefix convention.\n const legacyClassNames: LegacyClassNames | undefined = className\n ? {\n tip: `${className}-tip`,\n wrap: `${className}-wrap`,\n triangle: `${className}-triangle`,\n }\n : undefined;\n\n if (!hasContent) return children;\n\n const show = () => setShouldShow(true);\n const hide = () => setShouldShow(false);\n\n return (\n <div className={buildClassnames([tooltipStyles.container, className, className && `${className}-container`])}>\n <AnimatePresence>\n {shouldShow && (\n <WithOptionalPortal usePortal={useReactPortal}>\n <TooltipPopover\n key=\"tooltip-popover\"\n hoverableElement={hoverableElement}\n config={config}\n reversed={reversed}\n withTriangle={withTriangle}\n text={text}\n content={content}\n legacyClassNames={legacyClassNames}\n />\n </WithOptionalPortal>\n )}\n </AnimatePresence>\n\n <div\n ref={setHoverableElement}\n className={buildClassnames([tooltipStyles.hoverable, hoverableClassName, className && `${className}-hoverable`])}\n onMouseEnter={show}\n onMouseLeave={hide}\n >\n {children}\n </div>\n </div>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;;AASA,MAAM,kBAAkB,GAA0D,CAAC,EACjF,SAAS,GAAG,KAAK,EACjB,QAAQ;AACR;AACD,EAAA,MAAM,SAAS,GAAGA,cAAA,CAAA,aAAA,CAAC,MAAM,QAAE,QAAQ,CAAU,GAAGA,4DAAG,QAAQ,CAAI,CAAC;AAE1D,MAAM,OAAO,GAAG,CAAC,EACtB,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,GAAG,KAAK,EACzB,cAAc,GAAG,IAAI,GACR,KAAwB;IACrC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,iBAAiB,CAAC;IAC/D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAwB,IAAI,CAAC;AAErF,IAAA,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK;IACrD,MAAM,UAAU,GAAG,CAAC,EAAE,OAAO,IAAI,OAAO,CAAC;;;IAIzC,MAAM,gBAAgB,GAAiC;AACrD,UAAE;YACE,GAAG,EAAE,CAAA,EAAG,SAAS,CAAA,IAAA,CAAM;YACvB,IAAI,EAAE,CAAA,EAAG,SAAS,CAAA,KAAA,CAAO;YACzB,QAAQ,EAAE,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW;AAClC;UACD,SAAS;AAEb,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAO,QAAQ;IAEhC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,IAAI,CAAC;IACtC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,KAAK,CAAC;AAEvC,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,eAAe,CAAC,CAAC,aAAa,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,IAAI,GAAG,SAAS,CAAA,UAAA,CAAY,CAAC,CAAC,EAAA;QAC1GA,cAAA,CAAA,aAAA,CAAC,eAAe,EAAA,IAAA,EACb,UAAU,KACTA,6BAAC,kBAAkB,EAAA,EAAC,SAAS,EAAE,cAAc,EAAA;AAC3C,YAAAA,cAAA,CAAA,aAAA,CAAC,cAAc,EAAA,EACb,GAAG,EAAC,iBAAiB,EACrB,gBAAgB,EAAE,gBAAgB,EAClC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE,gBAAgB,EAAA,CAClC,CACiB,CACtB,CACe;AAElB,QAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,mBAAmB,EACxB,SAAS,EAAE,eAAe,CAAC,CAAC,aAAa,CAAC,SAAS,EAAE,kBAAkB,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,YAAY,CAAC,CAAC,EAChH,YAAY,EAAE,IAAI,EAClB,YAAY,EAAE,IAAI,EAAA,EAEjB,QAAQ,CACL,CACF;AAEV;;;;"}
1
+ {"version":3,"file":"Tooltip.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode, useState } from 'react';\nimport { AnimatePresence } from 'framer-motion';\nimport { TooltipProps } from './types';\nimport { TooltipPopover } from './components/TooltipPopover';\nimport { LegacyClassNames } from './components/types';\nimport { Portal } from '../Portal';\nimport { buildClassnames } from '../../utils';\nimport tooltipStyles from './Tooltip.module.scss';\n\nconst WithOptionalPortal: React.FC<{ usePortal: boolean; children: ReactNode }> = ({\n usePortal = false,\n children,\n // eslint-disable-next-line react/jsx-no-useless-fragment\n}) => (usePortal ? <Portal>{children}</Portal> : <>{children}</>);\n\nexport const Tooltip = ({\n children,\n text,\n content,\n config,\n reversed = false,\n className,\n hoverableClassName,\n withTriangle,\n initialShouldShow = false,\n useReactPortal = true,\n}: TooltipProps): ReactElement | null => {\n const [shouldShow, setShouldShow] = useState(initialShouldShow);\n const [hoverableElement, setHoverableElement] = useState<HTMLDivElement | null>(null);\n\n const hasText = text ? text.trim().length > 0 : false;\n const hasContent = !!(content || hasText);\n\n // Backward-compatible suffix classes for monolith consumers that\n // target sub-elements via the className prefix convention.\n const legacyClassNames: LegacyClassNames | undefined = className\n ? {\n tip: `${className}-tip`,\n wrap: `${className}-wrap`,\n triangle: `${className}-triangle`,\n }\n : undefined;\n\n if (!hasContent) return children;\n\n const show = () => setShouldShow(true);\n const hide = () => setShouldShow(false);\n\n return (\n <div className={buildClassnames([tooltipStyles.container, className, className && `${className}-container`])}>\n <AnimatePresence>\n {shouldShow && (\n <WithOptionalPortal usePortal={useReactPortal}>\n <TooltipPopover\n key=\"tooltip-popover\"\n hoverableElement={hoverableElement}\n config={config}\n reversed={reversed}\n withTriangle={withTriangle}\n text={text}\n content={content}\n legacyClassNames={legacyClassNames}\n />\n </WithOptionalPortal>\n )}\n </AnimatePresence>\n\n <div\n ref={setHoverableElement}\n className={buildClassnames([tooltipStyles.hoverable, hoverableClassName, className && `${className}-hoverable`])}\n onMouseEnter={show}\n onMouseLeave={hide}\n >\n {children}\n </div>\n </div>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;;AASA,MAAM,kBAAkB,GAA0D,CAAC,EACjF,SAAS,GAAG,KAAK,EACjB,QAAQ;AACR;AACD,EAAA,MAAM,SAAS,GAAGA,cAAA,CAAA,aAAA,CAAC,MAAM,QAAE,QAAQ,CAAU,GAAGA,4DAAG,QAAQ,CAAI,CAAC;AAE1D,MAAM,OAAO,GAAG,CAAC,EACtB,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,GAAG,KAAK,EACzB,cAAc,GAAG,IAAI,GACR,KAAyB;IACtC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,iBAAiB,CAAC;IAC/D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAwB,IAAI,CAAC;AAErF,IAAA,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK;IACrD,MAAM,UAAU,GAAG,CAAC,EAAE,OAAO,IAAI,OAAO,CAAC;;;IAIzC,MAAM,gBAAgB,GAAiC;AACrD,UAAE;YACE,GAAG,EAAE,CAAA,EAAG,SAAS,CAAA,IAAA,CAAM;YACvB,IAAI,EAAE,CAAA,EAAG,SAAS,CAAA,KAAA,CAAO;YACzB,QAAQ,EAAE,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW;AAClC;UACD,SAAS;AAEb,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAO,QAAQ;IAEhC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,IAAI,CAAC;IACtC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,KAAK,CAAC;AAEvC,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,eAAe,CAAC,CAAC,aAAa,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,IAAI,GAAG,SAAS,CAAA,UAAA,CAAY,CAAC,CAAC,EAAA;QAC1GA,cAAA,CAAA,aAAA,CAAC,eAAe,EAAA,IAAA,EACb,UAAU,KACTA,6BAAC,kBAAkB,EAAA,EAAC,SAAS,EAAE,cAAc,EAAA;AAC3C,YAAAA,cAAA,CAAA,aAAA,CAAC,cAAc,EAAA,EACb,GAAG,EAAC,iBAAiB,EACrB,gBAAgB,EAAE,gBAAgB,EAClC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE,gBAAgB,EAAA,CAClC,CACiB,CACtB,CACe;AAElB,QAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,mBAAmB,EACxB,SAAS,EAAE,eAAe,CAAC,CAAC,aAAa,CAAC,SAAS,EAAE,kBAAkB,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,YAAY,CAAC,CAAC,EAChH,YAAY,EAAE,IAAI,EAClB,YAAY,EAAE,IAAI,EAAA,EAEjB,QAAQ,CACL,CACF;AAEV;;;;"}
@@ -4,7 +4,7 @@ type UseUploadFileProps = {
4
4
  };
5
5
  export declare const useUploadFile: ({ onFileInputCancelled }?: UseUploadFileProps) => {
6
6
  clearFileSelection: () => void;
7
- inputRef: import("react").MutableRefObject<HTMLInputElement | null>;
7
+ inputRef: import("react").RefObject<HTMLInputElement | null>;
8
8
  onCancel: () => void;
9
9
  removeFileFromList: (fileToRemove: File) => void;
10
10
  setFileList: import("react").Dispatch<import("react").SetStateAction<FileList | undefined>>;
@@ -1 +1 @@
1
- {"version":3,"file":"View.cjs","sources":["../../../src/components/View/View.tsx"],"sourcesContent":["import React, { useCallback, CSSProperties } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\nimport { sizes } from '../../theme/modules/sizes';\n\nimport { ViewProps, ViewTypes } from './types';\n\nimport { CrossIcon, EditIcon } from '../../icons';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { assignCssVars } from '../../utils/assignCssVars';\nimport { Text } from '../Text';\nimport styles from './View.module.scss';\n\nexport interface ClassNamesReturnPayload {\n delete?: string;\n options?: string;\n edit?: string;\n container?: string;\n active?: string;\n counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n delete: prefix ? `${prefix}-delete` : undefined,\n options: prefix ? `${prefix}-options` : undefined,\n edit: prefix ? `${prefix}-edit` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n active: prefix ? `${prefix}-active` : undefined,\n counter: prefix ? `${prefix}-counter` : undefined,\n});\n\nconst IconStyling = {\n style: {\n marginLeft: sizes.xs,\n padding: sizes.xs,\n height: sizes.base,\n width: sizes.base,\n } as CSSProperties,\n};\n\n/**\n *\n * @deprecated\n *\n * use ViewTab component instead\n *\n */\nexport const View = ({\n id,\n iconSlot,\n name,\n type,\n className,\n colourPalette = colors.secondary.blue,\n customTextColour,\n count,\n active = false,\n onClick,\n onDelete,\n onEdit,\n e2eClassName,\n}: ViewProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n const [isHovered, handleEnter, handleLeave] = useHover();\n\n const handleClick = useCallback(() => onClick(id), [id, onClick]);\n const handleDelete = useCallback(\n (event) => {\n event.stopPropagation();\n if (onDelete) onDelete(id);\n },\n [onDelete, id],\n );\n const handleEdit = useCallback(\n (event) => {\n event.stopPropagation();\n if (onEdit) onEdit(id);\n },\n [onEdit, id],\n );\n\n const isDraft = type === ViewTypes.draft;\n const isSaved = type === ViewTypes.saved;\n const fill = active ? colors.neutral.ink.dark : colors.neutral.ink.base;\n\n const contourVars = assignCssVars({\n colourPaletteBase: colourPalette.base,\n colourPaletteLightest: colourPalette.lightest,\n customTextColour,\n });\n\n const textColor = customTextColour ?? colors.neutral.ink.dark;\n const isCounterActive = active || isHovered;\n\n return (\n <div\n className={buildClassnames([\n styles.container,\n classNames?.container,\n e2eClassNames?.container,\n active ? e2eClassNames?.active : undefined,\n ])}\n onClick={handleClick}\n >\n <div\n className={buildClassnames([styles.contour, active ? styles.active : undefined])}\n style={contourVars}\n onMouseEnter={handleEnter}\n onMouseLeave={handleLeave}\n >\n {iconSlot && <div className={styles.customIconWrapper}>{iconSlot}</div>}\n <Text variant=\"bodyBold\" style={{ color: textColor }}>{name}</Text>\n {count != null && (\n <Text\n variant=\"subheadingSmall\"\n className={buildClassnames([\n styles.counterContainer,\n isCounterActive ? styles.counterActive : undefined,\n ])}\n style={{\n ...contourVars,\n ...(isCounterActive ? { backgroundColor: colourPalette.base } : undefined),\n }}\n >\n <span\n className={buildClassnames([styles.counterText, e2eClassNames?.counter])}\n style={isCounterActive ? { color: '#fff' } : undefined}\n >\n {count}\n </span>\n </Text>\n )}\n {isDraft && (\n <CrossIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.delete}\n onClick={handleDelete}\n />\n )}\n {isSaved && active && (\n <EditIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.edit}\n onClick={handleEdit}\n />\n )}\n </div>\n </div>\n );\n};\n"],"names":["sizes","colors","useHover","useCallback","ViewTypes","assignCssVars","React","buildClassnames","styles","Text","CrossIcon","EditIcon"],"mappings":"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"}
1
+ {"version":3,"file":"View.cjs","sources":["../../../src/components/View/View.tsx"],"sourcesContent":["import React, { useCallback, CSSProperties } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\nimport { sizes } from '../../theme/modules/sizes';\n\nimport { ViewProps, ViewTypes } from './types';\n\nimport { CrossIcon, EditIcon } from '../../icons';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { assignCssVars } from '../../utils/assignCssVars';\nimport { Text } from '../Text';\nimport styles from './View.module.scss';\n\nexport interface ClassNamesReturnPayload {\n delete?: string;\n options?: string;\n edit?: string;\n container?: string;\n active?: string;\n counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n delete: prefix ? `${prefix}-delete` : undefined,\n options: prefix ? `${prefix}-options` : undefined,\n edit: prefix ? `${prefix}-edit` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n active: prefix ? `${prefix}-active` : undefined,\n counter: prefix ? `${prefix}-counter` : undefined,\n});\n\nconst IconStyling = {\n style: {\n marginLeft: sizes.xs,\n padding: sizes.xs,\n height: sizes.base,\n width: sizes.base,\n } as CSSProperties,\n};\n\n/**\n *\n * @deprecated\n *\n * use ViewTab component instead\n *\n */\nexport const View = ({\n id,\n iconSlot,\n name,\n type,\n className,\n colourPalette = colors.secondary.blue,\n customTextColour,\n count,\n active = false,\n onClick,\n onDelete,\n onEdit,\n e2eClassName,\n}: ViewProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n const [isHovered, handleEnter, handleLeave] = useHover();\n\n const handleClick = useCallback(() => onClick(id), [id, onClick]);\n const handleDelete = useCallback(\n (event: React.MouseEvent) => {\n event.stopPropagation();\n if (onDelete) onDelete(id);\n },\n [onDelete, id],\n );\n const handleEdit = useCallback(\n (event: React.MouseEvent) => {\n event.stopPropagation();\n if (onEdit) onEdit(id);\n },\n [onEdit, id],\n );\n\n const isDraft = type === ViewTypes.draft;\n const isSaved = type === ViewTypes.saved;\n const fill = active ? colors.neutral.ink.dark : colors.neutral.ink.base;\n\n const contourVars = assignCssVars({\n colourPaletteBase: colourPalette.base,\n colourPaletteLightest: colourPalette.lightest,\n customTextColour,\n });\n\n const textColor = customTextColour ?? colors.neutral.ink.dark;\n const isCounterActive = active || isHovered;\n\n return (\n <div\n className={buildClassnames([\n styles.container,\n classNames?.container,\n e2eClassNames?.container,\n active ? e2eClassNames?.active : undefined,\n ])}\n onClick={handleClick}\n >\n <div\n className={buildClassnames([styles.contour, active ? styles.active : undefined])}\n style={contourVars}\n onMouseEnter={handleEnter}\n onMouseLeave={handleLeave}\n >\n {iconSlot && <div className={styles.customIconWrapper}>{iconSlot}</div>}\n <Text variant=\"bodyBold\" style={{ color: textColor }}>{name}</Text>\n {count != null && (\n <Text\n variant=\"subheadingSmall\"\n className={buildClassnames([\n styles.counterContainer,\n isCounterActive ? styles.counterActive : undefined,\n ])}\n style={{\n ...contourVars,\n ...(isCounterActive ? { backgroundColor: colourPalette.base } : undefined),\n }}\n >\n <span\n className={buildClassnames([styles.counterText, e2eClassNames?.counter])}\n style={isCounterActive ? { color: '#fff' } : undefined}\n >\n {count}\n </span>\n </Text>\n )}\n {isDraft && (\n <CrossIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.delete}\n onClick={handleDelete}\n />\n )}\n {isSaved && active && (\n <EditIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.edit}\n onClick={handleEdit}\n />\n )}\n </div>\n </div>\n );\n};\n"],"names":["sizes","colors","useHover","useCallback","ViewTypes","assignCssVars","React","buildClassnames","styles","Text","CrossIcon","EditIcon"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"View.js","sources":["../../../src/components/View/View.tsx"],"sourcesContent":["import React, { useCallback, CSSProperties } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\nimport { sizes } from '../../theme/modules/sizes';\n\nimport { ViewProps, ViewTypes } from './types';\n\nimport { CrossIcon, EditIcon } from '../../icons';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { assignCssVars } from '../../utils/assignCssVars';\nimport { Text } from '../Text';\nimport styles from './View.module.scss';\n\nexport interface ClassNamesReturnPayload {\n delete?: string;\n options?: string;\n edit?: string;\n container?: string;\n active?: string;\n counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n delete: prefix ? `${prefix}-delete` : undefined,\n options: prefix ? `${prefix}-options` : undefined,\n edit: prefix ? `${prefix}-edit` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n active: prefix ? `${prefix}-active` : undefined,\n counter: prefix ? `${prefix}-counter` : undefined,\n});\n\nconst IconStyling = {\n style: {\n marginLeft: sizes.xs,\n padding: sizes.xs,\n height: sizes.base,\n width: sizes.base,\n } as CSSProperties,\n};\n\n/**\n *\n * @deprecated\n *\n * use ViewTab component instead\n *\n */\nexport const View = ({\n id,\n iconSlot,\n name,\n type,\n className,\n colourPalette = colors.secondary.blue,\n customTextColour,\n count,\n active = false,\n onClick,\n onDelete,\n onEdit,\n e2eClassName,\n}: ViewProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n const [isHovered, handleEnter, handleLeave] = useHover();\n\n const handleClick = useCallback(() => onClick(id), [id, onClick]);\n const handleDelete = useCallback(\n (event) => {\n event.stopPropagation();\n if (onDelete) onDelete(id);\n },\n [onDelete, id],\n );\n const handleEdit = useCallback(\n (event) => {\n event.stopPropagation();\n if (onEdit) onEdit(id);\n },\n [onEdit, id],\n );\n\n const isDraft = type === ViewTypes.draft;\n const isSaved = type === ViewTypes.saved;\n const fill = active ? colors.neutral.ink.dark : colors.neutral.ink.base;\n\n const contourVars = assignCssVars({\n colourPaletteBase: colourPalette.base,\n colourPaletteLightest: colourPalette.lightest,\n customTextColour,\n });\n\n const textColor = customTextColour ?? colors.neutral.ink.dark;\n const isCounterActive = active || isHovered;\n\n return (\n <div\n className={buildClassnames([\n styles.container,\n classNames?.container,\n e2eClassNames?.container,\n active ? e2eClassNames?.active : undefined,\n ])}\n onClick={handleClick}\n >\n <div\n className={buildClassnames([styles.contour, active ? styles.active : undefined])}\n style={contourVars}\n onMouseEnter={handleEnter}\n onMouseLeave={handleLeave}\n >\n {iconSlot && <div className={styles.customIconWrapper}>{iconSlot}</div>}\n <Text variant=\"bodyBold\" style={{ color: textColor }}>{name}</Text>\n {count != null && (\n <Text\n variant=\"subheadingSmall\"\n className={buildClassnames([\n styles.counterContainer,\n isCounterActive ? styles.counterActive : undefined,\n ])}\n style={{\n ...contourVars,\n ...(isCounterActive ? { backgroundColor: colourPalette.base } : undefined),\n }}\n >\n <span\n className={buildClassnames([styles.counterText, e2eClassNames?.counter])}\n style={isCounterActive ? { color: '#fff' } : undefined}\n >\n {count}\n </span>\n </Text>\n )}\n {isDraft && (\n <CrossIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.delete}\n onClick={handleDelete}\n />\n )}\n {isSaved && active && (\n <EditIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.edit}\n onClick={handleEdit}\n />\n )}\n </div>\n </div>\n );\n};\n"],"names":["React"],"mappings":"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"}
1
+ {"version":3,"file":"View.js","sources":["../../../src/components/View/View.tsx"],"sourcesContent":["import React, { useCallback, CSSProperties } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\nimport { sizes } from '../../theme/modules/sizes';\n\nimport { ViewProps, ViewTypes } from './types';\n\nimport { CrossIcon, EditIcon } from '../../icons';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { assignCssVars } from '../../utils/assignCssVars';\nimport { Text } from '../Text';\nimport styles from './View.module.scss';\n\nexport interface ClassNamesReturnPayload {\n delete?: string;\n options?: string;\n edit?: string;\n container?: string;\n active?: string;\n counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n delete: prefix ? `${prefix}-delete` : undefined,\n options: prefix ? `${prefix}-options` : undefined,\n edit: prefix ? `${prefix}-edit` : undefined,\n container: prefix ? `${prefix}-container` : undefined,\n active: prefix ? `${prefix}-active` : undefined,\n counter: prefix ? `${prefix}-counter` : undefined,\n});\n\nconst IconStyling = {\n style: {\n marginLeft: sizes.xs,\n padding: sizes.xs,\n height: sizes.base,\n width: sizes.base,\n } as CSSProperties,\n};\n\n/**\n *\n * @deprecated\n *\n * use ViewTab component instead\n *\n */\nexport const View = ({\n id,\n iconSlot,\n name,\n type,\n className,\n colourPalette = colors.secondary.blue,\n customTextColour,\n count,\n active = false,\n onClick,\n onDelete,\n onEdit,\n e2eClassName,\n}: ViewProps) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n const [isHovered, handleEnter, handleLeave] = useHover();\n\n const handleClick = useCallback(() => onClick(id), [id, onClick]);\n const handleDelete = useCallback(\n (event: React.MouseEvent) => {\n event.stopPropagation();\n if (onDelete) onDelete(id);\n },\n [onDelete, id],\n );\n const handleEdit = useCallback(\n (event: React.MouseEvent) => {\n event.stopPropagation();\n if (onEdit) onEdit(id);\n },\n [onEdit, id],\n );\n\n const isDraft = type === ViewTypes.draft;\n const isSaved = type === ViewTypes.saved;\n const fill = active ? colors.neutral.ink.dark : colors.neutral.ink.base;\n\n const contourVars = assignCssVars({\n colourPaletteBase: colourPalette.base,\n colourPaletteLightest: colourPalette.lightest,\n customTextColour,\n });\n\n const textColor = customTextColour ?? colors.neutral.ink.dark;\n const isCounterActive = active || isHovered;\n\n return (\n <div\n className={buildClassnames([\n styles.container,\n classNames?.container,\n e2eClassNames?.container,\n active ? e2eClassNames?.active : undefined,\n ])}\n onClick={handleClick}\n >\n <div\n className={buildClassnames([styles.contour, active ? styles.active : undefined])}\n style={contourVars}\n onMouseEnter={handleEnter}\n onMouseLeave={handleLeave}\n >\n {iconSlot && <div className={styles.customIconWrapper}>{iconSlot}</div>}\n <Text variant=\"bodyBold\" style={{ color: textColor }}>{name}</Text>\n {count != null && (\n <Text\n variant=\"subheadingSmall\"\n className={buildClassnames([\n styles.counterContainer,\n isCounterActive ? styles.counterActive : undefined,\n ])}\n style={{\n ...contourVars,\n ...(isCounterActive ? { backgroundColor: colourPalette.base } : undefined),\n }}\n >\n <span\n className={buildClassnames([styles.counterText, e2eClassNames?.counter])}\n style={isCounterActive ? { color: '#fff' } : undefined}\n >\n {count}\n </span>\n </Text>\n )}\n {isDraft && (\n <CrossIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.delete}\n onClick={handleDelete}\n />\n )}\n {isSaved && active && (\n <EditIcon\n {...IconStyling}\n color={fill}\n className={e2eClassNames?.edit}\n onClick={handleEdit}\n />\n )}\n </div>\n </div>\n );\n};\n"],"names":["React"],"mappings":"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"}
@@ -11,7 +11,7 @@ export declare const ViewTab: React.ForwardRefExoticComponent<Omit<React.ButtonH
11
11
  customTextColour?: string | undefined;
12
12
  active?: boolean | undefined;
13
13
  name: string;
14
- iconSlot?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
14
+ iconSlot?: React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | undefined;
15
15
  id: string;
16
16
  type?: "fixed" | "saved" | "draft" | undefined;
17
17
  count?: string | number | null | undefined;
@@ -4,7 +4,7 @@ var React = require('react');
4
4
  var utils = require('../utils.cjs');
5
5
 
6
6
  function usePrevious(value) {
7
- const ref = React.useRef();
7
+ const ref = React.useRef(undefined);
8
8
  React.useEffect(() => {
9
9
  ref.current = value;
10
10
  });
@@ -1 +1 @@
1
- {"version":3,"file":"useSetScrollPosition.cjs","sources":["../../../../src/components/ViewsContainer/hooks/useSetScrollPosition.ts"],"sourcesContent":["import {\n MutableRefObject,\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n Children,\n} from 'react';\nimport { createViewPositionArray, getNextViewPosition, getPrevViewPosition } from '../utils';\n\nfunction usePrevious<T>(value: T): T | undefined {\n const ref = useRef<T>();\n useEffect(() => {\n ref.current = value;\n });\n return ref.current;\n}\n\ntype UseSetScrollPositionProps = {\n containerRef: MutableRefObject<HTMLDivElement>;\n children: ReactNode;\n hasMoreViews?: boolean;\n onFetchMoreViews?: () => void;\n isLoadingMoreViews?: boolean;\n};\n\nexport const useSetScrollPosition = ({\n containerRef,\n children,\n hasMoreViews = false,\n onFetchMoreViews,\n isLoadingMoreViews = false,\n}: UseSetScrollPositionProps) => {\n const [leftDisabled, setLeftDisabled] = useState(true);\n const [rightDisabled, setRightDisabled] = useState(false);\n const [viewStartPositions, setViewStartPositions] = useState<number[]>([]);\n\n const activeTab = containerRef?.current?.querySelector('[aria-selected = true]');\n const prevActiveTab = usePrevious(activeTab);\n\n const handleScroll = useCallback(() => {\n if (containerRef.current?.scrollLeft > 0) {\n setLeftDisabled(false);\n } else {\n if (document.getElementById('left-arrow') === document.activeElement) {\n document.getElementById('right-arrow')?.focus();\n }\n setLeftDisabled(true);\n }\n\n const maxScrollWidth = containerRef.current?.scrollWidth ?? 0;\n const maxClientWidth = containerRef.current?.clientWidth ?? 0;\n const maxScrollLeft = maxScrollWidth - maxClientWidth;\n\n // -10 to prevent javascript assertion errors on floating points\n if (containerRef.current?.scrollLeft >= maxScrollLeft - 10) {\n if (document.getElementById('right-arrow') === document.activeElement) {\n document.getElementById('left-arrow')?.focus();\n }\n setRightDisabled(true);\n\n // Check if we've reached the end and should fetch more data\n // Only fetches more when not already loading more views and has more views to load\n if (hasMoreViews && onFetchMoreViews && !isLoadingMoreViews) {\n onFetchMoreViews();\n }\n } else {\n setRightDisabled(false);\n }\n }, [containerRef, onFetchMoreViews, isLoadingMoreViews, hasMoreViews]);\n\n const handleResize = useCallback(() => {\n if (!containerRef.current) return;\n if (containerRef.current.scrollWidth - containerRef.current.getBoundingClientRect().width < 5) {\n setRightDisabled(true);\n } else {\n setRightDisabled(false);\n }\n }, [containerRef]);\n\n const toNextScrollPosition = useCallback(() => {\n const newPosition = getNextViewPosition(\n viewStartPositions,\n containerRef.current.scrollLeft,\n containerRef.current.clientWidth,\n );\n\n containerRef.current.scrollTo({\n left: newPosition,\n top: 0,\n behavior: 'smooth',\n });\n }, [containerRef, viewStartPositions]);\n\n const toPrevScrollPosition = useCallback(() => {\n const newPosition = getPrevViewPosition(viewStartPositions, containerRef.current.scrollLeft);\n\n containerRef.current.scrollTo({\n left: newPosition,\n top: 0,\n behavior: 'smooth',\n });\n }, [containerRef, viewStartPositions]);\n\n // Initialize view positions when container first has children\n useEffect(() => {\n if (!containerRef?.current?.children?.length || viewStartPositions.length > 0) return;\n\n setViewStartPositions(createViewPositionArray(containerRef.current));\n }, [containerRef, viewStartPositions.length]);\n\n // Handle new item addition - scroll to end and update positions\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n\n const childrenCount = containerRef.current.children.length;\n const positionsCount = viewStartPositions.length;\n const totalChildren = Children.count(children);\n\n const shouldScrollToNewItem =\n childrenCount !== positionsCount && positionsCount > 0 && positionsCount < totalChildren;\n\n if (!shouldScrollToNewItem) return;\n\n containerRef.current.scrollTo({\n left: containerRef.current.scrollWidth - containerRef.current.clientWidth,\n top: 0,\n behavior: 'smooth',\n });\n\n // Compute the x position of the new item\n const lastChildRect =\n containerRef.current.children[positionsCount - 1]?.getBoundingClientRect();\n const newPosition = viewStartPositions[positionsCount - 1] + (lastChildRect?.x ?? 0) - 20;\n\n setViewStartPositions([...viewStartPositions, newPosition]);\n }, [containerRef, children, viewStartPositions]);\n\n // Handle active tab changes - scroll to active tab\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n if (activeTab === prevActiveTab || activeTab === null) return;\n if (containerRef.current.children.length !== viewStartPositions.length) return;\n\n const index = Array.from(containerRef.current.children).indexOf(activeTab);\n if (index === -1) return;\n\n containerRef.current.scrollTo({\n left: viewStartPositions[index],\n top: 0,\n behavior: 'smooth',\n });\n }, [activeTab, prevActiveTab, containerRef, viewStartPositions]);\n\n // Handle fetching more views - recompute positions\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n if (viewStartPositions.length >= containerRef.current.children.length) return;\n\n const currentScrollLeft = containerRef.current.scrollLeft;\n\n // Temporarily reset scroll to 0 to get accurate positions\n containerRef.current.scrollTo({ left: 0, top: 0, behavior: 'auto' });\n\n // Recompute positions from scroll position 0\n setViewStartPositions(createViewPositionArray(containerRef.current));\n\n // Restore the user's scroll position\n containerRef.current.scrollTo({ left: currentScrollLeft, top: 0, behavior: 'auto' });\n }, [containerRef, viewStartPositions.length]);\n\n // Handle window resize and scroll event listeners\n useEffect(() => {\n if (!containerRef?.current) return;\n\n const container = containerRef.current;\n\n handleResize();\n window.addEventListener('resize', handleResize);\n container.addEventListener('scroll', handleScroll);\n\n // eslint-disable-next-line consistent-return\n return () => {\n window.removeEventListener('resize', handleResize);\n container.removeEventListener('scroll', handleScroll);\n };\n }, [containerRef, handleResize, handleScroll]);\n\n return { rightDisabled, leftDisabled, toNextScrollPosition, toPrevScrollPosition };\n};\n"],"names":["useRef","useEffect","useState","useCallback","getNextViewPosition","getPrevViewPosition","createViewPositionArray","Children"],"mappings":"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"}
1
+ {"version":3,"file":"useSetScrollPosition.cjs","sources":["../../../../src/components/ViewsContainer/hooks/useSetScrollPosition.ts"],"sourcesContent":["import {\n MutableRefObject,\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n Children,\n} from 'react';\nimport { createViewPositionArray, getNextViewPosition, getPrevViewPosition } from '../utils';\n\nfunction usePrevious<T>(value: T): T | undefined {\n const ref = useRef<T | undefined>(undefined);\n useEffect(() => {\n ref.current = value;\n });\n return ref.current;\n}\n\ntype UseSetScrollPositionProps = {\n containerRef: MutableRefObject<HTMLDivElement>;\n children: ReactNode;\n hasMoreViews?: boolean;\n onFetchMoreViews?: () => void;\n isLoadingMoreViews?: boolean;\n};\n\nexport const useSetScrollPosition = ({\n containerRef,\n children,\n hasMoreViews = false,\n onFetchMoreViews,\n isLoadingMoreViews = false,\n}: UseSetScrollPositionProps) => {\n const [leftDisabled, setLeftDisabled] = useState(true);\n const [rightDisabled, setRightDisabled] = useState(false);\n const [viewStartPositions, setViewStartPositions] = useState<number[]>([]);\n\n const activeTab = containerRef?.current?.querySelector('[aria-selected = true]');\n const prevActiveTab = usePrevious(activeTab);\n\n const handleScroll = useCallback(() => {\n if (containerRef.current?.scrollLeft > 0) {\n setLeftDisabled(false);\n } else {\n if (document.getElementById('left-arrow') === document.activeElement) {\n document.getElementById('right-arrow')?.focus();\n }\n setLeftDisabled(true);\n }\n\n const maxScrollWidth = containerRef.current?.scrollWidth ?? 0;\n const maxClientWidth = containerRef.current?.clientWidth ?? 0;\n const maxScrollLeft = maxScrollWidth - maxClientWidth;\n\n // -10 to prevent javascript assertion errors on floating points\n if (containerRef.current?.scrollLeft >= maxScrollLeft - 10) {\n if (document.getElementById('right-arrow') === document.activeElement) {\n document.getElementById('left-arrow')?.focus();\n }\n setRightDisabled(true);\n\n // Check if we've reached the end and should fetch more data\n // Only fetches more when not already loading more views and has more views to load\n if (hasMoreViews && onFetchMoreViews && !isLoadingMoreViews) {\n onFetchMoreViews();\n }\n } else {\n setRightDisabled(false);\n }\n }, [containerRef, onFetchMoreViews, isLoadingMoreViews, hasMoreViews]);\n\n const handleResize = useCallback(() => {\n if (!containerRef.current) return;\n if (containerRef.current.scrollWidth - containerRef.current.getBoundingClientRect().width < 5) {\n setRightDisabled(true);\n } else {\n setRightDisabled(false);\n }\n }, [containerRef]);\n\n const toNextScrollPosition = useCallback(() => {\n const newPosition = getNextViewPosition(\n viewStartPositions,\n containerRef.current.scrollLeft,\n containerRef.current.clientWidth,\n );\n\n containerRef.current.scrollTo({\n left: newPosition,\n top: 0,\n behavior: 'smooth',\n });\n }, [containerRef, viewStartPositions]);\n\n const toPrevScrollPosition = useCallback(() => {\n const newPosition = getPrevViewPosition(viewStartPositions, containerRef.current.scrollLeft);\n\n containerRef.current.scrollTo({\n left: newPosition,\n top: 0,\n behavior: 'smooth',\n });\n }, [containerRef, viewStartPositions]);\n\n // Initialize view positions when container first has children\n useEffect(() => {\n if (!containerRef?.current?.children?.length || viewStartPositions.length > 0) return;\n\n setViewStartPositions(createViewPositionArray(containerRef.current));\n }, [containerRef, viewStartPositions.length]);\n\n // Handle new item addition - scroll to end and update positions\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n\n const childrenCount = containerRef.current.children.length;\n const positionsCount = viewStartPositions.length;\n const totalChildren = Children.count(children);\n\n const shouldScrollToNewItem =\n childrenCount !== positionsCount && positionsCount > 0 && positionsCount < totalChildren;\n\n if (!shouldScrollToNewItem) return;\n\n containerRef.current.scrollTo({\n left: containerRef.current.scrollWidth - containerRef.current.clientWidth,\n top: 0,\n behavior: 'smooth',\n });\n\n // Compute the x position of the new item\n const lastChildRect =\n containerRef.current.children[positionsCount - 1]?.getBoundingClientRect();\n const newPosition = viewStartPositions[positionsCount - 1] + (lastChildRect?.x ?? 0) - 20;\n\n setViewStartPositions([...viewStartPositions, newPosition]);\n }, [containerRef, children, viewStartPositions]);\n\n // Handle active tab changes - scroll to active tab\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n if (activeTab === prevActiveTab || activeTab === null) return;\n if (containerRef.current.children.length !== viewStartPositions.length) return;\n\n const index = Array.from(containerRef.current.children).indexOf(activeTab);\n if (index === -1) return;\n\n containerRef.current.scrollTo({\n left: viewStartPositions[index],\n top: 0,\n behavior: 'smooth',\n });\n }, [activeTab, prevActiveTab, containerRef, viewStartPositions]);\n\n // Handle fetching more views - recompute positions\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n if (viewStartPositions.length >= containerRef.current.children.length) return;\n\n const currentScrollLeft = containerRef.current.scrollLeft;\n\n // Temporarily reset scroll to 0 to get accurate positions\n containerRef.current.scrollTo({ left: 0, top: 0, behavior: 'auto' });\n\n // Recompute positions from scroll position 0\n setViewStartPositions(createViewPositionArray(containerRef.current));\n\n // Restore the user's scroll position\n containerRef.current.scrollTo({ left: currentScrollLeft, top: 0, behavior: 'auto' });\n }, [containerRef, viewStartPositions.length]);\n\n // Handle window resize and scroll event listeners\n useEffect(() => {\n if (!containerRef?.current) return;\n\n const container = containerRef.current;\n\n handleResize();\n window.addEventListener('resize', handleResize);\n container.addEventListener('scroll', handleScroll);\n\n // eslint-disable-next-line consistent-return\n return () => {\n window.removeEventListener('resize', handleResize);\n container.removeEventListener('scroll', handleScroll);\n };\n }, [containerRef, handleResize, handleScroll]);\n\n return { rightDisabled, leftDisabled, toNextScrollPosition, toPrevScrollPosition };\n};\n"],"names":["useRef","useEffect","useState","useCallback","getNextViewPosition","getPrevViewPosition","createViewPositionArray","Children"],"mappings":"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"}
@@ -2,7 +2,7 @@ import { useState, useCallback, useEffect, Children, useRef } from 'react';
2
2
  import { getNextViewPosition, getPrevViewPosition, createViewPositionArray } from '../utils.js';
3
3
 
4
4
  function usePrevious(value) {
5
- const ref = useRef();
5
+ const ref = useRef(undefined);
6
6
  useEffect(() => {
7
7
  ref.current = value;
8
8
  });
@@ -1 +1 @@
1
- {"version":3,"file":"useSetScrollPosition.js","sources":["../../../../src/components/ViewsContainer/hooks/useSetScrollPosition.ts"],"sourcesContent":["import {\n MutableRefObject,\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n Children,\n} from 'react';\nimport { createViewPositionArray, getNextViewPosition, getPrevViewPosition } from '../utils';\n\nfunction usePrevious<T>(value: T): T | undefined {\n const ref = useRef<T>();\n useEffect(() => {\n ref.current = value;\n });\n return ref.current;\n}\n\ntype UseSetScrollPositionProps = {\n containerRef: MutableRefObject<HTMLDivElement>;\n children: ReactNode;\n hasMoreViews?: boolean;\n onFetchMoreViews?: () => void;\n isLoadingMoreViews?: boolean;\n};\n\nexport const useSetScrollPosition = ({\n containerRef,\n children,\n hasMoreViews = false,\n onFetchMoreViews,\n isLoadingMoreViews = false,\n}: UseSetScrollPositionProps) => {\n const [leftDisabled, setLeftDisabled] = useState(true);\n const [rightDisabled, setRightDisabled] = useState(false);\n const [viewStartPositions, setViewStartPositions] = useState<number[]>([]);\n\n const activeTab = containerRef?.current?.querySelector('[aria-selected = true]');\n const prevActiveTab = usePrevious(activeTab);\n\n const handleScroll = useCallback(() => {\n if (containerRef.current?.scrollLeft > 0) {\n setLeftDisabled(false);\n } else {\n if (document.getElementById('left-arrow') === document.activeElement) {\n document.getElementById('right-arrow')?.focus();\n }\n setLeftDisabled(true);\n }\n\n const maxScrollWidth = containerRef.current?.scrollWidth ?? 0;\n const maxClientWidth = containerRef.current?.clientWidth ?? 0;\n const maxScrollLeft = maxScrollWidth - maxClientWidth;\n\n // -10 to prevent javascript assertion errors on floating points\n if (containerRef.current?.scrollLeft >= maxScrollLeft - 10) {\n if (document.getElementById('right-arrow') === document.activeElement) {\n document.getElementById('left-arrow')?.focus();\n }\n setRightDisabled(true);\n\n // Check if we've reached the end and should fetch more data\n // Only fetches more when not already loading more views and has more views to load\n if (hasMoreViews && onFetchMoreViews && !isLoadingMoreViews) {\n onFetchMoreViews();\n }\n } else {\n setRightDisabled(false);\n }\n }, [containerRef, onFetchMoreViews, isLoadingMoreViews, hasMoreViews]);\n\n const handleResize = useCallback(() => {\n if (!containerRef.current) return;\n if (containerRef.current.scrollWidth - containerRef.current.getBoundingClientRect().width < 5) {\n setRightDisabled(true);\n } else {\n setRightDisabled(false);\n }\n }, [containerRef]);\n\n const toNextScrollPosition = useCallback(() => {\n const newPosition = getNextViewPosition(\n viewStartPositions,\n containerRef.current.scrollLeft,\n containerRef.current.clientWidth,\n );\n\n containerRef.current.scrollTo({\n left: newPosition,\n top: 0,\n behavior: 'smooth',\n });\n }, [containerRef, viewStartPositions]);\n\n const toPrevScrollPosition = useCallback(() => {\n const newPosition = getPrevViewPosition(viewStartPositions, containerRef.current.scrollLeft);\n\n containerRef.current.scrollTo({\n left: newPosition,\n top: 0,\n behavior: 'smooth',\n });\n }, [containerRef, viewStartPositions]);\n\n // Initialize view positions when container first has children\n useEffect(() => {\n if (!containerRef?.current?.children?.length || viewStartPositions.length > 0) return;\n\n setViewStartPositions(createViewPositionArray(containerRef.current));\n }, [containerRef, viewStartPositions.length]);\n\n // Handle new item addition - scroll to end and update positions\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n\n const childrenCount = containerRef.current.children.length;\n const positionsCount = viewStartPositions.length;\n const totalChildren = Children.count(children);\n\n const shouldScrollToNewItem =\n childrenCount !== positionsCount && positionsCount > 0 && positionsCount < totalChildren;\n\n if (!shouldScrollToNewItem) return;\n\n containerRef.current.scrollTo({\n left: containerRef.current.scrollWidth - containerRef.current.clientWidth,\n top: 0,\n behavior: 'smooth',\n });\n\n // Compute the x position of the new item\n const lastChildRect =\n containerRef.current.children[positionsCount - 1]?.getBoundingClientRect();\n const newPosition = viewStartPositions[positionsCount - 1] + (lastChildRect?.x ?? 0) - 20;\n\n setViewStartPositions([...viewStartPositions, newPosition]);\n }, [containerRef, children, viewStartPositions]);\n\n // Handle active tab changes - scroll to active tab\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n if (activeTab === prevActiveTab || activeTab === null) return;\n if (containerRef.current.children.length !== viewStartPositions.length) return;\n\n const index = Array.from(containerRef.current.children).indexOf(activeTab);\n if (index === -1) return;\n\n containerRef.current.scrollTo({\n left: viewStartPositions[index],\n top: 0,\n behavior: 'smooth',\n });\n }, [activeTab, prevActiveTab, containerRef, viewStartPositions]);\n\n // Handle fetching more views - recompute positions\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n if (viewStartPositions.length >= containerRef.current.children.length) return;\n\n const currentScrollLeft = containerRef.current.scrollLeft;\n\n // Temporarily reset scroll to 0 to get accurate positions\n containerRef.current.scrollTo({ left: 0, top: 0, behavior: 'auto' });\n\n // Recompute positions from scroll position 0\n setViewStartPositions(createViewPositionArray(containerRef.current));\n\n // Restore the user's scroll position\n containerRef.current.scrollTo({ left: currentScrollLeft, top: 0, behavior: 'auto' });\n }, [containerRef, viewStartPositions.length]);\n\n // Handle window resize and scroll event listeners\n useEffect(() => {\n if (!containerRef?.current) return;\n\n const container = containerRef.current;\n\n handleResize();\n window.addEventListener('resize', handleResize);\n container.addEventListener('scroll', handleScroll);\n\n // eslint-disable-next-line consistent-return\n return () => {\n window.removeEventListener('resize', handleResize);\n container.removeEventListener('scroll', handleScroll);\n };\n }, [containerRef, handleResize, handleScroll]);\n\n return { rightDisabled, leftDisabled, toNextScrollPosition, toPrevScrollPosition };\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"useSetScrollPosition.js","sources":["../../../../src/components/ViewsContainer/hooks/useSetScrollPosition.ts"],"sourcesContent":["import {\n MutableRefObject,\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n Children,\n} from 'react';\nimport { createViewPositionArray, getNextViewPosition, getPrevViewPosition } from '../utils';\n\nfunction usePrevious<T>(value: T): T | undefined {\n const ref = useRef<T | undefined>(undefined);\n useEffect(() => {\n ref.current = value;\n });\n return ref.current;\n}\n\ntype UseSetScrollPositionProps = {\n containerRef: MutableRefObject<HTMLDivElement>;\n children: ReactNode;\n hasMoreViews?: boolean;\n onFetchMoreViews?: () => void;\n isLoadingMoreViews?: boolean;\n};\n\nexport const useSetScrollPosition = ({\n containerRef,\n children,\n hasMoreViews = false,\n onFetchMoreViews,\n isLoadingMoreViews = false,\n}: UseSetScrollPositionProps) => {\n const [leftDisabled, setLeftDisabled] = useState(true);\n const [rightDisabled, setRightDisabled] = useState(false);\n const [viewStartPositions, setViewStartPositions] = useState<number[]>([]);\n\n const activeTab = containerRef?.current?.querySelector('[aria-selected = true]');\n const prevActiveTab = usePrevious(activeTab);\n\n const handleScroll = useCallback(() => {\n if (containerRef.current?.scrollLeft > 0) {\n setLeftDisabled(false);\n } else {\n if (document.getElementById('left-arrow') === document.activeElement) {\n document.getElementById('right-arrow')?.focus();\n }\n setLeftDisabled(true);\n }\n\n const maxScrollWidth = containerRef.current?.scrollWidth ?? 0;\n const maxClientWidth = containerRef.current?.clientWidth ?? 0;\n const maxScrollLeft = maxScrollWidth - maxClientWidth;\n\n // -10 to prevent javascript assertion errors on floating points\n if (containerRef.current?.scrollLeft >= maxScrollLeft - 10) {\n if (document.getElementById('right-arrow') === document.activeElement) {\n document.getElementById('left-arrow')?.focus();\n }\n setRightDisabled(true);\n\n // Check if we've reached the end and should fetch more data\n // Only fetches more when not already loading more views and has more views to load\n if (hasMoreViews && onFetchMoreViews && !isLoadingMoreViews) {\n onFetchMoreViews();\n }\n } else {\n setRightDisabled(false);\n }\n }, [containerRef, onFetchMoreViews, isLoadingMoreViews, hasMoreViews]);\n\n const handleResize = useCallback(() => {\n if (!containerRef.current) return;\n if (containerRef.current.scrollWidth - containerRef.current.getBoundingClientRect().width < 5) {\n setRightDisabled(true);\n } else {\n setRightDisabled(false);\n }\n }, [containerRef]);\n\n const toNextScrollPosition = useCallback(() => {\n const newPosition = getNextViewPosition(\n viewStartPositions,\n containerRef.current.scrollLeft,\n containerRef.current.clientWidth,\n );\n\n containerRef.current.scrollTo({\n left: newPosition,\n top: 0,\n behavior: 'smooth',\n });\n }, [containerRef, viewStartPositions]);\n\n const toPrevScrollPosition = useCallback(() => {\n const newPosition = getPrevViewPosition(viewStartPositions, containerRef.current.scrollLeft);\n\n containerRef.current.scrollTo({\n left: newPosition,\n top: 0,\n behavior: 'smooth',\n });\n }, [containerRef, viewStartPositions]);\n\n // Initialize view positions when container first has children\n useEffect(() => {\n if (!containerRef?.current?.children?.length || viewStartPositions.length > 0) return;\n\n setViewStartPositions(createViewPositionArray(containerRef.current));\n }, [containerRef, viewStartPositions.length]);\n\n // Handle new item addition - scroll to end and update positions\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n\n const childrenCount = containerRef.current.children.length;\n const positionsCount = viewStartPositions.length;\n const totalChildren = Children.count(children);\n\n const shouldScrollToNewItem =\n childrenCount !== positionsCount && positionsCount > 0 && positionsCount < totalChildren;\n\n if (!shouldScrollToNewItem) return;\n\n containerRef.current.scrollTo({\n left: containerRef.current.scrollWidth - containerRef.current.clientWidth,\n top: 0,\n behavior: 'smooth',\n });\n\n // Compute the x position of the new item\n const lastChildRect =\n containerRef.current.children[positionsCount - 1]?.getBoundingClientRect();\n const newPosition = viewStartPositions[positionsCount - 1] + (lastChildRect?.x ?? 0) - 20;\n\n setViewStartPositions([...viewStartPositions, newPosition]);\n }, [containerRef, children, viewStartPositions]);\n\n // Handle active tab changes - scroll to active tab\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n if (activeTab === prevActiveTab || activeTab === null) return;\n if (containerRef.current.children.length !== viewStartPositions.length) return;\n\n const index = Array.from(containerRef.current.children).indexOf(activeTab);\n if (index === -1) return;\n\n containerRef.current.scrollTo({\n left: viewStartPositions[index],\n top: 0,\n behavior: 'smooth',\n });\n }, [activeTab, prevActiveTab, containerRef, viewStartPositions]);\n\n // Handle fetching more views - recompute positions\n useEffect(() => {\n if (!containerRef?.current?.children?.length) return;\n if (viewStartPositions.length >= containerRef.current.children.length) return;\n\n const currentScrollLeft = containerRef.current.scrollLeft;\n\n // Temporarily reset scroll to 0 to get accurate positions\n containerRef.current.scrollTo({ left: 0, top: 0, behavior: 'auto' });\n\n // Recompute positions from scroll position 0\n setViewStartPositions(createViewPositionArray(containerRef.current));\n\n // Restore the user's scroll position\n containerRef.current.scrollTo({ left: currentScrollLeft, top: 0, behavior: 'auto' });\n }, [containerRef, viewStartPositions.length]);\n\n // Handle window resize and scroll event listeners\n useEffect(() => {\n if (!containerRef?.current) return;\n\n const container = containerRef.current;\n\n handleResize();\n window.addEventListener('resize', handleResize);\n container.addEventListener('scroll', handleScroll);\n\n // eslint-disable-next-line consistent-return\n return () => {\n window.removeEventListener('resize', handleResize);\n container.removeEventListener('scroll', handleScroll);\n };\n }, [containerRef, handleResize, handleScroll]);\n\n return { rightDisabled, leftDisabled, toNextScrollPosition, toPrevScrollPosition };\n};\n"],"names":[],"mappings":"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"}
@@ -63,9 +63,6 @@ const WeightInput = withLabels.withLabels((props) => {
63
63
  return null;
64
64
  });
65
65
  WeightInput.displayName = 'WeightInput';
66
- WeightInput.defaultProps = {
67
- weightUnit: 'lb',
68
- };
69
66
 
70
67
  exports.WeightInput = WeightInput;
71
68
  //# sourceMappingURL=WeightInput.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"WeightInput.cjs","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n stack: Partial<StackProps>;\n inputGroup: Partial<InputGroupProps>;\n textField: Partial<TextFieldProps>;\n inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n const { size = 'base', hasError, disabled, className } = props;\n\n const compact = size === 'sm';\n\n const childProps: ChildComponentProps = {\n stack: {\n direction: 'horizontal',\n alignY: 'center',\n spacing: 'base',\n },\n inputGroup: {\n style: flexStyle,\n },\n textField: {\n type: 'number',\n placeholder: '0',\n min: '0',\n step: 'any',\n size,\n disabled,\n hasError,\n onKeyDown: blockInvalidChars,\n style: flexStyle,\n },\n inputAffix: {\n compact,\n },\n };\n\n // If the weight is metric, render grams\n if (isWeightMetric(props)) {\n return (\n <InputGroup {...childProps.inputGroup} className={className}>\n <TextField\n {...childProps.textField}\n name=\"gram\"\n value={props.gram}\n aria-label=\"Grams\"\n onChange={props.handleChangeGram}\n />\n <InputAffix {...childProps.inputAffix}>g</InputAffix>\n </InputGroup>\n );\n }\n\n // If the weight is imperial, render pounds and ounces\n if (isWeightImperial(props)) {\n return (\n <Stack {...childProps.stack} className={className}>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"pound\"\n value={props.pound}\n aria-label=\"Pounds\"\n onChange={props.handleChangePound}\n />\n <InputAffix {...childProps.inputAffix}>lb</InputAffix>\n </InputGroup>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"ounce\"\n value={props.ounce}\n aria-label=\"Ounces\"\n onChange={props.handleChangeOunce}\n />\n <InputAffix {...childProps.inputAffix}>oz</InputAffix>\n </InputGroup>\n </Stack>\n );\n }\n\n // If neither metric nor imperial, return null or handle as needed\n return null;\n});\n\nWeightInput.displayName = 'WeightInput';\n\nWeightInput.defaultProps = {\n weightUnit: 'lb',\n};\n"],"names":["blockInvalidCharacters","invalidCharsList","withLabels","isWeightMetric","React","InputGroup","TextField","InputAffix","isWeightImperial","Stack"],"mappings":"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"}
1
+ {"version":3,"file":"WeightInput.cjs","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n stack: Partial<StackProps>;\n inputGroup: Partial<InputGroupProps>;\n textField: Partial<TextFieldProps>;\n inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n const { size = 'base', hasError, disabled, className } = props;\n\n const compact = size === 'sm';\n\n const childProps: ChildComponentProps = {\n stack: {\n direction: 'horizontal',\n alignY: 'center',\n spacing: 'base',\n },\n inputGroup: {\n style: flexStyle,\n },\n textField: {\n type: 'number',\n placeholder: '0',\n min: '0',\n step: 'any',\n size,\n disabled,\n hasError,\n onKeyDown: blockInvalidChars,\n style: flexStyle,\n },\n inputAffix: {\n compact,\n },\n };\n\n // If the weight is metric, render grams\n if (isWeightMetric(props)) {\n return (\n <InputGroup {...childProps.inputGroup} className={className}>\n <TextField\n {...childProps.textField}\n name=\"gram\"\n value={props.gram}\n aria-label=\"Grams\"\n onChange={props.handleChangeGram}\n />\n <InputAffix {...childProps.inputAffix}>g</InputAffix>\n </InputGroup>\n );\n }\n\n // If the weight is imperial, render pounds and ounces\n if (isWeightImperial(props)) {\n return (\n <Stack {...childProps.stack} className={className}>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"pound\"\n value={props.pound}\n aria-label=\"Pounds\"\n onChange={props.handleChangePound}\n />\n <InputAffix {...childProps.inputAffix}>lb</InputAffix>\n </InputGroup>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"ounce\"\n value={props.ounce}\n aria-label=\"Ounces\"\n onChange={props.handleChangeOunce}\n />\n <InputAffix {...childProps.inputAffix}>oz</InputAffix>\n </InputGroup>\n </Stack>\n );\n }\n\n // If neither metric nor imperial, return null or handle as needed\n return null;\n});\n\nWeightInput.displayName = 'WeightInput';\n"],"names":["blockInvalidCharacters","invalidCharsList","withLabels","isWeightMetric","React","InputGroup","TextField","InputAffix","isWeightImperial","Stack"],"mappings":"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"}
@@ -57,9 +57,6 @@ const WeightInput = withLabels((props) => {
57
57
  return null;
58
58
  });
59
59
  WeightInput.displayName = 'WeightInput';
60
- WeightInput.defaultProps = {
61
- weightUnit: 'lb',
62
- };
63
60
 
64
61
  export { WeightInput };
65
62
  //# sourceMappingURL=WeightInput.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"WeightInput.js","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n stack: Partial<StackProps>;\n inputGroup: Partial<InputGroupProps>;\n textField: Partial<TextFieldProps>;\n inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n const { size = 'base', hasError, disabled, className } = props;\n\n const compact = size === 'sm';\n\n const childProps: ChildComponentProps = {\n stack: {\n direction: 'horizontal',\n alignY: 'center',\n spacing: 'base',\n },\n inputGroup: {\n style: flexStyle,\n },\n textField: {\n type: 'number',\n placeholder: '0',\n min: '0',\n step: 'any',\n size,\n disabled,\n hasError,\n onKeyDown: blockInvalidChars,\n style: flexStyle,\n },\n inputAffix: {\n compact,\n },\n };\n\n // If the weight is metric, render grams\n if (isWeightMetric(props)) {\n return (\n <InputGroup {...childProps.inputGroup} className={className}>\n <TextField\n {...childProps.textField}\n name=\"gram\"\n value={props.gram}\n aria-label=\"Grams\"\n onChange={props.handleChangeGram}\n />\n <InputAffix {...childProps.inputAffix}>g</InputAffix>\n </InputGroup>\n );\n }\n\n // If the weight is imperial, render pounds and ounces\n if (isWeightImperial(props)) {\n return (\n <Stack {...childProps.stack} className={className}>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"pound\"\n value={props.pound}\n aria-label=\"Pounds\"\n onChange={props.handleChangePound}\n />\n <InputAffix {...childProps.inputAffix}>lb</InputAffix>\n </InputGroup>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"ounce\"\n value={props.ounce}\n aria-label=\"Ounces\"\n onChange={props.handleChangeOunce}\n />\n <InputAffix {...childProps.inputAffix}>oz</InputAffix>\n </InputGroup>\n </Stack>\n );\n }\n\n // If neither metric nor imperial, return null or handle as needed\n return null;\n});\n\nWeightInput.displayName = 'WeightInput';\n\nWeightInput.defaultProps = {\n weightUnit: 'lb',\n};\n"],"names":["React"],"mappings":"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"}
1
+ {"version":3,"file":"WeightInput.js","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n stack: Partial<StackProps>;\n inputGroup: Partial<InputGroupProps>;\n textField: Partial<TextFieldProps>;\n inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n const { size = 'base', hasError, disabled, className } = props;\n\n const compact = size === 'sm';\n\n const childProps: ChildComponentProps = {\n stack: {\n direction: 'horizontal',\n alignY: 'center',\n spacing: 'base',\n },\n inputGroup: {\n style: flexStyle,\n },\n textField: {\n type: 'number',\n placeholder: '0',\n min: '0',\n step: 'any',\n size,\n disabled,\n hasError,\n onKeyDown: blockInvalidChars,\n style: flexStyle,\n },\n inputAffix: {\n compact,\n },\n };\n\n // If the weight is metric, render grams\n if (isWeightMetric(props)) {\n return (\n <InputGroup {...childProps.inputGroup} className={className}>\n <TextField\n {...childProps.textField}\n name=\"gram\"\n value={props.gram}\n aria-label=\"Grams\"\n onChange={props.handleChangeGram}\n />\n <InputAffix {...childProps.inputAffix}>g</InputAffix>\n </InputGroup>\n );\n }\n\n // If the weight is imperial, render pounds and ounces\n if (isWeightImperial(props)) {\n return (\n <Stack {...childProps.stack} className={className}>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"pound\"\n value={props.pound}\n aria-label=\"Pounds\"\n onChange={props.handleChangePound}\n />\n <InputAffix {...childProps.inputAffix}>lb</InputAffix>\n </InputGroup>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"ounce\"\n value={props.ounce}\n aria-label=\"Ounces\"\n onChange={props.handleChangeOunce}\n />\n <InputAffix {...childProps.inputAffix}>oz</InputAffix>\n </InputGroup>\n </Stack>\n );\n }\n\n // If neither metric nor imperial, return null or handle as needed\n return null;\n});\n\nWeightInput.displayName = 'WeightInput';\n"],"names":["React"],"mappings":";;;;;;;;;;AAoBA,MAAM,SAAS,GAAG,EAAE,IAAI,EAAE,CAAC,EAAE;AAE7B,MAAM,iBAAiB,GAAG,CAAC,CAAsB,KAAK,sBAAsB,CAAC,CAAC,EAAE,gBAAgB,CAAC;MAEpF,WAAW,GAAG,UAAU,CAAc,CAAC,KAAK,KAAI;AAC3D,IAAA,MAAM,EAAE,IAAI,GAAG,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK;AAE9D,IAAA,MAAM,OAAO,GAAG,IAAI,KAAK,IAAI;AAE7B,IAAA,MAAM,UAAU,GAAwB;AACtC,QAAA,KAAK,EAAE;AACL,YAAA,SAAS,EAAE,YAAY;AACvB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,OAAO,EAAE,MAAM;AAChB,SAAA;AACD,QAAA,UAAU,EAAE;AACV,YAAA,KAAK,EAAE,SAAS;AACjB,SAAA;AACD,QAAA,SAAS,EAAE;AACT,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,WAAW,EAAE,GAAG;AAChB,YAAA,GAAG,EAAE,GAAG;AACR,YAAA,IAAI,EAAE,KAAK;YACX,IAAI;YACJ,QAAQ;YACR,QAAQ;AACR,YAAA,SAAS,EAAE,iBAAiB;AAC5B,YAAA,KAAK,EAAE,SAAS;AACjB,SAAA;AACD,QAAA,UAAU,EAAE;YACV,OAAO;AACR,SAAA;KACF;;AAGD,IAAA,IAAI,cAAc,CAAC,KAAK,CAAC,EAAE;QACzB,QACEA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAA,GAAK,UAAU,CAAC,UAAU,EAAE,SAAS,EAAE,SAAS,EAAA;YACzDA,cAAA,CAAA,aAAA,CAAC,SAAS,OACJ,UAAU,CAAC,SAAS,EACxB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,KAAK,CAAC,IAAI,EAAA,YAAA,EACN,OAAO,EAClB,QAAQ,EAAE,KAAK,CAAC,gBAAgB,EAAA,CAChC;YACFA,cAAA,CAAA,aAAA,CAAC,UAAU,OAAK,UAAU,CAAC,UAAU,EAAA,EAAA,GAAA,CAAgB,CAC1C;AAEhB,IAAA;;AAGD,IAAA,IAAI,gBAAgB,CAAC,KAAK,CAAC,EAAE;QAC3B,QACEA,cAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EAAA,GAAK,UAAU,CAAC,KAAK,EAAE,SAAS,EAAE,SAAS,EAAA;AAC/C,YAAAA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAA,GAAK,UAAU,CAAC,UAAU,EAAA;gBACnCA,cAAA,CAAA,aAAA,CAAC,SAAS,OACJ,UAAU,CAAC,SAAS,EACxB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,KAAK,CAAC,KAAK,EAAA,YAAA,EACP,QAAQ,EACnB,QAAQ,EAAE,KAAK,CAAC,iBAAiB,EAAA,CACjC;AACF,gBAAAA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAA,GAAK,UAAU,CAAC,UAAU,SAAiB,CAC3C;AACb,YAAAA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAA,GAAK,UAAU,CAAC,UAAU,EAAA;gBACnCA,cAAA,CAAA,aAAA,CAAC,SAAS,OACJ,UAAU,CAAC,SAAS,EACxB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,KAAK,CAAC,KAAK,EAAA,YAAA,EACP,QAAQ,EACnB,QAAQ,EAAE,KAAK,CAAC,iBAAiB,EAAA,CACjC;gBACFA,cAAA,CAAA,aAAA,CAAC,UAAU,OAAK,UAAU,CAAC,UAAU,EAAA,EAAA,IAAA,CAAiB,CAC3C,CACP;AAEX,IAAA;;AAGD,IAAA,OAAO,IAAI;AACb,CAAC;AAED,WAAW,CAAC,WAAW,GAAG,aAAa;;;;"}
@@ -1,9 +1,8 @@
1
1
  export { Accordion } from './Accordion';
2
2
  export { Action, type ActionProps, type ActionVariant } from './Action';
3
3
  export { ActionMenu } from './ActionMenu';
4
- export { Alert, type AlertProps, type AlertSizes, type AlertDirection } from './Alerts/Alert';
5
- export { MiniAlert, type MiniAlertProps } from './Alerts/MiniAlert';
6
- export type { AlertVariants, MiniAlertVariants } from './Alerts/types';
4
+ export { Alert } from './Alerts/Alert';
5
+ export { MiniAlert } from './Alerts/MiniAlert';
7
6
  export { Anchor, isAnchorUrl, isRelativeUrl, createContextAwareUrl, addPrefixToUrl, shouldAddPrefix, } from './Anchor';
8
7
  export { AnimatedDropdown } from './AnimatedDropdown';
9
8
  export { Avatar } from './Avatar';
@@ -1 +1 @@
1
- {"version":3,"file":"withTokens.cjs","sources":["../../../src/hoc/withTokens/withTokens.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ElementRef } from 'react';\nimport { ThemeType } from '../../components/TokenProvider/TokenProvider';\nimport { TokenProvider } from '../../components/TokenProvider';\n\nexport type WithTokensProps = {\n theme?: ThemeType;\n};\n\n/**\n * HOC that adds an optional `theme` prop to a component.\n * When a theme is provided (via prop or `defaultTheme`), wraps the component\n * in a `TokenProvider`. Otherwise renders the component directly, allowing it\n * to inherit tokens from a parent `TokenProvider`. Forwards refs to the wrapped component.\n *\n * @param Component - The component to wrap\n * @param defaultTheme - Optional default theme applied when no `theme` prop is passed\n */\nexport const withTokens = <C extends ComponentType<any>>(\n Component: C,\n defaultTheme?: ThemeType,\n) => {\n type P = React.ComponentPropsWithoutRef<C>;\n type R = ElementRef<C>;\n\n const ComponentWithTokens = forwardRef<R, P & WithTokensProps>(\n ({ theme = defaultTheme, ...props }, ref) => {\n const Comp = Component as ComponentType<any>;\n\n if (theme) {\n return (\n <TokenProvider theme={theme}>\n <Comp ref={ref} {...props} />\n </TokenProvider>\n );\n }\n\n return <Comp ref={ref} {...props} />;\n },\n );\n\n ComponentWithTokens.displayName = `withTokens(${Component.displayName || Component.name || 'Component'})`;\n\n return ComponentWithTokens;\n};\n"],"names":["forwardRef","React","TokenProvider"],"mappings":";;;;;;;;;AAQA;;;;;;;;AAQG;MACU,UAAU,GAAG,CACxB,SAAY,EACZ,YAAwB,KACtB;AAIF,IAAA,MAAM,mBAAmB,GAAGA,gBAAU,CACpC,CAAC,EAAE,KAAK,GAAG,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;QAC1C,MAAM,IAAI,GAAG,SAA+B;AAE5C,QAAA,IAAI,KAAK,EAAE;AACT,YAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,2BAAa,EAAA,EAAC,KAAK,EAAE,KAAK,EAAA;gBACzBD,sBAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,KAAM,KAAK,EAAA,CAAI,CACf;AAEnB,QAAA;QAED,OAAOA,sBAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA,GAAM,KAAK,EAAA,CAAI;AACtC,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}
1
+ {"version":3,"file":"withTokens.cjs","sources":["../../../src/hoc/withTokens/withTokens.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ElementRef } from 'react';\nimport { ThemeType } from '../../components/TokenProvider/TokenProvider';\nimport { TokenProvider } from '../../components/TokenProvider';\n\nexport type WithTokensProps = {\n theme?: ThemeType;\n};\n\n/**\n * HOC that adds an optional `theme` prop to a component.\n * When a theme is provided (via prop or `defaultTheme`), wraps the component\n * in a `TokenProvider`. Otherwise renders the component directly, allowing it\n * to inherit tokens from a parent `TokenProvider`. Forwards refs to the wrapped component.\n *\n * @param Component - The component to wrap\n * @param defaultTheme - Optional default theme applied when no `theme` prop is passed\n */\nexport const withTokens = <C extends ComponentType<any>>(\n Component: C,\n defaultTheme?: ThemeType,\n) => {\n type P = React.ComponentPropsWithoutRef<C>;\n // @ts-expect-error ElementRef<C> constraint fails with React 19 types but emits correct declarations for consumers\n type R = ElementRef<C>;\n\n const ComponentWithTokens = forwardRef<R, P & WithTokensProps>(\n ({ theme = defaultTheme, ...props }, ref) => {\n const Comp = Component as ComponentType<any>;\n\n if (theme) {\n return (\n <TokenProvider theme={theme}>\n <Comp ref={ref} {...props} />\n </TokenProvider>\n );\n }\n\n return <Comp ref={ref} {...props} />;\n },\n );\n\n ComponentWithTokens.displayName = `withTokens(${Component.displayName || Component.name || 'Component'})`;\n\n return ComponentWithTokens;\n};\n"],"names":["forwardRef","React","TokenProvider"],"mappings":";;;;;;;;;AAQA;;;;;;;;AAQG;MACU,UAAU,GAAG,CACxB,SAAY,EACZ,YAAwB,KACtB;AAKF,IAAA,MAAM,mBAAmB,GAAGA,gBAAU,CACpC,CAAC,EAAE,KAAK,GAAG,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;QAC1C,MAAM,IAAI,GAAG,SAA+B;AAE5C,QAAA,IAAI,KAAK,EAAE;AACT,YAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,2BAAa,EAAA,EAAC,KAAK,EAAE,KAAK,EAAA;gBACzBD,sBAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,KAAM,KAAK,EAAA,CAAI,CACf;AAEnB,QAAA;QAED,OAAOA,sBAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA,GAAM,KAAK,EAAA,CAAI;AACtC,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"withTokens.js","sources":["../../../src/hoc/withTokens/withTokens.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ElementRef } from 'react';\nimport { ThemeType } from '../../components/TokenProvider/TokenProvider';\nimport { TokenProvider } from '../../components/TokenProvider';\n\nexport type WithTokensProps = {\n theme?: ThemeType;\n};\n\n/**\n * HOC that adds an optional `theme` prop to a component.\n * When a theme is provided (via prop or `defaultTheme`), wraps the component\n * in a `TokenProvider`. Otherwise renders the component directly, allowing it\n * to inherit tokens from a parent `TokenProvider`. Forwards refs to the wrapped component.\n *\n * @param Component - The component to wrap\n * @param defaultTheme - Optional default theme applied when no `theme` prop is passed\n */\nexport const withTokens = <C extends ComponentType<any>>(\n Component: C,\n defaultTheme?: ThemeType,\n) => {\n type P = React.ComponentPropsWithoutRef<C>;\n type R = ElementRef<C>;\n\n const ComponentWithTokens = forwardRef<R, P & WithTokensProps>(\n ({ theme = defaultTheme, ...props }, ref) => {\n const Comp = Component as ComponentType<any>;\n\n if (theme) {\n return (\n <TokenProvider theme={theme}>\n <Comp ref={ref} {...props} />\n </TokenProvider>\n );\n }\n\n return <Comp ref={ref} {...props} />;\n },\n );\n\n ComponentWithTokens.displayName = `withTokens(${Component.displayName || Component.name || 'Component'})`;\n\n return ComponentWithTokens;\n};\n"],"names":["React"],"mappings":";;;AAQA;;;;;;;;AAQG;MACU,UAAU,GAAG,CACxB,SAAY,EACZ,YAAwB,KACtB;AAIF,IAAA,MAAM,mBAAmB,GAAG,UAAU,CACpC,CAAC,EAAE,KAAK,GAAG,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;QAC1C,MAAM,IAAI,GAAG,SAA+B;AAE5C,QAAA,IAAI,KAAK,EAAE;AACT,YAAA,QACEA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EAAC,KAAK,EAAE,KAAK,EAAA;gBACzBA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,KAAM,KAAK,EAAA,CAAI,CACf;AAEnB,QAAA;QAED,OAAOA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA,GAAM,KAAK,EAAA,CAAI;AACtC,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}
1
+ {"version":3,"file":"withTokens.js","sources":["../../../src/hoc/withTokens/withTokens.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ElementRef } from 'react';\nimport { ThemeType } from '../../components/TokenProvider/TokenProvider';\nimport { TokenProvider } from '../../components/TokenProvider';\n\nexport type WithTokensProps = {\n theme?: ThemeType;\n};\n\n/**\n * HOC that adds an optional `theme` prop to a component.\n * When a theme is provided (via prop or `defaultTheme`), wraps the component\n * in a `TokenProvider`. Otherwise renders the component directly, allowing it\n * to inherit tokens from a parent `TokenProvider`. Forwards refs to the wrapped component.\n *\n * @param Component - The component to wrap\n * @param defaultTheme - Optional default theme applied when no `theme` prop is passed\n */\nexport const withTokens = <C extends ComponentType<any>>(\n Component: C,\n defaultTheme?: ThemeType,\n) => {\n type P = React.ComponentPropsWithoutRef<C>;\n // @ts-expect-error ElementRef<C> constraint fails with React 19 types but emits correct declarations for consumers\n type R = ElementRef<C>;\n\n const ComponentWithTokens = forwardRef<R, P & WithTokensProps>(\n ({ theme = defaultTheme, ...props }, ref) => {\n const Comp = Component as ComponentType<any>;\n\n if (theme) {\n return (\n <TokenProvider theme={theme}>\n <Comp ref={ref} {...props} />\n </TokenProvider>\n );\n }\n\n return <Comp ref={ref} {...props} />;\n },\n );\n\n ComponentWithTokens.displayName = `withTokens(${Component.displayName || Component.name || 'Component'})`;\n\n return ComponentWithTokens;\n};\n"],"names":["React"],"mappings":";;;AAQA;;;;;;;;AAQG;MACU,UAAU,GAAG,CACxB,SAAY,EACZ,YAAwB,KACtB;AAKF,IAAA,MAAM,mBAAmB,GAAG,UAAU,CACpC,CAAC,EAAE,KAAK,GAAG,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;QAC1C,MAAM,IAAI,GAAG,SAA+B;AAE5C,QAAA,IAAI,KAAK,EAAE;AACT,YAAA,QACEA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EAAC,KAAK,EAAE,KAAK,EAAA;gBACzBA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,KAAM,KAAK,EAAA,CAAI,CACf;AAEnB,QAAA;QAED,OAAOA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA,GAAM,KAAK,EAAA,CAAI;AACtC,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}
@@ -2,4 +2,4 @@
2
2
  /**
3
3
  * Close a menu or modal by clicking out of it
4
4
  */
5
- export declare const useClickOutside: (isOpen: boolean, onClose: () => void) => import("react").MutableRefObject<null>;
5
+ export declare const useClickOutside: (isOpen: boolean, onClose: () => void) => import("react").RefObject<null>;
@@ -1 +1 @@
1
- {"version":3,"file":"useDragToScroll.cjs","sources":["../../src/hooks/useDragToScroll.ts"],"sourcesContent":["import { useEffect, RefObject } from 'react';\n\ntype UseDragToScrollProps = {\n targetRef: RefObject<HTMLElement>;\n ignoreClassName?: string;\n};\n\n/**\n * Hook which allows the user to scroll horizontally by dragging on a given target element.\n * @param targetRef - The ref of the element to scroll.\n * @param ignoreClassName - The className of any elements which should be excluded from the dragging behaviour.\n */\nexport function useDragToScroll({ targetRef, ignoreClassName }: UseDragToScrollProps) {\n useEffect(() => {\n if (!targetRef.current) return;\n\n let isDragging = false;\n const scrollTarget = targetRef.current;\n const position = {\n left: 0,\n x: 0,\n };\n\n const mouseMoveHandler = (e: MouseEvent) => {\n if (!scrollTarget) return;\n const dx = e.clientX - position.x;\n scrollTarget.scrollLeft = position.left - dx;\n if (!isDragging) {\n scrollTarget.style.cursor = 'grabbing';\n scrollTarget.style.userSelect = 'none';\n }\n isDragging = true;\n };\n\n const mouseUpHandler = () => {\n document.removeEventListener('mousemove', mouseMoveHandler);\n document.removeEventListener('mouseup', mouseUpHandler);\n isDragging = false;\n if (!scrollTarget) return;\n scrollTarget.style.removeProperty('cursor');\n scrollTarget.style.removeProperty('user-select');\n };\n\n const mouseDownHandler = (e: MouseEvent) => {\n if (!scrollTarget) return;\n /** NOTE: prevents table scroll when resizing columns,\n * unable to use event.stopPropogation as event is a react Synthetic event which treats the event as the same, as they are on the same node, is discussed here\n * https://dev.to/dvnrsn/why-isn-t-event-stoppropagation-working-1bnm.\n */\n if (\n ignoreClassName &&\n e.target instanceof HTMLElement &&\n e.target?.classList?.contains?.(ignoreClassName)\n ) {\n return;\n }\n\n position.left = scrollTarget.scrollLeft;\n position.x = e.clientX;\n document.addEventListener('mousemove', mouseMoveHandler);\n document.addEventListener('mouseup', mouseUpHandler);\n };\n\n scrollTarget.addEventListener('mousedown', mouseDownHandler);\n\n /* eslint-disable-next-line consistent-return */\n return () => scrollTarget?.removeEventListener('mousedown', mouseDownHandler);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [targetRef.current]);\n}\n"],"names":["useEffect"],"mappings":";;;;AAOA;;;;AAIG;SACa,eAAe,CAAC,EAAE,SAAS,EAAE,eAAe,EAAwB,EAAA;IAClFA,eAAS,CAAC,MAAK;QACb,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE;QAExB,IAAI,UAAU,GAAG,KAAK;AACtB,QAAA,MAAM,YAAY,GAAG,SAAS,CAAC,OAAO;AACtC,QAAA,MAAM,QAAQ,GAAG;AACf,YAAA,IAAI,EAAE,CAAC;AACP,YAAA,CAAC,EAAE,CAAC;SACL;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;YACnB,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC;YACjC,YAAY,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,GAAG,EAAE;YAC5C,IAAI,CAAC,UAAU,EAAE;AACf,gBAAA,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU;AACtC,gBAAA,YAAY,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM;AACvC,YAAA;YACD,UAAU,GAAG,IAAI;AACnB,QAAA,CAAC;QAED,MAAM,cAAc,GAAG,MAAK;AAC1B,YAAA,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AAC3D,YAAA,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,cAAc,CAAC;YACvD,UAAU,GAAG,KAAK;AAClB,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC;AAC3C,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;AAClD,QAAA,CAAC;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB;;;AAGG;AACH,YAAA,IACE,eAAe;gBACf,CAAC,CAAC,MAAM,YAAY,WAAW;AAC/B,iBAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAC,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,EAAA,EAAG,eAAe,CAAC,CAAA,EAChD;gBACA;AACD,YAAA;AAED,YAAA,QAAQ,CAAC,IAAI,GAAG,YAAY,CAAC,UAAU;AACvC,YAAA,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO;AACtB,YAAA,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AACxD,YAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC;AACtD,QAAA,CAAC;AAED,QAAA,YAAY,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAG5D,QAAA,OAAO,MAAM,YAAY,aAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAE/E,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;AACzB;;;;"}
1
+ {"version":3,"file":"useDragToScroll.cjs","sources":["../../src/hooks/useDragToScroll.ts"],"sourcesContent":["import { useEffect, RefObject } from 'react';\n\ntype UseDragToScrollProps = {\n targetRef: RefObject<HTMLElement | null>;\n ignoreClassName?: string;\n};\n\n/**\n * Hook which allows the user to scroll horizontally by dragging on a given target element.\n * @param targetRef - The ref of the element to scroll.\n * @param ignoreClassName - The className of any elements which should be excluded from the dragging behaviour.\n */\nexport function useDragToScroll({ targetRef, ignoreClassName }: UseDragToScrollProps) {\n useEffect(() => {\n if (!targetRef.current) return;\n\n let isDragging = false;\n const scrollTarget = targetRef.current;\n const position = {\n left: 0,\n x: 0,\n };\n\n const mouseMoveHandler = (e: MouseEvent) => {\n if (!scrollTarget) return;\n const dx = e.clientX - position.x;\n scrollTarget.scrollLeft = position.left - dx;\n if (!isDragging) {\n scrollTarget.style.cursor = 'grabbing';\n scrollTarget.style.userSelect = 'none';\n }\n isDragging = true;\n };\n\n const mouseUpHandler = () => {\n document.removeEventListener('mousemove', mouseMoveHandler);\n document.removeEventListener('mouseup', mouseUpHandler);\n isDragging = false;\n if (!scrollTarget) return;\n scrollTarget.style.removeProperty('cursor');\n scrollTarget.style.removeProperty('user-select');\n };\n\n const mouseDownHandler = (e: MouseEvent) => {\n if (!scrollTarget) return;\n /** NOTE: prevents table scroll when resizing columns,\n * unable to use event.stopPropogation as event is a react Synthetic event which treats the event as the same, as they are on the same node, is discussed here\n * https://dev.to/dvnrsn/why-isn-t-event-stoppropagation-working-1bnm.\n */\n if (\n ignoreClassName &&\n e.target instanceof HTMLElement &&\n e.target?.classList?.contains?.(ignoreClassName)\n ) {\n return;\n }\n\n position.left = scrollTarget.scrollLeft;\n position.x = e.clientX;\n document.addEventListener('mousemove', mouseMoveHandler);\n document.addEventListener('mouseup', mouseUpHandler);\n };\n\n scrollTarget.addEventListener('mousedown', mouseDownHandler);\n\n /* eslint-disable-next-line consistent-return */\n return () => scrollTarget?.removeEventListener('mousedown', mouseDownHandler);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [targetRef.current]);\n}\n"],"names":["useEffect"],"mappings":";;;;AAOA;;;;AAIG;SACa,eAAe,CAAC,EAAE,SAAS,EAAE,eAAe,EAAwB,EAAA;IAClFA,eAAS,CAAC,MAAK;QACb,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE;QAExB,IAAI,UAAU,GAAG,KAAK;AACtB,QAAA,MAAM,YAAY,GAAG,SAAS,CAAC,OAAO;AACtC,QAAA,MAAM,QAAQ,GAAG;AACf,YAAA,IAAI,EAAE,CAAC;AACP,YAAA,CAAC,EAAE,CAAC;SACL;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;YACnB,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC;YACjC,YAAY,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,GAAG,EAAE;YAC5C,IAAI,CAAC,UAAU,EAAE;AACf,gBAAA,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU;AACtC,gBAAA,YAAY,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM;AACvC,YAAA;YACD,UAAU,GAAG,IAAI;AACnB,QAAA,CAAC;QAED,MAAM,cAAc,GAAG,MAAK;AAC1B,YAAA,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AAC3D,YAAA,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,cAAc,CAAC;YACvD,UAAU,GAAG,KAAK;AAClB,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC;AAC3C,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;AAClD,QAAA,CAAC;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB;;;AAGG;AACH,YAAA,IACE,eAAe;gBACf,CAAC,CAAC,MAAM,YAAY,WAAW;AAC/B,iBAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAC,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,EAAA,EAAG,eAAe,CAAC,CAAA,EAChD;gBACA;AACD,YAAA;AAED,YAAA,QAAQ,CAAC,IAAI,GAAG,YAAY,CAAC,UAAU;AACvC,YAAA,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO;AACtB,YAAA,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AACxD,YAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC;AACtD,QAAA,CAAC;AAED,QAAA,YAAY,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAG5D,QAAA,OAAO,MAAM,YAAY,aAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAE/E,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;AACzB;;;;"}
@@ -1,6 +1,6 @@
1
1
  import { RefObject } from 'react';
2
2
  type UseDragToScrollProps = {
3
- targetRef: RefObject<HTMLElement>;
3
+ targetRef: RefObject<HTMLElement | null>;
4
4
  ignoreClassName?: string;
5
5
  };
6
6
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"useDragToScroll.js","sources":["../../src/hooks/useDragToScroll.ts"],"sourcesContent":["import { useEffect, RefObject } from 'react';\n\ntype UseDragToScrollProps = {\n targetRef: RefObject<HTMLElement>;\n ignoreClassName?: string;\n};\n\n/**\n * Hook which allows the user to scroll horizontally by dragging on a given target element.\n * @param targetRef - The ref of the element to scroll.\n * @param ignoreClassName - The className of any elements which should be excluded from the dragging behaviour.\n */\nexport function useDragToScroll({ targetRef, ignoreClassName }: UseDragToScrollProps) {\n useEffect(() => {\n if (!targetRef.current) return;\n\n let isDragging = false;\n const scrollTarget = targetRef.current;\n const position = {\n left: 0,\n x: 0,\n };\n\n const mouseMoveHandler = (e: MouseEvent) => {\n if (!scrollTarget) return;\n const dx = e.clientX - position.x;\n scrollTarget.scrollLeft = position.left - dx;\n if (!isDragging) {\n scrollTarget.style.cursor = 'grabbing';\n scrollTarget.style.userSelect = 'none';\n }\n isDragging = true;\n };\n\n const mouseUpHandler = () => {\n document.removeEventListener('mousemove', mouseMoveHandler);\n document.removeEventListener('mouseup', mouseUpHandler);\n isDragging = false;\n if (!scrollTarget) return;\n scrollTarget.style.removeProperty('cursor');\n scrollTarget.style.removeProperty('user-select');\n };\n\n const mouseDownHandler = (e: MouseEvent) => {\n if (!scrollTarget) return;\n /** NOTE: prevents table scroll when resizing columns,\n * unable to use event.stopPropogation as event is a react Synthetic event which treats the event as the same, as they are on the same node, is discussed here\n * https://dev.to/dvnrsn/why-isn-t-event-stoppropagation-working-1bnm.\n */\n if (\n ignoreClassName &&\n e.target instanceof HTMLElement &&\n e.target?.classList?.contains?.(ignoreClassName)\n ) {\n return;\n }\n\n position.left = scrollTarget.scrollLeft;\n position.x = e.clientX;\n document.addEventListener('mousemove', mouseMoveHandler);\n document.addEventListener('mouseup', mouseUpHandler);\n };\n\n scrollTarget.addEventListener('mousedown', mouseDownHandler);\n\n /* eslint-disable-next-line consistent-return */\n return () => scrollTarget?.removeEventListener('mousedown', mouseDownHandler);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [targetRef.current]);\n}\n"],"names":[],"mappings":";;AAOA;;;;AAIG;SACa,eAAe,CAAC,EAAE,SAAS,EAAE,eAAe,EAAwB,EAAA;IAClF,SAAS,CAAC,MAAK;QACb,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE;QAExB,IAAI,UAAU,GAAG,KAAK;AACtB,QAAA,MAAM,YAAY,GAAG,SAAS,CAAC,OAAO;AACtC,QAAA,MAAM,QAAQ,GAAG;AACf,YAAA,IAAI,EAAE,CAAC;AACP,YAAA,CAAC,EAAE,CAAC;SACL;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;YACnB,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC;YACjC,YAAY,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,GAAG,EAAE;YAC5C,IAAI,CAAC,UAAU,EAAE;AACf,gBAAA,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU;AACtC,gBAAA,YAAY,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM;AACvC,YAAA;YACD,UAAU,GAAG,IAAI;AACnB,QAAA,CAAC;QAED,MAAM,cAAc,GAAG,MAAK;AAC1B,YAAA,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AAC3D,YAAA,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,cAAc,CAAC;YACvD,UAAU,GAAG,KAAK;AAClB,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC;AAC3C,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;AAClD,QAAA,CAAC;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB;;;AAGG;AACH,YAAA,IACE,eAAe;gBACf,CAAC,CAAC,MAAM,YAAY,WAAW;AAC/B,iBAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAC,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,EAAA,EAAG,eAAe,CAAC,CAAA,EAChD;gBACA;AACD,YAAA;AAED,YAAA,QAAQ,CAAC,IAAI,GAAG,YAAY,CAAC,UAAU;AACvC,YAAA,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO;AACtB,YAAA,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AACxD,YAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC;AACtD,QAAA,CAAC;AAED,QAAA,YAAY,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAG5D,QAAA,OAAO,MAAM,YAAY,aAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAE/E,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;AACzB;;;;"}
1
+ {"version":3,"file":"useDragToScroll.js","sources":["../../src/hooks/useDragToScroll.ts"],"sourcesContent":["import { useEffect, RefObject } from 'react';\n\ntype UseDragToScrollProps = {\n targetRef: RefObject<HTMLElement | null>;\n ignoreClassName?: string;\n};\n\n/**\n * Hook which allows the user to scroll horizontally by dragging on a given target element.\n * @param targetRef - The ref of the element to scroll.\n * @param ignoreClassName - The className of any elements which should be excluded from the dragging behaviour.\n */\nexport function useDragToScroll({ targetRef, ignoreClassName }: UseDragToScrollProps) {\n useEffect(() => {\n if (!targetRef.current) return;\n\n let isDragging = false;\n const scrollTarget = targetRef.current;\n const position = {\n left: 0,\n x: 0,\n };\n\n const mouseMoveHandler = (e: MouseEvent) => {\n if (!scrollTarget) return;\n const dx = e.clientX - position.x;\n scrollTarget.scrollLeft = position.left - dx;\n if (!isDragging) {\n scrollTarget.style.cursor = 'grabbing';\n scrollTarget.style.userSelect = 'none';\n }\n isDragging = true;\n };\n\n const mouseUpHandler = () => {\n document.removeEventListener('mousemove', mouseMoveHandler);\n document.removeEventListener('mouseup', mouseUpHandler);\n isDragging = false;\n if (!scrollTarget) return;\n scrollTarget.style.removeProperty('cursor');\n scrollTarget.style.removeProperty('user-select');\n };\n\n const mouseDownHandler = (e: MouseEvent) => {\n if (!scrollTarget) return;\n /** NOTE: prevents table scroll when resizing columns,\n * unable to use event.stopPropogation as event is a react Synthetic event which treats the event as the same, as they are on the same node, is discussed here\n * https://dev.to/dvnrsn/why-isn-t-event-stoppropagation-working-1bnm.\n */\n if (\n ignoreClassName &&\n e.target instanceof HTMLElement &&\n e.target?.classList?.contains?.(ignoreClassName)\n ) {\n return;\n }\n\n position.left = scrollTarget.scrollLeft;\n position.x = e.clientX;\n document.addEventListener('mousemove', mouseMoveHandler);\n document.addEventListener('mouseup', mouseUpHandler);\n };\n\n scrollTarget.addEventListener('mousedown', mouseDownHandler);\n\n /* eslint-disable-next-line consistent-return */\n return () => scrollTarget?.removeEventListener('mousedown', mouseDownHandler);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [targetRef.current]);\n}\n"],"names":[],"mappings":";;AAOA;;;;AAIG;SACa,eAAe,CAAC,EAAE,SAAS,EAAE,eAAe,EAAwB,EAAA;IAClF,SAAS,CAAC,MAAK;QACb,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE;QAExB,IAAI,UAAU,GAAG,KAAK;AACtB,QAAA,MAAM,YAAY,GAAG,SAAS,CAAC,OAAO;AACtC,QAAA,MAAM,QAAQ,GAAG;AACf,YAAA,IAAI,EAAE,CAAC;AACP,YAAA,CAAC,EAAE,CAAC;SACL;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;YACnB,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC;YACjC,YAAY,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,GAAG,EAAE;YAC5C,IAAI,CAAC,UAAU,EAAE;AACf,gBAAA,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU;AACtC,gBAAA,YAAY,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM;AACvC,YAAA;YACD,UAAU,GAAG,IAAI;AACnB,QAAA,CAAC;QAED,MAAM,cAAc,GAAG,MAAK;AAC1B,YAAA,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AAC3D,YAAA,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,cAAc,CAAC;YACvD,UAAU,GAAG,KAAK;AAClB,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC;AAC3C,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;AAClD,QAAA,CAAC;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB;;;AAGG;AACH,YAAA,IACE,eAAe;gBACf,CAAC,CAAC,MAAM,YAAY,WAAW;AAC/B,iBAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAC,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,EAAA,EAAG,eAAe,CAAC,CAAA,EAChD;gBACA;AACD,YAAA;AAED,YAAA,QAAQ,CAAC,IAAI,GAAG,YAAY,CAAC,UAAU;AACvC,YAAA,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO;AACtB,YAAA,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AACxD,YAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC;AACtD,QAAA,CAAC;AAED,QAAA,YAAY,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAG5D,QAAA,OAAO,MAAM,YAAY,aAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAE/E,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;AACzB;;;;"}
@@ -14,11 +14,11 @@ var throttle__default = /*#__PURE__*/_interopDefaultCompat(throttle);
14
14
  * @param throttleMs (Optional) the number of ms to throttle the observer callback.
15
15
  */
16
16
  const useIntersectionObserver = ({ targetRef, intersectionHandler, throttleMs, }) => {
17
- const intersectionHandlerRef = React.useRef();
17
+ const intersectionHandlerRef = React.useRef(null);
18
18
  intersectionHandlerRef.current = intersectionHandler;
19
- const intersectionObserverRef = React.useRef();
20
- const isIntersectingRef = React.useRef();
21
- const currentTargetRef = React.useRef();
19
+ const intersectionObserverRef = React.useRef(null);
20
+ const isIntersectingRef = React.useRef(null);
21
+ const currentTargetRef = React.useRef(null);
22
22
  React.useEffect(() => {
23
23
  const observerCallback = (entries) => {
24
24
  const [entry] = entries;
@@ -1 +1 @@
1
- {"version":3,"file":"useIntersectionObserver.cjs","sources":["../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype IntersectionHandler = (intersecting: boolean) => void;\n\ntype UseIntersectionObserverProps = {\n targetRef: RefObject<HTMLElement | null>;\n intersectionHandler: IntersectionHandler;\n throttleMs?: number;\n};\n\n/**\n * Hook which sets up an `IntersectionObserver` for a given element, and fires a callback when an intersection occurs.\n * @param targetRef The element to observe.\n * @param intersectionHandler The callback to invoke when an intersection occurs.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useIntersectionObserver = ({\n targetRef,\n intersectionHandler,\n throttleMs,\n}: UseIntersectionObserverProps) => {\n const intersectionHandlerRef = useRef<IntersectionHandler>();\n intersectionHandlerRef.current = intersectionHandler;\n\n const intersectionObserverRef = useRef<IntersectionObserver>();\n const isIntersectingRef = useRef<boolean>();\n\n const currentTargetRef = useRef();\n\n useEffect(() => {\n const observerCallback = (entries: IntersectionObserverEntry[]) => {\n const [entry] = entries;\n const { isIntersecting } = entry;\n\n if (isIntersectingRef.current && isIntersectingRef.current === isIntersecting) {\n return;\n }\n\n isIntersectingRef.current = isIntersecting;\n\n if (intersectionHandlerRef.current) {\n intersectionHandlerRef.current(isIntersecting);\n }\n };\n\n intersectionObserverRef.current = new IntersectionObserver(\n throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n );\n\n return () => {\n if (intersectionObserverRef.current) {\n intersectionObserverRef.current.disconnect();\n }\n };\n }, [throttleMs]);\n\n useEffect(() => {\n if (intersectionObserverRef.current) {\n if (\n targetRef.current &&\n currentTargetRef.current &&\n targetRef.current === currentTargetRef.current\n ) {\n return;\n }\n\n intersectionObserverRef.current.disconnect();\n\n if (targetRef.current) {\n intersectionObserverRef.current.observe(targetRef.current);\n }\n }\n });\n};\n"],"names":["useRef","useEffect","throttle"],"mappings":";;;;;;;;;AAYA;;;;;AAKG;AACI,MAAM,uBAAuB,GAAG,CAAC,EACtC,SAAS,EACT,mBAAmB,EACnB,UAAU,GACmB,KAAI;AACjC,IAAA,MAAM,sBAAsB,GAAGA,YAAM,EAAuB;AAC5D,IAAA,sBAAsB,CAAC,OAAO,GAAG,mBAAmB;AAEpD,IAAA,MAAM,uBAAuB,GAAGA,YAAM,EAAwB;AAC9D,IAAA,MAAM,iBAAiB,GAAGA,YAAM,EAAW;AAE3C,IAAA,MAAM,gBAAgB,GAAGA,YAAM,EAAE;IAEjCC,eAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAAoC,KAAI;AAChE,YAAA,MAAM,CAAC,KAAK,CAAC,GAAG,OAAO;AACvB,YAAA,MAAM,EAAE,cAAc,EAAE,GAAG,KAAK;YAEhC,IAAI,iBAAiB,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,KAAK,cAAc,EAAE;gBAC7E;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,GAAG,cAAc;YAE1C,IAAI,sBAAsB,CAAC,OAAO,EAAE;AAClC,gBAAA,sBAAsB,CAAC,OAAO,CAAC,cAAc,CAAC;AAC/C,YAAA;AACH,QAAA,CAAC;QAED,uBAAuB,CAAC,OAAO,GAAG,IAAI,oBAAoB,CACxD,UAAU,GAAGC,yBAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;AAED,QAAA,OAAO,MAAK;YACV,IAAI,uBAAuB,CAAC,OAAO,EAAE;AACnC,gBAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;AAC7C,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAEhBD,eAAS,CAAC,MAAK;QACb,IAAI,uBAAuB,CAAC,OAAO,EAAE;YACnC,IACE,SAAS,CAAC,OAAO;AACjB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;YAE5C,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,uBAAuB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AAC3D,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}
1
+ {"version":3,"file":"useIntersectionObserver.cjs","sources":["../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype IntersectionHandler = (intersecting: boolean) => void;\n\ntype UseIntersectionObserverProps = {\n targetRef: RefObject<HTMLElement | null>;\n intersectionHandler: IntersectionHandler;\n throttleMs?: number;\n};\n\n/**\n * Hook which sets up an `IntersectionObserver` for a given element, and fires a callback when an intersection occurs.\n * @param targetRef The element to observe.\n * @param intersectionHandler The callback to invoke when an intersection occurs.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useIntersectionObserver = ({\n targetRef,\n intersectionHandler,\n throttleMs,\n}: UseIntersectionObserverProps) => {\n const intersectionHandlerRef = useRef<IntersectionHandler | null>(null);\n intersectionHandlerRef.current = intersectionHandler;\n\n const intersectionObserverRef = useRef<IntersectionObserver | null>(null);\n const isIntersectingRef = useRef<boolean | null>(null);\n\n const currentTargetRef = useRef(null);\n\n useEffect(() => {\n const observerCallback = (entries: IntersectionObserverEntry[]) => {\n const [entry] = entries;\n const { isIntersecting } = entry;\n\n if (isIntersectingRef.current && isIntersectingRef.current === isIntersecting) {\n return;\n }\n\n isIntersectingRef.current = isIntersecting;\n\n if (intersectionHandlerRef.current) {\n intersectionHandlerRef.current(isIntersecting);\n }\n };\n\n intersectionObserverRef.current = new IntersectionObserver(\n throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n );\n\n return () => {\n if (intersectionObserverRef.current) {\n intersectionObserverRef.current.disconnect();\n }\n };\n }, [throttleMs]);\n\n useEffect(() => {\n if (intersectionObserverRef.current) {\n if (\n targetRef.current &&\n currentTargetRef.current &&\n targetRef.current === currentTargetRef.current\n ) {\n return;\n }\n\n intersectionObserverRef.current.disconnect();\n\n if (targetRef.current) {\n intersectionObserverRef.current.observe(targetRef.current);\n }\n }\n });\n};\n"],"names":["useRef","useEffect","throttle"],"mappings":";;;;;;;;;AAYA;;;;;AAKG;AACI,MAAM,uBAAuB,GAAG,CAAC,EACtC,SAAS,EACT,mBAAmB,EACnB,UAAU,GACmB,KAAI;AACjC,IAAA,MAAM,sBAAsB,GAAGA,YAAM,CAA6B,IAAI,CAAC;AACvE,IAAA,sBAAsB,CAAC,OAAO,GAAG,mBAAmB;AAEpD,IAAA,MAAM,uBAAuB,GAAGA,YAAM,CAA8B,IAAI,CAAC;AACzE,IAAA,MAAM,iBAAiB,GAAGA,YAAM,CAAiB,IAAI,CAAC;AAEtD,IAAA,MAAM,gBAAgB,GAAGA,YAAM,CAAC,IAAI,CAAC;IAErCC,eAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAAoC,KAAI;AAChE,YAAA,MAAM,CAAC,KAAK,CAAC,GAAG,OAAO;AACvB,YAAA,MAAM,EAAE,cAAc,EAAE,GAAG,KAAK;YAEhC,IAAI,iBAAiB,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,KAAK,cAAc,EAAE;gBAC7E;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,GAAG,cAAc;YAE1C,IAAI,sBAAsB,CAAC,OAAO,EAAE;AAClC,gBAAA,sBAAsB,CAAC,OAAO,CAAC,cAAc,CAAC;AAC/C,YAAA;AACH,QAAA,CAAC;QAED,uBAAuB,CAAC,OAAO,GAAG,IAAI,oBAAoB,CACxD,UAAU,GAAGC,yBAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;AAED,QAAA,OAAO,MAAK;YACV,IAAI,uBAAuB,CAAC,OAAO,EAAE;AACnC,gBAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;AAC7C,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAEhBD,eAAS,CAAC,MAAK;QACb,IAAI,uBAAuB,CAAC,OAAO,EAAE;YACnC,IACE,SAAS,CAAC,OAAO;AACjB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;YAE5C,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,uBAAuB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AAC3D,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}
@@ -8,11 +8,11 @@ import throttle from 'lodash.throttle';
8
8
  * @param throttleMs (Optional) the number of ms to throttle the observer callback.
9
9
  */
10
10
  const useIntersectionObserver = ({ targetRef, intersectionHandler, throttleMs, }) => {
11
- const intersectionHandlerRef = useRef();
11
+ const intersectionHandlerRef = useRef(null);
12
12
  intersectionHandlerRef.current = intersectionHandler;
13
- const intersectionObserverRef = useRef();
14
- const isIntersectingRef = useRef();
15
- const currentTargetRef = useRef();
13
+ const intersectionObserverRef = useRef(null);
14
+ const isIntersectingRef = useRef(null);
15
+ const currentTargetRef = useRef(null);
16
16
  useEffect(() => {
17
17
  const observerCallback = (entries) => {
18
18
  const [entry] = entries;
@@ -1 +1 @@
1
- {"version":3,"file":"useIntersectionObserver.js","sources":["../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype IntersectionHandler = (intersecting: boolean) => void;\n\ntype UseIntersectionObserverProps = {\n targetRef: RefObject<HTMLElement | null>;\n intersectionHandler: IntersectionHandler;\n throttleMs?: number;\n};\n\n/**\n * Hook which sets up an `IntersectionObserver` for a given element, and fires a callback when an intersection occurs.\n * @param targetRef The element to observe.\n * @param intersectionHandler The callback to invoke when an intersection occurs.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useIntersectionObserver = ({\n targetRef,\n intersectionHandler,\n throttleMs,\n}: UseIntersectionObserverProps) => {\n const intersectionHandlerRef = useRef<IntersectionHandler>();\n intersectionHandlerRef.current = intersectionHandler;\n\n const intersectionObserverRef = useRef<IntersectionObserver>();\n const isIntersectingRef = useRef<boolean>();\n\n const currentTargetRef = useRef();\n\n useEffect(() => {\n const observerCallback = (entries: IntersectionObserverEntry[]) => {\n const [entry] = entries;\n const { isIntersecting } = entry;\n\n if (isIntersectingRef.current && isIntersectingRef.current === isIntersecting) {\n return;\n }\n\n isIntersectingRef.current = isIntersecting;\n\n if (intersectionHandlerRef.current) {\n intersectionHandlerRef.current(isIntersecting);\n }\n };\n\n intersectionObserverRef.current = new IntersectionObserver(\n throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n );\n\n return () => {\n if (intersectionObserverRef.current) {\n intersectionObserverRef.current.disconnect();\n }\n };\n }, [throttleMs]);\n\n useEffect(() => {\n if (intersectionObserverRef.current) {\n if (\n targetRef.current &&\n currentTargetRef.current &&\n targetRef.current === currentTargetRef.current\n ) {\n return;\n }\n\n intersectionObserverRef.current.disconnect();\n\n if (targetRef.current) {\n intersectionObserverRef.current.observe(targetRef.current);\n }\n }\n });\n};\n"],"names":[],"mappings":";;;AAYA;;;;;AAKG;AACI,MAAM,uBAAuB,GAAG,CAAC,EACtC,SAAS,EACT,mBAAmB,EACnB,UAAU,GACmB,KAAI;AACjC,IAAA,MAAM,sBAAsB,GAAG,MAAM,EAAuB;AAC5D,IAAA,sBAAsB,CAAC,OAAO,GAAG,mBAAmB;AAEpD,IAAA,MAAM,uBAAuB,GAAG,MAAM,EAAwB;AAC9D,IAAA,MAAM,iBAAiB,GAAG,MAAM,EAAW;AAE3C,IAAA,MAAM,gBAAgB,GAAG,MAAM,EAAE;IAEjC,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAAoC,KAAI;AAChE,YAAA,MAAM,CAAC,KAAK,CAAC,GAAG,OAAO;AACvB,YAAA,MAAM,EAAE,cAAc,EAAE,GAAG,KAAK;YAEhC,IAAI,iBAAiB,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,KAAK,cAAc,EAAE;gBAC7E;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,GAAG,cAAc;YAE1C,IAAI,sBAAsB,CAAC,OAAO,EAAE;AAClC,gBAAA,sBAAsB,CAAC,OAAO,CAAC,cAAc,CAAC;AAC/C,YAAA;AACH,QAAA,CAAC;QAED,uBAAuB,CAAC,OAAO,GAAG,IAAI,oBAAoB,CACxD,UAAU,GAAG,QAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;AAED,QAAA,OAAO,MAAK;YACV,IAAI,uBAAuB,CAAC,OAAO,EAAE;AACnC,gBAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;AAC7C,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAEhB,SAAS,CAAC,MAAK;QACb,IAAI,uBAAuB,CAAC,OAAO,EAAE;YACnC,IACE,SAAS,CAAC,OAAO;AACjB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;YAE5C,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,uBAAuB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AAC3D,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}
1
+ {"version":3,"file":"useIntersectionObserver.js","sources":["../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype IntersectionHandler = (intersecting: boolean) => void;\n\ntype UseIntersectionObserverProps = {\n targetRef: RefObject<HTMLElement | null>;\n intersectionHandler: IntersectionHandler;\n throttleMs?: number;\n};\n\n/**\n * Hook which sets up an `IntersectionObserver` for a given element, and fires a callback when an intersection occurs.\n * @param targetRef The element to observe.\n * @param intersectionHandler The callback to invoke when an intersection occurs.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useIntersectionObserver = ({\n targetRef,\n intersectionHandler,\n throttleMs,\n}: UseIntersectionObserverProps) => {\n const intersectionHandlerRef = useRef<IntersectionHandler | null>(null);\n intersectionHandlerRef.current = intersectionHandler;\n\n const intersectionObserverRef = useRef<IntersectionObserver | null>(null);\n const isIntersectingRef = useRef<boolean | null>(null);\n\n const currentTargetRef = useRef(null);\n\n useEffect(() => {\n const observerCallback = (entries: IntersectionObserverEntry[]) => {\n const [entry] = entries;\n const { isIntersecting } = entry;\n\n if (isIntersectingRef.current && isIntersectingRef.current === isIntersecting) {\n return;\n }\n\n isIntersectingRef.current = isIntersecting;\n\n if (intersectionHandlerRef.current) {\n intersectionHandlerRef.current(isIntersecting);\n }\n };\n\n intersectionObserverRef.current = new IntersectionObserver(\n throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n );\n\n return () => {\n if (intersectionObserverRef.current) {\n intersectionObserverRef.current.disconnect();\n }\n };\n }, [throttleMs]);\n\n useEffect(() => {\n if (intersectionObserverRef.current) {\n if (\n targetRef.current &&\n currentTargetRef.current &&\n targetRef.current === currentTargetRef.current\n ) {\n return;\n }\n\n intersectionObserverRef.current.disconnect();\n\n if (targetRef.current) {\n intersectionObserverRef.current.observe(targetRef.current);\n }\n }\n });\n};\n"],"names":[],"mappings":";;;AAYA;;;;;AAKG;AACI,MAAM,uBAAuB,GAAG,CAAC,EACtC,SAAS,EACT,mBAAmB,EACnB,UAAU,GACmB,KAAI;AACjC,IAAA,MAAM,sBAAsB,GAAG,MAAM,CAA6B,IAAI,CAAC;AACvE,IAAA,sBAAsB,CAAC,OAAO,GAAG,mBAAmB;AAEpD,IAAA,MAAM,uBAAuB,GAAG,MAAM,CAA8B,IAAI,CAAC;AACzE,IAAA,MAAM,iBAAiB,GAAG,MAAM,CAAiB,IAAI,CAAC;AAEtD,IAAA,MAAM,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC;IAErC,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAAoC,KAAI;AAChE,YAAA,MAAM,CAAC,KAAK,CAAC,GAAG,OAAO;AACvB,YAAA,MAAM,EAAE,cAAc,EAAE,GAAG,KAAK;YAEhC,IAAI,iBAAiB,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,KAAK,cAAc,EAAE;gBAC7E;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,GAAG,cAAc;YAE1C,IAAI,sBAAsB,CAAC,OAAO,EAAE;AAClC,gBAAA,sBAAsB,CAAC,OAAO,CAAC,cAAc,CAAC;AAC/C,YAAA;AACH,QAAA,CAAC;QAED,uBAAuB,CAAC,OAAO,GAAG,IAAI,oBAAoB,CACxD,UAAU,GAAG,QAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;AAED,QAAA,OAAO,MAAK;YACV,IAAI,uBAAuB,CAAC,OAAO,EAAE;AACnC,gBAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;AAC7C,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAEhB,SAAS,CAAC,MAAK;QACb,IAAI,uBAAuB,CAAC,OAAO,EAAE;YACnC,IACE,SAAS,CAAC,OAAO;AACjB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;YAE5C,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,uBAAuB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AAC3D,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}
@@ -17,9 +17,9 @@ const useResizeObserver = ({ targetRef, resizeHandler, throttleMs, }) => {
17
17
  // Use a ref to store the resizeHandler to avoid re-rendering when the callback changes.
18
18
  const resizeHandlerRef = React.useRef(undefined);
19
19
  resizeHandlerRef.current = resizeHandler;
20
- const resizeObserverRef = React.useRef();
20
+ const resizeObserverRef = React.useRef(null);
21
21
  const previousSizeRef = React.useRef(undefined);
22
- const currentTargetRef = React.useRef();
22
+ const currentTargetRef = React.useRef(null);
23
23
  // Setup the resize observer when the hook is mounted.
24
24
  React.useEffect(() => {
25
25
  const observerCallback = (entries) => {