@dnb/eufemia 10.51.0 → 10.51.2

package/extensions/forms/Field/Selection/Selection.js

@@ -178,7 +178,7 @@ function renderRadioItems(_ref5) {
     const Component = variant === 'radio' ? Radio : ToggleButton;
     return React.createElement(Component, _extends({
       id: optionsCount === 1 ? id : undefined,
-      key: `option-${i}-${value}`,
+      key: `option-${i}-${id}`,
       label: variant === 'radio' ? label : undefined,
       text: variant === 'button' ? label : undefined,
       value: String(value !== null && value !== void 0 ? value : ''),

package/extensions/forms/Field/Selection/Selection.js.map

@@ -1 +1 @@
-{"version":3,"file":"Selection.js","names":["React","useMemo","useCallback","classnames","makeUniqueId","ToggleButton","Dropdown","Radio","HelpButton","Autocomplete","OptionField","useFieldProps","pickSpacingProps","FieldBlock","FormError","convertCamelCaseProps","useDataValue","Selection","props","clearValue","id","className","variant","label","labelDescription","layout","optionsLayout","placeholder","value","info","warning","error","hasError","disabled","help","emptyValue","width","htmlAttributes","setHasFocus","handleChange","data","dataPath","children","autocompleteProps","dropdownProps","getValueByPath","dataList","handleDropdownChange","_ref","selectedKey","onChangeHandler","_ref2","undefined","handleShow","_ref3","handleHide","_ref4","cn","fieldBlockProps","_objectSpread","forId","Component","items","renderRadioItems","createElement","_extends","asFieldset","Children","count","Group","layout_direction","on_change","String","status","getStatus","renderDropdownItems","concat","makeOptions","filter","Boolean","sharedProps","list_class","portal_class","title","suffix","content","on_show","on_hide","stretch","_error$message","message","Error","toString","_ref5","optionsCount","length","createOption","i","rest","_objectWithoutProperties","_excluded","size","key","text","map","mapOptions","_ref6","child","isValidElement","type","nestedChildren","cloneElement","_child","_child$props","_child$props$children","_ref7","_props$children","_props$value","_em","_ref8","_em2","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Selection/Selection.tsx"],"sourcesContent":["import React, { useMemo, useCallback } from 'react'\nimport classnames from 'classnames'\nimport { makeUniqueId } from '../../../../shared/component-helper'\nimport {\n  ToggleButton,\n  Dropdown,\n  Radio,\n  HelpButton,\n  Autocomplete,\n} from '../../../../components'\nimport OptionField, { Props as OptionFieldProps } from '../Option'\nimport { useFieldProps } from '../../hooks'\nimport { ReturnAdditional } from '../../hooks/useFieldProps'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport FieldBlock from '../../FieldBlock'\nimport {\n  FormError,\n  FieldProps,\n  FieldHelpProps,\n  FieldBlockWidth,\n  Path,\n} from '../../types'\nimport type { FormStatusText } from '../../../../components/FormStatus'\nimport type { AutocompleteAllProps } from '../../../../components/Autocomplete'\nimport type { DropdownAllProps } from '../../../../components/Dropdown'\nimport { HelpButtonProps } from '../../../../components/HelpButton'\nimport { DrawerListProps } from '../../../../fragments/DrawerList'\nimport {\n  convertCamelCaseProps,\n  ToCamelCase,\n} from '../../../../shared/helpers/withCamelCaseProps'\nimport useDataValue from '../../hooks/useDataValue'\n\ntype IOption = {\n  title: string | React.ReactNode\n  value: number | string\n  status: FormStatusText\n}\nexport type Data = Array<{\n  value: string\n  title: React.ReactNode\n  text?: React.ReactNode\n}>\n\nexport type Props = FieldHelpProps &\n  FieldProps<IOption['value']> & {\n    /**\n     * Defines the variant of the component.\n     * Default: dropdown\n     */\n    variant?: 'dropdown' | 'autocomplete' | 'radio' | 'button'\n\n    /**\n     * The width of the component.\n     * Default: large\n     */\n    width?: FieldBlockWidth\n\n    /**\n     * Defines the layout of the options for radio and button variants.\n     */\n    optionsLayout?: 'horizontal' | 'vertical'\n\n    /**\n     * The path to the context data (Form.Handler).\n     * The context data object needs to have a `value` and a `title` property.\n     */\n    dataPath?: Path\n\n    /**\n     * Data to be used for the component. The object needs to have a `value` and a `title` property.\n     * The generated options will be placed above given JSX based children.\n     */\n    data?: Data\n\n    /**\n     * Autocomplete specific props\n     */\n    autocompleteProps?: ToCamelCase<AutocompleteAllProps>\n\n    /**\n     * Dropdown specific props\n     */\n    dropdownProps?: ToCamelCase<DropdownAllProps>\n\n    /**\n     * The content of the component.\n     */\n    children?: React.ReactNode\n  }\n\nfunction Selection(props: Props) {\n  const clearValue = useMemo(() => `clear-option-${makeUniqueId()}`, [])\n\n  const {\n    id,\n    className,\n    variant = 'dropdown',\n    label,\n    labelDescription,\n    layout = 'vertical',\n    optionsLayout = 'vertical',\n    placeholder,\n    value,\n    info,\n    warning,\n    error,\n    hasError,\n    disabled,\n    help,\n    emptyValue,\n    width = 'large',\n    htmlAttributes,\n    setHasFocus,\n    handleChange,\n    data,\n    dataPath,\n    children,\n\n    // - Autocomplete and Dropdown specific props\n    autocompleteProps,\n    dropdownProps,\n  } = useFieldProps(props)\n\n  const { getValueByPath } = useDataValue()\n  let dataList = data\n  if (dataPath) {\n    dataList = getValueByPath(dataPath)\n  }\n\n  const handleDropdownChange = useCallback(\n    ({ data }) => {\n      const selectedKey = data?.selectedKey\n      handleChange?.(\n        !selectedKey || selectedKey === clearValue\n          ? emptyValue\n          : selectedKey\n      )\n    },\n    [handleChange, emptyValue, clearValue]\n  )\n\n  const onChangeHandler = useCallback(\n    ({ value }) => {\n      handleChange?.(value === undefined ? emptyValue : value)\n    },\n    [handleChange, emptyValue]\n  )\n\n  // Specific handleShow and handleHide because Dropdown preserve the initially received callbacks, so changes\n  // due to `useCallback` usage will have no effect, leading to useFieldPropss handleFocus and handleBlur sending out old\n  // copies of value as arguments.\n  const handleShow = useCallback(\n    ({ data }) => {\n      setHasFocus(true, data?.selectedKey)\n    },\n    [setHasFocus]\n  )\n\n  const handleHide = useCallback(\n    ({ data }) => {\n      setHasFocus(false, data?.selectedKey)\n    },\n    [setHasFocus]\n  )\n\n  const cn = classnames(\n    'dnb-forms-field-selection',\n    `dnb-forms-field-selection__variant--${variant}`,\n    `dnb-forms-field-selection__options-layout--${optionsLayout}`,\n    className\n  )\n\n  const fieldBlockProps = {\n    forId: id,\n    className: cn,\n    ...pickSpacingProps(props),\n    info,\n    warning,\n    error,\n    layout,\n    label,\n    labelDescription,\n  }\n\n  switch (variant) {\n    case 'radio':\n    case 'button': {\n      const Component = (\n        variant === 'radio' ? Radio : ToggleButton\n      ) as typeof Radio & typeof ToggleButton\n\n      const items = renderRadioItems({\n        id,\n        value,\n        variant,\n        info,\n        warning,\n        htmlAttributes,\n        children,\n        dataList,\n        hasError,\n      })\n\n      return (\n        <FieldBlock\n          {...fieldBlockProps}\n          asFieldset={React.Children.count(items) > 1}\n        >\n          <Component.Group\n            className={cn}\n            layout_direction={\n              optionsLayout === 'horizontal' ? 'row' : 'column'\n            }\n            disabled={disabled}\n            on_change={onChangeHandler}\n            value={String(value ?? '')}\n          >\n            {items}\n          </Component.Group>\n        </FieldBlock>\n      )\n    }\n\n    case 'autocomplete':\n    case 'dropdown': {\n      const status = getStatus(error, info, warning)\n      const data = renderDropdownItems(dataList)\n        .concat(makeOptions(children))\n        .filter(Boolean)\n\n      const sharedProps: AutocompleteAllProps & DropdownAllProps = {\n        id,\n        list_class: 'dnb-forms-field-selection__list',\n        portal_class: 'dnb-forms-field-selection__portal',\n        title: placeholder,\n        value: String(value ?? ''),\n        status: (hasError || status) && 'error',\n        disabled,\n        ...htmlAttributes,\n        data,\n        suffix: help ? (\n          <HelpButton title={help.title}>{help.content}</HelpButton>\n        ) : undefined,\n        on_change: handleDropdownChange,\n        on_show: handleShow,\n        on_hide: handleHide,\n        stretch: true,\n      }\n\n      return (\n        <FieldBlock {...fieldBlockProps} width={width}>\n          {variant === 'autocomplete' ? (\n            <Autocomplete\n              {...sharedProps}\n              {...(autocompleteProps\n                ? (convertCamelCaseProps(\n                    autocompleteProps\n                  ) as AutocompleteAllProps)\n                : null)}\n            />\n          ) : (\n            <Dropdown\n              {...sharedProps}\n              {...(dropdownProps\n                ? (convertCamelCaseProps(\n                    dropdownProps\n                  ) as DropdownAllProps)\n                : null)}\n            />\n          )}\n        </FieldBlock>\n      )\n    }\n  }\n}\n\nexport function getStatus(\n  error: Error | FormError | undefined,\n  info: React.ReactNode,\n  warning: React.ReactNode\n) {\n  return (\n    error?.message ??\n    ((warning instanceof Error && warning.message) ||\n      (warning instanceof FormError && warning.message) ||\n      warning?.toString() ||\n      (info instanceof Error && info.message) ||\n      (info instanceof FormError && info.message) ||\n      info?.toString())\n  )\n}\n\ntype OptionProps = React.ComponentProps<\n  React.FC<{\n    error?: Error | FormError | undefined\n    title: React.ReactNode\n    help?: HelpButtonProps\n    children?: React.ReactNode\n  }>\n>\n\nfunction renderRadioItems({\n  id,\n  value,\n  variant,\n  info,\n  warning,\n  htmlAttributes,\n  children,\n  dataList,\n  hasError,\n}: {\n  id: string\n  value: Props['value']\n  variant: Props['variant']\n  info: Props['info']\n  warning: Props['warning']\n  htmlAttributes: Props['htmlAttributes']\n  children: Props['children']\n  dataList: Data\n  hasError: ReturnAdditional<Props['value']>['hasError']\n}) {\n  const optionsCount =\n    React.Children.count(children) + (dataList?.length || 0)\n\n  const createOption = (props: OptionProps, i: number) => {\n    const { error, title, help, children, ...rest } = props\n\n    const label = title ?? children\n    const status = getStatus(error, info, warning)\n    const suffix = help ? (\n      <HelpButton size=\"small\" title={help.title}>\n        {help.content}\n      </HelpButton>\n    ) : undefined\n\n    const Component = (\n      variant === 'radio' ? Radio : ToggleButton\n    ) as typeof Radio & typeof ToggleButton\n\n    return (\n      <Component\n        id={optionsCount === 1 ? id : undefined}\n        key={`option-${i}-${value}`}\n        label={variant === 'radio' ? label : undefined}\n        text={variant === 'button' ? label : undefined}\n        value={String(value ?? '')}\n        status={(hasError || status) && 'error'}\n        suffix={suffix}\n        {...htmlAttributes}\n        {...rest}\n      />\n    )\n  }\n\n  return [\n    ...(dataList || []).map((props, i) => {\n      return createOption(props as OptionProps, i)\n    }),\n    ...(mapOptions(children, { createOption }) || []),\n  ].filter(Boolean)\n}\n\nexport function mapOptions(children: React.ReactNode, { createOption }) {\n  return React.Children.map(\n    children,\n    (child: React.ReactElement<OptionProps>, i) => {\n      if (React.isValidElement(child)) {\n        if (child.type === OptionField) {\n          return createOption(child.props, i)\n        }\n\n        if (child.props.children) {\n          const nestedChildren = mapOptions(child.props.children, {\n            createOption,\n          })\n          return React.cloneElement(child, child.props, nestedChildren)\n        }\n      }\n\n      return child\n    }\n  )\n}\n\nexport function makeOptions<T = DrawerListProps['data']>(\n  children: React.ReactNode\n): T {\n  return React.Children.map(children, (child) => {\n    if (child?.['props']?.children?.type === OptionField) {\n      child = child['props'].children\n    }\n\n    if (React.isValidElement(child) && child.type === OptionField) {\n      const props = child.props as OptionFieldProps\n      const title = props.children ?? props.title ?? <em>Untitled</em>\n      const content = props.text ? [title, props.text] : title\n      const selectedKey = String(props.value ?? '')\n\n      return { selectedKey, content }\n    }\n\n    // For other children, just show them as content\n    if (child) {\n      return {\n        content: child,\n      }\n    }\n  }) as T\n}\n\nfunction renderDropdownItems(data: Data) {\n  return (\n    data?.map(({ value, title, text }) => ({\n      selectedKey: value,\n      content: (text ? [title, text] : title) || <em>Untitled</em>,\n    })) || []\n  )\n}\n\nSelection._supportsSpacingProps = true\nexport default Selection\n"],"mappings":"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"}
+{"version":3,"file":"Selection.js","names":["React","useMemo","useCallback","classnames","makeUniqueId","ToggleButton","Dropdown","Radio","HelpButton","Autocomplete","OptionField","useFieldProps","pickSpacingProps","FieldBlock","FormError","convertCamelCaseProps","useDataValue","Selection","props","clearValue","id","className","variant","label","labelDescription","layout","optionsLayout","placeholder","value","info","warning","error","hasError","disabled","help","emptyValue","width","htmlAttributes","setHasFocus","handleChange","data","dataPath","children","autocompleteProps","dropdownProps","getValueByPath","dataList","handleDropdownChange","_ref","selectedKey","onChangeHandler","_ref2","undefined","handleShow","_ref3","handleHide","_ref4","cn","fieldBlockProps","_objectSpread","forId","Component","items","renderRadioItems","createElement","_extends","asFieldset","Children","count","Group","layout_direction","on_change","String","status","getStatus","renderDropdownItems","concat","makeOptions","filter","Boolean","sharedProps","list_class","portal_class","title","suffix","content","on_show","on_hide","stretch","_error$message","message","Error","toString","_ref5","optionsCount","length","createOption","i","rest","_objectWithoutProperties","_excluded","size","key","text","map","mapOptions","_ref6","child","isValidElement","type","nestedChildren","cloneElement","_child","_child$props","_child$props$children","_ref7","_props$children","_props$value","_em","_ref8","_em2","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Selection/Selection.tsx"],"sourcesContent":["import React, { useMemo, useCallback } from 'react'\nimport classnames from 'classnames'\nimport { makeUniqueId } from '../../../../shared/component-helper'\nimport {\n  ToggleButton,\n  Dropdown,\n  Radio,\n  HelpButton,\n  Autocomplete,\n} from '../../../../components'\nimport OptionField, { Props as OptionFieldProps } from '../Option'\nimport { useFieldProps } from '../../hooks'\nimport { ReturnAdditional } from '../../hooks/useFieldProps'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport FieldBlock from '../../FieldBlock'\nimport {\n  FormError,\n  FieldProps,\n  FieldHelpProps,\n  FieldBlockWidth,\n  Path,\n} from '../../types'\nimport type { FormStatusText } from '../../../../components/FormStatus'\nimport type { AutocompleteAllProps } from '../../../../components/Autocomplete'\nimport type { DropdownAllProps } from '../../../../components/Dropdown'\nimport { HelpButtonProps } from '../../../../components/HelpButton'\nimport { DrawerListProps } from '../../../../fragments/DrawerList'\nimport {\n  convertCamelCaseProps,\n  ToCamelCase,\n} from '../../../../shared/helpers/withCamelCaseProps'\nimport useDataValue from '../../hooks/useDataValue'\n\ntype IOption = {\n  title: string | React.ReactNode\n  value: number | string\n  status: FormStatusText\n}\nexport type Data = Array<{\n  value: string\n  title: React.ReactNode\n  text?: React.ReactNode\n}>\n\nexport type Props = FieldHelpProps &\n  FieldProps<IOption['value']> & {\n    /**\n     * Defines the variant of the component.\n     * Default: dropdown\n     */\n    variant?: 'dropdown' | 'autocomplete' | 'radio' | 'button'\n\n    /**\n     * The width of the component.\n     * Default: large\n     */\n    width?: FieldBlockWidth\n\n    /**\n     * Defines the layout of the options for radio and button variants.\n     */\n    optionsLayout?: 'horizontal' | 'vertical'\n\n    /**\n     * The path to the context data (Form.Handler).\n     * The context data object needs to have a `value` and a `title` property.\n     */\n    dataPath?: Path\n\n    /**\n     * Data to be used for the component. The object needs to have a `value` and a `title` property.\n     * The generated options will be placed above given JSX based children.\n     */\n    data?: Data\n\n    /**\n     * Autocomplete specific props\n     */\n    autocompleteProps?: ToCamelCase<AutocompleteAllProps>\n\n    /**\n     * Dropdown specific props\n     */\n    dropdownProps?: ToCamelCase<DropdownAllProps>\n\n    /**\n     * The content of the component.\n     */\n    children?: React.ReactNode\n  }\n\nfunction Selection(props: Props) {\n  const clearValue = useMemo(() => `clear-option-${makeUniqueId()}`, [])\n\n  const {\n    id,\n    className,\n    variant = 'dropdown',\n    label,\n    labelDescription,\n    layout = 'vertical',\n    optionsLayout = 'vertical',\n    placeholder,\n    value,\n    info,\n    warning,\n    error,\n    hasError,\n    disabled,\n    help,\n    emptyValue,\n    width = 'large',\n    htmlAttributes,\n    setHasFocus,\n    handleChange,\n    data,\n    dataPath,\n    children,\n\n    // - Autocomplete and Dropdown specific props\n    autocompleteProps,\n    dropdownProps,\n  } = useFieldProps(props)\n\n  const { getValueByPath } = useDataValue()\n  let dataList = data\n  if (dataPath) {\n    dataList = getValueByPath(dataPath)\n  }\n\n  const handleDropdownChange = useCallback(\n    ({ data }) => {\n      const selectedKey = data?.selectedKey\n      handleChange?.(\n        !selectedKey || selectedKey === clearValue\n          ? emptyValue\n          : selectedKey\n      )\n    },\n    [handleChange, emptyValue, clearValue]\n  )\n\n  const onChangeHandler = useCallback(\n    ({ value }) => {\n      handleChange?.(value === undefined ? emptyValue : value)\n    },\n    [handleChange, emptyValue]\n  )\n\n  // Specific handleShow and handleHide because Dropdown preserve the initially received callbacks, so changes\n  // due to `useCallback` usage will have no effect, leading to useFieldPropss handleFocus and handleBlur sending out old\n  // copies of value as arguments.\n  const handleShow = useCallback(\n    ({ data }) => {\n      setHasFocus(true, data?.selectedKey)\n    },\n    [setHasFocus]\n  )\n\n  const handleHide = useCallback(\n    ({ data }) => {\n      setHasFocus(false, data?.selectedKey)\n    },\n    [setHasFocus]\n  )\n\n  const cn = classnames(\n    'dnb-forms-field-selection',\n    `dnb-forms-field-selection__variant--${variant}`,\n    `dnb-forms-field-selection__options-layout--${optionsLayout}`,\n    className\n  )\n\n  const fieldBlockProps = {\n    forId: id,\n    className: cn,\n    ...pickSpacingProps(props),\n    info,\n    warning,\n    error,\n    layout,\n    label,\n    labelDescription,\n  }\n\n  switch (variant) {\n    case 'radio':\n    case 'button': {\n      const Component = (\n        variant === 'radio' ? Radio : ToggleButton\n      ) as typeof Radio & typeof ToggleButton\n\n      const items = renderRadioItems({\n        id,\n        value,\n        variant,\n        info,\n        warning,\n        htmlAttributes,\n        children,\n        dataList,\n        hasError,\n      })\n\n      return (\n        <FieldBlock\n          {...fieldBlockProps}\n          asFieldset={React.Children.count(items) > 1}\n        >\n          <Component.Group\n            className={cn}\n            layout_direction={\n              optionsLayout === 'horizontal' ? 'row' : 'column'\n            }\n            disabled={disabled}\n            on_change={onChangeHandler}\n            value={String(value ?? '')}\n          >\n            {items}\n          </Component.Group>\n        </FieldBlock>\n      )\n    }\n\n    case 'autocomplete':\n    case 'dropdown': {\n      const status = getStatus(error, info, warning)\n      const data = renderDropdownItems(dataList)\n        .concat(makeOptions(children))\n        .filter(Boolean)\n\n      const sharedProps: AutocompleteAllProps & DropdownAllProps = {\n        id,\n        list_class: 'dnb-forms-field-selection__list',\n        portal_class: 'dnb-forms-field-selection__portal',\n        title: placeholder,\n        value: String(value ?? ''),\n        status: (hasError || status) && 'error',\n        disabled,\n        ...htmlAttributes,\n        data,\n        suffix: help ? (\n          <HelpButton title={help.title}>{help.content}</HelpButton>\n        ) : undefined,\n        on_change: handleDropdownChange,\n        on_show: handleShow,\n        on_hide: handleHide,\n        stretch: true,\n      }\n\n      return (\n        <FieldBlock {...fieldBlockProps} width={width}>\n          {variant === 'autocomplete' ? (\n            <Autocomplete\n              {...sharedProps}\n              {...(autocompleteProps\n                ? (convertCamelCaseProps(\n                    autocompleteProps\n                  ) as AutocompleteAllProps)\n                : null)}\n            />\n          ) : (\n            <Dropdown\n              {...sharedProps}\n              {...(dropdownProps\n                ? (convertCamelCaseProps(\n                    dropdownProps\n                  ) as DropdownAllProps)\n                : null)}\n            />\n          )}\n        </FieldBlock>\n      )\n    }\n  }\n}\n\nexport function getStatus(\n  error: Error | FormError | undefined,\n  info: React.ReactNode,\n  warning: React.ReactNode\n) {\n  return (\n    error?.message ??\n    ((warning instanceof Error && warning.message) ||\n      (warning instanceof FormError && warning.message) ||\n      warning?.toString() ||\n      (info instanceof Error && info.message) ||\n      (info instanceof FormError && info.message) ||\n      info?.toString())\n  )\n}\n\ntype OptionProps = React.ComponentProps<\n  React.FC<{\n    error?: Error | FormError | undefined\n    title: React.ReactNode\n    help?: HelpButtonProps\n    children?: React.ReactNode\n  }>\n>\n\nfunction renderRadioItems({\n  id,\n  value,\n  variant,\n  info,\n  warning,\n  htmlAttributes,\n  children,\n  dataList,\n  hasError,\n}: {\n  id: string\n  value: Props['value']\n  variant: Props['variant']\n  info: Props['info']\n  warning: Props['warning']\n  htmlAttributes: Props['htmlAttributes']\n  children: Props['children']\n  dataList: Data\n  hasError: ReturnAdditional<Props['value']>['hasError']\n}) {\n  const optionsCount =\n    React.Children.count(children) + (dataList?.length || 0)\n\n  const createOption = (props: OptionProps, i: number) => {\n    const { error, title, help, children, ...rest } = props\n\n    const label = title ?? children\n    const status = getStatus(error, info, warning)\n    const suffix = help ? (\n      <HelpButton size=\"small\" title={help.title}>\n        {help.content}\n      </HelpButton>\n    ) : undefined\n\n    const Component = (\n      variant === 'radio' ? Radio : ToggleButton\n    ) as typeof Radio & typeof ToggleButton\n\n    return (\n      <Component\n        id={optionsCount === 1 ? id : undefined}\n        key={`option-${i}-${id}`}\n        label={variant === 'radio' ? label : undefined}\n        text={variant === 'button' ? label : undefined}\n        value={String(value ?? '')}\n        status={(hasError || status) && 'error'}\n        suffix={suffix}\n        {...htmlAttributes}\n        {...rest}\n      />\n    )\n  }\n\n  return [\n    ...(dataList || []).map((props, i) => {\n      return createOption(props as OptionProps, i)\n    }),\n    ...(mapOptions(children, { createOption }) || []),\n  ].filter(Boolean)\n}\n\nexport function mapOptions(children: React.ReactNode, { createOption }) {\n  return React.Children.map(\n    children,\n    (child: React.ReactElement<OptionProps>, i) => {\n      if (React.isValidElement(child)) {\n        if (child.type === OptionField) {\n          return createOption(child.props, i)\n        }\n\n        if (child.props.children) {\n          const nestedChildren = mapOptions(child.props.children, {\n            createOption,\n          })\n          return React.cloneElement(child, child.props, nestedChildren)\n        }\n      }\n\n      return child\n    }\n  )\n}\n\nexport function makeOptions<T = DrawerListProps['data']>(\n  children: React.ReactNode\n): T {\n  return React.Children.map(children, (child) => {\n    if (child?.['props']?.children?.type === OptionField) {\n      child = child['props'].children\n    }\n\n    if (React.isValidElement(child) && child.type === OptionField) {\n      const props = child.props as OptionFieldProps\n      const title = props.children ?? props.title ?? <em>Untitled</em>\n      const content = props.text ? [title, props.text] : title\n      const selectedKey = String(props.value ?? '')\n\n      return { selectedKey, content }\n    }\n\n    // For other children, just show them as content\n    if (child) {\n      return {\n        content: child,\n      }\n    }\n  }) as T\n}\n\nfunction renderDropdownItems(data: Data) {\n  return (\n    data?.map(({ value, title, text }) => ({\n      selectedKey: value,\n      content: (text ? [title, text] : title) || <em>Untitled</em>,\n    })) || []\n  )\n}\n\nSelection._supportsSpacingProps = true\nexport default Selection\n"],"mappings":"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"}

package/extensions/forms/Form/Visibility/Visibility.d.ts

@@ -11,7 +11,7 @@ export type VisibleWhen = {
     hasValue: unknown;
 }
 /**
- * @deprecated Will be remove din v11!
+ * @deprecated Will be removed in v11!
  */
  | {
     path: Path;
@@ -19,7 +19,7 @@ export type VisibleWhen = {
     withValue: (value: unknown) => boolean;
 }
 /**
- * @deprecated  Will be remove din v11!
+ * @deprecated  Will be removed in v11!
  */
  | {
     itemPath: Path;

package/extensions/forms/Form/Visibility/Visibility.js.map

@@ -1 +1 @@
-{"version":3,"file":"Visibility.js","names":["React","warn","useMountEffect","HeightAnimation","FieldProvider","useVisibility","VisibilityContext","Visibility","_ref","visible","pathDefined","pathUndefined","pathTruthy","pathFalsy","pathTrue","pathFalse","pathValue","whenValue","visibleWhen","visibleWhenNot","inferData","filterData","animate","keepInDOM","compensateForGap","fieldPropsWhenHidden","children","rest","_objectWithoutProperties","_excluded","check","open","content","createElement","Provider","value","isVisible","props","_extends","Boolean","className","hidden","Fragment","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Form/Visibility/Visibility.tsx"],"sourcesContent":["import React, { AriaAttributes } from 'react'\n\nimport { warn } from '../../../../shared/helpers'\nimport useMountEffect from '../../../../shared/helpers/useMountEffect'\nimport HeightAnimation, {\n  HeightAnimationProps,\n} from '../../../../components/HeightAnimation'\nimport FieldProvider from '../../Field/Provider'\nimport useVisibility from './useVisibility'\n\nimport type { Path, UseFieldProps } from '../../types'\nimport type { DataAttributes } from '../../hooks/useFieldProps'\nimport { FilterData } from '../../DataContext'\nimport VisibilityContext from './VisibilityContext'\n\nexport type VisibleWhen =\n  | {\n      path: Path\n      hasValue: unknown\n    }\n  | {\n      itemPath: Path\n      hasValue: unknown\n    }\n  /**\n   * @deprecated Will be remove din v11!\n   */\n  | {\n      path: Path\n      /** @deprecated Use `hasValue` instead */\n      withValue: (value: unknown) => boolean\n    }\n  /**\n   * @deprecated  Will be remove din v11!\n   */\n  | {\n      itemPath: Path\n      /** @deprecated Use `hasValue` instead */\n      withValue: (value: unknown) => boolean\n    }\n\nexport type Props = {\n  visible?: boolean\n  /** Given data context path must be defined to show children */\n  pathDefined?: Path\n  /** Given data context path must be undefined to show children */\n  pathUndefined?: Path\n  /** Given data context path must be truthy to show children */\n  pathTruthy?: Path\n  /** Given data context path must be falsy to show children */\n  pathFalsy?: Path\n  /** Given data context path must be true to show children */\n  pathTrue?: Path\n  /** Given data context path must be false to show children */\n  pathFalse?: Path\n  /** Provide a `path` or `itemPath` and a `hasValue` method that returns a boolean or the excepted value in order to show children. The first parameter is the value of the path. */\n  visibleWhen?: VisibleWhen\n  /** Same as `visibleWhen`, but with inverted logic. */\n  visibleWhenNot?: VisibleWhen\n  /** Infer visibility calling given derivative function with the whole data set. Should return true/false for visibility.   */\n  inferData?: (data: unknown) => boolean\n  /** Filter data based on provided criteria. The first parameter is the path, the second is the value, and the third is the props, and the fourth is the internal. Return false to filter out the data. */\n  filterData?: FilterData\n  /** Animate the visibility change */\n  animate?: boolean\n  /** Keep the content in the DOM, even if it's not visible */\n  keepInDOM?: boolean\n  /** To compensate for CSS gap between the rows, so animation does not jump during the animation. Provide a CSS unit or `auto`. Defaults to `null`. */\n  compensateForGap?: HeightAnimationProps['compensateForGap']\n  /** When visibility is hidden, and `keepInDOM` is true, pass these props to the children */\n  fieldPropsWhenHidden?: UseFieldProps & DataAttributes & AriaAttributes\n  element?: HeightAnimationProps['element']\n  children: React.ReactNode\n\n  /** @deprecated Use `visibleWhen` instead */\n  pathValue?: string\n  /** @deprecated Use `visibleWhen` instead */\n  whenValue?: unknown\n}\n\nfunction Visibility({\n  visible,\n  pathDefined,\n  pathUndefined,\n  pathTruthy,\n  pathFalsy,\n  pathTrue,\n  pathFalse,\n  pathValue,\n  whenValue,\n  visibleWhen,\n  visibleWhenNot,\n  inferData,\n  filterData,\n  animate,\n  keepInDOM,\n  compensateForGap,\n  fieldPropsWhenHidden,\n  children,\n  ...rest\n}: Props) {\n  useMountEffect(() => {\n    if (fieldPropsWhenHidden && !keepInDOM) {\n      warn('Using \"fieldPropsWhenHidden\" requires \"keepInDOM\" to be true.')\n    }\n  })\n\n  const { check } = useVisibility({\n    visible,\n    pathDefined,\n    pathUndefined,\n    pathTruthy,\n    pathFalsy,\n    pathTrue,\n    pathFalse,\n    pathValue,\n    whenValue,\n    visibleWhen,\n    visibleWhenNot,\n    inferData,\n    filterData,\n  })\n  const open = check()\n  const content = (\n    <VisibilityContext.Provider\n      value={{\n        isVisible: open,\n      }}\n    >\n      {children}\n    </VisibilityContext.Provider>\n  )\n\n  if (animate) {\n    const props = !open ? fieldPropsWhenHidden : null\n\n    return (\n      <HeightAnimation\n        open={open}\n        keepInDOM={Boolean(keepInDOM)}\n        className=\"dnb-forms-visibility\"\n        compensateForGap={compensateForGap}\n        {...rest}\n      >\n        <FieldProvider {...props}>{content}</FieldProvider>\n      </HeightAnimation>\n    )\n  }\n\n  if (keepInDOM) {\n    const props = !open ? fieldPropsWhenHidden : null\n    return (\n      <span className=\"dnb-forms-visibility\" hidden={!open}>\n        <FieldProvider {...props}>{content}</FieldProvider>\n      </span>\n    )\n  }\n\n  return <>{open ? content : null}</>\n}\n\nVisibility._supportsSpacingProps = 'children'\nexport default Visibility\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAA0B,OAAO;AAE7C,SAASC,IAAI,QAAQ,4BAA4B;AACjD,OAAOC,cAAc,MAAM,2CAA2C;AACtE,OAAOC,eAAe,MAEf,wCAAwC;AAC/C,OAAOC,aAAa,MAAM,sBAAsB;AAChD,OAAOC,aAAa,MAAM,iBAAiB;AAK3C,OAAOC,iBAAiB,MAAM,qBAAqB;AAmEnD,SAASC,UAAUA,CAAAC,IAAA,EAoBT;EAAA,IApBU;MAClBC,OAAO;MACPC,WAAW;MACXC,aAAa;MACbC,UAAU;MACVC,SAAS;MACTC,QAAQ;MACRC,SAAS;MACTC,SAAS;MACTC,SAAS;MACTC,WAAW;MACXC,cAAc;MACdC,SAAS;MACTC,UAAU;MACVC,OAAO;MACPC,SAAS;MACTC,gBAAgB;MAChBC,oBAAoB;MACpBC;IAEK,CAAC,GAAAlB,IAAA;IADHmB,IAAI,GAAAC,wBAAA,CAAApB,IAAA,EAAAqB,SAAA;EAEP3B,cAAc,CAAC,MAAM;IACnB,IAAIuB,oBAAoB,IAAI,CAACF,SAAS,EAAE;MACtCtB,IAAI,CAAC,+DAA+D,CAAC;IACvE;EACF,CAAC,CAAC;EAEF,MAAM;IAAE6B;EAAM,CAAC,GAAGzB,aAAa,CAAC;IAC9BI,OAAO;IACPC,WAAW;IACXC,aAAa;IACbC,UAAU;IACVC,SAAS;IACTC,QAAQ;IACRC,SAAS;IACTC,SAAS;IACTC,SAAS;IACTC,WAAW;IACXC,cAAc;IACdC,SAAS;IACTC;EACF,CAAC,CAAC;EACF,MAAMU,IAAI,GAAGD,KAAK,CAAC,CAAC;EACpB,MAAME,OAAO,GACXhC,KAAA,CAAAiC,aAAA,CAAC3B,iBAAiB,CAAC4B,QAAQ;IACzBC,KAAK,EAAE;MACLC,SAAS,EAAEL;IACb;EAAE,GAEDL,QACyB,CAC7B;EAED,IAAIJ,OAAO,EAAE;IACX,MAAMe,KAAK,GAAG,CAACN,IAAI,GAAGN,oBAAoB,GAAG,IAAI;IAEjD,OACEzB,KAAA,CAAAiC,aAAA,CAAC9B,eAAe,EAAAmC,QAAA;MACdP,IAAI,EAAEA,IAAK;MACXR,SAAS,EAAEgB,OAAO,CAAChB,SAAS,CAAE;MAC9BiB,SAAS,EAAC,sBAAsB;MAChChB,gBAAgB,EAAEA;IAAiB,GAC/BG,IAAI,GAER3B,KAAA,CAAAiC,aAAA,CAAC7B,aAAa,EAAKiC,KAAK,EAAGL,OAAuB,CACnC,CAAC;EAEtB;EAEA,IAAIT,SAAS,EAAE;IACb,MAAMc,KAAK,GAAG,CAACN,IAAI,GAAGN,oBAAoB,GAAG,IAAI;IACjD,OACEzB,KAAA,CAAAiC,aAAA;MAAMO,SAAS,EAAC,sBAAsB;MAACC,MAAM,EAAE,CAACV;IAAK,GACnD/B,KAAA,CAAAiC,aAAA,CAAC7B,aAAa,EAAKiC,KAAK,EAAGL,OAAuB,CAC9C,CAAC;EAEX;EAEA,OAAOhC,KAAA,CAAAiC,aAAA,CAAAjC,KAAA,CAAA0C,QAAA,QAAGX,IAAI,GAAGC,OAAO,GAAG,IAAO,CAAC;AACrC;AAEAzB,UAAU,CAACoC,qBAAqB,GAAG,UAAU;AAC7C,eAAepC,UAAU"}
+{"version":3,"file":"Visibility.js","names":["React","warn","useMountEffect","HeightAnimation","FieldProvider","useVisibility","VisibilityContext","Visibility","_ref","visible","pathDefined","pathUndefined","pathTruthy","pathFalsy","pathTrue","pathFalse","pathValue","whenValue","visibleWhen","visibleWhenNot","inferData","filterData","animate","keepInDOM","compensateForGap","fieldPropsWhenHidden","children","rest","_objectWithoutProperties","_excluded","check","open","content","createElement","Provider","value","isVisible","props","_extends","Boolean","className","hidden","Fragment","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Form/Visibility/Visibility.tsx"],"sourcesContent":["import React, { AriaAttributes } from 'react'\n\nimport { warn } from '../../../../shared/helpers'\nimport useMountEffect from '../../../../shared/helpers/useMountEffect'\nimport HeightAnimation, {\n  HeightAnimationProps,\n} from '../../../../components/HeightAnimation'\nimport FieldProvider from '../../Field/Provider'\nimport useVisibility from './useVisibility'\n\nimport type { Path, UseFieldProps } from '../../types'\nimport type { DataAttributes } from '../../hooks/useFieldProps'\nimport { FilterData } from '../../DataContext'\nimport VisibilityContext from './VisibilityContext'\n\nexport type VisibleWhen =\n  | {\n      path: Path\n      hasValue: unknown\n    }\n  | {\n      itemPath: Path\n      hasValue: unknown\n    }\n  /**\n   * @deprecated Will be removed in v11!\n   */\n  | {\n      path: Path\n      /** @deprecated Use `hasValue` instead */\n      withValue: (value: unknown) => boolean\n    }\n  /**\n   * @deprecated  Will be removed in v11!\n   */\n  | {\n      itemPath: Path\n      /** @deprecated Use `hasValue` instead */\n      withValue: (value: unknown) => boolean\n    }\n\nexport type Props = {\n  visible?: boolean\n  /** Given data context path must be defined to show children */\n  pathDefined?: Path\n  /** Given data context path must be undefined to show children */\n  pathUndefined?: Path\n  /** Given data context path must be truthy to show children */\n  pathTruthy?: Path\n  /** Given data context path must be falsy to show children */\n  pathFalsy?: Path\n  /** Given data context path must be true to show children */\n  pathTrue?: Path\n  /** Given data context path must be false to show children */\n  pathFalse?: Path\n  /** Provide a `path` or `itemPath` and a `hasValue` method that returns a boolean or the excepted value in order to show children. The first parameter is the value of the path. */\n  visibleWhen?: VisibleWhen\n  /** Same as `visibleWhen`, but with inverted logic. */\n  visibleWhenNot?: VisibleWhen\n  /** Infer visibility calling given derivative function with the whole data set. Should return true/false for visibility.   */\n  inferData?: (data: unknown) => boolean\n  /** Filter data based on provided criteria. The first parameter is the path, the second is the value, and the third is the props, and the fourth is the internal. Return false to filter out the data. */\n  filterData?: FilterData\n  /** Animate the visibility change */\n  animate?: boolean\n  /** Keep the content in the DOM, even if it's not visible */\n  keepInDOM?: boolean\n  /** To compensate for CSS gap between the rows, so animation does not jump during the animation. Provide a CSS unit or `auto`. Defaults to `null`. */\n  compensateForGap?: HeightAnimationProps['compensateForGap']\n  /** When visibility is hidden, and `keepInDOM` is true, pass these props to the children */\n  fieldPropsWhenHidden?: UseFieldProps & DataAttributes & AriaAttributes\n  element?: HeightAnimationProps['element']\n  children: React.ReactNode\n\n  /** @deprecated Use `visibleWhen` instead */\n  pathValue?: string\n  /** @deprecated Use `visibleWhen` instead */\n  whenValue?: unknown\n}\n\nfunction Visibility({\n  visible,\n  pathDefined,\n  pathUndefined,\n  pathTruthy,\n  pathFalsy,\n  pathTrue,\n  pathFalse,\n  pathValue,\n  whenValue,\n  visibleWhen,\n  visibleWhenNot,\n  inferData,\n  filterData,\n  animate,\n  keepInDOM,\n  compensateForGap,\n  fieldPropsWhenHidden,\n  children,\n  ...rest\n}: Props) {\n  useMountEffect(() => {\n    if (fieldPropsWhenHidden && !keepInDOM) {\n      warn('Using \"fieldPropsWhenHidden\" requires \"keepInDOM\" to be true.')\n    }\n  })\n\n  const { check } = useVisibility({\n    visible,\n    pathDefined,\n    pathUndefined,\n    pathTruthy,\n    pathFalsy,\n    pathTrue,\n    pathFalse,\n    pathValue,\n    whenValue,\n    visibleWhen,\n    visibleWhenNot,\n    inferData,\n    filterData,\n  })\n  const open = check()\n  const content = (\n    <VisibilityContext.Provider\n      value={{\n        isVisible: open,\n      }}\n    >\n      {children}\n    </VisibilityContext.Provider>\n  )\n\n  if (animate) {\n    const props = !open ? fieldPropsWhenHidden : null\n\n    return (\n      <HeightAnimation\n        open={open}\n        keepInDOM={Boolean(keepInDOM)}\n        className=\"dnb-forms-visibility\"\n        compensateForGap={compensateForGap}\n        {...rest}\n      >\n        <FieldProvider {...props}>{content}</FieldProvider>\n      </HeightAnimation>\n    )\n  }\n\n  if (keepInDOM) {\n    const props = !open ? fieldPropsWhenHidden : null\n    return (\n      <span className=\"dnb-forms-visibility\" hidden={!open}>\n        <FieldProvider {...props}>{content}</FieldProvider>\n      </span>\n    )\n  }\n\n  return <>{open ? content : null}</>\n}\n\nVisibility._supportsSpacingProps = 'children'\nexport default Visibility\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAA0B,OAAO;AAE7C,SAASC,IAAI,QAAQ,4BAA4B;AACjD,OAAOC,cAAc,MAAM,2CAA2C;AACtE,OAAOC,eAAe,MAEf,wCAAwC;AAC/C,OAAOC,aAAa,MAAM,sBAAsB;AAChD,OAAOC,aAAa,MAAM,iBAAiB;AAK3C,OAAOC,iBAAiB,MAAM,qBAAqB;AAmEnD,SAASC,UAAUA,CAAAC,IAAA,EAoBT;EAAA,IApBU;MAClBC,OAAO;MACPC,WAAW;MACXC,aAAa;MACbC,UAAU;MACVC,SAAS;MACTC,QAAQ;MACRC,SAAS;MACTC,SAAS;MACTC,SAAS;MACTC,WAAW;MACXC,cAAc;MACdC,SAAS;MACTC,UAAU;MACVC,OAAO;MACPC,SAAS;MACTC,gBAAgB;MAChBC,oBAAoB;MACpBC;IAEK,CAAC,GAAAlB,IAAA;IADHmB,IAAI,GAAAC,wBAAA,CAAApB,IAAA,EAAAqB,SAAA;EAEP3B,cAAc,CAAC,MAAM;IACnB,IAAIuB,oBAAoB,IAAI,CAACF,SAAS,EAAE;MACtCtB,IAAI,CAAC,+DAA+D,CAAC;IACvE;EACF,CAAC,CAAC;EAEF,MAAM;IAAE6B;EAAM,CAAC,GAAGzB,aAAa,CAAC;IAC9BI,OAAO;IACPC,WAAW;IACXC,aAAa;IACbC,UAAU;IACVC,SAAS;IACTC,QAAQ;IACRC,SAAS;IACTC,SAAS;IACTC,SAAS;IACTC,WAAW;IACXC,cAAc;IACdC,SAAS;IACTC;EACF,CAAC,CAAC;EACF,MAAMU,IAAI,GAAGD,KAAK,CAAC,CAAC;EACpB,MAAME,OAAO,GACXhC,KAAA,CAAAiC,aAAA,CAAC3B,iBAAiB,CAAC4B,QAAQ;IACzBC,KAAK,EAAE;MACLC,SAAS,EAAEL;IACb;EAAE,GAEDL,QACyB,CAC7B;EAED,IAAIJ,OAAO,EAAE;IACX,MAAMe,KAAK,GAAG,CAACN,IAAI,GAAGN,oBAAoB,GAAG,IAAI;IAEjD,OACEzB,KAAA,CAAAiC,aAAA,CAAC9B,eAAe,EAAAmC,QAAA;MACdP,IAAI,EAAEA,IAAK;MACXR,SAAS,EAAEgB,OAAO,CAAChB,SAAS,CAAE;MAC9BiB,SAAS,EAAC,sBAAsB;MAChChB,gBAAgB,EAAEA;IAAiB,GAC/BG,IAAI,GAER3B,KAAA,CAAAiC,aAAA,CAAC7B,aAAa,EAAKiC,KAAK,EAAGL,OAAuB,CACnC,CAAC;EAEtB;EAEA,IAAIT,SAAS,EAAE;IACb,MAAMc,KAAK,GAAG,CAACN,IAAI,GAAGN,oBAAoB,GAAG,IAAI;IACjD,OACEzB,KAAA,CAAAiC,aAAA;MAAMO,SAAS,EAAC,sBAAsB;MAACC,MAAM,EAAE,CAACV;IAAK,GACnD/B,KAAA,CAAAiC,aAAA,CAAC7B,aAAa,EAAKiC,KAAK,EAAGL,OAAuB,CAC9C,CAAC;EAEX;EAEA,OAAOhC,KAAA,CAAAiC,aAAA,CAAAjC,KAAA,CAAA0C,QAAA,QAAGX,IAAI,GAAGC,OAAO,GAAG,IAAO,CAAC;AACrC;AAEAzB,UAAU,CAACoC,qBAAqB,GAAG,UAAU;AAC7C,eAAepC,UAAU"}

package/extensions/forms/Form/data-context/useData.d.ts

@@ -5,7 +5,7 @@ import { FilterData, VisibleDataHandler } from '../../DataContext/Context';
 type PathImpl<T, P extends string> = P extends `${infer Key}/${infer Rest}` ? Key extends keyof T ? Rest extends '' ? T[Key] : PathImpl<T[Key], Rest> : never : T[P & keyof T];
 type PathType<T, P extends string> = P extends `/${infer Rest}` ? PathImpl<T, Rest> : never;
 type UseDataReturnUpdate<Data> = <P extends Path>(path: P, value: ((value: PathType<Data, P>) => unknown) | unknown) => void;
-export type UseDataReturnGetValue<Data> = <P extends Path>(path: P) => PathType<Data, P> | unknown;
+export type UseDataReturnGetValue<Data> = <P extends Path>(path: P) => PathType<Data, P> | any;
 export type UseDataReturnFilterData<Data> = (filterDataHandler: FilterData, data?: Data) => Partial<Data>;
 export type UseDataReturnVisibleData<Data> = VisibleDataHandler<Data>;
 type UseDataReturn<Data> = {

package/extensions/forms/Form/data-context/useData.js.map

@@ -1 +1 @@
-{"version":3,"file":"useData.js","names":["useCallback","useContext","useMemo","useReducer","useRef","pointer","useSharedState","useMountEffect","DataContext","useData","id","arguments","length","undefined","initialData","sharedDataRef","sharedAttachmentsRef","forceUpdate","current","rerenderUseDataHook","dataContext","hasContext","Error","data","filterDataHandler","updateDataValue","setData","set","newData","update","path","value","existingData","structuredClone","existingValue","has","get","newValue","extend","remove","reduceToVisibleFields","_dataContext$visibleD","options","_sharedAttachmentsRef","_sharedAttachmentsRef2","visibleDataHandler","call","filterData","filter","_dataContext$filterDa","_sharedAttachmentsRef3","_sharedAttachmentsRef4","getValue","hadInitialData"],"sources":["../../../../../../src/extensions/forms/Form/data-context/useData.tsx"],"sourcesContent":["import {\n  useCallback,\n  useContext,\n  useMemo,\n  useReducer,\n  useRef,\n} from 'react'\nimport pointer, { JsonObject } from '../../utils/json-pointer'\nimport {\n  SharedStateId,\n  useSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport useMountEffect from '../../../../shared/helpers/useMountEffect'\nimport type { Path } from '../../types'\nimport DataContext, {\n  FilterData,\n  FilterDataHandler,\n  VisibleDataHandler,\n} from '../../DataContext/Context'\n\ntype PathImpl<T, P extends string> = P extends `${infer Key}/${infer Rest}`\n  ? Key extends keyof T\n    ? Rest extends ''\n      ? T[Key]\n      : PathImpl<T[Key], Rest>\n    : never\n  : T[P & keyof T]\n\ntype PathType<T, P extends string> = P extends `/${infer Rest}`\n  ? PathImpl<T, Rest>\n  : never\n\ntype UseDataReturnUpdate<Data> = <P extends Path>(\n  path: P,\n  value: ((value: PathType<Data, P>) => unknown) | unknown\n) => void\n\nexport type UseDataReturnGetValue<Data> = <P extends Path>(\n  path: P\n) => PathType<Data, P> | unknown\n\nexport type UseDataReturnFilterData<Data> = (\n  filterDataHandler: FilterData,\n  data?: Data\n) => Partial<Data>\n\nexport type UseDataReturnVisibleData<Data> = VisibleDataHandler<Data>\n\ntype UseDataReturn<Data> = {\n  data: Data\n  set: (newData: Data) => void\n  update: UseDataReturnUpdate<Data>\n  remove: (path: Path) => void\n  getValue: UseDataReturnGetValue<Data>\n  filterData: UseDataReturnFilterData<Data>\n  reduceToVisibleFields: UseDataReturnVisibleData<Data>\n}\n\ntype SharedAttachment<Data> = {\n  rerenderUseDataHook: () => void\n  filterDataHandler?: FilterDataHandler<Data>\n  visibleDataHandler?: VisibleDataHandler<Data>\n}\n\n/**\n * Custom hook that provides form data management functionality.\n *\n * @template Data - The type of data being managed.\n * @param {SharedStateId} id - The identifier for the data.\n * @param {Data} initialData - The initial data value (optional).\n * @returns {UseDataReturn<Data>} An object containing the data and data management functions.\n */\nexport default function useData<Data = JsonObject>(\n  id: SharedStateId = undefined,\n  initialData: Data = undefined\n): UseDataReturn<Data> {\n  const sharedDataRef =\n    useRef<ReturnType<typeof useSharedState<Data>>>(null)\n  const sharedAttachmentsRef =\n    useRef<ReturnType<typeof useSharedState<SharedAttachment<Data>>>>(null)\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  sharedDataRef.current = useSharedState<Data>(\n    id,\n    initialData,\n    forceUpdate\n  )\n\n  sharedAttachmentsRef.current = useSharedState<SharedAttachment<Data>>(\n    id + '-attachments',\n    { rerenderUseDataHook: forceUpdate }\n  )\n\n  // If no id is provided, use the context data\n  const dataContext = useContext(DataContext)\n  if (!id) {\n    if (!dataContext.hasContext) {\n      throw new Error(\n        'useData needs to run inside DataContext (Form.Handler) or have a valid id'\n      )\n    }\n\n    sharedDataRef.current.data = dataContext.data\n    sharedAttachmentsRef.current.data.filterDataHandler =\n      dataContext.filterDataHandler\n  }\n\n  const updateDataValue = dataContext?.updateDataValue\n  const setData = dataContext?.setData\n\n  const set = useCallback(\n    (newData: Data) => {\n      if (id) {\n        sharedDataRef.current.update(newData)\n      } else {\n        setData?.(newData)\n      }\n    },\n    [id, setData]\n  )\n\n  const update = useCallback<UseDataReturnUpdate<Data>>(\n    (path, value = undefined) => {\n      const existingData = structuredClone(\n        sharedDataRef.current.data || {}\n      ) as Data & JsonObject\n      const existingValue = pointer.has(existingData, path)\n        ? pointer.get(existingData, path)\n        : undefined\n\n      // Get new value\n      const newValue =\n        typeof value === 'function' ? value(existingValue) : value\n\n      if (newValue !== existingValue) {\n        // Update existing data\n        pointer.set(existingData, path, newValue)\n\n        // Update provider with new data\n        if (id) {\n          sharedDataRef.current.extend(existingData)\n        } else {\n          updateDataValue(path, newValue)\n        }\n      }\n    },\n    [id, updateDataValue]\n  )\n\n  const remove = useCallback<UseDataReturn<Data>['remove']>(\n    (path) => {\n      const existingData = structuredClone(\n        sharedDataRef.current.data || {}\n      ) as Data & JsonObject\n\n      if (pointer.has(existingData, path)) {\n        // Remove existing data\n        pointer.remove(existingData, path)\n\n        // Update provider with new data\n        if (id) {\n          sharedDataRef.current.set(existingData)\n        } else {\n          updateDataValue(path, undefined)\n        }\n      }\n    },\n    [id, updateDataValue]\n  )\n\n  const reduceToVisibleFields = useCallback<\n    UseDataReturn<Data>['reduceToVisibleFields']\n  >(\n    (data, options = {}) => {\n      if (id) {\n        return sharedAttachmentsRef.current.data?.visibleDataHandler?.(\n          data,\n          options\n        )\n      }\n\n      return dataContext?.visibleDataHandler?.(data, options)\n    },\n    [dataContext, id]\n  )\n\n  const filterData = useCallback<UseDataReturn<Data>['filterData']>(\n    (filter, data = sharedDataRef.current.data) => {\n      if (id) {\n        return sharedAttachmentsRef.current.data?.filterDataHandler?.(\n          data,\n          filter\n        )\n      }\n\n      return dataContext?.filterDataHandler?.(data, filter)\n    },\n    [dataContext, id]\n  )\n\n  const getValue = useCallback<UseDataReturn<Data>['getValue']>((path) => {\n    if (pointer.has(sharedDataRef.current.data, path)) {\n      return pointer.get(sharedDataRef.current.data, path)\n    }\n\n    return undefined\n  }, [])\n\n  useMountEffect(() => {\n    if (id && !sharedDataRef.current.hadInitialData && initialData) {\n      sharedDataRef.current.extend(initialData)\n    }\n  })\n\n  const { data } = sharedDataRef.current\n\n  return useMemo(\n    () => ({\n      data,\n      remove,\n      update,\n      set,\n      getValue,\n      reduceToVisibleFields,\n      filterData,\n    }),\n    [\n      data,\n      remove,\n      update,\n      set,\n      getValue,\n      reduceToVisibleFields,\n      filterData,\n    ]\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"useData.js","names":["useCallback","useContext","useMemo","useReducer","useRef","pointer","useSharedState","useMountEffect","DataContext","useData","id","arguments","length","undefined","initialData","sharedDataRef","sharedAttachmentsRef","forceUpdate","current","rerenderUseDataHook","dataContext","hasContext","Error","data","filterDataHandler","updateDataValue","setData","set","newData","update","path","value","existingData","structuredClone","existingValue","has","get","newValue","extend","remove","reduceToVisibleFields","_dataContext$visibleD","options","_sharedAttachmentsRef","_sharedAttachmentsRef2","visibleDataHandler","call","filterData","filter","_dataContext$filterDa","_sharedAttachmentsRef3","_sharedAttachmentsRef4","getValue","hadInitialData"],"sources":["../../../../../../src/extensions/forms/Form/data-context/useData.tsx"],"sourcesContent":["import {\n  useCallback,\n  useContext,\n  useMemo,\n  useReducer,\n  useRef,\n} from 'react'\nimport pointer, { JsonObject } from '../../utils/json-pointer'\nimport {\n  SharedStateId,\n  useSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport useMountEffect from '../../../../shared/helpers/useMountEffect'\nimport type { Path } from '../../types'\nimport DataContext, {\n  FilterData,\n  FilterDataHandler,\n  VisibleDataHandler,\n} from '../../DataContext/Context'\n\ntype PathImpl<T, P extends string> = P extends `${infer Key}/${infer Rest}`\n  ? Key extends keyof T\n    ? Rest extends ''\n      ? T[Key]\n      : PathImpl<T[Key], Rest>\n    : never\n  : T[P & keyof T]\n\ntype PathType<T, P extends string> = P extends `/${infer Rest}`\n  ? PathImpl<T, Rest>\n  : never\n\ntype UseDataReturnUpdate<Data> = <P extends Path>(\n  path: P,\n  value: ((value: PathType<Data, P>) => unknown) | unknown\n) => void\n\nexport type UseDataReturnGetValue<Data> = <P extends Path>(\n  path: P\n) => PathType<Data, P> | any\n\nexport type UseDataReturnFilterData<Data> = (\n  filterDataHandler: FilterData,\n  data?: Data\n) => Partial<Data>\n\nexport type UseDataReturnVisibleData<Data> = VisibleDataHandler<Data>\n\ntype UseDataReturn<Data> = {\n  data: Data\n  set: (newData: Data) => void\n  update: UseDataReturnUpdate<Data>\n  remove: (path: Path) => void\n  getValue: UseDataReturnGetValue<Data>\n  filterData: UseDataReturnFilterData<Data>\n  reduceToVisibleFields: UseDataReturnVisibleData<Data>\n}\n\ntype SharedAttachment<Data> = {\n  rerenderUseDataHook: () => void\n  filterDataHandler?: FilterDataHandler<Data>\n  visibleDataHandler?: VisibleDataHandler<Data>\n}\n\n/**\n * Custom hook that provides form data management functionality.\n *\n * @template Data - The type of data being managed.\n * @param {SharedStateId} id - The identifier for the data.\n * @param {Data} initialData - The initial data value (optional).\n * @returns {UseDataReturn<Data>} An object containing the data and data management functions.\n */\nexport default function useData<Data = JsonObject>(\n  id: SharedStateId = undefined,\n  initialData: Data = undefined\n): UseDataReturn<Data> {\n  const sharedDataRef =\n    useRef<ReturnType<typeof useSharedState<Data>>>(null)\n  const sharedAttachmentsRef =\n    useRef<ReturnType<typeof useSharedState<SharedAttachment<Data>>>>(null)\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  sharedDataRef.current = useSharedState<Data>(\n    id,\n    initialData,\n    forceUpdate\n  )\n\n  sharedAttachmentsRef.current = useSharedState<SharedAttachment<Data>>(\n    id + '-attachments',\n    { rerenderUseDataHook: forceUpdate }\n  )\n\n  // If no id is provided, use the context data\n  const dataContext = useContext(DataContext)\n  if (!id) {\n    if (!dataContext.hasContext) {\n      throw new Error(\n        'useData needs to run inside DataContext (Form.Handler) or have a valid id'\n      )\n    }\n\n    sharedDataRef.current.data = dataContext.data\n    sharedAttachmentsRef.current.data.filterDataHandler =\n      dataContext.filterDataHandler\n  }\n\n  const updateDataValue = dataContext?.updateDataValue\n  const setData = dataContext?.setData\n\n  const set = useCallback(\n    (newData: Data) => {\n      if (id) {\n        sharedDataRef.current.update(newData)\n      } else {\n        setData?.(newData)\n      }\n    },\n    [id, setData]\n  )\n\n  const update = useCallback<UseDataReturnUpdate<Data>>(\n    (path, value = undefined) => {\n      const existingData = structuredClone(\n        sharedDataRef.current.data || {}\n      ) as Data & JsonObject\n      const existingValue = pointer.has(existingData, path)\n        ? pointer.get(existingData, path)\n        : undefined\n\n      // Get new value\n      const newValue =\n        typeof value === 'function' ? value(existingValue) : value\n\n      if (newValue !== existingValue) {\n        // Update existing data\n        pointer.set(existingData, path, newValue)\n\n        // Update provider with new data\n        if (id) {\n          sharedDataRef.current.extend(existingData)\n        } else {\n          updateDataValue(path, newValue)\n        }\n      }\n    },\n    [id, updateDataValue]\n  )\n\n  const remove = useCallback<UseDataReturn<Data>['remove']>(\n    (path) => {\n      const existingData = structuredClone(\n        sharedDataRef.current.data || {}\n      ) as Data & JsonObject\n\n      if (pointer.has(existingData, path)) {\n        // Remove existing data\n        pointer.remove(existingData, path)\n\n        // Update provider with new data\n        if (id) {\n          sharedDataRef.current.set(existingData)\n        } else {\n          updateDataValue(path, undefined)\n        }\n      }\n    },\n    [id, updateDataValue]\n  )\n\n  const reduceToVisibleFields = useCallback<\n    UseDataReturn<Data>['reduceToVisibleFields']\n  >(\n    (data, options = {}) => {\n      if (id) {\n        return sharedAttachmentsRef.current.data?.visibleDataHandler?.(\n          data,\n          options\n        )\n      }\n\n      return dataContext?.visibleDataHandler?.(data, options)\n    },\n    [dataContext, id]\n  )\n\n  const filterData = useCallback<UseDataReturn<Data>['filterData']>(\n    (filter, data = sharedDataRef.current.data) => {\n      if (id) {\n        return sharedAttachmentsRef.current.data?.filterDataHandler?.(\n          data,\n          filter\n        )\n      }\n\n      return dataContext?.filterDataHandler?.(data, filter)\n    },\n    [dataContext, id]\n  )\n\n  const getValue = useCallback<UseDataReturn<Data>['getValue']>((path) => {\n    if (pointer.has(sharedDataRef.current.data, path)) {\n      return pointer.get(sharedDataRef.current.data, path)\n    }\n\n    return undefined\n  }, [])\n\n  useMountEffect(() => {\n    if (id && !sharedDataRef.current.hadInitialData && initialData) {\n      sharedDataRef.current.extend(initialData)\n    }\n  })\n\n  const { data } = sharedDataRef.current\n\n  return useMemo(\n    () => ({\n      data,\n      remove,\n      update,\n      set,\n      getValue,\n      reduceToVisibleFields,\n      filterData,\n    }),\n    [\n      data,\n      remove,\n      update,\n      set,\n      getValue,\n      reduceToVisibleFields,\n      filterData,\n    ]\n  )\n}\n"],"mappings":"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"}

package/extensions/forms/hooks/useFieldProps.js

@@ -30,7 +30,7 @@ import useDataValue from './useDataValue';
 const useLayoutEffect = typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;
 export default function useFieldProps(localeProps) {
   var _dataContext$props,
-    _useExternalValue,
+    _transformers$current,
     _dataContext$ajvInsta,
     _localErrorRef$curren,
     _ref3,
@@ -166,13 +166,13 @@ export default function useFieldProps(localeProps) {
   useLayoutEffect(() => {
     defaultValueRef.current = defaultValue;
   }, []);
-  const externalValue = (_useExternalValue = useExternalValue({
+  const externalValue = (_transformers$current = transformers.current.transformIn(useExternalValue({
     path,
     itemPath,
     value: valueProp,
     transformers,
     emptyValue
-  })) !== null && _useExternalValue !== void 0 ? _useExternalValue : defaultValueRef.current;
+  }))) !== null && _transformers$current !== void 0 ? _transformers$current : defaultValueRef.current;
   const valueRef = useRef(externalValue);
   const changedRef = useRef();
   const hasFocusRef = useRef();
@@ -685,10 +685,11 @@ export default function useFieldProps(localeProps) {
     } = _ref7;
     const value = transformers.current.toEvent(overrideValue !== null && overrideValue !== void 0 ? overrideValue : valueRef.current, eventName);
     const args = transformers.current.provideAdditionalArgs(value, additionalArgs);
+    const transformedValue = transformers.current.transformOut(value, args);
     if (typeof args !== 'undefined') {
-      return [value, args];
+      return [transformedValue, args];
     }
-    return [value];
+    return [transformedValue];
   }, []);
   const setHasFocus = useCallback(async (hasFocus, overrideValue, additionalArgs) => {
     const args = getEventArgs({
@@ -819,19 +820,25 @@ export default function useFieldProps(localeProps) {
     forceUpdate();
   }, [asyncBehaviorIsEnabled, executeOnChangeRegardlessOfError, hasPath, yieldAsyncProcess, onChangeContext, defineAsyncProcess, hasError, setEventResult, handlePathChangeDataContext, identifier]);
   const updateValue = useCallback(async newValue => {
-    if (newValue === valueRef.current) {
+    const currentValue = valueRef.current;
+    if (newValue === currentValue) {
       return;
     }
-    valueRef.current = newValue;
+    const transformedValue = transformers.current.transformValue(newValue, currentValue);
+    const contextValue = transformers.current.transformOut(transformedValue, transformers.current.provideAdditionalArgs(transformedValue, additionalArgs));
+    valueRef.current = transformedValue;
     if (hasPath) {
-      handlePathChangeUnvalidatedDataContext(identifier, newValue);
+      handlePathChangeUnvalidatedDataContext(identifier, contextValue);
+    }
+    if (itemPath) {
+      handleChangeIterateContext === null || handleChangeIterateContext === void 0 ? void 0 : handleChangeIterateContext(makeIteratePath(itemPath, ''), contextValue);
     }
     addToPool('validator', validateValue, isAsync(onChangeValidatorRef.current));
     addToPool('onChangeContext', callOnChangeContext, isAsync(onChangeContext));
     await runPool(() => {
       handleError();
     });
-  }, [hasPath, addToPool, validateValue, callOnChangeContext, onChangeContext, runPool, handlePathChangeUnvalidatedDataContext, identifier, handleError]);
+  }, [additionalArgs, hasPath, itemPath, addToPool, validateValue, callOnChangeContext, onChangeContext, runPool, handlePathChangeUnvalidatedDataContext, identifier, handleChangeIterateContext, makeIteratePath, handleError]);
   const setChanged = state => {
     changedRef.current = state;
   };
@@ -842,16 +849,12 @@ export default function useFieldProps(localeProps) {
     if (fromInput === currentValue) {
       return;
     }
-    const transformedValue = transformers.current.transformOut(transformers.current.transformValue(fromInput, currentValue), transformers.current.provideAdditionalArgs(fromInput, additionalArgs));
     changedRef.current = true;
-    if (itemPath) {
-      handleChangeIterateContext === null || handleChangeIterateContext === void 0 ? void 0 : handleChangeIterateContext(makeIteratePath(itemPath, ''), transformedValue);
-    }
     if (asyncBehaviorIsEnabled) {
       hideError();
-      await updateValue(transformedValue);
+      await updateValue(fromInput);
     } else {
-      updateValue(transformedValue);
+      updateValue(fromInput);
     }
     if (isAsync(onChange)) {
       addToPool('onChangeLocal', async () => {
@@ -890,7 +893,7 @@ export default function useFieldProps(localeProps) {
       setEventResult(onChange === null || onChange === void 0 ? void 0 : onChange.apply(_this, args));
     }
     await runPool();
-  }, [itemPath, asyncBehaviorIsEnabled, onChange, runPool, handleChangeIterateContext, makeIteratePath, hideError, updateValue, addToPool, getEventArgs, yieldAsyncProcess, defineAsyncProcess, hasError, setEventResult]);
+  }, [asyncBehaviorIsEnabled, onChange, runPool, hideError, updateValue, addToPool, getEventArgs, yieldAsyncProcess, defineAsyncProcess, hasError, setEventResult]);
   const handleFocus = useCallback(() => setHasFocus(true), [setHasFocus]);
   const handleBlur = useCallback(() => setHasFocus(false), [setHasFocus]);
   setFieldPropsDataContext === null || setFieldPropsDataContext === void 0 ? void 0 : setFieldPropsDataContext(identifier, props);
@@ -996,12 +999,12 @@ export default function useFieldProps(localeProps) {
     let valueToStore = valueProp;
     const data = wizardContext !== null && wizardContext !== void 0 && wizardContext.prerenderFieldProps ? dataContext.data : (_dataContext$internal = dataContext.internalDataRef) === null || _dataContext$internal === void 0 ? void 0 : _dataContext$internal.current;
     const hasValue = pointer.has(data, identifier) || identifier === '/';
-    const existingValue = identifier === '/' ? data : hasValue ? pointer.get(data, identifier) : undefined;
+    const existingValue = transformers.current.transformIn(identifier === '/' ? data : hasValue ? pointer.get(data, identifier) : undefined);
     if (dataContext.id && !hasValue && typeof existingValue === 'undefined' && typeof valueToStore === 'undefined') {
       const sharedState = createSharedState(dataContext.id);
       const hasValue = pointer.has(sharedState.data, identifier);
       if (hasValue) {
-        const sharedValue = pointer.get(sharedState.data, identifier);
+        const sharedValue = transformers.current.transformIn(pointer.get(sharedState.data, identifier));
         if (sharedValue) {
           valueToStore = sharedValue;
         }
@@ -1185,7 +1188,7 @@ export default function useFieldProps(localeProps) {
     name: props.name || ((_props$path = props.path) === null || _props$path === void 0 ? void 0 : _props$path.replace('/', '')) || id,
     autoComplete: (_props$autoComplete = props.autoComplete) !== null && _props$autoComplete !== void 0 ? _props$autoComplete : dataContext.autoComplete === true ? 'on' : undefined,
     id,
-    value: transformers.current.transformIn(transformers.current.toInput(valueRef.current)),
+    value: transformers.current.toInput(valueRef.current),
     hasError: hasVisibleError,
     isChanged: Boolean(changedRef.current),
     props,