npm - @cube-dev/ui-kit - Versions diffs - 0.121.6 → 0.122.0 - Mend

@cube-dev/ui-kit 0.121.6 → 0.122.0

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

Files changed (480) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioGroup.js","names":["mergeProps"],"sources":["../../../../src/components/fields/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { useDOMRef } from '@react-spectrum/utils';\nimport {\n BaseProps,\n CONTAINER_STYLES,\n ContainerStyleProps,\n ~~extractStyles,\n~~ Styles,\n tasty,\n} from '@tenphi/tasty';\nimport { forwardRef } from 'react';\nimport { AriaRadioGroupProps, useRadioGroup } from 'react-aria';\nimport { useRadioGroupState } from 'react-stately';\n\nimport { useProviderProps } from '../../../provider';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport {\n castNullableStringValue,\n WithNullableValue,\n} from '../../../utils/react/nullableValue';\nimport { CubeItemProps } from '../../content/Item/Item';\nimport {\n FormContext,\n useFieldProps,\n useFormProps,\n wrapWithField,\n} 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 /* Whether the radio group is invalid /\n isInvalid?: boolean;\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 'secondary' /\n buttonType?: Exclude<CubeItemProps['type'], 'secondary'>;\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: '1cr',\n fill: {\n '': '#clear',\n 'tabs \| disabled': '#dark.06',\n },\n width: 'max-content max-content initial',\n flexShrink: 0,\n gap: {\n '': '1x',\n tabs: '.5x',\n },\n whiteSpace: 'nowrap',\n },\n});\n\nfunction RadioGroup(props: WithNullableValue<CubeRadioGroupProps>, ref) {\n let orientation = props.orientation;\n\n props = castNullableStringValue(props);\n props = useProviderProps(props);\n props = useFormProps(props);\n props = useFieldProps(props, { defaultValidationTrigger: 'onChange' });\n\n let {\n qa,\n id,\n isDisabled,\n isRequired,\n labelPosition = 'top',\n isInvalid,\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 = useDOMRef(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 let radioGroup = (\n <RadioGroupElement\n id={id}\n qa={qa \|\| 'RadioGroup'}\n styles={styles}\n data-input-type=\"radiogroup\"\n mods={{\n horizontal: orientation === 'horizontal',\n 'inside-form': insideForm,\n 'side-label': labelPosition === 'side',\n tabs: type === 'tabs',\n }}\n >\n <FormContext.Provider\n value={{\n isRequired,\n isInvalid,\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 children: null,\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":"~~;;;;;;;;;;;;;;;;~~AAkDA,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,MAAM;GACP;EACD,YAAY;EACb;CACF,CAAC;AAEF,SAAS,WAAW,OAA+C,KAAK;CACtE,IAAI,cAAc,MAAM;AAExB,SAAQ,wBAAwB,MAAM;AACtC,SAAQ,iBAAiB,MAAM;AAC/B,SAAQ,aAAa,MAAM;AAC3B,SAAQ,cAAc,OAAO,EAAE,0BAA0B,YAAY,CAAC;CAEtE,IAAI,EACF,IACA,IACA,YACA,YACA,gBAAgB,OAChB,WACA,UACA,QACA,aACA,YAEA,YAAY,gBACZ,MACA,YACA,MACA,MACA,GAAG,eACD;CACJ,IAAI,SAAS,UAAU,IAAI;AAE3B,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;AAsCD,QAAO,cAnCL,oBAAC;EACK;EACJ,IAAI,MAAM;EACF;EACR,mBAAgB;EAChB,MAAM;GACJ,YAAY,gBAAgB;GAC5B,eAAe;GACf,cAAc,kBAAkB;GAChC,MAAM,SAAS;GAChB;YAED,oBAAC,YAAY;GACX,OAAO;IACL;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,UAAU;EACV;EACA,YAAYA,aAAW,gBAAgB,WAAW;EACnD,CAAC;;;;;;AAOJ,MAAM,cAAc,WAAW,WAAW;AAE1C,AAAC,YAAoB,gBAAgB;AACrC,YAAY,cAAc"}
1	+ {"version":3,"file":"RadioGroup.js","names":["mergeProps"],"sources":["../../../../src/components/fields/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { useDOMRef } from '@react-spectrum/utils';\nimport {\n BaseProps,\n CONTAINER_STYLES,\n ContainerStyleProps,\n Styles,\n tasty,\n} from '@tenphi/tasty';\nimport { forwardRef } from 'react';\nimport { AriaRadioGroupProps, useRadioGroup } from 'react-aria';\nimport { useRadioGroupState } from 'react-stately';\n\nimport { useProviderProps } from '../../../provider';\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 {\n FormContext,\n useFieldProps,\n useFormProps,\n wrapWithField,\n} 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 /* Whether the radio group is invalid /\n isInvalid?: boolean;\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 'secondary' /\n buttonType?: Exclude<CubeItemProps['type'], 'secondary'>;\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: '1cr',\n fill: {\n '': '#clear',\n 'tabs \| disabled': '#dark.06',\n },\n width: 'max-content max-content initial',\n flexShrink: 0,\n gap: {\n '': '1x',\n tabs: '.5x',\n },\n whiteSpace: 'nowrap',\n },\n});\n\nfunction RadioGroup(props: WithNullableValue<CubeRadioGroupProps>, ref) {\n let orientation = props.orientation;\n\n props = castNullableStringValue(props);\n props = useProviderProps(props);\n props = useFormProps(props);\n props = useFieldProps(props, { defaultValidationTrigger: 'onChange' });\n\n let {\n qa,\n id,\n isDisabled,\n isRequired,\n labelPosition = 'top',\n isInvalid,\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 = useDOMRef(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 let radioGroup = (\n <RadioGroupElement\n id={id}\n qa={qa \|\| 'RadioGroup'}\n styles={styles}\n data-input-type=\"radiogroup\"\n mods={{\n horizontal: orientation === 'horizontal',\n 'inside-form': insideForm,\n 'side-label': labelPosition === 'side',\n tabs: type === 'tabs',\n }}\n >\n <FormContext.Provider\n value={{\n isRequired,\n isInvalid,\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 children: null,\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":";;;;;;;;;;;;;;;;;AAkDA,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,MAAM;GACP;EACD,YAAY;EACb;CACF,CAAC;AAEF,SAAS,WAAW,OAA+C,KAAK;CACtE,IAAI,cAAc,MAAM;AAExB,SAAQ,wBAAwB,MAAM;AACtC,SAAQ,iBAAiB,MAAM;AAC/B,SAAQ,aAAa,MAAM;AAC3B,SAAQ,cAAc,OAAO,EAAE,0BAA0B,YAAY,CAAC;CAEtE,IAAI,EACF,IACA,IACA,YACA,YACA,gBAAgB,OAChB,WACA,UACA,QACA,aACA,YAEA,YAAY,gBACZ,MACA,YACA,MACA,MACA,GAAG,eACD;CACJ,IAAI,SAAS,UAAU,IAAI;AAE3B,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;AAsCD,QAAO,cAnCL,oBAAC;EACK;EACJ,IAAI,MAAM;EACF;EACR,mBAAgB;EAChB,MAAM;GACJ,YAAY,gBAAgB;GAC5B,eAAe;GACf,cAAc,kBAAkB;GAChC,MAAM,SAAS;GAChB;YAED,oBAAC,YAAY;GACX,OAAO;IACL;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,UAAU;EACV;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 CHANGED Viewed

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

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useProviderProps } from "../../../provider.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";

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

@@ -1,4 +1,5 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | Cube Dev Team */
+import { extractStyles } from "../../../utils/styles.js";
 import { forwardRefWithGenerics } from "../../../utils/react/forwardRefWithGenerics.js";
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
@@ -24,7 +25,7 @@ import { wrapWithField } from "../../form/wrapper.js";
 import { chainRaf } from "../../../utils/raf.js";
 import { InvalidIcon } from "../../shared/InvalidIcon.js";
 import { ValidIcon } from "../../shared/ValidIcon.js";
-import { BASE_STYLES, COLOR_STYLES, OUTER_STYLES, extractStyles, tasty } from "@tenphi/tasty";
+import { BASE_STYLES, COLOR_STYLES, OUTER_STYLES, tasty } from "@tenphi/tasty";
 import React, { cloneElement, useEffect, useMemo, useRef } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { DismissButton, FocusScope, HiddenSelect, useButton, useHover, useListBox, useListBoxSection, useOption, useOverlay, useOverlayPosition, useSelect } from "react-aria";

