@bgord/design 0.29.2 → 0.29.4

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 (80) hide show
  1. package/dist/v2/index.d.ts +6 -0
  2. package/dist/v2/main.css +861 -0
  3. package/dist/v2/main.min.css +1 -0
  4. package/dist/v2/main.min.css.br +0 -0
  5. package/dist/v2/main.min.css.gz +0 -0
  6. package/dist/{normalize.css → v2/normalize.css} +20 -15
  7. package/dist/v2/normalize.min.css +1 -0
  8. package/dist/v2/normalize.min.css.br +0 -0
  9. package/dist/v2/normalize.min.css.gz +0 -0
  10. package/package.json +15 -8
  11. package/src/animations/grow-fade-in.css +1 -1
  12. package/src/animations/shrink-fade-out.css +1 -1
  13. package/src/normalize.css +20 -15
  14. package/src/v2/index.ts +3 -0
  15. package/src/v2/tokens/backdrops-token-generator.ts +14 -0
  16. package/src/v2/tokens/border-width-token-generator.ts +17 -0
  17. package/src/v2/tokens/brand-token-generator.ts +20 -0
  18. package/src/v2/tokens/breakpoint-token-generator.ts +11 -0
  19. package/src/v2/tokens/danger-token-generator.ts +15 -0
  20. package/src/v2/tokens/font-family-token-generator.ts +13 -0
  21. package/src/v2/tokens/font-size-token-generator.ts +19 -0
  22. package/src/v2/tokens/font-weight-token-generator.ts +16 -0
  23. package/src/v2/tokens/grayscale-token-generator.ts +21 -0
  24. package/src/v2/tokens/index.ts +18 -0
  25. package/src/v2/tokens/letter-spacing-token-generator.ts +16 -0
  26. package/src/v2/tokens/line-height-token-generator.ts +16 -0
  27. package/src/v2/tokens/opacity-token-generator.ts +13 -0
  28. package/src/v2/tokens/positive-token-generator.ts +15 -0
  29. package/src/v2/tokens/radius-token-generator.ts +19 -0
  30. package/src/v2/tokens/shadow-token-generator.ts +18 -0
  31. package/src/v2/tokens/spacing-token-generator.ts +24 -0
  32. package/src/v2/tokens/template.ts +44 -0
  33. package/src/v2/tokens/warning-token-generator.ts +15 -0
  34. package/src/v2/tokens/z-index-token-generator.ts +15 -0
  35. package/src/v2/utilities/axis-placement-utility-generator.ts +28 -0
  36. package/src/v2/utilities/backdrop-utility-generator.ts +23 -0
  37. package/src/v2/utilities/background-utility-generator.ts +39 -0
  38. package/src/v2/utilities/border-color-utility-generator.ts +40 -0
  39. package/src/v2/utilities/border-width-utility-generator.ts +23 -0
  40. package/src/v2/utilities/cursor-utility-generator.ts +19 -0
  41. package/src/v2/utilities/display-utility-generator.ts +22 -0
  42. package/src/v2/utilities/flex-direction-utility-generator.ts +24 -0
  43. package/src/v2/utilities/flex-grow-utility-generator.ts +19 -0
  44. package/src/v2/utilities/flex-shrink-utility-generator.ts +19 -0
  45. package/src/v2/utilities/flex-wrap-utility-generator.ts +19 -0
  46. package/src/v2/utilities/font-color-utility-generator.ts +39 -0
  47. package/src/v2/utilities/font-family-utility-generator.ts +23 -0
  48. package/src/v2/utilities/font-size-utility-generator.ts +31 -0
  49. package/src/v2/utilities/font-weight-utility-generator.ts +23 -0
  50. package/src/v2/utilities/gap-utility-generator.ts +23 -0
  51. package/src/v2/utilities/height-utility-generator.ts +19 -0
  52. package/src/v2/utilities/index.ts +36 -0
  53. package/src/v2/utilities/letter-spacing-utility-generator.ts +23 -0
  54. package/src/v2/utilities/line-height-utility-generator.ts +23 -0
  55. package/src/v2/utilities/margin-utility-generator.ts +31 -0
  56. package/src/v2/utilities/max-height-utility-generator.ts +21 -0
  57. package/src/v2/utilities/max-width-utility-generator.ts +21 -0
  58. package/src/v2/utilities/object-fit-utility-generator.ts +25 -0
  59. package/src/v2/utilities/object-position-utility-generator.ts +27 -0
  60. package/src/v2/utilities/opacity-utility-generator.ts +23 -0
  61. package/src/v2/utilities/overflow-utility-generator.ts +19 -0
  62. package/src/v2/utilities/padding-utility-generator.ts +31 -0
  63. package/src/v2/utilities/pointer-event-utility-generator.ts +19 -0
  64. package/src/v2/utilities/position-utility-generator.ts +26 -0
  65. package/src/v2/utilities/positioners-utility-generator.ts +27 -0
  66. package/src/v2/utilities/radius-utility-generator.ts +23 -0
  67. package/src/v2/utilities/rotate-utility-generator.ts +19 -0
  68. package/src/v2/utilities/shadow-utility-generator.ts +23 -0
  69. package/src/v2/utilities/template.ts +24 -0
  70. package/src/v2/utilities/transform-utility-generator.ts +58 -0
  71. package/src/v2/utilities/width-utility-generator.ts +19 -0
  72. package/src/v2/utilities/z-index-utility-generator.ts +23 -0
  73. package/src/v2/v2-generate-css.ts +195 -0
  74. package/dist/main.css +0 -3472
  75. package/dist/main.min.css +0 -1
  76. package/dist/main.min.css.br +0 -0
  77. package/dist/main.min.css.gz +0 -0
  78. package/dist/normalize.min.css +0 -1
  79. package/dist/normalize.min.css.br +0 -0
  80. package/dist/normalize.min.css.gz +0 -0
