mirror of
https://github.com/Choices-js/Choices.git
synced 2024-06-03 14:32:11 +02:00
Break out actions into action files
This commit is contained in:
parent
865f96d0da
commit
fb4f80b5f1
|
@ -1,81 +0,0 @@
|
||||||
export const addItem = (
|
|
||||||
value,
|
|
||||||
label,
|
|
||||||
id,
|
|
||||||
choiceId,
|
|
||||||
groupId,
|
|
||||||
customProperties,
|
|
||||||
placeholder,
|
|
||||||
keyCode,
|
|
||||||
) => ({
|
|
||||||
type: 'ADD_ITEM',
|
|
||||||
value,
|
|
||||||
label,
|
|
||||||
id,
|
|
||||||
choiceId,
|
|
||||||
groupId,
|
|
||||||
customProperties,
|
|
||||||
placeholder,
|
|
||||||
keyCode,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const removeItem = (id, choiceId) => ({
|
|
||||||
type: 'REMOVE_ITEM',
|
|
||||||
id,
|
|
||||||
choiceId,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const highlightItem = (id, highlighted) => ({
|
|
||||||
type: 'HIGHLIGHT_ITEM',
|
|
||||||
id,
|
|
||||||
highlighted,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const addChoice = (
|
|
||||||
value,
|
|
||||||
label,
|
|
||||||
id,
|
|
||||||
groupId,
|
|
||||||
disabled,
|
|
||||||
elementId,
|
|
||||||
customProperties,
|
|
||||||
placeholder,
|
|
||||||
keyCode,
|
|
||||||
) => ({
|
|
||||||
type: 'ADD_CHOICE',
|
|
||||||
value,
|
|
||||||
label,
|
|
||||||
id,
|
|
||||||
groupId,
|
|
||||||
disabled,
|
|
||||||
elementId,
|
|
||||||
customProperties,
|
|
||||||
placeholder,
|
|
||||||
keyCode,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const filterChoices = results => ({
|
|
||||||
type: 'FILTER_CHOICES',
|
|
||||||
results,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const activateChoices = (active = true) => ({
|
|
||||||
type: 'ACTIVATE_CHOICES',
|
|
||||||
active,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const clearChoices = () => ({
|
|
||||||
type: 'CLEAR_CHOICES',
|
|
||||||
});
|
|
||||||
|
|
||||||
export const addGroup = (value, id, active, disabled) => ({
|
|
||||||
type: 'ADD_GROUP',
|
|
||||||
value,
|
|
||||||
id,
|
|
||||||
active,
|
|
||||||
disabled,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const clearAll = () => ({
|
|
||||||
type: 'CLEAR_ALL',
|
|
||||||
});
|
|
|
@ -1,175 +0,0 @@
|
||||||
import { expect } from 'chai';
|
|
||||||
import * as actions from './actions';
|
|
||||||
|
|
||||||
describe('actions', () => {
|
|
||||||
describe('addItem action', () => {
|
|
||||||
it('returns ADD_ITEM action', () => {
|
|
||||||
const value = 'test';
|
|
||||||
const label = 'test';
|
|
||||||
const id = '1234';
|
|
||||||
const choiceId = '1234';
|
|
||||||
const groupId = 'test';
|
|
||||||
const customProperties = 'test';
|
|
||||||
const placeholder = 'test';
|
|
||||||
const keyCode = 10;
|
|
||||||
|
|
||||||
const expectedAction = {
|
|
||||||
type: 'ADD_ITEM',
|
|
||||||
value,
|
|
||||||
label,
|
|
||||||
id,
|
|
||||||
choiceId,
|
|
||||||
groupId,
|
|
||||||
customProperties,
|
|
||||||
placeholder,
|
|
||||||
keyCode,
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(actions.addItem(
|
|
||||||
value,
|
|
||||||
label,
|
|
||||||
id,
|
|
||||||
choiceId,
|
|
||||||
groupId,
|
|
||||||
customProperties,
|
|
||||||
placeholder,
|
|
||||||
keyCode,
|
|
||||||
)).to.eql(expectedAction);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('removeItem action', () => {
|
|
||||||
it('returns REMOVE_ITEM action', () => {
|
|
||||||
const id = '1234';
|
|
||||||
const choiceId = '1';
|
|
||||||
const expectedAction = {
|
|
||||||
type: 'REMOVE_ITEM',
|
|
||||||
id,
|
|
||||||
choiceId,
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(actions.removeItem(id, choiceId)).to.eql(expectedAction);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('highlightItem action', () => {
|
|
||||||
it('returns HIGHLIGHT_ITEM action', () => {
|
|
||||||
const id = '1234';
|
|
||||||
const highlighted = true;
|
|
||||||
|
|
||||||
const expectedAction = {
|
|
||||||
type: 'HIGHLIGHT_ITEM',
|
|
||||||
id,
|
|
||||||
highlighted,
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(actions.highlightItem(id, highlighted)).to.eql(expectedAction);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('addChoice action', () => {
|
|
||||||
it('returns ADD_CHOICE action', () => {
|
|
||||||
const value = 'test';
|
|
||||||
const label = 'test';
|
|
||||||
const id = 'test';
|
|
||||||
const groupId = 'test';
|
|
||||||
const disabled = false;
|
|
||||||
const elementId = 'test';
|
|
||||||
const customProperties = 'test';
|
|
||||||
const placeholder = 'test';
|
|
||||||
const keyCode = 10;
|
|
||||||
|
|
||||||
const expectedAction = {
|
|
||||||
type: 'ADD_CHOICE',
|
|
||||||
value,
|
|
||||||
label,
|
|
||||||
id,
|
|
||||||
groupId,
|
|
||||||
disabled,
|
|
||||||
elementId,
|
|
||||||
customProperties,
|
|
||||||
placeholder,
|
|
||||||
keyCode,
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(actions.addChoice(
|
|
||||||
value,
|
|
||||||
label,
|
|
||||||
id,
|
|
||||||
groupId,
|
|
||||||
disabled,
|
|
||||||
elementId,
|
|
||||||
customProperties,
|
|
||||||
placeholder,
|
|
||||||
keyCode,
|
|
||||||
)).to.eql(expectedAction);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('filterChoices action', () => {
|
|
||||||
it('returns FILTER_CHOICES action', () => {
|
|
||||||
const results = Array(10);
|
|
||||||
const expectedAction = {
|
|
||||||
type: 'FILTER_CHOICES',
|
|
||||||
results,
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(actions.filterChoices(results)).to.eql(expectedAction);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('activateChoices action', () => {
|
|
||||||
it('returns ACTIVATE_CHOICES action', () => {
|
|
||||||
const active = true;
|
|
||||||
const expectedAction = {
|
|
||||||
type: 'ACTIVATE_CHOICES',
|
|
||||||
active,
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(actions.activateChoices(active)).to.eql(expectedAction);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('clearChoices action', () => {
|
|
||||||
it('returns CLEAR_CHOICES action', () => {
|
|
||||||
const expectedAction = {
|
|
||||||
type: 'CLEAR_CHOICES',
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(actions.clearChoices()).to.eql(expectedAction);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('addGroup action', () => {
|
|
||||||
it('returns ADD_GROUP action', () => {
|
|
||||||
const value = 'test';
|
|
||||||
const id = 'test';
|
|
||||||
const active = true;
|
|
||||||
const disabled = false;
|
|
||||||
const expectedAction = {
|
|
||||||
type: 'ADD_GROUP',
|
|
||||||
value,
|
|
||||||
id,
|
|
||||||
active,
|
|
||||||
disabled,
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(actions.addGroup(
|
|
||||||
value,
|
|
||||||
id,
|
|
||||||
active,
|
|
||||||
disabled,
|
|
||||||
)).to.eql(expectedAction);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('clearAll action', () => {
|
|
||||||
it('returns CLEAR_ALL action', () => {
|
|
||||||
const expectedAction = {
|
|
||||||
type: 'CLEAR_ALL',
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(actions.clearAll()).to.eql(expectedAction);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
36
src/scripts/src/actions/choices.js
Normal file
36
src/scripts/src/actions/choices.js
Normal file
|
@ -0,0 +1,36 @@
|
||||||
|
export const addChoice = (
|
||||||
|
value,
|
||||||
|
label,
|
||||||
|
id,
|
||||||
|
groupId,
|
||||||
|
disabled,
|
||||||
|
elementId,
|
||||||
|
customProperties,
|
||||||
|
placeholder,
|
||||||
|
keyCode,
|
||||||
|
) => ({
|
||||||
|
type: 'ADD_CHOICE',
|
||||||
|
value,
|
||||||
|
label,
|
||||||
|
id,
|
||||||
|
groupId,
|
||||||
|
disabled,
|
||||||
|
elementId,
|
||||||
|
customProperties,
|
||||||
|
placeholder,
|
||||||
|
keyCode,
|
||||||
|
});
|
||||||
|
|
||||||
|
export const filterChoices = results => ({
|
||||||
|
type: 'FILTER_CHOICES',
|
||||||
|
results,
|
||||||
|
});
|
||||||
|
|
||||||
|
export const activateChoices = (active = true) => ({
|
||||||
|
type: 'ACTIVATE_CHOICES',
|
||||||
|
active,
|
||||||
|
});
|
||||||
|
|
||||||
|
export const clearChoices = () => ({
|
||||||
|
type: 'CLEAR_CHOICES',
|
||||||
|
});
|
78
src/scripts/src/actions/choices.test.js
Normal file
78
src/scripts/src/actions/choices.test.js
Normal file
|
@ -0,0 +1,78 @@
|
||||||
|
import { expect } from 'chai';
|
||||||
|
import * as actions from './choices';
|
||||||
|
|
||||||
|
describe('choice actions', () => {
|
||||||
|
describe('addChoice action', () => {
|
||||||
|
it('returns ADD_CHOICE action', () => {
|
||||||
|
const value = 'test';
|
||||||
|
const label = 'test';
|
||||||
|
const id = 'test';
|
||||||
|
const groupId = 'test';
|
||||||
|
const disabled = false;
|
||||||
|
const elementId = 'test';
|
||||||
|
const customProperties = 'test';
|
||||||
|
const placeholder = 'test';
|
||||||
|
const keyCode = 10;
|
||||||
|
|
||||||
|
const expectedAction = {
|
||||||
|
type: 'ADD_CHOICE',
|
||||||
|
value,
|
||||||
|
label,
|
||||||
|
id,
|
||||||
|
groupId,
|
||||||
|
disabled,
|
||||||
|
elementId,
|
||||||
|
customProperties,
|
||||||
|
placeholder,
|
||||||
|
keyCode,
|
||||||
|
};
|
||||||
|
|
||||||
|
expect(actions.addChoice(
|
||||||
|
value,
|
||||||
|
label,
|
||||||
|
id,
|
||||||
|
groupId,
|
||||||
|
disabled,
|
||||||
|
elementId,
|
||||||
|
customProperties,
|
||||||
|
placeholder,
|
||||||
|
keyCode,
|
||||||
|
)).to.eql(expectedAction);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('filterChoices action', () => {
|
||||||
|
it('returns FILTER_CHOICES action', () => {
|
||||||
|
const results = Array(10);
|
||||||
|
const expectedAction = {
|
||||||
|
type: 'FILTER_CHOICES',
|
||||||
|
results,
|
||||||
|
};
|
||||||
|
|
||||||
|
expect(actions.filterChoices(results)).to.eql(expectedAction);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('activateChoices action', () => {
|
||||||
|
it('returns ACTIVATE_CHOICES action', () => {
|
||||||
|
const active = true;
|
||||||
|
const expectedAction = {
|
||||||
|
type: 'ACTIVATE_CHOICES',
|
||||||
|
active,
|
||||||
|
};
|
||||||
|
|
||||||
|
expect(actions.activateChoices(active)).to.eql(expectedAction);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('clearChoices action', () => {
|
||||||
|
it('returns CLEAR_CHOICES action', () => {
|
||||||
|
const expectedAction = {
|
||||||
|
type: 'CLEAR_CHOICES',
|
||||||
|
};
|
||||||
|
|
||||||
|
expect(actions.clearChoices()).to.eql(expectedAction);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
8
src/scripts/src/actions/groups.js
Normal file
8
src/scripts/src/actions/groups.js
Normal file
|
@ -0,0 +1,8 @@
|
||||||
|
/* eslint-disable import/prefer-default-export */
|
||||||
|
export const addGroup = (value, id, active, disabled) => ({
|
||||||
|
type: 'ADD_GROUP',
|
||||||
|
value,
|
||||||
|
id,
|
||||||
|
active,
|
||||||
|
disabled,
|
||||||
|
});
|
27
src/scripts/src/actions/groups.test.js
Normal file
27
src/scripts/src/actions/groups.test.js
Normal file
|
@ -0,0 +1,27 @@
|
||||||
|
import { expect } from 'chai';
|
||||||
|
import * as actions from './groups';
|
||||||
|
|
||||||
|
describe('group actions', () => {
|
||||||
|
describe('addGroup action', () => {
|
||||||
|
it('returns ADD_GROUP action', () => {
|
||||||
|
const value = 'test';
|
||||||
|
const id = 'test';
|
||||||
|
const active = true;
|
||||||
|
const disabled = false;
|
||||||
|
const expectedAction = {
|
||||||
|
type: 'ADD_GROUP',
|
||||||
|
value,
|
||||||
|
id,
|
||||||
|
active,
|
||||||
|
disabled,
|
||||||
|
};
|
||||||
|
|
||||||
|
expect(actions.addGroup(
|
||||||
|
value,
|
||||||
|
id,
|
||||||
|
active,
|
||||||
|
disabled,
|
||||||
|
)).to.eql(expectedAction);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
32
src/scripts/src/actions/items.js
Normal file
32
src/scripts/src/actions/items.js
Normal file
|
@ -0,0 +1,32 @@
|
||||||
|
export const addItem = (
|
||||||
|
value,
|
||||||
|
label,
|
||||||
|
id,
|
||||||
|
choiceId,
|
||||||
|
groupId,
|
||||||
|
customProperties,
|
||||||
|
placeholder,
|
||||||
|
keyCode,
|
||||||
|
) => ({
|
||||||
|
type: 'ADD_ITEM',
|
||||||
|
value,
|
||||||
|
label,
|
||||||
|
id,
|
||||||
|
choiceId,
|
||||||
|
groupId,
|
||||||
|
customProperties,
|
||||||
|
placeholder,
|
||||||
|
keyCode,
|
||||||
|
});
|
||||||
|
|
||||||
|
export const removeItem = (id, choiceId) => ({
|
||||||
|
type: 'REMOVE_ITEM',
|
||||||
|
id,
|
||||||
|
choiceId,
|
||||||
|
});
|
||||||
|
|
||||||
|
export const highlightItem = (id, highlighted) => ({
|
||||||
|
type: 'HIGHLIGHT_ITEM',
|
||||||
|
id,
|
||||||
|
highlighted,
|
||||||
|
});
|
69
src/scripts/src/actions/items.test.js
Normal file
69
src/scripts/src/actions/items.test.js
Normal file
|
@ -0,0 +1,69 @@
|
||||||
|
import { expect } from 'chai';
|
||||||
|
import * as actions from './items';
|
||||||
|
|
||||||
|
describe('item actions', () => {
|
||||||
|
describe('addItem action', () => {
|
||||||
|
it('returns ADD_ITEM action', () => {
|
||||||
|
const value = 'test';
|
||||||
|
const label = 'test';
|
||||||
|
const id = '1234';
|
||||||
|
const choiceId = '1234';
|
||||||
|
const groupId = 'test';
|
||||||
|
const customProperties = 'test';
|
||||||
|
const placeholder = 'test';
|
||||||
|
const keyCode = 10;
|
||||||
|
|
||||||
|
const expectedAction = {
|
||||||
|
type: 'ADD_ITEM',
|
||||||
|
value,
|
||||||
|
label,
|
||||||
|
id,
|
||||||
|
choiceId,
|
||||||
|
groupId,
|
||||||
|
customProperties,
|
||||||
|
placeholder,
|
||||||
|
keyCode,
|
||||||
|
};
|
||||||
|
|
||||||
|
expect(actions.addItem(
|
||||||
|
value,
|
||||||
|
label,
|
||||||
|
id,
|
||||||
|
choiceId,
|
||||||
|
groupId,
|
||||||
|
customProperties,
|
||||||
|
placeholder,
|
||||||
|
keyCode,
|
||||||
|
)).to.eql(expectedAction);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('removeItem action', () => {
|
||||||
|
it('returns REMOVE_ITEM action', () => {
|
||||||
|
const id = '1234';
|
||||||
|
const choiceId = '1';
|
||||||
|
const expectedAction = {
|
||||||
|
type: 'REMOVE_ITEM',
|
||||||
|
id,
|
||||||
|
choiceId,
|
||||||
|
};
|
||||||
|
|
||||||
|
expect(actions.removeItem(id, choiceId)).to.eql(expectedAction);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('highlightItem action', () => {
|
||||||
|
it('returns HIGHLIGHT_ITEM action', () => {
|
||||||
|
const id = '1234';
|
||||||
|
const highlighted = true;
|
||||||
|
|
||||||
|
const expectedAction = {
|
||||||
|
type: 'HIGHLIGHT_ITEM',
|
||||||
|
id,
|
||||||
|
highlighted,
|
||||||
|
};
|
||||||
|
|
||||||
|
expect(actions.highlightItem(id, highlighted)).to.eql(expectedAction);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
4
src/scripts/src/actions/misc.js
Normal file
4
src/scripts/src/actions/misc.js
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
/* eslint-disable import/prefer-default-export */
|
||||||
|
export const clearAll = () => ({
|
||||||
|
type: 'CLEAR_ALL',
|
||||||
|
});
|
14
src/scripts/src/actions/misc.test.js
Normal file
14
src/scripts/src/actions/misc.test.js
Normal file
|
@ -0,0 +1,14 @@
|
||||||
|
import { expect } from 'chai';
|
||||||
|
import * as actions from './misc';
|
||||||
|
|
||||||
|
describe('misc actions', () => {
|
||||||
|
describe('clearAll action', () => {
|
||||||
|
it('returns CLEAR_ALL action', () => {
|
||||||
|
const expectedAction = {
|
||||||
|
type: 'CLEAR_ALL',
|
||||||
|
};
|
||||||
|
|
||||||
|
expect(actions.clearAll()).to.eql(expectedAction);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
|
@ -6,17 +6,11 @@ import Container from './components/container';
|
||||||
import Input from './components/input';
|
import Input from './components/input';
|
||||||
import List from './components/list';
|
import List from './components/list';
|
||||||
import { DEFAULT_CONFIG, DEFAULT_CLASSNAMES, EVENTS } from './constants';
|
import { DEFAULT_CONFIG, DEFAULT_CLASSNAMES, EVENTS } from './constants';
|
||||||
import {
|
import { addChoice, filterChoices, activateChoices, clearChoices } from './actions/choices';
|
||||||
addItem,
|
import { addItem, removeItem, highlightItem } from './actions/items';
|
||||||
removeItem,
|
import { addGroup } from './actions/groups';
|
||||||
highlightItem,
|
import { clearAll } from './actions/misc';
|
||||||
addChoice,
|
|
||||||
filterChoices,
|
|
||||||
activateChoices,
|
|
||||||
addGroup,
|
|
||||||
clearAll,
|
|
||||||
clearChoices,
|
|
||||||
} from './actions/actions';
|
|
||||||
import {
|
import {
|
||||||
isScrolledIntoView,
|
isScrolledIntoView,
|
||||||
getAdjacentEl,
|
getAdjacentEl,
|
||||||
|
@ -61,10 +55,6 @@ class Choices {
|
||||||
sortFilter: sortByAlpha,
|
sortFilter: sortByAlpha,
|
||||||
};
|
};
|
||||||
|
|
||||||
this.idNames = {
|
|
||||||
itemChoice: 'item-choice',
|
|
||||||
};
|
|
||||||
|
|
||||||
// Merge options with user options
|
// Merge options with user options
|
||||||
this.config = extend(defaultConfig, Choices.userDefaults, userConfig);
|
this.config = extend(defaultConfig, Choices.userDefaults, userConfig);
|
||||||
|
|
||||||
|
@ -133,6 +123,10 @@ class Choices {
|
||||||
// Set unique base Id
|
// Set unique base Id
|
||||||
this.baseId = generateId(this.passedElement, 'choices-');
|
this.baseId = generateId(this.passedElement, 'choices-');
|
||||||
|
|
||||||
|
this.idNames = {
|
||||||
|
itemChoice: 'item-choice',
|
||||||
|
};
|
||||||
|
|
||||||
// Bind methods
|
// Bind methods
|
||||||
this.render = this.render.bind(this);
|
this.render = this.render.bind(this);
|
||||||
|
|
||||||
|
|
|
@ -10,8 +10,10 @@ import itemReducer from './reducers/items';
|
||||||
import choiceReducer from './reducers/choices';
|
import choiceReducer from './reducers/choices';
|
||||||
import {
|
import {
|
||||||
addItem as addItemAction,
|
addItem as addItemAction,
|
||||||
|
} from './actions/items';
|
||||||
|
import {
|
||||||
addChoice as addChoiceAction,
|
addChoice as addChoiceAction,
|
||||||
} from './actions/actions';
|
} from './actions/choices';
|
||||||
import Dropdown from './components/dropdown';
|
import Dropdown from './components/dropdown';
|
||||||
import Container from './components/container';
|
import Container from './components/container';
|
||||||
import Input from './components/input';
|
import Input from './components/input';
|
||||||
|
|
Loading…
Reference in a new issue