package/dist/components/fields/Select/Select.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Select.js","names":["Item","useFocus","mergeProps","Text","ListDivider","ListSectionWrapper","ListSectionHeading","BaseSection","CollectionItem"],"sources":["../../../../src/components/fields/Select/Select.tsx"],"sourcesContent":["import {\n AriaLabelingProps,\n CollectionBase,\n DOMRef,\n Key,\n} from '@react-types/shared';\nimport {\n BASE_STYLES,\n BasePropsWithoutChildren,\n BaseStyleProps,\n COLOR_STYLES,\n ColorStyleProps,\n extractStyles,\n OUTER_STYLES,\n OuterStyleProps,\n Props,\n Styles,\n tasty,\n} from '@tenphi/tasty';\nimport React, {\n cloneElement,\n ReactElement,\n ReactNode,\n RefObject,\n useEffect,\n useMemo,\n useRef,\n} from 'react';\nimport {\n AriaSelectProps,\n DismissButton,\n FocusScope,\n HiddenSelect,\n useButton,\n useHover,\n useListBox,\n useListBoxSection,\n useOption,\n useOverlay,\n useOverlayPosition,\n useSelect,\n} from 'react-aria';\nimport { Section as BaseSection, useSelectState } from 'react-stately';\nimport { CubeTooltipProviderProps } from 'src/components/overlays/Tooltip/TooltipProvider';\n\nimport { useEvent } from '../../../_internal';\nimport { CloseIcon, DirectionIcon, LoadingIcon } from '../../../icons/index';\nimport { useProviderProps } from '../../../provider';\nimport { FieldBaseProps } from '../../../shared/index';\nimport { chainRaf } from '../../../utils/raf';\nimport { generateRandomId } from '../../../utils/random';\nimport {\n forwardRefWithGenerics,\n mergeProps,\n useCombinedRefs,\n useLayoutEffect,\n} from '../../../utils/react/index';\nimport { useFocus } from '../../../utils/react/interactions';\nimport { useEventBus } from '../../../utils/react/useEventBus';\nimport { ItemAction } from '../../actions';\nimport {\n StyledDivider as ListDivider,\n StyledSectionHeading as ListSectionHeading,\n StyledSection as ListSectionWrapper,\n} from '../../actions/Menu/styled';\nimport {\n CollectionItem,\n filterCollectionItemProps,\n} from '../../CollectionItem';\nimport { CubeItemProps, Item } from '../../content/Item';\nimport { Text } from '../../content/Text';\nimport { useFieldProps, useFormProps, wrapWithField } from '../../form';\nimport { DisplayTransition } from '../../helpers';\nimport { Portal } from '../../portal';\nimport { InvalidIcon } from '../../shared/InvalidIcon';\nimport { ValidIcon } from '../../shared/ValidIcon';\n\nconst SelectWrapperElement = tasty({\n qa: 'SelectWrapper',\n styles: {\n display: 'grid',\n position: 'relative',\n radius: true,\n fill: {\n '': '#white',\n disabled: '#dark.04',\n 'theme=special': '#clear',\n },\n color: {\n '': '#dark.85',\n focused: '#dark.85',\n invalid: '#danger-text',\n disabled: '#dark.30',\n },\n },\n});\n\nexport const ListBoxElement = tasty({\n qa: 'ListBox',\n as: 'ul',\n styles: {\n display: 'flex',\n gap: '1bw',\n flow: 'column',\n margin: '0',\n padding: '0',\n listStyle: 'none',\n scrollbar: 'styled',\n },\n});\n\n// Use Item for options to unify item visuals and reduce custom styling\nconst OptionItem = tasty(Item, {\n as: 'li',\n disableActionsFocus: true,\n qa: 'Option',\n styles: {\n '$inline-compensation': '0px',\n },\n});\n\nconst SelectOverlayWrapper = tasty({\n qa: 'SelectOverlayWrapper',\n styles: {\n position: 'absolute',\n zIndex: 1000,\n },\n});\n\nconst OverlayElement = tasty({\n qa: 'SelectOverlay',\n styles: {\n width: 'min $overlay-min-width',\n display: 'grid',\n gridRows: '1sf',\n height: 'initial max-content (50vh - 5x)',\n overflow: 'auto',\n background: '#white',\n radius: '1cr',\n shadow: true,\n padding: '.5x',\n border: true,\n boxSizing: 'border-box',\n transition:\n 'translate $transition ease-out, scale $transition ease-out, theme $transition ease-out',\n translate: {\n '': '0 0',\n 'open & [data-placement=\"top\"]': '0 0',\n '!open & [data-placement=\"top\"]': '0 1x',\n 'open & ([data-placement=\"bottom\"] \| ![data-placement])': '0 0',\n '!open & ([data-placement=\"bottom\"] \| ![data-placement])': '0 -1x',\n },\n transformOrigin: {\n '': 'top center',\n '[data-placement=\"top\"]': 'bottom center',\n },\n scale: {\n '': '1 1',\n '!open': '1 .9',\n },\n opacity: {\n '': 1,\n '!open': 0.001,\n },\n },\n});\n\nexport interface CubeSelectBaseProps<T>\n extends BasePropsWithoutChildren,\n AriaLabelingProps,\n BaseStyleProps,\n OuterStyleProps,\n ColorStyleProps,\n Omit<FieldBaseProps, 'tooltip'>,\n CollectionBase<T>,\n Omit<\n AriaSelectProps<T>,\n \| 'errorMessage'\n \| 'selectedKey'\n \| 'defaultSelectedKey'\n \| 'onSelectionChange'\n > {\n /** The currently selected key in the collection (controlled). /\n selectedKey?: Key \| null;\n /* The initial selected key in the collection (uncontrolled). /\n defaultSelectedKey?: Key;\n /* Handler that is called when the selection changes. /\n onSelectionChange?: (key: Key \| null) => void;\n icon?: ReactElement;\n rightIcon?: ReactNode;\n prefix?: ReactNode;\n suffix?: ReactNode;\n /* Description text for the trigger. Note: Different from field-level description. /\n triggerDescription?: ReactNode;\n descriptionPlacement?: 'inline' \| 'block';\n /* Keyboard shortcut that triggers the select when pressed /\n hotkeys?: string;\n /\n Tooltip content and configuration for the trigger:\n * - string: simple tooltip text\n * - true: auto tooltip on overflow (shows selected value as tooltip when truncated)\n * - object: advanced configuration with optional auto property\n /\n tooltip?:\n \| string\n \| boolean\n \| (Omit<CubeTooltipProviderProps, 'children'> & { auto?: boolean });\n triggerRef?: RefObject<HTMLButtonElement>;\n isLoading?: boolean;\n loadingIndicator?: ReactNode;\n overlayOffset?: number;\n hideTrigger?: boolean;\n /\n @deprecated Use `triggerStyles` instead\n /\n inputStyles?: Styles;\n optionStyles?: Styles;\n triggerStyles?: Styles;\n listBoxStyles?: Styles;\n overlayStyles?: Styles;\n direction?: 'top' \| 'bottom';\n shouldFlip?: boolean;\n /* Minimum padding in pixels between the popover and viewport edges /\n containerPadding?: number;\n inputProps?: Props;\n type?: 'outline' \| 'clear' \| 'primary' \| (string & {});\n /\n Shape of the trigger's border radius.\n * - `card` - Card shape with larger border radius (`1cr`)\n * - `button` - Button shape with default border radius (default)\n * - `sharp` - Sharp corners with no border radius (`0`)\n * - `pill` - Pill shape with fully rounded ends (`round`)\n * @default \"button\"\n /\n shape?: 'card' \| 'button' \| 'sharp' \| 'pill';\n suffixPosition?: 'before' \| 'after';\n theme?: 'default' \| 'special';\n /* Whether the select is clearable using a clear button in the rightIcon slot /\n isClearable?: boolean;\n /* Callback called when the clear button is pressed /\n onClear?: () => void;\n /* Callback called when the popover open state changes /\n onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport interface CubeSelectProps<T> extends CubeSelectBaseProps<T> {\n popoverRef?: RefObject<HTMLInputElement>;\n /* The ref for the list box. */\n listBoxRef?: RefObject<HTMLElement>;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n placeholder?: string;\n}\n\nconst PROP_STYLES = [...BASE_STYLES, ...OUTER_STYLES, ...COLOR_STYLES];\n\nfunction Select<T extends object>(\n props: CubeSelectProps<T>,\n ref: DOMRef<HTMLDivElement>,\n) {\n props = useProviderProps(props);\n props = useFormProps(props);\n props = useFieldProps(props, {\n defaultValidationTrigger: 'onChange',\n valuePropsMapper: ({ value, onChange }) => ({\n selectedKey: value ?? null,\n onSelectionChange: onChange,\n }),\n });\n\n let {\n qa,\n label,\n extra,\n icon,\n rightIcon,\n labelStyles,\n isRequired,\n necessityIndicator,\n validationState,\n prefix,\n isDisabled = props.isLoading \|\| false,\n autoFocus,\n inputProps,\n triggerRef,\n popoverRef,\n listBoxRef,\n isLoading,\n loadingIndicator,\n overlayOffset = 8,\n inputStyles,\n triggerStyles,\n optionStyles,\n listBoxStyles,\n overlayStyles,\n suffix,\n message,\n triggerDescription,\n descriptionPlacement,\n hotkeys,\n direction = 'bottom',\n shouldFlip = true,\n containerPadding = 8,\n placeholder,\n tooltip,\n size = 'medium',\n shape,\n styles,\n type = 'outline',\n theme = 'default',\n labelSuffix,\n suffixPosition = 'before',\n isClearable,\n onOpenChange,\n form,\n ...otherProps\n } = props;\n let state = useSelectState(props);\n\n // Generate a unique ID for this select instance\n const selectId = useMemo(() => generateRandomId(), []);\n\n // Get event bus for menu synchronization\n const { emit, on } = useEventBus();\n\n // Listen for other menus opening and close this one if needed\n useEffect(() => {\n const unsubscribe = on('popover:open', (data: { menuId: string }) => {\n // If another menu is opening and this select is open, close this one\n if (data.menuId !== selectId && state.isOpen) {\n state.close();\n }\n });\n\n return unsubscribe;\n }, [on, selectId, state]);\n\n // Emit event when this select opens\n useEffect(() => {\n if (state.isOpen) {\n emit('popover:open', { menuId: selectId });\n }\n }, [state.isOpen, emit, selectId]);\n\n // Call onOpenChange when open state changes\n useEffect(() => {\n onOpenChange?.(state.isOpen);\n }, [state.isOpen]);\n\n styles = extractStyles(otherProps, PROP_STYLES, styles);\n\n ref = useCombinedRefs(ref);\n triggerRef = useCombinedRefs(triggerRef);\n popoverRef = useCombinedRefs(popoverRef);\n listBoxRef = useCombinedRefs(listBoxRef);\n\n let { labelProps, triggerProps, valueProps, menuProps } = useSelect(\n props,\n state,\n triggerRef,\n );\n\n let { overlayProps, placement, updatePosition } = useOverlayPosition({\n targetRef: triggerRef,\n overlayRef: popoverRef,\n scrollRef: listBoxRef,\n placement: `${direction} end`,\n shouldFlip: shouldFlip,\n isOpen: state.isOpen,\n onClose: state.close,\n offset: overlayOffset,\n containerPadding: containerPadding,\n });\n\n let { isFocused, focusProps } = useFocus({ isDisabled }, true);\n let { hoverProps, isHovered } = useHover({ isDisabled });\n\n // Get props for the button based on the trigger props from useSelect\n let { buttonProps } = useButton(triggerProps, triggerRef);\n\n let isInvalid = validationState === 'invalid';\n\n let validationIcon = isInvalid ? InvalidIcon : ValidIcon;\n let validation = cloneElement(validationIcon);\n\n // Clear button logic\n let hasSelection = state.selectedItem != null;\n let showClearButton =\n isClearable && hasSelection && !isDisabled && !props.isReadOnly;\n\n // Clear function\n let clearValue = useEvent(() => {\n props.onSelectionChange?.(null);\n state.setSelectedKey(null);\n // Close the popup if it's open\n if (state.isOpen) {\n state.close();\n }\n // Return focus to the trigger for better UX\n triggerRef.current?.focus?.();\n\n props.onClear?.();\n });\n\n let triggerWidth = triggerRef?.current?.offsetWidth;\n\n const showPlaceholder = !!placeholder?.trim() && !state.selectedItem;\n\n const modifiers = useMemo(\n () => ({\n invalid: isInvalid,\n valid: validationState === 'valid',\n disabled: isDisabled,\n loading: isLoading,\n hovered: isHovered,\n focused: isFocused,\n placeholder: showPlaceholder,\n prefix: !!prefix,\n suffix: true,\n }),\n [\n validationState,\n isDisabled,\n isLoading,\n isHovered,\n isFocused,\n showPlaceholder,\n prefix,\n ],\n );\n\n suffix = useMemo(() => {\n if (!suffix && !validationState) {\n return null;\n }\n\n return (\n <>\n {suffix}\n {validationState ? validation : null}\n </>\n );\n }, [suffix, validationState, validation]);\n\n let selectField = (\n <SelectWrapperElement\n mods={modifiers}\n styles={styles}\n data-size={size}\n data-type={type}\n data-theme={theme}\n >\n <HiddenSelect\n state={state}\n triggerRef={triggerRef}\n label={props.label}\n name={props.name}\n />\n <Item\n as=\"button\"\n qa={qa \|\| 'Select'}\n data-input-type=\"select\"\n {...mergeProps(buttonProps, hoverProps, focusProps)}\n ref={triggerRef}\n data-popover-trigger\n styles={{ ...inputStyles, ...triggerStyles }}\n theme={theme}\n size={size}\n shape={shape}\n // Ensure this button never submits a surrounding form in tests or runtime\n htmlType=\"button\"\n // Preserve visual variant via data attribute instead of conflicting with HTML attribute\n type={type}\n mods={modifiers}\n prefix={prefix}\n suffix={suffix}\n icon={icon}\n rightIcon={\n rightIcon !== undefined ? (\n rightIcon\n ) : showClearButton ? (\n <ItemAction\n icon={<CloseIcon />}\n theme={validationState === 'invalid' ? 'danger' : undefined}\n qa=\"SelectClearButton\"\n mods={{ pressed: false }}\n onPress={clearValue}\n />\n ) : isLoading ? (\n <LoadingIcon />\n ) : (\n <DirectionIcon to={state.isOpen ? 'up' : 'down'} />\n )\n }\n description={triggerDescription}\n descriptionPlacement={descriptionPlacement}\n hotkeys={hotkeys}\n tooltip={tooltip}\n labelProps={valueProps}\n >\n {state.selectedItem ? (\n state.selectedItem.rendered\n ) : placeholder ? (\n <Text.Placeholder>{placeholder}</Text.Placeholder>\n ) : null}\n </Item>\n <ListBoxPopup\n {...menuProps}\n popoverRef={popoverRef}\n listBoxRef={listBoxRef}\n overlayProps={overlayProps}\n placement={placement}\n updatePosition={updatePosition}\n state={state}\n listBoxStyles={listBoxStyles}\n overlayStyles={overlayStyles}\n optionStyles={optionStyles}\n minWidth={triggerWidth}\n triggerRef={triggerRef}\n isDisabled={isDisabled}\n />\n </SelectWrapperElement>\n );\n\n return wrapWithField<Omit<CubeSelectProps<T>, 'children'>>(\n selectField,\n ref,\n mergeProps(\n {\n ...props,\n },\n { labelProps },\n ),\n );\n}\n\nexport function ListBoxPopup({\n state,\n popoverRef,\n listBoxRef,\n listBoxStyles,\n overlayStyles,\n optionStyles,\n overlayProps: parentOverlayProps,\n shouldUseVirtualFocus = false,\n placement,\n updatePosition,\n minWidth,\n size = 'small',\n triggerRef,\n isDisabled,\n ...otherProps\n}) {\n // For trigger+popover components, map 'small' size to 'medium' for list items\n // while preserving 'medium' and 'large' sizes\n const listItemSize = size === 'small' ? 'medium' : size;\n\n // Update position when overlay opens\n useLayoutEffect(() => {\n if (state.isOpen && updatePosition) {\n // Use triple RAF to ensure layout is complete before positioning\n // This gives enough time for the DisplayTransition and content to render\n return chainRaf(() => {\n updatePosition();\n }, 3);\n }\n }, [state.isOpen]);\n\n // Get props for the listbox\n let { listBoxProps } = useListBox(\n {\n autoFocus: state.focusStrategy \|\| true,\n shouldUseVirtualFocus,\n ...otherProps,\n },\n state,\n listBoxRef,\n );\n\n // Handle events that should cause the popup to close,\n // e.g. blur, clicking outside, or pressing the escape key.\n let { overlayProps } = useOverlay(\n {\n onClose: () => state.close(),\n shouldCloseOnBlur: true,\n isOpen: state.isOpen,\n isDismissable: true,\n shouldCloseOnInteractOutside: (el) => {\n const menuTriggerEl = el.closest('[data-popover-trigger]');\n // If no menu trigger was clicked, allow closing\n if (!menuTriggerEl) return true;\n // If the same trigger that opened this select was clicked, allow closing\n if (menuTriggerEl === triggerRef?.current) return true;\n // Otherwise, don't close (let event mechanism handle it)\n return false;\n },\n },\n popoverRef,\n );\n\n // Extract primary placement direction for consistent styling\n const placementDirection = placement?.split(' ')[0] \|\| 'bottom';\n\n // Wrap in <FocusScope> so that focus is restored back to the\n // trigger when the popup is closed. In addition, add hidden\n // <DismissButton> components at the start and end of the list\n // to allow screen reader users to dismiss the popup easily.\n return (\n <Portal>\n <DisplayTransition isShown={state.isOpen && !isDisabled}>\n {({ phase, isShown, ref: transitionRef }) => (\n <SelectOverlayWrapper\n {...overlayProps}\n {...parentOverlayProps}\n ref={popoverRef}\n style={parentOverlayProps?.style}\n >\n <OverlayElement\n ref={transitionRef}\n data-placement={placementDirection}\n data-phase={phase}\n mods={{\n open: isShown,\n }}\n styles={overlayStyles}\n style={{\n '--overlay-min-width': minWidth ? `${minWidth}px` : 'initial',\n }}\n >\n <FocusScope restoreFocus>\n <DismissButton onDismiss={() => state.close()} />\n {(() => {\n const renderedItems: React.ReactNode[] = [];\n let isFirstSection = true;\n\n for (const item of state.collection) {\n if (item.type === 'section') {\n if (!isFirstSection) {\n renderedItems.push(\n <ListDivider\n key={`divider-${String(item.key)}`}\n as=\"li\"\n role=\"separator\"\n aria-orientation=\"horizontal\"\n />,\n );\n }\n\n renderedItems.push(\n <SelectSection\n key={item.key}\n item={item}\n state={state}\n optionStyles={optionStyles}\n sectionStyles={undefined}\n shouldUseVirtualFocus={shouldUseVirtualFocus}\n size={listItemSize}\n />,\n );\n\n isFirstSection = false;\n } else {\n renderedItems.push(\n <Option\n key={item.key}\n item={item}\n state={state}\n styles={optionStyles}\n shouldUseVirtualFocus={shouldUseVirtualFocus}\n size={listItemSize}\n />,\n );\n }\n }\n\n return (\n <ListBoxElement\n styles={listBoxStyles}\n {...listBoxProps}\n ref={listBoxRef}\n >\n {renderedItems}\n </ListBoxElement>\n );\n })()}\n <DismissButton onDismiss={() => state.close()} />\n </FocusScope>\n </OverlayElement>\n </SelectOverlayWrapper>\n )}\n </DisplayTransition>\n </Portal>\n );\n}\n\nfunction Option({ item, state, styles, shouldUseVirtualFocus, size }) {\n let ref = useRef<HTMLLIElement>(null);\n let isDisabled = state.disabledKeys.has(item.key);\n let isSelected = state.selectionManager.isSelected(item.key);\n let isVirtualFocused = state.selectionManager.focusedKey === item.key;\n\n let { optionProps, isPressed, labelProps, descriptionProps } = useOption(\n {\n key: item.key,\n isDisabled,\n isSelected,\n shouldSelectOnPressUp: true,\n shouldFocusOnHover: true,\n shouldUseVirtualFocus,\n },\n state,\n ref,\n );\n\n // Handle focus events, so we can apply highlighted\n // style to the focused option\n let { isFocused, focusProps } = useFocus({ isDisabled });\n\n // Filter out service props - all remaining props can be passed to Item\n const filteredItemProps = filterCollectionItemProps(item.props);\n\n return (\n <OptionItem\n {...mergeProps(optionProps, focusProps, filteredItemProps)}\n ref={ref}\n mods={{\n listboxitem: true,\n selected: isSelected,\n focused: shouldUseVirtualFocus ? isVirtualFocused : isFocused,\n disabled: isDisabled,\n pressed: isPressed,\n }}\n data-size={size}\n styles={{\n ...(styles as Styles),\n ...(filteredItemProps.styles as Styles),\n }}\n labelProps={labelProps}\n descriptionProps={descriptionProps}\n defaultTooltipPlacement=\"right\"\n >\n {item.rendered}\n </OptionItem>\n );\n}\n\ninterface SelectSectionProps<T> {\n item: any; // react-stately Node<T>\n state: any; // TreeState<T>\n optionStyles?: Styles;\n headingStyles?: Styles;\n sectionStyles?: Styles;\n shouldUseVirtualFocus?: boolean;\n size?: string;\n}\n\nfunction SelectSection<T>(props: SelectSectionProps<T>) {\n const {\n item,\n state,\n optionStyles,\n headingStyles,\n sectionStyles,\n shouldUseVirtualFocus,\n size,\n } = props;\n\n const heading = item.rendered;\n\n const { itemProps, headingProps, groupProps } = useListBoxSection({\n heading,\n 'aria-label': item['aria-label'],\n });\n\n return (\n <ListSectionWrapper {...itemProps} styles={sectionStyles}>\n {heading && (\n <ListSectionHeading\n {...headingProps}\n size={size}\n styles={{ ...headingStyles, '$inline-compensation': '0px' }}\n >\n {heading}\n </ListSectionHeading>\n )}\n <ListBoxElement {...groupProps} mods={{ section: true }}>\n {[...item.childNodes]\n .filter((node: any) => state.collection.getItem(node.key))\n .map((node: any) => (\n <Option\n key={node.key}\n item={node}\n state={state}\n styles={optionStyles}\n shouldUseVirtualFocus={shouldUseVirtualFocus}\n size={size}\n />\n ))}\n </ListBoxElement>\n </ListSectionWrapper>\n );\n}\n\nconst _Select = forwardRefWithGenerics(Select);\n\n(_Select as any).cubeInputType = 'Select';\n\ntype SectionComponent = typeof BaseSection;\n\nconst SelectSectionComponent = Object.assign(BaseSection, {\n displayName: 'Section',\n}) as SectionComponent;\n\nconst __Select = Object.assign(\n _Select as typeof _Select & {\n Item: typeof CollectionItem;\n Section: typeof SelectSectionComponent;\n },\n {\n Item: CollectionItem,\n Section: SelectSectionComponent,\n },\n);\n\n(__Select as any).displayName = 'Select';\n\nexport { __Select as Select };\n\nexport type { AriaSelectProps };\nexport { useSelectState };\n"],"mappings":"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"}
1	+ {"version":3,"file":"Select.js","names":["Item","useFocus","mergeProps","Text","ListDivider","ListSectionWrapper","ListSectionHeading","BaseSection","CollectionItem"],"sources":["../../../../src/components/fields/Select/Select.tsx"],"sourcesContent":["import {\n AriaLabelingProps,\n CollectionBase,\n DOMRef,\n Key,\n} from '@react-types/shared';\nimport {\n BASE_STYLES,\n BasePropsWithoutChildren,\n BaseStyleProps,\n COLOR_STYLES,\n ColorStyleProps,\n OUTER_STYLES,\n OuterStyleProps,\n Props,\n Styles,\n tasty,\n} from '@tenphi/tasty';\nimport React, {\n cloneElement,\n ReactElement,\n ReactNode,\n RefObject,\n useEffect,\n useMemo,\n useRef,\n} from 'react';\nimport {\n AriaSelectProps,\n DismissButton,\n FocusScope,\n HiddenSelect,\n useButton,\n useHover,\n useListBox,\n useListBoxSection,\n useOption,\n useOverlay,\n useOverlayPosition,\n useSelect,\n} from 'react-aria';\nimport { Section as BaseSection, useSelectState } from 'react-stately';\nimport { CubeTooltipProviderProps } from 'src/components/overlays/Tooltip/TooltipProvider';\n\nimport { useEvent } from '../../../_internal';\nimport { CloseIcon, DirectionIcon, LoadingIcon } from '../../../icons/index';\nimport { useProviderProps } from '../../../provider';\nimport { FieldBaseProps } from '../../../shared/index';\nimport { chainRaf } from '../../../utils/raf';\nimport { generateRandomId } from '../../../utils/random';\nimport {\n forwardRefWithGenerics,\n mergeProps,\n useCombinedRefs,\n useLayoutEffect,\n} from '../../../utils/react/index';\nimport { useFocus } from '../../../utils/react/interactions';\nimport { useEventBus } from '../../../utils/react/useEventBus';\nimport { extractStyles } from '../../../utils/styles';\nimport { ItemAction } from '../../actions';\nimport {\n StyledDivider as ListDivider,\n StyledSectionHeading as ListSectionHeading,\n StyledSection as ListSectionWrapper,\n} from '../../actions/Menu/styled';\nimport {\n CollectionItem,\n filterCollectionItemProps,\n} from '../../CollectionItem';\nimport { CubeItemProps, Item } from '../../content/Item';\nimport { Text } from '../../content/Text';\nimport { useFieldProps, useFormProps, wrapWithField } from '../../form';\nimport { DisplayTransition } from '../../helpers';\nimport { Portal } from '../../portal';\nimport { InvalidIcon } from '../../shared/InvalidIcon';\nimport { ValidIcon } from '../../shared/ValidIcon';\n\nconst SelectWrapperElement = tasty({\n qa: 'SelectWrapper',\n styles: {\n display: 'grid',\n position: 'relative',\n radius: true,\n fill: {\n '': '#white',\n disabled: '#dark.04',\n 'theme=special': '#clear',\n },\n color: {\n '': '#dark.85',\n focused: '#dark.85',\n invalid: '#danger-text',\n disabled: '#dark.30',\n },\n },\n});\n\nexport const ListBoxElement = tasty({\n qa: 'ListBox',\n as: 'ul',\n styles: {\n display: 'flex',\n gap: '1bw',\n flow: 'column',\n margin: '0',\n padding: '0',\n listStyle: 'none',\n scrollbar: 'styled',\n },\n});\n\n// Use Item for options to unify item visuals and reduce custom styling\nconst OptionItem = tasty(Item, {\n as: 'li',\n disableActionsFocus: true,\n qa: 'Option',\n styles: {\n '$inline-compensation': '0px',\n },\n});\n\nconst SelectOverlayWrapper = tasty({\n qa: 'SelectOverlayWrapper',\n styles: {\n position: 'absolute',\n zIndex: 1000,\n },\n});\n\nconst OverlayElement = tasty({\n qa: 'SelectOverlay',\n styles: {\n width: 'min $overlay-min-width',\n display: 'grid',\n gridRows: '1sf',\n height: 'initial max-content (50vh - 5x)',\n overflow: 'auto',\n background: '#white',\n radius: '1cr',\n shadow: true,\n padding: '.5x',\n border: true,\n boxSizing: 'border-box',\n transition:\n 'translate $transition ease-out, scale $transition ease-out, theme $transition ease-out',\n translate: {\n '': '0 0',\n 'open & [data-placement=\"top\"]': '0 0',\n '!open & [data-placement=\"top\"]': '0 1x',\n 'open & ([data-placement=\"bottom\"] \| ![data-placement])': '0 0',\n '!open & ([data-placement=\"bottom\"] \| ![data-placement])': '0 -1x',\n },\n transformOrigin: {\n '': 'top center',\n '[data-placement=\"top\"]': 'bottom center',\n },\n scale: {\n '': '1 1',\n '!open': '1 .9',\n },\n opacity: {\n '': 1,\n '!open': 0.001,\n },\n },\n});\n\nexport interface CubeSelectBaseProps<T>\n extends BasePropsWithoutChildren,\n AriaLabelingProps,\n BaseStyleProps,\n OuterStyleProps,\n ColorStyleProps,\n Omit<FieldBaseProps, 'tooltip'>,\n CollectionBase<T>,\n Omit<\n AriaSelectProps<T>,\n \| 'errorMessage'\n \| 'selectedKey'\n \| 'defaultSelectedKey'\n \| 'onSelectionChange'\n > {\n /** The currently selected key in the collection (controlled). /\n selectedKey?: Key \| null;\n /* The initial selected key in the collection (uncontrolled). /\n defaultSelectedKey?: Key;\n /* Handler that is called when the selection changes. /\n onSelectionChange?: (key: Key \| null) => void;\n icon?: ReactElement;\n rightIcon?: ReactNode;\n prefix?: ReactNode;\n suffix?: ReactNode;\n /* Description text for the trigger. Note: Different from field-level description. /\n triggerDescription?: ReactNode;\n descriptionPlacement?: 'inline' \| 'block';\n /* Keyboard shortcut that triggers the select when pressed /\n hotkeys?: string;\n /\n Tooltip content and configuration for the trigger:\n * - string: simple tooltip text\n * - true: auto tooltip on overflow (shows selected value as tooltip when truncated)\n * - object: advanced configuration with optional auto property\n /\n tooltip?:\n \| string\n \| boolean\n \| (Omit<CubeTooltipProviderProps, 'children'> & { auto?: boolean });\n triggerRef?: RefObject<HTMLButtonElement>;\n isLoading?: boolean;\n loadingIndicator?: ReactNode;\n overlayOffset?: number;\n hideTrigger?: boolean;\n /\n @deprecated Use `triggerStyles` instead\n /\n inputStyles?: Styles;\n optionStyles?: Styles;\n triggerStyles?: Styles;\n listBoxStyles?: Styles;\n overlayStyles?: Styles;\n direction?: 'top' \| 'bottom';\n shouldFlip?: boolean;\n /* Minimum padding in pixels between the popover and viewport edges /\n containerPadding?: number;\n inputProps?: Props;\n type?: 'outline' \| 'clear' \| 'primary' \| (string & {});\n /\n Shape of the trigger's border radius.\n * - `card` - Card shape with larger border radius (`1cr`)\n * - `button` - Button shape with default border radius (default)\n * - `sharp` - Sharp corners with no border radius (`0`)\n * - `pill` - Pill shape with fully rounded ends (`round`)\n * @default \"button\"\n /\n shape?: 'card' \| 'button' \| 'sharp' \| 'pill';\n suffixPosition?: 'before' \| 'after';\n theme?: 'default' \| 'special';\n /* Whether the select is clearable using a clear button in the rightIcon slot /\n isClearable?: boolean;\n /* Callback called when the clear button is pressed /\n onClear?: () => void;\n /* Callback called when the popover open state changes /\n onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport interface CubeSelectProps<T> extends CubeSelectBaseProps<T> {\n popoverRef?: RefObject<HTMLInputElement>;\n /* The ref for the list box. */\n listBoxRef?: RefObject<HTMLElement>;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n placeholder?: string;\n}\n\nconst PROP_STYLES = [...BASE_STYLES, ...OUTER_STYLES, ...COLOR_STYLES];\n\nfunction Select<T extends object>(\n props: CubeSelectProps<T>,\n ref: DOMRef<HTMLDivElement>,\n) {\n props = useProviderProps(props);\n props = useFormProps(props);\n props = useFieldProps(props, {\n defaultValidationTrigger: 'onChange',\n valuePropsMapper: ({ value, onChange }) => ({\n selectedKey: value ?? null,\n onSelectionChange: onChange,\n }),\n });\n\n let {\n qa,\n label,\n extra,\n icon,\n rightIcon,\n labelStyles,\n isRequired,\n necessityIndicator,\n validationState,\n prefix,\n isDisabled = props.isLoading \|\| false,\n autoFocus,\n inputProps,\n triggerRef,\n popoverRef,\n listBoxRef,\n isLoading,\n loadingIndicator,\n overlayOffset = 8,\n inputStyles,\n triggerStyles,\n optionStyles,\n listBoxStyles,\n overlayStyles,\n suffix,\n message,\n triggerDescription,\n descriptionPlacement,\n hotkeys,\n direction = 'bottom',\n shouldFlip = true,\n containerPadding = 8,\n placeholder,\n tooltip,\n size = 'medium',\n shape,\n styles,\n type = 'outline',\n theme = 'default',\n labelSuffix,\n suffixPosition = 'before',\n isClearable,\n onOpenChange,\n form,\n ...otherProps\n } = props;\n let state = useSelectState(props);\n\n // Generate a unique ID for this select instance\n const selectId = useMemo(() => generateRandomId(), []);\n\n // Get event bus for menu synchronization\n const { emit, on } = useEventBus();\n\n // Listen for other menus opening and close this one if needed\n useEffect(() => {\n const unsubscribe = on('popover:open', (data: { menuId: string }) => {\n // If another menu is opening and this select is open, close this one\n if (data.menuId !== selectId && state.isOpen) {\n state.close();\n }\n });\n\n return unsubscribe;\n }, [on, selectId, state]);\n\n // Emit event when this select opens\n useEffect(() => {\n if (state.isOpen) {\n emit('popover:open', { menuId: selectId });\n }\n }, [state.isOpen, emit, selectId]);\n\n // Call onOpenChange when open state changes\n useEffect(() => {\n onOpenChange?.(state.isOpen);\n }, [state.isOpen]);\n\n styles = extractStyles(otherProps, PROP_STYLES, styles);\n\n ref = useCombinedRefs(ref);\n triggerRef = useCombinedRefs(triggerRef);\n popoverRef = useCombinedRefs(popoverRef);\n listBoxRef = useCombinedRefs(listBoxRef);\n\n let { labelProps, triggerProps, valueProps, menuProps } = useSelect(\n props,\n state,\n triggerRef,\n );\n\n let { overlayProps, placement, updatePosition } = useOverlayPosition({\n targetRef: triggerRef,\n overlayRef: popoverRef,\n scrollRef: listBoxRef,\n placement: `${direction} end`,\n shouldFlip: shouldFlip,\n isOpen: state.isOpen,\n onClose: state.close,\n offset: overlayOffset,\n containerPadding: containerPadding,\n });\n\n let { isFocused, focusProps } = useFocus({ isDisabled }, true);\n let { hoverProps, isHovered } = useHover({ isDisabled });\n\n // Get props for the button based on the trigger props from useSelect\n let { buttonProps } = useButton(triggerProps, triggerRef);\n\n let isInvalid = validationState === 'invalid';\n\n let validationIcon = isInvalid ? InvalidIcon : ValidIcon;\n let validation = cloneElement(validationIcon);\n\n // Clear button logic\n let hasSelection = state.selectedItem != null;\n let showClearButton =\n isClearable && hasSelection && !isDisabled && !props.isReadOnly;\n\n // Clear function\n let clearValue = useEvent(() => {\n props.onSelectionChange?.(null);\n state.setSelectedKey(null);\n // Close the popup if it's open\n if (state.isOpen) {\n state.close();\n }\n // Return focus to the trigger for better UX\n triggerRef.current?.focus?.();\n\n props.onClear?.();\n });\n\n let triggerWidth = triggerRef?.current?.offsetWidth;\n\n const showPlaceholder = !!placeholder?.trim() && !state.selectedItem;\n\n const modifiers = useMemo(\n () => ({\n invalid: isInvalid,\n valid: validationState === 'valid',\n disabled: isDisabled,\n loading: isLoading,\n hovered: isHovered,\n focused: isFocused,\n placeholder: showPlaceholder,\n prefix: !!prefix,\n suffix: true,\n }),\n [\n validationState,\n isDisabled,\n isLoading,\n isHovered,\n isFocused,\n showPlaceholder,\n prefix,\n ],\n );\n\n suffix = useMemo(() => {\n if (!suffix && !validationState) {\n return null;\n }\n\n return (\n <>\n {suffix}\n {validationState ? validation : null}\n </>\n );\n }, [suffix, validationState, validation]);\n\n let selectField = (\n <SelectWrapperElement\n mods={modifiers}\n styles={styles}\n data-size={size}\n data-type={type}\n data-theme={theme}\n >\n <HiddenSelect\n state={state}\n triggerRef={triggerRef}\n label={props.label}\n name={props.name}\n />\n <Item\n as=\"button\"\n qa={qa \|\| 'Select'}\n data-input-type=\"select\"\n {...mergeProps(buttonProps, hoverProps, focusProps)}\n ref={triggerRef}\n data-popover-trigger\n styles={{ ...inputStyles, ...triggerStyles }}\n theme={theme}\n size={size}\n shape={shape}\n // Ensure this button never submits a surrounding form in tests or runtime\n htmlType=\"button\"\n // Preserve visual variant via data attribute instead of conflicting with HTML attribute\n type={type}\n mods={modifiers}\n prefix={prefix}\n suffix={suffix}\n icon={icon}\n rightIcon={\n rightIcon !== undefined ? (\n rightIcon\n ) : showClearButton ? (\n <ItemAction\n icon={<CloseIcon />}\n theme={validationState === 'invalid' ? 'danger' : undefined}\n qa=\"SelectClearButton\"\n mods={{ pressed: false }}\n onPress={clearValue}\n />\n ) : isLoading ? (\n <LoadingIcon />\n ) : (\n <DirectionIcon to={state.isOpen ? 'up' : 'down'} />\n )\n }\n description={triggerDescription}\n descriptionPlacement={descriptionPlacement}\n hotkeys={hotkeys}\n tooltip={tooltip}\n labelProps={valueProps}\n >\n {state.selectedItem ? (\n state.selectedItem.rendered\n ) : placeholder ? (\n <Text.Placeholder>{placeholder}</Text.Placeholder>\n ) : null}\n </Item>\n <ListBoxPopup\n {...menuProps}\n popoverRef={popoverRef}\n listBoxRef={listBoxRef}\n overlayProps={overlayProps}\n placement={placement}\n updatePosition={updatePosition}\n state={state}\n listBoxStyles={listBoxStyles}\n overlayStyles={overlayStyles}\n optionStyles={optionStyles}\n minWidth={triggerWidth}\n triggerRef={triggerRef}\n isDisabled={isDisabled}\n />\n </SelectWrapperElement>\n );\n\n return wrapWithField<Omit<CubeSelectProps<T>, 'children'>>(\n selectField,\n ref,\n mergeProps(\n {\n ...props,\n },\n { labelProps },\n ),\n );\n}\n\nexport function ListBoxPopup({\n state,\n popoverRef,\n listBoxRef,\n listBoxStyles,\n overlayStyles,\n optionStyles,\n overlayProps: parentOverlayProps,\n shouldUseVirtualFocus = false,\n placement,\n updatePosition,\n minWidth,\n size = 'small',\n triggerRef,\n isDisabled,\n ...otherProps\n}) {\n // For trigger+popover components, map 'small' size to 'medium' for list items\n // while preserving 'medium' and 'large' sizes\n const listItemSize = size === 'small' ? 'medium' : size;\n\n // Update position when overlay opens\n useLayoutEffect(() => {\n if (state.isOpen && updatePosition) {\n // Use triple RAF to ensure layout is complete before positioning\n // This gives enough time for the DisplayTransition and content to render\n return chainRaf(() => {\n updatePosition();\n }, 3);\n }\n }, [state.isOpen]);\n\n // Get props for the listbox\n let { listBoxProps } = useListBox(\n {\n autoFocus: state.focusStrategy \|\| true,\n shouldUseVirtualFocus,\n ...otherProps,\n },\n state,\n listBoxRef,\n );\n\n // Handle events that should cause the popup to close,\n // e.g. blur, clicking outside, or pressing the escape key.\n let { overlayProps } = useOverlay(\n {\n onClose: () => state.close(),\n shouldCloseOnBlur: true,\n isOpen: state.isOpen,\n isDismissable: true,\n shouldCloseOnInteractOutside: (el) => {\n const menuTriggerEl = el.closest('[data-popover-trigger]');\n // If no menu trigger was clicked, allow closing\n if (!menuTriggerEl) return true;\n // If the same trigger that opened this select was clicked, allow closing\n if (menuTriggerEl === triggerRef?.current) return true;\n // Otherwise, don't close (let event mechanism handle it)\n return false;\n },\n },\n popoverRef,\n );\n\n // Extract primary placement direction for consistent styling\n const placementDirection = placement?.split(' ')[0] \|\| 'bottom';\n\n // Wrap in <FocusScope> so that focus is restored back to the\n // trigger when the popup is closed. In addition, add hidden\n // <DismissButton> components at the start and end of the list\n // to allow screen reader users to dismiss the popup easily.\n return (\n <Portal>\n <DisplayTransition isShown={state.isOpen && !isDisabled}>\n {({ phase, isShown, ref: transitionRef }) => (\n <SelectOverlayWrapper\n {...overlayProps}\n {...parentOverlayProps}\n ref={popoverRef}\n style={parentOverlayProps?.style}\n >\n <OverlayElement\n ref={transitionRef}\n data-placement={placementDirection}\n data-phase={phase}\n mods={{\n open: isShown,\n }}\n styles={overlayStyles}\n style={{\n '--overlay-min-width': minWidth ? `${minWidth}px` : 'initial',\n }}\n >\n <FocusScope restoreFocus>\n <DismissButton onDismiss={() => state.close()} />\n {(() => {\n const renderedItems: React.ReactNode[] = [];\n let isFirstSection = true;\n\n for (const item of state.collection) {\n if (item.type === 'section') {\n if (!isFirstSection) {\n renderedItems.push(\n <ListDivider\n key={`divider-${String(item.key)}`}\n as=\"li\"\n role=\"separator\"\n aria-orientation=\"horizontal\"\n />,\n );\n }\n\n renderedItems.push(\n <SelectSection\n key={item.key}\n item={item}\n state={state}\n optionStyles={optionStyles}\n sectionStyles={undefined}\n shouldUseVirtualFocus={shouldUseVirtualFocus}\n size={listItemSize}\n />,\n );\n\n isFirstSection = false;\n } else {\n renderedItems.push(\n <Option\n key={item.key}\n item={item}\n state={state}\n styles={optionStyles}\n shouldUseVirtualFocus={shouldUseVirtualFocus}\n size={listItemSize}\n />,\n );\n }\n }\n\n return (\n <ListBoxElement\n styles={listBoxStyles}\n {...listBoxProps}\n ref={listBoxRef}\n >\n {renderedItems}\n </ListBoxElement>\n );\n })()}\n <DismissButton onDismiss={() => state.close()} />\n </FocusScope>\n </OverlayElement>\n </SelectOverlayWrapper>\n )}\n </DisplayTransition>\n </Portal>\n );\n}\n\nfunction Option({ item, state, styles, shouldUseVirtualFocus, size }) {\n let ref = useRef<HTMLLIElement>(null);\n let isDisabled = state.disabledKeys.has(item.key);\n let isSelected = state.selectionManager.isSelected(item.key);\n let isVirtualFocused = state.selectionManager.focusedKey === item.key;\n\n let { optionProps, isPressed, labelProps, descriptionProps } = useOption(\n {\n key: item.key,\n isDisabled,\n isSelected,\n shouldSelectOnPressUp: true,\n shouldFocusOnHover: true,\n shouldUseVirtualFocus,\n },\n state,\n ref,\n );\n\n // Handle focus events, so we can apply highlighted\n // style to the focused option\n let { isFocused, focusProps } = useFocus({ isDisabled });\n\n // Filter out service props - all remaining props can be passed to Item\n const filteredItemProps = filterCollectionItemProps(item.props);\n\n return (\n <OptionItem\n {...mergeProps(optionProps, focusProps, filteredItemProps)}\n ref={ref}\n mods={{\n listboxitem: true,\n selected: isSelected,\n focused: shouldUseVirtualFocus ? isVirtualFocused : isFocused,\n disabled: isDisabled,\n pressed: isPressed,\n }}\n data-size={size}\n styles={{\n ...(styles as Styles),\n ...(filteredItemProps.styles as Styles),\n }}\n labelProps={labelProps}\n descriptionProps={descriptionProps}\n defaultTooltipPlacement=\"right\"\n >\n {item.rendered}\n </OptionItem>\n );\n}\n\ninterface SelectSectionProps<T> {\n item: any; // react-stately Node<T>\n state: any; // TreeState<T>\n optionStyles?: Styles;\n headingStyles?: Styles;\n sectionStyles?: Styles;\n shouldUseVirtualFocus?: boolean;\n size?: string;\n}\n\nfunction SelectSection<T>(props: SelectSectionProps<T>) {\n const {\n item,\n state,\n optionStyles,\n headingStyles,\n sectionStyles,\n shouldUseVirtualFocus,\n size,\n } = props;\n\n const heading = item.rendered;\n\n const { itemProps, headingProps, groupProps } = useListBoxSection({\n heading,\n 'aria-label': item['aria-label'],\n });\n\n return (\n <ListSectionWrapper {...itemProps} styles={sectionStyles}>\n {heading && (\n <ListSectionHeading\n {...headingProps}\n size={size}\n styles={{ ...headingStyles, '$inline-compensation': '0px' }}\n >\n {heading}\n </ListSectionHeading>\n )}\n <ListBoxElement {...groupProps} mods={{ section: true }}>\n {[...item.childNodes]\n .filter((node: any) => state.collection.getItem(node.key))\n .map((node: any) => (\n <Option\n key={node.key}\n item={node}\n state={state}\n styles={optionStyles}\n shouldUseVirtualFocus={shouldUseVirtualFocus}\n size={size}\n />\n ))}\n </ListBoxElement>\n </ListSectionWrapper>\n );\n}\n\nconst _Select = forwardRefWithGenerics(Select);\n\n(_Select as any).cubeInputType = 'Select';\n\ntype SectionComponent = typeof BaseSection;\n\nconst SelectSectionComponent = Object.assign(BaseSection, {\n displayName: 'Section',\n}) as SectionComponent;\n\nconst __Select = Object.assign(\n _Select as typeof _Select & {\n Item: typeof CollectionItem;\n Section: typeof SelectSectionComponent;\n },\n {\n Item: CollectionItem,\n Section: SelectSectionComponent,\n },\n);\n\n(__Select as any).displayName = 'Select';\n\nexport { __Select as Select };\n\nexport type { AriaSelectProps };\nexport { useSelectState };\n"],"mappings":"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"}

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

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

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | Cube Dev Team */
 import { __Slider } from "./Slider.js";
 import { forwardRef, useCallback, useMemo, useState } from "react";
 import { jsx } from "react/jsx-runtime";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | 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 CHANGED Viewed

