@codenhub/styles 0.1.1 → 0.3.0

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 (42) hide show
  1. package/README.md +2 -1
  2. package/dist/aesthetics/chunky-tile.css +1 -1
  3. package/dist/aesthetics/index.css +1 -1
  4. package/dist/components.css +1 -1
  5. package/dist/index.css +1 -1
  6. package/dist/native.css +1 -1
  7. package/dist/palette.css +1 -0
  8. package/dist/theme.css +1 -1
  9. package/dist/tw/aesthetics/chunky-tile.css +16 -0
  10. package/dist/tw/box.css +24 -2
  11. package/dist/tw/components/button.css +22 -33
  12. package/dist/tw/components/feedback.css +87 -48
  13. package/dist/tw/components/form.css +139 -45
  14. package/dist/tw/components/index.css +1 -1
  15. package/dist/tw/components/loader.css +2 -16
  16. package/dist/tw/components/surface.css +93 -0
  17. package/dist/tw/components/tooltip.css +102 -91
  18. package/dist/tw/elevation.css +43 -7
  19. package/dist/tw/index.css +7 -4
  20. package/dist/tw/intent.css +16 -12
  21. package/dist/tw/palette.css +451 -0
  22. package/dist/tw/reset.css +21 -0
  23. package/dist/tw/theme.css +54 -8
  24. package/dist/tw/utilities/content.css +90 -16
  25. package/dist/tw/utilities/index.css +1 -1
  26. package/dist/tw/utilities/layout.css +33 -0
  27. package/docs/accessibility.md +34 -23
  28. package/docs/changelog/0.2.0.md +41 -0
  29. package/docs/changelog/0.3.0.md +15 -0
  30. package/docs/changelog/index.md +2 -0
  31. package/docs/concepts.md +1 -0
  32. package/docs/setup.md +42 -22
  33. package/docs/usage/aesthetics.md +4 -3
  34. package/docs/usage/buttons.md +17 -13
  35. package/docs/usage/composing.md +28 -21
  36. package/docs/usage/content-and-layout.md +10 -3
  37. package/docs/usage/customizing.md +27 -0
  38. package/docs/usage/feedback.md +18 -10
  39. package/docs/usage/forms.md +36 -26
  40. package/docs/usage/tooltips.md +48 -22
  41. package/llms-full.txt +318 -143
  42. package/package.json +9 -2
package/README.md CHANGED
@@ -34,6 +34,7 @@ For the Tailwind CSS v4 entrypoint, theme selection, the intent/presentation axe
34
34
  - [Usage](./docs/usage/index.md): Composing, theming, customizing, aesthetics, and each component family.
35
35
  - [Integrating](./docs/integrating/index.md): Wiring the stylesheet into Next.js, Vue, Svelte, Astro, or a Tailwind CSS v4 build.
36
36
  - [Accessibility](./docs/accessibility.md): CSS accessibility hooks and non-goals.
37
+ - [Changelog](./docs/changelog/index.md): Release history, including breaking changes.
37
38
 
38
39
  ## Requirements
39
40
 
@@ -46,7 +47,7 @@ For the Tailwind CSS v4 entrypoint, theme selection, the intent/presentation axe
46
47
 
47
48
  ## Notes
48
49
 
49
- This package has no JavaScript behavior. `--layout-gap` replaces the removed `--layout-stack-gap` and `--layout-cluster-gap` tokens, and `--color-text-subtle` is removed because nothing read it; no compatibility aliases are provided.
50
+ This package has no JavaScript behavior; no version provides compatibility aliases for a removed class or token. `0.2.0` removes `.btn.loading` (compose a disabled `.btn` with a `.loader` child instead) and `.alert.icon`'s built-in glyph (drop a consumer-supplied icon into `.alert-icon` instead), and `.tooltip` now requires a `.tooltip-bubble` child element rather than a `data-tooltip` attribute. See the [changelog](./docs/changelog/index.md) for the complete history.
50
51
 
