diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-regular-screens_0_document_0_desktop.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-regular-screens_0_document_0_desktop.png new file mode 100644 index 0000000000..a06a16cf9f --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-regular-screens_0_document_0_desktop.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:9b4e537c199381dbfb2e84fcd1b35362a86078e488345da76b9a866c1348250b +size 436423 diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-regular-screens_0_document_1_tablet.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-regular-screens_0_document_1_tablet.png new file mode 100644 index 0000000000..3b3837611d --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-regular-screens_0_document_1_tablet.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:82188b2f7f7fcbc06ca8d274937c95c578b04a4ddf7071aeb575a3e4dd571a13 +size 417139 diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-regular-screens_0_document_2_mobile.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-regular-screens_0_document_2_mobile.png new file mode 100644 index 0000000000..7b7fd06457 --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-regular-screens_0_document_2_mobile.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:33af11d0ab2ba81871775f21aed3d9d5692d5a9ed526b54f4cc401b2acbede09 +size 139714 diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-retina-screens_0_document_0_desktop.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-retina-screens_0_document_0_desktop.png new file mode 100644 index 0000000000..a06a16cf9f --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-retina-screens_0_document_0_desktop.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:9b4e537c199381dbfb2e84fcd1b35362a86078e488345da76b9a866c1348250b +size 436423 diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-retina-screens_0_document_1_tablet.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-retina-screens_0_document_1_tablet.png new file mode 100644 index 0000000000..3b3837611d --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-retina-screens_0_document_1_tablet.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:82188b2f7f7fcbc06ca8d274937c95c578b04a4ddf7071aeb575a3e4dd571a13 +size 417139 diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-retina-screens_0_document_2_mobile.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-retina-screens_0_document_2_mobile.png new file mode 100644 index 0000000000..7b7fd06457 --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-image-for-retina-screens_0_document_2_mobile.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:33af11d0ab2ba81871775f21aed3d9d5692d5a9ed526b54f4cc401b2acbede09 +size 139714 diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-regular-screens_0_document_0_desktop.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-regular-screens_0_document_0_desktop.png new file mode 100644 index 0000000000..a06a16cf9f --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-regular-screens_0_document_0_desktop.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:9b4e537c199381dbfb2e84fcd1b35362a86078e488345da76b9a866c1348250b +size 436423 diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-regular-screens_0_document_1_tablet.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-regular-screens_0_document_1_tablet.png new file mode 100644 index 0000000000..3b3837611d --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-regular-screens_0_document_1_tablet.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:82188b2f7f7fcbc06ca8d274937c95c578b04a4ddf7071aeb575a3e4dd571a13 +size 417139 diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-regular-screens_0_document_2_mobile.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-regular-screens_0_document_2_mobile.png new file mode 100644 index 0000000000..7b7fd06457 --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-regular-screens_0_document_2_mobile.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:33af11d0ab2ba81871775f21aed3d9d5692d5a9ed526b54f4cc401b2acbede09 +size 139714 diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-retina-screens_0_document_0_desktop.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-retina-screens_0_document_0_desktop.png new file mode 100644 index 0000000000..a06a16cf9f --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-retina-screens_0_document_0_desktop.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:9b4e537c199381dbfb2e84fcd1b35362a86078e488345da76b9a866c1348250b +size 436423 diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-retina-screens_0_document_1_tablet.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-retina-screens_0_document_1_tablet.png new file mode 100644 index 0000000000..3b3837611d --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-retina-screens_0_document_1_tablet.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:82188b2f7f7fcbc06ca8d274937c95c578b04a4ddf7071aeb575a3e4dd571a13 +size 417139 diff --git a/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-retina-screens_0_document_2_mobile.png b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-retina-screens_0_document_2_mobile.png new file mode 100644 index 0000000000..7b7fd06457 --- /dev/null +++ b/backstop_data/bitmaps_reference/ds-vr-test__components_image_example-images-for-retina-screens_0_document_2_mobile.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:33af11d0ab2ba81871775f21aed3d9d5692d5a9ed526b54f4cc401b2acbede09 +size 139714 diff --git a/config/components.json b/config/components.json index 6ed1abf2c2..702a0d45b1 100644 --- a/config/components.json +++ b/config/components.json @@ -12,7 +12,7 @@ "icon": { "macroName": "onsIcon" }, - "images": { + "image": { "macroName": "onsImage" }, "list": { diff --git a/src/components/images/_images.scss b/src/components/image/_image.scss similarity index 100% rename from src/components/images/_images.scss rename to src/components/image/_image.scss diff --git a/src/components/images/_macro-options.md b/src/components/image/_macro-options.md similarity index 100% rename from src/components/images/_macro-options.md rename to src/components/image/_macro-options.md diff --git a/src/components/images/_macro.njk b/src/components/image/_macro.njk similarity index 100% rename from src/components/images/_macro.njk rename to src/components/image/_macro.njk diff --git a/src/components/images/_macro.spec.js b/src/components/image/_macro.spec.js similarity index 76% rename from src/components/images/_macro.spec.js rename to src/components/image/_macro.spec.js index 091c40c9f3..6bf0cc63b4 100644 --- a/src/components/images/_macro.spec.js +++ b/src/components/image/_macro.spec.js @@ -16,16 +16,16 @@ const EXAMPLE_IMAGE_IMAGE_MINIMAL = { }, }; -describe('macro: images', () => { +describe('macro: image', () => { it('outputs a `figure` element', () => { - const $ = cheerio.load(renderComponent('images', EXAMPLE_IMAGE_URL_MINIMAL)); + const $ = cheerio.load(renderComponent('image', EXAMPLE_IMAGE_URL_MINIMAL)); expect($('.ons-figure')[0].tagName).toBe('figure'); }); it('outputs a `figurecaption` element when `caption` is provided', () => { const $ = cheerio.load( - renderComponent('images', { + renderComponent('image', { ...EXAMPLE_IMAGE_URL_MINIMAL, caption: 'Example image caption', }), @@ -36,7 +36,7 @@ describe('macro: images', () => { it('outputs a `figurecaption` element with provided `caption` text', () => { const $ = cheerio.load( - renderComponent('images', { + renderComponent('image', { ...EXAMPLE_IMAGE_URL_MINIMAL, caption: 'Example image caption', }), @@ -51,27 +51,27 @@ describe('macro: images', () => { describe('mode: url', () => { it('passes jest-axe checks', async () => { - const $ = cheerio.load(renderComponent('images', EXAMPLE_IMAGE_URL_MINIMAL)); + const $ = cheerio.load(renderComponent('image', EXAMPLE_IMAGE_URL_MINIMAL)); const results = await axe($.html()); expect(results).toHaveNoViolations(); }); it('outputs an `img` element', () => { - const $ = cheerio.load(renderComponent('images', EXAMPLE_IMAGE_URL_MINIMAL)); + const $ = cheerio.load(renderComponent('image', EXAMPLE_IMAGE_URL_MINIMAL)); expect($('.ons-figure__image')[0].tagName).toBe('img'); }); it('outputs an `img` element with the expected `src`', () => { - const $ = cheerio.load(renderComponent('images', EXAMPLE_IMAGE_URL_MINIMAL)); + const $ = cheerio.load(renderComponent('image', EXAMPLE_IMAGE_URL_MINIMAL)); expect($('.ons-figure__image').attr('src')).toBe('example.png'); }); it('outputs an `img` element with the expected alt text', () => { const $ = cheerio.load( - renderComponent('images', { + renderComponent('image', { ...EXAMPLE_IMAGE_URL_MINIMAL, alt: 'Example alt text', }), @@ -83,33 +83,33 @@ describe('macro: images', () => { describe('mode: image', () => { it('passes jest-axe checks', async () => { - const $ = cheerio.load(renderComponent('images', EXAMPLE_IMAGE_IMAGE_MINIMAL)); + const $ = cheerio.load(renderComponent('image', EXAMPLE_IMAGE_IMAGE_MINIMAL)); const results = await axe($.html()); expect(results).toHaveNoViolations(); }); it('outputs an `img` element', () => { - const $ = cheerio.load(renderComponent('images', EXAMPLE_IMAGE_IMAGE_MINIMAL)); + const $ = cheerio.load(renderComponent('image', EXAMPLE_IMAGE_IMAGE_MINIMAL)); expect($('.ons-figure__image')[0].tagName).toBe('img'); }); it('outputs an `img` element with the expected `srcset`', () => { - const $ = cheerio.load(renderComponent('images', EXAMPLE_IMAGE_IMAGE_MINIMAL)); + const $ = cheerio.load(renderComponent('image', EXAMPLE_IMAGE_IMAGE_MINIMAL)); expect($('.ons-figure__image').attr('srcset')).toBe('example-small.png 1x, example-large.png 2x'); }); it('outputs an `img` element with the expected `src`', () => { - const $ = cheerio.load(renderComponent('images', EXAMPLE_IMAGE_IMAGE_MINIMAL)); + const $ = cheerio.load(renderComponent('image', EXAMPLE_IMAGE_IMAGE_MINIMAL)); expect($('.ons-figure__image').attr('src')).toBe('example-small.png'); }); it('outputs an `img` element with the expected alt text', () => { const $ = cheerio.load( - renderComponent('images', { + renderComponent('image', { ...EXAMPLE_IMAGE_IMAGE_MINIMAL, alt: 'Example alt text', }), diff --git a/src/components/images/example-images-for-regular-screens.njk b/src/components/image/example-image-for-regular-screens.njk similarity index 79% rename from src/components/images/example-images-for-regular-screens.njk rename to src/components/image/example-image-for-regular-screens.njk index a8831c3fd1..3fc8484b45 100644 --- a/src/components/images/example-images-for-regular-screens.njk +++ b/src/components/image/example-image-for-regular-screens.njk @@ -1,4 +1,4 @@ -{% from "components/images/_macro.njk" import onsImage %} +{% from "components/image/_macro.njk" import onsImage %} {{ onsImage({ "url": '/img/small/woman-in-purple-dress-shirt.jpg', diff --git a/src/components/images/example-images-for-retina-screens.njk b/src/components/image/example-image-for-retina-screens.njk similarity index 82% rename from src/components/images/example-images-for-retina-screens.njk rename to src/components/image/example-image-for-retina-screens.njk index eab29f8ae5..ef4d6e3943 100644 --- a/src/components/images/example-images-for-retina-screens.njk +++ b/src/components/image/example-image-for-retina-screens.njk @@ -1,4 +1,4 @@ -{% from "components/images/_macro.njk" import onsImage %} +{% from "components/image/_macro.njk" import onsImage %} {{ onsImage({ "image": { diff --git a/src/components/message/_macro-options.md b/src/components/message/_macro-options.md index 6c8ad88d87..80bde186e7 100644 --- a/src/components/message/_macro-options.md +++ b/src/components/message/_macro-options.md @@ -2,7 +2,6 @@ | -------------- | ------ | -------- | ---------------------------------------------------------------------- | | type | string | true | Set to “sent” or “received” to style message type | | id | string | false | The HTML `id` of the message header metadata element | -| name | string | false | The HTML `name` attribute for the message header metadata element | | fromLabel | string | true | Label for the “From” prefix in the message header metadata element | | fromValue | string | true | Value of the “From” sender name in the message header metadata element | | fromId | string | false | The HTML `id` of the `fromValue` element | @@ -15,4 +14,3 @@ | unreadLink | string | false | The URL for the “Mark unread” link element’s `href` attribute | | unreadLinkId | string | false | The HTML `id` of the “Mark unread” link element | | messageID | string | false | The HTML `id` of the message body | -| messageName | string | false | The HTML `name` attribute of the message body | diff --git a/src/components/message/_macro.njk b/src/components/message/_macro.njk index a1de2762d3..b70e26e02d 100644 --- a/src/components/message/_macro.njk +++ b/src/components/message/_macro.njk @@ -1,7 +1,7 @@ {%- macro onsMessage(params) -%}
-
+
{{ params.fromLabel }}:
{{ params.fromValue }}
@@ -15,7 +15,7 @@ {{ params.unreadLinkText }} {% endif %}
-
+
{{ caller() }}
diff --git a/src/components/message/_macro.spec.js b/src/components/message/_macro.spec.js index b2e00ef9b6..fecfb6f5e2 100644 --- a/src/components/message/_macro.spec.js +++ b/src/components/message/_macro.spec.js @@ -18,7 +18,6 @@ const EXAMPLE_MESSAGE = { unreadLink: 'https://example.com/message/1', unreadLinkText: 'Unread message', id: 'message1', - name: 'example-message-1', fromId: 'from1', sentId: 'sent1', unreadLinkId: 'unreadLink1', diff --git a/src/components/pagination/_macro-options.md b/src/components/pagination/_macro-options.md index 714ebd41a3..f7ef495dc3 100644 --- a/src/components/pagination/_macro-options.md +++ b/src/components/pagination/_macro-options.md @@ -5,10 +5,10 @@ | next | string | true | Text label for the “Next” link | | classes | string | false | Classes to add to the pagination HTML `nav` element | | hideRangeIndicator | boolean | false | Set to “true” to hide the range indicator on viewports ≥ 740px | +| currentPageNumber | integer | true | Sets the current page number | ## Page -| Name | Type | Required | Description | -| ------- | ------- | -------- | ------------------------------------------------------- | -| url | string | true | The URL for the HTML `href` attribute for the page link | -| current | boolean | false | Set to “true” for the current loaded page link | +| Name | Type | Required | Description | +| ---- | ------ | -------- | ------------------------------------------------------- | +| url | string | true | The URL for the HTML `href` attribute for the page link | diff --git a/src/components/pagination/_macro.njk b/src/components/pagination/_macro.njk index 5376a4098a..d66255ac4a 100644 --- a/src/components/pagination/_macro.njk +++ b/src/components/pagination/_macro.njk @@ -1,72 +1,68 @@ {% macro onsPagination(params) %} - {% set currentPageIndex = "" %} - {% for page in params.pages %} - {% if page.current %} - {% set currentPageIndex = loop.index %} - {% endif %} - {% endfor %} + {% set currentPageIndex = params.currentPageNumber|int %} + {% set totalPages = params.pages | length|int %} + {% set position = "Page " ~ currentPageIndex ~ " of " ~ totalPages %} + {% set lastPage = params.pages | last %} + {% set firstPage = params.pages | first %} + {% set prevPageIndex = currentPageIndex - 1 %} + {% set nextPageIndex = currentPageIndex + 1 %} - {% set totalPages = params.pages | length %} - {% set position = "Page " + currentPageIndex + " of " + totalPages %} - {% set lastPage = params.pages | last %} - {% set firstPage = params.pages | first %} - - + {% endmacro %} diff --git a/src/components/pagination/_macro.spec.js b/src/components/pagination/_macro.spec.js index d25a462799..53aa7800e5 100644 --- a/src/components/pagination/_macro.spec.js +++ b/src/components/pagination/_macro.spec.js @@ -12,7 +12,8 @@ const PAGINATION_PREV_NEXT_LABELS = { const EXAMPLE_PAGINATION_MINIMAL = { ...PAGINATION_PREV_NEXT_LABELS, - pages: [{ url: '/page/1', current: true }], + currentPageNumber: 1, + pages: [{ url: '/page/1' }], }; describe('macro: pagination', () => { @@ -54,7 +55,8 @@ describe('macro: pagination', () => { const $ = cheerio.load( renderComponent('pagination', { ...PAGINATION_PREV_NEXT_LABELS, - pages: [{ url: '/page/1', current: true }], + currentPageNumber: 1, + pages: [{ url: '/page/1' }], }), ); @@ -85,7 +87,8 @@ describe('macro: pagination', () => { const $ = cheerio.load( renderComponent('pagination', { ...PAGINATION_PREV_NEXT_LABELS, - pages: [{ url: '/page/1', current: true }, { url: '/page/2' }], + currentPageNumber: 1, + pages: [{ url: '/page/1' }, { url: '/page/2' }], }), ); @@ -118,7 +121,8 @@ describe('macro: pagination', () => { const $ = cheerio.load( renderComponent('pagination', { ...PAGINATION_PREV_NEXT_LABELS, - pages: [{ url: '/page/1' }, { url: '/page/2', current: true }], + currentPageNumber: 2, + pages: [{ url: '/page/1' }, { url: '/page/2' }], }), ); @@ -151,7 +155,8 @@ describe('macro: pagination', () => { const $ = cheerio.load( renderComponent('pagination', { ...PAGINATION_PREV_NEXT_LABELS, - pages: [{ url: '/page/1' }, { url: '/page/2', current: true }, { url: '/page/3' }], + currentPageNumber: 2, + pages: [{ url: '/page/1' }, { url: '/page/2' }, { url: '/page/3' }], }), ); @@ -186,7 +191,8 @@ describe('macro: pagination', () => { const $ = cheerio.load( renderComponent('pagination', { ...PAGINATION_PREV_NEXT_LABELS, - pages: [{ url: '/page/1' }, { url: '/page/2', current: true }, { url: '/page/3' }, { url: '/page/4' }, { url: '/page/5' }], + currentPageNumber: 2, + pages: [{ url: '/page/1' }, { url: '/page/2' }, { url: '/page/3' }, { url: '/page/4' }, { url: '/page/5' }], }), ); @@ -223,14 +229,8 @@ describe('macro: pagination', () => { const $ = cheerio.load( renderComponent('pagination', { ...PAGINATION_PREV_NEXT_LABELS, - pages: [ - { url: '/page/1' }, - { url: '/page/2', current: true }, - { url: '/page/3' }, - { url: '/page/4' }, - { url: '/page/5' }, - { url: '/page/6' }, - ], + currentPageNumber: 2, + pages: [{ url: '/page/1' }, { url: '/page/2' }, { url: '/page/3' }, { url: '/page/4' }, { url: '/page/5' }, { url: '/page/6' }], }), ); @@ -267,12 +267,13 @@ describe('macro: pagination', () => { const $ = cheerio.load( renderComponent('pagination', { ...PAGINATION_PREV_NEXT_LABELS, + currentPageNumber: 5, pages: [ { url: '/page/1' }, { url: '/page/2' }, { url: '/page/3' }, { url: '/page/4' }, - { url: '/page/5', current: true }, + { url: '/page/5' }, { url: '/page/6' }, { url: '/page/7' }, { url: '/page/8' }, @@ -318,6 +319,7 @@ describe('macro: pagination', () => { const $ = cheerio.load( renderComponent('pagination', { ...PAGINATION_PREV_NEXT_LABELS, + currentPageNumber: 10, pages: [ { url: '/page/1' }, { url: '/page/2' }, @@ -328,7 +330,7 @@ describe('macro: pagination', () => { { url: '/page/7' }, { url: '/page/8' }, { url: '/page/9' }, - { url: '/page/10', current: true }, + { url: '/page/10' }, { url: '/page/11' }, ], }), diff --git a/src/components/pagination/example-pagination-first.njk b/src/components/pagination/example-pagination-first.njk index f3a1019f2b..6edb64a423 100644 --- a/src/components/pagination/example-pagination-first.njk +++ b/src/components/pagination/example-pagination-first.njk @@ -5,19 +5,19 @@ "previous": "Previous", "next": "Next", "hideRangeIndicator": true, + "currentPageNumber": 1, "pages": [ { - "url": "#page1", - "current": true + "url": "#0" }, { - "url": "#page2" + "url": "#0" }, { - "url": "#page3" + "url": "#0" }, { - "url": "#page4" + "url": "#0" } ] }) diff --git a/src/components/pagination/example-pagination-last.njk b/src/components/pagination/example-pagination-last.njk index 6d5671cd94..929e0b0748 100644 --- a/src/components/pagination/example-pagination-last.njk +++ b/src/components/pagination/example-pagination-last.njk @@ -5,19 +5,19 @@ "previous": "Previous", "next": "Next", "hideRangeIndicator": true, + "currentPageNumber": 4, "pages": [ { - "url": "#page1" + "url": "#0" }, { - "url": "#page2" + "url": "#0" }, { - "url": "#page3" + "url": "#0" }, { - "url": "#page4", - "current": true + "url": "#0" } ] }) diff --git a/src/components/pagination/example-pagination-with-no-range-indicator.njk b/src/components/pagination/example-pagination-with-no-range-indicator.njk index d2bae72926..888d250abb 100644 --- a/src/components/pagination/example-pagination-with-no-range-indicator.njk +++ b/src/components/pagination/example-pagination-with-no-range-indicator.njk @@ -5,37 +5,37 @@ "previous": "Previous", "next": "Next", "hideRangeIndicator": true, + "currentPageNumber": 5, "pages": [ { - "url": "#page1" + "url": "#0" }, { - "url": "#page2" + "url": "#0" }, { - "url": "#page3" + "url": "#0" }, { - "url": "#page4" + "url": "#0" }, { - "url": "#page5", - "current": true + "url": "#0" }, { - "url": "#page6" + "url": "#0" }, { - "url": "#page7" + "url": "#0" }, { - "url": "#page8" + "url": "#0" }, { - "url": "#page9" + "url": "#0" }, { - "url": "#page10" + "url": "#0" } ] }) diff --git a/src/components/pagination/example-pagination.njk b/src/components/pagination/example-pagination.njk index 1db700d605..ebd3e75efd 100644 --- a/src/components/pagination/example-pagination.njk +++ b/src/components/pagination/example-pagination.njk @@ -4,6 +4,7 @@ onsPagination({ "previous": "Previous", "next": "Next", + "currentPageNumber": 5, "pages": [ { "url": "#0" @@ -18,8 +19,7 @@ "url": "#0" }, { - "url": "#0", - "current": true + "url": "#0" }, { "url": "#0" diff --git a/src/components/table/_macro-options.md b/src/components/table/_macro-options.md index 34520714fb..8325cea2f4 100644 --- a/src/components/table/_macro-options.md +++ b/src/components/table/_macro-options.md @@ -28,7 +28,6 @@ | --------- | ----------- | -------- | --------------------------------------------------- | | tds | Array`` | true | An array of `td` [cell elements](#td) for each `tr` | | id | string | false | The HTML `id` of the `tr` element | -| name | string | false | The HTML `name` attribute for the `tr` element | | highlight | boolean | false | Set to “true” to highlight the row | ## td @@ -37,7 +36,6 @@ | --------- | -------------- | ------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------- | | tdClasses | string | false | Classes to add to the `td` element | | id | string | false | The HTML `id` of the `td` element | -| name | string | false | The HTML `name` attribute for the `td` element | | data | string | false (unless “responsive” variant is set) | Set to the corresponding `th` header cell when using the “responsive” variant | | dataSort | integer | false | Set the numerical order of a table cell in a column when using the “sortable” variant | | value | string | false | The content for the `td` cell | diff --git a/src/components/table/_macro.njk b/src/components/table/_macro.njk index 96511e9bbb..03bc65eef0 100644 --- a/src/components/table/_macro.njk +++ b/src/components/table/_macro.njk @@ -32,9 +32,9 @@ {% for tr in params.trs %} - + {% for td in tr.tds %} - + {% if td.form %}
{{ diff --git a/src/components/table/example-table-basic.njk b/src/components/table/example-table-basic.njk index 7a89c688ce..d74beab74a 100644 --- a/src/components/table/example-table-basic.njk +++ b/src/components/table/example-table-basic.njk @@ -18,8 +18,7 @@ { "tds": [ { - "value": "Cell A1", - "name": "cell-name" + "value": "Cell A1" }, { "value": "Cell B1" diff --git a/src/components/tabs/_macro.njk b/src/components/tabs/_macro.njk index a1ff4694b3..d6c97441f8 100644 --- a/src/components/tabs/_macro.njk +++ b/src/components/tabs/_macro.njk @@ -15,12 +15,12 @@ {% for tab in params.tabs %} -
+
{{ tab.content | safe }}
{% endfor %} diff --git a/src/components/tabs/_macro.spec.js b/src/components/tabs/_macro.spec.js index abdf3c578c..dff4c20f7d 100644 --- a/src/components/tabs/_macro.spec.js +++ b/src/components/tabs/_macro.spec.js @@ -88,8 +88,8 @@ describe('macro: tabs', () => { it('has default tab id attribute values when identifiers are not provided', () => { const $ = cheerio.load(renderComponent('tabs', EXAMPLE_TABS_WITHOUT_TAB_IDS)); - expect($('.ons-tabs__panel:first').attr('id')).toBe('tabId1'); - expect($('.ons-tabs__panel:last').attr('id')).toBe('tabId2'); + expect($('.ons-tabs__panel:first').attr('id')).toBe('tab-1'); + expect($('.ons-tabs__panel:last').attr('id')).toBe('tab-2'); }); it('has expected label text in tab links and visually hidden span in tab 1', () => { diff --git a/src/patterns/news/example-article.njk b/src/patterns/news/example-article.njk index ac625440c2..e5d4b57880 100644 --- a/src/patterns/news/example-article.njk +++ b/src/patterns/news/example-article.njk @@ -4,7 +4,7 @@ layout: ~ --- {% extends "layout/_template.njk" %} {% from "components/list/_macro.njk" import onsList %} -{% from "components/images/_macro.njk" import onsImage %} +{% from "components/image/_macro.njk" import onsImage %} {% from "components/related-content/_macro.njk" import onsRelatedContent %} {% from "components/share-page/_macro.njk" import onsSharePage %} {% from "components/content-pagination/_macro.njk" import onsContentPagination %} diff --git a/src/patterns/news/example-category.njk b/src/patterns/news/example-category.njk index 36dcec6af3..0ec3602cd3 100644 --- a/src/patterns/news/example-category.njk +++ b/src/patterns/news/example-category.njk @@ -140,10 +140,10 @@ layout: ~ onsPagination({ "previous": "Previous", "next": "Next", + "currentPageNumber": 1, "pages": [ { - "url": "#0", - "current": true + "url": "#0" }, { "url": "#0" diff --git a/src/patterns/news/example-landing.njk b/src/patterns/news/example-landing.njk index 4f2f6de5ba..4d352fa551 100644 --- a/src/patterns/news/example-landing.njk +++ b/src/patterns/news/example-landing.njk @@ -164,10 +164,10 @@ layout: ~ onsPagination({ "previous": "Previous", "next": "Next", + "currentPageNumber": 1, "pages": [ { - "url": "#0", - "current": true + "url": "#0" }, { "url": "#0" diff --git a/src/scss/main.scss b/src/scss/main.scss index 0090caadd2..ab1657b844 100644 --- a/src/scss/main.scss +++ b/src/scss/main.scss @@ -27,7 +27,7 @@ @import '../components/header/header'; @import '../components/hero/hero'; @import '../components/icon/icon'; -@import '../components/images/images'; +@import '../components/image/image'; @import '../components/input/input-type'; @import '../components/input/input'; @import '../components/label/label';