Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: update auro-library to 3.0.1 #143

Merged
merged 3 commits into from
Nov 19, 2024
Merged

feat: update auro-library to 3.0.1 #143

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
d37b698
feat: update auro-library to 3.0.1
DukeFerdinand Nov 9, 2024
b120857
perf: update library to 3.0.2
sun-mota Nov 14, 2024
1c2472c
ci: update `.gitignore` to match with `WC-Generator/template/.gitigno…
sun-mota Nov 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 10 additions & 6 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,20 +1,24 @@
.DS_Store
node_modules/
docTemplates/
.cache/

## Sass files built on demand from Token files
demo/sass/_*.scss
## Demo support files
demo/*.css
demo/*.css.map

## CSS built from Sass process
demo/css
src/*.css
src/**/*.css
src/**/*.css.map
components/**/*.css
components/**/*.css.map

## *-css built from sass-render process
*-css.js
**/*-css.js

## dist files
dist/
build/

## Karma code coverage reports
## Code coverage reports
coverage/
22 changes: 11 additions & 11 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ The README.md file is a compiled document. No edits should be made directly to t
README.md is created by running `npm run build:docs`.

This file is generated based on a template fetched from
`https://raw.githubusercontent.com/AlaskaAirlines/WC-Generator/master/componentDocs/README.md`
`https://raw.githubusercontent.com/AlaskaAirlines/WC-Generator/master/componentDocs/README_updated_paths.md`
and copied to `./componentDocs/README.md` each time the the docs are compiled.

The following sections are editable by making changes to the following files:
Expand All @@ -19,12 +19,12 @@ The following sections are editable by making changes to the following files:

# Accordion

<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../docs/partials/description.md) -->
<!-- The below content is automatically added from ./../docs/partials/description.md -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./docs/partials/description.md) -->
<!-- The below content is automatically added from ./docs/partials/description.md -->
`<auro-accordion>` is a [HTML custom element](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements) for the purpose of toggling the visibility of large content section by clicking on a smaller trigger element.
<!-- AURO-GENERATED-CONTENT:END -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../docs/partials/readmeAddlInfo.md) -->
<!-- The below content is automatically added from ./../docs/partials/readmeAddlInfo.md -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./docs/partials/readmeAddlInfo.md) -->
<!-- The below content is automatically added from ./docs/partials/readmeAddlInfo.md -->

## Transitioning from v1.x to v3.x

Expand Down Expand Up @@ -88,8 +88,8 @@ import "@aurodesignsystem/auro-accordion";

<!-- AURO-GENERATED-CONTENT:END -->
**Reference component in HTML**
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/basic.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/basic.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./apiExamples/basic.html) -->
<!-- The below code snippet is automatically added from ./apiExamples/basic.html -->

```html
<auro-accordion>
Expand Down Expand Up @@ -133,8 +133,8 @@ In cases where the project is not able to process JS assets, there are pre-proce

## auro-accordion use cases

<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../docs/partials/useCases.md) -->
<!-- The below content is automatically added from ./../docs/partials/useCases.md -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./docs/partials/useCases.md) -->
<!-- The below content is automatically added from ./docs/partials/useCases.md -->
The `<auro-accordion>` element should be used in situations where users may:

- Hide/show long sub-content based on headline trigger
Expand All @@ -145,8 +145,8 @@ The `<auro-accordion>` element should be used in situations where users may:

### Default auro-accordion

<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/basic.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/basic.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./apiExamples/basic.html) -->
<!-- The below code snippet is automatically added from ./apiExamples/basic.html -->

```html
<auro-accordion>
Expand Down
100 changes: 50 additions & 50 deletions demo/api.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../api.md) -->
<!-- The below content is automatically added from ./../api.md -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../docs/api.md) -->
<!-- The below content is automatically added from ./../docs/api.md -->

# auro-accordion

Expand Down Expand Up @@ -51,8 +51,8 @@ Use auro-accordion-group if you want to have auto closing accordion components w
### Basic

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/basic.html) -->
<!-- The below content is automatically added from ./../../apiExamples/basic.html -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/basic.html) -->
<!-- The below content is automatically added from ./../apiExamples/basic.html -->
<auro-accordion>
<span slot="trigger">Trigger</span>
<p>
Expand All @@ -72,8 +72,8 @@ Use auro-accordion-group if you want to have auto closing accordion components w
</div>
<auro-accordion alignRight>
<span slot="trigger">See code</span>
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/basic.html) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/basic.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/basic.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/basic.html -->