51
52
  ## License
52
53
 
package/dist/aesthetics/chunky-tile.css CHANGED
@@ -1 +1 @@
1
- .chunky-tile{--_tile-lift:var(--tile-lift,4px);--_tile-radius:var(--tile-radius,.75rem);--ui-ink:light-dark(var(--color-neutral-400),var(--color-neutral-600));--ui-radius:var(--_tile-radius);--ui-radius-surface:var(--_tile-radius);--ui-border-width:2px;--ui-border-max:100px;--elevation-color:#000;--ui-shadow-ink:72%;--ui-shadow-x:0px;--ui-shadow-y:var(--_tile-lift);--ui-shadow-blur:0px;--ui-shadow-spread:0px;--ui-active-shadow-x:0px;--ui-active-shadow-y:0px;--ui-active-transform:translateY(var(--_tile-lift));--ui-clip:none;--ui-clip-tight:none;--ui-shadow-inset: ;--ui-shadow-edge:initial;--ui-backdrop:none;--ui-bg-alpha:1;font-family:var(--font-rounded,var(--font-default,ui-sans-serif, system-ui, sans-serif))}.chunky-tile :is(.btn,button){letter-spacing:.04em;font-weight:800}
1
+ .chunky-tile{--_tile-lift:var(--tile-lift,4px);--_tile-radius:var(--tile-radius,.75rem);--ui-ink:light-dark(var(--color-neutral-400),var(--color-neutral-600));--ui-radius:var(--_tile-radius);--ui-radius-surface:var(--_tile-radius);--ui-border-width:2px;--ui-border-max:100px;--elevation-color:#000;--ui-shadow-ink:72%;--ui-shadow-x:0px;--ui-shadow-y:var(--_tile-lift);--ui-shadow-blur:0px;--ui-shadow-spread:0px;--ui-active-shadow-x:0px;--ui-active-shadow-y:0px;--ui-active-transform:translateY(var(--_tile-lift));--ui-clip:none;--ui-clip-tight:none;--ui-shadow-inset: ;--ui-shadow-edge:initial;--ui-backdrop:none;--ui-bg-alpha:1;font-family:var(--font-rounded,var(--font-default,ui-sans-serif, system-ui, sans-serif))}.chunky-tile :is(.btn,button){letter-spacing:.04em;font-weight:800}.chunky-tile .btn.icon.dense,.chunky-tile .btn.icon.p-xs{--ui-shadow-y:2px}
package/dist/aesthetics/index.css CHANGED
@@ -1,2 +1,2 @@
1
1
  /*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */
2
- .neobrutalism{--_neo-offset:var(--neo-offset,4px);--ui-ink:light-dark(var(--color-neutral-950),var(--color-neutral-50));--ui-radius:0;--ui-radius-surface:0;--ui-border-width:2px;--ui-border-max:100px;--ui-shadow-ink:100%;--ui-shadow-x:var(--_neo-offset);--ui-shadow-y:var(--_neo-offset);--ui-shadow-blur:0px;--ui-shadow-spread:0px;--ui-active-shadow-x:0px;--ui-active-shadow-y:0px;--ui-active-transform:translate(var(--_neo-offset), var(--_neo-offset));--ui-clip:none;--ui-clip-tight:none;--ui-shadow-inset: ;--ui-shadow-edge:initial;--ui-backdrop:none}.neobrutalism .alert{--_d-elevation:1}.glass{--ui-radius:var(--glass-radius,.75rem);--ui-radius-surface:var(--glass-radius-surface,1rem);--ui-border-width:1px;--ui-border-max:100px;--ui-ink:light-dark(#ffffffa6,#ffffff38);--ui-bg-alpha:.8;--ui-backdrop:blur(14px) saturate(1.6);--ui-shadow-x:0px;--ui-shadow-y:0px;--ui-shadow-blur:0px;--ui-shadow-spread:0px;--ui-surface-ground:var(--color-background)}@supports (color:color-mix(in lab, red, red)){.glass{--ui-surface-ground:color-mix(in srgb, var(--color-background) 45%, transparent)}}.glass{--ui-surface-shadow:0 1px 2px -1px var(--elevation-color), 0 18px 40px -16px var(--elevation-color);--ui-clip:none;--ui-clip-tight:none;--ui-shadow-edge:initial;--ui-hover-transform:none;--ui-active-transform:none}@media (prefers-reduced-transparency:reduce){.glass{--ui-bg-alpha:1;--ui-backdrop:none;--ui-surface-ground:var(--color-background)}}.pixel{--_pixel-unit:var(--pixel-unit,4px);--ui-ink:light-dark(var(--color-neutral-950),var(--color-neutral-50));--ui-radius:0;--ui-radius-surface:0;--ui-border-width:2px;--ui-border-max:0px;--ui-shadow-inset:inset;--ui-shadow-edge: ;--ui-shadow-spread:var(--_pixel-unit);--ui-shadow-x:0px;--ui-shadow-y:0px;--ui-shadow-blur:0px;--ui-focus-inset:calc(var(--_pixel-unit) + var(--focus-ring-width));--ui-clip:polygon(0 var(--_pixel-unit), var(--_pixel-unit) var(--_pixel-unit), var(--_pixel-unit) 0, calc(100% - var(--_pixel-unit)) 0, calc(100% - var(--_pixel-unit)) var(--_pixel-unit), 100% var(--_pixel-unit), 100% calc(100% - var(--_pixel-unit)), calc(100% - var(--_pixel-unit)) calc(100% - var(--_pixel-unit)), calc(100% - var(--_pixel-unit)) 100%, var(--_pixel-unit) 100%, var(--_pixel-unit) calc(100% - var(--_pixel-unit)), 0 calc(100% - var(--_pixel-unit)));--ui-clip-tight:none;--ui-hover-transform:none;--ui-active-transform:none;--ui-backdrop:none;font-family:var(--font-pixel,ui-monospace, SFMono-Regular, Menlo, Consolas, monospace)}.chunky-tile{--_tile-lift:var(--tile-lift,4px);--_tile-radius:var(--tile-radius,.75rem);--ui-ink:light-dark(var(--color-neutral-400),var(--color-neutral-600));--ui-radius:var(--_tile-radius);--ui-radius-surface:var(--_tile-radius);--ui-border-width:2px;--ui-border-max:100px;--elevation-color:#000;--ui-shadow-ink:72%;--ui-shadow-x:0px;--ui-shadow-y:var(--_tile-lift);--ui-shadow-blur:0px;--ui-shadow-spread:0px;--ui-active-shadow-x:0px;--ui-active-shadow-y:0px;--ui-active-transform:translateY(var(--_tile-lift));--ui-clip:none;--ui-clip-tight:none;--ui-shadow-inset: ;--ui-shadow-edge:initial;--ui-backdrop:none;--ui-bg-alpha:1;font-family:var(--font-rounded,var(--font-default,ui-sans-serif, system-ui, sans-serif))}.chunky-tile :is(.btn,button){letter-spacing:.04em;font-weight:800}
2
+ .neobrutalism{--_neo-offset:var(--neo-offset,4px);--ui-ink:light-dark(var(--color-neutral-950),var(--color-neutral-50));--ui-radius:0;--ui-radius-surface:0;--ui-border-width:2px;--ui-border-max:100px;--ui-shadow-ink:100%;--ui-shadow-x:var(--_neo-offset);--ui-shadow-y:var(--_neo-offset);--ui-shadow-blur:0px;--ui-shadow-spread:0px;--ui-active-shadow-x:0px;--ui-active-shadow-y:0px;--ui-active-transform:translate(var(--_neo-offset), var(--_neo-offset));--ui-clip:none;--ui-clip-tight:none;--ui-shadow-inset: ;--ui-shadow-edge:initial;--ui-backdrop:none}.neobrutalism .alert{--_d-elevation:1}.glass{--ui-radius:var(--glass-radius,.75rem);--ui-radius-surface:var(--glass-radius-surface,1rem);--ui-border-width:1px;--ui-border-max:100px;--ui-ink:light-dark(#ffffffa6,#ffffff38);--ui-bg-alpha:.8;--ui-backdrop:blur(14px) saturate(1.6);--ui-shadow-x:0px;--ui-shadow-y:0px;--ui-shadow-blur:0px;--ui-shadow-spread:0px;--ui-surface-ground:var(--color-background)}@supports (color:color-mix(in lab, red, red)){.glass{--ui-surface-ground:color-mix(in srgb, var(--color-background) 45%, transparent)}}.glass{--ui-surface-shadow:0 1px 2px -1px var(--elevation-color), 0 18px 40px -16px var(--elevation-color);--ui-clip:none;--ui-clip-tight:none;--ui-shadow-edge:initial;--ui-hover-transform:none;--ui-active-transform:none}@media (prefers-reduced-transparency:reduce){.glass{--ui-bg-alpha:1;--ui-backdrop:none;--ui-surface-ground:var(--color-background)}}.pixel{--_pixel-unit:var(--pixel-unit,4px);--ui-ink:light-dark(var(--color-neutral-950),var(--color-neutral-50));--ui-radius:0;--ui-radius-surface:0;--ui-border-width:2px;--ui-border-max:0px;--ui-shadow-inset:inset;--ui-shadow-edge: ;--ui-shadow-spread:var(--_pixel-unit);--ui-shadow-x:0px;--ui-shadow-y:0px;--ui-shadow-blur:0px;--ui-focus-inset:calc(var(--_pixel-unit) + var(--focus-ring-width));--ui-clip:polygon(0 var(--_pixel-unit), var(--_pixel-unit) var(--_pixel-unit), var(--_pixel-unit) 0, calc(100% - var(--_pixel-unit)) 0, calc(100% - var(--_pixel-unit)) var(--_pixel-unit), 100% var(--_pixel-unit), 100% calc(100% - var(--_pixel-unit)), calc(100% - var(--_pixel-unit)) calc(100% - var(--_pixel-unit)), calc(100% - var(--_pixel-unit)) 100%, var(--_pixel-unit) 100%, var(--_pixel-unit) calc(100% - var(--_pixel-unit)), 0 calc(100% - var(--_pixel-unit)));--ui-clip-tight:none;--ui-hover-transform:none;--ui-active-transform:none;--ui-backdrop:none;font-family:var(--font-pixel,ui-monospace, SFMono-Regular, Menlo, Consolas, monospace)}.chunky-tile{--_tile-lift:var(--tile-lift,4px);--_tile-radius:var(--tile-radius,.75rem);--ui-ink:light-dark(var(--color-neutral-400),var(--color-neutral-600));--ui-radius:var(--_tile-radius);--ui-radius-surface:var(--_tile-radius);--ui-border-width:2px;--ui-border-max:100px;--elevation-color:#000;--ui-shadow-ink:72%;--ui-shadow-x:0px;--ui-shadow-y:var(--_tile-lift);--ui-shadow-blur:0px;--ui-shadow-spread:0px;--ui-active-shadow-x:0px;--ui-active-shadow-y:0px;--ui-active-transform:translateY(var(--_tile-lift));--ui-clip:none;--ui-clip-tight:none;--ui-shadow-inset: ;--ui-shadow-edge:initial;--ui-backdrop:none;--ui-bg-alpha:1;font-family:var(--font-rounded,var(--font-default,ui-sans-serif, system-ui, sans-serif))}.chunky-tile :is(.btn,button){letter-spacing:.04em;font-weight:800}.chunky-tile .btn.icon.dense,.chunky-tile .btn.icon.p-xs{--ui-shadow-y:2px}