@aurodesignsystem-dev/auro-hyperlink 0.0.0-pr303.0 → 0.0.0-pr306.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/demo/api.md +73 -72
  2. package/demo/auro-hyperlink.min.js +45 -20
  3. package/demo/index.md +26 -26
  4. package/dist/{auro-hyperlink-JpDRNbp2.js → auro-hyperlink-C3d_7inK.js} +50 -46
  5. package/dist/index.d.ts +21 -17
  6. package/dist/index.js +1 -1
  7. package/dist/registered.js +1 -1
  8. package/package.json +3 -3
package/demo/index.md CHANGED
@@ -24,10 +24,10 @@ If the `href` attribute is not added, the hyperlink element will render back sim
24
24
  <!-- AURO-GENERATED-CONTENT:END -->
25
25
  </div>
26
26
  <div class="exampleWrapper--ondark" aria-hidden>
27
- <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/basic-ondark.html) -->
28
- <!-- The below content is automatically added from ./../apiExamples/basic-ondark.html -->
29
- <auro-hyperlink ondark>No href supplied</auro-hyperlink><br>
30
- Welcome to <auro-hyperlink ondark href="https://www.alaskaair.com">Alaska Airlines</auro-hyperlink>.
27
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/basic-inverseAppearance.html) -->
28
+ <!-- The below content is automatically added from ./../apiExamples/basic-inverseAppearance.html -->
29
+ <auro-hyperlink appearance="inverse">No href supplied</auro-hyperlink><br>
30
+ Welcome to <auro-hyperlink appearance="inverse" href="https://www.alaskaair.com">Alaska Airlines</auro-hyperlink>.
31
31
  <!-- AURO-GENERATED-CONTENT:END -->
32
32
  </div>
33
33
  <auro-accordion alignRight>
@@ -40,12 +40,12 @@ If the `href` attribute is not added, the hyperlink element will render back sim
40
40
  Welcome to <auro-hyperlink href="https://www.alaskaair.com">Alaska Airlines</auro-hyperlink>.
41
41
  ```
42
42
  <!-- AURO-GENERATED-CONTENT:END -->
43
- <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/basic-ondark.html) -->
44
- <!-- The below code snippet is automatically added from ./../apiExamples/basic-ondark.html -->
43
+ <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/basic-inverseAppearance.html) -->
44
+ <!-- The below code snippet is automatically added from ./../apiExamples/basic-inverseAppearance.html -->
45
45
 
46
46
  ```html
47
- <auro-hyperlink ondark>No href supplied</auro-hyperlink><br>
48
- Welcome to <auro-hyperlink ondark href="https://www.alaskaair.com">Alaska Airlines</auro-hyperlink>.
47
+ <auro-hyperlink appearance="inverse">No href supplied</auro-hyperlink><br>
48
+ Welcome to <auro-hyperlink appearance="inverse" href="https://www.alaskaair.com">Alaska Airlines</auro-hyperlink>.
49
49
  ```
50
50
  <!-- AURO-GENERATED-CONTENT:END -->
51
51
  </auro-accordion>
@@ -70,15 +70,15 @@ The `auro-icon` element comes with some pre-defined opinions, but these are easi
70
70
  <!-- AURO-GENERATED-CONTENT:END -->
71
71
  </div>
72
72
  <div class="exampleWrapper--ondark" style="display: flex; justify-content: space-between;">
73
- <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/navPattern-ondark.html) -->
74
- <!-- The below content is automatically added from ./../apiExamples/navPattern-ondark.html -->
75
- <auro-hyperlink ondark href="/last" type="nav">
76
- <auro-icon ondark category="interface" name="chevron-left" customColor style="line-height: 1"></auro-icon>
73
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/navPattern-inverseAppearance.html) -->
74
+ <!-- The below content is automatically added from ./../apiExamples/navPattern-inverseAppearance.html -->
75
+ <auro-hyperlink appearance="inverse" href="/last" type="nav">
76
+ <auro-icon appearance="inverse" category="interface" name="chevron-left" customColor style="line-height: 1"></auro-icon>
77
77
  Click here to go back
78
78
  </auro-hyperlink>
79
- <auro-hyperlink ondark href="/next" type="nav">
79
+ <auro-hyperlink appearance="inverse" href="/next" type="nav">
80
80
  Click here to go forward
81
- <auro-icon ondark category="interface" name="chevron-right" customColor style="line-height: 1"></auro-icon>
81
+ <auro-icon appearance="inverse" category="interface" name="chevron-right" customColor style="line-height: 1"></auro-icon>
82
82
  </auro-hyperlink>
83
83
  <!-- AURO-GENERATED-CONTENT:END -->
84
84
  </div>
@@ -98,17 +98,17 @@ The `auro-icon` element comes with some pre-defined opinions, but these are easi
98
98
  </auro-hyperlink>
99
99
  ```
