Skip to content

Commit f5e80b8

Browse files
committed
Merge branch 'main' of github.com:TRIPTYK/ember-common-ui
2 parents 2bea8c6 + 755be64 commit f5e80b8

File tree

44 files changed

+2964
-5515
lines changed

Some content is hidden

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

44 files changed

+2964
-5515
lines changed

.github/workflows/tests.yaml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -122,6 +122,6 @@ jobs:
122122
with:
123123
version: 7.1.1
124124
run_install: true
125-
- run: pnpm recursive publish --access=public
125+
- run: pnpm recursive publish --access=public --no-git-checks
126126
env:
127127
NODE_AUTH_TOKEN: ${{secrets.npm_token}}

.vscode/settings.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@
22
"editor.formatOnSave": true,
33
"eslint.format.enable": true,
44
"editor.defaultFormatter": "dbaeumer.vscode-eslint",
5-
"eslint.workingDirectories": {
6-
"pattern": "tpk-*"
7-
},
5+
"eslint.workingDirectories": [{
6+
"pattern": "packages/ember-*"
7+
}],
88
"[handlebars]": {
99
"editor.suggest.insertMode": "replace",
1010
"editor.defaultFormatter": "esbenp.prettier-vscode"
@@ -22,6 +22,6 @@
2222
"strings": true
2323
},
2424
"[typescript]": {
25-
"editor.defaultFormatter": "esbenp.prettier-vscode"
25+
"editor.defaultFormatter": "dbaeumer.vscode-eslint"
2626
}
2727
}

