@clickhouse/click-ui 0.8.0 → 0.9.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.
- package/dist/cjs/click-ui.css +362 -0
- package/dist/cjs/components/Assets/Icons/Horizontal-Loading.cjs +13 -49
- package/dist/cjs/components/Assets/Icons/Horizontal-Loading.cjs.map +1 -1
- package/dist/cjs/components/Assets/Icons/Loaders.css +94 -0
- package/dist/cjs/components/Assets/Icons/Loaders.module.css.cjs +13 -0
- package/dist/cjs/components/Assets/Icons/Loaders.module.css.cjs.map +1 -0
- package/dist/cjs/components/Assets/Icons/Loading-Animated.cjs +8 -12
- package/dist/cjs/components/Assets/Icons/Loading-Animated.cjs.map +1 -1
- package/dist/cjs/components/Assets/Icons/Loading.cjs +13 -6
- package/dist/cjs/components/Assets/Icons/Loading.cjs.map +1 -1
- package/dist/cjs/components/DatePicker/DateRangePicker.cjs +12 -2
- package/dist/cjs/components/DatePicker/DateRangePicker.cjs.map +1 -1
- package/dist/cjs/components/DatePicker/index.cjs +1 -3
- package/dist/cjs/components/DatePicker/index.cjs.map +1 -1
- package/dist/cjs/components/DatePicker/utils.cjs +3 -0
- package/dist/cjs/components/DatePicker/utils.cjs.map +1 -1
- package/dist/cjs/components/Grid/Cell.cjs +1 -3
- package/dist/cjs/components/Grid/Cell.cjs.map +1 -1
- package/dist/cjs/components/Grid/ColumnResizer.cjs +18 -15
- package/dist/cjs/components/Grid/ColumnResizer.cjs.map +1 -1
- package/dist/cjs/components/Grid/ColumnResizer.css +22 -0
- package/dist/cjs/components/Grid/ColumnResizer.module.css.cjs +11 -0
- package/dist/cjs/components/Grid/ColumnResizer.module.css.cjs.map +1 -0
- package/dist/cjs/components/Grid/Grid.css +34 -0
- package/dist/cjs/components/Grid/Grid.module.css.cjs +21 -0
- package/dist/cjs/components/Grid/Grid.module.css.cjs.map +1 -0
- package/dist/cjs/components/Grid/Header.cjs +22 -43
- package/dist/cjs/components/Grid/Header.cjs.map +1 -1
- package/dist/cjs/components/Grid/Header.css +44 -0
- package/dist/cjs/components/Grid/Header.module.css.cjs +19 -0
- package/dist/cjs/components/Grid/Header.module.css.cjs.map +1 -0
- package/dist/cjs/components/Grid/RowNumberColumn.cjs +12 -29
- package/dist/cjs/components/Grid/RowNumberColumn.cjs.map +1 -1
- package/dist/cjs/components/Grid/RowNumberColumn.css +22 -0
- package/dist/cjs/components/Grid/RowNumberColumn.module.css.cjs +12 -0
- package/dist/cjs/components/Grid/RowNumberColumn.module.css.cjs.map +1 -0
- package/dist/cjs/components/Grid/StyledCell.cjs +84 -56
- package/dist/cjs/components/Grid/StyledCell.cjs.map +1 -1
- package/dist/cjs/components/Grid/StyledCell.css +146 -0
- package/dist/cjs/components/Grid/StyledCell.module.css.cjs +47 -0
- package/dist/cjs/components/Grid/StyledCell.module.css.cjs.map +1 -0
- package/dist/cjs/components/Grid/index.cjs +30 -30
- package/dist/cjs/components/Grid/index.cjs.map +1 -1
- package/dist/esm/click-ui.css +362 -0
- package/dist/esm/components/Assets/Icons/Horizontal-Loading.js +13 -49
- package/dist/esm/components/Assets/Icons/Horizontal-Loading.js.map +1 -1
- package/dist/esm/components/Assets/Icons/Loaders.css +94 -0
- package/dist/esm/components/Assets/Icons/Loaders.module.css.js +8 -0
- package/dist/esm/components/Assets/Icons/Loaders.module.css.js.map +1 -0
- package/dist/esm/components/Assets/Icons/Loading-Animated.js +9 -13
- package/dist/esm/components/Assets/Icons/Loading-Animated.js.map +1 -1
- package/dist/esm/components/Assets/Icons/Loading.js +13 -6
- package/dist/esm/components/Assets/Icons/Loading.js.map +1 -1
- package/dist/esm/components/Assets/Icons/system/IconsLight.js +2 -2
- package/dist/esm/components/Assets/Icons/system/IconsLight.js.map +1 -1
- package/dist/esm/components/DatePicker/DateRangePicker.js +14 -4
- package/dist/esm/components/DatePicker/DateRangePicker.js.map +1 -1
- package/dist/esm/components/DatePicker/index.js +2 -4
- package/dist/esm/components/DatePicker/index.js.map +1 -1
- package/dist/esm/components/DatePicker/utils.js +3 -1
- package/dist/esm/components/DatePicker/utils.js.map +1 -1
- package/dist/esm/components/Grid/Cell.js +1 -3
- package/dist/esm/components/Grid/Cell.js.map +1 -1
- package/dist/esm/components/Grid/ColumnResizer.css +22 -0
- package/dist/esm/components/Grid/ColumnResizer.js +18 -15
- package/dist/esm/components/Grid/ColumnResizer.js.map +1 -1
- package/dist/esm/components/Grid/ColumnResizer.module.css.js +7 -0
- package/dist/esm/components/Grid/ColumnResizer.module.css.js.map +1 -0
- package/dist/esm/components/Grid/Grid.css +34 -0
- package/dist/esm/components/Grid/Grid.module.css.js +13 -0
- package/dist/esm/components/Grid/Grid.module.css.js.map +1 -0
- package/dist/esm/components/Grid/Header.css +44 -0
- package/dist/esm/components/Grid/Header.js +22 -43
- package/dist/esm/components/Grid/Header.js.map +1 -1
- package/dist/esm/components/Grid/Header.module.css.js +13 -0
- package/dist/esm/components/Grid/Header.module.css.js.map +1 -0
- package/dist/esm/components/Grid/RowNumberColumn.css +22 -0
- package/dist/esm/components/Grid/RowNumberColumn.js +12 -29
- package/dist/esm/components/Grid/RowNumberColumn.js.map +1 -1
- package/dist/esm/components/Grid/RowNumberColumn.module.css.js +8 -0
- package/dist/esm/components/Grid/RowNumberColumn.module.css.js.map +1 -0
- package/dist/esm/components/Grid/StyledCell.css +146 -0
- package/dist/esm/components/Grid/StyledCell.js +84 -56
- package/dist/esm/components/Grid/StyledCell.js.map +1 -1
- package/dist/esm/components/Grid/StyledCell.module.css.js +32 -0
- package/dist/esm/components/Grid/StyledCell.module.css.js.map +1 -0
- package/dist/esm/components/Grid/index.js +30 -30
- package/dist/esm/components/Grid/index.js.map +1 -1
- package/dist/types/components/Assets/Icons/Horizontal-Loading.d.ts +2 -3
- package/dist/types/components/Assets/Icons/Loading-Animated.d.ts +2 -3
- package/dist/types/components/Assets/Icons/Loading.d.ts +2 -4
- package/dist/types/components/DatePicker/DateRangePicker.d.ts +2 -1
- package/dist/types/components/DatePicker/utils.d.ts +1 -0
- package/dist/types/components/Grid/RowNumberColumn.d.ts +1 -2
- package/dist/types/components/Grid/StyledCell.d.ts +10 -5
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateRangePicker.js","sources":["../../../../src/components/DatePicker/DateRangePicker.tsx"],"sourcesContent":["import {\n Dispatch,\n KeyboardEvent,\n MouseEvent,\n SetStateAction,\n useCallback,\n useEffect,\n useLayoutEffect,\n useRef,\n useState,\n} from 'react';\nimport { isSameDate, UseCalendarOptions } from '@h6s/calendar';\nimport { styled } from 'styled-components';\nimport { Dropdown } from '@/components/Dropdown';\nimport {\n Body,\n CalendarRenderer,\n DateRangePickerInput,\n DateTableCell,\n StyledDropdownItem,\n} from './Common';\nimport { Container } from '@/components/Container';\nimport { Panel } from '@/components/Panel';\nimport { Icon } from '@/components/Icon';\nimport {\n DateRange,\n datesAreWithinMaxRange,\n formatDateHeader,\n formatSelectedDate,\n shiftFromTimezone,\n isDateRangeTheWholeMonth,\n Timezone,\n shiftToTimezone,\n} from './utils';\n\ntype OpenDirection = 'left' | 'right';\n\nconst calendarWidth = 275;\n\nconst PredefinedCalendarContainer = styled(Panel)`\n align-items: start;\n background: ${({ theme }) => theme.click.panel.color.background.muted};\n`;\n\nconst PredefinedDatesContainer = styled(Container)`\n width: ${calendarWidth}px;\n`;\n\n// left value of 276px is the width of the PredefinedDatesContainer + 1 pixel for border\nconst CalendarRendererContainer = styled.div<{ $openDirection?: OpenDirection }>`\n border: ${({ theme }) =>\n `${theme.click.datePicker.dateOption.stroke} solid ${theme.click.datePicker.dateOption.color.background.range}`};\n border-radius: ${({ theme }) => theme.click.datePicker.dateOption.radii.default};\n box-shadow:\n lch(6.77 0 0 / 0.15) 4px 4px 6px -1px,\n lch(6.77 0 0 / 0.15) 2px 2px 4px -1px;\n ${({ $openDirection }) => ($openDirection === 'left' ? 'right: 100%;' : 'left: 276px;')}\n position: absolute;\n top: 0;\n`;\n\n// Height of 221px is height the height the calendar needs to match the PredefinedDatesContainer\nconst StyledCalendarRenderer = styled(CalendarRenderer)`\n border-radius: ${({ theme }) => theme.click.datePicker.dateOption.radii.default};\n min-height: 221px;\n`;\n\n// max-height of 210px allows the scrollable container to be a reasonble height that matches the calendar\nconst ScrollableContainer = styled(Container)`\n max-height: 210px;\n overflow-y: auto;\n`;\n\nconst DateRangeTableCell = styled(DateTableCell)<{\n $shouldShowRangeIndicator?: boolean;\n}>`\n ${({ $shouldShowRangeIndicator, theme }) =>\n $shouldShowRangeIndicator &&\n `\n background: ${theme.click.datePicker.dateOption.color.background.range};\n border: ${theme.click.datePicker.dateOption.stroke} solid ${theme.click.datePicker.dateOption.color.background.range};\n border-radius: 0;\n `}\n`;\n\ninterface CalendarProps {\n calendarBody: Body;\n closeDatepicker: () => void;\n futureDatesDisabled: boolean;\n futureStartDatesDisabled: boolean;\n maxRangeLength: number;\n setSelectedDate: (selectedDate: Date) => void;\n startDate?: Date;\n endDate?: Date;\n timezone: Timezone;\n}\n\nconst Calendar = ({\n calendarBody,\n closeDatepicker,\n futureDatesDisabled,\n futureStartDatesDisabled,\n maxRangeLength,\n setSelectedDate,\n startDate,\n endDate,\n timezone,\n}: CalendarProps) => {\n const [hoveredDate, setHoveredDate] = useState<Date>();\n\n const today = shiftToTimezone(new Date(), timezone);\n const shiftedStart = startDate ? shiftToTimezone(startDate, timezone) : undefined;\n const shiftedEnd = endDate ? shiftToTimezone(endDate, timezone) : undefined;\n\n const handleMouseOut = (): void => {\n setHoveredDate(undefined);\n };\n\n return calendarBody.value.map(({ key: weekKey, value: week }) => {\n return (\n <tr key={weekKey}>\n {week.map(({ date, isCurrentMonth, key: dayKey, value: fullDate }) => {\n const isSelected =\n (shiftedStart && isSameDate(shiftedStart, fullDate)) ||\n (shiftedEnd && isSameDate(shiftedEnd, fullDate));\n const isPresent = isSameDate(today, fullDate);\n\n const isBetweenStartAndEndDates = Boolean(\n shiftedStart && shiftedEnd && fullDate > shiftedStart && fullDate < shiftedEnd\n );\n\n let isDisabled = false;\n if (futureDatesDisabled && fullDate > today) {\n isDisabled = true;\n }\n\n if (futureStartDatesDisabled && !shiftedStart && fullDate > today) {\n isDisabled = true;\n }\n\n if (\n maxRangeLength > 1 &&\n shiftedStart &&\n !datesAreWithinMaxRange(shiftedStart, fullDate, maxRangeLength) &&\n fullDate > shiftedStart\n ) {\n isDisabled = true;\n }\n\n const shouldShowRangeIndicator =\n !shiftedEnd &&\n Boolean(\n shiftedStart &&\n hoveredDate &&\n fullDate > shiftedStart &&\n fullDate < hoveredDate\n );\n\n const handleMouseEnter = () => {\n setHoveredDate(fullDate);\n };\n\n const handleClick = () => {\n if (isDisabled) {\n return false;\n }\n setSelectedDate(shiftFromTimezone(fullDate, timezone));\n\n // User has a date range selected and clicked a new date.\n // This will cause the selected date to be reset, thus do not close the datepicker.\n if (shiftedStart && shiftedEnd) {\n return;\n }\n\n // The user has selected a new start date, don't close\n if (shiftedStart && fullDate < shiftedStart) {\n return;\n }\n\n // Only close the datepicker if the user hasn't clicked the selected start date.\n if (shiftedStart && !isSameDate(fullDate, shiftedStart)) {\n closeDatepicker();\n return;\n }\n };\n return (\n <DateRangeTableCell\n $shouldShowRangeIndicator={\n !isSelected && (shouldShowRangeIndicator || isBetweenStartAndEndDates)\n }\n $isCurrentMonth={isCurrentMonth}\n $isDisabled={isDisabled}\n $isSelected={isSelected}\n $isPresent={isPresent}\n key={dayKey}\n onClick={handleClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseOut}\n >\n {date}\n </DateRangeTableCell>\n );\n })}\n </tr>\n );\n });\n};\n\ninterface PredefinedDatesProps {\n onSelectDateRange: (selectedStartDate: Date, selectedEndDate: Date) => void;\n predefinedDatesList: DateRange[];\n selectedEndDate: Date | undefined;\n selectedStartDate: Date | undefined;\n setEndDate: Dispatch<SetStateAction<Date | undefined>>;\n setStartDate: Dispatch<SetStateAction<Date | undefined>>;\n shouldShowCustomRange: boolean;\n showCustomDateRange: Dispatch<SetStateAction<boolean>>;\n timezone: Timezone;\n}\n\nconst PredefinedDates = ({\n onSelectDateRange,\n predefinedDatesList,\n selectedEndDate,\n selectedStartDate,\n setEndDate,\n setStartDate,\n shouldShowCustomRange,\n showCustomDateRange,\n timezone,\n}: PredefinedDatesProps) => {\n const handleCustomTimePeriodClick = (event: MouseEvent) => {\n event.preventDefault();\n showCustomDateRange(!shouldShowCustomRange);\n };\n\n return (\n <PredefinedDatesContainer\n data-testid=\"predefined-dates-list\"\n isResponsive={false}\n orientation=\"vertical\"\n >\n <ScrollableContainer orientation=\"vertical\">\n {predefinedDatesList.map(({ startDate, endDate }) => {\n const handleItemClick = () => {\n setStartDate(startDate);\n setEndDate(endDate);\n onSelectDateRange(startDate, endDate);\n };\n\n const rangeIsSelected =\n selectedEndDate &&\n isSameDate(selectedEndDate, endDate) &&\n selectedStartDate &&\n isSameDate(selectedStartDate, startDate);\n\n const isWholeMonth = isDateRangeTheWholeMonth({ startDate, endDate }, timezone);\n\n const formattedText = isWholeMonth\n ? formatDateHeader(timezone, startDate)\n : `${formatSelectedDate(timezone, startDate)} – ${formatSelectedDate(timezone, endDate)}`.trim();\n\n return (\n <StyledDropdownItem\n data-testid={`predefined-date-${startDate.getTime()}`}\n key={startDate.toISOString()}\n onClick={handleItemClick}\n >\n <Container\n data-selected={rangeIsSelected}\n data-testid={formattedText}\n justifyContent=\"space-between\"\n orientation=\"horizontal\"\n >\n {formattedText}\n {rangeIsSelected && <Icon name=\"check\" />}\n </Container>\n </StyledDropdownItem>\n );\n })}\n </ScrollableContainer>\n <StyledDropdownItem onClick={handleCustomTimePeriodClick}>\n <Container\n justifyContent=\"space-between\"\n orientation=\"horizontal\"\n >\n Custom time period <Icon name=\"chevron-right\" />\n </Container>\n </StyledDropdownItem>\n </PredefinedDatesContainer>\n );\n};\n\nexport interface DateRangePickerProps {\n endDate?: Date;\n disabled?: boolean;\n futureDatesDisabled?: boolean;\n futureStartDatesDisabled?: boolean;\n onSelectDateRange: (selectedStartDate: Date, selectedEndDate: Date) => void;\n openDirection?: OpenDirection;\n placeholder?: string;\n predefinedDatesList?: DateRange[];\n maxRangeLength?: number;\n startDate?: Date;\n responsivePositioning?: boolean;\n timezone?: Timezone;\n}\n\nexport const DateRangePicker = ({\n endDate,\n startDate,\n disabled = false,\n futureDatesDisabled = false,\n futureStartDatesDisabled = false,\n maxRangeLength = -1,\n onSelectDateRange,\n openDirection = 'right',\n placeholder = 'start date – end date',\n predefinedDatesList,\n responsivePositioning = true,\n timezone = 'system',\n}: DateRangePickerProps) => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const [selectedStartDate, setSelectedStartDate] = useState<Date>();\n const [selectedEndDate, setSelectedEndDate] = useState<Date>();\n const [shouldShowCustomRange, setShouldShowCustomRange] = useState<boolean>(false);\n const [calendarOpenDirection, setCalendarOpenDirection] =\n useState<OpenDirection>(openDirection);\n const calendarContainerRef = useRef<HTMLDivElement>(null);\n\n const calendarOptions: UseCalendarOptions = {};\n\n // If a start date is selected, open the calendar to that date\n if (selectedStartDate) {\n calendarOptions.defaultDate = selectedStartDate;\n }\n\n useEffect(() => {\n if (startDate) {\n setSelectedStartDate(startDate);\n }\n }, [startDate]);\n\n useEffect(() => {\n if (endDate) {\n setSelectedEndDate(endDate);\n }\n }, [endDate]);\n\n useLayoutEffect(() => {\n if (shouldShowCustomRange && calendarContainerRef.current) {\n if (\n calendarContainerRef.current.getBoundingClientRect().right > window.innerWidth\n ) {\n setCalendarOpenDirection('left');\n }\n }\n }, [shouldShowCustomRange]);\n\n const closeDatePicker = useCallback((): void => {\n setIsOpen(false);\n setShouldShowCustomRange(false);\n setCalendarOpenDirection(openDirection);\n }, [openDirection]);\n\n const handleOpenChange = (isOpen: boolean): void => {\n setIsOpen(isOpen);\n\n if (!isOpen) {\n setShouldShowCustomRange(false);\n setCalendarOpenDirection(openDirection);\n }\n };\n\n const handleSelectDate = useCallback(\n (selectedDate: Date): void => {\n // Start date and end date are selected, user clicks any date.\n // Set start date to the selected date, clear the end date.\n if (selectedStartDate && selectedEndDate) {\n // If futureStartDatesDisabled is true, only set the selected date to the date clicked if it's before today\n if (futureStartDatesDisabled && selectedDate > new Date()) {\n setSelectedEndDate(undefined);\n return;\n }\n setSelectedStartDate(selectedDate);\n setSelectedEndDate(undefined);\n return;\n }\n\n if (selectedStartDate) {\n if (isSameDate(selectedStartDate, selectedDate)) {\n // Start date is selected, user clicks start date.\n // Reset the start date.\n setSelectedStartDate(undefined);\n return;\n }\n\n // Start date is selected, user clicks an earlier date.\n // Set the earlier date to the new start date.\n if (selectedDate < selectedStartDate) {\n setSelectedStartDate(selectedDate);\n return;\n }\n\n // Otherwise, set the end date to the date the user clicked.\n setSelectedEndDate(selectedDate);\n onSelectDateRange(selectedStartDate, selectedDate);\n setShouldShowCustomRange(false);\n return;\n }\n\n setSelectedStartDate(selectedDate);\n },\n [futureStartDatesDisabled, onSelectDateRange, selectedEndDate, selectedStartDate]\n );\n\n const onTriggerKeyDown = useCallback((e: KeyboardEvent<HTMLDivElement>) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n setIsOpen(true);\n }\n }, []);\n\n const shouldShowPredefinedDates =\n predefinedDatesList !== undefined && predefinedDatesList.length > 0;\n\n return (\n <Dropdown\n onOpenChange={handleOpenChange}\n open={isOpen}\n >\n <Dropdown.Trigger\n disabled={disabled}\n onKeyDown={onTriggerKeyDown}\n >\n <DateRangePickerInput\n data-testid=\"datepicker-input-container\"\n disabled={disabled}\n isActive={isOpen}\n placeholder={placeholder}\n selectedEndDate={selectedEndDate}\n selectedStartDate={selectedStartDate}\n timezone={timezone}\n />\n </Dropdown.Trigger>\n <Dropdown.Content\n align=\"start\"\n responsivePositioning={responsivePositioning}\n >\n {shouldShowPredefinedDates ? (\n <PredefinedCalendarContainer\n gap=\"none\"\n orientation=\"horizontal\"\n padding=\"none\"\n >\n <PredefinedDates\n onSelectDateRange={onSelectDateRange}\n predefinedDatesList={predefinedDatesList}\n selectedEndDate={selectedEndDate}\n selectedStartDate={selectedStartDate}\n setEndDate={setSelectedEndDate}\n setStartDate={setSelectedStartDate}\n shouldShowCustomRange={shouldShowCustomRange}\n showCustomDateRange={setShouldShowCustomRange}\n timezone={timezone}\n />\n\n {shouldShowCustomRange && (\n <CalendarRendererContainer\n $openDirection={calendarOpenDirection}\n ref={calendarContainerRef}\n >\n <StyledCalendarRenderer\n calendarOptions={calendarOptions}\n allowYearMonthSelection={false}\n selectedDate={selectedStartDate}\n timezone={timezone}\n >\n {(body: Body) => (\n <Calendar\n calendarBody={body}\n closeDatepicker={closeDatePicker}\n futureDatesDisabled={futureDatesDisabled}\n futureStartDatesDisabled={futureStartDatesDisabled}\n maxRangeLength={maxRangeLength}\n setSelectedDate={handleSelectDate}\n startDate={selectedStartDate}\n endDate={selectedEndDate}\n timezone={timezone}\n />\n )}\n </StyledCalendarRenderer>\n </CalendarRendererContainer>\n )}\n </PredefinedCalendarContainer>\n ) : (\n <CalendarRenderer\n calendarOptions={calendarOptions}\n allowYearMonthSelection={false}\n selectedDate={selectedStartDate}\n timezone={timezone}\n >\n {(body: Body) => (\n <Calendar\n calendarBody={body}\n closeDatepicker={closeDatePicker}\n futureDatesDisabled={futureDatesDisabled}\n futureStartDatesDisabled={futureStartDatesDisabled}\n maxRangeLength={maxRangeLength}\n setSelectedDate={handleSelectDate}\n startDate={selectedStartDate}\n endDate={selectedEndDate}\n timezone={timezone}\n />\n )}\n </CalendarRenderer>\n )}\n </Dropdown.Content>\n </Dropdown>\n );\n};\n"],"names":["calendarWidth","PredefinedCalendarContainer","styled","Panel","withConfig","componentId","theme","click","panel","color","background","muted","PredefinedDatesContainer","Container","CalendarRendererContainer","div","datePicker","dateOption","stroke","range","radii","default","$openDirection","StyledCalendarRenderer","CalendarRenderer","ScrollableContainer","DateRangeTableCell","DateTableCell","$shouldShowRangeIndicator","Calendar","calendarBody","closeDatepicker","futureDatesDisabled","futureStartDatesDisabled","maxRangeLength","setSelectedDate","startDate","endDate","timezone","hoveredDate","setHoveredDate","useState","today","shiftToTimezone","Date","shiftedStart","undefined","shiftedEnd","handleMouseOut","value","map","key","weekKey","week","date","isCurrentMonth","dayKey","fullDate","isSelected","isSameDate","isPresent","isBetweenStartAndEndDates","Boolean","isDisabled","datesAreWithinMaxRange","shouldShowRangeIndicator","handleMouseEnter","handleClick","shiftFromTimezone","PredefinedDates","onSelectDateRange","predefinedDatesList","selectedEndDate","selectedStartDate","setEndDate","setStartDate","shouldShowCustomRange","showCustomDateRange","handleCustomTimePeriodClick","event","preventDefault","handleItemClick","rangeIsSelected","isWholeMonth","isDateRangeTheWholeMonth","formattedText","formatDateHeader","formatSelectedDate","trim","getTime","Icon","toISOString","DateRangePicker","disabled","openDirection","placeholder","responsivePositioning","isOpen","setIsOpen","setSelectedStartDate","setSelectedEndDate","setShouldShowCustomRange","calendarOpenDirection","setCalendarOpenDirection","calendarContainerRef","useRef","calendarOptions","defaultDate","useEffect","useLayoutEffect","current","getBoundingClientRect","right","window","innerWidth","closeDatePicker","useCallback","handleOpenChange","handleSelectDate","selectedDate","onTriggerKeyDown","e","shouldShowPredefinedDates","length","body"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DateRangePicker.js","sources":["../../../../src/components/DatePicker/DateRangePicker.tsx"],"sourcesContent":["import {\n Dispatch,\n KeyboardEvent,\n MouseEvent,\n SetStateAction,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { isSameDate, UseCalendarOptions } from '@h6s/calendar';\nimport { styled } from 'styled-components';\nimport { Dropdown } from '@/components/Dropdown';\nimport {\n Body,\n CalendarRenderer,\n DateRangePickerInput,\n DateTableCell,\n StyledDropdownItem,\n} from './Common';\nimport { Container } from '@/components/Container';\nimport { Panel } from '@/components/Panel';\nimport { Icon } from '@/components/Icon';\nimport {\n DateRange,\n datesAreWithinMaxRange,\n formatDateHeader,\n formatSelectedDate,\n shiftFromTimezone,\n isDateNotInAllowList,\n isDateRangeTheWholeMonth,\n Timezone,\n shiftToTimezone,\n} from './utils';\n\ntype OpenDirection = 'left' | 'right';\n\nconst calendarWidth = 275;\n\nconst PredefinedCalendarContainer = styled(Panel)`\n align-items: start;\n background: ${({ theme }) => theme.click.panel.color.background.muted};\n`;\n\nconst PredefinedDatesContainer = styled(Container)`\n width: ${calendarWidth}px;\n`;\n\n// left value of 276px is the width of the PredefinedDatesContainer + 1 pixel for border\nconst CalendarRendererContainer = styled.div<{ $openDirection?: OpenDirection }>`\n border: ${({ theme }) =>\n `${theme.click.datePicker.dateOption.stroke} solid ${theme.click.datePicker.dateOption.color.background.range}`};\n border-radius: ${({ theme }) => theme.click.datePicker.dateOption.radii.default};\n box-shadow:\n lch(6.77 0 0 / 0.15) 4px 4px 6px -1px,\n lch(6.77 0 0 / 0.15) 2px 2px 4px -1px;\n ${({ $openDirection }) => ($openDirection === 'left' ? 'right: 100%;' : 'left: 276px;')}\n position: absolute;\n top: 0;\n`;\n\n// Height of 221px is height the height the calendar needs to match the PredefinedDatesContainer\nconst StyledCalendarRenderer = styled(CalendarRenderer)`\n border-radius: ${({ theme }) => theme.click.datePicker.dateOption.radii.default};\n min-height: 221px;\n`;\n\n// max-height of 210px allows the scrollable container to be a reasonble height that matches the calendar\nconst ScrollableContainer = styled(Container)`\n max-height: 210px;\n overflow-y: auto;\n`;\n\nconst DateRangeTableCell = styled(DateTableCell)<{\n $shouldShowRangeIndicator?: boolean;\n}>`\n ${({ $shouldShowRangeIndicator, theme }) =>\n $shouldShowRangeIndicator &&\n `\n background: ${theme.click.datePicker.dateOption.color.background.range};\n border: ${theme.click.datePicker.dateOption.stroke} solid ${theme.click.datePicker.dateOption.color.background.range};\n border-radius: 0;\n `}\n`;\n\ninterface CalendarProps {\n allowOnlyDatesList?: Array<Date>;\n calendarBody: Body;\n closeDatepicker: () => void;\n futureDatesDisabled: boolean;\n futureStartDatesDisabled: boolean;\n maxRangeLength: number;\n setSelectedDate: (selectedDate: Date) => void;\n startDate?: Date;\n endDate?: Date;\n timezone: Timezone;\n}\n\nconst Calendar = ({\n allowOnlyDatesList,\n calendarBody,\n closeDatepicker,\n futureDatesDisabled,\n futureStartDatesDisabled,\n maxRangeLength,\n setSelectedDate,\n startDate,\n endDate,\n timezone,\n}: CalendarProps) => {\n const [hoveredDate, setHoveredDate] = useState<Date>();\n\n const today = shiftToTimezone(new Date(), timezone);\n const shiftedStart = startDate ? shiftToTimezone(startDate, timezone) : undefined;\n const shiftedEnd = endDate ? shiftToTimezone(endDate, timezone) : undefined;\n\n const shiftedAllowList = useMemo(() => {\n return allowOnlyDatesList?.map(date => {\n return shiftToTimezone(date, timezone);\n });\n }, [allowOnlyDatesList, timezone]);\n\n const handleMouseOut = (): void => {\n setHoveredDate(undefined);\n };\n\n return calendarBody.value.map(({ key: weekKey, value: week }) => {\n return (\n <tr key={weekKey}>\n {week.map(({ date, isCurrentMonth, key: dayKey, value: fullDate }) => {\n const isSelected =\n (shiftedStart && isSameDate(shiftedStart, fullDate)) ||\n (shiftedEnd && isSameDate(shiftedEnd, fullDate));\n const isPresent = isSameDate(today, fullDate);\n\n const isBetweenStartAndEndDates = Boolean(\n shiftedStart && shiftedEnd && fullDate > shiftedStart && fullDate < shiftedEnd\n );\n\n let isDisabled = false;\n if (futureDatesDisabled && fullDate > today) {\n isDisabled = true;\n }\n\n if (futureStartDatesDisabled && !shiftedStart && fullDate > today) {\n isDisabled = true;\n }\n\n if (\n maxRangeLength > 1 &&\n shiftedStart &&\n !datesAreWithinMaxRange(shiftedStart, fullDate, maxRangeLength) &&\n fullDate > shiftedStart\n ) {\n isDisabled = true;\n }\n\n if (isDateNotInAllowList(shiftedAllowList, fullDate)) {\n isDisabled = true;\n }\n\n const shouldShowRangeIndicator =\n !shiftedEnd &&\n Boolean(\n shiftedStart &&\n hoveredDate &&\n fullDate > shiftedStart &&\n fullDate < hoveredDate\n );\n\n const handleMouseEnter = () => {\n setHoveredDate(fullDate);\n };\n\n const handleClick = () => {\n if (isDisabled) {\n return false;\n }\n setSelectedDate(shiftFromTimezone(fullDate, timezone));\n\n // User has a date range selected and clicked a new date.\n // This will cause the selected date to be reset, thus do not close the datepicker.\n if (shiftedStart && shiftedEnd) {\n return;\n }\n\n // The user has selected a new start date, don't close\n if (shiftedStart && fullDate < shiftedStart) {\n return;\n }\n\n // Only close the datepicker if the user hasn't clicked the selected start date.\n if (shiftedStart && !isSameDate(fullDate, shiftedStart)) {\n closeDatepicker();\n return;\n }\n };\n return (\n <DateRangeTableCell\n $shouldShowRangeIndicator={\n !isSelected && (shouldShowRangeIndicator || isBetweenStartAndEndDates)\n }\n $isCurrentMonth={isCurrentMonth}\n $isDisabled={isDisabled}\n $isSelected={isSelected}\n $isPresent={isPresent}\n key={dayKey}\n onClick={handleClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseOut}\n >\n {date}\n </DateRangeTableCell>\n );\n })}\n </tr>\n );\n });\n};\n\ninterface PredefinedDatesProps {\n onSelectDateRange: (selectedStartDate: Date, selectedEndDate: Date) => void;\n predefinedDatesList: DateRange[];\n selectedEndDate: Date | undefined;\n selectedStartDate: Date | undefined;\n setEndDate: Dispatch<SetStateAction<Date | undefined>>;\n setStartDate: Dispatch<SetStateAction<Date | undefined>>;\n shouldShowCustomRange: boolean;\n showCustomDateRange: Dispatch<SetStateAction<boolean>>;\n timezone: Timezone;\n}\n\nconst PredefinedDates = ({\n onSelectDateRange,\n predefinedDatesList,\n selectedEndDate,\n selectedStartDate,\n setEndDate,\n setStartDate,\n shouldShowCustomRange,\n showCustomDateRange,\n timezone,\n}: PredefinedDatesProps) => {\n const handleCustomTimePeriodClick = (event: MouseEvent) => {\n event.preventDefault();\n showCustomDateRange(!shouldShowCustomRange);\n };\n\n return (\n <PredefinedDatesContainer\n data-testid=\"predefined-dates-list\"\n isResponsive={false}\n orientation=\"vertical\"\n >\n <ScrollableContainer orientation=\"vertical\">\n {predefinedDatesList.map(({ startDate, endDate }) => {\n const handleItemClick = () => {\n setStartDate(startDate);\n setEndDate(endDate);\n onSelectDateRange(startDate, endDate);\n };\n\n const rangeIsSelected =\n selectedEndDate &&\n isSameDate(selectedEndDate, endDate) &&\n selectedStartDate &&\n isSameDate(selectedStartDate, startDate);\n\n const isWholeMonth = isDateRangeTheWholeMonth({ startDate, endDate }, timezone);\n\n const formattedText = isWholeMonth\n ? formatDateHeader(timezone, startDate)\n : `${formatSelectedDate(timezone, startDate)} – ${formatSelectedDate(timezone, endDate)}`.trim();\n\n return (\n <StyledDropdownItem\n data-testid={`predefined-date-${startDate.getTime()}`}\n key={startDate.toISOString()}\n onClick={handleItemClick}\n >\n <Container\n data-selected={rangeIsSelected}\n data-testid={formattedText}\n justifyContent=\"space-between\"\n orientation=\"horizontal\"\n >\n {formattedText}\n {rangeIsSelected && <Icon name=\"check\" />}\n </Container>\n </StyledDropdownItem>\n );\n })}\n </ScrollableContainer>\n <StyledDropdownItem onClick={handleCustomTimePeriodClick}>\n <Container\n justifyContent=\"space-between\"\n orientation=\"horizontal\"\n >\n Custom time period <Icon name=\"chevron-right\" />\n </Container>\n </StyledDropdownItem>\n </PredefinedDatesContainer>\n );\n};\n\nexport interface DateRangePickerProps {\n allowOnlyDatesList?: Array<Date>;\n endDate?: Date;\n disabled?: boolean;\n futureDatesDisabled?: boolean;\n futureStartDatesDisabled?: boolean;\n onSelectDateRange: (selectedStartDate: Date, selectedEndDate: Date) => void;\n openDirection?: OpenDirection;\n placeholder?: string;\n predefinedDatesList?: DateRange[];\n maxRangeLength?: number;\n startDate?: Date;\n responsivePositioning?: boolean;\n timezone?: Timezone;\n}\n\nexport const DateRangePicker = ({\n allowOnlyDatesList,\n endDate,\n startDate,\n disabled = false,\n futureDatesDisabled = false,\n futureStartDatesDisabled = false,\n maxRangeLength = -1,\n onSelectDateRange,\n openDirection = 'right',\n placeholder = 'start date – end date',\n predefinedDatesList,\n responsivePositioning = true,\n timezone = 'system',\n}: DateRangePickerProps) => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const [selectedStartDate, setSelectedStartDate] = useState<Date>();\n const [selectedEndDate, setSelectedEndDate] = useState<Date>();\n const [shouldShowCustomRange, setShouldShowCustomRange] = useState<boolean>(false);\n const [calendarOpenDirection, setCalendarOpenDirection] =\n useState<OpenDirection>(openDirection);\n const calendarContainerRef = useRef<HTMLDivElement>(null);\n\n const calendarOptions: UseCalendarOptions = {};\n\n // If a start date is selected, open the calendar to that date\n if (selectedStartDate) {\n calendarOptions.defaultDate = selectedStartDate;\n }\n\n useEffect(() => {\n if (startDate) {\n setSelectedStartDate(startDate);\n }\n }, [startDate]);\n\n useEffect(() => {\n if (endDate) {\n setSelectedEndDate(endDate);\n }\n }, [endDate]);\n\n useLayoutEffect(() => {\n if (shouldShowCustomRange && calendarContainerRef.current) {\n if (\n calendarContainerRef.current.getBoundingClientRect().right > window.innerWidth\n ) {\n setCalendarOpenDirection('left');\n }\n }\n }, [shouldShowCustomRange]);\n\n const closeDatePicker = useCallback((): void => {\n setIsOpen(false);\n setShouldShowCustomRange(false);\n setCalendarOpenDirection(openDirection);\n }, [openDirection]);\n\n const handleOpenChange = (isOpen: boolean): void => {\n setIsOpen(isOpen);\n\n if (!isOpen) {\n setShouldShowCustomRange(false);\n setCalendarOpenDirection(openDirection);\n }\n };\n\n const handleSelectDate = useCallback(\n (selectedDate: Date): void => {\n // Start date and end date are selected, user clicks any date.\n // Set start date to the selected date, clear the end date.\n if (selectedStartDate && selectedEndDate) {\n // If futureStartDatesDisabled is true, only set the selected date to the date clicked if it's before today\n if (futureStartDatesDisabled && selectedDate > new Date()) {\n setSelectedEndDate(undefined);\n return;\n }\n setSelectedStartDate(selectedDate);\n setSelectedEndDate(undefined);\n return;\n }\n\n if (selectedStartDate) {\n if (isSameDate(selectedStartDate, selectedDate)) {\n // Start date is selected, user clicks start date.\n // Reset the start date.\n setSelectedStartDate(undefined);\n return;\n }\n\n // Start date is selected, user clicks an earlier date.\n // Set the earlier date to the new start date.\n if (selectedDate < selectedStartDate) {\n setSelectedStartDate(selectedDate);\n return;\n }\n\n // Otherwise, set the end date to the date the user clicked.\n setSelectedEndDate(selectedDate);\n onSelectDateRange(selectedStartDate, selectedDate);\n setShouldShowCustomRange(false);\n return;\n }\n\n setSelectedStartDate(selectedDate);\n },\n [futureStartDatesDisabled, onSelectDateRange, selectedEndDate, selectedStartDate]\n );\n\n const onTriggerKeyDown = useCallback((e: KeyboardEvent<HTMLDivElement>) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n setIsOpen(true);\n }\n }, []);\n\n const shouldShowPredefinedDates =\n predefinedDatesList !== undefined && predefinedDatesList.length > 0;\n\n return (\n <Dropdown\n onOpenChange={handleOpenChange}\n open={isOpen}\n >\n <Dropdown.Trigger\n disabled={disabled}\n onKeyDown={onTriggerKeyDown}\n >\n <DateRangePickerInput\n data-testid=\"datepicker-input-container\"\n disabled={disabled}\n isActive={isOpen}\n placeholder={placeholder}\n selectedEndDate={selectedEndDate}\n selectedStartDate={selectedStartDate}\n timezone={timezone}\n />\n </Dropdown.Trigger>\n <Dropdown.Content\n align=\"start\"\n responsivePositioning={responsivePositioning}\n >\n {shouldShowPredefinedDates ? (\n <PredefinedCalendarContainer\n gap=\"none\"\n orientation=\"horizontal\"\n padding=\"none\"\n >\n <PredefinedDates\n onSelectDateRange={onSelectDateRange}\n predefinedDatesList={predefinedDatesList}\n selectedEndDate={selectedEndDate}\n selectedStartDate={selectedStartDate}\n setEndDate={setSelectedEndDate}\n setStartDate={setSelectedStartDate}\n shouldShowCustomRange={shouldShowCustomRange}\n showCustomDateRange={setShouldShowCustomRange}\n timezone={timezone}\n />\n\n {shouldShowCustomRange && (\n <CalendarRendererContainer\n $openDirection={calendarOpenDirection}\n ref={calendarContainerRef}\n >\n <StyledCalendarRenderer\n calendarOptions={calendarOptions}\n allowYearMonthSelection={false}\n selectedDate={selectedStartDate}\n timezone={timezone}\n >\n {(body: Body) => (\n <Calendar\n allowOnlyDatesList={allowOnlyDatesList}\n calendarBody={body}\n closeDatepicker={closeDatePicker}\n futureDatesDisabled={futureDatesDisabled}\n futureStartDatesDisabled={futureStartDatesDisabled}\n maxRangeLength={maxRangeLength}\n setSelectedDate={handleSelectDate}\n startDate={selectedStartDate}\n endDate={selectedEndDate}\n timezone={timezone}\n />\n )}\n </StyledCalendarRenderer>\n </CalendarRendererContainer>\n )}\n </PredefinedCalendarContainer>\n ) : (\n <CalendarRenderer\n calendarOptions={calendarOptions}\n allowYearMonthSelection={false}\n selectedDate={selectedStartDate}\n timezone={timezone}\n >\n {(body: Body) => (\n <Calendar\n allowOnlyDatesList={allowOnlyDatesList}\n calendarBody={body}\n closeDatepicker={closeDatePicker}\n futureDatesDisabled={futureDatesDisabled}\n futureStartDatesDisabled={futureStartDatesDisabled}\n maxRangeLength={maxRangeLength}\n setSelectedDate={handleSelectDate}\n startDate={selectedStartDate}\n endDate={selectedEndDate}\n timezone={timezone}\n />\n )}\n </CalendarRenderer>\n )}\n </Dropdown.Content>\n </Dropdown>\n );\n};\n"],"names":["calendarWidth","PredefinedCalendarContainer","styled","Panel","withConfig","componentId","theme","click","panel","color","background","muted","PredefinedDatesContainer","Container","CalendarRendererContainer","div","datePicker","dateOption","stroke","range","radii","default","$openDirection","StyledCalendarRenderer","CalendarRenderer","ScrollableContainer","DateRangeTableCell","DateTableCell","$shouldShowRangeIndicator","Calendar","allowOnlyDatesList","calendarBody","closeDatepicker","futureDatesDisabled","futureStartDatesDisabled","maxRangeLength","setSelectedDate","startDate","endDate","timezone","hoveredDate","setHoveredDate","useState","today","shiftToTimezone","Date","shiftedStart","undefined","shiftedEnd","shiftedAllowList","useMemo","map","date","handleMouseOut","value","key","weekKey","week","isCurrentMonth","dayKey","fullDate","isSelected","isSameDate","isPresent","isBetweenStartAndEndDates","Boolean","isDisabled","datesAreWithinMaxRange","isDateNotInAllowList","shouldShowRangeIndicator","handleMouseEnter","handleClick","shiftFromTimezone","PredefinedDates","onSelectDateRange","predefinedDatesList","selectedEndDate","selectedStartDate","setEndDate","setStartDate","shouldShowCustomRange","showCustomDateRange","handleCustomTimePeriodClick","event","preventDefault","handleItemClick","rangeIsSelected","isWholeMonth","isDateRangeTheWholeMonth","formattedText","formatDateHeader","formatSelectedDate","trim","getTime","Icon","toISOString","DateRangePicker","disabled","openDirection","placeholder","responsivePositioning","isOpen","setIsOpen","setSelectedStartDate","setSelectedEndDate","setShouldShowCustomRange","calendarOpenDirection","setCalendarOpenDirection","calendarContainerRef","useRef","calendarOptions","defaultDate","useEffect","useLayoutEffect","current","getBoundingClientRect","right","window","innerWidth","closeDatePicker","useCallback","handleOpenChange","handleSelectDate","selectedDate","onTriggerKeyDown","e","shouldShowPredefinedDates","length","body"],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@ import { isSameDate } from '@h6s/calendar';
|
|
|
4
4
|
import * as RadixPopover from '@radix-ui/react-popover';
|
|
5
5
|
import { styled } from 'styled-components';
|
|
6
6
|
import { DatePickerInput, CalendarRenderer, DateTableCell } from './Common.js';
|
|
7
|
-
import { shiftToTimezone, shiftFromTimezone } from './utils.js';
|
|
7
|
+
import { shiftToTimezone, shiftFromTimezone, isDateNotInAllowList } from './utils.js';
|
|
8
8
|
import { useResolvedPortalContainer } from '../../providers/PortalContext.js';
|
|
9
9
|
|
|
10
10
|
const DAYS_IN_WEEK = 7;
|
|
@@ -100,9 +100,7 @@ const Calendar = ({
|
|
|
100
100
|
}) => {
|
|
101
101
|
const isSelected = shiftedSelected && isSameDate(shiftedSelected, fullDate);
|
|
102
102
|
const isPresent = isSameDate(today, fullDate);
|
|
103
|
-
const isNotAllowed = shiftedAllowList
|
|
104
|
-
return isSameDate(shiftedDate, fullDate);
|
|
105
|
-
});
|
|
103
|
+
const isNotAllowed = isDateNotInAllowList(shiftedAllowList, fullDate);
|
|
106
104
|
const isFutureDisabled = futureDatesDisabled && fullDate > today;
|
|
107
105
|
const isDisabled = isNotAllowed || isFutureDisabled;
|
|
108
106
|
const currentIndex = dayIndex;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import { KeyboardEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { isSameDate, UseCalendarOptions } from '@h6s/calendar';\nimport * as Popover from '@radix-ui/react-popover';\nimport { styled } from 'styled-components';\nimport { Body, CalendarRenderer, DatePickerInput, DateTableCell } from './Common';\nimport { shiftFromTimezone, shiftToTimezone, Timezone } from './utils';\nimport { useResolvedPortalContainer } from '@/providers/PortalContext';\n\nconst DAYS_IN_WEEK = 7;\n\nconst PopoverTrigger = styled(Popover.Trigger)`\n background: none;\n border: none;\n padding: 0;\n cursor: pointer;\n width: fit-content;\n\n &:disabled {\n cursor: not-allowed;\n }\n\n &:focus-visible {\n outline: none;\n }\n`;\n\nconst PopoverContent = styled(Popover.Content)`\n z-index: 1;\n outline: none;\n\n ${({ theme }) => `\n border: 1px solid ${theme.click.genericMenu.panel.color.stroke.default};\n background: ${theme.click.genericMenu.panel.color.background.default};\n box-shadow: ${theme.click.genericMenu.panel.shadow.default};\n border-radius: ${theme.click.genericMenu.panel.radii.all};\n `}\n\n &:focus {\n outline: none;\n }\n`;\n\ninterface CalendarProps {\n allowOnlyDatesList?: Array<Date>;\n calendarBody: Body;\n closeDatepicker: () => void;\n futureDatesDisabled: boolean;\n selectedDate?: Date;\n setSelectedDate: (selectedDate: Date) => void;\n autoFocus?: boolean;\n timezone: Timezone;\n}\n\nconst Calendar = ({\n allowOnlyDatesList,\n calendarBody,\n closeDatepicker,\n futureDatesDisabled,\n selectedDate,\n setSelectedDate,\n autoFocus = false,\n timezone,\n}: CalendarProps) => {\n const allDays = calendarBody.value.flatMap(week => week.value);\n const totalDays = allDays.length;\n\n const today = shiftToTimezone(new Date(), timezone);\n\n const shiftedSelected = selectedDate\n ? shiftToTimezone(selectedDate, timezone)\n : undefined;\n\n const shiftedAllowList = useMemo(() => {\n return allowOnlyDatesList?.map(date => {\n return shiftToTimezone(date, timezone);\n });\n }, [allowOnlyDatesList, timezone]);\n\n const initialFocusIndex = allDays.findIndex(day =>\n shiftedSelected\n ? isSameDate(shiftedSelected, day.value)\n : isSameDate(today, day.value)\n );\n\n const [focusedDayIndex, setFocusedDayIndex] = useState<number>(\n initialFocusIndex >= 0 ? initialFocusIndex : 0\n );\n const dayRefs = useRef<Array<HTMLTableCellElement | null>>([]);\n\n useEffect(() => {\n dayRefs.current[focusedDayIndex]?.focus();\n }, [focusedDayIndex]);\n\n useEffect(() => {\n if (autoFocus && initialFocusIndex >= 0) {\n const timeoutId = setTimeout(() => {\n dayRefs.current[initialFocusIndex]?.focus();\n }, 0);\n return () => clearTimeout(timeoutId);\n }\n }, [autoFocus, initialFocusIndex]);\n\n const onDayKeyDown = useCallback(\n (\n event: KeyboardEvent<HTMLTableCellElement>,\n index: number,\n fullDate: Date,\n isDisabled: boolean\n ) => {\n let newIndex = index;\n\n switch (event.key) {\n case 'ArrowRight':\n event.preventDefault();\n newIndex = (index + 1) % totalDays;\n break;\n case 'ArrowLeft':\n event.preventDefault();\n newIndex = (index - 1 + totalDays) % totalDays;\n break;\n case 'ArrowDown':\n event.preventDefault();\n newIndex = (index + DAYS_IN_WEEK) % totalDays;\n break;\n case 'ArrowUp':\n event.preventDefault();\n newIndex = (index - DAYS_IN_WEEK + totalDays) % totalDays;\n break;\n case 'Enter':\n case ' ':\n event.preventDefault();\n if (!isDisabled) {\n setSelectedDate(shiftFromTimezone(fullDate, timezone));\n closeDatepicker();\n }\n return;\n default:\n return;\n }\n\n setFocusedDayIndex(newIndex);\n dayRefs.current[newIndex]?.focus();\n },\n [totalDays, setSelectedDate, closeDatepicker, timezone]\n );\n\n let dayIndex = 0;\n\n return calendarBody.value.map(({ key: weekKey, value: week }) => {\n return (\n <tr key={weekKey}>\n {week.map(({ date, isCurrentMonth, key: dayKey, value: fullDate }) => {\n const isSelected = shiftedSelected && isSameDate(shiftedSelected, fullDate);\n const isPresent = isSameDate(today, fullDate);\n\n const isNotAllowed =\n shiftedAllowList &&\n shiftedAllowList.length > 0 &&\n !shiftedAllowList.some((shiftedDate: Date) => {\n return isSameDate(shiftedDate, fullDate);\n });\n\n const isFutureDisabled = futureDatesDisabled && fullDate > today;\n const isDisabled = isNotAllowed || isFutureDisabled;\n const currentIndex = dayIndex;\n dayIndex++;\n\n const handleClick = () => {\n if (isDisabled) {\n return false;\n }\n setSelectedDate(shiftFromTimezone(fullDate, timezone));\n closeDatepicker();\n };\n\n return (\n <DateTableCell\n ref={el => {\n dayRefs.current[currentIndex] = el;\n }}\n $isCurrentMonth={isCurrentMonth}\n $isDisabled={isDisabled}\n $isSelected={isSelected}\n $isPresent={isPresent}\n key={dayKey}\n onClick={handleClick}\n onKeyDown={e => onDayKeyDown(e, currentIndex, fullDate, isDisabled)}\n tabIndex={currentIndex === focusedDayIndex ? 0 : -1}\n role=\"gridcell\"\n aria-label={fullDate.toDateString()}\n >\n {date}\n </DateTableCell>\n );\n })}\n </tr>\n );\n });\n};\n\nexport interface DatePickerProps {\n allowOnlyDatesList?: Array<Date>;\n container?: HTMLElement | null;\n date?: Date;\n disabled?: boolean;\n futureDatesDisabled?: boolean;\n onSelectDate: (selectedDate: Date) => void;\n placeholder?: string;\n responsivePositioning?: boolean;\n timezone?: Timezone;\n}\n\nexport const DatePicker = ({\n allowOnlyDatesList,\n container,\n date,\n disabled = false,\n futureDatesDisabled = false,\n onSelectDate,\n placeholder,\n responsivePositioning = true,\n timezone = 'system',\n}: DatePickerProps) => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const [selectedDate, setSelectedDate] = useState<Date>();\n const [partialYear, setPartialYear] = useState<number>();\n const [partialMonth, setPartialMonth] = useState<number>();\n const [autoFocusCalendar, setAutoFocusCalendar] = useState<boolean>(false);\n\n const calendarOptions: UseCalendarOptions = {};\n const portalContainer = useResolvedPortalContainer(container);\n\n if (selectedDate) {\n calendarOptions.defaultDate = selectedDate;\n }\n\n useEffect(() => {\n if (date) {\n setSelectedDate(date);\n }\n }, [date]);\n\n const resetPartialState = useCallback(() => {\n setPartialYear(undefined);\n setPartialMonth(undefined);\n }, []);\n\n const onOpenChange = useCallback(\n (open: boolean) => {\n setIsOpen(open);\n if (!open) {\n resetPartialState();\n setAutoFocusCalendar(false);\n }\n },\n [resetPartialState]\n );\n\n const onCloseDatePicker = useCallback(() => {\n setIsOpen(false);\n resetPartialState();\n }, [resetPartialState]);\n\n const onDateSelect = useCallback(\n (date: Date): void => {\n setSelectedDate(date);\n onSelectDate(date);\n resetPartialState();\n },\n [onSelectDate, resetPartialState]\n );\n\n const onYearSelect = useCallback((year: number) => {\n setPartialYear(year);\n setPartialMonth(undefined);\n }, []);\n\n const onMonthSelect = useCallback((year: number, month: number) => {\n setPartialYear(year);\n setPartialMonth(month);\n }, []);\n\n const onTriggerKeyDown = useCallback((e: KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n setIsOpen(true);\n setAutoFocusCalendar(true);\n }\n }, []);\n\n return (\n <Popover.Root\n onOpenChange={onOpenChange}\n open={isOpen}\n >\n <PopoverTrigger\n disabled={disabled}\n onKeyDown={onTriggerKeyDown}\n >\n <DatePickerInput\n data-testid=\"datepicker-input-container\"\n disabled={disabled}\n isActive={isOpen}\n partialMonth={partialMonth}\n partialYear={partialYear}\n placeholder={placeholder}\n selectedDate={selectedDate}\n timezone={timezone}\n />\n </PopoverTrigger>\n <Popover.Portal container={portalContainer}>\n <PopoverContent\n align=\"start\"\n avoidCollisions={responsivePositioning}\n sideOffset={4}\n >\n <CalendarRenderer\n calendarOptions={calendarOptions}\n onYearSelect={onYearSelect}\n onMonthSelect={onMonthSelect}\n selectedDate={selectedDate}\n timezone={timezone}\n >\n {body => (\n <Calendar\n allowOnlyDatesList={allowOnlyDatesList}\n autoFocus={autoFocusCalendar}\n calendarBody={body}\n closeDatepicker={onCloseDatePicker}\n futureDatesDisabled={futureDatesDisabled}\n selectedDate={selectedDate}\n setSelectedDate={onDateSelect}\n timezone={timezone}\n />\n )}\n </CalendarRenderer>\n </PopoverContent>\n </Popover.Portal>\n </Popover.Root>\n );\n};\n"],"names":["DAYS_IN_WEEK","PopoverTrigger","styled","Popover","Trigger","withConfig","componentId","PopoverContent","Content","theme","click","genericMenu","panel","color","stroke","default","background","shadow","radii","all","Calendar","allowOnlyDatesList","calendarBody","closeDatepicker","futureDatesDisabled","selectedDate","setSelectedDate","autoFocus","timezone","allDays","value","flatMap","week","totalDays","length","today","shiftToTimezone","Date","shiftedSelected","undefined","shiftedAllowList","useMemo","map","date","initialFocusIndex","findIndex","day","isSameDate","focusedDayIndex","setFocusedDayIndex","useState","dayRefs","useRef","useEffect","current","focus","timeoutId","setTimeout","clearTimeout","onDayKeyDown","useCallback","event","index","fullDate","isDisabled","newIndex","key","preventDefault","shiftFromTimezone","dayIndex","weekKey","isCurrentMonth","dayKey","isSelected","isPresent","isNotAllowed","some","shiftedDate","isFutureDisabled","currentIndex","handleClick","el","e","toDateString","DatePicker","container","disabled","onSelectDate","placeholder","responsivePositioning","isOpen","setIsOpen","partialYear","setPartialYear","partialMonth","setPartialMonth","autoFocusCalendar","setAutoFocusCalendar","calendarOptions","portalContainer","useResolvedPortalContainer","defaultDate","resetPartialState","onOpenChange","open","onCloseDatePicker","onDateSelect","onYearSelect","year","onMonthSelect","month","onTriggerKeyDown","body"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import { KeyboardEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { isSameDate, UseCalendarOptions } from '@h6s/calendar';\nimport * as Popover from '@radix-ui/react-popover';\nimport { styled } from 'styled-components';\nimport { Body, CalendarRenderer, DatePickerInput, DateTableCell } from './Common';\nimport {\n isDateNotInAllowList,\n shiftFromTimezone,\n shiftToTimezone,\n Timezone,\n} from './utils';\nimport { useResolvedPortalContainer } from '@/providers/PortalContext';\n\nconst DAYS_IN_WEEK = 7;\n\nconst PopoverTrigger = styled(Popover.Trigger)`\n background: none;\n border: none;\n padding: 0;\n cursor: pointer;\n width: fit-content;\n\n &:disabled {\n cursor: not-allowed;\n }\n\n &:focus-visible {\n outline: none;\n }\n`;\n\nconst PopoverContent = styled(Popover.Content)`\n z-index: 1;\n outline: none;\n\n ${({ theme }) => `\n border: 1px solid ${theme.click.genericMenu.panel.color.stroke.default};\n background: ${theme.click.genericMenu.panel.color.background.default};\n box-shadow: ${theme.click.genericMenu.panel.shadow.default};\n border-radius: ${theme.click.genericMenu.panel.radii.all};\n `}\n\n &:focus {\n outline: none;\n }\n`;\n\ninterface CalendarProps {\n allowOnlyDatesList?: Array<Date>;\n calendarBody: Body;\n closeDatepicker: () => void;\n futureDatesDisabled: boolean;\n selectedDate?: Date;\n setSelectedDate: (selectedDate: Date) => void;\n autoFocus?: boolean;\n timezone: Timezone;\n}\n\nconst Calendar = ({\n allowOnlyDatesList,\n calendarBody,\n closeDatepicker,\n futureDatesDisabled,\n selectedDate,\n setSelectedDate,\n autoFocus = false,\n timezone,\n}: CalendarProps) => {\n const allDays = calendarBody.value.flatMap(week => week.value);\n const totalDays = allDays.length;\n\n const today = shiftToTimezone(new Date(), timezone);\n\n const shiftedSelected = selectedDate\n ? shiftToTimezone(selectedDate, timezone)\n : undefined;\n\n const shiftedAllowList = useMemo(() => {\n return allowOnlyDatesList?.map(date => {\n return shiftToTimezone(date, timezone);\n });\n }, [allowOnlyDatesList, timezone]);\n\n const initialFocusIndex = allDays.findIndex(day =>\n shiftedSelected\n ? isSameDate(shiftedSelected, day.value)\n : isSameDate(today, day.value)\n );\n\n const [focusedDayIndex, setFocusedDayIndex] = useState<number>(\n initialFocusIndex >= 0 ? initialFocusIndex : 0\n );\n const dayRefs = useRef<Array<HTMLTableCellElement | null>>([]);\n\n useEffect(() => {\n dayRefs.current[focusedDayIndex]?.focus();\n }, [focusedDayIndex]);\n\n useEffect(() => {\n if (autoFocus && initialFocusIndex >= 0) {\n const timeoutId = setTimeout(() => {\n dayRefs.current[initialFocusIndex]?.focus();\n }, 0);\n return () => clearTimeout(timeoutId);\n }\n }, [autoFocus, initialFocusIndex]);\n\n const onDayKeyDown = useCallback(\n (\n event: KeyboardEvent<HTMLTableCellElement>,\n index: number,\n fullDate: Date,\n isDisabled: boolean\n ) => {\n let newIndex = index;\n\n switch (event.key) {\n case 'ArrowRight':\n event.preventDefault();\n newIndex = (index + 1) % totalDays;\n break;\n case 'ArrowLeft':\n event.preventDefault();\n newIndex = (index - 1 + totalDays) % totalDays;\n break;\n case 'ArrowDown':\n event.preventDefault();\n newIndex = (index + DAYS_IN_WEEK) % totalDays;\n break;\n case 'ArrowUp':\n event.preventDefault();\n newIndex = (index - DAYS_IN_WEEK + totalDays) % totalDays;\n break;\n case 'Enter':\n case ' ':\n event.preventDefault();\n if (!isDisabled) {\n setSelectedDate(shiftFromTimezone(fullDate, timezone));\n closeDatepicker();\n }\n return;\n default:\n return;\n }\n\n setFocusedDayIndex(newIndex);\n dayRefs.current[newIndex]?.focus();\n },\n [totalDays, setSelectedDate, closeDatepicker, timezone]\n );\n\n let dayIndex = 0;\n\n return calendarBody.value.map(({ key: weekKey, value: week }) => {\n return (\n <tr key={weekKey}>\n {week.map(({ date, isCurrentMonth, key: dayKey, value: fullDate }) => {\n const isSelected = shiftedSelected && isSameDate(shiftedSelected, fullDate);\n const isPresent = isSameDate(today, fullDate);\n\n const isNotAllowed = isDateNotInAllowList(shiftedAllowList, fullDate);\n\n const isFutureDisabled = futureDatesDisabled && fullDate > today;\n const isDisabled = isNotAllowed || isFutureDisabled;\n const currentIndex = dayIndex;\n dayIndex++;\n\n const handleClick = () => {\n if (isDisabled) {\n return false;\n }\n setSelectedDate(shiftFromTimezone(fullDate, timezone));\n closeDatepicker();\n };\n\n return (\n <DateTableCell\n ref={el => {\n dayRefs.current[currentIndex] = el;\n }}\n $isCurrentMonth={isCurrentMonth}\n $isDisabled={isDisabled}\n $isSelected={isSelected}\n $isPresent={isPresent}\n key={dayKey}\n onClick={handleClick}\n onKeyDown={e => onDayKeyDown(e, currentIndex, fullDate, isDisabled)}\n tabIndex={currentIndex === focusedDayIndex ? 0 : -1}\n role=\"gridcell\"\n aria-label={fullDate.toDateString()}\n >\n {date}\n </DateTableCell>\n );\n })}\n </tr>\n );\n });\n};\n\nexport interface DatePickerProps {\n allowOnlyDatesList?: Array<Date>;\n container?: HTMLElement | null;\n date?: Date;\n disabled?: boolean;\n futureDatesDisabled?: boolean;\n onSelectDate: (selectedDate: Date) => void;\n placeholder?: string;\n responsivePositioning?: boolean;\n timezone?: Timezone;\n}\n\nexport const DatePicker = ({\n allowOnlyDatesList,\n container,\n date,\n disabled = false,\n futureDatesDisabled = false,\n onSelectDate,\n placeholder,\n responsivePositioning = true,\n timezone = 'system',\n}: DatePickerProps) => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const [selectedDate, setSelectedDate] = useState<Date>();\n const [partialYear, setPartialYear] = useState<number>();\n const [partialMonth, setPartialMonth] = useState<number>();\n const [autoFocusCalendar, setAutoFocusCalendar] = useState<boolean>(false);\n\n const calendarOptions: UseCalendarOptions = {};\n const portalContainer = useResolvedPortalContainer(container);\n\n if (selectedDate) {\n calendarOptions.defaultDate = selectedDate;\n }\n\n useEffect(() => {\n if (date) {\n setSelectedDate(date);\n }\n }, [date]);\n\n const resetPartialState = useCallback(() => {\n setPartialYear(undefined);\n setPartialMonth(undefined);\n }, []);\n\n const onOpenChange = useCallback(\n (open: boolean) => {\n setIsOpen(open);\n if (!open) {\n resetPartialState();\n setAutoFocusCalendar(false);\n }\n },\n [resetPartialState]\n );\n\n const onCloseDatePicker = useCallback(() => {\n setIsOpen(false);\n resetPartialState();\n }, [resetPartialState]);\n\n const onDateSelect = useCallback(\n (date: Date): void => {\n setSelectedDate(date);\n onSelectDate(date);\n resetPartialState();\n },\n [onSelectDate, resetPartialState]\n );\n\n const onYearSelect = useCallback((year: number) => {\n setPartialYear(year);\n setPartialMonth(undefined);\n }, []);\n\n const onMonthSelect = useCallback((year: number, month: number) => {\n setPartialYear(year);\n setPartialMonth(month);\n }, []);\n\n const onTriggerKeyDown = useCallback((e: KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n setIsOpen(true);\n setAutoFocusCalendar(true);\n }\n }, []);\n\n return (\n <Popover.Root\n onOpenChange={onOpenChange}\n open={isOpen}\n >\n <PopoverTrigger\n disabled={disabled}\n onKeyDown={onTriggerKeyDown}\n >\n <DatePickerInput\n data-testid=\"datepicker-input-container\"\n disabled={disabled}\n isActive={isOpen}\n partialMonth={partialMonth}\n partialYear={partialYear}\n placeholder={placeholder}\n selectedDate={selectedDate}\n timezone={timezone}\n />\n </PopoverTrigger>\n <Popover.Portal container={portalContainer}>\n <PopoverContent\n align=\"start\"\n avoidCollisions={responsivePositioning}\n sideOffset={4}\n >\n <CalendarRenderer\n calendarOptions={calendarOptions}\n onYearSelect={onYearSelect}\n onMonthSelect={onMonthSelect}\n selectedDate={selectedDate}\n timezone={timezone}\n >\n {body => (\n <Calendar\n allowOnlyDatesList={allowOnlyDatesList}\n autoFocus={autoFocusCalendar}\n calendarBody={body}\n closeDatepicker={onCloseDatePicker}\n futureDatesDisabled={futureDatesDisabled}\n selectedDate={selectedDate}\n setSelectedDate={onDateSelect}\n timezone={timezone}\n />\n )}\n </CalendarRenderer>\n </PopoverContent>\n </Popover.Portal>\n </Popover.Root>\n );\n};\n"],"names":["DAYS_IN_WEEK","PopoverTrigger","styled","Popover","Trigger","withConfig","componentId","PopoverContent","Content","theme","click","genericMenu","panel","color","stroke","default","background","shadow","radii","all","Calendar","allowOnlyDatesList","calendarBody","closeDatepicker","futureDatesDisabled","selectedDate","setSelectedDate","autoFocus","timezone","allDays","value","flatMap","week","totalDays","length","today","shiftToTimezone","Date","shiftedSelected","undefined","shiftedAllowList","useMemo","map","date","initialFocusIndex","findIndex","day","isSameDate","focusedDayIndex","setFocusedDayIndex","useState","dayRefs","useRef","useEffect","current","focus","timeoutId","setTimeout","clearTimeout","onDayKeyDown","useCallback","event","index","fullDate","isDisabled","newIndex","key","preventDefault","shiftFromTimezone","dayIndex","weekKey","isCurrentMonth","dayKey","isSelected","isPresent","isNotAllowed","isDateNotInAllowList","isFutureDisabled","currentIndex","handleClick","el","e","toDateString","DatePicker","container","disabled","onSelectDate","placeholder","responsivePositioning","isOpen","setIsOpen","partialYear","setPartialYear","partialMonth","setPartialMonth","autoFocusCalendar","setAutoFocusCalendar","calendarOptions","portalContainer","useResolvedPortalContainer","defaultDate","resetPartialState","onOpenChange","open","onCloseDatePicker","onDateSelect","onYearSelect","year","onMonthSelect","month","onTriggerKeyDown","body"],"mappings":"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"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { isSameDate } from '@h6s/calendar';
|
|
1
2
|
import '../../utils/date.js';
|
|
2
3
|
import dayjs from 'dayjs';
|
|
3
4
|
|
|
@@ -78,6 +79,7 @@ const getPredefinedMonthsForDateRangePicker = (numberOfMonths) => {
|
|
|
78
79
|
}
|
|
79
80
|
return nextSixMonths;
|
|
80
81
|
};
|
|
82
|
+
const isDateNotInAllowList = (allowList, date) => Array.isArray(allowList) && allowList.length > 0 && !allowList.some((allowedDate) => isSameDate(allowedDate, date));
|
|
81
83
|
const datesAreWithinMaxRange = (startDate, endDate, maxRangeLength) => {
|
|
82
84
|
const daysDifference = Math.abs(dayjs(startDate).diff(dayjs(endDate), "days"));
|
|
83
85
|
return daysDifference <= maxRangeLength;
|
|
@@ -111,5 +113,5 @@ const dateRangeIsValid = (dateRange) => {
|
|
|
111
113
|
return true;
|
|
112
114
|
};
|
|
113
115
|
|
|
114
|
-
export { dateRangeIsValid, datesAreWithinMaxRange, formatDateHeader, formatSelectedDate, formatSelectedDateTime, formatSelectedDateTimeWithSeconds, formatWeekday, getPredefinedMonthsForDateRangePicker, isDateRangeTheWholeMonth, shiftFromTimezone, shiftToTimezone };
|
|
116
|
+
export { dateRangeIsValid, datesAreWithinMaxRange, formatDateHeader, formatSelectedDate, formatSelectedDateTime, formatSelectedDateTimeWithSeconds, formatWeekday, getPredefinedMonthsForDateRangePicker, isDateNotInAllowList, isDateRangeTheWholeMonth, shiftFromTimezone, shiftToTimezone };
|
|
115
117
|
//# sourceMappingURL=utils.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sources":["../../../../src/components/DatePicker/utils.ts"],"sourcesContent":["import { dayjs } from '@/utils/date';\n\nexport type Timezone = 'system' | 'UTC';\n\nexport interface DateRange {\n startDate: Date;\n endDate: Date;\n}\n\nconst locale = 'en-US';\n\nexport type Meridiem = 'am' | 'pm';\n\nexport interface Time {\n hour: number;\n minutes: number;\n}\n\nexport interface DateRangeListItem {\n dateRange: DateRange;\n label: string;\n}\n\nconst createFormatter = (options: Intl.DateTimeFormatOptions) => {\n const timezoneFormatters: Partial<Record<Timezone, Intl.DateTimeFormat>> = {};\n\n return (timezone: Timezone, date: Date): string => {\n if (!timezoneFormatters[timezone]) {\n const opts = timezone === 'UTC' ? { ...options, timeZone: 'UTC' } : options;\n timezoneFormatters[timezone] = new Intl.DateTimeFormat(locale, opts);\n }\n return timezoneFormatters[timezone].format(date);\n };\n};\n\nexport const formatSelectedDate = createFormatter({\n day: '2-digit',\n month: 'short',\n year: 'numeric',\n});\n\nexport const formatWeekday = createFormatter({ weekday: 'short' });\n\nexport const formatSelectedDateTime = createFormatter({\n day: '2-digit',\n month: 'short',\n hour: '2-digit',\n minute: '2-digit',\n});\n\nexport const formatSelectedDateTimeWithSeconds = createFormatter({\n day: '2-digit',\n month: 'short',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n});\n\nexport const formatDateHeader = createFormatter({\n month: 'short',\n year: 'numeric',\n});\n\n// In UTC mode, shift by the host offset so local-time getters return UTC\n// values. shiftFromTimezone reverses it.\n//\n// Caveat: round-tripping across a DST boundary drifts by an hour — each\n// direction reads getTimezoneOffset on its own input. Call sites don't\n// round-trip the same Date, so this hasn't bitten us.\nexport const shiftToTimezone = (date: Date, timezone: Timezone): Date => {\n if (timezone !== 'UTC') {\n return date;\n }\n return new Date(date.getTime() + date.getTimezoneOffset() * 60_000);\n};\n\nexport const shiftFromTimezone = (date: Date, timezone: Timezone): Date => {\n if (timezone !== 'UTC') {\n return date;\n }\n return new Date(date.getTime() - date.getTimezoneOffset() * 60_000);\n};\n\nexport const getPredefinedMonthsForDateRangePicker = (\n numberOfMonths: number\n): DateRange[] => {\n const now = dayjs();\n\n if (numberOfMonths < 0) {\n const lastSixMonths: DateRange[] = [];\n for (let i = 0; i < Math.abs(numberOfMonths); i++) {\n const date = now.subtract(i, 'month');\n if (date.date() === 1 && date.month() === now.month()) {\n continue;\n }\n lastSixMonths.push({\n startDate: date.startOf('month').toDate(),\n endDate: i === 0 ? now.toDate() : date.endOf('month').toDate(),\n });\n }\n\n return lastSixMonths.reverse();\n }\n\n const nextSixMonths: DateRange[] = [];\n for (let i = 0; i < numberOfMonths; i++) {\n const date = now.add(i, 'month');\n nextSixMonths.push({\n startDate: date.startOf('month').toDate(),\n endDate: date.endOf('month').toDate(),\n });\n }\n\n return nextSixMonths;\n};\n\nexport const getPredefinedTimePeriodsForDateTimePicker = (): DateRangeListItem[] => {\n const now = dayjs();\n\n const fifteenMinutesAgo = now.subtract(15, 'minute');\n const thirtyMinutesAgo = now.subtract(30, 'minute');\n const oneHourAgo = now.subtract(1, 'hour');\n const sixHoursAgo = now.subtract(6, 'hour');\n const oneDayAgo = now.subtract(1, 'day');\n const oneMonthAgo = now.subtract(1, 'month');\n\n const dateRangeList: DateRangeListItem[] = [\n {\n dateRange: {\n startDate: fifteenMinutesAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past 15 minutes',\n },\n {\n dateRange: {\n startDate: thirtyMinutesAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past 30 minutes',\n },\n {\n dateRange: {\n startDate: oneHourAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past hour',\n },\n {\n dateRange: {\n startDate: sixHoursAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past 6 hours',\n },\n {\n dateRange: {\n startDate: oneDayAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past day',\n },\n {\n dateRange: {\n startDate: oneMonthAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past month',\n },\n ];\n\n return dateRangeList;\n};\n\nexport const getNextNDatesForDatePickerAllowOnlyList = (numberOfDays: number): Date[] => {\n const now = dayjs();\n\n return Array.from({ length: numberOfDays }, (_, i) =>\n now.add(i, 'day').startOf('day').toDate()\n );\n};\n\nexport const datesAreWithinMaxRange = (\n startDate: Date,\n endDate: Date,\n maxRangeLength: number\n): boolean => {\n const daysDifference = Math.abs(dayjs(startDate).diff(dayjs(endDate), 'days'));\n\n return daysDifference <= maxRangeLength;\n};\n\nexport const isDateRangeTheWholeMonth = (\n { startDate, endDate }: DateRange,\n timezone: Timezone = 'system'\n): boolean => {\n const start = timezone === 'UTC' ? dayjs.utc(startDate) : dayjs(startDate);\n const end = timezone === 'UTC' ? dayjs.utc(endDate) : dayjs(endDate);\n\n if (start.month() !== end.month()) {\n return false;\n }\n\n const startDateIsFirstDay = start.isSame(start.startOf('month'), 'day');\n const endDateIsLastDay = end.isSame(end.endOf('month'), 'day');\n\n return startDateIsFirstDay && endDateIsLastDay;\n};\n\nexport const dateRangeIsValid = (dateRange: DateRange): boolean => {\n if (!dateRange?.startDate || !dateRange?.endDate) {\n return false;\n }\n\n if (!(dateRange.startDate instanceof Date) || !dayjs(dateRange.startDate).isValid()) {\n return false;\n }\n\n if (!(dateRange.endDate instanceof Date) || !dayjs(dateRange.endDate).isValid()) {\n return false;\n }\n\n if (dateRange.startDate.getTime() > dateRange.endDate.getTime()) {\n return false;\n }\n\n return true;\n};\n"],"names":["locale","createFormatter","options","timezoneFormatters","timezone","date","opts","timeZone","Intl","DateTimeFormat","format","formatSelectedDate","day","month","year","formatWeekday","weekday","formatSelectedDateTime","hour","minute","formatSelectedDateTimeWithSeconds","second","formatDateHeader","shiftToTimezone","Date","getTime","getTimezoneOffset","shiftFromTimezone","getPredefinedMonthsForDateRangePicker","numberOfMonths","now","dayjs","lastSixMonths","i","Math","abs","subtract","push","startDate","startOf","toDate","endDate","endOf","reverse","nextSixMonths","add","datesAreWithinMaxRange","maxRangeLength","daysDifference","diff","isDateRangeTheWholeMonth","start","utc","end","startDateIsFirstDay","isSame","endDateIsLastDay","dateRangeIsValid","dateRange","isValid"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../../src/components/DatePicker/utils.ts"],"sourcesContent":["import { isSameDate } from '@h6s/calendar';\nimport { dayjs } from '@/utils/date';\n\nexport type Timezone = 'system' | 'UTC';\n\nexport interface DateRange {\n startDate: Date;\n endDate: Date;\n}\n\nconst locale = 'en-US';\n\nexport type Meridiem = 'am' | 'pm';\n\nexport interface Time {\n hour: number;\n minutes: number;\n}\n\nexport interface DateRangeListItem {\n dateRange: DateRange;\n label: string;\n}\n\nconst createFormatter = (options: Intl.DateTimeFormatOptions) => {\n const timezoneFormatters: Partial<Record<Timezone, Intl.DateTimeFormat>> = {};\n\n return (timezone: Timezone, date: Date): string => {\n if (!timezoneFormatters[timezone]) {\n const opts = timezone === 'UTC' ? { ...options, timeZone: 'UTC' } : options;\n timezoneFormatters[timezone] = new Intl.DateTimeFormat(locale, opts);\n }\n return timezoneFormatters[timezone].format(date);\n };\n};\n\nexport const formatSelectedDate = createFormatter({\n day: '2-digit',\n month: 'short',\n year: 'numeric',\n});\n\nexport const formatWeekday = createFormatter({ weekday: 'short' });\n\nexport const formatSelectedDateTime = createFormatter({\n day: '2-digit',\n month: 'short',\n hour: '2-digit',\n minute: '2-digit',\n});\n\nexport const formatSelectedDateTimeWithSeconds = createFormatter({\n day: '2-digit',\n month: 'short',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n});\n\nexport const formatDateHeader = createFormatter({\n month: 'short',\n year: 'numeric',\n});\n\n// In UTC mode, shift by the host offset so local-time getters return UTC\n// values. shiftFromTimezone reverses it.\n//\n// Caveat: round-tripping across a DST boundary drifts by an hour — each\n// direction reads getTimezoneOffset on its own input. Call sites don't\n// round-trip the same Date, so this hasn't bitten us.\nexport const shiftToTimezone = (date: Date, timezone: Timezone): Date => {\n if (timezone !== 'UTC') {\n return date;\n }\n return new Date(date.getTime() + date.getTimezoneOffset() * 60_000);\n};\n\nexport const shiftFromTimezone = (date: Date, timezone: Timezone): Date => {\n if (timezone !== 'UTC') {\n return date;\n }\n return new Date(date.getTime() - date.getTimezoneOffset() * 60_000);\n};\n\nexport const getPredefinedMonthsForDateRangePicker = (\n numberOfMonths: number\n): DateRange[] => {\n const now = dayjs();\n\n if (numberOfMonths < 0) {\n const lastSixMonths: DateRange[] = [];\n for (let i = 0; i < Math.abs(numberOfMonths); i++) {\n const date = now.subtract(i, 'month');\n if (date.date() === 1 && date.month() === now.month()) {\n continue;\n }\n lastSixMonths.push({\n startDate: date.startOf('month').toDate(),\n endDate: i === 0 ? now.toDate() : date.endOf('month').toDate(),\n });\n }\n\n return lastSixMonths.reverse();\n }\n\n const nextSixMonths: DateRange[] = [];\n for (let i = 0; i < numberOfMonths; i++) {\n const date = now.add(i, 'month');\n nextSixMonths.push({\n startDate: date.startOf('month').toDate(),\n endDate: date.endOf('month').toDate(),\n });\n }\n\n return nextSixMonths;\n};\n\nexport const getPredefinedTimePeriodsForDateTimePicker = (): DateRangeListItem[] => {\n const now = dayjs();\n\n const fifteenMinutesAgo = now.subtract(15, 'minute');\n const thirtyMinutesAgo = now.subtract(30, 'minute');\n const oneHourAgo = now.subtract(1, 'hour');\n const sixHoursAgo = now.subtract(6, 'hour');\n const oneDayAgo = now.subtract(1, 'day');\n const oneMonthAgo = now.subtract(1, 'month');\n\n const dateRangeList: DateRangeListItem[] = [\n {\n dateRange: {\n startDate: fifteenMinutesAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past 15 minutes',\n },\n {\n dateRange: {\n startDate: thirtyMinutesAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past 30 minutes',\n },\n {\n dateRange: {\n startDate: oneHourAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past hour',\n },\n {\n dateRange: {\n startDate: sixHoursAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past 6 hours',\n },\n {\n dateRange: {\n startDate: oneDayAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past day',\n },\n {\n dateRange: {\n startDate: oneMonthAgo.toDate(),\n endDate: now.toDate(),\n },\n label: 'Past month',\n },\n ];\n\n return dateRangeList;\n};\n\nexport const getNextNDatesForDatePickerAllowOnlyList = (numberOfDays: number): Date[] => {\n const now = dayjs();\n\n return Array.from({ length: numberOfDays }, (_, i) =>\n now.add(i, 'day').startOf('day').toDate()\n );\n};\n\nexport const isDateNotInAllowList = (\n allowList: Array<Date> | undefined,\n date: Date\n): boolean =>\n Array.isArray(allowList) &&\n allowList.length > 0 &&\n !allowList.some(allowedDate => isSameDate(allowedDate, date));\n\nexport const datesAreWithinMaxRange = (\n startDate: Date,\n endDate: Date,\n maxRangeLength: number\n): boolean => {\n const daysDifference = Math.abs(dayjs(startDate).diff(dayjs(endDate), 'days'));\n\n return daysDifference <= maxRangeLength;\n};\n\nexport const isDateRangeTheWholeMonth = (\n { startDate, endDate }: DateRange,\n timezone: Timezone = 'system'\n): boolean => {\n const start = timezone === 'UTC' ? dayjs.utc(startDate) : dayjs(startDate);\n const end = timezone === 'UTC' ? dayjs.utc(endDate) : dayjs(endDate);\n\n if (start.month() !== end.month()) {\n return false;\n }\n\n const startDateIsFirstDay = start.isSame(start.startOf('month'), 'day');\n const endDateIsLastDay = end.isSame(end.endOf('month'), 'day');\n\n return startDateIsFirstDay && endDateIsLastDay;\n};\n\nexport const dateRangeIsValid = (dateRange: DateRange): boolean => {\n if (!dateRange?.startDate || !dateRange?.endDate) {\n return false;\n }\n\n if (!(dateRange.startDate instanceof Date) || !dayjs(dateRange.startDate).isValid()) {\n return false;\n }\n\n if (!(dateRange.endDate instanceof Date) || !dayjs(dateRange.endDate).isValid()) {\n return false;\n }\n\n if (dateRange.startDate.getTime() > dateRange.endDate.getTime()) {\n return false;\n }\n\n return true;\n};\n"],"names":["locale","createFormatter","options","timezoneFormatters","timezone","date","opts","timeZone","Intl","DateTimeFormat","format","formatSelectedDate","day","month","year","formatWeekday","weekday","formatSelectedDateTime","hour","minute","formatSelectedDateTimeWithSeconds","second","formatDateHeader","shiftToTimezone","Date","getTime","getTimezoneOffset","shiftFromTimezone","getPredefinedMonthsForDateRangePicker","numberOfMonths","now","dayjs","lastSixMonths","i","Math","abs","subtract","push","startDate","startOf","toDate","endDate","endOf","reverse","nextSixMonths","add","isDateNotInAllowList","allowList","Array","isArray","length","some","allowedDate","isSameDate","datesAreWithinMaxRange","maxRangeLength","daysDifference","diff","isDateRangeTheWholeMonth","start","utc","end","startDateIsFirstDay","isSame","endDateIsLastDay","dateRangeIsValid","dateRange","isValid"],"mappings":"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"}
|
|
@@ -16,8 +16,6 @@ const Cell = memo(({
|
|
|
16
16
|
focus,
|
|
17
17
|
columnCount,
|
|
18
18
|
rowCount,
|
|
19
|
-
showRowNumber,
|
|
20
|
-
showHeader,
|
|
21
19
|
rowHeight,
|
|
22
20
|
rowStart,
|
|
23
21
|
rowAutoHeight,
|
|
@@ -62,7 +60,7 @@ const Cell = memo(({
|
|
|
62
60
|
...style,
|
|
63
61
|
height: "auto"
|
|
64
62
|
};
|
|
65
|
-
return /* @__PURE__ */ jsx("div", { style: styleWithHeight, "data-row": currentRowIndex, "data-column": columnIndex, ref: cellRef, children: /* @__PURE__ */ jsx(StyledCell, { as: CellData, rowIndex: currentRowIndex, columnIndex, type: "row-cell", "data-selected": isFocused || selectionType === "selectDirect", "data-focused": isFocused, $isSelectedTop: selectionBorderTop, $isSelectedLeft: selectionBorderLeft, $isFocused: isFocused, $isLastRow: rowCount - 1 === rowIndex, $isLastColumn: columnCount - 1 === columnIndex, $
|
|
63
|
+
return /* @__PURE__ */ jsx("div", { style: styleWithHeight, "data-row": currentRowIndex, "data-column": columnIndex, ref: cellRef, children: /* @__PURE__ */ jsx(StyledCell, { as: CellData, rowIndex: currentRowIndex, columnIndex, type: "row-cell", "data-selected": isFocused || selectionType === "selectDirect", "data-focused": isFocused, $isSelectedTop: selectionBorderTop, $isSelectedLeft: selectionBorderLeft, $isFocused: isFocused, $isLastRow: rowCount - 1 === rowIndex, $isLastColumn: columnCount - 1 === columnIndex, $selectionType: selectionType, $height: rowHeight, "data-grid-row": currentRowIndex, "data-grid-column": columnIndex, $showBorder: true, $rowAutoHeight: rowAutoHeight, ...props }) });
|
|
66
64
|
}, areEqual);
|
|
67
65
|
|
|
68
66
|
export { Cell };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Cell.js","sources":["../../../../src/components/Grid/Cell.tsx"],"sourcesContent":["import { memo, useEffect, useRef } from 'react';\nimport { GridChildComponentProps, areEqual } from 'react-window';\nimport { ItemDataType } from './types';\nimport { StyledCell } from './StyledCell';\n\ntype CellProps = GridChildComponentProps<ItemDataType> & {\n width: number;\n};\n\nexport const Cell = memo(\n ({ data, rowIndex, columnIndex, style, ...props }: CellProps) => {\n const {\n cell: CellData,\n getSelectionType,\n focus,\n columnCount,\n rowCount,\n
|
|
1
|
+
{"version":3,"file":"Cell.js","sources":["../../../../src/components/Grid/Cell.tsx"],"sourcesContent":["import { memo, useEffect, useRef } from 'react';\nimport { GridChildComponentProps, areEqual } from 'react-window';\nimport { ItemDataType } from './types';\nimport { StyledCell } from './StyledCell';\n\ntype CellProps = GridChildComponentProps<ItemDataType> & {\n width: number;\n};\n\nexport const Cell = memo(\n ({ data, rowIndex, columnIndex, style, ...props }: CellProps) => {\n const {\n cell: CellData,\n getSelectionType,\n focus,\n columnCount,\n rowCount,\n rowHeight,\n rowStart,\n rowAutoHeight,\n updateRowHeight,\n } = data;\n\n const currentRowIndex = rowIndex + rowStart;\n const { row: focusedRow, column: focusedColumn } = focus;\n const isFocused = columnIndex === focusedColumn && currentRowIndex === focusedRow;\n const rightOfFocus =\n columnIndex - 1 === focusedColumn && currentRowIndex === focusedRow;\n const belowFocus =\n columnIndex === focusedColumn && currentRowIndex - 1 === focusedRow;\n\n const selectionType = getSelectionType({\n row: currentRowIndex,\n column: columnIndex,\n type: 'cell',\n });\n const rightSelection = getSelectionType({\n row: currentRowIndex,\n column: columnIndex - 1,\n type: 'cell',\n });\n const belowSelection = getSelectionType({\n row: currentRowIndex - 1,\n column: columnIndex,\n type: 'cell',\n });\n const rightOfSelectionBorder =\n (selectionType === 'selectDirect' || rightSelection === 'selectDirect') &&\n selectionType !== rightSelection;\n const belowSelectionBorder =\n (selectionType === 'selectDirect' || belowSelection === 'selectDirect') &&\n selectionType !== belowSelection;\n\n const selectionBorderLeft = rightOfSelectionBorder || rightOfFocus || isFocused;\n const selectionBorderTop = belowSelectionBorder || belowFocus || isFocused;\n\n const cellRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!rowAutoHeight || !cellRef.current) {\n return;\n }\n const height = cellRef.current.getBoundingClientRect().height;\n updateRowHeight(rowIndex, height);\n }, [updateRowHeight, rowIndex, rowAutoHeight]);\n\n const styleWithHeight = {\n ...style,\n height: 'auto',\n };\n\n return (\n <div\n style={styleWithHeight}\n data-row={currentRowIndex}\n data-column={columnIndex}\n ref={cellRef}\n >\n <StyledCell\n as={CellData}\n rowIndex={currentRowIndex}\n columnIndex={columnIndex}\n type=\"row-cell\"\n data-selected={isFocused || selectionType === 'selectDirect'}\n data-focused={isFocused}\n $isSelectedTop={selectionBorderTop}\n $isSelectedLeft={selectionBorderLeft}\n $isFocused={isFocused}\n $isLastRow={rowCount - 1 === rowIndex}\n $isLastColumn={columnCount - 1 === columnIndex}\n $selectionType={selectionType}\n $height={rowHeight}\n data-grid-row={currentRowIndex}\n data-grid-column={columnIndex}\n $showBorder\n $rowAutoHeight={rowAutoHeight}\n {...props}\n />\n </div>\n );\n },\n areEqual\n);\n"],"names":["Cell","memo","data","rowIndex","columnIndex","style","props","cell","CellData","getSelectionType","focus","columnCount","rowCount","rowHeight","rowStart","rowAutoHeight","updateRowHeight","currentRowIndex","row","focusedRow","column","focusedColumn","isFocused","rightOfFocus","belowFocus","selectionType","type","rightSelection","belowSelection","rightOfSelectionBorder","belowSelectionBorder","selectionBorderLeft","selectionBorderTop","cellRef","useRef","useEffect","current","height","getBoundingClientRect","styleWithHeight","areEqual"],"mappings":"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"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/* stylelint-disable custom-property-pattern -- design tokens use camelCase (e.g. selectDirect) */
|
|
2
|
+
|
|
3
|
+
.column-resizer__8f12T {
|
|
4
|
+
position: absolute;
|
|
5
|
+
z-index: 1;
|
|
6
|
+
top: 0;
|
|
7
|
+
left: calc(100% - 4px);
|
|
8
|
+
width: 4px;
|
|
9
|
+
height: var(--column-resizer-height);
|
|
10
|
+
overflow: auto;
|
|
11
|
+
cursor: col-resize;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.column-resizer__8f12T:hover,
|
|
15
|
+
.column-resizer__8f12T:active {
|
|
16
|
+
background: var(--click-grid-header-cell-color-stroke-selectDirect);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.column-resizer_pressed__JGAln {
|
|
20
|
+
position: fixed;
|
|
21
|
+
height: 100%;
|
|
22
|
+
}
|
|
@@ -1,22 +1,20 @@
|
|
|
1
|
+
import "./ColumnResizer.css";
|
|
1
2
|
import { jsx } from 'react/jsx-runtime';
|
|
2
3
|
import { useRef, useEffect, useCallback } from 'react';
|
|
3
|
-
import {
|
|
4
|
+
import { cva } from 'class-variance-authority';
|
|
5
|
+
import 'clsx';
|
|
6
|
+
import styles from './ColumnResizer.module.css.js';
|
|
4
7
|
import { throttle } from 'lodash-es';
|
|
5
8
|
import { initialPosition } from './useResizingState.js';
|
|
6
9
|
|
|
7
10
|
const DOUBLE_CLICK_THRESHOLD_MSEC = 300;
|
|
8
|
-
const
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
})
|
|
15
|
-
$isPressed
|
|
16
|
-
}) => $isPressed && `
|
|
17
|
-
height: 100%;
|
|
18
|
-
position: fixed;
|
|
19
|
-
`);
|
|
11
|
+
const resizerVariants = cva(styles["column-resizer"], {
|
|
12
|
+
variants: {
|
|
13
|
+
pressed: {
|
|
14
|
+
true: styles["column-resizer_pressed"]
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
});
|
|
20
18
|
const ColumnResizer = ({
|
|
21
19
|
height,
|
|
22
20
|
onColumnResize: onColumnResizeProp,
|
|
@@ -82,7 +80,9 @@ const ColumnResizer = ({
|
|
|
82
80
|
pointer.width = Math.max(width, 50);
|
|
83
81
|
}
|
|
84
82
|
}, [pointer, isPressed, columnWidth, getResizerPosition, columnIndex, setPosition]);
|
|
85
|
-
return /* @__PURE__ */ jsx(
|
|
83
|
+
return /* @__PURE__ */ jsx("div", { ref: resizeRef, className: resizerVariants({
|
|
84
|
+
pressed: isPressed
|
|
85
|
+
}), onPointerDown, onPointerUp: (e) => {
|
|
86
86
|
e.preventDefault();
|
|
87
87
|
e.stopPropagation();
|
|
88
88
|
if (resizeRef.current && // 0 is a valid pointerId in Firefox
|
|
@@ -101,7 +101,10 @@ const ColumnResizer = ({
|
|
|
101
101
|
setPosition(initialPosition);
|
|
102
102
|
setPointer(null);
|
|
103
103
|
setIsPressed(columnIndex, false);
|
|
104
|
-
}, onClick: (e) => e.stopPropagation(), "data-resize": true, style:
|
|
104
|
+
}, onClick: (e) => e.stopPropagation(), "data-resize": true, style: {
|
|
105
|
+
"--column-resizer-height": `${height}px`,
|
|
106
|
+
...position
|
|
107
|
+
} });
|
|
105
108
|
};
|
|
106
109
|
|
|
107
110
|
export { ColumnResizer as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColumnResizer.js","sources":["../../../../src/components/Grid/ColumnResizer.tsx"],"sourcesContent":["import { PointerEventHandler, useCallback, useEffect, useRef } from 'react';\nimport { styled } from 'styled-components';\nimport { ColumnResizeFn, GetResizerPositionFn } from './types';\nimport { throttle } from 'lodash-es';\nimport { initialPosition, ResizingState } from './useResizingState';\n\nconst DOUBLE_CLICK_THRESHOLD_MSEC = 300;\n\nconst ResizeSpan = styled.div<{ $height: number; $isPressed: boolean }>`\n top: ${initialPosition.top};\n left: ${initialPosition.left};\n z-index: 1;\n position: absolute;\n height: ${({ $height }) => $height}px;\n cursor: col-resize;\n width: 4px;\n overflow: auto;\n &:hover,\n &:active,\n &:hover {\n background: ${({ theme }) => theme.click.grid.header.cell.color.stroke.selectDirect};\n }\n ${({ $isPressed }) =>\n $isPressed &&\n `\n height: 100%;\n position: fixed;\n `}\n`;\n\ninterface Props {\n height: number;\n onColumnResize: ColumnResizeFn;\n columnIndex: number;\n getResizerPosition: GetResizerPositionFn;\n columnWidth: number;\n resizingState: ResizingState;\n}\n\nconst ColumnResizer = ({\n height,\n onColumnResize: onColumnResizeProp,\n columnIndex,\n getResizerPosition,\n columnWidth,\n resizingState,\n}: Props) => {\n const resizeRef = useRef<HTMLDivElement>(null);\n const {\n pointer,\n setPointer,\n getIsPressed,\n setIsPressed,\n getPosition,\n setPosition,\n lastPressedTimestamp,\n } = resizingState;\n const isPressed = getIsPressed(columnIndex);\n const position = getPosition(columnIndex);\n const onColumnResize = throttle(onColumnResizeProp, 1000);\n\n useEffect(() => {\n // Capture the pointer when pressed to ensure we receive move events outside the element.\n // Capturing must be properly handled when the component unmounts and mounts again,\n // based on its pressed state.\n const control = resizeRef.current;\n if (!isPressed || !control || !pointer) {\n return;\n }\n const pointerId = pointer.pointerId;\n try {\n control.setPointerCapture(pointerId);\n return () => {\n if (control.hasPointerCapture(pointerId)) {\n control.releasePointerCapture(pointerId);\n }\n };\n } catch (e) {\n console.error(e);\n }\n }, [pointer, isPressed, columnIndex]);\n\n /**\n * Handler for pointer down events to initiate resizing or auto-sizing on double-click.\n * @type {PointerEventHandler<HTMLDivElement>}\n */\n const onPointerDown: PointerEventHandler<HTMLDivElement> = useCallback(\n e => {\n e.stopPropagation();\n e.preventDefault();\n if (resizeRef.current) {\n // We cannot detect double-click with onDoubleClick event,\n // because this component might be unmounted before the second click and mounted again.\n // We keep track of the last click timestamp and check if it was a double-click.\n if (lastPressedTimestamp > Date.now() - DOUBLE_CLICK_THRESHOLD_MSEC) {\n // Auto-size the column on double click.\n onColumnResize(columnIndex, 0, 'auto');\n }\n setPointer({\n pointerId: e.pointerId,\n initialClientX: e.clientX,\n width: columnWidth,\n });\n setIsPressed(columnIndex, true);\n const pos = getResizerPosition(e.clientX, columnWidth, columnIndex);\n setPosition(pos);\n }\n },\n [\n lastPressedTimestamp,\n setPointer,\n columnWidth,\n setIsPressed,\n columnIndex,\n getResizerPosition,\n setPosition,\n onColumnResize,\n ]\n );\n\n /**\n * Handler for pointer move events to update the column width as the user drags.\n * @type {PointerEventHandler<HTMLDivElement>}\n */\n const onPointerMove: PointerEventHandler<HTMLDivElement> = useCallback(\n e => {\n e.stopPropagation();\n e.preventDefault();\n if (isPressed && pointer) {\n const width = columnWidth + (e.clientX - pointer.initialClientX);\n const pos = getResizerPosition(e.clientX, width, columnIndex);\n setPosition(pos);\n // Ensure minimum width of 50px\n pointer.width = Math.max(width, 50);\n }\n },\n [pointer, isPressed, columnWidth, getResizerPosition, columnIndex, setPosition]\n );\n\n return (\n <ResizeSpan\n ref={resizeRef}\n $height={height}\n $isPressed={isPressed}\n onPointerDown={onPointerDown}\n onPointerUp={e => {\n e.preventDefault();\n e.stopPropagation();\n if (\n resizeRef.current &&\n // 0 is a valid pointerId in Firefox\n (pointer?.pointerId || pointer?.pointerId === 0)\n ) {\n const shouldCallResize = e.clientX !== pointer.initialClientX;\n if (shouldCallResize) {\n onColumnResize(columnIndex, pointer.width, 'manual');\n }\n setPosition(initialPosition);\n setPointer(null);\n setIsPressed(columnIndex, false);\n }\n }}\n onPointerMove={onPointerMove}\n onPointerCancel={e => {\n e.preventDefault();\n e.stopPropagation();\n setPosition(initialPosition);\n setPointer(null);\n setIsPressed(columnIndex, false);\n }}\n onClick={e => e.stopPropagation()}\n data-resize\n style={position}\n />\n );\n};\n\nexport default ColumnResizer;\n"],"names":["DOUBLE_CLICK_THRESHOLD_MSEC","ResizeSpan","styled","div","withConfig","componentId","initialPosition","top","left","$height","theme","click","grid","header","cell","color","stroke","selectDirect","$isPressed","ColumnResizer","height","onColumnResize","onColumnResizeProp","columnIndex","getResizerPosition","columnWidth","resizingState","resizeRef","useRef","pointer","setPointer","getIsPressed","setIsPressed","getPosition","setPosition","lastPressedTimestamp","isPressed","position","throttle","useEffect","control","current","pointerId","setPointerCapture","hasPointerCapture","releasePointerCapture","e","console","error","onPointerDown","useCallback","stopPropagation","preventDefault","Date","now","initialClientX","clientX","width","pos","onPointerMove","Math","max","shouldCallResize"],"mappings":";;;;;;AAMA,MAAMA,2BAAAA,GAA8B,GAAA;AAEpC,MAAMC,UAAAA,GAAaC,MAAAA,CAAOC,GAAAA,CAAGC,UAAAA,CAAA;AAAA,EAAAC,WAAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,MAAA,EAAA,QAAA,EAAA,sCAAA,EAAA,mFAAA,EAAA,IAAA,EAAA,EAAA,CAAA,EACpBC,eAAAA,CAAgBC,GAAAA,EACfD,eAAAA,CAAgBE,MAGd,CAAC;AAAA,EAAEC;AAAQ,CAAA,KAAMA,SAOX,CAAC;AAAA,EAAEC;AAAM,CAAA,KAAMA,KAAAA,CAAMC,MAAMC,IAAAA,CAAKC,MAAAA,CAAOC,KAAKC,KAAAA,CAAMC,MAAAA,CAAOC,cAEvE,CAAC;AAAA,EAAEC;AAAW,CAAA,KACdA,UAAAA,IACA;AAAA;AAAA;AAAA,IAAA,CAGC,CAAA;AAYL,MAAMC,gBAAgBA,CAAC;AAAA,EACrBC,MAAAA;AAAAA,EACAC,cAAAA,EAAgBC,kBAAAA;AAAAA,EAChBC,WAAAA;AAAAA,EACAC,kBAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC;AACK,CAAA,KAAM;AACX,EAAA,MAAMC,SAAAA,GAAYC,OAAuB,IAAI,CAAA;AAC7C,EAAA,MAAM;AAAA,IACJC,OAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC;AAAAA,GACF,GAAIT,aAAAA;AACJ,EAAA,MAAMU,SAAAA,GAAYL,aAAaR,WAAW,CAAA;AAC1C,EAAA,MAAMc,QAAAA,GAAWJ,YAAYV,WAAW,CAAA;AACxC,EAAA,MAAMF,cAAAA,GAAiBiB,QAAAA,CAAShB,kBAAAA,EAAoB,GAAI,CAAA;AAExDiB,EAAAA,SAAAA,CAAU,MAAM;AAId,IAAA,MAAMC,UAAUb,SAAAA,CAAUc,OAAAA;AAC1B,IAAA,IAAI,CAACL,SAAAA,IAAa,CAACI,OAAAA,IAAW,CAACX,OAAAA,EAAS;AACtC,MAAA;AAAA,IACF;AACA,IAAA,MAAMa,YAAYb,OAAAA,CAAQa,SAAAA;AAC1B,IAAA,IAAI;AACFF,MAAAA,OAAAA,CAAQG,kBAAkBD,SAAS,CAAA;AACnC,MAAA,OAAO,MAAM;AACX,QAAA,IAAIF,OAAAA,CAAQI,iBAAAA,CAAkBF,SAAS,CAAA,EAAG;AACxCF,UAAAA,OAAAA,CAAQK,sBAAsBH,SAAS,CAAA;AAAA,QACzC;AAAA,MACF,CAAA;AAAA,IACF,SAASI,CAAAA,EAAG;AACVC,MAAAA,OAAAA,CAAQC,MAAMF,CAAC,CAAA;AAAA,IACjB;AAAA,EACF,CAAA,EAAG,CAACjB,OAAAA,EAASO,SAAAA,EAAWb,WAAW,CAAC,CAAA;AAMpC,EAAA,MAAM0B,aAAAA,GAAqDC,YACzDJ,CAAAA,CAAAA,KAAK;AACHA,IAAAA,CAAAA,CAAEK,eAAAA,EAAgB;AAClBL,IAAAA,CAAAA,CAAEM,cAAAA,EAAe;AACjB,IAAA,IAAIzB,UAAUc,OAAAA,EAAS;AAIrB,MAAA,IAAIN,oBAAAA,GAAuBkB,IAAAA,CAAKC,GAAAA,EAAI,GAAItD,2BAAAA,EAA6B;AAEnEqB,QAAAA,cAAAA,CAAeE,WAAAA,EAAa,GAAG,MAAM,CAAA;AAAA,MACvC;AACAO,MAAAA,UAAAA,CAAW;AAAA,QACTY,WAAWI,CAAAA,CAAEJ,SAAAA;AAAAA,QACba,gBAAgBT,CAAAA,CAAEU,OAAAA;AAAAA,QAClBC,KAAAA,EAAOhC;AAAAA,OACR,CAAA;AACDO,MAAAA,YAAAA,CAAaT,aAAa,IAAI,CAAA;AAC9B,MAAA,MAAMmC,GAAAA,GAAMlC,kBAAAA,CAAmBsB,CAAAA,CAAEU,OAAAA,EAAS/B,aAAaF,WAAW,CAAA;AAClEW,MAAAA,WAAAA,CAAYwB,GAAG,CAAA;AAAA,IACjB;AAAA,EACF,CAAA,EACA,CACEvB,oBAAAA,EACAL,UAAAA,EACAL,WAAAA,EACAO,cACAT,WAAAA,EACAC,kBAAAA,EACAU,WAAAA,EACAb,cAAc,CAElB,CAAA;AAMA,EAAA,MAAMsC,aAAAA,GAAqDT,YACzDJ,CAAAA,CAAAA,KAAK;AACHA,IAAAA,CAAAA,CAAEK,eAAAA,EAAgB;AAClBL,IAAAA,CAAAA,CAAEM,cAAAA,EAAe;AACjB,IAAA,IAAIhB,aAAaP,OAAAA,EAAS;AACxB,MAAA,MAAM4B,KAAAA,GAAQhC,WAAAA,IAAeqB,CAAAA,CAAEU,OAAAA,GAAU3B,OAAAA,CAAQ0B,cAAAA,CAAAA;AACjD,MAAA,MAAMG,GAAAA,GAAMlC,kBAAAA,CAAmBsB,CAAAA,CAAEU,OAAAA,EAASC,OAAOlC,WAAW,CAAA;AAC5DW,MAAAA,WAAAA,CAAYwB,GAAG,CAAA;AAEf7B,MAAAA,OAAAA,CAAQ4B,KAAAA,GAAQG,IAAAA,CAAKC,GAAAA,CAAIJ,KAAAA,EAAO,EAAE,CAAA;AAAA,IACpC;AAAA,EACF,CAAA,EACA,CAAC5B,OAAAA,EAASO,SAAAA,EAAWX,aAAaD,kBAAAA,EAAoBD,WAAAA,EAAaW,WAAW,CAChF,CAAA;AAEA,EAAA,uBACE,GAAA,CAAC,UAAA,EAAA,EACC,GAAA,EAAKP,SAAAA,EACL,OAAA,EAASP,QACT,UAAA,EAAYgB,SAAAA,EACZ,aAAA,EACA,WAAA,EAAaU,CAAAA,CAAAA,KAAK;AAChBA,IAAAA,CAAAA,CAAEM,cAAAA,EAAe;AACjBN,IAAAA,CAAAA,CAAEK,eAAAA,EAAgB;AAClB,IAAA,IACExB,SAAAA,CAAUc,OAAAA;AAAAA,KAETZ,OAAAA,EAASa,SAAAA,IAAab,OAAAA,EAASa,SAAAA,KAAc,CAAA,CAAA,EAC9C;AACA,MAAA,MAAMoB,gBAAAA,GAAmBhB,CAAAA,CAAEU,OAAAA,KAAY3B,OAAAA,CAAQ0B,cAAAA;AAC/C,MAAA,IAAIO,gBAAAA,EAAkB;AACpBzC,QAAAA,cAAAA,CAAeE,WAAAA,EAAaM,OAAAA,CAAQ4B,KAAAA,EAAO,QAAQ,CAAA;AAAA,MACrD;AACAvB,MAAAA,WAAAA,CAAY5B,eAAe,CAAA;AAC3BwB,MAAAA,UAAAA,CAAW,IAAI,CAAA;AACfE,MAAAA,YAAAA,CAAaT,aAAa,KAAK,CAAA;AAAA,IACjC;AAAA,EACF,CAAA,EACA,aAAA,EACA,eAAA,EAAiBuB,CAAAA,CAAAA,KAAK;AACpBA,IAAAA,CAAAA,CAAEM,cAAAA,EAAe;AACjBN,IAAAA,CAAAA,CAAEK,eAAAA,EAAgB;AAClBjB,IAAAA,WAAAA,CAAY5B,eAAe,CAAA;AAC3BwB,IAAAA,UAAAA,CAAW,IAAI,CAAA;AACfE,IAAAA,YAAAA,CAAaT,aAAa,KAAK,CAAA;AAAA,EACjC,CAAA,EACA,SAASuB,CAAAA,CAAAA,KAAKA,CAAAA,CAAEK,iBAAgB,EAChC,aAAA,EAAW,IAAA,EACX,KAAA,EAAOd,QAAAA,EAAS,CAAA;AAGtB;;;;"}
|
|
1
|
+
{"version":3,"file":"ColumnResizer.js","sources":["../../../../src/components/Grid/ColumnResizer.tsx"],"sourcesContent":["import {\n CSSProperties,\n PointerEventHandler,\n useCallback,\n useEffect,\n useRef,\n} from 'react';\nimport { cva } from '@/lib/cva';\nimport styles from './ColumnResizer.module.css';\nimport { ColumnResizeFn, GetResizerPositionFn } from './types';\nimport { throttle } from 'lodash-es';\nimport { initialPosition, ResizingState } from './useResizingState';\n\nconst DOUBLE_CLICK_THRESHOLD_MSEC = 300;\n\nconst resizerVariants = cva(styles['column-resizer'], {\n variants: {\n pressed: { true: styles['column-resizer_pressed'] },\n },\n});\n\ninterface Props {\n height: number;\n onColumnResize: ColumnResizeFn;\n columnIndex: number;\n getResizerPosition: GetResizerPositionFn;\n columnWidth: number;\n resizingState: ResizingState;\n}\n\nconst ColumnResizer = ({\n height,\n onColumnResize: onColumnResizeProp,\n columnIndex,\n getResizerPosition,\n columnWidth,\n resizingState,\n}: Props) => {\n const resizeRef = useRef<HTMLDivElement>(null);\n const {\n pointer,\n setPointer,\n getIsPressed,\n setIsPressed,\n getPosition,\n setPosition,\n lastPressedTimestamp,\n } = resizingState;\n const isPressed = getIsPressed(columnIndex);\n const position = getPosition(columnIndex);\n const onColumnResize = throttle(onColumnResizeProp, 1000);\n\n useEffect(() => {\n // Capture the pointer when pressed to ensure we receive move events outside the element.\n // Capturing must be properly handled when the component unmounts and mounts again,\n // based on its pressed state.\n const control = resizeRef.current;\n if (!isPressed || !control || !pointer) {\n return;\n }\n const pointerId = pointer.pointerId;\n try {\n control.setPointerCapture(pointerId);\n return () => {\n if (control.hasPointerCapture(pointerId)) {\n control.releasePointerCapture(pointerId);\n }\n };\n } catch (e) {\n console.error(e);\n }\n }, [pointer, isPressed, columnIndex]);\n\n /**\n * Handler for pointer down events to initiate resizing or auto-sizing on double-click.\n * @type {PointerEventHandler<HTMLDivElement>}\n */\n const onPointerDown: PointerEventHandler<HTMLDivElement> = useCallback(\n e => {\n e.stopPropagation();\n e.preventDefault();\n if (resizeRef.current) {\n // We cannot detect double-click with onDoubleClick event,\n // because this component might be unmounted before the second click and mounted again.\n // We keep track of the last click timestamp and check if it was a double-click.\n if (lastPressedTimestamp > Date.now() - DOUBLE_CLICK_THRESHOLD_MSEC) {\n // Auto-size the column on double click.\n onColumnResize(columnIndex, 0, 'auto');\n }\n setPointer({\n pointerId: e.pointerId,\n initialClientX: e.clientX,\n width: columnWidth,\n });\n setIsPressed(columnIndex, true);\n const pos = getResizerPosition(e.clientX, columnWidth, columnIndex);\n setPosition(pos);\n }\n },\n [\n lastPressedTimestamp,\n setPointer,\n columnWidth,\n setIsPressed,\n columnIndex,\n getResizerPosition,\n setPosition,\n onColumnResize,\n ]\n );\n\n /**\n * Handler for pointer move events to update the column width as the user drags.\n * @type {PointerEventHandler<HTMLDivElement>}\n */\n const onPointerMove: PointerEventHandler<HTMLDivElement> = useCallback(\n e => {\n e.stopPropagation();\n e.preventDefault();\n if (isPressed && pointer) {\n const width = columnWidth + (e.clientX - pointer.initialClientX);\n const pos = getResizerPosition(e.clientX, width, columnIndex);\n setPosition(pos);\n // Ensure minimum width of 50px\n pointer.width = Math.max(width, 50);\n }\n },\n [pointer, isPressed, columnWidth, getResizerPosition, columnIndex, setPosition]\n );\n\n return (\n <div\n ref={resizeRef}\n className={resizerVariants({ pressed: isPressed })}\n onPointerDown={onPointerDown}\n onPointerUp={e => {\n e.preventDefault();\n e.stopPropagation();\n if (\n resizeRef.current &&\n // 0 is a valid pointerId in Firefox\n (pointer?.pointerId || pointer?.pointerId === 0)\n ) {\n const shouldCallResize = e.clientX !== pointer.initialClientX;\n if (shouldCallResize) {\n onColumnResize(columnIndex, pointer.width, 'manual');\n }\n setPosition(initialPosition);\n setPointer(null);\n setIsPressed(columnIndex, false);\n }\n }}\n onPointerMove={onPointerMove}\n onPointerCancel={e => {\n e.preventDefault();\n e.stopPropagation();\n setPosition(initialPosition);\n setPointer(null);\n setIsPressed(columnIndex, false);\n }}\n onClick={e => e.stopPropagation()}\n data-resize\n style={\n {\n '--column-resizer-height': `${height}px`,\n ...position,\n } as CSSProperties\n }\n />\n );\n};\n\nexport default ColumnResizer;\n"],"names":["DOUBLE_CLICK_THRESHOLD_MSEC","resizerVariants","cva","styles","variants","pressed","true","ColumnResizer","height","onColumnResize","onColumnResizeProp","columnIndex","getResizerPosition","columnWidth","resizingState","resizeRef","useRef","pointer","setPointer","getIsPressed","setIsPressed","getPosition","setPosition","lastPressedTimestamp","isPressed","position","throttle","useEffect","control","current","pointerId","setPointerCapture","hasPointerCapture","releasePointerCapture","e","console","error","onPointerDown","useCallback","stopPropagation","preventDefault","Date","now","initialClientX","clientX","width","pos","onPointerMove","Math","max","shouldCallResize","initialPosition"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ColumnResizer.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* `.grid` is the Grid's outer container. It is rendered as the ContextMenu.Trigger
|
|
3
|
+
* (the root element the whole grid mounts into), which is why the trigger carries
|
|
4
|
+
* the grid's own box styling rather than a context-menu-specific class.
|
|
5
|
+
*/
|
|
6
|
+
.grid__h49fk {
|
|
7
|
+
width: 100%;
|
|
8
|
+
height: var(--grid-height, 100%);
|
|
9
|
+
overflow: hidden;
|
|
10
|
+
border-radius: var(--grid-radius);
|
|
11
|
+
background: var(--click-grid-body-cell-color-background-default);
|
|
12
|
+
outline: none;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.grid_bordered__kFqF5 {
|
|
16
|
+
border: 1px solid var(--click-grid-header-cell-color-stroke-default);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
/* react-window's inner element that lays out the scrolling cell grid */
|
|
20
|
+
.grid__inner__IZhj9 {
|
|
21
|
+
display: flex;
|
|
22
|
+
flex-direction: column-reverse;
|
|
23
|
+
/* stylelint-disable-next-line plugin/no-unsupported-browser-features -- the original styled rule used overflow-anchor */
|
|
24
|
+
overflow-anchor: none;
|
|
25
|
+
user-select: none;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.grid__data__Mn4TK {
|
|
29
|
+
position: absolute;
|
|
30
|
+
top: 0;
|
|
31
|
+
left: 0;
|
|
32
|
+
margin-top: var(--grid-data-top, 0);
|
|
33
|
+
margin-left: var(--grid-data-left, 0);
|
|
34
|
+
}
|