100
100
  <!-- AURO-GENERATED-CONTENT:END -->
101
- <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/navPattern-ondark.html) -->
102
- <!-- The below code snippet is automatically added from ./../apiExamples/navPattern-ondark.html -->
101
+ <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/navPattern-inverseAppearance.html) -->
102
+ <!-- The below code snippet is automatically added from ./../apiExamples/navPattern-inverseAppearance.html -->
103
103
 
104
104
  ```html
105
- <auro-hyperlink ondark href="/last" type="nav">
106
- <auro-icon ondark category="interface" name="chevron-left" customColor style="line-height: 1"></auro-icon>
105
+ <auro-hyperlink appearance="inverse" href="/last" type="nav">
106
+ <auro-icon appearance="inverse" category="interface" name="chevron-left" customColor style="line-height: 1"></auro-icon>
107
107
  Click here to go back
108
108
  </auro-hyperlink>
109
- <auro-hyperlink ondark href="/next" type="nav">
109
+ <auro-hyperlink appearance="inverse" href="/next" type="nav">
110
110
  Click here to go forward
111
- <auro-icon ondark category="interface" name="chevron-right" customColor style="line-height: 1"></auro-icon>
111
+ <auro-icon appearance="inverse" category="interface" name="chevron-right" customColor style="line-height: 1"></auro-icon>
112
112
  </auro-hyperlink>
113
113
  ```
114
114
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -129,9 +129,9 @@ Aside from the standard hyperlink use-case, the `auro-hyperlink` element is inte
129
129
  <!-- AURO-GENERATED-CONTENT:END -->
130
130
  </div>
131
131
  <div class="exampleWrapper--ondark">
132
- <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/roleButton-ondark.html) -->
133
- <!-- The below content is automatically added from ./../apiExamples/roleButton-ondark.html -->
134
- <auro-hyperlink ondark href="http://www.alaskaair.com" role="button" id="roleButton-ondark">Cancel button</auro-hyperlink>
132
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/roleButton-inverseAppearance.html) -->
133
+ <!-- The below content is automatically added from ./../apiExamples/roleButton-inverseAppearance.html -->
134
+ <auro-hyperlink appearance="inverse" href="http://www.alaskaair.com" role="button" id="roleButton-ondark">Cancel button</auro-hyperlink>
135
135
  <!-- AURO-GENERATED-CONTENT:END -->
136
136
  </div>
137
137
  <auro-accordion alignRight>
@@ -143,11 +143,11 @@ Aside from the standard hyperlink use-case, the `auro-hyperlink` element is inte
143
143
  <auro-hyperlink href="http://www.alaskaair.com" role="button" id="roleButton">Cancel button</auro-hyperlink>
144
144
  ```
145
145
  <!-- AURO-GENERATED-CONTENT:END -->
146
- <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/roleButton-ondark.html) -->
147
- <!-- The below code snippet is automatically added from ./../apiExamples/roleButton-ondark.html -->
146
+ <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/roleButton-inverseAppearance.html) -->
147
+ <!-- The below code snippet is automatically added from ./../apiExamples/roleButton-inverseAppearance.html -->
148
148
 
149
149
  ```html
150
- <auro-hyperlink ondark href="http://www.alaskaair.com" role="button" id="roleButton-ondark">Cancel button</auro-hyperlink>
150
+ <auro-hyperlink appearance="inverse" href="http://www.alaskaair.com" role="button" id="roleButton-ondark">Cancel button</auro-hyperlink>
151
151
  ```
152
152
  <!-- AURO-GENERATED-CONTENT:END -->
153
153
  <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/roleButton.js) -->