@hug/hospitality 1.0.0-alpha.3 → 1.0.0-alpha.5

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 (4) hide show
  1. package/fesm2022/tokens.mjs.map +1 -1
  2. package/material/button/button.scss +81 -92
  3. package/package.json +1 -1
  4. package/types/tokens.d.ts +1 -0
package/fesm2022/tokens.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tokens.mjs","sources":["../../tokens/index.ts","../../tokens/tokens.ts"],"sourcesContent":["import rawTokens from './tokens.json';\n\nexport interface Token {\n id: string;\n name: string;\n type: string;\n value: string | number;\n}\n\nexport interface TokenSystem {\n id?: string;\n name: string;\n type: string;\n reference: Token[];\n _referenceValue:\n | string\n | {\n weight: number;\n size: number;\n lineHeight: number;\n font: string;\n };\n}\n\nexport interface ReferencesTokens {\n references: Token[];\n}\n\nexport interface Tokens extends ReferencesTokens {\n systems: {\n light: TokenSystem[];\n dark: TokenSystem[];\n } | TokenSystem[];\n}\n\nconst tokens: {\n colors: Tokens;\n typographies: Tokens;\n radius: ReferencesTokens;\n spacing: ReferencesTokens;\n} = rawTokens;\n\nexport { tokens };\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA,MAAM,MAAM,GAKR;;ACxCJ;;AAEG;;;;"}
1
+ {"version":3,"file":"tokens.mjs","sources":["../../tokens/index.ts","../../tokens/tokens.ts"],"sourcesContent":["import rawTokens from './tokens.json';\n\nexport interface Token {\n id: string;\n name: string;\n type: string;\n value: string | number;\n}\n\nexport interface TokenSystem {\n id?: string;\n name: string;\n type: string;\n reference: Token[];\n _referenceValue:\n | string\n | {\n weight: number;\n size: number;\n lineHeight: number;\n font: string;\n };\n}\n\nexport interface ReferencesTokens {\n references: Token[];\n}\n\nexport interface Tokens extends ReferencesTokens {\n systems: {\n light: TokenSystem[];\n dark: TokenSystem[];\n } | TokenSystem[];\n}\n\nconst tokens: {\n colors: Tokens;\n typographies: Tokens;\n radius: ReferencesTokens;\n spacing: ReferencesTokens;\n stateLayers: ReferencesTokens;\n} = rawTokens;\n\nexport { tokens };\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA,MAAM,MAAM,GAMR;;ACzCJ;;AAEG;;;;"}
package/material/button/button.scss CHANGED
@@ -7,22 +7,26 @@ button {
7
7
  (
8
8
  filled-horizontal-padding: 1rem,
9
9
  outlined-horizontal-padding: 1rem,
10
- protected-horizontal-padding: 1rem,
10
+ tonal-horizontal-padding: 1rem,
11
11
  text-horizontal-padding: 1rem,
12
12
  text-with-icon-horizontal-padding: 1rem,
13
13
  outlined-label-text-color: var(--mat-sys-on-surface-variant),
14
14
  outlined-outline-color: var(--mat-sys-outline-variant),
15
15
  outlined-disabled-outline-color: var(--mat-sys-outline-variant),
16
- outlined-state-layer-color:
17
- color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent),
18
- outlined-ripple-color:
19
- color-mix(in srgb, var(--mat-sys-on-surface) 10%, transparent),
16
+ outlined-state-layer-color: color-mix(
17
+ in srgb,
18
+ var(--mat-sys-on-surface) 38%,
19
+ transparent
20
+ ),
21
+ outlined-ripple-color: color-mix(
22
+ in srgb,
23
+ var(--mat-sys-on-surface) 10%,
24
+ transparent
25
+ ),
20
26
  )
21
27
  );
22
28
 
