@ptlm-azulejo/button 2.1.1-alpha.99 → 2.1.2-alpha.121
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.
- package/CHANGELOG.md +16 -0
- package/README.md +25 -23
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# Change Log
|
|
2
2
|
|
|
3
|
+
## 2.1.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- fbbee70: Formatting-only release. The repository adopted Prettier as its single
|
|
8
|
+
formatting authority, and every shipped file was reformatted in one pass: the
|
|
9
|
+
theme and font stylesheets (published verbatim, so their bytes change), each
|
|
10
|
+
package's README, and the component sources behind `dist/`.
|
|
11
|
+
|
|
12
|
+
No public API, prop, slot, event, CSS variable, class name or rendered output
|
|
13
|
+
changed. Upgrading requires nothing, and skipping this version costs nothing.
|
|
14
|
+
|
|
15
|
+
One internal cleanup rides along in `AzSegmentedControl`: a dead `null`
|
|
16
|
+
initializer and the unreachable branch guarding it were removed from the
|
|
17
|
+
keyboard handler. Arrow / Home / End navigation behaves exactly as before.
|
|
18
|
+
|
|
3
19
|
## 2.1.1
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
package/README.md
CHANGED
|
@@ -30,10 +30,10 @@ CSS variables at runtime. Those tokens come from `@ptlm-azulejo/themes`, and
|
|
|
30
30
|
**the brand is selected by a class on your app's `<html>` element**, so switching
|
|
31
31
|
brand never touches component code.
|
|
32
32
|
|
|
33
|
-
| Project
|
|
34
|
-
|
|
|
35
|
-
| Leroy Merlin | `@ptlm-azulejo/themes/presets/leroy-merlin.css` | `preset-lm`
|
|
36
|
-
| Adeo
|
|
33
|
+
| Project | Preset stylesheet | Root class | Typeface | Font package |
|
|
34
|
+
| ------------ | ----------------------------------------------- | ------------- | --------------- | ---------------------------------- |
|
|
35
|
+
| Leroy Merlin | `@ptlm-azulejo/themes/presets/leroy-merlin.css` | `preset-lm` | LeroyMerlinSans | `@ptlm-azulejo/fonts-leroy-merlin` |
|
|
36
|
+
| Adeo | `@ptlm-azulejo/themes/presets/adeo.css` | `preset-adeo` | Roboto | `@ptlm-azulejo/fonts-adeo` |
|
|
37
37
|
|
|
38
38
|
**Leroy Merlin projects**
|
|
39
39
|
|
|
@@ -44,7 +44,7 @@ import '@ptlm-azulejo/button/style.css'
|
|
|
44
44
|
```
|
|
45
45
|
|
|
46
46
|
```html
|
|
47
|
-
<html lang="pt" class="preset-lm">
|
|
47
|
+
<html lang="pt" class="preset-lm"></html>
|
|
48
48
|
```
|
|
49
49
|
|
|
50
50
|
**Adeo projects**
|
|
@@ -56,7 +56,7 @@ import '@ptlm-azulejo/button/style.css'
|
|
|
56
56
|
```
|
|
57
57
|
|
|
58
58
|
```html
|
|
59
|
-
<html lang="pt" class="preset-adeo">
|
|
59
|
+
<html lang="pt" class="preset-adeo"></html>
|
|
60
60
|
```
|
|
61
61
|
|
|
62
62
|
> The preset class is what resolves the brand at runtime. Without it — even with
|
|
@@ -70,12 +70,12 @@ Add `data-theme` alongside the brand class to pin the color scheme. Leave it off
|
|
|
70
70
|
and the preset follows the OS `prefers-color-scheme`:
|
|
71
71
|
|
|
72
72
|
```html
|
|
73
|
-
<html lang="pt" class="preset-lm" data-theme="dark">
|
|
73
|
+
<html lang="pt" class="preset-lm" data-theme="dark"></html>
|
|
74
74
|
```
|
|
75
75
|
|
|
76
76
|
### Why the font package is separate
|
|
77
77
|
|
|
78
|
-
The preset only
|
|
78
|
+
The preset only _names_ its typeface in `--font-family` and ships no font files.
|
|
79
79
|
[Loading them is your app's job](../themes/README.md#fonts), as with upstream
|
|
80
80
|
Mozaic, so you keep control of hosting, subsetting and preload. Without the
|
|
81
81
|
matching font package, `font-sans` falls back to a generic sans-serif. A
|
|
@@ -85,28 +85,30 @@ only the active brand's file is ever downloaded.
|
|
|
85
85
|
To hand the button back to your page's font:
|
|
86
86
|
|
|
87
87
|
```css
|
|
88
|
-
.preset-lm .btn {
|
|
88
|
+
.preset-lm .btn {
|
|
89
|
+
font-family: inherit;
|
|
90
|
+
}
|
|
89
91
|
```
|
|
90
92
|
|
|
91
93
|
## Props
|
|
92
94
|
|
|
93
|
-
| Name
|
|
94
|
-
|
|
|
95
|
-
| `appearance`
|
|
96
|
-
| `size`
|
|
97
|
-
| `disabled`
|
|
98
|
-
| `ghost`
|
|
99
|
-
| `outlined`
|
|
100
|
-
| `iconPosition` | `"left"` \| `"right"` \| `"only"`
|
|
101
|
-
| `type`
|
|
102
|
-
| `isLoading`
|
|
95
|
+
| Name | Type | Default | Description |
|
|
96
|
+
| -------------- | ------------------------------------------------------- | ------------ | ---------------------------------------------------------- |
|
|
97
|
+
| `appearance` | `"standard"` \| `"danger"` \| `"inverse"` \| `"accent"` | `"standard"` | Defines the visual style of the button. |
|
|
98
|
+
| `size` | `"s"` \| `"m"` \| `"l"` | `"m"` | Determines the size of the button. |
|
|
99
|
+
| `disabled` | `boolean` | — | If `true`, disables the button, making it non-interactive. |
|
|
100
|
+
| `ghost` | `boolean` | — | If `true`, applies a "ghost" style to the button. |
|
|
101
|
+
| `outlined` | `boolean` | — | If `true`, the button gets an outlined style. |
|
|
102
|
+
| `iconPosition` | `"left"` \| `"right"` \| `"only"` | — | Controls the positioning of an icon in the button. |
|
|
103
|
+
| `type` | `"button"` \| `"reset"` \| `"submit"` | `"button"` | Specifies the button's HTML `type` attribute. |
|
|
104
|
+
| `isLoading` | `boolean` | — | If `true`, a loading state is displayed. |
|
|
103
105
|
|
|
104
106
|
## Slots
|
|
105
107
|
|
|
106
|
-
| Name
|
|
107
|
-
|
|
|
108
|
-
| `default` | The content displayed in the button.
|
|
109
|
-
| `icon`
|
|
108
|
+
| Name | Description |
|
|
109
|
+
| --------- | ----------------------------------------------- |
|
|
110
|
+
| `default` | The content displayed in the button. |
|
|
111
|
+
| `icon` | Use this slot to insert an icon for the Button. |
|
|
110
112
|
|
|
111
113
|
## Basic Usage
|
|
112
114
|
|