Skip to content

Commit 09a65dc

Browse files
eden-laneeden-lane
committed
init
0 parents  commit 09a65dc

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

46 files changed

+20365
-0
lines changed

‎.editorconfig

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
root = true
2+
3+
[*]
4+
charset = utf-8
5+
end_of_line = lf
6+
indent_size = 2
7+
indent_style = space
8+
insert_final_newline = true
9+
max_line_length = 120
10+
tab_width = 2
11+
trim_trailing_whitespace = true
12+
13+
[{*.ats,*.ts}]
14+
indent_size = 2
15+
tab_width = 2

‎.gitignore

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.idea
2+
lib
3+
node_modules

‎.gitlab-ci.yml

+49
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
image: node:latest
2+
3+
variables:
4+
REGISTRY: registry.redmadrobot.com:5005
5+
NPM_REGISTRY: https://nexus.redmadrobot.com/repository/npm-group/
6+
7+
stages:
8+
- test
9+
- publish
10+
- notify
11+
12+
cache:
13+
paths:
14+
- .npm/
15+
16+
before_script:
17+
- npm config set registry https://nexus.redmadrobot.com/repository/npm-group/
18+
- npm config set _auth "${CI_NPM_AUTH}"
19+
- npm ci --cache .npm --prefer-offline
20+
21+
test_lint:
22+
stage: test
23+
script:
24+
- npm t -- --coverage
25+
coverage: /All files[^|]*\|[^|]*\s+([\d\.]+)/
26+
tags:
27+
- frontend-docker
28+
29+
publish:
30+
stage: publish
31+
script:
32+
- npm i
33+
- npm run build
34+
- npm publish
35+
tags:
36+
- frontend-docker
37+
only:
38+
- tags
39+
40+
notify:
41+
stage: notify
42+
script:
43+
- npx notify
44+
tags:
45+
- frontend-docker
46+
only:
47+
- tags
48+
dependencies:
49+
- publish

‎.storybook/main.js

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
module.exports = {
2+
stories: ['../stories/**/*.stories.tsx'],
3+
addons: ['@storybook/addon-actions', '@storybook/addon-links'],
4+
webpackFinal: async config => {
5+
config.module.rules.push({
6+
test: /\.(ts|tsx)$/,
7+
use: [
8+
{
9+
loader: require.resolve('ts-loader'),
10+
},
11+
{
12+
loader: require.resolve('react-docgen-typescript-loader'),
13+
},
14+
]
15+
});
16+
config.resolve.extensions.push('.ts', '.tsx');
17+
18+
return config;
19+
}
20+
};

‎CHANGELOG.md

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
## v0.5.1 - 3 Oct 2020
2+
- Added autoScroll option
3+
- Added throttling to repositioning menu
4+
- Fixed autohiding
5+
6+
## v0.4.4 - 24 Sep 2020
7+
- Added menu autoscroll
8+
9+
## v0.3.1 - 17 Sep 2020
10+
- Changed of the menu width to auto
11+
12+
## v0.2.1 - 3 Jul 2020
13+
### Bugfixes
14+
- Fixed: onSelect was called with no item in some cases
15+
16+
## v0.2.0 - 1 Jul 2020
17+
### Features
18+
- Auto adjusting dropdown orientation (top/bottom) depending on it's position;

‎README.md

+76
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
# useDropdown
2+
**useDropdown** is a hook that helps you build a custom
3+
select element that suits needs. It also takes away the pain
4+
of positioning of a dropdown element and repositioning it
5+
on scroll.
6+
7+
## Usage
8+
```typescript jsx
9+
const {
10+
isOpen,
11+
highlightedIndex,
12+
inputValue,
13+
getInputWrapperProps,
14+
getInputProps,
15+
getMenuProps,
16+
getItemProps,
17+
} = useDropdown<T>({
18+
items,
19+
onSelect,
20+
reducer,
21+
autoScroll
22+
})
23+
```
24+
25+
### Arguments
26+
`useDropdown` accepts following arguments:
27+
28+
* **items** - `Array<T>`
29+
Menu elements of your dropdown. It is expected that they will
30+
be the same type you passed to `useDropdown` generic
31+
32+
* **onSelect** - `(item: T) => void`
33+
Function which is called each time you click on element or
34+
select it with Enter key
35+
36+
* **reducer**
37+
Using this function you can change how `useDropdown` reacts
38+
to certain events; For example, you can prevent dropdown
39+
from closing after user selects an option
40+
41+
* **autoScroll** - `boolean`
42+
If `true` dropdown will detect scroll of outer containers and will reposition menu accordingly.
43+
44+
### State and methods
45+
`useDropdown` returns it's state and provides methods that
46+
you should use to build your dropdown:
47+
48+
* **isOpen** - `boolean`
49+
Current state of dropdown. Use it to decide whether you should
50+
show menu or not
51+
52+
* **highlightedIndex** - `number`
53+
Shows the index of an element that is currently highlighted by
54+
cursor or with arrow keys. Use it to apply styles.
55+
56+
* **inputValue** - `string`
57+
Current value of input.
58+
59+
* **getInputWrapperProps** - `(): WrapperProps` - _required_
60+
Apply these props to block that represents your dropdown element.
61+
This block will be used to calculate the width of dropdown along
62+
with it's position on the screen.
63+
> Note: this method will be renamed in future versions
64+
65+
* **getInputProps** - `(): InputProps` - _optional_
66+
You can use it on your input. This method will help `useDropdown`
67+
to track input's value and it also allows menu to be opened each time
68+
input recieves focus.
69+
70+
* **getMenuProps** - `(): MenuProps` - _required_
71+
Returns props for block element that wraps your menu items. It is
72+
necessary for correct positioning of you dropdown.
73+
74+
* **getItemProps** - `(item: T, index: number) => ItemProps` - _required_
75+
Method for getting props for every item in your items list. Pass
76+
item and it's index to this method.