23
- &[mat-button],
24
- &[mat-stroked-button],
25
- &[mat-flat-button] {
29
+ &[matButton] {
26
30
  > mat-icon.mat-icon {
27
31
  margin: 0;
28
32
  font-size: 1.25rem;
@@ -39,15 +43,17 @@ button {
39
43
  }
40
44
  }
41
45
 
46
+ /* Size variants, icon button and button */
47
+
42
48
  &[hy-size="small"] {
43
- gap: 0.5rem;
49
+ gap: 0.25rem;
44
50
 
45
51
  @include mat.button-density(-1);
46
52
  @include mat.button-overrides(
47
53
  (
48
54
  filled-horizontal-padding: 0.75rem,
49
55
  outlined-horizontal-padding: 0.75rem,
50
- protected-horizontal-padding: 0.75rem,
56
+ tonal-horizontal-padding: 0.75rem,
51
57
  text-horizontal-padding: 0.75rem,
52
58
  text-with-icon-horizontal-padding: 0.75rem,
53
59
  )
@@ -58,7 +64,7 @@ button {
58
64
  )
59
65
  );
60
66
 
61
- &[mat-icon-button] {
67
+ &[matIconButton] {
62
68
  > mat-icon.mat-icon {
63
69
  margin: 0;
64
70
  font-size: 1.25rem;
@@ -73,32 +79,32 @@ button {
73
79
  (
74
80
  filled-container-height: 3.5rem,
75
81
  outlined-container-height: 3.5rem,
76
- protected-container-height: 3.5rem,
82
+ tonal-container-height: 3.5rem,
77
83
  text-container-height: 3.5rem,
78
84
 
79
85
  filled-horizontal-padding: 1.5rem,
80
86
  outlined-horizontal-padding: 1.5rem,
81
- protected-horizontal-padding: 1.5rem,
87
+ tonal-horizontal-padding: 1.5rem,
82
88
  text-horizontal-padding: 1.5rem,
83
89
  text-with-icon-horizontal-padding: 1.5rem,
84
90
 
85
91
  filled-label-text-font: var(--mat-sys-title-medium-font),
86
92
  outlined-label-text-font: var(--mat-sys-title-medium-font),
87
- protected-label-text-font: var(--mat-sys-title-medium-font),
93
+ tonal-label-text-font: var(--mat-sys-title-medium-font),
88
94
  text-label-text-font: var(--mat-sys-title-medium-font),
89
95
  filled-label-text-size: var(--mat-sys-title-medium-size),
90
96
  outlined-label-text-size: var(--mat-sys-title-medium-size),
91
- protected-label-text-size: var(--mat-sys-title-medium-size),
97
+ tonal-label-text-size: var(--mat-sys-title-medium-size),
92
98
  text-label-text-size: var(--mat-sys-title-medium-size),
93
99
  filled-label-text-tracking: var(--mat-sys-title-medium-tracking),
94
- outlined-label-text-tracking:
95
- var(--mat-sys-title-medium-tracking),
96
- protected-label-text-tracking:
97
- var(--mat-sys-title-medium-tracking),
100
+ outlined-label-text-tracking: var(
101
+ --mat-sys-title-medium-tracking
102
+ ),
103
+ tonal-label-text-tracking: var(--mat-sys-title-medium-tracking),
98
104
  text-label-text-tracking: var(--mat-sys-title-medium-tracking),
99
105
  filled-label-text-weight: var(--mat-sys-title-medium-weight),
100
106
  outlined-label-text-weight: var(--mat-sys-title-medium-weight),
101
- protected-label-text-weight: var(--mat-sys-title-medium-weight),
107
+ tonal-label-text-weight: var(--mat-sys-title-medium-weight),
102
108
  text-label-text-weight: var(--mat-sys-title-medium-weight),
103
109
  )
104
110
  );
@@ -109,9 +115,7 @@ button {
109
115
  )
110
116
  );
111
117
 
112
- &[mat-button],
113
- &[mat-stroked-button],
114
- &[mat-flat-button] {
118
+ &[matButton] {
115
119
  > mat-icon.mat-icon {
116
120
  font-size: 1.5rem;
117
121
  height: 1.5rem;
@@ -120,118 +124,103 @@ button {
120
124
  }
121
125
  }
122
126
 
123
- &[hy-appearance="tonal"],
124
- &[hy-appearance="filled"],
125
- &[hy-appearance="warning-filled"] {
126
- &:disabled {
127
- background-color: color-mix(
128
- in srgb,
129
- var(--mat-sys-on-surface) 10%,
130
- transparent
131
- );
132
- }
133
- }
134
-
135
- &[hy-appearance="tonal"] {
127
+ /* Appearance variants, icon button and button */
128
+ &[hy-appearance="warning"] {
136
129
  @include mat.button-overrides(
137
130
  (
138
- filled-container-color: var(--mat-sys-secondary-container),
139
- filled-label-text-color: var(--mat-sys-on-secondary-container),
140
- filled-state-layer-color: var(--mat-sys-on-secondary-container),
141
- filled-ripple-color:
142
- color-mix(
131
+ filled-container-color: var(--hy-color-warning),
132
+ filled-label-text-color: var(--hy-color-on-warning),
133
+ filled-state-layer-color: var(--hy-color-on-warning),
134
+ filled-ripple-color: color-mix(
143
135
  in srgb,
144
- var(--mat-sys-on-secondary-container) 10%,
136
+ var(--hy-color-on-warning) 10%,
145
137
  transparent
146
138
  ),
147
- )
148
- );
149
-
150
- @include mat.icon-button-overrides(
151
- (
152
- icon-color: var(--mat-sys-on-secondary-container),
153
- state-layer-color: var(--mat-sys-on-secondary-container),
154
- ripple-color:
155
- color-mix(
139
+ text-label-text-color: var(--hy-color-warning),
140
+ text-state-layer-color: var(--hy-color-warning),
141
+ text-ripple-color: color-mix(
156
142
  in srgb,
157
- var(--mat-sys-on-secondary-container) 10%,
143
+ var(--hy-color-warning) 10%,
158
144
  transparent
159
145
  ),
160
146
  )
161
147
  );
162
148
 
163
- &[mat-icon-button]:enabled {
164
- background-color: var(--mat-sys-secondary-container);
165
- }
166
- }
167
-
168
- &[hy-appearance="filled"] {
169
- background-color: var(--mat-sys-primary);
170
-
171
149
  @include mat.icon-button-overrides(
172
150
  (
173
- icon-color: var(--mat-sys-on-primary),
174
- state-layer-color: var(--mat-sys-on-primary),
175
- ripple-color:
176
- color-mix(
151
+ icon-color: var(--hy-color-warning),
152
+ state-layer-color: var(--hy-color-warning),
153
+ ripple-color: color-mix(
177
154
  in srgb,
178
- var(--mat-sys-on-primary) 10%,
155
+ var(--hy-color-warning) 10%,
179
156
  transparent
180
157
  ),
181
158
  )
182
159
  );
183
160
  }
184
161
 
162
+ /* Icon buttons appearance variants */
185
163
  &[hy-appearance="warning-filled"] {
186
- @include mat.button-overrides(
164
+ @include mat.icon-button-overrides(
187
165
  (
188
- filled-container-color: var(--mat-sys-warning),
189
- filled-label-text-color: var(--mat-sys-on-warning),
190
- filled-state-layer-color: var(--mat-sys-on-warning),
191
- filled-ripple-color:
192
- color-mix(
166
+ icon-color: var(--hy-color-on-warning),
167
+ state-layer-color: var(--hy-color-on-warning),
168
+ ripple-color: color-mix(
193
169
  in srgb,
194
- var(--mat-sys-on-warning) 10%,
170
+ var(--hy-color-on-warning) 10%,
195
171
  transparent
196
172
  ),
197
173
  )
198
174
  );
199
175
 
176
+ &[matIconButton]:enabled {
177
+ background-color: var(--hy-color-warning);
178
+ }
179
+ }
180
+
181
+ &[hy-appearance="tonal"] {
200
182
  @include mat.icon-button-overrides(
201
183
  (
202
- icon-color: var(--mat-sys-on-warning),
203
- state-layer-color: var(--mat-sys-on-warning),
204
- ripple-color:
205
- color-mix(
184
+ icon-color: var(--mat-sys-on-secondary-container),
185
+ state-layer-color: var(--mat-sys-on-secondary-container),
186
+ ripple-color: color-mix(
206
187
  in srgb,
207
- var(--mat-sys-on-warning) 10%,
188
+ var(--mat-sys-on-secondary-container) 10%,
208
189
  transparent
209
190
  ),
210
191
  )
211
192
  );
212
193
 
213
- &[mat-icon-button]:enabled {
214
- background-color: var(--mat-sys-warning);
194
+ &[matIconButton]:enabled {
195
+ background-color: var(--mat-sys-secondary-container);
215
196
  }
216
197
  }
217
198
 
218
- &[hy-appearance="warning-text"] {
219
- @include mat.button-overrides(
220
- (
221
- text-label-text-color: var(--mat-sys-warning),
222
- text-state-layer-color: var(--mat-sys-warning),
223
- text-ripple-color:
224
- color-mix(in srgb, var(--mat-sys-warning) 10%, transparent),
225
- )
226
- );
199
+ &[hy-appearance="filled"] {
200
+ background-color: var(--mat-sys-primary);
227
201
 
228
202
  @include mat.icon-button-overrides(
229
203
  (
230
- icon-color: var(--mat-sys-warning),
231
- state-layer-color: var(--mat-sys-warning),
232
- ripple-color:
233
- color-mix(in srgb, var(--mat-sys-warning) 10%, transparent),
204
+ icon-color: var(--mat-sys-on-primary),
205
+ state-layer-color: var(--mat-sys-on-primary),
206
+ ripple-color: color-mix(
207
+ in srgb,
208
+ var(--mat-sys-on-primary) 10%,
209
+ transparent
210
+ ),
234
211
  )
235
212
  );
236
213
  }
214
+
215
+ &[hy-appearance="tonal"],
216
+ &[hy-appearance="filled"],
217
+ &[hy-appearance="warning-filled"] {
218
+ &:disabled {
219
+ background-color: color-mix(
220
+ in srgb,
221
+ var(--mat-sys-on-surface) 10%,
222
+ transparent
223
+ );
224
+ }
225
+ }
237
226
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hug/hospitality",
3
- "version": "1.0.0-alpha.3",
3
+ "version": "1.0.0-alpha.5",
4
4
  "description": "Hospitality Design System",
5
5
  "homepage": "https://github.com/dsi-hug/hospitality",
6
6
  "license": "GPL-3.0-only",
package/types/tokens.d.ts CHANGED
@@ -30,6 +30,7 @@ declare const tokens: {
30
30
  typographies: Tokens;
31
31
  radius: ReferencesTokens;
32
32
  spacing: ReferencesTokens;
33
+ stateLayers: ReferencesTokens;
33
34
  };
34
35
 
35
36
  export { tokens };