@cube-dev/ui-kit 0.0.0-canary-a9d94d7 → 0.0.0-canary-a1aba4f

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

@@ -1,6 +1,7 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | 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";
 import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";
 import { wrapWithField } from "../../form/wrapper.js";
 import { Dialog } from "../../overlays/Dialog/Dialog.js";
@@ -12,31 +13,38 @@ import { _Calendar } from "../../other/Calendar/Calendar.js";
 import { DatePickerButton } from "./DatePickerButton.js";
 import { PeriodCalendar } from "../../other/Calendar/PeriodCalendar.js";
 import { CONTAINER_STYLES, tasty } from "@tenphi/tasty";
-import { forwardRef, useRef } from "react";
+import { forwardRef, useId, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useDatePicker, useFocusRing, useLocale } from "react-aria";
 import { useDatePickerState } from "react-stately";
 
 //#region src/components/fields/DatePicker/PeriodPicker.tsx
-const DEFAULT_PLACEHOLDER = {
-	week: "Select week",
-	month: "Select month",
-	quarter: "Select quarter",
-	year: "Select year"
-};
-const PeriodValueElement = tasty({ styles: {
-	preset: "t3",
-	width: "max 100%",
-	whiteSpace: "nowrap",
-	color: {
-		"": "#dark",
-		placeholder: "#dark.30"
+const PeriodValueElement = tasty({
+	qa: "PeriodPickerValue",
+	styles: {
+		preset: "t3",
+		width: "max 100%",
+		whiteSpace: "nowrap",
+		textOverflow: "ellipsis",
+		overflow: "hidden",
+		color: {
+			"": "#dark",
+			placeholder: "#dark.30",
+			disabled: "#dark.30"
+		}
 	}
-} });
+});
 function PeriodPicker(props, ref) {
+	const { t } = useI18n();
 	props = useFieldProps(props, { defaultValidationTrigger: "onBlur" });
 	let styles = extractStyles(props, CONTAINER_STYLES);
-	let { qa, size, picker = "month", placeholder, formatValue, isDisabled, isInvalid, isValid, autoFocus } = props;
+	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({
@@ -59,7 +67,8 @@ function PeriodPicker(props, ref) {
 		state.setValue(snapToPeriod(date, picker, locale));
 		setOpen(false);
 	};
-	let displayText = state.value ? (formatValue ?? formatPeriod)(state.value, picker, locale) : placeholder ?? DEFAULT_PLACEHOLDER[picker];
+	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,
@@ -85,7 +94,10 @@ function PeriodPicker(props, ref) {
 			...styles,
 			...props.wrapperStyles
 		},
-		inputStyles: props.inputStyles,
+		inputStyles: {
+			cursor: isDisabled || isReadOnly ? "default" : "pointer",
+			...props.inputStyles
+		},
 		disableFocusRing: isFocusedButton,
 		isDisabled,
 		isInvalid,
@@ -104,7 +116,8 @@ function PeriodPicker(props, ref) {
 			children: [/* @__PURE__ */ jsx(DatePickerButton, {
 				size,
 				...mergeProps$1(buttonProps, focusPropsButton),
-				isDisabled,
+				"aria-describedby": valueId,
+				isDisabled: isDisabled || isReadOnly,
 				styles: props.triggerStyles
 			}), /* @__PURE__ */ jsx(Dialog, {
 				...dialogProps,
@@ -113,9 +126,12 @@ function PeriodPicker(props, ref) {
 			})]
 		}),
 		children: /* @__PURE__ */ jsx(PeriodValueElement, {
-			...labelProps,
-			mods: { placeholder: !state.value },
-			onClick: () => !isDisabled && setOpen(true),
+			id: valueId,
+			mods: {
+				placeholder: !state.value,
+				disabled: isDisabled
+			},
+			onClick: () => !isDisabled && !isReadOnly && setOpen(true),
 			children: displayText
 		})
 	}), domRef, {

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, 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 { 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 DEFAULT_PLACEHOLDER: Record<PickerType, string> = {\n  week: 'Select week',\n  month: 'Select month',\n  quarter: 'Select quarter',\n  year: 'Select year',\n};\n\nconst PeriodValueElement = tasty({\n  styles: {\n    preset: 't3',\n    width: 'max 100%',\n    whiteSpace: 'nowrap',\n    color: {\n      '': '#dark',\n      placeholder: '#dark.30',\n    },\n  },\n});\n\nexport interface CubePeriodPickerProps<T extends DateValue = DateValue>\n  extends Omit<AriaDatePickerProps<T>, 'errorMessage' | 'granularity'>,\n    BaseProps,\n    ContainerStyleProps,\n    FieldBaseProps {\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) => string;\n}\n\nfunction PeriodPicker<T extends DateValue>(\n  props: CubePeriodPickerProps<T>,\n  ref: FocusableRef<HTMLElement>,\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    isInvalid,\n    isValid,\n    autoFocus,\n  } = props;\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 ?? DEFAULT_PLACEHOLDER[picker];\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={props.inputStyles}\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            isDisabled={isDisabled}\n            styles={props.triggerStyles}\n          />\n          <Dialog {...dialogProps} width=\"max-content\">\n            {panel}\n          </Dialog>\n        </DialogTrigger>\n      }\n    >\n      <PeriodValueElement\n        {...labelProps}\n        mods={{ placeholder: !state.value }}\n        onClick={() => !isDisabled && 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":";;;;;;;;;;;;;;;;;;;;AA+BA,MAAM,sBAAkD;CACtD,MAAM;CACN,OAAO;CACP,SAAS;CACT,MAAM;CACP;AAED,MAAM,qBAAqB,MAAM,EAC/B,QAAQ;CACN,QAAQ;CACR,OAAO;CACP,YAAY;CACZ,OAAO;EACL,IAAI;EACJ,aAAa;EACd;CACF,EACF,CAAC;AAqBF,SAAS,aACP,OACA,KACA;AACA,SAAQ,cAAc,OAAO,EAC3B,0BAA0B,UAC3B,CAAC;CAEF,IAAI,SAAS,cAAc,OAAO,iBAAiB;CAEnD,IAAI,EACF,IACA,MACA,SAAS,SACT,aACA,aACA,YACA,WACA,SACA,cACE;CAEJ,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,oBAAoB;CAEvC,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;AAiDN,QAAO,cA7CL,oBAACC;EACC,KAAK;EACL,IAAI,MAAM;EACV,WAAU;EACV,QAAQ;GAAE,SAAS;GAAQ,GAAG;GAAQ,GAAG,MAAM;GAAe;EAC9D,aAAa,MAAM;EACnB,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;IACjC;IACZ,QAAQ,MAAM;KACd,EACF,oBAAC;IAAO,GAAI;IAAa,OAAM;cAC5B;KACM;IACK;YAGlB,oBAAC;GACC,GAAI;GACJ,MAAM,EAAE,aAAa,CAAC,MAAM,OAAO;GACnC,eAAe,CAAC,cAAc,QAAQ,KAAK;aAE1C;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":["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<AriaDatePickerProps<T>, 'errorMessage' | 'granularity'>,\n    BaseProps,\n    ContainerStyleProps,\n    FieldBaseProps {\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            isDisabled={isDisabled || 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;AAqBF,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;AAqDN,QAAO,cAjDL,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;IAClB,YAAY,cAAc;IAC1B,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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { _PeriodPicker } from "./PeriodPicker.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { _PeriodPicker } from "./PeriodPicker.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { _PeriodPicker } from "./PeriodPicker.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { parseAbsolute } from "@internationalized/date";
 
 //#region src/components/fields/DatePicker/parseDate.ts

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { CalendarDate, startOfMonth, startOfWeek, startOfYear, toCalendarDate } from "@internationalized/date";
 
 //#region src/components/fields/DatePicker/period.ts

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 //#region src/components/fields/DatePicker/props.ts
 const DEFAULT_DATE_PROPS = {
 	granularity: "day",

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { useImperativeHandle, useRef } from "react";
 import { createDOMRef } from "@react-spectrum/utils";
 import { createFocusManager } from "@react-aria/focus";

package/dist/components/fields/FileInput/FileInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { useI18n } from "../../../i18n/useI18n.js";

package/dist/components/fields/FilterListBox/FilterListBox.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/fields/FilterPicker/FilterPicker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { _Text } from "../../content/Text.js";

package/dist/components/fields/Input/Input.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { TextInput } from "../TextInput/TextInput.js";
 import { _FileInput } from "../FileInput/FileInput.js";
 import { _NumberInput } from "../NumberInput/NumberInput.js";

package/dist/components/fields/ListBox/DraggableListBox.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { DraggableCollection } from "../../shared/DraggableCollection.js";
 import { jsx } from "react/jsx-runtime";
 

package/dist/components/fields/ListBox/ListBox.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/fields/ListBoxPopover/ListBoxPopover.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";
 import { Portal } from "../../portal/Portal.js";

package/dist/components/fields/ListBoxPopover/index.d.ts

@@ -1,4 +1,3 @@
 
 import "./ListBoxPopover.js";
-import "./useCompositeFocus.js";
 import { ListStateLike, TextFilterFn } from "./listNavigation.js";

package/dist/components/fields/ListBoxPopover/listNavigation.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 //#region src/components/fields/ListBoxPopover/listNavigation.ts
 /**
 * Walks a collection (possibly nested under sections) and collects the keys of

package/dist/components/fields/ListBoxPopover/useCompositeFocus.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { useCallback, useEffect, useRef } from "react";
 
 //#region src/components/fields/ListBoxPopover/useCompositeFocus.ts

package/dist/components/fields/NumberInput/NumberInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";
 import { castNullableNumberValue } from "../../../utils/react/nullableValue.js";

package/dist/components/fields/NumberInput/StepButton.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { useI18n } from "../../../i18n/useI18n.js";
 import { DirectionIcon } from "../../../icons/DirectionIcon.js";
 import { Button } from "../../actions/index.js";

package/dist/components/fields/PasswordInput/PasswordInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useBufferedValue } from "../../../utils/react/useBufferedValue.js";

package/dist/components/fields/Picker/Picker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { _Text } from "../../content/Text.js";

package/dist/components/fields/RadioGroup/Radio.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFocus as useFocus$1 } from "../../../utils/react/interactions.js";

package/dist/components/fields/RadioGroup/RadioGroup.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { FormContext } from "../../form/Form/Form.js";
@@ -29,7 +29,6 @@ const RadioGroupElement = tasty({
 			"": "0",
 			tabs: ".5x"
 		},
-		boxSizing: "border-box",
 		radius: true,
 		fill: {
 			"": "#clear",

package/dist/components/fields/RadioGroup/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","names":["mergeProps"],"sources":["../../../../src/components/fields/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { useObjectRef } from '@react-aria/utils';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef } from 'react';\nimport { AriaRadioGroupProps, useFocusRing, useRadioGroup } from 'react-aria';\nimport { useRadioGroupState } from 'react-stately';\n\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport {\n  castNullableStringValue,\n  WithNullableValue,\n} from '../../../utils/react/nullableValue';\nimport { extractStyles } from '../../../utils/styles';\nimport { CubeItemProps } from '../../content/Item/Item';\nimport { FormContext, useFieldProps, wrapWithField } from '../../form';\n\nimport { RadioContext } from './context';\n\nexport interface CubeRadioGroupProps\n  extends BaseProps,\n    Omit<AriaRadioGroupProps, 'errorMessage'>,\n    ContainerStyleProps,\n    FieldBaseProps {\n  groupStyles?: Styles;\n  orientation?: 'horizontal' | 'vertical';\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n  /* Size for all radio buttons in the group */\n  size?: Omit<CubeItemProps['size'], 'inline'>;\n  /* Button type for all button-style radios (ignored in tabs mode). When set to 'primary', selected buttons use 'primary' and non-selected use 'outline' with isSelected appearance */\n  buttonType?: CubeItemProps['type'];\n  /* Visual type for all radios in the group: radio (default), button, or tabs */\n  type?: 'radio' | 'button' | 'tabs';\n}\n\nconst RadioGroupElement = tasty({\n  qa: 'RadioGroup',\n  styles: {\n    display: 'flex',\n    placeItems: 'stretch',\n    placeContent: 'stretch',\n    flow: {\n      '': 'column',\n      horizontal: 'row wrap',\n      'horizontal & tabs': 'row',\n    },\n    padding: {\n      '': '0',\n      tabs: '.5x',\n    },\n    // The tabs layout is the only one with padding, and a caller that gives the\n    // group an explicit width (`width: 100%` inside a popover, say) means the\n    // box it can see. Without this the padding is added on top and the group\n    // overhangs its container by `1x`.\n    boxSizing: 'border-box',\n    radius: true,\n    fill: {\n      '': '#clear',\n      'tabs | disabled': '#surface-4',\n    },\n    width: 'max-content max-content initial',\n    flexShrink: 0,\n    gap: {\n      '': '1x',\n      button: 0,\n      tabs: '.5x',\n    },\n    whiteSpace: 'nowrap',\n    // Keyboard focus ring on the group, shown only for button/tabs layouts\n    // where individual items are visually merged (button-group) or share a\n    // single chrome (tabs) — the classic vertical radio list already shows\n    // a per-item focus ring on the radio circle.\n    outline: {\n      '': '1bw #primary-text.0 / 1bw',\n      'focused & (button | tabs)': '1bw #primary-text / 1bw',\n    },\n  },\n});\n\nfunction RadioGroup(props: WithNullableValue<CubeRadioGroupProps>, ref) {\n  let orientation = props.orientation;\n\n  props = castNullableStringValue(props);\n  props = useFieldProps(props, { defaultValidationTrigger: 'onChange' });\n\n  let {\n    qa,\n    id,\n    isDisabled,\n    isRequired,\n    labelPosition = 'top',\n    isInvalid,\n    isValid,\n    children,\n    styles,\n    groupStyles,\n    insideForm,\n    // orientation, // ignore orientation since it came from the form context\n    labelProps: baseLabelProps,\n    size,\n    buttonType,\n    type,\n    form,\n    ...otherProps\n  } = props;\n  let domRef = useObjectRef(ref);\n\n  styles = extractStyles(otherProps, CONTAINER_STYLES, styles);\n\n  let state = useRadioGroupState(props);\n\n  // Set default orientation based on type\n  if (orientation == null) {\n    orientation =\n      type === 'button' || type === 'tabs' ? 'horizontal' : 'vertical';\n  }\n\n  let { radioGroupProps: fieldProps, labelProps } = useRadioGroup(\n    { ...props, orientation },\n    state,\n  );\n\n  // Keyboard-only focus ring on the group container (button/tabs layouts).\n  // `within: true` tracks focus on any descendant radio. We read\n  // `isFocusVisible` (not `isFocused`), which is keyboard-gated — mouse\n  // clicks on a radio focus the input but leave `isFocusVisible` false.\n  let { isFocusVisible: isFocusWithinVisible, focusProps: groupFocusProps } =\n    useFocusRing({ within: true });\n\n  let radioGroup = (\n    <RadioGroupElement\n      id={id}\n      qa={qa || 'RadioGroup'}\n      styles={styles}\n      data-input-type=\"radiogroup\"\n      data-radio-button-group={type === 'button' ? '' : undefined}\n      mods={{\n        horizontal: orientation === 'horizontal',\n        'inside-form': insideForm,\n        'side-label': labelPosition === 'side',\n        button: type === 'button',\n        tabs: type === 'tabs',\n        focused: isFocusWithinVisible,\n      }}\n      {...groupFocusProps}\n    >\n      <FormContext.Provider\n        value={{\n          isRequired,\n          isInvalid,\n          isValid,\n          isDisabled,\n        }}\n      >\n        <RadioContext.Provider\n          value={{\n            state,\n            name: props.name,\n            size,\n            buttonType,\n            type,\n            isDisabled,\n          }}\n        >\n          {children}\n        </RadioContext.Provider>\n      </FormContext.Provider>\n    </RadioGroupElement>\n  );\n\n  return wrapWithField(radioGroup, domRef, {\n    ...props,\n    fieldProps,\n    labelProps: mergeProps(baseLabelProps, labelProps),\n  });\n}\n\n/**\n * Radio groups allow users to select a single option from a list of mutually exclusive options.\n * All possible options are exposed up front for users to compare.\n */\nconst _RadioGroup = forwardRef(RadioGroup);\n\n(_RadioGroup as any).cubeInputType = 'RadioGroup';\n_RadioGroup.displayName = 'RadioGroup';\n\nexport { _RadioGroup as RadioGroup };\n"],"mappings":";;;;;;;;;;;;;;;;AA0CA,MAAM,oBAAoB,MAAM;CAC9B,IAAI;CACJ,QAAQ;EACN,SAAS;EACT,YAAY;EACZ,cAAc;EACd,MAAM;GACJ,IAAI;GACJ,YAAY;GACZ,qBAAqB;GACtB;EACD,SAAS;GACP,IAAI;GACJ,MAAM;GACP;EAKD,WAAW;EACX,QAAQ;EACR,MAAM;GACJ,IAAI;GACJ,mBAAmB;GACpB;EACD,OAAO;EACP,YAAY;EACZ,KAAK;GACH,IAAI;GACJ,QAAQ;GACR,MAAM;GACP;EACD,YAAY;EAKZ,SAAS;GACP,IAAI;GACJ,6BAA6B;GAC9B;EACF;CACF,CAAC;AAEF,SAAS,WAAW,OAA+C,KAAK;CACtE,IAAI,cAAc,MAAM;AAExB,SAAQ,wBAAwB,MAAM;AACtC,SAAQ,cAAc,OAAO,EAAE,0BAA0B,YAAY,CAAC;CAEtE,IAAI,EACF,IACA,IACA,YACA,YACA,gBAAgB,OAChB,WACA,SACA,UACA,QACA,aACA,YAEA,YAAY,gBACZ,MACA,YACA,MACA,MACA,GAAG,eACD;CACJ,IAAI,SAAS,aAAa,IAAI;AAE9B,UAAS,cAAc,YAAY,kBAAkB,OAAO;CAE5D,IAAI,QAAQ,mBAAmB,MAAM;AAGrC,KAAI,eAAe,KACjB,eACE,SAAS,YAAY,SAAS,SAAS,eAAe;CAG1D,IAAI,EAAE,iBAAiB,YAAY,eAAe,cAChD;EAAE,GAAG;EAAO;EAAa,EACzB,MACD;CAMD,IAAI,EAAE,gBAAgB,sBAAsB,YAAY,oBACtD,aAAa,EAAE,QAAQ,MAAM,CAAC;AA2ChC,QAAO,cAxCL,oBAAC;EACK;EACJ,IAAI,MAAM;EACF;EACR,mBAAgB;EAChB,2BAAyB,SAAS,WAAW,KAAK;EAClD,MAAM;GACJ,YAAY,gBAAgB;GAC5B,eAAe;GACf,cAAc,kBAAkB;GAChC,QAAQ,SAAS;GACjB,MAAM,SAAS;GACf,SAAS;GACV;EACD,GAAI;YAEJ,oBAAC,YAAY;GACX,OAAO;IACL;IACA;IACA;IACA;IACD;aAED,oBAAC,aAAa;IACZ,OAAO;KACL;KACA,MAAM,MAAM;KACZ;KACA;KACA;KACA;KACD;IAEA;KACqB;IACH;GACL,EAGW,QAAQ;EACvC,GAAG;EACH;EACA,YAAYA,aAAW,gBAAgB,WAAW;EACnD,CAAC;;;;;;AAOJ,MAAM,cAAc,WAAW,WAAW;AAE1C,AAAC,YAAoB,gBAAgB;AACrC,YAAY,cAAc"}
+{"version":3,"file":"RadioGroup.js","names":["mergeProps"],"sources":["../../../../src/components/fields/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { useObjectRef } from '@react-aria/utils';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef } from 'react';\nimport { AriaRadioGroupProps, useFocusRing, useRadioGroup } from 'react-aria';\nimport { useRadioGroupState } from 'react-stately';\n\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport {\n  castNullableStringValue,\n  WithNullableValue,\n} from '../../../utils/react/nullableValue';\nimport { extractStyles } from '../../../utils/styles';\nimport { CubeItemProps } from '../../content/Item/Item';\nimport { FormContext, useFieldProps, wrapWithField } from '../../form';\n\nimport { RadioContext } from './context';\n\nexport interface CubeRadioGroupProps\n  extends BaseProps,\n    Omit<AriaRadioGroupProps, 'errorMessage'>,\n    ContainerStyleProps,\n    FieldBaseProps {\n  groupStyles?: Styles;\n  orientation?: 'horizontal' | 'vertical';\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n  /* Size for all radio buttons in the group */\n  size?: Omit<CubeItemProps['size'], 'inline'>;\n  /* Button type for all button-style radios (ignored in tabs mode). When set to 'primary', selected buttons use 'primary' and non-selected use 'outline' with isSelected appearance */\n  buttonType?: CubeItemProps['type'];\n  /* Visual type for all radios in the group: radio (default), button, or tabs */\n  type?: 'radio' | 'button' | 'tabs';\n}\n\nconst RadioGroupElement = tasty({\n  qa: 'RadioGroup',\n  styles: {\n    display: 'flex',\n    placeItems: 'stretch',\n    placeContent: 'stretch',\n    flow: {\n      '': 'column',\n      horizontal: 'row wrap',\n      'horizontal & tabs': 'row',\n    },\n    padding: {\n      '': '0',\n      tabs: '.5x',\n    },\n    radius: true,\n    fill: {\n      '': '#clear',\n      'tabs | disabled': '#surface-4',\n    },\n    width: 'max-content max-content initial',\n    flexShrink: 0,\n    gap: {\n      '': '1x',\n      button: 0,\n      tabs: '.5x',\n    },\n    whiteSpace: 'nowrap',\n    // Keyboard focus ring on the group, shown only for button/tabs layouts\n    // where individual items are visually merged (button-group) or share a\n    // single chrome (tabs) — the classic vertical radio list already shows\n    // a per-item focus ring on the radio circle.\n    outline: {\n      '': '1bw #primary-text.0 / 1bw',\n      'focused & (button | tabs)': '1bw #primary-text / 1bw',\n    },\n  },\n});\n\nfunction RadioGroup(props: WithNullableValue<CubeRadioGroupProps>, ref) {\n  let orientation = props.orientation;\n\n  props = castNullableStringValue(props);\n  props = useFieldProps(props, { defaultValidationTrigger: 'onChange' });\n\n  let {\n    qa,\n    id,\n    isDisabled,\n    isRequired,\n    labelPosition = 'top',\n    isInvalid,\n    isValid,\n    children,\n    styles,\n    groupStyles,\n    insideForm,\n    // orientation, // ignore orientation since it came from the form context\n    labelProps: baseLabelProps,\n    size,\n    buttonType,\n    type,\n    form,\n    ...otherProps\n  } = props;\n  let domRef = useObjectRef(ref);\n\n  styles = extractStyles(otherProps, CONTAINER_STYLES, styles);\n\n  let state = useRadioGroupState(props);\n\n  // Set default orientation based on type\n  if (orientation == null) {\n    orientation =\n      type === 'button' || type === 'tabs' ? 'horizontal' : 'vertical';\n  }\n\n  let { radioGroupProps: fieldProps, labelProps } = useRadioGroup(\n    { ...props, orientation },\n    state,\n  );\n\n  // Keyboard-only focus ring on the group container (button/tabs layouts).\n  // `within: true` tracks focus on any descendant radio. We read\n  // `isFocusVisible` (not `isFocused`), which is keyboard-gated — mouse\n  // clicks on a radio focus the input but leave `isFocusVisible` false.\n  let { isFocusVisible: isFocusWithinVisible, focusProps: groupFocusProps } =\n    useFocusRing({ within: true });\n\n  let radioGroup = (\n    <RadioGroupElement\n      id={id}\n      qa={qa || 'RadioGroup'}\n      styles={styles}\n      data-input-type=\"radiogroup\"\n      data-radio-button-group={type === 'button' ? '' : undefined}\n      mods={{\n        horizontal: orientation === 'horizontal',\n        'inside-form': insideForm,\n        'side-label': labelPosition === 'side',\n        button: type === 'button',\n        tabs: type === 'tabs',\n        focused: isFocusWithinVisible,\n      }}\n      {...groupFocusProps}\n    >\n      <FormContext.Provider\n        value={{\n          isRequired,\n          isInvalid,\n          isValid,\n          isDisabled,\n        }}\n      >\n        <RadioContext.Provider\n          value={{\n            state,\n            name: props.name,\n            size,\n            buttonType,\n            type,\n            isDisabled,\n          }}\n        >\n          {children}\n        </RadioContext.Provider>\n      </FormContext.Provider>\n    </RadioGroupElement>\n  );\n\n  return wrapWithField(radioGroup, domRef, {\n    ...props,\n    fieldProps,\n    labelProps: mergeProps(baseLabelProps, labelProps),\n  });\n}\n\n/**\n * Radio groups allow users to select a single option from a list of mutually exclusive options.\n * All possible options are exposed up front for users to compare.\n */\nconst _RadioGroup = forwardRef(RadioGroup);\n\n(_RadioGroup as any).cubeInputType = 'RadioGroup';\n_RadioGroup.displayName = 'RadioGroup';\n\nexport { _RadioGroup as RadioGroup };\n"],"mappings":";;;;;;;;;;;;;;;;AA0CA,MAAM,oBAAoB,MAAM;CAC9B,IAAI;CACJ,QAAQ;EACN,SAAS;EACT,YAAY;EACZ,cAAc;EACd,MAAM;GACJ,IAAI;GACJ,YAAY;GACZ,qBAAqB;GACtB;EACD,SAAS;GACP,IAAI;GACJ,MAAM;GACP;EACD,QAAQ;EACR,MAAM;GACJ,IAAI;GACJ,mBAAmB;GACpB;EACD,OAAO;EACP,YAAY;EACZ,KAAK;GACH,IAAI;GACJ,QAAQ;GACR,MAAM;GACP;EACD,YAAY;EAKZ,SAAS;GACP,IAAI;GACJ,6BAA6B;GAC9B;EACF;CACF,CAAC;AAEF,SAAS,WAAW,OAA+C,KAAK;CACtE,IAAI,cAAc,MAAM;AAExB,SAAQ,wBAAwB,MAAM;AACtC,SAAQ,cAAc,OAAO,EAAE,0BAA0B,YAAY,CAAC;CAEtE,IAAI,EACF,IACA,IACA,YACA,YACA,gBAAgB,OAChB,WACA,SACA,UACA,QACA,aACA,YAEA,YAAY,gBACZ,MACA,YACA,MACA,MACA,GAAG,eACD;CACJ,IAAI,SAAS,aAAa,IAAI;AAE9B,UAAS,cAAc,YAAY,kBAAkB,OAAO;CAE5D,IAAI,QAAQ,mBAAmB,MAAM;AAGrC,KAAI,eAAe,KACjB,eACE,SAAS,YAAY,SAAS,SAAS,eAAe;CAG1D,IAAI,EAAE,iBAAiB,YAAY,eAAe,cAChD;EAAE,GAAG;EAAO;EAAa,EACzB,MACD;CAMD,IAAI,EAAE,gBAAgB,sBAAsB,YAAY,oBACtD,aAAa,EAAE,QAAQ,MAAM,CAAC;AA2ChC,QAAO,cAxCL,oBAAC;EACK;EACJ,IAAI,MAAM;EACF;EACR,mBAAgB;EAChB,2BAAyB,SAAS,WAAW,KAAK;EAClD,MAAM;GACJ,YAAY,gBAAgB;GAC5B,eAAe;GACf,cAAc,kBAAkB;GAChC,QAAQ,SAAS;GACjB,MAAM,SAAS;GACf,SAAS;GACV;EACD,GAAI;YAEJ,oBAAC,YAAY;GACX,OAAO;IACL;IACA;IACA;IACA;IACD;aAED,oBAAC,aAAa;IACZ,OAAO;KACL;KACA,MAAM,MAAM;KACZ;KACA;KACA;KACA;KACD;IAEA;KACqB;IACH;GACL,EAGW,QAAQ;EACvC,GAAG;EACH;EACA,YAAYA,aAAW,gBAAgB,WAAW;EACnD,CAAC;;;;;;AAOJ,MAAM,cAAc,WAAW,WAAW;AAE1C,AAAC,YAAoB,gBAAgB;AACrC,YAAY,cAAc"}

package/dist/components/fields/RadioGroup/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { createContext, useContext } from "react";
 
 //#region src/components/fields/RadioGroup/context.ts

package/dist/components/fields/SearchComboBox/SearchComboBox.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";

package/dist/components/fields/SearchInput/SearchInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useBufferedValue } from "../../../utils/react/useBufferedValue.js";

package/dist/components/fields/Select/Select.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { forwardRefWithGenerics } from "../../../utils/react/forwardRefWithGenerics.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";

package/dist/components/fields/Slider/Gradation.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { SliderGradationElement, SliderGradeElement } from "./elements.js";
 import { jsx } from "react/jsx-runtime";
 

package/dist/components/fields/Slider/HueSlider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { __Slider } from "./Slider.js";
 import { forwardRef, useCallback, useMemo, useState } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -16,18 +16,6 @@ const HUE_STOPS = [
 const HUE_SATURATION = 80;
 const HUE_LIGHTNESS = 50;
 const HUE_GRADIENT = HUE_STOPS.map((h) => `okhsl(${h} ${HUE_SATURATION}% ${HUE_LIGHTNESS}%)`).join(", ");
-/**
-* A hue is an angle, so the value label says so.
-*
-* `unitDisplay: 'narrow'` is what turns `23 deg` into `23°`. Left to the plain
-* number, a caller who wanted the unit had to put it in the label — which then
-* repeated the value the slider already prints beside it.
-*/
-const HUE_FORMAT_OPTIONS = {
-	style: "unit",
-	unit: "degree",
-	unitDisplay: "narrow"
-};
 const horizontalTrackStyles = {
 	image: `linear-gradient(to right, ${HUE_GRADIENT})`,
 	Fill: false
@@ -37,7 +25,7 @@ const verticalTrackStyles = {
 	Fill: false
 };
 function HueSlider(props, ref) {
-	const { value, defaultValue = 0, onChange, orientation = "horizontal", formatOptions = HUE_FORMAT_OPTIONS, thumbTokens: userThumbTokens, thumbStyles: userThumbStyles, trackStyles: userTrackStyles, ...rest } = props;
+	const { value, defaultValue = 0, onChange, orientation = "horizontal", thumbTokens: userThumbTokens, thumbStyles: userThumbStyles, trackStyles: userTrackStyles, ...rest } = props;
 	const [internalValue, setInternalValue] = useState(defaultValue);
 	const currentHue = value ?? internalValue;
 	const handleChange = useCallback((newValue) => {
@@ -57,7 +45,6 @@ function HueSlider(props, ref) {
 		minValue: 0,
 		maxValue: 359,
 		step: 1,
-		formatOptions,
 		thumbStyles: useMemo(() => ({
 			outline: {
 				"": "1bw #slider-thumb-hovered.0",

package/dist/components/fields/Slider/HueSlider.js.map

@@ -1 +1 @@
-{"version":3,"file":"HueSlider.js","names":["Slider"],"sources":["../../../../src/components/fields/Slider/HueSlider.tsx"],"sourcesContent":["import { Styles, Tokens } from '@tenphi/tasty';\nimport { forwardRef, useCallback, useMemo, useState } from 'react';\n\nimport { CubeSliderProps, Slider } from './Slider';\n\nimport type { FocusableRef } from '@react-types/shared';\n\n// Generate 7 hue stops (0, 60, 120, 180, 240, 300, 359) for full color spectrum\nconst HUE_STOPS = [0, 60, 120, 180, 240, 300, 359];\nconst HUE_SATURATION = 80;\nconst HUE_LIGHTNESS = 50;\n\nconst HUE_GRADIENT = HUE_STOPS.map(\n  (h) => `okhsl(${h} ${HUE_SATURATION}% ${HUE_LIGHTNESS}%)`,\n).join(', ');\n\n/**\n * A hue is an angle, so the value label says so.\n *\n * `unitDisplay: 'narrow'` is what turns `23 deg` into `23°`. Left to the plain\n * number, a caller who wanted the unit had to put it in the label — which then\n * repeated the value the slider already prints beside it.\n */\nconst HUE_FORMAT_OPTIONS: Intl.NumberFormatOptions = {\n  style: 'unit',\n  unit: 'degree',\n  unitDisplay: 'narrow',\n};\n\nconst horizontalTrackStyles: Styles = {\n  image: `linear-gradient(to right, ${HUE_GRADIENT})`,\n  Fill: false,\n};\n\nconst verticalTrackStyles: Styles = {\n  image: `linear-gradient(to top, ${HUE_GRADIENT})`,\n  Fill: false,\n};\n\nexport interface CubeHueSliderProps\n  extends Omit<CubeSliderProps, 'minValue' | 'maxValue' | 'step'> {\n  /** The current hue value (0-359) */\n  value?: number;\n  /** The default hue value (0-359) */\n  defaultValue?: number;\n}\n\nfunction HueSlider(\n  props: CubeHueSliderProps,\n  ref: FocusableRef<HTMLDivElement>,\n) {\n  const {\n    value,\n    defaultValue = 0,\n    onChange,\n    orientation = 'horizontal',\n    formatOptions = HUE_FORMAT_OPTIONS,\n    thumbTokens: userThumbTokens,\n    thumbStyles: userThumbStyles,\n    trackStyles: userTrackStyles,\n    ...rest\n  } = props;\n\n  // Track internal value for uncontrolled mode\n  const [internalValue, setInternalValue] = useState(defaultValue);\n\n  // Use controlled value if provided, otherwise use internal state\n  const currentHue = value ?? internalValue;\n\n  // Handle onChange to update internal state in uncontrolled mode\n  const handleChange = useCallback(\n    (newValue: number) => {\n      if (value === undefined) {\n        setInternalValue(newValue);\n      }\n      onChange?.(newValue);\n    },\n    [value, onChange],\n  );\n\n  // Create dynamic thumb tokens with the current hue color\n  const thumbTokens: Tokens = useMemo(\n    () => ({\n      '#slider-thumb': `okhsl(${currentHue} ${HUE_SATURATION}% ${HUE_LIGHTNESS}%)`,\n      '#slider-thumb-hovered': `okhsl(${currentHue} ${HUE_SATURATION}% ${HUE_LIGHTNESS - 10}%)`,\n      ...userThumbTokens,\n    }),\n    [currentHue, userThumbTokens],\n  );\n  const thumbStyles: Styles = useMemo(\n    () => ({\n      outline: {\n        '': '1bw #slider-thumb-hovered.0',\n        focused: '1bw #slider-thumb-hovered',\n      },\n      ...userThumbStyles,\n    }),\n    [userThumbStyles],\n  );\n\n  const trackStyles: Styles = useMemo(\n    () => ({\n      ...(orientation === 'vertical'\n        ? verticalTrackStyles\n        : horizontalTrackStyles),\n      ...userTrackStyles,\n    }),\n    [orientation, userTrackStyles],\n  );\n\n  return (\n    <Slider\n      ref={ref}\n      value={value}\n      defaultValue={defaultValue}\n      orientation={orientation}\n      minValue={0}\n      maxValue={359}\n      step={1}\n      formatOptions={formatOptions}\n      thumbStyles={thumbStyles}\n      trackStyles={trackStyles}\n      thumbTokens={thumbTokens}\n      onChange={handleChange}\n      {...rest}\n    />\n  );\n}\n\nconst _HueSlider = forwardRef(HueSlider);\n\nconst __HueSlider = Object.assign(_HueSlider as typeof _HueSlider, {\n  cubeInputType: 'Number',\n  displayName: 'HueSlider',\n});\n\nexport { __HueSlider as HueSlider };\n"],"mappings":";;;;;;AAQA,MAAM,YAAY;CAAC;CAAG;CAAI;CAAK;CAAK;CAAK;CAAK;CAAI;AAClD,MAAM,iBAAiB;AACvB,MAAM,gBAAgB;AAEtB,MAAM,eAAe,UAAU,KAC5B,MAAM,SAAS,EAAE,GAAG,eAAe,IAAI,cAAc,IACvD,CAAC,KAAK,KAAK;;;;;;;;AASZ,MAAM,qBAA+C;CACnD,OAAO;CACP,MAAM;CACN,aAAa;CACd;AAED,MAAM,wBAAgC;CACpC,OAAO,6BAA6B,aAAa;CACjD,MAAM;CACP;AAED,MAAM,sBAA8B;CAClC,OAAO,2BAA2B,aAAa;CAC/C,MAAM;CACP;AAUD,SAAS,UACP,OACA,KACA;CACA,MAAM,EACJ,OACA,eAAe,GACf,UACA,cAAc,cACd,gBAAgB,oBAChB,aAAa,iBACb,aAAa,iBACb,aAAa,iBACb,GAAG,SACD;CAGJ,MAAM,CAAC,eAAe,oBAAoB,SAAS,aAAa;CAGhE,MAAM,aAAa,SAAS;CAG5B,MAAM,eAAe,aAClB,aAAqB;AACpB,MAAI,UAAU,OACZ,kBAAiB,SAAS;AAE5B,aAAW,SAAS;IAEtB,CAAC,OAAO,SAAS,CAClB;CAGD,MAAM,cAAsB,eACnB;EACL,iBAAiB,SAAS,WAAW,GAAG,eAAe,IAAI,cAAc;EACzE,yBAAyB,SAAS,WAAW,GAAG,eAAe,IAAI,gBAAgB,GAAG;EACtF,GAAG;EACJ,GACD,CAAC,YAAY,gBAAgB,CAC9B;AAsBD,QACE,oBAACA;EACM;EACE;EACO;EACD;EACb,UAAU;EACV,UAAU;EACV,MAAM;EACS;EACf,aA/BwB,eACnB;GACL,SAAS;IACP,IAAI;IACJ,SAAS;IACV;GACD,GAAG;GACJ,GACD,CAAC,gBAAgB,CAClB;EAuBG,aArBwB,eACnB;GACL,GAAI,gBAAgB,aAChB,sBACA;GACJ,GAAG;GACJ,GACD,CAAC,aAAa,gBAAgB,CAC/B;EAcgB;EACb,UAAU;EACV,GAAI;GACJ;;AAIN,MAAM,aAAa,WAAW,UAAU;AAExC,MAAM,cAAc,OAAO,OAAO,YAAiC;CACjE,eAAe;CACf,aAAa;CACd,CAAC"}
+{"version":3,"file":"HueSlider.js","names":["Slider"],"sources":["../../../../src/components/fields/Slider/HueSlider.tsx"],"sourcesContent":["import { Styles, Tokens } from '@tenphi/tasty';\nimport { forwardRef, useCallback, useMemo, useState } from 'react';\n\nimport { CubeSliderProps, Slider } from './Slider';\n\nimport type { FocusableRef } from '@react-types/shared';\n\n// Generate 7 hue stops (0, 60, 120, 180, 240, 300, 359) for full color spectrum\nconst HUE_STOPS = [0, 60, 120, 180, 240, 300, 359];\nconst HUE_SATURATION = 80;\nconst HUE_LIGHTNESS = 50;\n\nconst HUE_GRADIENT = HUE_STOPS.map(\n  (h) => `okhsl(${h} ${HUE_SATURATION}% ${HUE_LIGHTNESS}%)`,\n).join(', ');\n\nconst horizontalTrackStyles: Styles = {\n  image: `linear-gradient(to right, ${HUE_GRADIENT})`,\n  Fill: false,\n};\n\nconst verticalTrackStyles: Styles = {\n  image: `linear-gradient(to top, ${HUE_GRADIENT})`,\n  Fill: false,\n};\n\nexport interface CubeHueSliderProps\n  extends Omit<CubeSliderProps, 'minValue' | 'maxValue' | 'step'> {\n  /** The current hue value (0-359) */\n  value?: number;\n  /** The default hue value (0-359) */\n  defaultValue?: number;\n}\n\nfunction HueSlider(\n  props: CubeHueSliderProps,\n  ref: FocusableRef<HTMLDivElement>,\n) {\n  const {\n    value,\n    defaultValue = 0,\n    onChange,\n    orientation = 'horizontal',\n    thumbTokens: userThumbTokens,\n    thumbStyles: userThumbStyles,\n    trackStyles: userTrackStyles,\n    ...rest\n  } = props;\n\n  // Track internal value for uncontrolled mode\n  const [internalValue, setInternalValue] = useState(defaultValue);\n\n  // Use controlled value if provided, otherwise use internal state\n  const currentHue = value ?? internalValue;\n\n  // Handle onChange to update internal state in uncontrolled mode\n  const handleChange = useCallback(\n    (newValue: number) => {\n      if (value === undefined) {\n        setInternalValue(newValue);\n      }\n      onChange?.(newValue);\n    },\n    [value, onChange],\n  );\n\n  // Create dynamic thumb tokens with the current hue color\n  const thumbTokens: Tokens = useMemo(\n    () => ({\n      '#slider-thumb': `okhsl(${currentHue} ${HUE_SATURATION}% ${HUE_LIGHTNESS}%)`,\n      '#slider-thumb-hovered': `okhsl(${currentHue} ${HUE_SATURATION}% ${HUE_LIGHTNESS - 10}%)`,\n      ...userThumbTokens,\n    }),\n    [currentHue, userThumbTokens],\n  );\n  const thumbStyles: Styles = useMemo(\n    () => ({\n      outline: {\n        '': '1bw #slider-thumb-hovered.0',\n        focused: '1bw #slider-thumb-hovered',\n      },\n      ...userThumbStyles,\n    }),\n    [userThumbStyles],\n  );\n\n  const trackStyles: Styles = useMemo(\n    () => ({\n      ...(orientation === 'vertical'\n        ? verticalTrackStyles\n        : horizontalTrackStyles),\n      ...userTrackStyles,\n    }),\n    [orientation, userTrackStyles],\n  );\n\n  return (\n    <Slider\n      ref={ref}\n      value={value}\n      defaultValue={defaultValue}\n      orientation={orientation}\n      minValue={0}\n      maxValue={359}\n      step={1}\n      thumbStyles={thumbStyles}\n      trackStyles={trackStyles}\n      thumbTokens={thumbTokens}\n      onChange={handleChange}\n      {...rest}\n    />\n  );\n}\n\nconst _HueSlider = forwardRef(HueSlider);\n\nconst __HueSlider = Object.assign(_HueSlider as typeof _HueSlider, {\n  cubeInputType: 'Number',\n  displayName: 'HueSlider',\n});\n\nexport { __HueSlider as HueSlider };\n"],"mappings":";;;;;;AAQA,MAAM,YAAY;CAAC;CAAG;CAAI;CAAK;CAAK;CAAK;CAAK;CAAI;AAClD,MAAM,iBAAiB;AACvB,MAAM,gBAAgB;AAEtB,MAAM,eAAe,UAAU,KAC5B,MAAM,SAAS,EAAE,GAAG,eAAe,IAAI,cAAc,IACvD,CAAC,KAAK,KAAK;AAEZ,MAAM,wBAAgC;CACpC,OAAO,6BAA6B,aAAa;CACjD,MAAM;CACP;AAED,MAAM,sBAA8B;CAClC,OAAO,2BAA2B,aAAa;CAC/C,MAAM;CACP;AAUD,SAAS,UACP,OACA,KACA;CACA,MAAM,EACJ,OACA,eAAe,GACf,UACA,cAAc,cACd,aAAa,iBACb,aAAa,iBACb,aAAa,iBACb,GAAG,SACD;CAGJ,MAAM,CAAC,eAAe,oBAAoB,SAAS,aAAa;CAGhE,MAAM,aAAa,SAAS;CAG5B,MAAM,eAAe,aAClB,aAAqB;AACpB,MAAI,UAAU,OACZ,kBAAiB,SAAS;AAE5B,aAAW,SAAS;IAEtB,CAAC,OAAO,SAAS,CAClB;CAGD,MAAM,cAAsB,eACnB;EACL,iBAAiB,SAAS,WAAW,GAAG,eAAe,IAAI,cAAc;EACzE,yBAAyB,SAAS,WAAW,GAAG,eAAe,IAAI,gBAAgB,GAAG;EACtF,GAAG;EACJ,GACD,CAAC,YAAY,gBAAgB,CAC9B;AAsBD,QACE,oBAACA;EACM;EACE;EACO;EACD;EACb,UAAU;EACV,UAAU;EACV,MAAM;EACN,aA9BwB,eACnB;GACL,SAAS;IACP,IAAI;IACJ,SAAS;IACV;GACD,GAAG;GACJ,GACD,CAAC,gBAAgB,CAClB;EAsBG,aApBwB,eACnB;GACL,GAAI,gBAAgB,aAChB,sBACA;GACJ,GAAG;GACJ,GACD,CAAC,aAAa,gBAAgB,CAC/B;EAagB;EACb,UAAU;EACV,GAAI;GACJ;;AAIN,MAAM,aAAa,WAAW,UAAU;AAExC,MAAM,cAAc,OAAO,OAAO,YAAiC;CACjE,eAAe;CACf,aAAa;CACd,CAAC"}

package/dist/components/fields/Slider/RangeSlider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { Gradation } from "./Gradation.js";
 import { _SliderBase } from "./SliderBase.js";
 import { SliderThumb } from "./SliderThumb.js";

package/dist/components/fields/Slider/Slider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { Gradation } from "./Gradation.js";

package/dist/components/fields/Slider/SliderBase.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { forwardRefWithGenerics } from "../../../utils/react/forwardRefWithGenerics.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";

package/dist/components/fields/Slider/SliderThumb.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { getValidationMods } from "../../form/validation/resolve-validation-props.js";
 import { SliderThumbElement } from "./elements.js";

package/dist/components/fields/Slider/SliderTrack.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { getValidationMods } from "../../form/validation/resolve-validation-props.js";
 import { SliderTrackContainerElement } from "./elements.js";
 import { useMemo } from "react";

package/dist/components/fields/Slider/elements.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 
 //#region src/components/fields/Slider/elements.ts

package/dist/components/fields/Slider/index.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { __RangeSlider } from "./RangeSlider.js";
 import { __Slider } from "./Slider.js";
 import { __HueSlider } from "./HueSlider.js";

package/dist/components/fields/Switch/Switch.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useId as useId$2 } from "../../../utils/react/useId.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";

package/dist/components/fields/TextArea/TextArea.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";

package/dist/components/fields/TextInput/TextInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useBufferedValue } from "../../../utils/react/useBufferedValue.js";

package/dist/components/fields/TextInput/TextInputBase.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/fields/TextInputMapper/TextInputMapper.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";

package/dist/components/fields/color/ColorPanel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a9d94d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a1aba4f | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { formatColor, getContrastingColor, toHex } from "./color.js";
 import { CHANNELS, COLOR_SPACES, COLOR_SPACE_HINTS, COLOR_SPACE_LABELS } from "./channels.js";