package/dist/v2/main.min.css ADDED
@@ -0,0 +1 @@
1
+ :root{--backdrop-none:none;--backdrop-weak:rgba(0 0 0 / 0.35);--backdrop-medium:rgba(0 0 0 / 0.6);--backdrop-strong:rgba(0 0 0 / 0.75);--border-width-none:0;--border-width-hairline:1px;--border-width-thin:2px;--border-width-base:4px;--border-width-thick:6px;--border-width-heavy:12px;--border-width-unset:unset;--color-brand-50:rgb(223, 237, 255);--color-brand-100:rgb(179, 212, 255);--color-brand-200:rgb(133, 186, 255);--color-brand-300:rgb(79, 151, 239);--color-brand-400:rgb(10, 114, 218);--color-brand-500:rgb(0, 86, 170);--color-brand-600:rgb(0, 64, 132);--color-brand-700:rgb(0, 44, 95);--color-brand-800:rgb(0, 30, 69);--color-brand-900:rgb(0, 16, 44);--breakpoint-md:768px;--color-danger-100:rgb(255, 223, 220);--color-danger-300:rgb(251, 152, 144);--color-danger-500:rgb(168, 0, 25);--color-danger-700:rgb(92, 0, 9);--color-danger-900:rgb(42, 0, 2);--font-family-sans:system-ui,sans-serif;--font-family-serif:Georgia,serif;--font-family-mono:"SFMono-Regular",monospace;--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--font-size-5xl:3rem;--font-weight-light:300;--font-weight-regular:400;--font-weight-medium:500;--font-weight-bold:700;--font-weight-black:900;--font-weight-unset:unset;--color-neutral-0:rgb(246, 248, 255);--color-neutral-50:rgb(236, 238, 245);--color-neutral-100:rgb(220, 222, 229);--color-neutral-200:rgb(194, 196, 203);--color-neutral-300:rgb(162, 164, 171);--color-neutral-400:rgb(126, 128, 134);--color-neutral-500:rgb(95, 96, 102);--color-neutral-600:rgb(65, 66, 72);--color-neutral-700:rgb(37, 38, 43);--color-neutral-800:rgb(16, 17, 22);--color-neutral-900:rgb(5, 6, 9);--letter-spacing-tight:-0.01em;--letter-spacing-normal:0em;--letter-spacing-wide:0.025em;--letter-spacing-wider:0.05em;--letter-spacing-widest:0.1em;--letter-spacing-unset:unset;--line-height-none:1;--line-height-tight:1.25;--line-height-base:1.5;--line-height-loose:1.65;--line-height-display:1.1;--line-height-unset:unset;--opacity-high:0.8;--opacity-medium:0.5;--opacity-low:0.2;--color-positive-100:rgb(208, 243, 208);--color-positive-300:rgb(138, 202, 139);--color-positive-500:rgb(0, 107, 25);--color-positive-700:rgb(0, 57, 9);--color-positive-900:rgb(0, 24, 2);--radius-none:0;--radius-xs:2px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-pill:9999px;--radius-circle:50%;--radius-unset:unset;--shadow-none:none;--shadow-xs:0 1px 2px 0 rgba(0 0 0 / 0.03);--shadow-sm:0 1px 3px 0 rgba(0 0 0 / 0.05),0 1px 2px -1px rgba(0 0 0 / 0.05);--shadow-md:0 4px 6px -1px rgba(0 0 0 / 0.06),0 2px 4px -2px rgba(0 0 0 / 0.05);--shadow-lg:0 10px 15px -3px rgba(0 0 0 / 0.07),0 4px 6px -4px rgba(0 0 0 / 0.06);--shadow-xl:0 20px 25px -5px rgba(0 0 0 / 0.08),0 8px 10px -6px rgba(0 0 0 / 0.07);--shadow-inner:inset 0 2px 4px 0 rgba(0 0 0 / 0.06);--shadow-unset:unset;--spacing-0:0rem;--spacing-0-5:0.125rem;--spacing-1:0.25rem;--spacing-1-5:0.375rem;--spacing-2:0.5rem;--spacing-2-5:0.625rem;--spacing-3:0.75rem;--spacing-4:1rem;--spacing-5:1.25rem;--spacing-6:1.5rem;--spacing-8:2rem;--spacing-12:3rem;--spacing-16:4rem;--spacing-auto:auto;--color-warning-100:rgb(255, 244, 222);--color-warning-300:rgb(245, 203, 112);--color-warning-500:rgb(188, 141, 0);--color-warning-700:rgb(112, 83, 0);--color-warning-900:rgb(60, 43, 0);--z-index-negative:-1;--z-index-0:0;--z-index-1:1;--z-index-2:2;--z-index-3:3}@supports (color:color(display-p3 0 0 0%)){:root{--color-brand-50:rgb(223, 237, 255);--color-brand-100:rgb(179, 212, 255);--color-brand-200:rgb(133, 186, 255);--color-brand-500:rgb(0, 86, 170);--color-brand-600:rgb(0, 64, 132);--color-brand-700:rgb(0, 44, 95);--color-brand-800:rgb(0, 30, 69);--color-brand-900:rgb(0, 16, 44);--color-danger-100:rgb(255, 223, 220);--color-danger-500:rgb(168, 0, 25);--color-danger-700:rgb(92, 0, 9);--color-danger-900:rgb(42, 0, 2);--color-neutral-0:rgb(246, 248, 255);--color-positive-500:rgb(0, 107, 25);--color-positive-700:rgb(0, 57, 9);--color-positive-900:rgb(0, 24, 2);--color-warning-100:rgb(255, 244, 222);--color-warning-500:rgb(188, 141, 0);--color-warning-700:rgb(112, 83, 0);--color-warning-900:rgb(60, 43, 0)}@media (color-gamut:p3){:root{--color-brand-50:color(display-p3 0.87895 0.9266 1);--color-brand-100:color(display-p3 0.7166 0.82731 1);--color-brand-200:color(display-p3 0.55678 0.72518 0.99206);--color-brand-500:color(display-p3 0 0.31135 0.72487);--color-brand-600:color(display-p3 0 0.23286 0.56061);--color-brand-700:color(display-p3 0 0.15783 0.40606);--color-brand-800:color(display-p3 0 0.10522 0.29552);--color-brand-900:color(display-p3 0 0.05637 0.1906);--color-danger-100:color(display-p3 1 0.87169 0.85372);--color-danger-500:color(display-p3 0.62907 0 0.08767);--color-danger-700:color(display-p3 0.34592 0 0.02944);--color-danger-900:color(display-p3 0.15671 0 0.00636);--color-neutral-0:color(display-p3 0.96685 0.97251 0.99903);--color-positive-500:color(display-p3 0.10251 0.42781 0.06873);--color-positive-700:color(display-p3 0.01161 0.23131 0);--color-positive-900:color(display-p3 0.00252 0.09619 0);--color-warning-100:color(display-p3 1 0.95781 0.85895);--color-warning-500:color(display-p3 0.72585 0.55349 0);--color-warning-700:color(display-p3 0.433 0.32528 0);--color-warning-900:color(display-p3 0.23101 0.16787 0)}}}[data-backdrop=none]::backdrop{background:var(--backdrop-none)}[data-backdrop=weak]::backdrop{background:var(--backdrop-weak)}[data-backdrop=medium]::backdrop{background:var(--backdrop-medium)}[data-backdrop=strong]::backdrop{background:var(--backdrop-strong)}[data-bw=none]{border-width:var(--border-width-none)}[data-bw=hairline]{border-width:var(--border-width-hairline)}[data-bw=thin]{border-width:var(--border-width-thin)}[data-bw=base]{border-width:var(--border-width-base)}[data-bw=thick]{border-width:var(--border-width-thick)}[data-bw=heavy]{border-width:var(--border-width-heavy)}[data-bw=unset]{border-width:var(--border-width-unset)}[data-ff=sans]{font-family:var(--font-family-sans)}[data-ff=serif]{font-family:var(--font-family-serif)}[data-ff=mono]{font-family:var(--font-family-mono)}[data-fs=xs]{font-size:var(--font-size-xs)}[data-fs=sm]{font-size:var(--font-size-sm)}[data-fs=base]{font-size:var(--font-size-base)}[data-fs=lg]{font-size:var(--font-size-lg)}[data-fs=xl]{font-size:var(--font-size-xl)}[data-fs='2xl']{font-size:var(--font-size-2xl)}[data-fs='3xl']{font-size:var(--font-size-3xl)}[data-fs='4xl']{font-size:var(--font-size-4xl)}[data-fs='5xl']{font-size:var(--font-size-5xl)}[data-fw=light]{font-weight:var(--font-weight-light)}[data-fw=regular]{font-weight:var(--font-weight-regular)}[data-fw=medium]{font-weight:var(--font-weight-medium)}[data-fw=bold]{font-weight:var(--font-weight-bold)}[data-fw=black]{font-weight:var(--font-weight-black)}[data-fw=unset]{font-weight:var(--font-weight-unset)}[data-ls=tight]{letter-spacing:var(--letter-spacing-tight)}[data-ls=normal]{letter-spacing:var(--letter-spacing-normal)}[data-ls=wide]{letter-spacing:var(--letter-spacing-wide)}[data-ls=wider]{letter-spacing:var(--letter-spacing-wider)}[data-ls=widest]{letter-spacing:var(--letter-spacing-widest)}[data-ls=unset]{letter-spacing:var(--letter-spacing-unset)}[data-lh=none]{line-height:var(--line-height-none)}[data-lh=tight]{line-height:var(--line-height-tight)}[data-lh=base]{line-height:var(--line-height-base)}[data-lh=loose]{line-height:var(--line-height-loose)}[data-lh=display]{line-height:var(--line-height-display)}[data-lh=unset]{line-height:var(--line-height-unset)}[data-opacity=high]{opacity:var(--opacity-high)}[data-opacity=medium]{opacity:var(--opacity-medium)}[data-opacity=low]{opacity:var(--opacity-low)}[data-br=none]{border-radius:var(--radius-none)}[data-br=xs]{border-radius:var(--radius-xs)}[data-br=sm]{border-radius:var(--radius-sm)}[data-br=md]{border-radius:var(--radius-md)}[data-br=lg]{border-radius:var(--radius-lg)}[data-br=xl]{border-radius:var(--radius-xl)}[data-br=pill]{border-radius:var(--radius-pill)}[data-br=circle]{border-radius:var(--radius-circle)}[data-br=unset]{border-radius:var(--radius-unset)}[data-shadow=none]{box-shadow:var(--shadow-none)}[data-shadow=xs]{box-shadow:var(--shadow-xs)}[data-shadow=sm]{box-shadow:var(--shadow-sm)}[data-shadow=md]{box-shadow:var(--shadow-md)}[data-shadow=lg]{box-shadow:var(--shadow-lg)}[data-shadow=xl]{box-shadow:var(--shadow-xl)}[data-shadow=inner]{box-shadow:var(--shadow-inner)}[data-shadow=unset]{box-shadow:var(--shadow-unset)}[data-z=negative]{z-index:var(--z-index-negative)}[data-z='0']{z-index:var(--z-index-0)}[data-z='1']{z-index:var(--z-index-1)}[data-z='2']{z-index:var(--z-index-2)}[data-z='3']{z-index:var(--z-index-3)}[data-color=neutral-0]{color:var(--color-neutral-0)}[data-color=neutral-50]{color:var(--color-neutral-50)}[data-color=neutral-100]{color:var(--color-neutral-100)}[data-color=neutral-200]{color:var(--color-neutral-200)}[data-color=neutral-300]{color:var(--color-neutral-300)}[data-color=neutral-400]{color:var(--color-neutral-400)}[data-color=neutral-500]{color:var(--color-neutral-500)}[data-color=neutral-600]{color:var(--color-neutral-600)}[data-color=neutral-700]{color:var(--color-neutral-700)}[data-color=neutral-800]{color:var(--color-neutral-800)}[data-color=neutral-900]{color:var(--color-neutral-900)}[data-color=brand-50]{color:var(--color-brand-50)}[data-color=brand-100]{color:var(--color-brand-100)}[data-color=brand-200]{color:var(--color-brand-200)}[data-color=brand-300]{color:var(--color-brand-300)}[data-color=brand-400]{color:var(--color-brand-400)}[data-color=brand-500]{color:var(--color-brand-500)}[data-color=brand-600]{color:var(--color-brand-600)}[data-color=brand-700]{color:var(--color-brand-700)}[data-color=brand-800]{color:var(--color-brand-800)}[data-color=brand-900]{color:var(--color-brand-900)}[data-color=positive-100]{color:var(--color-positive-100)}[data-color=positive-300]{color:var(--color-positive-300)}[data-color=positive-500]{color:var(--color-positive-500)}[data-color=positive-700]{color:var(--color-positive-700)}[data-color=positive-900]{color:var(--color-positive-900)}[data-color=danger-100]{color:var(--color-danger-100)}[data-color=danger-300]{color:var(--color-danger-300)}[data-color=danger-500]{color:var(--color-danger-500)}[data-color=danger-700]{color:var(--color-danger-700)}[data-color=danger-900]{color:var(--color-danger-900)}[data-color=warning-100]{color:var(--color-warning-100)}[data-color=warning-300]{color:var(--color-warning-300)}[data-color=warning-500]{color:var(--color-warning-500)}[data-color=warning-700]{color:var(--color-warning-700)}[data-color=warning-900]{color:var(--color-warning-900)}[data-bg=neutral-0]{background:var(--color-neutral-0)}[data-bg=neutral-50]{background:var(--color-neutral-50)}[data-bg=neutral-100]{background:var(--color-neutral-100)}[data-bg=neutral-200]{background:var(--color-neutral-200)}[data-bg=neutral-300]{background:var(--color-neutral-300)}[data-bg=neutral-400]{background:var(--color-neutral-400)}[data-bg=neutral-500]{background:var(--color-neutral-500)}[data-bg=neutral-600]{background:var(--color-neutral-600)}[data-bg=neutral-700]{background:var(--color-neutral-700)}[data-bg=neutral-800]{background:var(--color-neutral-800)}[data-bg=neutral-900]{background:var(--color-neutral-900)}[data-bg=brand-50]{background:var(--color-brand-50)}[data-bg=brand-100]{background:var(--color-brand-100)}[data-bg=brand-200]{background:var(--color-brand-200)}[data-bg=brand-300]{background:var(--color-brand-300)}[data-bg=brand-400]{background:var(--color-brand-400)}[data-bg=brand-500]{background:var(--color-brand-500)}[data-bg=brand-600]{background:var(--color-brand-600)}[data-bg=brand-700]{background:var(--color-brand-700)}[data-bg=brand-800]{background:var(--color-brand-800)}[data-bg=brand-900]{background:var(--color-brand-900)}[data-bg=positive-100]{background:var(--color-positive-100)}[data-bg=positive-300]{background:var(--color-positive-300)}[data-bg=positive-500]{background:var(--color-positive-500)}[data-bg=positive-700]{background:var(--color-positive-700)}[data-bg=positive-900]{background:var(--color-positive-900)}[data-bg=danger-100]{background:var(--color-danger-100)}[data-bg=danger-300]{background:var(--color-danger-300)}[data-bg=danger-500]{background:var(--color-danger-500)}[data-bg=danger-700]{background:var(--color-danger-700)}[data-bg=danger-900]{background:var(--color-danger-900)}[data-bg=warning-100]{background:var(--color-warning-100)}[data-bg=warning-300]{background:var(--color-warning-300)}[data-bg=warning-500]{background:var(--color-warning-500)}[data-bg=warning-700]{background:var(--color-warning-700)}[data-bg=warning-900]{background:var(--color-warning-900)}[data-bc=neutral-0]{border-color:var(--color-neutral-0)}[data-bc=neutral-50]{border-color:var(--color-neutral-50)}[data-bc=neutral-100]{border-color:var(--color-neutral-100)}[data-bc=neutral-200]{border-color:var(--color-neutral-200)}[data-bc=neutral-300]{border-color:var(--color-neutral-300)}[data-bc=neutral-400]{border-color:var(--color-neutral-400)}[data-bc=neutral-500]{border-color:var(--color-neutral-500)}[data-bc=neutral-600]{border-color:var(--color-neutral-600)}[data-bc=neutral-700]{border-color:var(--color-neutral-700)}[data-bc=neutral-800]{border-color:var(--color-neutral-800)}[data-bc=neutral-900]{border-color:var(--color-neutral-900)}[data-bc=brand-50]{border-color:var(--color-brand-50)}[data-bc=brand-100]{border-color:var(--color-brand-100)}[data-bc=brand-200]{border-color:var(--color-brand-200)}[data-bc=brand-300]{border-color:var(--color-brand-300)}[data-bc=brand-400]{border-color:var(--color-brand-400)}[data-bc=brand-500]{border-color:var(--color-brand-500)}[data-bc=brand-600]{border-color:var(--color-brand-600)}[data-bc=brand-700]{border-color:var(--color-brand-700)}[data-bc=brand-800]{border-color:var(--color-brand-800)}[data-bc=brand-900]{border-color:var(--color-brand-900)}[data-bc=positive-100]{border-color:var(--color-positive-100)}[data-bc=positive-300]{border-color:var(--color-positive-300)}[data-bc=positive-500]{border-color:var(--color-positive-500)}[data-bc=positive-700]{border-color:var(--color-positive-700)}[data-bc=positive-900]{border-color:var(--color-positive-900)}[data-bc=danger-100]{border-color:var(--color-danger-100)}[data-bc=danger-300]{border-color:var(--color-danger-300)}[data-bc=danger-500]{border-color:var(--color-danger-500)}[data-bc=danger-700]{border-color:var(--color-danger-700)}[data-bc=danger-900]{border-color:var(--color-danger-900)}[data-bc=warning-100]{border-color:var(--color-warning-100)}[data-bc=warning-300]{border-color:var(--color-warning-300)}[data-bc=warning-500]{border-color:var(--color-warning-500)}[data-bc=warning-700]{border-color:var(--color-warning-700)}[data-bc=warning-900]{border-color:var(--color-warning-900)}[data-p='0']{padding:var(--spacing-0)}[data-pt='0']{padding-top:var(--spacing-0)}[data-pr='0']{padding-right:var(--spacing-0)}[data-pb='0']{padding-bottom:var(--spacing-0)}[data-pl='0']{padding-left:var(--spacing-0)}[data-px='0']{padding:0 var(--spacing-0)}[data-py='0']{padding:var(--spacing-0) 0}[data-p='0-5']{padding:var(--spacing-0-5)}[data-pt='0-5']{padding-top:var(--spacing-0-5)}[data-pr='0-5']{padding-right:var(--spacing-0-5)}[data-pb='0-5']{padding-bottom:var(--spacing-0-5)}[data-pl='0-5']{padding-left:var(--spacing-0-5)}[data-px='0-5']{padding:0 var(--spacing-0-5)}[data-py='0-5']{padding:var(--spacing-0-5) 0}[data-p='1']{padding:var(--spacing-1)}[data-pt='1']{padding-top:var(--spacing-1)}[data-pr='1']{padding-right:var(--spacing-1)}[data-pb='1']{padding-bottom:var(--spacing-1)}[data-pl='1']{padding-left:var(--spacing-1)}[data-px='1']{padding:0 var(--spacing-1)}[data-py='1']{padding:var(--spacing-1) 0}[data-p='1-5']{padding:var(--spacing-1-5)}[data-pt='1-5']{padding-top:var(--spacing-1-5)}[data-pr='1-5']{padding-right:var(--spacing-1-5)}[data-pb='1-5']{padding-bottom:var(--spacing-1-5)}[data-pl='1-5']{padding-left:var(--spacing-1-5)}[data-px='1-5']{padding:0 var(--spacing-1-5)}[data-py='1-5']{padding:var(--spacing-1-5) 0}[data-p='2']{padding:var(--spacing-2)}[data-pt='2']{padding-top:var(--spacing-2)}[data-pr='2']{padding-right:var(--spacing-2)}[data-pb='2']{padding-bottom:var(--spacing-2)}[data-pl='2']{padding-left:var(--spacing-2)}[data-px='2']{padding:0 var(--spacing-2)}[data-py='2']{padding:var(--spacing-2) 0}[data-p='2-5']{padding:var(--spacing-2-5)}[data-pt='2-5']{padding-top:var(--spacing-2-5)}[data-pr='2-5']{padding-right:var(--spacing-2-5)}[data-pb='2-5']{padding-bottom:var(--spacing-2-5)}[data-pl='2-5']{padding-left:var(--spacing-2-5)}[data-px='2-5']{padding:0 var(--spacing-2-5)}[data-py='2-5']{padding:var(--spacing-2-5) 0}[data-p='3']{padding:var(--spacing-3)}[data-pt='3']{padding-top:var(--spacing-3)}[data-pr='3']{padding-right:var(--spacing-3)}[data-pb='3']{padding-bottom:var(--spacing-3)}[data-pl='3']{padding-left:var(--spacing-3)}[data-px='3']{padding:0 var(--spacing-3)}[data-py='3']{padding:var(--spacing-3) 0}[data-p='4']{padding:var(--spacing-4)}[data-pt='4']{padding-top:var(--spacing-4)}[data-pr='4']{padding-right:var(--spacing-4)}[data-pb='4']{padding-bottom:var(--spacing-4)}[data-pl='4']{padding-left:var(--spacing-4)}[data-px='4']{padding:0 var(--spacing-4)}[data-py='4']{padding:var(--spacing-4) 0}[data-p='5']{padding:var(--spacing-5)}[data-pt='5']{padding-top:var(--spacing-5)}[data-pr='5']{padding-right:var(--spacing-5)}[data-pb='5']{padding-bottom:var(--spacing-5)}[data-pl='5']{padding-left:var(--spacing-5)}[data-px='5']{padding:0 var(--spacing-5)}[data-py='5']{padding:var(--spacing-5) 0}[data-p='6']{padding:var(--spacing-6)}[data-pt='6']{padding-top:var(--spacing-6)}[data-pr='6']{padding-right:var(--spacing-6)}[data-pb='6']{padding-bottom:var(--spacing-6)}[data-pl='6']{padding-left:var(--spacing-6)}[data-px='6']{padding:0 var(--spacing-6)}[data-py='6']{padding:var(--spacing-6) 0}[data-p='8']{padding:var(--spacing-8)}[data-pt='8']{padding-top:var(--spacing-8)}[data-pr='8']{padding-right:var(--spacing-8)}[data-pb='8']{padding-bottom:var(--spacing-8)}[data-pl='8']{padding-left:var(--spacing-8)}[data-px='8']{padding:0 var(--spacing-8)}[data-py='8']{padding:var(--spacing-8) 0}[data-p='12']{padding:var(--spacing-12)}[data-pt='12']{padding-top:var(--spacing-12)}[data-pr='12']{padding-right:var(--spacing-12)}[data-pb='12']{padding-bottom:var(--spacing-12)}[data-pl='12']{padding-left:var(--spacing-12)}[data-px='12']{padding:0 var(--spacing-12)}[data-py='12']{padding:var(--spacing-12) 0}[data-p='16']{padding:var(--spacing-16)}[data-pt='16']{padding-top:var(--spacing-16)}[data-pr='16']{padding-right:var(--spacing-16)}[data-pb='16']{padding-bottom:var(--spacing-16)}[data-pl='16']{padding-left:var(--spacing-16)}[data-px='16']{padding:0 var(--spacing-16)}[data-py='16']{padding:var(--spacing-16) 0}[data-p=auto]{padding:var(--spacing-auto)}[data-pt=auto]{padding-top:var(--spacing-auto)}[data-pr=auto]{padding-right:var(--spacing-auto)}[data-pb=auto]{padding-bottom:var(--spacing-auto)}[data-pl=auto]{padding-left:var(--spacing-auto)}[data-px=auto]{padding:0 var(--spacing-auto)}[data-py=auto]{padding:var(--spacing-auto) 0}[data-m='0']{margin:var(--spacing-0)}[data-mt='0']{margin-top:var(--spacing-0)}[data-mr='0']{margin-right:var(--spacing-0)}[data-mb='0']{margin-bottom:var(--spacing-0)}[data-ml='0']{margin-left:var(--spacing-0)}[data-mx='0']{margin:0 var(--spacing-0)}[data-my='0']{margin:var(--spacing-0) 0}[data-m='0-5']{margin:var(--spacing-0-5)}[data-mt='0-5']{margin-top:var(--spacing-0-5)}[data-mr='0-5']{margin-right:var(--spacing-0-5)}[data-mb='0-5']{margin-bottom:var(--spacing-0-5)}[data-ml='0-5']{margin-left:var(--spacing-0-5)}[data-mx='0-5']{margin:0 var(--spacing-0-5)}[data-my='0-5']{margin:var(--spacing-0-5) 0}[data-m='1']{margin:var(--spacing-1)}[data-mt='1']{margin-top:var(--spacing-1)}[data-mr='1']{margin-right:var(--spacing-1)}[data-mb='1']{margin-bottom:var(--spacing-1)}[data-ml='1']{margin-left:var(--spacing-1)}[data-mx='1']{margin:0 var(--spacing-1)}[data-my='1']{margin:var(--spacing-1) 0}[data-m='1-5']{margin:var(--spacing-1-5)}[data-mt='1-5']{margin-top:var(--spacing-1-5)}[data-mr='1-5']{margin-right:var(--spacing-1-5)}[data-mb='1-5']{margin-bottom:var(--spacing-1-5)}[data-ml='1-5']{margin-left:var(--spacing-1-5)}[data-mx='1-5']{margin:0 var(--spacing-1-5)}[data-my='1-5']{margin:var(--spacing-1-5) 0}[data-m='2']{margin:var(--spacing-2)}[data-mt='2']{margin-top:var(--spacing-2)}[data-mr='2']{margin-right:var(--spacing-2)}[data-mb='2']{margin-bottom:var(--spacing-2)}[data-ml='2']{margin-left:var(--spacing-2)}[data-mx='2']{margin:0 var(--spacing-2)}[data-my='2']{margin:var(--spacing-2) 0}[data-m='2-5']{margin:var(--spacing-2-5)}[data-mt='2-5']{margin-top:var(--spacing-2-5)}[data-mr='2-5']{margin-right:var(--spacing-2-5)}[data-mb='2-5']{margin-bottom:var(--spacing-2-5)}[data-ml='2-5']{margin-left:var(--spacing-2-5)}[data-mx='2-5']{margin:0 var(--spacing-2-5)}[data-my='2-5']{margin:var(--spacing-2-5) 0}[data-m='3']{margin:var(--spacing-3)}[data-mt='3']{margin-top:var(--spacing-3)}[data-mr='3']{margin-right:var(--spacing-3)}[data-mb='3']{margin-bottom:var(--spacing-3)}[data-ml='3']{margin-left:var(--spacing-3)}[data-mx='3']{margin:0 var(--spacing-3)}[data-my='3']{margin:var(--spacing-3) 0}[data-m='4']{margin:var(--spacing-4)}[data-mt='4']{margin-top:var(--spacing-4)}[data-mr='4']{margin-right:var(--spacing-4)}[data-mb='4']{margin-bottom:var(--spacing-4)}[data-ml='4']{margin-left:var(--spacing-4)}[data-mx='4']{margin:0 var(--spacing-4)}[data-my='4']{margin:var(--spacing-4) 0}[data-m='5']{margin:var(--spacing-5)}[data-mt='5']{margin-top:var(--spacing-5)}[data-mr='5']{margin-right:var(--spacing-5)}[data-mb='5']{margin-bottom:var(--spacing-5)}[data-ml='5']{margin-left:var(--spacing-5)}[data-mx='5']{margin:0 var(--spacing-5)}[data-my='5']{margin:var(--spacing-5) 0}[data-m='6']{margin:var(--spacing-6)}[data-mt='6']{margin-top:var(--spacing-6)}[data-mr='6']{margin-right:var(--spacing-6)}[data-mb='6']{margin-bottom:var(--spacing-6)}[data-ml='6']{margin-left:var(--spacing-6)}[data-mx='6']{margin:0 var(--spacing-6)}[data-my='6']{margin:var(--spacing-6) 0}[data-m='8']{margin:var(--spacing-8)}[data-mt='8']{margin-top:var(--spacing-8)}[data-mr='8']{margin-right:var(--spacing-8)}[data-mb='8']{margin-bottom:var(--spacing-8)}[data-ml='8']{margin-left:var(--spacing-8)}[data-mx='8']{margin:0 var(--spacing-8)}[data-my='8']{margin:var(--spacing-8) 0}[data-m='12']{margin:var(--spacing-12)}[data-mt='12']{margin-top:var(--spacing-12)}[data-mr='12']{margin-right:var(--spacing-12)}[data-mb='12']{margin-bottom:var(--spacing-12)}[data-ml='12']{margin-left:var(--spacing-12)}[data-mx='12']{margin:0 var(--spacing-12)}[data-my='12']{margin:var(--spacing-12) 0}[data-m='16']{margin:var(--spacing-16)}[data-mt='16']{margin-top:var(--spacing-16)}[data-mr='16']{margin-right:var(--spacing-16)}[data-mb='16']{margin-bottom:var(--spacing-16)}[data-ml='16']{margin-left:var(--spacing-16)}[data-mx='16']{margin:0 var(--spacing-16)}[data-my='16']{margin:var(--spacing-16) 0}[data-m=auto]{margin:var(--spacing-auto)}[data-mt=auto]{margin-top:var(--spacing-auto)}[data-mr=auto]{margin-right:var(--spacing-auto)}[data-mb=auto]{margin-bottom:var(--spacing-auto)}[data-ml=auto]{margin-left:var(--spacing-auto)}[data-mx=auto]{margin:0 var(--spacing-auto)}[data-my=auto]{margin:var(--spacing-auto) 0}[data-gap='0']{gap:var(--spacing-0)}[data-gap='0-5']{gap:var(--spacing-0-5)}[data-gap='1']{gap:var(--spacing-1)}[data-gap='1-5']{gap:var(--spacing-1-5)}[data-gap='2']{gap:var(--spacing-2)}[data-gap='2-5']{gap:var(--spacing-2-5)}[data-gap='3']{gap:var(--spacing-3)}[data-gap='4']{gap:var(--spacing-4)}[data-gap='5']{gap:var(--spacing-5)}[data-gap='6']{gap:var(--spacing-6)}[data-gap='8']{gap:var(--spacing-8)}[data-gap='12']{gap:var(--spacing-12)}[data-gap='16']{gap:var(--spacing-16)}[data-gap=auto]{gap:var(--spacing-auto)}[data-top='0']{top:var(--spacing-0)}[data-right='0']{right:var(--spacing-0)}[data-bottom='0']{bottom:var(--spacing-0)}[data-left='0']{left:var(--spacing-0)}[data-inset='0']{inset:var(--spacing-0)}[data-top='0-5']{top:var(--spacing-0-5)}[data-right='0-5']{right:var(--spacing-0-5)}[data-bottom='0-5']{bottom:var(--spacing-0-5)}[data-left='0-5']{left:var(--spacing-0-5)}[data-inset='0-5']{inset:var(--spacing-0-5)}[data-top='1']{top:var(--spacing-1)}[data-right='1']{right:var(--spacing-1)}[data-bottom='1']{bottom:var(--spacing-1)}[data-left='1']{left:var(--spacing-1)}[data-inset='1']{inset:var(--spacing-1)}[data-top='1-5']{top:var(--spacing-1-5)}[data-right='1-5']{right:var(--spacing-1-5)}[data-bottom='1-5']{bottom:var(--spacing-1-5)}[data-left='1-5']{left:var(--spacing-1-5)}[data-inset='1-5']{inset:var(--spacing-1-5)}[data-top='2']{top:var(--spacing-2)}[data-right='2']{right:var(--spacing-2)}[data-bottom='2']{bottom:var(--spacing-2)}[data-left='2']{left:var(--spacing-2)}[data-inset='2']{inset:var(--spacing-2)}[data-top='2-5']{top:var(--spacing-2-5)}[data-right='2-5']{right:var(--spacing-2-5)}[data-bottom='2-5']{bottom:var(--spacing-2-5)}[data-left='2-5']{left:var(--spacing-2-5)}[data-inset='2-5']{inset:var(--spacing-2-5)}[data-top='3']{top:var(--spacing-3)}[data-right='3']{right:var(--spacing-3)}[data-bottom='3']{bottom:var(--spacing-3)}[data-left='3']{left:var(--spacing-3)}[data-inset='3']{inset:var(--spacing-3)}[data-top='4']{top:var(--spacing-4)}[data-right='4']{right:var(--spacing-4)}[data-bottom='4']{bottom:var(--spacing-4)}[data-left='4']{left:var(--spacing-4)}[data-inset='4']{inset:var(--spacing-4)}[data-top='5']{top:var(--spacing-5)}[data-right='5']{right:var(--spacing-5)}[data-bottom='5']{bottom:var(--spacing-5)}[data-left='5']{left:var(--spacing-5)}[data-inset='5']{inset:var(--spacing-5)}[data-top='6']{top:var(--spacing-6)}[data-right='6']{right:var(--spacing-6)}[data-bottom='6']{bottom:var(--spacing-6)}[data-left='6']{left:var(--spacing-6)}[data-inset='6']{inset:var(--spacing-6)}[data-top='8']{top:var(--spacing-8)}[data-right='8']{right:var(--spacing-8)}[data-bottom='8']{bottom:var(--spacing-8)}[data-left='8']{left:var(--spacing-8)}[data-inset='8']{inset:var(--spacing-8)}[data-top='12']{top:var(--spacing-12)}[data-right='12']{right:var(--spacing-12)}[data-bottom='12']{bottom:var(--spacing-12)}[data-left='12']{left:var(--spacing-12)}[data-inset='12']{inset:var(--spacing-12)}[data-top='16']{top:var(--spacing-16)}[data-right='16']{right:var(--spacing-16)}[data-bottom='16']{bottom:var(--spacing-16)}[data-left='16']{left:var(--spacing-16)}[data-inset='16']{inset:var(--spacing-16)}[data-top=auto]{top:var(--spacing-auto)}[data-right=auto]{right:var(--spacing-auto)}[data-bottom=auto]{bottom:var(--spacing-auto)}[data-left=auto]{left:var(--spacing-auto)}[data-inset=auto]{inset:var(--spacing-auto)}[data-max-width='100%']{max-width:100%}[data-max-width=unset]{max-width:unset}[data-max-width=breakpoint-md]{max-width:768px}[data-max-height='100%']{max-height:100%}[data-max-height=unset]{max-height:unset}[data-max-height=breakpoint-md]{max-height:768px}[data-display=flex]{display:flex;flex-wrap:wrap}[data-display=flex]{display:flex}[data-display=block]{display:block}[data-display=inline-block]{display:inline-block}[data-display=none]{display:none}[data-cursor=wait]{cursor:wait}[data-cursor=auto]{cursor:auto}[data-cursor=pointer]{cursor:pointer}[data-cursor=not-allowed]{cursor:not-allowed}[data-object-fit=contain]{object-fit:contain}[data-object-fit=cover]{object-fit:cover}[data-object-fit=fill]{object-fit:fill}[data-object-fit=scale-down]{object-fit:scale-down}[data-object-fit=none]{object-fit:none}[data-position=static]{position:static}[data-position=relative]{position:relative}[data-position=absolute]{position:absolute}[data-position=fixed]{position:fixed}[data-position=sticky]{position:sticky}[data-position=unset]{position:unset}[data-rotate='0']{transform:rotate(0)}[data-rotate='90']{transform:rotate(90deg)}[data-rotate='180']{transform:rotate(180deg)}[data-rotate='270']{transform:rotate(270deg)}[data-object-position=top]{object-position:top}[data-object-position=bottom]{object-position:bottom}[data-object-position=left]{object-position:left}[data-object-position=right]{object-position:right}[data-object-position=center]{object-position:center}[data-object-position=top-left]{object-position:top left}[data-object-position=top-right]{object-position:top right}[data-pointer-events=none]{pointer-events:none}[data-pointer-events=auto]{pointer-events:auto}[data-overflow=auto]{overflow:auto}[data-overflow=scroll]{overflow:scroll}[data-overflow=hidden]{overflow:hidden}[data-direction=row]{flex-direction:row}[data-direction=row-reverse]{flex-direction:row-reverse}[data-direction=column]{flex-direction:column}[data-direction=column-reverse]{flex-direction:column-reverse}[data-main=start]{justify-content:flex-start}[data-cross=start]{align-items:flex-start}[data-main=end]{justify-content:flex-end}[data-cross=end]{align-items:flex-end}[data-main=around]{justify-content:space-around}[data-cross=around]{align-items:space-around}[data-main=evenly]{justify-content:space-evenly}[data-cross=evenly]{align-items:space-evenly}[data-main=between]{justify-content:space-between}[data-cross=between]{align-items:space-between}[data-main=center]{justify-content:center}[data-cross=center]{align-items:center}[data-main=baseline]{justify-content:baseline}[data-cross=baseline]{align-items:baseline}[data-grow='1']{flex-grow:1}[data-grow=unset]{flex-grow:unset}[data-shrink='0']{flex-shrink:0}[data-shrink=unset]{flex-shrink:unset}[data-wrap=nowrap]{flex-wrap:nowrap}[data-wrap=wrap]{flex-wrap:wrap}[data-wrap=wrap-reverse]{flex-wrap:wrap-reverse}[data-wrap=unset]{flex-wrap:unset}[data-transform~=uppercase]{text-transform:uppercase}[data-transform~=lowercase]{text-transform:lowercase}[data-transform~=capitalize]{text-transform:capitalize}[data-transform~=upper-first]:first-letter{text-transform:uppercase}[data-transform~=truncate]{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}[data-transform~=center]{text-align:center}[data-transform~=nowrap]{white-space:nowrap}[data-transform~=none]{text-transform:none}[data-transform~=line-clamp]{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--lines,2);overflow:hidden}[data-width='100%']{width:100%}[data-width=auto]{width:auto}[data-width=unset]{width:unset}[data-height='100%']{height:100%}[data-height=auto]{height:auto}[data-height=unset]{height:unset}
package/dist/v2/main.min.css.br ADDED
Binary file
package/dist/v2/main.min.css.gz ADDED
Binary file
package/dist/{normalize.css → v2/normalize.css} RENAMED
@@ -9,8 +9,24 @@
9
9
  * 3. Prevent content repositioning when vertical scrollbar appears.
