@cube-dev/ui-kit 0.0.0-canary-d4796d7 → 0.0.0-canary-759f43d

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

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

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

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

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-d4796d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-759f43d | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useEffect, useLayoutEffect, useRef } from "react";
 

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-d4796d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-759f43d | 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";
@@ -267,7 +267,6 @@ function TextInputMapperInput(props) {
 			$[17] = t9;
 		} else t9 = $[17];
 		return /* @__PURE__ */ jsx(ComboBox, {
-			isBare: true,
 			qa: "AddMapping",
 			"data-type": fieldType,
 			width: "auto",
@@ -285,21 +284,19 @@ function TextInputMapperInput(props) {
 			children: t9
 		});
 	}
-	const t6 = true;
-	const t7 = "AddMapping";
-	const t8 = "auto";
-	const t9 = 1;
-	const t10 = mergeProps(rest, PROPS_GRID_HACK);
-	let t11;
-	if ($[18] !== Component || $[19] !== fieldType || $[20] !== onBlur || $[21] !== onChange || $[22] !== placeholder || $[23] !== size || $[24] !== t10 || $[25] !== value) {
-		t11 = /* @__PURE__ */ jsx(Component, {
-			isBare: t6,
-			qa: t7,
+	const t6 = "AddMapping";
+	const t7 = "auto";
+	const t8 = 1;
+	const t9 = mergeProps(rest, PROPS_GRID_HACK);
+	let t10;
+	if ($[18] !== Component || $[19] !== fieldType || $[20] !== onBlur || $[21] !== onChange || $[22] !== placeholder || $[23] !== size || $[24] !== t9 || $[25] !== value) {
+		t10 = /* @__PURE__ */ jsx(Component, {
+			qa: t6,
 			"data-type": fieldType,
-			width: t8,
-			rows: t9,
+			width: t7,
+			rows: t8,
 			size,
-			...t10,
+			...t9,
 			id: void 0,
 			value,
 			labelPosition: "top",
@@ -314,11 +311,11 @@ function TextInputMapperInput(props) {
 		$[21] = onChange;
 		$[22] = placeholder;
 		$[23] = size;
-		$[24] = t10;
+		$[24] = t9;
 		$[25] = value;
-		$[26] = t11;
-	} else t11 = $[26];
-	return t11;
+		$[26] = t10;
+	} else t10 = $[26];
+	return t10;
 }
 function _temp(option) {
 	return /* @__PURE__ */ jsx(ComboBox.Item, { children: option }, option);

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

@@ -1 +1 @@
-{"version":3,"file":"TextInputMapper.js","names":["ComponentType","ForwardedRef","forwardRef","KeyboardEvent","useEffect","useMemo","useRef","useState","useEvent","useI18n","CloseIcon","PlusIcon","FieldBaseProps","mergeProps","useCombinedRefs","Button","Block","useFieldProps","wrapWithField","Flow","Grid","Space","ComboBox","PasswordInput","TextArea","TextInput","AriaLabelingProps","Mapping","key","value","id","CubeTextInputMapperProps","Record","qa","actionLabel","isDisabled","onChange","KeyComponent","CubeTextInputMapperInputProps","ValueComponent","keyProps","Partial","valueProps","allowsCustomValue","size","PROPS_GRID_HACK","styles","InputArea","gridColumn","removeDuplicates","mappings","keys","Set","filter","has","add","TextInputMapper","props","ref","HTMLDivElement","t","defaultValidationTrigger","valuePropsMapper","counterRef","isInvalid","isValid","form","ariaLabel","ariaLabelledBy","ariaDescribedBy","labelId","labelProps","extractLocalValues","localValues","valueKeys","Object","localKeys","map","forEach","includes","k","entries","exist","find","push","current","setMappings","JSON","stringify","onMappingsChange","newMappings","newValue","reduce","acc","trim","length","undefined","updatedMappings","addNewMapping","prev","showNewButton","some","TextInputMapperInput","onKeyChange","mapping","onValueChange","onSubmit","onKeyDown","e","ctrlKey","metaKey","renderedMappings","index","m","element","label","overflow","width","fieldType","inputType","options","placeholder","autoFocus","autoComplete","$","_c","t0","t1","rest","t2","t3","onBlur","t4","newValue_0","onSelectionChange","t5","Symbol","for","input","textarea","password","Component","t6","t7","val","t8","t9","_temp","t10","t11","option","_TextInputMapper","displayName"],"sources":["../../../../src/components/fields/TextInputMapper/TextInputMapper.tsx"],"sourcesContent":["import {\n  ComponentType,\n  ForwardedRef,\n  forwardRef,\n  KeyboardEvent,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { useI18n } from '../../../i18n';\nimport { CloseIcon } from '../../../icons/CloseIcon';\nimport { PlusIcon } from '../../../icons/PlusIcon';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps, useCombinedRefs } from '../../../utils/react';\nimport { Button } from '../../actions';\nimport { Block } from '../../Block';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport { Flow } from '../../layout/Flow';\nimport { Grid } from '../../layout/Grid';\nimport { Space } from '../../layout/Space';\nimport { ComboBox } from '../ComboBox';\nimport { PasswordInput } from '../PasswordInput/PasswordInput';\nimport { TextArea } from '../TextArea/index';\nimport { TextInput } from '../TextInput';\n\nimport type { AriaLabelingProps } from '@react-types/shared';\n\ntype Mapping = {\n  key: string;\n  value: string;\n  id: number;\n};\n\nexport interface CubeTextInputMapperProps\n  extends FieldBaseProps<Record<string, string> | null | undefined> {\n  qa?: string;\n  actionLabel?: string;\n  isDisabled?: boolean;\n  value?: Record<string, string>;\n  onChange?: (value: Record<string, string> | undefined) => void;\n  KeyComponent?: ComponentType<CubeTextInputMapperInputProps>;\n  ValueComponent?: ComponentType<CubeTextInputMapperInputProps>;\n  keyProps?: Partial<CubeTextInputMapperInputProps>;\n  valueProps?: Partial<CubeTextInputMapperInputProps>;\n  allowsCustomValue?: boolean;\n  size?: 'small' | 'medium' | 'large' | (string & {});\n}\n\n// Rewrites upper level field component styles\n// @TODO: Remove this after the release of new Element API\nconst PROPS_GRID_HACK = {\n  styles: {\n    InputArea: {\n      gridColumn: {\n        '': 'auto',\n        'has-sider': 'auto',\n      },\n    },\n  },\n};\n\n// remove duplicates in mappings\nfunction removeDuplicates(mappings: Mapping[]) {\n  const keys = new Set<string>();\n\n  return mappings.filter(({ key }) => {\n    if (keys.has(key)) {\n      return false;\n    }\n\n    keys.add(key);\n\n    return true;\n  });\n}\n\nfunction TextInputMapper(\n  props: CubeTextInputMapperProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const { t } = useI18n();\n\n  ref = useCombinedRefs(ref);\n\n  props = useFieldProps(props, {\n    defaultValidationTrigger: 'onChange',\n    valuePropsMapper: ({ value, onChange }) => ({\n      value: value != null ? value : {},\n      onChange: onChange,\n    }),\n  });\n\n  const counterRef = useRef(0);\n\n  let {\n    qa,\n    isDisabled,\n    isInvalid,\n    isValid,\n    actionLabel,\n    value,\n    onChange,\n    keyProps,\n    valueProps,\n    KeyComponent,\n    ValueComponent,\n    size = 'medium',\n    form,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n  } = props as typeof props & AriaLabelingProps;\n\n  // The rows are one field, so they form a group that the label, or the\n  // caller's `aria-label`, names and the field's description and message\n  // describe. A `<label for>` cannot name a group, so the label gets an id,\n  // unless the caller gave it one.\n  const labelId = props.labelProps?.id ?? `${props.id}-label`;\n\n  function extractLocalValues(\n    value: Record<string, string>,\n    localValues: Mapping[],\n  ) {\n    const valueKeys = Object.keys(value);\n    const localKeys = localValues.map(({ key }) => key);\n\n    localKeys.forEach((key) => {\n      if (!valueKeys.includes(key) && key !== '') {\n        localValues = localValues.filter(({ key: k }) => k !== key);\n      }\n    });\n\n    Object.entries(value ?? {}).forEach(([key, value]) => {\n      const exist = localValues.find(({ key: k }) => k === key);\n\n      if (exist) {\n        exist.value = value;\n      } else {\n        localValues.push({ key, value, id: counterRef.current++ });\n      }\n    });\n\n    return removeDuplicates(localValues);\n  }\n\n  const [mappings, setMappings] = useState(() => {\n    return extractLocalValues(value ?? {}, []);\n  });\n\n  useEffect(() => {\n    setMappings(extractLocalValues(value ?? {}, mappings));\n  }, [JSON.stringify(value)]);\n\n  const onMappingsChange = useEvent((newMappings: Mapping[]) => {\n    const newValue = newMappings.reduce(\n      (acc, { key, value }) => {\n        acc[key.trim()] = value.trim();\n\n        return acc;\n      },\n      {} as Record<string, string>,\n    );\n\n    const keys = Object.keys(newValue);\n\n    if (!keys.length) {\n      onChange?.(undefined);\n    } else {\n      onChange?.(newValue);\n    }\n\n    const updatedMappings = extractLocalValues(newValue ?? {}, newMappings);\n\n    if (JSON.stringify(updatedMappings) !== JSON.stringify(mappings)) {\n      setMappings(updatedMappings);\n    }\n  });\n\n  // useEffect(() => {\n  //   // focus on the last non-disabled input\n  //   setTimeout(() => {\n  //     (\n  //       ref?.current?.querySelector(\n  //         '[data-qa=\"Mapping\"]:last-child input:not([disabled])',\n  //       ) as HTMLInputElement\n  //     )?.focus();\n  //   }, 100);\n  // }, [mappings.length]);\n\n  const addNewMapping = useEvent(() => {\n    setMappings((prev) => {\n      return [...prev, { key: '', value: '', id: counterRef.current++ }];\n    });\n  });\n\n  const showNewButton = useMemo(() => {\n    return (\n      !mappings.length || !mappings.some(({ key, value }) => !key || !value)\n    );\n  }, [mappings]);\n\n  KeyComponent = KeyComponent ?? TextInputMapperInput;\n  ValueComponent = ValueComponent ?? TextInputMapperInput;\n\n  const onKeyChange = useEvent((id: number, value: string) => {\n    mappings.forEach((mapping) => {\n      if (mapping.id === id) {\n        mapping.key = value;\n      }\n    });\n\n    setMappings([...mappings]);\n  });\n\n  const onValueChange = useEvent((id: number, value: string) => {\n    mappings.forEach((mapping) => {\n      if (mapping.id === id) {\n        mapping.value = value;\n      }\n    });\n\n    setMappings([...mappings]);\n  });\n\n  const onSubmit = useEvent(() => {\n    onMappingsChange(mappings);\n  });\n\n  const onKeyDown = useEvent((e: KeyboardEvent<HTMLDivElement>) => {\n    // if Ctrl+Enter or Cmd+Enter is pressed then add new mapping if that's enabled\n    if ((e.ctrlKey || e.metaKey) && e.key === 'Enter' && showNewButton) {\n      addNewMapping();\n    }\n  });\n\n  const renderedMappings = useMemo(() => {\n    return mappings.map((mapping, index) => {\n      const { key, value, id } = mapping;\n\n      return (\n        <Grid\n          key={id}\n          qa=\"Mapping\"\n          columns=\"minmax(0, 1fr) minmax(0, 1fr) min-content\"\n          gap=\"1x\"\n        >\n          <KeyComponent\n            autoFocus={index === mappings.length - 1}\n            id={id}\n            isDisabled={isDisabled}\n            isInvalid={isInvalid}\n            isValid={isValid}\n            fieldType=\"key\"\n            value={key}\n            placeholder={t('textInputMapper.key', 'Key')}\n            size={size}\n            onChange={onKeyChange}\n            onSubmit={onSubmit}\n            {...keyProps}\n          />\n          <ValueComponent\n            id={id}\n            fieldType=\"value\"\n            isDisabled={!key || isDisabled}\n            isInvalid={isInvalid}\n            isValid={isValid}\n            value={value}\n            placeholder={t('textInputMapper.value', 'Value')}\n            size={size}\n            onChange={onValueChange}\n            onSubmit={onSubmit}\n            {...valueProps}\n          />\n          <Button\n            aria-label={t('textInputMapper.removeMapping', 'Remove mapping')}\n            theme=\"danger\"\n            type=\"clear\"\n            size={size}\n            icon={<CloseIcon />}\n            onPress={() => {\n              setMappings(mappings.filter((m) => m.id !== id));\n              onMappingsChange(mappings.filter((m) => m.id !== id));\n            }}\n          />\n        </Grid>\n      );\n    });\n  }, [JSON.stringify(mappings), t, isDisabled, isInvalid, isValid]);\n\n  const element = (\n    <Flow\n      ref={ref}\n      role=\"group\"\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy ?? (props.label ? labelId : undefined)}\n      aria-describedby={ariaDescribedBy}\n      gap=\"1x\"\n      data-qa={qa || 'TextInputMapper'}\n      data-input-type=\"textinputmapper\"\n      onKeyDown={onKeyDown}\n    >\n      {[...renderedMappings]}\n      {showNewButton ? (\n        <Space gap={0}>\n          {/** Hotfix for inconsistent alignment with the label **/}\n          <Block styles={{ overflow: 'clip', width: 'max 0px' }}>&nbsp;</Block>\n          <Button\n            isDisabled={isDisabled}\n            size={size}\n            icon={<PlusIcon />}\n            onPress={addNewMapping}\n          >\n            {actionLabel\n              ? actionLabel\n              : t('textInputMapper.mapping', 'Mapping')}\n          </Button>\n        </Space>\n      ) : null}\n    </Flow>\n  );\n\n  return wrapWithField(element, ref, {\n    ...props,\n    labelProps: mergeProps(props.labelProps, { id: labelId }),\n  });\n}\n\nexport interface CubeTextInputMapperInputProps {\n  id: number;\n  fieldType: 'key' | 'value';\n  inputType?: 'input' | 'combobox' | 'password' | 'textarea';\n  size?: 'small' | 'medium' | 'large' | (string & {});\n  value?: string;\n  options?: string[];\n  placeholder?: string;\n  onChange?: (id: number, newValue: string) => void;\n  onSubmit?: (id: number) => void;\n  isDisabled?: boolean;\n  isInvalid?: boolean;\n  isValid?: boolean;\n  autoFocus?: boolean;\n  allowsCustomValue?: boolean;\n  /**\n   * What kind of autofill the browser may offer for the input, as the HTML `autocomplete` token\n   * (`off`, `email`, …). Forwarded to the underlying input component.\n   */\n  autoComplete?: string;\n}\n\nfunction TextInputMapperInput(props: CubeTextInputMapperInputProps) {\n  const {\n    id,\n    fieldType,\n    inputType = 'input',\n    options,\n    value,\n    size = 'medium',\n    placeholder,\n    allowsCustomValue,\n    ...rest\n  } = props;\n\n  const onChange = useEvent((newValue: string) => {\n    props.onChange?.(id, newValue);\n  });\n\n  const onBlur = useEvent(() => {\n    props.onSubmit?.(id);\n  });\n\n  const onSelectionChange = useEvent((newValue: string) => {\n    if (!allowsCustomValue && !options?.includes(newValue)) {\n      props.onChange?.(id, '');\n    } else {\n      props.onChange?.(id, newValue);\n    }\n\n    props.onSubmit?.(id);\n  });\n\n  const Component = {\n    input: TextInput,\n    textarea: TextArea,\n    password: PasswordInput,\n  }[inputType];\n\n  if (inputType === 'combobox') {\n    return (\n      <ComboBox\n        isBare\n        qa=\"AddMapping\"\n        data-type={fieldType}\n        width=\"auto\"\n        size={size}\n        {...mergeProps(rest, PROPS_GRID_HACK)}\n        id={undefined}\n        inputValue={value}\n        selectedKey={value}\n        labelPosition=\"top\"\n        aria-label={placeholder}\n        placeholder={placeholder}\n        allowsCustomValue={allowsCustomValue}\n        onInputChange={onChange}\n        onSelectionChange={(val) => onSelectionChange(val ?? '')}\n      >\n        {(options ?? []).map((option) => (\n          <ComboBox.Item key={option}>{option}</ComboBox.Item>\n        ))}\n      </ComboBox>\n    );\n  }\n\n  return (\n    <Component\n      isBare\n      qa=\"AddMapping\"\n      data-type={fieldType}\n      width=\"auto\"\n      rows={1}\n      size={size}\n      {...mergeProps(rest, PROPS_GRID_HACK)}\n      id={undefined}\n      value={value}\n      labelPosition=\"top\"\n      aria-label={placeholder}\n      placeholder={placeholder}\n      onChange={onChange}\n      onBlur={onBlur}\n    />\n  );\n}\n\nconst _TextInputMapper = forwardRef(TextInputMapper);\n\n_TextInputMapper.displayName = 'TextInputMapper';\n\nexport { _TextInputMapper as TextInputMapper };\n"],"mappings":"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"}
+{"version":3,"file":"TextInputMapper.js","names":["ComponentType","ForwardedRef","forwardRef","KeyboardEvent","useEffect","useMemo","useRef","useState","useEvent","useI18n","CloseIcon","PlusIcon","FieldBaseProps","mergeProps","useCombinedRefs","Button","Block","useFieldProps","wrapWithField","Flow","Grid","Space","ComboBox","PasswordInput","TextArea","TextInput","AriaLabelingProps","Mapping","key","value","id","CubeTextInputMapperProps","Record","qa","actionLabel","isDisabled","onChange","KeyComponent","CubeTextInputMapperInputProps","ValueComponent","keyProps","Partial","valueProps","allowsCustomValue","size","PROPS_GRID_HACK","styles","InputArea","gridColumn","removeDuplicates","mappings","keys","Set","filter","has","add","TextInputMapper","props","ref","HTMLDivElement","t","defaultValidationTrigger","valuePropsMapper","counterRef","isInvalid","isValid","form","ariaLabel","ariaLabelledBy","ariaDescribedBy","labelId","labelProps","extractLocalValues","localValues","valueKeys","Object","localKeys","map","forEach","includes","k","entries","exist","find","push","current","setMappings","JSON","stringify","onMappingsChange","newMappings","newValue","reduce","acc","trim","length","undefined","updatedMappings","addNewMapping","prev","showNewButton","some","TextInputMapperInput","onKeyChange","mapping","onValueChange","onSubmit","onKeyDown","e","ctrlKey","metaKey","renderedMappings","index","m","element","label","overflow","width","fieldType","inputType","options","placeholder","autoFocus","autoComplete","$","_c","t0","t1","rest","t2","t3","onBlur","t4","newValue_0","onSelectionChange","t5","Symbol","for","input","textarea","password","Component","t6","t7","val","t8","t9","_temp","t10","option","_TextInputMapper","displayName"],"sources":["../../../../src/components/fields/TextInputMapper/TextInputMapper.tsx"],"sourcesContent":["import {\n  ComponentType,\n  ForwardedRef,\n  forwardRef,\n  KeyboardEvent,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { useI18n } from '../../../i18n';\nimport { CloseIcon } from '../../../icons/CloseIcon';\nimport { PlusIcon } from '../../../icons/PlusIcon';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps, useCombinedRefs } from '../../../utils/react';\nimport { Button } from '../../actions';\nimport { Block } from '../../Block';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport { Flow } from '../../layout/Flow';\nimport { Grid } from '../../layout/Grid';\nimport { Space } from '../../layout/Space';\nimport { ComboBox } from '../ComboBox';\nimport { PasswordInput } from '../PasswordInput/PasswordInput';\nimport { TextArea } from '../TextArea/index';\nimport { TextInput } from '../TextInput';\n\nimport type { AriaLabelingProps } from '@react-types/shared';\n\ntype Mapping = {\n  key: string;\n  value: string;\n  id: number;\n};\n\nexport interface CubeTextInputMapperProps\n  extends FieldBaseProps<Record<string, string> | null | undefined> {\n  qa?: string;\n  actionLabel?: string;\n  isDisabled?: boolean;\n  value?: Record<string, string>;\n  onChange?: (value: Record<string, string> | undefined) => void;\n  KeyComponent?: ComponentType<CubeTextInputMapperInputProps>;\n  ValueComponent?: ComponentType<CubeTextInputMapperInputProps>;\n  keyProps?: Partial<CubeTextInputMapperInputProps>;\n  valueProps?: Partial<CubeTextInputMapperInputProps>;\n  allowsCustomValue?: boolean;\n  size?: 'small' | 'medium' | 'large' | (string & {});\n}\n\n// Rewrites upper level field component styles\n// @TODO: Remove this after the release of new Element API\nconst PROPS_GRID_HACK = {\n  styles: {\n    InputArea: {\n      gridColumn: {\n        '': 'auto',\n        'has-sider': 'auto',\n      },\n    },\n  },\n};\n\n// remove duplicates in mappings\nfunction removeDuplicates(mappings: Mapping[]) {\n  const keys = new Set<string>();\n\n  return mappings.filter(({ key }) => {\n    if (keys.has(key)) {\n      return false;\n    }\n\n    keys.add(key);\n\n    return true;\n  });\n}\n\nfunction TextInputMapper(\n  props: CubeTextInputMapperProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const { t } = useI18n();\n\n  ref = useCombinedRefs(ref);\n\n  props = useFieldProps(props, {\n    defaultValidationTrigger: 'onChange',\n    valuePropsMapper: ({ value, onChange }) => ({\n      value: value != null ? value : {},\n      onChange: onChange,\n    }),\n  });\n\n  const counterRef = useRef(0);\n\n  let {\n    qa,\n    isDisabled,\n    isInvalid,\n    isValid,\n    actionLabel,\n    value,\n    onChange,\n    keyProps,\n    valueProps,\n    KeyComponent,\n    ValueComponent,\n    size = 'medium',\n    form,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n  } = props as typeof props & AriaLabelingProps;\n\n  // The rows are one field, so they form a group that the label, or the\n  // caller's `aria-label`, names and the field's description and message\n  // describe. A `<label for>` cannot name a group, so the label gets an id,\n  // unless the caller gave it one.\n  const labelId = props.labelProps?.id ?? `${props.id}-label`;\n\n  function extractLocalValues(\n    value: Record<string, string>,\n    localValues: Mapping[],\n  ) {\n    const valueKeys = Object.keys(value);\n    const localKeys = localValues.map(({ key }) => key);\n\n    localKeys.forEach((key) => {\n      if (!valueKeys.includes(key) && key !== '') {\n        localValues = localValues.filter(({ key: k }) => k !== key);\n      }\n    });\n\n    Object.entries(value ?? {}).forEach(([key, value]) => {\n      const exist = localValues.find(({ key: k }) => k === key);\n\n      if (exist) {\n        exist.value = value;\n      } else {\n        localValues.push({ key, value, id: counterRef.current++ });\n      }\n    });\n\n    return removeDuplicates(localValues);\n  }\n\n  const [mappings, setMappings] = useState(() => {\n    return extractLocalValues(value ?? {}, []);\n  });\n\n  useEffect(() => {\n    setMappings(extractLocalValues(value ?? {}, mappings));\n  }, [JSON.stringify(value)]);\n\n  const onMappingsChange = useEvent((newMappings: Mapping[]) => {\n    const newValue = newMappings.reduce(\n      (acc, { key, value }) => {\n        acc[key.trim()] = value.trim();\n\n        return acc;\n      },\n      {} as Record<string, string>,\n    );\n\n    const keys = Object.keys(newValue);\n\n    if (!keys.length) {\n      onChange?.(undefined);\n    } else {\n      onChange?.(newValue);\n    }\n\n    const updatedMappings = extractLocalValues(newValue ?? {}, newMappings);\n\n    if (JSON.stringify(updatedMappings) !== JSON.stringify(mappings)) {\n      setMappings(updatedMappings);\n    }\n  });\n\n  // useEffect(() => {\n  //   // focus on the last non-disabled input\n  //   setTimeout(() => {\n  //     (\n  //       ref?.current?.querySelector(\n  //         '[data-qa=\"Mapping\"]:last-child input:not([disabled])',\n  //       ) as HTMLInputElement\n  //     )?.focus();\n  //   }, 100);\n  // }, [mappings.length]);\n\n  const addNewMapping = useEvent(() => {\n    setMappings((prev) => {\n      return [...prev, { key: '', value: '', id: counterRef.current++ }];\n    });\n  });\n\n  const showNewButton = useMemo(() => {\n    return (\n      !mappings.length || !mappings.some(({ key, value }) => !key || !value)\n    );\n  }, [mappings]);\n\n  KeyComponent = KeyComponent ?? TextInputMapperInput;\n  ValueComponent = ValueComponent ?? TextInputMapperInput;\n\n  const onKeyChange = useEvent((id: number, value: string) => {\n    mappings.forEach((mapping) => {\n      if (mapping.id === id) {\n        mapping.key = value;\n      }\n    });\n\n    setMappings([...mappings]);\n  });\n\n  const onValueChange = useEvent((id: number, value: string) => {\n    mappings.forEach((mapping) => {\n      if (mapping.id === id) {\n        mapping.value = value;\n      }\n    });\n\n    setMappings([...mappings]);\n  });\n\n  const onSubmit = useEvent(() => {\n    onMappingsChange(mappings);\n  });\n\n  const onKeyDown = useEvent((e: KeyboardEvent<HTMLDivElement>) => {\n    // if Ctrl+Enter or Cmd+Enter is pressed then add new mapping if that's enabled\n    if ((e.ctrlKey || e.metaKey) && e.key === 'Enter' && showNewButton) {\n      addNewMapping();\n    }\n  });\n\n  const renderedMappings = useMemo(() => {\n    return mappings.map((mapping, index) => {\n      const { key, value, id } = mapping;\n\n      return (\n        <Grid\n          key={id}\n          qa=\"Mapping\"\n          columns=\"minmax(0, 1fr) minmax(0, 1fr) min-content\"\n          gap=\"1x\"\n        >\n          <KeyComponent\n            autoFocus={index === mappings.length - 1}\n            id={id}\n            isDisabled={isDisabled}\n            isInvalid={isInvalid}\n            isValid={isValid}\n            fieldType=\"key\"\n            value={key}\n            placeholder={t('textInputMapper.key', 'Key')}\n            size={size}\n            onChange={onKeyChange}\n            onSubmit={onSubmit}\n            {...keyProps}\n          />\n          <ValueComponent\n            id={id}\n            fieldType=\"value\"\n            isDisabled={!key || isDisabled}\n            isInvalid={isInvalid}\n            isValid={isValid}\n            value={value}\n            placeholder={t('textInputMapper.value', 'Value')}\n            size={size}\n            onChange={onValueChange}\n            onSubmit={onSubmit}\n            {...valueProps}\n          />\n          <Button\n            aria-label={t('textInputMapper.removeMapping', 'Remove mapping')}\n            theme=\"danger\"\n            type=\"clear\"\n            size={size}\n            icon={<CloseIcon />}\n            onPress={() => {\n              setMappings(mappings.filter((m) => m.id !== id));\n              onMappingsChange(mappings.filter((m) => m.id !== id));\n            }}\n          />\n        </Grid>\n      );\n    });\n  }, [JSON.stringify(mappings), t, isDisabled, isInvalid, isValid]);\n\n  const element = (\n    <Flow\n      ref={ref}\n      role=\"group\"\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy ?? (props.label ? labelId : undefined)}\n      aria-describedby={ariaDescribedBy}\n      gap=\"1x\"\n      data-qa={qa || 'TextInputMapper'}\n      data-input-type=\"textinputmapper\"\n      onKeyDown={onKeyDown}\n    >\n      {[...renderedMappings]}\n      {showNewButton ? (\n        <Space gap={0}>\n          {/** Hotfix for inconsistent alignment with the label **/}\n          <Block styles={{ overflow: 'clip', width: 'max 0px' }}>&nbsp;</Block>\n          <Button\n            isDisabled={isDisabled}\n            size={size}\n            icon={<PlusIcon />}\n            onPress={addNewMapping}\n          >\n            {actionLabel\n              ? actionLabel\n              : t('textInputMapper.mapping', 'Mapping')}\n          </Button>\n        </Space>\n      ) : null}\n    </Flow>\n  );\n\n  return wrapWithField(element, ref, {\n    ...props,\n    labelProps: mergeProps(props.labelProps, { id: labelId }),\n  });\n}\n\nexport interface CubeTextInputMapperInputProps {\n  id: number;\n  fieldType: 'key' | 'value';\n  inputType?: 'input' | 'combobox' | 'password' | 'textarea';\n  size?: 'small' | 'medium' | 'large' | (string & {});\n  value?: string;\n  options?: string[];\n  placeholder?: string;\n  onChange?: (id: number, newValue: string) => void;\n  onSubmit?: (id: number) => void;\n  isDisabled?: boolean;\n  isInvalid?: boolean;\n  isValid?: boolean;\n  autoFocus?: boolean;\n  allowsCustomValue?: boolean;\n  /**\n   * What kind of autofill the browser may offer for the input, as the HTML `autocomplete` token\n   * (`off`, `email`, …). Forwarded to the underlying input component.\n   */\n  autoComplete?: string;\n}\n\nfunction TextInputMapperInput(props: CubeTextInputMapperInputProps) {\n  const {\n    id,\n    fieldType,\n    inputType = 'input',\n    options,\n    value,\n    size = 'medium',\n    placeholder,\n    allowsCustomValue,\n    ...rest\n  } = props;\n\n  const onChange = useEvent((newValue: string) => {\n    props.onChange?.(id, newValue);\n  });\n\n  const onBlur = useEvent(() => {\n    props.onSubmit?.(id);\n  });\n\n  const onSelectionChange = useEvent((newValue: string) => {\n    if (!allowsCustomValue && !options?.includes(newValue)) {\n      props.onChange?.(id, '');\n    } else {\n      props.onChange?.(id, newValue);\n    }\n\n    props.onSubmit?.(id);\n  });\n\n  const Component = {\n    input: TextInput,\n    textarea: TextArea,\n    password: PasswordInput,\n  }[inputType];\n\n  if (inputType === 'combobox') {\n    return (\n      <ComboBox\n        qa=\"AddMapping\"\n        data-type={fieldType}\n        width=\"auto\"\n        size={size}\n        {...mergeProps(rest, PROPS_GRID_HACK)}\n        id={undefined}\n        inputValue={value}\n        selectedKey={value}\n        labelPosition=\"top\"\n        aria-label={placeholder}\n        placeholder={placeholder}\n        allowsCustomValue={allowsCustomValue}\n        onInputChange={onChange}\n        onSelectionChange={(val) => onSelectionChange(val ?? '')}\n      >\n        {(options ?? []).map((option) => (\n          <ComboBox.Item key={option}>{option}</ComboBox.Item>\n        ))}\n      </ComboBox>\n    );\n  }\n\n  return (\n    <Component\n      qa=\"AddMapping\"\n      data-type={fieldType}\n      width=\"auto\"\n      rows={1}\n      size={size}\n      {...mergeProps(rest, PROPS_GRID_HACK)}\n      id={undefined}\n      value={value}\n      labelPosition=\"top\"\n      aria-label={placeholder}\n      placeholder={placeholder}\n      onChange={onChange}\n      onBlur={onBlur}\n    />\n  );\n}\n\nconst _TextInputMapper = forwardRef(TextInputMapper);\n\n_TextInputMapper.displayName = 'TextInputMapper';\n\nexport { _TextInputMapper as TextInputMapper };\n"],"mappings":"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"}

package/dist/components/fields/TriggerActions.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-d4796d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-759f43d | Cube Dev Team */
 import { ItemActionIcon } from "../actions/ItemActionsWrapper.js";
 import { c } from "react/compiler-runtime";
 import { Fragment, jsxs } from "react/jsx-runtime";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-d4796d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-759f43d | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { formatColor, getContrastingColor, toHex } from "./color.js";
@@ -133,7 +133,6 @@ function ChannelRow(t0) {
 	let t10;
 	if ($[17] !== channel.min || $[18] !== channel.step || $[19] !== channel.title || $[20] !== handleChange || $[21] !== isDisabled || $[22] !== max || $[23] !== t9) {
 		t10 = /* @__PURE__ */ jsx(__Slider, {
-			isBare: true,
 			"aria-label": t7,
 			value: t9,
 			minValue: channel.min,
@@ -259,7 +258,6 @@ function ColorPanel(props) {
 	let t8;
 	if ($[17] !== handleSpaceChange || $[18] !== isDisabled || $[19] !== space || $[20] !== t6) {
 		t8 = /* @__PURE__ */ jsx(__Radio.Tabs, {
-			isBare: true,
 			"aria-label": t6,
 			value: space,
 			isDisabled,

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

@@ -1 +1 @@
-{"version":3,"file":"ColorPanel.js","names":["Styles","tasty","ReactNode","useEvent","useI18n","Radio","Slider","CHANNELS","COLOR_SPACE_HINTS","COLOR_SPACE_LABELS","COLOR_SPACES","ColorChannel","ColorSpace","ColorFormat","ColorValue","formatColor","getContrastingColor","toHex","PanelElement","qa","styles","display","flow","gap","padding","width","PreviewElement","placeItems","height","radius","preset","fill","color","shadow","ChannelsElement","gridColumns","ChannelLabelElement","textAlign","ChannelTrackElement","ChannelValueElement","whiteSpace","TRACK_STYLES","top","image","Fill","THUMB_STYLES","THUMB_TOKENS","SPACE_STYLES","TAB_STYLES","flexGrow","ColorPanelProps","space","isDisabled","previewFormat","swatches","input","onChange","onSpaceChange","ChannelRowProps","channel","ChannelRow","t0","$","_c","t1","max","t2","value","apply","handleChange","t3","label","t4","stops","t5","t6","t7","title","t8","t9","Math","min","t10","step","t11","t12","t13","t14","ColorPanel","props","t","colorTokens","handleSpaceChange","Symbol","for","map","_temp","item"],"sources":["../../../../src/components/fields/color/ColorPanel.tsx"],"sourcesContent":["import { Styles, tasty } from '@tenphi/tasty';\nimport { ReactNode } from 'react';\n\nimport { useEvent } from '../../../_internal';\nimport { useI18n } from '../../../i18n';\nimport { Radio } from '../RadioGroup';\nimport { Slider } from '../Slider';\n\nimport {\n  CHANNELS,\n  COLOR_SPACE_HINTS,\n  COLOR_SPACE_LABELS,\n  COLOR_SPACES,\n  ColorChannel,\n  ColorSpace,\n} from './channels';\nimport {\n  ColorFormat,\n  ColorValue,\n  formatColor,\n  getContrastingColor,\n  toHex,\n} from './color';\n\nconst PanelElement = tasty({\n  qa: 'ColorPanel',\n  styles: {\n    display: 'grid',\n    flow: 'row',\n    gap: '1x',\n    padding: '1x',\n    width: '34x',\n  },\n});\n\nconst PreviewElement = tasty({\n  qa: 'ColorPreview',\n  styles: {\n    display: 'grid',\n    placeItems: 'center',\n    height: '6x',\n    radius: true,\n    preset: 's4',\n    fill: '(#color-picker, #clear)',\n    color: '(#color-picker-contrast, #dark)',\n    shadow: 'inset 0 0 0 1bw #dark.1',\n  },\n});\n\nconst ChannelsElement = tasty({\n  styles: {\n    display: 'grid',\n    gridColumns: 'max-content 1sf max-content',\n    placeItems: 'center stretch',\n    gap: '1x',\n  },\n});\n\nconst ChannelLabelElement = tasty({\n  styles: {\n    preset: 'c2',\n    color: '#dark-03',\n    textAlign: 'center',\n    width: '2x',\n  },\n});\n\nconst ChannelTrackElement = tasty({\n  styles: {\n    display: 'grid',\n    placeItems: 'center stretch',\n  },\n});\n\nconst ChannelValueElement = tasty({\n  styles: {\n    preset: 's4',\n    color: '#dark-02',\n    textAlign: 'right',\n    whiteSpace: 'nowrap',\n    width: '5.5x',\n  },\n});\n\n/**\n * The gradient reaches the track through a plain custom property so the track\n * keeps a single cached style rule. A color picker moves its channels\n * continuously, and a fresh `styles` object per frame would emit a fresh CSS\n * rule per frame.\n */\nconst TRACK_STYLES: Styles = {\n  height: '1x',\n  top: '.5x',\n  radius: '1r',\n  fill: '#clear',\n  image: '$channel-gradient',\n  shadow: 'inset 0 0 0 1bw #dark.1',\n  Fill: false,\n};\n\n/** A ring keeps the thumb visible wherever it sits on its own gradient. */\nconst THUMB_STYLES: Styles = {\n  shadow: '0 0 0 2bw #surface, 0 0 0 3bw #dark.2',\n};\n\nconst THUMB_TOKENS = { '#slider-thumb': '(#color-picker, #surface)' };\n\nconst SPACE_STYLES: Styles = { width: '100%' };\nconst TAB_STYLES: Styles = { flexGrow: 1 };\n\nexport interface ColorPanelProps {\n  color: ColorValue;\n  space: ColorSpace;\n  isDisabled?: boolean;\n  /** Notation used for the preview caption. */\n  previewFormat: ColorFormat;\n  /** Optional palette rendered under the channels. */\n  swatches?: ReactNode;\n  /** Optional value field rendered above the preview. */\n  input?: ReactNode;\n  onChange: (color: ColorValue) => void;\n  onSpaceChange: (space: ColorSpace) => void;\n}\n\ninterface ChannelRowProps {\n  channel: ColorChannel;\n  color: ColorValue;\n  isDisabled?: boolean;\n  onChange: (color: ColorValue) => void;\n}\n\nfunction ChannelRow({ channel, color, isDisabled, onChange }: ChannelRowProps) {\n  const max = channel.max(color);\n\n  const handleChange = useEvent((value: number) => {\n    onChange(channel.apply(color, value));\n  });\n\n  return (\n    <>\n      <ChannelLabelElement aria-hidden=\"true\">\n        {channel.label}\n      </ChannelLabelElement>\n      <ChannelTrackElement\n        style={{\n          '--channel-gradient': `linear-gradient(to right, ${channel.stops(\n            color,\n          )})`,\n        }}\n      >\n        <Slider\n          isBare\n          aria-label={channel.title}\n          value={Math.min(channel.value(color), max)}\n          minValue={channel.min}\n          maxValue={max}\n          step={channel.step}\n          isDisabled={isDisabled}\n          trackStyles={TRACK_STYLES}\n          thumbStyles={THUMB_STYLES}\n          thumbTokens={THUMB_TOKENS}\n          onChange={handleChange}\n        />\n      </ChannelTrackElement>\n      <ChannelValueElement>{channel.display(color)}</ChannelValueElement>\n    </>\n  );\n}\n\n/**\n * The popover body shared by `ColorInput` and `ColorPicker`: a preview, a\n * switch between the three color concepts, and one gradient slider per channel\n * of the active one.\n */\nexport function ColorPanel(props: ColorPanelProps) {\n  const {\n    color,\n    space,\n    isDisabled,\n    previewFormat,\n    swatches,\n    input,\n    onChange,\n    onSpaceChange,\n  } = props;\n  const { t } = useI18n();\n\n  const colorTokens = {\n    '--color-picker-color': toHex(color),\n    '--color-picker-contrast-color': getContrastingColor(color),\n  };\n\n  const handleSpaceChange = useEvent((value: string) => {\n    onSpaceChange(value as ColorSpace);\n  });\n\n  return (\n    <PanelElement style={colorTokens}>\n      {input}\n      <PreviewElement>{formatColor(color, previewFormat)}</PreviewElement>\n      <Radio.Tabs\n        isBare\n        aria-label={t('colorPicker.colorSpace', 'Color space')}\n        value={space}\n        isDisabled={isDisabled}\n        styles={SPACE_STYLES}\n        onChange={handleSpaceChange}\n      >\n        {COLOR_SPACES.map((item) => (\n          <Radio\n            key={item}\n            value={item}\n            aria-label={COLOR_SPACE_LABELS[item]}\n            tooltip={COLOR_SPACE_HINTS[item]}\n            styles={TAB_STYLES}\n          >\n            {COLOR_SPACE_LABELS[item]}\n          </Radio>\n        ))}\n      </Radio.Tabs>\n      <ChannelsElement>\n        {CHANNELS[space].map((channel) => (\n          <ChannelRow\n            key={`${space}-${channel.label}`}\n            channel={channel}\n            color={color}\n            isDisabled={isDisabled}\n            onChange={onChange}\n          />\n        ))}\n      </ChannelsElement>\n      {swatches}\n    </PanelElement>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ColorPanel.js","names":["Styles","tasty","ReactNode","useEvent","useI18n","Radio","Slider","CHANNELS","COLOR_SPACE_HINTS","COLOR_SPACE_LABELS","COLOR_SPACES","ColorChannel","ColorSpace","ColorFormat","ColorValue","formatColor","getContrastingColor","toHex","PanelElement","qa","styles","display","flow","gap","padding","width","PreviewElement","placeItems","height","radius","preset","fill","color","shadow","ChannelsElement","gridColumns","ChannelLabelElement","textAlign","ChannelTrackElement","ChannelValueElement","whiteSpace","TRACK_STYLES","top","image","Fill","THUMB_STYLES","THUMB_TOKENS","SPACE_STYLES","TAB_STYLES","flexGrow","ColorPanelProps","space","isDisabled","previewFormat","swatches","input","onChange","onSpaceChange","ChannelRowProps","channel","ChannelRow","t0","$","_c","t1","max","t2","value","apply","handleChange","t3","label","t4","stops","t5","t6","t7","title","t8","t9","Math","min","t10","step","t11","t12","t13","t14","ColorPanel","props","t","colorTokens","handleSpaceChange","Symbol","for","map","_temp","item"],"sources":["../../../../src/components/fields/color/ColorPanel.tsx"],"sourcesContent":["import { Styles, tasty } from '@tenphi/tasty';\nimport { ReactNode } from 'react';\n\nimport { useEvent } from '../../../_internal';\nimport { useI18n } from '../../../i18n';\nimport { Radio } from '../RadioGroup';\nimport { Slider } from '../Slider';\n\nimport {\n  CHANNELS,\n  COLOR_SPACE_HINTS,\n  COLOR_SPACE_LABELS,\n  COLOR_SPACES,\n  ColorChannel,\n  ColorSpace,\n} from './channels';\nimport {\n  ColorFormat,\n  ColorValue,\n  formatColor,\n  getContrastingColor,\n  toHex,\n} from './color';\n\nconst PanelElement = tasty({\n  qa: 'ColorPanel',\n  styles: {\n    display: 'grid',\n    flow: 'row',\n    gap: '1x',\n    padding: '1x',\n    width: '34x',\n  },\n});\n\nconst PreviewElement = tasty({\n  qa: 'ColorPreview',\n  styles: {\n    display: 'grid',\n    placeItems: 'center',\n    height: '6x',\n    radius: true,\n    preset: 's4',\n    fill: '(#color-picker, #clear)',\n    color: '(#color-picker-contrast, #dark)',\n    shadow: 'inset 0 0 0 1bw #dark.1',\n  },\n});\n\nconst ChannelsElement = tasty({\n  styles: {\n    display: 'grid',\n    gridColumns: 'max-content 1sf max-content',\n    placeItems: 'center stretch',\n    gap: '1x',\n  },\n});\n\nconst ChannelLabelElement = tasty({\n  styles: {\n    preset: 'c2',\n    color: '#dark-03',\n    textAlign: 'center',\n    width: '2x',\n  },\n});\n\nconst ChannelTrackElement = tasty({\n  styles: {\n    display: 'grid',\n    placeItems: 'center stretch',\n  },\n});\n\nconst ChannelValueElement = tasty({\n  styles: {\n    preset: 's4',\n    color: '#dark-02',\n    textAlign: 'right',\n    whiteSpace: 'nowrap',\n    width: '5.5x',\n  },\n});\n\n/**\n * The gradient reaches the track through a plain custom property so the track\n * keeps a single cached style rule. A color picker moves its channels\n * continuously, and a fresh `styles` object per frame would emit a fresh CSS\n * rule per frame.\n */\nconst TRACK_STYLES: Styles = {\n  height: '1x',\n  top: '.5x',\n  radius: '1r',\n  fill: '#clear',\n  image: '$channel-gradient',\n  shadow: 'inset 0 0 0 1bw #dark.1',\n  Fill: false,\n};\n\n/** A ring keeps the thumb visible wherever it sits on its own gradient. */\nconst THUMB_STYLES: Styles = {\n  shadow: '0 0 0 2bw #surface, 0 0 0 3bw #dark.2',\n};\n\nconst THUMB_TOKENS = { '#slider-thumb': '(#color-picker, #surface)' };\n\nconst SPACE_STYLES: Styles = { width: '100%' };\nconst TAB_STYLES: Styles = { flexGrow: 1 };\n\nexport interface ColorPanelProps {\n  color: ColorValue;\n  space: ColorSpace;\n  isDisabled?: boolean;\n  /** Notation used for the preview caption. */\n  previewFormat: ColorFormat;\n  /** Optional palette rendered under the channels. */\n  swatches?: ReactNode;\n  /** Optional value field rendered above the preview. */\n  input?: ReactNode;\n  onChange: (color: ColorValue) => void;\n  onSpaceChange: (space: ColorSpace) => void;\n}\n\ninterface ChannelRowProps {\n  channel: ColorChannel;\n  color: ColorValue;\n  isDisabled?: boolean;\n  onChange: (color: ColorValue) => void;\n}\n\nfunction ChannelRow({ channel, color, isDisabled, onChange }: ChannelRowProps) {\n  const max = channel.max(color);\n\n  const handleChange = useEvent((value: number) => {\n    onChange(channel.apply(color, value));\n  });\n\n  return (\n    <>\n      <ChannelLabelElement aria-hidden=\"true\">\n        {channel.label}\n      </ChannelLabelElement>\n      <ChannelTrackElement\n        style={{\n          '--channel-gradient': `linear-gradient(to right, ${channel.stops(\n            color,\n          )})`,\n        }}\n      >\n        <Slider\n          aria-label={channel.title}\n          value={Math.min(channel.value(color), max)}\n          minValue={channel.min}\n          maxValue={max}\n          step={channel.step}\n          isDisabled={isDisabled}\n          trackStyles={TRACK_STYLES}\n          thumbStyles={THUMB_STYLES}\n          thumbTokens={THUMB_TOKENS}\n          onChange={handleChange}\n        />\n      </ChannelTrackElement>\n      <ChannelValueElement>{channel.display(color)}</ChannelValueElement>\n    </>\n  );\n}\n\n/**\n * The popover body shared by `ColorInput` and `ColorPicker`: a preview, a\n * switch between the three color concepts, and one gradient slider per channel\n * of the active one.\n */\nexport function ColorPanel(props: ColorPanelProps) {\n  const {\n    color,\n    space,\n    isDisabled,\n    previewFormat,\n    swatches,\n    input,\n    onChange,\n    onSpaceChange,\n  } = props;\n  const { t } = useI18n();\n\n  const colorTokens = {\n    '--color-picker-color': toHex(color),\n    '--color-picker-contrast-color': getContrastingColor(color),\n  };\n\n  const handleSpaceChange = useEvent((value: string) => {\n    onSpaceChange(value as ColorSpace);\n  });\n\n  return (\n    <PanelElement style={colorTokens}>\n      {input}\n      <PreviewElement>{formatColor(color, previewFormat)}</PreviewElement>\n      <Radio.Tabs\n        aria-label={t('colorPicker.colorSpace', 'Color space')}\n        value={space}\n        isDisabled={isDisabled}\n        styles={SPACE_STYLES}\n        onChange={handleSpaceChange}\n      >\n        {COLOR_SPACES.map((item) => (\n          <Radio\n            key={item}\n            value={item}\n            aria-label={COLOR_SPACE_LABELS[item]}\n            tooltip={COLOR_SPACE_HINTS[item]}\n            styles={TAB_STYLES}\n          >\n            {COLOR_SPACE_LABELS[item]}\n          </Radio>\n        ))}\n      </Radio.Tabs>\n      <ChannelsElement>\n        {CHANNELS[space].map((channel) => (\n          <ChannelRow\n            key={`${space}-${channel.label}`}\n            channel={channel}\n            color={color}\n            isDisabled={isDisabled}\n            onChange={onChange}\n          />\n        ))}\n      </ChannelsElement>\n      {swatches}\n    </PanelElement>\n  );\n}\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-d4796d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-759f43d | Cube Dev Team */
 import { maxChroma, normalizeHue, oklchToOkhsl } from "../../../utils/colors.js";
 import { fromOkhst, fromRgb, isAchromatic, toHex, toOkhst, toOklch, toRgb } from "./color.js";
 

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-d4796d7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-759f43d | Cube Dev Team */
 import { anyNaN, clamp, maxChroma, normalizeHue, oklchToOkhsl, parseColorFunction, readComponent, readHue, rgbFromSrgb } from "../../../utils/colors.js";
 import { contrastRatioFromLuminance, formatHsl, formatOkhsl, formatOkhst, formatOklch, formatRgb, hslToSrgb, okhslToLinearSrgb, okhslToOkhst, okhslToOklch, okhslToSrgb, okhstToOkhsl, parseHexAlpha, relativeLuminanceFromLinearRgb, srgbToHex, srgbToOkhsl } from "@tenphi/glaze";
 

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

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

package/dist/components/form/FieldWrapper/FieldWrapper.d.ts

@@ -6,7 +6,6 @@ import "../index.js";
 import "../../../index.js";
 import * as _tenphi_tasty0 from "@tenphi/tasty";
 import * as react from "react";
-import { ReactNode } from "react";
 
 //#region src/components/form/FieldWrapper/FieldWrapper.d.ts
 /**
@@ -21,23 +20,22 @@ declare const FieldWrapper: react.ForwardRefExoticComponent<ValidationProps & {
   isDisabled?: boolean;
   fieldProps?: Props;
   isHidden?: boolean;
-  isBare?: boolean;
-  label?: ReactNode;
+  label?: react.ReactNode;
   labelPosition?: LabelPosition;
-  labelSuffix?: ReactNode;
+  labelSuffix?: react.ReactNode;
   labelStyles?: _tenphi_tasty0.Styles;
   labelProps?: CubeLabelProps;
-  description?: ReactNode;
+  description?: react.ReactNode;
   requiredMark?: boolean;
-  labelTooltip?: ReactNode;
-  extra?: ReactNode;
+  labelTooltip?: react.ReactNode;
+  extra?: react.ReactNode;
   necessityIndicator?: NecessityIndicator | null;
-  message?: string | ReactNode;
+  message?: string | react.ReactNode;
   messageStyles?: _tenphi_tasty0.Styles;
-  errorMessage?: string | ReactNode;
+  errorMessage?: string | react.ReactNode;
   Component?: react.ReactElement;
   controlId?: string;
-  children?: ReactNode;
+  children?: react.ReactNode;
 } & react.RefAttributes<unknown>>;
 //#endregion
 export { FieldWrapper };