```html
<auro-accordion>
Expand All @@ -95,8 +95,8 @@ Use auro-accordion-group if you want to have auto closing accordion components w
<!-- AURO-GENERATED-CONTENT:END -->
</auro-accordion>
<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/accordionGroup.html) -->
<!-- The below content is automatically added from ./../../apiExamples/accordionGroup.html -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/accordionGroup.html) -->
<!-- The below content is automatically added from ./../apiExamples/accordionGroup.html -->
<auro-accordion-group>
<auro-accordion>
<span slot="trigger">Trigger</span>
Expand Down Expand Up @@ -148,8 +148,8 @@ Use auro-accordion-group if you want to have auto closing accordion components w
</div>
<auro-accordion alignRight>
<span slot="trigger">See code</span>
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/accordionGroup.html) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/accordionGroup.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/accordionGroup.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/accordionGroup.html -->

```html
<auro-accordion-group>
Expand Down Expand Up @@ -210,8 +210,8 @@ Use auro-accordion-group if you want to have auto closing accordion components w
The chevron icon within the trigger of the `auro-accordion` will not render when `chevron="none"` is present on the element.

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/chevronNone.html) -->
<!-- The below content is automatically added from ./../../apiExamples/chevronNone.html -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/chevronNone.html) -->
<!-- The below content is automatically added from ./../apiExamples/chevronNone.html -->
<auro-accordion chevron="none">
<span slot="trigger">Trigger</span>
<p>
Expand All @@ -231,8 +231,8 @@ The chevron icon within the trigger of the `auro-accordion` will not render when
</div>
<auro-accordion alignRight>
<span slot="trigger">See code</span>
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/chevronNone.html) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/chevronNone.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/chevronNone.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/chevronNone.html -->

```html
<auro-accordion chevron="none">
Expand All @@ -259,8 +259,8 @@ The chevron icon within the trigger of the `auro-accordion` will not render when
Using the `chevron="right"` will cause the chevron to appear on the right side of the accordion label.

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/chevronRight.html) -->
<!-- The below content is automatically added from ./../../apiExamples/chevronRight.html -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/chevronRight.html) -->
<!-- The below content is automatically added from ./../apiExamples/chevronRight.html -->
<auro-accordion chevron="right">
<span slot="trigger">Trigger</span>
<p>
Expand All @@ -280,8 +280,8 @@ Using the `chevron="right"` will cause the chevron to appear on the right side o
</div>
<auro-accordion alignRight chevron>
<span slot="trigger">See code</span>
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/chevronRight.html) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/chevronRight.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/chevronRight.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/chevronRight.html -->

```html
<auro-accordion chevron="right">
Expand All @@ -308,8 +308,8 @@ Using the `chevron="right"` will cause the chevron to appear on the right side o
Using the `alignRight` attribute will cause the trigger to align to the right edge of the accordion.

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/alignRight.html) -->
<!-- The below content is automatically added from ./../../apiExamples/alignRight.html -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/alignRight.html) -->
<!-- The below content is automatically added from ./../apiExamples/alignRight.html -->
<auro-accordion alignRight>
<span slot="trigger">Trigger</span>
<p>
Expand All @@ -329,8 +329,8 @@ Using the `alignRight` attribute will cause the trigger to align to the right ed
</div>
<auro-accordion alignRight>
<span slot="trigger">See code</span>
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/alignRight.html) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/alignRight.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/alignRight.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/alignRight.html -->

```html
<auro-accordion alignRight>
Expand All @@ -357,8 +357,8 @@ Using the `alignRight` attribute will cause the trigger to align to the right ed
Using the `alignRight` attribute in conjuction with the `chevron="right"` attribute will cause the trigger to align to the right edge of the accordion, with the chevron appearing on the right side of the trigger.

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/alignChevronRight.html) -->
<!-- The below content is automatically added from ./../../apiExamples/alignChevronRight.html -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/alignChevronRight.html) -->
<!-- The below content is automatically added from ./../apiExamples/alignChevronRight.html -->
<auro-accordion chevron="right" alignRight>
<span slot="trigger">Trigger</span>
<p>
Expand All @@ -378,8 +378,8 @@ Using the `alignRight` attribute in conjuction with the `chevron="right"` attrib
</div>
<auro-accordion alignRight>
<span slot="trigger">See code</span>
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/alignChevronRight.html) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/alignChevronRight.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/alignChevronRight.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/alignChevronRight.html -->

```html
<auro-accordion chevron="right" alignRight>
Expand All @@ -406,8 +406,8 @@ Using the `alignRight` attribute in conjuction with the `chevron="right"` attrib
The accordion can be programatically expanded or collapsed by setting the `expanded` attribute to `true` or `false`.

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/expanded.html) -->
<!-- The below content is automatically added from ./../../apiExamples/expanded.html -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/expanded.html) -->
<!-- The below content is automatically added from ./../apiExamples/expanded.html -->
<auro-button id="auroaccordionExpandedExampleBtnTrue">Set expanded = `true`</auro-button>
<auro-button id="auroaccordionExpandedExampleBtnFalse">Set expanded = `false`</auro-button>
<auro-accordion id="auroaccordionExpandedExample">
Expand All @@ -429,8 +429,8 @@ The accordion can be programatically expanded or collapsed by setting the `expan
</div>
<auro-accordion alignRight>
<span slot="trigger">See code</span>
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/expanded.html) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/expanded.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/expanded.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/expanded.html -->

```html
<auro-button id="auroaccordionExpandedExampleBtnTrue">Set expanded = `true`</auro-button>
Expand All @@ -452,8 +452,8 @@ The accordion can be programatically expanded or collapsed by setting the `expan
</auro-accordion>
```
<!-- AURO-GENERATED-CONTENT:END -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/expanded.js) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/expanded.js -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/expanded.js) -->
<!-- The below code snippet is automatically added from ./../apiExamples/expanded.js -->

