@workday/canvas-kit-react/dist/es6/collection/lib/useListItemAllowChildStrings.js

The parent module that contains all Workday Canvas Kit React components

import { createElemPropsHook } from '@workday/canvas-kit-react/common';
import { useListModel } from '@workday/canvas-kit-react/collection';
/**
 * This elemProps hook allows for children values to be considered identifiers if the children are
 * strings. This can be useful for autocomplete or select components that allow string values. This
 * hook must be passed _after_ {@link useListItemRegister} because this hook sets the `data-id`
 * attribute if one hasn't been defined by the application.
 *
 * An example might look like:
 *
 * ```tsx
 * const useMyListItem = composeHooks(
 *   // any other hooks here
 *   useListItemSelect,
 *   useListItemRegister,
 *   useListItemAllowChildStrings // always the last in the list
 * )
 *
 *
 * <MyList onSelect={({id}) => {
 *   console.log(id) // will be "First" or "Second"
 * }}>
 *   <MyList.Item>First</MyList.Item>
 *   <MyList.Item>Second</MyList.Item>
 * </MyList>
 * ```
 */
export const useListItemAllowChildStrings = createElemPropsHook(useListModel)((_, __, elemProps = {}) => {
    const props = {};
    if (!elemProps['data-id'] && !elemProps.item && typeof elemProps.children === 'string') {
        props['data-id'] = elemProps.children;
    }
    return props;
});