@phila/phila-ui-core 2.3.3-beta.1 → 2.4.0-beta.2

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 (17) hide show
  1. package/dist/styles/elements/buttons.css +45 -41
  2. package/dist/styles/elements/icons.css +14 -14
  3. package/dist/styles/generated/extended-colors.css +0 -3
  4. package/dist/styles/generated/other.css +12 -32
  5. package/dist/styles/generated/palettes.css +75 -75
  6. package/dist/styles/generated/primitives.css +20 -27
  7. package/dist/styles/generated/ramps.css +257 -257
  8. package/dist/styles/generated/schemes.css +39 -32
  9. package/dist/styles/generated/size.css +1 -0
  10. package/dist/styles/generated/typography.css +19 -9
  11. package/dist/styles/legacy.css +13 -4
  12. package/dist/styles/raw/PhilaUI 4.0-variables.css +900 -2212
  13. package/dist/styles/typography.css +3 -3
  14. package/dist/styles/utilities/color.css +4 -5
  15. package/dist/styles/utilities/containers.css +1 -1
  16. package/dist/styles/utilities/spacing.css +23 -23
  17. package/package.json +1 -1
package/dist/styles/generated/schemes.css CHANGED
@@ -2,58 +2,65 @@
2
2
  /* schemes */
3
3
  /* Generated from Figma CSS export - references preserved */
4
4
 
5
- --Schemes-Alert: var(--Palettes-Alert-Alert-400);
6
- --Schemes-Alert-Container: var(--Palettes-Alert-Alert-550);
7
- --Schemes-Background: var(--white-400-white);
8
- --Schemes-Border: var(--Palettes-Neutral-Neutral-400);
9
- --Schemes-Border-Variant: var(--Palettes-Neutral-Variant-Neutral-Variant-250);
10
- --Schemes-Error: var(--Palettes-Error-Error-300);
11
- --Schemes-Error-Container: var(--Palettes-Error-Error-750);
5
+ --Schemes-Alert: var(--Palettes-Alert-Alert-500);
6
+ --Schemes-Alert-Container: var(--Palettes-Alert-Alert-700);
7
+ --Schemes-Background: var(--white-750-white);
8
+ --Schemes-Border: var(--Palettes-Neutral-Neutral-550);
9
+ --Schemes-Border-high: var(--Palettes-Neutral-Variant-Neutral-Variant-350);
10
+ --Schemes-Border-low: var(--Palettes-Neutral-Neutral-650);
11
+ --Schemes-Error: var(--Palettes-Error-Error-500);
12
+ --Schemes-Error-Container: var(--Palettes-Error-Error-700);
13
+ --Schemes-Info-Container: var(--powder-blue-700-powder-blue);
12
14
  --Schemes-Inverse-Primary: var(--Palettes-Primary-Primary-400);
13
15
  --Schemes-Inverse-Surface: var(--Palettes-Neutral-Variant-Neutral-Variant-200);
14
16
  --Schemes-On-Alert: var(--Palettes-Alert-Alert-750);
15
- --Schemes-On-Alert-Container: var(--Schemes-On-Surface);
16
- --Schemes-On-Background: var(--Schemes-On-Surface);
17
- --Schemes-On-Error: var(--white-400-white);
18
- --Schemes-On-Error-Container: var(--Palettes-Error-Error-250);
19
- --Schemes-On-Inverse-Surface: var(--Palettes-Neutral-Neutral-750);
17
+ --Schemes-On-Alert-Container: var(--Palettes-Alert-Alert-50);
18
+ --Schemes-On-Background: var(--Schemes-On-Surface-High);
19
+ --Schemes-On-Error: var(--white-750-white);
20
+ --Schemes-On-Error-Container: var(--Palettes-Error-Error-350);
21
+ --Schemes-On-Info-Container: var(--union-blue-200-union-blue);
22
+ --Schemes-On-Inverse-Surface: var(--Palettes-Neutral-Neutral-700);
20
23
  --Schemes-On-Inverse-Surface-Bright: var(--Palettes-Neutral-Neutral-750);
