@rolemodel/optics 2.5.1 → 2.6.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 (65) hide show
  1. package/.github/workflows/linting.yml +2 -0
  2. package/.prettierignore +3 -0
  3. package/.yarn/install-state.gz +0 -0
  4. package/CHANGELOG.md +41 -0
  5. package/README.md +16 -0
  6. package/build_token_json.js +2 -1
  7. package/dist/README.md +16 -0
  8. package/dist/css/core/tokens/base_color_tokens.css +74 -0
  9. package/dist/css/core/tokens/base_tokens.css +3 -345
  10. package/dist/css/core/tokens/index.css +2 -1
  11. package/dist/css/core/tokens/oklch/base_color_tokens.css +74 -0
  12. package/dist/css/core/tokens/oklch/index.css +3 -0
  13. package/dist/css/core/tokens/oklch/scale_color_tokens.css +1498 -0
  14. package/dist/css/core/tokens/shared_tokens.css +272 -0
  15. package/dist/css/optics+feather_icons.css +74 -73
  16. package/dist/css/optics+feather_icons.min.css +1 -1
  17. package/dist/css/optics+lucide_icons.css +74 -73
  18. package/dist/css/optics+lucide_icons.min.css +1 -1
  19. package/dist/css/optics+material_outlined_variable.css +74 -73
  20. package/dist/css/optics+material_outlined_variable.min.css +1 -1
  21. package/dist/css/optics+no_icons.css +74 -73
  22. package/dist/css/optics+no_icons.min.css +1 -1
  23. package/dist/css/optics+phosphor_icons.css +74 -73
  24. package/dist/css/optics+phosphor_icons.min.css +1 -1
  25. package/dist/css/optics+tabler_icons.css +74 -73
  26. package/dist/css/optics+tabler_icons.min.css +1 -1
  27. package/dist/css/optics-oklch+feather_icons.css +6566 -0
  28. package/dist/css/optics-oklch+feather_icons.min.css +1 -0
  29. package/dist/css/optics-oklch+lucide_icons.css +13598 -0
  30. package/dist/css/optics-oklch+lucide_icons.min.css +1 -0
  31. package/dist/css/optics-oklch+material_outlined_variable.css +5636 -0
  32. package/dist/css/optics-oklch+material_outlined_variable.min.css +1 -0
  33. package/dist/css/optics-oklch+no_icons.css +5627 -0
  34. package/dist/css/optics-oklch+no_icons.min.css +1 -0
  35. package/dist/css/optics-oklch+phosphor_icons.css +5671 -0
  36. package/dist/css/optics-oklch+phosphor_icons.min.css +1 -0
  37. package/dist/css/optics-oklch+tabler_icons.css +5638 -0
  38. package/dist/css/optics-oklch+tabler_icons.min.css +1 -0
  39. package/dist/css/optics-oklch.css +5640 -0
  40. package/dist/css/optics-oklch.min.css +1 -0
  41. package/dist/css/optics.css +74 -73
  42. package/dist/css/optics.min.css +1 -1
  43. package/dist/package.json +10 -6
  44. package/dist/tokens/tokens.json +16 -16
  45. package/dist/tools/check-contrast.cjs +47 -0
  46. package/dist/tools/contrast/builds/build.cjs +44 -0
  47. package/dist/tools/contrast/builds/hsl-build.cjs +11 -0
  48. package/dist/tools/contrast/builds/oklch-build.cjs +11 -0
  49. package/dist/tools/contrast/calc-expression.cjs +68 -0
  50. package/dist/tools/contrast/check-error.cjs +4 -0
  51. package/dist/tools/contrast/color-pair.cjs +35 -0
  52. package/dist/tools/contrast/colors/color.cjs +41 -0
  53. package/dist/tools/contrast/colors/function-color.cjs +46 -0
  54. package/dist/tools/contrast/colors/hex-color.cjs +19 -0
  55. package/dist/tools/contrast/colors/hsl-color.cjs +25 -0
  56. package/dist/tools/contrast/colors/oklch-color.cjs +36 -0
  57. package/dist/tools/contrast/colors/themed-color.cjs +37 -0
  58. package/dist/tools/contrast/contrast-check.cjs +37 -0
  59. package/dist/tools/contrast/contrast-reporter.cjs +44 -0
  60. package/dist/tools/contrast/contrast-result.cjs +15 -0
  61. package/dist/tools/contrast/css-syntax.cjs +23 -0
  62. package/dist/tools/contrast/stylesheet.cjs +174 -0
  63. package/dist/tools/contrast/theme.cjs +84 -0
  64. package/dist/tools/contrast/tool-options.cjs +50 -0
  65. package/package.json +10 -6
