@cube-dev/ui-kit 0.182.0 → 0.183.0

package/dist/components/fields/DatePicker/DateRangeSeparatedPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateRangeSeparatedPicker.js","names":["DateInputBase","mergeProps","Calendar","TimeInput"],"sources":["../../../../src/components/fields/DatePicker/DateRangeSeparatedPicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, ReactElement, useRef } from 'react';\nimport {\n  AriaDateRangePickerProps,\n  DateValue,\n  useDatePicker,\n  useDateRangePicker,\n  useFocusRing,\n} from 'react-aria';\nimport { useDatePickerState, useDateRangePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport { Calendar } from '../../other/Calendar/Calendar';\nimport { Dialog, DialogTrigger } from '../../overlays/Dialog';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { DatePickerElement } from './DatePickerElement';\nimport { DatePickerInput } from './DatePickerInput';\nimport { DEFAULT_DATE_PROPS } from './props';\nimport { TimeInput } from './TimeInput';\nimport { DateFieldBase } from './types';\nimport { useFocusManagerRef } from './utils';\n\nconst DateRangeDash = tasty({\n  'aria-hidden': 'true',\n  'data-qa': 'DateRangeDash',\n  children: '–',\n  styles: {\n    padding: '0 .5x',\n    color: '#dark-03',\n  },\n});\n\nexport interface CubeDateRangeSeparatedPickerProps<\n  T extends DateValue = DateValue,\n> extends Omit<AriaDateRangePickerProps<T>, 'errorMessage' | 'form' | 'name'>,\n    BaseProps,\n    ContainerStyleProps,\n    DateFieldBase<T>,\n    FieldBaseProps<{ start: T; end: T } | null | undefined> {\n  wrapperStyles?: Styles;\n  inputStyles?: Styles;\n  styles?: Styles;\n  size?: 'small' | 'medium' | 'large' | (string & {});\n  maxVisibleMonths?: number;\n  shouldFlip?: boolean;\n  useLocale?: boolean;\n}\n\nfunction DateRangeSeparatedPicker<T extends DateValue>(\n  props: CubeDateRangeSeparatedPickerProps<T>,\n  ref: FocusableRef<HTMLElement>,\n) {\n  const { t } = useI18n();\n\n  props = useFieldProps(props, {\n    defaultValidationTrigger: 'onBlur',\n  });\n  props = Object.assign({}, DEFAULT_DATE_PROPS, props);\n\n  // The public type declares `ContainerStyleProps` and `styles`, so both have to\n  // reach the root — before this they were extracted and dropped, which made\n  // `width=\"100%\"` type-check and do nothing. `extractStyles` already folds in\n  // `props.styles` and lets the individual style props override it, which is the\n  // precedence every other component uses; re-spreading `props.styles` here\n  // would invert it. `wrapperStyles` stays the most specific and keeps winning.\n  let styles: Styles = {\n    ...extractStyles(props, CONTAINER_STYLES),\n    ...props.wrapperStyles,\n  };\n\n  let {\n    qa,\n    size,\n    placeholderValue,\n    isDisabled,\n    isInvalid,\n    isValid,\n    useLocale: useLocaleProp,\n    autoFocus,\n  } = props;\n  let targetRef = useRef<HTMLDivElement>(null);\n\n  let state = useDateRangePickerState({\n    ...props,\n  });\n\n  let startState = useDatePickerState({\n    ...props,\n    onChange: null,\n    value: state.value?.start,\n  });\n\n  let endState = useDatePickerState({\n    ...props,\n    onChange: null,\n    value: state.value?.end,\n  });\n\n  let startFocusRingProps = useFocusRing({\n    within: true,\n    isTextInput: true,\n    autoFocus,\n  });\n  let startFocusProps = useFocusRing({\n    within: false,\n    isTextInput: false,\n    autoFocus,\n  });\n  let endFocusRingProps = useFocusRing({\n    within: true,\n    isTextInput: true,\n    autoFocus,\n  });\n  let endFocusProps = useFocusRing({\n    within: false,\n    isTextInput: false,\n    autoFocus,\n  });\n\n  let domRef = useFocusManagerRef(ref);\n\n  let { groupProps, labelProps, startFieldProps, endFieldProps } =\n    useDateRangePicker(props, state, targetRef);\n\n  let startProps = useDatePicker(props, startState, targetRef);\n  let endProps = useDatePicker(props, endState, targetRef);\n\n  let placeholder: DateValue | undefined = placeholderValue;\n  let timePlaceholder =\n    placeholder && 'hour' in placeholder ? placeholder : undefined;\n  let timeMinValue =\n    props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n  let timeMaxValue =\n    props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n  let timeGranularity =\n    state.granularity === 'hour' ||\n    state.granularity === 'minute' ||\n    state.granularity === 'second'\n      ? state.granularity\n      : null;\n  let showTimeField = !!timeGranularity;\n\n  // let visibleMonths = useVisibleMonths(maxVisibleMonths);\n\n  function onChange(value: DateValue, type: 'start' | 'end') {\n    if (type === 'start') {\n      const newRange = { ...state.value, start: value };\n\n      if (\n        newRange.start &&\n        newRange.end &&\n        newRange.end.compare(newRange.start) < 0\n      ) {\n        newRange.end = newRange.start;\n      }\n\n      state.setValue(newRange);\n      startProps.calendarProps.onChange(value);\n      startState.setOpen(false);\n    } else {\n      const newRange = { ...state.value, end: value };\n\n      if (\n        newRange.start &&\n        newRange.end &&\n        newRange.end.compare(newRange.start) < 0\n      ) {\n        newRange.start = newRange.end;\n      }\n\n      state.setValue(newRange);\n      endProps.calendarProps.onChange(value);\n      endState.setOpen(false);\n    }\n  }\n\n  const component = (\n    <DatePickerElement\n      ref={targetRef}\n      {...groupProps}\n      styles={styles}\n      qa={qa || 'DateRangeSeparatedPicker'}\n      data-input-type=\"daterangeseparatedpicker\"\n    >\n      <DateInputBase\n        disableFocusRing={startFocusProps.isFocused}\n        isDisabled={isDisabled}\n        isInvalid={isInvalid}\n        isValid={isValid}\n        size={size}\n        {...startFocusRingProps.focusProps}\n        suffix={\n          <DialogTrigger\n            hideArrow\n            type=\"popover\"\n            mobileType=\"tray\"\n            placement=\"bottom right\"\n            targetRef={targetRef}\n            isOpen={startState.isOpen}\n            shouldFlip={props.shouldFlip}\n            onOpenChange={startState.setOpen}\n          >\n            <DatePickerButton\n              size={size}\n              {...mergeProps(\n                startProps.buttonProps,\n                startFocusProps.focusProps,\n              )}\n              isDisabled={isDisabled}\n            />\n            <Dialog {...startProps.dialogProps} width=\"max-content\">\n              <Calendar\n                {...startProps.calendarProps}\n                defaultFocusedValue={\n                  state.value?.start || state.value?.end || undefined\n                }\n                selectedRange={\n                  state.value?.start && state.value?.end\n                    ? state.value\n                    : undefined\n                }\n                onChange={(value: DateValue) => onChange(value, 'start')}\n              />\n              {showTimeField && (\n                <TimeInput\n                  padding=\"1x\"\n                  label={t('datePicker.time', 'Time')}\n                  value={startState.timeValue}\n                  placeholderValue={timePlaceholder}\n                  granularity={timeGranularity}\n                  minValue={timeMinValue}\n                  maxValue={timeMaxValue}\n                  hourCycle={props.hourCycle}\n                  hideTimeZone={props.hideTimeZone}\n                  onChange={startState.setTimeValue}\n                />\n              )}\n            </Dialog>\n          </DialogTrigger>\n        }\n      >\n        <DatePickerInput useLocale={useLocaleProp} {...startFieldProps} />\n      </DateInputBase>\n      <DateRangeDash />\n      <DateInputBase\n        disableFocusRing={endFocusProps.isFocused}\n        isDisabled={isDisabled}\n        isInvalid={isInvalid}\n        isValid={isValid}\n        size={size}\n        {...endFocusRingProps.focusProps}\n        suffix={\n          <DialogTrigger\n            hideArrow\n            type=\"popover\"\n            mobileType=\"tray\"\n            placement=\"bottom right\"\n            targetRef={targetRef}\n            isOpen={endState.isOpen}\n            shouldFlip={props.shouldFlip}\n            onOpenChange={endState.setOpen}\n          >\n            <DatePickerButton\n              aria-label={t(\n                'datePicker.showEndCalendar',\n                'Show calendar for the end date',\n              )}\n              size={size}\n              {...mergeProps(endFocusProps.focusProps, endProps.buttonProps)}\n              isDisabled={isDisabled}\n            />\n            <Dialog {...endProps.dialogProps} width=\"max-content\">\n              <Calendar\n                {...endProps.calendarProps}\n                defaultFocusedValue={\n                  state.value?.end || state.value?.start || undefined\n                }\n                selectedRange={\n                  state.value?.start && state.value?.end\n                    ? state.value\n                    : undefined\n                }\n                onChange={(value: DateValue) => {\n                  onChange(value, 'end');\n                }}\n              />\n              {showTimeField && (\n                <TimeInput\n                  padding=\"1x\"\n                  label={t('datePicker.time', 'Time')}\n                  value={endState.timeValue}\n                  placeholderValue={timePlaceholder}\n                  granularity={timeGranularity}\n                  minValue={timeMinValue}\n                  maxValue={timeMaxValue}\n                  hourCycle={props.hourCycle}\n                  hideTimeZone={props.hideTimeZone}\n                  onChange={endState.setTimeValue}\n                />\n              )}\n            </Dialog>\n          </DialogTrigger>\n        }\n      >\n        <DatePickerInput useLocale={useLocaleProp} {...endFieldProps} />\n      </DateInputBase>\n    </DatePickerElement>\n  );\n\n  return wrapWithField(component, domRef, {\n    ...props,\n    labelProps: mergeProps(props.labelProps, labelProps),\n  });\n}\n\nconst _DateRangeSeparatedPicker = forwardRef(DateRangeSeparatedPicker) as <\n  T extends DateValue,\n>(\n  props: CubeDateRangeSeparatedPickerProps<T> & {\n    ref?: FocusableRef<HTMLElement>;\n  },\n) => ReactElement;\n\n(_DateRangeSeparatedPicker as any).displayName = 'DateRangeSeparatedPicker';\n\nexport { _DateRangeSeparatedPicker as DateRangeSeparatedPicker };\n"],"mappings":"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"}
+{"version":3,"file":"DateRangeSeparatedPicker.js","names":["FocusableRef","BaseProps","CONTAINER_STYLES","ContainerStyleProps","Styles","tasty","forwardRef","ReactElement","useRef","AriaDateRangePickerProps","DateValue","useDatePicker","useDateRangePicker","useFocusRing","useDatePickerState","useDateRangePickerState","useI18n","FieldBaseProps","mergeProps","extractStyles","useFieldProps","wrapWithField","Calendar","Dialog","DialogTrigger","DateInputBase","DatePickerButton","DatePickerElement","DatePickerInput","DEFAULT_DATE_PROPS","TimeInput","DateFieldBase","useFocusManagerRef","DateRangeDash","children","styles","padding","color","CubeDateRangeSeparatedPickerProps","Omit","T","start","end","wrapperStyles","inputStyles","size","maxVisibleMonths","shouldFlip","useLocale","DateRangeSeparatedPicker","props","ref","$","_c","t","t0","Symbol","for","defaultValidationTrigger","t1","Object","assign","t2","qa","placeholderValue","isDisabled","isInvalid","isValid","useLocaleProp","autoFocus","targetRef","t3","state","t4","value","t5","onChange","startState","t6","t7","endState","t8","within","isTextInput","startFocusRingProps","t9","startFocusProps","t10","endFocusRingProps","t11","endFocusProps","domRef","groupProps","labelProps","startFieldProps","endFieldProps","startProps","endProps","placeholder","timePlaceholder","undefined","timeMinValue","minValue","timeMaxValue","maxValue","timeGranularity","granularity","showTimeField","t12","calendarProps","type","newRange","compare","setValue","setOpen","newRange_0","t13","t14","isFocused","t15","focusProps","t16","isOpen","t17","t18","t19","buttonProps","t20","t21","t22","t23","value_0","t24","t25","hideTimeZone","hourCycle","setTimeValue","timeValue","t26","dialogProps","t27","t28","t29","t30","t31","t32","t33","t34","t35","t36","t37","t38","t39","t40","t41","value_1","t42","t43","t44","t45","t46","t47","t48","component","t49","_DateRangeSeparatedPicker","HTMLElement","displayName"],"sources":["../../../../src/components/fields/DatePicker/DateRangeSeparatedPicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, ReactElement, useRef } from 'react';\nimport {\n  AriaDateRangePickerProps,\n  DateValue,\n  useDatePicker,\n  useDateRangePicker,\n  useFocusRing,\n} from 'react-aria';\nimport { useDatePickerState, useDateRangePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport { Calendar } from '../../other/Calendar/Calendar';\nimport { Dialog, DialogTrigger } from '../../overlays/Dialog';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { DatePickerElement } from './DatePickerElement';\nimport { DatePickerInput } from './DatePickerInput';\nimport { DEFAULT_DATE_PROPS } from './props';\nimport { TimeInput } from './TimeInput';\nimport { DateFieldBase } from './types';\nimport { useFocusManagerRef } from './utils';\n\nconst DateRangeDash = tasty({\n  'aria-hidden': 'true',\n  'data-qa': 'DateRangeDash',\n  children: '–',\n  styles: {\n    padding: '0 .5x',\n    color: '#dark-03',\n  },\n});\n\nexport interface CubeDateRangeSeparatedPickerProps<\n  T extends DateValue = DateValue,\n> extends Omit<AriaDateRangePickerProps<T>, 'errorMessage' | 'form' | 'name'>,\n    BaseProps,\n    ContainerStyleProps,\n    DateFieldBase<T>,\n    FieldBaseProps<{ start: T; end: T } | null | undefined> {\n  wrapperStyles?: Styles;\n  inputStyles?: Styles;\n  styles?: Styles;\n  size?: 'small' | 'medium' | 'large' | (string & {});\n  maxVisibleMonths?: number;\n  shouldFlip?: boolean;\n  useLocale?: boolean;\n}\n\nfunction DateRangeSeparatedPicker<T extends DateValue>(\n  props: CubeDateRangeSeparatedPickerProps<T>,\n  ref: FocusableRef<HTMLElement>,\n) {\n  const { t } = useI18n();\n\n  props = useFieldProps(props, {\n    defaultValidationTrigger: 'onBlur',\n  });\n  props = Object.assign({}, DEFAULT_DATE_PROPS, props);\n\n  // The public type declares `ContainerStyleProps` and `styles`, so both have to\n  // reach the root — before this they were extracted and dropped, which made\n  // `width=\"100%\"` type-check and do nothing. `extractStyles` already folds in\n  // `props.styles` and lets the individual style props override it, which is the\n  // precedence every other component uses; re-spreading `props.styles` here\n  // would invert it. `wrapperStyles` stays the most specific and keeps winning.\n  let styles: Styles = {\n    ...extractStyles(props, CONTAINER_STYLES),\n    ...props.wrapperStyles,\n  };\n\n  let {\n    qa,\n    size,\n    placeholderValue,\n    isDisabled,\n    isInvalid,\n    isValid,\n    useLocale: useLocaleProp,\n    autoFocus,\n  } = props;\n  let targetRef = useRef<HTMLDivElement>(null);\n\n  let state = useDateRangePickerState({\n    ...props,\n  });\n\n  let startState = useDatePickerState({\n    ...props,\n    onChange: null,\n    value: state.value?.start,\n  });\n\n  let endState = useDatePickerState({\n    ...props,\n    onChange: null,\n    value: state.value?.end,\n  });\n\n  let startFocusRingProps = useFocusRing({\n    within: true,\n    isTextInput: true,\n    autoFocus,\n  });\n  let startFocusProps = useFocusRing({\n    within: false,\n    isTextInput: false,\n    autoFocus,\n  });\n  let endFocusRingProps = useFocusRing({\n    within: true,\n    isTextInput: true,\n    autoFocus,\n  });\n  let endFocusProps = useFocusRing({\n    within: false,\n    isTextInput: false,\n    autoFocus,\n  });\n\n  let domRef = useFocusManagerRef(ref);\n\n  let { groupProps, labelProps, startFieldProps, endFieldProps } =\n    useDateRangePicker(props, state, targetRef);\n\n  let startProps = useDatePicker(props, startState, targetRef);\n  let endProps = useDatePicker(props, endState, targetRef);\n\n  let placeholder: DateValue | undefined = placeholderValue;\n  let timePlaceholder =\n    placeholder && 'hour' in placeholder ? placeholder : undefined;\n  let timeMinValue =\n    props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n  let timeMaxValue =\n    props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n  let timeGranularity =\n    state.granularity === 'hour' ||\n    state.granularity === 'minute' ||\n    state.granularity === 'second'\n      ? state.granularity\n      : null;\n  let showTimeField = !!timeGranularity;\n\n  // let visibleMonths = useVisibleMonths(maxVisibleMonths);\n\n  function onChange(value: DateValue, type: 'start' | 'end') {\n    if (type === 'start') {\n      const newRange = { ...state.value, start: value };\n\n      if (\n        newRange.start &&\n        newRange.end &&\n        newRange.end.compare(newRange.start) < 0\n      ) {\n        newRange.end = newRange.start;\n      }\n\n      state.setValue(newRange);\n      startProps.calendarProps.onChange(value);\n      startState.setOpen(false);\n    } else {\n      const newRange = { ...state.value, end: value };\n\n      if (\n        newRange.start &&\n        newRange.end &&\n        newRange.end.compare(newRange.start) < 0\n      ) {\n        newRange.start = newRange.end;\n      }\n\n      state.setValue(newRange);\n      endProps.calendarProps.onChange(value);\n      endState.setOpen(false);\n    }\n  }\n\n  const component = (\n    <DatePickerElement\n      ref={targetRef}\n      {...groupProps}\n      styles={styles}\n      qa={qa || 'DateRangeSeparatedPicker'}\n      data-input-type=\"daterangeseparatedpicker\"\n    >\n      <DateInputBase\n        disableFocusRing={startFocusProps.isFocused}\n        isDisabled={isDisabled}\n        isInvalid={isInvalid}\n        isValid={isValid}\n        size={size}\n        {...startFocusRingProps.focusProps}\n        suffix={\n          <DialogTrigger\n            hideArrow\n            type=\"popover\"\n            mobileType=\"tray\"\n            placement=\"bottom right\"\n            targetRef={targetRef}\n            isOpen={startState.isOpen}\n            shouldFlip={props.shouldFlip}\n            onOpenChange={startState.setOpen}\n          >\n            <DatePickerButton\n              size={size}\n              {...mergeProps(\n                startProps.buttonProps,\n                startFocusProps.focusProps,\n              )}\n              isDisabled={isDisabled}\n            />\n            <Dialog {...startProps.dialogProps} width=\"max-content\">\n              <Calendar\n                {...startProps.calendarProps}\n                defaultFocusedValue={\n                  state.value?.start || state.value?.end || undefined\n                }\n                selectedRange={\n                  state.value?.start && state.value?.end\n                    ? state.value\n                    : undefined\n                }\n                onChange={(value: DateValue) => onChange(value, 'start')}\n              />\n              {showTimeField && (\n                <TimeInput\n                  padding=\"1x\"\n                  label={t('datePicker.time', 'Time')}\n                  value={startState.timeValue}\n                  placeholderValue={timePlaceholder}\n                  granularity={timeGranularity}\n                  minValue={timeMinValue}\n                  maxValue={timeMaxValue}\n                  hourCycle={props.hourCycle}\n                  hideTimeZone={props.hideTimeZone}\n                  onChange={startState.setTimeValue}\n                />\n              )}\n            </Dialog>\n          </DialogTrigger>\n        }\n      >\n        <DatePickerInput useLocale={useLocaleProp} {...startFieldProps} />\n      </DateInputBase>\n      <DateRangeDash />\n      <DateInputBase\n        disableFocusRing={endFocusProps.isFocused}\n        isDisabled={isDisabled}\n        isInvalid={isInvalid}\n        isValid={isValid}\n        size={size}\n        {...endFocusRingProps.focusProps}\n        suffix={\n          <DialogTrigger\n            hideArrow\n            type=\"popover\"\n            mobileType=\"tray\"\n            placement=\"bottom right\"\n            targetRef={targetRef}\n            isOpen={endState.isOpen}\n            shouldFlip={props.shouldFlip}\n            onOpenChange={endState.setOpen}\n          >\n            <DatePickerButton\n              aria-label={t(\n                'datePicker.showEndCalendar',\n                'Show calendar for the end date',\n              )}\n              size={size}\n              {...mergeProps(endFocusProps.focusProps, endProps.buttonProps)}\n              isDisabled={isDisabled}\n            />\n            <Dialog {...endProps.dialogProps} width=\"max-content\">\n              <Calendar\n                {...endProps.calendarProps}\n                defaultFocusedValue={\n                  state.value?.end || state.value?.start || undefined\n                }\n                selectedRange={\n                  state.value?.start && state.value?.end\n                    ? state.value\n                    : undefined\n                }\n                onChange={(value: DateValue) => {\n                  onChange(value, 'end');\n                }}\n              />\n              {showTimeField && (\n                <TimeInput\n                  padding=\"1x\"\n                  label={t('datePicker.time', 'Time')}\n                  value={endState.timeValue}\n                  placeholderValue={timePlaceholder}\n                  granularity={timeGranularity}\n                  minValue={timeMinValue}\n                  maxValue={timeMaxValue}\n                  hourCycle={props.hourCycle}\n                  hideTimeZone={props.hideTimeZone}\n                  onChange={endState.setTimeValue}\n                />\n              )}\n            </Dialog>\n          </DialogTrigger>\n        }\n      >\n        <DatePickerInput useLocale={useLocaleProp} {...endFieldProps} />\n      </DateInputBase>\n    </DatePickerElement>\n  );\n\n  return wrapWithField(component, domRef, {\n    ...props,\n    labelProps: mergeProps(props.labelProps, labelProps),\n  });\n}\n\nconst _DateRangeSeparatedPicker = forwardRef(DateRangeSeparatedPicker) as <\n  T extends DateValue,\n>(\n  props: CubeDateRangeSeparatedPickerProps<T> & {\n    ref?: FocusableRef<HTMLElement>;\n  },\n) => ReactElement;\n\n(_DateRangeSeparatedPicker as any).displayName = 'DateRangeSeparatedPicker';\n\nexport { _DateRangeSeparatedPicker as DateRangeSeparatedPicker };\n"],"mappings":"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"}

package/dist/components/fields/DatePicker/MonthPicker.js

@@ -1,15 +1,24 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { _PeriodPicker } from "./PeriodPicker.js";
+import { c } from "react-compiler-runtime";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/fields/DatePicker/MonthPicker.tsx
 function MonthPicker(props, ref) {
-	return /* @__PURE__ */ jsx(_PeriodPicker, {
-		ref,
-		picker: "month",
-		...props
-	});
+	const $ = c(3);
+	let t0;
+	if ($[0] !== props || $[1] !== ref) {
+		t0 = /* @__PURE__ */ jsx(_PeriodPicker, {
+			ref,
+			picker: "month",
+			...props
+		});
+		$[0] = props;
+		$[1] = ref;
+		$[2] = t0;
+	} else t0 = $[2];
+	return t0;
 }
 const _MonthPicker = forwardRef(MonthPicker);
 _MonthPicker.displayName = "MonthPicker";

package/dist/components/fields/DatePicker/MonthPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"MonthPicker.js","names":["PeriodPicker"],"sources":["../../../../src/components/fields/DatePicker/MonthPicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { forwardRef } from 'react';\nimport { DateValue } from 'react-aria';\n\nimport { CubePeriodPickerProps, PeriodPicker } from './PeriodPicker';\n\nexport interface CubeMonthPickerProps<T extends DateValue = DateValue>\n  extends Omit<CubePeriodPickerProps<T>, 'picker'> {}\n\nfunction MonthPicker<T extends DateValue>(\n  props: CubeMonthPickerProps<T>,\n  ref: FocusableRef<HTMLElement>,\n) {\n  return <PeriodPicker ref={ref} picker=\"month\" {...props} />;\n}\n\nconst _MonthPicker = forwardRef(MonthPicker);\n\n_MonthPicker.displayName = 'MonthPicker';\n\nexport { _MonthPicker as MonthPicker };\n"],"mappings":";;;;;;AASA,SAAS,YACP,OACA,KACA;AACA,QAAO,oBAACA;EAAkB;EAAK,QAAO;EAAQ,GAAI;GAAS;;AAG7D,MAAM,eAAe,WAAW,YAAY;AAE5C,aAAa,cAAc"}
+{"version":3,"file":"MonthPicker.js","names":["FocusableRef","forwardRef","DateValue","CubePeriodPickerProps","PeriodPicker","CubeMonthPickerProps","Omit","T","MonthPicker","props","ref","$","_c","t0","_MonthPicker","displayName"],"sources":["../../../../src/components/fields/DatePicker/MonthPicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { forwardRef } from 'react';\nimport { DateValue } from 'react-aria';\n\nimport { CubePeriodPickerProps, PeriodPicker } from './PeriodPicker';\n\nexport interface CubeMonthPickerProps<T extends DateValue = DateValue>\n  extends Omit<CubePeriodPickerProps<T>, 'picker'> {}\n\nfunction MonthPicker<T extends DateValue>(\n  props: CubeMonthPickerProps<T>,\n  ref: FocusableRef<HTMLElement>,\n) {\n  return <PeriodPicker ref={ref} picker=\"month\" {...props} />;\n}\n\nconst _MonthPicker = forwardRef(MonthPicker);\n\n_MonthPicker.displayName = 'MonthPicker';\n\nexport { _MonthPicker as MonthPicker };\n"],"mappings":";;;;;;;AASA,SAAAQ,YAAAC,OAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;AAAA,KAAAF,EAAA,OAAAF,SAAAE,EAAA,OAAAD,KAAA;AAISG,OAAA,oBAAC;GAAkBH;GAAY,QAAA;GAAO,GAAKD;IAAS;AAAAE,IAAA,KAAAF;AAAAE,IAAA,KAAAD;AAAAC,IAAA,KAAAE;OAAAA,MAAAF,EAAA;AAAA,QAApDE;;AAGT,MAAMC,eAAeb,WAAWO,YAAY;AAE5CM,aAAaC,cAAc"}

package/dist/components/fields/DatePicker/PeriodPicker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useI18n } from "../../../i18n/useI18n.js";
@@ -12,6 +12,7 @@ import { formatPeriod, snapToPeriod } from "./period.js";
 import { _Calendar } from "../../other/Calendar/Calendar.js";
 import { DatePickerButton } from "./DatePickerButton.js";
 import { PeriodCalendar } from "../../other/Calendar/PeriodCalendar.js";