@@ -1,10 +1,11 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | Cube Dev Team */
+import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { Gradation } from "./Gradation.js";
 import { _SliderBase } from "./SliderBase.js";
 import { SliderThumb } from "./SliderThumb.js";
 import { SliderTrack } from "./SliderTrack.js";
-import { OUTER_STYLES, extractStyles } from "@tenphi/tasty";
+import { OUTER_STYLES } from "@tenphi/tasty";
 import { forwardRef } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";

package/dist/components/fields/Slider/Slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Slider.js","names":["SliderBase"],"sources":["../../../../src/components/fields/Slider/Slider.tsx"],"sourcesContent":["import { ~~extractStyles,~~ OUTER_STYLES, Styles, Tokens } from '@tenphi/tasty';\nimport { forwardRef } from 'react';\n\nimport { mergeProps } from '../../../utils/react/index';\n\nimport { Gradation } from './Gradation';\nimport {\n SliderBase,\n SliderBaseChildArguments,\n SliderBaseProps,\n} from './SliderBase';\nimport { SliderThumb } from './SliderThumb';\nimport { SliderTrack } from './SliderTrack';\n\nimport type { FocusableRef } from '@react-types/shared';\nimport type { CubeSliderBaseProps } from './types';\n\nexport interface CubeSliderProps extends CubeSliderBaseProps<number> {\n gradation?: string[];\n /** Custom styles for the track element /\n trackStyles?: Styles;\n /* Custom styles for the thumb element /\n thumbStyles?: Styles;\n /* Custom tokens for the thumb element (e.g., #slider-thumb for fill color) */\n thumbTokens?: Tokens;\n}\n\nfunction Slider(props: CubeSliderProps, ref: FocusableRef<HTMLDivElement>) {\n const {\n onChange,\n onChangeEnd,\n value,\n defaultValue,\n getValueLabel,\n isDisabled,\n styles,\n gradation,\n orientation,\n trackStyles,\n thumbStyles,\n thumbTokens,\n ...otherProps\n } = props;\n\n let baseProps: Omit<SliderBaseProps, 'children'> = {\n ...otherProps,\n // Normalize `value: number[]` to `value: number`\n value: value != null ? [value] : undefined,\n defaultValue: defaultValue != null ? [defaultValue] : undefined,\n onChange: (v: number[]): void => {\n onChange?.(v[0]);\n },\n onChangeEnd: (v: number[]): void => {\n onChangeEnd?.(v[0]);\n },\n getValueLabel: getValueLabel ? ([v]) => getValueLabel(v) : undefined,\n };\n\n const extractedStyles = extractStyles(otherProps, OUTER_STYLES, styles);\n\n return (\n <SliderBase\n {...mergeProps(otherProps, baseProps)}\n ref={ref}\n orientation={orientation}\n styles={extractedStyles}\n >\n {({ trackRef, inputRef, state }: SliderBaseChildArguments) => {\n return (\n <>\n <Gradation state={state} ranges={[0, 1]} values={gradation} />\n <SliderTrack\n state={state}\n isDisabled={isDisabled}\n orientation={orientation}\n styles={trackStyles}\n />\n <SliderThumb\n index={0}\n state={state}\n inputRef={inputRef}\n trackRef={trackRef}\n isDisabled={isDisabled}\n styles={thumbStyles}\n tokens={thumbTokens}\n />\n </>\n );\n }}\n </SliderBase>\n );\n}\n\nconst _Slider = forwardRef(Slider);\n\nconst __Slider = Object.assign(_Slider as typeof _Slider, {\n cubeInputType: 'Number',\n displayName: 'Slider',\n});\n\nexport { __Slider as Slider };\n"],"mappings":"~~;;;;;;;;;;;AA2BA~~,SAAS,OAAO,OAAwB,KAAmC;CACzE,MAAM,EACJ,UACA,aACA,OACA,cACA,eACA,YACA,QACA,WACA,aACA,aACA,aACA,aACA,GAAG,eACD;CAEJ,IAAI,YAA+C;EACjD,GAAG;EAEH,OAAO,SAAS,OAAO,CAAC,MAAM,GAAG;EACjC,cAAc,gBAAgB,OAAO,CAAC,aAAa,GAAG;EACtD,WAAW,MAAsB;AAC/B,cAAW,EAAE,GAAG;;EAElB,cAAc,MAAsB;AAClC,iBAAc,EAAE,GAAG;;EAErB,eAAe,iBAAiB,CAAC,OAAO,cAAc,EAAE,GAAG;EAC5D;CAED,MAAM,kBAAkB,cAAc,YAAY,cAAc,OAAO;AAEvE,QACE,oBAACA;EACC,GAAI,WAAW,YAAY,UAAU;EAChC;EACQ;EACb,QAAQ;aAEN,EAAE,UAAU,UAAU,YAAsC;AAC5D,UACE;IACE,oBAAC;KAAiB;KAAO,QAAQ,CAAC,GAAG,EAAE;KAAE,QAAQ;MAAa;IAC9D,oBAAC;KACQ;KACK;KACC;KACb,QAAQ;MACR;IACF,oBAAC;KACC,OAAO;KACA;KACG;KACA;KACE;KACZ,QAAQ;KACR,QAAQ;MACR;OACD;;GAGI;;AAIjB,MAAM,UAAU,WAAW,OAAO;AAElC,MAAM,WAAW,OAAO,OAAO,SAA2B;CACxD,eAAe;CACf,aAAa;CACd,CAAC"}
1	+ {"version":3,"file":"Slider.js","names":["SliderBase"],"sources":["../../../../src/components/fields/Slider/Slider.tsx"],"sourcesContent":["import { OUTER_STYLES, Styles, Tokens } from '@tenphi/tasty';\nimport { forwardRef } from 'react';\n\nimport { mergeProps } from '../../../utils/react/index';\nimport { extractStyles } from '../../../utils/styles';\n\nimport { Gradation } from './Gradation';\nimport {\n SliderBase,\n SliderBaseChildArguments,\n SliderBaseProps,\n} from './SliderBase';\nimport { SliderThumb } from './SliderThumb';\nimport { SliderTrack } from './SliderTrack';\n\nimport type { FocusableRef } from '@react-types/shared';\nimport type { CubeSliderBaseProps } from './types';\n\nexport interface CubeSliderProps extends CubeSliderBaseProps<number> {\n gradation?: string[];\n /** Custom styles for the track element /\n trackStyles?: Styles;\n /* Custom styles for the thumb element /\n thumbStyles?: Styles;\n /* Custom tokens for the thumb element (e.g., #slider-thumb for fill color) */\n thumbTokens?: Tokens;\n}\n\nfunction Slider(props: CubeSliderProps, ref: FocusableRef<HTMLDivElement>) {\n const {\n onChange,\n onChangeEnd,\n value,\n defaultValue,\n getValueLabel,\n isDisabled,\n styles,\n gradation,\n orientation,\n trackStyles,\n thumbStyles,\n thumbTokens,\n ...otherProps\n } = props;\n\n let baseProps: Omit<SliderBaseProps, 'children'> = {\n ...otherProps,\n // Normalize `value: number[]` to `value: number`\n value: value != null ? [value] : undefined,\n defaultValue: defaultValue != null ? [defaultValue] : undefined,\n onChange: (v: number[]): void => {\n onChange?.(v[0]);\n },\n onChangeEnd: (v: number[]): void => {\n onChangeEnd?.(v[0]);\n },\n getValueLabel: getValueLabel ? ([v]) => getValueLabel(v) : undefined,\n };\n\n const extractedStyles = extractStyles(otherProps, OUTER_STYLES, styles);\n\n return (\n <SliderBase\n {...mergeProps(otherProps, baseProps)}\n ref={ref}\n orientation={orientation}\n styles={extractedStyles}\n >\n {({ trackRef, inputRef, state }: SliderBaseChildArguments) => {\n return (\n <>\n <Gradation state={state} ranges={[0, 1]} values={gradation} />\n <SliderTrack\n state={state}\n isDisabled={isDisabled}\n orientation={orientation}\n styles={trackStyles}\n />\n <SliderThumb\n index={0}\n state={state}\n inputRef={inputRef}\n trackRef={trackRef}\n isDisabled={isDisabled}\n styles={thumbStyles}\n tokens={thumbTokens}\n />\n </>\n );\n }}\n </SliderBase>\n );\n}\n\nconst _Slider = forwardRef(Slider);\n\nconst __Slider = Object.assign(_Slider as typeof _Slider, {\n cubeInputType: 'Number',\n displayName: 'Slider',\n});\n\nexport { __Slider as Slider };\n"],"mappings":";;;;;;;;;;;;AA4BA,SAAS,OAAO,OAAwB,KAAmC;CACzE,MAAM,EACJ,UACA,aACA,OACA,cACA,eACA,YACA,QACA,WACA,aACA,aACA,aACA,aACA,GAAG,eACD;CAEJ,IAAI,YAA+C;EACjD,GAAG;EAEH,OAAO,SAAS,OAAO,CAAC,MAAM,GAAG;EACjC,cAAc,gBAAgB,OAAO,CAAC,aAAa,GAAG;EACtD,WAAW,MAAsB;AAC/B,cAAW,EAAE,GAAG;;EAElB,cAAc,MAAsB;AAClC,iBAAc,EAAE,GAAG;;EAErB,eAAe,iBAAiB,CAAC,OAAO,cAAc,EAAE,GAAG;EAC5D;CAED,MAAM,kBAAkB,cAAc,YAAY,cAAc,OAAO;AAEvE,QACE,oBAACA;EACC,GAAI,WAAW,YAAY,UAAU;EAChC;EACQ;EACb,QAAQ;aAEN,EAAE,UAAU,UAAU,YAAsC;AAC5D,UACE;IACE,oBAAC;KAAiB;KAAO,QAAQ,CAAC,GAAG,EAAE;KAAE,QAAQ;MAAa;IAC9D,oBAAC;KACQ;KACK;KACC;KACb,QAAQ;MACR;IACF,oBAAC;KACC,OAAO;KACA;KACG;KACA;KACE;KACZ,QAAQ;KACR,QAAQ;MACR;OACD;;GAGI;;AAIjB,MAAM,UAAU,WAAW,OAAO;AAElC,MAAM,WAAW,OAAO,OAAO,SAA2B;CACxD,eAAe;CACf,aAAa;CACd,CAAC"}

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

@@ -1,4 +1,5 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | 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";
 import { _Text } from "../../content/Text.js";
@@ -6,7 +7,7 @@ import { useFormProps } from "../../form/Form/Form.js";
 import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";
 import { wrapWithField } from "../../form/wrapper.js";
 import { SliderControlsElement, SliderElement } from "./elements.js";
-import { OUTER_STYLES, extractStyles, tasty } from "@tenphi/tasty";
+import { OUTER_STYLES, tasty } from "@tenphi/tasty";
 import { useMemo, useRef } from "react";
 import { jsx } from "react/jsx-runtime";
 import { useNumberFormatter, useSlider } from "react-aria";

package/dist/components/fields/Slider/SliderBase.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SliderBase.js","names":["Text","mergeProps"],"sources":["../../../../src/components/fields/Slider/SliderBase.tsx"],"sourcesContent":["import { useFocusableRef } from '@react-spectrum/utils';\nimport { DOMRef, FocusableRef } from '@react-types/shared';\nimport { ~~extractStyles,~~ OUTER_STYLES, tasty } from '@tenphi/tasty';\nimport {\n ForwardedRef,\n forwardRef,\n ReactNode,\n RefObject,\n useMemo,\n useRef,\n} from 'react';\nimport { useNumberFormatter, useSlider } from 'react-aria';\nimport { useSliderState } from 'react-stately';\n\nimport { forwardRefWithGenerics, mergeProps } from '../../../utils/react';\nimport { Text } from '../../content/Text';\nimport { useFieldProps, useFormProps, wrapWithField } from '../../form';\n\nimport { SliderControlsElement, SliderElement } from './elements';\n\nimport type { SliderState } from 'react-stately';\nimport type { CubeSliderBaseProps } from './types';\n\nexport interface SliderBaseChildArguments {\n inputRef: RefObject<HTMLInputElement>;\n trackRef: RefObject<HTMLElement>;\n state: SliderState;\n}\n\nexport interface SliderBaseProps<T = number[]> extends CubeSliderBaseProps<T> {\n children: (opts: SliderBaseChildArguments) => ReactNode;\n}\n\nconst LabelValueElement = tasty(Text, {\n styles: {\n display: 'block',\n textAlign: 'right',\n },\n});\n\nfunction SliderBase(allProps: SliderBaseProps, ref: DOMRef<HTMLDivElement>) {\n let props = useFormProps(allProps);\n props = useFieldProps(props, {\n defaultValidationTrigger: 'onChange',\n valuePropsMapper: ({ value, onChange }) => ({\n value: value != null ? value : undefined,\n onChange: onChange,\n }),\n });\n\n let {\n labelPosition,\n label,\n extra,\n styles,\n isRequired,\n validationState,\n message,\n description,\n requiredMark,\n labelSuffix,\n labelStyles,\n necessityIndicator,\n gradation,\n isDisabled,\n inputStyles,\n minValue = 0,\n maxValue = 100,\n inputWidth,\n formatOptions,\n getValueLabel,\n onChange,\n onChangeEnd,\n children,\n showValueLabel = true,\n orientation: formOrientation,\n form,\n labelProps: userLabelProps,\n ...otherProps\n } = props;\n\n let orientation = allProps.orientation \|\| 'horizontal';\n\n // `Math.abs(Math.sign(a) - Math.sign(b)) === 2` is true if the values have a different sign.\n let alwaysDisplaySign =\n Math.abs(Math.sign(minValue) - Math.sign(maxValue)) === 2;\n if (alwaysDisplaySign) {\n if (formatOptions != null) {\n if (!('signDisplay' in formatOptions)) {\n formatOptions = {\n ...formatOptions,\n signDisplay: 'exceptZero',\n };\n }\n } else {\n formatOptions = { signDisplay: 'exceptZero' };\n }\n }\n\n const formatter = useNumberFormatter(formatOptions);\n\n const state = useSliderState({\n ...props,\n orientation,\n numberFormatter: formatter,\n minValue,\n maxValue,\n });\n\n const trackRef = useRef<HTMLElement>(null);\n\n let { groupProps, trackProps, labelProps, outputProps } = useSlider(\n props,\n state,\n trackRef,\n );\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n let domRef = useFocusableRef(ref as any, inputRef);\n\n let displayValue = '';\n let maxLabelLength = 0;\n\n if (typeof getValueLabel === 'function') {\n displayValue = getValueLabel(state.values);\n switch (state.values.length) {\n case 1:\n maxLabelLength = Math.max(\n getValueLabel([minValue]).length,\n getValueLabel([maxValue]).length,\n );\n break;\n case 2:\n // Try all possible combinations of min and max values.\n maxLabelLength = Math.max(\n getValueLabel([minValue, minValue]).length,\n getValueLabel([minValue, maxValue]).length,\n getValueLabel([maxValue, minValue]).length,\n getValueLabel([maxValue, maxValue]).length,\n );\n break;\n default:\n throw new Error('Only sliders with 1 or 2 handles are supported!');\n }\n } else {\n maxLabelLength = Math.max(\n [...formatter.format(minValue)].length,\n [...formatter.format(maxValue)].length,\n );\n switch (state.values.length) {\n case 1:\n displayValue = state.getThumbValueLabel(0);\n break;\n case 2:\n // This should really use the NumberFormat#formatRange proposal...\n // https://github.com/tc39/ecma402/issues/393\n // https://github.com/tc39/proposal-intl-numberformat-v3#formatrange-ecma-402-393\n displayValue = `${state.getThumbValueLabel(\n 0,\n )} – ${state.getThumbValueLabel(1)}`;\n maxLabelLength =\n 3 +\n 2 *\n Math.max(\n maxLabelLength,\n [...formatter.format(minValue)].length,\n [...formatter.format(maxValue)].length,\n );\n break;\n default:\n throw new Error('Only sliders with 1 or 2 handles are supported!');\n }\n }\n\n extra =\n extra != null \|\| !showValueLabel ? (\n extra\n ) : (\n <LabelValueElement\n {...outputProps}\n style={\n maxLabelLength\n ? {\n width: `${maxLabelLength + 1}ch`,\n minWidth: `${maxLabelLength + 1}ch`,\n }\n : undefined\n }\n >\n {displayValue}\n </LabelValueElement>\n );\n\n const mods = useMemo(\n () => ({\n 'side-label': labelPosition === 'side',\n horizontal: orientation === 'horizontal',\n }),\n [labelPosition, orientation],\n );\n\n styles = extractStyles(otherProps, OUTER_STYLES, styles);\n\n const sliderField = (\n <SliderElement\n ref={domRef}\n id={props.id}\n {...groupProps}\n mods={mods}\n styles={styles}\n data-input-type=\"slider\"\n >\n <SliderControlsElement {...trackProps} ref={trackRef} mods={mods}>\n {children({\n trackRef,\n inputRef,\n state,\n })}\n </SliderControlsElement>\n </SliderElement>\n );\n\n return wrapWithField(sliderField, ref, {\n ...props,\n extra,\n labelProps: mergeProps(labelProps, userLabelProps),\n });\n}\n\nconst _SliderBase = forwardRefWithGenerics(SliderBase);\n\n(_SliderBase as any).displayName = 'SliderBase';\n\nexport { _SliderBase as SliderBase };\nexport { useSlider };\n"],"mappings":"~~;;;;;;;;;;;;;;;;AAiCA~~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"}
1	+ {"version":3,"file":"SliderBase.js","names":["Text","mergeProps"],"sources":["../../../../src/components/fields/Slider/SliderBase.tsx"],"sourcesContent":["import { useFocusableRef } from '@react-spectrum/utils';\nimport { DOMRef, FocusableRef } from '@react-types/shared';\nimport { OUTER_STYLES, tasty } from '@tenphi/tasty';\nimport {\n ForwardedRef,\n forwardRef,\n ReactNode,\n RefObject,\n useMemo,\n useRef,\n} from 'react';\nimport { useNumberFormatter, useSlider } from 'react-aria';\nimport { useSliderState } from 'react-stately';\n\nimport { forwardRefWithGenerics, mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { Text } from '../../content/Text';\nimport { useFieldProps, useFormProps, wrapWithField } from '../../form';\n\nimport { SliderControlsElement, SliderElement } from './elements';\n\nimport type { SliderState } from 'react-stately';\nimport type { CubeSliderBaseProps } from './types';\n\nexport interface SliderBaseChildArguments {\n inputRef: RefObject<HTMLInputElement>;\n trackRef: RefObject<HTMLElement>;\n state: SliderState;\n}\n\nexport interface SliderBaseProps<T = number[]> extends CubeSliderBaseProps<T> {\n children: (opts: SliderBaseChildArguments) => ReactNode;\n}\n\nconst LabelValueElement = tasty(Text, {\n styles: {\n display: 'block',\n textAlign: 'right',\n },\n});\n\nfunction SliderBase(allProps: SliderBaseProps, ref: DOMRef<HTMLDivElement>) {\n let props = useFormProps(allProps);\n props = useFieldProps(props, {\n defaultValidationTrigger: 'onChange',\n valuePropsMapper: ({ value, onChange }) => ({\n value: value != null ? value : undefined,\n onChange: onChange,\n }),\n });\n\n let {\n labelPosition,\n label,\n extra,\n styles,\n isRequired,\n validationState,\n message,\n description,\n requiredMark,\n labelSuffix,\n labelStyles,\n necessityIndicator,\n gradation,\n isDisabled,\n inputStyles,\n minValue = 0,\n maxValue = 100,\n inputWidth,\n formatOptions,\n getValueLabel,\n onChange,\n onChangeEnd,\n children,\n showValueLabel = true,\n orientation: formOrientation,\n form,\n labelProps: userLabelProps,\n ...otherProps\n } = props;\n\n let orientation = allProps.orientation \|\| 'horizontal';\n\n // `Math.abs(Math.sign(a) - Math.sign(b)) === 2` is true if the values have a different sign.\n let alwaysDisplaySign =\n Math.abs(Math.sign(minValue) - Math.sign(maxValue)) === 2;\n if (alwaysDisplaySign) {\n if (formatOptions != null) {\n if (!('signDisplay' in formatOptions)) {\n formatOptions = {\n ...formatOptions,\n signDisplay: 'exceptZero',\n };\n }\n } else {\n formatOptions = { signDisplay: 'exceptZero' };\n }\n }\n\n const formatter = useNumberFormatter(formatOptions);\n\n const state = useSliderState({\n ...props,\n orientation,\n numberFormatter: formatter,\n minValue,\n maxValue,\n });\n\n const trackRef = useRef<HTMLElement>(null);\n\n let { groupProps, trackProps, labelProps, outputProps } = useSlider(\n props,\n state,\n trackRef,\n );\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n let domRef = useFocusableRef(ref as any, inputRef);\n\n let displayValue = '';\n let maxLabelLength = 0;\n\n if (typeof getValueLabel === 'function') {\n displayValue = getValueLabel(state.values);\n switch (state.values.length) {\n case 1:\n maxLabelLength = Math.max(\n getValueLabel([minValue]).length,\n getValueLabel([maxValue]).length,\n );\n break;\n case 2:\n // Try all possible combinations of min and max values.\n maxLabelLength = Math.max(\n getValueLabel([minValue, minValue]).length,\n getValueLabel([minValue, maxValue]).length,\n getValueLabel([maxValue, minValue]).length,\n getValueLabel([maxValue, maxValue]).length,\n );\n break;\n default:\n throw new Error('Only sliders with 1 or 2 handles are supported!');\n }\n } else {\n maxLabelLength = Math.max(\n [...formatter.format(minValue)].length,\n [...formatter.format(maxValue)].length,\n );\n switch (state.values.length) {\n case 1:\n displayValue = state.getThumbValueLabel(0);\n break;\n case 2:\n // This should really use the NumberFormat#formatRange proposal...\n // https://github.com/tc39/ecma402/issues/393\n // https://github.com/tc39/proposal-intl-numberformat-v3#formatrange-ecma-402-393\n displayValue = `${state.getThumbValueLabel(\n 0,\n )} – ${state.getThumbValueLabel(1)}`;\n maxLabelLength =\n 3 +\n 2 *\n Math.max(\n maxLabelLength,\n [...formatter.format(minValue)].length,\n [...formatter.format(maxValue)].length,\n );\n break;\n default:\n throw new Error('Only sliders with 1 or 2 handles are supported!');\n }\n }\n\n extra =\n extra != null \|\| !showValueLabel ? (\n extra\n ) : (\n <LabelValueElement\n {...outputProps}\n style={\n maxLabelLength\n ? {\n width: `${maxLabelLength + 1}ch`,\n minWidth: `${maxLabelLength + 1}ch`,\n }\n : undefined\n }\n >\n {displayValue}\n </LabelValueElement>\n );\n\n const mods = useMemo(\n () => ({\n 'side-label': labelPosition === 'side',\n horizontal: orientation === 'horizontal',\n }),\n [labelPosition, orientation],\n );\n\n styles = extractStyles(otherProps, OUTER_STYLES, styles);\n\n const sliderField = (\n <SliderElement\n ref={domRef}\n id={props.id}\n {...groupProps}\n mods={mods}\n styles={styles}\n data-input-type=\"slider\"\n >\n <SliderControlsElement {...trackProps} ref={trackRef} mods={mods}>\n {children({\n trackRef,\n inputRef,\n state,\n })}\n </SliderControlsElement>\n </SliderElement>\n );\n\n return wrapWithField(sliderField, ref, {\n ...props,\n extra,\n labelProps: mergeProps(labelProps, userLabelProps),\n });\n}\n\nconst _SliderBase = forwardRefWithGenerics(SliderBase);\n\n(_SliderBase as any).displayName = 'SliderBase';\n\nexport { _SliderBase as SliderBase };\nexport { useSlider };\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { SliderThumbElement } from "./elements.js";
 import { useMemo, useRef } from "react";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | Cube Dev Team */
 import { SliderTrackContainerElement } from "./elements.js";
 import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";

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

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

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | 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 CHANGED Viewed

@@ -1,4 +1,5 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | 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";
 import { _Text } from "../../content/Text.js";
@@ -10,7 +11,7 @@ import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";
 import { wrapWithField } from "../../form/wrapper.js";
 import { castNullableIsSelected } from "../../../utils/react/nullableValue.js";
 import { HiddenInput } from "../../HiddenInput.js";
-import { BLOCK_STYLES, OUTER_STYLES, extractStyles, tasty } from "@tenphi/tasty";
+import { BLOCK_STYLES, OUTER_STYLES, tasty } from "@tenphi/tasty";
 import { forwardRef, useRef } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useHover, useSwitch } from "react-aria";

package/dist/components/fields/Switch/Switch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Switch.js","names":["useId","useFocus","mergeProps","Text"],"sources":["../../../../src/components/fields/Switch/Switch.tsx"],"sourcesContent":["import { useFocusableRef } from '@react-spectrum/utils';\nimport {\n BaseProps,\n BLOCK_STYLES,\n BlockStyleProps,\n ~~extractStyles,\n~~ OUTER_STYLES,\n OuterStyleProps,\n Styles,\n tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, useRef } from 'react';\nimport { AriaSwitchProps, useHover, useSwitch } from 'react-aria';\nimport { useToggleState } from 'react-stately';\n\nimport { LoadingIcon } from '../../../icons';\nimport { useProviderProps } from '../../../provider';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFocus } from '../../../utils/react/interactions';\nimport {\n castNullableIsSelected,\n WithNullableSelected,\n} from '../../../utils/react/nullableValue';\nimport { useId } from '../../../utils/react/useId';\nimport { Text } from '../../content/Text';\nimport { useFieldProps, useFormProps, wrapWithField } from '../../form';\nimport { HiddenInput } from '../../HiddenInput';\n\nconst SwitchWrapperElement = tasty({\n as: 'label',\n styles: {\n display: 'flex',\n position: 'relative',\n placeItems: {\n '': 'center stretch',\n 'side-label': 'baseline stretch',\n },\n gap: '1x',\n width: 'max max-content',\n color: '#dark-02',\n },\n});\n\nconst SwitchElement = tasty({\n qa: 'Switch',\n styles: {\n boxSizing: 'border-box',\n position: 'relative',\n verticalAlign: 'baseline',\n placeSelf: 'center',\n radius: 'round',\n fill: {\n '': '#white',\n checked: '#primary',\n disabled: '#border.5',\n 'disabled & checked': '#border',\n },\n color: {\n '': '#dark-03',\n checked: '#white',\n },\n border: {\n '': '#dark-05',\n checked: '#primary-text',\n disabled: '#dark-05.5',\n invalid: '#danger',\n },\n width: {\n '': '5x 5x',\n 'size=medium': '4x 4x',\n 'size=small': '3x 3x',\n },\n height: {\n '': '3x 3x',\n 'size=medium': '2.5x 2.5x',\n 'size=small': '2x 2x',\n },\n outline: {\n '': '#primary-text.0',\n focused: '1bw #primary-text',\n },\n outlineOffset: 1,\n transition: 'theme',\n cursor: '$pointer',\n\n Thumb: {\n position: 'absolute',\n width: {\n '': '2x 2x',\n 'size=medium': '1.5x 1.5x',\n 'size=small': '1.25x 1.25x',\n },\n height: {\n '': '2x 2x',\n 'size=medium': '1.5x 1.5x',\n 'size=small': '1.25x 1.25x',\n },\n radius: 'round',\n fill: {\n '': 'currentColor',\n disabled: '#current.5',\n 'disabled & checked': '#white.8',\n },\n top: {\n '': '.375x',\n 'size=medium': '.375x',\n 'size=small': '.25x',\n },\n left: {\n '': '.375x',\n 'size=medium': '.375x',\n 'size=small': '.25x',\n checked: '2.25x',\n 'checked & size=medium': '1.75x',\n 'checked & size=small': '1.25x',\n },\n transition: 'left, theme',\n cursor: '$pointer',\n },\n },\n});\n\nconst PROP_STYLES = [...OUTER_STYLES, ...BLOCK_STYLES];\n\nexport interface CubeSwitchProps\n extends BaseProps,\n OuterStyleProps,\n BlockStyleProps,\n FieldBaseProps,\n AriaSwitchProps {\n inputStyles?: Styles;\n isLoading?: boolean;\n size?: 'large' \| 'medium' \| 'small';\n}\n\nfunction Switch(props: WithNullableSelected<CubeSwitchProps>, ref) {\n props = castNullableIsSelected(props);\n props = useProviderProps(props);\n props = useFormProps(props);\n props = useFieldProps(props, {\n defaultValidationTrigger: 'onChange',\n valuePropsMapper: ({ value, onChange }) => ({\n isSelected: value != null ? value : false,\n isIndeterminate: false,\n onChange: onChange,\n }),\n });\n\n let {\n qa,\n isDisabled = false,\n children,\n label,\n insideForm,\n isLoading,\n labelPosition,\n inputStyles,\n validationState,\n size = 'medium',\n form,\n } = props;\n\n const id = useId(props.id);\n\n let styles = extractStyles(props, PROP_STYLES);\n\n let { isFocused, focusProps } = useFocus({ isDisabled }, true);\n let { hoverProps, isHovered } = useHover({ isDisabled });\n\n let inputRef = useRef(null);\n let domRef = useFocusableRef(ref, inputRef);\n\n let { inputProps } = useSwitch(props, useToggleState(props), inputRef);\n\n const mods = {\n checked: inputProps.checked,\n disabled: isDisabled,\n hovered: isHovered,\n focused: isFocused,\n invalid: validationState === 'invalid',\n valid: validationState === 'valid',\n 'inside-form': insideForm,\n 'side-label': labelPosition === 'side',\n };\n\n const switchField = (\n <SwitchWrapperElement\n qa=\"SwitchWrapper\"\n mods={mods}\n data-size={size}\n styles={styles}\n {...hoverProps}\n >\n <HiddenInput\n qa={qa \|\| 'Switch'}\n data-input-type=\"switch\"\n {...mergeProps(inputProps, focusProps)}\n ref={inputRef}\n id={id}\n />\n <SwitchElement mods={mods} data-size={size} styles={inputStyles}>\n <div data-element=\"Thumb\" aria-hidden=\"true\" />\n </SwitchElement>\n {children ? <Text nowrap>{children}</Text> : null}\n {isLoading ? (\n <>\n {label ? <> </> : null}\n <LoadingIcon />\n </>\n ) : null}\n </SwitchWrapperElement>\n );\n\n return wrapWithField(switchField, domRef, {\n ...props,\n id,\n labelProps: {\n ...props.labelProps,\n for: id,\n },\n children: null,\n inputStyles,\n });\n}\n\n/*\n Switches allow users to turn an individual option on or off.\n * They are usually used to activate or deactivate a specific setting.\n */\nlet _Switch = forwardRef(Switch);\n\n(_Switch as any).cubeInputType = 'Checkbox';\n_Switch.displayName = 'Switch';\n\nexport { _Switch as Switch };\nexport type { AriaSwitchProps };\nexport { useSwitch };\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;~~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"}
1	+ {"version":3,"file":"Switch.js","names":["useId","useFocus","mergeProps","Text"],"sources":["../../../../src/components/fields/Switch/Switch.tsx"],"sourcesContent":["import { useFocusableRef } from '@react-spectrum/utils';\nimport {\n BaseProps,\n BLOCK_STYLES,\n BlockStyleProps,\n OUTER_STYLES,\n OuterStyleProps,\n Styles,\n tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, useRef } from 'react';\nimport { AriaSwitchProps, useHover, useSwitch } from 'react-aria';\nimport { useToggleState } from 'react-stately';\n\nimport { LoadingIcon } from '../../../icons';\nimport { useProviderProps } from '../../../provider';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFocus } from '../../../utils/react/interactions';\nimport {\n castNullableIsSelected,\n WithNullableSelected,\n} from '../../../utils/react/nullableValue';\nimport { useId } from '../../../utils/react/useId';\nimport { extractStyles } from '../../../utils/styles';\nimport { Text } from '../../content/Text';\nimport { useFieldProps, useFormProps, wrapWithField } from '../../form';\nimport { HiddenInput } from '../../HiddenInput';\n\nconst SwitchWrapperElement = tasty({\n as: 'label',\n styles: {\n display: 'flex',\n position: 'relative',\n placeItems: {\n '': 'center stretch',\n 'side-label': 'baseline stretch',\n },\n gap: '1x',\n width: 'max max-content',\n color: '#dark-02',\n },\n});\n\nconst SwitchElement = tasty({\n qa: 'Switch',\n styles: {\n boxSizing: 'border-box',\n position: 'relative',\n verticalAlign: 'baseline',\n placeSelf: 'center',\n radius: 'round',\n fill: {\n '': '#white',\n checked: '#primary',\n disabled: '#border.5',\n 'disabled & checked': '#border',\n },\n color: {\n '': '#dark-03',\n checked: '#white',\n },\n border: {\n '': '#dark-05',\n checked: '#primary-text',\n disabled: '#dark-05.5',\n invalid: '#danger',\n },\n width: {\n '': '5x 5x',\n 'size=medium': '4x 4x',\n 'size=small': '3x 3x',\n },\n height: {\n '': '3x 3x',\n 'size=medium': '2.5x 2.5x',\n 'size=small': '2x 2x',\n },\n outline: {\n '': '#primary-text.0',\n focused: '1bw #primary-text',\n },\n outlineOffset: 1,\n transition: 'theme',\n cursor: '$pointer',\n\n Thumb: {\n position: 'absolute',\n width: {\n '': '2x 2x',\n 'size=medium': '1.5x 1.5x',\n 'size=small': '1.25x 1.25x',\n },\n height: {\n '': '2x 2x',\n 'size=medium': '1.5x 1.5x',\n 'size=small': '1.25x 1.25x',\n },\n radius: 'round',\n fill: {\n '': 'currentColor',\n disabled: '#current.5',\n 'disabled & checked': '#white.8',\n },\n top: {\n '': '.375x',\n 'size=medium': '.375x',\n 'size=small': '.25x',\n },\n left: {\n '': '.375x',\n 'size=medium': '.375x',\n 'size=small': '.25x',\n checked: '2.25x',\n 'checked & size=medium': '1.75x',\n 'checked & size=small': '1.25x',\n },\n transition: 'left, theme',\n cursor: '$pointer',\n },\n },\n});\n\nconst PROP_STYLES = [...OUTER_STYLES, ...BLOCK_STYLES];\n\nexport interface CubeSwitchProps\n extends BaseProps,\n OuterStyleProps,\n BlockStyleProps,\n FieldBaseProps,\n AriaSwitchProps {\n inputStyles?: Styles;\n isLoading?: boolean;\n size?: 'large' \| 'medium' \| 'small';\n}\n\nfunction Switch(props: WithNullableSelected<CubeSwitchProps>, ref) {\n props = castNullableIsSelected(props);\n props = useProviderProps(props);\n props = useFormProps(props);\n props = useFieldProps(props, {\n defaultValidationTrigger: 'onChange',\n valuePropsMapper: ({ value, onChange }) => ({\n isSelected: value != null ? value : false,\n isIndeterminate: false,\n onChange: onChange,\n }),\n });\n\n let {\n qa,\n isDisabled = false,\n children,\n label,\n insideForm,\n isLoading,\n labelPosition,\n inputStyles,\n validationState,\n size = 'medium',\n form,\n } = props;\n\n const id = useId(props.id);\n\n let styles = extractStyles(props, PROP_STYLES);\n\n let { isFocused, focusProps } = useFocus({ isDisabled }, true);\n let { hoverProps, isHovered } = useHover({ isDisabled });\n\n let inputRef = useRef(null);\n let domRef = useFocusableRef(ref, inputRef);\n\n let { inputProps } = useSwitch(props, useToggleState(props), inputRef);\n\n const mods = {\n checked: inputProps.checked,\n disabled: isDisabled,\n hovered: isHovered,\n focused: isFocused,\n invalid: validationState === 'invalid',\n valid: validationState === 'valid',\n 'inside-form': insideForm,\n 'side-label': labelPosition === 'side',\n };\n\n const switchField = (\n <SwitchWrapperElement\n qa=\"SwitchWrapper\"\n mods={mods}\n data-size={size}\n styles={styles}\n {...hoverProps}\n >\n <HiddenInput\n qa={qa \|\| 'Switch'}\n data-input-type=\"switch\"\n {...mergeProps(inputProps, focusProps)}\n ref={inputRef}\n id={id}\n />\n <SwitchElement mods={mods} data-size={size} styles={inputStyles}>\n <div data-element=\"Thumb\" aria-hidden=\"true\" />\n </SwitchElement>\n {children ? <Text nowrap>{children}</Text> : null}\n {isLoading ? (\n <>\n {label ? <> </> : null}\n <LoadingIcon />\n </>\n ) : null}\n </SwitchWrapperElement>\n );\n\n return wrapWithField(switchField, domRef, {\n ...props,\n id,\n labelProps: {\n ...props.labelProps,\n for: id,\n },\n children: null,\n inputStyles,\n });\n}\n\n/*\n Switches allow users to turn an individual option on or off.\n * They are usually used to activate or deactivate a specific setting.\n */\nlet _Switch = forwardRef(Switch);\n\n(_Switch as any).cubeInputType = 'Checkbox';\n_Switch.displayName = 'Switch';\n\nexport { _Switch as Switch };\nexport type { AriaSwitchProps };\nexport { useSwitch };\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | 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 CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useProviderProps } from "../../../provider.js";
 import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";

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

@@ -1,4 +1,5 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | 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";
 import { useFocus as useFocus$1 } from "../../../utils/react/interactions.js";
@@ -9,7 +10,7 @@ import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";
 import { wrapWithField } from "../../form/wrapper.js";
 import { InvalidIcon } from "../../shared/InvalidIcon.js";
 import { ValidIcon } from "../../shared/ValidIcon.js";
-import { BASE_STYLES, BLOCK_STYLES, COLOR_STYLES, OUTER_STYLES, extractStyles, tasty } from "@tenphi/tasty";
+import { BASE_STYLES, BLOCK_STYLES, COLOR_STYLES, OUTER_STYLES, tasty } from "@tenphi/tasty";
 import { cloneElement, forwardRef, useImperativeHandle, useMemo, useRef } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useHover } from "react-aria";

package/dist/components/fields/TextInput/TextInputBase.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextInputBase.js","names":["useFocus","mergeProps"],"sources":["../../../../src/components/fields/TextInput/TextInputBase.tsx"],"sourcesContent":["import { createFocusableRef } from '@react-spectrum/utils';\nimport {\n BASE_STYLES,\n BaseProps,\n BaseStyleProps,\n BLOCK_STYLES,\n BlockStyleProps,\n COLOR_STYLES,\n ColorStyleProps,\n extractStyles,\n OUTER_STYLES,\n OuterStyleProps,\n Props,\n Styles,\n tasty,\n} from '@tenphi/tasty';\nimport {\n cloneElement,\n forwardRef,\n ReactElement,\n ReactNode,\n RefObject,\n useImperativeHandle,\n useMemo,\n useRef,\n} from 'react';\nimport { AriaNumberFieldProps, AriaTextFieldProps, useHover } from 'react-aria';\n\nimport { LoadingIcon } from '../../../icons';\nimport { useProviderProps } from '../../../provider';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps, useCombinedRefs } from '../../../utils/react';\nimport { useFocus } from '../../../utils/react/interactions';\nimport { useFieldProps, useFormProps, wrapWithField } from '../../form';\nimport { InvalidIcon } from '../../shared/InvalidIcon';\nimport { ValidIcon } from '../../shared/ValidIcon';\n\nconst ADD_STYLES = {\n $: '>',\n display: 'grid',\n placeContent: 'stretch',\n placeItems: 'center',\n gridRows: '1sf',\n flow: 'column',\n gap: 0,\n cursor: 'inherit',\n opacity: {\n '': 1,\n disabled: '$disabled-opacity',\n },\n};\n\nexport const INPUT_WRAPPER_STYLES: Styles = {\n display: 'grid',\n flow: 'row',\n position: 'relative',\n gridColumns: {\n '': '1sf',\n prefix: 'max-content 1sf',\n suffix: '1sf max-content',\n 'prefix & suffix': 'max-content 1sf max-content',\n },\n gridRows: '1sf',\n placeItems: 'stretch',\n fill: {\n '': '#white',\n disabled: '#dark.04',\n },\n border: {\n '': true,\n valid: '#success-text.50',\n invalid: '#danger-text.50',\n focused: '#primary-text',\n 'valid & focused': '#success-text',\n 'invalid & focused': '#danger-text',\n disabled: true,\n },\n preset: 't3',\n radius: true,\n cursor: 'text',\n color: {\n '': '#dark-02',\n focused: '#dark-02',\n invalid: '#danger-text',\n disabled: '#dark.30',\n },\n zIndex: {\n '': 'initial',\n focused: 1,\n },\n boxSizing: 'border-box',\n transition: 'theme',\n backgroundClip: 'content-box',\n height: {\n '': '$size $size',\n multiline: 'min $size',\n },\n\n $size: {\n '': '$size-md',\n 'size=small': '$size-sm',\n 'size=medium': '$size-md',\n 'size=large': '$size-lg',\n },\n\n Prefix: ADD_STYLES,\n\n Suffix: ADD_STYLES,\n\n State: {\n $: '> Suffix >',\n display: 'flex',\n },\n\n InputIcon: {\n display: 'grid',\n placeItems: 'center',\n width: 'min $size-sm',\n color: 'inherit',\n fontSize: '$icon-size',\n },\n\n ValidationIcon: {\n $: '> Suffix > State >',\n display: 'grid',\n placeItems: 'center',\n width: {\n '': 'min $size-sm',\n suffix: 'min $size-xs',\n },\n fontSize: '$icon-size',\n },\n};\n\nconst InputWrapperElement = tasty({\n qa: 'InputWrapper',\n styles: INPUT_WRAPPER_STYLES,\n});\n\nconst PROP_STYLES = [\n ...BASE_STYLES,\n ...OUTER_STYLES,\n ...BLOCK_STYLES,\n ...COLOR_STYLES,\n];\n\nexport const DEFAULT_INPUT_STYLES: Styles = {\n recipe: 'reset input / input-autofill',\n placeSelf: 'stretch',\n width: 'initial 100% 100%',\n transition: 'theme',\n radius: true,\n padding: '$vertical-padding $right-padding $vertical-padding $left-padding',\n textAlign: 'left',\n preset: 't3',\n flexGrow: 1,\n margin: {\n '': 0,\n multiline: '((($size-md - 1lh) / 2) - 1bw) 0',\n 'multiline & size=small': '((($size-sm - 1lh) / 2) - 1bw) 0',\n 'multiline & size=large': '((($size-lg - 1lh) / 2) - 1bw) 0',\n },\n resize: 'none',\n userSelect: 'auto',\n\n Placeholder: {\n $: '::placeholder',\n recipe: 'input-placeholder',\n },\n '&::-webkit-search-cancel-button': {\n recipe: 'input-search-cancel-button',\n },\n\n '$vertical-padding': 0,\n '$left-padding': {\n '': '(1x - 1bw)',\n 'size=small': '(1x - 1bw)',\n 'size=large': '(1.25x - 1bw)',\n 'size=xlarge': '(1.5x - 1bw)',\n prefix: '0',\n },\n '$right-padding': {\n '': '(1x - 1bw)',\n 'size=small': '(1x - 1bw)',\n 'size=large': '(1.25x - 1bw)',\n 'size=xlarge': '(1.5x - 1bw)',\n suffix: '0',\n },\n};\n\nconst InputElement = tasty({ qa: 'Input', styles: DEFAULT_INPUT_STYLES });\n\nexport interface CubeTextInputBaseProps\n extends BaseProps,\n OuterStyleProps,\n BlockStyleProps,\n BaseStyleProps,\n ColorStyleProps,\n Omit<AriaTextFieldProps, 'validate'>,\n FieldBaseProps {\n validate?: AriaTextFieldProps['validate'] \| AriaNumberFieldProps['validate'];\n /** Left input icon /\n icon?: ReactElement \| null;\n /* Input decoration before the main input /\n prefix?: ReactNode;\n /* Input decoration after the main input /\n suffix?: ReactNode;\n /* Suffix position goes before or after the validation and loading statuses /\n suffixPosition?: 'before' \| 'after';\n /* Whether the input is multiline /\n multiLine?: boolean;\n /* Whether the input should have autofocus /\n autoFocus?: boolean;\n /* Direct input props /\n inputProps?: Props;\n /* Direct input wrapper props /\n wrapperProps?: Props;\n /* The input ref /\n inputRef?: RefObject<HTMLInputElement \| HTMLTextAreaElement>;\n /* The wrapper ref /\n wrapperRef?: RefObject<HTMLDivElement>;\n /* Whether the input has the loading status /\n isLoading?: boolean;\n /* The loading status indicator /\n loadingIndicator?: ReactNode;\n /* Style map for the input /\n inputStyles?: Styles;\n /* The number of rows for the input. Only applies to textarea. /\n rows?: number;\n /* The resize CSS property sets whether an element is resizable, and if so, in which directions. /\n resize?: Styles['resize'];\n /* The size of the input */\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n autocomplete?: string;\n}\n\nfunction _TextInputBase(props: CubeTextInputBaseProps, ref) {\n props = useProviderProps(props);\n props = useFormProps(props);\n props = useFieldProps(props, {\n defaultValidationTrigger: 'onBlur',\n valuePropsMapper: ({ value, onChange }) => ({\n value:\n typeof value === 'string' \|\| typeof value === 'number'\n ? String(value)\n : '',\n onChange,\n }),\n });\n\n let {\n qa,\n mods,\n validationState,\n prefix,\n isDisabled,\n multiLine,\n autoFocus,\n inputProps,\n wrapperProps,\n inputRef,\n isLoading,\n loadingIndicator,\n value,\n inputStyles = {},\n suffix,\n suffixPosition = 'before',\n wrapperRef,\n tooltip,\n rows = 1,\n size = 'medium',\n autocomplete,\n icon,\n maxLength,\n minLength,\n form,\n resize,\n ...otherProps\n } = props;\n\n let styles = extractStyles(otherProps, PROP_STYLES);\n let type = otherProps.type;\n\n if (resize) {\n inputStyles = { ...inputStyles, resize };\n }\n\n let ElementType: 'textarea' \| 'input' = multiLine ? 'textarea' : 'input';\n let { isFocused, focusProps } = useFocus({ isDisabled });\n let { hoverProps, isHovered } = useHover({ isDisabled });\n let domRef = useRef(null);\n\n inputRef = useCombinedRefs(inputRef);\n\n // Expose imperative interface for ref\n useImperativeHandle(ref, () => ({\n ...createFocusableRef(domRef, inputRef),\n select() {\n if (inputRef?.current) {\n inputRef.current.select();\n }\n },\n getInputElement() {\n return inputRef?.current;\n },\n }));\n\n let isInvalid = validationState === 'invalid';\n let validationIcon = isInvalid ? InvalidIcon : ValidIcon;\n let validation = cloneElement(validationIcon);\n\n // Fix safari bug: https://github.com/philipwalton/flexbugs/issues/270\n if (!inputProps?.placeholder) {\n if (!inputProps) {\n inputProps = {};\n }\n\n inputProps.placeholder = ' ';\n }\n\n if (icon) {\n icon = <div data-element=\"InputIcon\">{icon}</div>;\n\n if (prefix) {\n prefix = (\n <>\n {icon}\n {prefix}\n </>\n );\n } else {\n prefix = icon;\n }\n }\n\n const modifiers = useMemo(\n () => ({\n invalid: isInvalid,\n valid: validationState === 'valid',\n loadable: !!loadingIndicator,\n focused: isFocused,\n hovered: isHovered,\n disabled: isDisabled,\n multiline: multiLine,\n prefix: !!prefix,\n suffix: (validationState && !isLoading) \|\| isLoading \|\| !!suffix,\n ...mods,\n }),\n [\n mods,\n isInvalid,\n validationState,\n loadingIndicator,\n isFocused,\n isDisabled,\n isHovered,\n multiLine,\n prefix,\n suffix,\n ],\n );\n\n const hasTextSecurity = multiLine && type === 'password';\n const textSecurityStyles =\n hasTextSecurity && inputProps.value?.length\n ? {\n fontFamily: 'text-security-disc',\n }\n : {};\n\n const textField = (\n <InputWrapperElement\n ref={wrapperRef}\n mods={modifiers}\n data-size={size}\n styles={styles}\n {...wrapperProps}\n >\n {prefix ? <div data-element=\"Prefix\">{prefix}</div> : null}\n <InputElement\n qa={qa \|\| 'Input'}\n as={ElementType}\n data-input-type=\"textinput\"\n {...mergeProps(inputProps, focusProps, hoverProps)}\n ref={inputRef}\n rows={multiLine ? rows : undefined}\n mods={modifiers}\n style={textSecurityStyles}\n data-autofocus={autoFocus ? '' : undefined}\n autoFocus={autoFocus}\n data-size={size}\n autoComplete={autocomplete}\n styles={inputStyles}\n disabled={!!isDisabled}\n maxLength={maxLength}\n minLength={minLength}\n />\n {(validationState && !isLoading) \|\| isLoading \|\| suffix ? (\n <div data-element=\"Suffix\">\n {suffixPosition === 'before' ? suffix : null}\n {(validationState && !isLoading) \|\| isLoading ? (\n <div data-element=\"State\">\n {validationState && !isLoading ? validation : null}\n {isLoading && <LoadingIcon data-element=\"InputIcon\" />}\n </div>\n ) : null}\n {suffixPosition === 'after' ? suffix : null}\n </div>\n ) : null}\n </InputWrapperElement>\n );\n\n return wrapWithField(textField, domRef, {\n ...props,\n form: undefined,\n });\n}\n\nconst TextInputBase = forwardRef(_TextInputBase);\n\nexport { TextInputBase };\nexport type { AriaTextFieldProps };\n"],"mappings":"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"}
1	+ {"version":3,"file":"TextInputBase.js","names":["useFocus","mergeProps"],"sources":["../../../../src/components/fields/TextInput/TextInputBase.tsx"],"sourcesContent":["import { createFocusableRef } from '@react-spectrum/utils';\nimport {\n BASE_STYLES,\n BaseProps,\n BaseStyleProps,\n BLOCK_STYLES,\n BlockStyleProps,\n COLOR_STYLES,\n ColorStyleProps,\n OUTER_STYLES,\n OuterStyleProps,\n Props,\n Styles,\n tasty,\n} from '@tenphi/tasty';\nimport {\n cloneElement,\n forwardRef,\n ReactElement,\n ReactNode,\n RefObject,\n useImperativeHandle,\n useMemo,\n useRef,\n} from 'react';\nimport { AriaNumberFieldProps, AriaTextFieldProps, useHover } from 'react-aria';\n\nimport { LoadingIcon } from '../../../icons';\nimport { useProviderProps } from '../../../provider';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps, useCombinedRefs } from '../../../utils/react';\nimport { useFocus } from '../../../utils/react/interactions';\nimport { extractStyles } from '../../../utils/styles';\nimport { useFieldProps, useFormProps, wrapWithField } from '../../form';\nimport { InvalidIcon } from '../../shared/InvalidIcon';\nimport { ValidIcon } from '../../shared/ValidIcon';\n\nconst ADD_STYLES = {\n $: '>',\n display: 'grid',\n placeContent: 'stretch',\n placeItems: 'center',\n gridRows: '1sf',\n flow: 'column',\n gap: 0,\n cursor: 'inherit',\n opacity: {\n '': 1,\n disabled: '$disabled-opacity',\n },\n};\n\nexport const INPUT_WRAPPER_STYLES: Styles = {\n display: 'grid',\n flow: 'row',\n position: 'relative',\n gridColumns: {\n '': '1sf',\n prefix: 'max-content 1sf',\n suffix: '1sf max-content',\n 'prefix & suffix': 'max-content 1sf max-content',\n },\n gridRows: '1sf',\n placeItems: 'stretch',\n fill: {\n '': '#white',\n disabled: '#dark.04',\n },\n border: {\n '': true,\n valid: '#success-text.50',\n invalid: '#danger-text.50',\n focused: '#primary-text',\n 'valid & focused': '#success-text',\n 'invalid & focused': '#danger-text',\n disabled: true,\n },\n preset: 't3',\n radius: true,\n cursor: 'text',\n color: {\n '': '#dark-02',\n focused: '#dark-02',\n invalid: '#danger-text',\n disabled: '#dark.30',\n },\n zIndex: {\n '': 'initial',\n focused: 1,\n },\n boxSizing: 'border-box',\n transition: 'theme',\n backgroundClip: 'content-box',\n height: {\n '': '$size $size',\n multiline: 'min $size',\n },\n\n $size: {\n '': '$size-md',\n 'size=small': '$size-sm',\n 'size=medium': '$size-md',\n 'size=large': '$size-lg',\n },\n\n Prefix: ADD_STYLES,\n\n Suffix: ADD_STYLES,\n\n State: {\n $: '> Suffix >',\n display: 'flex',\n },\n\n InputIcon: {\n display: 'grid',\n placeItems: 'center',\n width: 'min $size-sm',\n color: 'inherit',\n fontSize: '$icon-size',\n },\n\n ValidationIcon: {\n $: '> Suffix > State >',\n display: 'grid',\n placeItems: 'center',\n width: {\n '': 'min $size-sm',\n suffix: 'min $size-xs',\n },\n fontSize: '$icon-size',\n },\n};\n\nconst InputWrapperElement = tasty({\n qa: 'InputWrapper',\n styles: INPUT_WRAPPER_STYLES,\n});\n\nconst PROP_STYLES = [\n ...BASE_STYLES,\n ...OUTER_STYLES,\n ...BLOCK_STYLES,\n ...COLOR_STYLES,\n];\n\nexport const DEFAULT_INPUT_STYLES: Styles = {\n recipe: 'reset input / input-autofill',\n placeSelf: 'stretch',\n width: 'initial 100% 100%',\n transition: 'theme',\n radius: true,\n padding: '$vertical-padding $right-padding $vertical-padding $left-padding',\n textAlign: 'left',\n preset: 't3',\n flexGrow: 1,\n margin: {\n '': 0,\n multiline: '((($size-md - 1lh) / 2) - 1bw) 0',\n 'multiline & size=small': '((($size-sm - 1lh) / 2) - 1bw) 0',\n 'multiline & size=large': '((($size-lg - 1lh) / 2) - 1bw) 0',\n },\n resize: 'none',\n userSelect: 'auto',\n\n Placeholder: {\n $: '::placeholder',\n recipe: 'input-placeholder',\n },\n '&::-webkit-search-cancel-button': {\n recipe: 'input-search-cancel-button',\n },\n\n '$vertical-padding': 0,\n '$left-padding': {\n '': '(1x - 1bw)',\n 'size=small': '(1x - 1bw)',\n 'size=large': '(1.25x - 1bw)',\n 'size=xlarge': '(1.5x - 1bw)',\n prefix: '0',\n },\n '$right-padding': {\n '': '(1x - 1bw)',\n 'size=small': '(1x - 1bw)',\n 'size=large': '(1.25x - 1bw)',\n 'size=xlarge': '(1.5x - 1bw)',\n suffix: '0',\n },\n};\n\nconst InputElement = tasty({ qa: 'Input', styles: DEFAULT_INPUT_STYLES });\n\nexport interface CubeTextInputBaseProps\n extends BaseProps,\n OuterStyleProps,\n BlockStyleProps,\n BaseStyleProps,\n ColorStyleProps,\n Omit<AriaTextFieldProps, 'validate'>,\n FieldBaseProps {\n validate?: AriaTextFieldProps['validate'] \| AriaNumberFieldProps['validate'];\n /** Left input icon /\n icon?: ReactElement \| null;\n /* Input decoration before the main input /\n prefix?: ReactNode;\n /* Input decoration after the main input /\n suffix?: ReactNode;\n /* Suffix position goes before or after the validation and loading statuses /\n suffixPosition?: 'before' \| 'after';\n /* Whether the input is multiline /\n multiLine?: boolean;\n /* Whether the input should have autofocus /\n autoFocus?: boolean;\n /* Direct input props /\n inputProps?: Props;\n /* Direct input wrapper props /\n wrapperProps?: Props;\n /* The input ref /\n inputRef?: RefObject<HTMLInputElement \| HTMLTextAreaElement>;\n /* The wrapper ref /\n wrapperRef?: RefObject<HTMLDivElement>;\n /* Whether the input has the loading status /\n isLoading?: boolean;\n /* The loading status indicator /\n loadingIndicator?: ReactNode;\n /* Style map for the input /\n inputStyles?: Styles;\n /* The number of rows for the input. Only applies to textarea. /\n rows?: number;\n /* The resize CSS property sets whether an element is resizable, and if so, in which directions. /\n resize?: Styles['resize'];\n /* The size of the input */\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n autocomplete?: string;\n}\n\nfunction _TextInputBase(props: CubeTextInputBaseProps, ref) {\n props = useProviderProps(props);\n props = useFormProps(props);\n props = useFieldProps(props, {\n defaultValidationTrigger: 'onBlur',\n valuePropsMapper: ({ value, onChange }) => ({\n value:\n typeof value === 'string' \|\| typeof value === 'number'\n ? String(value)\n : '',\n onChange,\n }),\n });\n\n let {\n qa,\n mods,\n validationState,\n prefix,\n isDisabled,\n multiLine,\n autoFocus,\n inputProps,\n wrapperProps,\n inputRef,\n isLoading,\n loadingIndicator,\n value,\n inputStyles = {},\n suffix,\n suffixPosition = 'before',\n wrapperRef,\n tooltip,\n rows = 1,\n size = 'medium',\n autocomplete,\n icon,\n maxLength,\n minLength,\n form,\n resize,\n ...otherProps\n } = props;\n\n let styles = extractStyles(otherProps, PROP_STYLES);\n let type = otherProps.type;\n\n if (resize) {\n inputStyles = { ...inputStyles, resize };\n }\n\n let ElementType: 'textarea' \| 'input' = multiLine ? 'textarea' : 'input';\n let { isFocused, focusProps } = useFocus({ isDisabled });\n let { hoverProps, isHovered } = useHover({ isDisabled });\n let domRef = useRef(null);\n\n inputRef = useCombinedRefs(inputRef);\n\n // Expose imperative interface for ref\n useImperativeHandle(ref, () => ({\n ...createFocusableRef(domRef, inputRef),\n select() {\n if (inputRef?.current) {\n inputRef.current.select();\n }\n },\n getInputElement() {\n return inputRef?.current;\n },\n }));\n\n let isInvalid = validationState === 'invalid';\n let validationIcon = isInvalid ? InvalidIcon : ValidIcon;\n let validation = cloneElement(validationIcon);\n\n // Fix safari bug: https://github.com/philipwalton/flexbugs/issues/270\n if (!inputProps?.placeholder) {\n if (!inputProps) {\n inputProps = {};\n }\n\n inputProps.placeholder = ' ';\n }\n\n if (icon) {\n icon = <div data-element=\"InputIcon\">{icon}</div>;\n\n if (prefix) {\n prefix = (\n <>\n {icon}\n {prefix}\n </>\n );\n } else {\n prefix = icon;\n }\n }\n\n const modifiers = useMemo(\n () => ({\n invalid: isInvalid,\n valid: validationState === 'valid',\n loadable: !!loadingIndicator,\n focused: isFocused,\n hovered: isHovered,\n disabled: isDisabled,\n multiline: multiLine,\n prefix: !!prefix,\n suffix: (validationState && !isLoading) \|\| isLoading \|\| !!suffix,\n ...mods,\n }),\n [\n mods,\n isInvalid,\n validationState,\n loadingIndicator,\n isFocused,\n isDisabled,\n isHovered,\n multiLine,\n prefix,\n suffix,\n ],\n );\n\n const hasTextSecurity = multiLine && type === 'password';\n const textSecurityStyles =\n hasTextSecurity && inputProps.value?.length\n ? {\n fontFamily: 'text-security-disc',\n }\n : {};\n\n const textField = (\n <InputWrapperElement\n ref={wrapperRef}\n mods={modifiers}\n data-size={size}\n styles={styles}\n {...wrapperProps}\n >\n {prefix ? <div data-element=\"Prefix\">{prefix}</div> : null}\n <InputElement\n qa={qa \|\| 'Input'}\n as={ElementType}\n data-input-type=\"textinput\"\n {...mergeProps(inputProps, focusProps, hoverProps)}\n ref={inputRef}\n rows={multiLine ? rows : undefined}\n mods={modifiers}\n style={textSecurityStyles}\n data-autofocus={autoFocus ? '' : undefined}\n autoFocus={autoFocus}\n data-size={size}\n autoComplete={autocomplete}\n styles={inputStyles}\n disabled={!!isDisabled}\n maxLength={maxLength}\n minLength={minLength}\n />\n {(validationState && !isLoading) \|\| isLoading \|\| suffix ? (\n <div data-element=\"Suffix\">\n {suffixPosition === 'before' ? suffix : null}\n {(validationState && !isLoading) \|\| isLoading ? (\n <div data-element=\"State\">\n {validationState && !isLoading ? validation : null}\n {isLoading && <LoadingIcon data-element=\"InputIcon\" />}\n </div>\n ) : null}\n {suffixPosition === 'after' ? suffix : null}\n </div>\n ) : null}\n </InputWrapperElement>\n );\n\n return wrapWithField(textField, domRef, {\n ...props,\n form: undefined,\n });\n}\n\nconst TextInputBase = forwardRef(_TextInputBase);\n\nexport { TextInputBase };\nexport type { AriaTextFieldProps };\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | 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/form/FieldWrapper/FieldWrapper.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { wrapNodeIfPlain } from "../../../utils/react/wrapNodeIfPlain.js";
 import { _Text } from "../../content/Text.js";

package/dist/components/form/FieldWrapper/extract-field-wrapper-props.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | Cube Dev Team */
 //#region src/components/form/FieldWrapper/extract-field-wrapper-props.ts
 const createFieldWrapperPropsKeys = (arr) => new Set(arr);
 const fieldWrapperPropsKeys = createFieldWrapperPropsKeys([

package/dist/components/form/Form/Field.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.122.0 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { warn } from "../../../utils/warnings.js";
 import { FieldWrapper } from "../FieldWrapper/FieldWrapper.js";