@awsui/components-react/segmented-control/internal.js

On July 19th, 2022, we launched [Cloudscape Design System](https://cloudscape.design). Cloudscape is an evolution of AWS-UI. It consists of user interface guidelines, front-end components, design resources, and development tools for building intuitive, en

// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
// SPDX-License-Identifier: Apache-2.0
import React from 'react';
import clsx from 'clsx';
import InternalFormField from '../form-field/internal';
import { getBaseProps } from '../internal/base-component';
import { fireNonCancelableEvent } from '../internal/events';
import InternalSelect from '../select/internal';
import InternalSegmentedControlComponent from './internal-segmented-control';
import styles from './styles.css.js';
export default function InternalSegmentedControl({ selectedId, options, label, ariaLabelledby, onChange, __internalRootRef, ...props }) {
    const baseProps = getBaseProps(props);
    const selectOptions = (options || []).map(option => {
        const label = option.text || option.iconAlt;
        return { ...option, label, value: option.id };
    });
    const selectedOptions = selectOptions.filter(option => {
        return option.value === selectedId;
    });
    const currentSelectedOption = selectedOptions.length ? selectedOptions[0] : null;
    const selectProps = {
        options: selectOptions,
        selectedOption: currentSelectedOption,
        triggerVariant: 'option',
        onChange: event => fireNonCancelableEvent(onChange, { selectedId: event.detail.selectedOption.value }),
    };
    return (React.createElement("div", { ...baseProps, className: clsx(baseProps.className, styles.root), ref: __internalRootRef },
        React.createElement(InternalSegmentedControlComponent, { selectedId: selectedId, options: options, label: label, ariaLabelledby: ariaLabelledby, onChange: onChange }),
        React.createElement("div", { className: styles.select },
            ariaLabelledby && React.createElement(InternalSelect, { ...selectProps, ariaLabelledby: ariaLabelledby }),
            !ariaLabelledby && label && (React.createElement(InternalFormField, { label: label, stretch: true },
                React.createElement(InternalSelect, { ...selectProps }))),
            !ariaLabelledby && !label && React.createElement(InternalSelect, { ...selectProps }))));
}
//# sourceMappingURL=internal.js.map