+import { c } from "react-compiler-runtime";
 import { CONTAINER_STYLES, tasty } from "@tenphi/tasty";
 import { forwardRef, useId, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -35,110 +36,306 @@ const PeriodValueElement = tasty({
 	}
 });
 function PeriodPicker(props, ref) {
+	const $ = c(93);
 	const { t } = useI18n();
-	props = useFieldProps(props, { defaultValidationTrigger: "onBlur" });
-	let styles = extractStyles(props, CONTAINER_STYLES);
-	let { qa, size, picker = "month", placeholder, formatValue, isDisabled, isReadOnly, isInvalid, isValid, autoFocus } = props;
-	let defaultPlaceholder = {
-		week: t("datePicker.selectWeek", "Select week"),
-		month: t("datePicker.selectMonth", "Select month"),
-		quarter: t("datePicker.selectQuarter", "Select quarter"),
-		year: t("datePicker.selectYear", "Select year")
-	};
-	let { locale } = useLocale();
-	let targetRef = useRef(null);
-	let state = useDatePickerState({
-		...props,
-		granularity: "day",
-		shouldCloseOnSelect: true
-	});
-	let { isOpen, setOpen } = state;
-	let domRef = useFocusManagerRef(ref);
-	let { isFocused: isFocusedButton, focusProps: focusPropsButton } = useFocusRing({
-		within: false,
-		isTextInput: false,
-		autoFocus
-	});
-	let { groupProps, labelProps, buttonProps, dialogProps, calendarProps } = useDatePicker({
-		...props,
-		granularity: "day"
-	}, state, targetRef);
-	let handleSelect = (date) => {
-		state.setValue(snapToPeriod(date, picker, locale));
-		setOpen(false);
-	};
-	let displayText = state.value ? (formatValue ?? formatPeriod)(state.value, picker, locale) : placeholder ?? defaultPlaceholder[picker];
-	let valueId = useId();
-	const panel = picker === "week" ? /* @__PURE__ */ jsx(_Calendar, {
-		...calendarProps,
-		autoFocus: true,
-		pickerMode: "week",
-		isDisabled,
-		onChange: handleSelect
-	}) : /* @__PURE__ */ jsx(PeriodCalendar, {
-		autoFocus: true,
-		picker,
-		value: calendarProps.value,
-		minValue: calendarProps.minValue,
-		maxValue: calendarProps.maxValue,
-		isDateUnavailable: calendarProps.isDateUnavailable,
-		isDisabled,
-		onChange: handleSelect
-	});
-	return wrapWithField(/* @__PURE__ */ jsx(_DateInputBase, {
-		ref: targetRef,
-		qa: qa || "PeriodPicker",
-		inputType: "datepicker",
-		styles: {
+	let t0;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = { defaultValidationTrigger: "onBlur" };
+		$[0] = t0;
+	} else t0 = $[0];
+	props = useFieldProps(props, t0);
+	let t1;
+	if ($[1] !== props) {
+		t1 = extractStyles(props, CONTAINER_STYLES);
+		$[1] = props;
+		$[2] = t1;
+	} else t1 = $[2];
+	const styles = t1;
+	const { qa, size, picker: t2, placeholder, formatValue, isDisabled, isReadOnly, isInvalid, isValid, autoFocus } = props;
+	const picker = t2 === void 0 ? "month" : t2;
+	let t3;
+	if ($[3] !== t) {
+		t3 = t("datePicker.selectWeek", "Select week");
+		$[3] = t;
+		$[4] = t3;
+	} else t3 = $[4];
+	let t4;
+	if ($[5] !== t) {
+		t4 = t("datePicker.selectMonth", "Select month");
+		$[5] = t;
+		$[6] = t4;
+	} else t4 = $[6];
+	let t5;
+	if ($[7] !== t) {
+		t5 = t("datePicker.selectQuarter", "Select quarter");
+		$[7] = t;
+		$[8] = t5;
+	} else t5 = $[8];
+	let t6;
+	if ($[9] !== t) {
+		t6 = t("datePicker.selectYear", "Select year");
+		$[9] = t;
+		$[10] = t6;
+	} else t6 = $[10];
+	let t7;
+	if ($[11] !== t3 || $[12] !== t4 || $[13] !== t5 || $[14] !== t6) {
+		t7 = {
+			week: t3,
+			month: t4,
+			quarter: t5,
+			year: t6
+		};
+		$[11] = t3;
+		$[12] = t4;
+		$[13] = t5;
+		$[14] = t6;
+		$[15] = t7;
+	} else t7 = $[15];
+	const defaultPlaceholder = t7;
+	const { locale } = useLocale();
+	const targetRef = useRef(null);
+	let t8;
+	if ($[16] !== props) {
+		t8 = {
+			...props,
+			granularity: "day",
+			shouldCloseOnSelect: true
+		};
+		$[16] = props;
+		$[17] = t8;
+	} else t8 = $[17];
+	const state = useDatePickerState(t8);
+	const { isOpen, setOpen } = state;
+	const domRef = useFocusManagerRef(ref);
+	let t9;
+	if ($[18] !== autoFocus) {
+		t9 = {
+			within: false,
+			isTextInput: false,
+			autoFocus
+		};
+		$[18] = autoFocus;
+		$[19] = t9;
+	} else t9 = $[19];
+	const { isFocused: isFocusedButton, focusProps: focusPropsButton } = useFocusRing(t9);
+	let t10;
+	if ($[20] !== props) {
+		t10 = {
+			...props,
+			granularity: "day"
+		};
+		$[20] = props;
+		$[21] = t10;
+	} else t10 = $[21];
+	const { groupProps, labelProps, buttonProps, dialogProps, calendarProps } = useDatePicker(t10, state, targetRef);
+	let t11;
+	if ($[22] !== locale || $[23] !== picker || $[24] !== setOpen || $[25] !== state) {
+		t11 = (date) => {
+			state.setValue(snapToPeriod(date, picker, locale));
+			setOpen(false);
+		};
+		$[22] = locale;
+		$[23] = picker;
+		$[24] = setOpen;
+		$[25] = state;
+		$[26] = t11;
+	} else t11 = $[26];
+	const handleSelect = t11;
+	let t12;
+	if ($[27] !== defaultPlaceholder || $[28] !== formatValue || $[29] !== locale || $[30] !== picker || $[31] !== placeholder || $[32] !== state.value) {
+		t12 = state.value ? (formatValue ?? formatPeriod)(state.value, picker, locale) : placeholder ?? defaultPlaceholder[picker];
+		$[27] = defaultPlaceholder;
+		$[28] = formatValue;
+		$[29] = locale;
+		$[30] = picker;
+		$[31] = placeholder;
+		$[32] = state.value;
+		$[33] = t12;
+	} else t12 = $[33];
+	const displayText = t12;
+	const valueId = useId();
+	let t13;
+	if ($[34] !== calendarProps || $[35] !== handleSelect || $[36] !== isDisabled || $[37] !== picker) {
+		t13 = picker === "week" ? /* @__PURE__ */ jsx(_Calendar, {
+			...calendarProps,
+			autoFocus: true,
+			pickerMode: "week",
+			isDisabled,
+			onChange: handleSelect
+		}) : /* @__PURE__ */ jsx(PeriodCalendar, {
+			autoFocus: true,
+			picker,
+			value: calendarProps.value,
+			minValue: calendarProps.minValue,
+			maxValue: calendarProps.maxValue,
+			isDateUnavailable: calendarProps.isDateUnavailable,
+			isDisabled,
+			onChange: handleSelect
+		});
+		$[34] = calendarProps;
+		$[35] = handleSelect;
+		$[36] = isDisabled;
+		$[37] = picker;
+		$[38] = t13;
+	} else t13 = $[38];
+	const panel = t13;
+	const t14 = qa || "PeriodPicker";
+	let t15;
+	if ($[39] !== props.wrapperStyles || $[40] !== styles) {
+		t15 = {
 			display: "grid",
 			...styles,
 			...props.wrapperStyles
-		},
-		inputStyles: {
-			cursor: isDisabled || isReadOnly ? "default" : "pointer",
+		};
+		$[39] = props.wrapperStyles;
+		$[40] = styles;
+		$[41] = t15;
+	} else t15 = $[41];
+	const t16 = isDisabled || isReadOnly ? "default" : "pointer";
+	let t17;
+	if ($[42] !== props.inputStyles || $[43] !== t16) {
+		t17 = {
+			cursor: t16,
 			...props.inputStyles
-		},
-		disableFocusRing: isFocusedButton,
-		isDisabled,
-		isInvalid,
-		isValid,
-		size,
-		fieldProps: groupProps,
-		suffix: /* @__PURE__ */ jsxs(DialogTrigger, {
+		};
+		$[42] = props.inputStyles;
+		$[43] = t16;
+		$[44] = t17;
+	} else t17 = $[44];
+	const t18 = props.shouldFlip;
+	let t19;
+	if ($[45] !== buttonProps || $[46] !== focusPropsButton) {
+		t19 = mergeProps$1(buttonProps, focusPropsButton);
+		$[45] = buttonProps;
+		$[46] = focusPropsButton;
+		$[47] = t19;
+	} else t19 = $[47];
+	let t20;
+	if ($[48] !== isDisabled || $[49] !== isReadOnly || $[50] !== props.triggerStyles || $[51] !== size || $[52] !== t19 || $[53] !== valueId) {
+		t20 = /* @__PURE__ */ jsx(DatePickerButton, {
+			size,
+			...t19,
+			"aria-describedby": valueId,
+			isDisabled,
+			isReadOnly,
+			styles: props.triggerStyles
+		});
+		$[48] = isDisabled;
+		$[49] = isReadOnly;
+		$[50] = props.triggerStyles;
+		$[51] = size;
+		$[52] = t19;
+		$[53] = valueId;
+		$[54] = t20;
+	} else t20 = $[54];
+	let t21;
+	if ($[55] !== dialogProps || $[56] !== panel) {
+		t21 = /* @__PURE__ */ jsx(Dialog, {
+			...dialogProps,
+			width: "max-content",
+			children: panel
+		});
+		$[55] = dialogProps;
+		$[56] = panel;
+		$[57] = t21;
+	} else t21 = $[57];
+	let t22;
+	if ($[58] !== isOpen || $[59] !== props.shouldFlip || $[60] !== setOpen || $[61] !== t20 || $[62] !== t21) {
+		t22 = /* @__PURE__ */ jsxs(DialogTrigger, {
 			hideArrow: true,
 			type: "popover",
 			mobileType: "tray",
 			placement: "bottom right",
 			targetRef,
 			isOpen,
-			shouldFlip: props.shouldFlip,
+			shouldFlip: t18,
 			onOpenChange: setOpen,
-			children: [/* @__PURE__ */ jsx(DatePickerButton, {
-				size,
-				...mergeProps$1(buttonProps, focusPropsButton),
-				"aria-describedby": valueId,
-				isDisabled,
-				isReadOnly,
-				styles: props.triggerStyles
-			}), /* @__PURE__ */ jsx(Dialog, {
-				...dialogProps,
-				width: "max-content",
-				children: panel
-			})]
-		}),
-		children: /* @__PURE__ */ jsx(PeriodValueElement, {
+			children: [t20, t21]
+		});
+		$[58] = isOpen;
+		$[59] = props.shouldFlip;
+		$[60] = setOpen;
+		$[61] = t20;
+		$[62] = t21;
+		$[63] = t22;
+	} else t22 = $[63];
+	const t23 = !state.value;
+	let t24;
+	if ($[64] !== isDisabled || $[65] !== t23) {
+		t24 = {
+			placeholder: t23,
+			disabled: isDisabled
+		};
+		$[64] = isDisabled;
+		$[65] = t23;
+		$[66] = t24;
+	} else t24 = $[66];
+	let t25;
+	if ($[67] !== isDisabled || $[68] !== isReadOnly || $[69] !== setOpen) {
+		t25 = () => !isDisabled && !isReadOnly && setOpen(true);
+		$[67] = isDisabled;
+		$[68] = isReadOnly;
+		$[69] = setOpen;
+		$[70] = t25;
+	} else t25 = $[70];
+	let t26;
+	if ($[71] !== displayText || $[72] !== t24 || $[73] !== t25 || $[74] !== valueId) {
+		t26 = /* @__PURE__ */ jsx(PeriodValueElement, {
 			id: valueId,
-			mods: {
-				placeholder: !state.value,
-				disabled: isDisabled
-			},
-			onClick: () => !isDisabled && !isReadOnly && setOpen(true),
+			mods: t24,
+			onClick: t25,
 			children: displayText
-		})
-	}), domRef, {
-		...props,
-		labelProps: mergeProps$1(props.labelProps, labelProps)
-	});
+		});
+		$[71] = displayText;
+		$[72] = t24;
+		$[73] = t25;
+		$[74] = valueId;
+		$[75] = t26;
+	} else t26 = $[75];
+	let t27;
+	if ($[76] !== groupProps || $[77] !== isDisabled || $[78] !== isFocusedButton || $[79] !== isInvalid || $[80] !== isValid || $[81] !== size || $[82] !== t14 || $[83] !== t15 || $[84] !== t17 || $[85] !== t22 || $[86] !== t26) {
+		t27 = /* @__PURE__ */ jsx(_DateInputBase, {
+			ref: targetRef,
+			qa: t14,
+			inputType: "datepicker",
+			styles: t15,
+			inputStyles: t17,
+			disableFocusRing: isFocusedButton,
+			isDisabled,
+			isInvalid,
+			isValid,
+			size,
+			fieldProps: groupProps,
+			suffix: t22,
+			children: t26
+		});
+		$[76] = groupProps;
+		$[77] = isDisabled;
+		$[78] = isFocusedButton;
+		$[79] = isInvalid;
+		$[80] = isValid;
+		$[81] = size;
+		$[82] = t14;
+		$[83] = t15;
+		$[84] = t17;
+		$[85] = t22;
+		$[86] = t26;
+		$[87] = t27;
+	} else t27 = $[87];
+	const component = t27;
+	let t28;
+	if ($[88] !== component || $[89] !== domRef || $[90] !== labelProps || $[91] !== props) {
+		t28 = wrapWithField(component, domRef, {
+			...props,
+			labelProps: mergeProps$1(props.labelProps, labelProps)
+		});
+		$[88] = component;
+		$[89] = domRef;
+		$[90] = labelProps;
+		$[91] = props;
+		$[92] = t28;
+	} else t28 = $[92];
+	return t28;
 }
 const _PeriodPicker = forwardRef(PeriodPicker);
 _PeriodPicker.displayName = "PeriodPicker";