21
- --Schemes-On-Primary: var(--white-400-white);
22
- --Schemes-On-Primary-Container: var(--Palettes-Primary-Primary-750);
24
+ --Schemes-On-Primary: var(--white-750-white);
25
+ --Schemes-On-Primary-Container: var(--Palettes-Primary-Primary-50);
23
26
  --Schemes-On-Primary-Fixed: var(--Palettes-Primary-Primary-100);
24
27
  --Schemes-On-Primary-Fixed-Variant: var(--Palettes-Primary-Primary-50);
25
- --Schemes-On-Secondary: var(--Schemes-Surface-Bright);
26
- --Schemes-On-Secondary-Container: var(--Palettes-Secondary-Secondary-750);
28
+ --Schemes-On-Secondary: var(--Palettes-Secondary-Secondary-750);
29
+ --Schemes-On-Secondary-Container: var(--Palettes-Secondary-Secondary-50);
27
30
  --Schemes-On-Secondary-Fixed: var(--Palettes-Secondary-Secondary-50);
28
31
  --Schemes-On-Secondary-Fixed-Variant: var(--Palettes-Secondary-Secondary-250);
29
- --Schemes-On-Surface: var(--black-400-black);
32
+ --Schemes-On-Success-Container: var(--Palettes-Success-Success-250);
33
+ --Schemes-On-Surface: var(--Palettes-Neutral-Neutral-200);
34
+ --Schemes-On-Surface-High: var(--Palettes-Neutral-Neutral-50);
35
+ --Schemes-On-Surface-Low: var(--Palettes-Neutral-Neutral-300);
30
36
  --Schemes-On-Surface-Variant: var(--Palettes-Neutral-Neutral-50);
31
37
  --Schemes-On-Tertiary: var(--Palettes-Tertiary-Tertiary-750);
32
- --Schemes-On-Tertiary-Container: var(--Palettes-Tertiary-Tertiary-750);
38
+ --Schemes-On-Tertiary-Container: var(--Palettes-Tertiary-Tertiary-150);
33
39
  --Schemes-On-Tertiary-Fixed: var(--Palettes-Tertiary-Tertiary-150);
34
40
  --Schemes-On-Tertiary-Fixed-Variant: var(--Palettes-Tertiary-Tertiary-50);
35
- --Schemes-Primary: var(--Palettes-Primary-Primary-400);
36
- --Schemes-Primary-Container: var(--Palettes-Primary-Primary-200);
41
+ --Schemes-Primary: var(--sixers-blue-500-sixers-blue);
42
+ --Schemes-Primary-Container: var(--Palettes-Primary-Primary-700);
37
43
  --Schemes-Primary-Fixed: var(--Palettes-Primary-Primary-650);
38
44
  --Schemes-Primary-Fixed-Dim: var(--Palettes-Primary-Primary-400);
39
- --Schemes-Scrim: var(--Extended-Colors-Black);
40
- --Schemes-Secondary: var(--Palettes-Secondary-Secondary-150);
41
- --Schemes-Secondary-Container: var(--Palettes-Secondary-Secondary-400);
45
+ --Schemes-Scrim: var(--colors-Black-50);
46
+ --Schemes-Secondary: var(--Palettes-Secondary-Secondary-250);
47
+ --Schemes-Secondary-Container: var(--Palettes-Secondary-Secondary-700);
42
48
  --Schemes-Secondary-Fixed: var(--Palettes-Secondary-Secondary-750);
43
49
  --Schemes-Secondary-Fixed-Dim: var(--Palettes-Secondary-Secondary-550);
44
- --Schemes-Shadow: var(--Extended-Colors-Black);
45
- --Schemes-Surface: var(--Palettes-Neutral-Neutral-500);
50
+ --Schemes-Success: var(--Palettes-Success-Success-500);
51
+ --Schemes-Success-Container: var(--Palettes-Success-Success-700);
52
+ --Schemes-Surface: var(--Palettes-Neutral-Neutral-700);
46
53
  --Schemes-Surface-Bright: var(--Palettes-Neutral-Neutral-750);