10
10
  */
11
11
 
12
+ :root {
13
+ --lh-base: 1.5; /* body text */
14
+ --lh-tight: 1.25; /* headings */
15
+ }
16
+
12
17
  html {
13
- line-height: 1.15; /* 1 */ /* 2 */
18
+ line-height: 1.15;
19
+ } /* keep normalize’s fix */
20
+ body {
21
+ line-height: var(--lh-base);
22
+ } /* readable default */
23
+ h1,
24
+ h2,
25
+ h3 {
26
+ line-height: var(--lh-tight);
27
+ }
28
+
29
+ html { /* 2 */
14
30
  -webkit-text-size-adjust: none; /* 2 */
15
31
  text-size-adjust: none; /* 2 */
16
32
  overflow-y: scroll; /* 3 */
@@ -18,17 +34,15 @@ html {
18
34
 
19
35
  /**
20
36
  * 1. Add default box-sizing.
21
- * 2. Set default line-height.
22
- * 3. Remove padding/margin by default.
37
+ * 2. Remove padding/margin by default.
23
38
  */
24
39
 
25
40
  *,
26
41
  *::before,
27
42
  *::after {
28
43
  box-sizing: border-box; /* 1 */
29
- line-height: 24px; /* 2 */
30
- padding: 0; /* 3 */
31
- margin: 0; /* 3 */
44
+ padding: 0; /* 2 */
45
+ margin: 0; /* 2 */
32
46
  }
33
47
 
34
48
  /* Sections
@@ -140,15 +154,6 @@ samp {
140
154
  font-size: 1em; /* 2 */
141
155
  }
142
156
 
143
- /**
144
- * Add the correct font size in all browsers.
145
- */
146
-
147
- small {
148
- display: block;
149
- font-size: 12px;
150
- }
151
-
152
157
  /**
153
158
  * Prevent `sub` and `sup` elements from affecting the line height in
154
159
  * all browsers.
package/dist/v2/normalize.min.css ADDED
@@ -0,0 +1 @@
1
+ /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */:root{--lh-base:1.5;--lh-tight:1.25}html{line-height:1.15}body{line-height:var(--lh-base)}h1,h2,h3{line-height:var(--lh-tight)}html{-webkit-text-size-adjust:none;text-size-adjust:none;overflow-y:scroll}*,::after,::before{box-sizing:border-box;padding:0;margin:0}body,html{margin:0;font-family:sans-serif;font-size:16px;height:100%;-webkit-font-smoothing:antialiased}main{display:block}h1{font-size:2em;margin:0}h1,h2,h3,h4{text-wrap:balance}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;-webkit-text-decoration:underline;text-decoration:underline}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace;font-size:1em}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{appearance:none;margin:0}input[type=number]{appearance:textfield}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}ul{list-style:none}
package/dist/v2/normalize.min.css.br ADDED
Binary file
package/dist/v2/normalize.min.css.gz ADDED
Binary file
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bgord/design",
3
- "version": "0.29.2",
3
+ "version": "0.29.4",
4
4
  "author": "Bartosz Gordon",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/bgord-design.esm.js",
