@yakad/ui 1.2.38-beta → 1.2.40-beta

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/package.json +1 -1
  2. package/theme/theme.d.ts +1 -1
  3. package/theme/theme.module.css +39 -18
  4. package/theme/theme.tsx +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yakad/ui",
3
- "version": "1.2.38-beta",
3
+ "version": "1.2.40-beta",
4
4
  "description": "",
5
5
  "main": "./src/index.js",
6
6
  "scripts": {
package/theme/theme.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import React from "react";
2
2
  interface ThemeProps extends React.HTMLAttributes<HTMLElement> {
3
3
  mode?: "light" | "dark" | "system";
4
- color?: "green" | "pink" | "grow" | "blue";
4
+ color?: "green" | "pink" | "grow" | "blue" | "purple";
5
5
  }
6
6
  declare function Theme(props: ThemeProps): JSX.Element;
7
7
  export default Theme;
package/theme/theme.module.css CHANGED
@@ -309,9 +309,6 @@
309
309
  --secondaryColor: var(--LightSecondaryColor);
310
310
  --secondaryContainerColor: var(--LightSecondaryContainerColor);
311
311
  --tertiaryColor: var(--LightTertiaryColor);
312
- --tertiaryContainerColor: var(--LightTertiaryContainerColor);
313
- --backgroundColor: var(--LightBackgroundColor);
314
- --surfaceColor: var(--LightSurfaceColor);
315
312
  --errorColor: var(--LightErrorColor);
316
313
  --errorContainerColor: var(--LightErrorContainerColor);
317
314
  --onPrimaryColor: var(--LightOnPrimaryColor);
@@ -319,11 +316,21 @@
319
316
  --onSecondaryColor: var(--LightOnSecondaryColor);
320
317
  --onSecondaryContainerColor: var(--LightOnSecondaryContainerColor);
321
318
  --onTertiaryColor: var(--LightOnTertiaryColor);
322
- --onTertiaryContainerColor: var(--DarkonTertiaryContainerColor);
323
- --onBackgroundColor: var(--LightOnBackgroundColor);
324
- --onSurfaceColor: var(--LightOnSurfaceColor);
325
319
  --onErrorColor: var(--LightOnErrorColor);
326
320
  --onErrorContainerColor: var(--LightOnErrorContainerColor);
321
+ --surfaceColor: var(--LightSurfaceColor);
322
+ --surfaceVariantColor: var(--LightSurfaceVariantColor);
323
+ --surfaceDimColor: var(--LightSurfaceDimColor);
324
+ --surfaceBrightColor: var(--LightSurfaceBrightColor);
325
+ --surfaceContainerLowestColor: var(--LightSurfaceContainerLowestColor);
326
+ --surfaceContainerLowColor: var(--LightSurfaceContainerLowColor);
327
+ --surfaceContainerColor: var(--LightSurfaceContainerColor);
328
+ --surfaceContainerHightColor: var(--LightSurfaceContainerHightColor);
329
+ --surfaceContainerHighestColor: var(--LightSurfaceContainerHighestColor);
330
+ --onSurfaceColor: var(--LightOnSurfaceColor);
331
+ --onSurfaceVariantColor: var(--LightOnSurfaceVariantColor);
332
+ --outlineColor: var(--LightOutlineColor);
333
+ --outlineVariantColor: var(--LightOutlineVariantColor);
327
334
  }