packages/ember-input-validation/package.json

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@triptyk/ember-input-validation",
3-
"version": "0.0.16",
3+
"version": "0.0.21",
44
"description": "This addon will give you an input in TailwindCSS with Ember",
55
"keywords": [
66
"ember-addon",
@@ -30,7 +30,7 @@
3030
"dependencies": {
3131
"ember-auto-import": "^2.4.2",
3232
"ember-cli-babel": "^7.26.11",
33-
"ember-cli-htmlbars": "^6.0.1",
33+
"ember-cli-htmlbars": "^6.1.0",
3434
"ember-cli-typescript": "^5.1.0",
3535
"ember-test-selectors": "^6.0.0"
3636
},
@@ -40,13 +40,13 @@
4040
"ember-changeset-validations": "^4.1.0"
4141
},
4242
"devDependencies": {
43-
"@babel/core": "^7.18.2",
43+
"@babel/core": "^7.18.9",
4444
"@ember/optional-features": "^2.0.0",
4545
"@ember/test-helpers": "^2.8.1",
46-
"@embroider/compat": "^1.7.1",
47-
"@embroider/core": "^1.7.1",
48-
"@embroider/test-setup": "^1.7.1",
49-
"@embroider/webpack": "^1.7.1",
46+
"@embroider/compat": "^1.8.3",
47+
"@embroider/core": "^1.8.3",
48+
"@embroider/test-setup": "^1.8.3",
49+
"@embroider/webpack": "^1.8.3",
5050
"@glimmer/component": "^1.1.2",
5151
"@glimmer/tracking": "^1.1.2",
5252
"@triptyk/ember-input": "workspace:*",
@@ -68,18 +68,18 @@
6868
"@types/ember__string": "^3.0.9",
6969
"@types/ember__template": "^4.0.0",
7070
"@types/ember__test": "^4.0.0",
71-
"@types/ember__test-helpers": "^2.6.1",
71+
"@types/ember__test-helpers": "^2.8.0",
7272
"@types/ember__utils": "^4.0.0",
7373
"@types/htmlbars-inline-precompile": "^3.0.0",
74-
"@types/qunit": "^2.11.3",
74+
"@types/qunit": "^2.19.2",
7575
"@types/rsvp": "^4.0.4",
76-
"@typescript-eslint/eslint-plugin": "^5.26.0",
77-
"@typescript-eslint/parser": "^5.26.0",
76+
"@typescript-eslint/eslint-plugin": "^5.31.0",
77+
"@typescript-eslint/parser": "^5.31.0",
7878
"babel-eslint": "^10.1.0",
7979
"broccoli-asset-rev": "^3.0.0",
8080
"ember-changeset": "^4.1.0",
8181
"ember-changeset-validations": "^4.1.0",
82-
"ember-cli": "~4.4.0",
82+
"ember-cli": "~4.6.0",
8383
"ember-cli-dependency-checker": "^3.3.1",
8484
"ember-cli-inject-live-reload": "^2.1.0",
8585
"ember-cli-postcss": "^8.0.0",
@@ -93,27 +93,27 @@
9393
"ember-page-title": "^7.0.0",
9494
"ember-qunit": "^5.1.5",
9595
"ember-resolver": "^8.0.3",
96-
"ember-source": "~4.4.0",
96+
"ember-source": "~4.6.0",
9797
"ember-source-channel-url": "^3.0.0",
98-
"ember-template-lint": "^4.10.0",
98+
"ember-template-lint": "^4.10.1",
9999
"ember-truth-helpers": "^3.0.0",
100100
"ember-try": "^2.0.0",
101-
"eslint": "^8.16.0",
101+
"eslint": "^8.20.0",
102102
"eslint-config-prettier": "^8.5.0",
103-
"eslint-plugin-ember": "^10.6.1",
103+
"eslint-plugin-ember": "^11.0.2",
104104
"eslint-plugin-node": "^11.1.0",
105-
"eslint-plugin-prettier": "^4.0.0",
106-
"eslint-plugin-qunit": "^7.2.0",
105+
"eslint-plugin-prettier": "^4.2.1",
106+
"eslint-plugin-qunit": "^7.3.1",
107107
"loader.js": "^4.7.0",
108108
"npm-run-all": "^4.1.5",
109109
"postcss": "^8.4.14",
110110
"postcss-import": "^14.1.0",
111-
"prettier": "^2.6.2",
111+
"prettier": "^2.7.1",
112112
"qunit": "^2.19.1",
113113
"qunit-dom": "^2.0.0",
114-
"tailwindcss": "^3.0.24",
115-
"typescript": "^4.7.2",
116-
"webpack": "^5.72.1"
114+
"tailwindcss": "^3.1.6",
115+
"typescript": "^4.7.4",
116+
"webpack": "^5.74.0"
117117
},
118118
"engines": {
119119
"node": "12.* || 14.* || >= 16"

packages/ember-input/addon/components/tpk-file.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
/* eslint-disable no-unused-vars */
21
import { action } from '@ember/object';
32
import { tracked } from '@glimmer/tracking';
43
import { BaseUIComponent, BaseUIComponentArgs, HtmlInputEvent } from './base';

packages/ember-input/addon/components/tpk-file/input.hbs

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
class={{unless @classless 'tpk-file-input'}}
33
id={{@guid}}
44
multiple={{@multiple}}
5+
role="button"
56
{{on @changeEvent @onChange}}
67
type='file'
78
...attributes

packages/ember-input/app/styles/tpk-ember-input.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/* Input */
22
.tpk-input-input {
3-
@apply mt-1 shadow-sm focus:ring-indigo-500 focus:border-indigo-500 p-2 leading-3 block w-full sm:text-sm border-gray-300 rounded-md;
3+
@apply mt-1 shadow-sm focus-visible:ring-indigo-500 focus-visible:border-indigo-500 p-2 leading-3 block w-full sm:text-sm border-gray-300 rounded-md;
44
}
55

66
.tpk-input-label {

packages/ember-input/package.json

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@triptyk/ember-input",
3-
"version": "0.0.17",
3+
"version": "0.0.22",
44
"description": "This addon will give you an input in TailwindCSS with Ember",
55
"keywords": [
66
"ember-addon",
@@ -31,21 +31,21 @@
3131
"@glimmer/tracking": "~1.1.2",
3232
"ember-auto-import": "^2.4.2",
3333
"ember-cli-babel": "^7.26.11",
34-
"ember-cli-htmlbars": "^6.0.1",
34+
"ember-cli-htmlbars": "^6.1.0",
3535
"ember-cli-typescript": "^5.1.0",
3636
"ember-test-selectors": "^6.0.0"
3737
},
3838
"peerDependencies": {
3939
"ember-flatpickr": "^3.2.3"
4040
},
4141
"devDependencies": {
42-
"@babel/core": "^7.18.2",
42+
"@babel/core": "^7.18.9",
4343
"@ember/optional-features": "^2.0.0",
4444
"@ember/test-helpers": "^2.8.1",
45-
"@embroider/compat": "^1.7.1",
46-
"@embroider/core": "^1.7.1",
47-
"@embroider/test-setup": "^1.7.1",
48-
"@embroider/webpack": "^1.7.1",
45+
"@embroider/compat": "^1.8.3",
46+
"@embroider/core": "^1.8.3",
47+
"@embroider/test-setup": "^1.8.3",
48+
"@embroider/webpack": "^1.8.3",
4949
"@glimmer/component": "^1.1.2",
5050
"@glimmer/tracking": "^1.0.4",
5151
"@types/ember-qunit": "^5.0.0",
@@ -65,16 +65,16 @@
6565
"@types/ember__string": "^3.0.9",
6666
"@types/ember__template": "^4.0.0",
6767
"@types/ember__test": "^4.0.0",
68-
"@types/ember__test-helpers": "^2.6.1",
68+
"@types/ember__test-helpers": "^2.8.0",
6969
"@types/ember__utils": "^4.0.0",
7070
"@types/htmlbars-inline-precompile": "^3.0.0",
71-
"@types/qunit": "^2.11.3",
71+
"@types/qunit": "^2.19.2",
7272
"@types/rsvp": "^4.0.4",
73-
"@typescript-eslint/eslint-plugin": "^5.26.0",
74-
"@typescript-eslint/parser": "^5.26.0",
73+
"@typescript-eslint/eslint-plugin": "^5.31.0",
74+
"@typescript-eslint/parser": "^5.31.0",
7575
"babel-eslint": "^10.1.0",
7676
"broccoli-asset-rev": "^3.0.0",
77-
"ember-cli": "~4.4.0",
77+
"ember-cli": "~4.6.0",
7878
"ember-cli-dependency-checker": "^3.3.1",
7979
"ember-cli-inject-live-reload": "^2.1.0",
8080
"ember-cli-postcss": "^8.0.0",
@@ -88,27 +88,27 @@
8888
"ember-page-title": "^7.0.0",
8989
"ember-qunit": "^5.1.5",
9090
"ember-resolver": "^8.0.3",
91-
"ember-source": "~4.4.0",
91+
"ember-source": "~4.6.0",
9292
"ember-source-channel-url": "^3.0.0",
93-
"ember-template-lint": "^4.10.0",
93+
"ember-template-lint": "^4.10.1",
9494
"ember-truth-helpers": "^3.0.0",
9595
"ember-try": "^2.0.0",
96-
"eslint": "^8.16.0",
96+
"eslint": "^8.20.0",
9797
"eslint-config-prettier": "^8.5.0",
98-
"eslint-plugin-ember": "^10.6.1",
98+
"eslint-plugin-ember": "^11.0.2",
9999
"eslint-plugin-node": "^11.1.0",
100-
"eslint-plugin-prettier": "^4.0.0",
101-
"eslint-plugin-qunit": "^7.2.0",
100+
"eslint-plugin-prettier": "^4.2.1",
101+
"eslint-plugin-qunit": "^7.3.1",
102102
"loader.js": "^4.7.0",
103103
"npm-run-all": "^4.1.5",
104104
"postcss": "^8.4.14",
105105
"postcss-import": "^14.1.0",
106-
"prettier": "^2.6.2",
106+
"prettier": "^2.7.1",
107107
"qunit": "^2.19.1",
108108
"qunit-dom": "^2.0.0",
109-
"tailwindcss": "^3.0.24",
110-
"typescript": "^4.7.2",
111-
"webpack": "^5.72.1"
109+
"tailwindcss": "^3.1.6",
110+
"typescript": "^4.7.4",
111+
"webpack": "^5.74.0"
112112
},
113113
"engines": {
114114
"node": "12.* || 14.* || >= 16"

packages/ember-modal/.eslintrc.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,10 @@ module.exports = {
1919
env: {
2020
browser: true,
2121
},
22-
rules: {},
22+
rules: {
23+
'no-unused-vars': 'off',
24+
'@typescript-eslint/no-unused-vars': 'error',
25+
},
2326
overrides: [
2427
// node files
2528
{

packages/ember-modal/README.md

Lines changed: 18 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
ember-modal
22
==============================================================================
33

4-
This addon will give you a simple modal mechanic
4+
This addon will give you a simple stackable dialog system
55

66

77
## Compatibility
@@ -27,73 +27,43 @@ Usage
2727
------------------------------------------------------------------------------
2828
#### Features
2929

30-
- Modal dialog, only 1 active at a time.
31-
- Triggers @onClose on ESC key press.
32-
- Completely customatizable with blocks
30+
- Modal dialog, can stack on each other
31+
- Triggers @onClose on ESC key press or click outside.
32+
- Customatizable content.
3333

3434
#### Integration example
3535

3636
Arguments :
37-
- @title : The title of the modal
37+
- @title : The title of the modal - needed for Accessibility (won't show by default visually)
3838
- @isOpen : The variable that toggles the modal
39-
- @onClose : The function triggered when modal is closed
39+
- @onClose : The function triggered when modal is trying to get closed
40+
- @classless : Disable generated css classes
41+
- @outsideClickHandler : Custom handler for click outside
4042

4143
```hbs
42-
<TpkModal
43-
@title='My modal title'
44-
@isOpen={{this.isOpen}}
45-
@onClose={{this.isClosed}}
46-
>
47-
<p>
48-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Reiciendis dolorum
49-
hic sunt odio velit quo quasi dolores? Cumque, iusto iste qui obcaecati ex
50-
neque magni enim corporis, sed, magnam molestiae.
51-
</p>
44+
<TpkModal
45+
@title='title'
46+
@isOpen={{this.open2}}
47+
@onClose={{this.closed2}}
48+
@classless={{false}}
49+
as |M|
50+
>
51+
<M.Content>
52+
<button type="button">Hello</button>
53+
</M.Content>
5254
</TpkModal>
5355
```
5456

5557

5658

5759
For the extended syntax, [see examples](/packages/ember-modal/tests/dummy/app/components/ui-show.hbs).
5860

59-
Default tailwind style example :
60-
61-
```css
62-
.tpk-modal-content {
63-
@apply z-20 bg-white p-6 rounded-lg;
64-
width: 50vw;
65-
}
66-
67-
.tpk-modal-content-head {
68-
@apply flex justify-between mb-8;
69-
}
70-
71-
.tpk-modal-content-head > h3 {
72-
@apply text-2xl font-semibold;
73-
}
74-
75-
.tpk-modal-container {
76-
@apply fixed px-4 py-4 top-0 right-0 left-0 bottom-0 flex items-center justify-center z-20;
77-
}
78-
79-
.tpk-modal-cover {
80-
@apply absolute inset-0 bg-gray-500 opacity-75 z-10;
81-
}
82-
```
83-
8461
Structure of the component (Emmet like)
8562
------------------------------------------------------------------------------
8663

8764
- Modal
8865
- div.tpk-modal-container
89-
- div.tpk-modal-cover
9066
- Modal::Content.tpk-modal-content
91-
- Modal::Content::Head.tpk-modal-content-head
92-
- h3
93-
- Modal::Content::Head::Button.tpk-modal-content-head-button
94-
- {{yield}}
95-
96-
9767

9868
## Contributing
9969

0 commit comments

Comments
 (0)