package/dist/css/optics+lucide_icons.css CHANGED
@@ -8065,67 +8065,6 @@ Noto Sans supports:
8065
8065
 
8066
8066
  /* Tokens */
8067
8067
  :root {
8068
- /* Color HSLs
8069
- A theme comprised of a primary, neutral, warning, danger, info, and notice colors.
8070
- */
8071
-
8072
- /* Basic Colors */
8073
-
8074
- /**
8075
- * @tokens Basic Colors
8076
- * @presenter Color
8077
- */
8078
- --op-color-white: hsl(0deg 100% 100%);
8079
- --op-color-black: hsl(0deg 0% 0%);
8080
-
8081
- /**
8082
- * @tokens Primary Colors
8083
- * @presenter Color
8084
- */
8085
- --op-color-primary-h: 216;
8086
- --op-color-primary-s: 58%;
8087
- --op-color-primary-l: 48%;
8088
-
8089
- /**
8090
- * @tokens Neutral Colors
8091
- * @presenter Color
8092
- */
8093
- --op-color-neutral-h: var(--op-color-primary-h);
8094
- --op-color-neutral-s: 4%;
8095
- --op-color-neutral-l: var(--op-color-primary-l);
8096
-
8097
- /**
8098
- * @tokens Alerts Warning Colors
8099
- * @presenter Color
8100
- */
8101
- --op-color-alerts-warning-h: 47;
8102
- --op-color-alerts-warning-s: 100%;
8103
- --op-color-alerts-warning-l: 61%;
8104
-
8105
- /**
8106
- * @tokens Alerts Danger Colors
8107
- * @presenter Color
8108
- */
8109
- --op-color-alerts-danger-h: 0;
8110
- --op-color-alerts-danger-s: 99%;
8111
- --op-color-alerts-danger-l: 76%;
8112
-
8113
- /**
8114
- * @tokens Alerts Info Colors
8115
- * @presenter Color
8116
- */
8117
- --op-color-alerts-info-h: 216;
8118
- --op-color-alerts-info-s: 58%;
8119
- --op-color-alerts-info-l: 48%;
8120
-
8121
- /**
8122
- * @tokens Alerts Notice Colors
8123
- * @presenter Color
8124
- */
8125
- --op-color-alerts-notice-h: 130;
8126
- --op-color-alerts-notice-s: 61%;
8127
- --op-color-alerts-notice-l: 64%;
8128
-
8129
8068
  /**
8130
8069
  * @tokens Opacities
8131
8070
  * @presenter Opacity
@@ -8315,18 +8254,6 @@ Noto Sans supports:
8315
8254
  --op-space-3x-large: calc(var(--op-space-scale-unit) * 4); /* 40px */
8316
8255
  --op-space-4x-large: calc(var(--op-space-scale-unit) * 8); /* 80px */
8317
8256
 
8318
- /* Shadows */
8319
-
8320
- /**
8321
- * @tokens Shadows
8322
- * @presenter Shadow
8323
- */
8324
- --op-shadow-x-small: 0 1px 2px hsl(0deg 0% 0% / 3%), 0 1px 3px hsl(0deg 0% 0% / 15%);
8325
- --op-shadow-small: 0 1px 2px hsl(0deg 0% 0% / 3%), 0 2px 6px hsl(0deg 0% 0% / 15%);
8326
- --op-shadow-medium: 0 4px 8px hsl(0deg 0% 0% / 15%), 0 1px 3px hsl(0deg 0% 0% / 3%);
8327
- --op-shadow-large: 0 6px 10px hsl(0deg 0% 0% / 15%), 0 2px 3px hsl(0deg 0% 0% / 3%);
8328
- --op-shadow-x-large: 0 8px 12px hsl(0deg 0% 0% / 15%), 0 4px 4px hsl(0deg 0% 0% / 3%);
8329
-
8330
8257
  /* Z Index */
8331
8258
 
8332
8259
  /**
@@ -8409,6 +8336,80 @@ Noto Sans supports:
8409
8336
  inset-inline-end: -100%;
8410
8337
  }
8411
8338
  }
8339
+ :root {
8340
+ /* Color HSLs
8341
+ A theme comprised of a primary, neutral, warning, danger, info, and notice colors.
8342
+ */
8343
+
8344
+ /* Basic Colors */
8345
+
8346
+ /**
8347
+ * @tokens Basic Colors
8348
+ * @presenter Color
8349
+ */
8350
+ --op-color-white: hsl(0deg 100% 100%);
8351
+ --op-color-black: hsl(0deg 0% 0%);
8352
+
8353
+ /**
8354
+ * @tokens Primary Colors
8355
+ * @presenter Color
8356
+ */
8357
+ --op-color-primary-h: 216;
8358
+ --op-color-primary-s: 58%;
8359
+ --op-color-primary-l: 48%;
8360
+
8361
+ /**
8362
+ * @tokens Neutral Colors
8363
+ * @presenter Color
8364
+ */
8365
+ --op-color-neutral-h: var(--op-color-primary-h);
8366
+ --op-color-neutral-s: 4%;
8367
+ --op-color-neutral-l: var(--op-color-primary-l);
8368
+
8369
+ /**
8370
+ * @tokens Alerts Warning Colors
8371
+ * @presenter Color
8372
+ */
8373
+ --op-color-alerts-warning-h: 47;
8374
+ --op-color-alerts-warning-s: 100%;
8375
+ --op-color-alerts-warning-l: 61%;
8376
+
8377
+ /**
8378
+ * @tokens Alerts Danger Colors
8379
+ * @presenter Color
8380
+ */
8381
+ --op-color-alerts-danger-h: 0;
8382
+ --op-color-alerts-danger-s: 99%;
8383
+ --op-color-alerts-danger-l: 76%;
8384
+
8385
+ /**
8386
+ * @tokens Alerts Info Colors
8387
+ * @presenter Color
8388
+ */
8389
+ --op-color-alerts-info-h: 216;
8390
+ --op-color-alerts-info-s: 58%;
8391
+ --op-color-alerts-info-l: 48%;
8392
+
8393
+ /**
8394
+ * @tokens Alerts Notice Colors
8395
+ * @presenter Color
8396
+ */
8397
+ --op-color-alerts-notice-h: 130;
8398
+ --op-color-alerts-notice-s: 61%;
8399
+ --op-color-alerts-notice-l: 64%;
8400
+
8401
+ /* Shadows */
8402
+
8403
+ /**
8404
+ * @tokens Shadows
8405
+ * @presenter Shadow
8406
+ */
8407
+ --op-shadow-x-small: 0 1px 2px hsl(0deg 0% 0% / 3%), 0 1px 3px hsl(0deg 0% 0% / 15%);
8408
+ --op-shadow-small: 0 1px 2px hsl(0deg 0% 0% / 3%), 0 2px 6px hsl(0deg 0% 0% / 15%);
8409
+ --op-shadow-medium: 0 4px 8px hsl(0deg 0% 0% / 15%), 0 1px 3px hsl(0deg 0% 0% / 3%);
8410
+ --op-shadow-large: 0 6px 10px hsl(0deg 0% 0% / 15%), 0 2px 3px hsl(0deg 0% 0% / 3%);
8411
+ --op-shadow-x-large: 0 8px 12px hsl(0deg 0% 0% / 15%), 0 4px 4px hsl(0deg 0% 0% / 3%);
8412
+ }
8412
8413
  :root {
8413
8414
  /* Enable light and dark mode switching */
8414
8415
  color-scheme: light dark;