328
335
  .dark {
329
336
  --primaryColor: var(--DarkPrimaryColor);
@@ -331,9 +338,6 @@
331
338
  --secondaryColor: var(--DarkSecondaryColor);
332
339
  --secondaryContainerColor: var(--DarkSecondaryContainerColor);
333
340
  --tertiaryColor: var(--DarkTertiaryColor);
334
- --tertiaryContainerColor: var(--DarkTertiaryContainerColor);
335
- --backgroundColor: var(--DarkBackgroundColor);
336
- --surfaceColor: var(--DarkSurfaceColor);
337
341
  --errorColor: var(--DarkErrorColor);
338
342
  --errorContainerColor: var(--DarkErrorContainerColor);
339
343
  --onPrimaryColor: var(--DarkOnPrimaryColor);
@@ -341,11 +345,21 @@
341
345
  --onSecondaryColor: var(--DarkOnSecondaryColor);
342
346
  --onSecondaryContainerColor: var(--DarkOnSecondaryContainerColor);
343
347
  --onTertiaryColor: var(--DarkOnTertiaryColor);
344
- --onTertiaryContainerColor: var(--DarkonTertiaryContainerColor);
345
- --onBackgroundColor: var(--DarkOnBackgroundColor);
346
- --onSurfaceColor: var(--DarkOnSurfaceColor);
347
348
  --onErrorColor: var(--DarkOnErrorColor);
348
349
  --onErrorContainerColor: var(--DarkOnErrorContainerColor);
350
+ --surfaceColor: var(--DarkSurfaceColor);
351
+ --surfaceVariantColor: var(--DarkSurfaceVariantColor);
352
+ --surfaceDimColor: var(--DarkSurfaceDimColor);
353
+ --surfaceBrightColor: var(--DarkSurfaceBrightColor);
354
+ --surfaceContainerLowestColor: var(--DarkSurfaceContainerLowestColor);
355
+ --surfaceContainerLowColor: var(--DarkSurfaceContainerLowColor);
356
+ --surfaceContainerColor: var(--DarkSurfaceContainerColor);
357
+ --surfaceContainerHightColor: var(--DarkSurfaceContainerHightColor);
358
+ --surfaceContainerHighestColor: var(--DarkSurfaceContainerHighestColor);
359
+ --onSurfaceColor: var(--DarkOnSurfaceColor);
360
+ --onSurfaceVariantColor: var(--DarkOnSurfaceVariantColor);
361
+ --outlineColor: var(--DarkOutlineColor);
362
+ --outlineVariantColor: var(--DarkOutlineVariantColor);
349
363
  }
350
364
  @media (prefers-color-scheme: dark) {
351
365
  .system {
@@ -354,9 +368,6 @@
354
368
  --secondaryColor: var(--DarkSecondaryColor);
355
369
  --secondaryContainerColor: var(--DarkSecondaryContainerColor);
356
370
  --tertiaryColor: var(--DarkTertiaryColor);
357
- --tertiaryContainerColor: var(--DarkTertiaryContainerColor);
358
- --backgroundColor: var(--DarkBackgroundColor);
359
- --surfaceColor: var(--DarkSurfaceColor);
360
371
  --errorColor: var(--DarkErrorColor);
361
372
  --errorContainerColor: var(--DarkErrorContainerColor);
362
373
  --onPrimaryColor: var(--DarkOnPrimaryColor);
@@ -364,10 +375,20 @@
364
375
  --onSecondaryColor: var(--DarkOnSecondaryColor);
365
376
  --onSecondaryContainerColor: var(--DarkOnSecondaryContainerColor);
366
377
  --onTertiaryColor: var(--DarkOnTertiaryColor);
367
- --onTertiaryContainerColor: var(--DarkonTertiaryContainerColor);
368
- --onBackgroundColor: var(--DarkOnBackgroundColor);
369
- --onSurfaceColor: var(--DarkOnSurfaceColor);
370
378
  --onErrorColor: var(--DarkOnErrorColor);
371
379
  --onErrorContainerColor: var(--DarkOnErrorContainerColor);
380
+ --surfaceColor: var(--DarkSurfaceColor);
381
+ --surfaceVariantColor: var(--DarkSurfaceVariantColor);
382
+ --surfaceDimColor: var(--DarkSurfaceDimColor);
383
+ --surfaceBrightColor: var(--DarkSurfaceBrightColor);
384
+ --surfaceContainerLowestColor: var(--DarkSurfaceContainerLowestColor);
385
+ --surfaceContainerLowColor: var(--DarkSurfaceContainerLowColor);
386
+ --surfaceContainerColor: var(--DarkSurfaceContainerColor);
387
+ --surfaceContainerHightColor: var(--DarkSurfaceContainerHightColor);
388
+ --surfaceContainerHighestColor: var(--DarkSurfaceContainerHighestColor);
389
+ --onSurfaceColor: var(--DarkOnSurfaceColor);
390
+ --onSurfaceVariantColor: var(--DarkOnSurfaceVariantColor);
391
+ --outlineColor: var(--DarkOutlineColor);
392
+ --outlineVariantColor: var(--DarkOutlineVariantColor);
372
393
  }
373
394
  }
package/theme/theme.tsx CHANGED
@@ -4,7 +4,7 @@ import styles from "./theme.module.css";
4
4
 
5
5
  interface ThemeProps extends React.HTMLAttributes<HTMLElement> {
6
6
  mode?: "light" | "dark" | "system";
7
- color?: "green" | "pink" | "grow" | "blue";
7
+ color?: "green" | "pink" | "grow" | "blue" | "purple";
8
8
  }
9
9
 
10
10
  function Theme(props: ThemeProps) {