47
- --Schemes-Surface-Container: var(--Palettes-Neutral-Neutral-500);
54
+ --Schemes-Surface-Container: var(--Palettes-Neutral-Neutral-550);
48
55
  --Schemes-Surface-Container-High: var(--Palettes-Neutral-Neutral-400);
49
56
  --Schemes-Surface-Container-Highest: var(--Palettes-Neutral-Neutral-300);
50
- --Schemes-Surface-Container-Low: var(--Palettes-Neutral-Neutral-600);
51
- --Schemes-Surface-Container-Lowest: var(--Palettes-Neutral-Neutral-750);
52
- --Schemes-Surface-Dim: var(--Palettes-Neutral-Neutral-400);
53
- --Schemes-Surface-Tint: var(--Palettes-Secondary-Secondary-350);
54
- --Schemes-Surface-Variant: var(--Palettes-Neutral-Variant-Neutral-Variant-550);
57
+ --Schemes-Surface-Container-Low: var(--Palettes-Neutral-Neutral-650);
58
+ --Schemes-Surface-Container-Lowest: var(--Palettes-Neutral-Neutral-700);
59
+ --Schemes-Surface-Dim: var(--Palettes-Neutral-Neutral-550);
60
+ --Schemes-Surface-Tint: var(--Palettes-Secondary-Secondary-450);
61
+ --Schemes-Surface-Variant: var(--Palettes-Neutral-Variant-Neutral-Variant-600);
55
62
  --Schemes-Tertiary: var(--Palettes-Tertiary-Tertiary-150);
56
- --Schemes-Tertiary-Container: var(--Palettes-Tertiary-Tertiary-250);
63
+ --Schemes-Tertiary-Container: var(--Palettes-Tertiary-Tertiary-700);
57
64
  --Schemes-Tertiary-Fixed: var(--Palettes-Tertiary-Tertiary-600);
58
65
  --Schemes-Tertiary-Fixed-Dim: var(--Palettes-Tertiary-Tertiary-550);
59
66
  }
package/dist/styles/generated/size.css CHANGED
@@ -10,6 +10,7 @@
10
10
  --border-radius-s: var(--scale-100);
11
11
  --border-radius-xl: var(--scale-300);
12
12
  --border-radius-xs: var(--scale-50);
13
+ --border-radius-xxs: var(--scale-25);
13
14
  --border-width-2xl: var(--scale-100);
14
15
  --border-width-l: var(--scale-50);
15
16
  --border-width-m: var(--scale-25);
package/dist/styles/generated/typography.css CHANGED
@@ -147,6 +147,18 @@
147
147
  --Label-2XL-font-label-2xl-margin-top: var(--Body-2XL-font-body-2xl-margin-top);
148
148
  --Label-2XL-font-label-2xl-size: var(--Body-2XL-font-body-2xl-size);
149
149
  --Label-2XL-font-label-2xl-weight: var(--Base-font-variables-Weight-font-weight-semibold);
150
+ --Label-3XL-font-label-3xl-family: var(--Heading-font-heading-family);
151
+ --Label-3XL-font-label-3xl-lineheight: var(--scale-600);
152
+ --Label-3XL-font-label-3xl-margin-bottom: var(--scale-200);
153
+ --Label-3XL-font-label-3xl-margin-top: var(--scale-100);
154
+ --Label-3XL-font-label-3xl-size: var(--scale-450);
155
+ --Label-3XL-font-label-3xl-weight: var(--Base-font-variables-Weight-font-weight-semibold);
156
+ --Label-4XL-font-label-4xl-family: var(--Heading-font-heading-family);
157
+ --Label-4XL-font-label-4xl-lineheight: var(--scale-600);
158
+ --Label-4XL-font-label-4xl-margin-bottom: var(--scale-200);
159
+ --Label-4XL-font-label-4xl-margin-top: var(--scale-200);
160
+ --Label-4XL-font-label-4xl-size: var(--scale-500);
161
+ --Label-4XL-font-label-4xl-weight: var(--Base-font-variables-Weight-font-weight-semibold);
150
162
  --Label-Default-font-label-default-family: var(--Label-font-label-family);