```js
export function expandedExample() {
Expand All @@ -478,8 +478,8 @@ export function expandedExample() {
Using the `variant="sm"` attribute will cause the size of the accordion trigger to render smaller.

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/accordionGroupSm.html) -->
<!-- The below content is automatically added from ./../../apiExamples/accordionGroupSm.html -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/accordionGroupSm.html) -->
<!-- The below content is automatically added from ./../apiExamples/accordionGroupSm.html -->
<auro-accordion-group variant="sm">
<auro-accordion>
<span slot="trigger">Trigger</span>
Expand Down Expand Up @@ -531,8 +531,8 @@ Using the `variant="sm"` attribute will cause the size of the accordion trigger
</div>
<auro-accordion alignRight>
<span slot="trigger">See code</span>
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/accordionGroupSm.html) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/accordionGroupSm.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/accordionGroupSm.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/accordionGroupSm.html -->

```html
<auro-accordion-group variant="sm">
Expand Down Expand Up @@ -591,8 +591,8 @@ Using the `variant="sm"` attribute will cause the size of the accordion trigger
Using the `variant="lg"` attribute will cause the size of the accordion trigger to render larger.

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/accordionGroupLg.html) -->
<!-- The below content is automatically added from ./../../apiExamples/accordionGroupLg.html -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/accordionGroupLg.html) -->
<!-- The below content is automatically added from ./../apiExamples/accordionGroupLg.html -->
<auro-accordion-group variant="lg">
<auro-accordion>
<span slot="trigger">Trigger</span>
Expand Down Expand Up @@ -644,8 +644,8 @@ Using the `variant="lg"` attribute will cause the size of the accordion trigger
</div>
<auro-accordion alignRight>
<span slot="trigger">See code</span>
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/accordionGroupLg.html) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/accordionGroupLg.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/accordionGroupLg.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/accordionGroupLg.html -->

```html
<auro-accordion-group variant="lg">
Expand Down Expand Up @@ -704,8 +704,8 @@ Using the `variant="lg"` attribute will cause the size of the accordion trigger
Use the `emphasis` attribute to apply border highlights to the `auro-accordion` on hover and move the chevron to the right side of the trigger.

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/emphasis.html) -->
<!-- The below content is automatically added from ./../../apiExamples/emphasis.html -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/emphasis.html) -->
<!-- The below content is automatically added from ./../apiExamples/emphasis.html -->
<auro-accordion-group emphasis>
<auro-accordion>
<span slot="trigger">Trigger</span>
Expand Down Expand Up @@ -757,8 +757,8 @@ Use the `emphasis` attribute to apply border highlights to the `auro-accordion`
</div>
<auro-accordion alignRight>
<span slot="trigger">See code</span>
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/emphasis.html) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/emphasis.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/emphasis.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/emphasis.html -->

```html
<auro-accordion-group emphasis>
Expand Down Expand Up @@ -817,8 +817,8 @@ Use the `emphasis` attribute to apply border highlights to the `auro-accordion`
Using the `noToggleExpanded` attribute will allow for multiple `auro-accordion`'s in an `auro-accordion-group` to be open at the same time.

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/noToggleExpanded.html) -->
<!-- The below content is automatically added from ./../../apiExamples/noToggleExpanded.html -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/noToggleExpanded.html) -->
<!-- The below content is automatically added from ./../apiExamples/noToggleExpanded.html -->
<auro-accordion-group noToggleExpanded>
<auro-accordion>
<span slot="trigger">Trigger</span>
Expand Down Expand Up @@ -870,8 +870,8 @@ Using the `noToggleExpanded` attribute will allow for multiple `auro-accordion`'
</div>
<auro-accordion alignRight>
<span slot="trigger">See code</span>
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../apiExamples/noToggleExpanded.html) -->
<!-- The below code snippet is automatically added from ./../../apiExamples/noToggleExpanded.html -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/noToggleExpanded.html) -->
<!-- The below code snippet is automatically added from ./../apiExamples/noToggleExpanded.html -->

```html
<auro-accordion-group noToggleExpanded>
Expand Down Expand Up @@ -929,8 +929,8 @@ Using the `noToggleExpanded` attribute will allow for multiple `auro-accordion`'

The component may be restyled using the following code sample and changing the values of the following token(s).

<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../../src/tokens.scss) -->
<!-- The below code snippet is automatically added from ./../../src/tokens.scss -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../src/tokens.scss) -->
<!-- The below code snippet is automatically added from ./../src/tokens.scss -->

```scss
@import "./../node_modules/@aurodesignsystem/design-tokens/dist/tokens/SCSSVariables";
Expand Down
Loading
Loading