@@ -8,13 +8,14 @@
8
8
  "@biomejs/biome": "2.0.6",
9
9
  "@commitlint/cli": "19.8.1",
10
10
  "@commitlint/config-conventional": "19.8.1",
11
- "@types/bun": "1.2.18",
11
+ "@types/bun": "1.2.19",
12
+ "@types/culori": "^4.0.0",
12
13
  "@types/lodash": "4.17.20",
13
14
  "clean-css-cli": "5.6.3",
14
- "cspell": "9.1.5",
15
+ "cspell": "9.2.0",
15
16
  "doiuse": "6.0.5",
16
17
  "gzip-cli": "1.2.0",
17
- "knip": "5.61.3",
18
+ "knip": "5.62.0",
18
19
  "lefthook": "1.12.2",
19
20
  "only-allow": "1.2.1",
20
21
  "postcss": "8.5.6",
@@ -29,13 +30,19 @@
29
30
  ],
30
31
  "license": "MIT",
31
32
  "scripts": {
32
- "build": "bun build src/index.ts --format esm --outdir dist",
33
- "postbuild": "bash scripts/prepare-css-files.sh",
34
- "prepublish": "bash scripts/prepare-css-files.sh",
33
+ "v1-build": "bun build src/index.ts --format esm --outdir dist",
34
+ "build": "bun build src/v2/index.ts --format esm --outdir dist/v2",
35
+ "postbuild": "bash scripts/v2-prepare-css-files.sh",
36
+ "prepublish": "bash scripts/v2-prepare-css-files.sh",
35
37
  "preinstall": "bunx only-allow bun"
36
38
  },
