Skip to content
This repository was archived by the owner on Aug 7, 2020. It is now read-only.

Commit 892d858

Browse files
AxelPeterAxelPeter
authored
Merge pull request #309 from ovh-ux/develop
Develop
2 parents e352ec7 + f763666 commit 892d858

Some content is hidden

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

54 files changed

+1271
-244
lines changed

‎packages/oui-angular/src/index.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import Field from "@ovh-ui/oui-field";
1414
import FormActions from "@ovh-ui/oui-form-actions";
1515
import GuideMenu from "@ovh-ui/oui-guide-menu";
1616
import HeaderTabs from "@ovh-ui/oui-header-tabs";
17+
import InlineAdder from "@ovh-ui/oui-inline-adder";
1718
import Message from "@ovh-ui/oui-message";
1819
import Modal from "@ovh-ui/oui-modal";
1920
import Navbar from "@ovh-ui/oui-navbar";
@@ -53,6 +54,7 @@ export default angular
5354
FormActions,
5455
GuideMenu,
5556
HeaderTabs,
57+
InlineAdder,
5658
Message,
5759
Modal,
5860
Navbar,

‎packages/oui-angular/src/index.spec.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ loadTests(require.context("../../oui-field/src/", true, /.*((\.spec)|(index))$/)
1616
loadTests(require.context("../../oui-form-actions/src/", true, /.*((\.spec)|(index))$/));
1717
loadTests(require.context("../../oui-guide-menu/src/", true, /.*((\.spec)|(index))$/));
1818
loadTests(require.context("../../oui-header-tabs/src/", true, /.*((\.spec)|(index))$/));
19+
loadTests(require.context("../../oui-inline-adder/src/", true, /.*((\.spec)|(index))$/));
1920
loadTests(require.context("../../oui-message/src/", true, /.*((\.spec)|(index))$/));
2021
loadTests(require.context("../../oui-modal/src/", true, /.*((\.spec)|(index))$/));
2122
loadTests(require.context("../../oui-navbar/src/", true, /.*((\.spec)|(index))$/));

‎packages/oui-calendar/README.md‎

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,17 @@
6161
</div>
6262
```
6363

64+
### Enabling time
65+
66+
Use `enable-time` to show time selection after a date is selected.
67+
68+
```html:preview
69+
<oui-calendar model="$ctrl.weekModel" format="Y-m-d H:i" enable-time>
70+
</oui-calendar>
71+
```
72+
73+
**Note**: See [Flatpickr documentation](https://flatpickr.js.org/examples/#time-picker) for more information.
74+
6475
### Disabling dates
6576

6677
Use `disable-date` to make certain dates unavailable for selection.
@@ -168,7 +179,7 @@ Use `mode` to set a different selection mode for the calendar
168179
| `min-date` | object | <? | yes | See [Supplying Dates](https://flatpickr.js.org/examples/#supplying-dates-for-flatpickr) | n/a | specifies the minimum/earliest date (inclusively) allowed for selection
169180
| `disable-date` | array | <? | yes | See [Supplying Dates](https://flatpickr.js.org/examples/#supplying-dates-for-flatpickr) | n/a | make certain dates unavailable for selection
170181
| `enable-date` | array | <? | yes | See [Supplying Dates](https://flatpickr.js.org/examples/#supplying-dates-for-flatpickr) | n/a | make certain dates only available for selection
171-
| `enable-time` | boolean | <? | yes | See [Options](https://flatpickr.js.org/options/) | n/a | enables time picker
182+
| `enable-time` | boolean | <? | yes | `true`, `false` | `false` | enables time selection
172183
| `week-numbers` | boolean | <? | yes | `true`, `false` | `false` | week numbers flag
173184
| `disabled` | boolean | <? | no | `true`, `false` | `false` | disabled flag
174185
| `required` | boolean | <? | no | `true`, `false` | `false` | required flag

‎packages/oui-calendar/src/calendar.controller.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -82,8 +82,10 @@ export default class {
8282
$onInit () {
8383
addBooleanParameter(this, "appendToBody");
8484
addBooleanParameter(this, "disabled");
85+
addBooleanParameter(this, "enableTime");
8586
addBooleanParameter(this, "inline");
8687
addBooleanParameter(this, "required");
88+
addBooleanParameter(this, "static");
8789
addBooleanParameter(this, "weekNumbers");
8890

8991
this.initCalendarInstance();

‎packages/oui-datagrid/README.md‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -294,6 +294,26 @@ Or you can use the `page-size` property. It takes precedence over value configur
294294
</oui-datagrid>
295295
```
296296

297+
### Access row index
298+
299+
```html:preview
300+
<oui-datagrid rows="$ctrl.data" page-size="5">
301+
<oui-column title="'Index'">
302+
{{$rowIndex}}
303+
</oui-column>
304+
<oui-column title="'Name'">
305+
{{$row.firstName}} {{$row.lastName}}
306+
</oui-column>
307+
<oui-column property="email">
308+
<a href="mailto:{{$value}}">{{$value}}</a>
309+
</oui-column>
310+
<oui-column property="phone"></oui-column>
311+
<oui-column property="birth">
312+
{{$value | date:shortDate}}
313+
</oui-column>
314+
</oui-datagrid>
315+
```
316+
297317
### Remote data
298318

299319
```html

‎packages/oui-datagrid/src/cell/cell.controller.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ export default class {
4040
this.cellScope.$row = this.row;
4141
this.cellScope.$column = this.column;
4242
this.cellScope.$value = this.row[this.column.name];
43+
this.cellScope.$rowIndex = this.index;
4344

4445
if (this.column.compiledTemplate) {
4546
this.column.compiledTemplate(this.cellScope, clone => {

‎packages/oui-datagrid/src/index.spec.js‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1076,6 +1076,38 @@ describe("ouiDatagrid", () => {
10761076
expect(actualCellHtml).toBe(`test: ${fakeData[0].lastName}`);
10771077
});
10781078

1079+
it("should support row index data binding inside cell", () => {
1080+
const element = TestUtils.compileTemplate(`
1081+
<oui-datagrid rows="$ctrl.rows">
1082+
<oui-column property="firstName"></oui-column>
1083+
<oui-column property="">
1084+
test: {{ $rowIndex }}
1085+
</oui-column>
1086+
</oui-datagrid>
1087+
`, {
1088+
rows: fakeData.slice(0, 5)
1089+
}
1090+
);
1091+
1092+
const $firstRow = getRow(element, 0);
1093+
expect(
1094+
getCell($firstRow, 1).children().children().html()
1095+
.trim())
1096+
.toBe("test: 0");
1097+
1098+
const $middleRow = getRow(element, 2);
1099+
expect(
1100+
getCell($middleRow, 1).children().children().html()
1101+
.trim())
1102+
.toBe("test: 2");
1103+
1104+
const $lastRow = getRow(element, 4);
1105+
expect(
1106+
getCell($lastRow, 1).children().children().html()
1107+
.trim())
1108+
.toBe("test: 4");
1109+
});
1110+
10791111
it("should support parent binding inside cell", () => {
10801112
const element = TestUtils.compileTemplate(`
10811113
<oui-datagrid rows="$ctrl.rows">

‎packages/oui-dropdown/src/index.spec.js‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -212,6 +212,32 @@ describe("ouiDropdown", () => {
212212
expect(link.attr("target")).toBe("_blank");
213213
expect(link.attr("rel")).toBe("noopener");
214214
});
215+
216+
it("should call click callback", () => {
217+
const onLinkClickSpy = jasmine.createSpy("onLinkClickSpy");
218+
const onButtonClickSpy = jasmine.createSpy("onButtonClickSpy");
219+
const element = TestUtils.compileTemplate(`
220+
<oui-dropdown>
221+
<oui-dropdown-trigger text="Actions"></oui-dropdown-trigger>
222+
<oui-dropdown-content>
223+
<oui-dropdown-item text="Lorem ipsum" href="#" on-click="$ctrl.onLinkClick()"></oui-dropdown-item>
224+
<oui-dropdown-item text="Lorem ipsum" on-click="$ctrl.onButtonClick()"></oui-dropdown-item>
225+
<oui-dropdown-item text="Lorem ipsum" href="#"></oui-dropdown-item>
226+
</oui-dropdown-content>
227+
</oui-dropdown>
228+
`, {
229+
onLinkClick: onLinkClickSpy,
230+
onButtonClick: onButtonClickSpy
231+
});
232+
233+
$timeout.flush();
234+
const items = angular.element(element[0].querySelectorAll("oui-dropdown-item")).children();
235+
angular.element(items[0]).triggerHandler("click");
236+
angular.element(items[1]).triggerHandler("click");
237+
238+
expect(onLinkClickSpy).toHaveBeenCalled();
239+
expect(onButtonClickSpy).toHaveBeenCalled();
240+
});
215241
});
216242

