PNP Settings
This commit is contained in:
parent
5bcf71ef2c
commit
5d110964b9
27 changed files with 562 additions and 149 deletions
|
@ -2,15 +2,24 @@
|
|||
// SPDX-License-Identifier: AGPL-3.0-only
|
||||
|
||||
import React from 'react';
|
||||
import classNames from 'classnames';
|
||||
|
||||
import { getClassNamesFor } from '../util/getClassNamesFor';
|
||||
import { missingCaseError } from '../util/missingCaseError';
|
||||
|
||||
export enum Variant {
|
||||
Normal = 'Normal',
|
||||
Small = 'Small',
|
||||
}
|
||||
|
||||
export type Props = {
|
||||
id?: string;
|
||||
variant?: Variant;
|
||||
checked?: boolean;
|
||||
disabled?: boolean;
|
||||
isRadio?: boolean;
|
||||
name?: string;
|
||||
moduleClassName?: string;
|
||||
onChange?: (value: boolean) => unknown;
|
||||
onClick?: () => unknown;
|
||||
};
|
||||
|
@ -24,17 +33,28 @@ export type Props = {
|
|||
*/
|
||||
export function CircleCheckbox({
|
||||
id,
|
||||
variant = Variant.Normal,
|
||||
checked,
|
||||
disabled,
|
||||
isRadio,
|
||||
moduleClassName,
|
||||
name,
|
||||
onChange,
|
||||
onClick,
|
||||
}: Props): JSX.Element {
|
||||
const getClassName = getClassNamesFor('CircleCheckbox');
|
||||
const getClassName = getClassNamesFor('CircleCheckbox', moduleClassName);
|
||||
|
||||
let variantModifier: string;
|
||||
if (variant === Variant.Normal) {
|
||||
variantModifier = getClassName('__checkbox--normal');
|
||||
} else if (variant === Variant.Small) {
|
||||
variantModifier = getClassName('__checkbox--small');
|
||||
} else {
|
||||
throw missingCaseError(variant);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={getClassName('__checkbox')}>
|
||||
<div className={classNames(getClassName('__checkbox'), variantModifier)}>
|
||||
<input
|
||||
checked={Boolean(checked)}
|
||||
disabled={disabled}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue