npm - @popsure/dirty-swan - Versions diffs - 0.63.0 → 0.63.2 - Mend

@popsure/dirty-swan 0.63.0 → 0.63.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1394) hide show

package/dist/esm/components/comparisonTable/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../../src/lib/components/comparisonTable/hooks/useComparisonTable.ts","../../../../../src/lib/components/comparisonTable/index.tsx"],"sourcesContent":["import debounce from 'lodash.debounce';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport generateId from '../../../util/generateId';\nimport { ArrowValues } from '../components/TableArrows';\n\nexport const useComparisonTable = ({\n onSelectionChanged,\n}: {\n onSelectionChanged?: (selectedIndex: number) => void;\n}) => {\n const [showMore, setShowMore] = useState<boolean>(false);\n const [headerWidth, setHeaderWidth] = useState(1400);\n const [selectedTabIndex, setSelectedTabIndex] = useState(0);\n const [selectedSection, setSelectedSection] = useState('');\n const [headerId, setHeaderId] = useState('');\n const headerRef = useRef<HTMLDivElement \| null>(null);\n const contentContainerRef = useRef<HTMLDivElement \| null>(null);\n const observerRef = useRef<ResizeObserver \| null>(null);\n\n const headerRefCallbackRef = useCallback((node) => {\n if (node) {\n setHeaderWidth(node.clientWidth);\n }\n\n headerRef.current = node;\n }, []);\n\n useEffect(() => {\n if (!observerRef.current) {\n observerRef.current = new ResizeObserver((entries) => {\n entries.forEach((entry) => {\n const currentTabIndex = Math.round(\n entry.target.scrollLeft / entry.contentRect.width\n );\n\n setHeaderWidth(entry.contentRect.width);\n\n // Update selectedTabIndex to match the calculated current tab index\n setSelectedTabIndex(currentTabIndex);\n });\n });\n }\n\n if (headerRef.current) {\n observerRef.current.observe(headerRef.current);\n }\n\n return () => {\n if (headerRef.current) {\n observerRef.current?.unobserve(headerRef.current);\n }\n observerRef.current?.disconnect();\n };\n }, []);\n\n useEffect(() => {\n const resetHeaderWidth = () => {\n if (headerRef.current) {\n setHeaderWidth(headerRef.current.clientWidth);\n }\n };\n\n window.addEventListener('resize', resetHeaderWidth);\n\n return () => window.removeEventListener('resize', resetHeaderWidth);\n }, []);\n\n const handleTableScroll = () => {\n if (!headerRef.current) {\n return;\n }\n\n const headerWidth = headerRef.current.getBoundingClientRect().width;\n\n const currentTabIndex = Math.round(\n headerRef.current.scrollLeft / headerWidth\n );\n\n setSelectedTabIndex(currentTabIndex);\n };\n\n const debouncedTableScroll = debounce(handleTableScroll, 150);\n\n useEffect(() => {\n headerRef.current?.addEventListener('scroll', debouncedTableScroll, {\n passive: true,\n });\n\n return headerRef.current?.removeEventListener('scroll', handleTableScroll);\n }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n const handleArrowsClick = (value: ArrowValues) => {\n if (headerRef.current) {\n const currentTabIndex = Math.round(\n headerRef.current.scrollLeft / headerRef.current.clientWidth\n );\n\n const direction = value === 'next' ? 1 : -1;\n\n const newTabIndex = currentTabIndex + direction;\n\n headerRef.current.scroll({\n top: 0,\n left: headerWidth * newTabIndex,\n behavior: 'smooth',\n });\n\n setSelectedTabIndex(() => {\n return newTabIndex;\n });\n }\n };\n\n const toggleMoreRows = async () => {\n setShowMore(!showMore);\n };\n\n useEffect(() => {\n if (headerRef.current) {\n return;\n }\n\n const headerById = document.getElementById(headerId);\n\n if (headerById) {\n headerRefCallbackRef(headerById);\n }\n }, [headerId, headerRefCallbackRef]);\n\n useEffect(() => {\n setHeaderId(generateId());\n }, []);\n\n useEffect(() => {\n onSelectionChanged?.(selectedTabIndex);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedTabIndex]);\n\n return {\n headerWidth,\n headerId,\n contentContainerRef,\n selectedSection,\n setSelectedSection,\n selectedTabIndex,\n setSelectedTabIndex,\n headerRefCallbackRef,\n handleArrowsClick,\n toggleMoreRows,\n showMore,\n };\n};\n","import classNames from 'classnames';\nimport { Fragment } from 'react';\nimport { ScrollSync, ScrollSyncPane } from 'react-scroll-sync';\n\nimport { AccordionItem } from './components/AccordionItem';\nimport Chevron from './components/Chevron';\nimport Row from './components/Row';\nimport TableArrows from './components/TableArrows';\nimport TableButton from './components/TableButton';\nimport TableInfoButton from './components/TableInfoButton';\nimport TableRating from './components/TableRating';\nimport TableRowHeader from './components/TableRowHeader';\nimport TableTrueFalse from './components/TableTrueFalse';\nimport { useComparisonTable } from './hooks/useComparisonTable';\nimport baseStyles from './style.module.scss';\n\nexport interface CellBaseProps<T> {\n /** Used to display the row's title /\n label?: React.ReactNode;\n /\n \n * @param value The current data value\n * @param element The complete data object\n /\n render?: (value: any, element: T) => React.ReactNode; // TODO: add typing to value param\n}\n\ninterface CellWithId<T> extends CellBaseProps<T> {\n /* Used when adding component add-ons /\n addonId: string \| number;\n}\n\nexport type Cell<T> =\n \| ({ key: Extract<keyof T, string> } & CellBaseProps<T>)\n \| ({ key?: undefined } & CellWithId<T>);\n\nexport interface TableHeader<T> {\n /* Required unique id number for each table group /\n id: number;\n /* Used to display a table group subheader /\n label?: React.ReactNode;\n cells: Array<Cell<T>>;\n default?: boolean;\n}\n\nexport interface ComparisonTableProps<T> {\n headers: Array<TableHeader<T>>;\n data: Array<T>;\n hideDetails?: boolean;\n hideDetailsCaption?: string;\n showDetailsCaption?: string;\n hideScrollBars?: boolean;\n hideScrollBarsMobile?: boolean;\n collapsibleSections?: boolean;\n cellWidth?: number;\n firstColumnWidth?: number;\n stickyHeaderTopOffset?: number;\n growContent?: boolean;\n classNameOverrides?: ClassNameOverrides;\n onSelectionChanged?: (selectedIndex: number) => void;\n}\n\nexport interface ClassNameOverrides {\n header?: string;\n container?: string;\n cell?: string;\n headerCell?: string;\n collapsibleSection?: string;\n section?: string;\n hideDetailsButton?: string;\n}\n\nconst ComparisonTable = <T extends { id: number }>(\n props: ComparisonTableProps<T>\n) => {\n const {\n headers,\n data,\n hideDetails,\n hideDetailsCaption = 'Hide details',\n showDetailsCaption = 'Show details',\n classNameOverrides,\n hideScrollBars,\n hideScrollBarsMobile = true,\n collapsibleSections,\n cellWidth,\n firstColumnWidth,\n stickyHeaderTopOffset,\n growContent,\n onSelectionChanged,\n } = props;\n\n const {\n headerWidth,\n headerId,\n contentContainerRef,\n selectedSection,\n setSelectedSection,\n selectedTabIndex,\n headerRefCallbackRef,\n handleArrowsClick,\n toggleMoreRows,\n showMore,\n } = useComparisonTable({ onSelectionChanged });\n\n const cssVariablesStyle = {\n '--tableWidth': `${headerWidth}px`,\n ...(cellWidth ? { '--cellWidth': `${cellWidth}px` } : {}),\n ...(firstColumnWidth\n ? { '--firstColumnWidth': `${firstColumnWidth}px` }\n : {}),\n ...(stickyHeaderTopOffset\n ? { '--stickyHeaderTopOffset': `${stickyHeaderTopOffset}px` }\n : {}),\n ...(growContent ? { '--growContent': '100%' } : {}),\n } as React.CSSProperties;\n\n return (\n <ScrollSync onSync={headerRefCallbackRef}>\n <div\n style={cssVariablesStyle}\n className={classNames({\n [baseStyles.noScrollBars]: hideScrollBars,\n [baseStyles.noScrollBarsMobile]: hideScrollBarsMobile,\n })}\n >\n <div\n id={headerId}\n className={classNames(baseStyles.header, classNameOverrides?.header)}\n >\n <ScrollSyncPane>\n <div className={classNames(baseStyles.container)}>\n <div className={classNames(baseStyles['overflow-container'])}>\n <div className={baseStyles['group-container']}>\n <TableArrows\n onClick={handleArrowsClick}\n active={{\n left: selectedTabIndex > 0,\n right: selectedTabIndex < data.length - 1,\n }}\n />\n <Row<T>\n key=\"table-header-row\"\n rowId=\"table-header-row\"\n cell={headers[0].cells[0]}\n data={data}\n isRowHeader\n cellClassName={classNameOverrides?.headerCell}\n />\n </div>\n </div>\n </div>\n </ScrollSyncPane>\n </div>\n <div ref={contentContainerRef}>\n {Array.isArray(headers) &&\n headers\n .filter(\n (headerGroup) => !hideDetails \|\| showMore \|\| headerGroup.default\n )\n .map((headerGroup, headerGroupIndex) => {\n const content = headerGroup.cells?.map((cell, index) => {\n const rowId = `${headerGroup.id}-${\n cell.key ?? 'addon'\n }-${index}`;\n\n /* Do not render the first row /\n if (index === 0 && headerGroupIndex === 0) return null;\n\n return (\n <Row<T>\n key={rowId}\n rowId={rowId}\n cell={cell}\n data={data}\n cellClassName={classNameOverrides?.cell}\n />\n );\n });\n\n const idString = `headerGroup-${headerGroup.id}`;\n\n return (\n <Fragment key={idString}>\n {headerGroup.label && collapsibleSections ? (\n <AccordionItem\n className={classNames(\n 'mt16',\n classNameOverrides?.collapsibleSection\n )}\n label={headerGroup.label}\n headerClassName=\"p24 br8\"\n isOpen={selectedSection === idString}\n onOpen={() => setSelectedSection(idString)}\n onClose={() => setSelectedSection('')}\n >\n <ScrollSyncPane>\n <div\n className={classNames(\n baseStyles.container,\n 'pb16',\n classNameOverrides?.container,\n {\n [baseStyles.noScrollBars]: hideScrollBars,\n }\n )}\n >\n <div\n className={classNames(\n baseStyles['overflow-container']\n )}\n >\n <div className={baseStyles['group-container']}>\n {content}\n </div>\n </div>\n </div>\n </ScrollSyncPane>\n </AccordionItem>\n ) : (\n <section\n key={idString}\n className={classNames(\n baseStyles.section,\n classNameOverrides?.section\n )}\n >\n <ScrollSyncPane>\n <div\n className={classNames(\n baseStyles.container,\n 'pb16',\n classNameOverrides?.container,\n {\n [baseStyles.noScrollBars]: hideScrollBars,\n }\n )}\n >\n <div\n className={classNames(\n baseStyles['overflow-container']\n )}\n >\n <div className={baseStyles['group-container']}>\n {\n /\n Print a table subheader if the `label` value is present\n */\n headerGroup.label && !collapsibleSections && (\n <div className={baseStyles['group-title']}>\n <h4\n className={`p-h4 ${baseStyles.sticky}`}\n >\n {headerGroup.label}\n </h4>\n </div>\n )\n }\n {content}\n </div>\n </div>\n </div>\n </ScrollSyncPane>\n </section>\n )}\n </Fragment>\n );\n })}\n {hideDetails && (\n <div\n className={classNames(\n baseStyles['show-details-container'],\n baseStyles.sticky,\n 'mt48'\n )}\n >\n <div>\n <button\n className={classNames(\n 'w100 d-flex p-a p-h4 c-pointer',\n baseStyles['show-details-button'],\n classNameOverrides?.hideDetailsButton\n )}\n onClick={toggleMoreRows}\n type=\"button\"\n >\n {showMore ? hideDetailsCaption : showDetailsCaption}\n <Chevron\n className={showMore ? '' : baseStyles['icon-inverted']}\n />\n </button>\n </div>\n </div>\n )}\n </div>\n </div>\n </ScrollSync>\n );\n};\n\nexport {\n ComparisonTable,\n TableButton,\n TableInfoButton,\n TableRating,\n TableRowHeader,\n TableTrueFalse,\n};\n"],"names":["debounce","_jsx","ScrollSync","_jsxs","ScrollSyncPane"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","sources":["../../../../../src/lib/components/comparisonTable/hooks/useComparisonTable.ts","../../../../../src/lib/components/comparisonTable/index.tsx"],"sourcesContent":["import debounce from 'lodash.debounce';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport generateId from '../../../util/generateId';\nimport { ArrowValues } from '../components/TableArrows';\n\nexport const useComparisonTable = ({\n onSelectionChanged,\n}: {\n onSelectionChanged?: (selectedIndex: number) => void;\n}) => {\n const [showMore, setShowMore] = useState<boolean>(false);\n const [headerWidth, setHeaderWidth] = useState(1400);\n const [selectedTabIndex, setSelectedTabIndex] = useState(0);\n const [headerId, setHeaderId] = useState('');\n const headerRef = useRef<HTMLDivElement \| null>(null);\n const contentContainerRef = useRef<HTMLDivElement \| null>(null);\n const observerRef = useRef<ResizeObserver \| null>(null);\n\n const headerRefCallbackRef = useCallback((node) => {\n if (node) {\n setHeaderWidth(node.clientWidth);\n }\n\n headerRef.current = node;\n }, []);\n\n useEffect(() => {\n if (!observerRef.current) {\n observerRef.current = new ResizeObserver((entries) => {\n entries.forEach((entry) => {\n const currentTabIndex = Math.round(\n entry.target.scrollLeft / entry.contentRect.width\n );\n\n setHeaderWidth(entry.contentRect.width);\n\n // Update selectedTabIndex to match the calculated current tab index\n setSelectedTabIndex(currentTabIndex);\n });\n });\n }\n\n if (headerRef.current) {\n observerRef.current.observe(headerRef.current);\n }\n\n return () => {\n if (headerRef.current) {\n observerRef.current?.unobserve(headerRef.current);\n }\n observerRef.current?.disconnect();\n };\n }, []);\n\n useEffect(() => {\n const resetHeaderWidth = () => {\n if (headerRef.current) {\n setHeaderWidth(headerRef.current.clientWidth);\n }\n };\n\n window.addEventListener('resize', resetHeaderWidth);\n\n return () => window.removeEventListener('resize', resetHeaderWidth);\n }, []);\n\n const handleTableScroll = () => {\n if (!headerRef.current) {\n return;\n }\n\n const headerWidth = headerRef.current.getBoundingClientRect().width;\n\n const currentTabIndex = Math.round(\n headerRef.current.scrollLeft / headerWidth\n );\n\n setSelectedTabIndex(currentTabIndex);\n };\n\n const debouncedTableScroll = debounce(handleTableScroll, 150);\n\n useEffect(() => {\n headerRef.current?.addEventListener('scroll', debouncedTableScroll, {\n passive: true,\n });\n\n return headerRef.current?.removeEventListener('scroll', handleTableScroll);\n }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n const handleArrowsClick = (value: ArrowValues) => {\n if (headerRef.current) {\n const currentTabIndex = Math.round(\n headerRef.current.scrollLeft / headerRef.current.clientWidth\n );\n\n const direction = value === 'next' ? 1 : -1;\n\n const newTabIndex = currentTabIndex + direction;\n\n headerRef.current.scroll({\n top: 0,\n left: headerWidth * newTabIndex,\n behavior: 'smooth',\n });\n\n setSelectedTabIndex(() => {\n return newTabIndex;\n });\n }\n };\n\n const toggleMoreRows = async () => {\n setShowMore(!showMore);\n };\n\n useEffect(() => {\n if (headerRef.current) {\n return;\n }\n\n const headerById = document.getElementById(headerId);\n\n if (headerById) {\n headerRefCallbackRef(headerById);\n }\n }, [headerId, headerRefCallbackRef]);\n\n useEffect(() => {\n setHeaderId(generateId());\n }, []);\n\n useEffect(() => {\n onSelectionChanged?.(selectedTabIndex);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedTabIndex]);\n\n return {\n headerWidth,\n headerId,\n contentContainerRef,\n selectedTabIndex,\n setSelectedTabIndex,\n headerRefCallbackRef,\n handleArrowsClick,\n toggleMoreRows,\n showMore,\n };\n};\n","import classNames from 'classnames';\nimport { Fragment, useRef, useState } from 'react';\nimport { ScrollSync, ScrollSyncPane } from 'react-scroll-sync';\n\nimport { AccordionItem } from './components/AccordionItem';\nimport Chevron from './components/Chevron';\nimport Row from './components/Row';\nimport TableArrows from './components/TableArrows';\nimport TableButton from './components/TableButton';\nimport TableInfoButton from './components/TableInfoButton';\nimport TableRating from './components/TableRating';\nimport TableRowHeader from './components/TableRowHeader';\nimport TableTrueFalse from './components/TableTrueFalse';\nimport { useComparisonTable } from './hooks/useComparisonTable';\nimport baseStyles from './style.module.scss';\n\nexport interface CellBaseProps<T> {\n /** Used to display the row's title /\n label?: React.ReactNode;\n /\n \n * @param value The current data value\n * @param element The complete data object\n /\n render?: (value: any, element: T) => React.ReactNode; // TODO: add typing to value param\n}\n\ninterface CellWithId<T> extends CellBaseProps<T> {\n /* Used when adding component add-ons /\n addonId: string \| number;\n}\n\nexport type Cell<T> =\n \| ({ key: Extract<keyof T, string> } & CellBaseProps<T>)\n \| ({ key?: undefined } & CellWithId<T>);\n\nexport interface TableHeader<T> {\n /* Required unique id number for each table group /\n id: number;\n /* Used to display a table group subheader /\n label?: React.ReactNode;\n cells: Array<Cell<T>>;\n default?: boolean;\n}\n\nexport interface ComparisonTableProps<T> {\n headers: Array<TableHeader<T>>;\n data: Array<T>;\n hideDetails?: boolean;\n hideDetailsCaption?: string;\n showDetailsCaption?: string;\n hideScrollBars?: boolean;\n hideScrollBarsMobile?: boolean;\n collapsibleSections?: boolean;\n scrollOnOpen?: boolean;\n scrollTopOffset?: number;\n cellWidth?: number;\n firstColumnWidth?: number;\n stickyHeaderTopOffset?: number;\n growContent?: boolean;\n classNameOverrides?: ClassNameOverrides;\n onSelectionChanged?: (selectedIndex: number) => void;\n}\n\nexport interface ClassNameOverrides {\n header?: string;\n container?: string;\n cell?: string;\n headerCell?: string;\n collapsibleSection?: string;\n section?: string;\n hideDetailsButton?: string;\n}\n\nconst ComparisonTable = <T extends { id: number }>(\n props: ComparisonTableProps<T>\n) => {\n const {\n headers,\n data,\n hideDetails,\n hideDetailsCaption = 'Hide details',\n showDetailsCaption = 'Show details',\n classNameOverrides,\n hideScrollBars,\n hideScrollBarsMobile = true,\n collapsibleSections,\n scrollOnOpen,\n scrollTopOffset = 0,\n cellWidth,\n firstColumnWidth,\n stickyHeaderTopOffset,\n growContent,\n onSelectionChanged,\n } = props;\n\n const {\n headerWidth,\n headerId,\n contentContainerRef,\n selectedTabIndex,\n headerRefCallbackRef,\n handleArrowsClick,\n toggleMoreRows,\n showMore,\n } = useComparisonTable({ onSelectionChanged });\n\n const [openSectionId, setOpenSectionId] = useState<number \| null>(null);\n const stickyHeaderRef = useRef<HTMLDivElement>(null);\n\n const cssVariablesStyle = {\n '--tableWidth': `${headerWidth}px`,\n ...(cellWidth ? { '--cellWidth': `${cellWidth}px` } : {}),\n ...(firstColumnWidth\n ? { '--firstColumnWidth': `${firstColumnWidth}px` }\n : {}),\n ...(stickyHeaderTopOffset\n ? { '--stickyHeaderTopOffset': `${stickyHeaderTopOffset}px` }\n : {}),\n ...(growContent ? { '--growContent': '100%' } : {}),\n } as React.CSSProperties;\n\n return (\n <ScrollSync onSync={headerRefCallbackRef}>\n <div\n style={cssVariablesStyle}\n className={classNames({\n [baseStyles.noScrollBars]: hideScrollBars,\n [baseStyles.noScrollBarsMobile]: hideScrollBarsMobile,\n })}\n >\n <div\n ref={stickyHeaderRef}\n id={headerId}\n className={classNames(baseStyles.header, classNameOverrides?.header)}\n >\n <ScrollSyncPane>\n <div className={classNames(baseStyles.container)}>\n <div className={classNames(baseStyles['overflow-container'])}>\n <div className={baseStyles['group-container']}>\n <TableArrows\n onClick={handleArrowsClick}\n active={{\n left: selectedTabIndex > 0,\n right: selectedTabIndex < data.length - 1,\n }}\n />\n <Row<T>\n key=\"table-header-row\"\n rowId=\"table-header-row\"\n cell={headers[0].cells[0]}\n data={data}\n isRowHeader\n cellClassName={classNameOverrides?.headerCell}\n />\n </div>\n </div>\n </div>\n </ScrollSyncPane>\n </div>\n <div ref={contentContainerRef}>\n {Array.isArray(headers) &&\n headers\n .filter(\n (headerGroup) => !hideDetails \|\| showMore \|\| headerGroup.default\n )\n .map((headerGroup, headerGroupIndex) => {\n const content = headerGroup.cells?.map((cell, index) => {\n const rowId = `${headerGroup.id}-${\n cell.key ?? 'addon'\n }-${index}`;\n\n /* Do not render the first row /\n if (index === 0 && headerGroupIndex === 0) return null;\n\n return (\n <Row<T>\n key={rowId}\n rowId={rowId}\n cell={cell}\n data={data}\n cellClassName={classNameOverrides?.cell}\n />\n );\n });\n\n const idString = `headerGroup-${headerGroup.id}`;\n\n return (\n <Fragment key={idString}>\n {headerGroup.label && collapsibleSections ? (\n <AccordionItem\n className={classNames(\n 'mt16',\n classNameOverrides?.collapsibleSection\n )}\n label={headerGroup.label}\n headerClassName=\"p24 br8\"\n isOpen={openSectionId === headerGroup.id}\n onToggle={() =>\n setOpenSectionId((prev) =>\n prev === headerGroup.id ? null : headerGroup.id\n )\n }\n scrollOnOpen={scrollOnOpen}\n scrollTopOffset={\n scrollTopOffset +\n (stickyHeaderRef.current?.getBoundingClientRect()\n .height ?? 0)\n }\n >\n <ScrollSyncPane>\n <div\n className={classNames(\n baseStyles.container,\n 'pb16',\n classNameOverrides?.container,\n {\n [baseStyles.noScrollBars]: hideScrollBars,\n }\n )}\n >\n <div\n className={classNames(\n baseStyles['overflow-container']\n )}\n >\n <div className={baseStyles['group-container']}>\n {content}\n </div>\n </div>\n </div>\n </ScrollSyncPane>\n </AccordionItem>\n ) : (\n <section\n key={idString}\n className={classNames(\n baseStyles.section,\n classNameOverrides?.section\n )}\n >\n <ScrollSyncPane>\n <div\n className={classNames(\n baseStyles.container,\n 'pb16',\n classNameOverrides?.container,\n {\n [baseStyles.noScrollBars]: hideScrollBars,\n }\n )}\n >\n <div\n className={classNames(\n baseStyles['overflow-container']\n )}\n >\n <div className={baseStyles['group-container']}>\n {\n /\n Print a table subheader if the `label` value is present\n */\n headerGroup.label && !collapsibleSections && (\n <div className={baseStyles['group-title']}>\n <h4\n className={`p-h4 ${baseStyles.sticky}`}\n >\n {headerGroup.label}\n </h4>\n </div>\n )\n }\n {content}\n </div>\n </div>\n </div>\n </ScrollSyncPane>\n </section>\n )}\n </Fragment>\n );\n })}\n {hideDetails && (\n <div\n className={classNames(\n baseStyles['show-details-container'],\n baseStyles.sticky,\n 'mt48'\n )}\n >\n <div>\n <button\n className={classNames(\n 'w100 d-flex p-h4 c-pointer',\n baseStyles['show-details-button'],\n classNameOverrides?.hideDetailsButton\n )}\n onClick={toggleMoreRows}\n type=\"button\"\n >\n {showMore ? hideDetailsCaption : showDetailsCaption}\n <Chevron\n className={showMore ? '' : baseStyles['icon-inverted']}\n />\n </button>\n </div>\n </div>\n )}\n </div>\n </div>\n </ScrollSync>\n );\n};\n\nexport {\n ComparisonTable,\n TableButton,\n TableInfoButton,\n TableRating,\n TableRowHeader,\n TableTrueFalse,\n};\n"],"names":["_jsx","ScrollSync","_jsxs","ScrollSyncPane"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAKO,IAAM,kBAAkB,GAAG,UAAC,EAIlC,EAAA;AAHC,IAAA,IAAA,kBAAkB,GAAA,EAAA,CAAA,kBAAA;IAIZ,IAAA,EAAA,GAA0B,QAAQ,CAAU,KAAK,CAAC,EAAjD,QAAQ,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,WAAW,GAAA,EAAA,CAAA,CAAA,CAA4B;IAClD,IAAA,EAAA,GAAgC,QAAQ,CAAC,IAAI,CAAC,EAA7C,WAAW,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,cAAc,GAAA,EAAA,CAAA,CAAA,CAAkB;IAC9C,IAAA,EAAA,GAA0C,QAAQ,CAAC,CAAC,CAAC,EAApD,gBAAgB,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,mBAAmB,GAAA,EAAA,CAAA,CAAA,CAAe;IACrD,IAAA,EAAA,GAA0B,QAAQ,CAAC,EAAE,CAAC,EAArC,QAAQ,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,WAAW,GAAA,EAAA,CAAA,CAAA,CAAgB;AAC5C,IAAA,IAAM,SAAS,GAAG,MAAM,CAAwB,IAAI,CAAC;AACrD,IAAA,IAAM,mBAAmB,GAAG,MAAM,CAAwB,IAAI,CAAC;AAC/D,IAAA,IAAM,WAAW,GAAG,MAAM,CAAwB,IAAI,CAAC;AAEvD,IAAA,IAAM,oBAAoB,GAAG,WAAW,CAAC,UAAC,IAAI,EAAA;QAC5C,IAAI,IAAI,EAAE;AACR,YAAA,cAAc,CAAC,IAAI,CAAC,WAAW,CAAC;QAClC;AAEA,QAAA,SAAS,CAAC,OAAO,GAAG,IAAI;IAC1B,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,SAAS,CAAC,YAAA;AACR,QAAA,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE;AACxB,YAAA,WAAW,CAAC,OAAO,GAAG,IAAI,cAAc,CAAC,UAAC,OAAO,EAAA;AAC/C,gBAAA,OAAO,CAAC,OAAO,CAAC,UAAC,KAAK,EAAA;AACpB,oBAAA,IAAM,eAAe,GAAG,IAAI,CAAC,KAAK,CAChC,KAAK,CAAC,MAAM,CAAC,UAAU,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAClD;AAED,oBAAA,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC;;oBAGvC,mBAAmB,CAAC,eAAe,CAAC;AACtC,gBAAA,CAAC,CAAC;AACJ,YAAA,CAAC,CAAC;QACJ;AAEA,QAAA,IAAI,SAAS,CAAC,OAAO,EAAE;YACrB,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;QAChD;QAEA,OAAO,YAAA;;AACL,YAAA,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,CAAA,EAAA,GAAA,WAAW,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS,CAAC,SAAS,CAAC,OAAO,CAAC;YACnD;AACA,YAAA,CAAA,EAAA,GAAA,WAAW,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,UAAU,EAAE;AACnC,QAAA,CAAC;IACH,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,SAAS,CAAC,YAAA;AACR,QAAA,IAAM,gBAAgB,GAAG,YAAA;AACvB,YAAA,IAAI,SAAS,CAAC,OAAO,EAAE;AACrB,gBAAA,cAAc,CAAC,SAAS,CAAC,OAAO,CAAC,WAAW,CAAC;YAC/C;AACF,QAAA,CAAC;AAED,QAAA,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,gBAAgB,CAAC;AAEnD,QAAA,OAAO,YAAA,EAAM,OAAA,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,gBAAgB,CAAC,CAAA,CAAtD,CAAsD;IACrE,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,IAAM,iBAAiB,GAAG,YAAA;AACxB,QAAA,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE;YACtB;QACF;QAEA,IAAM,WAAW,GAAG,SAAS,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,KAAK;AAEnE,QAAA,IAAM,eAAe,GAAG,IAAI,CAAC,KAAK,CAChC,SAAS,CAAC,OAAO,CAAC,UAAU,GAAG,WAAW,CAC3C;QAED,mBAAmB,CAAC,eAAe,CAAC;AACtC,IAAA,CAAC;IAED,IAAM,oBAAoB,GAAG,QAAQ,CAAC,iBAAiB,EAAE,GAAG,CAAC;AAE7D,IAAA,SAAS,CAAC,YAAA;;QACR,CAAA,EAAA,GAAA,SAAS,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,gBAAgB,CAAC,QAAQ,EAAE,oBAAoB,EAAE;AAClE,YAAA,OAAO,EAAE,IAAI;AACd,SAAA,CAAC;QAEF,OAAO,CAAA,EAAA,GAAA,SAAS,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,mBAAmB,CAAC,QAAQ,EAAE,iBAAiB,CAAC;AAC5E,IAAA,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAM,iBAAiB,GAAG,UAAC,KAAkB,EAAA;AAC3C,QAAA,IAAI,SAAS,CAAC,OAAO,EAAE;AACrB,YAAA,IAAM,eAAe,GAAG,IAAI,CAAC,KAAK,CAChC,SAAS,CAAC,OAAO,CAAC,UAAU,GAAG,SAAS,CAAC,OAAO,CAAC,WAAW,CAC7D;AAED,YAAA,IAAM,SAAS,GAAG,KAAK,KAAK,MAAM,GAAG,CAAC,GAAG,EAAE;AAE3C,YAAA,IAAM,aAAW,GAAG,eAAe,GAAG,SAAS;AAE/C,YAAA,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC;AACvB,gBAAA,GAAG,EAAE,CAAC;gBACN,IAAI,EAAE,WAAW,GAAG,aAAW;AAC/B,gBAAA,QAAQ,EAAE,QAAQ;AACnB,aAAA,CAAC;AAEF,YAAA,mBAAmB,CAAC,YAAA;AAClB,gBAAA,OAAO,aAAW;AACpB,YAAA,CAAC,CAAC;QACJ;AACF,IAAA,CAAC;AAED,IAAA,IAAM,cAAc,GAAG,YAAA,EAAA,OAAA,SAAA,CAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,YAAA;;AACrB,YAAA,WAAW,CAAC,CAAC,QAAQ,CAAC;;;SACvB;AAED,IAAA,SAAS,CAAC,YAAA;AACR,QAAA,IAAI,SAAS,CAAC,OAAO,EAAE;YACrB;QACF;QAEA,IAAM,UAAU,GAAG,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC;QAEpD,IAAI,UAAU,EAAE;YACd,oBAAoB,CAAC,UAAU,CAAC;QAClC;AACF,IAAA,CAAC,EAAE,CAAC,QAAQ,EAAE,oBAAoB,CAAC,CAAC;AAEpC,IAAA,SAAS,CAAC,YAAA;AACR,QAAA,WAAW,CAAC,UAAU,EAAE,CAAC;IAC3B,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,SAAS,CAAC,YAAA;AACR,QAAA,kBAAkB,aAAlB,kBAAkB,KAAA,MAAA,GAAA,MAAA,GAAlB,kBAAkB,CAAG,gBAAgB,CAAC;;AAExC,IAAA,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC;IAEtB,OAAO;AACL,QAAA,WAAW,EAAA,WAAA;AACX,QAAA,QAAQ,EAAA,QAAA;AACR,QAAA,mBAAmB,EAAA,mBAAA;AACnB,QAAA,gBAAgB,EAAA,gBAAA;AAChB,QAAA,mBAAmB,EAAA,mBAAA;AACnB,QAAA,oBAAoB,EAAA,oBAAA;AACpB,QAAA,iBAAiB,EAAA,iBAAA;AACjB,QAAA,cAAc,EAAA,cAAA;AACd,QAAA,QAAQ,EAAA,QAAA;KACT;AACH,CAAC;;;;;;AC1ED,IAAM,eAAe,GAAG,UACtB,KAA8B,EAAA;;IAG5B,IAAA,OAAO,GAgBL,KAAK,CAAA,OAhBA,EACP,IAAI,GAeF,KAAK,CAAA,IAfH,EACJ,WAAW,GAcT,KAAK,YAdI,EACX,EAAA,GAaE,KAAK,CAAA,kBAb4B,EAAnC,kBAAkB,GAAA,EAAA,KAAA,MAAA,GAAG,cAAc,KAAA,EACnC,EAAA,GAYE,KAAK,CAAA,kBAZ4B,EAAnC,kBAAkB,GAAA,EAAA,KAAA,MAAA,GAAG,cAAc,KAAA,EACnC,kBAAkB,GAWhB,KAAK,CAAA,kBAXW,EAClB,cAAc,GAUZ,KAAK,CAAA,cAVO,EACd,EAAA,GASE,KAAK,CAAA,oBAToB,EAA3B,oBAAoB,GAAA,EAAA,KAAA,MAAA,GAAG,IAAI,KAAA,EAC3B,mBAAmB,GAQjB,KAAK,CAAA,mBARY,EACnB,YAAY,GAOV,KAAK,CAAA,YAPK,EACZ,KAME,KAAK,CAAA,eANY,EAAnB,eAAe,GAAA,EAAA,KAAA,MAAA,GAAG,CAAC,GAAA,EAAA,EACnB,SAAS,GAKP,KAAK,CAAA,SALE,EACT,gBAAgB,GAId,KAAK,CAAA,gBAJS,EAChB,qBAAqB,GAGnB,KAAK,sBAHc,EACrB,WAAW,GAET,KAAK,CAAA,WAFI,EACX,kBAAkB,GAChB,KAAK,CAAA,kBADW;AAGd,IAAA,IAAA,EAAA,GASF,kBAAkB,CAAC,EAAE,kBAAkB,EAAA,kBAAA,EAAE,CAAC,EAR5C,WAAW,GAAA,EAAA,CAAA,WAAA,EACX,QAAQ,cAAA,EACR,mBAAmB,GAAA,EAAA,CAAA,mBAAA,EACnB,gBAAgB,GAAA,EAAA,CAAA,gBAAA,EAChB,oBAAoB,0BAAA,EACpB,iBAAiB,GAAA,EAAA,CAAA,iBAAA,EACjB,cAAc,GAAA,EAAA,CAAA,cAAA,EACd,QAAQ,cACoC;IAExC,IAAA,EAAA,GAAoC,QAAQ,CAAgB,IAAI,CAAC,EAAhE,aAAa,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,gBAAgB,GAAA,EAAA,CAAA,CAAA,CAAiC;AACvE,IAAA,IAAM,eAAe,GAAG,MAAM,CAAiB,IAAI,CAAC;AAEpD,IAAA,IAAM,iBAAiB,GAAG,QAAA,CAAA,QAAA,CAAA,QAAA,CAAA,QAAA,CAAA,EACxB,cAAc,EAAE,EAAA,CAAA,MAAA,CAAG,WAAW,EAAA,IAAA,CAAI,EAAA,GAC9B,SAAS,GAAG,EAAE,aAAa,EAAE,EAAA,CAAA,MAAA,CAAG,SAAS,EAAA,IAAA,CAAI,EAAE,GAAG,EAAE,EAAC,GACrD;AACF,UAAE,EAAE,oBAAoB,EAAE,EAAA,CAAA,MAAA,CAAG,gBAAgB,OAAI;AACjD,UAAE,EAAE,EAAC,GACH;AACF,UAAE,EAAE,yBAAyB,EAAE,EAAA,CAAA,MAAA,CAAG,qBAAqB,OAAI;UACzD,EAAE,EAAC,GACH,WAAW,GAAG,EAAE,eAAe,EAAE,MAAM,EAAE,GAAG,EAAE,EAC5B;AAExB,IAAA,QACEA,GAAA,CAACC,sBAAU,EAAA,EAAC,MAAM,EAAE,oBAAoB,EAAA,QAAA,EACtCC,IAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE,iBAAiB,EACxB,SAAS,EAAE,UAAU,EAAA,EAAA,GAAA,EAAA;AACnB,gBAAA,EAAA,CAAC,UAAU,CAAC,YAAY,CAAA,GAAG,cAAc;AACzC,gBAAA,EAAA,CAAC,UAAU,CAAC,kBAAkB,CAAA,GAAG,oBAAoB;AACrD,gBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAEFF,GAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,eAAe,EACpB,EAAE,EAAE,QAAQ,EACZ,SAAS,EAAE,UAAU,CAAC,UAAU,CAAC,MAAM,EAAE,kBAAkB,KAAA,IAAA,IAAlB,kBAAkB,KAAA,MAAA,GAAA,MAAA,GAAlB,kBAAkB,CAAE,MAAM,CAAC,EAAA,QAAA,EAEpEA,GAAA,CAACG,0BAAc,EAAA,EAAA,QAAA,EACbH,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,UAAU,CAAC,SAAS,CAAC,EAAA,QAAA,EAC9CA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,UAAU,CAAC,oBAAoB,CAAC,CAAC,EAAA,QAAA,EAC1DE,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,iBAAiB,CAAC,EAAA,QAAA,EAAA,CAC3CF,GAAA,CAAC,WAAW,EAAA,EACV,OAAO,EAAE,iBAAiB,EAC1B,MAAM,EAAE;gDACN,IAAI,EAAE,gBAAgB,GAAG,CAAC;AAC1B,gDAAA,KAAK,EAAE,gBAAgB,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC;6CAC1C,EAAA,CACD,EACFA,GAAA,CAAC,GAAG,EAAA,EAEF,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EACzB,IAAI,EAAE,IAAI,EACV,WAAW,EAAA,IAAA,EACX,aAAa,EAAE,kBAAkB,KAAA,IAAA,IAAlB,kBAAkB,KAAA,MAAA,GAAA,MAAA,GAAlB,kBAAkB,CAAE,UAAU,EAAA,EALzC,kBAAkB,CAMtB,CAAA,EAAA,CACE,EAAA,CACF,EAAA,CACF,GACS,EAAA,CACb,EACNE,IAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,mBAAmB,EAAA,QAAA,EAAA,CAC1B,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC;4BACrB;AACG,iCAAA,MAAM,CACL,UAAC,WAAW,EAAA,EAAK,OAAA,CAAC,WAAW,IAAI,QAAQ,IAAI,WAAW,CAAC,OAAO,CAAA,CAA/C,CAA+C;AAEjE,iCAAA,GAAG,CAAC,UAAC,WAAW,EAAE,gBAAgB,EAAA;;;AACjC,gCAAA,IAAM,OAAO,GAAG,CAAA,EAAA,GAAA,WAAW,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,GAAG,CAAC,UAAC,IAAI,EAAE,KAAK,EAAA;;AACjD,oCAAA,IAAM,KAAK,GAAG,EAAA,CAAA,MAAA,CAAG,WAAW,CAAC,EAAE,EAAA,GAAA,CAAA,CAAA,MAAA,CAC7B,CAAA,EAAA,GAAA,IAAI,CAAC,GAAG,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO,EAAA,GAAA,CAAA,CAAA,MAAA,CACjB,KAAK,CAAE;;AAGX,oCAAA,IAAI,KAAK,KAAK,CAAC,IAAI,gBAAgB,KAAK,CAAC;AAAE,wCAAA,OAAO,IAAI;AAEtD,oCAAA,QACEF,GAAA,CAAC,GAAG,EAAA,EAEF,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,aAAa,EAAE,kBAAkB,KAAA,IAAA,IAAlB,kBAAkB,KAAA,MAAA,GAAA,MAAA,GAAlB,kBAAkB,CAAE,IAAI,EAAA,EAJlC,KAAK,CAKV;AAEN,gCAAA,CAAC,CAAC;AAEF,gCAAA,IAAM,QAAQ,GAAG,cAAA,CAAA,MAAA,CAAe,WAAW,CAAC,EAAE,CAAE;gCAEhD,QACEA,IAAC,QAAQ,EAAA,EAAA,QAAA,EACN,WAAW,CAAC,KAAK,IAAI,mBAAmB,IACvCA,GAAA,CAAC,aAAa,EAAA,EACZ,SAAS,EAAE,UAAU,CACnB,MAAM,EACN,kBAAkB,KAAA,IAAA,IAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,kBAAkB,CACvC,EACD,KAAK,EAAE,WAAW,CAAC,KAAK,EACxB,eAAe,EAAC,SAAS,EACzB,MAAM,EAAE,aAAa,KAAK,WAAW,CAAC,EAAE,EACxC,QAAQ,EAAE,YAAA;4CACR,OAAA,gBAAgB,CAAC,UAAC,IAAI,EAAA;AACpB,gDAAA,OAAA,IAAI,KAAK,WAAW,CAAC,EAAE,GAAG,IAAI,GAAG,WAAW,CAAC,EAAE;AAA/C,4CAAA,CAA+C,CAChD;AAFD,wCAAA,CAEC,EAEH,YAAY,EAAE,YAAY,EAC1B,eAAe,EACb,eAAe;AACf,6CAAC,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,eAAe,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,qBAAqB,EAAA,CAC5C,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,CAAC,CAAC,EAAA,QAAA,EAGjBA,IAACG,0BAAc,EAAA,EAAA,QAAA,EACbH,GAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,UAAU,CACnB,UAAU,CAAC,SAAS,EACpB,MAAM,EACN,kBAAkB,KAAA,IAAA,IAAlB,kBAAkB,KAAA,MAAA,GAAA,MAAA,GAAlB,kBAAkB,CAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AAE3B,oDAAA,EAAA,CAAC,UAAU,CAAC,YAAY,CAAA,GAAG,cAAc;AAE5C,oDAAA,EAAA,EAAA,EAAA,QAAA,EAEDA,GAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,UAAU,CACnB,UAAU,CAAC,oBAAoB,CAAC,CACjC,EAAA,QAAA,EAEDA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,iBAAiB,CAAC,EAAA,QAAA,EAC1C,OAAO,EAAA,CACJ,EAAA,CACF,GACF,EAAA,CACS,EAAA,CACH,KAEhBA,GAAA,CAAA,SAAA,EAAA,EAEE,SAAS,EAAE,UAAU,CACnB,UAAU,CAAC,OAAO,EAClB,kBAAkB,aAAlB,kBAAkB,KAAA,MAAA,GAAA,MAAA,GAAlB,kBAAkB,CAAE,OAAO,CAC5B,EAAA,QAAA,EAEDA,GAAA,CAACG,0BAAc,EAAA,EAAA,QAAA,EACbH,GAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,UAAU,CACnB,UAAU,CAAC,SAAS,EACpB,MAAM,EACN,kBAAkB,KAAA,IAAA,IAAlB,kBAAkB,KAAA,MAAA,GAAA,MAAA,GAAlB,kBAAkB,CAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AAE3B,oDAAA,EAAA,CAAC,UAAU,CAAC,YAAY,CAAA,GAAG,cAAc;AAE5C,oDAAA,EAAA,EAAA,EAAA,QAAA,EAEDA,aACE,SAAS,EAAE,UAAU,CACnB,UAAU,CAAC,oBAAoB,CAAC,CACjC,YAEDE,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,iBAAiB,CAAC,EAAA,QAAA,EAAA;AAEzC;;AAEG;4DACH,WAAW,CAAC,KAAK,IAAI,CAAC,mBAAmB,KACvCF,aAAK,SAAS,EAAE,UAAU,CAAC,aAAa,CAAC,EAAA,QAAA,EACvCA,GAAA,CAAA,IAAA,EAAA,EACE,SAAS,EAAE,OAAA,CAAA,MAAA,CAAQ,UAAU,CAAC,MAAM,CAAE,EAAA,QAAA,EAErC,WAAW,CAAC,KAAK,EAAA,CACf,GACD,CACP,EAEF,OAAO,CAAA,EAAA,CACJ,EAAA,CACF,GACF,EAAA,CACS,EAAA,EAzCZ,QAAQ,CA0CL,CACX,IA1FY,QAAQ,CA2FZ;AAEf,4BAAA,CAAC,CAAC,EACL,WAAW,KACVA,GAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,UAAU,CACnB,UAAU,CAAC,wBAAwB,CAAC,EACpC,UAAU,CAAC,MAAM,EACjB,MAAM,CACP,EAAA,QAAA,EAEDA,GAAA,CAAA,KAAA,EAAA,EAAA,QAAA,EACEE,iBACE,SAAS,EAAE,UAAU,CACnB,4BAA4B,EAC5B,UAAU,CAAC,qBAAqB,CAAC,EACjC,kBAAkB,KAAA,IAAA,IAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,iBAAiB,CACtC,EACD,OAAO,EAAE,cAAc,EACvB,IAAI,EAAC,QAAQ,EAAA,QAAA,EAAA,CAEZ,QAAQ,GAAG,kBAAkB,GAAG,kBAAkB,EACnDF,GAAA,CAAC,OAAO,IACN,SAAS,EAAE,QAAQ,GAAG,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,EAAA,CACtD,CAAA,EAAA,CACK,GACL,EAAA,CACF,CACP,IACG,CAAA,EAAA,CACF,EAAA,CACK;AAEjB;;;;"}

package/dist/esm/components/comparisonTable/index.stories.js CHANGED Viewed

@@ -1,27 +1,27 @@
 import { jsx } from 'react/jsx-runtime';
 import { ComparisonTable } from './index.js';
+import 'react';
+import '../../index-DLQEsiym.js';
 import { CardButton } from '../cards/cardButton/index.js';
 import TableButton from './components/TableButton/index.js';
-import TableRowHeader from './components/TableRowHeader/index.js';
 import TableRating from './components/TableRating/index.js';
+import TableRowHeader from './components/TableRowHeader/index.js';
 import TableTrueFalse from './components/TableTrueFalse.js';
-import '../../tslib.es6-a39f91fc.js';
-import '../../index-6ea95111.js';
-import 'react';
-import '../../index-caeac7cd.js';
-import '../../_commonjsHelpers-4730bd53.js';
+import '../../tslib.es6-CVlKGIvp.js';
+import '../../index-CqsS0Elu.js';
+import './components/AccordionItem/AccordionItem.js';
+import '../../index-DYcCCrfR.js';
+import '../../style-inject.es-tgCJW-Cu.js';
 import './components/Chevron.js';
 import './components/Row/index.js';
-import '../../style-inject.es-1f59c1d0.js';
 import './components/TableArrows/index.js';
 import './components/TableArrows/Arrow.js';
 import './components/TableInfoButton/index.js';
 import '../icon/icons/Info.js';
 import '../icon/IconWrapper/IconWrapper.js';
-import '../../index-5e72c3d4.js';
-import '../../index-69a46657.js';
-import './components/AccordionItem/AccordionItem.js';
-import '../../index-a0ef2ab4.js';
+import '../../_commonjsHelpers-BFTU3MAI.js';
+import '../../index-BClARCFl.js';
+import '../../index-CNcEE5dn.js';
 import '../icon/icons/ChevronRight.js';
 import '../cards/card/index.js';
 import './components/TableRating/StarIcon.js';
@@ -248,6 +248,12 @@ var story = {
         collapsibleSections: {
             description: 'Make table groups with a label collapsible',
         },
+        scrollOnOpen: {
+            description: 'When enabled, the page scrolls to the top of a newly expanded section.',
+        },
+        scrollTopOffset: {
+            description: 'Offset in pixels from the top of the viewport when scrolling to an expanded section.',
+        },
         cellWidth: {
             description: 'Width of a table content cell',
         },
@@ -266,8 +272,8 @@ var story = {
         onSelectionChanged: {
             description: 'Callback to be called when the selected tab index changes on mobile',
             table: {
-                category: 'Callbacks'
-            }
+                category: 'Callbacks',
+            },
         },
     },
     args: {
@@ -278,7 +284,9 @@ var story = {
         showDetailsCaption: 'Show details',
         hideScrollBars: false,
         hideScrollBarsMobile: true,
-        collapsibleSections: false,
+        collapsibleSections: true,
+        scrollOnOpen: true,
+        scrollTopOffset: 0,
         cellWidth: undefined,
         firstColumnWidth: undefined,
         stickyHeaderTopOffset: 0,
@@ -291,19 +299,20 @@ var story = {
             collapsibleSection: '',
             section: '',
             hideDetailsButton: '',
-        }
+        },
     },
     parameters: {
         componentSubtitle: 'The Comparison Table component provides an easy way to compare vast amounts of information in a fast and easy way.',
     },
 };
-var ComparisonTableStory = function (_a) {
-    var data = _a.data, headers = _a.headers, collapsibleSections = _a.collapsibleSections, hideDetails = _a.hideDetails, classNameOverrides = _a.classNameOverrides, hideDetailsCaption = _a.hideDetailsCaption, showDetailsCaption = _a.showDetailsCaption, hideScrollBars = _a.hideScrollBars, hideScrollBarsMobile = _a.hideScrollBarsMobile, cellWidth = _a.cellWidth, firstColumnWidth = _a.firstColumnWidth, stickyHeaderTopOffset = _a.stickyHeaderTopOffset, growContent = _a.growContent;
-    return (jsx("div", { className: 'bg-white', children: jsx(ComparisonTable, { data: data, headers: headers, collapsibleSections: collapsibleSections, hideDetails: hideDetails, classNameOverrides: classNameOverrides, hideDetailsCaption: hideDetailsCaption, showDetailsCaption: showDetailsCaption, hideScrollBars: hideScrollBars, hideScrollBarsMobile: hideScrollBarsMobile, cellWidth: cellWidth, firstColumnWidth: firstColumnWidth, stickyHeaderTopOffset: stickyHeaderTopOffset, growContent: growContent }) }));
+var ComparisonTableStory = {
+    render: function (_a) {
+        var data = _a.data, headers = _a.headers, collapsibleSections = _a.collapsibleSections, scrollOnOpen = _a.scrollOnOpen, scrollTopOffset = _a.scrollTopOffset, hideDetails = _a.hideDetails, classNameOverrides = _a.classNameOverrides, hideDetailsCaption = _a.hideDetailsCaption, showDetailsCaption = _a.showDetailsCaption, hideScrollBars = _a.hideScrollBars, hideScrollBarsMobile = _a.hideScrollBarsMobile, cellWidth = _a.cellWidth, firstColumnWidth = _a.firstColumnWidth, stickyHeaderTopOffset = _a.stickyHeaderTopOffset, growContent = _a.growContent;
+        return (jsx("div", { className: "bg-white", children: jsx(ComparisonTable, { data: data, headers: headers, collapsibleSections: collapsibleSections, scrollOnOpen: scrollOnOpen, scrollTopOffset: scrollTopOffset, hideDetails: hideDetails, classNameOverrides: classNameOverrides, hideDetailsCaption: hideDetailsCaption, showDetailsCaption: showDetailsCaption, hideScrollBars: hideScrollBars, hideScrollBarsMobile: hideScrollBarsMobile, cellWidth: cellWidth, firstColumnWidth: firstColumnWidth, stickyHeaderTopOffset: stickyHeaderTopOffset, growContent: growContent }) }));
+    },
+    name: 'ComparisonTable',
 };
-ComparisonTableStory.storyName = "ComparisonTable";
 var HeaderType = function () { return (jsx("pre", { children: "export interface Header<T> {\n    id: number;\n    label?: React.ReactNode;\n    cells: Array<Cell<T>>;\n    default?: boolean;\n  }" })); };
-export default story;
-export { ComparisonTableStory, HeaderType };
+export { ComparisonTableStory, HeaderType, story as default };
 //# sourceMappingURL=index.stories.js.map

package/dist/esm/components/comparisonTable/index.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.stories.js","sources":["../../../../../src/lib/components/comparisonTable/index.stories.tsx"],"sourcesContent":["import { ComparisonTable, ComparisonTableProps, TableButton, TableRating, TableRowHeader, TableTrueFalse } from '.';\nimport { CardButton } from '../cards';\n\nconst headers = [\n {\n id: 1,\n default: true,\n cells: [\n {\n id: 1,\n key: 'name',\n label: 'Films',\n render: (value: string) => (\n <TableButton onClick={() => {}}>{value}</TableButton>\n ),\n },\n {\n id: 2,\n key: 'country',\n label: 'Country',\n },\n {\n id: 4,\n key: 'imdb',\n label: 'IMDB rating',\n render: (value: string) => (\n <TableButton onClick={() => {}}>{value}</TableButton>\n ),\n },\n {\n id: 3,\n key: 'rating',\n label: (\n <TableRowHeader\n label=\"Our rating of movies found online on IMDB lists\"\n onClickInfo={() => {}}\n />\n ),\n render: (value: number) => (\n <TableButton onClick={() => {}}>\n <TableRating type=\"star\" rating={value} />\n </TableButton>\n ),\n },\n {\n id: 5,\n key: 'recommended',\n label: (\n <TableRowHeader\n label=\"Recommended\"\n subtitle=\"Our favourites\"\n onClickInfo={() => {}}\n />\n ),\n render: (value: number) => <TableRating type=\"zap\" rating={value} />,\n },\n {\n id: 5,\n key: 'familyFriendly',\n label: 'Family friendly',\n render: (value: boolean) => <TableTrueFalse value={value} />,\n },\n {\n id: 6,\n key: 'boxOffice',\n label: 'Box office',\n render: (value: number) =>\n value.toLocaleString('de-DE', {\n style: 'currency',\n currency: 'EUR',\n }),\n },\n ],\n },\n {\n id: 2,\n label: 'SUBSECTION',\n cells: [\n {\n id: 1,\n key: 'name',\n label: 'Films',\n },\n {\n id: 2,\n key: 'country',\n label: 'Country',\n },\n {\n id: 4,\n key: 'imdb',\n label: 'IMDB rating',\n },\n {\n id: 3,\n key: 'rating',\n label: 'Our rating',\n render: (value: number) => <TableRating type=\"star\" rating={value} />,\n },\n {\n id: 5,\n key: 'recommended',\n label: 'Recommended',\n render: (value: number) => <TableRating type=\"zap\" rating={value} />,\n },\n {\n id: 5,\n key: 'familyFriendly',\n label: 'Family friendly',\n render: (value: boolean) => <TableTrueFalse value={value} />,\n },\n {\n id: 6,\n key: 'boxOffice',\n label: 'Box office',\n render: (value: number) =>\n value.toLocaleString('de-DE', {\n style: 'currency',\n currency: 'EUR',\n }),\n },\n {\n addonId: 'addon-movies',\n label: (\n <CardButton\n title=\"All Review\"\n description=\"Click here to read all reviews\"\n onClick={() => {}}\n />\n ),\n },\n ],\n },\n {\n id: 3,\n label: 'SUBSECTION 2',\n cells: [\n {\n id: 1,\n key: 'name',\n label: 'Films',\n },\n {\n id: 2,\n key: 'country',\n label: 'Country',\n },\n {\n id: 4,\n key: 'imdb',\n label: 'IMDB rating',\n },\n {\n id: 3,\n key: 'rating',\n label: 'Our rating',\n render: (value: number) => <TableRating type=\"star\" rating={value} />,\n },\n {\n id: 5,\n key: 'recommended',\n label: 'Recommended',\n render: (value: number) => <TableRating type=\"zap\" rating={value} />,\n },\n {\n id: 5,\n key: 'familyFriendly',\n label: 'Family friendly',\n render: (value: boolean) => <TableTrueFalse value={value} />,\n },\n {\n id: 6,\n key: 'boxOffice',\n label: 'Box office',\n render: (value: number) =>\n value.toLocaleString('de-DE', {\n style: 'currency',\n currency: 'EUR',\n }),\n },\n ],\n },\n];\n\nconst data = [\n {\n id: 1,\n name: 'Pulp Fiction',\n country: 'United States',\n year: '1994',\n rating: 3,\n imdb: 8.9,\n recommended: 3,\n familyFriendly: false,\n boxOffice: 213928762,\n },\n {\n id: 2,\n name: 'Parasite',\n country: 'South Korea',\n year: '2019',\n rating: 2,\n imdb: 8.6,\n recommended: 3,\n familyFriendly: false,\n boxOffice: 355475245,\n },\n {\n id: 3,\n name: 'Spirited Away',\n country: 'Japan',\n year: '2001',\n rating: 3,\n imdb: 8.6,\n recommended: 3,\n familyFriendly: true,\n boxOffice: 258908054,\n },\n];\n\nconst story = {\n title: 'JSX/ComparisonTable',\n component: ComparisonTable,\n argTypes: {\n headers: {\n description: 'The structure of the table',\n },\n data: {\n description: 'The title text that needs to be displayed',\n },\n hideDetails: {\n description: 'Hide table groups that do not have the `default` attribute',\n },\n hideDetailsCaption: {\n description: 'Caption of the button to hide the details',\n },\n showDetailsCaption: {\n description: 'Caption of the button to show the details',\n },\n hideScrollBars: {\n description: 'Hide scroll bars',\n },\n\n hideScrollBarsMobile: {\n description: 'Hide scroll bars on mobile only',\n },\n collapsibleSections: {\n description: 'Make table groups with a label collapsible',\n },\n cellWidth: {\n description: 'Width of a table content cell',\n },\n firstColumnWidth: {\n description: 'Width of the first column of the table',\n },\n stickyHeaderTopOffset: {\n description: 'Y-offset of the sticky header row',\n },\n\n growContent: {\n description: 'Makes the content area grow to fill the available space',\n },\n classNameOverrides: {\n description: '\"className\" props to be passed down to various internal components',\n },\n onSelectionChanged: {\n description: 'Callback to be called when the selected tab index changes on mobile',\n table: {\n category: 'Callbacks'\n }\n },\n },\n args: {\n data,\n headers,\n hideDetails: false,\n hideDetailsCaption: 'Hide details',\n showDetailsCaption: 'Show details',\n hideScrollBars: false,\n hideScrollBarsMobile: true,\n collapsibleSections: false,\n cellWidth: undefined,\n firstColumnWidth: undefined,\n stickyHeaderTopOffset: 0,\n growContent: false,\n classNameOverrides: {\n header: '',\n container: '',\n cell: '',\n headerCell: '',\n collapsibleSection: '',\n section: '',\n hideDetailsButton: '',\n }\n },\n parameters: {\n componentSubtitle: 'The Comparison Table component provides an easy way to compare vast amounts of information in a fast and easy way.',\n },\n};\n\ninterface Data {\n id: number;\n name: string;\n country: string;\n year: string;\n rating: number;\n imdb: number;\n recommended: number;\n familyFriendly: boolean;\n boxOffice: number;\n}\n\nexport const ComparisonTableStory = ({\n data,\n headers,\n collapsibleSections,\n hideDetails,\n classNameOverrides,\n hideDetailsCaption,\n showDetailsCaption,\n hideScrollBars,\n hideScrollBarsMobile,\n cellWidth,\n firstColumnWidth,\n stickyHeaderTopOffset,\n growContent,\n}: ComparisonTableProps<Data>) => (\n <div className='bg-white'> \n <ComparisonTable\n data={data}\n headers={headers}\n collapsibleSections={collapsibleSections}\n hideDetails={hideDetails}\n classNameOverrides={classNameOverrides}\n hideDetailsCaption={hideDetailsCaption}\n showDetailsCaption={showDetailsCaption}\n hideScrollBars={hideScrollBars}\n hideScrollBarsMobile={hideScrollBarsMobile}\n cellWidth={cellWidth}\n firstColumnWidth={firstColumnWidth}\n stickyHeaderTopOffset={stickyHeaderTopOffset}\n growContent={growContent}\n />\n </div>\n);\n\nComparisonTableStory.storyName = \"ComparisonTable\";\n\nexport const HeaderType = () => (\n <pre>\n {`export interface Header<T> {\n id: number;\n label?: React.ReactNode;\n cells: Array<Cell<T>>;\n default?: boolean;\n }`}\n </pre>\n)\n\nexport default story;\n"],"names":["_jsx"],"mappings":"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"}
1	+ {"version":3,"file":"index.stories.js","sources":["../../../../../src/lib/components/comparisonTable/index.stories.tsx"],"sourcesContent":["import {\n ComparisonTable,\n ComparisonTableProps,\n TableButton,\n TableRating,\n TableRowHeader,\n TableTrueFalse,\n} from '.';\nimport { CardButton } from '../cards';\n\nconst headers = [\n {\n id: 1,\n default: true,\n cells: [\n {\n id: 1,\n key: 'name',\n label: 'Films',\n render: (value: string) => (\n <TableButton onClick={() => {}}>{value}</TableButton>\n ),\n },\n {\n id: 2,\n key: 'country',\n label: 'Country',\n },\n {\n id: 4,\n key: 'imdb',\n label: 'IMDB rating',\n render: (value: string) => (\n <TableButton onClick={() => {}}>{value}</TableButton>\n ),\n },\n {\n id: 3,\n key: 'rating',\n label: (\n <TableRowHeader\n label=\"Our rating of movies found online on IMDB lists\"\n onClickInfo={() => {}}\n />\n ),\n render: (value: number) => (\n <TableButton onClick={() => {}}>\n <TableRating type=\"star\" rating={value} />\n </TableButton>\n ),\n },\n {\n id: 5,\n key: 'recommended',\n label: (\n <TableRowHeader\n label=\"Recommended\"\n subtitle=\"Our favourites\"\n onClickInfo={() => {}}\n />\n ),\n render: (value: number) => <TableRating type=\"zap\" rating={value} />,\n },\n {\n id: 5,\n key: 'familyFriendly',\n label: 'Family friendly',\n render: (value: boolean) => <TableTrueFalse value={value} />,\n },\n {\n id: 6,\n key: 'boxOffice',\n label: 'Box office',\n render: (value: number) =>\n value.toLocaleString('de-DE', {\n style: 'currency',\n currency: 'EUR',\n }),\n },\n ],\n },\n {\n id: 2,\n label: 'SUBSECTION',\n cells: [\n {\n id: 1,\n key: 'name',\n label: 'Films',\n },\n {\n id: 2,\n key: 'country',\n label: 'Country',\n },\n {\n id: 4,\n key: 'imdb',\n label: 'IMDB rating',\n },\n {\n id: 3,\n key: 'rating',\n label: 'Our rating',\n render: (value: number) => <TableRating type=\"star\" rating={value} />,\n },\n {\n id: 5,\n key: 'recommended',\n label: 'Recommended',\n render: (value: number) => <TableRating type=\"zap\" rating={value} />,\n },\n {\n id: 5,\n key: 'familyFriendly',\n label: 'Family friendly',\n render: (value: boolean) => <TableTrueFalse value={value} />,\n },\n {\n id: 6,\n key: 'boxOffice',\n label: 'Box office',\n render: (value: number) =>\n value.toLocaleString('de-DE', {\n style: 'currency',\n currency: 'EUR',\n }),\n },\n {\n addonId: 'addon-movies',\n label: (\n <CardButton\n title=\"All Review\"\n description=\"Click here to read all reviews\"\n onClick={() => {}}\n />\n ),\n },\n ],\n },\n {\n id: 3,\n label: 'SUBSECTION 2',\n cells: [\n {\n id: 1,\n key: 'name',\n label: 'Films',\n },\n {\n id: 2,\n key: 'country',\n label: 'Country',\n },\n {\n id: 4,\n key: 'imdb',\n label: 'IMDB rating',\n },\n {\n id: 3,\n key: 'rating',\n label: 'Our rating',\n render: (value: number) => <TableRating type=\"star\" rating={value} />,\n },\n {\n id: 5,\n key: 'recommended',\n label: 'Recommended',\n render: (value: number) => <TableRating type=\"zap\" rating={value} />,\n },\n {\n id: 5,\n key: 'familyFriendly',\n label: 'Family friendly',\n render: (value: boolean) => <TableTrueFalse value={value} />,\n },\n {\n id: 6,\n key: 'boxOffice',\n label: 'Box office',\n render: (value: number) =>\n value.toLocaleString('de-DE', {\n style: 'currency',\n currency: 'EUR',\n }),\n },\n ],\n },\n];\n\nconst data = [\n {\n id: 1,\n name: 'Pulp Fiction',\n country: 'United States',\n year: '1994',\n rating: 3,\n imdb: 8.9,\n recommended: 3,\n familyFriendly: false,\n boxOffice: 213928762,\n },\n {\n id: 2,\n name: 'Parasite',\n country: 'South Korea',\n year: '2019',\n rating: 2,\n imdb: 8.6,\n recommended: 3,\n familyFriendly: false,\n boxOffice: 355475245,\n },\n {\n id: 3,\n name: 'Spirited Away',\n country: 'Japan',\n year: '2001',\n rating: 3,\n imdb: 8.6,\n recommended: 3,\n familyFriendly: true,\n boxOffice: 258908054,\n },\n];\n\nconst story = {\n title: 'JSX/ComparisonTable',\n component: ComparisonTable,\n argTypes: {\n headers: {\n description: 'The structure of the table',\n },\n data: {\n description: 'The title text that needs to be displayed',\n },\n hideDetails: {\n description: 'Hide table groups that do not have the `default` attribute',\n },\n hideDetailsCaption: {\n description: 'Caption of the button to hide the details',\n },\n showDetailsCaption: {\n description: 'Caption of the button to show the details',\n },\n hideScrollBars: {\n description: 'Hide scroll bars',\n },\n\n hideScrollBarsMobile: {\n description: 'Hide scroll bars on mobile only',\n },\n collapsibleSections: {\n description: 'Make table groups with a label collapsible',\n },\n scrollOnOpen: {\n description:\n 'When enabled, the page scrolls to the top of a newly expanded section.',\n },\n scrollTopOffset: {\n description:\n 'Offset in pixels from the top of the viewport when scrolling to an expanded section.',\n },\n cellWidth: {\n description: 'Width of a table content cell',\n },\n firstColumnWidth: {\n description: 'Width of the first column of the table',\n },\n stickyHeaderTopOffset: {\n description: 'Y-offset of the sticky header row',\n },\n\n growContent: {\n description: 'Makes the content area grow to fill the available space',\n },\n classNameOverrides: {\n description:\n '\"className\" props to be passed down to various internal components',\n },\n onSelectionChanged: {\n description:\n 'Callback to be called when the selected tab index changes on mobile',\n table: {\n category: 'Callbacks',\n },\n },\n },\n args: {\n data,\n headers,\n hideDetails: false,\n hideDetailsCaption: 'Hide details',\n showDetailsCaption: 'Show details',\n hideScrollBars: false,\n hideScrollBarsMobile: true,\n collapsibleSections: true,\n scrollOnOpen: true,\n scrollTopOffset: 0,\n cellWidth: undefined,\n firstColumnWidth: undefined,\n stickyHeaderTopOffset: 0,\n growContent: false,\n classNameOverrides: {\n header: '',\n container: '',\n cell: '',\n headerCell: '',\n collapsibleSection: '',\n section: '',\n hideDetailsButton: '',\n },\n },\n parameters: {\n componentSubtitle:\n 'The Comparison Table component provides an easy way to compare vast amounts of information in a fast and easy way.',\n },\n};\n\ninterface Data {\n id: number;\n name: string;\n country: string;\n year: string;\n rating: number;\n imdb: number;\n recommended: number;\n familyFriendly: boolean;\n boxOffice: number;\n}\n\nexport const ComparisonTableStory = {\n render: ({\n data,\n headers,\n collapsibleSections,\n scrollOnOpen,\n scrollTopOffset,\n hideDetails,\n classNameOverrides,\n hideDetailsCaption,\n showDetailsCaption,\n hideScrollBars,\n hideScrollBarsMobile,\n cellWidth,\n firstColumnWidth,\n stickyHeaderTopOffset,\n growContent,\n }: ComparisonTableProps<Data>) => (\n <div className=\"bg-white\">\n <ComparisonTable\n data={data}\n headers={headers}\n collapsibleSections={collapsibleSections}\n scrollOnOpen={scrollOnOpen}\n scrollTopOffset={scrollTopOffset}\n hideDetails={hideDetails}\n classNameOverrides={classNameOverrides}\n hideDetailsCaption={hideDetailsCaption}\n showDetailsCaption={showDetailsCaption}\n hideScrollBars={hideScrollBars}\n hideScrollBarsMobile={hideScrollBarsMobile}\n cellWidth={cellWidth}\n firstColumnWidth={firstColumnWidth}\n stickyHeaderTopOffset={stickyHeaderTopOffset}\n growContent={growContent}\n />\n </div>\n ),\n\n name: 'ComparisonTable',\n};\n\nexport const HeaderType = () => (\n <pre>\n {`export interface Header<T> {\n id: number;\n label?: React.ReactNode;\n cells: Array<Cell<T>>;\n default?: boolean;\n }`}\n </pre>\n);\n\nexport default story;\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,IAAM,OAAO,GAAG;AACd,IAAA;AACE,QAAA,EAAE,EAAE,CAAC;AACL,QAAA,OAAO,EAAE,IAAI;AACb,QAAA,KAAK,EAAE;AACL,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,MAAM;AACX,gBAAA,KAAK,EAAE,OAAO;AACd,gBAAA,MAAM,EAAE,UAAC,KAAa,IAAK,QACzBA,IAAC,WAAW,EAAA,EAAC,OAAO,EAAE,cAAO,CAAC,EAAA,QAAA,EAAG,KAAK,EAAA,CAAe,GAD5B,CAE1B;AACF,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,SAAS;AACd,gBAAA,KAAK,EAAE,SAAS;AACjB,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,MAAM;AACX,gBAAA,KAAK,EAAE,aAAa;AACpB,gBAAA,MAAM,EAAE,UAAC,KAAa,IAAK,QACzBA,IAAC,WAAW,EAAA,EAAC,OAAO,EAAE,cAAO,CAAC,EAAA,QAAA,EAAG,KAAK,EAAA,CAAe,GAD5B,CAE1B;AACF,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,QAAQ;AACb,gBAAA,KAAK,GACHA,GAAA,CAAC,cAAc,IACb,KAAK,EAAC,iDAAiD,EACvD,WAAW,EAAE,YAAA,EAAO,CAAC,GACrB,CACH;AACD,gBAAA,MAAM,EAAE,UAAC,KAAa,EAAA,EAAK,QACzBA,GAAA,CAAC,WAAW,EAAA,EAAC,OAAO,EAAE,YAAA,EAAO,CAAC,EAAA,QAAA,EAC5BA,GAAA,CAAC,WAAW,EAAA,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAE,KAAK,EAAA,CAAI,EAAA,CAC9B,EACf,CAJ0B,CAI1B;AACF,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,aAAa;AAClB,gBAAA,KAAK,GACHA,GAAA,CAAC,cAAc,EAAA,EACb,KAAK,EAAC,aAAa,EACnB,QAAQ,EAAC,gBAAgB,EACzB,WAAW,EAAE,YAAA,EAAO,CAAC,GACrB,CACH;AACD,gBAAA,MAAM,EAAE,UAAC,KAAa,EAAA,EAAK,OAAAA,IAAC,WAAW,EAAA,EAAC,IAAI,EAAC,KAAK,EAAC,MAAM,EAAE,KAAK,EAAA,CAAI,EAAzC,CAAyC;AACrE,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,gBAAgB;AACrB,gBAAA,KAAK,EAAE,iBAAiB;AACxB,gBAAA,MAAM,EAAE,UAAC,KAAc,EAAA,EAAK,OAAAA,GAAA,CAAC,cAAc,EAAA,EAAC,KAAK,EAAE,KAAK,EAAA,CAAI,EAAhC,CAAgC;AAC7D,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,WAAW;AAChB,gBAAA,KAAK,EAAE,YAAY;gBACnB,MAAM,EAAE,UAAC,KAAa,EAAA;AACpB,oBAAA,OAAA,KAAK,CAAC,cAAc,CAAC,OAAO,EAAE;AAC5B,wBAAA,KAAK,EAAE,UAAU;AACjB,wBAAA,QAAQ,EAAE,KAAK;qBAChB,CAAC;gBAHF,CAGE;AACL,aAAA;AACF,SAAA;AACF,KAAA;AACD,IAAA;AACE,QAAA,EAAE,EAAE,CAAC;AACL,QAAA,KAAK,EAAE,YAAY;AACnB,QAAA,KAAK,EAAE;AACL,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,MAAM;AACX,gBAAA,KAAK,EAAE,OAAO;AACf,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,SAAS;AACd,gBAAA,KAAK,EAAE,SAAS;AACjB,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,MAAM;AACX,gBAAA,KAAK,EAAE,aAAa;AACrB,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,QAAQ;AACb,gBAAA,KAAK,EAAE,YAAY;AACnB,gBAAA,MAAM,EAAE,UAAC,KAAa,EAAA,EAAK,OAAAA,IAAC,WAAW,EAAA,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAE,KAAK,EAAA,CAAI,EAA1C,CAA0C;AACtE,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,aAAa;AAClB,gBAAA,KAAK,EAAE,aAAa;AACpB,gBAAA,MAAM,EAAE,UAAC,KAAa,EAAA,EAAK,OAAAA,IAAC,WAAW,EAAA,EAAC,IAAI,EAAC,KAAK,EAAC,MAAM,EAAE,KAAK,EAAA,CAAI,EAAzC,CAAyC;AACrE,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,gBAAgB;AACrB,gBAAA,KAAK,EAAE,iBAAiB;AACxB,gBAAA,MAAM,EAAE,UAAC,KAAc,EAAA,EAAK,OAAAA,GAAA,CAAC,cAAc,EAAA,EAAC,KAAK,EAAE,KAAK,EAAA,CAAI,EAAhC,CAAgC;AAC7D,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,WAAW;AAChB,gBAAA,KAAK,EAAE,YAAY;gBACnB,MAAM,EAAE,UAAC,KAAa,EAAA;AACpB,oBAAA,OAAA,KAAK,CAAC,cAAc,CAAC,OAAO,EAAE;AAC5B,wBAAA,KAAK,EAAE,UAAU;AACjB,wBAAA,QAAQ,EAAE,KAAK;qBAChB,CAAC;gBAHF,CAGE;AACL,aAAA;AACD,YAAA;AACE,gBAAA,OAAO,EAAE,cAAc;AACvB,gBAAA,KAAK,GACHA,GAAA,CAAC,UAAU,EAAA,EACT,KAAK,EAAC,YAAY,EAClB,WAAW,EAAC,gCAAgC,EAC5C,OAAO,EAAE,YAAA,EAAO,CAAC,GACjB,CACH;AACF,aAAA;AACF,SAAA;AACF,KAAA;AACD,IAAA;AACE,QAAA,EAAE,EAAE,CAAC;AACL,QAAA,KAAK,EAAE,cAAc;AACrB,QAAA,KAAK,EAAE;AACL,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,MAAM;AACX,gBAAA,KAAK,EAAE,OAAO;AACf,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,SAAS;AACd,gBAAA,KAAK,EAAE,SAAS;AACjB,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,MAAM;AACX,gBAAA,KAAK,EAAE,aAAa;AACrB,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,QAAQ;AACb,gBAAA,KAAK,EAAE,YAAY;AACnB,gBAAA,MAAM,EAAE,UAAC,KAAa,EAAA,EAAK,OAAAA,IAAC,WAAW,EAAA,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAE,KAAK,EAAA,CAAI,EAA1C,CAA0C;AACtE,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,aAAa;AAClB,gBAAA,KAAK,EAAE,aAAa;AACpB,gBAAA,MAAM,EAAE,UAAC,KAAa,EAAA,EAAK,OAAAA,IAAC,WAAW,EAAA,EAAC,IAAI,EAAC,KAAK,EAAC,MAAM,EAAE,KAAK,EAAA,CAAI,EAAzC,CAAyC;AACrE,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,gBAAgB;AACrB,gBAAA,KAAK,EAAE,iBAAiB;AACxB,gBAAA,MAAM,EAAE,UAAC,KAAc,EAAA,EAAK,OAAAA,GAAA,CAAC,cAAc,EAAA,EAAC,KAAK,EAAE,KAAK,EAAA,CAAI,EAAhC,CAAgC;AAC7D,aAAA;AACD,YAAA;AACE,gBAAA,EAAE,EAAE,CAAC;AACL,gBAAA,GAAG,EAAE,WAAW;AAChB,gBAAA,KAAK,EAAE,YAAY;gBACnB,MAAM,EAAE,UAAC,KAAa,EAAA;AACpB,oBAAA,OAAA,KAAK,CAAC,cAAc,CAAC,OAAO,EAAE;AAC5B,wBAAA,KAAK,EAAE,UAAU;AACjB,wBAAA,QAAQ,EAAE,KAAK;qBAChB,CAAC;gBAHF,CAGE;AACL,aAAA;AACF,SAAA;AACF,KAAA;CACF;AAED,IAAM,IAAI,GAAG;AACX,IAAA;AACE,QAAA,EAAE,EAAE,CAAC;AACL,QAAA,IAAI,EAAE,cAAc;AACpB,QAAA,OAAO,EAAE,eAAe;AACxB,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,MAAM,EAAE,CAAC;AACT,QAAA,IAAI,EAAE,GAAG;AACT,QAAA,WAAW,EAAE,CAAC;AACd,QAAA,cAAc,EAAE,KAAK;AACrB,QAAA,SAAS,EAAE,SAAS;AACrB,KAAA;AACD,IAAA;AACE,QAAA,EAAE,EAAE,CAAC;AACL,QAAA,IAAI,EAAE,UAAU;AAChB,QAAA,OAAO,EAAE,aAAa;AACtB,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,MAAM,EAAE,CAAC;AACT,QAAA,IAAI,EAAE,GAAG;AACT,QAAA,WAAW,EAAE,CAAC;AACd,QAAA,cAAc,EAAE,KAAK;AACrB,QAAA,SAAS,EAAE,SAAS;AACrB,KAAA;AACD,IAAA;AACE,QAAA,EAAE,EAAE,CAAC;AACL,QAAA,IAAI,EAAE,eAAe;AACrB,QAAA,OAAO,EAAE,OAAO;AAChB,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,MAAM,EAAE,CAAC;AACT,QAAA,IAAI,EAAE,GAAG;AACT,QAAA,WAAW,EAAE,CAAC;AACd,QAAA,cAAc,EAAE,IAAI;AACpB,QAAA,SAAS,EAAE,SAAS;AACrB,KAAA;CACF;AAED,IAAM,KAAK,GAAG;AACZ,IAAA,KAAK,EAAE,qBAAqB;AAC5B,IAAA,SAAS,EAAE,eAAe;AAC1B,IAAA,QAAQ,EAAE;AACR,QAAA,OAAO,EAAE;AACP,YAAA,WAAW,EAAE,4BAA4B;AAC1C,SAAA;AACD,QAAA,IAAI,EAAE;AACJ,YAAA,WAAW,EAAE,2CAA2C;AACzD,SAAA;AACD,QAAA,WAAW,EAAE;AACX,YAAA,WAAW,EAAE,4DAA4D;AAC1E,SAAA;AACD,QAAA,kBAAkB,EAAE;AAClB,YAAA,WAAW,EAAE,2CAA2C;AACzD,SAAA;AACD,QAAA,kBAAkB,EAAE;AAClB,YAAA,WAAW,EAAE,2CAA2C;AACzD,SAAA;AACD,QAAA,cAAc,EAAE;AACd,YAAA,WAAW,EAAE,kBAAkB;AAChC,SAAA;AAED,QAAA,oBAAoB,EAAE;AACpB,YAAA,WAAW,EAAE,iCAAiC;AAC/C,SAAA;AACD,QAAA,mBAAmB,EAAE;AACnB,YAAA,WAAW,EAAE,4CAA4C;AAC1D,SAAA;AACD,QAAA,YAAY,EAAE;AACZ,YAAA,WAAW,EACT,wEAAwE;AAC3E,SAAA;AACD,QAAA,eAAe,EAAE;AACf,YAAA,WAAW,EACT,sFAAsF;AACzF,SAAA;AACD,QAAA,SAAS,EAAE;AACT,YAAA,WAAW,EAAE,+BAA+B;AAC7C,SAAA;AACD,QAAA,gBAAgB,EAAE;AAChB,YAAA,WAAW,EAAE,wCAAwC;AACtD,SAAA;AACD,QAAA,qBAAqB,EAAE;AACrB,YAAA,WAAW,EAAE,mCAAmC;AACjD,SAAA;AAED,QAAA,WAAW,EAAE;AACX,YAAA,WAAW,EAAE,yDAAyD;AACvE,SAAA;AACD,QAAA,kBAAkB,EAAE;AAClB,YAAA,WAAW,EACT,oEAAoE;AACvE,SAAA;AACD,QAAA,kBAAkB,EAAE;AAClB,YAAA,WAAW,EACT,qEAAqE;AACvE,YAAA,KAAK,EAAE;AACL,gBAAA,QAAQ,EAAE,WAAW;AACtB,aAAA;AACF,SAAA;AACF,KAAA;AACD,IAAA,IAAI,EAAE;AACJ,QAAA,IAAI,EAAA,IAAA;AACJ,QAAA,OAAO,EAAA,OAAA;AACP,QAAA,WAAW,EAAE,KAAK;AAClB,QAAA,kBAAkB,EAAE,cAAc;AAClC,QAAA,kBAAkB,EAAE,cAAc;AAClC,QAAA,cAAc,EAAE,KAAK;AACrB,QAAA,oBAAoB,EAAE,IAAI;AAC1B,QAAA,mBAAmB,EAAE,IAAI;AACzB,QAAA,YAAY,EAAE,IAAI;AAClB,QAAA,eAAe,EAAE,CAAC;AAClB,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,gBAAgB,EAAE,SAAS;AAC3B,QAAA,qBAAqB,EAAE,CAAC;AACxB,QAAA,WAAW,EAAE,KAAK;AAClB,QAAA,kBAAkB,EAAE;AAClB,YAAA,MAAM,EAAE,EAAE;AACV,YAAA,SAAS,EAAE,EAAE;AACb,YAAA,IAAI,EAAE,EAAE;AACR,YAAA,UAAU,EAAE,EAAE;AACd,YAAA,kBAAkB,EAAE,EAAE;AACtB,YAAA,OAAO,EAAE,EAAE;AACX,YAAA,iBAAiB,EAAE,EAAE;AACtB,SAAA;AACF,KAAA;AACD,IAAA,UAAU,EAAE;AACV,QAAA,iBAAiB,EACf,oHAAoH;AACvH,KAAA;;AAeI,IAAM,oBAAoB,GAAG;IAClC,MAAM,EAAE,UAAC,EAgBoB,EAAA;AAf3B,QAAA,IAAA,IAAI,UAAA,EACJ,OAAO,aAAA,EACP,mBAAmB,yBAAA,EACnB,YAAY,kBAAA,EACZ,eAAe,qBAAA,EACf,WAAW,iBAAA,EACX,kBAAkB,wBAAA,EAClB,kBAAkB,GAAA,EAAA,CAAA,kBAAA,EAClB,kBAAkB,GAAA,EAAA,CAAA,kBAAA,EAClB,cAAc,GAAA,EAAA,CAAA,cAAA,EACd,oBAAoB,GAAA,EAAA,CAAA,oBAAA,EACpB,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,gBAAgB,GAAA,EAAA,CAAA,gBAAA,EAChB,qBAAqB,GAAA,EAAA,CAAA,qBAAA,EACrB,WAAW,GAAA,EAAA,CAAA,WAAA;AACqB,QAAA,QAChCA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,UAAU,EAAA,QAAA,EACvBA,GAAA,CAAC,eAAe,EAAA,EACd,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,mBAAmB,EAAE,mBAAmB,EACxC,YAAY,EAAE,YAAY,EAC1B,eAAe,EAAE,eAAe,EAChC,WAAW,EAAE,WAAW,EACxB,kBAAkB,EAAE,kBAAkB,EACtC,kBAAkB,EAAE,kBAAkB,EACtC,kBAAkB,EAAE,kBAAkB,EACtC,cAAc,EAAE,cAAc,EAC9B,oBAAoB,EAAE,oBAAoB,EAC1C,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,gBAAgB,EAClC,qBAAqB,EAAE,qBAAqB,EAC5C,WAAW,EAAE,WAAW,EAAA,CACxB,GACE;IAnB0B,CAoBjC;AAED,IAAA,IAAI,EAAE,iBAAiB;;AAGlB,IAAM,UAAU,GAAG,YAAA,EAAM,QAC9BA,GAAA,CAAA,KAAA,EAAA,EAAA,QAAA,EACG,sIAKD,EAAA,CACI,EACP,CAT+B;;;;"}

package/dist/esm/components/dateSelector/components/Calendar.js CHANGED Viewed

@@ -1,11 +1,12 @@
 import 'react/jsx-runtime';
 import 'react';
-export { C as Calendar } from '../../../Calendar-8e595b56.js';
+export { C as Calendar } from '../../../Calendar-OjEwgyw8.js';
+import '../../../CalendarCaption-Bs7RbqJC.js';
+import '../../../index-DLQEsiym.js';
 import '../../icon/icons/Calendar.js';
 import '../../button/index.js';
-import '../../../_commonjsHelpers-4730bd53.js';
-import '../../../style-inject.es-1f59c1d0.js';
+import '../../../_commonjsHelpers-BFTU3MAI.js';
+import '../../../style-inject.es-tgCJW-Cu.js';
 import '../../icon/IconWrapper/IconWrapper.js';
-import '../../../tslib.es6-a39f91fc.js';
-import '../../../index-6ea95111.js';
+import '../../../tslib.es6-CVlKGIvp.js';
 //# sourceMappingURL=Calendar.js.map

package/dist/esm/components/dateSelector/components/Calendar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Calendar.js","sources":[],"sourcesContent":[],"names":[],"mappings":"~~;;;;;;;;;~~"}
1	+ {"version":3,"file":"Calendar.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}

package/dist/esm/components/dateSelector/components/CalendarCaption.js ADDED Viewed

@@ -0,0 +1,7 @@
+import 'react/jsx-runtime';
+import 'react';
+import '../../../index-DLQEsiym.js';
+export { C as CalendarCaption } from '../../../CalendarCaption-Bs7RbqJC.js';
+import '../../../_commonjsHelpers-BFTU3MAI.js';
+import '../../../style-inject.es-tgCJW-Cu.js';
+//# sourceMappingURL=CalendarCaption.js.map

package/dist/esm/components/dateSelector/components/CalendarCaption.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"CalendarCaption.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist/esm/components/dateSelector/index.js CHANGED Viewed

@@ -1,31 +1,52 @@
-import { a as __assign } from '../../tslib.es6-a39f91fc.js';
+import { b as __assign } from '../../tslib.es6-CVlKGIvp.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useRef, useState, useEffect } from 'react';
-import { a as dayjs, C as Calendar } from '../../Calendar-8e595b56.js';
-import { c as commonjsGlobal } from '../../_commonjsHelpers-4730bd53.js';
-import { s as styleInject } from '../../style-inject.es-1f59c1d0.js';
+import { d as dayjs, C as Calendar } from '../../Calendar-OjEwgyw8.js';
+import { g as getDefaultExportFromCjs } from '../../_commonjsHelpers-BFTU3MAI.js';
+import { s as styleInject } from '../../style-inject.es-tgCJW-Cu.js';
 import { Input } from '../input/index.js';
-import { c as classNames } from '../../index-6ea95111.js';
+import { c as classNames } from '../../index-DLQEsiym.js';
+import '../../CalendarCaption-Bs7RbqJC.js';
 import '../icon/icons/Calendar.js';
 import '../icon/IconWrapper/IconWrapper.js';
 import '../button/index.js';
-import '../../index-69a46657.js';
+import '../../index-CNcEE5dn.js';
-var localeData$1 = {exports: {}};
+var localeData$2 = {exports: {}};
-(function (module, exports) {
-!function(n,e){module.exports=e();}(commonjsGlobal,(function(){return function(n,e,t){var r=e.prototype,o=function(n){return n&&(n.indexOf?n:n.s)},u=function(n,e,t,r,u){var i=n.name?n:n.$locale(),a=o(i[e]),s=o(i[t]),f=a||s.map((function(n){return n.substr(0,r)}));if(!u)return f;var d=i.weekStart;return f.map((function(n,e){return f[(e+(d||0))%7]}))},i=function(){return t.Ls[t.locale()]},a=function(n,e){return n.formats[e]||function(n){return n.replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g,(function(n,e,t){return e||t.slice(1)}))}(n.formats[e.toUpperCase()])},s=function(){var n=this;return {months:function(e){return e?e.format("MMMM"):u(n,"months")},monthsShort:function(e){return e?e.format("MMM"):u(n,"monthsShort","months",3)},firstDayOfWeek:function(){return n.$locale().weekStart||0},weekdays:function(e){return e?e.format("dddd"):u(n,"weekdays")},weekdaysMin:function(e){return e?e.format("dd"):u(n,"weekdaysMin","weekdays",2)},weekdaysShort:function(e){return e?e.format("ddd"):u(n,"weekdaysShort","weekdays",3)},longDateFormat:function(e){return a(n.$locale(),e)},meridiem:this.$locale().meridiem,ordinal:this.$locale().ordinal}};r.localeData=function(){return s.bind(this)()},t.localeData=function(){var n=i();return {firstDayOfWeek:function(){return n.weekStart||0},weekdays:function(){return t.weekdays()},weekdaysShort:function(){return t.weekdaysShort()},weekdaysMin:function(){return t.weekdaysMin()},months:function(){return t.months()},monthsShort:function(){return t.monthsShort()},longDateFormat:function(e){return a(n,e)},meridiem:n.meridiem,ordinal:n.ordinal}},t.months=function(){return u(i(),"months")},t.monthsShort=function(){return u(i(),"monthsShort","months",3)},t.weekdays=function(n){return u(i(),"weekdays",null,null,n)},t.weekdaysShort=function(n){return u(i(),"weekdaysShort","weekdays",3,n)},t.weekdaysMin=function(n){return u(i(),"weekdaysMin","weekdays",2,n)};}}));
-}(localeData$1));
+var localeData$1 = localeData$2.exports;
-var localeData = localeData$1.exports;
+var hasRequiredLocaleData;
-var customParseFormat$1 = {exports: {}};
+function requireLocaleData () {
+	if (hasRequiredLocaleData) return localeData$2.exports;
+	hasRequiredLocaleData = 1;
+	(function (module, exports$1) {
+		!function(n,e){module.exports=e();}(localeData$1,(function(){return function(n,e,t){var r=e.prototype,o=function(n){return n&&(n.indexOf?n:n.s)},u=function(n,e,t,r,u){var i=n.name?n:n.$locale(),a=o(i[e]),s=o(i[t]),f=a||s.map((function(n){return n.substr(0,r)}));if(!u)return f;var d=i.weekStart;return f.map((function(n,e){return f[(e+(d||0))%7]}))},i=function(){return t.Ls[t.locale()]},a=function(n,e){return n.formats[e]||function(n){return n.replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g,(function(n,e,t){return e||t.slice(1)}))}(n.formats[e.toUpperCase()])},s=function(){var n=this;return {months:function(e){return e?e.format("MMMM"):u(n,"months")},monthsShort:function(e){return e?e.format("MMM"):u(n,"monthsShort","months",3)},firstDayOfWeek:function(){return n.$locale().weekStart||0},weekdays:function(e){return e?e.format("dddd"):u(n,"weekdays")},weekdaysMin:function(e){return e?e.format("dd"):u(n,"weekdaysMin","weekdays",2)},weekdaysShort:function(e){return e?e.format("ddd"):u(n,"weekdaysShort","weekdays",3)},longDateFormat:function(e){return a(n.$locale(),e)},meridiem:this.$locale().meridiem,ordinal:this.$locale().ordinal}};r.localeData=function(){return s.bind(this)()},t.localeData=function(){var n=i();return {firstDayOfWeek:function(){return n.weekStart||0},weekdays:function(){return t.weekdays()},weekdaysShort:function(){return t.weekdaysShort()},weekdaysMin:function(){return t.weekdaysMin()},months:function(){return t.months()},monthsShort:function(){return t.monthsShort()},longDateFormat:function(e){return a(n,e)},meridiem:n.meridiem,ordinal:n.ordinal}},t.months=function(){return u(i(),"months")},t.monthsShort=function(){return u(i(),"monthsShort","months",3)},t.weekdays=function(n){return u(i(),"weekdays",null,null,n)},t.weekdaysShort=function(n){return u(i(),"weekdaysShort","weekdays",3,n)},t.weekdaysMin=function(n){return u(i(),"weekdaysMin","weekdays",2,n)};}}));
+	} (localeData$2));
+	return localeData$2.exports;
+}
+var localeDataExports = requireLocaleData();
+var localeData = /*@__PURE__*/getDefaultExportFromCjs(localeDataExports);
+var customParseFormat$2 = {exports: {}};
-(function (module, exports) {
-!function(t,e){module.exports=e();}(commonjsGlobal,(function(){var t={LTS:"h:mm:ss A",LT:"h:mm A",L:"MM/DD/YYYY",LL:"MMMM D, YYYY",LLL:"MMMM D, YYYY h:mm A",LLLL:"dddd, MMMM D, YYYY h:mm A"},e=/(\[[^[]*\])|([-:/.()\s]+)|(A|a|YYYY|YY?|MM?M?M?|Do|DD?|hh?|HH?|mm?|ss?|S{1,3}|z|ZZ?)/g,n=/\d\d/,r=/\d\d?/,i=/\d*[^\s\d-_:/()]+/,o={},s=function(t){return (t=+t)+(t>68?1900:2e3)};var a=function(t){return function(e){this[t]=+e;}},f=[/[+-]\d\d:?(\d\d)?|Z/,function(t){(this.zone||(this.zone={})).offset=function(t){if(!t)return 0;if("Z"===t)return 0;var e=t.match(/([+-]|\d\d)/g),n=60*e[1]+(+e[2]||0);return 0===n?0:"+"===e[0]?-n:n}(t);}],u=function(t){var e=o[t];return e&&(e.indexOf?e:e.s.concat(e.f))},h=function(t,e){var n,r=o.meridiem;if(r){for(var i=1;i<=24;i+=1)if(t.indexOf(r(i,0,e))>-1){n=i>12;break}}else n=t===(e?"pm":"PM");return n},d={A:[i,function(t){this.afternoon=h(t,!1);}],a:[i,function(t){this.afternoon=h(t,!0);}],S:[/\d/,function(t){this.milliseconds=100*+t;}],SS:[n,function(t){this.milliseconds=10*+t;}],SSS:[/\d{3}/,function(t){this.milliseconds=+t;}],s:[r,a("seconds")],ss:[r,a("seconds")],m:[r,a("minutes")],mm:[r,a("minutes")],H:[r,a("hours")],h:[r,a("hours")],HH:[r,a("hours")],hh:[r,a("hours")],D:[r,a("day")],DD:[n,a("day")],Do:[i,function(t){var e=o.ordinal,n=t.match(/\d+/);if(this.day=n[0],e)for(var r=1;r<=31;r+=1)e(r).replace(/\[|\]/g,"")===t&&(this.day=r);}],M:[r,a("month")],MM:[n,a("month")],MMM:[i,function(t){var e=u("months"),n=(u("monthsShort")||e.map((function(t){return t.substr(0,3)}))).indexOf(t)+1;if(n<1)throw new Error;this.month=n%12||n;}],MMMM:[i,function(t){var e=u("months").indexOf(t)+1;if(e<1)throw new Error;this.month=e%12||e;}],Y:[/[+-]?\d+/,a("year")],YY:[n,function(t){this.year=s(t);}],YYYY:[/\d{4}/,a("year")],Z:f,ZZ:f};function c(n){var r,i;r=n,i=o&&o.formats;for(var s=(n=r.replace(/(\[[^\]]+])|(LTS?|l{1,4}|L{1,4})/g,(function(e,n,r){var o=r&&r.toUpperCase();return n||i[r]||t[r]||i[o].replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g,(function(t,e,n){return e||n.slice(1)}))}))).match(e),a=s.length,f=0;f<a;f+=1){var u=s[f],h=d[u],c=h&&h[0],l=h&&h[1];s[f]=l?{regex:c,parser:l}:u.replace(/^\[|\]$/g,"");}return function(t){for(var e={},n=0,r=0;n<a;n+=1){var i=s[n];if("string"==typeof i)r+=i.length;else {var o=i.regex,f=i.parser,u=t.substr(r),h=o.exec(u)[0];f.call(e,h),t=t.replace(h,"");}}return function(t){var e=t.afternoon;if(void 0!==e){var n=t.hours;e?n<12&&(t.hours+=12):12===n&&(t.hours=0),delete t.afternoon;}}(e),e}}return function(t,e,n){n.p.customParseFormat=!0,t&&t.parseTwoDigitYear&&(s=t.parseTwoDigitYear);var r=e.prototype,i=r.parse;r.parse=function(t){var e=t.date,r=t.utc,s=t.args;this.$u=r;var a=s[1];if("string"==typeof a){var f=!0===s[2],u=!0===s[3],h=f||u,d=s[2];u&&(d=s[2]),o=this.$locale(),!f&&d&&(o=n.Ls[d]),this.$d=function(t,e,n){try{if(["x","X"].indexOf(e)>-1)return new Date(("X"===e?1e3:1)*t);var r=c(e)(t),i=r.year,o=r.month,s=r.day,a=r.hours,f=r.minutes,u=r.seconds,h=r.milliseconds,d=r.zone,l=new Date,m=s||(i||o?1:l.getDate()),M=i||l.getFullYear(),Y=0;i&&!o||(Y=o>0?o-1:l.getMonth());var p=a||0,v=f||0,D=u||0,g=h||0;return d?new Date(Date.UTC(M,Y,m,p,v,D,g+60*d.offset*1e3)):n?new Date(Date.UTC(M,Y,m,p,v,D,g)):new Date(M,Y,m,p,v,D,g)}catch(t){return new Date("")}}(e,a,r),this.init(),d&&!0!==d&&(this.$L=this.locale(d).$L),h&&e!=this.format(a)&&(this.$d=new Date("")),o={};}else if(a instanceof Array)for(var l=a.length,m=1;m<=l;m+=1){s[1]=a[m-1];var M=n.apply(this,s);if(M.isValid()){this.$d=M.$d,this.$L=M.$L,this.init();break}m===l&&(this.$d=new Date(""));}else i.call(this,t);};}}));
-}(customParseFormat$1));
+var customParseFormat$1 = customParseFormat$2.exports;
+var hasRequiredCustomParseFormat;
+function requireCustomParseFormat () {
+	if (hasRequiredCustomParseFormat) return customParseFormat$2.exports;
+	hasRequiredCustomParseFormat = 1;
+	(function (module, exports$1) {
+		!function(t,e){module.exports=e();}(customParseFormat$1,(function(){var t={LTS:"h:mm:ss A",LT:"h:mm A",L:"MM/DD/YYYY",LL:"MMMM D, YYYY",LLL:"MMMM D, YYYY h:mm A",LLLL:"dddd, MMMM D, YYYY h:mm A"},e=/(\[[^[]*\])|([-:/.()\s]+)|(A|a|YYYY|YY?|MM?M?M?|Do|DD?|hh?|HH?|mm?|ss?|S{1,3}|z|ZZ?)/g,n=/\d\d/,r=/\d\d?/,i=/\d*[^\s\d-_:/()]+/,o={},s=function(t){return (t=+t)+(t>68?1900:2e3)};var a=function(t){return function(e){this[t]=+e;}},f=[/[+-]\d\d:?(\d\d)?|Z/,function(t){(this.zone||(this.zone={})).offset=function(t){if(!t)return 0;if("Z"===t)return 0;var e=t.match(/([+-]|\d\d)/g),n=60*e[1]+(+e[2]||0);return 0===n?0:"+"===e[0]?-n:n}(t);}],u=function(t){var e=o[t];return e&&(e.indexOf?e:e.s.concat(e.f))},h=function(t,e){var n,r=o.meridiem;if(r){for(var i=1;i<=24;i+=1)if(t.indexOf(r(i,0,e))>-1){n=i>12;break}}else n=t===(e?"pm":"PM");return n},d={A:[i,function(t){this.afternoon=h(t,false);}],a:[i,function(t){this.afternoon=h(t,true);}],S:[/\d/,function(t){this.milliseconds=100*+t;}],SS:[n,function(t){this.milliseconds=10*+t;}],SSS:[/\d{3}/,function(t){this.milliseconds=+t;}],s:[r,a("seconds")],ss:[r,a("seconds")],m:[r,a("minutes")],mm:[r,a("minutes")],H:[r,a("hours")],h:[r,a("hours")],HH:[r,a("hours")],hh:[r,a("hours")],D:[r,a("day")],DD:[n,a("day")],Do:[i,function(t){var e=o.ordinal,n=t.match(/\d+/);if(this.day=n[0],e)for(var r=1;r<=31;r+=1)e(r).replace(/\[|\]/g,"")===t&&(this.day=r);}],M:[r,a("month")],MM:[n,a("month")],MMM:[i,function(t){var e=u("months"),n=(u("monthsShort")||e.map((function(t){return t.substr(0,3)}))).indexOf(t)+1;if(n<1)throw new Error;this.month=n%12||n;}],MMMM:[i,function(t){var e=u("months").indexOf(t)+1;if(e<1)throw new Error;this.month=e%12||e;}],Y:[/[+-]?\d+/,a("year")],YY:[n,function(t){this.year=s(t);}],YYYY:[/\d{4}/,a("year")],Z:f,ZZ:f};function c(n){var r,i;r=n,i=o&&o.formats;for(var s=(n=r.replace(/(\[[^\]]+])|(LTS?|l{1,4}|L{1,4})/g,(function(e,n,r){var o=r&&r.toUpperCase();return n||i[r]||t[r]||i[o].replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g,(function(t,e,n){return e||n.slice(1)}))}))).match(e),a=s.length,f=0;f<a;f+=1){var u=s[f],h=d[u],c=h&&h[0],l=h&&h[1];s[f]=l?{regex:c,parser:l}:u.replace(/^\[|\]$/g,"");}return function(t){for(var e={},n=0,r=0;n<a;n+=1){var i=s[n];if("string"==typeof i)r+=i.length;else {var o=i.regex,f=i.parser,u=t.substr(r),h=o.exec(u)[0];f.call(e,h),t=t.replace(h,"");}}return function(t){var e=t.afternoon;if(void 0!==e){var n=t.hours;e?n<12&&(t.hours+=12):12===n&&(t.hours=0),delete t.afternoon;}}(e),e}}return function(t,e,n){n.p.customParseFormat=true,t&&t.parseTwoDigitYear&&(s=t.parseTwoDigitYear);var r=e.prototype,i=r.parse;r.parse=function(t){var e=t.date,r=t.utc,s=t.args;this.$u=r;var a=s[1];if("string"==typeof a){var f=true===s[2],u=true===s[3],h=f||u,d=s[2];u&&(d=s[2]),o=this.$locale(),!f&&d&&(o=n.Ls[d]),this.$d=function(t,e,n){try{if(["x","X"].indexOf(e)>-1)return new Date(("X"===e?1e3:1)*t);var r=c(e)(t),i=r.year,o=r.month,s=r.day,a=r.hours,f=r.minutes,u=r.seconds,h=r.milliseconds,d=r.zone,l=new Date,m=s||(i||o?1:l.getDate()),M=i||l.getFullYear(),Y=0;i&&!o||(Y=o>0?o-1:l.getMonth());var p=a||0,v=f||0,D=u||0,g=h||0;return d?new Date(Date.UTC(M,Y,m,p,v,D,g+60*d.offset*1e3)):n?new Date(Date.UTC(M,Y,m,p,v,D,g)):new Date(M,Y,m,p,v,D,g)}catch(t){return new Date("")}}(e,a,r),this.init(),d&&true!==d&&(this.$L=this.locale(d).$L),h&&e!=this.format(a)&&(this.$d=new Date("")),o={};}else if(a instanceof Array)for(var l=a.length,m=1;m<=l;m+=1){s[1]=a[m-1];var M=n.apply(this,s);if(M.isValid()){this.$d=M.$d,this.$L=M.$L,this.init();break}m===l&&(this.$d=new Date(""));}else i.call(this,t);};}}));
+	} (customParseFormat$2));
+	return customParseFormat$2.exports;
+}
-var customParseFormat = customParseFormat$1.exports;
+var customParseFormatExports = requireCustomParseFormat();
+var customParseFormat = /*@__PURE__*/getDefaultExportFromCjs(customParseFormatExports);
 function zerofill(input, size) {
     if (size === void 0) { size = 2; }
@@ -52,20 +73,20 @@ function isoStringtoCalendarDate(input) {
     return { year: year, month: month + 1, day: day };
 }
-var css_248z = ".style-module_container__3bJf5 {\n  display: flex;\n}\n@media (max-width: 34rem) {\n  .style-module_container__3bJf5 {\n    flex-direction: column;\n  }\n}\n\n.style-module_dayInput__1OBNv,\n.style-module_monthInput__2L_7o {\n  width: 88px;\n  flex: 1;\n}\n\n.style-module_yearInput__2C_H8 {\n  width: 104px;\n}\n@media (max-width: 34rem) {\n  .style-module_yearInput__2C_H8 {\n    width: 100%;\n  }\n}";
+var css_248z = ".style-module_container__3bJf5 {\n  display: flex;\n}\n@media (max-width: 34rem) {\n  .style-module_container__3bJf5 {\n    width: 100%;\n    flex-direction: column;\n  }\n}\n\n.style-module_dayInput__1OBNv,\n.style-module_monthInput__2L_7o {\n  width: 88px;\n  flex: 1;\n}\n\n.style-module_yearInput__2C_H8 {\n  width: 104px;\n}\n@media (max-width: 34rem) {\n  .style-module_yearInput__2C_H8 {\n    width: 100%;\n  }\n}";
 var styles = {"container":"style-module_container__3bJf5","dayInput":"style-module_dayInput__1OBNv","monthInput":"style-module_monthInput__2L_7o","yearInput":"style-module_yearInput__2C_H8"};
 styleInject(css_248z);
 dayjs.extend(localeData);
 var COLLECTABLE_DATE_FORMAT = 'YYYY-MM-DD';
 var defaultPlaceholders = {
-    day: 'Day',
-    dayFormat: 'DD',
-    month: 'Month',
-    monthFormat: 'MM',
-    year: 'Year',
-    yearFormat: 'YYYY',
-    error: 'Please enter a valid date',
+    day: "Day",
+    dayFormat: "DD",
+    month: "Month",
+    monthFormat: "MM",
+    year: "Year",
+    yearFormat: "YYYY",
+    error: "Please enter a valid date"
 };
 var isDateValid = function (date, yearBoundaries, dateObject) {
     var _a = yearBoundaries.min, min = _a === void 0 ? 0 : _a, _b = yearBoundaries.max, max = _b === void 0 ? 0 : _b;
@@ -82,11 +103,11 @@ var isDateValid = function (date, yearBoundaries, dateObject) {
     var isValidDate = dayjs(date, COLLECTABLE_DATE_FORMAT, true).isValid();
     return {
         isValid: isValidDate,
-        errorType: 'default',
+        errorType: 'default'
     };
 };
 var DateSelector = function (_a) {
-    var value = _a.value, onChange = _a.onChange, placeholdersProps = _a.placeholders, yearBoundaries = _a.yearBoundaries, displayCalendar = _a.displayCalendar, dayjsLocale = _a.dayjsLocale, _b = _a.firstDayOfWeek, firstDayOfWeek = _b === void 0 ? 0 : _b, inputProps = _a.inputProps;
+    var value = _a.value, onChange = _a.onChange, placeholdersProps = _a.placeholders, yearBoundaries = _a.yearBoundaries, displayCalendar = _a.displayCalendar, dayjsLocale = _a.dayjsLocale, _b = _a.firstDayOfWeek, firstDayOfWeek = _b === void 0 ? 0 : _b, inputProps = _a.inputProps, defaultDayPickerDate = _a.defaultDayPickerDate;
     var placeholders = __assign(__assign({}, defaultPlaceholders), placeholdersProps);
     var itemsRef = useRef([]);
     var _c = useState(false), isDirty = _c[0], setIsDirty = _c[1];
@@ -94,13 +115,8 @@ var DateSelector = function (_a) {
     var _e = useState(false), isCalendarOpen = _e[0], setIsCalendarOpen = _e[1];
     var _f = useState({}), internalValue = _f[0], setInternalValue = _f[1];
     useEffect(function () {
-        var calendarDateValue = value
-            ? isoStringtoCalendarDate(value)
-            : undefined;
-        if (value !== calendarDateValue &&
-            (calendarDateValue === null || calendarDateValue === void 0 ? void 0 : calendarDateValue.day) &&
-            (calendarDateValue === null || calendarDateValue === void 0 ? void 0 : calendarDateValue.month) &&
-            (calendarDateValue === null || calendarDateValue === void 0 ? void 0 : calendarDateValue.year)) {
+        var calendarDateValue = value ? isoStringtoCalendarDate(value) : undefined;
+        if (value !== calendarDateValue && (calendarDateValue === null || calendarDateValue === void 0 ? void 0 : calendarDateValue.day) && (calendarDateValue === null || calendarDateValue === void 0 ? void 0 : calendarDateValue.month) && (calendarDateValue === null || calendarDateValue === void 0 ? void 0 : calendarDateValue.year)) {
             var _a = isDateValid(value, yearBoundaries, calendarDateValue), isValid = _a.isValid, errorType = _a.errorType;
             setInternalValue(calendarDateValue);
             setHasError(isValid ? undefined : errorType);
@@ -125,7 +141,7 @@ var DateSelector = function (_a) {
         setHasError(isValid ? undefined : errorType);
         setIsCalendarOpen(false);
         if (isDateInValidFormat || isDirty) {
-            onChange(isValid ? formattedDate : '');
+            onChange(isValid ? formattedDate : "");
         }
     };
     var handleOnKeyDown = function (event, index) {
@@ -137,10 +153,9 @@ var DateSelector = function (_a) {
         // is not day input
         index > 0 &&
             // has clicked backspace or arrow left
-            ['Backspace', 'ArrowLeft'].includes(event.key) &&
+            ['Backspace', "ArrowLeft"].includes(event.key) &&
             // is focused at the first character of the input
-            inputSelectionStart === 0 &&
-            inputSelectionEnd === 0) {
+            inputSelectionStart === 0 && inputSelectionEnd === 0) {
             var prevInput = (_b = itemsRef.current) === null || _b === void 0 ? void 0 : _b[index - 1];
             event.preventDefault();
             prevInput === null || prevInput === void 0 ? void 0 : prevInput.focus();
@@ -148,11 +163,11 @@ var DateSelector = function (_a) {
         }
         if (
         // is not year input
-        index < 2 &&
+        index < 2
             // has clicked arrow right
-            event.key === 'ArrowRight' &&
+            && event.key === "ArrowRight"
             // is focused at the last character of the input value
-            inputSelectionStart === currentInput.value.length) {
+            && inputSelectionStart === currentInput.value.length) {
             var nextInput = (_c = itemsRef.current) === null || _c === void 0 ? void 0 : _c[index + 1];
             event.preventDefault();
             nextInput === null || nextInput === void 0 ? void 0 : nextInput.focus();
@@ -165,13 +180,14 @@ var DateSelector = function (_a) {
         var inputSelectionStart = currentInput === null || currentInput === void 0 ? void 0 : currentInput.selectionStart;
         if (
         // is not year input
-        index < 2 &&
+        index < 2
             // is a number key
-            /^\d+$/.test(event.key) &&
+            && /^\d+$/.test(event.key)
+            && (
             // is focused at the last character of the input value
-            (inputSelectionStart === currentInput.maxLength ||
+            inputSelectionStart === currentInput.maxLength
                 // or month value is over 1 or day value is over 3
-                Number(currentInput.value) > (index === 1 ? 1 : 3))) {
+                || Number(currentInput.value) > (index === 1 ? 1 : 3))) {
             var nextInput = (_b = itemsRef.current) === null || _b === void 0 ? void 0 : _b[index + 1];
             event.preventDefault();
             event.stopPropagation();
@@ -181,24 +197,16 @@ var DateSelector = function (_a) {
     };
     var getInputProps = function (key, index) {
         var _a, _b;
-        return (__assign({ 'data-cy': "date-selector-".concat(key), 'data-testid': "date-selector-".concat(key), className: styles["".concat(key, "Input")], id: key, name: key, maxLength: key === 'year' ? 4 : 2, required: true, label: placeholders === null || placeholders === void 0 ? void 0 : placeholders[key], placeholder: (_a = placeholders === null || placeholders === void 0 ? void 0 : placeholders["".concat(key, "Format")]) !== null && _a !== void 0 ? _a : '', labelInsideInput: true, value: (_b = internalValue[key]) !== null && _b !== void 0 ? _b : '', error: hasError && isDirty, type: 'text', inputMode: 'numeric', ref: function (el) {
-                itemsRef.current[index] = el;
-            }, onKeyUp: function (event) {
-                return handleOnKeyUp(event, index);
-            }, onKeyDown: function (event) {
-                return handleOnKeyDown(event, index);
-            }, onChange: function (_a) {
+        return (__assign({ 'data-cy': "date-selector-".concat(key), 'data-testid': "date-selector-".concat(key), className: styles["".concat(key, "Input")], id: key, name: key, maxLength: key === 'year' ? 4 : 2, required: true, label: placeholders === null || placeholders === void 0 ? void 0 : placeholders[key], placeholder: (_a = placeholders === null || placeholders === void 0 ? void 0 : placeholders["".concat(key, "Format")]) !== null && _a !== void 0 ? _a : "", labelInsideInput: true, value: (_b = internalValue[key]) !== null && _b !== void 0 ? _b : '', error: hasError && isDirty, type: "text", inputMode: "numeric", ref: function (el) { itemsRef.current[index] = el; }, onKeyUp: function (event) { return handleOnKeyUp(event, index); }, onKeyDown: function (event) { return handleOnKeyDown(event, index); }, onChange: function (_a) {
                 var target = _a.target;
                 return handleOnChange(key, target.value);
-            } }, ((inputProps === null || inputProps === void 0 ? void 0 : inputProps(key)) || {})));
+            } }, (inputProps === null || inputProps === void 0 ? void 0 : inputProps(key)) || {}));
     };
-    return (jsxs("div", { children: [jsxs("div", { className: "d-flex ai-center", children: [jsxs("div", { className: classNames(styles.container, 'd-flex gap8'), children: [jsxs("div", { className: 'd-flex gap8 jc-between', children: [jsx(Input, __assign({}, getInputProps('day', 0))), jsx(Input, __assign({}, getInputProps('month', 1)))] }), jsx(Input, __assign({}, getInputProps('year', 2)))] }), jsx(Calendar, { dateFormat: COLLECTABLE_DATE_FORMAT, yearBoundaries: yearBoundaries, displayCalendar: displayCalendar, dayjsLocale: dayjsLocale, firstDayOfWeek: firstDayOfWeek, isOpen: isCalendarOpen, setCalendarOpen: setIsCalendarOpen, value: value, onChange: onChange })] }), hasError && isDirty && (jsx("p", { className: classNames(hasError && isDirty ? 'd-block' : 'd-none', 'p-p--small tc-red-500 w100 mt8'), "data-testid": "date-error-message", children: {
+    return (jsxs("div", { children: [jsxs("div", { className: "d-flex", children: [jsxs("div", { className: classNames(styles.container, "d-flex gap8"), children: [jsxs("div", { className: "d-flex gap8 jc-between", children: [jsx(Input, __assign({}, getInputProps('day', 0))), jsx(Input, __assign({}, getInputProps('month', 1)))] }), jsx(Input, __assign({}, getInputProps('year', 2)))] }), jsx(Calendar, { dateFormat: COLLECTABLE_DATE_FORMAT, yearBoundaries: yearBoundaries, displayCalendar: displayCalendar, dayjsLocale: dayjsLocale, firstDayOfWeek: firstDayOfWeek, isOpen: isCalendarOpen, setCalendarOpen: setIsCalendarOpen, value: value, onChange: onChange, defaultDayPickerDate: defaultDayPickerDate })] }), hasError && isDirty && (jsx("p", { className: classNames(hasError && isDirty ? 'd-block' : 'd-none', "p-p--small tc-red-500 w100 mt8"), "data-testid": "date-error-message", children: {
                     default: placeholders.error,
-                    afterMax: placeholders.errorAfterMaxYear ||
-                        "Please choose a date before ".concat(yearBoundaries.max + 1),
-                    beforeMin: placeholders.errorBeforeMinYear ||
-                        "Please choose a date after ".concat(yearBoundaries.min - 1),
-                }[hasError || 'default'] }))] }));
+                    afterMax: placeholders.errorAfterMaxYear || "Please choose a date before ".concat(yearBoundaries.max + 1),
+                    beforeMin: placeholders.errorBeforeMinYear || "Please choose a date after ".concat(yearBoundaries.min - 1),
+                }[hasError || "default"] }))] }));
 };
 export { DateSelector };