@dossierhq/design
Version:
The design system for Dossier.
90 lines • 2.7 kB
JavaScript
import isEqual from 'lodash/isEqual.js';
import { assertIsDefined } from '../../utils/AssertUtils.js';
function isItemIdRemovable(items, id) {
const item = items.find((it) => it.id === id);
assertIsDefined(item);
return item.removable !== false;
}
function containsRemovableSelection(items, selectedIds) {
return selectedIds.some((id) => isItemIdRemovable(items, id));
}
export function initializeMultipleSelectorState({ items, selectedIds, }) {
if (!selectedIds) {
selectedIds = [];
}
return {
items,
selectedIds,
containsRemovableSelection: containsRemovableSelection(items, selectedIds),
};
}
export function reduceMultipleSelectorState(state, action) {
let newState = action.reduce(state);
if (newState !== state) {
newState = {
...newState,
containsRemovableSelection: containsRemovableSelection(newState.items, newState.selectedIds),
};
}
return newState;
}
// Actions
class ClearSelectionAction {
reduce(state) {
const selectedIds = state.selectedIds.filter((id) => !isItemIdRemovable(state.items, id));
if (selectedIds.length === state.selectedIds.length) {
return state;
}
return { ...state, selectedIds };
}
}
class SetSelectionAction {
selectedIds;
constructor(selectedIds) {
this.selectedIds = selectedIds;
}
reduce(state) {
if (isEqual(this.selectedIds, state.selectedIds)) {
return state;
}
return { ...state, selectedIds: [...this.selectedIds] };
}
}
class ToggleItemAction {
id;
constructor(id) {
this.id = id;
}
reduce(state) {
const index = state.selectedIds.indexOf(this.id);
const selectedIds = [...state.selectedIds];
if (index < 0) {
selectedIds.push(this.id);
}
else {
selectedIds.splice(index, 1);
}
const newState = { ...state, selectedIds };
return newState;
}
}
class UpdateItemsAction {
items;
constructor(items) {
this.items = items;
}
reduce(state) {
const selectedIds = state.selectedIds.filter((id) => this.items.some((it) => it.id === id));
if (isEqual(selectedIds, state.selectedIds) && isEqual(this.items, state.items)) {
return state;
}
return { ...state, items: this.items, selectedIds };
}
}
export const MultipleSelectorStateActions = {
ClearSelection: ClearSelectionAction,
SetSelection: SetSelectionAction,
ToggleItem: ToggleItemAction,
UpdateItems: UpdateItemsAction,
};
//# sourceMappingURL=MultipleSelectorReducer.js.map