mirror of
https://github.com/optim-enterprises-bv/vault.git
synced 2025-10-30 18:17:55 +00:00
e61bd967e3
* move script to scripts folder * add docfy to router and scripts * add docfy to router and scripts * fix jsdoc syntax * add component markdown files to gitignore * improve error handling for scripts * tidy up remaining jsdoc syntax * add sample jsdoc components * add known issue info * make not using multi-line components clearer * make generating docs clearer * update copy * final how to docfy cleanup * fix ts file @module syntax * fix read more syntax * make docfy typescript compatible
55 lines
1.6 KiB
TypeScript
55 lines
1.6 KiB
TypeScript
/**
|
|
* Copyright (c) HashiCorp, Inc.
|
|
* SPDX-License-Identifier: BUSL-1.1
|
|
*/
|
|
|
|
import Component from '@glimmer/component';
|
|
import { action } from '@ember/object';
|
|
import { HTMLElementEvent } from 'forms';
|
|
|
|
interface CheckboxGridArgs {
|
|
name: string;
|
|
label: string;
|
|
subText?: string;
|
|
fields: Field[];
|
|
value: string[] | undefined;
|
|
onChange: (name: string, value: string[]) => void;
|
|
}
|
|
interface Field {
|
|
key: string;
|
|
label: string;
|
|
}
|
|
|
|
/**
|
|
* @module CheckboxGrid
|
|
* @description
|
|
* CheckboxGrid components are used to allow users to select any number of predetermined options, aligned in a 3-column grid.
|
|
*
|
|
*
|
|
* @example
|
|
* <CheckboxGrid @name="extKeyUsage" @label="Extended key usage" @fields={{array (hash key="EmailProtection" label="Email Protection") (hash key="TimeStamping" label="Time Stamping") (hash key="ServerAuth" label="Server Auth") }} @value={{array "TimeStamping"}} />
|
|
*/
|
|
|
|
export default class CheckboxGrid extends Component<CheckboxGridArgs> {
|
|
get checkboxes() {
|
|
const list = this.args.value || [];
|
|
return this.args.fields.map((field) => ({
|
|
...field,
|
|
value: list.includes(field.key),
|
|
}));
|
|
}
|
|
|
|
@action checkboxChange(event: HTMLElementEvent<HTMLInputElement>) {
|
|
const list = this.args.value || [];
|
|
const checkboxName = event.target.id;
|
|
const checkboxVal = event.target.checked;
|
|
const idx = list.indexOf(checkboxName);
|
|
if (checkboxVal === true && idx < 0) {
|
|
list.push(checkboxName);
|
|
} else if (checkboxVal === false && idx >= 0) {
|
|
list.splice(idx, 1);
|
|
}
|
|
this.args.onChange(this.args.name, list);
|
|
}
|
|
}
|