From 08d0841fb224b838691f05cd9e9db7245c7d3be5 Mon Sep 17 00:00:00 2001 From: Florian Renaut Date: Fri, 3 Aug 2018 14:57:41 +0200 Subject: [PATCH 01/28] feat(oui-datagrid): add selectable rows (#242) * feat(oui-datagrid): add global actions * feat(oui-datagrid): global actions code review changes * feat(oui-datagrid): add selectable-rows unit tests --- packages/oui-datagrid/README.md | 33 +++++++ .../oui-datagrid/src/cell/cell.component.js | 3 +- .../oui-datagrid/src/cell/cell.controller.js | 8 ++ .../oui-datagrid/src/datagrid.controller.js | 40 ++++++++- packages/oui-datagrid/src/datagrid.html | 28 ++++-- .../src/extra-top/extra-top.component.js | 3 + .../src/extra-top/extra-top.controller.js | 4 + packages/oui-datagrid/src/index.spec.js | 88 +++++++++++++++++++ 8 files changed, 199 insertions(+), 8 deletions(-) diff --git a/packages/oui-datagrid/README.md b/packages/oui-datagrid/README.md index a4efa896..d1fe6b50 100644 --- a/packages/oui-datagrid/README.md +++ b/packages/oui-datagrid/README.md @@ -91,6 +91,38 @@ Clicked row action 1: {{$ctrl.action1Row.lastName}}, {{$ctrl.action1Row.firstName}} ``` +### Selectable rows + +```html:preview + + + + + {{$row.parents.mother.lastName}}, {{$row.parents.mother.firstName}} + + + {{$row.parents.father.lastName}}, {{$row.parents.father.firstName}} + + + {{$ctrl.label}}: {{$value}} + + + + {{$value|date:short}} + + + {{ $isSelected }} + + + + + + +
You have selected {{ $selectedRows.length }} row(s).
+
+
+``` + ### Empty datagrid ```html:preview @@ -656,6 +688,7 @@ call `rows-loader` and then a `row-loader` call for each line. | `rows-loader` | function | &? | yes | | | gets all rows (returns a promise with all rows) | | `row-loader` | function | &? | yes | | | gets row details (returns a promise with details) | | `customizable` | boolean | this.datagridCtrl.selectedRows[this.index], (isSelected) => { + this.cellScope.$isSelected = isSelected || false; + }); } $onChanges (changes) { diff --git a/packages/oui-datagrid/src/datagrid.controller.js b/packages/oui-datagrid/src/datagrid.controller.js index 024c1b2d..4d1dde80 100644 --- a/packages/oui-datagrid/src/datagrid.controller.js +++ b/packages/oui-datagrid/src/datagrid.controller.js @@ -35,6 +35,8 @@ export default class DatagridController { this.columnElements = []; this.actionColumnElements = []; this.extraTopElements = []; + this.selectedRows = []; + this.selectAllRows = false; this.config = ouiDatagridConfiguration; @@ -69,6 +71,8 @@ export default class DatagridController { this.filterableColumns = []; this.criteria = []; + addBooleanParameter(this, "selectableRows"); + if (this.id) { this.ouiDatagridService.registerDatagrid(this); } @@ -103,7 +107,7 @@ export default class DatagridController { } // Manage responsiveness - if (this.hasActionMenu || this.customizable) { + if (this.hasActionMenu || this.customizable || this.selectableRows) { this.scrollablePanel = this.$element[0].querySelector(".oui-datagrid-responsive-container__overflow-container"); if (this.scrollablePanel) { angular.element(this.$window).on("resize", this.checkScroll); @@ -271,6 +275,9 @@ export default class DatagridController { this.displayedRows = DatagridController.createEmptyRows(this.paging.getCurrentPageSize()); } + this.selectedRows = this.selectedRows.map(() => false); + this.selectAllRows = false; + this.refreshDatagridPromise = this.$q.when((callback || angular.noop)()) .then(() => this.paging.loadData(skipSortAndFilter, forceLoadRows)) .then(result => { @@ -313,6 +320,37 @@ export default class DatagridController { }; } + getSelectedRows () { + return this.selectedRows.reduce((result, isSelected, index) => { + if (isSelected) { + result.push(this.displayedRows[index]); + } + return result; + }, []); + } + + toggleRowSelection (index, isSelected) { + const rowCount = this.displayedRows.length; + this.selectedRows[index] = isSelected; + const selectedRowsCount = this.getSelectedRows().length; + + if (selectedRowsCount === rowCount) { + this.selectAllRows = true; + } else if (selectedRowsCount === 0) { + this.selectAllRows = false; + } else { + this.selectAllRows = null; + } + } + + toggleAllRowsSelection (modelValue) { + if (modelValue === null) { + this.selectedRows = this.displayedRows.map(() => true); + } else { + this.selectedRows = this.displayedRows.map(() => modelValue); + } + } + static createEmptyRows (pageSize) { return Array(...{ length: pageSize }) .map(() => undefined); diff --git a/packages/oui-datagrid/src/datagrid.html b/packages/oui-datagrid/src/datagrid.html index 807c41ff..ea03452a 100644 --- a/packages/oui-datagrid/src/datagrid.html +++ b/packages/oui-datagrid/src/datagrid.html @@ -18,18 +18,25 @@ items="$ctrl.appliedCriteria">
+ + ng-repeat="row in $ctrl.displayedRows track by $index" + ng-init="rowIndex = $index"> + diff --git a/packages/oui-datagrid/src/extra-top/extra-top.component.js b/packages/oui-datagrid/src/extra-top/extra-top.component.js index 94100dc2..6adab478 100644 --- a/packages/oui-datagrid/src/extra-top/extra-top.component.js +++ b/packages/oui-datagrid/src/extra-top/extra-top.component.js @@ -4,5 +4,8 @@ export default { controller, require: { datagridCtrl: "^^ouiDatagrid" + }, + bindings: { + selectedItems: "<" } }; diff --git a/packages/oui-datagrid/src/extra-top/extra-top.controller.js b/packages/oui-datagrid/src/extra-top/extra-top.controller.js index 51809cc1..09eb4813 100644 --- a/packages/oui-datagrid/src/extra-top/extra-top.controller.js +++ b/packages/oui-datagrid/src/extra-top/extra-top.controller.js @@ -7,6 +7,10 @@ export default class { $postLink () { this.extraTopScope = this.datagridCtrl.getParentScope().$new(false); + this.extraTopScope.$selectedRows = []; + this.extraTopScope.$watchCollection(() => this.datagridCtrl.getSelectedRows(), (rows) => { + this.extraTopScope.$selectedRows = rows || []; + }); this._compileElement(); } diff --git a/packages/oui-datagrid/src/index.spec.js b/packages/oui-datagrid/src/index.spec.js index 51a9dfed..0af9c61f 100644 --- a/packages/oui-datagrid/src/index.spec.js +++ b/packages/oui-datagrid/src/index.spec.js @@ -417,6 +417,94 @@ describe("ouiDatagrid", () => { }); }); + describe("Selectable rows", () => { + + it("should toggle row selection", () => { + const element = TestUtils.compileTemplate(` + + + + `, { + rows: fakeData.slice(0, 5) + }); + const ctrl = element.controller("ouiDatagrid"); + + let selection = []; + ctrl.toggleRowSelection(0, true); + selection = ctrl.getSelectedRows(); + expect(selection.length).toBe(1); + expect(selection[0]).toEqual(fakeData[0]); + + ctrl.toggleRowSelection(0, false); + selection = ctrl.getSelectedRows(); + expect(selection.length).toBe(0); + }); + + it("should toggle all rows", () => { + const element = TestUtils.compileTemplate(` + + + + `, { + rows: fakeData.slice(0, 5) + }); + const ctrl = element.controller("ouiDatagrid"); + + let selection = []; + expect(ctrl.selectAllRows).toBe(false); + ctrl.toggleAllRowsSelection(true); + selection = ctrl.getSelectedRows(); + expect(selection.length).toBe(5); + + ctrl.toggleAllRowsSelection(false); + selection = ctrl.getSelectedRows(); + expect(selection.length).toBe(0); + }); + + it("should update global selection checkbox", () => { + const element = TestUtils.compileTemplate(` + + + + `, { + rows: fakeData.slice(0, 5) + }); + const ctrl = element.controller("ouiDatagrid"); + + expect(ctrl.selectAllRows).toBe(false); + ctrl.toggleRowSelection(0, true); + expect(ctrl.selectAllRows).toBe(null); + ctrl.toggleRowSelection(1, true); + ctrl.toggleRowSelection(2, true); + ctrl.toggleRowSelection(3, true); + expect(ctrl.selectAllRows).toBe(null); + ctrl.toggleRowSelection(4, true); + expect(ctrl.selectAllRows).toBe(true); + ctrl.toggleRowSelection(4, false); + expect(ctrl.selectAllRows).toBe(null); + ctrl.toggleRowSelection(0, false); + ctrl.toggleRowSelection(1, false); + ctrl.toggleRowSelection(2, false); + ctrl.toggleRowSelection(3, false); + expect(ctrl.selectAllRows).toBe(false); + }); + + it("should updates extra-top content", () => { + const element = TestUtils.compileTemplate(` + + + + {{ $selectedRows.length }} + `, { + rows: fakeData.slice(0, 5) + }); + const ctrl = element.controller("ouiDatagrid"); + ctrl.toggleAllRowsSelection(true); + element.scope().$apply(); + expect(element.find("oui-datagrid-extra-top").text()).toBe("5"); + }); + }); + describe("Remote rows", () => { let rowsLoaderSpy; From 3ca604a7f7a0d1b74fefcd51ab8808103f3b2687 Mon Sep 17 00:00:00 2001 From: Axel Peter Date: Tue, 31 Jul 2018 10:36:59 +0200 Subject: [PATCH 02/28] docs: add github files --- .github/CODEOWNERS | 1 + .github/CODE_OF_CONDUCT.md | 74 ++++++++++++++++++++++++++++++++ .github/ISSUE_TEMPLATE.md | 26 +++++++++++ .github/PULL_REQUEST_TEMPLATE.md | 27 ++++++++++++ 4 files changed, 128 insertions(+) create mode 100644 .github/CODEOWNERS create mode 100644 .github/CODE_OF_CONDUCT.md create mode 100644 .github/ISSUE_TEMPLATE.md create mode 100644 .github/PULL_REQUEST_TEMPLATE.md diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS new file mode 100644 index 00000000..bbe36932 --- /dev/null +++ b/.github/CODEOWNERS @@ -0,0 +1 @@ +@AxelPeter @FredericEspiau @euhmeuh @JeremyDec diff --git a/.github/CODE_OF_CONDUCT.md b/.github/CODE_OF_CONDUCT.md new file mode 100644 index 00000000..6270440b --- /dev/null +++ b/.github/CODE_OF_CONDUCT.md @@ -0,0 +1,74 @@ +# Contributor Covenant Code of Conduct + +## Our Pledge + +In the interest of fostering an open and welcoming environment, we as +contributors and maintainers pledge to making participation in our project and +our community a harassment-free experience for everyone, regardless of age, body +size, disability, ethnicity, gender identity and expression, level of experience, +nationality, personal appearance, race, religion, or sexual identity and +orientation. + +## Our Standards + +Examples of behavior that contributes to creating a positive environment +include: + +* Using welcoming and inclusive language +* Being respectful of differing viewpoints and experiences +* Gracefully accepting constructive criticism +* Focusing on what is best for the community +* Showing empathy towards other community members + +Examples of unacceptable behavior by participants include: + +* The use of sexualized language or imagery and unwelcome sexual attention or +advances +* Trolling, insulting/derogatory comments, and personal or political attacks +* Public or private harassment +* Publishing others' private information, such as a physical or electronic + address, without explicit permission +* Other conduct which could reasonably be considered inappropriate in a + professional setting + +## Our Responsibilities + +Project maintainers are responsible for clarifying the standards of acceptable +behavior and are expected to take appropriate and fair corrective action in +response to any instances of unacceptable behavior. + +Project maintainers have the right and responsibility to remove, edit, or +reject comments, commits, code, wiki edits, issues, and other contributions +that are not aligned to this Code of Conduct, or to ban temporarily or +permanently any contributor for other behaviors that they deem inappropriate, +threatening, offensive, or harmful. + +## Scope + +This Code of Conduct applies both within project spaces and in public spaces +when an individual is representing the project or its community. Examples of +representing a project or community include using an official project e-mail +address, posting via an official social media account, or acting as an appointed +representative at an online or offline event. Representation of a project may be +further defined and clarified by project maintainers. + +## Enforcement + +Instances of abusive, harassing, or otherwise unacceptable behavior may be +reported by contacting the project team at [github@ovh.net](mailto:github@ovh.net). All +complaints will be reviewed and investigated and will result in a response that +is deemed necessary and appropriate to the circumstances. The project team is +obligated to maintain confidentiality with regard to the reporter of an incident. +Further details of specific enforcement policies may be posted separately. + +Project maintainers who do not follow or enforce the Code of Conduct in good +faith may face temporary or permanent repercussions as determined by other +members of the project's leadership. + +## Attribution + +This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, +available at [http://contributor-covenant.org/version/1/4][version] + +[homepage]: http://contributor-covenant.org +[version]: http://contributor-covenant.org/version/1/4/ diff --git a/.github/ISSUE_TEMPLATE.md b/.github/ISSUE_TEMPLATE.md new file mode 100644 index 00000000..3b525a78 --- /dev/null +++ b/.github/ISSUE_TEMPLATE.md @@ -0,0 +1,26 @@ +### Description + + + + +### Steps to Reproduce + + +1. [First Step] +2. [Second Step] +3. [and so on...] + +**Expected behavior:** + + + +**Actual behavior:** + + + +**Reproduces how often:** + + +### Additional Information + + diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md new file mode 100644 index 00000000..efa64d37 --- /dev/null +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -0,0 +1,27 @@ +### Requirements + +* Filling out the template is required. Any pull request that does not include enough information to be reviewed in a timely manner may be closed at the maintainers' discretion. +* All new code requires tests to ensure against regressions + +## Title of the Pull Requests + + +### Description of the Change + + + + +### Benefits + + + + +### Possible Drawbacks + + + + +### Applicable Issues + + + From 0a05b22e031884a23ce9b46d04d09ebb69c43ee7 Mon Sep 17 00:00:00 2001 From: Axel Peter Date: Tue, 31 Jul 2018 10:38:15 +0200 Subject: [PATCH 03/28] chore: update dependencies --- package.json | 11 +++++------ yarn.lock | 12 ++++-------- 2 files changed, 9 insertions(+), 14 deletions(-) diff --git a/package.json b/package.json index b632e25d..32f12cd1 100644 --- a/package.json +++ b/package.json @@ -33,16 +33,16 @@ } }, "dependencies": { - "clipboard": "2.0.1", + "angular": "~1.6.1", + "angular-aria": "~1.6.1", + "angular-sanitize": "~1.6.1", + "clipboard": "^2.0.1", "escape-string-regexp": "^1.0.5", - "flatpickr": "4.5.0", + "flatpickr": "^4.5.1", "popper.js": "^1.14.3" }, "devDependencies": { - "angular": "~1.6.1", - "angular-aria": "~1.6.1", "angular-mocks": "~1.6.1", - "angular-sanitize": "~1.6.1", "autoprefixer": "^8.0.0", "babel-cli": "^6.18.0", "babel-core": "^6.21.0", @@ -54,7 +54,6 @@ "babel-preset-env": "^1.6.1", "babel-preset-stage-2": "^6.22.0", "babel-register": "^6.18.0", - "bootstrap": "^3.3.7", "cross-env": "^5.1.0", "css-loader": "^0.28.4", "eslint": "^4.3.0", diff --git a/yarn.lock b/yarn.lock index c5e931be..a0518649 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1380,10 +1380,6 @@ boom@5.x.x: dependencies: hoek "4.x.x" -bootstrap@^3.3.7: - version "3.3.7" - resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-3.3.7.tgz#5a389394549f23330875a3b150656574f8a9eb71" - brace-expansion@^1.1.7: version "1.1.11" resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd" @@ -1851,7 +1847,7 @@ cli-width@^2.0.0: version "2.2.0" resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-2.2.0.tgz#ff19ede8a9a5e579324147b0c11f0fbcbabed639" -clipboard@2.0.1: +clipboard@^2.0.1: version "2.0.1" resolved "https://registry.yarnpkg.com/clipboard/-/clipboard-2.0.1.tgz#a12481e1c13d8a50f5f036b0560fe5d16d74e46a" dependencies: @@ -3455,9 +3451,9 @@ flat-cache@^1.2.1: graceful-fs "^4.1.2" write "^0.2.1" -flatpickr@4.5.0: - version "4.5.0" - resolved "https://registry.yarnpkg.com/flatpickr/-/flatpickr-4.5.0.tgz#f72c7164a1c24e3ad419e3b2209d1a2d3604724a" +flatpickr@^4.5.1: + version "4.5.1" + resolved "https://registry.yarnpkg.com/flatpickr/-/flatpickr-4.5.1.tgz#f65eaf54c07538f87d6f68a67b03cf816d7fb82f" flatten@^1.0.2: version "1.0.2" From 1acc3ab2d1d392d9bb29225aa485e9527dd181e0 Mon Sep 17 00:00:00 2001 From: Axel Peter Date: Fri, 3 Aug 2018 13:47:29 +0200 Subject: [PATCH 04/28] fix: fix provider methods --- .../oui-criteria-adder/src/criteria-adder.provider.js | 6 ++++-- packages/oui-datagrid/src/datagrid.provider.js | 4 +++- packages/oui-field/src/field.provider.js | 4 +++- packages/oui-form-actions/src/form-actions.provider.js | 8 +++++++- packages/oui-pagination/src/pagination.provider.js | 6 ++++-- 5 files changed, 21 insertions(+), 7 deletions(-) diff --git a/packages/oui-criteria-adder/src/criteria-adder.provider.js b/packages/oui-criteria-adder/src/criteria-adder.provider.js index e420480e..8faeb81f 100644 --- a/packages/oui-criteria-adder/src/criteria-adder.provider.js +++ b/packages/oui-criteria-adder/src/criteria-adder.provider.js @@ -1,3 +1,5 @@ +import merge from "lodash/merge"; + export default class { constructor () { this.operatorsByType = { @@ -67,7 +69,7 @@ export default class { * @param {Object} operatorsByType a list of operators by type */ setOperatorsByType (operatorsByType) { - this.operatorsByType = operatorsByType; + this.operatorsByType = merge(this.operatorsByType, operatorsByType); return this; } @@ -76,7 +78,7 @@ export default class { * @param {Object} translations a map of translations */ setTranslations (translations) { - this.translations = translations; + this.translations = merge(this.translations, translations); return this; } diff --git a/packages/oui-datagrid/src/datagrid.provider.js b/packages/oui-datagrid/src/datagrid.provider.js index 78931b4f..e8dfa0ad 100644 --- a/packages/oui-datagrid/src/datagrid.provider.js +++ b/packages/oui-datagrid/src/datagrid.provider.js @@ -1,3 +1,5 @@ +import merge from "lodash/merge"; + export default class { constructor () { this.pageSize = 25; @@ -20,7 +22,7 @@ export default class { * @param {Object} translations a map of translations */ setTranslations (translations) { - this.translations = translations; + this.translations = merge(this.translations, translations); return this; } diff --git a/packages/oui-field/src/field.provider.js b/packages/oui-field/src/field.provider.js index 43ed5d55..ae4010cb 100644 --- a/packages/oui-field/src/field.provider.js +++ b/packages/oui-field/src/field.provider.js @@ -1,3 +1,5 @@ +import merge from "lodash/merge"; + export default class { constructor () { this.translations = { @@ -19,7 +21,7 @@ export default class { * @param {Object} translations a map of translations */ setTranslations (translations) { - this.translations = translations; + this.translations = merge(this.translations, translations); return this; } diff --git a/packages/oui-form-actions/src/form-actions.provider.js b/packages/oui-form-actions/src/form-actions.provider.js index c811a81f..0257070a 100644 --- a/packages/oui-form-actions/src/form-actions.provider.js +++ b/packages/oui-form-actions/src/form-actions.provider.js @@ -1,3 +1,5 @@ +import merge from "lodash/merge"; + export default class { constructor () { this.translations = { @@ -6,8 +8,12 @@ export default class { }; } + /** + * Set the translations + * @param {Object} translations a map of translations + */ setTranslations (translations) { - this.translations = translations; + this.translations = merge(this.translations, translations); return this; } diff --git a/packages/oui-pagination/src/pagination.provider.js b/packages/oui-pagination/src/pagination.provider.js index b6890789..802a149e 100644 --- a/packages/oui-pagination/src/pagination.provider.js +++ b/packages/oui-pagination/src/pagination.provider.js @@ -1,3 +1,5 @@ +import merge from "lodash/merge"; + export default class { constructor () { this.pageSize = 25; @@ -32,11 +34,11 @@ export default class { } /** - * Set the translations for the pagination component + * Set the translations * @param {Object} translations a map of translations */ setTranslations (translations) { - this.translations = translations; + this.translations = merge(this.translations, translations); return this; } From 0ce99da357cef8d15598f01b652082a22d30b83d Mon Sep 17 00:00:00 2001 From: Axel Peter Date: Fri, 3 Aug 2018 13:52:42 +0200 Subject: [PATCH 05/28] chore: update components --- packages/oui-angular/src/index.js | 82 ++++++++++--------- .../src/back-button.component.js | 8 +- packages/oui-button/src/button.component.js | 12 ++- packages/oui-button/src/button.controller.js | 14 +--- packages/oui-chips/src/chips.component.js | 2 - packages/oui-clipboard/src/clipboard.html | 2 +- .../src/collapsible.controller.js | 2 + .../src/criteria-adder.component.js | 2 - packages/oui-field/src/field.controller.js | 1 - 9 files changed, 57 insertions(+), 68 deletions(-) diff --git a/packages/oui-angular/src/index.js b/packages/oui-angular/src/index.js index f5987913..0c2c42ba 100644 --- a/packages/oui-angular/src/index.js +++ b/packages/oui-angular/src/index.js @@ -37,43 +37,45 @@ import Textarea from "@oui-angular/oui-textarea/src"; import Tile from "@oui-angular/oui-tile/src"; import Tooltip from "@oui-angular/oui-tooltip/src"; -angular.module("oui", [ - ActionMenu, - BackButton, - Button, - Calendar, - Checkbox, - Chips, - Clipboard, - Collapsible, - CriteriaAdder, - CriteriaContainer, - Datagrid, - Dropdown, - Field, - FormActions, - GuideMenu, - HeaderTabs, - Message, - Modal, - Navbar, - Numeric, - PageHeader, - Pagination, - Popover, - Progress, - Radio, - RadioGroup, - RadioToggleGroup, - Search, - Select, - SelectPicker, - Skeleton, - Slideshow, - Spinner, - Stepper, - Switch, - Textarea, - Tile, - Tooltip -]); +export default angular + .module("oui", [ + ActionMenu, + BackButton, + Button, + Calendar, + Checkbox, + Chips, + Clipboard, + Collapsible, + CriteriaAdder, + CriteriaContainer, + Datagrid, + Dropdown, + Field, + FormActions, + GuideMenu, + HeaderTabs, + Message, + Modal, + Navbar, + Numeric, + PageHeader, + Pagination, + Popover, + Progress, + Radio, + RadioGroup, + RadioToggleGroup, + Search, + Select, + SelectPicker, + Skeleton, + Slideshow, + Spinner, + Stepper, + Switch, + Textarea, + Tile, + Tooltip + ]) + .name; diff --git a/packages/oui-back-button/src/back-button.component.js b/packages/oui-back-button/src/back-button.component.js index aff90480..e3d2a867 100644 --- a/packages/oui-back-button/src/back-button.component.js +++ b/packages/oui-back-button/src/back-button.component.js @@ -7,13 +7,13 @@ export default { bindings: { id: "@?", name: "@?", + heading: "@?", // Deprecated: Replaced by transclude value + title: "@?", // Deprecated: Replaced by transclude value ariaLabel: "@?", - heading: "@?", - title: "@?", // Deprecated: Replaced by 'heading' - onClick: "&?", href: "@?", state: "@?", - stateParams: " From 6322998f352dbf3c90e6b4fc9c35f704497c0f4d Mon Sep 17 00:00:00 2001 From: Axel Peter Date: Fri, 3 Aug 2018 13:54:40 +0200 Subject: [PATCH 07/28] feat(oui-checkbox): add transclude support --- .../oui-checkbox/src/checkbox.component.js | 13 ++--- .../oui-checkbox/src/checkbox.controller.js | 1 + packages/oui-checkbox/src/checkbox.html | 51 ++++++++++--------- 3 files changed, 34 insertions(+), 31 deletions(-) diff --git a/packages/oui-checkbox/src/checkbox.component.js b/packages/oui-checkbox/src/checkbox.component.js index 984e83de..3663b59a 100644 --- a/packages/oui-checkbox/src/checkbox.component.js +++ b/packages/oui-checkbox/src/checkbox.component.js @@ -5,13 +5,14 @@ export default { template, controller, bindings: { - text: "@", - description: "@?", + model: "=?", id: "@?", name: "@?", - model: "=?", - onChange: "&?", + text: "@?", // Deprecated: Replaced by transclude value + description: "@?", disabled: " this.$element + .addClass("oui-checkbox") .removeAttr("id") .removeAttr("name") ); diff --git a/packages/oui-checkbox/src/checkbox.html b/packages/oui-checkbox/src/checkbox.html index 1ee3ae1a..fc1249ef 100644 --- a/packages/oui-checkbox/src/checkbox.html +++ b/packages/oui-checkbox/src/checkbox.html @@ -1,27 +1,28 @@ -
- -
+ + + From cb8b9ad1541bceff363bd6bc3d56293eb5e4a395 Mon Sep 17 00:00:00 2001 From: Axel Peter Date: Fri, 3 Aug 2018 13:55:30 +0200 Subject: [PATCH 08/28] fix(oui-form-actions): fix cancel button template --- .../oui-form-actions/src/form-actions.html | 31 +++++++++---------- packages/oui-form-actions/src/index.spec.js | 3 +- 2 files changed, 15 insertions(+), 19 deletions(-) diff --git a/packages/oui-form-actions/src/form-actions.html b/packages/oui-form-actions/src/form-actions.html index f9d731bb..48e1a666 100644 --- a/packages/oui-form-actions/src/form-actions.html +++ b/packages/oui-form-actions/src/form-actions.html @@ -1,20 +1,17 @@ - - -
+ diff --git a/packages/oui-form-actions/src/index.spec.js b/packages/oui-form-actions/src/index.spec.js index c416b192..e16ad21f 100644 --- a/packages/oui-form-actions/src/index.spec.js +++ b/packages/oui-form-actions/src/index.spec.js @@ -104,9 +104,8 @@ describe("ouiFormActions", () => { `); - const cancelButton = component.find("button").eq(1); - expect(cancelButton.hasClass("ng-hide")).toBe(true); + expect(component.find("button").length).toBe(1); }); it("should trigger click on submit button", () => { From 291cc101617b7d14c96fbf0b172515903a2cea49 Mon Sep 17 00:00:00 2001 From: Axel Peter Date: Fri, 3 Aug 2018 13:56:08 +0200 Subject: [PATCH 09/28] fix(oui-modal): fix modal template --- packages/oui-modal/src/modal.component.js | 10 ++-- packages/oui-modal/src/modal.controller.js | 12 ++++- packages/oui-modal/src/modal.html | 63 +++++++++++----------- 3 files changed, 47 insertions(+), 38 deletions(-) diff --git a/packages/oui-modal/src/modal.component.js b/packages/oui-modal/src/modal.component.js index 93f025b5..5a656647 100644 --- a/packages/oui-modal/src/modal.component.js +++ b/packages/oui-modal/src/modal.component.js @@ -7,13 +7,13 @@ export default { bindings: { heading: "@?", title: "@?", // Deprecated: Replaced by 'heading' - primaryAction: "&?", + type: "@?", + loading: " + this.$element + .addClass("oui-modal") + .addClass("oui-modal_shadow") + ); + } } diff --git a/packages/oui-modal/src/modal.html b/packages/oui-modal/src/modal.html index d4768cde..f374c115 100644 --- a/packages/oui-modal/src/modal.html +++ b/packages/oui-modal/src/modal.html @@ -1,41 +1,40 @@ -
-
- -
-
- +
+ -
- + aria-hidden="true"> + +
+

+ ng-if="::!!$ctrl.heading" + ng-bind="::$ctrl.heading">

-
- +
From 673e37287e68a9edd274d9fda7f2cfab2803d9e9 Mon Sep 17 00:00:00 2001 From: Axel Peter Date: Fri, 3 Aug 2018 13:57:07 +0200 Subject: [PATCH 10/28] fix(oui-numeric): fix attributes on template --- .../oui-numeric/src/numeric.controller.js | 31 +++++----- packages/oui-numeric/src/numeric.html | 56 +++++++++---------- 2 files changed, 44 insertions(+), 43 deletions(-) diff --git a/packages/oui-numeric/src/numeric.controller.js b/packages/oui-numeric/src/numeric.controller.js index 8d3ca2f3..198aa868 100644 --- a/packages/oui-numeric/src/numeric.controller.js +++ b/packages/oui-numeric/src/numeric.controller.js @@ -1,3 +1,4 @@ +import { addBooleanParameter, addDefaultParameter } from "@oui-angular/common/component-utils"; import clamp from "lodash/clamp"; // By design, value is restricted to [0, 99999] interval @@ -5,29 +6,19 @@ const MIN_VALUE = 0; const MAX_VALUE = 99999; export default class { - constructor ($attrs, $element, $log, $timeout) { + constructor ($attrs, $element, $log, $scope, $timeout) { "ngInject"; this.$attrs = $attrs; this.$element = $element; this.$log = $log; + this.$id = $scope.$id; this.$timeout = $timeout; } - $postLink () { - // Sometimes the digest cycle is done before dom manipulation, - // So we use $timeout to force the $apply - this.$timeout(() => - this.$element - .removeAttr("id") - .removeAttr("name") - ); - } - $onInit () { - if (!this.id) { - this.$log.warn("Missing required attribute id"); - } + addDefaultParameter(this, "id", `ouiNumeric${this.$id}`); + addBooleanParameter(this, "disabled"); if (!angular.isNumber(this.min)) { if (angular.isDefined(this.min)) { @@ -72,6 +63,18 @@ export default class { this.previousValue = this.model; } + $postLink () { + // Sometimes the digest cycle is done before dom manipulation, + // So we use $timeout to force the $apply + this.$timeout(() => + this.$element + .addClass("oui-input-group") + .addClass("oui-input-group_numeric") + .removeAttr("id") + .removeAttr("name") + ); + } + setModelValue (value) { // updates model and displayed value this.model = value; diff --git a/packages/oui-numeric/src/numeric.html b/packages/oui-numeric/src/numeric.html index cc8d7d64..feec2c47 100644 --- a/packages/oui-numeric/src/numeric.html +++ b/packages/oui-numeric/src/numeric.html @@ -1,29 +1,27 @@ -
- - - -
+ + + From d20ff03e7c53f1631acbded95edfb87bc3ad619f Mon Sep 17 00:00:00 2001 From: Axel Peter Date: Fri, 3 Aug 2018 13:57:53 +0200 Subject: [PATCH 11/28] feat(oui-progress): add transclude support --- packages/oui-progress/src/bar/progress-bar.component.js | 7 ++++--- packages/oui-progress/src/bar/progress-bar.html | 4 +--- packages/oui-progress/src/index.spec.js | 2 +- 3 files changed, 6 insertions(+), 7 deletions(-) diff --git a/packages/oui-progress/src/bar/progress-bar.component.js b/packages/oui-progress/src/bar/progress-bar.component.js index 66ba2fd0..64b26614 100644 --- a/packages/oui-progress/src/bar/progress-bar.component.js +++ b/packages/oui-progress/src/bar/progress-bar.component.js @@ -5,11 +5,12 @@ export default { template, controller, bindings: { + text: "@?", // Deprecated: Replaced by transclude value type: "@", - value: "<", - text: "@?" + value: "<" }, require: { progressCtrl: "^^ouiProgress" - } + }, + transclude: true }; diff --git a/packages/oui-progress/src/bar/progress-bar.html b/packages/oui-progress/src/bar/progress-bar.html index 9970e2a6..7455e93e 100644 --- a/packages/oui-progress/src/bar/progress-bar.html +++ b/packages/oui-progress/src/bar/progress-bar.html @@ -1,3 +1 @@ - - +{{$ctrl.value + '%'}} diff --git a/packages/oui-progress/src/index.spec.js b/packages/oui-progress/src/index.spec.js index 532b28de..77f6223f 100644 --- a/packages/oui-progress/src/index.spec.js +++ b/packages/oui-progress/src/index.spec.js @@ -132,7 +132,7 @@ describe("ouiProgress", () => { const text = `Progress: ${value}%`; const element = TestUtils.compileTemplate(` - + ${text} ` ); From edee9542ec4e19b89aab60e179893f8e41c23491 Mon Sep 17 00:00:00 2001 From: Axel Peter Date: Fri, 3 Aug 2018 13:58:18 +0200 Subject: [PATCH 12/28] feat(oui-radio): add transclude support --- packages/oui-radio/src/radio.component.js | 2 +- packages/oui-radio/src/radio.controller.js | 20 +++++++------- packages/oui-radio/src/radio.html | 32 ++++++++++------------ 3 files changed, 26 insertions(+), 28 deletions(-) diff --git a/packages/oui-radio/src/radio.component.js b/packages/oui-radio/src/radio.component.js index f1f0b8e4..56fd8e97 100644 --- a/packages/oui-radio/src/radio.component.js +++ b/packages/oui-radio/src/radio.component.js @@ -9,7 +9,7 @@ export default { template, controller, bindings: { - text: "@", + text: "@", // Deprecated: Replaced by transclude value value: "<", description: "@?", id: "@?", diff --git a/packages/oui-radio/src/radio.controller.js b/packages/oui-radio/src/radio.controller.js index 11678064..2ac975a4 100644 --- a/packages/oui-radio/src/radio.controller.js +++ b/packages/oui-radio/src/radio.controller.js @@ -10,16 +10,6 @@ export default class { this.$timeout = $timeout; } - $postLink () { - // Sometimes the digest cycle is done before dom manipulation, - // So we use $timeout to force the $apply - this.$timeout(() => - this.$element - .removeAttr("id") - .removeAttr("name") - ); - } - $onInit () { addBooleanParameter(this, "disabled"); addBooleanParameter(this, "thumbnail"); @@ -42,6 +32,16 @@ export default class { } } + $postLink () { + // Sometimes the digest cycle is done before dom manipulation, + // So we use $timeout to force the $apply + this.$timeout(() => + this.$element + .removeAttr("id") + .removeAttr("name") + ); + } + onRadioModelChange (event) { if (this.group) { this.group.setModelValue(event.modelValue); diff --git a/packages/oui-radio/src/radio.html b/packages/oui-radio/src/radio.html index 7d6fd875..0c71ee93 100644 --- a/packages/oui-radio/src/radio.html +++ b/packages/oui-radio/src/radio.html @@ -1,28 +1,26 @@ - -
-

Model value: {{$ctrl.simpleModel | json}}

+

Model value: {{$ctrl.simpleModel}}

``` ### Formatted text ```html:preview -
+
@@ -29,8 +33,8 @@ Donec vitae lobortis dui, at accumsan purus. Nullam porta leo purus, nec digniss ## API -| Attribute | Type | Binding | One-time Binding | Values | Default | Description -| ---- | ---- | ---- | ---- | ---- | ---- | ---- -| id | string | @? | true | | | id attribute of the input -| name | string | @? | true | | | name attribute of the input -| model | object | = | true | | | model bound to component +| Attribute | Type | Binding | One-time Binding | Values | Default | Description +| ---- | ---- | ---- | ---- | ---- | ---- | ---- +| `model` | object | = | no | n/a | n/a | model bound to component +| `id` | string | @? | yes | n/a | n/a | id attribute of the input +| `name` | string | @? | yes | n/a | n/a | name attribute of the input diff --git a/packages/oui-collapsible/README.md b/packages/oui-collapsible/README.md index 53ab64a6..1641c506 100644 --- a/packages/oui-collapsible/README.md +++ b/packages/oui-collapsible/README.md @@ -24,8 +24,8 @@ ### oui-collapsible -| Attribute | Type | Binding | One-time binding | Values | Default | Description -| ---- | ---- | ---- | ---- | ---- | ---- | ---- -| `heading` | string | @ | | | | collapsible heading -| `aria-label` | string | @? | yes | | | accessibility label -| `expanded` | boolean | { - ouiCriteriaAdderConfiguration.translations = { + ouiCriteriaAdderConfiguration.setOperatorsByType({ // default operatorsByType + "boolean": [ + "is", + "isNot" + ], + date: [ + "is", + "isAfter", + "isBefore" + ], + number: [ + "is", + "smaller", + "bigger" + ], + options: [ + "is", + "isNot" + ], + string: [ + "contains", + "containsNot", + "startsWith", + "endsWith", + "is", + "isNot" + ] + }); + ouiCriteriaAdderConfiguration.setTranslations({ // default translations column_label: "Column", operator_label: "Operator", - + operator_boolean_is: "is", operator_boolean_isNot: "is not", - + operator_string_contains: "contains", operator_string_containsNot: "does not contain", operator_string_startsWith: "starts with", operator_string_endsWith: "ends with", operator_string_is: "is", operator_string_isNot: "is not", - + operator_number_is: "is", operator_number_smaller: "is smaller than", operator_number_bigger: "is bigger than", - + operator_date_is: "is", operator_date_isBefore: "is before", operator_date_isAfter: "is after", - + operator_options_is: "is", operator_options_isNot: "is not", - + true_label: "Yes", false_label: "No", - + value_label: "Value", submit_label: "Add" - }; + }); }); ``` diff --git a/packages/oui-datagrid/README.md b/packages/oui-datagrid/README.md index d1fe6b50..319b04c0 100644 --- a/packages/oui-datagrid/README.md +++ b/packages/oui-datagrid/README.md @@ -680,17 +680,17 @@ call `rows-loader` and then a `row-loader` call for each line. ### oui-datagrid -| Attribute | Type | Binding | One-time binding | Values | Default | Description | -| ---- | ---- | ---- | ---- | ---- | ---- | ---- | -| `id` | string | @? | | | | id of the datagrid | -| `page-size` | number | @? | | | 25 | maximum number of rows to show on each pages | -| `rows` | array | Guide menu component. | Attribute | Type | Binding | One-time Binding | Values | Default | Description | ---- | ---- | ---- | ---- | ---- | ---- | ---- | `align` | string | @? | yes | `start`, `center`, `end` | `start` | modifier for alignment -| `arrow` | boolean | ``` - ## API -| Attribute | Type | Binding | One-time binding | Values | Default | Description | -| ---- | ---- | ---- | ---- | ---- | ---- | ---- | -| `error-messages` | object | { - ouiFieldConfiguration.translations = { + ouiFieldConfiguration.setTranslations({ // default translations errors: { required: "Mandatory.", number: "Invalid number.", @@ -268,6 +266,6 @@ angular.module("myModule", [ maxlength: "Too high ({{maxlength}} characters max).", pattern: "Invalid format." } - }; + }); }); ``` diff --git a/packages/oui-form-actions/README.md b/packages/oui-form-actions/README.md index 7670a310..a2be4a1e 100644 --- a/packages/oui-form-actions/README.md +++ b/packages/oui-form-actions/README.md @@ -7,53 +7,57 @@ ### Default ```html:preview - - + ``` +**Note**: Cancel button is hidden if there is no `href` or `on-cancel` attributes. ### Custom naming ```html:preview -
- - -
+ + ``` - ### on-submit and on-cancel events ```html:preview
- - -
Last action: {{ $ctrl.lastAction }}
-
-``` - -### on-submit only -```html:preview +

+ Last action: {{ $ctrl.lastAction }} +

+ on-submit="$ctrl.lastAction = 'submit'" + on-cancel="$ctrl.lastAction = 'cancel'"> +
``` -In accordance to guidelines, submit button must be always enabled. ## API -| Attribute | Type | Binding | One-time Binding | Values | Default | Description | -| ---- | ---- | ---- | ---- | ---- | ---- | ---- | -| on-submit | function | & | | | | submit handler | -| on-cancel | function | & | | | | cancel handler | -| submit-text | string | @? | true | | "Submit" | submit button text | -| cancel-text | string | @? | true | | "Cancel" | cancel button text | -| href | string | @? | true | | | link url on cancel | +| Attribute | Type | Binding | One-time Binding | Values | Default | Description +| ---- | ---- | ---- | ---- | ---- | ---- | ---- +| `submit-text` | string | @? | yes | n/a | `Submit` | submit button text +| `cancel-text` | string | @? | yes | n/a | `Cancel` | cancel button text +| `href` | string | @? | yes | n/a | n/a | link url on cancel +| `on-submit` | function | & | no | n/a | n/a | button submit click handler +| `on-cancel` | function | &? | no | n/a | n/a | button cancel click handler + +## Configuration + +The form actions can be globally configured with a provider. + +```js +angular.module("myModule", [ + "oui.form-actions" +]).config(ouiFormActionsConfiguration => { + ouiFormActionsConfiguration.setTranslations({ // default translations + submit: "Submit", + cancel: "Cancel" + }); +}); +``` diff --git a/packages/oui-guide-menu/README.md b/packages/oui-guide-menu/README.md index 7c1ab002..193a11b7 100644 --- a/packages/oui-guide-menu/README.md +++ b/packages/oui-guide-menu/README.md @@ -55,25 +55,25 @@ ### oui-guide-menu -| Attribute | Type | Binding | One-time Binding | Values | Default | Description -| ---- | ---- | ---- | ---- | ---- | ---- | ---- -| `text` | string | @ | yes | | | button guide text -| `aria-label` | string | @? | yes | | | accessibility label -| `align` | string | @? | yes | `start`,`center`,`end` | `end` | menu alignment +| Attribute | Type | Binding | One-time Binding | Values | Default | Description +| ---- | ---- | ---- | ---- | ---- | ---- | ---- +| `text` | string | @ | yes | n/a | n/a | button guide text +| `aria-label` | string | @? | yes | n/a | n/a | accessibility label +| `align` | string | @? | yes | `start`,`center`,`end` | `end` | menu alignment ### oui-guide-menu-item -| Attribute | Type | Binding | One-time binding | Values | Default | Description -| ---- | ---- | ---- | ---- | ---- | ---- | ---- -| `text` | string | @ | | | | button label -| `aria-label` | string | @? | | | | accessibility label -| `href` | string | @? | yes | | | hypertext link (link) -| `disabled` | boolean | - - - - - + + + + + ``` ### With dropdown ```html:preview - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + ``` @@ -42,22 +42,22 @@ ```html:preview - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + ``` @@ -65,22 +65,22 @@ ```html:preview - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + ``` @@ -88,23 +88,23 @@ ### oui-header-tabs-item -| Attribute | Type | Binding | One-time Binding | Values | Default | Description -| ---- | ---- | ---- | ---- | ---- | ---- | ---- -| `text` | string | @ | yes | | | display the menu item with this text -| `href` | string | @? | yes | | | href of the menu item -| `state` | string | @? | yes | | | state of the menu item -| `stateParams` | object | + model="$ctrl.size"> ``` @@ -18,11 +16,9 @@ ```html:preview + min="2" + max="8" + model="$ctrl.core"> ``` @@ -30,21 +26,19 @@ ```html:preview + model="$ctrl.foo" + disabled> ``` ## API -| Attribute | Type | Binding | One-time binding | Values | Default | Description | -| ---- | ---- | ---- | ---- | ---- | ---- | ---- | -| id | string | @? | true | | | id attribute of the input | -| name | string | @? | true | | | name attribute of the input | -| model | string | = | | | | model bound to component | -| min | integer | - - - - - - - - - - - - - + + + + + + + + + + + + + ``` ## API -| Attribute | Type | Binding | One-time Binding | Values | Default | Description | -| ---- | ---- | ---- | ---- | ---- | ---- | ---- | -| heading | string | @? | true | | | title of the header | -| description | string | @? | true | | | subtitle of the header | +| Attribute | Type | Binding | One-time Binding | Values | Default | Description +| ---- | ---- | ---- | ---- | ---- | ---- | ---- +| `heading` | string | @? | yes | n/a | n/a | title of the header +| `description` | string | @? | yes | n/a | n/a | subtitle of the header diff --git a/packages/oui-page-header/src/page-header.html b/packages/oui-page-header/src/page-header.html index 94847b7b..6ca3094a 100644 --- a/packages/oui-page-header/src/page-header.html +++ b/packages/oui-page-header/src/page-header.html @@ -1,16 +1,21 @@
-

+

+

+ ng-if="::!!$ctrl.description" + ng-bind="::$ctrl.description"> +
+ ng-if="$ctrl.transcludeGuide" + ng-transclude="guide"> +
+ ng-if="$ctrl.transcludeTabs" + ng-transclude="tabs"> +
diff --git a/packages/oui-pagination/README.md b/packages/oui-pagination/README.md index 25e67396..1e37f928 100644 --- a/packages/oui-pagination/README.md +++ b/packages/oui-pagination/README.md @@ -37,13 +37,13 @@ ## API -| Attribute | Type | Binding | One-time Binding | Values | Default | Description | -| ---- | ---- | ---- | ---- | ---- | ---- | ---- | -| `current-offset` | Number | < | no | | | offset of the current page first item | -| `page-size` | Number | - + - This is an awesome popover content. + This is an awesome popover content. - - + ``` ### All directions ```html:preview -
- - - This is an awesome popover content. - - - - - This is an awesome popover content. - - - - - This is an awesome popover content. - - - - - This is an awesome popover content. - -
+ + + This is an awesome popover content. + + + + + This is an awesome popover content. + + + + + This is an awesome popover content. + + + + + This is an awesome popover content. + ``` ### Alignments ```html:preview -
- - - This is an awesome popover content. - - - - - This is an awesome popover content. - -
+ + + This is an awesome popover content. + + + + + This is an awesome popover content. + ``` ### Help Popover ```html:preview -
- - - This is an awesome popover content. - -
+ + + This is an awesome popover content. + ``` ## API @@ -80,9 +72,9 @@ Availability: - Element -| Attribute | Type | Binding | Values | Default | Description | -| ---- | ---- | ---- | ---- | ---- | ---- | -| `placement` | string | @? | popper.js values | right | modifier for alignment | +| Attribute | Type | Binding | Values | Default | Description +| ---- | ---- | ---- | ---- | ---- | ---- +| `placement` | string | @? | See [Popper placements](https://popper.js.org/popper-documentation.html#Popper.placements) | `right` | modifier for alignment For placement values, see Popper.JS documentation (https://popper.js.org/popper-documentation.html#Popper.placements) diff --git a/packages/oui-progress/README.md b/packages/oui-progress/README.md index c639db5c..c8932616 100644 --- a/packages/oui-progress/README.md +++ b/packages/oui-progress/README.md @@ -60,8 +60,8 @@ ```html:preview + value="139"> + Installing components: 139/200 @@ -85,8 +85,8 @@ ```html:preview + value="$ctrl.progressData.value1"> + {{$ctrl.progressData.value1}}% complete @@ -104,8 +104,8 @@ + value="$ctrl.progressData.value4"> + {{$ctrl.progressData.value4}}% complete ``` @@ -114,21 +114,20 @@ ### oui-progress -| Attribute | Type | Binding | One-time binding | Values | default | Description -| ---- | ---- | ---- | ---- | ---- | ---- | ---- -| compact | Boolean | - - - + First + Second + Third ``` @@ -21,9 +21,9 @@ ```html:preview
- - - + First + Second + Third
``` @@ -33,19 +33,18 @@ ```html:preview
- - - + First + Second + Third
- -Last onChange value: {{ $ctrl.lastOnChangeValue }} +Last onChange value: {{ $ctrl.lastOnChangeValue }} ``` ## API -| Attribute | Type | Binding | One-time Binding | Values | Default | Description -| ---- | ---- | ---- | ---- | ---- | ---- | ---- -| name | string | @? | `true` | | | name attribute of the radio -| model | Object | =? | | | | current value of the radio -| on-change | function | & | | | | handler triggered when model has changed +| Attribute | Type | Binding | One-time Binding | Values | Default | Description +| ---- | ---- | ---- | ---- | ---- | ---- | ---- +| `model` | Object | =? | no | n/a | n/a | current value of the radio +| `name` | string | @? | yes | n/a | n/a | name attribute of the radio +| `on-change` | function | & | no | n/a | n/a | handler triggered when model has changed diff --git a/packages/oui-radio-toggle-group/README.md b/packages/oui-radio-toggle-group/README.md index f439ebfa..45c9d2ea 100644 --- a/packages/oui-radio-toggle-group/README.md +++ b/packages/oui-radio-toggle-group/README.md @@ -9,9 +9,9 @@ ```html:preview
- - - + First + Second + Third
``` @@ -21,9 +21,9 @@ ```html:preview
- - - + First + Second + Third
``` @@ -33,18 +33,18 @@ ```html:preview
- - - + First + Second + Third
-Last onChange value: {{ $ctrl.lastOnChangeValue }} +Last onChange value: {{ $ctrl.lastOnChangeValue }} ``` ## API -| Attribute | Type | Binding | One-time Binding | Values | Default | Description -| ---- | ---- | ---- | ---- | ---- | ---- | ---- -| name | string | @? | `true` | | | name attribute of the radio -| model | Object | =? | | | | current value of the radio -| on-change | function | & | | | | handler triggered when model has changed +| Attribute | Type | Binding | One-time Binding | Values | Default | Description +| ---- | ---- | ---- | ---- | ---- | ---- | ---- +| `model` | Object | =? | no | n/a | n/a | current value of the radio +| `name` | string | @? | yes | n/a | n/a | name attribute of the radio +| `on-change` | function | & | no | n/a | n/a | handler triggered when model has changed diff --git a/packages/oui-radio/README.md b/packages/oui-radio/README.md index a4d347c4..ce71b51a 100644 --- a/packages/oui-radio/README.md +++ b/packages/oui-radio/README.md @@ -8,74 +8,70 @@ ```html:preview
- - + Value A + + - + Value B + + + disabled> + Value C +
``` ### Description ```html:preview - - +Checked +Disabled ``` ### Thumbnail ```html:preview - - +Checked +Disabled ``` ### On change ```html:preview
- - + Value A + + + on-change="$ctrl.lastOnChangeValue = modelValue"> + Value B +
- -Last onChange value: {{ $ctrl.lastOnChangeValue }} +Last onChange value: {{ $ctrl.lastOnChangeValue }} ``` ## API -| Attribute | Type | Binding | One-time Binding | Values | Default | Description -| ---- | ---- | ---- | ---- | ---- | ---- | ---- -| text | string | @ | | | | radio text -| description | string | @? | | | | description text -| id | string | @? | `true` | | | id attribute of the radio -| name | string | @? | `true` | | | name attribute of the radio -| disabled | boolean | -``` - -## Examples - ### Basic ```html:preview @@ -30,18 +11,18 @@ ``` @@ -49,10 +30,10 @@ ### Description ```html:preview - - @@ -61,18 +42,18 @@ ### Sections ```html:preview - - Section 1 - Section 2 + Section 1 + Section 2 - - Section 1 - Section 2 + Section 1 + Section 2 ``` @@ -80,13 +61,13 @@ ```html:preview
- - - - - - - - - - - - + + + + + + + + + +
``` @@ -38,9 +38,9 @@ ```html:preview
- - - + + +
``` @@ -48,11 +48,11 @@ ```html:preview
- - - - - + + + + +
``` @@ -61,10 +61,10 @@
+ text="Introducing Ad-Sync, designed to help you synchronize your local Active Directory with your OVH Active Directory." + href="#" + label="Discover" + external>
@@ -74,21 +74,21 @@ ### oui-slideshow -| Attribute | Type | Binding | One-time Binding | Values | Default | Description | -| ---- | ---- | ---- | ---- | ---- | ---- | ---- | -| `on-dismiss` | function | & | | | | dismiss callback | -| `loading` | boolean | ### On change -**Note:** Model will not be refreshed until the `on-change` callback as not finished. If you want to access the new model inside the `on-change` callback you need to use the `modelValue` variable as below. +**Note**: Model will not be refreshed until the `on-change` callback as not finished. If you want to access the new model inside the `on-change` callback you need to use the `modelValue` variable as below. ```html:preview
@@ -58,11 +58,11 @@ model="false"> ## API -| Attribute | Type | Binding | One-time Binding | Values | Default | Description -| ---- | ---- | ---- | ---- | ---- | ---- | ---- -| disabled | boolean | +
- - + Button 1 + Button 2 Button 3 - - + Button 4 (disabled) + Button 5 (disabled) -
Button 1 clicked: {{$ctrl.click}}
``` @@ -59,14 +57,16 @@ ```html:preview
- +

+ +

Nulla ac dui a est varius eleifend nec vitae ipsum. Nunc venenatis luctus nisi quis pulvinar. Duis justo massa, mattis nec metus scelerisque, mattis tristique quam. Sed eget neque elementum, facilisis velit eget, iaculis lectus. Quisque at molestie justo. Ut tincidunt augue non tortor tincidunt facilisis. Donec ut lectus a leo porttitor eleifend. Morbi venenatis turpis eu rutrum consectetur. Sed auctor ligula at erat euismod, imperdiet posuere est feugiat. Quisque maximus ultricies risus sed varius.

@@ -77,28 +77,27 @@ ### oui-tile -| Attribute | Type | Binding | One-time Binding | Values | Default | Description | -| ---- | ---- | ---- | ---- | ---- | ---- | ---- | -| `heading` | string | @? | yes | | | tile title | -| `description` | string | @? | yes | | | tile description behind title | -| `loading` | boolean | Date: Fri, 3 Aug 2018 16:54:17 +0200 Subject: [PATCH 16/28] chore: code review --- .github/ISSUE_TEMPLATE.md | 18 ++++++++--------- .github/PULL_REQUEST_TEMPLATE.md | 4 ++-- packages/oui-back-button/src/back-button.html | 6 +++--- packages/oui-checkbox/README.md | 4 ++-- packages/oui-collapsible/src/collapsible.html | 2 +- packages/oui-dropdown/README.md | 2 +- .../src/trigger/dropdown-trigger.html | 2 +- packages/oui-field/README.md | 2 +- packages/oui-field/src/field.html | 2 +- packages/oui-field/src/index.spec.js | 2 +- packages/oui-message/src/message.html | 15 ++++++-------- .../src/notification/navbar-notification.html | 20 +++++++++---------- packages/oui-pagination/src/pagination.html | 6 +++--- packages/oui-search/src/search.html | 4 ++-- packages/oui-select/README.md | 2 +- .../oui-select/src/templates/choices.html | 2 +- packages/oui-select/src/templates/match.html | 4 ++-- packages/oui-switch/README.md | 2 +- 18 files changed, 48 insertions(+), 51 deletions(-) diff --git a/.github/ISSUE_TEMPLATE.md b/.github/ISSUE_TEMPLATE.md index 3b525a78..a2c61201 100644 --- a/.github/ISSUE_TEMPLATE.md +++ b/.github/ISSUE_TEMPLATE.md @@ -1,26 +1,26 @@ ### Description - + -### Steps to Reproduce +### Steps to reproduce 1. [First Step] 2. [Second Step] 3. [and so on...] -**Expected behavior:** +**Expected behavior**: - + -**Actual behavior:** +**Actual behavior**: -**Reproduces how often:** - +**Frequency**: + -### Additional Information +### Additional information - + diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md index efa64d37..decc978f 100644 --- a/.github/PULL_REQUEST_TEMPLATE.md +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -9,12 +9,12 @@ ### Description of the Change - + ### Benefits - + ### Possible Drawbacks diff --git a/packages/oui-back-button/src/back-button.html b/packages/oui-back-button/src/back-button.html index e02497da..29bf275f 100644 --- a/packages/oui-back-button/src/back-button.html +++ b/packages/oui-back-button/src/back-button.html @@ -5,7 +5,7 @@ ng-attr-id="{{:: $ctrl.id }}" ng-attr-name="{{:: $ctrl.name }}" ng-click="$ctrl.onBtnClick()"> - + - + - +

{{::$ctrl.heading}}

diff --git a/packages/oui-checkbox/README.md b/packages/oui-checkbox/README.md index b887c41b..b1d470c8 100644 --- a/packages/oui-checkbox/README.md +++ b/packages/oui-checkbox/README.md @@ -51,7 +51,7 @@ ### On change -**Note**: Model will not be refreshed until the `on-change` callback as not finished. If you want to access the new model inside the `on-change` callback you need to use the `modelValue` variable as below. +**Note**: Model will not be refreshed until the `on-change` callback hasn't returned. If you want to access the new model inside the `on-change` callback you need to use the `modelValue` variable as below. ```html:preview {{::$ctrl.heading}} - +
diff --git a/packages/oui-dropdown/README.md b/packages/oui-dropdown/README.md index 7a07f412..1843139e 100644 --- a/packages/oui-dropdown/README.md +++ b/packages/oui-dropdown/README.md @@ -163,7 +163,7 @@ Use `oui-dropdown-trigger` as a directive for custom trigger button ```html:preview diff --git a/packages/oui-dropdown/src/trigger/dropdown-trigger.html b/packages/oui-dropdown/src/trigger/dropdown-trigger.html index aec82cd8..f5df86fd 100644 --- a/packages/oui-dropdown/src/trigger/dropdown-trigger.html +++ b/packages/oui-dropdown/src/trigger/dropdown-trigger.html @@ -7,5 +7,5 @@ aria-haspopup="true" aria-expanded="false"> - + diff --git a/packages/oui-field/README.md b/packages/oui-field/README.md index 9579c2ab..f59a7227 100644 --- a/packages/oui-field/README.md +++ b/packages/oui-field/README.md @@ -165,7 +165,7 @@ - + diff --git a/packages/oui-field/src/field.html b/packages/oui-field/src/field.html index 9f8a460d..20b844ed 100644 --- a/packages/oui-field/src/field.html +++ b/packages/oui-field/src/field.html @@ -22,7 +22,7 @@
- + diff --git a/packages/oui-field/src/index.spec.js b/packages/oui-field/src/index.spec.js index f7ff759d..a4e0aa34 100644 --- a/packages/oui-field/src/index.spec.js +++ b/packages/oui-field/src/index.spec.js @@ -389,7 +389,7 @@ describe("ouiField", () => { - + `); diff --git a/packages/oui-message/src/message.html b/packages/oui-message/src/message.html index 023461e7..dd4b09cf 100644 --- a/packages/oui-message/src/message.html +++ b/packages/oui-message/src/message.html @@ -1,13 +1,10 @@
- - -
-
- + +
diff --git a/packages/oui-navbar/src/notification/navbar-notification.html b/packages/oui-navbar/src/notification/navbar-notification.html index 09925d08..b74f8b6f 100644 --- a/packages/oui-navbar/src/notification/navbar-notification.html +++ b/packages/oui-navbar/src/notification/navbar-notification.html @@ -10,7 +10,7 @@
  • - + - - + aria-hidden="true">
  • - +
    @@ -91,9 +91,9 @@
  • - +
    diff --git a/packages/oui-pagination/src/pagination.html b/packages/oui-pagination/src/pagination.html index 24b42bd6..db8204ed 100644 --- a/packages/oui-pagination/src/pagination.html +++ b/packages/oui-pagination/src/pagination.html @@ -32,7 +32,7 @@ ng-attr-aria-label="{{ ::$ctrl.translations.previousPage }}" ng-disabled="$ctrl.currentPage === 1" ng-click="$ctrl.onPageChange($ctrl.getCurrentPage() - 1)"> - +
  • + + +
    + + + + column="column" + index="rowIndex"> + column="$ctrl.actionColumn" + index="rowIndex">