Skip to content

Commit 1c28c9a

Browse files
shairezshairez
committed
Merge branch 'main' into pr-storybook
2 parents 4740bd2 + 4db0e75 commit 1c28c9a

File tree

15 files changed

+2505
-6246
lines changed

15 files changed

+2505
-6246
lines changed

‎.all-contributorsrc

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -223,6 +223,16 @@
223223
"contributions": [
224224
"code"
225225
]
226+
},
227+
{
228+
"login": "tleperou",
229+
"name": "Thomas Lepérou",
230+
"avatar_url": "https://avatars.githubusercontent.com/u/8383972?v=4",
231+
"profile": "https://github.com/tleperou",
232+
"contributions": [
233+
"doc",
234+
"code"
235+
]
226236
}
227237
],
228238
"contributorsPerLine": 7,

‎CODING_STANDARDS.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -125,3 +125,23 @@ export const Button = component$(
125125
}
126126
);
127127
```
128+
129+
# A11y test coverage
130+
131+
Use [Axe](https://chrome.google.com/webstore/detail/axe-devtools-web-accessib/lhdoppojpmngadmnindnejefpokejbdd) Chrome extension in order to test components against the a11y standards.
132+
133+
Choose the suitable tests to perform among the different available categories:
134+
135+
- table
136+
- keyboard
137+
- modal dialog
138+
- interactive elements
139+
- structure
140+
- images
141+
- forms
142+
143+
Note: test only the component by choosing the parts of the page that have to be tested.
144+
145+
The extension is pretty talkative and provides all the insights to perform the tests with ease. Once tests' results are available, do your best to solve any issues found.
146+
147+
Share the tests results on the related Discord channel or Github PR.

‎README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,7 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
111111
<td align="center" valign="top" width="14.28%"><a href="https://yishay-hazan.netlify.app"><img src="https://avatars.githubusercontent.com/u/50710472?v=4?s=100" width="100px;" alt="Yishay Hazan"/><br /><sub><b>Yishay Hazan</b></sub></a><br /><a href="https://github.com/qwikifiers/qwik-ui/commits?author=yishayhaz" title="Code">💻</a></td>
112112
<td align="center" valign="top" width="14.28%"><a href="https://github.com/rossellamascia"><img src="https://avatars.githubusercontent.com/u/42215075?v=4?s=100" width="100px;" alt="Rossella Mascia"/><br /><sub><b>Rossella Mascia</b></sub></a><br /><a href="https://github.com/qwikifiers/qwik-ui/commits?author=rossellamascia" title="Code">💻</a></td>
113113
<td align="center" valign="top" width="14.28%"><a href="https://ssd7.vercel.app"><img src="https://avatars.githubusercontent.com/u/80447788?v=4?s=100" width="100px;" alt="Sai Srikar Dumpeti"/><br /><sub><b>Sai Srikar Dumpeti</b></sub></a><br /><a href="https://github.com/qwikifiers/qwik-ui/commits?author=the-r3aper7" title="Code">💻</a></td>
114+
<td align="center" valign="top" width="14.28%"><a href="https://github.com/tleperou"><img src="https://avatars.githubusercontent.com/u/8383972?v=4?s=100" width="100px;" alt="Thomas Lepérou"/><br /><sub><b>Thomas Lepérou</b></sub></a><br /><a href="https://github.com/qwikifiers/qwik-ui/commits?author=tleperou" title="Documentation">📖</a> <a href="https://github.com/qwikifiers/qwik-ui/commits?author=tleperou" title="Code">💻</a></td>
114115
</tr>
115116
</tbody>
116117
</table>

‎apps/website/src/components/menu/menu.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@ export const Menu = component$<Props>(({ onClose$ }) => {
4242
path: `/docs/${appState.theme.toLowerCase()}/navigation-bar`,
4343
},
4444
{ label: 'Drawer', path: `/docs/${appState.theme.toLowerCase()}/drawer` },
45+
{ label: 'Input Phone', path: `/docs/headless/input-phone` },
4546
{ label: 'Rating', path: `/docs/${appState.theme.toLowerCase()}/rating` },
4647
{ label: 'Radio', path: `/docs/${appState.theme.toLowerCase()}/radio` },
4748
{ label: 'Popover', path: `/docs/${appState.theme.toLowerCase()}/popover` },

‎apps/website/src/routes/docs/headless/input-phone/index.tsx

Lines changed: 108 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,108 @@
1+
import {
2+
$,
3+
component$,
4+
useSignal,
5+
useStyles$,
6+
useStylesScoped$,
7+
} from '@builder.io/qwik';
8+
import { InputPhone } from '@qwik-ui/headless';
9+
import {
10+
InputPhoneCountry,
11+
InputPhoneValidity,
12+
} from 'packages/headless/src/components/input-phone/input-phone';
13+
import styles from './input-phone.css?inline';
14+
15+
export default component$(() => {
16+
useStyles$(styles);
17+
18+
useStylesScoped$(`
19+
h1 { margin: 2rem 0; padding-top: 1rem; font-weight: bold; border-top: 1px dotted #222}
20+
.form-item, hr { width: 35em; }
21+
h2 { margin-block: 1.15em 0.5em; font-size: xx-large; }
22+
h3 { margin-block: 0.85em 0.35em; font-size: x-large; }
23+
`);
24+
25+
const country = useSignal<InputPhoneCountry>();
26+
const number = useSignal<string>();
27+
const valid = useSignal<InputPhoneValidity>();
28+
29+
return (
30+
<>
31+
<p>This is the documentation for the Input Phone</p>
32+
33+
<h2>Input Phone Example</h2>
34+
35+
<h3>countryCode set to FR</h3>
36+
37+
<div class="form-item">
38+
<InputPhone
39+
countryCode="FR"
40+
value="0645678990"
41+
placeholder="Type your phone number"
42+
/>
43+
</div>
44+
45+
<hr />
46+
47+
<h3>countryCode unset</h3>
48+
49+
<div class="form-item">
50+
<InputPhone value="0645678990" placeholder="Type your phone number" />
51+
</div>
52+
53+
<hr />
54+
55+
<h3>countryCode set to auto</h3>
56+
57+
<div class="form-item">
58+
<InputPhone
59+
countryCode="auto"
60+
value="0481163"
61+
placeholder="Type your phone number"
62+
onCountryChange$={$((value?: InputPhoneCountry) => {
63+
country.value = value;
64+
})}
65+
onNumberChange$={$((value: string) => {
66+
number.value = value;
67+
})}
68+
onValidChange$={$((value: InputPhoneValidity) => {
69+
valid.value = value;
70+
})}
71+
/>
72+
</div>
73+
74+
<hr />
75+
76+
<h3>Inputs</h3>
77+
78+
<ul>
79+
<li>
80+
<pre>countryCode</pre> type CountryCode | default undefined
81+
</li>
82+
<li>
83+
<pre>placeholder</pre> type string | default "Phone number"
84+
</li>
85+
<li>
86+
<pre>value</pre> type string | default <em>empty</em>
87+
</li>
88+
</ul>
89+
90+
<hr />
91+
92+
<h3>Outputs</h3>
93+
94+
<ul>
95+
<li>
96+
<pre>onCountryChange$</pre>:{' '}
97+
<pre>{JSON.stringify(country.value) || '–'}</pre>
98+
</li>
99+
<li>
100+
<pre>onNumberChange$</pre>: {number.value || '–'}
101+
</li>
102+
<li>
103+
<pre>onValidChange$</pre>: {valid.value || '–'}
104+
</li>
105+
</ul>
106+
</>
107+
);
108+
});

‎apps/website/src/routes/docs/headless/input-phone/input-phone.css

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
hr {
2+
margin-block: 2em;
3+
}
4+
5+
pre {
6+
display: inline;
7+
}

‎cla-signs/v1/cla.json

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -199,6 +199,14 @@
199199
"created_at": "2023-03-13T14:56:57Z",
200200
"repoId": 545159943,
201201
"pullRequestNo": 240
202+
},
203+
{
204+
"name": "tleperou",
205+
"id": 8383972,
206+
"comment_id": 1475013253,
207+
"created_at": "2023-03-18T22:18:00Z",
208+
"repoId": 545159943,
209+
"pullRequestNo": 243
202210
}
203211
]
204-
}
212+
}

‎package.json

Lines changed: 34 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -13,74 +13,78 @@
1313
"prepare": "husky install"
1414
},
1515
"devDependencies": {
16-
"@builder.io/qwik": "0.19.2",
17-
"@builder.io/qwik-city": "0.4.0",
16+
"@builder.io/qwik": "0.23.0",
17+
"@builder.io/qwik-city": "0.6.6",
1818
"@commitlint/cli": "^17.4.3",
1919
"@commitlint/config-angular": "^17.4.3",
2020
"@commitlint/config-conventional": "^17.4.3",
2121
"@cypress/code-coverage": "3.10.0",
2222
"@cypress/vite-dev-server": "^2.2.1",
2323
"@floating-ui/dom": "1.0.10",
2424
"@jscutlery/semver": "^2.30.1",
25-
"@nrwl/cli": "15.8.6",
26-
"@nrwl/cypress": "15.8.6",
27-
"@nrwl/eslint-plugin-nx": "15.8.6",
28-
"@nrwl/linter": "15.8.6",
29-
"@nrwl/nx-cloud": "15.2.1",
30-
"@nrwl/storybook": "15.8.6",
31-
"@nrwl/vite": "15.8.6",
32-
"@nrwl/workspace": "15.8.6",
33-
"@storybook/addon-essentials": "7.0.0-rc.3",
34-
"@storybook/addon-interactions": "7.0.0-rc.3",
35-
"@storybook/addon-links": "7.0.0-rc.3",
36-
"@storybook/blocks": "7.0.0-rc.3",
37-
"@storybook/builder-vite": "0.4.2",
38-
"@storybook/testing-library": "0.0.14-next.1",
39-
"@types/eslint": "8.21.1",
40-
"@types/node": "18.13.0",
41-
"@typescript-eslint/eslint-plugin": "5.52.0",
42-
"@typescript-eslint/parser": "5.52.0",
25+
"@nrwl/cli": "15.8.7",
26+
"@nrwl/cypress": "15.8.7",
27+
"@nrwl/eslint-plugin-nx": "15.8.7",
28+
"@nrwl/linter": "15.8.7",
29+
"@nrwl/nx-cloud": "15.3.1",
30+
"@nrwl/storybook": "15.8.7",
31+
"@nrwl/vite": "15.8.7",
32+
"@nrwl/workspace": "15.8.7",
33+
"@storybook/addon-essentials": "7.0.0-rc.7",
34+
"@storybook/addon-interactions": "7.0.0-rc.7",
35+
"@storybook/addon-links": "7.0.0-rc.7",
36+
"@storybook/blocks": "7.0.0-rc.7",
37+
"@storybook/builder-vite": "7.0.0-rc.7",
38+
"@storybook/html": "7.0.0-rc.7",
39+
"@storybook/html-vite": "7.0.0-rc.7",
40+
"@storybook/testing-library": "0.0.13",
41+
"@types/eslint": "8.21.3",
42+
"@types/node": "18.15.3",
43+
"@typescript-eslint/eslint-plugin": "5.56.0",
44+
"@typescript-eslint/parser": "5.56.0",
4345
"@vitest/coverage-c8": "~0.28.5",
4446
"@vitest/ui": "^0.28.5",
4547
"all-contributors-cli": "^6.24.0",
4648
"autoprefixer": "^10.4.13",
4749
"commitizen": "^4.3.0",
4850
"commitlint": "^17.4.3",
51+
"country-list-json": "1.1.0",
4952
"cypress": "^12.6.0",
5053
"cypress-ct-qwik": "0.0.5",
5154
"cz-conventional-changelog": "^3.3.0",
5255
"daisyui": "^2.50.1",
5356
"danger": "11.2.4",
54-
"eslint": "8.34.0",
57+
"eslint": "8.36.0",
5558
"eslint-config-prettier": "8.6.0",
5659
"eslint-plugin-cypress": "^2.12.1",
57-
"eslint-plugin-qwik": "0.18.1",
60+
"eslint-plugin-qwik": "0.23.0",
5861
"eslint-plugin-storybook": "^0.6.11",
5962
"html-webpack-plugin": "^5.5.0",
6063
"husky": "^8.0.3",
6164
"jsdom": "~20.0.3",
65+
"libphonenumber-js": "1.10.24",
6266
"lodash.includes": "4.3.0",
6367
"ngx-deploy-npm": "^5.0.0",
6468
"node-fetch": "3.3.0",
6569
"np": "7.6.3",
66-
"nx": "15.8.6",
70+
"nx": "15.8.7",
6771
"postcss": "^8.4.21",
68-
"prettier": "2.8.4",
72+
"prettier": "2.8.6",
6973
"pretty-quick": "^3.1.3",
70-
"qwik-nx": "0.13.2",
74+
"qwik-nx": "0.14.0",
7175
"react": "18.2.0",
7276
"react-dom": "18.2.0",
7377
"sass": "1.58.1",
74-
"storybook": "7.0.0-rc.3",
78+
"storybook": "7.0.0-rc.7",
7579
"storybook-framework-qwik": "0.0.8",
7680
"tailwindcss": "^3.2.6",
7781
"ts-node": "10.9.1",
78-
"typescript": "4.9.5",
79-
"undici": "5.19.1",
80-
"vite": "4.1.1",
82+
"typescript": "5.0.2",
83+
"undici": "5.21.0",
84+
"vite": "4.2.1",
8185
"vite-plugin-dts": "~1.7.3",
8286
"vite-plugin-eslint": "^1.8.1",
83-
"vite-tsconfig-paths": "4.0.5",
87+
"vite-tsconfig-paths": "4.0.7",
8488
"vitest": "^0.28.5"
8589
},
8690
"config": {

‎packages/headless/src/components/input-phone/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export { InputPhone } from './input-phone';

0 commit comments

Comments
 (0)