package/dist/components/fields/DatePicker/PeriodPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"PeriodPicker.js","names":["Calendar","DateInputBase","mergeProps"],"sources":["../../../../src/components/fields/DatePicker/PeriodPicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, useId, useRef } from 'react';\nimport {\n  AriaDatePickerProps,\n  DateValue,\n  useDatePicker,\n  useFocusRing,\n  useLocale,\n} from 'react-aria';\nimport { useDatePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport { Calendar } from '../../other/Calendar/Calendar';\nimport { PeriodCalendar } from '../../other/Calendar/PeriodCalendar';\nimport { Dialog, DialogTrigger } from '../../overlays/Dialog';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { formatPeriod, PickerType, snapToPeriod } from './period';\nimport { useFocusManagerRef } from './utils';\n\nconst PeriodValueElement = tasty({\n  qa: 'PeriodPickerValue',\n  styles: {\n    preset: 't3',\n    width: 'max 100%',\n    whiteSpace: 'nowrap',\n    textOverflow: 'ellipsis',\n    overflow: 'hidden',\n    color: {\n      '': '#dark',\n      placeholder: '#dark.30',\n      disabled: '#dark.30',\n    },\n  },\n});\n\nexport interface CubePeriodPickerProps<T extends DateValue = DateValue>\n  extends Omit<\n      AriaDatePickerProps<T>,\n      'errorMessage' | 'granularity' | 'form' | 'name'\n    >,\n    BaseProps,\n    ContainerStyleProps,\n    FieldBaseProps<T | null | undefined> {\n  /** Which period the picker selects. Set by the concrete picker components. */\n  picker?: PickerType;\n  wrapperStyles?: Styles;\n  inputStyles?: Styles;\n  triggerStyles?: Styles;\n  styles?: Styles;\n  size?: 'small' | 'medium' | 'large' | (string & {});\n  shouldFlip?: boolean;\n  /** Placeholder shown when no value is selected. */\n  placeholder?: string;\n  /** Override how the selected value is rendered as text. */\n  formatValue?: (date: DateValue, picker: PickerType, locale: string) => string;\n}\n\nfunction PeriodPicker<T extends DateValue>(\n  props: CubePeriodPickerProps<T>,\n  ref: FocusableRef<HTMLElement>,\n) {\n  const { t } = useI18n();\n\n  props = useFieldProps(props, {\n    defaultValidationTrigger: 'onBlur',\n  });\n\n  let styles = extractStyles(props, CONTAINER_STYLES);\n\n  let {\n    qa,\n    size,\n    picker = 'month',\n    placeholder,\n    formatValue,\n    isDisabled,\n    isReadOnly,\n    isInvalid,\n    isValid,\n    autoFocus,\n  } = props;\n\n  let defaultPlaceholder: Record<PickerType, string> = {\n    week: t('datePicker.selectWeek', 'Select week'),\n    month: t('datePicker.selectMonth', 'Select month'),\n    quarter: t('datePicker.selectQuarter', 'Select quarter'),\n    year: t('datePicker.selectYear', 'Select year'),\n  };\n\n  let { locale } = useLocale();\n  let targetRef = useRef<HTMLDivElement>(null);\n  let state = useDatePickerState({\n    ...props,\n    granularity: 'day',\n    shouldCloseOnSelect: true,\n  });\n  let { isOpen, setOpen } = state;\n\n  let domRef = useFocusManagerRef(ref);\n\n  let { isFocused: isFocusedButton, focusProps: focusPropsButton } =\n    useFocusRing({\n      within: false,\n      isTextInput: false,\n      autoFocus,\n    });\n\n  let { groupProps, labelProps, buttonProps, dialogProps, calendarProps } =\n    useDatePicker({ ...props, granularity: 'day' }, state, targetRef);\n\n  let handleSelect = (date: DateValue) => {\n    state.setValue(snapToPeriod(date, picker, locale));\n    setOpen(false);\n  };\n\n  let displayText = state.value\n    ? (formatValue ?? formatPeriod)(state.value, picker, locale)\n    : placeholder ?? defaultPlaceholder[picker];\n\n  // The value is rendered as text rather than editable segments, so the trigger\n  // has to point at it to announce the current selection.\n  let valueId = useId();\n\n  const panel =\n    picker === 'week' ? (\n      <Calendar\n        {...calendarProps}\n        autoFocus\n        pickerMode=\"week\"\n        isDisabled={isDisabled}\n        onChange={handleSelect}\n      />\n    ) : (\n      <PeriodCalendar\n        autoFocus\n        picker={picker}\n        value={calendarProps.value}\n        minValue={calendarProps.minValue}\n        maxValue={calendarProps.maxValue}\n        isDateUnavailable={calendarProps.isDateUnavailable}\n        isDisabled={isDisabled}\n        onChange={handleSelect}\n      />\n    );\n\n  const component = (\n    <DateInputBase\n      ref={targetRef}\n      qa={qa || 'PeriodPicker'}\n      inputType=\"datepicker\"\n      styles={{ display: 'grid', ...styles, ...props.wrapperStyles }}\n      inputStyles={{\n        cursor: isDisabled || isReadOnly ? 'default' : 'pointer',\n        ...props.inputStyles,\n      }}\n      disableFocusRing={isFocusedButton}\n      isDisabled={isDisabled}\n      isInvalid={isInvalid}\n      isValid={isValid}\n      size={size}\n      fieldProps={groupProps}\n      suffix={\n        <DialogTrigger\n          hideArrow\n          type=\"popover\"\n          mobileType=\"tray\"\n          placement=\"bottom right\"\n          targetRef={targetRef}\n          isOpen={isOpen}\n          shouldFlip={props.shouldFlip}\n          onOpenChange={setOpen}\n        >\n          <DatePickerButton\n            size={size}\n            {...mergeProps(buttonProps, focusPropsButton)}\n            aria-describedby={valueId}\n            // Passed separately, not merged: only the field-disabled half is\n            // inherited. See `DatePickerButton`.\n            isDisabled={isDisabled}\n            isReadOnly={isReadOnly}\n            styles={props.triggerStyles}\n          />\n          <Dialog {...dialogProps} width=\"max-content\">\n            {panel}\n          </Dialog>\n        </DialogTrigger>\n      }\n    >\n      <PeriodValueElement\n        id={valueId}\n        mods={{ placeholder: !state.value, disabled: isDisabled }}\n        onClick={() => !isDisabled && !isReadOnly && setOpen(true)}\n      >\n        {displayText}\n      </PeriodValueElement>\n    </DateInputBase>\n  );\n\n  return wrapWithField(component, domRef, {\n    ...props,\n    labelProps: mergeProps(props.labelProps, labelProps),\n  });\n}\n\nconst _PeriodPicker = forwardRef(PeriodPicker);\n\n_PeriodPicker.displayName = 'PeriodPicker';\n\nexport { _PeriodPicker as PeriodPicker };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAgCA,MAAM,qBAAqB,MAAM;CAC/B,IAAI;CACJ,QAAQ;EACN,QAAQ;EACR,OAAO;EACP,YAAY;EACZ,cAAc;EACd,UAAU;EACV,OAAO;GACL,IAAI;GACJ,aAAa;GACb,UAAU;GACX;EACF;CACF,CAAC;AAwBF,SAAS,aACP,OACA,KACA;CACA,MAAM,EAAE,MAAM,SAAS;AAEvB,SAAQ,cAAc,OAAO,EAC3B,0BAA0B,UAC3B,CAAC;CAEF,IAAI,SAAS,cAAc,OAAO,iBAAiB;CAEnD,IAAI,EACF,IACA,MACA,SAAS,SACT,aACA,aACA,YACA,YACA,WACA,SACA,cACE;CAEJ,IAAI,qBAAiD;EACnD,MAAM,EAAE,yBAAyB,cAAc;EAC/C,OAAO,EAAE,0BAA0B,eAAe;EAClD,SAAS,EAAE,4BAA4B,iBAAiB;EACxD,MAAM,EAAE,yBAAyB,cAAc;EAChD;CAED,IAAI,EAAE,WAAW,WAAW;CAC5B,IAAI,YAAY,OAAuB,KAAK;CAC5C,IAAI,QAAQ,mBAAmB;EAC7B,GAAG;EACH,aAAa;EACb,qBAAqB;EACtB,CAAC;CACF,IAAI,EAAE,QAAQ,YAAY;CAE1B,IAAI,SAAS,mBAAmB,IAAI;CAEpC,IAAI,EAAE,WAAW,iBAAiB,YAAY,qBAC5C,aAAa;EACX,QAAQ;EACR,aAAa;EACb;EACD,CAAC;CAEJ,IAAI,EAAE,YAAY,YAAY,aAAa,aAAa,kBACtD,cAAc;EAAE,GAAG;EAAO,aAAa;EAAO,EAAE,OAAO,UAAU;CAEnE,IAAI,gBAAgB,SAAoB;AACtC,QAAM,SAAS,aAAa,MAAM,QAAQ,OAAO,CAAC;AAClD,UAAQ,MAAM;;CAGhB,IAAI,cAAc,MAAM,SACnB,eAAe,cAAc,MAAM,OAAO,QAAQ,OAAO,GAC1D,eAAe,mBAAmB;CAItC,IAAI,UAAU,OAAO;CAErB,MAAM,QACJ,WAAW,SACT,oBAACA;EACC,GAAI;EACJ;EACA,YAAW;EACC;EACZ,UAAU;GACV,GAEF,oBAAC;EACC;EACQ;EACR,OAAO,cAAc;EACrB,UAAU,cAAc;EACxB,UAAU,cAAc;EACxB,mBAAmB,cAAc;EACrB;EACZ,UAAU;GACV;AAwDN,QAAO,cApDL,oBAACC;EACC,KAAK;EACL,IAAI,MAAM;EACV,WAAU;EACV,QAAQ;GAAE,SAAS;GAAQ,GAAG;GAAQ,GAAG,MAAM;GAAe;EAC9D,aAAa;GACX,QAAQ,cAAc,aAAa,YAAY;GAC/C,GAAG,MAAM;GACV;EACD,kBAAkB;EACN;EACD;EACF;EACH;EACN,YAAY;EACZ,QACE,qBAAC;GACC;GACA,MAAK;GACL,YAAW;GACX,WAAU;GACC;GACH;GACR,YAAY,MAAM;GAClB,cAAc;cAEd,oBAAC;IACO;IACN,GAAIC,aAAW,aAAa,iBAAiB;IAC7C,oBAAkB;IAGN;IACA;IACZ,QAAQ,MAAM;KACd,EACF,oBAAC;IAAO,GAAI;IAAa,OAAM;cAC5B;KACM;IACK;YAGlB,oBAAC;GACC,IAAI;GACJ,MAAM;IAAE,aAAa,CAAC,MAAM;IAAO,UAAU;IAAY;GACzD,eAAe,CAAC,cAAc,CAAC,cAAc,QAAQ,KAAK;aAEzD;IACkB;GACP,EAGc,QAAQ;EACtC,GAAG;EACH,YAAYA,aAAW,MAAM,YAAY,WAAW;EACrD,CAAC;;AAGJ,MAAM,gBAAgB,WAAW,aAAa;AAE9C,cAAc,cAAc"}
+{"version":3,"file":"PeriodPicker.js","names":["FocusableRef","BaseProps","CONTAINER_STYLES","ContainerStyleProps","Styles","tasty","forwardRef","useId","useRef","AriaDatePickerProps","DateValue","useDatePicker","useFocusRing","useLocale","useDatePickerState","useI18n","FieldBaseProps","mergeProps","extractStyles","useFieldProps","wrapWithField","Calendar","PeriodCalendar","Dialog","DialogTrigger","DateInputBase","DatePickerButton","formatPeriod","PickerType","snapToPeriod","useFocusManagerRef","PeriodValueElement","qa","styles","preset","width","whiteSpace","textOverflow","overflow","color","placeholder","disabled","CubePeriodPickerProps","Omit","T","picker","wrapperStyles","inputStyles","triggerStyles","size","shouldFlip","formatValue","date","locale","PeriodPicker","props","ref","$","_c","t","t0","Symbol","for","defaultValidationTrigger","t1","t2","isDisabled","isReadOnly","isInvalid","isValid","autoFocus","undefined","t3","t4","t5","t6","t7","week","month","quarter","year","defaultPlaceholder","targetRef","t8","granularity","shouldCloseOnSelect","state","isOpen","setOpen","domRef","t9","within","isTextInput","isFocused","isFocusedButton","focusProps","focusPropsButton","t10","groupProps","labelProps","buttonProps","dialogProps","calendarProps","t11","setValue","handleSelect","t12","value","displayText","valueId","t13","minValue","maxValue","isDateUnavailable","panel","t14","t15","display","t16","t17","cursor","t18","t19","t20","t21","t22","t23","t24","t25","t26","t27","component","t28","_PeriodPicker","displayName"],"sources":["../../../../src/components/fields/DatePicker/PeriodPicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, useId, useRef } from 'react';\nimport {\n  AriaDatePickerProps,\n  DateValue,\n  useDatePicker,\n  useFocusRing,\n  useLocale,\n} from 'react-aria';\nimport { useDatePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport { Calendar } from '../../other/Calendar/Calendar';\nimport { PeriodCalendar } from '../../other/Calendar/PeriodCalendar';\nimport { Dialog, DialogTrigger } from '../../overlays/Dialog';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { formatPeriod, PickerType, snapToPeriod } from './period';\nimport { useFocusManagerRef } from './utils';\n\nconst PeriodValueElement = tasty({\n  qa: 'PeriodPickerValue',\n  styles: {\n    preset: 't3',\n    width: 'max 100%',\n    whiteSpace: 'nowrap',\n    textOverflow: 'ellipsis',\n    overflow: 'hidden',\n    color: {\n      '': '#dark',\n      placeholder: '#dark.30',\n      disabled: '#dark.30',\n    },\n  },\n});\n\nexport interface CubePeriodPickerProps<T extends DateValue = DateValue>\n  extends Omit<\n      AriaDatePickerProps<T>,\n      'errorMessage' | 'granularity' | 'form' | 'name'\n    >,\n    BaseProps,\n    ContainerStyleProps,\n    FieldBaseProps<T | null | undefined> {\n  /** Which period the picker selects. Set by the concrete picker components. */\n  picker?: PickerType;\n  wrapperStyles?: Styles;\n  inputStyles?: Styles;\n  triggerStyles?: Styles;\n  styles?: Styles;\n  size?: 'small' | 'medium' | 'large' | (string & {});\n  shouldFlip?: boolean;\n  /** Placeholder shown when no value is selected. */\n  placeholder?: string;\n  /** Override how the selected value is rendered as text. */\n  formatValue?: (date: DateValue, picker: PickerType, locale: string) => string;\n}\n\nfunction PeriodPicker<T extends DateValue>(\n  props: CubePeriodPickerProps<T>,\n  ref: FocusableRef<HTMLElement>,\n) {\n  const { t } = useI18n();\n\n  props = useFieldProps(props, {\n    defaultValidationTrigger: 'onBlur',\n  });\n\n  let styles = extractStyles(props, CONTAINER_STYLES);\n\n  let {\n    qa,\n    size,\n    picker = 'month',\n    placeholder,\n    formatValue,\n    isDisabled,\n    isReadOnly,\n    isInvalid,\n    isValid,\n    autoFocus,\n  } = props;\n\n  let defaultPlaceholder: Record<PickerType, string> = {\n    week: t('datePicker.selectWeek', 'Select week'),\n    month: t('datePicker.selectMonth', 'Select month'),\n    quarter: t('datePicker.selectQuarter', 'Select quarter'),\n    year: t('datePicker.selectYear', 'Select year'),\n  };\n\n  let { locale } = useLocale();\n  let targetRef = useRef<HTMLDivElement>(null);\n  let state = useDatePickerState({\n    ...props,\n    granularity: 'day',\n    shouldCloseOnSelect: true,\n  });\n  let { isOpen, setOpen } = state;\n\n  let domRef = useFocusManagerRef(ref);\n\n  let { isFocused: isFocusedButton, focusProps: focusPropsButton } =\n    useFocusRing({\n      within: false,\n      isTextInput: false,\n      autoFocus,\n    });\n\n  let { groupProps, labelProps, buttonProps, dialogProps, calendarProps } =\n    useDatePicker({ ...props, granularity: 'day' }, state, targetRef);\n\n  let handleSelect = (date: DateValue) => {\n    state.setValue(snapToPeriod(date, picker, locale));\n    setOpen(false);\n  };\n\n  let displayText = state.value\n    ? (formatValue ?? formatPeriod)(state.value, picker, locale)\n    : placeholder ?? defaultPlaceholder[picker];\n\n  // The value is rendered as text rather than editable segments, so the trigger\n  // has to point at it to announce the current selection.\n  let valueId = useId();\n\n  const panel =\n    picker === 'week' ? (\n      <Calendar\n        {...calendarProps}\n        autoFocus\n        pickerMode=\"week\"\n        isDisabled={isDisabled}\n        onChange={handleSelect}\n      />\n    ) : (\n      <PeriodCalendar\n        autoFocus\n        picker={picker}\n        value={calendarProps.value}\n        minValue={calendarProps.minValue}\n        maxValue={calendarProps.maxValue}\n        isDateUnavailable={calendarProps.isDateUnavailable}\n        isDisabled={isDisabled}\n        onChange={handleSelect}\n      />\n    );\n\n  const component = (\n    <DateInputBase\n      ref={targetRef}\n      qa={qa || 'PeriodPicker'}\n      inputType=\"datepicker\"\n      styles={{ display: 'grid', ...styles, ...props.wrapperStyles }}\n      inputStyles={{\n        cursor: isDisabled || isReadOnly ? 'default' : 'pointer',\n        ...props.inputStyles,\n      }}\n      disableFocusRing={isFocusedButton}\n      isDisabled={isDisabled}\n      isInvalid={isInvalid}\n      isValid={isValid}\n      size={size}\n      fieldProps={groupProps}\n      suffix={\n        <DialogTrigger\n          hideArrow\n          type=\"popover\"\n          mobileType=\"tray\"\n          placement=\"bottom right\"\n          targetRef={targetRef}\n          isOpen={isOpen}\n          shouldFlip={props.shouldFlip}\n          onOpenChange={setOpen}\n        >\n          <DatePickerButton\n            size={size}\n            {...mergeProps(buttonProps, focusPropsButton)}\n            aria-describedby={valueId}\n            // Passed separately, not merged: only the field-disabled half is\n            // inherited. See `DatePickerButton`.\n            isDisabled={isDisabled}\n            isReadOnly={isReadOnly}\n            styles={props.triggerStyles}\n          />\n          <Dialog {...dialogProps} width=\"max-content\">\n            {panel}\n          </Dialog>\n        </DialogTrigger>\n      }\n    >\n      <PeriodValueElement\n        id={valueId}\n        mods={{ placeholder: !state.value, disabled: isDisabled }}\n        onClick={() => !isDisabled && !isReadOnly && setOpen(true)}\n      >\n        {displayText}\n      </PeriodValueElement>\n    </DateInputBase>\n  );\n\n  return wrapWithField(component, domRef, {\n    ...props,\n    labelProps: mergeProps(props.labelProps, labelProps),\n  });\n}\n\nconst _PeriodPicker = forwardRef(PeriodPicker);\n\n_PeriodPicker.displayName = 'PeriodPicker';\n\nexport { _PeriodPicker as PeriodPicker };\n"],"mappings":"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"}

package/dist/components/fields/DatePicker/QuarterPicker.js

@@ -1,15 +1,24 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { _PeriodPicker } from "./PeriodPicker.js";
+import { c } from "react-compiler-runtime";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/fields/DatePicker/QuarterPicker.tsx
 function QuarterPicker(props, ref) {
-	return /* @__PURE__ */ jsx(_PeriodPicker, {
-		ref,
-		picker: "quarter",
-		...props
-	});
+	const $ = c(3);
+	let t0;
+	if ($[0] !== props || $[1] !== ref) {
+		t0 = /* @__PURE__ */ jsx(_PeriodPicker, {
+			ref,
+			picker: "quarter",
+			...props
+		});
+		$[0] = props;
+		$[1] = ref;
+		$[2] = t0;
+	} else t0 = $[2];
+	return t0;
 }
 const _QuarterPicker = forwardRef(QuarterPicker);
 _QuarterPicker.displayName = "QuarterPicker";