@awsui/components-react
Version:
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
18 lines • 1.2 kB
JavaScript
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
// SPDX-License-Identifier: Apache-2.0
import React, { forwardRef } from 'react';
import { useUniqueId } from '@awsui/component-toolkit/internal';
import InternalToggle from '../../toggle/internal';
import styles from '../styles.css.js';
const componentPrefix = 'content-display-option';
export const getClassName = (suffix) => styles[[componentPrefix, suffix].filter(Boolean).join('-')];
const ContentDisplayOption = forwardRef(({ onToggle, option }, ref) => {
const idPrefix = useUniqueId(componentPrefix);
const controlId = `${idPrefix}-control-${option.id}`;
return (React.createElement("div", { ref: ref, className: getClassName('content') },
React.createElement("label", { className: getClassName('label'), htmlFor: controlId }, option.label),
React.createElement("div", { className: getClassName('toggle') },
React.createElement(InternalToggle, { checked: !!option.visible, onChange: () => onToggle && onToggle(option), disabled: option.alwaysVisible === true, controlId: controlId }))));
});
export default ContentDisplayOption;
//# sourceMappingURL=content-display-option.js.map