151
163
  --Label-Default-font-label-default-lineheight: var(--Body-Default-font-body-default-lineheight);
152
164
  --Label-Default-font-label-default-margin-bottom: var(--Body-Default-font-body-default-margin-bottom);
@@ -309,15 +321,13 @@
309
321
  --Heading-H6-font-heading-6-lineheight: var(--scale-300);
310
322
  --Heading-H6-font-heading-6-margin-top: var(--scale-200);
311
323
  --Heading-H6-font-heading-6-size: var(--scale-200);
324
+ --Label-3XL-font-label-3xl-margin-bottom: var(--scale-300);
325
+ --Label-3XL-font-label-3xl-margin-top: var(--scale-200);
326
+ --Label-3XL-font-label-3xl-size: var(--scale-500);
327
+ --Label-4XL-font-label-4xl-lineheight: var(--scale-800);
328
+ --Label-4XL-font-label-4xl-margin-bottom: var(--scale-300);
329
+ --Label-4XL-font-label-4xl-margin-top: var(--scale-300);
330
+ --Label-4XL-font-label-4xl-size: var(--scale-600);
312
331
  --Label-ExtraSmall-font-label-xs-margin-top: var(--Body-Default-font-body-default-margin-top);
313
- --Link-on-Primary-Default-font-link-on-primary-default-weight: var(
314
- --Base-font-variables-Weight-font-weight-regular
315
- );
316
- --Link-on-Primary-ExtraLarge-font-link-on-primary-xlarge-weight: var(
317
- --Base-font-variables-Weight-font-weight-regular
318
- );
319
- --Link-on-Primary-ExtraSmall-font-link-on-primary-xs-weight: var(--Base-font-variables-Weight-font-weight-light);
320
- --Link-on-Primary-Large-font-link-on-primary-large-weight: var(--Base-font-variables-Weight-font-weight-regular);
321
- --Link-on-Primary-Small-font-link-on-primary-small-weight: var(--Base-font-variables-Weight-font-weight-light);
322
332
  }
323
333
  }
package/dist/styles/legacy.css CHANGED
@@ -53,8 +53,17 @@
53
53
  --sizes-scale-1100: var(--scale-1100);
54
54
  --sizes-scale-1200: var(--scale-1200);
55
55
 
56
- /* Extended colors aliases */
57
- --Extended-Colors-link-default-on-primary: var(--extended-colors-link-default-on-primary, #ecfdff);
58
- --Extended-Colors-link-hover-on-primary: var(--extended-colors-link-hover-on-primary, #25cef7);
59
- --Extended-Colors-link-visited-on-primary: var(--extended-colors-link-visited-on-primary, #e9ccf2);
56
+ /* Link color tokens (removed from Figma export; maintained manually here) */
57
+ --Extended-Colors-link-default: var(--Schemes-Primary);
58
+ --Extended-Colors-link-hover: var(--Schemes-On-Surface-High);
59
+ --Extended-Colors-link-visited: var(--Palettes-Visited-Visited-450);
60
+ --Extended-Colors-link-default-on-primary: #ecfdff;
61
+ --Extended-Colors-link-hover-on-primary: #25cef7;
62
+ --Extended-Colors-link-visited-on-primary: #e9ccf2;
63
+
64
+ /* --spacing-xxl was never in the Figma export; alias to spacing-2xl */
65
+ --spacing-xxl: var(--spacing-2xl);
66
+
67
+ /* --Focus-Ring-Color is defined in a component selector in Figma, not extracted to generated CSS */
68
+ --Focus-Ring-Color: var(--Schemes-Primary);
60
69
  }