37
- "typings": "dist/index.d.ts",
39
+ "types": "./dist/v2/index.d.ts",
40
+ "exports": {
41
+ "import": "./dist/index.js",
42
+ "types": "./dist/v2/index.d.ts"
43
+ },
38
44
  "dependencies": {
45
+ "culori": "^4.0.2",
39
46
  "lodash": "4.17.21"
40
47
  }
41
48
  }
package/src/animations/grow-fade-in.css CHANGED
@@ -12,7 +12,7 @@
12
12
  }
13
13
  }
14
14
 
15
- [data-exit="grow-fade-in"] {
15
+ [data-animation="grow-fade-in"] {
16
16
  animation: grow-fade-in 140ms ease forwards;
17
17
  }
18
18
 
package/src/animations/shrink-fade-out.css CHANGED
@@ -8,7 +8,7 @@
8
8
  }
9
9
  }
10
10
 
11
- [data-exit="shrink-fade-out"] {
11
+ [data-animation="shrink-fade-out"] {
12
12
  animation: shrink-fade-out 140ms ease forwards;
13
13
  }
14
14
 
package/src/normalize.css CHANGED
@@ -9,8 +9,24 @@
9
9
  * 3. Prevent content repositioning when vertical scrollbar appears.
10
10
  */
11
11
 
12
+ :root {
13
+ --lh-base: 1.5; /* body text */
14
+ --lh-tight: 1.25; /* headings */
15
+ }
16
+
17
+ html {
18
+ line-height: 1.15;
19
+ } /* keep normalize’s fix */
20
+ body {
21
+ line-height: var(--lh-base);
22
+ } /* readable default */
23
+ h1,
24
+ h2,
25
+ h3 {
26
+ line-height: var(--lh-tight);
27
+ }
28
+
12
29
  html {
13
- line-height: 1.15; /* 1 */
14
30
  -moz-text-size-adjust: none; /* 2 */
15
31
  -webkit-text-size-adjust: none; /* 2 */
16
32
  text-size-adjust: none; /* 2 */
@@ -19,17 +35,15 @@ html {
19
35
 
20
36
  /**
21
37
  * 1. Add default box-sizing.
22
- * 2. Set default line-height.
23
- * 3. Remove padding/margin by default.
38
+ * 2. Remove padding/margin by default.
24
39
  */
25
40
 
26
41
  *,
27
42
  *::before,
28
43
  *::after {
29
44
  box-sizing: border-box; /* 1 */
30
- line-height: 24px; /* 2 */
31
- padding: 0; /* 3 */
32
- margin: 0; /* 3 */
45
+ padding: 0; /* 2 */
46
+ margin: 0; /* 2 */
33
47
  }
34
48
 
35
49
  /* Sections
@@ -140,15 +154,6 @@ samp {
140
154
  font-size: 1em; /* 2 */
141
155
  }
142
156
 
143
- /**
144
- * Add the correct font size in all browsers.
145
- */
146
-
147
- small {
148
- display: block;
149
- font-size: 12px;
150
- }
151
-
152
157
  /**
153
158
  * Prevent `sub` and `sup` elements from affecting the line height in
154
159
  * all browsers.
package/src/v2/index.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { main } from "./v2-generate-css";
2
+
3
+ main();
package/src/v2/tokens/backdrops-token-generator.ts ADDED
@@ -0,0 +1,14 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class BackdropsTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "backdrop-none": "none",
6
+ "backdrop-weak": "rgba(0 0 0 / 0.35)",
7
+ "backdrop-medium": "rgba(0 0 0 / 0.6)",
8
+ "backdrop-strong": "rgba(0 0 0 / 0.75)",
9
+ };
10
+
11
+ constructor(overrides: TokenConfigType = {}) {
12
+ super("Backdrops", overrides);
13
+ }
14
+ }
package/src/v2/tokens/border-width-token-generator.ts ADDED
@@ -0,0 +1,17 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class BorderWidthTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "border-width-none": "0",
6
+ "border-width-hairline": "1px",
7
+ "border-width-thin": "2px",
8
+ "border-width-base": "4px",
9
+ "border-width-thick": "6px",
10
+ "border-width-heavy": "12px",
11
+ "border-width-unset": "unset",
12
+ };
13
+
14
+ constructor(overrides: TokenConfigType = {}) {
15
+ super("BorderWidth", overrides);
16
+ }
17
+ }
package/src/v2/tokens/brand-token-generator.ts ADDED
@@ -0,0 +1,20 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class BrandTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "color-brand-50": "oklch(0.94 0.07 255)",
6
+ "color-brand-100": "oklch(0.86 0.10 255)",
7
+ "color-brand-200": "oklch(0.78 0.12 255)",
8
+ "color-brand-300": "oklch(0.67 0.15 255)",
9
+ "color-brand-400": "oklch(0.56 0.18 255)",
10
+ "color-brand-500": "oklch(0.46 0.20 255)",
11
+ "color-brand-600": "oklch(0.38 0.18 255)",
12
+ "color-brand-700": "oklch(0.30 0.17 255)",
13
+ "color-brand-800": "oklch(0.24 0.15 255)",
14
+ "color-brand-900": "oklch(0.18 0.12 255)",
15
+ };
16
+
17
+ constructor(overrides: TokenConfigType = {}) {
18
+ super("Brand", overrides);
19
+ }
20
+ }
package/src/v2/tokens/breakpoint-token-generator.ts ADDED
@@ -0,0 +1,11 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class BreakpointTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "breakpoint-md": "768px",
6
+ };
7
+
8
+ constructor(overrides: TokenConfigType = {}) {
9
+ super("Breakpoint", overrides);
10
+ }
11
+ }
package/src/v2/tokens/danger-token-generator.ts ADDED
@@ -0,0 +1,15 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class DangerTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "color-danger-100": "oklch(0.93 0.06 25)",
6
+ "color-danger-300": "oklch(0.78 0.12 25)",
7
+ "color-danger-500": "oklch(0.46 0.22 25)",
8
+ "color-danger-700": "oklch(0.30 0.18 25)",
9
+ "color-danger-900": "oklch(0.18 0.12 25)",
10
+ };
11
+
12
+ constructor(overrides: TokenConfigType = {}) {
13
+ super("Danger", overrides);
14
+ }
15
+ }
package/src/v2/tokens/font-family-token-generator.ts ADDED
@@ -0,0 +1,13 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class FontFamilyTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "font-family-sans": "system-ui, sans-serif",
6
+ "font-family-serif": "Georgia, serif",
7
+ "font-family-mono": '"SFMono-Regular", monospace',
8
+ };
9
+
10
+ constructor(overrides: TokenConfigType = {}) {
11
+ super("FontFamily", overrides);
12
+ }
13
+ }
package/src/v2/tokens/font-size-token-generator.ts ADDED
@@ -0,0 +1,19 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class FontSizeTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "font-size-xs": "0.75rem", // 12 px
6
+ "font-size-sm": "0.875rem", // 14 px
7
+ "font-size-base": "1rem", // 16 px ← default body
8
+ "font-size-lg": "1.125rem", // 18 px
9
+ "font-size-xl": "1.25rem", // 20 px
10
+ "font-size-2xl": "1.5rem", // 24 px
11
+ "font-size-3xl": "1.875rem", // 30 px
12
+ "font-size-4xl": "2.25rem", // 36 px
13
+ "font-size-5xl": "3rem", // 48 px
14
+ };
15
+
16
+ constructor(overrides: TokenConfigType = {}) {
17
+ super("FontSize", overrides);
18
+ }
19
+ }
package/src/v2/tokens/font-weight-token-generator.ts ADDED
@@ -0,0 +1,16 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class FontWeightTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "font-weight-light": "300",
6
+ "font-weight-regular": "400",
7
+ "font-weight-medium": "500",
8
+ "font-weight-bold": "700",
9
+ "font-weight-black": "900",
10
+ "font-weight-unset": "unset",
11
+ };
12
+
13
+ constructor(overrides: TokenConfigType = {}) {
14
+ super("FontWeight", overrides);
15
+ }
16
+ }
package/src/v2/tokens/grayscale-token-generator.ts ADDED
@@ -0,0 +1,21 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class GrayscaleTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "color-neutral-0": "oklch(0.98 0.01 275)", // surface-0 (pure white)
6
+ "color-neutral-50": "oklch(0.95 0.01 275)", // subtle panel bg
7
+ "color-neutral-100": "oklch(0.90 0.01 275)", // card bg / input bg
8
+ "color-neutral-200": "oklch(0.82 0.01 275)", // borders
9
+ "color-neutral-300": "oklch(0.72 0.01 275)", // dividers / disabled icon
10
+ "color-neutral-400": "oklch(0.60 0.01 275)", // secondary text
11
+ "color-neutral-500": "oklch(0.49 0.01 275)", // tertiary text
12
+ "color-neutral-600": "oklch(0.38 0.01 275)", // primary body text
13
+ "color-neutral-700": "oklch(0.27 0.01 275)", // headings
14
+ "color-neutral-800": "oklch(0.18 0.01 275)", // raised border on dark UI
15
+ "color-neutral-900": "oklch(0.12 0.01 275)", // surface-0 in **dark** theme
16
+ };
17
+
18
+ constructor(overrides: TokenConfigType = {}) {
19
+ super("Grayscale", overrides);
20
+ }
21
+ }
package/src/v2/tokens/index.ts ADDED
@@ -0,0 +1,18 @@
1
+ export * from "./backdrops-token-generator";
2
+ export * from "./border-width-token-generator";
3
+ export * from "./brand-token-generator";
4
+ export * from "./breakpoint-token-generator";
5
+ export * from "./danger-token-generator";
6
+ export * from "./font-family-token-generator";
7
+ export * from "./font-size-token-generator";
8
+ export * from "./font-weight-token-generator";
9
+ export * from "./grayscale-token-generator";
10
+ export * from "./letter-spacing-token-generator";
11
+ export * from "./line-height-token-generator";
12
+ export * from "./opacity-token-generator";
13
+ export * from "./positive-token-generator";
14
+ export * from "./radius-token-generator";
15
+ export * from "./shadow-token-generator";
16
+ export * from "./spacing-token-generator";
17
+ export * from "./warning-token-generator";
18
+ export * from "./z-index-token-generator";
package/src/v2/tokens/letter-spacing-token-generator.ts ADDED
@@ -0,0 +1,16 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class LetterSpacingTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "letter-spacing-tight": "-0.01em", // logo lock-ups, large headlines
6
+ "letter-spacing-normal": "0em", // default
7
+ "letter-spacing-wide": "0.025em", // buttons, small caps
8
+ "letter-spacing-wider": "0.05em", // overlines, badge labels
9
+ "letter-spacing-widest": "0.1em", // tiny UI meta text
10
+ "letter-spacing-unset": "unset",
11
+ };
12
+
13
+ constructor(overrides: TokenConfigType = {}) {
14
+ super("LetterSpacing", overrides);
15
+ }
16
+ }
package/src/v2/tokens/line-height-token-generator.ts ADDED
@@ -0,0 +1,16 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class LineHeightTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "line-height-none": "1", // tightest, icon buttons
6
+ "line-height-tight": "1.25", // headings h1–h3
7
+ "line-height-base": "1.5", // body copy (16 px → 24 px)
8
+ "line-height-loose": "1.65", // long-form prose / lists
9
+ "line-height-display": "1.1", // hero display text
10
+ "line-height-unset": "unset",
11
+ };
12
+
13
+ constructor(overrides: TokenConfigType = {}) {
14
+ super("LineHeight", overrides);
15
+ }
16
+ }
package/src/v2/tokens/opacity-token-generator.ts ADDED
@@ -0,0 +1,13 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class OpacityTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "opacity-high": "0.8",
6
+ "opacity-medium": "0.5",
7
+ "opacity-low": "0.2",
8
+ };
9
+
10
+ constructor(overrides: TokenConfigType = {}) {
11
+ super("Opacity", overrides);
12
+ }
13
+ }
package/src/v2/tokens/positive-token-generator.ts ADDED
@@ -0,0 +1,15 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class PositiveTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "color-positive-100": "oklch(0.93 0.06 145)",
6
+ "color-positive-300": "oklch(0.78 0.11 145)",
7
+ "color-positive-500": "oklch(0.46 0.18 145)",
8
+ "color-positive-700": "oklch(0.30 0.15 145)",
9
+ "color-positive-900": "oklch(0.18 0.12 145)",
10
+ };
11
+
12
+ constructor(overrides: TokenConfigType = {}) {
13
+ super("Positive", overrides);
14
+ }
15
+ }
package/src/v2/tokens/radius-token-generator.ts ADDED
@@ -0,0 +1,19 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class RadiusTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "radius-none": "0",
6
+ "radius-xs": "2px",
7
+ "radius-sm": "4px",
8
+ "radius-md": "8px",
9
+ "radius-lg": "12px",
10
+ "radius-xl": "16px",
11
+ "radius-pill": "9999px",
12
+ "radius-circle": "50%",
13
+ "radius-unset": "unset",
14
+ };
15
+
16
+ constructor(overrides: TokenConfigType = {}) {
17
+ super("Radius", overrides);
18
+ }
19
+ }
package/src/v2/tokens/shadow-token-generator.ts ADDED
@@ -0,0 +1,18 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class ShadowTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "shadow-none": "none",
6
+ "shadow-xs": "0 1px 2px 0 rgba(0 0 0 / 0.03)",
7
+ "shadow-sm": "0 1px 3px 0 rgba(0 0 0 / 0.05), 0 1px 2px -1px rgba(0 0 0 / 0.05)",
8
+ "shadow-md": "0 4px 6px -1px rgba(0 0 0 / 0.06), 0 2px 4px -2px rgba(0 0 0 / 0.05)",
9
+ "shadow-lg": "0 10px 15px -3px rgba(0 0 0 / 0.07), 0 4px 6px -4px rgba(0 0 0 / 0.06)",
10
+ "shadow-xl": "0 20px 25px -5px rgba(0 0 0 / 0.08), 0 8px 10px -6px rgba(0 0 0 / 0.07)",
11
+ "shadow-inner": "inset 0 2px 4px 0 rgba(0 0 0 / 0.06)",
12
+ "shadow-unset": "unset",
13
+ };
14
+
15
+ constructor(overrides: TokenConfigType = {}) {
16
+ super("Shadow", overrides);
17
+ }
18
+ }
package/src/v2/tokens/spacing-token-generator.ts ADDED
@@ -0,0 +1,24 @@
1
+ import { TokenConfigType, TokenGenerator } from "./template";
2
+
3
+ export class SpacingTokenGenerator extends TokenGenerator {
4
+ base: TokenConfigType = {
5
+ "spacing-0": "0rem", // 0 px
6
+ "spacing-0-5": "0.125rem", // 2 px
7
+ "spacing-1": "0.25rem", // 4 px
8
+ "spacing-1-5": "0.375rem", // 6 px
9
+ "spacing-2": "0.5rem", // 8 px
10
+ "spacing-2-5": "0.625rem", // 10 px
11
+ "spacing-3": "0.75rem", // 12 px
12
+ "spacing-4": "1rem", // 16 px - default body
13
+ "spacing-5": "1.25rem", // 20 px
14
+ "spacing-6": "1.5rem", // 24 px
15
+ "spacing-8": "2rem", // 32 px
16
+ "spacing-12": "3rem", // 48 px
17
+ "spacing-16": "4rem", // 64 px
18
+ "spacing-auto": "auto",
19
+ };
20
+
21
+ constructor(overrides: TokenConfigType = {}) {
22
+ super("Spacing", overrides);
23
+ }
24
+ }
package/src/v2/tokens/template.ts ADDED
@@ -0,0 +1,44 @@
1
+ export type TokenType = string;
2
+
3
+ export type TokenConfigType = Record<string, TokenType>;
4
+
5
+ export abstract class TokenGenerator {
6
+ abstract base: TokenConfigType;
7
+ overrides: TokenConfigType;
8
+
9
+ name: string;
10
+
11
+ constructor(name: string, overrides: TokenConfigType) {
12
+ this.name = name;
13
+ this.overrides = overrides;
14
+ }
15
+
16
+ getConfig() {
17
+ return { ...this.base, ...this.overrides };
18
+ }
19
+
20
+ getTokens(): string {
21
+ const config = this.getConfig();
22
+
23
+ let result = `/* ${this.name} */\n`;
24
+
25
+ for (const [name, value] of Object.entries(config)) {
26
+ result += `--${name}: ${value};\n`;
27
+ }
28
+
29
+ return result;
30
+ }
31
+
32
+ toTypeScript(): string {
33
+ const config = this.getConfig();
34
+
35
+ return `
36
+ export const ${this.name}Tokens = ${JSON.stringify(config)} as const;
37
+
38
+ export type ${this.name}TokenType = ${Object.keys(config)
39
+ .map((token) => `"${token}"`)
40
+ .join(" | ")
41
+ .toString()};
42
+ `;
43
+ }
44
+ }