@bitrise/bitkit-v2 0.3.481-beta.3109 → 0.3.481-beta.3111
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/components/BitkitCalendar/components/CalendarContent.js +1 -0
- package/dist/components/BitkitCalendar/components/CalendarContent.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarFooter.d.ts +2 -1
- package/dist/components/BitkitCalendar/components/CalendarFooter.js +3 -4
- package/dist/components/BitkitCalendar/components/CalendarFooter.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarContent.js","names":[],"sources":["../../../../lib/components/BitkitCalendar/components/CalendarContent.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { type CalendarDate } from '@internationalized/date';\nimport { type ReactNode, useEffect, useRef } from 'react';\n\nimport { DatePicker, useDatePickerContext } from '../../../atoms/DatePicker/DatePicker';\nimport CalendarFooter from './CalendarFooter';\nimport CalendarMonth from './CalendarMonth';\nimport CalendarMonthSelect from './CalendarMonthSelect';\nimport CalendarNextTrigger from './CalendarNextTrigger';\nimport CalendarPrevTrigger from './CalendarPrevTrigger';\nimport CalendarYearSelect from './CalendarYearSelect';\n\nexport interface CalendarContentProps {\n dayTooltip?: (date: Date) => string | undefined;\n device?: 'desktop' | 'mobile';\n footer?: ReactNode;\n layout?: '1-month' | '2-month';\n max?: CalendarDate;\n min?: CalendarDate;\n selectionMode?: 'day' | 'range';\n showSelectedDate?: boolean;\n}\n\n/**\n * The styled popover body shared by BitkitCalendar and BitkitDatePicker.\n * Renders the view controls, month grids and footer inside `DatePicker.Content`.\n */\nconst CalendarContent = ({\n dayTooltip,\n device,\n footer,\n layout,\n max,\n min,\n selectionMode,\n showSelectedDate,\n}: CalendarContentProps) => {\n const context = useDatePickerContext();\n const prevModeRef = useRef(selectionMode);\n\n useEffect(() => {\n if (prevModeRef.current !== selectionMode) {\n context.clearValue();\n prevModeRef.current = selectionMode;\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectionMode]);\n\n return (\n <DatePicker.Content>\n <DatePicker.View view=\"day\">\n <DatePicker.ViewControl>\n <Box display=\"flex\" alignItems=\"center\" gap=\"12\" minWidth=\"0\">\n <CalendarPrevTrigger device={device} />\n\n <Box display=\"flex\" alignItems=\"center\" minWidth=\"0\">\n <CalendarMonthSelect device={device} offset={0} layout={layout} max={max} min={min} />\n <CalendarYearSelect device={device} monthOffset={0} max={max} min={min} />\n </Box>\n {layout === '1-month' && <CalendarNextTrigger device={device} />}\n </Box>\n {layout === '2-month' && (\n <Box display=\"flex\" alignItems=\"center\" gap=\"12\" minWidth=\"0\">\n <CalendarMonthSelect device={device} offset={1} layout={layout} max={max} min={min} />\n <CalendarYearSelect device={device} monthOffset={1} max={max} min={min} />\n <CalendarNextTrigger device={device} />\n </Box>\n )}\n </DatePicker.ViewControl>\n <DatePicker.Months>\n <CalendarMonth dayTooltip={dayTooltip} monthsIndex={0} />\n {layout === '2-month' && <CalendarMonth dayTooltip={dayTooltip} monthsIndex={1} />}\n </DatePicker.Months>\n </DatePicker.View>\n <CalendarFooter selectionMode={selectionMode} showSelectedDate={showSelectedDate} />\n {footer}\n </DatePicker.Content>\n );\n};\n\nexport default CalendarContent;\n"],"mappings":";;;;;;;;;;;;;;;AA2BA,IAAM,mBAAmB,EACvB,YACA,QACA,QACA,QACA,KACA,KACA,eACA,uBAC0B;CAC1B,MAAM,UAAU,qBAAqB;CACrC,MAAM,cAAc,OAAO,aAAa;CAExC,gBAAgB;EACd,IAAI,YAAY,YAAY,eAAe;GACzC,QAAQ,WAAW;GACnB,YAAY,UAAU;EACxB;CAEF,GAAG,CAAC,aAAa,CAAC;CAElB,OACE,qBAAC,WAAW,SAAZ,EAAA,UAAA;EACE,qBAAC,WAAW,MAAZ;GAAiB,MAAK;GAAtB,UAAA,CACE,qBAAC,WAAW,aAAZ,EAAA,UAAA,CACE,qBAAC,KAAD;IAAK,SAAQ;IAAO,YAAW;IAAS,KAAI;IAAK,UAAS;IAA1D,UAAA;KACE,oBAAC,qBAAD,EAA6B,OAAS,CAAA;KAEtC,qBAAC,KAAD;MAAK,SAAQ;MAAO,YAAW;MAAS,UAAS;MAAjD,UAAA,CACE,oBAAC,qBAAD;OAA6B;OAAQ,QAAQ;OAAW;OAAa;OAAU;MAAM,CAAA,GACrF,oBAAC,oBAAD;OAA4B;OAAQ,aAAa;OAAQ;OAAU;MAAM,CAAA,CACtE;;KACJ,WAAW,aAAa,oBAAC,qBAAD,EAA6B,OAAS,CAAA;IAC5D;GACJ,CAAA,GAAA,WAAW,aACV,qBAAC,KAAD;IAAK,SAAQ;IAAO,YAAW;IAAS,KAAI;IAAK,UAAS;IAA1D,UAAA;KACE,oBAAC,qBAAD;MAA6B;MAAQ,QAAQ;MAAW;MAAa;MAAU;KAAM,CAAA;KACrF,oBAAC,oBAAD;MAA4B;MAAQ,aAAa;MAAQ;MAAU;KAAM,CAAA;KACzE,oBAAC,qBAAD,EAA6B,OAAS,CAAA;IACnC;GAEe,CAAA,CAAA,EAAA,CAAA,GACxB,qBAAC,WAAW,QAAZ,EAAA,UAAA,CACE,oBAAC,eAAD;IAA2B;IAAY,aAAa;GAAI,CAAA,GACvD,WAAW,aAAa,oBAAC,eAAD;IAA2B;IAAY,aAAa;GAAI,CAAA,CAChE,EAAA,CAAA,CACJ;;EACjB,oBAAC,gBAAD;
|
|
1
|
+
{"version":3,"file":"CalendarContent.js","names":[],"sources":["../../../../lib/components/BitkitCalendar/components/CalendarContent.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { type CalendarDate } from '@internationalized/date';\nimport { type ReactNode, useEffect, useRef } from 'react';\n\nimport { DatePicker, useDatePickerContext } from '../../../atoms/DatePicker/DatePicker';\nimport CalendarFooter from './CalendarFooter';\nimport CalendarMonth from './CalendarMonth';\nimport CalendarMonthSelect from './CalendarMonthSelect';\nimport CalendarNextTrigger from './CalendarNextTrigger';\nimport CalendarPrevTrigger from './CalendarPrevTrigger';\nimport CalendarYearSelect from './CalendarYearSelect';\n\nexport interface CalendarContentProps {\n dayTooltip?: (date: Date) => string | undefined;\n device?: 'desktop' | 'mobile';\n footer?: ReactNode;\n layout?: '1-month' | '2-month';\n max?: CalendarDate;\n min?: CalendarDate;\n selectionMode?: 'day' | 'range';\n showSelectedDate?: boolean;\n}\n\n/**\n * The styled popover body shared by BitkitCalendar and BitkitDatePicker.\n * Renders the view controls, month grids and footer inside `DatePicker.Content`.\n */\nconst CalendarContent = ({\n dayTooltip,\n device,\n footer,\n layout,\n max,\n min,\n selectionMode,\n showSelectedDate,\n}: CalendarContentProps) => {\n const context = useDatePickerContext();\n const prevModeRef = useRef(selectionMode);\n\n useEffect(() => {\n if (prevModeRef.current !== selectionMode) {\n context.clearValue();\n prevModeRef.current = selectionMode;\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectionMode]);\n\n return (\n <DatePicker.Content>\n <DatePicker.View view=\"day\">\n <DatePicker.ViewControl>\n <Box display=\"flex\" alignItems=\"center\" gap=\"12\" minWidth=\"0\">\n <CalendarPrevTrigger device={device} />\n\n <Box display=\"flex\" alignItems=\"center\" minWidth=\"0\">\n <CalendarMonthSelect device={device} offset={0} layout={layout} max={max} min={min} />\n <CalendarYearSelect device={device} monthOffset={0} max={max} min={min} />\n </Box>\n {layout === '1-month' && <CalendarNextTrigger device={device} />}\n </Box>\n {layout === '2-month' && (\n <Box display=\"flex\" alignItems=\"center\" gap=\"12\" minWidth=\"0\">\n <CalendarMonthSelect device={device} offset={1} layout={layout} max={max} min={min} />\n <CalendarYearSelect device={device} monthOffset={1} max={max} min={min} />\n <CalendarNextTrigger device={device} />\n </Box>\n )}\n </DatePicker.ViewControl>\n <DatePicker.Months>\n <CalendarMonth dayTooltip={dayTooltip} monthsIndex={0} />\n {layout === '2-month' && <CalendarMonth dayTooltip={dayTooltip} monthsIndex={1} />}\n </DatePicker.Months>\n </DatePicker.View>\n <CalendarFooter device={device} selectionMode={selectionMode} showSelectedDate={showSelectedDate} />\n {footer}\n </DatePicker.Content>\n );\n};\n\nexport default CalendarContent;\n"],"mappings":";;;;;;;;;;;;;;;AA2BA,IAAM,mBAAmB,EACvB,YACA,QACA,QACA,QACA,KACA,KACA,eACA,uBAC0B;CAC1B,MAAM,UAAU,qBAAqB;CACrC,MAAM,cAAc,OAAO,aAAa;CAExC,gBAAgB;EACd,IAAI,YAAY,YAAY,eAAe;GACzC,QAAQ,WAAW;GACnB,YAAY,UAAU;EACxB;CAEF,GAAG,CAAC,aAAa,CAAC;CAElB,OACE,qBAAC,WAAW,SAAZ,EAAA,UAAA;EACE,qBAAC,WAAW,MAAZ;GAAiB,MAAK;GAAtB,UAAA,CACE,qBAAC,WAAW,aAAZ,EAAA,UAAA,CACE,qBAAC,KAAD;IAAK,SAAQ;IAAO,YAAW;IAAS,KAAI;IAAK,UAAS;IAA1D,UAAA;KACE,oBAAC,qBAAD,EAA6B,OAAS,CAAA;KAEtC,qBAAC,KAAD;MAAK,SAAQ;MAAO,YAAW;MAAS,UAAS;MAAjD,UAAA,CACE,oBAAC,qBAAD;OAA6B;OAAQ,QAAQ;OAAW;OAAa;OAAU;MAAM,CAAA,GACrF,oBAAC,oBAAD;OAA4B;OAAQ,aAAa;OAAQ;OAAU;MAAM,CAAA,CACtE;;KACJ,WAAW,aAAa,oBAAC,qBAAD,EAA6B,OAAS,CAAA;IAC5D;GACJ,CAAA,GAAA,WAAW,aACV,qBAAC,KAAD;IAAK,SAAQ;IAAO,YAAW;IAAS,KAAI;IAAK,UAAS;IAA1D,UAAA;KACE,oBAAC,qBAAD;MAA6B;MAAQ,QAAQ;MAAW;MAAa;MAAU;KAAM,CAAA;KACrF,oBAAC,oBAAD;MAA4B;MAAQ,aAAa;MAAQ;MAAU;KAAM,CAAA;KACzE,oBAAC,qBAAD,EAA6B,OAAS,CAAA;IACnC;GAEe,CAAA,CAAA,EAAA,CAAA,GACxB,qBAAC,WAAW,QAAZ,EAAA,UAAA,CACE,oBAAC,eAAD;IAA2B;IAAY,aAAa;GAAI,CAAA,GACvD,WAAW,aAAa,oBAAC,eAAD;IAA2B;IAAY,aAAa;GAAI,CAAA,CAChE,EAAA,CAAA,CACJ;;EACjB,oBAAC,gBAAD;GAAwB;GAAuB;GAAiC;EAAmB,CAAA;EAClG;CACiB,EAAA,CAAA;AAExB"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
type CalendarFooterProps = {
|
|
2
|
+
device?: 'desktop' | 'mobile';
|
|
2
3
|
selectionMode?: 'day' | 'range';
|
|
3
4
|
showSelectedDate?: boolean;
|
|
4
5
|
};
|
|
5
|
-
declare const CalendarFooter: ({ selectionMode, showSelectedDate }: CalendarFooterProps) => import('react').JSX.Element | null;
|
|
6
|
+
declare const CalendarFooter: ({ device, selectionMode, showSelectedDate }: CalendarFooterProps) => import('react').JSX.Element | null;
|
|
6
7
|
export default CalendarFooter;
|
|
@@ -6,7 +6,7 @@ import { Text } from "@chakra-ui/react/text";
|
|
|
6
6
|
import { Button } from "@chakra-ui/react/button";
|
|
7
7
|
import { CalendarDate } from "@internationalized/date";
|
|
8
8
|
//#region lib/components/BitkitCalendar/components/CalendarFooter.tsx
|
|
9
|
-
var CalendarFooter = ({ selectionMode, showSelectedDate }) => {
|
|
9
|
+
var CalendarFooter = ({ device, selectionMode, showSelectedDate }) => {
|
|
10
10
|
const { setOpen, setValue, value } = useDatePickerContext();
|
|
11
11
|
const handleTodayClick = () => {
|
|
12
12
|
const today = /* @__PURE__ */ new Date();
|
|
@@ -28,9 +28,8 @@ var CalendarFooter = ({ selectionMode, showSelectedDate }) => {
|
|
|
28
28
|
if (value.length === 2 && showSelectedDate) {
|
|
29
29
|
const formatDate = (date) => {
|
|
30
30
|
return date.toLocaleDateString("en-US", {
|
|
31
|
-
weekday: "short",
|
|
32
31
|
month: "short",
|
|
33
|
-
day: "
|
|
32
|
+
day: "numeric",
|
|
34
33
|
year: "numeric"
|
|
35
34
|
});
|
|
36
35
|
};
|
|
@@ -41,7 +40,7 @@ var CalendarFooter = ({ selectionMode, showSelectedDate }) => {
|
|
|
41
40
|
textAlign: "center",
|
|
42
41
|
color: "text/secondary",
|
|
43
42
|
marginTop: "24",
|
|
44
|
-
textStyle: "body/lg/regular",
|
|
43
|
+
textStyle: device === "mobile" ? "body/lg/regular" : "body/md/regular",
|
|
45
44
|
children: formattedRange
|
|
46
45
|
});
|
|
47
46
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarFooter.js","names":[],"sources":["../../../../lib/components/BitkitCalendar/components/CalendarFooter.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Button } from '@chakra-ui/react/button';\nimport { Text } from '@chakra-ui/react/text';\nimport { CalendarDate } from '@internationalized/date';\n\nimport { useDatePickerContext } from '../../../atoms/DatePicker/DatePicker';\nimport { calendarDateToDate } from '../Calendar.utils';\n\ntype CalendarFooterProps = {\n selectionMode?: 'day' | 'range';\n showSelectedDate?: boolean;\n};\n\nconst CalendarFooter = ({ selectionMode, showSelectedDate }: CalendarFooterProps) => {\n const { setOpen, setValue, value } = useDatePickerContext();\n\n const handleTodayClick = () => {\n const today = new Date();\n const todayCalendarDate = new CalendarDate(today.getFullYear(), today.getMonth() + 1, today.getDate());\n setValue([todayCalendarDate]);\n setOpen(false);\n };\n\n if (selectionMode === 'day') {\n return (\n <Box display=\"flex\" justifyContent=\"center\" marginTop=\"16\">\n <Button variant=\"tertiary\" size=\"sm\" onClick={handleTodayClick}>\n Today\n </Button>\n </Box>\n );\n }\n\n if (value.length === 2 && showSelectedDate) {\n const formatDate = (date: Date) => {\n return date.toLocaleDateString('en-US', {\n
|
|
1
|
+
{"version":3,"file":"CalendarFooter.js","names":[],"sources":["../../../../lib/components/BitkitCalendar/components/CalendarFooter.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Button } from '@chakra-ui/react/button';\nimport { Text } from '@chakra-ui/react/text';\nimport { CalendarDate } from '@internationalized/date';\n\nimport { useDatePickerContext } from '../../../atoms/DatePicker/DatePicker';\nimport { calendarDateToDate } from '../Calendar.utils';\n\ntype CalendarFooterProps = {\n device?: 'desktop' | 'mobile';\n selectionMode?: 'day' | 'range';\n showSelectedDate?: boolean;\n};\n\nconst CalendarFooter = ({ device, selectionMode, showSelectedDate }: CalendarFooterProps) => {\n const { setOpen, setValue, value } = useDatePickerContext();\n\n const handleTodayClick = () => {\n const today = new Date();\n const todayCalendarDate = new CalendarDate(today.getFullYear(), today.getMonth() + 1, today.getDate());\n setValue([todayCalendarDate]);\n setOpen(false);\n };\n\n if (selectionMode === 'day') {\n return (\n <Box display=\"flex\" justifyContent=\"center\" marginTop=\"16\">\n <Button variant=\"tertiary\" size=\"sm\" onClick={handleTodayClick}>\n Today\n </Button>\n </Box>\n );\n }\n\n if (value.length === 2 && showSelectedDate) {\n const formatDate = (date: Date) => {\n return date.toLocaleDateString('en-US', {\n month: 'short',\n day: 'numeric',\n year: 'numeric',\n });\n };\n\n const startDate = calendarDateToDate(value[0]);\n const endDate = calendarDateToDate(value[1]);\n const formattedRange = `${formatDate(startDate)} – ${formatDate(endDate)}`;\n\n return (\n <Text\n textAlign=\"center\"\n color=\"text/secondary\"\n marginTop=\"24\"\n // The calendar's own size: larger on mobile, as its days are.\n textStyle={device === 'mobile' ? 'body/lg/regular' : 'body/md/regular'}\n >\n {formattedRange}\n </Text>\n );\n }\n\n return null;\n};\n\nexport default CalendarFooter;\n"],"mappings":";;;;;;;;AAcA,IAAM,kBAAkB,EAAE,QAAQ,eAAe,uBAA4C;CAC3F,MAAM,EAAE,SAAS,UAAU,UAAU,qBAAqB;CAE1D,MAAM,yBAAyB;EAC7B,MAAM,wBAAQ,IAAI,KAAK;EACvB,MAAM,oBAAoB,IAAI,aAAa,MAAM,YAAY,GAAG,MAAM,SAAS,IAAI,GAAG,MAAM,QAAQ,CAAC;EACrG,SAAS,CAAC,iBAAiB,CAAC;EAC5B,QAAQ,KAAK;CACf;CAEA,IAAI,kBAAkB,OACpB,OACE,oBAAC,KAAD;EAAK,SAAQ;EAAO,gBAAe;EAAS,WAAU;EACpD,UAAA,oBAAC,QAAD;GAAQ,SAAQ;GAAW,MAAK;GAAK,SAAS;GAAkB,UAAA;EAExD,CAAA;CACL,CAAA;CAIT,IAAI,MAAM,WAAW,KAAK,kBAAkB;EAC1C,MAAM,cAAc,SAAe;GACjC,OAAO,KAAK,mBAAmB,SAAS;IACtC,OAAO;IACP,KAAK;IACL,MAAM;GACR,CAAC;EACH;EAEA,MAAM,YAAY,mBAAmB,MAAM,EAAE;EAC7C,MAAM,UAAU,mBAAmB,MAAM,EAAE;EAC3C,MAAM,iBAAiB,GAAG,WAAW,SAAS,EAAE,KAAK,WAAW,OAAO;EAEvE,OACE,oBAAC,MAAD;GACE,WAAU;GACV,OAAM;GACN,WAAU;GAEV,WAAW,WAAW,WAAW,oBAAoB;GAEpD,UAAA;EACG,CAAA;CAEV;CAEA,OAAO;AACT"}
|