217243
describe("Group", () => {

‎packages/oui-dropdown/src/item/dropdown-item.html‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,8 @@
1212
ng-if="::!!$ctrl.href"
1313
ng-href="{{::$ctrl.href}}"
1414
ng-attr-target="{{::$ctrl.linkTarget}}"
15-
ng-attr-rel="{{::$ctrl.linkRel}}">
15+
ng-attr-rel="{{::$ctrl.linkRel}}"
16+
ng-click="$ctrl.onClick()">
1617
<span ng-transclude>{{::$ctrl.text}}</span>
1718
<span ng-if="::$ctrl.external"
1819
class="oui-icon oui-icon-external_link"
@@ -23,6 +24,7 @@
2324
role="menuitem"
2425
ng-if="::!!$ctrl.state"
2526
ui-sref="{{::$ctrl.getFullSref()}}"
27+
ng-click="$ctrl.onClick()"
2628
ng-transclude>
2729
{{::$ctrl.text}}
2830
</a>

‎packages/oui-inline-adder/README.md‎

Lines changed: 168 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,168 @@
1+
# Inline adder
2+
3+
<component-status cx-design="complete" ux="rc"></component-status>
4+
5+
## Usage
6+
7+
### Basic
8+
9+
```html:preview
10+
<oui-inline-adder>
11+
<oui-inline-adder-row>
12+
<oui-inline-adder-field>
13+
<oui-field label="Field 1">
14+
<input type="text" class="oui-input" name="field1" ng-model="field1" required>
15+
</oui-field>
16+
</oui-inline-adder-field>
17+
<oui-inline-adder-field ng-hide="$ctrl.togglerLoading">
18+
<oui-field label="Field 2">
19+
<input type="text" class="oui-input" name="field2" ng-model="field2" required>
20+
</oui-field>
21+
</oui-inline-adder-field>
22+
</oui-inline-adder-row>
23+
</oui-inline-adder>
24+
```
25+
26+
### Multiple rows
27+
28+
```html:preview
29+
<oui-inline-adder>
30+
<oui-inline-adder-row>
31+
<oui-inline-adder-field>
32+
<oui-field label="Field 1">
33+
<input type="text" class="oui-input" name="field1" ng-model="field1" required>
34+
</oui-field>
35+
</oui-inline-adder-field>
36+
<oui-inline-adder-field>
37+
<oui-field label="Field 2">
38+
<input type="text" class="oui-input" name="field2" ng-model="field2">
39+
</oui-field>
40+
</oui-inline-adder-field>
41+
</oui-inline-adder-row>
42+
<oui-inline-adder-row>
43+
<oui-inline-adder-field>
44+
<oui-field label="Field 3">
45+
<input type="text" class="oui-input" name="field3" ng-model="field3" required>
46+
</oui-field>
47+
</oui-inline-adder-field>
48+
<oui-inline-adder-field>
49+
<oui-field label="Field 4">
50+
<input type="text" class="oui-input" name="field4" ng-model="field4">
51+
</oui-field>
52+
</oui-inline-adder-field>
53+
</oui-inline-adder-row>
54+
</oui-inline-adder>
55+
```
56+
57+
### Adaptive fields
58+
59+
**Note**: Fields with `adaptive` attribute will adapt their size to their content.
60+
61+
```html:preview
62+
<oui-inline-adder>
63+
<oui-inline-adder-row>
64+
<oui-inline-adder-field>
65+
<oui-field label="Field 1">
66+
<input type="text" class="oui-input" name="field1" ng-model="field1" required>
67+
</oui-field>
68+
</oui-inline-adder-field>
69+
<oui-inline-adder-field adaptive>
70+
<oui-field label="Field 2" size="m">
71+
<label class="oui-select">
72+
<select name="field2" ng-model="field2" class="oui-select__input" required>
73+
<option value="" disabled selected>Select the OS</option>
74+
<option value="freebsd">FreeBSD</option>
75+
<option value="linux">Linux</option>
76+
<option value="osx">OSX</option>
77+
<option value="windows">Windows</option>
78+
</select>
79+
<span class="oui-icon oui-icon-chevron-down" aria-hidden="true"></span>
80+
</label>
81+
</oui-field>
82+
</oui-inline-adder-field>
83+
<oui-inline-adder-field adaptive>
84+
<oui-field label="Field 3">
85+
<oui-numeric name="field3" model="field3"></oui-numeric>
86+
</oui-field>
87+
</oui-inline-adder-field>
88+
</oui-inline-adder-row>
89+
</oui-inline-adder>
90+
```
91+
92+
### Events
93+
94+
#### `on-add`
95+
96+
**Note**: If you want to access the form inside `on-add` callback, you need to use the `form` variable as below.
97+
98+
```html:preview
99+
<oui-inline-adder on-add="$ctrl.onAdd(form)">
100+
<oui-inline-adder-row>
101+
<oui-inline-adder-field>
102+
<oui-field label="Field 1">
103+
<input type="text" class="oui-input" name="field1" ng-model="field1" required>
104+
</oui-field>
105+
</oui-inline-adder-field>
106+
</oui-inline-adder-row>
107+
</oui-inline-adder>
108+
<div class="oui-doc-preview-only">
109+
<p>On Add</p>
110+
<pre class="oui-doc-code oui-doc-code_json">{{$ctrl.addedForm | json}}</pre>
111+
</div>
112+
```
113+
114+
#### `on-remove`
115+
116+
**Note**: If you want to access the form inside `on-remove` callback, you need to use the `form` variable as below.
117+
118+
```html:preview
119+
<oui-inline-adder on-remove="$ctrl.onRemove(form)">
120+
<oui-inline-adder-row>
121+
<oui-inline-adder-field>
122+
<oui-field label="Field 1">
123+
<input type="text" class="oui-input" name="field1" ng-model="field1" required>
124+
</oui-field>
125+
</oui-inline-adder-field>
126+
</oui-inline-adder-row>
127+
</oui-inline-adder>
128+
<div class="oui-doc-preview-only">
129+
<p>On Remove</p>
130+
<pre class="oui-doc-code oui-doc-code_json">{{$ctrl.removedForm | json}}</pre>
131+
</div>
132+
```
133+
134+
#### `on-change`
135+
136+
**Note**: If you want to access the forms array inside `on-change` callback, you need to use the `forms` variable as below.
137+
138+
```html:preview
139+
<oui-inline-adder on-change="$ctrl.onChange(forms)">
140+
<oui-inline-adder-row>
141+
<oui-inline-adder-field>
142+
<oui-field label="Field 1">
143+
<input type="text" class="oui-input" name="field1" ng-model="field1" required>
144+
</oui-field>
145+
</oui-inline-adder-field>
146+
</oui-inline-adder-row>
147+
</oui-inline-adder>
148+
<div class="oui-doc-preview-only">
149+
<p>On Change</p>
150+
<pre class="oui-doc-code oui-doc-code_json">{{$ctrl.changedForms | json}}</pre>
151+
</div>
152+
```
153+
154+
## API
155+
156+
### oui-inline-adder
157+
158+
| Attribute | Type | Binding | One-time binding | Values | Default | Description
159+
| ---- | ---- | ---- | ---- | ---- | ---- | ----
160+
| `on-add` | function | & | no | n/a | n/a | handler triggered when a row is added
161+
| `on-remove` | function | & | no | n/a | n/a | handler triggered when a row is removed
162+
| `on-change` | function | & | no | n/a | n/a | handler triggered when rows have changed
163+
164+
### oui-inline-adder-field
165+
166+
| Attribute | Type | Binding | One-time binding | Values | Default | Description
167+
| ---- | ---- | ---- | ---- | ---- | ---- | ----
168+
| `adaptive` | boolean | <? | yes | `true`, `false` | `false` | adaptive field flag

0 commit comments

Comments
 (0)