mirror of
https://github.com/Choices-js/Choices.git
synced 2024-06-15 20:25:18 +02:00
Add types to store.js
This commit is contained in:
parent
0be29d069c
commit
15a1e9c173
|
@ -1,6 +1,12 @@
|
||||||
import { createStore } from 'redux';
|
import { createStore } from 'redux';
|
||||||
import rootReducer from '../reducers/index';
|
import rootReducer from '../reducers/index';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @typedef {import('../../../types/index').Choices.Choice} Choice
|
||||||
|
* @typedef {import('../../../types/index').Choices.Group} Group
|
||||||
|
* @typedef {import('../../../types/index').Choices.Item} Item
|
||||||
|
*/
|
||||||
|
|
||||||
export default class Store {
|
export default class Store {
|
||||||
constructor() {
|
constructor() {
|
||||||
this._store = createStore(
|
this._store = createStore(
|
||||||
|
@ -30,7 +36,7 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get store object (wrapping Redux method)
|
* Get store object (wrapping Redux method)
|
||||||
* @return {Object} State
|
* @return {object} State
|
||||||
*/
|
*/
|
||||||
get state() {
|
get state() {
|
||||||
return this._store.getState();
|
return this._store.getState();
|
||||||
|
@ -38,7 +44,7 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get items from store
|
* Get items from store
|
||||||
* @return {Array} Item objects
|
* @return {Item[]} Item objects
|
||||||
*/
|
*/
|
||||||
get items() {
|
get items() {
|
||||||
return this.state.items;
|
return this.state.items;
|
||||||
|
@ -46,7 +52,7 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get active items from store
|
* Get active items from store
|
||||||
* @return {Array} Item objects
|
* @return {Item[]} Item objects
|
||||||
*/
|
*/
|
||||||
get activeItems() {
|
get activeItems() {
|
||||||
return this.items.filter(item => item.active === true);
|
return this.items.filter(item => item.active === true);
|
||||||
|
@ -54,7 +60,7 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get highlighted items from store
|
* Get highlighted items from store
|
||||||
* @return {Array} Item objects
|
* @return {Item[]} Item objects
|
||||||
*/
|
*/
|
||||||
get highlightedActiveItems() {
|
get highlightedActiveItems() {
|
||||||
return this.items.filter(item => item.active && item.highlighted);
|
return this.items.filter(item => item.active && item.highlighted);
|
||||||
|
@ -62,7 +68,7 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get choices from store
|
* Get choices from store
|
||||||
* @return {Array} Option objects
|
* @return {Choice[]} Option objects
|
||||||
*/
|
*/
|
||||||
get choices() {
|
get choices() {
|
||||||
return this.state.choices;
|
return this.state.choices;
|
||||||
|
@ -70,18 +76,15 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get active choices from store
|
* Get active choices from store
|
||||||
* @return {Array} Option objects
|
* @return {Choice[]} Option objects
|
||||||
*/
|
*/
|
||||||
get activeChoices() {
|
get activeChoices() {
|
||||||
const { choices } = this;
|
return this.choices.filter(choice => choice.active === true);
|
||||||
const values = choices.filter(choice => choice.active === true);
|
|
||||||
|
|
||||||
return values;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get selectable choices from store
|
* Get selectable choices from store
|
||||||
* @return {Array} Option objects
|
* @return {Choice[]} Option objects
|
||||||
*/
|
*/
|
||||||
get selectableChoices() {
|
get selectableChoices() {
|
||||||
return this.choices.filter(choice => choice.disabled !== true);
|
return this.choices.filter(choice => choice.disabled !== true);
|
||||||
|
@ -89,7 +92,7 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get choices that can be searched (excluding placeholders)
|
* Get choices that can be searched (excluding placeholders)
|
||||||
* @return {Array} Option objects
|
* @return {Choice[]} Option objects
|
||||||
*/
|
*/
|
||||||
get searchableChoices() {
|
get searchableChoices() {
|
||||||
return this.selectableChoices.filter(choice => choice.placeholder !== true);
|
return this.selectableChoices.filter(choice => choice.placeholder !== true);
|
||||||
|
@ -97,7 +100,7 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get placeholder choice from store
|
* Get placeholder choice from store
|
||||||
* @return {Object} Found placeholder
|
* @return {Choice | undefined} Found placeholder
|
||||||
*/
|
*/
|
||||||
get placeholderChoice() {
|
get placeholderChoice() {
|
||||||
return [...this.choices]
|
return [...this.choices]
|
||||||
|
@ -107,7 +110,7 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get groups from store
|
* Get groups from store
|
||||||
* @return {Array} Group objects
|
* @return {Group[]} Group objects
|
||||||
*/
|
*/
|
||||||
get groups() {
|
get groups() {
|
||||||
return this.state.groups;
|
return this.state.groups;
|
||||||
|
@ -115,7 +118,7 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get active groups from store
|
* Get active groups from store
|
||||||
* @return {Array} Group objects
|
* @return {Group[]} Group objects
|
||||||
*/
|
*/
|
||||||
get activeGroups() {
|
get activeGroups() {
|
||||||
const { groups, choices } = this;
|
const { groups, choices } = this;
|
||||||
|
@ -132,7 +135,7 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get loading state from store
|
* Get loading state from store
|
||||||
* @return {Boolean} Loading State
|
* @return {boolean} Loading State
|
||||||
*/
|
*/
|
||||||
isLoading() {
|
isLoading() {
|
||||||
return this.state.general.loading;
|
return this.state.general.loading;
|
||||||
|
@ -140,23 +143,17 @@ export default class Store {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get single choice by it's ID
|
* Get single choice by it's ID
|
||||||
* @param {id} string
|
* @param {string} id
|
||||||
* @return {import('../../../types/index').Choices.Choice | false} Found choice
|
* @return {Choice | undefined} Found choice
|
||||||
*/
|
*/
|
||||||
getChoiceById(id) {
|
getChoiceById(id) {
|
||||||
if (id) {
|
return this.activeChoices.find(choice => choice.id === parseInt(id, 10));
|
||||||
const n = parseInt(id, 10);
|
|
||||||
|
|
||||||
return this.activeChoices.find(choice => choice.id === n);
|
|
||||||
}
|
|
||||||
|
|
||||||
return false;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Get group by group id
|
* Get group by group id
|
||||||
* @param {Number} id Group ID
|
* @param {string} id Group ID
|
||||||
* @return {Object} Group data
|
* @return {Group | undefined} Group data
|
||||||
*/
|
*/
|
||||||
getGroupById(id) {
|
getGroupById(id) {
|
||||||
return this.groups.find(group => group.id === parseInt(id, 10));
|
return this.groups.find(group => group.id === parseInt(id, 10));
|
||||||
|
|
|
@ -218,13 +218,6 @@ describe('reducers/store', () => {
|
||||||
expect(actualResponse).to.eql(expectedResponse);
|
expect(actualResponse).to.eql(expectedResponse);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('passing no id', () => {
|
|
||||||
it('returns false', () => {
|
|
||||||
const actualResponse = instance.getChoiceById();
|
|
||||||
expect(actualResponse).to.equal(false);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('placeholderChoice getter', () => {
|
describe('placeholderChoice getter', () => {
|
||||||
|
|
26
types/index.d.ts
vendored
26
types/index.d.ts
vendored
|
@ -23,12 +23,12 @@ declare namespace Choices {
|
||||||
}
|
}
|
||||||
|
|
||||||
interface Choice {
|
interface Choice {
|
||||||
|
id?: string;
|
||||||
customProperties?: Record<string, any>;
|
customProperties?: Record<string, any>;
|
||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
active?: boolean;
|
active?: boolean;
|
||||||
elementId?: string;
|
elementId?: string;
|
||||||
groupId?: string;
|
groupId?: string;
|
||||||
id?: string;
|
|
||||||
keyCode?: number;
|
keyCode?: number;
|
||||||
label: string;
|
label: string;
|
||||||
placeholder?: boolean;
|
placeholder?: boolean;
|
||||||
|
@ -36,6 +36,18 @@ declare namespace Choices {
|
||||||
value: string;
|
value: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface Group {
|
||||||
|
id?: string;
|
||||||
|
active?: boolean;
|
||||||
|
disabled?: boolean;
|
||||||
|
value: any;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Item extends Choice {
|
||||||
|
choiceId?: string;
|
||||||
|
keyCode?: number;
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Events fired by Choices behave the same as standard events. Each event is triggered on the element passed to Choices (accessible via `this.passedElement`. Arguments are accessible within the `event.detail` object.
|
* Events fired by Choices behave the same as standard events. Each event is triggered on the element passed to Choices (accessible via `this.passedElement`. Arguments are accessible within the `event.detail` object.
|
||||||
*/
|
*/
|
||||||
|
@ -151,18 +163,6 @@ declare namespace Choices {
|
||||||
highlightChoice: CustomEvent<{ el: Choices.passedElement }>;
|
highlightChoice: CustomEvent<{ el: Choices.passedElement }>;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface Group {
|
|
||||||
active?: boolean;
|
|
||||||
disabled?: boolean;
|
|
||||||
id?: string;
|
|
||||||
value: any;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface Item extends Choice {
|
|
||||||
choiceId?: string;
|
|
||||||
keyCode?: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface Templates {
|
interface Templates {
|
||||||
containerOuter: (
|
containerOuter: (
|
||||||
this: Choices,
|
this: Choices,
|
||||||
|
|
Loading…
Reference in a new issue