‎build.tsconfig.json

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
{
2+
"compilerOptions": {
3+
"target": "es5",
4+
"declaration": true,
5+
"module": "CommonJS",
6+
"esModuleInterop": true,
7+
"jsx": "react",
8+
"lib": ["dom", "es2015", "es2016"],
9+
"sourceMap": true,
10+
"moduleResolution": "node",
11+
"outDir": "lib/",
12+
"rootDir": "./src"
13+
},
14+
"include": ["./src/**/*"],
15+
"exclude": ["node_modules"]
16+
}

‎coverage/clover.xml

+136
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,136 @@
1+
<?xml version="1.0" encoding="UTF-8"?>
2+
<coverage generated="1593250149599" clover="3.2.0">
3+
<project timestamp="1593250149599" name="All files">
4+
<metrics statements="109" coveredstatements="97" conditionals="27" coveredconditionals="22" methods="24" coveredmethods="21" elements="160" coveredelements="140" complexity="0" loc="109" ncloc="109" packages="2" files="5" classes="5"/>
5+
<package name="src">
6+
<metrics statements="105" coveredstatements="93" conditionals="27" coveredconditionals="22" methods="21" coveredmethods="18"/>
7+
<file name="index.ts" path="/Users/eden_lane/Projects/work/use-dropdown/src/index.ts">
8+
<metrics statements="3" coveredstatements="0" conditionals="0" coveredconditionals="0" methods="0" coveredmethods="0"/>
9+
<line num="1" count="0" type="stmt"/>
10+
<line num="2" count="0" type="stmt"/>
11+
<line num="4" count="0" type="stmt"/>
12+
</file>
13+
<file name="reducer.ts" path="/Users/eden_lane/Projects/work/use-dropdown/src/reducer.ts">
14+
<metrics statements="20" coveredstatements="20" conditionals="13" coveredconditionals="12" methods="1" coveredmethods="1"/>
15+
<line num="1" count="1" type="stmt"/>
16+
<line num="4" count="1" type="stmt"/>
17+
<line num="5" count="44" type="stmt"/>
18+
<line num="6" count="44" type="stmt"/>
19+
<line num="8" count="44" type="stmt"/>
20+
<line num="10" count="2" type="stmt"/>
21+
<line num="13" count="2" type="stmt"/>
22+
<line num="15" count="3" type="stmt"/>
23+
<line num="18" count="3" type="stmt"/>
24+
<line num="20" count="12" type="stmt"/>
25+
<line num="23" count="12" type="stmt"/>
26+
<line num="25" count="18" type="stmt"/>
27+
<line num="28" count="18" type="stmt"/>
28+
<line num="30" count="1" type="stmt"/>
29+
<line num="33" count="1" type="stmt"/>
30+
<line num="35" count="5" type="stmt"/>
31+
<line num="40" count="5" type="stmt"/>
32+
<line num="42" count="3" type="stmt"/>
33+
<line num="47" count="3" type="stmt"/>
34+
<line num="50" count="44" type="stmt"/>
35+
</file>
36+
<file name="stateChangeType.ts" path="/Users/eden_lane/Projects/work/use-dropdown/src/stateChangeType.ts">
37+
<metrics statements="10" coveredstatements="10" conditionals="2" coveredconditionals="2" methods="1" coveredmethods="1"/>
38+
<line num="1" count="1" type="cond" truecount="2" falsecount="0"/>
39+
<line num="2" count="1" type="stmt"/>
40+
<line num="3" count="1" type="stmt"/>
41+
<line num="4" count="1" type="stmt"/>
42+
<line num="5" count="1" type="stmt"/>
43+
<line num="6" count="1" type="stmt"/>
44+
<line num="7" count="1" type="stmt"/>
45+
<line num="8" count="1" type="stmt"/>
46+
<line num="9" count="1" type="stmt"/>
47+
<line num="10" count="1" type="stmt"/>
48+
</file>
49+
<file name="useDropdown.ts" path="/Users/eden_lane/Projects/work/use-dropdown/src/useDropdown.ts">
50+
<metrics statements="72" coveredstatements="63" conditionals="12" coveredconditionals="8" methods="19" coveredmethods="16"/>
51+
<line num="2" count="1" type="stmt"/>
52+
<line num="3" count="1" type="stmt"/>
53+
<line num="4" count="1" type="stmt"/>
54+
<line num="7" count="1" type="stmt"/>
55+
<line num="22" count="1" type="stmt"/>
56+
<line num="28" count="1" type="stmt"/>
57+
<line num="32" count="78" type="stmt"/>
58+
<line num="33" count="39" type="stmt"/>
59+
<line num="34" count="39" type="stmt"/>
60+
<line num="35" count="39" type="stmt"/>
61+
<line num="36" count="39" type="stmt"/>
62+
<line num="37" count="39" type="stmt"/>
63+
<line num="42" count="117" type="stmt"/>
64+
<line num="44" count="39" type="stmt"/>
65+
<line num="45" count="1" type="stmt"/>
66+
<line num="46" count="1" type="stmt"/>
67+
<line num="49" count="39" type="stmt"/>
68+
<line num="50" count="3" type="stmt"/>
69+
<line num="53" count="39" type="stmt"/>
70+
<line num="54" count="1" type="stmt"/>
71+
<line num="57" count="39" type="stmt"/>
72+
<line num="58" count="2" type="stmt"/>
73+
<line num="61" count="39" type="stmt"/>
74+
<line num="62" count="1" type="stmt"/>
75+
<line num="63" count="1" type="stmt"/>
76+
<line num="64" count="1" type="stmt"/>
77+
<line num="65" count="1" type="stmt"/>
78+
<line num="71" count="39" type="stmt"/>
79+
<line num="72" count="6" type="stmt"/>
80+
<line num="78" count="39" type="stmt"/>
81+
<line num="79" count="9" type="stmt"/>
82+
<line num="85" count="39" type="stmt"/>
83+
<line num="86" count="1" type="stmt"/>
84+
<line num="92" count="39" type="stmt"/>
85+
<line num="93" count="7" type="cond" truecount="1" falsecount="1"/>
86+
<line num="94" count="0" type="stmt"/>
87+
<line num="95" count="0" type="stmt"/>
88+
<line num="97" count="0" type="stmt"/>
89+
<line num="104" count="39" type="stmt"/>
90+
<line num="105" count="0" type="stmt"/>
91+
<line num="106" count="0" type="cond" truecount="0" falsecount="2"/>
92+
<line num="107" count="0" type="stmt"/>
93+
<line num="108" count="0" type="stmt"/>
94+
<line num="109" count="0" type="stmt"/>
95+
<line num="114" count="39" type="stmt"/>
96+
<line num="115" count="10" type="stmt"/>
97+
<line num="117" count="5" type="stmt"/>
98+
<line num="118" count="5" type="stmt"/>
99+
<line num="120" count="3" type="stmt"/>
100+
<line num="121" count="3" type="stmt"/>
101+
<line num="123" count="1" type="stmt"/>
102+
<line num="124" count="1" type="stmt"/>
103+
<line num="126" count="1" type="cond" truecount="1" falsecount="1"/>
104+
<line num="127" count="1" type="stmt"/>
105+
<line num="128" count="1" type="stmt"/>
106+
<line num="130" count="1" type="stmt"/>
107+
<line num="134" count="39" type="stmt"/>
108+
<line num="135" count="35" type="cond" truecount="2" falsecount="0"/>
109+
<line num="136" count="13" type="stmt"/>
110+
<line num="137" count="13" type="stmt"/>
111+
<line num="140" count="35" type="stmt"/>
112+
<line num="141" count="35" type="stmt"/>
113+
<line num="142" count="35" type="stmt"/>
114+
<line num="146" count="39" type="stmt"/>
115+
<line num="147" count="0" type="stmt"/>
116+
<line num="152" count="39" type="stmt"/>
117+
<line num="153" count="8" type="stmt"/>
118+
<line num="161" count="39" type="stmt"/>
119+
<line num="162" count="8" type="stmt"/>
120+
<line num="169" count="39" type="stmt"/>
121+
<line num="170" count="7" type="stmt"/>
122+
<line num="180" count="39" type="stmt"/>
123+
</file>
124+
</package>
125+
<package name="src.utils">
126+
<metrics statements="4" coveredstatements="4" conditionals="0" coveredconditionals="0" methods="3" coveredmethods="3"/>
127+
<file name="mergeReducers.ts" path="/Users/eden_lane/Projects/work/use-dropdown/src/utils/mergeReducers.ts">
128+
<metrics statements="4" coveredstatements="4" conditionals="0" coveredconditionals="0" methods="3" coveredmethods="3"/>
129+
<line num="1" count="156" type="stmt"/>
130+
<line num="2" count="39" type="stmt"/>
131+
<line num="3" count="44" type="stmt"/>
132+
<line num="5" count="63" type="stmt"/>
133+
</file>
134+
</package>
135+
</project>
136+
</coverage>

0 commit comments

Comments
 (0)